Searchable Select
Select with search and scrollable options list
Selection looks good
Double-check your choice
Please select a valid option
Browse components
Select
Dropdown with type-ahead search, scrollable options and validation states.
atoms 4 variants
Variants / states: defaultsuccesswarningerror
Live example
Default usage you can copy and adapt.
Props
The props you are most likely to need, with types and defaults.
| Name | Type | Required | Default | Description |
|---|---|---|---|---|
| options | array | Yes | [] | Select options |
| value | string | number | No | — | Selected value |
| placeholder | string | No | Select an option | Placeholder text |
| searchable | boolean | No | true | Enable search input |
| searchPlaceholder | string | No | Search options | Search input placeholder |
| maxMenuHeight | string | No | 60vh | Max height for the options list |