@justifi/webcomponents 5.7.6-rc-02 → 5.7.6-rc-04

package/dist/cjs/{justifi-button_5.cjs.entry.js → justifi-checkout-summary_5.cjs.entry.js}

@@ -1,65 +1,36 @@
 'use strict';
 
 var index = require('./index-D5bL1DOi.js');
-var styledHost = require('./styled-host-DXNHOiqW.js');
-var button = require('./button-0HYMPryx.js');
 var parts = require('./parts-9jMf1erK.js');
-var utils = require('./utils-qOon0GWm.js');
-var checkout_store = require('./checkout.store--pVCO0L1.js');
+var utils = require('./utils-DqlrBltg.js');
+var checkout_store = require('./checkout.store-B58bewb_.js');
+var styledHost = require('./styled-host-DXNHOiqW.js');
 require('./event-types-YOY5TKUN.js');
-var header1 = require('./header-1-M-mc3bsa.js');
-var insuranceState = require('./insurance-state-BsGy_svD.js');
-var header3 = require('./header-3-BnKbOjvz.js');
-var checkPkgVersion = require('./check-pkg-version-DmONJMn1.js');
+var checkPkgVersion = require('./check-pkg-version-Bp51QhAR.js');
 require('./config-state-Dz9bnWHg.js');
-var ComponentError = require('./ComponentError-CEv9ltwy.js');
-require('./Refund-Dt1CMUjx.js');
+require('./dinero-J-SRFKIR.js');
+var ComponentError = require('./ComponentError-D4OLnOkg.js');
+var Refund = require('./Refund-08OcZkXX.js');
 require('./Pagination-Dediz133.js');
-require('./Payment-D5UynU2f.js');
 require('./Business-DCRzZf0w.js');
 require('./Dispute-CruQTF6_.js');
-var utils$1 = require('./utils-IGCnjtqc.js');
-var checkout_service = require('./checkout.service-XwOh98gt.js');
-require('./_commonjsHelpers-BJu3ubxk.js');
+var utils$1 = require('./utils-DvUQQLmR.js');
+var checkout_service = require('./checkout.service-BBD6v0cl.js');
+var insuranceState = require('./insurance-state-B3CYpJWi.js');
+var paymentMethodOptionUtils = require('./payment-method-option-utils-QODgEWhU.js');
 require('./index-BCtVWU61.js');
-require('./package-oywezDpy.js');
-require('./Api-c8NBCwu4.js');
+require('./package-BMSb1ui9.js');
+require('./Api-eP0XeJLd.js');
+require('./_commonjsHelpers-BJu3ubxk.js');
 require('./helpers-B5OCqlIM.js');
 require('./state-options-CIT9xdTz.js');
 
-const JustifiButton = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.variant = 'primary';
-        this.type = 'button';
-    }
-    render() {
-        return (index.h(styledHost.StyledHost, { key: 'e921657ff4c5aae07184ba6560a0f42b1e908643' }, index.h(button.Button, { key: '837cad8384e8d0e2e81d329beb4693ebb15b7d59', variant: this.variant, isLoading: this.isLoading, clickHandler: this.clickHandler, class: this.class, type: this.type, disabled: this.disabled, style: this.customStyle }, this.text)));
-    }
-};
-
 const Summary = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(styledHost.StyledHost, { key: '9057314b14d664a53f9027fe8931c9e06d40da06' }, index.h("section", { key: '7f9d83b6684b0e12b8ac2f77980a46a8645bf9eb' }, index.h("div", { key: 'dec6d2cfc844ea84c8b2ed432ff158336accf753' }, index.h("div", { key: 'a70a972e3dcdad849602dcc701a945c065711a8a', part: parts.text }, checkout_store.checkoutStore === null || checkout_store.checkoutStore === void 0 ? void 0 : checkout_store.checkoutStore.paymentDescription), index.h("div", { key: 'cb2836ddfecd765399d596156cafeb2eec8e65eb' }, index.h("span", { key: '9578966828d25390357d15a0b20348a39b30ab4f', part: parts.text }, "Total"), "\u00A0", index.h("span", { key: '00643561d4e300539f43b970e4e31bc387d6e307', part: parts.text }, utils.formatCurrency(+(checkout_store.checkoutStore === null || checkout_store.checkoutStore === void 0 ? void 0 : checkout_store.checkoutStore.totalAmount))))))));
-    }
-};
-
-const Header = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.levels = {
-            h1: header1.Header1,
-            h2: insuranceState.Header2,
-            h3: header3.Header3,
-        };
-        this.level = 'h1';
-    }
-    render() {
-        const HeaderComponent = this.levels[this.level];
-        return (index.h(styledHost.StyledHost, { key: '1aa6a2f69da4f32ddfaae58c751134b4a8bd20b9' }, index.h(HeaderComponent, { key: 'f2877d1ef32662ab1a17a993d80366df01120a00', text: this.text, class: this.class })));
+        return (index.h(styledHost.StyledHost, { key: 'fe4584497faaf589819dd60c5310eb427518d8c6' }, index.h("section", { key: 'ca55b0c0feea790e13ac680b955e64565633e7bd' }, index.h("div", { key: 'ae82878dc9010db77bc564e4ba1cc8fc6c04e7f2' }, index.h("div", { key: 'daf8a8514879d64d3463b5394e61b19cf8445fb9', part: parts.text }, checkout_store.checkoutStore === null || checkout_store.checkoutStore === void 0 ? void 0 : checkout_store.checkoutStore.paymentDescription), index.h("div", { key: '44845dca1b6cb8d814c48279c03bc6694175e7a1' }, index.h("span", { key: 'eebc881d4693cab79fa25edb7563979c21d049a3', part: parts.text }, "Total"), "\u00A0", index.h("span", { key: 'fbf572ba41fb575aa83c1f56d35a294e0855dc9c', part: parts.text }, utils.formatCurrency(+(checkout_store.checkoutStore === null || checkout_store.checkoutStore === void 0 ? void 0 : checkout_store.checkoutStore.totalAmount))))))));
     }
 };
 
@@ -95,7 +66,8 @@ const makeCheckoutComplete = ({ authToken, checkoutId, service }) => async ({ pa
     try {
         const response = await service.complete(authToken, checkoutId, payment);
         if (!response.error) {
-            onSuccess(response);
+            const checkout = response.data;
+            onSuccess({ checkout });
         }
         else {
             const responseError = utils$1.getErrorMessage(response.error);
@@ -117,7 +89,7 @@ const makeCheckoutComplete = ({ authToken, checkoutId, service }) => async ({ pa
     }
 };
 
-const CheckoutWrapper = class {
+const ModularCheckout = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.errorEvent = index.createEvent(this, "error-event");
@@ -125,6 +97,9 @@ const CheckoutWrapper = class {
         this.paymentMethodChangedEvent = index.createEvent(this, "payment-method-changed");
         this.savePaymentMethod = false;
     }
+    savePaymentMethodChanged(newValue) {
+        checkout_store.checkoutStore.savePaymentMethod = newValue;
+    }
     connectedCallback() {
         this.observer = new MutationObserver(() => {
             this.queryFormRefs();
@@ -146,14 +121,23 @@ const CheckoutWrapper = class {
         });
     }
     componentWillLoad() {
+        if (!this.authToken || !this.checkoutId) {
+            this.errorEvent.emit({
+                message: ComponentError.ComponentErrorMessages.NOT_AUTHENTICATED,
+                errorCode: ComponentError.ComponentErrorCodes.NOT_AUTHENTICATED,
+                severity: ComponentError.ComponentErrorSeverity.ERROR,
+            });
+            return;
+        }
         this.analytics = new checkPkgVersion.JustifiAnalytics(this);
         checkPkgVersion.checkPkgVersion();
         checkout_store.checkoutStore.authToken = this.authToken;
+        checkout_store.checkoutStore.savePaymentMethod = this.savePaymentMethod;
         this.fetchCheckout();
-        // Refresh the checkout data when insurance is added or removed
+        // Refresh the checkout data when insurance values actually change (not on initial load)
         insuranceState.insuranceValuesOn('set', (key) => {
             const value = insuranceState.insuranceValues[key];
-            if (value !== undefined) {
+            if (value !== undefined && insuranceState.hasInsuranceValueChanged(key, value)) {
                 this.fetchCheckout();
             }
         });
@@ -169,6 +153,22 @@ const CheckoutWrapper = class {
         if (this.getCheckout) {
             this.getCheckout({
                 onSuccess: ({ checkout }) => {
+                    if (checkout.status === Refund.ICheckoutStatus.completed) {
+                        this.errorEvent.emit({
+                            message: ComponentError.ComponentErrorMessages.CHECKOUT_ALREADY_COMPLETED,
+                            errorCode: ComponentError.ComponentErrorCodes.CHECKOUT_ALREADY_COMPLETED,
+                            severity: ComponentError.ComponentErrorSeverity.ERROR,
+                        });
+                        return;
+                    }
+                    else if (checkout.status === Refund.ICheckoutStatus.expired) {
+                        this.errorEvent.emit({
+                            message: ComponentError.ComponentErrorMessages.CHECKOUT_EXPIRED,
+                            errorCode: ComponentError.ComponentErrorCodes.CHECKOUT_EXPIRED,
+                            severity: ComponentError.ComponentErrorSeverity.ERROR,
+                        });
+                        return;
+                    }
                     this.updateStore(checkout);
                 },
                 onError: (error) => {
@@ -202,14 +202,14 @@ const CheckoutWrapper = class {
         this.sezzlePaymentMethodRef = this.hostEl.querySelector('justifi-sezzle-payment-method');
     }
     async tokenizePaymentMethod(tokenizeArgs) {
-        var _a, _b;
+        var _a, _b, _c;
         const billingInfoValues = (_b = await ((_a = this.billingInformationFormRef) === 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 (this.savePaymentMethod) {
+        if (checkout_store.checkoutStore.savePaymentMethod) {
             paymentMethodMetadata.payment_method_group_id = checkout_store.checkoutStore.paymentMethodGroupId;
         }
-        return this.paymentMethodFormRef.tokenize({
+        return (_c = this.paymentMethodFormRef) === null || _c === void 0 ? void 0 : _c.tokenize({
             clientId: this.authToken,
             paymentMethodMetadata,
             account: checkout_store.checkoutStore.accountId,
@@ -308,9 +308,115 @@ const CheckoutWrapper = class {
         checkout_store.checkoutStore.selectedPaymentMethod = paymentMethodId;
     }
     render() {
-        return (index.h(index.Host, { key: '833e1e4f917a0dbee2a14076a71de8d00ec5b5d8' }));
+        return (index.h(index.Host, { key: '6b18f4f77b736f984ac15f168cc51b74c3927225' }));
     }
     get hostEl() { return index.getElement(this); }
+    static get watchers() { return {
+        "savePaymentMethod": ["savePaymentMethodChanged"]
+    }; }
+};
+
+const SavedPaymentMethods = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.onPaymentMethodOptionClick = (paymentMethodId) => (e) => {
+            e.preventDefault();
+            checkout_store.checkoutStore.selectedPaymentMethod = paymentMethodId;
+        };
+        this.isAllowedPaymentMethod = (paymentMethod) => {
+            if (paymentMethod.type === 'card' && checkout_store.checkoutStore.disableCreditCard) {
+                return false;
+            }
+            if (paymentMethod.type === 'bank_account' && checkout_store.checkoutStore.disableBankAccount) {
+                return false;
+            }
+            return true;
+        };
+    }
+    componentWillLoad() {
+        if (!checkout_store.checkoutStore.paymentMethods.length) {
+            console.warn('No saved payment methods available.');
+        }
+        if (checkout_store.checkoutStore.disablePaymentMethodGroup) {
+            console.warn('Payment method group is disabled.');
+        }
+    }
+    render() {
+        if (checkout_store.checkoutStore.disablePaymentMethodGroup) {
+            return null;
+        }
+        return (index.h(styledHost.StyledHost, null, index.h("div", { class: "saved-payment-methods" }, checkout_store.checkoutStore.paymentMethods.length ? checkout_store.checkoutStore.paymentMethods
+            .filter(this.isAllowedPaymentMethod)
+            .map((paymentMethod) => (index.h("div", { class: "radio-list-item p-3", part: parts.radioListItem, onClick: this.onPaymentMethodOptionClick(paymentMethod === null || paymentMethod === void 0 ? void 0 : paymentMethod.id) }, index.h("form-control-radio", { name: "paymentMethodType", value: paymentMethod === null || paymentMethod === void 0 ? void 0 : paymentMethod.id, checked: checkout_store.checkoutStore.selectedPaymentMethod === (paymentMethod === null || paymentMethod === void 0 ? void 0 : paymentMethod.id), label: `${paymentMethodOptionUtils.CardBrandLabels[paymentMethod === null || paymentMethod === void 0 ? void 0 : paymentMethod.brand] || ''} *${paymentMethod === null || paymentMethod === void 0 ? void 0 : paymentMethod.acct_last_four}` })))) : null)));
+    }
+};
+
+const sezzleLogo = (index.h("img", { class: "sezzle-smart-button-logo-img", src: "https://media.sezzle.com/branding/2.0/Sezzle_Logo_FullColor.svg", alt: "Sezzle", style: {
+        display: 'inline',
+        width: '80px',
+        marginLeft: '5px',
+        marginTop: '-5px',
+    } }));
+const SezzlePaymentMethod = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.paymentMethodOptionSelected = index.createEvent(this, "paymentMethodOptionSelected");
+        this.paymentMethodOptionId = 'sezzle';
+        this.onPaymentMethodOptionClick = (e) => {
+            e.preventDefault();
+            checkout_store.checkoutStore.selectedPaymentMethod = this.paymentMethodOptionId;
+            this.paymentMethodOptionSelected.emit(this.paymentMethodOptionId);
+        };
+        this.initializeSezzleCheckout = () => {
+            let resolveSezzlePromise;
+            this.sezzlePromise = new Promise((resolve) => { resolveSezzlePromise = resolve; });
+            const amount = Number(checkout_store.checkoutStore.paymentAmount);
+            const Checkout = window.Checkout;
+            const checkout = new Checkout({
+                mode: 'popup',
+                publicKey: checkout_store.checkoutStore.bnplProviderClientId,
+                apiMode: checkout_store.checkoutStore.bnplProviderMode,
+                apiVersion: checkout_store.checkoutStore.bnplProviderApiVersion,
+            });
+            checkout.sezzleButtonElement = this.sezzleButtonRef;
+            checkout.init({
+                onClick: function (event) {
+                    event.preventDefault();
+                    checkout.startCheckout({
+                        checkout_url: checkout_store.checkoutStore.bnplProviderCheckoutUrl,
+                    });
+                },
+                onComplete: (event) => resolveSezzlePromise({ bnpl: event.data }),
+                onCancel: (event) => resolveSezzlePromise({ bnpl: event.data }),
+                onFailure: (event) => resolveSezzlePromise({ bnpl: event.data }),
+            });
+            this.sezzleCheckout = checkout;
+            this.installmentPlan = this.sezzleCheckout.getInstallmentPlan(amount);
+        };
+    }
+    componentDidRender() {
+        if (!this.scriptRef)
+            return;
+        this.scriptRef.onload = () => {
+            this.sezzleButtonRef = document.createElement('button');
+            this.initializeSezzleCheckout();
+        };
+    }
+    async resolvePaymentMethod(insuranceValidation) {
+        if (!insuranceValidation.isValid) {
+            return { validationError: true };
+        }
+        this.sezzleButtonRef.click();
+        return this.sezzlePromise;
+    }
+    render() {
+        var _a, _b;
+        if (!checkout_store.checkoutStore.bnplEnabled || checkout_store.checkoutStore.disableBnpl) {
+            console.warn('justifi-sezzle-payment-method: BNPL is not enabled for this account.');
+            return null;
+        }
+        return (index.h(styledHost.StyledHost, { class: "payment-method" }, index.h("script", { src: "https://checkout-sdk.sezzle.com/checkout.min.js", async: true, ref: (el) => (this.scriptRef = el) }), index.h("div", { class: "radio-list-item p-3", part: parts.radioListItem, onClick: this.onPaymentMethodOptionClick }, index.h("form-control-radio", { name: "paymentMethodType", value: this.paymentMethodOptionId, checked: checkout_store.checkoutStore.selectedPaymentMethod === this.paymentMethodOptionId, label: index.h("div", null, index.h("div", null, "Buy now, pay later with ", sezzleLogo), this.installmentPlan && (index.h("small", null, index.h("span", null, (_a = this.installmentPlan) === null || _a === void 0 ? void 0 : _a.installments.length), "\u00A0", index.h("span", null, this.installmentPlan.schedule, " payments of"), "\u00A0", index.h("span", { class: "fw-bold" }, utils.formatCurrency((_b = this.installmentPlan) === null || _b === void 0 ? void 0 : _b.installments[0].amountInCents))))) }))));
+    }
 };
 
 const PaymentMethodOption = class {
@@ -318,12 +424,12 @@ const PaymentMethodOption = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(styledHost.StyledHost, { key: 'bef445cfdd80c24e9b005f503cf4913ceac4eae8', class: "payment-method" }, index.h("div", { key: 'af292fe29e32858371b7a41fb3d1b983a33d4cc0', class: "radio-list-item p-3", part: parts.radioListItem, onClick: this.clickHandler, hidden: this.radioButtonHidden }, index.h("form-control-radio", { key: '7f3e0ea48a5a8d9b655e1f8609065b7de06386eb', name: "paymentMethodType", value: this.paymentMethodOptionId, checked: this.isSelected, label: this.label }))));
+        return (index.h(styledHost.StyledHost, { key: '8d4bc7222b08e71511017ef1292360f491de05c0', class: "payment-method" }, index.h("div", { key: '0c9efd8f33e07dfc7261010ee5d4ad96302ae36b', class: "radio-list-item p-3", part: parts.radioListItem, onClick: this.clickHandler, hidden: this.radioButtonHidden }, index.h("form-control-radio", { key: 'c87f7caa8f2770d784d7efc002762f6beb5f1896', name: "paymentMethodType", value: this.paymentMethodOptionId, checked: this.isSelected, label: this.label }))));
     }
 };
 
-exports.justifi_button = JustifiButton;
 exports.justifi_checkout_summary = Summary;
-exports.justifi_header = Header;
-exports.justifi_modular_checkout = CheckoutWrapper;
+exports.justifi_modular_checkout = ModularCheckout;
+exports.justifi_saved_payment_methods = SavedPaymentMethods;
+exports.justifi_sezzle_payment_method = SezzlePaymentMethod;
 exports.payment_method_option = PaymentMethodOption;

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

@@ -1,20 +1,20 @@
 'use strict';
 
 var index = require('./index-D5bL1DOi.js');
-var checkPkgVersion = require('./check-pkg-version-DmONJMn1.js');
-var checkout_store = require('./checkout.store--pVCO0L1.js');
+var checkPkgVersion = require('./check-pkg-version-Bp51QhAR.js');
+var checkout_store = require('./checkout.store-B58bewb_.js');
 var parts = require('./parts-9jMf1erK.js');
-var Payment = require('./Payment-D5UynU2f.js');
+var Refund = require('./Refund-08OcZkXX.js');
 var styledHost = require('./styled-host-DXNHOiqW.js');
 require('./event-types-YOY5TKUN.js');
-require('./package-oywezDpy.js');
-require('./Api-c8NBCwu4.js');
+require('./package-BMSb1ui9.js');
+require('./Api-eP0XeJLd.js');
 require('./config-state-Dz9bnWHg.js');
 require('./index-BCtVWU61.js');
-require('./utils-qOon0GWm.js');
+require('./utils-DqlrBltg.js');
+require('./dinero-J-SRFKIR.js');
 require('./_commonjsHelpers-BJu3ubxk.js');
-require('./ComponentError-CEv9ltwy.js');
-require('./Refund-Dt1CMUjx.js');
+require('./ComponentError-D4OLnOkg.js');
 require('./Pagination-Dediz133.js');
 require('./Business-DCRzZf0w.js');
 require('./helpers-B5OCqlIM.js');
@@ -92,23 +92,23 @@ const Checkout = class {
         this.modularCheckoutRef.submitCheckout(checkout_store.checkoutStore.billingFormFields);
     }
     get canSavePaymentMethod() {
-        return checkout_store.checkoutStore.selectedPaymentMethod === Payment.PaymentMethodTypes.card || checkout_store.checkoutStore.selectedPaymentMethod === Payment.PaymentMethodTypes.bankAccount;
+        return checkout_store.checkoutStore.selectedPaymentMethod === Refund.PaymentMethodTypes.card || checkout_store.checkoutStore.selectedPaymentMethod === Refund.PaymentMethodTypes.bankAccount;
     }
     get showBillingForm() {
-        return (checkout_store.checkoutStore.selectedPaymentMethod === Payment.PaymentMethodTypes.card && !this.hideCardBillingForm)
-            || (checkout_store.checkoutStore.selectedPaymentMethod === Payment.PaymentMethodTypes.bankAccount && !this.hideBankAccountBillingForm);
+        return (checkout_store.checkoutStore.selectedPaymentMethod === Refund.PaymentMethodTypes.card && !this.hideCardBillingForm)
+            || (checkout_store.checkoutStore.selectedPaymentMethod === Refund.PaymentMethodTypes.bankAccount && !this.hideBankAccountBillingForm);
     }
     get showBillingFormSection() {
-        return checkout_store.checkoutStore.selectedPaymentMethod === Payment.PaymentMethodTypes.card || checkout_store.checkoutStore.selectedPaymentMethod === Payment.PaymentMethodTypes.bankAccount;
+        return checkout_store.checkoutStore.selectedPaymentMethod === Refund.PaymentMethodTypes.card || checkout_store.checkoutStore.selectedPaymentMethod === Refund.PaymentMethodTypes.bankAccount;
     }
     get showPaymentTypeHeader() {
         return !this.disableCreditCard && !this.disableBankAccount;
     }
     get showPostalCodeForm() {
-        return checkout_store.checkoutStore.selectedPaymentMethod === Payment.PaymentMethodTypes.card && this.hideCardBillingForm;
+        return checkout_store.checkoutStore.selectedPaymentMethod === Refund.PaymentMethodTypes.card && this.hideCardBillingForm;
     }
     render() {
-        return (index.h(styledHost.StyledHost, { key: '4fb1d82b065de6c1e4651a246a53f8e58451d6f6' }, index.h("justifi-modular-checkout", { key: '232cf32890422f474cf929b7c7ed7246d7b39c75', ref: (el) => (this.modularCheckoutRef = el), authToken: this.authToken, checkoutId: this.checkoutId, savePaymentMethod: this.canSavePaymentMethod && this.savePaymentMethod }, index.h("div", { key: '677ad110b05520be3b729995657086f0f6cbf337', class: "row gy-3 jfi-checkout-core" }, index.h("div", { key: '458c84541dd154dd8b4ad1d0f2320e2308cc1785', class: "col-12", part: parts.checkoutSummary }, index.h("justifi-header", { key: '440a7d1ad7b21da3db66e6c6f1f9afefb434a089', text: "Summary", level: "h2", class: "fs-5 fw-bold pb-3" }), index.h("section", { key: '99bd431a8f70ce6e764cc04da3d0aaae6f0ebcbe' }, index.h("justifi-checkout-summary", { key: '52da663e5bed35f0deb220800c7ede8835a3671b' }))), index.h("div", { key: 'e95b1c6830d20c5af57c558badb04d07d3c48f23', class: "col-12 mt-4" }, index.h("slot", { key: '527d58d4806d2e1bbcba499e97ab65f6c9c7efb9', name: "insurance" })), index.h("div", { key: '69d1319d1e05852de4f5566ad3be20bc9a6ee499', class: "col-12 mt-4" }, index.h("justifi-header", { key: '1682f909f22172a44da54118aefe428f92908e91', text: "Payment", level: "h2", class: "fs-5 fw-bold pb-3" }), this.showPaymentTypeHeader && (index.h("justifi-header", { key: '7942a12143bea0235705969737e11d59bc5180e1', text: "Select payment type", level: "h3", class: "fs-6 fw-bold lh-lg" })), index.h("div", { key: '497664d455695693c4f9a1a4465c62ad4d5b6bdf', class: "d-flex flex-column" }, index.h("section", { key: 'd3da4c18b430e1b36f7b9ba20be517994e763b5e' }, index.h("div", { key: '1cc0f0462a0f70d2acc4c9fdee25fbb2fe953c22' }, index.h("justifi-saved-payment-methods", { key: '576da27df84d67bc69f2d95f00a6c440fa73f7ed' }), index.h("justifi-sezzle-payment-method", { key: '6544a3a250ee012870a9edce71dd763553d44554' }), !this.disableCreditCard && (index.h("div", { key: '79050f768d8d76c4d882bed667e85391c230a960' }, index.h("payment-method-option", { key: '5a6c1dc583766707e6215203fdba176bd65b501d', paymentMethodOptionId: Payment.PaymentMethodTypes.card, isSelected: checkout_store.checkoutStore.selectedPaymentMethod === Payment.PaymentMethodTypes.card, clickHandler: () => { checkout_store.checkoutStore.selectedPaymentMethod = Payment.PaymentMethodTypes.card; }, radioButtonHidden: this.disableCreditCard, label: PaymentMethodTypeLabels[Payment.PaymentMethodTypes.card] }), checkout_store.checkoutStore.selectedPaymentMethod === Payment.PaymentMethodTypes.card && (index.h("div", { key: '5e6f0b854191a9a5db8936b2e30518fba251e478', class: "mt-4 mb-4" }, index.h("justifi-card-form", { key: '6c3f72f27dfe36924fe94ab4f7c79b6b9ff19b47' }))))), !this.disableBankAccount && (index.h("div", { key: 'f6a88103b2c30e4dd10e733b19aaa29a7a44430c' }, index.h("payment-method-option", { key: '67ef047a8caad5bc389238d54bb3d7056ca4b9e6', paymentMethodOptionId: Payment.PaymentMethodTypes.bankAccount, isSelected: checkout_store.checkoutStore.selectedPaymentMethod === Payment.PaymentMethodTypes.bankAccount, clickHandler: () => { checkout_store.checkoutStore.selectedPaymentMethod = Payment.PaymentMethodTypes.bankAccount; }, radioButtonHidden: this.disableBankAccount, label: PaymentMethodTypeLabels[Payment.PaymentMethodTypes.bankAccount] }), checkout_store.checkoutStore.selectedPaymentMethod === Payment.PaymentMethodTypes.bankAccount && (index.h("div", { key: 'e67924184fc43811523081711f59865a01d7cf9f', class: "mt-4 mb-4" }, index.h("justifi-bank-account-form", { key: 'a01cdfe8be1bc98d4c0f75c2a9f2ca1cce519042' }))))))))), this.showBillingFormSection && (index.h("div", { key: 'a15f1202548c7d6c302c2b2827168a6a119f8634', class: "col-12 mt-4" }, this.showBillingForm && (index.h("justifi-header", { key: 'ee654c812cb097449937da4253e191de1ee669d5', text: "Billing Address", level: "h2", class: "fs-5 fw-bold pb-3" })), this.showPostalCodeForm && (index.h("justifi-postal-code-form", { key: '2a5736e6da3354f7a9d1a5b8870a2f61c09c2592' })), this.showBillingForm && (index.h("justifi-billing-information-form", { key: '7dd63931e75d7583b4f51a1f6bb2b1e84a46e078' })))), index.h("div", { key: '54aeb0f07f574ee004ec02cd279265202cffa9bf', class: "col-12" }, this.canSavePaymentMethod && (index.h("justifi-save-new-payment-method", { key: '2e010be22091cee1ebc4353d5dac3b49639175e7' }))), index.h("div", { key: '71df812c8a922ae8b447d647f69675230c092db9', class: "mt-4" }, index.h("justifi-button", { key: '057cd18c6235c73cc69ca85e9cb35a2a614a4d9a', text: "Pay", type: "submit", variant: "primary", clickHandler: (e) => this.submit(e), disabled: this.isSubmitting, isLoading: this.isSubmitting, customStyle: { width: '100%', textAlign: "center" } }))))));
+        return (index.h(styledHost.StyledHost, { key: '66b064eb09a9d14357b5f67ed6cb06a315e28cd3' }, index.h("justifi-modular-checkout", { key: '0c175af8ee77ba66a6c9e6e338f8e148485e1a44', ref: (el) => (this.modularCheckoutRef = el), authToken: this.authToken, checkoutId: this.checkoutId, savePaymentMethod: this.canSavePaymentMethod && this.savePaymentMethod }, index.h("div", { key: '27a831604928bae01d8a4f056065cf4bb22ed078', class: "row gy-3 jfi-checkout-core" }, index.h("div", { key: '42f396148f51c83fcfb6af8385bfeaa0809c80b4', class: "col-12", part: parts.checkoutSummary }, index.h("justifi-header", { key: '4fdee03c9f6c2d8cb125cf00e7774486f748024b', text: "Summary", level: "h2", class: "fs-5 fw-bold pb-3" }), index.h("section", { key: '9dd9f8f49c714d915d33f4767196cb31912fe2d4' }, index.h("justifi-checkout-summary", { key: 'ab3a241477367ace71894a89cdb8df6b02b6a475' }))), index.h("div", { key: '2fcfa4852da6ab570999e00c900a38ce3f7b22d6', class: "col-12 mt-4" }, index.h("slot", { key: '0d8990a3c78a59cfad5b31de02d885dd85bdff3b', name: "insurance" })), index.h("div", { key: '02bcacf6467c99b50b61cd46c4393d2f21ac7f30', class: "col-12 mt-4" }, index.h("justifi-header", { key: 'f6c88155bcd68d4c76dd1c6d812cb3bf96556454', text: "Payment", level: "h2", class: "fs-5 fw-bold pb-3" }), this.showPaymentTypeHeader && (index.h("justifi-header", { key: 'dfc55a62398f0baeb3eef4d934644f68cc8483b9', text: "Select payment type", level: "h3", class: "fs-6 fw-bold lh-lg" })), index.h("div", { key: '3bfdf78062b252b9fc53f63e3248966cd4bd6513', class: "d-flex flex-column" }, index.h("section", { key: '5f51a590d33ae9074314df4a5808fa4355c3711f' }, index.h("div", { key: '048568eb658167dcb267a406d11e9672539e5454' }, index.h("justifi-saved-payment-methods", { key: '150ba48b60bd5818a6fd2004ed1d3b0571050221' }), index.h("justifi-sezzle-payment-method", { key: 'c959ccbba4683f37706daa889eaa60d0a371d682' }), !this.disableCreditCard && (index.h("div", { key: '412255d8cf36a0e3669680e09ca77d5efedf7969' }, index.h("payment-method-option", { key: '9aaaecfd5880a7de93e6f3c986e12f2e63407674', paymentMethodOptionId: Refund.PaymentMethodTypes.card, isSelected: checkout_store.checkoutStore.selectedPaymentMethod === Refund.PaymentMethodTypes.card, clickHandler: () => { checkout_store.checkoutStore.selectedPaymentMethod = Refund.PaymentMethodTypes.card; }, radioButtonHidden: this.disableCreditCard, label: PaymentMethodTypeLabels[Refund.PaymentMethodTypes.card] }), checkout_store.checkoutStore.selectedPaymentMethod === Refund.PaymentMethodTypes.card && (index.h("div", { key: '4fefd1eb74d9c6ba17a1d01fe59ab3334bf8bdac', class: "mt-4 mb-4" }, index.h("justifi-card-form", { key: '6c78f67bce200b47201220a528fb289861761727' }))))), !this.disableBankAccount && (index.h("div", { key: 'c5b97b68abaf8fa754b9f12e08a1b68c85b4c852' }, index.h("payment-method-option", { key: '24c013b3e317d26c9c7b961c0b0a87f2f94949f2', paymentMethodOptionId: Refund.PaymentMethodTypes.bankAccount, isSelected: checkout_store.checkoutStore.selectedPaymentMethod === Refund.PaymentMethodTypes.bankAccount, clickHandler: () => { checkout_store.checkoutStore.selectedPaymentMethod = Refund.PaymentMethodTypes.bankAccount; }, radioButtonHidden: this.disableBankAccount, label: PaymentMethodTypeLabels[Refund.PaymentMethodTypes.bankAccount] }), checkout_store.checkoutStore.selectedPaymentMethod === Refund.PaymentMethodTypes.bankAccount && (index.h("div", { key: 'b61b75f7e449b1217357bdaddfbfcf37d863612f', class: "mt-4 mb-4" }, index.h("justifi-bank-account-form", { key: 'e6d182d60e1b308f76b4364c9a757c7ca59debf2' }))))))))), this.showBillingFormSection && (index.h("div", { key: '71ea650fdb37ff7227b4f8027a54f74c8bf8a575', class: "col-12 mt-4" }, this.showBillingForm && (index.h("justifi-header", { key: 'f36db4e0d6d008d924ada83a83899377e46ece90', text: "Billing Address", level: "h2", class: "fs-5 fw-bold pb-3" })), this.showPostalCodeForm && (index.h("justifi-postal-code-form", { key: '19005f53df4bd597ccf6484d662d7d230a8a7b83' })), this.showBillingForm && (index.h("justifi-billing-information-form", { key: 'e5f501833f7aef3c603d18b29b21c39f990e8ef1' })))), index.h("div", { key: '828ba958634f58c641a5f6e3a848993d03e4aba0', class: "col-12" }, this.canSavePaymentMethod && (index.h("justifi-save-new-payment-method", { key: 'e94caf3d77e0299008e6a0bbf6852347eaa02ebf' }))), index.h("div", { key: '8436468192642a3f20f82b390e5ec53c4dc951bf', class: "mt-4" }, index.h("justifi-button", { key: '981448c550a72eb1aa936d785912729a1d788cac', text: "Pay", type: "submit", variant: "primary", clickHandler: (e) => this.submit(e), disabled: this.isSubmitting, isLoading: this.isSubmitting, customStyle: { width: '100%', textAlign: "center" } }))))));
     }
     static get watchers() { return {
         "authToken": ["propChanged"],

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

@@ -2,11 +2,10 @@
 
 var index = require('./index-D5bL1DOi.js');
 require('./config-state-Dz9bnWHg.js');
-require('./utils-qOon0GWm.js');
-require('./ComponentError-CEv9ltwy.js');
-var Refund = require('./Refund-Dt1CMUjx.js');
+require('./dinero-J-SRFKIR.js');
+require('./ComponentError-D4OLnOkg.js');
+var Refund = require('./Refund-08OcZkXX.js');
 require('./Pagination-Dediz133.js');
-require('./Payment-D5UynU2f.js');
 require('./Business-DCRzZf0w.js');
 require('./Dispute-CruQTF6_.js');
 var checkoutsListParamsState = require('./checkouts-list-params-state-DZUKBmLC.js');
@@ -15,6 +14,7 @@ var styledHost = require('./styled-host-DXNHOiqW.js');
 require('./event-types-YOY5TKUN.js');
 require('./index-BCtVWU61.js');
 require('./_commonjsHelpers-BJu3ubxk.js');
+require('./utils-DqlrBltg.js');
 require('./helpers-B5OCqlIM.js');
 require('./state-options-CIT9xdTz.js');
 
@@ -54,7 +54,7 @@ const CheckoutsListFilters = class {
     }
     render() {
         const filterMenuParams = Object.assign({}, checkoutsListParamsState.filterParams);
-        return (index.h(styledHost.StyledHost, { key: '5474a09b729c816bafb47101dbf5a25aff92eb1b' }, index.h("table-filters-menu", { key: '92e46a05e67bdf84b74cd644c1b89d0fc4c86af9', params: filterMenuParams, clearParams: checkoutsListParamsState.clearParams, part: parts.checkoutsListFilterMenu }, index.h("div", { key: 'd8562876f8a0c1d85caa5a298cccdb1143bd7512', class: "grid-cols-2 gap-3 p-1" }, index.h("div", { key: '4162644cf10861d91a79dc07f845dd21a6c8d6a5', class: "p-2" }, index.h("form-control-select", { key: '2b13ef4af25f6ac3865f3b0edde91929655537bf', name: "status", label: "Status", options: this.checkoutStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.checkoutStatus || checkoutsListParamsState.filterParams.status, disabled: !!this.checkoutStatus, part: parts.statusCheckoutsListFilterParam })), index.h("div", { key: '9aee7f453be147b03a548fe9ea9bd9bcc6a233aa', class: "p-2" }, index.h("form-control-select", { key: '8f375d5660c3414e5f3796e02694fa46ed761871', name: "payment_mode", label: "Payment Mode", options: this.checkoutPaymentModeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentMode || checkoutsListParamsState.filterParams.payment_mode, disabled: !!this.paymentMode, part: parts.paymentModeCheckoutsListFilterParam }))))));
+        return (index.h(styledHost.StyledHost, { key: 'd025c4862f0245938f09ea574379b262252a4e7e' }, index.h("table-filters-menu", { key: 'acd9800c723d7e956ee237e1d7944e58d5c4f332', params: filterMenuParams, clearParams: checkoutsListParamsState.clearParams, part: parts.checkoutsListFilterMenu }, index.h("div", { key: '453749cdaa376a051dbf1acdbedfa625a0c77c5c', class: "grid-cols-2 gap-3 p-1" }, index.h("div", { key: '8b83f81027c68ef9b47623ea66dc471aecf28ac4', class: "p-2" }, index.h("form-control-select", { key: '74e2548e0f96d63978e6fffe58ae1ca32b5fd4ee', name: "status", label: "Status", options: this.checkoutStatusOptions, inputHandler: this.setParamsOnChange, defaultValue: this.checkoutStatus || checkoutsListParamsState.filterParams.status, disabled: !!this.checkoutStatus, part: parts.statusCheckoutsListFilterParam })), index.h("div", { key: 'ea1fe571e4cc2ae9e2d2a62d7205e27fa1c7dc3f', class: "p-2" }, index.h("form-control-select", { key: 'e948b0e57ab03d31c32a036c24f1a29a45b5a90c', name: "payment_mode", label: "Payment Mode", options: this.checkoutPaymentModeOptions, inputHandler: this.setParamsOnChange, defaultValue: this.paymentMode || checkoutsListParamsState.filterParams.payment_mode, disabled: !!this.paymentMode, part: parts.paymentModeCheckoutsListFilterParam }))))));
     }
 };
 

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

@@ -2,26 +2,26 @@
 
 var index = require('./index-D5bL1DOi.js');
 require('./config-state-Dz9bnWHg.js');
-require('./utils-qOon0GWm.js');
-var ComponentError = require('./ComponentError-CEv9ltwy.js');
-var Refund = require('./Refund-Dt1CMUjx.js');
+require('./dinero-J-SRFKIR.js');
+var ComponentError = require('./ComponentError-D4OLnOkg.js');
+var Refund = require('./Refund-08OcZkXX.js');
 require('./Pagination-Dediz133.js');
-require('./Payment-D5UynU2f.js');
 require('./Business-DCRzZf0w.js');
 require('./Dispute-CruQTF6_.js');
-var utils = require('./utils-IGCnjtqc.js');
-var checkPkgVersion = require('./check-pkg-version-DmONJMn1.js');
-var checkout_service = require('./checkout.service-XwOh98gt.js');
-var getSubaccounts = require('./get-subaccounts-D4woaGSs.js');
+var utils = require('./utils-DvUQQLmR.js');
+var checkPkgVersion = require('./check-pkg-version-Bp51QhAR.js');
+var checkout_service = require('./checkout.service-BBD6v0cl.js');
+var getSubaccounts = require('./get-subaccounts-CtelAONX.js');
 var styledHost = require('./styled-host-DXNHOiqW.js');
 require('./event-types-YOY5TKUN.js');
-var checkoutsTable = require('./checkouts-table-CrpOOe_e.js');
+var checkoutsTable = require('./checkouts-table-Cp7rNkNd.js');
 require('./index-BCtVWU61.js');
 require('./_commonjsHelpers-BJu3ubxk.js');
+require('./utils-DqlrBltg.js');
 require('./helpers-B5OCqlIM.js');
 require('./state-options-CIT9xdTz.js');
-require('./package-oywezDpy.js');
-require('./Api-c8NBCwu4.js');
+require('./package-BMSb1ui9.js');
+require('./Api-eP0XeJLd.js');
 require('./badge-DDksduwk.js');
 require('./parts-9jMf1erK.js');
 
@@ -109,7 +109,7 @@ const CheckoutsList = class {
         }
     }
     render() {
-        return (index.h(styledHost.StyledHost, { key: '41bf633467138b6af13b1c02ccf1e1016ec54bfe' }, index.h("checkouts-list-core", { key: 'cd3ca431258ad73e701fe74612ecdf2c0f2a1bda', getCheckouts: this.getCheckouts, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
+        return (index.h(styledHost.StyledHost, { key: '073b7fb919a3f4d008a81cc7e13fb8ad72fed26c' }, index.h("checkouts-list-core", { key: '232229d4af023570ac261fda6df120a9451304cf', getCheckouts: this.getCheckouts, getSubAccounts: this.getSubAccounts, "onError-event": this.handleErrorEvent, columns: this.columns })));
     }
     static get watchers() { return {
         "accountId": ["propChanged"],

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

@@ -51,7 +51,7 @@ const DisputeManagementCore = class {
         });
     }
     render() {
-        return (index.h("div", { key: 'c85852cbd1169f371eb30ae06b6a2a564a15ece7' }, this.showDisputeResponseForm ? (index.h("justifi-dispute-response", { disputeId: this.disputeId, disputeResponse: this.dispute.dispute_response, authToken: this.authToken })) : (index.h("justifi-dispute-notification", { dispute: this.dispute, authToken: this.authToken, isLoading: this.isLoading }))));
+        return (index.h("div", { key: 'bb50db485b666c8a69826d3ccdccb19e1defff7f' }, this.showDisputeResponseForm ? (index.h("justifi-dispute-response", { disputeId: this.disputeId, disputeResponse: this.dispute.dispute_response, authToken: this.authToken })) : (index.h("justifi-dispute-notification", { dispute: this.dispute, authToken: this.authToken, isLoading: this.isLoading }))));
     }
     static get watchers() { return {
         "getDispute": ["updateOnPropChange"]

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

@@ -1,20 +1,20 @@
 'use strict';
 
 var index = require('./index-D5bL1DOi.js');
-var ComponentError = require('./ComponentError-CEv9ltwy.js');
-var checkPkgVersion = require('./check-pkg-version-DmONJMn1.js');
+var ComponentError = require('./ComponentError-D4OLnOkg.js');
+var checkPkgVersion = require('./check-pkg-version-Bp51QhAR.js');
 var Dispute = require('./Dispute-CruQTF6_.js');
-var utils = require('./utils-IGCnjtqc.js');
-var dispute_service = require('./dispute.service-Dh82Wru1.js');
-require('./package-oywezDpy.js');
-require('./Api-c8NBCwu4.js');
+var utils = require('./utils-DvUQQLmR.js');
+var dispute_service = require('./dispute.service-BHApwZdH.js');
+require('./package-BMSb1ui9.js');
+require('./Api-eP0XeJLd.js');
 require('./config-state-Dz9bnWHg.js');
 require('./index-BCtVWU61.js');
-require('./utils-qOon0GWm.js');
+require('./utils-DqlrBltg.js');
+require('./dinero-J-SRFKIR.js');
 require('./_commonjsHelpers-BJu3ubxk.js');
-require('./Refund-Dt1CMUjx.js');
+require('./Refund-08OcZkXX.js');
 require('./Pagination-Dediz133.js');
-require('./Payment-D5UynU2f.js');
 require('./Business-DCRzZf0w.js');
 require('./helpers-B5OCqlIM.js');
 require('./state-options-CIT9xdTz.js');
@@ -89,7 +89,7 @@ const DisputeManagement = class {
         }
     }
     render() {
-        return (index.h("justifi-dispute-management-core", { key: '4087eb105a046a3cc194d9f25c80fa11298fa0a2', getDispute: this.getDispute, disputeId: this.disputeId, authToken: this.authToken, "onError-event": this.handleErrorEvent }));
+        return (index.h("justifi-dispute-management-core", { key: 'b1139bacd020b346ffe8953489c972ae7bf35076', getDispute: this.getDispute, disputeId: this.disputeId, authToken: this.authToken, "onError-event": this.handleErrorEvent }));
     }
     static get watchers() { return {
         "disputeId": ["propChanged"],

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

@@ -1,29 +1,29 @@
 'use strict';
 
 var index = require('./index-D5bL1DOi.js');
-var utils$1 = require('./utils-qOon0GWm.js');
+var utils$1 = require('./utils-DqlrBltg.js');
 var parts = require('./parts-9jMf1erK.js');
 var button = require('./button-0HYMPryx.js');
 var styledHost = require('./styled-host-DXNHOiqW.js');
 var skeleton = require('./skeleton-CbZBGO47.js');
 require('./event-types-YOY5TKUN.js');
-var ComponentError = require('./ComponentError-CEv9ltwy.js');
-var utils = require('./utils-IGCnjtqc.js');
-var dispute_service = require('./dispute.service-Dh82Wru1.js');
+var ComponentError = require('./ComponentError-D4OLnOkg.js');
+var utils = require('./utils-DvUQQLmR.js');
+var dispute_service = require('./dispute.service-BHApwZdH.js');
 var eventTypes = require('./event-types-BWQT2lwu.js');
-var checkPkgVersion = require('./check-pkg-version-DmONJMn1.js');
+var checkPkgVersion = require('./check-pkg-version-Bp51QhAR.js');
+require('./dinero-J-SRFKIR.js');
 require('./_commonjsHelpers-BJu3ubxk.js');
-require('./Api-c8NBCwu4.js');
+require('./Api-eP0XeJLd.js');
 require('./config-state-Dz9bnWHg.js');
 require('./index-BCtVWU61.js');
-require('./Refund-Dt1CMUjx.js');
-require('./Pagination-Dediz133.js');
-require('./Payment-D5UynU2f.js');
+require('./Refund-08OcZkXX.js');
 require('./Dispute-CruQTF6_.js');
+require('./Pagination-Dediz133.js');
 require('./Business-DCRzZf0w.js');
 require('./helpers-B5OCqlIM.js');
 require('./state-options-CIT9xdTz.js');
-require('./package-oywezDpy.js');
+require('./package-BMSb1ui9.js');
 
 const makeUpdateDisputeResponse = ({ authToken, disputeId, service }) => async ({ payload, onSuccess, onError, final = () => { } }) => {
     var _a;
@@ -144,7 +144,7 @@ const DisputeNotification = class {
     }
     render() {
         var _a, _b, _c, _d, _e, _f, _g;
-        return (index.h(styledHost.StyledHost, { key: '0f1028825a7a96a06e7219518ffed54bc0db1b2b' }, this.isLoading && (index.h("div", { key: 'f4b704182a5a7085827854634d38c56423cc2e1b', style: { marginBottom: '8px' } }, index.h(skeleton.Skeleton, { key: 'b2062d8b683ab110c26fc30f1600c4500f668d87', height: '28px', width: '70%', styles: { marginBottom: '16px' } }), index.h(skeleton.Skeleton, { key: 'b5d2afe1fdd2e5ee0ec60048a48778bcfa6c78d3', height: '18px', styles: { marginBottom: '8px' } }), index.h(skeleton.Skeleton, { key: '1e87c8936b3f2e26e680786927c5a4609aca0b83', height: '18px', styles: { marginBottom: '8px' } }))), ((_a = this.dispute) === null || _a === void 0 ? void 0 : _a.needsResponse) && (index.h("div", { key: '49090493e3921353b7a830397795496bb234d112', part: parts.text }, index.h("h1", { key: 'fd7b56a7cfeaa6820bf2cc121575314d075b5a83', class: "h4", part: parts.heading4 }, "This payment is disputed"), index.h("p", { key: '72ba296695928baca8f7c5c3b1f858c596efedb2' }, "The cardholder is disputing this payment. You may accept this dispute, or proceed to provide evidence in a counter dispute."), index.h("h2", { key: 'cce733ff1bbca7a9530a442035cbae2995e018e7', class: "h5" }, "Dispute details"), index.h("div", { key: '28b7f081e345112d99c52d05f205734995617253', class: "d-table gap-2" }, index.h("div", { key: 'd9476d8d0adfa3c6eccad229e94cd3824a720c7d', class: "d-table-row gap-2" }, index.h("span", { key: '4d9e0714eee778c326ee1d70a32f79d90d3d4b09', part: "detail-section-item-title", class: "fw-bold d-table-cell pe-4" }, "Amount"), index.h("span", { key: 'b227edcf9b4b65b790d8aa98021d2662a12855bc', part: "detail-section-item-data", class: "flex-1 d-table-cell text-wrap" }, utils$1.formatCurrency((_b = this.dispute) === null || _b === void 0 ? void 0 : _b.amount))), index.h("div", { key: 'b1b1cdaac5482f565a6f26af71c0b526b8c19f4e', class: "d-table-row gap-2" }, index.h("span", { key: '0a479a9de96cce6e42bec90a17affe2c93ced44f', part: "detail-section-item-title", class: "fw-bold d-table-cell pe-4" }, "Reason"), index.h("span", { key: '5d5020dda571f4465e2a358880ad5f20bc6171ea', part: "detail-section-item-data", class: "flex-1 d-table-cell text-wrap" }, (_c = this.dispute) === null || _c === void 0 ? void 0 : _c.reason)), index.h("div", { key: 'a5f42c3fcbb5d14f8479d0a576d31a50f8fc6441', class: "d-table-row gap-2" }, index.h("span", { key: '280fca5a101eb0e823eb9ccc13c746ac7ed62069', part: "detail-section-item-title", class: "fw-bold d-table-cell pe-4" }, "Dispute ID"), index.h("span", { key: '4dfc0b9a295ffc804b708d3590358256009e5376', part: "detail-section-item-data", class: "flex-1 d-table-cell text-wrap" }, (_d = this.dispute) === null || _d === void 0 ? void 0 : _d.id))), index.h("div", { key: '654e7baccd08628bc90d050bad108011b49f9972', class: "d-flex gap-2 mt-4 justify-content-end" }, index.h(button.Button, { key: 'd0817cdb23bf33086c6ce5122f4ed5388027d96c', variant: "secondary", onClick: () => this.acceptDispute() }, "Accept dispute"), index.h(button.Button, { key: '5446bef44a0ca747692d59fd5490409d00a9e285', variant: "primary", onClick: () => this.initiateRespondToDispute() }, "Counter dispute")))), ((_e = this.dispute) === null || _e === void 0 ? void 0 : _e.underReview) && (index.h("div", { key: '17fbc5902badc4230c5485b326f480180c844768' }, index.h("h1", { key: 'fefa0234306588d9e7f56733872bf8c9793f51dd', class: "h4" }, "This payment is disputed and under review"), index.h("p", { key: 'eaad72aa8d9f65ca296379a2800180878ec8a7e5' }, "The cardholder is disputing this payment. A counter dispute has been submitted and is under review."))), ((_f = this.dispute) === null || _f === void 0 ? void 0 : _f.won) && (index.h("div", { key: 'ec1b0d728a7518f913c2a69976fa1f5fc8f76c74' }, index.h("h1", { key: '9d42fad15fbeee507e2f364c3a35f143ff7599e2', class: "h4" }, "This payment was disputed"), index.h("p", { key: '3b728a5544fe17a6c58c12f7e8eef290022945b6' }, "The cardholder disputed this payment and the card issuer has settled it in your favor."))), ((_g = this.dispute) === null || _g === void 0 ? void 0 : _g.lost) && (index.h("div", { key: '6d1813508a657265546fbef00bd1e8f46ffaf740' }, index.h("h1", { key: 'de981fc2e06e860f47146647975965a903a39b55', class: "h4" }, "This payment was disputed"), index.h("p", { key: '4e57ab86518bd678a3a5402b712d40d573b3a970' }, "The cardholder disputed this payment and the card issuer has settled it in their favor.")))));
+        return (index.h(styledHost.StyledHost, { key: 'b2fe02d9cc805d8bd9a9a7c7e24aa447bb506368' }, this.isLoading && (index.h("div", { key: '3e8b6996ba3bd3b6cee9ff6aa40de111d63d6e49', style: { marginBottom: '8px' } }, index.h(skeleton.Skeleton, { key: 'a9b5a6b69637c1fcff54d0d057a9c1d555b05333', height: '28px', width: '70%', styles: { marginBottom: '16px' } }), index.h(skeleton.Skeleton, { key: '771b72567728b6ffcc3dd393a9c7e289ffb49939', height: '18px', styles: { marginBottom: '8px' } }), index.h(skeleton.Skeleton, { key: '10bbcae1a4bd006394a71ad9d93ba2c2ab00174c', height: '18px', styles: { marginBottom: '8px' } }))), ((_a = this.dispute) === null || _a === void 0 ? void 0 : _a.needsResponse) && (index.h("div", { key: '4c34718dfa9622a045c3d7ee5c45415b87ba43d2', part: parts.text }, index.h("h1", { key: '6df61476d7e98b819722ecfd94eb74b25b1165b8', class: "h4", part: parts.heading4 }, "This payment is disputed"), index.h("p", { key: '3274dd90180201005e0c281c18bea8e794c1fae6' }, "The cardholder is disputing this payment. You may accept this dispute, or proceed to provide evidence in a counter dispute."), index.h("h2", { key: '0498b48e2a1f1ca5bc0f660ee5e515fea03cb171', class: "h5" }, "Dispute details"), index.h("div", { key: '65307411698be9a095eebfe5d8783c211b41d174', class: "d-table gap-2" }, index.h("div", { key: '64363e176ce32bcbdc670f73e07548893946aedd', class: "d-table-row gap-2" }, index.h("span", { key: '20bfe036e146209037512e63abe1c6c9c6996384', part: "detail-section-item-title", class: "fw-bold d-table-cell pe-4" }, "Amount"), index.h("span", { key: '7bc3b39608079b9627047e50d5d534b0722a85cd', part: "detail-section-item-data", class: "flex-1 d-table-cell text-wrap" }, utils$1.formatCurrency((_b = this.dispute) === null || _b === void 0 ? void 0 : _b.amount))), index.h("div", { key: '9fe0319d887d357f1db48ea0fea0234d183b837e', class: "d-table-row gap-2" }, index.h("span", { key: 'dfb7291c466865477e2f3e91aca16d4e8b0b388f', part: "detail-section-item-title", class: "fw-bold d-table-cell pe-4" }, "Reason"), index.h("span", { key: '08a88fdf4888617b3bb6812dee8d0e3b3067b9fa', part: "detail-section-item-data", class: "flex-1 d-table-cell text-wrap" }, (_c = this.dispute) === null || _c === void 0 ? void 0 : _c.reason)), index.h("div", { key: 'e8ed2895586fa7c4d95bc074099d2ef1c84c662d', class: "d-table-row gap-2" }, index.h("span", { key: '2776f7600495b448feec656e078c02935d564074', part: "detail-section-item-title", class: "fw-bold d-table-cell pe-4" }, "Dispute ID"), index.h("span", { key: 'd6122984a16b4eae7b1ee6aed85d43364ab14097', part: "detail-section-item-data", class: "flex-1 d-table-cell text-wrap" }, (_d = this.dispute) === null || _d === void 0 ? void 0 : _d.id))), index.h("div", { key: '66ffc380b6703cc0d6e5e1dc36969471eff5888a', class: "d-flex gap-2 mt-4 justify-content-end" }, index.h(button.Button, { key: '733d1bad942cab95915f9ec95a394db669501251', variant: "secondary", onClick: () => this.acceptDispute() }, "Accept dispute"), index.h(button.Button, { key: '37b2245252ec8e44ee1e2d16244a37915bf233e7', variant: "primary", onClick: () => this.initiateRespondToDispute() }, "Counter dispute")))), ((_e = this.dispute) === null || _e === void 0 ? void 0 : _e.underReview) && (index.h("div", { key: 'ce261f2fffe22a31a8342dd4bfca31da31853ae2' }, index.h("h1", { key: '2005fa90f8ca5c53cd4f3835a0ce5b6a02e7d88b', class: "h4" }, "This payment is disputed and under review"), index.h("p", { key: '37b92daa4a6efa2d1b8d38722b4cb34292145407' }, "The cardholder is disputing this payment. A counter dispute has been submitted and is under review."))), ((_f = this.dispute) === null || _f === void 0 ? void 0 : _f.won) && (index.h("div", { key: '71e849f41c4fb6594818f89a4a8358289396c121' }, index.h("h1", { key: '4a06746430e79e0117ce7bb7e6997f7c606ebad5', class: "h4" }, "This payment was disputed"), index.h("p", { key: 'e72309f0d54c499c5cb9fca1e088c95b6b341a80' }, "The cardholder disputed this payment and the card issuer has settled it in your favor."))), ((_g = this.dispute) === null || _g === void 0 ? void 0 : _g.lost) && (index.h("div", { key: 'ca1aae552813c4d6d7d952e512f8c8bfd5815957' }, index.h("h1", { key: '1d7644c907dbcdafc010ad5f44570306669f3f25', class: "h4" }, "This payment was disputed"), index.h("p", { key: '2b69366146a32a2005789d07c8af8ce4158148c3' }, "The cardholder disputed this payment and the card issuer has settled it in their favor.")))));
     }
 };
 
@@ -200,7 +200,7 @@ const DisputeResponse = class {
         }
     }
     render() {
-        return (index.h(styledHost.StyledHost, { key: 'dbdfd59a21c7e8ea4dfdaecb91f885f82540a27c' }, index.h("justifi-dispute-response-core", { key: '3cff38e5995f0033c45c54fa195ffeebc27e189e', "onError-event": this.handleErrorEvent, "dispute-id": this.disputeId, disputeResponse: this.disputeResponse, createDisputeEvidence: this.createDisputeEvidence, updateDisputeResponse: this.updateDisputeResponse, submitDisputeResponse: this.submitDisputeResponse })));
+        return (index.h(styledHost.StyledHost, { key: '757f300705d786610e958ecd2e574ec6294eb3a2' }, index.h("justifi-dispute-response-core", { key: 'c451a27a530b06072829dff517d85d2f0afd65ae', "onError-event": this.handleErrorEvent, "dispute-id": this.disputeId, disputeResponse: this.disputeResponse, createDisputeEvidence: this.createDisputeEvidence, updateDisputeResponse: this.updateDisputeResponse, submitDisputeResponse: this.submitDisputeResponse })));
     }
     ;
     static get watchers() { return {
@@ -368,7 +368,7 @@ const DisputeResponseCore = class {
         return this.currentStep === 0;
     }
     render() {
-        return (index.h("div", { key: '20d075178a9d88cd73be32e52f8df6d3d360f8d7', class: "row gy-3" }, index.h("div", { key: '6c1bc735f1a15709c596b5bea7cc3ce50e9a73f5', class: "col-12" }, index.h("h1", { key: '27a0804924937ee7a8d01265bd0da2d9dd31d301', class: "h4", part: parts.heading4 }, "Counter dispute")), index.h("div", { key: 'b60822e91425c5c4af003169f47fd725daf9fb0f', class: "col-12" }, this.currentStepComponent), index.h("div", { key: 'd1be3f6be53de37836275067070cf4b5a2eb3e4a', class: "col-12" }, index.h("div", { key: '48c8725d8de8b658e59ccfa851a6af6638e19ca5', class: "d-flex gap-2 mt-4 justify-content-end" }, this.isFirstStep ? (index.h(button.Button, { variant: "secondary", onClick: () => this.onCancel(), disabled: this.isLoading, isLoading: this.isLoading }, "Cancel")) : (index.h(button.Button, { variant: "secondary", onClick: () => this.onBack(), disabled: this.isLoading, isLoading: this.isLoading }, "Back")), this.isLastStep ? (index.h(button.Button, { variant: "primary", onClick: () => this.onSubmit(), disabled: this.isLoading, isLoading: this.isLoading }, "Submit Counter Dispute")) : (index.h(button.Button, { variant: "primary", onClick: () => this.onNext(), disabled: this.isLoading, isLoading: this.isLoading }, "Next"))))));
+        return (index.h("div", { key: '3f00a6b94c956c235145b6b5a91a097867ca00ef', class: "row gy-3" }, index.h("div", { key: '7bc1bcda8f5748999359a5286f69bddec6d92bc6', class: "col-12" }, index.h("h1", { key: '0b9ab07a2b421f9a61662a40341e464bf91c7edd', class: "h4", part: parts.heading4 }, "Counter dispute")), index.h("div", { key: 'e8782ca7ad6a04f270df67b2242b525ec52310d5', class: "col-12" }, this.currentStepComponent), index.h("div", { key: 'a305428bc3ff3801bdb7c2d086bd3b10d39c6eed', class: "col-12" }, index.h("div", { key: 'dac35a130c1c33df3b99505d7680d8affaac9906', class: "d-flex gap-2 mt-4 justify-content-end" }, this.isFirstStep ? (index.h(button.Button, { variant: "secondary", onClick: () => this.onCancel(), disabled: this.isLoading, isLoading: this.isLoading }, "Cancel")) : (index.h(button.Button, { variant: "secondary", onClick: () => this.onBack(), disabled: this.isLoading, isLoading: this.isLoading }, "Back")), this.isLastStep ? (index.h(button.Button, { variant: "primary", onClick: () => this.onSubmit(), disabled: this.isLoading, isLoading: this.isLoading }, "Submit Counter Dispute")) : (index.h(button.Button, { variant: "primary", onClick: () => this.onNext(), disabled: this.isLoading, isLoading: this.isLoading }, "Next"))))));
     }
 };