{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "combobox",
  "type": "registry:ui",
  "dependencies": ["@ark-ui/react", "lucide-react"],
  "files": [
    {
      "path": "./src/components/ui/combobox.tsx",
      "content": "\"use client\"\n\nimport * as React from \"react\"\n\nimport { Combobox as ComboboxPrimitive } from \"@ark-ui/react/combobox\"\nimport { Portal } from \"@ark-ui/react/portal\"\nimport { CheckIcon, ChevronsUpDownIcon } from \"lucide-react\"\n\nimport { cn } from \"@/lib/utils\"\n\nconst ComboboxComponent = React.forwardRef(\n  <T extends ComboboxPrimitive.CollectionItem>(\n    props: ComboboxPrimitive.RootProps<T>,\n    ref: React.Ref<HTMLDivElement>\n  ) => <ComboboxPrimitive.Root ref={ref} {...props} />\n)\nComboboxComponent.displayName = \"Combobox\"\nconst Combobox = ComboboxComponent as <\n  T extends ComboboxPrimitive.CollectionItem,\n>(\n  props: ComboboxPrimitive.RootProps<T> &\n    React.RefAttributes<React.ElementRef<typeof ComboboxPrimitive.Root>>\n) => React.JSX.Element\n\nconst ComboboxClearTrigger = React.forwardRef<\n  React.ElementRef<typeof ComboboxPrimitive.ClearTrigger>,\n  ComboboxPrimitive.ClearTriggerProps\n>(({ className, ...props }, ref) => (\n  <ComboboxPrimitive.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))\nComboboxClearTrigger.displayName = \"ComboboxClearTrigger\"\n\nconst ComboboxContent = React.forwardRef<\n  React.ElementRef<typeof ComboboxPrimitive.Content>,\n  ComboboxPrimitive.ContentProps\n>(({ className, ...props }, ref) => (\n  <Portal>\n    <ComboboxPrimitive.Positioner>\n      <ComboboxPrimitive.Content\n        ref={ref}\n        className={cn(\n          \"data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[placement=bottom]:slide-in-from-top-2 data-[placement=left]:slide-in-from-right-2 data-[placement=right]:slide-in-from-left-2 data-[placement=top]:slide-in-from-bottom-2 data-[placement=left]:-translate-x-1 data-[placement=top]:-translate-y-1 relative z-50 max-h-[min(24rem,var(--available-height))] w-full min-w-32 overflow-hidden rounded-md border border-input bg-popover text-popover-foreground shadow-lg data-[placement=right]:translate-x-1 data-[placement=bottom]:translate-y-1 data-[state=closed]:animate-out data-[state=open]:animate-in\",\n          className\n        )}\n        {...props}\n      />\n    </ComboboxPrimitive.Positioner>\n  </Portal>\n))\nComboboxContent.displayName = \"ComboboxContent\"\n\nconst ComboboxContext = ComboboxPrimitive.Context\n\nconst ComboboxControl = React.forwardRef<\n  React.ElementRef<typeof ComboboxPrimitive.Control>,\n  ComboboxPrimitive.ControlProps\n>(({ className, ...props }, ref) => (\n  <ComboboxPrimitive.Control\n    ref={ref}\n    className={cn(\n      \"relative flex min-h-[38px] rounded-md border border-input px-3 py-2 text-sm outline-none transition-[color,box-shadow] focus-within:border-ring focus-within:ring-[3px] focus-within:ring-ring/50 has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-aria-invalid:border-destructive has-disabled:opacity-50 has-aria-invalid:ring-destructive/20 dark:has-aria-invalid:ring-destructive/40\",\n      className\n    )}\n    {...props}\n  />\n))\nComboboxControl.displayName = \"ComboboxControl\"\n\nconst ComboboxInput = React.forwardRef<\n  React.ElementRef<typeof ComboboxPrimitive.Input>,\n  ComboboxPrimitive.InputProps\n>(({ className, ...props }, ref) => (\n  <ComboboxPrimitive.Input\n    ref={ref}\n    className={cn(\n      \"flex-1 bg-transparent outline-none outline-hidden placeholder:text-muted-foreground/70 disabled:cursor-not-allowed\",\n      className\n    )}\n    {...props}\n  />\n))\nComboboxInput.displayName = \"ComboboxInput\"\n\nconst ComboboxItem = React.forwardRef<\n  React.ElementRef<typeof ComboboxPrimitive.Item>,\n  ComboboxPrimitive.ItemProps\n>(({ className, children, ...props }, ref) => (\n  <ComboboxPrimitive.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      <ComboboxPrimitive.ItemIndicator>\n        <CheckIcon size={16} />\n      </ComboboxPrimitive.ItemIndicator>\n    </span>\n    <ComboboxPrimitive.ItemText>{children}</ComboboxPrimitive.ItemText>\n  </ComboboxPrimitive.Item>\n))\nComboboxItem.displayName = \"ComboboxItem\"\n\nconst ComboboxItemContext = ComboboxPrimitive.ItemContext\n\nconst ComboboxItemGroup = React.forwardRef<\n  React.ElementRef<typeof ComboboxPrimitive.ItemGroup>,\n  ComboboxPrimitive.ItemGroupProps\n>(({ className, ...props }, ref) => (\n  <ComboboxPrimitive.ItemGroup\n    ref={ref}\n    className={cn(\"overflow-hidden p-1 text-foreground\", className)}\n    {...props}\n  />\n))\nComboboxItemGroup.displayName = \"ComboboxItemGroup\"\n\nconst ComboboxItemGroupLabel = React.forwardRef<\n  React.ElementRef<typeof ComboboxPrimitive.ItemGroupLabel>,\n  ComboboxPrimitive.ItemGroupLabelProps\n>(({ className, ...props }, ref) => (\n  <ComboboxPrimitive.ItemGroupLabel\n    ref={ref}\n    className={cn(\n      \"px-2 py-1.5 font-medium text-muted-foreground text-xs\",\n      className\n    )}\n    {...props}\n  />\n))\nComboboxItemGroupLabel.displayName = \"ComboboxItemGroupLabel\"\n\nconst ComboboxItemText = ComboboxPrimitive.ItemText\n\nconst ComboboxLabel = React.forwardRef<\n  React.ElementRef<typeof ComboboxPrimitive.Label>,\n  ComboboxPrimitive.LabelProps\n>(({ className, ...props }, ref) => (\n  <ComboboxPrimitive.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))\nComboboxLabel.displayName = \"ComboboxLabel\"\n\nconst ComboboxList = ComboboxPrimitive.List\n\nconst ComboboxTrigger = React.forwardRef<\n  React.ElementRef<typeof ComboboxPrimitive.Trigger>,\n  ComboboxPrimitive.TriggerProps\n>(({ className, ...props }, ref) => (\n  <ComboboxPrimitive.Trigger ref={ref} className={cn(className)} {...props}>\n    <ChevronsUpDownIcon className=\"size-4 shrink-0 in-aria-invalid:text-destructive/80 text-muted-foreground/80\" />\n  </ComboboxPrimitive.Trigger>\n))\nComboboxTrigger.displayName = \"ComboboxTrigger\"\n\nexport {\n  Combobox,\n  ComboboxClearTrigger,\n  ComboboxContent,\n  ComboboxContext,\n  ComboboxControl,\n  ComboboxInput,\n  ComboboxItem,\n  ComboboxItemContext,\n  ComboboxItemGroup,\n  ComboboxItemGroupLabel,\n  ComboboxItemText,\n  ComboboxLabel,\n  ComboboxList,\n  ComboboxTrigger,\n}\n\nexport {\n  createListCollection,\n  useCombobox,\n  type CollectionItem,\n  type ComboboxHighlightChangeDetails,\n  type ComboboxInputValueChangeDetails,\n  type ComboboxOpenChangeDetails,\n  type ComboboxValueChangeDetails,\n  type ListCollection,\n} from \"@ark-ui/react/combobox\"\n",
      "type": "registry:ui"
    }
  ]
}