Select

items is the list of options. A bare string or number is the shorthand — it becomes both the label and the value — while the long form is { label, value } with an optional icon and disabled. Two entries aren't options at all: { type: 'label' } prints a group heading and { type: 'divider' } draws a rule, which is how a long list gets sectioned.

modelValue is the selected value — the value of an option, not its label, and an array of them once multiple is set. Pass it to control the selection yourself; bind it with v-model for the usual case where the reader's choice should flow back.

defaultValue is what's selected on first render while the select still owns its own state. It's the right tool for a sensible starting choice — a default currency, the most common option — where you don't otherwise need to hold the value yourself.

multiple allows more than one option to be selected, which also switches modelValue from a single value to an array. The trigger then lists the choices instead of showing one.

placeholder is what the trigger reads while nothing is selected. Phrase it as the instruction it is — “Select a fruit” rather than “Fruit” — since unlike a FormField label it disappears as soon as there's a value to show.

icon sits at the start of the trigger while nothing is selected — once an option with its own icon is chosen, that one takes over. It's a way to mark what the field is for without spending a label on it.

disabled locks the whole select. Individual options can opt out on their own with a per-item disabled instead.

clearable shows a button to clear the current selection.

variant picks between the ringed, transparent outline trigger and the lightly tinted soft one, which has its own section below.

content positions the dropdown relative to the trigger: side, align and sideOffset. Reach for it when the select sits near an edge the list would otherwise open across.

open controls whether the dropdown is showing. Pass it to drive the list from your own state — opening it from a keyboard shortcut, closing it when a step finishes — and bind it with v-model:open so the reader's own clicks still register. Omit it and the select manages that itself.

defaultOpen starts the dropdown expanded on mount while leaving the open state uncontrolled. It's a narrow tool — a step that exists only to be answered — and wrong wherever the select is one field among several.

A lightly tinted field with no ring — a lower-emphasis alternative to outline.