@revenuecat/purchases-ui-js/dist/components/paywall/Paywall.svelte.d.ts

Web components for Paywalls. Powered by RevenueCat

import { type InitialInputSelections } from "../../stores/inputValidation";
import type { ColorMode } from "../../types";
import type { ColorScheme } from "../../types/colors";
import type { CompleteWorkflowNavigateArgs } from "../../types/components/button";
import type { OnComponentInteraction } from "../../types/paywall-component-interaction";
import type { PaywallData } from "../../types/paywall";
import type { UIConfig } from "../../types/ui-config";
import { type CustomVariables, type PackageInfo, type VariableDictionary } from "../../types/variables";
import type { WalletButtonRender } from "../../types/wallet";
import type { ReservedAttribute } from "../../types/components/input-text";
/**
 * Props are captured once at mount and are not reactive to subsequent changes.
 * The paywall should be remounted to reflect new prop values.
 */
interface Props {
    paywallData: PaywallData;
    selectedLocale?: string;
    variablesPerPackage?: Record<string, VariableDictionary>;
    /**
     * Global variables that are available independent of package selection.
     * Useful for success screens, confirmation flows, and other contexts where variables
     * aren't tied to a specific package. Package-specific variables from variablesPerPackage
     * will override global variables when both are present.
     */
    globalVariables?: VariableDictionary;
    infoPerPackage?: Record<string, PackageInfo>;
    uiConfig: UIConfig;
    preferredColorMode?: ColorMode;
    onPurchaseClicked?: (selectedPackageId: string, actionId: string) => void;
    onBackClicked?: () => void;
    /** Called when a `close_workflow` button is pressed to dismiss the paywall/workflow. */
    onClose?: () => void;
    onVisitCustomerCenterClicked?: () => void;
    onRestorePurchasesClicked?: () => void;
    onNavigateToUrlClicked?: (url: string) => void;
    /**
     * Called when a complete_workflow button is pressed. The URL is localized;
     * the host merges `url_query_params` (e.g. `app_user_id`) if needed.
     */
    onCompleteWorkflowNavigate?: (args: CompleteWorkflowNavigateArgs) => void | Promise<void>;
    onActionTriggered?: (actionId: string) => void;
    onComponentInteraction?: OnComponentInteraction;
    onError?: (error: unknown) => void;
    hideBackButtons?: boolean;
    walletButtonRender?: WalletButtonRender;
    onInputChanged?: (fieldId: string, value: string, actionId?: string) => void;
    onReservedAttributeChanged?: (reservedAttribute: ReservedAttribute, value: string) => void;
    maxContentWidth?: string;
    initialInputSelections?: InitialInputSelections;
    /**
     * Custom variables to pass to the paywall for text substitution.
     * Use `{{ custom.variable_name }}` syntax in your paywall text to reference these values.
     * Keys must start with a letter and can only contain letters, numbers, and underscores.
     *
     * @example
     * ```typescript
     * customVariables: {
     *   'player_name': CustomVariableValue.string('John'),
     *   'level': CustomVariableValue.string('42'),
     * }
     * ```
     */
    customVariables?: CustomVariables;
    /**
     * Optional baseline safe-area colour applied when the paywall background
     * can't derive one and `background.safe_area_fallback_color` is unset.
     * Hosts (e.g. workflow runtimes) pass their workflow-level fallback here.
     */
    safeAreaFallbackColor?: ColorScheme | null;
}
declare const Paywall: import("svelte").Component<Props, {}, "">;
type Paywall = ReturnType<typeof Paywall>;
export default Paywall;