A lightweight React component to manage keyboard shortcuts effortlessly. Perfect for apps that need customizable hotkeys.
- Declarative hotkey configuration
- Supports
Ctrl
,Shift
,Alt
, andMeta
modifiers - Zero dependencies
- TypeScript support
npm install react-hotkeys-manager
import { HotkeyManager } from 'react-hotkeys-manager';
const App = () => {
const hotkeys = [
{
keys: ['ctrl','s'],
action: () => alert('Saved!'),
},
];
return <HotkeyManager hotkeys={hotkeys} />;
};
import { useHotkeys } from 'react-hotkeys-manager';
const App = () => {
const hotkeys = [
{
keys: ['ctrl', 's'],
action: () => alert('Saved!'),
},
];
useHotkeys(hotkeys);
return (
<div>
<h1>Press Ctrl+S to see the alert</h1>
</div>
);
};
Prop | Type | Description |
---|---|---|
hotkeys |
Hotkey[] |
Array of hotkey configurations. |
Pull requests are welcome! See CONTRIBUTING.md for guidelines.
This project follows the Contributor Covenant.
MIT © Sulaymon Makhsumov