Docs
Cloudflare
CodeRabbit
Railway
AG Grid
WorkOS
Netlify
Clerk
SerpAPI
OpenRouter
Unkey
Electric
Prisma
Sentry
Cloudflare
CodeRabbit
Railway
AG Grid
WorkOS
Netlify
Clerk
SerpAPI
OpenRouter
Unkey
Electric
Prisma
Sentry
Hotkeys API Reference
Hotkey Sequence API Reference
Key hold & held keys API Reference
Hotkey Recorder API Reference
Hotkey Sequence Recorder API Reference
Normalization & format API Reference
Hotkeys API Reference

createHotkeys

Function: createHotkeys()

ts
function createHotkeys(hotkeys, commonOptions): void;
function createHotkeys(hotkeys, commonOptions): void;

Defined in: createHotkeys.ts:66

SolidJS primitive for registering multiple keyboard hotkeys at once.

Uses the singleton HotkeyManager for efficient event handling. Accepts a dynamic array of hotkey definitions, making it safe to use with variable-length lists.

Options are merged in this order: HotkeysProvider defaults < commonOptions < per-definition options

Parameters

hotkeys

Array of hotkey definitions, or accessor returning them

CreateHotkeyDefinition[] | () => CreateHotkeyDefinition[]

commonOptions

Shared options applied to all hotkeys, or accessor

CreateHotkeyOptions | () => CreateHotkeyOptions

Returns

void

Examples

tsx
function Editor() {
  createHotkeys([
    { hotkey: 'Mod+S', callback: () => save() },
    { hotkey: 'Mod+Z', callback: () => undo() },
    { hotkey: 'Escape', callback: () => close() },
  ])
}
function Editor() {
  createHotkeys([
    { hotkey: 'Mod+S', callback: () => save() },
    { hotkey: 'Mod+Z', callback: () => undo() },
    { hotkey: 'Escape', callback: () => close() },
  ])
}
tsx
function MenuShortcuts(props) {
  createHotkeys(
    () => props.items.map((item) => ({
      hotkey: item.shortcut,
      callback: item.action,
      options: { enabled: item.enabled },
    })),
    { preventDefault: true },
  )
}
function MenuShortcuts(props) {
  createHotkeys(
    () => props.items.map((item) => ({
      hotkey: item.shortcut,
      callback: item.action,
      options: { enabled: item.enabled },
    })),
    { preventDefault: true },
  )
}