react-shortcut-hook
TypeScript icon, indicating that this package has built-in type declarations

1.1.0 • Public • Published

Setup shortcuts for your react app easily.

react-shortcut-hook

NPM JavaScript Style Guide

Install

npm install --save react-shortcut-hook

Usage

import * as React from "react";

import useCommander from "button-commanderreact-shortcut-hook"

const Example = () => {
  useCommander(
    undefined,
    [
      {
        name: "Green Color",
        shortcut: { windows: ["ctrl", "z"], macOS: ["meta", "z"] },
        description: "Change background color to green",
        callback: () => (document.body.style.background = "#64C964"),
        stopBubblingUp: true,
      },
      {
        name: "Yellow Color",
        shortcut: { windows: ["ctrl", "x"], macOS: ["meta", "x"] },
        description: "Change background color to yellow",
        callback: () => (document.body.style.background = "#fdd231"),
      },
      {
        name: "Red Color",
        shortcut: { windows: ["ctrl", "c"], macOS: ["meta", "c"] },
        description: "Change background color to red",
        callback: () => (document.body.style.background = "#FF614D"),
      },
    ]
  );

  return <div>hello world!</button>;
};

Live Demo

Found this project useful? ❤️

If you found this project useful, then please consider giving it a ⭐️ on Github and sharing it with your friends via social media.

Issues and feedback 💭

If you have any suggestion for including a feature or if something doesn't work, feel free to open a Github issue for us to have a discussion on it.

License

MIT © mmmy


This hook is created using create-react-hook.

Readme

Keywords

none

Package Sidebar

Install

npm i react-shortcut-hook

Weekly Downloads

14

Version

1.1.0

License

MIT

Unpacked Size

689 kB

Total Files

32

Last publish

Collaborators

  • yangqi