KeyUX

JS library to improve the keyboard UI of web apps. It is designed not only
for a11y, but also to create professions tools where users prefer
to use the keyboard.

* Add hotkeys with aria-keyshortcuts.
* Show a button’s :active state when a hotkey is pressed.
* Enable navigation with keyboard arrows in role="menu" lists.
* Jump to the next section according to aria-controls and back
with Esc.
* Show and hide submenus of role="menu".
* Allow users to override hotkeys.
* 2 KB (minified and brotlied). No dependencies.
* Vanilla JS and works with any framework including React, Vue, Svelte.

``jsx
export const Button = ({ hotkey, children }) => {
return
{children}
{likelyWithKeyboard(window) && {getHotKeyHint(window, hotkey)}}

}
`

See demo page
and example:

https://github.com/user-attachments/assets/bcd78271-cf76-45a3-8beb-4f3cea69c143

---

- Install
- Hotkeys
- Hotkeys Hint
- Pressed State
- Hotkeys Override
- Hotkeys for List
- Meta instead of Ctrl on Mac
- Focus Groups
- focusgroup` attribute
- Menu
- Listbox
- Tablist
- Toolbar
- Focus Jumps
- Nested Menu

---

Made at Evil Martians, product consulting for developer tools.

---

Docs

Read full docs here.