{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "combobox",
  "title": "TIS Combobox",
  "author": "TIS Experience Engineering",
  "description": "Combobox React com filtro, seleção e teclado por Base UI, preservando a anatomia pública do DS TIS.",
  "dependencies": [
    "@base-ui/react@1.6.0",
    "clsx@2.1.1",
    "lucide-react@1.28.0",
    "tailwind-merge@3.6.0",
    "ds-tis@github:tis-experience/ds-tis#dd4c906943847cb7664a72a0c7637a378b39adcc"
  ],
  "files": [
    {
      "path": "registry/tis/combobox.tsx",
      "content": "import * as React from \"react\"\nimport { Combobox as ComboboxPrimitive } from \"@base-ui/react/combobox\"\nimport { ChevronDownIcon, SearchIcon, XIcon } from \"lucide-react\"\n\nimport { cn } from \"./tis-utils\"\n\ntype ComboboxSize = \"sm\" | \"md\" | \"lg\"\n\nfunction Combobox<Value, Multiple extends boolean | undefined = false>(\n  props: ComboboxPrimitive.Root.Props<Value, Multiple>,\n) {\n  return <ComboboxPrimitive.Root {...props} />\n}\n\nfunction ComboboxField({\n  className,\n  disabled = false,\n  invalid = false,\n  ...props\n}: React.ComponentProps<\"div\"> & { disabled?: boolean; invalid?: boolean }) {\n  return (\n    <div\n      className={cn(\n        \"ds-field\",\n        invalid && \"ds-field--error\",\n        disabled && \"ds-tis-combobox-field--disabled\",\n        className,\n      )}\n      data-disabled={disabled || undefined}\n      data-invalid={invalid || undefined}\n      data-slot=\"combobox-field\"\n      {...props}\n    />\n  )\n}\n\nfunction ComboboxLabel({ className, ...props }: React.ComponentProps<\"label\">) {\n  return <label className={cn(\"ds-field__label\", className)} data-slot=\"combobox-label\" {...props} />\n}\n\nfunction ComboboxAnchor({ className, ...props }: React.ComponentProps<\"div\">) {\n  return <div className={cn(\"ds-combobox-anchor\", className)} data-slot=\"combobox-anchor\" {...props} />\n}\n\nfunction ComboboxControl({\n  className,\n  filled = false,\n  invalid = false,\n  size = \"md\",\n  ...props\n}: Omit<ComboboxPrimitive.InputGroup.Props, \"className\"> & {\n  className?: string\n  filled?: boolean\n  invalid?: boolean\n  size?: ComboboxSize\n}) {\n  return (\n    <ComboboxPrimitive.InputGroup\n      className={(state) => cn(\n        \"ds-combobox\",\n        `ds-combobox--${size}`,\n        (filled || !state.placeholder) && \"ds-combobox--filled\",\n        state.open && \"ds-combobox--open\",\n        state.disabled && \"ds-combobox--disabled\",\n        state.readOnly && \"ds-combobox--readonly\",\n        invalid && \"ds-combobox--error\",\n        className,\n      )}\n      data-slot=\"combobox-control\"\n      {...props}\n    />\n  )\n}\n\nfunction ComboboxLeadingIcon({ className, ...props }: React.ComponentProps<typeof SearchIcon>) {\n  return <SearchIcon aria-hidden=\"true\" className={cn(\"ds-combobox__icon ds-icon\", className)} data-slot=\"combobox-leading-icon\" {...props} />\n}\n\nfunction ComboboxInput({ className, ...props }: ComboboxPrimitive.Input.Props) {\n  return <ComboboxPrimitive.Input className={cn(\"ds-combobox__input\", className)} data-slot=\"combobox-input\" {...props} />\n}\n\nfunction ComboboxClear({\n  children,\n  className,\n  label = \"Limpar seleção\",\n  ...props\n}: ComboboxPrimitive.Clear.Props & { label?: string }) {\n  return (\n    <ComboboxPrimitive.Clear\n      aria-label={label}\n      className={cn(\"ds-combobox__clear\", className)}\n      data-slot=\"combobox-clear\"\n      {...props}\n    >\n      {children ?? <XIcon aria-hidden=\"true\" className=\"ds-icon\" />}\n    </ComboboxPrimitive.Clear>\n  )\n}\n\nfunction ComboboxChevron({ className, ...props }: React.ComponentProps<typeof ChevronDownIcon>) {\n  return <ChevronDownIcon aria-hidden=\"true\" className={cn(\"ds-combobox__chevron ds-icon\", className)} data-slot=\"combobox-chevron\" {...props} />\n}\n\nfunction ComboboxPortal(props: ComboboxPrimitive.Portal.Props) {\n  return <ComboboxPrimitive.Portal data-slot=\"combobox-portal\" {...props} />\n}\n\nfunction ComboboxPositioner({ className, sideOffset = 0, ...props }: ComboboxPrimitive.Positioner.Props) {\n  return (\n    <ComboboxPrimitive.Positioner\n      className={cn(\"ds-combobox-anchor ds-tis-combobox__positioner\", className)}\n      data-slot=\"combobox-positioner\"\n      sideOffset={sideOffset}\n      {...props}\n    />\n  )\n}\n\nfunction ComboboxContent({ className, ...props }: ComboboxPrimitive.Popup.Props) {\n  return (\n    <ComboboxPrimitive.Popup\n      className={cn(\"ds-combobox__listbox ds-tis-combobox__popup\", className)}\n      data-slot=\"combobox-content\"\n      {...props}\n    />\n  )\n}\n\nfunction ComboboxList(props: ComboboxPrimitive.List.Props) {\n  return <ComboboxPrimitive.List data-slot=\"combobox-list\" {...props} />\n}\n\nfunction ComboboxItem({ className, ...props }: ComboboxPrimitive.Item.Props) {\n  return (\n    <ComboboxPrimitive.Item\n      className={cn(\"ds-combobox__option\", className)}\n      data-slot=\"combobox-item\"\n      {...props}\n    />\n  )\n}\n\nexport {\n  Combobox,\n  ComboboxAnchor,\n  ComboboxChevron,\n  ComboboxClear,\n  ComboboxContent,\n  ComboboxControl,\n  ComboboxField,\n  ComboboxInput,\n  ComboboxItem,\n  ComboboxLabel,\n  ComboboxLeadingIcon,\n  ComboboxList,\n  ComboboxPortal,\n  ComboboxPositioner,\n}\n",
      "type": "registry:ui",
      "target": "@ui/combobox.tsx"
    },
    {
      "path": "registry/tis/tis-utils.ts",
      "content": "import { clsx, type ClassValue } from \"clsx\"\nimport { twMerge } from \"tailwind-merge\"\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n",
      "type": "registry:lib",
      "target": "@ui/tis-utils.ts"
    }
  ],
  "css": {
    "@import \"ds-tis/css\"": {},
    ".ds-tis-combobox__positioner": {
      "z-index": "var(--ds-z-tooltip)",
      "inline-size": "var(--anchor-width)",
      "max-inline-size": "var(--available-width)"
    },
    ".ds-combobox__listbox.ds-tis-combobox__popup": {
      "position": "relative",
      "inset": "auto",
      "top": "auto",
      "inline-size": "100%"
    },
    ".ds-tis-combobox__popup [data-slot=\"combobox-list\"]": {
      "display": "flex",
      "flex-direction": "column",
      "gap": "var(--ds-combobox-listbox-container-gap-default)"
    },
    ".ds-combobox__option[data-highlighted]": {
      "background": "var(--ds-menu-item-bg-hover-default)",
      "color": "var(--ds-menu-item-content-color-hover)"
    }
  },
  "meta": {
    "provider": "Base UI",
    "providerRole": "output-provider",
    "status": "beta",
    "wave": "forms"
  },
  "docs": "Componha com ComboboxField e ComboboxLabel. Mantenha @import \"ds-tis/css\" como o primeiro import do CSS global.",
  "type": "registry:ui"
}