react-hotkeys-manager
TypeScript icon, indicating that this package has built-in type declarations

1.1.0 • Public • Published

🚀 react-hotkeys-manager

npm version npm downloads License: MIT

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

Package Sidebar

Install

npm i react-hotkeys-manager

Weekly Downloads

5

Version

1.1.0

License

MIT

Unpacked Size

10.4 kB

Total Files

8

Last publish

Collaborators

  • sulaymon1404