{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "select",
  "type": "registry:ui",
  "dependencies": ["@ark-ui/react", "lucide-react"],
  "files": [
    {
      "path": "./src/components/ui/select.tsx",
      "content": "\"use client\"\n\nimport * as React from \"react\"\n\nimport { type HTMLArkProps, ark } from \"@ark-ui/react/factory\"\nimport { Portal } from \"@ark-ui/react/portal\"\nimport { Select as SelectPrimitive, selectAnatomy } from \"@ark-ui/react/select\"\nimport { CheckIcon, ChevronDownIcon } from \"lucide-react\"\n\nimport { cn } from \"@/lib/utils\"\n\nconst parts = selectAnatomy.extendWith(\"separator\").build()\n\nconst SelectComponent = React.forwardRef(\n  <T extends SelectPrimitive.CollectionItem>(\n    props: SelectPrimitive.RootProps<T>,\n    ref: React.Ref<HTMLDivElement>\n  ) => <SelectPrimitive.Root ref={ref} {...props} />\n)\nSelectComponent.displayName = \"Select\"\nconst Select = SelectComponent as <T extends SelectPrimitive.CollectionItem>(\n  props: SelectPrimitive.RootProps<T> &\n    React.RefAttributes<React.ElementRef<typeof SelectPrimitive.Root>>\n) => React.JSX.Element\n\nconst SelectClearTrigger = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.ClearTrigger>,\n  SelectPrimitive.ClearTriggerProps\n>(({ className, ...props }, ref) => (\n  <SelectPrimitive.ClearTrigger\n    ref={ref}\n    className={cn(\n      \"absolute end-0 top-0 flex size-9 items-center justify-center rounded-md border border-transparent text-muted-foreground/80 outline-none transition-[color,box-shadow] hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50\",\n      className\n    )}\n    {...props}\n  />\n))\nSelectClearTrigger.displayName = \"SelectClearTrigger\"\n\nconst SelectContent = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.Content>,\n  SelectPrimitive.ContentProps\n>(({ className, ...props }, ref) => (\n  <Portal>\n    <SelectPrimitive.Positioner>\n      <SelectPrimitive.Content\n        ref={ref}\n        className={cn(\n          \"relative w-full min-w-32 overflow-hidden rounded-md border border-input bg-popover p-1 text-popover-foreground shadow-lg\",\n          \"data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=closed]:animate-out data-[state=open]:animate-in\",\n          \"data-[placement=bottom]:slide-in-from-top-2 data-[placement=left]:slide-in-from-right-2 data-[placement=left]:-translate-x-1 data-[placement=right]:slide-in-from-left-2 data-[placement=top]:slide-in-from-bottom-2 data-[placement=top]:-translate-y-1 data-[placement=right]:translate-x-1 data-[placement=bottom]:translate-y-1\",\n          className\n        )}\n        {...props}\n      />\n    </SelectPrimitive.Positioner>\n  </Portal>\n))\nSelectContent.displayName = \"SelectContent\"\n\nconst SelectContext = SelectPrimitive.Context\n\nconst SelectControl = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.Control>,\n  SelectPrimitive.ControlProps\n>(({ className, ...props }, ref) => (\n  <SelectPrimitive.Control\n    ref={ref}\n    className={cn(\n      \"relative flex min-h-[38px] rounded-md border border-input text-sm outline-none transition-[color,box-shadow] focus-within:border-ring focus-within:ring-[3px] focus-within:ring-ring/50 has-aria-invalid:border-destructive has-aria-invalid:ring-destructive/20 dark:has-aria-invalid:ring-destructive/40\",\n      className\n    )}\n    {...props}\n  />\n))\nSelectControl.displayName = \"SelectControl\"\n\nconst SelectIndicator = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.Indicator>,\n  SelectPrimitive.IndicatorProps\n>((props, ref) => (\n  <SelectPrimitive.Indicator ref={ref} {...props}>\n    <ChevronDownIcon className=\"size-4 shrink-0 in-aria-invalid:text-destructive/80 text-muted-foreground/80\" />\n  </SelectPrimitive.Indicator>\n))\nSelectIndicator.displayName = \"SelectIndicator\"\n\nconst SelectItem = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.Item>,\n  SelectPrimitive.ItemProps\n>(({ className, children, ...props }, ref) => (\n  <SelectPrimitive.Item\n    ref={ref}\n    className={cn(\n      \"relative flex w-full cursor-default select-none items-center rounded py-1.5 ps-8 pe-2 text-sm outline-hidden data-[disabled]:pointer-events-none data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:opacity-50\",\n      className\n    )}\n    {...props}\n  >\n    <span className=\"absolute start-2 flex size-3.5 items-center justify-center\">\n      <SelectPrimitive.ItemIndicator>\n        <CheckIcon size={16} />\n      </SelectPrimitive.ItemIndicator>\n    </span>\n    <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n  </SelectPrimitive.Item>\n))\nSelectItem.displayName = \"SelectItem\"\n\nconst SelectItemContext = SelectPrimitive.ItemContext\n\nconst SelectItemGroup = SelectPrimitive.ItemGroup\n\nconst SelectItemGroupLabel = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.ItemGroupLabel>,\n  SelectPrimitive.ItemGroupLabelProps\n>(({ className, ...props }, ref) => (\n  <SelectPrimitive.ItemGroupLabel\n    ref={ref}\n    className={cn(\n      \"py-1.5 ps-8 pe-2 font-medium text-muted-foreground text-xs\",\n      className\n    )}\n    {...props}\n  />\n))\nSelectItemGroupLabel.displayName = \"SelectItemGroupLabel\"\n\nconst SelectItemText = SelectPrimitive.ItemText\n\nconst SelectLabel = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.Label>,\n  SelectPrimitive.LabelProps\n>(({ className, ...props }, ref) => (\n  <SelectPrimitive.Label\n    ref={ref}\n    className={cn(\n      \"select-none font-medium text-foreground text-sm leading-4 data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50\",\n      className\n    )}\n    {...props}\n  />\n))\nSelectLabel.displayName = \"SelectLabel\"\n\nconst SelectList = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.List>,\n  SelectPrimitive.ListProps\n>(({ className, ...props }, ref) => (\n  <SelectPrimitive.List\n    ref={ref}\n    className={cn(\n      \"max-h-[min(24rem,var(--available-height))] overflow-y-auto\",\n      className\n    )}\n    {...props}\n  />\n))\nSelectList.displayName = \"SelectList\"\n\nconst SelectRootProvider = SelectPrimitive.RootProvider\n\nconst SelectSeparator = React.forwardRef<HTMLHRElement, HTMLArkProps<\"hr\">>(\n  ({ className, ...props }, ref) => (\n    <ark.hr\n      ref={ref}\n      {...parts.separator.attrs}\n      className={cn(\"-mx-1 my-1 h-px bg-border\", className)}\n      {...props}\n    />\n  )\n)\nSelectSeparator.displayName = \"SelectSeparator\"\n\nconst SelectTrigger = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.Trigger>,\n  SelectPrimitive.TriggerProps\n>(({ className, ...props }, ref) => (\n  <SelectPrimitive.Trigger\n    ref={ref}\n    className={cn(\n      \"flex flex-1 items-center justify-between gap-1 bg-transparent px-3 py-2 outline-none outline-hidden placeholder:text-muted-foreground/70 has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 data-[placeholder-shown]:text-muted-foreground\",\n      className\n    )}\n    {...props}\n  />\n))\nSelectTrigger.displayName = \"SelectTrigger\"\n\nconst SelectValueText = SelectPrimitive.ValueText\n\nexport {\n  Select,\n  SelectClearTrigger,\n  SelectContent,\n  SelectContext,\n  SelectControl,\n  SelectIndicator,\n  SelectItem,\n  SelectItemContext,\n  SelectItemGroup,\n  SelectItemGroupLabel,\n  SelectItemText,\n  SelectLabel,\n  SelectList,\n  SelectRootProvider,\n  SelectSeparator,\n  SelectTrigger,\n  SelectValueText,\n}\n\nexport {\n  createListCollection,\n  useSelect,\n  type CollectionItem,\n  type ListCollection,\n  type SelectHighlightChangeDetails,\n  type SelectOpenChangeDetails,\n  type SelectValueChangeDetails,\n} from \"@ark-ui/react/select\"\n",
      "type": "registry:ui"
    }
  ]
}