shadcn/ui billing blocks & components.
Billing UI built with shadcn/ui: plan summary cards, invoice tables, usage meters, payment-method managers with add-card dialogs, a proration-preview plan changer, an invoice composer wizard, and dunning queues with retry timelines. SaaS monetization screens with the fiddly states already modeled.
Current Plan Summary Card
Billing 1FreeCurrent-plan billing card with monthly price, renewal date, a seat usage bar, and a dialog of radio tiers for switching plans.
Invoice History Table
Billing 2FreeInvoice history table with checkbox selection, status badges, per-row download links, and a bulk download of the selected billing invoices.
Full Billing Dashboard
Billing 3FreeBilling page combining a plan summary, storage usage bar, payment method card, and a sortable, paginated invoice table.
Usage Metering Card
Billing 4FreeUsage metering card with progress bars for seats, storage, API requests, and bandwidth, plus an estimated billing total for the cycle.
Saved Payment Methods
Billing 5FreePayment methods list of saved cards with a default badge, set-default and remove actions, and an add-card dialog.
Add Card Form
Billing 6FreeAdd payment method form with name, card number, expiry, CVC, a country select, and a set-as-default switch.
Invoice Ledger Console
Billing 7ProRevenue console with a counting outstanding balance, a past-due recovery banner, and an invoice ledger table with customer logos and pagination.
Plan Catalog Editor
Billing 8ProBilling plan catalog editor with per-seat plan cards, feature and add-on rows, and Active/Public switches that raise an unsaved-changes banner.
Subscription Account Table
Billing 9ProSubscription billing accounts table filtered by tabs, with recovery stat cards, health star ratings, owner avatars, and radial readiness gauges.
Invoice Composer Wizard
Billing 10ProFour-step invoice creation wizard with a stepper, customer and line-item forms, quantity steppers, and a running total that counts up.
Change Plan Proration
Billing 11ProSubscription change-plan flow pairing a radio tier picker with a live proration preview of current credit, new charge, and amount due today.
Dunning Recovery Queue
Billing 12ProFailed payment dunning queue with metric cards, trend sparks, and past-due rows that expand into a retry-attempt timeline with failure codes.
Coupon Code Manager
Billing 13ProBilling coupons manager listing promo codes with usage meters and status badges, each expanding to a discount, limit, and eligible-plans editor.