Interface PresentPaywallParams

Parameters for the Purchases.presentPaywall method.

interface PresentPaywallParams {
    customerEmail?: string;
    customVariables?: CustomVariables;
    discountCode?: string;
    hideBackButtons?: boolean;
    htmlTarget?: HTMLElement;
    listener?: PurchaseListener;
    offering?: Offering;
    onBack?: (closePaywall: () => void) => void;
    onDiscountCodeChanged?: (discountCode: null | string) => void;
    onNavigateToUrl?: (url: string) => void;
    onPurchaseError?: (error: Error) => void;
    onVisitCustomerCenter?: () => void;
    purchaseHtmlTarget?: HTMLElement;
    selectedLocale?: string;
    showDiscountCodeField?: boolean;
}

Properties

customerEmail?: string

The email of the customer starting the purchase. If passed the checkout flow will not ask for it to the customer.

customVariables?: CustomVariables

Custom variables to pass to the paywall at runtime, overriding defaults set in the RevenueCat dashboard.

Variables must be defined in the dashboard first. Reference them in paywall text using the custom. prefix (e.g. {{ custom.player_name }}).

presentPaywall({
customVariables: {
player_name: CustomVariableValue.string('Ada'),
level: CustomVariableValue.number(42),
is_premium: CustomVariableValue.boolean(true),
},
});
discountCode?: string

Initial discount code to apply to the checkout when one already exists outside of the paywall UI, for example in the hosting page's URL.

hideBackButtons?: boolean

Whether to hide back buttons in the paywall. Defaults to false.

htmlTarget?: HTMLElement

The target element where the paywall will be rendered. The paywall will create a full-screen overlay if null.

listener?: PurchaseListener

Optional listener for paywall purchase lifecycle events.

offering?: Offering

The identifier of the offering to fetch the paywall for. Can be a string identifier or one of the predefined keywords.

onBack?: (closePaywall: () => void) => void

Callback to be called when the paywall tries to navigate back.

Example:

onBack: (closePaywall) => {
// You may want to keep the paywall open while showing a confirmation
// modal or logging analytics, then close it if the user confirms.
// If you want the back action to dismiss the paywall immediately,
// call closePaywall() right away.
closePaywall();
}
onDiscountCodeChanged?: (discountCode: null | string) => void

Called when the applied discount code changes in the checkout shown from the paywall. This can be used to sync host state such as URL parameters.

onNavigateToUrl?: (url: string) => void

Callback to be called when the paywall tries to navigate to an external URL.

Markdown text links keep their native browser navigation. Use this callback for side effects or to customize how button-driven URL actions are handled.

onPurchaseError?: (error: Error) => void

Callback called when an error that won't close the paywall occurs. For example, a retryable error during the purchase process.

Use listener.onPurchaseError instead.

onVisitCustomerCenter?: () => void

Callback to be called when the paywall tries to visit the customer center.

purchaseHtmlTarget?: HTMLElement

The target element where the checkout flow will be rendered. The checkout flow will create a full-screen overlay if null.

selectedLocale?: string

The locale to use for the paywall and the checkout flow.

showDiscountCodeField?: boolean

If set to true, the Web Billing checkout shown from the paywall will display a discount input code field.