v0.2.0

Full Changelog: v0.1.0...v0.2.0

v0.1.0

React hooks for keyboard shortcuts with runtime editing and key capture.

Features

Hooks

• useHotkeys(keymap, handlers, options?) - Register keyboard shortcuts with a two-map API separating key definitions from handlers
• useRecordHotkey(options?) - Capture key combinations from user input with live feedback
• useEditableHotkeys(defaults, handlers, options?) - Wraps useHotkeys with localStorage persistence, conflict detection, and edit functionality

Components

• <ShortcutsModal> - Display all shortcuts in a modal (auto-registers ? to open), supports grouping by action prefix
• <KeybindingEditor> - Table UI for viewing/editing keybindings with conflict detection and reset-to-defaults

Utilities

• formatCombination() - Platform-aware display (⌘⇧K on Mac, Ctrl+Shift+K elsewhere)
• parseCombinationId() - Parse "ctrl+shift+k" back to KeyCombination
• findConflicts() / hasConflicts() - Detect multiple actions bound to same key

Installation

pnpm add @rdub/use-hotkeys

Quick Start

import { useHotkeys } from '@rdub/use-hotkeys'

useHotkeys(
  { 't': 'setTemp', 'ctrl+s': 'save', 'shift+?': 'showHelp' },
  { setTemp: () => setMetric('temp'), save: handleSave, showHelp: () => setShowHelp(true) }
)

Full Changelog: v0.0.1...v0.1.0

v0.0.1

Initial Release 🎉

A React hook for declarative keyboard shortcuts with support for:

• useHotkeys - Register keyboard shortcuts with a simple API
• useEditableHotkeys - Same as useHotkeys, but with runtime-editable keybindings
• ShortcutsModal - Ready-to-use modal for displaying and editing shortcuts
• KeybindingEditor - Inline component for capturing new keybindings

Features

• Modifier key support (Ctrl, Alt, Shift, Meta)
• Shifted character matching (?, !, @, etc.)
• Enable/disable shortcuts based on conditions
• Session storage persistence for edited keybindings
• TypeScript support

Example

import { useHotkeys } from '@rdub/use-hotkeys'

function App() {
  useHotkeys({
    'ctrl+s': () => save(),
    '?': () => showHelp(),
  })
  // ...
}

Installation

npm install @rdub/use-hotkeys
# or
pnpm add @rdub/use-hotkeys