Canoe vessel that navigates your aria.
A framework agnostic / universal package that implements navigation patterns for various aria roles and features.
... and this library will make it interactive, according to applicable ARIA patterns. This library does not apply styling, it will operate on the accessibility tree.
Role | Navigation Patterns | Features | Behavior |
listbox Focus Strategy: aria-activedescendant
|
✅ ArrowUp (prev)✅ ArrowDown (next)✅ Home (first)✅ End (last)✅ Pointer Navigation |
✅ Disabled ✅ Scroll into view ✅ Single selection ✅ Multi selection ❌ Checked |
- |
menu Focus Strategy: Roving tabindex
|
✅ ArrowUp (prev)✅ ArrowDown (next)✅ ArrowRight / Enter (expand)✅ ArrowLeft / Esc (collapse)✅ Home (first)✅ End (last)✅ Pointer Navigation |
✅ Disabled ✅ role="menuitem" ❌ role="menuitemcheckbox" ❌ role="menuitemradio"
|
❌ Hover Behavior |
tablist Focus Strategy: Roving tabindex
|
✅ ArrowRight / ArrowUp (prev)✅ ArrowLeft / ArrowDown (next)✅ Home (first)✅ End (last)✅ Pointer Navigation |
✅ Disabled ✅ Orientation ✅ Single selection ❌ Multi selection |
✅ Manual (with spacebar) / Automatic Selection |
See each package for instructions
aria-voyager
- universal / framework agnostic packageember-aria-voyager
- bindings for ember.js