Support for keyboard navigation home, end, left, right, enter, and space
Proper use of aria-* attributes applied
Circular navigation and proper tab and arrow navigation focus
Lightweight (< 1Kb)
Tested
Available as esm and umd
Supports prefers reduced motion system preference

Unavailble features:

aria-orientation vertical with up, down arrow support (coming soon!)
This implementation uses the manual activation pattern which requires the user to click or press enter / space on a focused tab button to open its corresponding panel (as opposed to the selection follow focus or automatic activation patterns)

Credits & Inspiration

Kitty Giraudel

A heartfelt thank you to @KittyGiraudel for creating a11y-dialog which inspired me to create a kindred-spirited and comparable a11y-tabs. Specifically, I found a11y-dialog's small surface API, clear documentation and sandbox demo made ramping up quite efficient. As such, I followed the same patterns with a11y-tabs.

WAI-ARIA & MDN

I was also inspired by the WAI-ARIA practices resources, and MDN tab role documentation efforts. Both resources certainly provided helpful and prescriptive guidance for this project.

Keywords

FAQs

Package last updated on 04 Nov 2021

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install