The `auro-radio` component follows native HTML radio button semantics. This page documents the ARIA attributes, screen reader behavior, and other accessibility features built into the component. For keyboard interaction details, see the Keyboard Behavior page. ARIA Roles and Attributes Radio Group The `` element uses a `

` with a `

` internally, providing native grouping semantics: | Attribute | Value | Description | |---|---|---| | `role` | `radiogroup` (implicit via `fieldset`) | Groups related radio buttons together. | | `aria-invalid` | `true` / `false` | Reflects whether the group is currently in an invalid state. | Radio Each `` renders a native `` inside its shadow DOM: | Attribute | Value | Description | |---|---|---| | `type` | `radio` | Native radio input type. | | `aria-checked` | `true` / `false` | Reflects the selected state of the radio button. | | `aria-disabled` | `true` / `false` | Indicates whether the radio button is disabled. | Screen Reader Announcements - **Focus** — When focus moves to a radio button, the screen reader announces the radio label, its selected/unselected state, its position in the group (e.g. "1 of 3"), and role ("radio button"). - **State change** — Selecting a radio button announces the new state ("selected"). - **Group context** — The legend text provides group context when navigating between groups. - **Error** — When validation fails, the error message is announced to screen reader users. Accessible Labels - The `legend` slot content provides the accessible group label via the native `

` element. - Each radio button's `label` attribute provides its individual accessible label. - A label is required for each radio button. Without it, assistive technology users will not have context for what the radio controls. - The `(optional)` label is automatically appended when the `required` attribute is not set. Form Participation The `` participates in form validation and submission. When used inside a `

` or ``, the selected radio button's value is included in the form data.