Select
Custom listbox with groups, descriptions, icons, typeahead and full keyboard support — positioned with collision flipping.
6 files · 535 locdeps: clsx, tailwind-merge
Installation
With the shadcn CLI, pointing at this platform’s registry:
npx shadcn@latest add https://opusui.131199999.xyz/r/select.jsonOr offline, straight from your opus55 checkout (copies every file it needs):
node ../tailwind_component/opus55/scripts/add.mjs selectUsage
import { Select } from "@/components/opus/ui/select";
<Select value={v} onValueChange={setV} options={[{ value: "a", label: "Alpha" }]} />API
| Prop | Type | Default | Description |
|---|---|---|---|
| options | SelectOption[] | — | { value, label, text?, description?, icon?, disabled?, group? } |
| value / defaultValue | string | — | Controlled / uncontrolled selection. |
| onValueChange | (value: string) => void | — | Fires when the user picks an option. |
| placeholder | string | "Select…" | Shown when nothing is selected. |
| size | "sm" | "md" | "lg" | "md" | Trigger height. |
Notes
- Keyboard: ↑/↓, Home/End, Enter/Space, Esc, and type-to-jump on both trigger and list.