The `auro-checkbox` component follows native HTML checkbox 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 Checkbox Group The `` element uses a `

` with a `

` internally, providing native grouping semantics: | Attribute | Value | Description | |---|---|---| | `role` | `group` (implicit via `fieldset`) | Groups related checkboxes together. | | `aria-invalid` | `true` / `false` | Reflects whether the group is currently in an invalid state. | Checkbox Each `` renders a native `` inside its shadow DOM: | Attribute | Value | Description | |---|---|---| | `type` | `checkbox` | Native checkbox input type. | | `aria-checked` | `true` / `false` | Reflects the checked state of the checkbox. | | `aria-disabled` | `true` / `false` | Indicates whether the checkbox is disabled. | Screen Reader Announcements - **Focus** — When focus moves to a checkbox, the screen reader announces the checkbox label, its checked/unchecked state, and role ("checkbox"). - **State change** — Toggling the checkbox announces the new state ("checked" or "unchecked"). - **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 checkbox's default slot content provides its individual accessible label. - A label is required for each checkbox. Without it, assistive technology users will not have context for what the checkbox 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 ``, checked checkbox values are included in the form data.