Keyboard Help Dialog
Keyboard shortcuts reference dialog with two columns of grouped Kbd combos, a search bar, and a roadmap note that remapping is not yet available.
Keyboard shortcuts reference dialog with two columns of grouped Kbd combos, a search bar, and a roadmap note that remapping is not yet available.
The Application Collection unlocks the source for every Application block. All Access unlocks every Collection.
Already purchased? Log in
Keyboard Help Dialog is the static blueprint rendered open over a scrim. Two columns divide four shortcut groups: Navigation (Go to dashboard G D, Search anything Cmd K), Global (Open keyboard help ?, Toggle sidebar Cmd ), Editing (Save changes Cmd S, Undo Cmd Z, Bold Cmd B), and Actions (New item C, Delete selected Del, Duplicate Cmd D). A search bar at the top filters by label. The footer muted note reads: Custom key remapping is on the roadmap. For now all shortcuts are global defaults and cannot be changed, paired with a Roadmap badge.
Two const arrays, leftGroups and rightGroups, each hold a typed ShortcutGroup with a title and a shortcuts list. The roadmap note is the honest admission that sets the right expectation upfront, before anyone files a feature request.
Reach for this block as the ? keybinding handler, shown as a static overlay in your dialog system. Filter the shortcut list client-side against the search input and hide groups that match nothing.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the global shortcut reference. Other keyboard help dialogs:
Tip: group shortcuts by task not by modifier key; users scan by what they want to do, not by which finger to hold down.