[Integration] useHotkey system composable

[johnleider]

Summary

Integration improvements for useHotkey with the v0 system.

Research Findings

v0 Implementation (Production-Ready)

Advanced Features:

• Key Combinations: ctrl+k, shift+enter, alt+s, meta+a
• Key Sequences: g-h (GitHub-style), ctrl+k-p
• Platform-Aware: cmd → meta on Mac, ctrl on others
• Input Focus Detection: Skips when input/textarea/contenteditable focused
• ARIA Roles: textbox, searchbox, combobox, spinbutton support
• Key Aliases: Comprehensive normalization (esc→escape, space→' ', etc.)
• State Control: isActive, isPaused, pause(), resume(), stop()
• Sequence Timeout: Configurable reset (default 1000ms)

Vuetify 3 Comparison

Feature	v0	Vuetify 3 useHotkey
Combinations	✅	✅
Sequences	✅ GitHub-style	✅ Basic
Pause/resume	✅ Full control	❌ No
State tracking	✅ isActive, isPaused	❌ No
Input focus skip	✅ ARIA-aware	⚠️ Basic
Key aliases	✅ Comprehensive file	⚠️ Inline
Return value	✅ Controls object	❌ Cleanup only

Use Cases for Vuetify 3

VCombobox/VMenu Integration:

const isOpen = ref(false)
const { pause, resume } = useHotkey('escape', closeMenu, { inputs: true })

watch(isOpen, open => {
  open ? resume() : pause()
})

Command Palette:

useHotkey('ctrl+k', openCommandPalette)
useHotkey('g-h', () => router.push('/home'))  // GitHub-style

Integration Points

• Built on useEventListener
• ARIA-aware input detection
• Comprehensive key alias system
• Document usage with VMenu, VCombobox
• Create command palette example

Status

✅ Production-ready - Significant advantage over V3

[johnleider]

Closed — production-ready, significant advantage over V3. Docs tracked separately.