{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "shortcuts-dialog",
  "title": "Shortcuts Dialog",
  "type": "registry:block",
  "files": [
    {
      "path": "packages/registry-react/blocks/shortcuts-dialog/ShortcutsDialog.tsx",
      "content": "'use client'\n\nimport * as React from 'react'\nimport { Keyboard } from 'lucide-react'\nimport { cn } from '@/lib/utils'\nimport { Button } from '@/components/ui/button'\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n  DialogTrigger,\n} from '@/components/ui/dialog'\nimport { Kbd } from '@/components/ui/kbd'\n\nexport interface Shortcut {\n  keys: string[]\n  description: string\n}\n\nexport interface ShortcutGroup {\n  label: string\n  shortcuts: Shortcut[]\n}\n\nexport interface ShortcutsDialogProps {\n  groups?: ShortcutGroup[]\n  /** Render the built-in trigger button. */\n  trigger?: boolean\n  /** Show the 'Press Esc to close' footer hint. */\n  footer?: boolean\n  open?: boolean\n  onOpenChange?: (open: boolean) => void\n  triggerSlot?: React.ReactNode\n  className?: string\n}\n\nconst defaultGroups: ShortcutGroup[] = [\n  {\n    label: 'Navigation',\n    shortcuts: [\n      { keys: ['G', 'I'], description: 'Go to inbox' },\n      { keys: ['G', 'D'], description: 'Go to drafts' },\n      { keys: ['⌘', 'K'], description: 'Open command menu' },\n      { keys: ['⌥', '↑', '↓'], description: 'Move between items' },\n    ],\n  },\n  {\n    label: 'Actions',\n    shortcuts: [\n      { keys: ['C'], description: 'Compose new' },\n      { keys: ['/'], description: 'Focus search' },\n      { keys: ['⌘', 'S'], description: 'Save changes' },\n      { keys: ['E'], description: 'Archive selection' },\n    ],\n  },\n  {\n    label: 'General',\n    shortcuts: [\n      { keys: ['?'], description: 'Show this dialog' },\n      { keys: ['⇧', '?'], description: 'Show cheat sheet' },\n      { keys: ['Esc'], description: 'Close dialogs' },\n    ],\n  },\n]\n\nexport function ShortcutsDialog({\n  groups = defaultGroups,\n  trigger = true,\n  footer = true,\n  open,\n  onOpenChange,\n  triggerSlot,\n  className,\n}: ShortcutsDialogProps) {\n  const [internalOpen, setInternalOpen] = React.useState(false)\n  const isOpen = open !== undefined ? open : internalOpen\n\n  function setOpen(value: boolean) {\n    if (open === undefined) setInternalOpen(value)\n    onOpenChange?.(value)\n  }\n\n  return (\n    <Dialog data-slot=\"shortcuts-dialog\" open={isOpen} onOpenChange={setOpen}>\n      {trigger ? (\n        <DialogTrigger asChild>\n          <Button variant=\"outline\" size=\"sm\">\n            <Keyboard aria-hidden=\"true\" />\n            Shortcuts\n            <Kbd>?</Kbd>\n          </Button>\n        </DialogTrigger>\n      ) : (\n        triggerSlot\n      )}\n      <DialogContent className={cn('max-w-lg', className)}>\n        <DialogHeader>\n          <DialogTitle>Keyboard shortcuts</DialogTitle>\n          <DialogDescription>Move faster without leaving the keyboard.</DialogDescription>\n        </DialogHeader>\n        <div className=\"grid max-h-[60vh] gap-x-8 gap-y-6 overflow-y-auto pr-1 sm:grid-cols-2\">\n          {groups.map((group) => (\n            <div key={group.label} className=\"space-y-2\">\n              <p className=\"text-muted-foreground text-xs font-medium tracking-widest uppercase\">{group.label}</p>\n              <ul className=\"divide-y\">\n                {group.shortcuts.map((shortcut) => (\n                  <li key={shortcut.description} className=\"flex items-center justify-between gap-4 py-1.5\">\n                    <span className=\"text-sm\">{shortcut.description}</span>\n                    <span className=\"flex shrink-0 items-center gap-1\">\n                      {shortcut.keys.map((key) => (\n                        <Kbd key={key}>{key}</Kbd>\n                      ))}\n                    </span>\n                  </li>\n                ))}\n              </ul>\n            </div>\n          ))}\n        </div>\n        {footer && (\n          <DialogFooter className=\"justify-start\">\n            <p className=\"text-muted-foreground flex items-center gap-1.5 text-xs\">\n              Press <Kbd>Esc</Kbd> to close\n            </p>\n          </DialogFooter>\n        )}\n      </DialogContent>\n    </Dialog>\n  )\n}\n",
      "type": "registry:block",
      "target": "~/components/blocks/ShortcutsDialog.tsx"
    }
  ],
  "dependencies": [
    "lucide-react"
  ],
  "devDependencies": [],
  "registryDependencies": [
    "https://uipkge.dev/r/react/button.json",
    "https://uipkge.dev/r/react/dialog.json",
    "https://uipkge.dev/r/react/kbd.json"
  ],
  "description": "Linear-style keyboard reference sheet: a '?' dialog listing shortcut groups (label, description, Kbd combo) in a responsive two-column grid. Ships a built-in trigger button, controlled/uncontrolled open, custom groups via prop, and an Esc footer hint. Display only — wire real handlers in your app.",
  "categories": [
    "layout",
    "dashboard",
    "navigation"
  ]
}