ionic-team / ionic-framework

A powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.
https://ionicframework.com
MIT License
51.13k stars 13.5k forks source link

fix(overlays): focus management with checkbox/radio #30026

Closed tanner-reits closed 4 days ago

tanner-reits commented 6 days ago

Issue number: resolves internal


What is the current behavior?

Using Tab or Shift + Tab to focus through elements in a modal won't behave as expected when using ion-checkbox or ion-radio within an ion-item. Previously, the behavior would result in the last item in a list getting focus styling, but document.activeElement would still be the first actionable item in the overlay

What is the new behavior?

For checkboxes, the ion-checkbox element itself will be focused rather than the encapsulating ion-item

For radios, the ion-radio-group will be used to focus the appropriate element. This will be the first ion-radio if there is no "checked" item, or the "checked" item if one exists.

Does this introduce a breaking change?

Other information

vercel[bot] commented 6 days ago

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
ionic-framework ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 19, 2024 8:58pm