{
  "$schema": "https://uipkge.dev/schema/registry-item.json",
  "name": "kbd",
  "title": "Kbd",
  "type": "registry:ui",
  "files": [
    {
      "path": "packages/registry-svelte/components/kbd/Kbd.svelte",
      "content": "<script lang=\"ts\" module>\n  import type { Snippet } from 'svelte'\n  import type { HTMLAttributes } from 'svelte/elements'\n\n  export interface KbdProps extends HTMLAttributes<HTMLElement> {\n    children?: Snippet\n    ref?: HTMLElement | null\n  }\n</script>\n\n<script lang=\"ts\">\n  import { cn } from '$lib/utils'\n\n  let { class: className, children, ref = $bindable(null), ...restProps }: KbdProps = $props()\n</script>\n\n<kbd\n  bind:this={ref}\n  data-uipkge=\"\"\n  data-slot=\"kbd\"\n  class={cn(\n    'bg-muted text-muted-foreground pointer-events-none inline-flex h-5 min-w-5 items-center justify-center gap-1 rounded border px-1.5 font-mono text-xs font-medium select-none',\n    className,\n  )}\n  {...restProps}\n>\n  {@render children?.()}\n</kbd>\n",
      "type": "registry:ui",
      "target": "~/src/lib/components/ui/kbd/Kbd.svelte"
    },
    {
      "path": "packages/registry-svelte/components/kbd/index.ts",
      "content": "export { default as Kbd, type KbdProps } from './Kbd.svelte'\n",
      "type": "registry:ui",
      "target": "~/src/lib/components/ui/kbd/index.ts"
    }
  ],
  "dependencies": [],
  "devDependencies": [],
  "registryDependencies": [],
  "description": "Inline keyboard-key indicator — renders a single key or shortcut in monospace with a subtle bordered chip.",
  "categories": [
    "data-display"
  ]
}