Noodle Printing Machine

    @phntms/use-key
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.0 • Public • Published

    use-key

    NPM version Actions Status PR Welcome

    A simple React hook for listening to custom keyboard events. This hook is also SSR safe and does not break when used without window existing.

    Installation

    Install this package with npm.

    npm i @phntms/use-key

    Usage

    To listen to a single key:

    import useKey from "@phntms/use-key";
    
    useKey("Escape", (pressed: boolean) => {
      if (pressed) // Do something on "Escape"...
    });

    To listen to key modifiers:

    import useKey from "@phntms/use-key";
    
    useKey("g", (pressed: boolean, event: KeyboardEvent) => {
      if (pressed && event.ctrlKey) // Do something on "Ctrl + G"...
    });

    API

    The hook uses KeyboardEvent under the hood. This means using the onChange event, you can get the state of modifier keys such as Shift as well as the keyboard locale and layout.

    Contributing

    Want to get involved, or found an issue? Please contribute using the GitHub Flow. Create a branch, add commits, and open a Pull Request or submit a new issue.

    Please read CONTRIBUTING for details on our CODE_OF_CONDUCT, and the process for submitting pull requests to us!

    Install

    npm i @phntms/use-key

    DownloadsWeekly Downloads

    6

    Version

    1.0.0

    License

    MIT

    Unpacked Size

    21.5 kB

    Total Files

    23

    Last publish

    Collaborators

    • dhiaphntm
    • jpedersen
    • digitaljohn
    • paulomfj