{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "card",
  "type": "registry:ui",
  "title": "Card، CardHeader، CardMedia، CardTitle، CardDescription، CardBody، CardFooter",
  "description": "کارت",
  "registryDependencies": [
    "https://kashi.sepantapouya.com/r/cx.json"
  ],
  "files": [
    {
      "path": "registry/kashi/Card.tsx",
      "type": "registry:ui",
      "target": "components/kashi/Card.tsx",
      "content": "\"use client\";\n\nimport { forwardRef, type ElementType, type HTMLAttributes, type ImgHTMLAttributes, type ReactNode } from \"react\";\nimport { cx } from \"./cx\";\n\nexport interface CardProps extends HTMLAttributes<HTMLElement> {\n  /** @default \"article\" */\n  as?: ElementType;\n  /** بدون سایه */\n  flat?: boolean;\n  /** کارت قابل‌کلیک؛ یک لینک یا دکمه با کلاس k-card__link داخلش بگذارید */\n  interactive?: boolean;\n  /** «outlined» حاشیه و سایهٔ کم، «elevated» سایهٔ بیشتر، «filled» پس‌زمینهٔ خاکستری بدون سایه @default \"outlined\" */\n  variant?: \"outlined\" | \"elevated\" | \"filled\";\n  /** فاصلهٔ داخلی بخش‌ها @default \"md\" */\n  padding?: \"none\" | \"sm\" | \"md\" | \"lg\";\n}\n\nexport const Card = forwardRef<HTMLElement, CardProps>(function Card(\n  { as: Tag = \"article\", flat = false, interactive = false, variant = \"outlined\", padding = \"md\", className, ...rest },\n  ref,\n) {\n  return (\n    <Tag\n      ref={ref}\n      data-variant={variant}\n      className={cx(\"k-card\", flat && \"k-card--flat\", interactive && \"k-card--interactive\", variant !== \"outlined\" && `k-card--${variant}`, padding !== \"md\" && `k-card--pad-${padding}`, className)}\n      {...rest}\n    />\n  );\n});\n\nexport interface CardHeaderProps extends HTMLAttributes<HTMLElement> {\n  as?: ElementType;\n  /** دکمه یا منو در انتهای سربرگ */\n  actions?: ReactNode;\n}\n\n/** سربرگ کارت؛ با actions، عنوان و توضیح در یک ستون و عمل‌ها در انتها قرار می‌گیرند */\nexport const CardHeader = forwardRef<HTMLElement, CardHeaderProps>(function CardHeader({ as: Tag = \"header\", actions, className, children, ...rest }, ref) {\n  if (!actions) return <Tag ref={ref} className={cx(\"k-card__header\", className)} {...rest}>{children}</Tag>;\n  return (\n    <Tag ref={ref} className={cx(\"k-card__header\", \"k-card__header--actions\", className)} {...rest}>\n      <div className=\"k-card__heading\">{children}</div>\n      <div className=\"k-card__actions\">{actions}</div>\n    </Tag>\n  );\n});\n\nexport interface CardMediaProps extends ImgHTMLAttributes<HTMLImageElement> {\n  /** نسبت ابعاد، مثل \"16 / 9\" @default \"16 / 9\" */\n  ratio?: string;\n}\n\n/** تصویر کارت؛ alt را فراموش نکنید (برای تصویر تزئینی alt=\"\") */\nexport function CardMedia({ ratio = \"16 / 9\", className, style, ...rest }: CardMediaProps) {\n  return <img className={cx(\"k-card__media\", className)} style={{ aspectRatio: ratio, ...style }} {...rest} />;\n}\n\nconst part = (tag: ElementType, base: string, name: string) => {\n  const Part = forwardRef<HTMLElement, HTMLAttributes<HTMLElement> & { as?: ElementType }>(function Part(\n    { as: Tag = tag, className, ...rest },\n    ref,\n  ) {\n    return <Tag ref={ref} className={cx(base, className)} {...rest} />;\n  });\n  Part.displayName = name;\n  return Part;\n};\n\n/** پیش‌فرض h3؛ با as سطح عنوان را با ساختار صفحه هماهنگ کنید */\nexport const CardTitle = part(\"h3\", \"k-card__title\", \"CardTitle\");\nexport const CardDescription = part(\"p\", \"k-card__description\", \"CardDescription\");\nexport const CardBody = part(\"div\", \"k-card__body\", \"CardBody\");\nexport const CardFooter = part(\"footer\", \"k-card__footer\", \"CardFooter\");\n"
    }
  ]
}