A field that filters a list as you type, best matches first: Enter picks the first.
Installation
Default
Combobox items value onValueChange > ComboboxInput, ComboboxContent > ComboboxEmpty, ComboboxList > ComboboxItem value={item}.
Multiple
multiple: ComboboxChips > ComboboxValue of ComboboxChips, then ComboboxChipsInput. 32px chips, 4px in.
Matching
While you type, the exact label leads, then labels that start with the query, then a word that does, then the rest; within each, the more of the label typed, then the order of items. Typing design lists Design first, though Design system comes earlier in items; Enter picks it. With multiple, what is already selected goes last, so Enter adds, unless you typed half of it or more.
With description
A row’s content is yours; the check keeps its column.
Allow custom
allowCustom: the value is an option's value or the typed text. While the query names no option, a row takes it, after the options whose label or a word in it starts with the query: Enter picks it unless one does. customLabel and customOptionLabel word those rows.
Multiple, allow custom
multiple allowCustom: chips of options and typed text. A typed chip’s value and label are its text; isCustomValue(item) tells it apart.
Virtualized
virtualized: 2,000 members, only the rows in view render. Rows keep to one line.
In a field
Field, label and error around it.
In a dialog
The popup portals above the dialog and keeps focus in it.
States
Placeholder, loading, invalid, read-only, disabled.