Select
A dropdown for choosing one value from a list, such as a GPU type or region.
Install
pnpm dlx shadcn@latest add @namche/selectUsage
import {
Select,
SelectContent,
SelectGroup,
SelectItem,
SelectLabel,
SelectTrigger,
SelectValue,
} from '@/components/ui/select';
<Select defaultValue="h100">
<SelectTrigger>
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectGroup>
<SelectLabel>Hopper</SelectLabel>
<SelectItem value="h100">H100 80GB</SelectItem>
<SelectItem value="h200">H200 141GB</SelectItem>
</SelectGroup>
</SelectContent>
</Select>Wraps Base UI's Select. Select (the root) takes value / defaultValue
and onValueChange; SelectTrigger accepts size="sm" | "default".
SelectGroup + SelectLabel are optional — use them to cluster related
options, as above with GPU generations. SelectContent renders through a
portal and positions against the trigger (side, align,
alignItemWithTrigger), so no extra layout work is needed for popover
behavior.