41 lines
1.2 KiB
Markdown
41 lines
1.2 KiB
Markdown
# 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
|
|
|
|
```bash
|
|
npm install hyperf-keybinds
|
|
```
|
|
|
|
## Quick Start
|
|
|
|
```ts
|
|
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
|