ns-ui
A keyboard-shortcut cheat sheet whose keycaps press themselves — matching keydowns depress the cap and are swallowed before the app behind it can react.
Use when an overlay listing keyboard shortcuts where pressing a listed combination should depress its keycap and be swallowed before the app behind can react, so the sheet doubles as a safe place to try them; pick tour-spotlight instead when the user needs walking around the interface rather than shown its bindings, or copy-field-crimp when the value is meant to be copied out rather than pressed.
Install
npx shadcn add https://design.helpmarq.comns-ui / shortcuts-cheat-sheet — the sheet presses its own keys
| Prop | Type | Default | Description |
|---|---|---|---|
| sections | QuickKeySection[] | — | Grouped shortcut list. Rendered in order; sections flow into `columns`. |
| open? | boolean | — | Controlled open state. Omit to run uncontrolled from `defaultOpen`. |
| defaultOpen? | boolean | — | Uncontrolled initial state. Ignored when `open` is passed. |
| onOpenChange? | (open: boolean) => void | — | Fired for every close the platform can originate: Escape, backdrop, the close button. |
| title? | string | — | — |
| columns? | 1 | 2 | — | — |
| liveEcho? | boolean | — | Match real keydowns and flash the matching caps. Default true. |
| echoDuration? | number | — | How long a cap stays depressed, ms. Default 180. |
| className? | string | — | — |