inputs

Select

Accessible dropdown select built on Radix UI. Keyboard navigable with search, grouping, and error state support.

Import

import { Select, SelectTrigger, SelectContent, SelectItem, SelectGroup, SelectLabel, SelectSeparator } from '@stella-ds/react'

SelectSelectTriggerSelectContentSelectItemSelectGroupSelectLabelSelectSeparator

Props

Prop	Type	Default	Description
size (SelectTrigger)	'sm' \| 'md' \| 'lg'	'md'	Size preset
error (SelectTrigger)	boolean \| string	false	Error state or message
placeholder (SelectTrigger)	string	undefined	Placeholder text

Preview

Examples

Basic

<Select>
  <SelectTrigger placeholder="Pick a fruit" />
  <SelectContent>
    <SelectItem value="apple">Apple</SelectItem>
    <SelectItem value="banana">Banana</SelectItem>
    <SelectItem value="cherry">Cherry</SelectItem>
  </SelectContent>
</Select>

← Section

All Components

Separator →