Railbase
GPTClaude

Select

A dropdown for choosing one option from a list.

Updated

Default
<Select>
  <SelectTrigger class="w-48"><SelectValue placeholder="Select a fruit" /></SelectTrigger>
  <SelectContent>
    <SelectItem value="apple">Apple</SelectItem>
    <SelectItem value="banana">Banana</SelectItem>
    <SelectItem value="pear">Pear</SelectItem>
  </SelectContent>
</Select>

A dropdown for choosing one option from a list.

Installation

railbase ui add select

Note

railbase ui add also copies shared primitives — they ship alongside this component automatically.

Usage

import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from "@/lib/ui/select";

<Select>
  <SelectTrigger><SelectValue placeholder="Pick one" /></SelectTrigger>
  <SelectContent>
    <SelectItem value="apple">Apple</SelectItem>
    <SelectItem value="pear">Pear</SelectItem>
  </SelectContent>
</Select>

Anatomy

Exported parts: Select · SelectTrigger · SelectValue · SelectContent · SelectItem · SelectSeparator · SelectLabel · SelectGroup · SelectScrollUpButton · SelectScrollDownButton

← PreviousScroll AreaNext →Separator