Components
Select
A dropdown selector for single or multiple options.
Loading...
Installation
NPM packages are currently unstable and may cause issues. Use it at your own risk.
npm install @mijn-ui/react-selectUsage
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from "@mijn-ui/react-select"<Select>
<SelectTrigger className="w-[180px]">
<SelectValue placeholder="Theme" />
</SelectTrigger>
<SelectContent>
<SelectItem value="light">Light</SelectItem>
<SelectItem value="dark">Dark</SelectItem>
<SelectItem value="system">System</SelectItem>
</SelectContent>
</Select>Examples
Scrollable
Loading...
Select Style Slots
| Slot Name | Targeted Component | Purpose |
|---|---|---|
base | Select | Styles the root select component. |
trigger | SelectTrigger | Styles the trigger for opening the select. |
scrollUpBtn | SelectScrollUpButton | Styles the scroll-up button in the select. |
scrollDownBtn | SelectScrollDownButton | Styles the scroll-down button in the select. |
content | SelectContent | Styles the select content container. |
viewport | SelectContent | Styles the viewport of the select content. |
label | SelectLabel | Styles the label within the select. |
item | SelectItem | Styles individual select items. |
itemIndicator | SelectItem | Styles the indicator for selected items. |
separator | SelectSeparator | Styles the separator between select items. |