Select

Lets people choose one option from a dropdown list.

Installation

Install Select from Oros with shadcn CLI 4.13.0.

pnpm dlx shadcn@4.13.0 add @oros/select

Usage

import {
  Select,
  SelectContent,
  SelectGroup,
  SelectItem,
  SelectLabel,
  SelectScrollDownButton,
} from "@/components/ui/select"

Open the Source tab in the preview for a complete working example.

Anatomy

Export	Responsibility
Select	The root component that owns the primary structure and state.
SelectContent	Contains the primary visible content.
SelectGroup	Groups related items into one logical set.
SelectItem	Represents one option or repeated child.
SelectLabel	Provides a visible label for its related control or value.
SelectScrollDownButton	A composable part of the component anatomy.
SelectScrollUpButton	A composable part of the component anatomy.
SelectSeparator	Visually and semantically separates related groups.
SelectTrigger	Controls opening, selection, or disclosure behavior.
SelectValue	Displays or exposes the current value.

API Reference

Select exports 10 named entries. Component exports accept the props of their underlying HTML element or Base UI component, plus an optional className, unless the source defines a more focused type.

Select Component
SelectContent Component
SelectGroup Component
SelectItem Component
SelectLabel Component
SelectScrollDownButton Component
SelectScrollUpButton Component
SelectSeparator Component
SelectTrigger Component
SelectValue Component

Accessibility

Select inherits focus management and keyboard support from Base UI; keep the provided trigger and content parts together.
Give icon-only triggers an accessible name, retain visible focus styles, and verify Escape and focus-return behavior in the final composition.

Source

Select uses the standard shadcn API and is distributed through Oros. Installing it adds the component source and required dependencies to your app. The Source tab above shows a complete usage example.

Scroll Area Separator