Component: Edit Plan (Beta)

| 🎉 This component will receive a major update in Release 111 (Q3 2025). |

Component: Edit Base Plan

This component allows subscribers to change their base subscription plan via Limio Self-Service. It's typically used in the Self-Service journey to offer customers the ability to upgrade or downgrade to a different product, rate plan, or billing frequency.

The component also enables customers to change the quantity of their subscription and see a visual comparison of their current and new plans.

This extends the functionality previously available in Component: Switch Subscription

What does this component do?

The Edit Base Plan component provides a self-service UI where users can:

• Select a new base product.

• Change the billing plan and billing frequency.

• Adjust the quantity (if is enabled).

• View a dynamic preview of the new plan and cost comparison.

• Submit changes, which updates their subscription in Zuora via Limio's Event ().

This is ideal for letting customers move from monthly to annual billing, upgrade their subscription tier from Basic to Pro, or increase the number of licenses or seats.

How does it work?

When embedded in a Manage My Account flow and loaded with a subscription ID (?subId= or ?subRef=), the component:

1. Retrieves the subscriber’s current plan

2. Displays available offers grouped by product using Limio Offer data.

3. Enables the customer to select a new offer (product + rate plan + term).

4. Provides real-time updates on their selection with a side-by-side preview of current and new plans.

5. Processes the update with Limio when the customer clicks Continue.

A successful submission can redirect the user or refresh the page, depending on the successLink prop.

Component props

Prop	Type	Description	Default
themeColor	picklist	Sets the colour theme of the component (orange, blue, red, green, black, grey).	orange
defaultToBase	boolean	If true, default selection shows the base plan first in the list.	true
titleText	string	Main heading displayed at the top of the component.	Change your plan
productSelectLabel	string	Label above the product selection dropdown.	Choose a plan
ratePlanSelectLabel	string	Label above the billing frequency selection.	Billing frequency
billingTermSelectLabel	string	Label above the billing term selection.	Billing plan
quantityFieldLabel	string	Label next to the quantity field.	Quantity
manageText	richtext	Optional helper text for managing add-ons.	Need to manage your subscription add-ons? Please visit your subscription page and choose ‘Edit Add-ons’ to make your changes.
yourPlanTitle	string	Title shown on the right-hand summary section.	Your Plan
toPayText	richtext	Label displayed above the cost in the summary panel.	To pay today
longTexts	richtext	Additional copy beneath the continue button.	Lorem Ipsum
continueButtonText	string	Text for the primary action button.	Continue
yourNewPlanCopy	string	Label shown above the new plan preview.	Your new plan
yourOldPlanCopy	string	Label shown above the current plan preview.	Credit for your old plan
onlyIncrease	boolean	If true, only allows quantity increases.	false
hideBillingFrequency	boolean	If true, hides the billing frequency selector.	false
hideBillingPlan	boolean	If true, hides the billing plan selector.	false
compareLink	string	URL to navigate to a plan comparison page.	#
successLink	string	URL to redirect to on successful submission.	/updateSuccess