ShortcutSheet
Generated modal inventory of registered shortcuts, grouped by their application labels.@gemologic/sheen · applicationPlayground
<ShortcutProvider platform="other" development={true}><ShortcutSheet title="Keyboard shortcuts" trigger="Keyboard shortcuts" /></ShortcutProvider>Variant matrix
Discoverable keyboard help
Anatomy
- Package
@gemologic/sheen- Source
packages/ui/src/primitives/ShortcutSheet.tsx- Tokens
--sheen-space-block-sm--sheen-space-inline-sm
Accessibility
Role: dialogKeyboard: Tab, Shift+Tab, EscapeDo
- Mount inside ThemeProvider and ShortcutProvider.
- Provide a visible trigger even when question-mark opening is enabled.
- Let Dialog suspend outer scopes; use a unique shortcutScope for any sheet-specific bindings.
Do not
- Do not assume this inventory implies every scope is active.
- Do not treat displayed shortcuts as the only means of executing an action.
Generated props
| Name | Type | Default | Description |
|---|---|---|---|
title * | string | — | Accessible dialog title. |
contentId | string | — | Optional stable content element ID for an external aria-controls relationship. Must be unique in the document. |
trigger | string | — | Visible label for the opening button. |
description | string | — | Optional explanatory text associated with the dialog. |
open | boolean | — | Controlled open state; rejected close requests retain the modal. |
defaultOpen | boolean | false | Uncontrolled initial open state; portal content mounts when the theme target is ready. |
onOpenChange | ((open: boolean) => void) | undefined | — | Requests a change in open state without mutating controlled ownership. |
dismissible | boolean | true | Allows Escape, outside press, and the close action; false disables all three. |
closeLabel | string | — | Visible and accessible close-action label; defaults to the scoped close message. |
initialFocus | (() => HTMLElement | undefined) | undefined | — | Resolves an enabled focus target inside the mounted dialog. |
returnFocus | (() => HTMLElement | undefined) | undefined | — | Optional surviving focus target after closing, useful for triggerless dialogs. |
shortcutScope | string | — | Unique modal shortcut scope ID, defaulting to an internal stable ID. Within ShortcutProvider, opening suspends outer scopes automatically. Register modal actions under this ID; do not reuse an application/global scope. |
class | string | — | Additional classes on modal content. |
footer | JSX.Element | — | App-owned footer actions beside the built-in close action. |