React Hotkey Hook

A react hook which can execute any function for any keyboard shortcut.

Installation

Install the package with npm or yarn with either of the following commands.

npm i react-hotkey-hook

yarn add react-hotkey-hook

Make sure to import the useHotkey hook from the library after it is installed

1import useHotkey from "react-hotkey-hook";

Usage

1import "./App.css";
2import React from "react";
3import useHotkey from "react-hotkey-hook";
4
5function App() {
6  const onKeyPress = () => {
7    console.log("key pressed");
8  };
9
10  useHotkey("Control+a", true, onKeyPress);
11
12  useHotkey("Shift+A", true, onKeyPress);
13
14  return (
15    <div className="container">
16      <h1>Example for React Hotkey Hook</h1>
17    </div>
18  );
19}
20
21export default App;

Options

All options are optional and have a default value which you can override to change the behavior of the hook.

Option	Type	Description
hotkeys	string	The combination of hotkeys.
overide	boolean	Optional Parameter. Prevents default event when true. True on default.
callback	() => void	Function that will be called when the combination of keys are pressed.

License

Distributed under the MIT License. See LICENSE for more information.