@namiml/web-sdk 3.4.0-dev.202604010118 → 3.4.0-dev.202604182042

package/dist/nami-web.d.ts

@@ -1,10 +1,606 @@
-import "./shims/globalThis";
-import "./shims/getAttributeNames";
-import "./utils/ssr-shim";
-export { Nami } from "./nami";
-export { NamiCampaignManager } from "./nami/campaign";
-export { NamiCustomerManager } from "./nami/customer";
-export { NamiPaywallManager } from "./nami/paywalls";
-export { NamiEntitlementManager } from "./nami/entitlement";
-export * from "./types/externals";
-import "./components";
+import { PaywallState, IPaywall, NamiPaywallLaunchContext, NamiCampaign, TPaywallContext, TBaseComponent, TSpacerComponent, TSemverObj, TButtonContainer, THeaderFooter, TTextComponent, TSymbolComponent, TContainer, TProductContainer, TImageComponent, TSegmentPicker, TSegmentPickerItem, TVideoComponent, TCollapseContainer, TResponsiveGrid, TRepeatingGrid, TCarouselContainer, TVolumeButton, TPlayPauseButton, TStack, TPaywallLaunchContext, NamiFlow, TQRCodeComponent, TToggleSwitch, TRadioButton, TProgressIndicatorComponent, TToggleButtonComponent, TCountdownTimerTextComponent, TProgressBarComponent } from '@namiml/sdk-core';
+export { CustomerJourneyState, DeviceProfile, LaunchCampaignError, LogLevel, Nami, NamiAnonymousCampaign, NamiCampaign, NamiCampaignManager, NamiCampaignRuleType, NamiCampaignSegment, NamiConfiguration, NamiCustomerManager, NamiEntitlement, NamiEntitlementManager, NamiFlowCampaign, NamiFlowEventHandler, NamiFlowHandoffStepHandler, NamiFlowManager, NamiInitialConfig, NamiLanguageCodes, NamiLogLevel, NamiPaywallAction, NamiPaywallActionHandler, NamiPaywallComponentChange, NamiPaywallEvent, NamiPaywallEventVideoMetadata, NamiPaywallLaunchContext, NamiPaywallManager, NamiPaywallManagerEvents, NamiProductDetails, NamiProductOffer, NamiPurchase, NamiPurchaseDetails, NamiPurchasesState, NamiSKU, NamiSKUType, NamiSubscriptionInterval, NamiSubscriptionPeriod, isNamiFlowCampaign } from '@namiml/sdk-core';
+import * as lit from 'lit';
+import { ReactiveController, ReactiveControllerHost, LitElement, CSSResultGroup, CSSResult, PropertyValueMap, TemplateResult, PropertyValues } from 'lit';
+import * as lit_html from 'lit-html';
+import Swiper from 'swiper';
+
+/* eslint-disable @typescript-eslint/no-implied-eval */
+(() => {
+  if (typeof globalThis !== 'undefined') {
+    return;
+  }
+
+  const resolveGlobal = () => {
+    if (typeof self !== 'undefined') {
+      return self;
+    }
+    if (typeof window !== 'undefined') {
+      return window;
+    }
+    if (typeof global !== 'undefined') {
+      return global;
+    }
+
+    return Function('return this')();
+  };
+
+  const resolvedGlobal = resolveGlobal();
+
+  Object.defineProperty(resolvedGlobal, 'globalThis', {
+    value: resolvedGlobal,
+    writable: true,
+    enumerable: false,
+    configurable: true,
+  });
+})();
+
+(() => {
+  if (
+    typeof Element === "undefined" ||
+    typeof Element.prototype.getAttributeNames === "function"
+  ) {
+    return;
+  }
+
+  Element.prototype.getAttributeNames = function getAttributeNames() {
+    const attributes = this.attributes;
+    const names = new Array(attributes.length);
+
+    for (let i = 0; i < attributes.length; i += 1) {
+      names[i] = attributes[i].name;
+    }
+
+    return names;
+  };
+})();
+
+/**
+ * Web-specific extension of PaywallState that integrates with Lit's
+ * reactive rendering system.
+ *
+ * PaywallState (from @namiml/sdk-core) contains ALL platform-agnostic
+ * business logic: setPaywall, setCurrentGroupData, setFlow, setState,
+ * setCustomerAttribute, selectedProducts, getSelectedCampaign,
+ * getPaywallActionEventData, setOpenHeaderIds, setPurchase, etc.
+ *
+ * This subclass adds only web-specific concerns:
+ *  - Lit ReactiveController integration (host.requestUpdate on state change)
+ *  - Dynamic state getters that read from the DOM (tvQuality, viewport dims)
+ *  - Type-safe static method overrides returning PaywallContextProvider
+ */
+declare class PaywallContextProvider extends PaywallState implements ReactiveController {
+    host: ReactiveControllerHost | null;
+    static create(paywall: IPaywall, context: NamiPaywallLaunchContext, campaign: NamiCampaign): PaywallContextProvider;
+    static remove(provider: PaywallContextProvider): void;
+    static get currentProvider(): PaywallContextProvider | undefined;
+    constructor(paywall: IPaywall, context: NamiPaywallLaunchContext, campaign: NamiCampaign);
+    hostConnected(): void;
+    hostDisconnected(): void;
+    /**
+     * Called by PaywallState.setState() after every state mutation.
+     * Re-attaches DOM-dependent computed getters and triggers a Lit re-render.
+     */
+    protected onStateChanged(): void;
+    /**
+     * Attaches computed getters to `this.state` for properties that depend
+     * on the browser DOM (window dimensions, device pixel ratio).
+     * Must be called after every setState() since setState replaces the
+     * state object, losing the previous getters.
+     */
+    private defineDynamicStateProps;
+    private getTVQuality;
+    private getViewportWidth;
+    private getViewportHeight;
+}
+
+declare class ContextConsumer implements ReactiveController {
+    private host;
+    state: TPaywallContext;
+    contextProvider: PaywallContextProvider;
+    constructor(host: ReactiveControllerHost, contextProvider: PaywallContextProvider);
+    handleStateChange(): void;
+    hostConnected(): void;
+    hostDisconnected(): void;
+}
+
+declare class NamiElementBase extends LitElement {
+    static styles: CSSResultGroup;
+    contextConsumer: ContextConsumer;
+    contextProvider: PaywallContextProvider;
+    private _instanceStyleSheet?;
+    private _instanceStyleElement?;
+    constructor();
+    protected styles(): CSSResult;
+    createRenderRoot(): HTMLElement | DocumentFragment;
+    protected shouldUpdate(): boolean;
+    protected willUpdate(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
+    disconnectedCallback(): void;
+    protected getInstanceStyles(): CSSResult[];
+    private ensureInstanceStyleTarget;
+    private applyInstanceStyles;
+}
+declare abstract class NamiElement<C extends TBaseComponent = TBaseComponent> extends NamiElementBase {
+    static styles: CSSResultGroup;
+    contextConsumer: ContextConsumer;
+    contextProvider: PaywallContextProvider;
+    abstract component: C;
+    protected willUpdate(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
+    private applyTestId;
+    protected animationStyles(): CSSResult;
+    protected getInstanceStyles(): CSSResult[];
+}
+
+declare class NamiSpacer extends NamiElement {
+    component: TSpacerComponent;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    protected styles(): CSSResult;
+    render(): TemplateResult;
+}
+
+declare class NamiButton extends NamiElement {
+    component: TButtonContainer;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    constructor();
+    firstTextValue(): string | undefined;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected updated(changedProperties: PropertyValueMap<this>): void;
+    private _handleFocus;
+    private _announceButtonLabel;
+    private _handleBlur;
+    private _dispatchFocusChange;
+    private _dispatchPageChange;
+    private _handleKeyDown;
+    private _handleKeyUp;
+    private _handleClick;
+    protected styles(): CSSResult;
+    render(): any[] | lit_html.TemplateResult<1>;
+}
+
+declare class NamiHeader extends NamiElementBase {
+    components: THeaderFooter;
+    zIndex: string;
+    inFullScreen: boolean;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    private formFactor;
+    protected styles(): CSSResult;
+    render(): any[];
+}
+
+declare class NamiFooter extends NamiElementBase {
+    components: THeaderFooter;
+    zIndex: string;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    protected styles(): CSSResult;
+    render(): any[];
+}
+
+declare class NamiText extends NamiElement {
+    component: TTextComponent;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    protected styles(): CSSResult;
+    render(): TemplateResult;
+}
+declare class NamiSymbol extends NamiElement {
+    component: TSymbolComponent;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    previousSymbolName: string;
+    protected styles(): CSSResult;
+    protected updated(): void;
+    private shouldRenderCurrentIcon;
+    private renderSvgIcon;
+    render(): TemplateResult;
+}
+
+declare class NamiContainer extends NamiElement {
+    component: TContainer | TProductContainer;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    private readonly handleFocusIn;
+    private readonly handleFocusOut;
+    private readonly handleFocusChanged;
+    constructor();
+    disconnectedCallback(): void;
+    protected styles(): CSSResult;
+    render(): any[];
+    private setFocusState;
+}
+
+declare class NamiProductContainer extends NamiElement {
+    component: TProductContainer;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    private currentGroupId;
+    protected styles(): CSSResult;
+    updated(): void;
+    render(): any[][];
+}
+
+declare class NamiImage extends NamiElement {
+    component: TImageComponent;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    protected styles(): CSSResult;
+    protected render(): TemplateResult;
+}
+
+declare class NamiBackgroundContainer extends NamiElement {
+    component: TContainer;
+    fullscreen: boolean;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    connectedCallback(): void;
+    protected styles(): CSSResult;
+    protected updated(): void;
+    render(): any[];
+}
+
+declare class NamiContentContainer extends NamiElement {
+    component: TContainer;
+    zIndex: number;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    protected styles(): CSSResult;
+    firstUpdated(): void;
+    render(): any[];
+}
+
+declare class NamiSegmentPicker extends NamiElement {
+    component: TSegmentPicker;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    constructor();
+    private _handleClick;
+    protected styles(): CSSResult;
+    render(): lit_html.TemplateResult<1>;
+}
+
+declare class NamiSegmentPickerItem extends NamiElement {
+    component: TSegmentPickerItem;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    private _isActive;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private _handleFocus;
+    private _announceButtonLabel;
+    private _handleKeyDown;
+    private _getParentPicker;
+    private _getParentFormId;
+    private _updateFormState;
+    private _handleClick;
+    private _handleHover;
+    updated(changedProperties: PropertyValues): void;
+    protected styles(): CSSResult;
+    render(): lit_html.TemplateResult<1>;
+}
+
+declare class NamiVideo extends NamiElement {
+    component: TVideoComponent;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    private bgVideo;
+    disconnectedCallback(): void;
+    protected styles(): CSSResult;
+    loadMediaSrc(video: HTMLVideoElement): void;
+    updated(): void;
+    protected render(): TemplateResult;
+}
+
+declare class NamiCollapseContainer extends NamiElement {
+    component: TCollapseContainer;
+    inFocusedState: boolean;
+    height: number;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    private isCollapsed;
+    private _handleClick;
+    protected styles(): CSSResult;
+    render(): lit_html.TemplateResult<1>;
+}
+
+declare class NamiResponsiveGrid extends NamiElement {
+    component: TResponsiveGrid;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    private mouseDown;
+    private startX;
+    scrollLeft: any;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    startDragging: (e: any) => void;
+    stopDragging: () => void;
+    move: (e: any) => void;
+    protected styles(): CSSResult;
+    render(): any[][];
+}
+
+declare class NamiRepeatingGrid extends NamiElement {
+    component: TRepeatingGrid;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    protected styles(): CSSResult;
+    render(): any[][];
+}
+
+declare class NamiCarouselContainer extends NamiElement {
+    component: TCarouselContainer;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    swiperInstance: Swiper;
+    slideSpacing: number;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    updateSpacing: (e: CustomEvent) => void;
+    protected styles(): CSSResult;
+    protected updated(): void;
+    private handleSlideChange;
+    private getCarouselOnChange;
+    private getCarouselSlides;
+    render(): lit_html.TemplateResult<1>;
+}
+
+declare class NamiVolumeButton extends NamiElement {
+    component: TVolumeButton;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    private muted;
+    constructor();
+    private _handleFocus;
+    private _announceButtonLabel;
+    private _handleBlur;
+    private _handleKeyDown;
+    private _handleClick;
+    updated(): void;
+    protected styles(): CSSResult;
+    render(): any[];
+}
+
+declare class NamiPlayPauseButton extends NamiElement {
+    component: TPlayPauseButton;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    private playing;
+    constructor();
+    private _handleFocus;
+    private _announceButtonLabel;
+    private _handleBlur;
+    private _handleKeyDown;
+    private _handleClick;
+    updated(): void;
+    protected styles(): CSSResult;
+    render(): any[];
+}
+
+declare class NamiStack extends NamiElement {
+    component: TStack;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    protected styles(): lit.CSSResult;
+    protected render(): any[];
+}
+
+declare class NamiPaywallScreen extends LitElement {
+    paywall: IPaywall;
+    campaign: NamiCampaign;
+    context: TPaywallLaunchContext;
+    private contextProvider;
+    private contextConsumer;
+    private minSDKVersion;
+    timeSpentOnPaywall: number;
+    flow?: NamiFlow;
+    private teardownEvent;
+    static styles: lit.CSSResult;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private userInteractionListener;
+    firstUpdated(): void;
+    private postImpression;
+    private postPaywallScreenData;
+    private getTemplate;
+    render(): lit_html.TemplateResult<1>;
+}
+
+declare class NamiQRCode extends NamiElement {
+    component: TQRCodeComponent;
+    scaleFactor: number;
+    protected styles(): lit.CSSResult;
+    private renderQr;
+    firstUpdated(): void;
+    protected updated(changedProps: Map<string, unknown>): void;
+    private get computedSize();
+    render(): lit_html.TemplateResult<1>;
+}
+
+declare class NamiToggleSwitch extends NamiElement {
+    component: TToggleSwitch;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    isActive: boolean;
+    constructor();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private _handleKeyDown;
+    private _handleClick;
+    protected styles(): CSSResult;
+    private applyPlateStyles;
+    private applyHandleStyles;
+    render(): lit_html.TemplateResult<1>;
+}
+
+declare class NamiRadioButton extends NamiElement {
+    component: TRadioButton;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    constructor();
+    protected styles(): CSSResult;
+    private get isActive();
+    render(): lit_html.TemplateResult<1>;
+}
+
+declare class NamiProgressIndicator extends NamiElement {
+    component: TProgressIndicatorComponent;
+    scaleFactor: number;
+    inFocusedState: boolean;
+    minSDKVersion: TSemverObj;
+    currentWidth: number;
+    private hasInitialized;
+    connectedCallback(): void;
+    firstUpdated(changedProperties: any): void;
+    updated(changedProperties: any): void;
+    protected styles(): CSSResult;
+    private getProgressPercentage;
+    private animateProgress;
+    render(): TemplateResult;
+}
+
+declare class NamiToggleButton extends NamiElement {
+    component: TToggleButtonComponent;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    isActive: boolean;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private _handleFocus;
+    private _announceButtonLabel;
+    private _handleKeyDown;
+    private _handleClick;
+    updated(): void;
+    protected styles(): CSSResult;
+    render(): any[];
+}
+
+declare class NamiCountdownTimerText extends NamiElement {
+    component: TCountdownTimerTextComponent;
+    inFocusedState: boolean;
+    scaleFactor: number;
+    minSDKVersion: TSemverObj;
+    private timer;
+    private startTime;
+    private initialDuration;
+    private hasEmittedCompletion;
+    private timerState;
+    private static readonly DEFAULT_LABELS;
+    private static readonly DEFAULT_UNITS;
+    private static readonly SECONDS_PER_DAY;
+    private static readonly SECONDS_PER_HOUR;
+    private static readonly SECONDS_PER_MINUTE;
+    private static readonly TIMER_INTERVAL_MS;
+    protected firstUpdated(): void;
+    disconnectedCallback(): void;
+    private getTimerId;
+    private loadTimerState;
+    private saveTimerState;
+    private getSavedTimerState;
+    private startTimer;
+    private initializeTimerState;
+    private restoreTimerFromState;
+    private resetTimerState;
+    private onTimerTick;
+    private clearTimer;
+    private calculateTimeValues;
+    private calculateTotalRemainingSeconds;
+    private calculateDurationRemainingSeconds;
+    private calculateTargetDateTimeRemainingSeconds;
+    private calculateCurrentRemainingSeconds;
+    private convertSecondsToTimeUnits;
+    private formatValue;
+    private emitCompletionEvent;
+    updated(changedProperties: PropertyValues): void;
+    private updateAccessibilityAttributes;
+    private handleComponentChange;
+    protected styles(): CSSResult;
+    render(): lit_html.TemplateResult<1>;
+    private buildUnitsToRender;
+    private normalizeLabelPosition;
+    private shouldDisplayLabels;
+    private getLabel;
+    private renderTimerUnits;
+    private renderUnit;
+}
+
+declare class NamiProgressBar extends NamiElement {
+    component: TProgressBarComponent;
+    scaleFactor: number;
+    inFocusedState: boolean;
+    minSDKVersion: TSemverObj;
+    private currentProgress;
+    private isAnimating;
+    private screenreaderAnnouncement;
+    private hasInitialized;
+    private delayTimeoutId;
+    private animationFrameId;
+    private animationStartTime;
+    private startPercentage;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    firstUpdated(changedProperties: any): void;
+    updated(changedProperties: any): void;
+    private cleanup;
+    private getResolvedDuration;
+    private startAnimation;
+    private beginAnimation;
+    private animateDeterminate;
+    private getActiveWidthCss;
+    private isActiveWidthPercent;
+    protected styles(): CSSResult;
+    render(): TemplateResult;
+}
+
+declare global {
+    interface HTMLElementTagNameMap {
+        "nami-spacer": NamiSpacer;
+        "nami-button": NamiButton;
+        "nami-text": NamiText;
+        "nami-segment-picker": NamiSegmentPicker;
+        "nami-segment-picker-item": NamiSegmentPickerItem;
+        "nami-header": NamiHeader;
+        "nami-footer": NamiFooter;
+        "nami-container": NamiContainer;
+        "nami-product-container": NamiProductContainer;
+        "nami-image": NamiImage;
+        "nami-background-container": NamiBackgroundContainer;
+        "nami-content-container": NamiContentContainer;
+        "nami-symbol": NamiSymbol;
+        "nami-video": NamiVideo;
+        "nami-collapse-container": NamiCollapseContainer;
+        "nami-responsive-grid": NamiResponsiveGrid;
+        "nami-repeating-grid": NamiRepeatingGrid;
+        "nami-carousel-container": NamiCarouselContainer;
+        "nami-volume-button": NamiVolumeButton;
+        "nami-play-pause-button": NamiPlayPauseButton;
+        "nami-stack": NamiStack;
+        "nami-paywall-screen": NamiPaywallScreen;
+        "nami-qr-code": NamiQRCode;
+        "nami-toggle-switch": NamiToggleSwitch;
+        "nami-radio-button": NamiRadioButton;
+        "nami-progress-indicator": NamiProgressIndicator;
+        "nami-toggle-button": NamiToggleButton;
+        "nami-countdown-timer-text": NamiCountdownTimerText;
+        "nami-progress-bar": NamiProgressBar;
+    }
+}