Select

A Select with options and a defaultValue, where an option with disabled: true shows in the list but cannot be picked.

Set allowClear to show a clear button on hover, which sets the value back to undefined.

Set mode to multiple to pick several options, each shown as a removable tag in the field.

Set mode to tags to let people type values that are not in the list, and tokenSeparators to split pasted text like "Lucy,Jack".

Set size to large or small to change the field's height, with the middle size as the default.

Set variant to outlined, filled, text, underlined, borderless or bare to change how the field is drawn. text fills on hover and while open, and bare draws nothing at all.

Set status to warning or error to color the field's border for validation.

Set disabled to show the value without letting anyone open the list or change it.

Set showSearch to filter the options as you type, which a single select does not do by default.

Pass showSearch.filterOption your own matcher, here one that finds the text anywhere in the label, so "err" finds Cherry.

Pass showSearch.optionFilterProp an array to search more than one field, so typing part of an email finds the person.

Nest options in { label, options } groups to list them under headings.

Pass optionRender to draw each row yourself from any field on option.data, like an avatar and an email under the name.

Pass labelRender to control what the closed field shows, like a readable fallback for a value with no matching option.

Pass tagRender to draw each selected value in multiple mode, here as a Tag wired to the closable and onClose it receives.

Set maxCount to cap how many values can be picked, so the other options become unavailable once three are chosen.

Set maxTagCount to show only the first few selected values and fold the rest into one "+ N" tag.

Pass prefix to put an icon or text before the value, and suffixIcon to replace the arrow.

Pass popupRender to add your own content around the option list, like a field and a button that add a new option.

Pass classNames.popup to style the dropdown, which renders outside the field, here tinting its background.

A thousand options scroll smoothly because only the rows in view are rendered, and virtual={false} turns that off.

A searchable list of every country with a flag on each row and on the chosen value, matching the name or the two-letter code.

A phone field that pairs a compact dial-code select with the number input, with a search box at the top of the wider list.

A time zone picker grouped by region, with each zone's UTC offset at the end of its row.

A status picker with a colored Badge dot beside each status, in the list and in the closed field.

A multiple select at three sizes where each priority shows as a colored Tag, in the list and once picked.

A sort menu where each option and the closed field show an icon before the label.

A single select where each priority shows as a Tag with an icon, in the list and in the closed field.

A reviewer picker with an avatar on every row, grouped under labels, and a smaller avatar in the closed field.

A multiple select whose closed field shows the picked status dots, a label and a small Progress ring for how many are picked.

A reviewer picker with avatars and emails in the list, where each chosen reviewer becomes a Tag with their avatar.

A role picker where each option shows a short description under its name, while the closed field shows only the name.

A branch picker that offers to create a branch when the search matches nothing, through notFoundContent.

Two selects where the region list depends on the chosen country, with every province or state, and changing the country clears the region.

An amount field with a currency select fused to its end by Space.Compact, so the two read as one control.

A directory search that fetches options as you type, debounced, with a loading state and client-side filtering turned off.

A Select inside a Modal, whose option list opens above the dialog with no getPopupContainer needed.