Billing
Current plan, usage meters, payment method, and invoice history. Built from live Canvas components.
Plan and usage
Anatomy. Two Cards side by side (stacking on phones): the current plan with its renewal DescriptionList rows and actions (cancelling confirms through an AlertDialog), and per-resource usage meters (Progress).
Pro plan
$24 per member / month, billed monthly
Active
Renews
Aug 17, 2026
Seats
8 of 10
Billing email
ap@acme.com
Usage this cycle
Storage
62 GB of 100 GB
Members
8 of 10 seats
API requests
1.2M of 2M
Usage resets at the start of each billing cycle.
Payment method
Anatomy. Card row: Emblem card icon + brand and expiry, with an update action.
Visa ending in 4242
Expires 04 / 2028
Invoices
Anatomy. Invoice history DataTable; the status cell is a live Badge, and pressing a row opens its invoice.