Subscription
v1.0.21Updated 20 Oct 2026Subscription management page — overview, change plan, usage, payment method and invoices. Full-page copy-paste template; baked-in demo content (edit the JSX to customise).
Preview
Live · 18 stories▸Why this is recommendedsubscriptionplanbillingrenewal+3
Subscription — overview.
- ✓Subscription management screens
- ✓Account billing
- i18n: a labels prop overrides every built-in string; English defaults, brand-free copy
- Overview, change-plan, usage, payment-method and invoices layouts
- Pause/cancel / add-ons / trial variants
- Self-contained — no required props
- ✕Public pricing pages (use PricingPage)
Install
Ask your agent, or call the MCP tool directly. The resolved bundle is written into your project.
Usage
Tick variants in the left menu — each adds a tab with that variant’s real story source, the same code the preview above renders.
Props
classNameOptional wrapper class override (copy-paste block, baked-in content)
—plansSubscriptionChangePlan only: the plans to offer, defaulting to Starter, Pro and Business; the current plan is the one with id `pro`, so the list must include it.
—invoicesSubscriptionInvoices only: the billing history rows; defaults to five paid demo invoices.
—labelsOverride every built-in string and aria-label (i18n). Merged over DEFAULT_SUBSCRIPTION_LABELS (168 English keys); every template in the file accepts it. The rendered DEFAULTS are English — page templates used to hardcode their copy, which no consumer could translate or ship. MCP feedback fb_ba2ec12f.
—