RadioGroup
A set of mutually-exclusive radio options sharing a single `v-model`.
<UiRadioGroup :items="..." />Items
requireditems are the options, each a label and a value. An item can also carry its own description or a disabled flag.
Model value
modelValue is the selected value, two-way bound. Leave it off and the group tracks its own.
Selected: weekly
modelValue holds a single selected value, not an array — that's the main difference from CheckboxGroup.
Default value
defaultValue sets which option starts selected when uncontrolled.
Legend
legend is the heading above the options — what the whole group is asking, stated once so each label doesn't have to repeat it.
Required
required adds an asterisk to the legend.
Disabled
Disables the whole group. Individual options carry their own disabled flag — the first group below mixes both.
Color
color is the selected indicator's color.
Variant
variant sets the shape of each option. list stacks plain rows; card wraps each one in a bordered surface that highlights when selected, which pairs well with a per-item description.
variant="card" pairs well with per-item description text; plain list variant ignores it visually less prominently.
Orientation
orientation stacks the options or lays them in a row. Vertical is the safer default — a row only works for two or three short labels, and wraps badly on narrow screens.
Indicator
indicator sets which side the dot sits on, or hidden to drop it — for card options where the highlight already says which one is picked.
API Reference
Generated from the component's source — props, slots and emits as the component actually declares them.
Props
string | number"neutral" | "primary" | "secondary" | "success" | "error" | "warning" | "info" | "pending"'neutral'"list" | "card"'list'"start" | "end" | "hidden"'start'Emits
update:modelValue[value: string | number]Types
interface RadioGroupItem {
label?: string;
description?: string;
value: string | number;
disabled?: boolean;
}