Select
/Documentation
Select
A customizable select component with support for keyboard navigation, groups, scrolling indicators, and custom styling. Built with Base UI for better performance and accessibility.
Props
| Name | Type | Default | Description |
|---|---|---|---|
| disabled | boolean | - | Disable the select trigger |
| sideOffset | number | - | Distance in pixels from the trigger (SelectContent prop) |
| alignItemWithTrigger | boolean | - | When true, scrolls the dropdown to align the selected item with the trigger position (SelectContent prop) |
Stories
Default
A basic select with configurable props
Grape
Without Item Alignment
Demonstrates alignItemWithTrigger=false behavior - dropdown always opens at the top of the list
Raspberry
With Groups
Select with grouped options using SelectGroup and SelectGroupLabel components
Select fruit