Components / Combobox

Combobox

A searchable pick list (Base UI): filter as you type, then choose. Short fixed lists use Select instead; multi-select with removable chips uses the ComboboxChips family.

import { Combobox, ComboboxInput, ComboboxContent, ComboboxList, ComboboxItem, ComboboxGroup, ComboboxLabel, ComboboxEmpty, ComboboxChips } from '@layers/ui/combobox'

Rendered stock

House rules

  • ComboboxInput forwards its size prop to InputGroup: size="sm" (32px) in toolbars, default (36px) in forms.
  • ComboboxList takes a function child that renders each ComboboxItem from items on the root; ComboboxEmpty handles the no-match state.
  • Base UI anatomy: parts compose via render props, never asChild.

See also