Package Exports

react-piano-keys
react-piano-keys/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-piano-keys) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-piano-keys

A React hotkeys librairy in less than 4KB.

Checkout the demo!

Installation

npm install --save react-piano-keys

Usage

import useKeys from 'react-piano-keys'

function MyComponent() {
  useKeys(window, 'cmd+b', () => console.log('bold!'))

  return (
    <div>
      Press cmd+b for bold!
    </div>
  )
}

If you use a ref, do not forget to use tabIndex={x} to make the component focusable.

import { useRef } from 'react'
import useKeys from 'react-piano-keys'

function MyComponent() {
  const divRef = useRef()

  useKeys(divRef.current, 'up up down down left right left right b a', () => console.log('konami code!'))

  return (
    <div ref={divRef} tabIndex={0}>
      What could the code be?
    </div>
  )
}

Available descriptors: ctrl shift alt altgr cmd enter tab space backspace escape capslock up down left right plus contextmenu delete insert pause home end numlock

Usage with vanilla JavaScript

Checkout piano-keys.

Contributing

Yes, thank you.

License

MIT