{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "billing-page",
  "type": "registry:component",
  "title": "Billing page",
  "description": "A Tailwind workspace billing page with three plan cards and a highlighted Pro tier, a seat usage meter, and an invoice list with paid and void statuses.",
  "dependencies": [],
  "registryDependencies": [
    "https://ui.minidev.pro/r/invoice-list.json",
    "https://ui.minidev.pro/r/plan-card.json",
    "https://ui.minidev.pro/r/usage-meter.json"
  ],
  "files": [
    {
      "path": "registry/blocks/billing-page.tsx",
      "type": "registry:ui",
      "target": "components/ui/billing-page.tsx",
      "content": "\"use client\"\nimport { PlanCard } from \"@/components/ui/plan-card\"\nimport { InvoiceList } from \"@/components/ui/invoice-list\"\nimport { UsageMeter } from \"@/components/ui/usage-meter\"\n\nfunction BillingPage() {\n  return (\n    <div data-slot=\"billing-page\" className=\"space-y-8\">\n      <div>\n        <h3 className=\"text-xl font-medium tracking-[-0.014em] text-fg\">Billing</h3>\n        <p className=\"mt-1 text-sm text-fg-muted\">Plans, usage, and invoices for this workspace.</p>\n      </div>\n      <div className=\"grid gap-4 lg:grid-cols-3\">\n        <PlanCard name=\"Free\" price=\"$0\" features={[\"3 projects\", \"Community support\", \"Basic analytics\"]} />\n        <PlanCard name=\"Pro\" price=\"$49\" highlighted features={[\"Unlimited projects\", \"Advanced analytics\", \"Priority support\"]} />\n        <PlanCard name=\"Team\" price=\"$149\" features={[\"Seats\", \"SSO\", \"Support\"]} />\n      </div>\n      <div className=\"rounded-xl border border-border bg-surface p-4\">\n        <UsageMeter label=\"Seats used\" used={18} limit={25} />\n      </div>\n      <InvoiceList items={[\n        { id: \"INV-1842\", date: \"Sep 1\", amount: \"$49\", status: \"paid\" },\n        { id: \"INV-1830\", date: \"Aug 1\", amount: \"$49\", status: \"paid\" },\n        { id: \"INV-1811\", date: \"Jul 1\", amount: \"$49\", status: \"void\" },\n      ]} />\n    </div>\n  )\n}\nexport { BillingPage }\n"
    }
  ]
}