first test

frontend/src/components/ui/select-simple.tsx

@@ -0,0 +1,79 @@
+import { ChevronDown } from 'lucide-solid';
+
+import { cn } from '@/lib/utils';
+
+export interface SelectProps {
+  value?: string;
+  onValueChange?: (value: string) => void;
+  children?: any;
+  class?: string;
+}
+
+export function Select(props: SelectProps) {
+  return props.children;
+}
+
+export interface SelectTriggerProps {
+  children?: any;
+  class?: string;
+}
+
+export function SelectTrigger(props: SelectTriggerProps) {
+  return (
+    <div class={cn(
+      "flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+      props.class
+    )}>
+      {props.children}
+      <ChevronDown class="h-4 w-4 opacity-50" />
+    </div>
+  );
+}
+
+export interface SelectValueProps {
+  placeholder?: string;
+  value?: string;
+}
+
+export function SelectValue(props: SelectValueProps) {
+  return <span>{props.value || props.placeholder}</span>;
+}
+
+export interface SelectContentProps {
+  children?: any;
+  class?: string;
+}
+
+export function SelectContent(props: SelectContentProps) {
+  return (
+    <div class={cn(
+      "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md",
+      props.class
+    )}>
+      <div class="p-1">
+        {props.children}
+      </div>
+    </div>
+  );
+}
+
+export interface SelectItemProps {
+  value: string;
+  children: any;
+  onClick?: (value: string) => void;
+  class?: string;
+}
+
+export function SelectItem(props: SelectItemProps) {
+  return (
+    <div
+      class={cn(
+        "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground hover:bg-accent cursor-pointer",
+        props.class
+      )}
+      onClick={() => props.onClick?.(props.value)}
+    >
+      {props.children}
+    </div>
+  );
+}