React to enter key down events higher order component
This was originally used in a personal project along with other HoCs. However, with the realease of hooks, HoCs have become much less useful and this one in particular is very redundant and pointless to maintain. Please replace by a higher order function as follows:
const ifEnter = func => e => {
if (e.which === 13) func(e);
}
import { ifElse, propEq, always } from 'ramda';
// or even more concise, with something like ramda
const ifEnter = func => ifElse(propEq('which', 13), func, always(null));You can see the simplest demo here: Live demo
$ npm install --save react-onenterkeydown
Run examples:
cd examples
npm install
npm startreact-onenterkeydown adds an onEnterKeyDown prop to a component with supports onKeyDown property, such as the html input component:
import React, { propTypes } from 'react';
import onEnter from 'react-onenterkeydown';
const logEnter = () => {
console.log('The enter key has been pressed');
}
const EnhancedInput = onEnter("input");
const () => (
<EnhancedInput onEnterKeyDown={logEnter} />
)If onKeyDown is passed in addition to onEnterKeyDown, it will execute as well after the enter event.
Type: function, default: undefined
Defines an event handler for when the enter key is pressed on the wrapped component
- Beter design on example
See the LICENSE file for license rights and limitations (MIT).