React select dropdown component with grouped options, per-item descriptions, multi-select, action items, and column-based layouts

import { Select } from "@plexui/ui/components/Select";

Examples

Overview

variant

size

checkPosition

clearable

multiple

Select a fruit...

With descriptions

variant

size

checkPosition

triggerIcon

Reader

Use aria-labelledby with the ID of a visible field label. The default trigger includes that label and its current value or placeholder in its accessible name. aria-label, aria-describedby and aria-invalid also reach the default trigger. Custom triggers manage their own accessibility attributes.

Searchable menus name their input Search options by default. Set searchAriaLabel for a more specific search label without changing the trigger's accessible name or the visible placeholder.

Prop	Type	Default	Description
`options`	`Options<T>`	—	Array of options or grouped options
`value`	`string \| string[]`	—	Selected value (single) or values (multiple)
`onChange`	`function`	—	Called when selection changes
`multiple`	`boolean`	`false`	Allow multiple selection
`placeholder`	`string`	`"Select..."`	Trigger placeholder
`variant`	`string`	`"outline"`	Trigger variant
`size`	`string`	`"md"`	Trigger size
`pill`	`boolean`	`false`	Rounded trigger
`clearable`	`boolean`	`false`	Show clear button
`block`	`boolean`	`true`	Full width trigger
`disabled`	`boolean`	`false`	Disable select
`actions`	`array`	—	Actions below options list
`OptionView`	`React.FC`	—	Custom option render
`TriggerView`	`React.FC`	—	Custom trigger render (multi)
`searchPlaceholder`	`string`	—	Search input placeholder
`searchAriaLabel`	`string`	`"Search options"`	Accessible name of the search input, independent of the trigger label

Select shares the unified 9-step size scale with Button, Input, SelectControl, and SegmentedControl.

Select ControlHeadless React select control primitive for building custom dropdowns — variants, sizing, start and dropdown icons, clearable, loading, and invalid states Radio GroupReact radio group component for single-choice selection with horizontal or vertical layout, per-item descriptions, and Field integration CheckboxReact checkbox component for binary on/off selection with solid, pill, and ghost variants, indeterminate state, and inline descriptions Tag InputReact tag input component for entering multiple unique values as chip-style tokens, with suggestion dropdown and keyboard editing

Select

Examples

Overview

With descriptions

Actions

Grouped options

Multiple selection

Column configuration

Reference

On this page

Select

Related components

On this page