<pacem-shortcut> binds a key combination to an action: the "press / to search" of GitHub and YouTube, the Ctrl+S of every editor. Declare the combination, handle execute.

<pacem-shortcut combination="/" on-execute="#search.focus()"></pacem-shortcut>
<pacem-shortcut combination="ctrl+s" on-execute="#editor.save()"></pacem-shortcut>

Usage

Write the combination. Modifiers first, joined by +: ctrl, alt (or option), shift, win (or cmd), then the key. Case doesn't matter; esc, back, del and the bare arrow names (up, left…) are accepted aliases.

<pacem-shortcut combination="ctrl+shift+l"></pacem-shortcut>

Modifiers must match exactly: ctrl+s doesn't fire on Ctrl+Shift+S. And the key is the character the keyboard produces (evt.key), so ? is shift+? on most layouts.

Chain keys. Comma-separated keys form a sequence, typed one after the other (Gmail's g, i "go to inbox"):

<pacem-shortcut combination="g, i" on-execute="#router.navigate('/mail/inbox')"></pacem-shortcut>

Scope it. By default it listens on the whole window; set target to listen on one element (and its descendants) only. On a match, the key's default action is prevented: Ctrl+S saves your way, not the browser's.

Pacem fields keep plain keystrokes to themselves: a window-wide / or g, i doesn't fire while typing in one. Ctrl/Alt/Cmd combinations bubble instead, so a window-wide Ctrl+S keeps working from inside an editor. Plain <input>s don't have this guard: scope single-key shortcuts away from them.

Examples

Save with Ctrl+S

While you type in the editor, Ctrl+S saves the draft instead of opening the browser's "save page".

Gmail-style chords

g then i goes to the inbox, g then s to the starred ones: each shortcut is a two-key sequence.