{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "card",
  "title": "Card",
  "author": "Ballmac <https://ui.ballmac.com>",
  "description": "A composable content surface with compact spacing, an action slot, and optional interactive feedback.",
  "registryDependencies": [
    "utils"
  ],
  "files": [
    {
      "path": "registry/ballmac/components/card.tsx",
      "content": "// Ballmac UI: Card. https://ui.ballmac.com/components/card\n// Based on shadcn/ui Card (MIT, Copyright (c) 2023 shadcn), adding compact spacing and a restrained interactive surface.\nimport * as React from \"react\"\nimport { cn } from \"@/lib/utils\"\n\ntype CardProps = React.ComponentProps<\"div\"> & {\n  /** Compact spacing for dense dashboards. */\n  size?: \"default\" | \"sm\"\n  /** Add a hover and focus treatment when the card contains a link or control. */\n  interactive?: boolean\n}\nfunction Card({\n  className,\n  size = \"default\",\n  interactive = false,\n  ...props\n}: CardProps) {\n  return (\n    <div\n      data-slot=\"card\"\n      data-size={size}\n      className={cn(\n        \"group/card bg-card text-card-foreground flex min-w-0 flex-col gap-5 rounded-xl border border-border py-5 shadow-sm transition-[border-color,box-shadow,transform] duration-200 data-[size=sm]:gap-3 data-[size=sm]:py-4\",\n        interactive &&\n          \"hover:border-ring/50 hover:shadow-md focus-within:border-ring/50 motion-safe:hover:-translate-y-0.5 motion-reduce:transition-none\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\nfunction CardHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-header\"\n      className={cn(\n        \"grid min-w-0 grid-cols-[minmax(0,1fr)_auto] items-start gap-x-3 gap-y-1 px-5 group-data-[size=sm]/card:px-4\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\nfunction CardTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-title\"\n      className={cn(\"col-start-1 text-base font-semibold leading-6\", className)}\n      {...props}\n    />\n  )\n}\nfunction CardDescription({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-description\"\n      className={cn(\n        \"text-muted-foreground col-start-1 text-sm leading-relaxed\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\nfunction CardAction({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-action\"\n      className={cn(\"col-start-2 row-span-2 flex items-start gap-2\", className)}\n      {...props}\n    />\n  )\n}\nfunction CardContent({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-content\"\n      className={cn(\"min-w-0 px-5 group-data-[size=sm]/card:px-4\", className)}\n      {...props}\n    />\n  )\n}\nfunction CardFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-footer\"\n      className={cn(\n        \"flex flex-wrap items-center gap-2 border-t border-border px-5 pt-4 group-data-[size=sm]/card:px-4\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\nexport {\n  Card,\n  CardHeader,\n  CardTitle,\n  CardDescription,\n  CardAction,\n  CardContent,\n  CardFooter,\n  type CardProps,\n}\n",
      "type": "registry:ui",
      "target": "@components/ballmac/card.tsx"
    }
  ],
  "meta": {
    "schema": 1,
    "tier": "free",
    "tags": [
      "surface",
      "panel",
      "dashboard"
    ],
    "version": "1.0.0",
    "updated": "2026-09-29",
    "ai": {
      "summary": "A composable content surface with compact spacing, an action slot, and optional interactive feedback.",
      "whenToUse": [
        "Group a related set of content and actions",
        "Present a dashboard metric or settings panel"
      ],
      "whenNotToUse": [
        "Use an alert for status messages"
      ],
      "composesWith": [
        "button",
        "badge"
      ],
      "a11y": [
        {
          "keys": "Tab",
          "action": "reaches controls and links inside the card"
        }
      ],
      "customization": [
        "size: default | sm",
        "interactive: emphasize cards with controls"
      ]
    },
    "source": {
      "name": "shadcn/ui Card",
      "url": "https://github.com/shadcn-ui/ui",
      "license": "MIT",
      "copyright": "Copyright (c) 2023 shadcn",
      "modified": true
    },
    "examples": [
      "card-demo",
      "card-states"
    ],
    "url": "https://ui.ballmac.com/components/card"
  },
  "categories": [
    "data-display"
  ],
  "type": "registry:ui"
}