@lightspeed/online-payments-sdk 1.8.0 → 1.9.0

package/dist/cjs/v1/widget.js

@@ -45,9 +45,19 @@ var error_1 = require("./error");
 var logger_1 = require("./logging/logger");
 var common_1 = require("./logging/common");
 var EventBroadcaster_1 = require("./EventBroadcaster");
+var version_1 = require("../version");
+// Exposes the running SDK version on the mount point so it can be inspected
+// in browser devtools (e.g. `document.querySelector('[data-lightspeed-payments-sdk-version]')`).
+var SDK_VERSION_ATTRIBUTE = 'data-lightspeed-payments-sdk-version';
+function markMountPointWithSdkVersion(mountPoint) {
+    mountPoint.setAttribute(SDK_VERSION_ATTRIBUTE, version_1.SDK_VERSION);
+}
+function unmarkMountPointWithSdkVersion(mountPoint) {
+    mountPoint.removeAttribute(SDK_VERSION_ATTRIBUTE);
+}
 function mountPaymentWidget(session, config) {
     return __awaiter(this, void 0, void 0, function () {
-        var eventBroadcaster, decodedSession, logger_2, configSummary, widgetController, _a, error_2;
+        var eventBroadcaster, decodedSession, logger_2, configSummary, widgetController, _a, unmount_1, error_2;
         return __generator(this, function (_b) {
             switch (_b.label) {
                 case 0:
@@ -86,8 +96,17 @@ function mountPaymentWidget(session, config) {
                     return [3 /*break*/, 7];
                 case 6: throw new error_1.UnsupportedLocationError();
                 case 7:
+                    markMountPointWithSdkVersion(config.mountPoint);
                     widgetController.submit = (0, common_1.withLogging)(logger_2, 'Submit', widgetController.submit);
-                    widgetController.unmount = (0, common_1.withLogging)(logger_2, 'Unmount', widgetController.unmount);
+                    unmount_1 = widgetController.unmount;
+                    widgetController.unmount = (0, common_1.withLogging)(logger_2, 'Unmount', function () {
+                        try {
+                            unmount_1();
+                        }
+                        finally {
+                            unmarkMountPointWithSdkVersion(config.mountPoint);
+                        }
+                    });
                     return [2 /*return*/, widgetController];
                 case 8:
                     error_2 = _b.sent();
@@ -104,7 +123,7 @@ function mountPaymentWidget(session, config) {
 // Internal impl of v1.mountMultiStepWidget (additive; event-based flows unchanged).
 function mountMultiStepWidget(session, config) {
     return __awaiter(this, void 0, void 0, function () {
-        var eventBroadcaster, decodedSession, logger_3, controller, _a, error_3;
+        var eventBroadcaster, decodedSession, logger_3, controller, _a, unmount_2, error_3;
         return __generator(this, function (_b) {
             switch (_b.label) {
                 case 0:
@@ -137,9 +156,18 @@ function mountMultiStepWidget(session, config) {
                     return [3 /*break*/, 5];
                 case 4: throw new error_1.UnsupportedLocationError();
                 case 5:
+                    markMountPointWithSdkVersion(config.mountPoint);
                     controller.submit = (0, common_1.withLogging)(logger_3, 'Submit', controller.submit);
                     controller.handleNextAction = (0, common_1.withLogging)(logger_3, 'HandleNextAction', controller.handleNextAction);
-                    controller.unmount = (0, common_1.withLogging)(logger_3, 'Unmount', controller.unmount);
+                    unmount_2 = controller.unmount;
+                    controller.unmount = (0, common_1.withLogging)(logger_3, 'Unmount', function () {
+                        try {
+                            unmount_2();
+                        }
+                        finally {
+                            unmarkMountPointWithSdkVersion(config.mountPoint);
+                        }
+                    });
                     return [2 /*return*/, controller];
                 case 6:
                     error_3 = _b.sent();

package/dist/cjs/version.js

@@ -3,4 +3,4 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.SDK_VERSION = void 0;
 // This file is auto-generated during the build process
 // DO NOT EDIT MANUALLY - Version is extracted from package.json
-exports.SDK_VERSION = '1.8.0';
+exports.SDK_VERSION = '1.9.0';

package/dist/index.d.ts

@@ -1,5 +1,8 @@
+import { SDK_VERSION } from './version';
 export type * from './v1';
 export { THEME_COLORS } from './v1';
+export { SDK_VERSION };
 export declare const LightspeedPayments: {
     v1: import("./v1").LightspeedPaymentsV1;
+    version: string;
 };

package/dist/index.js

@@ -1,5 +1,8 @@
 import { v1 } from './v1';
+import { SDK_VERSION } from './version';
 export { THEME_COLORS } from './v1';
+export { SDK_VERSION };
 export var LightspeedPayments = {
     v1: v1,
+    version: SDK_VERSION,
 };

package/dist/v1/EventBroadcaster.d.ts

@@ -25,6 +25,23 @@ export type ChangeEvent = BaseEvent & {
     paymentMethodType?: string;
     saveCheckboxChecked?: boolean;
 };
+export type RequiresFinalizationResult = {
+    status: 'RequiresFinalization';
+    code: 'RequiresFinalization';
+    /**
+     * Provider-neutral backend command. Integrations should forward this object
+     * unchanged to their Processing Service finalization endpoint.
+     */
+    finalizationRequest: {
+        paymentData: {
+            type: 'payment-method';
+            id: string;
+        };
+        options: {
+            savePaymentMethod: boolean;
+        };
+    };
+};
 export type ErrorResultEvent = BaseEvent & {
     code: SupportedErrorCodes;
     status: 'Error';
@@ -42,6 +59,6 @@ export declare class EventBroadcaster {
     private convertInternalEventToExternal;
     registerMiddleware(middleware: EventMiddleware): void;
     applyMiddlewares(event: InternalEvent): Event;
-    publish(event: InternalEvent): void;
+    publish(event: InternalEvent): Event;
 }
 export {};

package/dist/v1/EventBroadcaster.js

@@ -63,6 +63,7 @@ var EventBroadcaster = /** @class */ (function () {
         var processedEvent = this.applyMiddlewares(event);
         var eventListener = this.listenersRegistry[event.status];
         eventListener(processedEvent);
+        return processedEvent;
     };
     return EventBroadcaster;
 }());

package/dist/v1/common.d.ts

@@ -1,10 +1,16 @@
-import { EventBroadcaster, Event } from './EventBroadcaster';
+import { EventBroadcaster, Event, RequiresFinalizationResult } from './EventBroadcaster';
 import { Session } from './session';
 import { PaymentWidgetTheme } from './widget';
 export type SessionType = 'payment' | 'payment-with-save' | 'moto' | 'moto-with-save' | 'save';
+export type WidgetSubmitResult = Event | RequiresFinalizationResult;
 export type WidgetController = {
     unmount: () => void;
-    submit: () => Promise<Event>;
+    submit: () => Promise<WidgetSubmitResult>;
+    /**
+     * Deferred MOTO only. Reports a definitive backend decline so the widget can
+     * present it and collect a fresh PaymentMethod on the next submission.
+     */
+    reportFinalizationDecline?: (result: RequiresFinalizationResult, message: string) => void;
 };
 export type MultiStepResult = {
     status: 'RequiresFinalization';

package/dist/v1/index.d.ts

@@ -6,8 +6,8 @@
  */
 import { WidgetController, MultiStepController } from './common';
 import { PaymentWidgetConfiguration } from './widget';
-export type { WidgetController, MultiStepController, MultiStepResult, SessionType, DefaultValues, } from './common';
-export type { Event } from './EventBroadcaster';
+export type { WidgetController, MultiStepController, MultiStepResult, SessionType, DefaultValues, WidgetSubmitResult, } from './common';
+export type { Event, RequiresFinalizationResult } from './EventBroadcaster';
 export { UnsupportedLocationError, InvalidSessionPayloadError, InvalidSessionError, ProcessingError, } from './error';
 export type { PaymentWidgetConfiguration, PaymentWidgetTheme } from './widget';
 export { THEME_COLORS } from './stripe/themes';

package/dist/v1/stripe/localizedText.d.ts

@@ -0,0 +1,3 @@
+/** Locale-selected UI text rendered alongside Stripe Elements. */
+export declare function getSavePaymentMethodText(locale?: string): string;
+export declare function getCardDeclinedText(locale?: string): string;

package/dist/v1/stripe/localizedText.js

@@ -0,0 +1,28 @@
+/** Locale-selected UI text rendered alongside Stripe Elements. */
+var SAVE_PAYMENT_METHOD_TEXT = {
+    de: 'Zahlungsinformationen für zukünftige Einkäufe speichern',
+    en: 'Save payment details for future purchases',
+    fr: 'Enregistrer les informations de paiement pour vos prochains achats',
+    nl: 'Betaalgegevens opslaan voor toekomstige aankopen',
+};
+var CARD_DECLINED_TEXT = {
+    de: 'Ihre Karte wurde abgelehnt.',
+    en: 'Your card was declined.',
+    fr: 'Votre carte a été refusée.',
+    nl: 'Uw kaart is geweigerd.',
+};
+function getLanguage(locale) {
+    var _a;
+    var resolvedLocale = !locale || locale === 'auto'
+        ? ((_a = globalThis.navigator) === null || _a === void 0 ? void 0 : _a.language) || 'en'
+        : locale;
+    return resolvedLocale.toLowerCase().split('-')[0];
+}
+export function getSavePaymentMethodText(locale) {
+    var language = getLanguage(locale);
+    return SAVE_PAYMENT_METHOD_TEXT[language] || SAVE_PAYMENT_METHOD_TEXT.en;
+}
+export function getCardDeclinedText(locale) {
+    var language = getLanguage(locale);
+    return CARD_DECLINED_TEXT[language] || CARD_DECLINED_TEXT.en;
+}

package/dist/v1/stripe/session.d.ts

@@ -1,15 +1,38 @@
 import { StripeElementLocale } from '@stripe/stripe-js';
 import { BaseSession } from '../session';
-export type StripeSession = BaseSession & {
+export type StripeBaseSession = BaseSession & {
     psp: 'STRIPE';
-    context: StripeContext;
 };
-export type StripeContext = {
-    clientSecret: string;
+type StripeContextBase = {
     publishableKey: string;
+    locale?: StripeElementLocale;
+    businessName?: string;
+};
+export type IntentBoundStripeContext = StripeContextBase & {
+    intentMode?: 'intent-bound';
+    clientSecret: string;
     customerSessionClientSecret?: string;
     intent: 'save-card' | 'payment';
-    locale?: StripeElementLocale;
     redirectUrl?: string;
-    businessName?: string;
 };
+export type DeferredStripeContext = StripeContextBase & {
+    intentMode: 'deferred';
+    intent: 'payment';
+    amount: number;
+    currency: string;
+    paymentMethodTypes: string[];
+    onBehalfOf: string;
+    clientSecret?: never;
+    customerSessionClientSecret?: never;
+};
+export type StripeContext = IntentBoundStripeContext | DeferredStripeContext;
+export type IntentBoundStripeSession = StripeBaseSession & {
+    context: IntentBoundStripeContext;
+};
+export type DeferredStripeSession = StripeBaseSession & {
+    context: DeferredStripeContext;
+};
+export type StripeSession = IntentBoundStripeSession | DeferredStripeSession;
+export declare function isDeferredStripeSession(session: StripeSession): session is DeferredStripeSession;
+export declare function isIntentBoundStripeSession(session: StripeSession): session is IntentBoundStripeSession;
+export {};

package/dist/v1/stripe/session.js

@@ -1 +1,7 @@
-export {};
+export function isDeferredStripeSession(session) {
+    return session.context.intentMode === 'deferred';
+}
+export function isIntentBoundStripeSession(session) {
+    return (session.context.intentMode === undefined ||
+        session.context.intentMode === 'intent-bound');
+}

package/dist/v1/stripe/shared.d.ts

@@ -1,6 +1,6 @@
 import { StripePaymentElementOptions, StripeAddressElementOptions } from '@stripe/stripe-js';
 import type { StripeElements, Stripe, StripeAddressElement, StripePaymentElement } from '@stripe/stripe-js';
-import { StripeContext, StripeSession } from './session';
+import { IntentBoundStripeSession, StripeContext } from './session';
 import { DefaultValues } from '../common';
 import { EventBroadcaster } from '../EventBroadcaster';
 import { PaymentWidgetTheme } from '../widget';
@@ -45,6 +45,7 @@ export declare function buildCardConsentText(businessName: string, reason: strin
  * text.
  */
 export declare function createCardConsentElement(consentText: string): HTMLElement;
+export declare function createSavePaymentMethodElement(mountElement: HTMLElement, onChange: (checked: boolean) => void, locale?: string): HTMLElement;
 /**
  * Create and mount payment element
  */
@@ -61,7 +62,9 @@ export declare function createPaymentElement(elements: StripeElements, options:
  * Also includes the current save-payment-method checkbox state (when present) on every Change event,
  * and emits a Change event when that checkbox state changes.
  */
-export declare function setupChangeEventHandler(paymentElement: StripePaymentElement, eventBroadcaster: EventBroadcaster, addressElement?: StripeAddressElement | null): void;
+export declare function setupChangeEventHandler(paymentElement: StripePaymentElement, eventBroadcaster: EventBroadcaster, addressElement?: StripeAddressElement | null, onPaymentValueChange?: (value: {
+    savePaymentMethod?: boolean;
+}) => void, initialSaveCheckboxState?: boolean): (saveCheckboxChecked: boolean) => void;
 /**
  * Create and mount address element
  */
@@ -76,12 +79,12 @@ export declare function cleanupElements(paymentElement: StripePaymentElement, ad
 /**
  * Handle save card operation
  */
-export declare function handleSaveCard(stripe: Stripe, elements: StripeElements, session: StripeSession, addressElement?: StripeAddressElement | null): Promise<import("../EventBroadcaster").SucceededResultEvent | import("../EventBroadcaster").PendingResultEvent | import("../EventBroadcaster").DeclinedResultEvent | import("../EventBroadcaster").ErrorResultEvent>;
+export declare function handleSaveCard(stripe: Stripe, elements: StripeElements, session: IntentBoundStripeSession, addressElement?: StripeAddressElement | null): Promise<import("../EventBroadcaster").SucceededResultEvent | import("../EventBroadcaster").PendingResultEvent | import("../EventBroadcaster").DeclinedResultEvent | import("../EventBroadcaster").ErrorResultEvent>;
 /**
  * Handle payment operation
  */
-export declare function handlePayment(stripe: Stripe, elements: StripeElements, session: StripeSession, addressElement?: StripeAddressElement | null): Promise<import("../EventBroadcaster").SucceededResultEvent | import("../EventBroadcaster").PendingResultEvent | import("../EventBroadcaster").DeclinedResultEvent | import("../EventBroadcaster").ErrorResultEvent>;
+export declare function handlePayment(stripe: Stripe, elements: StripeElements, session: IntentBoundStripeSession, addressElement?: StripeAddressElement | null): Promise<import("../EventBroadcaster").SucceededResultEvent | import("../EventBroadcaster").PendingResultEvent | import("../EventBroadcaster").DeclinedResultEvent | import("../EventBroadcaster").ErrorResultEvent>;
 /**
  * Create common submit handler for widgets
  */
-export declare function createSubmitHandler(stripe: Stripe, elements: StripeElements, session: StripeSession, eventBroadcaster: EventBroadcaster, addressElement?: StripeAddressElement | null): () => Promise<import("../EventBroadcaster").SucceededResultEvent | import("../EventBroadcaster").PendingResultEvent | import("../EventBroadcaster").DeclinedResultEvent | import("../EventBroadcaster").ErrorResultEvent>;
+export declare function createSubmitHandler(stripe: Stripe, elements: StripeElements, session: IntentBoundStripeSession, eventBroadcaster: EventBroadcaster, addressElement?: StripeAddressElement | null): () => Promise<import("../EventBroadcaster").SucceededResultEvent | import("../EventBroadcaster").PendingResultEvent | import("../EventBroadcaster").DeclinedResultEvent | import("../EventBroadcaster").ErrorResultEvent>;

package/dist/v1/stripe/shared.js

@@ -49,17 +49,18 @@ import { loadStripe, } from '@stripe/stripe-js';
 import { EventBuilder } from './ResultBuilder';
 import { InvalidSessionPayloadError, ProcessingError } from '../error';
 import { getThemeConfig } from './themes';
-import { ACH_TERMS_TEXT, ACH_TERMS_URL, PARTNER_CARD_CONSENT_TEXT } from './terms';
+import { ACH_TERMS_TEXT, ACH_TERMS_URL, PARTNER_CARD_CONSENT_TEXT, } from './terms';
+import { getSavePaymentMethodText } from './localizedText';
 /**
  * Initialize Stripe with the given context
  */
 export function initStripe(context, theme) {
     return __awaiter(this, void 0, void 0, function () {
-        var publishableKey, clientSecret, customerSessionClientSecret, loadedStripe, stripe, themeConfig, elementsOptions, elements;
+        var publishableKey, loadedStripe, stripe, themeConfig, sharedElementsOptions, elements, elementsOptions, elementsOptions;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
-                    publishableKey = context.publishableKey, clientSecret = context.clientSecret, customerSessionClientSecret = context.customerSessionClientSecret;
+                    publishableKey = context.publishableKey;
                     return [4 /*yield*/, loadStripe(publishableKey)];
                 case 1:
                     loadedStripe = _a.sent();
@@ -68,8 +69,15 @@ export function initStripe(context, theme) {
                     }
                     stripe = loadedStripe;
                     themeConfig = getThemeConfig(theme);
-                    elementsOptions = __assign(__assign(__assign({ clientSecret: clientSecret, customerSessionClientSecret: customerSessionClientSecret }, (context.locale && { locale: context.locale })), (themeConfig && { appearance: themeConfig.appearance })), (themeConfig && { fonts: themeConfig.fonts }));
-                    elements = stripe.elements(elementsOptions);
+                    sharedElementsOptions = __assign(__assign(__assign({}, (context.locale && { locale: context.locale })), (themeConfig && { appearance: themeConfig.appearance })), (themeConfig && { fonts: themeConfig.fonts }));
+                    if (context.intentMode === 'deferred') {
+                        elementsOptions = __assign(__assign(__assign({}, sharedElementsOptions), { mode: 'payment', amount: context.amount, currency: context.currency.toLowerCase(), paymentMethodTypes: context.paymentMethodTypes, paymentMethodCreation: 'manual' }), (context.onBehalfOf && { onBehalfOf: context.onBehalfOf }));
+                        elements = stripe.elements(elementsOptions);
+                    }
+                    else {
+                        elementsOptions = __assign(__assign({}, sharedElementsOptions), { clientSecret: context.clientSecret, customerSessionClientSecret: context.customerSessionClientSecret });
+                        elements = stripe.elements(elementsOptions);
+                    }
                     return [2 /*return*/, { stripe: stripe, elements: elements }];
             }
         });
@@ -206,6 +214,24 @@ export function createCardConsentElement(consentText) {
     container.appendChild(text);
     return container;
 }
+export function createSavePaymentMethodElement(mountElement, onChange, locale) {
+    var label = document.createElement('label');
+    label.className = 'stripe-save-payment-method-container';
+    var checkbox = document.createElement('input');
+    checkbox.type = 'checkbox';
+    checkbox.className = 'stripe-save-payment-method-checkbox';
+    checkbox.dataset.testid = 'save-payment-method-checkbox';
+    var text = document.createElement('span');
+    text.className = 'stripe-save-payment-method-text';
+    text.textContent = getSavePaymentMethodText(locale);
+    label.appendChild(checkbox);
+    label.appendChild(text);
+    mountElement.appendChild(label);
+    // The label must remain clickable, but its consent text is not selectable.
+    label.addEventListener('selectstart', function (event) { return event.preventDefault(); });
+    checkbox.addEventListener('change', function () { return onChange(checkbox.checked); });
+    return label;
+}
 /**
  * Create and mount payment element
  */
@@ -245,12 +271,12 @@ export function createPaymentElement(elements, options, mountElement, eventBroad
  * Also includes the current save-payment-method checkbox state (when present) on every Change event,
  * and emits a Change event when that checkbox state changes.
  */
-export function setupChangeEventHandler(paymentElement, eventBroadcaster, addressElement) {
+export function setupChangeEventHandler(paymentElement, eventBroadcaster, addressElement, onPaymentValueChange, initialSaveCheckboxState) {
     var paymentComplete = false;
     var addressComplete = !addressElement; // If no address element, consider it complete
     var previousComplete = null;
     var previousMethodType;
-    var previousSaveCheckboxState; // Track save checkbox state
+    var previousSaveCheckboxState = initialSaveCheckboxState;
     var emitChangeEvent = function () {
         var complete = paymentComplete && addressComplete;
         previousComplete = complete;
@@ -261,23 +287,30 @@ export function setupChangeEventHandler(paymentElement, eventBroadcaster, addres
         })));
     };
     paymentElement.on('change', function (event) {
-        var _a, _b;
+        var _a, _b, _c;
         paymentComplete = event.complete;
+        onPaymentValueChange === null || onPaymentValueChange === void 0 ? void 0 : onPaymentValueChange({
+            savePaymentMethod: (_a = event.value) === null || _a === void 0 ? void 0 : _a.savePaymentMethod,
+        });
         var completenessChanged = (paymentComplete && addressComplete) !== previousComplete;
-        var methodType = (_a = event.value) === null || _a === void 0 ? void 0 : _a.type;
+        var methodType = (_b = event.value) === null || _b === void 0 ? void 0 : _b.type;
         var methodTypeChanged = methodType !== undefined && methodType !== previousMethodType;
         if (methodType !== undefined) {
             previousMethodType = methodType;
         }
         // `savePaymentMethod` reflects the "save for future use" checkbox; it is only
         // present on the change event when the element renders that checkbox.
-        var saveCheckboxChanged = false;
-        var saveCheckboxState = (_b = event.value) === null || _b === void 0 ? void 0 : _b.savePaymentMethod;
-        if (saveCheckboxState !== undefined) {
-            saveCheckboxChanged = previousSaveCheckboxState !== saveCheckboxState;
-            previousSaveCheckboxState = saveCheckboxState;
+        var stripeSaveCheckboxChanged = false;
+        var stripeSaveCheckboxState = (_c = event.value) === null || _c === void 0 ? void 0 : _c.savePaymentMethod;
+        if (initialSaveCheckboxState === undefined &&
+            stripeSaveCheckboxState !== undefined) {
+            stripeSaveCheckboxChanged =
+                previousSaveCheckboxState !== stripeSaveCheckboxState;
+            previousSaveCheckboxState = stripeSaveCheckboxState;
         }
-        if (completenessChanged || methodTypeChanged || saveCheckboxChanged) {
+        if (completenessChanged ||
+            methodTypeChanged ||
+            stripeSaveCheckboxChanged) {
             emitChangeEvent();
         }
     });
@@ -290,6 +323,13 @@ export function setupChangeEventHandler(paymentElement, eventBroadcaster, addres
             }
         });
     }
+    return function (saveCheckboxChecked) {
+        if (previousSaveCheckboxState === saveCheckboxChecked) {
+            return;
+        }
+        previousSaveCheckboxState = saveCheckboxChecked;
+        emitChangeEvent();
+    };
 }
 /**
  * Create and mount address element

package/dist/v1/stripe/terms.d.ts

@@ -1,5 +1,5 @@
 /**
- * Translatable strings for Stripe payment elements.
+ * Terms and consent text for Stripe payment elements.
  * These strings are prepared for Transifex extraction.
  *
  * Usage with Transifex:

package/dist/v1/stripe/terms.js

@@ -1,5 +1,5 @@
 /**
- * Translatable strings for Stripe payment elements.
+ * Terms and consent text for Stripe payment elements.
  * These strings are prepared for Transifex extraction.
  *
  * Usage with Transifex:

package/dist/v1/stripe/themes.js

@@ -47,7 +47,7 @@ function ensureThemeStylesheet() {
     }
     var styleElement = document.createElement('style');
     styleElement.id = THEME_STYLESHEET_ID;
-    styleElement.textContent = "\n    /* Dark theme styles for the mount element */\n    .lsp-theme-dark {\n      background-color: ".concat(THEME_COLORS.DARK.BACKGROUND, " !important;\n      color: ").concat(THEME_COLORS.DARK.TEXT, " !important;\n    }\n    /* Dark theme styles for Stripe custom terms elements */\n    .lsp-theme-dark .stripe-terms-chevron-icon {\n      color: ").concat(THEME_COLORS.DARK.TEXT, " !important;\n    }\n    .lsp-theme-dark .stripe-custom-terms-text {\n      color: ").concat(THEME_COLORS.DARK.TEXT, " !important;\n    }\n    .lsp-theme-dark .stripe-expandable-terms-content p {\n      color: ").concat(THEME_COLORS.DARK.TEXT, " !important;\n    }\n  ");
+    styleElement.textContent = "\n    /* Dark theme styles for the mount element */\n    .lsp-theme-dark {\n      background-color: ".concat(THEME_COLORS.DARK.BACKGROUND, " !important;\n      color: ").concat(THEME_COLORS.DARK.TEXT, " !important;\n    }\n    /* Dark theme styles for Stripe custom terms elements */\n    .lsp-theme-dark .stripe-terms-chevron-icon {\n      color: ").concat(THEME_COLORS.DARK.TEXT, " !important;\n    }\n    .lsp-theme-dark .stripe-custom-terms-text {\n      color: ").concat(THEME_COLORS.DARK.TEXT, " !important;\n    }\n    .lsp-theme-dark .stripe-expandable-terms-content p {\n      color: ").concat(THEME_COLORS.DARK.TEXT, " !important;\n    }\n    .lsp-theme-dark .stripe-save-payment-method-container {\n      color: ").concat(THEME_COLORS.DARK.TEXT, " !important;\n    }\n    .lsp-theme-dark .stripe-finalization-error {\n      color: #ff8a8a !important;\n    }\n    .lsp-theme-dark .stripe-save-payment-method-checkbox {\n      border-color: #697386;\n      background-color: #30313d;\n    }\n    .lsp-theme-dark .stripe-save-payment-method-checkbox:checked {\n      border-color: #007ea3;\n      background-color: #007ea3;\n    }\n    .lsp-theme-dark .stripe-save-payment-method-checkbox:focus-visible {\n      border-color: #00d4ff;\n      box-shadow: 0 0 0 3px rgba(0, 212, 255, 0.25);\n    }\n  ");
     document.head.appendChild(styleElement);
 }
 /**
@@ -71,7 +71,7 @@ function ensureInvoicingDarkStylesheet() {
     }
     var styleElement = document.createElement('style');
     styleElement.id = INVOICING_DARK_STYLESHEET_ID;
-    styleElement.textContent = "\n    /*\n     * Mirror the non-colour .lsp-theme-invoicing rules from\n     * lightspeed-global-styles.css. Class selectors match whole tokens, so an\n     * element carrying the class lsp-theme-invoicing-dark is never matched by\n     * the selector .lsp-theme-invoicing; without these the terms text would\n     * fall back to the system font while the Elements iframe renders Inter.\n     */\n    .lsp-theme-invoicing-dark {\n      color: #e3e4e9;\n      padding-bottom: 0 !important;\n    }\n    .lsp-theme-invoicing-dark .stripe-custom-terms-text,\n    .lsp-theme-invoicing-dark .stripe-expandable-terms-content p {\n      color: #e3e4e9;\n      font-family: 'Inter', system-ui, sans-serif;\n    }\n    /*\n     * Links and the expand toggle. lightspeed-global-styles.css colours these\n     * #635bff, which is close to unreadable on a dark surface, so they take the\n     * consumer dark interactive colour instead. The chevron inherits from its\n     * toggle so the two can never drift apart.\n     */\n    .lsp-theme-invoicing-dark .stripe-custom-terms-text a,\n    .lsp-theme-invoicing-dark .stripe-expandable-terms-content a,\n    .lsp-theme-invoicing-dark .stripe-expandable-terms-toggle {\n      color: #6cb5fb;\n    }\n    .lsp-theme-invoicing-dark .stripe-terms-chevron-icon {\n      color: inherit;\n    }\n  ";
+    styleElement.textContent = "\n    /*\n     * Mirror the non-colour .lsp-theme-invoicing rules from\n     * lightspeed-global-styles.css. Class selectors match whole tokens, so an\n     * element carrying the class lsp-theme-invoicing-dark is never matched by\n     * the selector .lsp-theme-invoicing; without these the terms text would\n     * fall back to the system font while the Elements iframe renders Inter.\n     */\n    .lsp-theme-invoicing-dark {\n      color: #e3e4e9;\n      padding-bottom: 0 !important;\n    }\n    .lsp-theme-invoicing-dark .stripe-custom-terms-text,\n    .lsp-theme-invoicing-dark .stripe-expandable-terms-content p,\n    .lsp-theme-invoicing-dark .stripe-save-payment-method-container,\n    .lsp-theme-invoicing-dark .stripe-finalization-error {\n      color: #e3e4e9;\n      font-family: 'Inter', system-ui, sans-serif;\n    }\n    .lsp-theme-invoicing-dark .stripe-finalization-error {\n      color: #ffa597;\n    }\n    .lsp-theme-invoicing-dark .stripe-save-payment-method-checkbox {\n      border-color: #525256;\n      background-color: #242427;\n    }\n    .lsp-theme-invoicing-dark .stripe-save-payment-method-checkbox:checked {\n      border-color: #286ea8;\n      background-color: #286ea8;\n    }\n    .lsp-theme-invoicing-dark .stripe-save-payment-method-checkbox:focus-visible {\n      border-color: #6cb5fb;\n      box-shadow: 0 0 0 3px rgba(108, 181, 251, 0.25);\n    }\n    /*\n     * Links and the expand toggle. lightspeed-global-styles.css colours these\n     * #635bff, which is close to unreadable on a dark surface, so they take the\n     * consumer dark interactive colour instead. The chevron inherits from its\n     * toggle so the two can never drift apart.\n     */\n    .lsp-theme-invoicing-dark .stripe-custom-terms-text a,\n    .lsp-theme-invoicing-dark .stripe-expandable-terms-content a,\n    .lsp-theme-invoicing-dark .stripe-expandable-terms-toggle {\n      color: #6cb5fb;\n    }\n    .lsp-theme-invoicing-dark .stripe-terms-chevron-icon {\n      color: inherit;\n    }\n  ";
     document.head.appendChild(styleElement);
 }
 /**

package/dist/v1/stripe/widget.js

@@ -34,15 +34,18 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
         if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
     }
 };
+import { isDeferredStripeSession, isIntentBoundStripeSession, } from './session';
+import { InvalidSessionPayloadError } from '../error';
 import { mountPaymentWidget } from './widgets/payment';
 import { mountMotoWidget } from './widgets/moto';
+import { mountDeferredMotoWidget } from './widgets/deferredMoto';
 import { applyThemeClass, removeThemeClass } from './themes';
 /**
  * Main mount function that delegates to appropriate widget based on session type
  */
 export function mount(mountElement, session, eventBroadcaster, defaultValues, theme) {
     return __awaiter(this, void 0, void 0, function () {
-        var sessionType, widgetController, _a, originalUnmount_1, error_1;
+        var sessionType, widgetController_1, widgetController, _a, error_1;
         return __generator(this, function (_b) {
             switch (_b.label) {
                 case 0:
@@ -53,43 +56,79 @@ export function mount(mountElement, session, eventBroadcaster, defaultValues, th
                     sessionType = session.metadata.sessionType;
                     _b.label = 1;
                 case 1:
-                    _b.trys.push([1, 8, , 9]);
+                    _b.trys.push([1, 10, , 11]);
+                    if (!isDeferredStripeSession(session)) return [3 /*break*/, 3];
+                    validateDeferredSession(session, sessionType);
+                    return [4 /*yield*/, mountDeferredMotoWidget(mountElement, session, eventBroadcaster, defaultValues, theme)];
+                case 2:
+                    widgetController_1 = _b.sent();
+                    return [2 /*return*/, withThemeCleanup(widgetController_1, mountElement, theme)];
+                case 3:
+                    if (!isIntentBoundStripeSession(session)) {
+                        throw new InvalidSessionPayloadError('Invalid Stripe session context');
+                    }
                     widgetController = void 0;
                     _a = sessionType;
                     switch (_a) {
-                        case 'payment': return [3 /*break*/, 2];
-                        case 'payment-with-save': return [3 /*break*/, 2];
-                        case 'moto': return [3 /*break*/, 4];
-                        case 'moto-with-save': return [3 /*break*/, 4];
-                        case 'save': return [3 /*break*/, 4];
+                        case 'payment': return [3 /*break*/, 4];
+                        case 'payment-with-save': return [3 /*break*/, 4];
+                        case 'moto': return [3 /*break*/, 6];
+                        case 'moto-with-save': return [3 /*break*/, 6];
+                        case 'save': return [3 /*break*/, 6];
                     }
-                    return [3 /*break*/, 6];
-                case 2: return [4 /*yield*/, mountPaymentWidget(mountElement, session, eventBroadcaster, defaultValues, theme)];
-                case 3:
-                    widgetController = _b.sent();
-                    return [3 /*break*/, 7];
-                case 4: return [4 /*yield*/, mountMotoWidget(mountElement, session, eventBroadcaster, defaultValues, theme)];
+                    return [3 /*break*/, 8];
+                case 4: return [4 /*yield*/, mountPaymentWidget(mountElement, session, eventBroadcaster, defaultValues, theme)];
                 case 5:
                     widgetController = _b.sent();
-                    return [3 /*break*/, 7];
-                case 6: throw new Error("Unsupported session type: ".concat(sessionType));
+                    return [3 /*break*/, 9];
+                case 6: return [4 /*yield*/, mountMotoWidget(mountElement, session, eventBroadcaster, defaultValues, theme)];
                 case 7:
-                    originalUnmount_1 = widgetController.unmount;
-                    widgetController.unmount = function () {
-                        removeThemeClass(mountElement, theme);
-                        originalUnmount_1();
-                    };
-                    return [2 /*return*/, widgetController];
-                case 8:
+                    widgetController = _b.sent();
+                    return [3 /*break*/, 9];
+                case 8: throw new Error("Unsupported session type: ".concat(sessionType));
+                case 9: 
+                // Wrap unmount to include theme cleanup
+                return [2 /*return*/, withThemeCleanup(widgetController, mountElement, theme)];
+                case 10:
                     error_1 = _b.sent();
                     // Clean up theme class if mounting fails
                     removeThemeClass(mountElement, theme);
                     throw error_1;
-                case 9: return [2 /*return*/];
+                case 11: return [2 /*return*/];
             }
         });
     });
 }
+function validateDeferredSession(session, sessionType) {
+    var context = session.context;
+    if (!['moto', 'moto-with-save'].includes(sessionType || '') ||
+        context.intentMode !== 'deferred' ||
+        context.intent !== 'payment' ||
+        !Number.isSafeInteger(context.amount) ||
+        context.amount <= 0 ||
+        typeof context.currency !== 'string' ||
+        !/^[a-z]{3}$/i.test(context.currency) ||
+        typeof context.publishableKey !== 'string' ||
+        context.publishableKey.length === 0 ||
+        typeof context.onBehalfOf !== 'string' ||
+        context.onBehalfOf.length === 0 ||
+        context.onBehalfOf.trim() !== context.onBehalfOf ||
+        !Array.isArray(context.paymentMethodTypes) ||
+        context.paymentMethodTypes.length !== 1 ||
+        context.paymentMethodTypes[0] !== 'card' ||
+        'clientSecret' in context ||
+        'customerSessionClientSecret' in context) {
+        throw new InvalidSessionPayloadError('Invalid deferred Stripe MOTO session context');
+    }
+}
+function withThemeCleanup(controller, mountElement, theme) {
+    var originalUnmount = controller.unmount;
+    controller.unmount = function () {
+        removeThemeClass(mountElement, theme);
+        originalUnmount();
+    };
+    return controller;
+}
 export var StripeWidget = {
     mount: mount,
 };

package/dist/v1/stripe/widgets/deferredMoto.d.ts

@@ -0,0 +1,5 @@
+import { DefaultValues, WidgetController } from '../../common';
+import { EventBroadcaster } from '../../EventBroadcaster';
+import { PaymentWidgetTheme } from '../../widget';
+import { DeferredStripeSession } from '../session';
+export declare function mountDeferredMotoWidget(mountElement: HTMLElement, session: DeferredStripeSession, eventBroadcaster: EventBroadcaster, defaultValues?: DefaultValues, theme?: PaymentWidgetTheme): Promise<WidgetController>;