@justifi/webcomponents 6.0.0-rc.4 → 6.0.0-rc.5

package/dist/cjs/justifi-bank-account-billing-form-simple_9.cjs.entry.js

@@ -7,18 +7,18 @@ var parts = require('./parts-9jMf1erK.js');
 var styledHost = require('./styled-host-CqQYxX-w.js');
 require('./event-types-YOY5TKUN.js');
 var skeleton = require('./skeleton-x-GSs3xk.js');
-var checkPkgVersion = require('./check-pkg-version-BNVGE27p.js');
+var checkPkgVersion = require('./check-pkg-version-BsodhBbK.js');
 var configState = require('./config-state-5xZf-jax.js');
 var header3 = require('./header-3-D9Wa0IfT.js');
 var utils = require('./utils-DAyWinG2.js');
 var stateOptions = require('./state-options-CIT9xdTz.js');
 var button = require('./button-CfVQSysQ.js');
-var checkout_store = require('./checkout.store-CV_fuGQw.js');
+var checkout_store = require('./checkout.store-Cn3Jj5gi.js');
 require('./_commonjsHelpers-BJu3ubxk.js');
 require('./business-form-options-CMII7nIK.js');
 require('./Business-DCRzZf0w.js');
 require('./helpers-B5OCqlIM.js');
-require('./package-BKILqyp3.js');
+require('./package-DJaHaxMC.js');
 require('./Api-CPuq_15r.js');
 require('./utils-BaGF9XIe.js');
 require('./dinero-BwNN_k7x.js');
@@ -155,10 +155,10 @@ const BankAccountForm = class {
         return this.accountNumberIframeElement.tokenize(clientId, paymentMethodMetadata, account);
     }
     render() {
-        return (index.h(styledHost.StyledHost, { key: '747d0bd674b599caae42830991744c3fae14e803' }, index.h(BankAccountFormSkeleton, { key: '003f7e171314684a54a6cae032741b9eb8cf6491', isReady: this.isReady }), index.h("hidden-input", { key: '6ba383c713664e59d4abd2ecc4275596d4632be5' }), index.h("div", { key: '81546cb09ecaec5f50c57e78d95714e6715cf019', class: "container-fluid p-0", style: {
+        return (index.h(styledHost.StyledHost, { key: 'f6b75ae15faeea635abbdcbefee10a8bdb78ba08' }, index.h(BankAccountFormSkeleton, { key: '39f42d054342305001a934feeb29c65caa0fe941', isReady: this.isReady }), index.h("hidden-input", { key: 'd4bf758fe0600db0f1535ff9040cc3d9e25c45b9' }), index.h("div", { key: '095bd8da35c668c7c40d696454310e0e320a1730', class: "container-fluid p-0", style: {
                 opacity: this.isReady ? '1' : '0',
                 height: this.isReady ? 'auto' : '0',
-            } }, index.h("div", { key: '21257886a4cd3667bf92b94de93f9f6d856c42f5', class: "row mb-3" }, index.h("iframe-input", { key: '80102dd11c42053e8b7b9b4d3f586d28400e759f', inputId: "accountNumber", ref: (el) => (this.accountNumberIframeElement = el), label: "Account Number", iframeOrigin: `${this.iframeOrigin}/v2/accountNumber` })), index.h("div", { key: 'b513ba0b350c390e554dd6d30acf636dc9bddff3', class: "row" }, index.h("iframe-input", { key: '8929a99c7fbe37148416295d92018a6291cbc9e6', inputId: "routingNumber", ref: (el) => (this.routingNumberIframeElement = el), label: "Routing Number", iframeOrigin: `${this.iframeOrigin}/v2/routingNumber` })))));
+            } }, index.h("div", { key: 'db367bbd03c3d563913228c1051bdb9bb61c11a9', class: "row mb-3" }, index.h("iframe-input", { key: 'e636d0226cf832f6cd7fde39ea5f471aae6d4605', inputId: "accountNumber", ref: (el) => (this.accountNumberIframeElement = el), label: "Account Number", iframeOrigin: `${this.iframeOrigin}/v2/accountNumber` })), index.h("div", { key: '410dd5cdca9e6774f96133fe4dbb29f0d1405138', class: "row" }, index.h("iframe-input", { key: '26b7138268f6e4f866c4eaf3d2f9c4b0ba00a6c3', inputId: "routingNumber", ref: (el) => (this.routingNumberIframeElement = el), label: "Routing Number", iframeOrigin: `${this.iframeOrigin}/v2/routingNumber` })))));
     }
 };
 
@@ -239,7 +239,7 @@ const JustifiButton = class {
         this.type = 'button';
     }
     render() {
-        return (index.h(styledHost.StyledHost, { key: '56c3098559d728e326c9d76276f2e54bfb8b6697' }, index.h(button.Button, { key: '56d123ed4bc90972e8bcd8ad00e5942819998bed', variant: this.variant, isLoading: this.isLoading, clickHandler: this.clickHandler, class: this.class, type: this.type, disabled: this.disabled, style: this.customStyle }, this.text)));
+        return (index.h(styledHost.StyledHost, { key: '0cc61730e0afccbf438382a3d709397ebe327a9a' }, index.h(button.Button, { key: 'c82eb8f914aa50df8b3e51d271a9e4c29602369e', variant: this.variant, isLoading: this.isLoading, clickHandler: this.clickHandler, class: this.class, type: this.type, disabled: this.disabled, style: this.customStyle }, this.text)));
     }
 };
 
@@ -338,10 +338,10 @@ const JustifiCardForm = class {
         return this.cardNumberIframeElement.tokenize(clientId, paymentMethodMetadata, account);
     }
     render() {
-        return (index.h(styledHost.StyledHost, { key: '4aca2e72165125e0ddf34c978c29eca6ae3bded1' }, index.h(CardFormSkeleton, { key: 'bfe670e2a84a1945babf9f0f27ab33387fd3e320', isReady: this.isReady }), index.h("hidden-input", { key: 'ae76e3246979e71ea916109dbba61d041a0434bb' }), index.h("div", { key: '192dee5354b70a59030a7258b4282636a8b0d545', class: "container-fluid p-0", style: {
+        return (index.h(styledHost.StyledHost, { key: '18d429a9feac5ab030ab040a9aec0efdc0a09b3a' }, index.h(CardFormSkeleton, { key: '8a7a41be9477f7656601a1b21bbd89398846ddda', isReady: this.isReady }), index.h("hidden-input", { key: '256715cd96354c50903c03e15b3de7a81c25e59f' }), index.h("div", { key: 'd55bae0a16f8572e476f012594ca99074e1f3af5', class: "container-fluid p-0", style: {
                 opacity: this.isReady ? '1' : '0',
                 height: this.isReady ? 'auto' : '0',
-            } }, index.h("div", { key: 'edc562e49002e4fc5d59975f2faec7d4cb53e7c4', class: "mb-3" }, index.h("iframe-input", { key: '597cda9d529c3099bf0afe121b62dc425d0199b6', inputId: "cardNumber", ref: (el) => (this.cardNumberIframeElement = el), label: "Card Number", iframeOrigin: `${this.iframeOrigin}/v2/cardNumber` })), index.h("div", { key: '41436372ad92b6bb30be16057340caf56a22c656', class: "row" }, index.h("div", { key: '5ac0a9964db760b293ceba8730e4cdd1ba50382e', class: "col-4 align-content-end" }, index.h("iframe-input", { key: '3b5d4e5c535a3e0e7eaffdf3e1f5afdceac3738c', inputId: "expirationMonth", ref: (el) => (this.expirationMonthIframeElement = el), label: "Expiration", iframeOrigin: `${this.iframeOrigin}/v2/expirationMonth` })), index.h("div", { key: 'd946453b6fa4c99dd9c7f5d64ee7171ebebbb67f', class: "col-4 align-content-end" }, index.h("iframe-input", { key: 'b132330a64b46d6506debf79c87282598c2fbf5a', inputId: "expirationYear", ref: (el) => (this.expirationYearIframeElement = el), label: "", iframeOrigin: `${this.iframeOrigin}/v2/expirationYear` })), index.h("div", { key: '21b5cfbf2aa6e038dc13910108dcd85c800e09cf', class: "col-4 align-content-end" }, index.h("iframe-input", { key: '4a266eef3d8636b5852a090ee20e6d014296e6dc', inputId: "CVV", ref: (el) => (this.cvvIframeElement = el), label: "CVV", iframeOrigin: `${this.iframeOrigin}/v2/CVV` }))))));
+            } }, index.h("div", { key: '7d1906ad3065c71e5871c0fbb30686dcfa011ecb', class: "mb-3" }, index.h("iframe-input", { key: 'cabb51df56859dcf77a8e7b1bd18841eea872a96', inputId: "cardNumber", ref: (el) => (this.cardNumberIframeElement = el), label: "Card Number", iframeOrigin: `${this.iframeOrigin}/v2/cardNumber` })), index.h("div", { key: 'dc14f4d1cadd95587cee0e0fbf82b48b7ade1ffb', class: "row" }, index.h("div", { key: 'd6637ada2d0b35e41ffceedd4427bc8e819a564d', class: "col-4 align-content-end" }, index.h("iframe-input", { key: '57bac9f6b1695cb62f60483b4350aa9a1365f944', inputId: "expirationMonth", ref: (el) => (this.expirationMonthIframeElement = el), label: "Expiration", iframeOrigin: `${this.iframeOrigin}/v2/expirationMonth` })), index.h("div", { key: '2264ccbe1c8ca30b3359cf52b3cef7ac0707462e', class: "col-4 align-content-end" }, index.h("iframe-input", { key: '0195b665d1b4809c9ab04c68fcd3de6a1f6af562', inputId: "expirationYear", ref: (el) => (this.expirationYearIframeElement = el), label: "", iframeOrigin: `${this.iframeOrigin}/v2/expirationYear` })), index.h("div", { key: '07578e7173b66895b84091184f7f3166fcf00314', class: "col-4 align-content-end" }, index.h("iframe-input", { key: 'cea4796ffdec09d0c9b56d3a09d5e0571744a966', inputId: "CVV", ref: (el) => (this.cvvIframeElement = el), label: "CVV", iframeOrigin: `${this.iframeOrigin}/v2/CVV` }))))));
     }
 };
 

package/dist/cjs/justifi-business-details.cjs.entry.js

@@ -5,7 +5,7 @@ var utils = require('./utils-Df-pajL7.js');
 var business_service = require('./business.service-C3BdUPlm.js');
 var getBusiness = require('./get-business-o5jPq_ME.js');
 var ComponentError = require('./ComponentError-D4OLnOkg.js');
-var checkPkgVersion = require('./check-pkg-version-BNVGE27p.js');
+var checkPkgVersion = require('./check-pkg-version-BsodhBbK.js');
 require('./parts-9jMf1erK.js');
 require('./Api-CPuq_15r.js');
 require('./config-state-5xZf-jax.js');
@@ -19,7 +19,7 @@ require('./Business-DCRzZf0w.js');
 require('./helpers-B5OCqlIM.js');
 require('./state-options-CIT9xdTz.js');
 require('./utils-DvUQQLmR.js');
-require('./package-BKILqyp3.js');
+require('./package-DJaHaxMC.js');
 
 const BusinessDetails = class {
     constructor(hostRef) {

package/dist/cjs/justifi-business-form.cjs.entry.js

@@ -11,7 +11,7 @@ require('./Refund-CqWNG8sx.js');
 require('./Pagination-Dediz133.js');
 var Business = require('./Business-DCRzZf0w.js');
 require('./Dispute-CruQTF6_.js');
-var checkPkgVersion = require('./check-pkg-version-BNVGE27p.js');
+var checkPkgVersion = require('./check-pkg-version-BsodhBbK.js');
 var button = require('./button-CfVQSysQ.js');
 var styledHost = require('./styled-host-CqQYxX-w.js');
 var header1 = require('./header-1-DD41iNlG.js');
@@ -27,7 +27,7 @@ require('./business-form-options-CMII7nIK.js');
 require('./index-Yd9aLenr.js');
 require('./utils-BaGF9XIe.js');
 require('./helpers-B5OCqlIM.js');
-require('./package-BKILqyp3.js');
+require('./package-DJaHaxMC.js');
 require('./Api-CPuq_15r.js');
 require('./parts-9jMf1erK.js');
 require('./utils-DvUQQLmR.js');

package/dist/cjs/justifi-checkout-summary_6.cjs.entry.js

@@ -3,13 +3,13 @@
 var index = require('./index-dm_GlYlb.js');
 var parts = require('./parts-9jMf1erK.js');
 var utils = require('./utils-BaGF9XIe.js');
-var checkout_store = require('./checkout.store-CV_fuGQw.js');
+var checkout_store = require('./checkout.store-Cn3Jj5gi.js');
 var styledHost = require('./styled-host-CqQYxX-w.js');
 require('./event-types-YOY5TKUN.js');
 var header1 = require('./header-1-DD41iNlG.js');
 var insuranceState = require('./insurance-state-Cyva9u6S.js');
 var header3 = require('./header-3-D9Wa0IfT.js');
-var checkPkgVersion = require('./check-pkg-version-BNVGE27p.js');
+var checkPkgVersion = require('./check-pkg-version-BsodhBbK.js');
 require('./config-state-5xZf-jax.js');
 require('./dinero-BwNN_k7x.js');
 var ComponentError = require('./ComponentError-D4OLnOkg.js');
@@ -21,7 +21,7 @@ var utils$1 = require('./utils-DvUQQLmR.js');
 var checkout_service = require('./checkout.service-B0ZmvWwI.js');
 var paymentMethodOptionUtils = require('./payment-method-option-utils-WYHIHy-l.js');
 require('./index-Yd9aLenr.js');
-require('./package-BKILqyp3.js');
+require('./package-DJaHaxMC.js');
 require('./Api-CPuq_15r.js');
 require('./helpers-B5OCqlIM.js');
 require('./state-options-CIT9xdTz.js');
@@ -31,7 +31,7 @@ const Summary = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(styledHost.StyledHost, { key: '74b2a1ebf22f1f7e7cb0cfbbbba8a3f8cd528a6b' }, index.h("section", { key: '6ea0bd41680b937c0ff88aa0f73c1ac4bccee9b9' }, index.h("div", { key: '6ca013f92dbaf076bda9a65c98acdf5c8192b22a' }, index.h("div", { key: '62f166bdc0b47e8cda03ee4d549736aaf336727e', part: parts.text }, checkout_store.checkoutStore === null || checkout_store.checkoutStore === void 0 ? void 0 : checkout_store.checkoutStore.paymentDescription), index.h("div", { key: 'c681ecba3bbceac71993833f8861393dc5751b4c' }, index.h("span", { key: '46eaedc091f44c2d3bad94cb6a05098385be8ebc', part: parts.text }, "Total"), "\u00A0", index.h("span", { key: 'ad70de1a38c2c7625562cee3a745a6a61235f4cf', part: parts.text }, utils.formatCurrency(+(checkout_store.checkoutStore === null || checkout_store.checkoutStore === void 0 ? void 0 : checkout_store.checkoutStore.totalAmount))))))));
+        return (index.h(styledHost.StyledHost, { key: '28a1a324b8cdf2dea0aafe91fbdd3679482e76f8' }, index.h("section", { key: 'e8ffe2fdd1592a0b762647fdab94ee5e21436a93' }, index.h("div", { key: '099fbfb449066290cdcd113b0de5f87334777a0e' }, index.h("div", { key: 'c78325957b4e00299366b8e9efe6fd6e86da3b97', part: parts.text }, checkout_store.checkoutStore === null || checkout_store.checkoutStore === void 0 ? void 0 : checkout_store.checkoutStore.paymentDescription), index.h("div", { key: 'd077da888b03a34e540f66ebaa57502fe22be7c4' }, index.h("span", { key: 'd4f7ddd24e10302222679a9f73c3b5ed305267a7', part: parts.text }, "Total"), "\u00A0", index.h("span", { key: '1f5d7b6b0cce64eea04879e7767ff87ce5a64069', part: parts.text }, utils.formatCurrency(+(checkout_store.checkoutStore === null || checkout_store.checkoutStore === void 0 ? void 0 : checkout_store.checkoutStore.totalAmount))))))));
     }
 };
 
@@ -47,7 +47,7 @@ const Header = class {
     }
     render() {
         const HeaderComponent = this.levels[this.level];
-        return (index.h(styledHost.StyledHost, { key: '5113142a64d38ab38fbf95f37e2548501b11d81e' }, index.h(HeaderComponent, { key: 'e28419adc9ac323a1846358efc7ffab98dddec95', text: this.text, class: this.class })));
+        return (index.h(styledHost.StyledHost, { key: '73104ea086f8a9948e69f86451adf19e0f39fb32' }, index.h(HeaderComponent, { key: 'a8582109634299a24e2a9b3c7181c6bba511fde7', text: this.text, class: this.class })));
     }
 };
 
@@ -113,6 +113,43 @@ const ModularCheckout = class {
         this.submitEvent = index.createEvent(this, "submit-event");
         this.paymentMethodChangedEvent = index.createEvent(this, "payment-method-changed");
         this.savePaymentMethod = false;
+        this.handleApplePayCompleted = (event) => {
+            const { success, token, paymentMethodId, error } = event.detail;
+            console.log('=== APPLE PAY COMPLETED EVENT ===');
+            console.log('Event detail:', event.detail);
+            console.log('Payment Method ID received:', paymentMethodId);
+            if (success && token) {
+                this.applePayToken = token;
+                this.applePayPaymentMethodId = paymentMethodId;
+                console.log('=== STORED PAYMENT METHOD ID ===');
+                console.log('Stored paymentMethodId:', this.applePayPaymentMethodId);
+                // Complete the checkout with Apple Pay token
+                this.submitCheckoutWithApplePay();
+            }
+            else {
+                console.error("Apple Pay completed but failed:", error);
+                this.errorEvent.emit({
+                    message: (error === null || error === void 0 ? void 0 : error.message) || "Apple Pay payment failed",
+                    errorCode: ComponentError.ComponentErrorCodes.TOKENIZE_ERROR,
+                    severity: ComponentError.ComponentErrorSeverity.ERROR,
+                });
+            }
+        };
+        this.handleApplePayError = (event) => {
+            const { error } = event.detail;
+            console.error("Apple Pay error:", error);
+            this.errorEvent.emit({
+                message: error || "Apple Pay error occurred",
+                errorCode: ComponentError.ComponentErrorCodes.TOKENIZE_ERROR,
+                severity: ComponentError.ComponentErrorSeverity.ERROR,
+            });
+        };
+        this.handleApplePayCancelled = () => {
+            console.log("Apple Pay cancelled by user");
+            // Reset the token if cancelled
+            this.applePayToken = undefined;
+            this.applePayPaymentMethodId = undefined;
+        };
     }
     savePaymentMethodChanged(newValue) {
         checkout_store.checkoutStore.savePaymentMethod = newValue;
@@ -120,20 +157,21 @@ const ModularCheckout = class {
     connectedCallback() {
         this.observer = new MutationObserver(() => {
             this.queryFormRefs();
+            this.setupApplePayListeners(); // set up again listeners when DOM changes
         });
         this.observer.observe(this.hostEl, {
             childList: true,
-            subtree: true
+            subtree: true,
         });
         checkout_store.checkoutStore.checkoutId = this.checkoutId;
         const config = {
             authToken: this.authToken,
             checkoutId: this.checkoutId,
-            service: new checkout_service.CheckoutService()
+            service: new checkout_service.CheckoutService(),
         };
         this.getCheckout = makeGetCheckout(config);
         this.completeCheckout = makeCheckoutComplete(config);
-        checkout_store.onChange('selectedPaymentMethod', (newValue) => {
+        checkout_store.onChange("selectedPaymentMethod", (newValue) => {
             this.paymentMethodChangedEvent.emit(newValue);
         });
     }
@@ -152,7 +190,7 @@ const ModularCheckout = class {
         checkout_store.checkoutStore.savePaymentMethod = this.savePaymentMethod;
         this.fetchCheckout();
         // Refresh the checkout data when insurance values actually change (not on initial load)
-        insuranceState.insuranceValuesOn('set', (key) => {
+        insuranceState.insuranceValuesOn("set", (key) => {
             const value = insuranceState.insuranceValues[key];
             if (value !== undefined && insuranceState.hasInsuranceValueChanged(key, value)) {
                 this.fetchCheckout();
@@ -161,10 +199,12 @@ const ModularCheckout = class {
     }
     componentDidLoad() {
         this.queryFormRefs();
+        this.setupApplePayListeners();
     }
     disconnectedCallback() {
         var _a;
         (_a = this.observer) === null || _a === void 0 ? void 0 : _a.disconnect();
+        this.removeApplePayListeners();
     }
     fetchCheckout() {
         if (this.getCheckout) {
@@ -194,7 +234,7 @@ const ModularCheckout = class {
                         errorCode: ComponentError.ComponentErrorCodes.FETCH_ERROR,
                         severity: ComponentError.ComponentErrorSeverity.ERROR,
                     });
-                }
+                },
             });
         }
     }
@@ -210,21 +250,76 @@ const ModularCheckout = class {
         checkout_store.checkoutStore.bnplProviderClientId = (_a = checkout === null || checkout === void 0 ? void 0 : checkout.bnpl) === null || _a === void 0 ? void 0 : _a.provider_client_id;
         checkout_store.checkoutStore.bnplProviderMode = (_b = checkout === null || checkout === void 0 ? void 0 : checkout.bnpl) === null || _b === void 0 ? void 0 : _b.provider_mode;
         checkout_store.checkoutStore.bnplProviderApiVersion = (_c = checkout === null || checkout === void 0 ? void 0 : checkout.bnpl) === null || _c === void 0 ? void 0 : _c.provider_api_version;
-        checkout_store.checkoutStore.bnplProviderCheckoutUrl = (_d = checkout === null || checkout === void 0 ? void 0 : checkout.bnpl) === null || _d === void 0 ? void 0 : _d.provider_checkout_url;
+        checkout_store.checkoutStore.bnplProviderCheckoutUrl =
+            (_d = checkout === null || checkout === void 0 ? void 0 : checkout.bnpl) === null || _d === void 0 ? void 0 : _d.provider_checkout_url;
     }
     queryFormRefs() {
-        this.paymentMethodFormRef = this.hostEl.querySelector('justifi-card-form, justifi-bank-account-form');
-        this.billingFormRef = this.hostEl.querySelector('justifi-billing-form, justifi-bank-account-billing-form-simple, justifi-card-billing-form-simple, justifi-billing-form-full');
-        this.insuranceFormRef = this.hostEl.querySelector('justifi-season-interruption-insurance');
-        this.sezzlePaymentMethodRef = this.hostEl.querySelector('justifi-sezzle-payment-method');
+        this.paymentMethodFormRef = this.hostEl.querySelector("justifi-card-form, justifi-bank-account-form");
+        this.billingFormRef = this.hostEl.querySelector("justifi-billing-form, justifi-bank-account-billing-form-simple, justifi-card-billing-form-simple, justifi-billing-form-full");
+        this.insuranceFormRef = this.hostEl.querySelector("justifi-season-interruption-insurance");
+        this.sezzlePaymentMethodRef = this.hostEl.querySelector("justifi-sezzle-payment-method");
+        this.applePayRef = this.hostEl.querySelector("justifi-apple-pay");
+    }
+    setupApplePayListeners() {
+        if (this.applePayRef) {
+            this.applePayRef.addEventListener("applePayCompleted", this.handleApplePayCompleted);
+            this.applePayRef.addEventListener("applePayError", this.handleApplePayError);
+            this.applePayRef.addEventListener("applePayCancelled", this.handleApplePayCancelled);
+        }
+    }
+    removeApplePayListeners() {
+        if (this.applePayRef) {
+            this.applePayRef.removeEventListener("applePayCompleted", this.handleApplePayCompleted);
+            this.applePayRef.removeEventListener("applePayError", this.handleApplePayError);
+            this.applePayRef.removeEventListener("applePayCancelled", this.handleApplePayCancelled);
+        }
+    }
+    async submitCheckoutWithApplePay() {
+        if (!this.applePayToken) {
+            this.errorEvent.emit({
+                message: "No Apple Pay token available",
+                errorCode: ComponentError.ComponentErrorCodes.TOKENIZE_ERROR,
+                severity: ComponentError.ComponentErrorSeverity.ERROR,
+            });
+            return;
+        }
+        console.log('=== SUBMITTING CHECKOUT WITH APPLE PAY ===');
+        console.log('Payment method ID to send:', this.applePayPaymentMethodId);
+        const payment = {
+            payment_mode: "apple_pay",
+            payment_token: this.applePayPaymentMethodId,
+        };
+        console.log('=== CHECKOUT COMPLETE PAYLOAD ===');
+        console.log('Payment object:', payment);
+        this.completeCheckout({
+            payment,
+            onSuccess: ({ checkout }) => {
+                console.log('=== CHECKOUT COMPLETE SUCCESS ===');
+                console.log('Checkout result:', checkout);
+                this.submitEvent.emit({
+                    checkout,
+                    message: "Apple Pay checkout completed successfully",
+                });
+            },
+            onError: (error) => {
+                console.error('=== CHECKOUT COMPLETE ERROR ===');
+                console.error('Error:', error);
+                this.errorEvent.emit({
+                    message: error.message,
+                    errorCode: ComponentError.ComponentErrorCodes.COMPLETE_CHECKOUT_ERROR,
+                    severity: ComponentError.ComponentErrorSeverity.ERROR,
+                });
+            },
+        });
     }
     async tokenizePaymentMethod(tokenizeArgs) {
         var _a, _b, _c;
-        const billingInfoValues = (_b = await ((_a = this.billingFormRef) === null || _a === void 0 ? void 0 : _a.getValues())) !== null && _b !== void 0 ? _b : {};
+        const billingInfoValues = (_b = (await ((_a = this.billingFormRef) === null || _a === void 0 ? void 0 : _a.getValues()))) !== null && _b !== void 0 ? _b : {};
         const combinedBillingInfo = Object.assign(Object.assign({}, tokenizeArgs), billingInfoValues);
         const paymentMethodMetadata = Object.assign({ accountId: checkout_store.checkoutStore.accountId, payment_method_group_id: undefined }, combinedBillingInfo);
         if (checkout_store.checkoutStore.savePaymentMethod) {
-            paymentMethodMetadata.payment_method_group_id = checkout_store.checkoutStore.paymentMethodGroupId;
+            paymentMethodMetadata.payment_method_group_id =
+                checkout_store.checkoutStore.paymentMethodGroupId;
         }
         return (_c = this.paymentMethodFormRef) === null || _c === void 0 ? void 0 : _c.tokenize({
             clientId: this.authToken,
@@ -233,6 +328,10 @@ const ModularCheckout = class {
         });
     }
     async getPaymentMethod(submitCheckoutArgs) {
+        // If Apple Pay token is available, return a placeholder since we handle it differently
+        if (this.applePayToken) {
+            return "apple_pay_token";
+        }
         // If we have a payment token from the store (set by tokenize-payment-method), use it
         if (checkout_store.checkoutStore.paymentToken) {
             return checkout_store.checkoutStore.paymentToken;
@@ -254,34 +353,41 @@ const ModularCheckout = class {
     }
     async validate() {
         var _a, _b;
-        console.log('billing information form', this.billingFormRef);
-        console.log('payment method form', this.paymentMethodFormRef);
-        console.log('insurance form', this.insuranceFormRef);
-        console.log('sezzle payment method', this.sezzlePaymentMethodRef);
+        // If Apple Pay token is available, validation is already complete
+        if (this.applePayToken) {
+            return true;
+        }
         const promises = [
             (_a = this.paymentMethodFormRef) === null || _a === void 0 ? void 0 : _a.validate(),
-            (_b = this.billingFormRef) === null || _b === void 0 ? void 0 : _b.validate()
+            (_b = this.billingFormRef) === null || _b === void 0 ? void 0 : _b.validate(),
         ];
         if (this.insuranceFormRef) {
             promises.push(this.insuranceFormRef.validate());
         }
         const validationResults = await Promise.all(promises);
-        return validationResults.every(result => (result === null || result === void 0 ? void 0 : result.isValid) !== false);
+        return validationResults.every((result) => (result === null || result === void 0 ? void 0 : result.isValid) !== false);
     }
     async submitCheckout(submitCheckoutArgs) {
         var _a;
+        // If Apple Pay token is available, use Apple Pay flow
+        if (this.applePayToken) {
+            await this.submitCheckoutWithApplePay();
+            return;
+        }
         const isValid = await this.validate();
         if (!isValid) {
             this.errorEvent.emit({
-                message: 'Please fill in all required fields.',
+                message: "Please fill in all required fields.",
                 errorCode: ComponentError.ComponentErrorCodes.VALIDATION_ERROR,
                 severity: ComponentError.ComponentErrorSeverity.ERROR,
             });
             return;
         }
         let payment;
-        if (checkout_store.checkoutStore.selectedPaymentMethod === 'sezzle') {
-            const insuranceValidation = this.insuranceFormRef ? await this.insuranceFormRef.validate() : { isValid: true };
+        if (checkout_store.checkoutStore.selectedPaymentMethod === "sezzle") {
+            const insuranceValidation = this.insuranceFormRef
+                ? await this.insuranceFormRef.validate()
+                : { isValid: true };
             const sezzleResult = await this.sezzlePaymentMethodRef.resolvePaymentMethod(insuranceValidation);
             if (sezzleResult.error) {
                 this.errorEvent.emit({
@@ -291,9 +397,9 @@ const ModularCheckout = class {
                 });
                 return;
             }
-            else if (((_a = sezzleResult.bnpl) === null || _a === void 0 ? void 0 : _a.status) === 'success') {
+            else if (((_a = sezzleResult.bnpl) === null || _a === void 0 ? void 0 : _a.status) === "success") {
                 payment = {
-                    payment_mode: 'bnpl',
+                    payment_mode: "bnpl",
                     payment_token: undefined,
                 };
             }
@@ -302,14 +408,14 @@ const ModularCheckout = class {
             const paymentMethod = await this.getPaymentMethod(submitCheckoutArgs);
             if (!paymentMethod) {
                 this.errorEvent.emit({
-                    message: 'Payment method tokenization failed.',
+                    message: "Payment method tokenization failed.",
                     errorCode: ComponentError.ComponentErrorCodes.TOKENIZE_ERROR,
                     severity: ComponentError.ComponentErrorSeverity.ERROR,
                 });
                 return;
             }
             payment = {
-                payment_mode: 'ecom',
+                payment_mode: "ecom",
                 payment_token: paymentMethod,
             };
         }
@@ -318,7 +424,7 @@ const ModularCheckout = class {
             onSuccess: ({ checkout }) => {
                 this.submitEvent.emit({
                     checkout,
-                    message: 'Checkout completed successfully',
+                    message: "Checkout completed successfully",
                 });
             },
             onError: (error) => {
@@ -334,7 +440,7 @@ const ModularCheckout = class {
         checkout_store.checkoutStore.selectedPaymentMethod = paymentMethodId;
     }
     render() {
-        return (index.h(index.Host, { key: '240891d53dfb817bb39cbeb1e9a96ab885933a47' }));
+        return index.h(index.Host, { key: '5831cf966bbdf5236cfcb9a58652908c4a020138' });
     }
     get hostEl() { return index.getElement(this); }
     static get watchers() { return {
@@ -468,7 +574,6 @@ const TokenizePaymentMethod = class {
     componentWillLoad() {
         checkPkgVersion.checkPkgVersion();
         this.analytics = new checkPkgVersion.JustifiAnalytics(this);
-        this.validateRequiredProps();
     }
     connectedCallback() {
         this.setDefaultSelectedPaymentMethod();
@@ -490,6 +595,7 @@ const TokenizePaymentMethod = class {
     }
     async tokenizePaymentMethod(event) {
         event === null || event === void 0 ? void 0 : event.preventDefault();
+        this.validateRequiredProps();
         this.isLoading = true;
         try {
             const validation = await this.validate();
@@ -681,7 +787,7 @@ const TokenizePaymentMethod = class {
         return paymentMethodId === Refund.PaymentMethodTypes.card ? (index.h("justifi-card-form", { ref: (el) => (this.paymentMethodFormRef = el) })) : (index.h("justifi-bank-account-form", { ref: (el) => (this.paymentMethodFormRef = el) }));
     }
     render() {
-        return (index.h(styledHost.StyledHost, { key: 'ebe1d84471e0c6a32ee69d457f63755801d68577' }, index.h("form", { key: '7cf3aa01ead5602aaa31a4400d6bd9e1f782c65d' }, index.h("fieldset", { key: 'e8b430c8defd6103f53cb0a534466093983cd409' }, index.h("div", { key: '40d2206b6c43d3f3f05ad95b7731e3ecbe3eba83', class: "row gy-3" }, index.h("div", { key: 'e548fea0d586e8b0a3c0232e05bf7bb11bd2fbfc', class: "col-12" }, this.availablePaymentMethods.map((method) => this.renderPaymentMethodOption(method))), index.h("div", { key: 'f903481cbc309fa89d8cb0c124d2cdbf41f034fd', class: "col-12" }, index.h("justifi-button", { key: 'e76830507419530b3b1da8f2eee8e5ff323fdf59', text: this.submitButtonText, variant: "primary", type: "submit", clickHandler: (e) => this.tokenizePaymentMethod(e), isLoading: this.isLoading, "data-testid": "submit-button", hidden: this.computedHideSubmitButton })))))));
+        return (index.h(styledHost.StyledHost, { key: '91aecb0a6d627adffa535424c3c9520b41df4361' }, index.h("form", { key: '7774c819c106f799b903b24a5d12b59a7b1e2353' }, index.h("fieldset", { key: 'a9c09136f00e96730a0f972a836ae56072afd02f' }, index.h("div", { key: 'cb20d29e8e3102d4db894f87e38e24ea367d1a4b', class: "row gy-3" }, index.h("div", { key: '191e06a9bc446e2043892d4c8a4060b00e87b1bf', class: "col-12" }, this.availablePaymentMethods.map((method) => this.renderPaymentMethodOption(method))), index.h("div", { key: '890bcd8a5a08a049d57385041b0b048fe3f04b51', class: "col-12" }, index.h("justifi-button", { key: 'd361acdb29c73c2a90b9de401c3cab4db020a71a', text: this.submitButtonText, variant: "primary", type: "submit", clickHandler: (e) => this.tokenizePaymentMethod(e), isLoading: this.isLoading, "data-testid": "submit-button", hidden: this.computedHideSubmitButton })))))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/justifi-checkout.cjs.entry.js

@@ -1,13 +1,13 @@
 'use strict';
 
 var index = require('./index-dm_GlYlb.js');
-var checkPkgVersion = require('./check-pkg-version-BNVGE27p.js');
+var checkPkgVersion = require('./check-pkg-version-BsodhBbK.js');
 var ComponentError = require('./ComponentError-D4OLnOkg.js');
-var checkout_store = require('./checkout.store-CV_fuGQw.js');
+var checkout_store = require('./checkout.store-Cn3Jj5gi.js');
 var parts = require('./parts-9jMf1erK.js');
 var styledHost = require('./styled-host-CqQYxX-w.js');
 require('./event-types-YOY5TKUN.js');
-require('./package-BKILqyp3.js');
+require('./package-DJaHaxMC.js');
 require('./Api-CPuq_15r.js');
 require('./config-state-5xZf-jax.js');
 require('./index-Yd9aLenr.js');

package/dist/cjs/justifi-checkouts-list.cjs.entry.js

@@ -9,7 +9,7 @@ require('./Pagination-Dediz133.js');
 require('./Business-DCRzZf0w.js');
 require('./Dispute-CruQTF6_.js');
 var utils = require('./utils-DvUQQLmR.js');
-var checkPkgVersion = require('./check-pkg-version-BNVGE27p.js');
+var checkPkgVersion = require('./check-pkg-version-BsodhBbK.js');
 var checkout_service = require('./checkout.service-B0ZmvWwI.js');
 var getSubaccounts = require('./get-subaccounts-CwCH5rC8.js');
 var styledHost = require('./styled-host-CqQYxX-w.js');
@@ -19,7 +19,7 @@ require('./index-Yd9aLenr.js');
 require('./utils-BaGF9XIe.js');
 require('./helpers-B5OCqlIM.js');
 require('./state-options-CIT9xdTz.js');
-require('./package-BKILqyp3.js');
+require('./package-DJaHaxMC.js');
 require('./Api-CPuq_15r.js');
 require('./badge-CMmPvqtE.js');
 require('./parts-9jMf1erK.js');

package/dist/cjs/justifi-dispute-management.cjs.entry.js

@@ -2,11 +2,11 @@
 
 var index = require('./index-dm_GlYlb.js');
 var ComponentError = require('./ComponentError-D4OLnOkg.js');
-var checkPkgVersion = require('./check-pkg-version-BNVGE27p.js');
+var checkPkgVersion = require('./check-pkg-version-BsodhBbK.js');
 var Dispute = require('./Dispute-CruQTF6_.js');
 var utils = require('./utils-DvUQQLmR.js');
 var dispute_service = require('./dispute.service-DsPEAcDn.js');
-require('./package-BKILqyp3.js');
+require('./package-DJaHaxMC.js');
 require('./Api-CPuq_15r.js');
 require('./config-state-5xZf-jax.js');
 require('./index-Yd9aLenr.js');

package/dist/cjs/justifi-dispute-notification_3.cjs.entry.js

@@ -11,7 +11,7 @@ var ComponentError = require('./ComponentError-D4OLnOkg.js');
 var utils = require('./utils-DvUQQLmR.js');
 var dispute_service = require('./dispute.service-DsPEAcDn.js');
 var eventTypes = require('./event-types-BWQT2lwu.js');
-var checkPkgVersion = require('./check-pkg-version-BNVGE27p.js');
+var checkPkgVersion = require('./check-pkg-version-BsodhBbK.js');
 require('./dinero-BwNN_k7x.js');
 require('./Api-CPuq_15r.js');
 require('./config-state-5xZf-jax.js');
@@ -22,7 +22,7 @@ require('./Pagination-Dediz133.js');
 require('./Business-DCRzZf0w.js');
 require('./helpers-B5OCqlIM.js');
 require('./state-options-CIT9xdTz.js');
-require('./package-BKILqyp3.js');
+require('./package-DJaHaxMC.js');
 
 const makeUpdateDisputeResponse = ({ authToken, disputeId, service }) => async ({ payload, onSuccess, onError, final = () => { } }) => {
     var _a;

package/dist/cjs/justifi-gross-payment-chart.cjs.entry.js

@@ -9,7 +9,7 @@ require('./Business-DCRzZf0w.js');
 require('./Dispute-CruQTF6_.js');
 var utils = require('./utils-DvUQQLmR.js');
 var utils$1 = require('./utils-Df-pajL7.js');
-var checkPkgVersion = require('./check-pkg-version-BNVGE27p.js');
+var checkPkgVersion = require('./check-pkg-version-BsodhBbK.js');
 require('./config-state-5xZf-jax.js');
 require('./index-Yd9aLenr.js');
 require('./utils-BaGF9XIe.js');
@@ -17,7 +17,7 @@ require('./dinero-BwNN_k7x.js');
 require('./helpers-B5OCqlIM.js');
 require('./state-options-CIT9xdTz.js');
 require('./parts-9jMf1erK.js');
-require('./package-BKILqyp3.js');
+require('./package-DJaHaxMC.js');
 
 const api = Api.Api();
 class ReportsService {

package/dist/cjs/justifi-order-terminals.cjs.entry.js

@@ -4,7 +4,7 @@ var index = require('./index-dm_GlYlb.js');
 var parts = require('./parts-9jMf1erK.js');
 var styledHost = require('./styled-host-CqQYxX-w.js');
 require('./event-types-YOY5TKUN.js');
-var checkPkgVersion = require('./check-pkg-version-BNVGE27p.js');
+var checkPkgVersion = require('./check-pkg-version-BsodhBbK.js');
 var ComponentError = require('./ComponentError-D4OLnOkg.js');
 var business_service = require('./business.service-C3BdUPlm.js');
 var Business = require('./Business-DCRzZf0w.js');
@@ -18,7 +18,7 @@ require('./Dispute-CruQTF6_.js');
 var utils = require('./utils-DvUQQLmR.js');
 var terminal_service = require('./terminal.service-DUlyMTrX.js');
 var utils$1 = require('./utils-BaGF9XIe.js');
-require('./package-BKILqyp3.js');
+require('./package-DJaHaxMC.js');
 require('./Api-CPuq_15r.js');
 require('./helpers-B5OCqlIM.js');
 require('./state-options-CIT9xdTz.js');
@@ -233,7 +233,7 @@ const OrderTerminals = class {
         return (index.h("div", { class: "mt-3" }, index.h("div", { class: "text-end" }, "Order limit: ", this.orderLimit), index.h("div", { class: "d-flex justify-content-end mt-3" }, index.h("button", { class: "btn btn-primary submit-btn", onClick: this.submitOrder.bind(this), disabled: this.order.totalQuantity === 0 || this.submitting, part: parts.buttonPrimary }, this.submitting ? 'Submitting...' : this.submitButtonText))));
     }
     render() {
-        return (index.h(styledHost.StyledHost, { key: '866ce6548ba7252581c370fc33cad23e6a302f4e' }, index.h("div", { key: '2fbdde66e65ac95347a6b50e60f258a8e814e3ab', part: parts.text }, this.renderLoading(), this.renderBusinessDetails(), this.renderTerminals(), this.renderOrderSection())));
+        return (index.h(styledHost.StyledHost, { key: 'bd9a460778680855f021376a57d6cecd71f9e560' }, index.h("div", { key: '7ac80b5f2499bdecb6f2c0e001f6c6631040c71e', part: parts.text }, this.renderLoading(), this.renderBusinessDetails(), this.renderTerminals(), this.renderOrderSection())));
     }
 };
 

package/dist/cjs/justifi-payment-details.cjs.entry.js

@@ -5,7 +5,7 @@ var payment_service = require('./payment.service-1H0VC3LV.js');
 var getPaymentDetails = require('./get-payment-details-DtCXaIMx.js');
 var utils = require('./utils-Df-pajL7.js');
 var ComponentError = require('./ComponentError-D4OLnOkg.js');
-var checkPkgVersion = require('./check-pkg-version-BNVGE27p.js');
+var checkPkgVersion = require('./check-pkg-version-BsodhBbK.js');
 require('./Api-CPuq_15r.js');
 require('./config-state-5xZf-jax.js');
 require('./index-Yd9aLenr.js');
@@ -19,7 +19,7 @@ require('./helpers-B5OCqlIM.js');
 require('./state-options-CIT9xdTz.js');
 require('./utils-DvUQQLmR.js');
 require('./parts-9jMf1erK.js');
-require('./package-BKILqyp3.js');
+require('./package-DJaHaxMC.js');
 
 const PaymentDetails = class {
     constructor(hostRef) {

package/dist/cjs/justifi-payment-provisioning.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var index = require('./index-dm_GlYlb.js');
-var checkPkgVersion = require('./check-pkg-version-BNVGE27p.js');
+var checkPkgVersion = require('./check-pkg-version-BsodhBbK.js');
 var ComponentError = require('./ComponentError-D4OLnOkg.js');
 var paymentProvisioningActions = require('./payment-provisioning-actions-CZVlnRA0.js');
 var business_service = require('./business.service-C3BdUPlm.js');
@@ -10,7 +10,7 @@ require('./Refund-CqWNG8sx.js');
 require('./Pagination-Dediz133.js');
 require('./Business-DCRzZf0w.js');
 require('./Dispute-CruQTF6_.js');
-require('./package-BKILqyp3.js');
+require('./package-DJaHaxMC.js');
 require('./utils-DvUQQLmR.js');
 require('./config-state-5xZf-jax.js');
 require('./index-Yd9aLenr.js');