{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "card",
  "title": "Card",
  "description": "Polaris-styled Card component.",
  "dependencies": [],
  "devDependencies": [
    "@shopify/polaris-types"
  ],
  "registryDependencies": [
    "@polaris-shadcn/theme",
    "@polaris-shadcn/utils"
  ],
  "files": [
    {
      "path": "registry/templates/components/ui/card.tsx",
      "content": "import * as React from \"react\";\nimport { cn } from \"../../lib/utils\";\n\nexport type CardBackground = \"base\" | \"subdued\" | \"transparent\";\nexport type CardPadding = \"base\" | \"none\";\n\ntype DivProps = React.ComponentPropsWithoutRef<\"div\">;\ntype DivRef = React.ElementRef<\"div\">;\n\ntype HeadingProps = React.ComponentPropsWithoutRef<\"h3\">;\ntype HeadingRef = React.ElementRef<\"h3\">;\n\ntype ParagraphProps = React.ComponentPropsWithoutRef<\"p\">;\ntype ParagraphRef = React.ElementRef<\"p\">;\n\nexport interface CardProps extends DivProps {\n  background?: CardBackground;\n  padding?: CardPadding;\n}\n\nconst cardPaddingClassNames: Record<CardPadding, string> = {\n  base: \"p-4\",\n  none: \"p-0\",\n};\n\nconst cardBackgroundClassNames: Record<CardBackground, string> = {\n  base: \"bg-card\",\n  subdued: \"bg-surface-subdued\",\n  transparent: \"bg-transparent\",\n};\n\nconst Card = React.forwardRef<HTMLDivElement, CardProps>(\n  (\n    { className, style, background = \"base\", padding = \"base\", ...props },\n    ref,\n  ) => (\n    <div\n      ref={ref}\n      style={style}\n      className={cn(\n        \"polaris-shadcn-card\",\n        cardBackgroundClassNames[background],\n        cardPaddingClassNames[padding],\n        className,\n      )}\n      {...props}\n    />\n  ),\n);\nCard.displayName = \"Card\";\n\nconst CardHeader = React.forwardRef<DivRef, DivProps>(\n  ({ className, ...props }, ref) => (\n    <div ref={ref} className={cn(\"flex flex-col gap-1\", className)} {...props} />\n  ),\n);\nCardHeader.displayName = \"CardHeader\";\n\nconst CardTitle = React.forwardRef<HeadingRef, HeadingProps>(\n  ({ className, children, ...props }, ref) => (\n    <h3 ref={ref} className={cn(\"text-sm font-semibold\", className)} {...props}>\n      {children}\n    </h3>\n  ),\n);\nCardTitle.displayName = \"CardTitle\";\n\nconst CardDescription = React.forwardRef<ParagraphRef, ParagraphProps>(\n  ({ className, ...props }, ref) => (\n    <p ref={ref} className={cn(\"text-sm text-muted-foreground\", className)} {...props} />\n  ),\n);\nCardDescription.displayName = \"CardDescription\";\n\nconst CardContent = React.forwardRef<DivRef, DivProps>(\n  ({ className, ...props }, ref) => (\n    <div ref={ref} className={cn(\"pt-3\", className)} {...props} />\n  ),\n);\nCardContent.displayName = \"CardContent\";\n\nconst CardFooter = React.forwardRef<DivRef, DivProps>(\n  ({ className, ...props }, ref) => (\n    <div ref={ref} className={cn(\"pt-4\", className)} {...props} />\n  ),\n);\nCardFooter.displayName = \"CardFooter\";\n\nexport { Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter };\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}