greena13/react-hotkeys
React Hotkeys
React hotkeys is a keyboard shortcut manager designed for declaring, scoping, and handling keyboard shortcuts and focus areas in React applications. It allows developers to define declarative shortcuts by binding key combinations or sequences to action names and handler functions, enabling components to respond predictably to user input.
The library provides distinct mechanisms for managing how keyboard events interact with the document. It supports scoping hotkeys to specific component subtrees and DOM descendants to match natural browser focus behavior, alongside global key event handling that captures matching combinations anywhere in the document regardless of active focus. It also excludes input elements and editable content from triggering shortcuts by default, with options to customize these rules.
Additional capabilities include runtime recording of user-pressed key combinations for custom shortcut assignments, and retrieval of active key maps and registered actions from mounted components to support help menu and dialog generation.
Features
- Focus Management - Manages component focus scopes and tracks active DOM elements for keyboard events.
- Keyboard Shortcut Managers - Provides a keyboard shortcut manager for declaring, scoping, and handling keyboard shortcuts and focus areas in applications.
- DOM Focus Filtering - Listens for keyboard input only when specific DOM descendants are active and focused.
- Keyboard Shortcuts - Binds key combinations or sequences to action names and handler functions declaratively.
- Component Focus Management - Scopes hotkeys exclusively to specific component descendants actively in focus within the document tree.
- Focus Management Libraries - Provides tools for tracking active DOM elements and scoping keyboard events to specific component subtrees.
- Global Keyboard Event Listeners - Captures matching key combinations anywhere in the document regardless of active focus.
- Active Binding Inspections - Retrieves active mappings and registered actions from mounted components to support help dialog generation.
- Input Event Filtering - Ignores or forces observation of key events originating from specific sections of the application.
- Custom Key Mappings - Records user-pressed key combinations dynamically for custom shortcut assignments at runtime.
- Global Hotkey Managers - Handles global shortcut events triggered anywhere in the document.
- Dynamic Keyboard Help Views - Generates dynamic help menus and dialogs from active key maps and registered component actions.
- Key Mapping Inspectors - Inspects currently mounted action key maps and assigned sequences for debugging.
- Input Element Wrappers - Excludes input elements and editable content from triggering shortcuts by default with customization rules.
- Component-Based UI Libraries - Builds user interfaces from small reusable React components.
- Application Action Mappings - Retrieves complete mappings of all currently mounted actions and key sequences to display help menus.
