BbRadio

Sets autofocus on page load.

Defines the input as checked.

Overrides the model-derived display and fights a v-model — pick one source of truth. Narrowed to a plain boolean in v3, so the v2 string forms no longer compile.

Descriptive text displayed below the label and above the input. Unlike the hint it is always visible, and it is linked to the input via aria-describedby (after any errors / warnings, before the hint).

Wired into the input's aria-describedby, so it is announced as part of the option. The same sentence in a sibling element is read as unrelated page content.

Direction of the layout of the component. Can either be a predefined value or a pattern separated by a space like xx xxxxx.

Disables the component.

Removes the option from the tab order and from the post. Prefer offering a real choice; when you cannot, say why in description.

Can be a string or an array of string containing the messages to display. They render in an aria-live="polite" region (announced when they appear) and, while the list is non-empty, are referenced FIRST from the control's aria-describedby, so the reason the field is invalid is re-read whenever the control regains focus.

Lives on one button, while the error usually belongs to the whole set. Put it on a single radio rather than on each one — repeated, it renders and announces the same sentence per button. A set that needs validation is an argument for BbRadioGroup.

Define if the component should be in an error state. It usually attaches a CSS class for styling purposes.

Define if the component should be in a warning state. Same chrome as errors with --bb-warn; errors take priority.

Visually hides the label of the input while maintaining accessibility.

Text box to be displayed near the input, usually to indicate instructions.

The identifier of the component.

Sets the alignment of the input. Since inputs are inline block they can be aligned just as text can.

Text content of the label of the element.

Required on every button: it is the accessible name, and it stays the accessible name when the label slot replaces the rendered text.

Sets the text alignment of the label.

Used by v-model. Can be any serializable type.

Defines the name of the input. Optional: an omitted name falls back to a generated one, unique to this button and stable for its lifetime, so a lone radio needs no name at all. Buttons that must form ONE exclusive group still have to share an explicit name — generated names are per-instance, so they would never group. Pass a name too when the value has to be submitted under a known key by a native (non-JS) form post.

No longer required in v3 — an omitted name is generated per button. That is exactly why a hand-composed group must still pass one shared explicit name: generated names differ, so those buttons never form a native group and you lose exclusivity and arrow-key navigation with it.

Keeps the hint displayed.

Passthrough, object form: the same keys as the pt:* attributes without the prefix. See the pt:<part> row.

Sets the input in a readonly state.

Blocks changes while staying focusable and still submitting. A lone radio cannot announce it — role="radio" supports no aria-readonly — so explain it in description, or use BbRadioGroup, whose radiogroup does carry the attribute.

Sets the input as required.

Reverses the layout: in every direction the order of the label and the input is swapped from the standard arrangement.

Its meaning inverted in v3 and the compiler cannot see it. The default rendering is unchanged, but a v2 :reverse="false" becomes a bare reverse, and a v2 reverse is deleted.

Defines the value of the radio input. It can be any serializable value.

Required, and distinct per button — two buttons sharing a value are not two options. Any serializable value is matched structurally, but prefer stable primitive ids: they survive a refetch and are cheap to submit.

Warning messages to display beneath the field, in their own aria-live region and amber (--bb-text-warn). A string or array; a non-empty list implies the warning state. Errors suppress warnings when both are set. While displayed they are also referenced from the control's aria-describedby, after any errors and before the description/hint.

One model shared by every button in the set: that is what makes selecting one deselect the rest. It carries the chosen value and nothing else.

Replaces the description text. Provided alone (no description prop) it still renders the description region and wires it into aria-describedby.

Replaces the default radio dot visual inside the radio container. Receives the radio state plus the label text.

Replaces the whole radio-dot visual, so the slot owns selected, unselected and the focus ring. When the row around it is the problem rather than the dot, drop to BbBaseRadioIcon.

Replaces the default label text rendered next to the radio button.

Receives { text, hasErrors, hasWarnings }. Use it for the one option that needs a badge or emphasis — if every option needs the same decoration, you have a uniform mapping again and BbRadioGroup expresses it with less markup.