@fat-zebra/sdk 1.5.15 → 1.5.16-beta.2

package/dist/hpp/hpp.d.ts

@@ -42,7 +42,7 @@ declare class Hpp {
     private customer;
     private username;
     private sca;
-    private newSca;
+    private ThreeDSecure;
     private cardToken;
     private postMessageClient;
     private test;
@@ -51,6 +51,7 @@ declare class Hpp {
     private headlessPreviouslyLoaded;
     private iframeLoaded;
     private threeDSecureEnabled;
+    private scaHandler;
     constructor(config: HppModuleConfig);
     setListenersAndEmitReady(): void;
     load(config: HppLoadParams): void;

package/dist/hpp/hpp.js

@@ -6,13 +6,13 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import * as bridge from '../shared/bridge-client';
 import { LocalStorageAccessTokenKey } from '../shared/constants';
-import { emit, on } from '../shared/event-manager';
+import { emit, off, on } from '../shared/event-manager';
 import { PostMessageClient } from '../shared/post-message-client';
 import { BridgeEvent, PublicEvent, } from '../shared/types';
 import * as util from '../shared/util';
 import { logMethod } from "../logging/logMethod";
 import { setTransactionReference } from "../logging/logger-context";
-import newSca from "../new_sca";
+import ThreeDSecure from "../three_d_secure";
 const HPP_DEFAULT_OPTIONS = {
     enableSca: false,
     hideButton: false,
@@ -30,7 +30,6 @@ class Hpp {
         this.headlessLoaded = false;
         this.headlessPreviouslyLoaded = false;
         this.iframeLoaded = false;
-        this.newSca = new newSca({ username: config.username, environment: process.env.API_ENV });
         this.postMessageClient = new PostMessageClient({
             channel: 'sca',
             target: this.iframe
@@ -44,6 +43,11 @@ class Hpp {
         };
         if (this.headlessLoaded && this.iframeLoaded) {
             // initial headless load
+            this.ThreeDSecure = new ThreeDSecure({
+                bridge: this.headless,
+                iframe: this.iframe, // to handle loading spinner
+                environment: process.env.API_ENV
+            });
             this.setCrossFramesEventListeners();
             this.setPublicEventListeners();
             emit(PublicEvent.HPP_READY);
@@ -110,7 +114,7 @@ class Hpp {
     setCrossFramesEventListeners() {
         const handlers = {};
         handlers[BridgeEvent.TOKENIZE_CARD_RESPONSE] = (data) => {
-            var _a;
+            var _a, _b;
             if (data.errors) {
                 emit(PublicEvent.TOKENIZATION_ERROR, {
                     message: 'Card tokenization failed.',
@@ -132,9 +136,12 @@ class Hpp {
                 return;
             if (this.hppOptions.enableSca) {
                 if (this.threeDSecureEnabled) {
-                    this.newSca.setup({ card_token: data.token, paymentIntent: this.paymentIntent }).then((data) => {
-                        console.log("result:", data);
-                        // continue with 3DS flow
+                    this.ThreeDSecure.run({
+                        paymentIntent: this.paymentIntent,
+                        merchantUsername: this.username,
+                        cardToken: this.cardToken,
+                        challengeWindowSize: (_a = this.hppOptions) === null || _a === void 0 ? void 0 : _a.challengeWindowSize,
+                        test: this.test
                     });
                     return; // do not continue execution to old 3DS
                 }
@@ -143,7 +150,7 @@ class Hpp {
                     customer: this.customer,
                     paymentIntent: this.paymentIntent,
                     bin: data.bin,
-                    challengeWindowSize: (_a = this.hppOptions) === null || _a === void 0 ? void 0 : _a.challengeWindowSize,
+                    challengeWindowSize: (_b = this.hppOptions) === null || _b === void 0 ? void 0 : _b.challengeWindowSize,
                 });
             }
             else {
@@ -199,18 +206,25 @@ class Hpp {
         };
         handlers[BridgeEvent.THREE_D_SECURE_ENABLED] = (data) => {
             this.threeDSecureEnabled = typeof data === "boolean" ? data : false;
+            if (this.threeDSecureEnabled) {
+                console.log("this is a three_d_secure enabled page: ", this.threeDSecureEnabled);
+                // setPublicEventListeners is set before this feature flag is returned.
+                // we need to therefore unset the scaHandler (for the old implementation or we will get two purchase requests
+                off(PublicEvent.SCA_SUCCESS, this.scaHandler);
+            }
         };
-        this.postMessageClient.setEventListeners(handlers);
+        const handlersIncludingThreeDSecure = Object.assign(Object.assign({}, handlers), this.ThreeDSecure.messageHandlers());
+        this.postMessageClient.setEventListeners(handlersIncludingThreeDSecure);
     }
     setPublicEventListeners() {
-        const handler = (event) => {
+        this.scaHandler = (event) => {
             if (this.hppOptions.tokenizeOnly)
                 return;
             const threedsData = event.detail.data;
             const extra = util.toObjectWithSnakeCaseKeys(threedsData);
             this.createPurchase(extra);
         };
-        on(PublicEvent.SCA_SUCCESS, handler);
+        on(PublicEvent.SCA_SUCCESS, this.scaHandler);
     }
     createPurchase(extra = null) {
         const message = {

package/dist/shared/types.d.ts

@@ -21,7 +21,8 @@ declare enum PublicEvent {
     CLICK_TO_PAY_DCF_LOADED = "fz.click_to_pay.dcf",
     CLICK_TO_PAY_MRT = "fz.click_to_pay.mrt",
     CLICK_TO_PAY_INITIAL_MRT_REQUEST = "fz.click_to_pay.initial_mrt_req",
-    CLICK_TO_PAY_INITIAL_MRT_RESPONSE = "fz.click_to_pay.initial_mrt_res"
+    CLICK_TO_PAY_INITIAL_MRT_RESPONSE = "fz.click_to_pay.initial_mrt_res",
+    DEVICE_PROFILE_READY_THREE_D_SECURE_EVENT = "fz.3ds_rdy"
 }
 declare enum BridgeEvent {
     TOKENIZE_CARD_REQUEST = "fzi.tc_req",
@@ -34,7 +35,16 @@ declare enum BridgeEvent {
     BIN_LOOKUP = "fzi.bin_lookup",
     CLICK_TO_PAY_TOKENIZATION = "fzi.c2p.tc_res",
     READY = "fzi.ready",
-    THREE_D_SECURE_ENABLED = "fzi.three_d_secure_enabled"
+    THREE_D_SECURE_ENABLED = "fzi.three_d_secure_enabled",
+    SETUP_THREE_D_SECURE_REQUEST = "fzi.3ds_stp_req",
+    SETUP_THREE_D_SECURE_SUCCESS_RESPONSE = "fzi.3ds_stp_res",
+    ENROL_THREE_D_SECURE_REQUEST = "fzi.3ds_enrl_req",
+    ENROL_THREE_D_SECURE_RESPONSE = "fzi.3ds_enrl_res",
+    VALIDATE_THREE_D_SECURE_REQUEST = "fzi.3ds_val8_req",
+    VALIDATE_THREE_D_SECURE_RESPONSE = "fzi.3ds_val8_res",
+    THREE_D_SECURE_FAILURE_RESPONSE = "fzi.3ds_fail",
+    THREE_D_SECURE_CHALLENGE_COMPLETE = "fzi.3ds_chlnge_cmplte",
+    LOADING_THREE_D_SECURE = "fzi.loading_three_d_secure"
 }
 declare enum PaymentMethodType {
     CARD = "card",

package/dist/shared/types.js

@@ -22,6 +22,7 @@ var PublicEvent;
     PublicEvent["CLICK_TO_PAY_MRT"] = "fz.click_to_pay.mrt";
     PublicEvent["CLICK_TO_PAY_INITIAL_MRT_REQUEST"] = "fz.click_to_pay.initial_mrt_req";
     PublicEvent["CLICK_TO_PAY_INITIAL_MRT_RESPONSE"] = "fz.click_to_pay.initial_mrt_res";
+    PublicEvent["DEVICE_PROFILE_READY_THREE_D_SECURE_EVENT"] = "fz.3ds_rdy";
 })(PublicEvent || (PublicEvent = {}));
 var BridgeEvent;
 (function (BridgeEvent) {
@@ -36,6 +37,15 @@ var BridgeEvent;
     BridgeEvent["CLICK_TO_PAY_TOKENIZATION"] = "fzi.c2p.tc_res";
     BridgeEvent["READY"] = "fzi.ready";
     BridgeEvent["THREE_D_SECURE_ENABLED"] = "fzi.three_d_secure_enabled";
+    BridgeEvent["SETUP_THREE_D_SECURE_REQUEST"] = "fzi.3ds_stp_req";
+    BridgeEvent["SETUP_THREE_D_SECURE_SUCCESS_RESPONSE"] = "fzi.3ds_stp_res";
+    BridgeEvent["ENROL_THREE_D_SECURE_REQUEST"] = "fzi.3ds_enrl_req";
+    BridgeEvent["ENROL_THREE_D_SECURE_RESPONSE"] = "fzi.3ds_enrl_res";
+    BridgeEvent["VALIDATE_THREE_D_SECURE_REQUEST"] = "fzi.3ds_val8_req";
+    BridgeEvent["VALIDATE_THREE_D_SECURE_RESPONSE"] = "fzi.3ds_val8_res";
+    BridgeEvent["THREE_D_SECURE_FAILURE_RESPONSE"] = "fzi.3ds_fail";
+    BridgeEvent["THREE_D_SECURE_CHALLENGE_COMPLETE"] = "fzi.3ds_chlnge_cmplte";
+    BridgeEvent["LOADING_THREE_D_SECURE"] = "fzi.loading_three_d_secure";
 })(BridgeEvent || (BridgeEvent = {}));
 var PaymentMethodType;
 (function (PaymentMethodType) {

package/dist/three_d_secure/index.d.ts

@@ -0,0 +1,46 @@
+import { EventCallback, PaymentIntent } from "../shared/types";
+import { DeviceDataCollectionMessage } from "./utility/device-data-collection";
+import { Environment } from "../shared/env";
+import { ChallengeWindowSize } from "../sca/types";
+interface ThreeDSecureConfig {
+    successCallback?: EventCallback | null;
+    failureCallback?: EventCallback | null;
+    environment?: Environment;
+    bridge: HTMLIFrameElement;
+    iframe?: HTMLIFrameElement;
+}
+declare class ThreeDSecure {
+    private headlessBridge;
+    private cybersourceReferenceId;
+    private paymentIntent;
+    private cardToken;
+    private test;
+    private merchantUsername;
+    private environment;
+    private challengeWindowSize;
+    private successCallback;
+    private failureCallback;
+    private iframe?;
+    constructor({ successCallback, failureCallback, environment, bridge, iframe }: ThreeDSecureConfig);
+    run({ paymentIntent, cardToken, merchantUsername, challengeWindowSize, test }: {
+        paymentIntent: PaymentIntent;
+        cardToken: string;
+        merchantUsername: string;
+        challengeWindowSize: ChallengeWindowSize;
+        test: boolean;
+    }): void;
+    setupResponse(data: DeviceDataCollectionMessage): void;
+    messageHandlers(): {
+        [key: string]: (data: any) => void;
+    };
+    private reportSuccess;
+    private reportFailure;
+    private setup;
+    private checkEnrollment;
+    private enrolmentResponse;
+    private validateAuthentication;
+    private validationAuthenticationResponse;
+    private createPurchase;
+    private setLoading;
+}
+export default ThreeDSecure;

package/dist/three_d_secure/index.js

@@ -0,0 +1,214 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { BridgeEvent, PublicEvent } from "../shared/types";
+import DeviceDataCollection from "./utility/device-data-collection";
+import { LocalStorageAccessTokenKey } from "../shared/constants";
+import { emit, on } from "../shared/event-manager";
+import { logMethod } from "../logging/logMethod";
+import ThreeDSecureChallengeWindow from "./utility/three_d_secure_challenge_window";
+import { toFzSli } from "../sca/eci-mappings";
+import { snakeCaseKeys, threeDResponseData } from "./utility";
+import env from "../shared/env";
+import { getThreeDSecureEnrollmentResult } from "./utility/getEnrollmentResult";
+import { getThreeDSecureValidationResult } from "./utility/getValidationResult";
+import { ChallengeWindowSize } from "../sca/types";
+import * as util from "../shared/util";
+class ThreeDSecure {
+    constructor({ successCallback, failureCallback, environment, bridge, iframe }) {
+        this.headlessBridge = bridge;
+        this.environment = environment;
+        this.successCallback = successCallback;
+        this.failureCallback = failureCallback;
+        this.iframe = iframe;
+        DeviceDataCollection.listenDataCollectionResponse(environment);
+    }
+    run({ paymentIntent, cardToken, merchantUsername, challengeWindowSize, test }) {
+        this.setLoading();
+        this.paymentIntent = paymentIntent;
+        this.test = test;
+        this.cardToken = cardToken;
+        this.merchantUsername = merchantUsername;
+        this.challengeWindowSize = challengeWindowSize;
+        this.setup();
+    }
+    setupResponse(data) {
+        DeviceDataCollection.setIframeUrl(data.device_data_collection_url, data.access_token);
+        this.cybersourceReferenceId = data.reference_id;
+        DeviceDataCollection.submit();
+    }
+    messageHandlers() {
+        const handlers = {};
+        handlers[BridgeEvent.SETUP_THREE_D_SECURE_SUCCESS_RESPONSE] = (data) => {
+            this.setupResponse(data);
+        };
+        on(PublicEvent.DEVICE_PROFILE_READY_THREE_D_SECURE_EVENT, () => this.checkEnrollment({
+            paymentIntent: this.paymentIntent,
+            cardToken: this.cardToken,
+            merchantUsername: this.merchantUsername,
+            cybersourceReferenceId: this.cybersourceReferenceId,
+        }));
+        handlers[BridgeEvent.ENROL_THREE_D_SECURE_RESPONSE] = (data) => {
+            this.enrolmentResponse(data);
+        };
+        handlers[BridgeEvent.THREE_D_SECURE_CHALLENGE_COMPLETE] = (data) => {
+            this.validateAuthentication(data);
+        };
+        handlers[BridgeEvent.VALIDATE_THREE_D_SECURE_RESPONSE] = (data) => {
+            this.validationAuthenticationResponse(data);
+        };
+        handlers[BridgeEvent.THREE_D_SECURE_FAILURE_RESPONSE] = (data) => {
+            emit(PublicEvent.SCA_ERROR, { errors: [data.errors], data: data });
+        };
+        return handlers;
+    }
+    reportSuccess(message, data) {
+        if (this.successCallback) {
+            const event = new CustomEvent(PublicEvent.SCA_SUCCESS, { detail: data });
+            this.successCallback(event);
+        }
+        else {
+            emit(PublicEvent.SCA_SUCCESS, { message, data });
+        }
+        this.setLoading(false);
+    }
+    reportFailure(message, data) {
+        if (this.failureCallback) {
+            const event = new CustomEvent(PublicEvent.SCA_ERROR, { detail: { errors: [message], data: data } });
+            this.failureCallback(event);
+        }
+        else {
+            emit(PublicEvent.SCA_ERROR, { errors: [message], data: data });
+        }
+        this.setLoading(false);
+    }
+    setup() {
+        const message = {
+            channel: 'sca',
+            subject: BridgeEvent.SETUP_THREE_D_SECURE_REQUEST,
+            data: {
+                access_token: window.localStorage.getItem(LocalStorageAccessTokenKey),
+                reference: this.paymentIntent.payment.reference,
+                amount: this.paymentIntent.payment.amount,
+                currency: this.paymentIntent.payment.currency,
+                card_token: this.cardToken
+            }
+        };
+        this.headlessBridge.contentWindow.postMessage(message, '*');
+    }
+    checkEnrollment({ paymentIntent, cardToken, merchantUsername, cybersourceReferenceId }) {
+        var _a;
+        const message = {
+            channel: 'sca',
+            subject: BridgeEvent.ENROL_THREE_D_SECURE_REQUEST,
+            data: Object.assign(Object.assign(Object.assign({ access_token: window.localStorage.getItem(LocalStorageAccessTokenKey), merchant_username: merchantUsername, card_token: cardToken }, paymentIntent.payment), { verification: paymentIntent.verification, reference_id: cybersourceReferenceId, return_url: env[this.environment].returnCybersourceUrl, acs_window_size: (_a = this.challengeWindowSize) !== null && _a !== void 0 ? _a : ChallengeWindowSize.SIZE_FULL_PAGE, device_channel: "BROWSER" }), snakeCaseKeys(DeviceDataCollection.collectDeviceData()))
+        };
+        this.headlessBridge.contentWindow.postMessage(message, '*');
+    }
+    enrolmentResponse(data) {
+        var _a, _b;
+        const scenario = getThreeDSecureEnrollmentResult(data);
+        const threeDSecureData = threeDResponseData(data);
+        if (scenario.outcome.authenticationType == 'challenge') {
+            ThreeDSecureChallengeWindow.showChallengeIframe({
+                stepUpUrl: data.step_up_url,
+                cardToken: this.cardToken,
+                accessToken: data.access_token,
+                challengeWindowSize: (_a = this.challengeWindowSize) !== null && _a !== void 0 ? _a : ChallengeWindowSize.SIZE_FULL_PAGE,
+            });
+            return;
+        }
+        if (scenario.outcome.success) {
+            this.reportSuccess(`FatZebra.3DS: 3DS success - ${scenario.description}.`, threeDSecureData);
+            const extra = util.toObjectWithSnakeCaseKeys(threeDSecureData);
+            this.createPurchase(extra);
+            return;
+        }
+        else {
+            const failureMessage = [scenario.description, (_b = scenario.outcome) === null || _b === void 0 ? void 0 : _b.errorCode].filter(Boolean).join(' - ');
+            this.reportFailure(`FatZebra.3DS: 3DS error - ${failureMessage}`, { errorCode: scenario.outcome.errorCode });
+        }
+    }
+    // This comes from the postMessage response from cybersource hitting the /return url
+    validateAuthentication(data) {
+        const message = {
+            channel: 'sca',
+            subject: BridgeEvent.VALIDATE_THREE_D_SECURE_REQUEST,
+            data: Object.assign(Object.assign({ access_token: window.localStorage.getItem(LocalStorageAccessTokenKey), merchant_username: this.merchantUsername, card_token: data.cardToken }, this.paymentIntent.payment), { authentication_transaction_id: data.transactionId })
+        };
+        this.headlessBridge.contentWindow.postMessage(message, '*');
+    }
+    validationAuthenticationResponse(data) {
+        var _a;
+        ThreeDSecureChallengeWindow.hide();
+        const scenario = getThreeDSecureValidationResult(data);
+        const threeDSecureData = threeDResponseData(data);
+        const extra = util.toObjectWithSnakeCaseKeys(threeDSecureData);
+        if (scenario.outcome.success) {
+            this.reportSuccess(`FatZebra.3DS: 3DS success - ${scenario.description}.`, threeDSecureData);
+            this.createPurchase(extra);
+        }
+        else {
+            const failureMessage = [scenario.description, (_a = scenario.outcome) === null || _a === void 0 ? void 0 : _a.errorCode].filter(Boolean).join(' - ');
+            this.reportFailure(`FatZebra.3DS: 3DS error - ${failureMessage}`, {
+                errorCode: scenario.outcome.errorCode,
+            });
+        }
+    }
+    createPurchase(extra) {
+        const message = {
+            channel: 'sca',
+            subject: BridgeEvent.CREATE_PAYMENT_REQUEST,
+            data: {
+                access_token: window.localStorage.getItem(LocalStorageAccessTokenKey),
+                amount: this.paymentIntent.payment.amount,
+                card_token: this.cardToken,
+                currency: this.paymentIntent.payment.currency,
+                hide_card_holder: this.paymentIntent.payment.hide_card_holder,
+                hash: this.paymentIntent.verification,
+                invoice: this.paymentIntent.payment.reference,
+                test: this.test,
+            }
+        };
+        message.data.extra = Object.assign(Object.assign({}, extra), { sli: toFzSli(extra.eci) });
+        this.headlessBridge.contentWindow.postMessage(message, '*');
+    }
+    setLoading(loading = true) {
+        var _a;
+        if ((_a = this === null || this === void 0 ? void 0 : this.iframe) === null || _a === void 0 ? void 0 : _a.contentWindow) {
+            this.iframe.contentWindow.postMessage({
+                channel: 'sca',
+                subject: BridgeEvent.LOADING_THREE_D_SECURE,
+                data: loading
+            }, '*');
+        }
+    }
+}
+__decorate([
+    logMethod()
+], ThreeDSecure.prototype, "reportSuccess", null);
+__decorate([
+    logMethod()
+], ThreeDSecure.prototype, "reportFailure", null);
+__decorate([
+    logMethod()
+], ThreeDSecure.prototype, "setup", null);
+__decorate([
+    logMethod()
+], ThreeDSecure.prototype, "checkEnrollment", null);
+__decorate([
+    logMethod()
+], ThreeDSecure.prototype, "enrolmentResponse", null);
+__decorate([
+    logMethod()
+], ThreeDSecure.prototype, "validateAuthentication", null);
+__decorate([
+    logMethod()
+], ThreeDSecure.prototype, "validationAuthenticationResponse", null);
+__decorate([
+    logMethod()
+], ThreeDSecure.prototype, "createPurchase", null);
+export default ThreeDSecure;

package/dist/three_d_secure/utility/device-data-collection.d.ts

@@ -0,0 +1,24 @@
+import { DeviceDataType } from "./types";
+import { Environment } from "../../shared/env";
+export interface DeviceDataCollectionMessage {
+    device_data_collection_url: string;
+    access_token: string;
+    reference_id: string;
+}
+export default class DeviceDataCollection {
+    private static readonly IFRAME_ID;
+    private static readonly IFRAME_NAME;
+    private static readonly FORM_ID;
+    private static readonly INPUT_ID;
+    createIframe(): void;
+    static listenDataCollectionResponse(environment: Environment): void;
+    private static hasEmittedProfileReady;
+    private static handleDataCollectionResponse;
+    static collectDeviceData(): DeviceDataType;
+    static setIframeUrl(url: string, jwt: string): void;
+    static getForm(): HTMLFormElement | null;
+    static getIframe(): HTMLIFrameElement | null;
+    static getInput(): HTMLInputElement | null;
+    static submit(): void;
+    private static ensureCreated;
+}

package/dist/three_d_secure/utility/device-data-collection.js

@@ -0,0 +1,119 @@
+import { PublicEvent } from "../../shared/types";
+import { emit } from "../../shared/event-manager";
+import env from "../../shared/env";
+class DeviceDataCollection {
+    // Create elements if they don't already exist
+    createIframe() {
+        // Iframe
+        if (!document.getElementById(DeviceDataCollection.IFRAME_ID)) {
+            const iframe = document.createElement("iframe");
+            iframe.name = DeviceDataCollection.IFRAME_NAME;
+            iframe.id = DeviceDataCollection.IFRAME_ID;
+            iframe.style.cssText = `
+        position: absolute;
+        left: 0;
+        top: 0;
+        height: 0;
+        width: 0;
+        border: none;
+      `;
+            document.body.appendChild(iframe);
+        }
+        // Form (INTENTIONALLY not inside the iframe)
+        if (!document.getElementById(DeviceDataCollection.FORM_ID)) {
+            const form = document.createElement("form");
+            form.method = "POST";
+            form.target = DeviceDataCollection.IFRAME_NAME;
+            form.id = DeviceDataCollection.FORM_ID;
+            document.body.appendChild(form);
+        }
+        // Hidden JWT input
+        if (!document.getElementById(DeviceDataCollection.INPUT_ID)) {
+            const input = document.createElement("input");
+            input.type = "hidden";
+            input.name = "JWT";
+            input.id = DeviceDataCollection.INPUT_ID;
+            DeviceDataCollection.getForm().appendChild(input);
+        }
+    }
+    static listenDataCollectionResponse(environment) {
+        window.addEventListener("message", (event) => this.handleDataCollectionResponse(event, environment), false);
+    }
+    static handleDataCollectionResponse(event, environment) {
+        // https://developer.cybersource.com/docs/cybs/en-us/payer-authentication/developer/all/so/payer-auth/pa2-ccdc-ddc-intro.html#reference_qmk_jrl_xpb
+        if (event.origin !== env[environment].cybersourceUrl)
+            return;
+        if (this.hasEmittedProfileReady)
+            return;
+        const response = JSON.parse(event.data);
+        if (response["MessageType"] == "profile.completed") {
+            emit(PublicEvent.DEVICE_PROFILE_READY_THREE_D_SECURE_EVENT, { message: null, data: null });
+        }
+        // Still proceed, even if status is false (as per recommendations from cybersource support team.
+        if (response["Status"] === false) {
+            emit(PublicEvent.DEVICE_PROFILE_READY_THREE_D_SECURE_EVENT, { message: null, data: null });
+        }
+        this.hasEmittedProfileReady = true;
+    }
+    static collectDeviceData() {
+        var _a, _b, _c, _d;
+        const screen = window.screen;
+        const nav = navigator;
+        const language = (_b = (_a = nav.language) !== null && _a !== void 0 ? _a : nav.userLanguage) !== null && _b !== void 0 ? _b : "";
+        return {
+            browser_accept_content: (_d = (_c = nav.languages) === null || _c === void 0 ? void 0 : _c.join(",")) !== null && _d !== void 0 ? _d : "",
+            browser_language: language,
+            browser_java_enabled: nav.javaEnabled(),
+            browser_color_depth: screen.colorDepth,
+            browser_screen_height: screen.height,
+            browser_screen_width: screen.width,
+            browser_time_difference: new Date().getTimezoneOffset(),
+            browser_user_agent: nav.userAgent,
+        };
+    }
+    static setIframeUrl(url, jwt) {
+        // Ensure elements exist, then set values
+        this.ensureCreated();
+        const form = this.getForm();
+        const input = this.getInput();
+        form.action = url; // e.g. https://centinelapistag.cardinalcommerce.com/...
+        input.value = jwt; // the AccessToken JWT
+    }
+    static getForm() {
+        return document.querySelector(`#${DeviceDataCollection.FORM_ID}`);
+    }
+    static getIframe() {
+        const el = document.querySelector(`#${DeviceDataCollection.IFRAME_ID}`);
+        if (!el)
+            console.log("Form not initialized. Call createIframe() first.");
+        return el;
+    }
+    static getInput() {
+        const el = document.querySelector(`#${DeviceDataCollection.INPUT_ID}`);
+        if (!el)
+            console.log("JWT input not initialized. Call createIframe() first.");
+        return el;
+    }
+    static submit() {
+        DeviceDataCollection.ensureCreated();
+        DeviceDataCollection.getForm().submit();
+    }
+    // ---- helpers (no instance state) ----
+    static ensureCreated() {
+        if (!this.getIframe() || !this.getForm() || !this.getInput()) {
+            new DeviceDataCollection().createIframe();
+        }
+        // Make sure the form still targets the iframe by name
+        const form = this.getForm();
+        if (form.target !== DeviceDataCollection.IFRAME_NAME) {
+            form.target = DeviceDataCollection.IFRAME_NAME;
+        }
+    }
+}
+// Shared IDs so other classes can query the DOM directly too
+DeviceDataCollection.IFRAME_ID = "cardinal_collection_iframe";
+DeviceDataCollection.IFRAME_NAME = "collectionIframe";
+DeviceDataCollection.FORM_ID = "cardinal_collection_form";
+DeviceDataCollection.INPUT_ID = "cardinal_collection_form_input";
+DeviceDataCollection.hasEmittedProfileReady = false;
+export default DeviceDataCollection;

package/dist/three_d_secure/utility/getEnrollmentResult.d.ts

@@ -0,0 +1,4 @@
+import { EnrollmentScenario } from "../../sca/scenarios";
+import { EnrollThreeDSecureResponse } from "./types";
+declare const getThreeDSecureEnrollmentResult: (enrollment: EnrollThreeDSecureResponse) => EnrollmentScenario;
+export { getThreeDSecureEnrollmentResult };

package/dist/three_d_secure/utility/getEnrollmentResult.js

@@ -0,0 +1,10 @@
+import { getMajor3dsVersion } from "./index";
+import { enrollmentScenarios } from "../../sca/scenarios";
+import { failedEnrollmentRequestScenario } from "../../sca/scenarios/enrollment";
+const getThreeDSecureEnrollmentResult = (enrollment) => {
+    const result = enrollmentScenarios.find((item) => item.pares === enrollment.pares &&
+        item.veresEnrolled === enrollment.veres &&
+        item.threedsVersion === getMajor3dsVersion(enrollment.threeds_version));
+    return result || failedEnrollmentRequestScenario;
+};
+export { getThreeDSecureEnrollmentResult };

package/dist/three_d_secure/utility/getValidationResult.d.ts

@@ -0,0 +1,4 @@
+import { ValidationThreeDSecureResponse } from "./types";
+import { ValidationScenario } from "../../sca/scenarios";
+declare const getThreeDSecureValidationResult: (validation: ValidationThreeDSecureResponse) => ValidationScenario;
+export { getThreeDSecureValidationResult };

package/dist/three_d_secure/utility/getValidationResult.js

@@ -0,0 +1,11 @@
+import { getMajor3dsVersion } from "./index";
+import { validationScenarios } from "../../sca/scenarios";
+import { failedValidationRequestScenario } from "../../sca/scenarios/validation";
+const getThreeDSecureValidationResult = (validation) => {
+    const result = validationScenarios.find((item) => {
+        return item.pares === validation.pares &&
+            item.threedsVersion === getMajor3dsVersion(validation.threeds_version);
+    });
+    return result || failedValidationRequestScenario;
+};
+export { getThreeDSecureValidationResult };

package/dist/three_d_secure/utility/index.d.ts

@@ -0,0 +1,8 @@
+import { ThreedsData } from '../../sca/types';
+import { DeviceDataType, EnrollThreeDSecureResponse, ValidationThreeDSecureResponse } from "./types";
+declare const threeDResponseData: (response: EnrollThreeDSecureResponse | ValidationThreeDSecureResponse) => ThreedsData;
+declare const snakeCaseKeys: (obj: DeviceDataType) => {
+    [k: string]: any;
+};
+declare const getMajor3dsVersion: (original: string) => string;
+export { threeDResponseData, snakeCaseKeys, getMajor3dsVersion };

package/dist/three_d_secure/utility/index.js

@@ -0,0 +1,23 @@
+import { toFzSli } from "../../sca/eci-mappings";
+const threeDResponseData = (response) => {
+    return {
+        // CAVV: Visa & Amex only
+        // AAV: Mastercard only, known as UCAF
+        cavv: response.cavv || (response === null || response === void 0 ? void 0 : response.aav),
+        par: response.pares,
+        sli: toFzSli(response.eci),
+        eci: response.eci,
+        xid: response.xid,
+        ver: "veres" in response ? response === null || response === void 0 ? void 0 : response.veres : null,
+        directoryServerTxnId: response.directory_server_txn_id,
+        threedsVersion: response.threeds_version,
+    };
+};
+const snakeCaseKeys = (obj) => Object.fromEntries(Object.entries(obj).map(([key, value]) => [
+    key.replace(/[A-Z]/g, letter => `_${letter.toLowerCase()}`),
+    value
+]));
+const getMajor3dsVersion = (original) => {
+    return original === null || original === void 0 ? void 0 : original[0];
+};
+export { threeDResponseData, snakeCaseKeys, getMajor3dsVersion };

package/dist/three_d_secure/utility/three_d_secure_challenge_window.d.ts

@@ -0,0 +1,17 @@
+import { ChallengeWindowSize } from "../../sca/types";
+declare class ThreeDSecureChallengeWindow {
+    private static OVERLAY_ID;
+    private static CONTENT_ID;
+    private static FRAME_WRAP_ID;
+    private static CHALLENGE_FORM_ID;
+    private static windowSizeToDims;
+    private static ensureOverlay;
+    static hide(): void;
+    static showChallengeIframe({ stepUpUrl, accessToken, cardToken, challengeWindowSize, }: {
+        stepUpUrl: string;
+        accessToken: string;
+        cardToken: string;
+        challengeWindowSize?: ChallengeWindowSize;
+    }): void;
+}
+export default ThreeDSecureChallengeWindow;

package/dist/three_d_secure/utility/three_d_secure_challenge_window.js

@@ -0,0 +1,175 @@
+import { ChallengeWindowSize } from "../../sca/types";
+class ThreeDSecureChallengeWindow {
+    // Treat these as the *iframe viewport* sizes per 3DS spec.
+    static windowSizeToDims(size) {
+        switch (size) {
+            case ChallengeWindowSize.SIZE_250X400:
+                return { width: 250, height: 400 };
+            case ChallengeWindowSize.SIZE_390X400:
+                return { width: 390, height: 400 };
+            case ChallengeWindowSize.SIZE_500X600:
+                return { width: 500, height: 600 };
+            case ChallengeWindowSize.SIZE_600X400:
+                return { width: 600, height: 400 };
+            case ChallengeWindowSize.SIZE_FULL_PAGE:
+                return "FULL";
+            default:
+                // Safe fallback: larger viewport
+                return { width: 500, height: 600 };
+        }
+    }
+    static ensureOverlay() {
+        let overlay = document.getElementById(ThreeDSecureChallengeWindow.OVERLAY_ID);
+        let content = document.getElementById(ThreeDSecureChallengeWindow.CONTENT_ID);
+        let frameWrap = document.getElementById(ThreeDSecureChallengeWindow.FRAME_WRAP_ID);
+        if (overlay && content && frameWrap)
+            return { overlay, content, frameWrap };
+        overlay = document.createElement("div");
+        overlay.id = ThreeDSecureChallengeWindow.OVERLAY_ID;
+        Object.assign(overlay.style, {
+            position: "fixed",
+            inset: "0",
+            background: "rgba(0,0,0,0.6)",
+            display: "none",
+            alignItems: "center",
+            justifyContent: "center",
+            zIndex: "999999",
+        });
+        content = document.createElement("div");
+        content.id = ThreeDSecureChallengeWindow.CONTENT_ID;
+        Object.assign(content.style, {
+            background: "white",
+            borderRadius: "12px",
+            boxShadow: "0 20px 60px rgba(0,0,0,0.35)",
+            overflow: "hidden",
+            // Critical: don't use padding/gap on the content wrapper or you'll steal space
+            // from the challenge viewport size.
+            padding: "0",
+            display: "flex",
+            flexDirection: "column",
+            maxWidth: "calc(100vw - 32px)",
+            maxHeight: "calc(100vh - 32px)",
+        });
+        const title = document.createElement("div");
+        title.textContent = "Authentication required";
+        Object.assign(title.style, {
+            fontWeight: "600",
+        });
+        // Wrap for the iframe viewport
+        frameWrap = document.createElement("div");
+        frameWrap.id = ThreeDSecureChallengeWindow.FRAME_WRAP_ID;
+        Object.assign(frameWrap.style, {
+            width: "100%",
+            overflow: "hidden",
+            // height is set dynamically for non-FULL
+            // flex is set dynamically for FULL
+        });
+        content.appendChild(frameWrap);
+        overlay.appendChild(content);
+        // Backdrop click to close (optional)
+        overlay.addEventListener("click", (e) => {
+            if (e.target === overlay)
+                ThreeDSecureChallengeWindow.hide();
+        });
+        document.body.appendChild(overlay);
+        return { overlay, content, frameWrap };
+    }
+    static hide() {
+        const overlay = document.getElementById(ThreeDSecureChallengeWindow.OVERLAY_ID);
+        const frameWrap = document.getElementById(ThreeDSecureChallengeWindow.FRAME_WRAP_ID);
+        if (overlay)
+            overlay.style.display = "none";
+        if (frameWrap)
+            frameWrap.innerHTML = "";
+    }
+    static showChallengeIframe({ stepUpUrl, accessToken, cardToken, challengeWindowSize, }) {
+        const { overlay, content, frameWrap } = ThreeDSecureChallengeWindow.ensureOverlay();
+        const dims = ThreeDSecureChallengeWindow.windowSizeToDims(challengeWindowSize);
+        // Reset any previous sizing
+        Object.assign(overlay.style, {
+            alignItems: "center",
+            justifyContent: "center",
+        });
+        Object.assign(content.style, {
+            maxWidth: "calc(100vw - 32px)",
+            maxHeight: "calc(100vh - 32px)",
+            borderRadius: "12px",
+            width: "",
+            height: "",
+        });
+        Object.assign(frameWrap.style, {
+            height: "",
+            flex: "",
+            minHeight: "",
+        });
+        if (dims === "FULL") {
+            // Fullscreen sheet; iframe takes remaining space under header.
+            Object.assign(overlay.style, {
+                alignItems: "stretch",
+                justifyContent: "stretch",
+            });
+            Object.assign(content.style, {
+                width: "100vw",
+                height: "100vh",
+                maxWidth: "100vw",
+                maxHeight: "100vh",
+                borderRadius: "0",
+            });
+            Object.assign(frameWrap.style, {
+                flex: "1",
+                minHeight: "0",
+            });
+        }
+        else {
+            // IMPORTANT: dims represent the *iframe viewport*, not the entire modal.
+            // So set modal width to dims.width, and set frameWrap height to dims.height.
+            Object.assign(content.style, {
+                width: `${dims.width}px`,
+            });
+            Object.assign(frameWrap.style, {
+                height: `${dims.height}px`,
+            });
+        }
+        // Create iframe fresh each time
+        frameWrap.innerHTML = "";
+        const iframe = document.createElement("iframe");
+        iframe.name = "step-up-iframe";
+        iframe.width = "100%";
+        iframe.height = "100%";
+        Object.assign(iframe.style, { border: "0", display: "block" });
+        iframe.setAttribute("sandbox", "allow-scripts allow-same-origin allow-forms allow-popups allow-top-navigation-by-user-activation");
+        iframe.addEventListener("load", () => console.log("✅ step-up iframe loaded"));
+        iframe.addEventListener("error", () => console.log("❌ step-up iframe error"));
+        frameWrap.appendChild(iframe);
+        // Hidden POST form -> targets the iframe
+        let form = document.getElementById(ThreeDSecureChallengeWindow.CHALLENGE_FORM_ID);
+        if (!form) {
+            form = document.createElement("form");
+            form.id = ThreeDSecureChallengeWindow.CHALLENGE_FORM_ID;
+            form.style.display = "none";
+            document.body.appendChild(form);
+        }
+        form.target = "step-up-iframe";
+        form.method = "POST";
+        form.action = stepUpUrl;
+        form.innerHTML = "";
+        const jwtInput = document.createElement("input");
+        jwtInput.type = "hidden";
+        jwtInput.name = "JWT";
+        jwtInput.value = accessToken;
+        const mdInput = document.createElement("input");
+        mdInput.type = "hidden";
+        mdInput.name = "MD";
+        mdInput.value = cardToken;
+        form.appendChild(jwtInput);
+        form.appendChild(mdInput);
+        // Show, then submit
+        overlay.style.display = "flex";
+        form.submit();
+    }
+}
+ThreeDSecureChallengeWindow.OVERLAY_ID = "three_d_secure_challenge_overlay";
+ThreeDSecureChallengeWindow.CONTENT_ID = "three_d_secure_challenge_content";
+ThreeDSecureChallengeWindow.FRAME_WRAP_ID = "three_d_secure_challenge_frame_wrap";
+ThreeDSecureChallengeWindow.CHALLENGE_FORM_ID = "three_d_secure_challenge_form";
+export default ThreeDSecureChallengeWindow;

package/dist/three_d_secure/utility/types.d.ts

@@ -0,0 +1,40 @@
+import { PARes, VEResEnrolled } from "../../sca/types";
+import { PaymentIntent } from "../../shared/types";
+interface CheckEnrollmentProps {
+    paymentIntent: PaymentIntent;
+    cardToken: string;
+    merchantUsername: string;
+    cybersourceReferenceId: string;
+}
+interface ValidationThreeDSecureResponse {
+    "pares": PARes;
+    "eci": string;
+    "aav"?: string;
+    "cavv": string;
+    "xid": string;
+    "directory_server_txn_id": string;
+    "threeds_version": string;
+}
+interface EnrollThreeDSecureResponse {
+    "cavv": string;
+    "aav"?: string;
+    "directory_server_txn_id": string;
+    "eci": string;
+    "xid": string;
+    "pares": PARes;
+    "threeds_version": string;
+    "veres": VEResEnrolled;
+    "step_up_url": string;
+    "access_token": string;
+}
+interface DeviceDataType {
+    browser_accept_content: string;
+    browser_language: string;
+    browser_java_enabled: boolean;
+    browser_color_depth: number;
+    browser_screen_height: number;
+    browser_screen_width: number;
+    browser_time_difference: number;
+    browser_user_agent: string;
+}
+export { type DeviceDataType, type CheckEnrollmentProps, type EnrollThreeDSecureResponse, type ValidationThreeDSecureResponse };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fat-zebra/sdk",
-  "version": "1.5.15",
+  "version": "1.5.16-beta.2",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -48,7 +48,16 @@
   },
   "overrides": {
     "test-exclude": "^7.0.1",
-    "minimatch": "^10.2.2"
+    "minimatch": "^10.2.2",
+    "jest-util": {
+      "picomatch": "^4.0.4"
+    },
+    "micromatch": {
+      "picomatch": "^2.3.2"
+    },
+    "anymatch": {
+      "picomatch": "^2.3.2"
+    }
   },
   "dependencies": {
     "ajv": "^8.17.1",

package/dist/new_sca/index.d.ts

@@ -1,11 +0,0 @@
-import { Environment } from "../shared/env";
-import { setupProps, ThreeDSSetupResponse } from "../shared/new_gateway/types";
-declare class newSca {
-    private gatewayClient;
-    constructor({ username, environment }: {
-        username: string;
-        environment: Environment;
-    });
-    setup({ card_token, paymentIntent }: setupProps): Promise<ThreeDSSetupResponse>;
-}
-export default newSca;

package/dist/new_sca/index.js

@@ -1,27 +0,0 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-import NewApiGatewayClient from "../shared/new_gateway/new-api-gateway-client";
-// The newSca class will handle the sca requests: setup, enrol, validate
-// The challenge flow will be handled in here
-class newSca {
-    constructor({ username, environment }) {
-        this.gatewayClient = new NewApiGatewayClient({
-            username,
-            environment
-        });
-    }
-    setup(_a) {
-        return __awaiter(this, arguments, void 0, function* ({ card_token, paymentIntent }) {
-            const result = yield this.gatewayClient.setup({ card_token, paymentIntent });
-            return result;
-        });
-    }
-}
-export default newSca;

package/dist/shared/new_gateway/new-api-gateway-client.d.ts

@@ -1,16 +0,0 @@
-import { AxiosResponse, AxiosInstance } from "axios";
-import { Environment } from "../env";
-import { setupProps } from "./types";
-export type GatewayClientProps = {
-    username: string;
-    environment?: Environment;
-};
-declare class NewGatewayClient {
-    username: string;
-    environment?: Environment;
-    client: AxiosInstance;
-    constructor({ username, environment }: GatewayClientProps);
-    /**************** SCA/3DS2 /****************/
-    setup({ card_token, paymentIntent }: setupProps): Promise<AxiosResponse<any, any, {}>>;
-}
-export default NewGatewayClient;

package/dist/shared/new_gateway/new-api-gateway-client.js

@@ -1,42 +0,0 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-import { RequestHeaderSdkVersion, RequestHeaderMerchantUsername, RequestTimeout, } from "../constants";
-import axios from "axios";
-import { getSdkVersionNumber } from "../util";
-import env, { Environment } from "../env";
-class NewGatewayClient {
-    constructor({ username, environment }) {
-        this.username = username;
-        this.environment = environment || Environment.sandbox;
-        const headers = {};
-        headers[RequestHeaderSdkVersion] = getSdkVersionNumber();
-        headers[RequestHeaderMerchantUsername] = this.username;
-        const client = axios.create({
-            baseURL: env[this.environment].apiUrl,
-            timeout: RequestTimeout,
-            headers,
-            responseType: "json",
-            transformResponse: [
-                function (response) {
-                    return typeof response === "string" ? JSON.parse(response) : response;
-                },
-            ]
-        });
-        this.client = client;
-    }
-    /**************** SCA/3DS2 /****************/
-    //
-    setup(_a) {
-        return __awaiter(this, arguments, void 0, function* ({ card_token, paymentIntent }) {
-            return this.client.post("/three_d_secure/setup", Object.assign(Object.assign({ merchant_username: this.username, card_token }, paymentIntent.payment), { verification: paymentIntent.verification }));
-        });
-    }
-}
-export default NewGatewayClient;

package/dist/shared/new_gateway/types.d.ts

@@ -1,27 +0,0 @@
-import { PaymentIntent } from "../types";
-type ClientReferenceInformation = {
-    code: string;
-    partner?: {
-        developerId: string;
-    };
-};
-type ConsumerAuthenticationInformation = {
-    accessToken: string;
-    deviceDataCollectionUrl: string;
-    referenceId: string;
-    token: string;
-};
-interface ThreeDSSetupResponse {
-    data: {
-        clientReferenceInformation: ClientReferenceInformation;
-        consumerAuthenticationInformation: ConsumerAuthenticationInformation;
-        id: string;
-        status: "COMPLETED" | "PENDING" | "FAILED" | string;
-        submitTimeUtc: string;
-    };
-}
-type setupProps = {
-    card_token: string;
-    paymentIntent: PaymentIntent;
-};
-export type { ThreeDSSetupResponse, setupProps };