{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "combobox",
  "title": "Combobox",
  "description": "A searchable selection control with filtering, empty state, and complete keyboard navigation.",
  "dependencies": [
    "@base-ui/react",
    "lucide-react"
  ],
  "files": [
    {
      "path": "registry/rivetui/components/combobox/combobox.tsx",
      "content": "\"use client\";\n\nimport { Combobox as ComboboxPrimitive } from \"@base-ui/react/combobox\";\nimport { Check, ChevronDown, X } from \"lucide-react\";\nimport type * as React from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\nfunction Combobox<Value, Multiple extends boolean | undefined = false, Item = Value>(\n  props: ComboboxPrimitive.Root.Props<Value, Multiple, Item>,\n) {\n  return <ComboboxPrimitive.Root {...props} />;\n}\n\nfunction ComboboxLabel({ children, className, htmlFor, ...props }: React.ComponentProps<\"label\">) {\n  return (\n    <label\n      htmlFor={htmlFor}\n      data-slot=\"combobox-label\"\n      className={cn(\n        \"mb-2 block w-fit font-mono text-[0.6875rem] font-medium uppercase leading-none tracking-[0.14em] text-foreground\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </label>\n  );\n}\n\nfunction ComboboxInputGroup({ className, ...props }: ComboboxPrimitive.InputGroup.Props) {\n  return (\n    <ComboboxPrimitive.InputGroup\n      data-slot=\"combobox-input-group\"\n      className={cn(\"relative w-full\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction ComboboxInput({ className, ...props }: ComboboxPrimitive.Input.Props) {\n  return (\n    <ComboboxPrimitive.Input\n      data-slot=\"combobox-input\"\n      className={cn(\n        \"h-10 w-full rounded-none border border-input bg-background px-3 pr-16 text-sm outline-none transition-[border-color,box-shadow,color,opacity] duration-100 placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/40 disabled:cursor-not-allowed disabled:bg-muted disabled:text-muted-foreground disabled:opacity-60 aria-invalid:border-destructive aria-invalid:focus-visible:border-destructive aria-invalid:focus-visible:ring-destructive/25 motion-reduce:transition-none\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ComboboxTrigger({ className, children, ...props }: ComboboxPrimitive.Trigger.Props) {\n  return (\n    <ComboboxPrimitive.Trigger\n      data-slot=\"combobox-trigger\"\n      className={cn(\n        \"absolute top-px right-px grid size-[2.375rem] cursor-pointer place-items-center text-muted-foreground outline-none transition-colors hover:text-foreground focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring/40 disabled:pointer-events-none disabled:opacity-50 motion-reduce:transition-none\",\n        className,\n      )}\n      {...props}\n    >\n      {children ?? <ChevronDown className=\"size-4\" aria-hidden=\"true\" />}\n    </ComboboxPrimitive.Trigger>\n  );\n}\n\nfunction ComboboxClear({ className, children, ...props }: ComboboxPrimitive.Clear.Props) {\n  return (\n    <ComboboxPrimitive.Clear\n      data-slot=\"combobox-clear\"\n      className={cn(\n        \"absolute top-px right-10 grid size-[2.375rem] cursor-pointer place-items-center text-muted-foreground outline-none transition-colors hover:text-foreground focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring/40 disabled:pointer-events-none disabled:opacity-50 motion-reduce:transition-none\",\n        className,\n      )}\n      {...props}\n    >\n      {children ?? <X className=\"size-3.5\" aria-hidden=\"true\" />}\n    </ComboboxPrimitive.Clear>\n  );\n}\n\nfunction ComboboxContent({\n  className,\n  children,\n  align = \"start\",\n  side = \"bottom\",\n  sideOffset = 4,\n  ...props\n}: ComboboxPrimitive.Popup.Props &\n  Pick<ComboboxPrimitive.Positioner.Props, \"align\" | \"side\" | \"sideOffset\">) {\n  return (\n    <ComboboxPrimitive.Portal>\n      <ComboboxPrimitive.Positioner\n        data-slot=\"combobox-positioner\"\n        align={align}\n        side={side}\n        sideOffset={sideOffset}\n        className=\"isolate z-50\"\n      >\n        <ComboboxPrimitive.Popup\n          data-slot=\"combobox-content\"\n          className={cn(\n            \"max-h-[min(20rem,var(--available-height))] w-(--anchor-width) min-w-48 overflow-hidden rounded-none border border-border bg-popover text-popover-foreground outline-none\",\n            className,\n          )}\n          {...props}\n        >\n          {children}\n        </ComboboxPrimitive.Popup>\n      </ComboboxPrimitive.Positioner>\n    </ComboboxPrimitive.Portal>\n  );\n}\n\nfunction ComboboxList({ className, ...props }: ComboboxPrimitive.List.Props) {\n  return (\n    <ComboboxPrimitive.List\n      data-slot=\"combobox-list\"\n      className={cn(\"max-h-[min(20rem,var(--available-height))] overflow-y-auto p-1\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction ComboboxEmpty({ className, ...props }: ComboboxPrimitive.Empty.Props) {\n  return (\n    <ComboboxPrimitive.Empty\n      data-slot=\"combobox-empty\"\n      className={cn(\"px-3 py-8 text-center text-sm text-muted-foreground empty:hidden\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction ComboboxGroup({ className, ...props }: ComboboxPrimitive.Group.Props) {\n  return (\n    <ComboboxPrimitive.Group\n      data-slot=\"combobox-group\"\n      className={cn(\"py-1\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction ComboboxGroupLabel({ className, ...props }: ComboboxPrimitive.GroupLabel.Props) {\n  return (\n    <ComboboxPrimitive.GroupLabel\n      data-slot=\"combobox-group-label\"\n      className={cn(\n        \"px-3 py-2 font-mono text-[0.625rem] uppercase tracking-[0.14em] text-muted-foreground\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ComboboxItem({ className, children, ...props }: ComboboxPrimitive.Item.Props) {\n  return (\n    <ComboboxPrimitive.Item\n      data-slot=\"combobox-item\"\n      className={cn(\n        \"relative flex min-h-9 w-full cursor-default select-none items-center gap-2 px-3 py-2 pr-9 text-sm outline-none data-disabled:pointer-events-none data-disabled:opacity-40 data-highlighted:bg-accent data-highlighted:text-accent-foreground data-selected:font-medium\",\n        className,\n      )}\n      {...props}\n    >\n      <span className=\"min-w-0 flex-1 truncate\">{children}</span>\n      <ComboboxPrimitive.ItemIndicator\n        data-slot=\"combobox-item-indicator\"\n        className=\"absolute right-3 grid size-4 place-items-center\"\n      >\n        <Check className=\"size-3.5\" strokeWidth={2.5} aria-hidden=\"true\" />\n      </ComboboxPrimitive.ItemIndicator>\n    </ComboboxPrimitive.Item>\n  );\n}\n\nfunction ComboboxSeparator({ className, ...props }: ComboboxPrimitive.Separator.Props) {\n  return (\n    <ComboboxPrimitive.Separator\n      data-slot=\"combobox-separator\"\n      className={cn(\"mx-1 my-1 h-px bg-border\", className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Combobox,\n  ComboboxClear,\n  ComboboxContent,\n  ComboboxEmpty,\n  ComboboxGroup,\n  ComboboxGroupLabel,\n  ComboboxInput,\n  ComboboxInputGroup,\n  ComboboxItem,\n  ComboboxLabel,\n  ComboboxList,\n  ComboboxSeparator,\n  ComboboxTrigger,\n};\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}