@revenuecat/purchases-ui-js/dist/data/entities.d.ts

Web components for Paywalls. Powered by RevenueCat

import type { AlignmentType, BorderType, CircleShape, ColorType, CornerRadiusType, DimensionType, FitTypes, FontSizeTags, FontWeights, RectangleShape, ShadowType, ShapeType, SizeType, Spacing, TextAlignments } from "../types";
import type { PurchaseState } from "./state";
import type { VariableDictionary } from "../utils/variable-utils";
import type { ZStackChildStyles } from "../components/stack/stack-utils";
export interface Extra {
    [key: string]: unknown;
}
export type ComponentTypes = "stack" | "text" | "image" | "button" | "purchase_button" | "footer" | "package" | "timeline";
export interface PaywallComponent extends Extra {
    type: ComponentTypes;
    id: string;
    name: string;
    fallback?: PaywallComponent;
}
export interface Stack extends PaywallComponent {
    spacing: number;
    components: PaywallComponent[];
}
type BaseNodeBackgroundColor = {
    type: "color";
    value: ColorType;
};
export type BaseNodeBackgroundImage = {
    type: "image";
    value: ImageSourceType;
    color_overlay?: ColorType;
    fit_mode?: FitTypes;
};
export type BaseNodeBackgroundType = BaseNodeBackgroundColor | BaseNodeBackgroundImage;
export interface ComponentConfig {
    colors?: Record<string, string>;
    fonts?: {
        [fontName: string]: {
            ios: string;
            android: string;
            web: string;
        };
    };
    asset_base_url?: string;
    base: {
        default_font_name?: string;
        background?: BaseNodeBackgroundType;
        stack: Stack;
        sticky_footer?: {
            stack: Stack;
            id: string;
            name: string;
            type: "footer";
        } | null;
    };
}
export interface ComponentLocalizations extends Extra {
    [locale: string]: {
        [label_id: string]: string;
    };
}
export interface PaywallData extends Extra {
    components_config: ComponentConfig;
    components_localizations: ComponentLocalizations;
    default_locale: string;
}
export interface ActionsProps {
    onAction?: (action: SupportedActions, data?: Extra) => void;
}
export interface PurchaseStateProps {
    purchaseState: PurchaseState;
}
export type ComponentState = {
    [state: string]: boolean;
};
interface SharedComponentProps extends PaywallComponent, ActionsProps, PurchaseStateProps {
    labels: ComponentLocalizations;
    id: string;
    name: string;
    variableDictionary?: VariableDictionary;
    componentState?: ComponentState;
    zStackChildStyles?: ZStackChildStyles;
}
interface Action {
    type: "restore_purchases" | "navigate_to" | "navigate_back" | "purchase" | "select_package";
}
type OverrideProps<T> = {
    states?: {
        [state: string]: T;
    };
};
export interface RestorePurchasesAction extends Action {
    type: "restore_purchases";
}
export interface NavigateBackAction extends Action {
    type: "navigate_back";
}
export interface NavigateToAction extends Action {
    type: "navigate_to";
    destination: "customer_center" | "privacy_policy" | "terms" | "url";
    url?: {
        url_lid: string;
        method: "in_app_browser" | "external_browser" | "deep_link";
    };
}
export interface PurchaseAction extends Action {
    type: "purchase";
}
export interface SelectPackageAction extends Action {
    type: "select_package";
}
export type SupportedActions = RestorePurchasesAction | NavigateBackAction | NavigateToAction | PurchaseAction | SelectPackageAction;
export interface ButtonNodeProps extends SharedComponentProps {
    type: "button";
    action: SupportedActions;
    stack: StackProps;
}
export interface PurchaseButtonProps extends SharedComponentProps {
    type: "purchase_button";
    stack: StackProps;
}
export interface FooterProps extends SharedComponentProps {
    type: "footer";
    stack: StackProps;
}
export interface PackageProps extends SharedComponentProps {
    type: "package";
    stack: StackProps;
    package_id: string;
    is_selected_by_default: boolean;
}
export interface StackProps extends SharedComponentProps {
    background_color?: ColorType;
    border?: BorderType;
    components: PaywallComponent[];
    dimension: DimensionType;
    margin: Spacing;
    padding: Spacing;
    shadow?: ShadowType;
    shape?: ShapeType;
    size: SizeType;
    spacing?: number;
    type: "stack";
    badge?: {
        stack: {
            components: PaywallComponent[];
            type: "stack";
        };
        style: "overlay" | "edge_to_edge" | "nested";
        alignment: Exclude<AlignmentType, "center">;
        shape: ShapeType;
        padding: Spacing;
        margin: Spacing;
        text_lid: string;
        color: ColorType;
        font_name?: string;
        font_weight: keyof typeof FontWeights;
        font_size: keyof typeof FontSizeTags;
        horizontal_alignment: keyof typeof TextAlignments;
        background_color: ColorType;
    };
    overrides?: OverrideProps<StackProps>;
}
export interface TextNodeProps extends SharedComponentProps {
    background_color?: ColorType;
    color: ColorType;
    components: PaywallComponent[];
    font_name?: string;
    font_size: keyof typeof FontSizeTags;
    font_weight: keyof typeof FontWeights;
    horizontal_alignment: keyof typeof TextAlignments;
    margin: Spacing;
    padding: Spacing;
    text_lid: string;
    type: "text";
    size: SizeType;
    variableDictionary?: VariableDictionary;
    overrides?: OverrideProps<TextNodeProps>;
}
type ImageSourceDictionaryType = {
    original: string;
    heic: string;
    heic_low_res: string;
    webp: string;
    webp_low_res: string;
    width?: number;
    height?: number;
};
type ImageSourceType = {
    light: ImageSourceDictionaryType;
    dark?: ImageSourceDictionaryType;
};
export interface ImageMaskShapeType {
    type: "circle" | "rectangle" | "concave" | "convex";
    corners?: CornerRadiusType;
}
export interface ImageProps extends SharedComponentProps {
    type: "image";
    fit_mode: FitTypes;
    size: SizeType;
    source: ImageSourceType;
    color_overlay?: ColorType;
    mask_shape?: ImageMaskShapeType;
    max_height?: number;
    override_source_lid?: string;
    overrides?: OverrideProps<ImageProps>;
}
export type ItemProps = {
    title: {
        text_lid: string;
        color: ColorType;
        font_name?: string;
        font_weight?: keyof typeof FontWeights;
        font_size?: keyof typeof FontSizeTags;
        horizontal_alignment?: keyof typeof TextAlignments;
    };
    description?: {
        text_lid: string;
        color: ColorType;
        font_name?: string;
        font_weight?: keyof typeof FontWeights;
        font_size?: keyof typeof FontSizeTags;
        horizontal_alignment?: keyof typeof TextAlignments;
    };
    icon: {
        name: string;
        color: ColorType;
        width_and_height: number;
        padding: number;
    };
    icon_background?: {
        shape: CircleShape | RectangleShape;
        color: ColorType;
        border?: BorderType;
    };
    connector?: {
        width: number;
        margin: {
            top: number;
            bottom: number;
        };
        color: ColorType;
    };
};
export interface TimelineProps extends SharedComponentProps {
    type: "timeline";
    item_spacing: number;
    text_spacing: number;
    size: SizeType;
    padding: Spacing;
    margin: Spacing;
    items: ItemProps[];
}
export interface TimelineItemProps extends ItemProps, SharedComponentProps {
    text_spacing: number;
    item_spacing: number;
}
export {};