{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "kbd",
  "type": "registry:ui",
  "title": "Kbd",
  "description": "The key cap for a real shortcut, such as ⌘K or esc. One chip everywhere, in Geist Mono.",
  "registryDependencies": [
    "https://littmd.vercel.app/r/litt.json"
  ],
  "files": [
    {
      "path": "registry/litt/ui/kbd.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\n// @litt/kbd 2026.11.06. What changed: https://littmd.vercel.app/changelog.md\n\n/**\n * Kbd: the key cap for a real shortcut (⌘K, ↵, esc). Never decoration.\n *\n * - One cap everywhere: a 20px box at rounded-litt-control, Geist at weight 400 in\n *   fg-subtle. A <kbd> is mono by default, so the cap sets font-sans. The\n *   tooltip, the command menu footer, the button hint and the tabs legend all\n *   render this component and nothing else.\n * - Material (R3, material.md 6): a key cap is the smallest raised block\n *   (--litt-block, --litt-key-lift: the block's lift with a darker lower edge), so it\n *   reads as a key and not a tag. That edge is a shade, never light, so it\n *   stays dark in both themes (R2). It keeps a border in forced colors.\n * - Flat (proposals/flat-pill.md): plain text. No fill, no cast, no side padding, in --litt-fg-muted.\n * - The size is the caption step (12px), on the type scale like every other label.\n * - shrink-0 so it never squashes in a flex row; min-w-5 keeps a lone glyph square.\n * - Static: no motion and no states. It is a real <kbd>, so whether a hint is\n *   hidden from screen readers is the caller's call.\n */\nimport type { ReactNode } from \"react\";\n\nconst chip =\n  \"inline-grid h-5 min-w-5 shrink-0 place-items-center rounded-litt-control bg-litt-block px-1 \" +\n  \"font-litt-sans font-normal text-litt-caption text-litt-fg-subtle shadow-(--litt-key-lift) forced-colors:border \" +\n  \"in-[[data-material=flat]]:bg-transparent in-[[data-material=flat]]:px-0 in-[[data-material=flat]]:text-litt-fg-muted in-[[data-material=flat]]:shadow-none\";\n\n/** One key cap, or one chord written in glyphs, such as ⇧⌘C. Keys pressed one after another each get their own Kbd, 4px apart. */\nexport function Kbd({\n  children,\n}: {\n  /** The key as people read it: a glyph (⌘, ↵, ⌫, ←), a chord of glyphs (⇧⌘C) or a short word (esc, tab). */\n  children: ReactNode;\n}) {\n  return <kbd className={chip}>{children}</kbd>;\n}\n",
      "target": "components/litt/kbd.tsx"
    }
  ],
  "docs": "Import Kbd from components/litt/kbd. Use it for real shortcuts only.",
  "meta": {
    "version": "2026.11.06",
    "released": "2026-11-06",
    "changelog": "https://littmd.vercel.app/changelog.md"
  }
}
