Select

Forms

A dropdown picker that lets users choose a single value from a collapsible list of predefined options.

Loading component...

Run the following command to add this component to your project:

$pnpm dlx static-ui add select

Import the component directly from the package:

import { Select } from "@static-ui/ui"

Common props available for this component:

Prop	Type	Description
value	string	Controlled selected value.
onValueChange	(value: string) => void	Callback when selection changes.
placeholder	string	Placeholder text before a value is selected.
className	string	Additional CSS classes to apply.

Implements the WAI-ARIA Listbox pattern. Uses `role="combobox"` and `role="listbox"` with `aria-selected` for options.

CalendarDate selection month grid.

CheckboxBinary selection control.

InputText field for user entry.

Input GroupGrouped input with adornments.

Input OTPOne-time passcode entry.

LabelForm control label.

Number FieldNumeric input with steppers.

Radio GroupMutually exclusive options.

SliderDrag handle range input.

SwitchToggle on/off control.

TextareaMulti-line text input.