Radio group
A group of radio inputs, with a legend, bound to one value.
The server prices the chosen plan.
Each preview is its own Live page in a frame, because this site is a Vue 3.5 app built on the Pulsar starter kit. An open list or popover stays inside its frame; in your application it opens over the page.
Installation
suprnova live:add radio-groupUsage
{% import "suprnova-ui/radio-group/radio-group.html" as radio_group %}
{% call radio_group::radio_group("plan", "Plan", plans, selected=plan) %}{% endcall %}Examples
Required
Confirming without a choice fails server validation.
Keyboard and accessibility
suprnova.radio-group - a fieldset of native radios over (value, label) pairs bound to one model path; the legend is the group's accessible name. selected is the island's current value, whose radio renders checked (FORM-009). Each radio is keyed by its value, so a choice the user has not sent survives a re-render of the island (FORM-010); authority marks a server correction (Live spec 12).
API reference
radio_group
| Parameter | Default | Description |
|---|---|---|
name | Required | The `String` model field. |
legend | Required | The group's legend. |
options | Required | `(value, label)` pairs, one radio each. |
required | false | Marks the group required. |
selected | "" | The island's current value of the field, so the control shows it. |
authority | "" | A correction sequence. When set, this render replaces the visitor's unsent edit. |