{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "pricing-table",
  "title": "Pricing table",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "https://brutalui.dev/r/badge.json",
    "https://brutalui.dev/r/button.json"
  ],
  "files": [
    {
      "path": "src/components/blocks/pricing-table.tsx",
      "content": "import { Check } from \"lucide-react\"\n\nimport { Badge } from \"@/components/ui/badge\"\nimport { Button } from \"@/components/ui/button\"\n\nimport { cn } from \"@/lib/utils\"\n\ntype PricingTier = {\n  name: string\n  price: string\n  description: string\n  features: string[]\n  highlight?: boolean\n  ctaLabel?: string\n  ctaHref?: string\n}\n\ntype PricingTableProps = {\n  title?: string\n  description?: string\n  tiers?: PricingTier[]\n  className?: string\n}\n\nconst DEFAULT_TIERS: PricingTier[] = [\n  {\n    name: \"Starter\",\n    price: \"$0\",\n    description: \"For quick experiments and brutal prototypes.\",\n    features: [\"All core components\", \"Marketing blocks\", \"Community support\"],\n    ctaLabel: \"Get started\",\n    ctaHref: \"/docs\",\n  },\n  {\n    name: \"Studio\",\n    price: \"$29\",\n    description: \"For teams building product-ready experiences.\",\n    features: [\"Everything in Starter\", \"Priority updates\", \"Advanced themes\"],\n    highlight: true,\n    ctaLabel: \"Start trial\",\n    ctaHref: \"/docs\",\n  },\n  {\n    name: \"Agency\",\n    price: \"$79\",\n    description: \"For shipping multiple client experiences.\",\n    features: [\"Everything in Studio\", \"Team onboarding\", \"Brand review\"],\n    ctaLabel: \"Contact sales\",\n    ctaHref: \"/docs\",\n  },\n]\n\nexport default function PricingTable({\n  title = \"Pricing that scales with your ambition.\",\n  description = \"Pick a plan that matches your pace. Upgrade only when you need to.\",\n  tiers = DEFAULT_TIERS,\n  className,\n}: PricingTableProps) {\n  return (\n    <section\n      className={cn(\n        \"w-full border-2 border-border bg-secondary-background px-6 py-10 shadow-shadow\",\n        className,\n      )}\n    >\n      <div className=\"space-y-8\">\n        <header className=\"max-w-2xl space-y-3\">\n          <h2 className=\"font-heading text-2xl sm:text-3xl\">{title}</h2>\n          <p className=\"text-foreground sm:text-lg\">{description}</p>\n        </header>\n        <div className=\"grid gap-4 lg:grid-cols-3\">\n          {tiers.map((tier) => (\n            <div\n              key={tier.name}\n              className={cn(\n                \"flex h-full flex-col justify-between rounded-base border-2 border-border bg-background p-6 shadow-shadow\",\n                tier.highlight && \"bg-main text-main-foreground\",\n              )}\n            >\n              <div className=\"space-y-4\">\n                <div className=\"flex items-center justify-between\">\n                  <h3 className=\"font-heading text-xl\">{tier.name}</h3>\n                  {tier.highlight && (\n                    <Badge className=\"rounded-full px-3 py-1 text-xs\" variant=\"neutral\">\n                      Popular\n                    </Badge>\n                  )}\n                </div>\n                <p className=\"text-3xl font-heading\">{tier.price}</p>\n                <p className={cn(\"text-sm\", tier.highlight ? \"text-main-foreground/80\" : \"text-muted-foreground\")}>\n                  {tier.description}\n                </p>\n                <ul className=\"space-y-2 text-sm\">\n                  {tier.features.map((feature) => (\n                    <li key={feature} className=\"flex items-center gap-2\">\n                      <Check className=\"size-4\" />\n                      <span>{feature}</span>\n                    </li>\n                  ))}\n                </ul>\n              </div>\n              <Button\n                className={cn(\"mt-6 w-full\", tier.highlight ? \"bg-background text-foreground\" : \"\")}\n                variant={tier.highlight ? \"neutral\" : \"default\"}\n                asChild\n              >\n                <a href={tier.ctaHref ?? \"/docs\"}>{tier.ctaLabel ?? \"Get started\"}</a>\n              </Button>\n            </div>\n          ))}\n        </div>\n      </div>\n    </section>\n  )\n}\n",
      "type": "registry:ui",
      "target": "components/blocks/pricing-table.tsx"
    }
  ],
  "type": "registry:ui"
}