Select
stableDisplays a list of options for the user to pick from, triggered by a button.
Basic usage
Examples
Controlled with groups
Group related options under labelled sections and control the value.
Searchable large options
Use searchable with the virtualized options prop to keep large lists responsive.
Creation flow
Pass onCreateOption to let users create a value when search has no match.
Features
- Can be controlled or uncontrolled.
- Full keyboard support with typeahead.
- Supports items, labels, groups of items.
- Positioning and collision handling.
Installation
bash
pnpm dlx structyl add selectAPI Reference
Select API reference
Full props, types, defaults, and all 16 parts.
Keyboard interactions
Adheres to the WAI-ARIA design pattern .
| Key | Description |
|---|---|
| Space / Enter | Opens the select / selects the focused item. |
| ArrowDown / ArrowUp | Moves focus between options. |
| Esc | Closes the select. |