@namiml/web-sdk 1.1.0 → 1.2.0

package/dist/nami-web.d.ts

@@ -1,4 +1,4 @@
-import { CSSResult, LitElement, ReactiveController, ReactiveControllerHost, TemplateResult } from "lit";
+import { CSSResult, LitElement, PropertyValueMap, ReactiveController, ReactiveControllerHost, TemplateResult } from "lit";
 interface CampaignRule {
     rule: string;
     name: string;
@@ -7,7 +7,7 @@ interface CampaignRule {
     form_factors: FormFactor[];
     type: string;
     external_segment_id: string;
-    value: null;
+    value: string;
 }
 interface FormFactor {
     form_factor: string;
@@ -19,6 +19,65 @@ type TDevice = "phone" | "tablet" | "television" | "desktop";
 type TDeviceOrientation = "landscape" | "portrait";
 type NamiLanguageCode = "af" | "ar" | "ar-dz" | "ast" | "az" | "bg" | "be" | "bn" | "br" | "bs" | "ca" | "cs" | "cy" | "da" | "de" | "dsb" | "el" | "en" | "en-au" | "en-gb" | "eo" | "es" | "es-ar" | "es-co" | "es-mx" | "es-ni" | "es-ve" | "et" | "eu" | "fa" | "fi" | "fr" | "fy" | "ga" | "gd" | "gl" | "he" | "hi" | "hr" | "hsb" | "hu" | "hy" | "ia" | "id" | "ig" | "io" | "is" | "it" | "ja" | "ka" | "kab" | "kk" | "km" | "kn" | "ko" | "ky" | "lb" | "lt" | "lv" | "mk" | "ml" | "mn" | "mr" | "my" | "nb" | "ne" | "nl" | "nn" | "os" | "pa" | "pl" | "pt" | "pt-br" | "ro" | "ru" | "sk" | "sl" | "sq" | "sr" | "sr-latn" | "sv" | "sw" | "ta" | "te" | "tg" | "th" | "tk" | "tr" | "tt" | "udm" | "uk" | "ur" | "uz" | "vi" | "zh-hans" | "zh-hant";
 type NamiLogLevel = "error" | "warn" | "info" | "debug";
+interface NamiProductDetails {
+    name?: string;
+    description?: string;
+    product_ref_id: string;
+    product_type: ProductType;
+    subscription_period?: NamiSubscriptionPeriod;
+    offers: NamiProductOffer[];
+}
+type NamiProductOffer = NamiOfferPrice & {
+    offer_ref_id?: string;
+    offer_type: "promo" | "default";
+    promo_period?: NamiOfferPeriod;
+    promo_price?: NamiOfferPrice;
+};
+type NamiOfferPrice = {
+    price: number;
+    currency: string;
+};
+type NamiSubscriptionPeriod = {
+    type: SubscriptionInterval;
+    count: number;
+    period_start?: number;
+    period_end?: number;
+};
+type NamiOfferPeriod = NamiSubscriptionPeriod;
+type SubscriptionInterval = "day" | "week" | "month" | "year" | "unknown";
+type ProductType = "subscription" | "one_time_purchase" | "unknown";
+interface SKU {
+    id: string;
+    name: string;
+    sku_ref_id: string;
+    entitlements: IEntitlements[];
+    sku_type: ProductType;
+}
+interface PaywallSKU extends SKU {
+    display_text?: string;
+    sub_display_text?: string;
+    featured?: boolean;
+    variables?: {
+        [key: string]: any;
+    };
+    product_details?: NamiProductDetails | null;
+}
+type NamiSKU = {
+    id: string;
+    name?: string;
+    skuId: string;
+    appleProduct?: AppleProduct;
+    googleProduct?: GoogleProduct;
+    amazonProduct?: AmazonProduct;
+    type: ProductType;
+    promoId?: string | null;
+    promoToken?: string | null;
+    productDetails?: NamiProductDetails | null;
+    entitlements: IEntitlements[];
+};
+type AppleProduct = unknown;
+type GoogleProduct = unknown;
+type AmazonProduct = unknown;
 // image
 type TImageComponent = TBaseComponent & {
     component: "image";
@@ -26,10 +85,15 @@ type TImageComponent = TBaseComponent & {
     aspectRatio?: number;
     imageCropping?: "fill" | "fit";
 };
+// segmentPicker
+type TSegmentPicker = TBaseComponent & {
+    component: "segmentPicker";
+    components: TSegmentPickerItem[];
+    onTap?: UserAction;
+};
 type TSegmentPickerItem = TBaseComponent & {
     component: "segmentPickerItem";
-    ref: any;
-    id: string;
+    ref?: any;
     text?: string;
     alignment?: AlignmentType;
     activeFillColor?: string;
@@ -71,13 +135,13 @@ type TSymbolComponent = Omit<TTextComponent, "component" | "textType" | "text">
 // text
 type TTextComponent = TBaseComponent & {
     component: "text";
-    textType: "title" | "body" | "legal";
+    textType: "title" | "body" | "legal" | "text";
     androidFontSize?: number;
     fontSize?: number;
     fontColor?: string;
     fontName?: string;
     text: string;
-    strikethrough?: boolean;
+    strikethrough?: boolean | string;
     linkColor?: string;
 };
 // text-list
@@ -95,15 +159,17 @@ type TConditionalComponent = TBaseComponent & {
 };
 // button
 type TButtonContainer = TBaseComponent & {
+    id?: string;
     component: "button";
-    actionTap: string;
+    actionTap?: string; // deprecated
     onTap?: UserAction;
-    sku?: SelectableItemType;
+    sku?: NamiSKU;
     components: Array<TTextComponent | TTextListComponent | TSpacerComponent | TImageComponent>;
+    screenreaderText?: string;
 };
 type UserAction = {
     function: string;
-    parameters: UserActionParameters;
+    parameters?: UserActionParameters;
 };
 type UserActionParameters = {
     partialState?: Record<string, any>;
@@ -113,7 +179,7 @@ type UserActionParameters = {
     confirmationMessage?: string;
     confirmBeforePurchase?: TTestObject[];
 };
-type Callback = (data?: any) => void;
+type Callback = (sku?: NamiSKU) => void;
 // carouselContainer
 type TCarouselContainer = Omit<TContainer, "component"> & {
     component: "carouselContainer";
@@ -138,8 +204,8 @@ type TFlexProductContainer = Omit<TContainer, "component"> & {
     products: "all" | "subset";
     flexDirection: FlexDirectionObject;
     subsetGroup?: string;
-    productFeaturedComponents: TContainer[];
-    productBaseComponents: TContainer[];
+    productFeaturedComponents?: TContainer[];
+    productBaseComponents?: TContainer[];
 };
 type FlexDirectionObject = {
     small: "vertical" | "horizontal";
@@ -152,8 +218,8 @@ type TProductContainer = Omit<TContainer, "component"> & {
     component: "productContainer";
     products: "all" | "subset";
     subsetGroup?: string;
-    productFeaturedComponents: TContainer[];
-    productBaseComponents: TContainer[];
+    productFeaturedComponents?: TContainer[];
+    productBaseComponents?: TContainer[];
 };
 // stack
 type TStack = Omit<TContainer, "component"> & {
@@ -165,6 +231,7 @@ type TStack = Omit<TContainer, "component"> & {
 //     : TBaseComponent[K];
 // };
 interface TBaseComponent {
+    id?: string;
     component: string;
     grow?: boolean;
     flag?: null | string;
@@ -203,7 +270,6 @@ interface TBaseComponent {
     width?: number | string;
     dropShadow?: string;
     refId?: string;
-    // TODO: Deprecate the attributes below
     _fields?: {
         [attribute: string]: TFieldSettings;
     } & {
@@ -224,7 +290,7 @@ interface TBaseComponent {
     fixedHeight?: number;
     fixedWidth?: number | "fitContent";
 }
-type TComponent = TButtonContainer | TContainer | TTextListComponent | TTextComponent | TSpacerComponent | TImageComponent | TSvgImageComponent | TSymbolComponent | TCarouselContainer | TProductContainer | TFlexProductContainer | TStack | TConditionalComponent | TSegmentPickerItem;
+type TComponent = TButtonContainer | TContainer | TTextListComponent | TTextComponent | TSpacerComponent | TImageComponent | TSvgImageComponent | TSymbolComponent | TCarouselContainer | TProductContainer | TFlexProductContainer | TStack | TConditionalComponent | TSegmentPicker | TSegmentPickerItem;
 type DirectionType = "vertical" | "horizontal";
 type AlignmentType = "center" | "right" | "left" | "top" | "bottom";
 type BorderLocationType = "upperLeft" | "upperRight" | "lowerLeft" | "lowerRight";
@@ -235,8 +301,13 @@ type TTestObject = {
     expected: any;
     operator: "equals" | "contains" | "notEquals" | "set" | "notSet" | "notContains";
 };
+type TransformToString<T> = {
+    [P in keyof T]: T[P] extends number | boolean ? T[P] | string : T[P];
+};
 type TConditionalAttributes = Array<Omit<TConditionalComponent, "components"> & {
-    attributes: Partial<TBaseComponent>;
+    attributes: Partial<TransformToString<TBaseComponent>> & {
+        text?: string;
+    };
 }>;
 type TField = "image" | "listContainerComponent" | "text" | "url" | "textArea" | "fontSelect" | "splitTextArea" | "color" | "colorGradient" | "number" | "alignment" | "carouselSlides" | "option" | "iconSelect" | "toggle";
 type TContainer = TBaseComponent & {
@@ -272,33 +343,38 @@ type TFieldSettings = {
     showOpacity?: boolean;
     newRow?: any;
 };
-interface NamiProductDetails {
-    name?: string;
-    description?: string;
-    product_ref_id: string;
-    product_type: ProductType;
-    subscription_period?: NamiSubscriptionPeriod;
-    offers: NamiProductOffer[];
+type NamiPurchaseSource = "campaign" | "marketplace" | "unknown";
+type NamiPurchaseState = "purchased" | "failed" | "cancelled" | "pending" | "unknown";
+interface Purchase {
+    orderId: string;
+    productId: string;
+    purchaseTime: number;
+    purchaseState: NamiPurchaseState;
+    purchaseToken: string;
+    autoRenewing: boolean;
+    acknowledged: boolean;
+    sku: NamiSKU;
+    type: "inapp" | "subs" | "unknown";
+}
+type NamiPurchase = {
+    purchase_initiated_timestamp: number;
+    purchase_source: NamiPurchaseSource;
+    sku_id: string;
+    sku_UUID: string;
+    transaction_identifier?: string;
+    purchase_token?: string;
+};
+declare enum LaunchCampaignError {
+    DEFAULT_CAMPAIGN_NOT_FOUND = 0,
+    LABELED_CAMPAIGN_NOT_FOUND = 1,
+    CAMPAIGN_DATA_NOT_FOUND = 2,
+    PAYWALL_ALREADY_DISPLAYED = 3,
+    SDK_NOT_INITIALIZED = 4,
+    PAYWALL_COULD_NOT_DISPLAY = 5,
+    URL_CAMPAIGN_NOT_FOUND = 6,
+    PRODUCT_DATA_NOT_FOUND = 7,
+    PRODUCT_GROUPS_NOT_FOUND = 8
 }
-type NamiProductOffer = NamiOfferPrice & {
-    offer_ref_id?: string;
-    offer_type: "promo" | "default";
-    promo_period?: NamiOfferPeriod;
-    promo_price?: NamiOfferPrice;
-};
-type NamiOfferPrice = {
-    price: number;
-    currency: string;
-};
-type NamiSubscriptionPeriod = {
-    type: SubscriptionInterval;
-    count: number;
-    period_start?: number;
-    period_end?: number;
-};
-type NamiOfferPeriod = NamiSubscriptionPeriod;
-type SubscriptionInterval = "day" | "week" | "month" | "year" | "unknown";
-type ProductType = "subscription" | "one_time_purchase" | "unknown";
 type TPaywallContext = TInitialState & {
     paywallId: string;
     livePaywalls: IPaywall[];
@@ -323,7 +399,7 @@ type TPaywallContext = TInitialState & {
         [key: string]: any;
     };
     hasNotch: boolean;
-    skuItems: SelectableItemType[];
+    skuItems: PaywallSKU[];
     groups: {
         id: string;
         displayName: string;
@@ -333,28 +409,20 @@ type TPaywallContext = TInitialState & {
     selectedProducts: {
         [currentGroupId: string]: string;
     };
-    launch: {
-        productGroups: string[];
-        customAttributes: {
-            [key: string]: any;
-        };
-    };
+    launch: TPaywallLaunchContext;
     sku: {
         [key: string]: any;
     };
+    purchaseInProgress: boolean;
+    productBeingPurchased?: NamiSKU;
+    timeSpentOnPaywall?: number;
 };
-type SelectableItemType = {
-    id: string;
-    sku_id: string;
-    promo_id: string;
-    featured: boolean;
-    selected: boolean;
-    name: string;
-    sku_ref_id: string;
-    sku_type: string;
-    product_details?: NamiProductDetails;
-    [key: string]: any;
-    variables: {
+type TPaywallLaunchContext = {
+    productGroups: string[];
+    customAttributes: {
+        [key: string]: any;
+    };
+    customObject?: {
         [key: string]: any;
     };
 };
@@ -371,21 +439,7 @@ interface ISkuMenu {
     name: string;
     display_name: string;
     ref: string;
-    products: SelectableItemType[];
-}
-interface IProducts {
-    id: string;
-    featured: boolean;
-    name: string;
-    sku_ref_id: string;
-    display_text: string;
-    sub_display_text: string;
-    entitlements: IEntitlements[];
-    variables?: {
-        [key: string]: any;
-    };
-    sku_type: string;
-    _isSelected?: boolean; // local prop maybe will be removed
+    products: PaywallSKU[];
 }
 interface IEntitlements {
     id: string;
@@ -406,6 +460,9 @@ type FontDetails = {
 type TPaywallTemplate = {
     id: string;
     orgs?: string | null;
+    org_id?: string;
+    changelog?: string;
+    userHasAccess?: boolean;
     media?: {
         [key: string]: string;
     };
@@ -459,35 +516,52 @@ declare enum NamiPaywallAction {
     PURCHASE_CANCELLED = "PURCHASE_CANCELLED",
     PURCHASE_PENDING = "PURCHASE_PENDING",
     PURCHASE_UNKNOWN = "PURCHASE_UNKNOWN",
-    PURCHASE_DEFERRED = "PURCHASE_DEFERRED"
+    PURCHASE_DEFERRED = "PURCHASE_DEFERRED",
+    EMPTY = ""
 }
 type NamiPaywallEvent = {
     action: NamiPaywallAction;
-    sku?: SelectableItemType;
-    campaignId: string;
-    campaignName: string;
-    paywallId: string;
-    paywallName: string;
+    sku?: NamiSKU;
+    campaignId?: string;
+    campaignName?: string;
+    campaignType?: string;
+    campaignLabel?: string;
+    campaignUrl?: string;
+    paywallId?: string;
+    paywallName?: string;
+    componentChange?: NamiPaywallComponentChange;
+    segmentId?: string;
+    externalSegmentId?: string;
+    deeplinkUrl?: string;
+    purchaseError?: string;
+    purchases?: NamiPurchase[];
+    timeSpentOnPaywall?: number;
+};
+type NamiPaywallComponentChange = {
+    id?: string;
+    name?: string;
 };
 type NamiPaywallActionHandler = (event: NamiPaywallEvent) => void;
+type PaywallResultHandler = (success: boolean, error?: LaunchCampaignError) => void;
 interface IConfig {
     id: string;
     capabilities: string[];
-    marketplace_app_id: string;
+    marketplace_app_id?: string | null;
 }
 type NamiConfiguration = {
     appPlatformId: string;
     logLevel?: NamiLogLevel;
     languageCode?: NamiLanguageCode;
     namiCommands?: string[];
-    initialConfig?: InitialConfig;
+    initialConfig?: string | InitialConfig;
     formFactor?: TDevice;
 };
 type InitialConfig = {
-    appConfig: IConfig;
-    products: IProducts[];
-    paywalls: IPaywall[];
-    campaign_rules: CampaignRule[];
+    appConfig?: IConfig;
+    platform_config?: IConfig;
+    products?: PaywallSKU[];
+    paywalls?: IPaywall[];
+    campaign_rules?: CampaignRule[];
 };
 type NamiConfigurationState = {
     sdkInitialized: boolean;
@@ -498,6 +572,7 @@ declare class Nami {
     static instance: Nami;
     get isInitialized(): boolean;
     static configure(options: NamiConfiguration): Promise<NamiConfigurationState>;
+    private static setInitialConfig;
     private initializeSDK;
 }
 declare class ContextConsumer implements ReactiveController {
@@ -514,13 +589,18 @@ declare class NamiElement extends LitElement {
     constructor();
     protected styles(): CSSResult;
     createRenderRoot(): HTMLElement | DocumentFragment;
+    protected willUpdate(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
     disconnectedCallback(): void;
 }
 declare class PaywallComponent extends NamiElement {
     private formFactor;
-    styles(): import("lit").CSSResult;
-    constructor(paywall: IPaywall, formFactor: TDevice);
+    private campaign;
+    private paywall;
+    private paywallEvent;
+    constructor(paywall: IPaywall, formFactor: TDevice, event: Partial<NamiPaywallEvent>, campaign?: CampaignRule, context?: TPaywallLaunchContext);
+    firstUpdated(): void;
     private getTemplate;
+    styles(): import("lit").CSSResult;
     render(): TemplateResult;
 }
 declare class NamiCampaignManager {
@@ -556,29 +636,11 @@ declare class NamiCampaignManager {
     /**
      * Launches a campaign with a given label.
      * @param label - The label of the campaign to launch.
-     * @param paywallActionHandler - Optional handler for paywall actions.
+     * @param withUrl - The deeplink URL of the campaign to launch.
+     * @param actionCallback - Optional handler for paywall actions.
      * @returns - The launched paywall web component.
      */
-    static launch(label: string, paywallActionHandler?: NamiPaywallActionHandler): PaywallComponent;
-    /**
-     * Launches a campaign with a given URL.
-     * @param url - The deeplink URL of the campaign to launch.
-     * @param paywallActionHandler - Optional handler for paywall actions.
-     * @returns The launched paywall web component.
-     */
-    static launch(url: URL, paywallActionHandler?: NamiPaywallActionHandler): PaywallComponent;
-    /**
-     * Launches a campaign with a given type and value.
-     * @param campaign - The campaign object with optional type and value.
-     * @param campaign.type - Specifies the campaign type. Acceptable values are 'label' or 'url'. If not provided, defaults to 'label'.
-     * @param campaign.value - The value of the campaign as a string. Acceptable values are the label or deeplink URL.
-     * @param paywallActionHandler - Optional handler for paywall actions.
-     * @returns The launched paywall web component.
-     */
-    static launch(campaign: {
-        type?: "label" | "url";
-        value: string;
-    }, paywallActionHandler?: NamiPaywallActionHandler): PaywallComponent;
+    static launch(label?: string, withUrl?: string, context?: TPaywallLaunchContext, resultCallback?: PaywallResultHandler, actionCallback?: NamiPaywallActionHandler): PaywallComponent | void;
     /**
      * Private Instance Methods
      */
@@ -700,12 +762,20 @@ declare class NamiPaywallManager {
     static registerDeeplinkActionHandler(handler: Callback): Callback;
     static registerBuySkuHandler(handler: Callback): Callback;
     static registerRestoreHandler(handler: Callback): Callback;
-    static buySkuComplete(): void;
+    /**
+     * Notify the NamiPaywallManager that a purchase initiated from the
+     * [NamiBuySkuHandler] is complete. Only available for plans where Nami is
+     * not handling subscription & IAP management.
+     */
+    static buySkuComplete(purchase: Purchase): Promise<void>;
+    /**
+     Notify the NamiPaywallManager that purchase flow handled by you is cancelled.
+     Used to disable product purchase-in-progress loading indicators
+     */
     static buySkuCancel(): void;
     /**
      * Private Instance Methods
      */
     private get sdkInitialized();
-    getProductDetails(skuName: string): NamiProductDetails;
 }
-export { Nami, NamiCampaignManager, NamiCustomerManager, NamiPaywallManager, NamiConfiguration, NamiLanguageCode, CampaignRule as NamiCampaign, NamiPaywallAction, NamiPaywallEvent, NamiPaywallActionHandler };
+export { Nami, NamiCampaignManager, NamiCustomerManager, NamiPaywallManager, NamiConfiguration, NamiLanguageCode, CampaignRule as NamiCampaign, NamiSKU, NamiPaywallAction, NamiPaywallEvent, NamiPaywallActionHandler };