react-focus-onkeydown

react-focus-onkeydown

React hook for getting focus of a component when a key is pressed anywhere in the page

Live demo

You can see the simplest demo here: Live demo

Install

$ npm install --save react-focus-onkeydown

Examples

Run examples:

cd examples
npm install
npm start

Usage

import { useRef } from 'react';
import useFocusOnKeyDown from 'react-focus-onkeydown';

const () => {
  const ref = useRef(null);
  useFocusOnKeyDown(ref);

  // Typing any key will trigger a focus on the input below
  return <input ref={ref} />;
}

Parameters

ref

Type: ref, required

ref to the target element

active

Type: boolean, default: true

Controls whether or not hook is active (i.e., whether or not a keydown will cause the element to focus)

License

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