Components

ShortcutsSheet

Attio's own "Keyboard shortcuts" panel — every shortcut, grouped by section, as Kbd chips.

Available since@crisp-ui-kit/crisp@0.57.4

Attio's own "Keyboard shortcuts" panel (crisp#615, parity row P-106), reached via Help → "Shortcuts" — every shortcut Attio documents, grouped by section, each row's key combo as Kbd chips. Live-measured off app.attio.com/techpartners: a Drawer narrowed to 360px, a simultaneous combo (⌘K) as adjacent chips with no separator, a sequential shortcut (G then H) with a "then" connector between its two steps.

Installation

npm install @crisp-ui-kit/crisp

Props

Prop

Type

Notes

  • sections defaults to defaultShortcutSections — Attio's own 34-row canonical list across General / Record page / Table view / Help. Swap in your own array (translated, or your app's own shortcuts) wholesale, the same way Command's own default items work.
  • A ShortcutRow's steps is React.ReactNode[][]: one array per simultaneous combo, more than one array for a sequential shortcut. The Enter/Return key renders as an icon (CornerDownLeft), matching Attio's own aria-label="enter" glyph.

On this page