🚀 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, and Meta 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