react-onenterkeydown

React to enter key down events higher order component

DEPRECATED

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));

Live demo

You can see the simplest demo here: Live demo

Install

$ npm install --save react-onenterkeydown

Examples

Run examples:

cd examples
npm install
npm start

Usage

react-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.

Props

onEnterKeyDown

Type: function, default: undefined

Defines an event handler for when the enter key is pressed on the wrapped component

TODO

• Beter design on example

License

See the LICENSE file for license rights and limitations (MIT).