{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "extends": "none",
  "name": "card",
  "title": "card",
  "description": "card",
  "dependencies": [
    "tailwind-merge"
  ],
  "files": [
    {
      "path": "src/components/ui/card.tsx",
      "content": "import { twMerge } from 'tailwind-merge'\n\nexport function Card({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div\n      data-slot=\"card\"\n      className={twMerge(\n        'group/card flex flex-col gap-(--gutter) rounded-lg bg-card text-card-fg border py-(--gutter) shadow-xs [--gutter:--spacing(6)] has-[table]:overflow-hidden has-[table]:not-has-data-[slot=card-footer]:pb-0 **:data-[slot=table-header]:bg-muted/50 has-[table]:**:data-[slot=card-footer]:border-t **:[table]:overflow-hidden',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport interface HeaderProps extends React.HTMLAttributes<HTMLDivElement> {\n  title?: string\n  description?: string\n}\n\nexport function CardHeader({ className, title, description, children, ...props }: HeaderProps) {\n  return (\n    <div\n      data-slot=\"card-header\"\n      className={twMerge(\n        'grid auto-rows-min grid-rows-[auto_auto] items-start gap-1 px-(--gutter) has-data-[slot=card-action]:grid-cols-[1fr_auto]',\n        className\n      )}\n      {...props}\n    >\n      {title && <CardTitle>{title}</CardTitle>}\n      {description && <CardDescription>{description}</CardDescription>}\n      {!title && typeof children === 'string' ? <CardTitle>{children}</CardTitle> : children}\n    </div>\n  )\n}\n\nexport function CardTitle({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"card-title\"\n      className={twMerge('text-balance font-display font-semibold text-base/6', className)}\n      {...props}\n    />\n  )\n}\n\nexport function CardDescription({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div\n      {...props}\n      data-slot=\"card-description\"\n      className={twMerge('row-start-2 text-pretty text-muted-fg text-sm/6', className)}\n      {...props}\n    />\n  )\n}\n\nexport function CardAction({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div\n      data-slot=\"card-action\"\n      className={twMerge(\n        'col-start-2 row-span-2 row-start-1 self-start justify-self-end',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport function CardContent({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div\n      data-slot=\"card-content\"\n      className={twMerge('px-(--gutter) has-[table]:border-t', className)}\n      {...props}\n    />\n  )\n}\n\nexport function CardFooter({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div\n      data-slot=\"card-footer\"\n      className={twMerge(\n        'flex items-center px-(--gutter) group-has-[table]/card:pt-(--gutter) [.border-t]:pt-6',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}