use-konami
TypeScript icon, indicating that this package has built-in type declarations

1.0.1 • Public • Published

use-konami

A zero dependency React hook that listens for a sequence of key presses to unlock a feature. This is usually referred to as an easter egg. The default sequence is commonly known as the Konami Code: b a.

NPM Version NPM Total Downloads License Build Status Coverage Demo

Installation

yarn add use-konami

Usage

import useKonami from 'use-konami';

const Demo = () => {
  useKonami({
    onUnlock: () => console.log('Unlocked 30 extra lives'),
  });

  return (
    <div>useKonami Demo</div>
  );
};

Check out the demo

Options

onUnlock: (event: KeyboardEvent) => void The callback when the sequence has been completed and the secret unlocked

sequence: string[] An optional key sequence to use instead of the default Konami Code. This should be an array of strings that correspond to key events.

onReset: (distance: number, event: KeyboardEvent) => void An optional callback when a portion of the sequence has been completed, but reset before being unlocked. The callback is invoked with total distance through the sequence. For example, it would be invoked with 3 if the they successfully pressed the first 3 keys in the sequence before pressing an incorrect key.

onKeyPress: (key: string, index: number, event: KeyboardEvent) => void An optional callback when a key in the sequence is pressed.

target: HTMLElement An optional target element to listen to events. The default is the window object.

Package Sidebar

Install

npm i use-konami

Weekly Downloads

801

Version

1.0.1

License

MIT

Unpacked Size

14.3 kB

Total Files

7

Last publish

Collaborators

  • chris.feist