{
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
"name": "combobox",
"title": "Combobox",
"dependencies": [
"@base-ui/react",
"lucide-react"
],
"registryDependencies": [
"@fab-ui/button",
"@fab-ui/input-group"
],
"files": [
{
"path": "registry/default/ui/combobox.tsx",
"content": "'use client';\n\nimport * as React from 'react';\n\nimport { Button } from '@/registry/default/ui/button';\nimport {\n InputGroup,\n InputGroupAddon,\n InputGroupButton,\n InputGroupInput,\n} from '@/registry/default/ui/input-group';\nimport { Combobox as ComboboxPrimitive } from '@base-ui/react/combobox';\nimport { CheckIcon, ChevronDownIcon, XIcon } from 'lucide-react';\n\nimport { cn } from '@/lib/utils';\n\nconst Combobox = ComboboxPrimitive.Root;\n\nfunction ComboboxValue({ ...props }: ComboboxPrimitive.Value.Props) {\n return ;\n}\n\nfunction ComboboxTrigger({\n className,\n children,\n ...props\n}: ComboboxPrimitive.Trigger.Props) {\n return (\n \n {children}\n \n \n );\n}\n\nfunction ComboboxClear({ className, ...props }: ComboboxPrimitive.Clear.Props) {\n return (\n \n \n \n }\n />\n );\n}\n\nfunction ComboboxInput({\n className,\n children,\n disabled = false,\n showTrigger = true,\n showClear = false,\n ...props\n}: ComboboxPrimitive.Input.Props & {\n showTrigger?: boolean;\n showClear?: boolean;\n}) {\n return (\n \n }\n {...props}\n />\n \n {showTrigger && (\n }\n data-slot='input-group-button'\n className='group-has-data-[slot=combobox-clear]/input-group:hidden data-pressed:bg-transparent'\n disabled={disabled}\n />\n )}\n {showClear && }\n \n {children}\n \n );\n}\n\nfunction ComboboxContent({\n className,\n side = 'bottom',\n sideOffset = 6,\n align = 'start',\n alignOffset = 0,\n anchor,\n ...props\n}: ComboboxPrimitive.Popup.Props &\n Pick<\n ComboboxPrimitive.Positioner.Props,\n 'side' | 'align' | 'sideOffset' | 'alignOffset' | 'anchor'\n >) {\n return (\n \n \n \n \n \n );\n}\n\nfunction ComboboxList({ className, ...props }: ComboboxPrimitive.List.Props) {\n return (\n \n );\n}\n\nfunction ComboboxItem({\n className,\n children,\n ...props\n}: ComboboxPrimitive.Item.Props) {\n return (\n \n {children}\n \n \n \n }\n />\n \n );\n}\n\nfunction ComboboxGroup({ className, ...props }: ComboboxPrimitive.Group.Props) {\n return (\n \n );\n}\n\nfunction ComboboxLabel({\n className,\n ...props\n}: ComboboxPrimitive.GroupLabel.Props) {\n return (\n \n );\n}\n\nfunction ComboboxCollection({ ...props }: ComboboxPrimitive.Collection.Props) {\n return (\n \n );\n}\n\nfunction ComboboxEmpty({ className, ...props }: ComboboxPrimitive.Empty.Props) {\n return (\n \n );\n}\n\nfunction ComboboxSeparator({\n className,\n ...props\n}: ComboboxPrimitive.Separator.Props) {\n return (\n \n );\n}\n\nfunction ComboboxChips({\n className,\n ...props\n}: React.ComponentPropsWithRef &\n ComboboxPrimitive.Chips.Props) {\n return (\n \n );\n}\n\nfunction ComboboxChip({\n className,\n children,\n showRemove = true,\n ...props\n}: ComboboxPrimitive.Chip.Props & {\n showRemove?: boolean;\n}) {\n return (\n \n {children}\n {showRemove && (\n \n \n \n }\n />\n )}\n \n );\n}\n\nfunction ComboboxChipsInput({\n className,\n ...props\n}: ComboboxPrimitive.Input.Props) {\n return (\n \n );\n}\n\nfunction useComboboxAnchor() {\n return React.useRef(null);\n}\n\nexport {\n Combobox,\n ComboboxInput,\n ComboboxContent,\n ComboboxList,\n ComboboxItem,\n ComboboxGroup,\n ComboboxLabel,\n ComboboxCollection,\n ComboboxEmpty,\n ComboboxSeparator,\n ComboboxChips,\n ComboboxChip,\n ComboboxChipsInput,\n ComboboxTrigger,\n ComboboxValue,\n useComboboxAnchor,\n};\n",
"type": "registry:ui"
}
],
"type": "registry:ui"
}