Keyboard Shortcut

Displays platform-aware key combinations and registers matching keyboard listeners.

@rivetui/keyboard-shortcut

Preview

Explore each composition interactively, then open its code in the same context.

Render typed key combinations anywhere an action needs a compact keyboard hint.

Note

mod resolves to Command on macOS and Control on Windows or Linux unless platform is set explicitly.

Open command barCtrlK⌘K

Open projectCtrlP⌘P

Run build taskShiftCtrlB⇧⌘B

Override the platform for documentation or show compact navigation keys without separate examples.

macOS⌘⇧PWindowsCtrlShiftP

↑↑↓↓↵↵EscEsc

Use the matching hook when the displayed shortcut should also trigger an action.

Note

Editable controls are ignored by default so global shortcuts do not interrupt typing.

CtrlShiftL⌘⇧LPress to test the global listener.

Waiting

Registry

Add the component source and its declared dependencies with the shadcn CLI.

Install component

$bunx --bun shadcn@latest add @rivetui/keyboard-shortcut

Public interface

Component-specific props are listed here. Native element and Base UI props continue to pass through.

Prop	Type	Default
`keys`	`readonly [KeyboardShortcutKey, ...KeyboardShortcutKey[]]`	`—`
`size`	`"sm" \| "md"`	`"md"`
`platform`	`"auto" \| "mac" \| "windows" \| "linux"`	`"auto"`
`aria-label`	`string`	`generated`

Render KeyboardShortcutScript once in the root layout's <head> to resolve automatic platform labels before the first paint.

Prop	Type	Default
`nonce`	`string`	`—`

Parameter	Type	Default
`keys`	`KeyboardShortcutKeys`	`required`
`onTrigger`	`(event: KeyboardEvent) => void`	`required`
`options`	`UseKeyboardShortcutOptions`	`{}`