+ "content": "import type { JSX, ValidComponent } from \"solid-js\"\nimport { splitProps } from \"solid-js\"\n\nimport type { PolymorphicProps } from \"@kobalte/core/polymorphic\"\nimport * as SelectPrimitive from \"@kobalte/core/select\"\nimport { cva } from \"class-variance-authority\"\n\nimport { cn } from \"~/lib/utils\"\n\nconst Select = SelectPrimitive.Root\nconst SelectValue = SelectPrimitive.Value\nconst SelectHiddenSelect = SelectPrimitive.HiddenSelect\n\ntype SelectTriggerProps<T extends ValidComponent = \"button\"> =\n SelectPrimitive.SelectTriggerProps<T> & {\n class?: string | undefined\n children?: JSX.Element\n }\n\nconst SelectTrigger = <T extends ValidComponent = \"button\">(\n props: PolymorphicProps<T, SelectTriggerProps<T>>\n) => {\n const [local, others] = splitProps(props as SelectTriggerProps, [\"class\", \"children\"])\n return (\n <SelectPrimitive.Trigger\n class={cn(\n \"flex h-10 w-full items-center justify-between rounded-md border border-input bg-transparent 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\",\n local.class\n )}\n {...others}\n >\n {local.children}\n <SelectPrimitive.Icon\n as=\"svg\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"size-4 opacity-50\"\n >\n <path d=\"M8 9l4 -4l4 4\" />\n <path d=\"M16 15l-4 4l-4 -4\" />\n </SelectPrimitive.Icon>\n </SelectPrimitive.Trigger>\n )\n}\n\ntype SelectContentProps<T extends ValidComponent = \"div\"> =\n SelectPrimitive.SelectContentProps<T> & { class?: string | undefined }\n\nconst SelectContent = <T extends ValidComponent = \"div\">(\n props: PolymorphicProps<T, SelectContentProps<T>>\n) => {\n const [local, others] = splitProps(props as SelectContentProps, [\"class\"])\n return (\n <SelectPrimitive.Portal>\n <SelectPrimitive.Content\n class={cn(\n \"relative z-50 min-w-32 overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md animate-in fade-in-80\",\n local.class\n )}\n {...others}\n >\n <SelectPrimitive.Listbox class=\"m-0 p-1\" />\n </SelectPrimitive.Content>\n </SelectPrimitive.Portal>\n )\n}\n\ntype SelectItemProps<T extends ValidComponent = \"li\"> = SelectPrimitive.SelectItemProps<T> & {\n class?: string | undefined\n children?: JSX.Element\n}\n\nconst SelectItem = <T extends ValidComponent = \"li\">(\n props: PolymorphicProps<T, SelectItemProps<T>>\n) => {\n const [local, others] = splitProps(props as SelectItemProps, [\"class\", \"children\"])\n return (\n <SelectPrimitive.Item\n class={cn(\n \"relative mt-0 flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n local.class\n )}\n {...others}\n >\n <SelectPrimitive.ItemIndicator class=\"absolute right-2 flex size-3.5 items-center justify-center\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"size-4\"\n >\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path d=\"M5 12l5 5l10 -10\" />\n </svg>\n </SelectPrimitive.ItemIndicator>\n <SelectPrimitive.ItemLabel>{local.children}</SelectPrimitive.ItemLabel>\n </SelectPrimitive.Item>\n )\n}\n\nconst labelVariants = cva(\n \"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70\",\n {\n variants: {\n variant: {\n label: \"data-[invalid]:text-destructive\",\n description: \"font-normal text-muted-foreground\",\n error: \"text-xs text-destructive\"\n }\n },\n defaultVariants: {\n variant: \"label\"\n }\n }\n)\n\ntype SelectLabelProps<T extends ValidComponent = \"label\"> = SelectPrimitive.SelectLabelProps<T> & {\n class?: string | undefined\n}\n\nconst SelectLabel = <T extends ValidComponent = \"label\">(\n props: PolymorphicProps<T, SelectLabelProps<T>>\n) => {\n const [local, others] = splitProps(props as SelectLabelProps, [\"class\"])\n return <SelectPrimitive.Label class={cn(labelVariants(), local.class)} {...others} />\n}\n\ntype SelectDescriptionProps<T extends ValidComponent = \"div\"> =\n SelectPrimitive.SelectDescriptionProps<T> & {\n class?: string | undefined\n }\n\nconst SelectDescription = <T extends ValidComponent = \"div\">(\n props: PolymorphicProps<T, SelectDescriptionProps<T>>\n) => {\n const [local, others] = splitProps(props as SelectDescriptionProps, [\"class\"])\n return (\n <SelectPrimitive.Description\n class={cn(labelVariants({ variant: \"description\" }), local.class)}\n {...others}\n />\n )\n}\n\ntype SelectErrorMessageProps<T extends ValidComponent = \"div\"> =\n SelectPrimitive.SelectErrorMessageProps<T> & {\n class?: string | undefined\n }\n\nconst SelectErrorMessage = <T extends ValidComponent = \"div\">(\n props: PolymorphicProps<T, SelectErrorMessageProps<T>>\n) => {\n const [local, others] = splitProps(props as SelectErrorMessageProps, [\"class\"])\n return (\n <SelectPrimitive.ErrorMessage\n class={cn(labelVariants({ variant: \"error\" }), local.class)}\n {...others}\n />\n )\n}\n\nexport {\n Select,\n SelectValue,\n SelectHiddenSelect,\n SelectTrigger,\n SelectContent,\n SelectItem,\n SelectLabel,\n SelectDescription,\n SelectErrorMessage\n}\n"
0 commit comments