hyperf-keybinds

hyperf-keybinds

Handle keybind sequences in your app. You can have branches of sequences, the only restriction being that one sequence cannot be a strict subset of another.

Install

npm install hyperf-keybinds

Quick Start

import { createKeyHandler, ModifierKey, KeybindEvent} from 'hyperf-keybinds';

// Define commands
const commands = [
  { command: [{ key: 'KeyS', modifiers: [ModifierKey.Control] }], callback: () => console.log('Ctrl+S!') },
  { command: [{ key: 'KeyA', modifiers: []}, { key: 'KeyS', modifiers: []}], callback: () => console.log('a - s!')}
];

// Create handler
const {handler, emitter, success} = createKeyHandler(commands, 5000);

// Success is false if you provided invalid sequences.
if (success)
{
  window.addEventListener('keydown', handler);

  // Listen to events
  emitter.on((event : KeybindEvent)  => console.log(event.type, event));
}

Now Ctrl+S triggers your callback and emits events. Pressing a then s triggers a separate callback. Timeout (default 5000) can be observed by just pressing key A.

Key codes can be looked up here: https://developer.mozilla.org/en-US/docs/Web/API/UI_Events/Keyboard_event_code_values