Select
A terminal-inspired select component with monospace font and retro styling.
Basic Select
Grouped Options
Installation
npm install @radix-ui/react-select
Usage
import {
Select,
SelectContent,
SelectGroup,
SelectItem,
SelectLabel,
SelectTrigger,
SelectValue,
} from "@/components/ui/select"
export function MyComponent() {
return (
<Select>
<SelectTrigger className="w-[240px]">
<SelectValue placeholder="Select environment" />
</SelectTrigger>
<SelectContent>
<SelectGroup>
<SelectLabel>Environments</SelectLabel>
<SelectItem value="development">development</SelectItem>
<SelectItem value="staging">staging</SelectItem>
<SelectItem value="production">production</SelectItem>
</SelectGroup>
</SelectContent>
</Select>
)
}