fetaUI
GitHub

Combobox

An input that filters a list as you type, for one value or many.

FreeWeb and MobileMotion

Preview

npx shadcn add @fetaui/combobox
Playground
Selected
Multiple
Nora PellInes Vale
Overflow
Nora PellInes Vale+2
Loading
Invalid and disabled
Icons animation
Multiple
Invalid
Disabled
Motion

Installation

Terminal· bash
 npx shadcn add @fetaui/combobox

Multiple

Picks become chips, and Backspace in an empty field removes the last one.

Nora PellInes Vale
Invalid
Disabled
Motion

Accessibility

  • Role combobox with aria-expanded and aria-activedescendant.
  • The number of matches is announced.
  • Chips have named remove buttons.

Motion

  • The list drops from the field in 200 ms.
  • The highlight glides between rows.
  • Chips pop in, and the rest close the gap.
  • With reduced motion, the list appears and chips appear in place.

Responsive behavior

  • 44 px field on Web and 48 px on Mobile, with 16 px text.

Performance

  • Filtering is memoized on options and query, and the list mounts only while open.
  • No virtualization: every match renders.

Note for AI

Give your coding assistant the Markdown reference instead of screenshots.

  • Import Combobox from @/components/fetaui/combobox. Options take value, label, description, avatar and disabled.
  • multiple changes value to an array, and maxChips folds the rest into +N.
  • It filters locally by label and description. For a remote list, read onQueryChange, pass the results as options with filter={false}, and set loading while you fetch.
  • It composes IconButton for Clear.
/docs/components/combobox/markdown
PreviousSelect
NextCalendar

Related

SelectComponentChoose one value from a list. The list grows out of the trigger and the highlight glides.InputComponentThe single line text control: a pill on the tray fill that lifts onto the surface when focused.SearchComponentA search field and a command palette for finding anything and running commands.FieldComponentLabel, control and help text as one unit, so they read, validate and announce together.CommandComponentA keyboard first menu for every action in the product, with fuzzy search, submenus and inline confirmation.