Docs
CodeRabbit
Cloudflare
Railway
Clerk
Netlify
OpenRouter
WorkOS
SerpAPI
AG Grid
Unkey
Sentry
Electric
Prisma
CodeRabbit
Cloudflare
Railway
Clerk
Netlify
OpenRouter
WorkOS
SerpAPI
AG Grid
Unkey
Sentry
Electric
Prisma
API Reference
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

createHotkeysAttachment

Function: createHotkeysAttachment()

ts
function createHotkeysAttachment(hotkeys, commonOptions): Attachment<HTMLElement>;
function createHotkeysAttachment(hotkeys, commonOptions): Attachment<HTMLElement>;

Defined in: packages/svelte-hotkeys/src/createHotkeys.svelte.ts:189

Create an attachment for element-scoped multi-hotkey registration.

Parameters

hotkeys

MaybeGetter<CreateHotkeyDefinition[]>

commonOptions

MaybeGetter<CreateHotkeyOptions> = {}

Returns

Attachment<HTMLElement>

Example

svelte
<script lang="ts">
  import { createHotkeysAttachment } from '@tanstack/svelte-hotkeys'

  const editorKeys = createHotkeysAttachment([
    { hotkey: 'Mod+S', callback: () => save() },
    { hotkey: 'Mod+Z', callback: () => undo() },
  ])
</script>

<div tabindex="0" {@attach editorKeys}>
  Editor content
</div>
<script lang="ts">
  import { createHotkeysAttachment } from '@tanstack/svelte-hotkeys'

  const editorKeys = createHotkeysAttachment([
    { hotkey: 'Mod+S', callback: () => save() },
    { hotkey: 'Mod+Z', callback: () => undo() },
  ])
</script>

<div tabindex="0" {@attach editorKeys}>
  Editor content
</div>