React Multi-Select
The filter-building workhorse for parametric search and catalog facets. Selected options become removable chips inside the control; the inline input filters the list live; Backspace on an empty query removes the last chip and Enter toggles the highlighted option. Supports a max selection limit (remaining options disable themselves), option descriptions, and disabled options. Shares the option model with Select & Combobox.
AXI4APB3
Type to filter; Backspace removes the last chip.
Options beyond the limit disable themselves.
Installation
npx shadcn@latest add "http://localhost:3000/registry/multi-select.json"
Usage
Loading...
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| options | SelectOption[] | — | { value, label, description?, disabled? } |
| values | string[] | — | Selected values (controlled) |
| onChange | (values: string[]) => void | — | Selection callback |
| max | number | — | Selection limit; extra options disable |
| placeholder | string | "Select…" | Shown while nothing is selected |
| emptyMessage | string | "No results." | Filtered-to-nothing message |
| invalid | boolean | false | Error styling + |
New components every week
Get the week's new Kelvin UI components and templates in one short email. No spam, unsubscribe anytime.