{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "kbd",
  "type": "registry:item",
  "title": "Kbd",
  "description": "A component for displaying keyboard keys and shortcuts.",
  "files": [
    {
      "path": "registry/brook/ui/kbd/kbd.tsx",
      "content": "import { cva, type VariantProps } from \"class-variance-authority\";\nimport { Command } from \"lucide-react\";\nimport { cn } from \"@/lib/utils\";\nimport styles from \"./kbd.module.css\";\n\nconst kbdVariants = cva(styles.kbd, {\n  variants: {\n    size: {\n      sm: styles.sm,\n      md: styles.md,\n      lg: styles.lg,\n    },\n  },\n  defaultVariants: {\n    size: \"md\",\n  },\n});\n\nfunction Kbd({ className, size, children, ...props }: React.ComponentProps<\"kbd\"> & VariantProps<typeof kbdVariants>) {\n  const isCommandKey = typeof children === \"string\" && (children === \"⌘\" || children.toLowerCase() === \"ctrl\");\n\n  const sizeMap = {\n    sm: 11,\n    md: 13,\n    lg: 15,\n  };\n\n  const iconSize = sizeMap[size || \"md\"];\n\n  return (\n    <kbd className={cn(kbdVariants({ size }), isCommandKey && styles.commandKey, className)} data-slot=\"kbd\" {...props}>\n      {isCommandKey ? <Command size={iconSize} strokeWidth={2.5} /> : children}\n    </kbd>\n  );\n}\n\nexport { Kbd };\n",
      "type": "registry:file",
      "target": "~/components/ui/kbd/kbd.tsx"
    },
    {
      "path": "registry/brook/ui/kbd/kbd.module.css",
      "content": ".kbd {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  font-family:\n    ui-monospace, SFMono-Regular, \"SF Mono\", Menlo, Monaco, Consolas,\n    \"Liberation Mono\", \"Courier New\", monospace;\n  font-weight: 550;\n  line-height: 1;\n  white-space: nowrap;\n  border: none;\n  border-radius: 2px;\n  background: var(--card);\n  box-shadow:\n    inset 0 0 0 1px rgba(0, 0, 0, 0.06),\n    0 2px 0 0 var(--muted);\n  color: var(--foreground);\n  transition: all 150ms ease;\n}\n\n.commandKey {\n  font-size: 1.15em;\n}\n\n.kbd:focus-visible {\n  outline: 2px solid var(--ring);\n  outline-offset: 2px;\n}\n\n.sm {\n  min-width: 1.25rem;\n  height: 1.25rem;\n  padding: 0 0.25rem;\n  font-size: 0.625rem;\n}\n\n.md {\n  min-width: 1.5rem;\n  height: 1.5rem;\n  padding: 0 0.375rem;\n  font-size: 0.75rem;\n}\n\n.lg {\n  min-width: 2rem;\n  height: 2rem;\n  padding: 0 0.5rem;\n  font-size: 0.875rem;\n}\n",
      "type": "registry:file",
      "target": "~/components/ui/kbd/kbd.module.css"
    }
  ]
}