1.1.0 • Published 4 months ago
react-hotkeys-manager v1.1.0
🚀 react-hotkeys-manager
A lightweight React component to manage keyboard shortcuts effortlessly. Perfect for apps that need customizable hotkeys.
🔥 Features
- Declarative hotkey configuration
- Supports
Ctrl
,Shift
,Alt
, andMeta
modifiers - Zero dependencies
- TypeScript support
📦 Installation
npm install react-hotkeys-manager
🛠️ Usage
Using the Component
import { HotkeyManager } from 'react-hotkeys-manager';
const App = () => {
const hotkeys = [
{
keys: ['ctrl','s'],
action: () => alert('Saved!'),
},
];
return <HotkeyManager hotkeys={hotkeys} />;
};
Using the Hook
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>
);
};
📖 API Reference
Prop | Type | Description |
---|---|---|
hotkeys | Hotkey[] | Array of hotkey configurations. |
🤝 Contributing
Pull requests are welcome! See CONTRIBUTING.md for guidelines.
📜 Code of Conduct
This project follows the Contributor Covenant.
📜 License
MIT © Sulaymon Makhsumov