[Feature Request]: <Enhance Radio Group Accessibility>

[mryunt02]

Describe the problem or use case

For best accessibility and user experience, the selected Radio Group should be toggled with the arrow keys.

Arrow Keys:

• Down/Right Arrow:
  • Moves focus to and checks the next radio button in the group.
  • If focus is on the last radio button, moves focus to the first radio button.
  • The state of the previously checked radio button is changed to unchecked.
• Up/Left Arrow:
  • Moves focus to and checks the previous radio button in the group.
  • If focus is on the first radio button, moves focus to and checks the last radio button.
  • The state of the previously checked radio button is changed to unchecked.

Additionally:

• The Radio Button should not have the aria-readonly property.
• Each Radio Button should have the aria-checked attribute to indicate its checked state.

Reference: W3C ARIA Radio Group Example

Proposed solution

No response

Alternatives considered

No response

Additional technical context

No response