Kanshō/Combobox

Combobox

Typeable, single-choice field for medium-sized option sets. Use Combobox when selecting a discrete value from known options; use CommandInput for slash-command authoring where freeform input remains primary.

Included in the single kansho full pack. Components are not offered as separate installs.

Grouped options

Options can be grouped by workflow area while keeping one searchable list.

State matrix

Closed states
Default
Selected
Disabled
Invalid
Loading

Allow custom values

Press Enter to add

Component documentation

Combobox

components/inputs/combobox.tsx

Purpose

Provides a searchable single-value selector with grouped and custom options.

Appropriate use

Use for long option lists where filtering is faster than scanning a standard select.

Example

components/inputs/combobox.tsx has a representative live example in the "Grouped options" section on /components/combobox.

States

Supports controlled value, grouped options, loading, disabled, error, empty results, default-open, and optional custom-value creation.

API and props

Combobox accepts value, onValueChange, options, placeholder, emptyLabel, emptyHint, status, allowCustom, disabled, loading, defaultOpen, defaultQuery, id, ARIA labelling props, and className.

Dependencies

React, Radix Popover, cmdk, Lucide icons, Spinner, Field, and the Kansho cn utility.

Accessibility

Forwards labelling, description, and invalid attributes to the trigger; Radix manages popover focus and cmdk provides search-list keyboard navigation.

Limitations

It selects one string value only and does not virtualize very large option sets.

Source

Source: components/inputs/combobox.tsx.

Full pack

components/inputs/combobox.tsx is documented at /components/combobox and installs only through the single Kansho full pack; no individual component install is offered.