/** * The Custom Purchase Flow API contains functionality for customizing the plan purchase flow on a site. * * Use the Custom Purchase Flow API to customize the pages in the plan purchase flow on a site. This API provides * functionality for directing users to the Plans & Pricing and Checkout pages outside of the default flow. It also * allows you to customize the content displayed on the Plan & Pricing, Checkout, and Thank You pages. * * ### Set up pricing plans * To use APIs to customize the plan purchase flow, a site must first be set up to: * * + Accept payments as described in [Accepting Payments: An Overview](https://support.wix.com/en/article/accepting-payments-an-overview). * * + Offer membership plans as described in [Pricing Plans: An Overview](https://support.wix.com/en/article/pricing-plans-an-overview). When setting up a site to accept pricing plans, * define the plans you want to offer [using the dashboard](https://support.wix.com/en/article/pricing-plans-creating-a-one-time-payment-plan) or * using the Pricing Plan APIs. * * ### Direct users to pages in the purchase flow * The Custom Purchase Flow API lets you direct customers to either of 2 pages in the plan purchase flow: * * + **The Plans & Pricing page**: You can navigate from anywhere in a site to the Plans & Pricing page. * + **The Checkout page**: If a site uses a custom Plans & Pricing page, you can navigate to checkout from anywhere in a site, including * the Plans & Pricing page. If a site uses the default Plans & Pricing page, visitors will still be directed from Plans & Pricing to the * Checkout page without you calling any method. However, you may also direct customers to checkout from any other page in a site. * * ### Customize the content of the Plans & Pricing and Checkout pages * You can use `navigateToPricingPage()` and `navigateToCheckout()` methods to customize * pages in the plan purchase flow: * * + **Customizing the Plans & Pricing page**: You can set page content such as the title and subtitle of the Plans & Pricing page by passing * options to `navigateToPricingPage()`. In the same method you can also pass options to customize the content * on the Checkout and Thank You pages. * + **Customizing the Checkout page**: In `navigateToCheckout()`, you can pass options to customize the * content displayed on the Checkout and Thank You pages. * + **Retrieving the Pricing Page options**: You can call `getPricingPageOptions()` on the Plans & Pricing page to * retrieve the Pricing page options you set in `navigateToPricingPage()`. * * ### Customize the pricing plan purchase flow * You can now add custom pages to the pricing plan flow, as well as build a custom Plans & Pricing page. * * If you add pages between Plans & Pricing and Checkout, you'll need to store the options set in `navigateToPricingPage()` * globally, for example using the Wix Storage API and access them before you call `navigateToCheckout()`. * * If you are navigating directly from the Plans & Pricing page to Checkout, you can * call [`getPricingPageOptions()`](#getPricingPageOptions) and pass the retrieved options directly to [`navigateToCheckout()`](#navigateToCheckout). * * ### Import the APIs * To use the CustomPurchaseFlow API, import `customPurchaseFlow` from the `wix-pricing-plans-frontend` module. * * ```javascript * import { customPurchaseFlow } from 'wix-pricing-plans-frontend'; * ``` */ export interface CustomPurchaseFlow { /** * Returns the options set for the current Plans & Pricing page. * * `getPricingPageOptions()` retrieves the options set for the Plans & Pricing Page in `navigateToPricingPage()`. * The returned `PricingPageOptions` object also includes any options set for the Checkout and Thank You pages. * * Call this method in the page code of a default or custom Plans & Pricing page. If you need to pass the returned pricing page * options to `navigateToCheckout()` at a later point, store the options object globally so you can access it later. * * > **Note:** * > + To work with the Pricing Plans API, a site needs to be published. * * @servicePath wix-pricing-plans-frontend.CustomPurchaseFlow.PricingPageOptions */ getPricingPageOptions(): Promise; /** * Directs site visitor to the Checkout page in the plan purchase flow. * * `navigateToCheckout()` redirects the site visitor to the Checkout page from any other page on a site. It also provides * options to customize the Checkout and Thank You pages that come later in the plan purchase flow. * * Note that the use of `navigateToCheckout()` differs slightly depending on whether you use the default Plans & Pricing page or a custom one: * + If you choose to use the default Plans & Pricing page, you won't be able to call `navigateToCheckout()` from there, but * you may still call it from any other page in a site. * + If you are using a custom Plans & Pricing page, you can call `navigateToCheckout()` on the plans page as well as anywhere else on a * site. * * > **Notes:** * > + Setting the `minStartDate` and `maxStartDate` parameters have no effect unless you've allowed customers * > to [set the plan start date](https://support.wix.com/en/article/pricing-plans-creating-a-one-time-payment-plan#step-4-adjust-your-plans-settings). * > + To work with the Pricing Plans API, a site needs to be published. * @param options - Options to customize the Checkout page and subsequent flow. * @requiredField options * @servicePath wix-pricing-plans-frontend.CustomPurchaseFlow.CheckoutOptions */ navigateToCheckout(options: CheckoutOptions): Promise; /** * Directs site visitor to the Pricing & Plans page in the plan purchase flow. * * `navigateToPricingPage()` directs the site visitor to the active Plans & Pricing page from any other page on a site. * It also provides options to customize the Checkout and Thank You pages that come later in the plan purchase flow. This allows you to * customize each of the pages in the flow with a single method. * * > **Notes:** * > * > + Setting the `minStartDate` and `maxStartDate` parameters have no effect unless you've allowed customers * > to [set the plan start date](https://support.wix.com/en/article/pricing-plans-creating-a-one-time-payment-plan#step-4-adjust-your-plans-settings). * > + To work with the Pricing Plans API, a site needs to be published. * @param options - Options to customize the Plans & Pricing page and subsequent flow. * @requiredField options * @servicePath wix-pricing-plans-frontend.CustomPurchaseFlow.PricingPageOptions */ navigateToPricingPage(options: PricingPageOptions): Promise; } /** * Sets the data associated with the Checkout page. */ export interface CheckoutOptions { /** * Selected pricing plan ID. * @requiredField planId */ planId: string; /** * Earliest date the selected plan can start in `yyyy-MM-dd` format. */ minStartDate?: string; /** * Latest date the selected plan can start in `yyyy-MM-dd` format. */ maxStartDate?: string; /** * The data associated with the Thank You page. * @servicePath wix-pricing-plans-frontend.CustomPurchaseFlow.ThankYouPage */ thankYouPage?: ThankYouPage; } /** * Sets the data associated with the Checkout page. */ export interface CheckoutPageOptions { /** * Earliest date the selected plan can start in `yyyy-MM-dd` format. */ minStartDate?: string; /** * Latest date the selected plan can start in `yyyy-MM-dd` format. */ maxStartDate?: string; /** * The data associated with the Thank You page. * @servicePath wix-pricing-plans-frontend.CustomPurchaseFlow.ThankYouPage */ thankYouPage?: ThankYouPage; } /** * Settings for the display of the Plans & Pricing page and subsequent pages in the plan purchase flow. */ export interface PricingPageOptions { /** * List of plan IDs displayed on the Plans & Pricing page. */ planIds?: string[]; /** * Plans & Pricing page title. */ title?: string; /** * Plans & Pricing page subtitle. */ subtitle?: string; /** * The data associated with the Checkout page. * @servicePath wix-pricing-plans-frontend.CustomPurchaseFlow.CheckoutPageOptions */ checkout?: CheckoutPageOptions; } /** * Options to customize the Thank You page that's displayed after a customer purchases a plan. */ export interface ThankYouPage { /** * The content displayed on the Thank You page. * @servicePath wix-pricing-plans-frontend.CustomPurchaseFlow.content */ content?: content; /** * The page to navigate to when a user clicks the button on the Thank You Page. * It must be a page on a site. * @servicePath wix-pricing-plans-frontend.CustomPurchaseFlow.navigation */ navigation?: navigation; } /** * The content displayed on the Thank You page. */ export interface content { /** * Thank You page title. */ title?: string; /** * Thank You page body. */ message?: string; /** * Thank You page button label. */ cta?: string; } /** * The page to navigate to when a user clicks the button on the Thank You Page. * It must be a page on a site. */ export interface navigation { /** * URL of a page on a site. The link may be relative or a site's base URL. Examples: * + `/home` * + `https://my.wixsite.com/path` * @requiredField url */ url: string; /** * Link type. * * Supported values: * - `"url"` * @requiredField type */ type: string; } /** * Returns the options set for the current Plans & Pricing page. * * `getPricingPageOptions()` retrieves the options set for the Plans & Pricing Page in `navigateToPricingPage()`. * The returned `PricingPageOptions` object also includes any options set for the Checkout and Thank You pages. * * Call this method in the page code of a default or custom Plans & Pricing page. If you need to pass the returned pricing page * options to `navigateToCheckout()` at a later point, store the options object globally so you can access it later. * * > **Note:** * > + To work with the Pricing Plans API, a site needs to be published. * * @servicePath wix-pricing-plans-frontend.CustomPurchaseFlow.PricingPageOptions */ export function getPricingPageOptions(): Promise; /** * Directs site visitor to the Checkout page in the plan purchase flow. * * `navigateToCheckout()` redirects the site visitor to the Checkout page from any other page on a site. It also provides * options to customize the Checkout and Thank You pages that come later in the plan purchase flow. * * Note that the use of `navigateToCheckout()` differs slightly depending on whether you use the default Plans & Pricing page or a custom one: * + If you choose to use the default Plans & Pricing page, you won't be able to call `navigateToCheckout()` from there, but * you may still call it from any other page in a site. * + If you are using a custom Plans & Pricing page, you can call `navigateToCheckout()` on the plans page as well as anywhere else on a * site. * * > **Notes:** * > + Setting the `minStartDate` and `maxStartDate` parameters have no effect unless you've allowed customers * > to [set the plan start date](https://support.wix.com/en/article/pricing-plans-creating-a-one-time-payment-plan#step-4-adjust-your-plans-settings). * > + To work with the Pricing Plans API, a site needs to be published. * @param options - Options to customize the Checkout page and subsequent flow. * @requiredField options * @servicePath wix-pricing-plans-frontend.CustomPurchaseFlow.CheckoutOptions */ export function navigateToCheckout(options: CheckoutOptions): Promise; /** * Directs site visitor to the Pricing & Plans page in the plan purchase flow. * * `navigateToPricingPage()` directs the site visitor to the active Plans & Pricing page from any other page on a site. * It also provides options to customize the Checkout and Thank You pages that come later in the plan purchase flow. This allows you to * customize each of the pages in the flow with a single method. * * > **Notes:** * > * > + Setting the `minStartDate` and `maxStartDate` parameters have no effect unless you've allowed customers * > to [set the plan start date](https://support.wix.com/en/article/pricing-plans-creating-a-one-time-payment-plan#step-4-adjust-your-plans-settings). * > + To work with the Pricing Plans API, a site needs to be published. * @param options - Options to customize the Plans & Pricing page and subsequent flow. * @requiredField options * @servicePath wix-pricing-plans-frontend.CustomPurchaseFlow.PricingPageOptions */ export function navigateToPricingPage(options: PricingPageOptions): Promise;