Select

Select is a compound listbox for picking one value. Use it when the options are known and fit a dropdown; for a long, searchable list, reach for Combobox.

Usage

import {
  Select, SelectTrigger, SelectValue, SelectContent, SelectItem,
} from "@sina-design-system/core";

<Select value={rail} onValueChange={setRail}>
  <SelectTrigger><SelectValue placeholder="Payment rail" /></SelectTrigger>
  <SelectContent>
    <SelectItem value="ach">ACH</SelectItem>
    <SelectItem value="wire">Wire</SelectItem>
  </SelectContent>
</Select>

Examples

Parts

Select · SelectTrigger · SelectValue · SelectContent · SelectItem · SelectGroup · SelectLabel · SelectSeparator.

Accessibility

Adheres to the ARIA listbox pattern: arrow keys move, typeahead jumps, Enter selects, Esc closes, and focus returns to the trigger. All handled for you.