Big update!Introducing GitHub Bot Commands. Learn more
Socket
Log inDemoInstall

react-keybinding-component

Package Overview
Dependencies
1
Maintainers
1
Versions
13
Issues
File Explorer

Advanced tools

react-keybinding-component

A React keybinding component

    1.0.0latest
    Github

Version published
Maintainers
1
Weekly downloads
2,314
decreased by-6.35%

Weekly downloads

Changelog

Source

1.0.0

  • Library re-written in TypeScript
  • onKey is now required

Readme

Source

react-keybinding-component

A React keybinding component, usable with es6, no mixin

Description

react-keybinding-component is a component that will help you set up keybindings in your app. For the moment, only simple key events are supported (one key only, keyup, keydown). It's just a less dirty way of using key events instead of having care of them with componentDidMount() in multiple components.

Examples

Import it in your project:

import KeyBinding from 'react-keybinding-component'; // ES6 var KeyBinding = require('react-keybinding-component'); // ES5

Get the eventKey keyCode and log it

<KeyBinding onKey={ (e) => { console.log(e.keyCode) } } />

Get the eventKey keyCode and log it on keyUp on the window element

<KeyBinding onKey={ (e) => { console.log(e.keyCode) } } type='keyup' elem={ window } />

Have a look at options.

Options

All properties except onKey are optional.

PropertyDescriptionDefault value
onKey (required)the function executed after a key event() => {}
typekeyup or keydown'keydown'
targetthe element you want to attach the event to, it can be an existing DOM element or a CSS selector (in that case, you will need to add a tabIndex='0' to your element, otherwise the event won't be caught)document
preventInputConflictprevent onKey from firing if you have an onChange on an input, a textarea or a selectfalse
preventDefaultprevent event defaultfalse
preventPropagationprevent event propagationfalse

Keywords

FAQs

What is react-keybinding-component?

A React keybinding component

Is react-keybinding-component popular?

The npm package react-keybinding-component receives a total of 2,239 weekly downloads. As such, react-keybinding-component popularity was classified as popular.

Is react-keybinding-component well maintained?

We found that react-keybinding-component demonstrated a not healthy version release cadence and project activity because the last version was released a year ago.It has 1 open source maintainer collaborating on the project.

Last updated on 22 Nov 2018

Did you know?

Socket installs a Github app to automatically flag issues on every pull request and report the health of your dependencies. Find out what is inside your node modules and prevent malicious activity before you update the dependencies.

Install Socket
Socket[email protected]

Product

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc