← All blocks
Subscription, usage and invoices
billing · subscription-usage · billing-subscription-usage
npx shadcn@latest add @plus-ui/billing-subscription-usageDefault content
{
"eyebrow": "pellora",
"title": "Billing",
"description": "Plan, usage and invoices for the Pellora workspace.",
"actions": [
{
"label": "Billing settings",
"href": "#billing-settings",
"variant": "secondary"
}
],
"plan": {
"label": "Current plan",
"name": "Team",
"badge": "Monthly",
"price": "$240",
"period": "per month",
"summary": "12 seats · 3 projects · 25,000 build minutes",
"renews": "Renews Nov 1, 2026",
"features": [
"Unlimited preview deployments",
"SAML single sign-on",
"30-day log retention",
"99.95% uptime SLA"
],
"actions": [
{
"label": "Change plan",
"href": "#plans",
"variant": "primary"
},
{
"label": "Cancel plan",
"href": "#cancel",
"variant": "secondary"
}
]
},
"estimate": {
"label": "Estimated next invoice",
"value": "$318.40",
"note": "Based on usage so far this cycle. Billed Nov 1.",
"lines": [
{
"label": "Team plan, 12 seats",
"value": "$240.00"
},
{
"label": "Bandwidth overage, 156 GB",
"value": "$62.40"
},
{
"label": "Extra concurrent builds",
"value": "$16.00"
}
]
},
"usage": {
"title": "Usage this cycle",
"period": "Oct 1 – Oct 31",
"items": [
{
"label": "Build minutes",
"used": "18,420",
"limit": "25,000",
"percent": 74,
"note": "Resets in 22 days"
},
{
"label": "Bandwidth",
"used": "1.16 TB",
"limit": "1 TB",
"percent": 100,
"note": "156 GB over · $0.40 per GB"
},
{
"label": "Serverless invocations",
"used": "41.2M",
"limit": "50M",
"percent": 82,
"note": "Projected 56M by month end"
},
{
"label": "Seats",
"used": "11",
"limit": "12",
"percent": 92,
"note": "1 seat free"
},
{
"label": "Edge cache storage",
"used": "38 GB",
"limit": "100 GB",
"percent": 38,
"note": "Across 3 projects"
}
]
},
"payment": {
"title": "Payment method",
"brand": "Visa",
"masked": "•••• 4242",
"expiry": "Expires 08/28",
"update": "Update",
"details": [
{
"label": "Billing email",
"value": "[email protected]"
},
{
"label": "Billed to",
"value": "Pellora GmbH · Torstraße 109, Berlin"
},
{
"label": "VAT ID",
"value": "DE 3•••••819"
}
]
},
"invoices": {
"title": "Invoices",
"link": {
"label": "Download all",
"href": "#invoices"
},
"columns": {
"number": "Invoice",
"date": "Date",
"description": "Description",
"amount": "Amount",
"status": "Status",
"download": "Download"
},
"statusLabels": {
"paid": "Paid",
"open": "Open",
"failed": "Failed",
"refunded": "Refunded"
},
"items": [
{
"number": "RVL-2026-0912",
"date": "Oct 1, 2026",
"description": "Team · Sep usage",
"amount": "$296.80",
"status": "open",
"href": "#inv-0912"
},
{
"number": "RVL-2026-0811",
"date": "Sep 1, 2026",
"description": "Team · Aug usage",
"amount": "$271.20",
"status": "paid",
"href": "#inv-0811"
},
{
"number": "RVL-2026-0710",
"date": "Aug 1, 2026",
"description": "Team · Jul usage",
"amount": "$258.00",
"status": "failed",
"href": "#inv-0710"
},
{
"number": "RVL-2026-0709",
"date": "Aug 4, 2026",
"description": "Retry of RVL-2026-0710",
"amount": "$258.00",
"status": "paid",
"href": "#inv-0709"
},
{
"number": "RVL-2026-0608",
"date": "Jul 1, 2026",
"description": "Team · Jun usage",
"amount": "$240.00",
"status": "paid",
"href": "#inv-0608"
},
{
"number": "RVL-2026-0507",
"date": "Jun 1, 2026",
"description": "Pro → Team proration",
"amount": "−$18.50",
"status": "refunded",
"href": "#inv-0507"
}
]
}
}