keybinds

Declarative, contextual keybindings for the web. Zero dependencies.

Install

Not yet published on npm. Install from source:

git clone https://github.com/pterror/keybinds.git
cd keybinds
npm link
# Then in your project:
npm link keybinds

Usage

import { keybinds, keys, registerComponents } from 'keybinds'
import 'keybinds/styles/palette.css'

const commands = [
  {
    id: 'save',
    label: 'Save document',
    category: 'File',
    keys: ['$mod+s'],
    execute: () => save()
  }
]

keybinds(commands, undefined, { inputs: [keys()] })

// Optional: UI components (palette, cheatsheet, context menu, settings)
registerComponents()
document.querySelector('keybinds-command-palette').commands = commands

$mod maps to Cmd on Mac, Ctrl elsewhere.

Features

• Schema-driven — define bindings as data, separate triggers from handlers
• Context-aware — commands activate based on application state
• User-rebindable — BindingsStore persists overrides to localStorage, or to any storage you give it
• Discoverable — built-in <keybinds-command-palette>, <keybinds-cheatsheet>, <keybinds-basic-context-menu>/<keybinds-context-menu>, and <keybinds-settings> components
• Framework-agnostic — pure JS core, works anywhere

Docs

pterror.github.io/keybinds

License

MIT