Select

A form control for choosing one option from a list of predefined values.

#Installation

npx @dinachi/cli@latest add select

#Usage

tsx

import {
  Select,
  SelectGroup,
  SelectValue,
  SelectTrigger,
  SelectContent,
  SelectBackdrop,
  SelectFieldLabel,
  SelectLabel,
  SelectItem,
  SelectItemIndicator,
  SelectArrow,
  SelectScrollUpArrow,
  SelectScrollDownArrow,
  SelectSeparator,
} from "@/components/ui/select"

#Examples

#API Reference

Prop	Type	Default	Description
value	string	—	The controlled selected value.
defaultValue	string	—	The initially selected value when uncontrolled.
onValueChange	(value: string) => void	—	Callback fired when selection changes.
SelectContent.portal	boolean	true	Whether to render the dropdown in a portal. Set to false when used inside a Dialog or Drawer to keep it within the modal focus trap.
SelectContent.alignItemWithTrigger	boolean	false	Overlaps the trigger to align the selected item text with the trigger value.
SelectContent.sideOffset	number	4	Distance between trigger and popup.
SelectItem.showIndicator	boolean	false	Shows a check icon for the selected item.