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

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

@@ -1,797 +0,0 @@
-import { r as registerInstance, h, c as createEvent, H as Host, g as getElement } from './index-kpoIU4v_.js';
-import { z as text, r as radioListItem } from './parts-RvUQ__Pq.js';
-import { f as formatCurrency } from './utils-lb8p1Exq.js';
-import { c as checkoutStore, o as onChange } from './checkout.store-OAv_iY1u.js';
-import { S as StyledHost } from './styled-host-B_XBaM7z.js';
-import './event-types-CZfYo5-1.js';
-import { H as Header1 } from './header-1-BMKEv9y6.js';
-import { H as Header2, b as insuranceValuesOn, h as hasInsuranceValueChanged, i as insuranceValues } from './insurance-state-d4hjThzE.js';
-import { H as Header3 } from './header-3-C3t3m27b.js';
-import { J as JustifiAnalytics, c as checkPkgVersion } from './check-pkg-version-D_w9UM2s.js';
-import './config-state-BrllxiM0.js';
-import './dinero-HXpYMWUU.js';
-import { C as ComponentErrorSeverity, a as ComponentErrorCodes, b as ComponentErrorMessages } from './ComponentError-Cjcsf8ku.js';
-import { I as ICheckoutStatus, k as PaymentMethodTypes } from './Refund-Di6J0oN2.js';
-import './Pagination-CLHwhyvu.js';
-import './Business-BCoP0TAV.js';
-import './Dispute-BH0Xfn-F.js';
-import { g as getErrorCode, a as getErrorMessage } from './utils-BeQLScSm.js';
-import { C as CheckoutService } from './checkout.service-XgGFa7H8.js';
-import { C as CardBrandLabels } from './payment-method-option-utils-lUHAQVFl.js';
-import './index-B9me4yN2.js';
-import './package-78C4rMuv.js';
-import './Api-N_veT2p6.js';
-import './helpers-Mu7LQT-w.js';
-import './state-options-BX8GieXu.js';
-
-const Summary = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-    }
-    render() {
-        return (h(StyledHost, { key: '28a1a324b8cdf2dea0aafe91fbdd3679482e76f8' }, h("section", { key: 'e8ffe2fdd1592a0b762647fdab94ee5e21436a93' }, h("div", { key: '099fbfb449066290cdcd113b0de5f87334777a0e' }, h("div", { key: 'c78325957b4e00299366b8e9efe6fd6e86da3b97', part: text }, checkoutStore === null || checkoutStore === void 0 ? void 0 : checkoutStore.paymentDescription), h("div", { key: 'd077da888b03a34e540f66ebaa57502fe22be7c4' }, h("span", { key: 'd4f7ddd24e10302222679a9f73c3b5ed305267a7', part: text }, "Total"), "\u00A0", h("span", { key: '1f5d7b6b0cce64eea04879e7767ff87ce5a64069', part: text }, formatCurrency(+(checkoutStore === null || checkoutStore === void 0 ? void 0 : checkoutStore.totalAmount))))))));
-    }
-};
-
-const Header = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.levels = {
-            h1: Header1,
-            h2: Header2,
-            h3: Header3,
-        };
-        this.level = 'h1';
-    }
-    render() {
-        const HeaderComponent = this.levels[this.level];
-        return (h(StyledHost, { key: '73104ea086f8a9948e69f86451adf19e0f39fb32' }, h(HeaderComponent, { key: 'a8582109634299a24e2a9b3c7181c6bba511fde7', text: this.text, class: this.class })));
-    }
-};
-
-const makeGetCheckout = ({ authToken, checkoutId, service }) => async ({ onSuccess, onError }) => {
-    var _a;
-    try {
-        const response = await service.fetchCheckout(authToken, checkoutId);
-        if (!response.error) {
-            const checkout = response.data;
-            onSuccess({ checkout });
-        }
-        else {
-            const responseError = getErrorMessage(response.error);
-            const code = getErrorCode((_a = response.error) === null || _a === void 0 ? void 0 : _a.code);
-            return onError({
-                error: responseError,
-                code,
-                severity: ComponentErrorSeverity.ERROR,
-            });
-        }
-    }
-    catch (error) {
-        const code = getErrorCode(error === null || error === void 0 ? void 0 : error.code);
-        return onError({
-            error: error.message || error,
-            code,
-            severity: ComponentErrorSeverity.ERROR,
-        });
-    }
-};
-const makeCheckoutComplete = ({ authToken, checkoutId, service }) => async ({ payment, onSuccess, onError }) => {
-    var _a;
-    try {
-        const response = await service.complete(authToken, checkoutId, payment);
-        if (!response.error) {
-            const checkout = response.data;
-            onSuccess({ checkout });
-        }
-        else {
-            const responseError = getErrorMessage(response.error);
-            const code = getErrorCode((_a = response.error) === null || _a === void 0 ? void 0 : _a.code);
-            return onError({
-                error: responseError,
-                code,
-                severity: ComponentErrorSeverity.ERROR,
-            });
-        }
-    }
-    catch (error) {
-        const code = getErrorCode(error === null || error === void 0 ? void 0 : error.code);
-        return onError({
-            error: error.message || error,
-            code,
-            severity: ComponentErrorSeverity.ERROR,
-        });
-    }
-};
-
-const ModularCheckout = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.errorEvent = createEvent(this, "error-event");
-        this.submitEvent = createEvent(this, "submit-event");
-        this.paymentMethodChangedEvent = 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: ComponentErrorCodes.TOKENIZE_ERROR,
-                    severity: 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: ComponentErrorCodes.TOKENIZE_ERROR,
-                severity: ComponentErrorSeverity.ERROR,
-            });
-        };
-        this.handleApplePayCancelled = () => {
-            console.log("Apple Pay cancelled by user");
-            // Reset the token if cancelled
-            this.applePayToken = undefined;
-            this.applePayPaymentMethodId = undefined;
-        };
-    }
-    savePaymentMethodChanged(newValue) {
-        checkoutStore.savePaymentMethod = newValue;
-    }
-    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,
-        });
-        checkoutStore.checkoutId = this.checkoutId;
-        const config = {
-            authToken: this.authToken,
-            checkoutId: this.checkoutId,
-            service: new CheckoutService(),
-        };
-        this.getCheckout = makeGetCheckout(config);
-        this.completeCheckout = makeCheckoutComplete(config);
-        onChange("selectedPaymentMethod", (newValue) => {
-            this.paymentMethodChangedEvent.emit(newValue);
-        });
-    }
-    componentWillLoad() {
-        if (!this.authToken || !this.checkoutId) {
-            this.errorEvent.emit({
-                message: ComponentErrorMessages.NOT_AUTHENTICATED,
-                errorCode: ComponentErrorCodes.NOT_AUTHENTICATED,
-                severity: ComponentErrorSeverity.ERROR,
-            });
-            return;
-        }
-        this.analytics = new JustifiAnalytics(this);
-        checkPkgVersion();
-        checkoutStore.authToken = this.authToken;
-        checkoutStore.savePaymentMethod = this.savePaymentMethod;
-        this.fetchCheckout();
-        // Refresh the checkout data when insurance values actually change (not on initial load)
-        insuranceValuesOn("set", (key) => {
-            const value = insuranceValues[key];
-            if (value !== undefined && hasInsuranceValueChanged(key, value)) {
-                this.fetchCheckout();
-            }
-        });
-    }
-    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) {
-            this.getCheckout({
-                onSuccess: ({ checkout }) => {
-                    if (checkout.status === ICheckoutStatus.completed) {
-                        this.errorEvent.emit({
-                            message: ComponentErrorMessages.CHECKOUT_ALREADY_COMPLETED,
-                            errorCode: ComponentErrorCodes.CHECKOUT_ALREADY_COMPLETED,
-                            severity: ComponentErrorSeverity.ERROR,
-                        });
-                        return;
-                    }
-                    else if (checkout.status === ICheckoutStatus.expired) {
-                        this.errorEvent.emit({
-                            message: ComponentErrorMessages.CHECKOUT_EXPIRED,
-                            errorCode: ComponentErrorCodes.CHECKOUT_EXPIRED,
-                            severity: ComponentErrorSeverity.ERROR,
-                        });
-                        return;
-                    }
-                    this.updateStore(checkout);
-                },
-                onError: (error) => {
-                    this.errorEvent.emit({
-                        message: error.message,
-                        errorCode: ComponentErrorCodes.FETCH_ERROR,
-                        severity: ComponentErrorSeverity.ERROR,
-                    });
-                },
-            });
-        }
-    }
-    updateStore(checkout) {
-        var _a, _b, _c, _d;
-        checkoutStore.accountId = checkout.account_id;
-        checkoutStore.paymentMethods = checkout.payment_methods;
-        checkoutStore.paymentMethodGroupId = checkout.payment_method_group_id;
-        checkoutStore.paymentDescription = checkout.payment_description;
-        checkoutStore.totalAmount = checkout.total_amount;
-        checkoutStore.paymentAmount = checkout.payment_amount;
-        checkoutStore.bnplEnabled = checkout.payment_settings.bnpl_payments;
-        checkoutStore.bnplProviderClientId = (_a = checkout === null || checkout === void 0 ? void 0 : checkout.bnpl) === null || _a === void 0 ? void 0 : _a.provider_client_id;
-        checkoutStore.bnplProviderMode = (_b = checkout === null || checkout === void 0 ? void 0 : checkout.bnpl) === null || _b === void 0 ? void 0 : _b.provider_mode;
-        checkoutStore.bnplProviderApiVersion = (_c = checkout === null || checkout === void 0 ? void 0 : checkout.bnpl) === null || _c === void 0 ? void 0 : _c.provider_api_version;
-        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.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: ComponentErrorCodes.TOKENIZE_ERROR,
-                severity: 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: ComponentErrorCodes.COMPLETE_CHECKOUT_ERROR,
-                    severity: 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 combinedBillingInfo = Object.assign(Object.assign({}, tokenizeArgs), billingInfoValues);
-        const paymentMethodMetadata = Object.assign({ accountId: checkoutStore.accountId, payment_method_group_id: undefined }, combinedBillingInfo);
-        if (checkoutStore.savePaymentMethod) {
-            paymentMethodMetadata.payment_method_group_id =
-                checkoutStore.paymentMethodGroupId;
-        }
-        return (_c = this.paymentMethodFormRef) === null || _c === void 0 ? void 0 : _c.tokenize({
-            clientId: this.authToken,
-            paymentMethodMetadata,
-            account: checkoutStore.accountId,
-        });
-    }
-    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 (checkoutStore.paymentToken) {
-            return checkoutStore.paymentToken;
-        }
-        // Fallback to the original tokenization logic for backward compatibility
-        if (!this.paymentMethodFormRef) {
-            return checkoutStore.selectedPaymentMethod;
-        }
-        const { error, id: token } = await this.tokenizePaymentMethod(submitCheckoutArgs);
-        if (error) {
-            this.errorEvent.emit({
-                errorCode: error.code,
-                message: error.message,
-                severity: ComponentErrorSeverity.ERROR,
-            });
-            return undefined;
-        }
-        return token;
-    }
-    async validate() {
-        var _a, _b;
-        // 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(),
-        ];
-        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);
-    }
-    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.",
-                errorCode: ComponentErrorCodes.VALIDATION_ERROR,
-                severity: ComponentErrorSeverity.ERROR,
-            });
-            return;
-        }
-        let payment;
-        if (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({
-                    message: sezzleResult.error.message,
-                    errorCode: ComponentErrorCodes.TOKENIZE_ERROR,
-                    severity: ComponentErrorSeverity.ERROR,
-                });
-                return;
-            }
-            else if (((_a = sezzleResult.bnpl) === null || _a === void 0 ? void 0 : _a.status) === "success") {
-                payment = {
-                    payment_mode: "bnpl",
-                    payment_token: undefined,
-                };
-            }
-        }
-        else {
-            const paymentMethod = await this.getPaymentMethod(submitCheckoutArgs);
-            if (!paymentMethod) {
-                this.errorEvent.emit({
-                    message: "Payment method tokenization failed.",
-                    errorCode: ComponentErrorCodes.TOKENIZE_ERROR,
-                    severity: ComponentErrorSeverity.ERROR,
-                });
-                return;
-            }
-            payment = {
-                payment_mode: "ecom",
-                payment_token: paymentMethod,
-            };
-        }
-        this.completeCheckout({
-            payment,
-            onSuccess: ({ checkout }) => {
-                this.submitEvent.emit({
-                    checkout,
-                    message: "Checkout completed successfully",
-                });
-            },
-            onError: (error) => {
-                this.errorEvent.emit({
-                    message: error.message,
-                    errorCode: ComponentErrorCodes.COMPLETE_CHECKOUT_ERROR,
-                    severity: ComponentErrorSeverity.ERROR,
-                });
-            },
-        });
-    }
-    async setSelectedPaymentMethod(paymentMethodId) {
-        checkoutStore.selectedPaymentMethod = paymentMethodId;
-    }
-    render() {
-        return h(Host, { key: '5831cf966bbdf5236cfcb9a58652908c4a020138' });
-    }
-    get hostEl() { return getElement(this); }
-    static get watchers() { return {
-        "savePaymentMethod": ["savePaymentMethodChanged"]
-    }; }
-};
-
-const SavedPaymentMethods = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.onPaymentMethodOptionClick = (paymentMethodId) => (e) => {
-            e.preventDefault();
-            checkoutStore.selectedPaymentMethod = paymentMethodId;
-        };
-        this.isAllowedPaymentMethod = (paymentMethod) => {
-            if (paymentMethod.type === 'card' && checkoutStore.disableCreditCard) {
-                return false;
-            }
-            if (paymentMethod.type === 'bank_account' && checkoutStore.disableBankAccount) {
-                return false;
-            }
-            return true;
-        };
-    }
-    componentWillLoad() {
-        if (!checkoutStore.paymentMethods.length) {
-            console.warn('No saved payment methods available.');
-        }
-        if (checkoutStore.disablePaymentMethodGroup) {
-            console.warn('Payment method group is disabled.');
-        }
-    }
-    render() {
-        if (checkoutStore.disablePaymentMethodGroup) {
-            return null;
-        }
-        return (h(StyledHost, null, h("div", { class: "saved-payment-methods" }, checkoutStore.paymentMethods.length ? checkoutStore.paymentMethods
-            .filter(this.isAllowedPaymentMethod)
-            .map((paymentMethod) => (h("div", { class: "radio-list-item p-3", part: radioListItem, onClick: this.onPaymentMethodOptionClick(paymentMethod === null || paymentMethod === void 0 ? void 0 : paymentMethod.id) }, h("form-control-radio", { name: "paymentMethodType", value: paymentMethod === null || paymentMethod === void 0 ? void 0 : paymentMethod.id, checked: checkoutStore.selectedPaymentMethod === (paymentMethod === null || paymentMethod === void 0 ? void 0 : paymentMethod.id), label: `${CardBrandLabels[paymentMethod === null || paymentMethod === void 0 ? void 0 : paymentMethod.brand] || ''} *${paymentMethod === null || paymentMethod === void 0 ? void 0 : paymentMethod.acct_last_four}` })))) : null)));
-    }
-};
-
-const sezzleLogo = (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) {
-        registerInstance(this, hostRef);
-        this.paymentMethodOptionSelected = createEvent(this, "paymentMethodOptionSelected");
-        this.paymentMethodOptionId = 'sezzle';
-        this.onPaymentMethodOptionClick = (e) => {
-            e.preventDefault();
-            checkoutStore.selectedPaymentMethod = this.paymentMethodOptionId;
-            this.paymentMethodOptionSelected.emit(this.paymentMethodOptionId);
-        };
-        this.initializeSezzleCheckout = () => {
-            let resolveSezzlePromise;
-            this.sezzlePromise = new Promise((resolve) => { resolveSezzlePromise = resolve; });
-            const amount = Number(checkoutStore.paymentAmount);
-            const Checkout = window.Checkout;
-            const checkout = new Checkout({
-                mode: 'popup',
-                publicKey: checkoutStore.bnplProviderClientId,
-                apiMode: checkoutStore.bnplProviderMode,
-                apiVersion: checkoutStore.bnplProviderApiVersion,
-            });
-            checkout.sezzleButtonElement = this.sezzleButtonRef;
-            checkout.init({
-                onClick: function (event) {
-                    event.preventDefault();
-                    checkout.startCheckout({
-                        checkout_url: 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 (!checkoutStore.bnplEnabled || checkoutStore.disableBnpl) {
-            console.warn('justifi-sezzle-payment-method: BNPL is not enabled for this account.');
-            return null;
-        }
-        return (h(StyledHost, { class: "payment-method" }, h("script", { src: "https://checkout-sdk.sezzle.com/checkout.min.js", async: true, ref: (el) => (this.scriptRef = el) }), h("div", { class: "radio-list-item p-3", part: radioListItem, onClick: this.onPaymentMethodOptionClick }, h("form-control-radio", { name: "paymentMethodType", value: this.paymentMethodOptionId, checked: checkoutStore.selectedPaymentMethod === this.paymentMethodOptionId, label: h("div", null, h("div", null, "Buy now, pay later with ", sezzleLogo), this.installmentPlan && (h("small", null, h("span", null, (_a = this.installmentPlan) === null || _a === void 0 ? void 0 : _a.installments.length), "\u00A0", h("span", null, this.installmentPlan.schedule, " payments of"), "\u00A0", h("span", { class: "fw-bold" }, formatCurrency((_b = this.installmentPlan) === null || _b === void 0 ? void 0 : _b.installments[0].amountInCents))))) }))));
-    }
-};
-
-// Constants
-const PAYMENT_METHOD_TYPE_LABELS = {
-    [PaymentMethodTypes.bankAccount]: 'New bank account',
-    [PaymentMethodTypes.card]: 'New credit or debit card',
-};
-const ERROR_MESSAGES = {
-    AUTH_TOKEN_REQUIRED: 'Auth token is required when using the tokenize-payment-method component not slotted in justifi-modular-checkout',
-    ACCOUNT_ID_REQUIRED: 'Account ID is required when using the tokenize-payment-method component not slotted in justifi-modular-checkout',
-    FORM_NOT_READY: 'Payment form not ready',
-    VALIDATION_ERROR: 'Validation error',
-};
-const TokenizePaymentMethod = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.errorEvent = createEvent(this, "error-event");
-        this.submitEvent = createEvent(this, "submit-event");
-        this.isLoading = false;
-        this.computedHideSubmitButton = false;
-        this.submitButtonText = 'Submit';
-    }
-    componentWillLoad() {
-        checkPkgVersion();
-        this.analytics = new JustifiAnalytics(this);
-    }
-    connectedCallback() {
-        this.setDefaultSelectedPaymentMethod();
-        this.setComputedHideSubmitButton();
-    }
-    disconnectedCallback() {
-        var _a;
-        (_a = this.analytics) === null || _a === void 0 ? void 0 : _a.cleanup();
-    }
-    paymentMethodsChanged() {
-        this.setDefaultSelectedPaymentMethod();
-    }
-    handleRadioClick(event) {
-        this.selectedPaymentMethodId = event.detail;
-    }
-    async fillBillingForm(fields) {
-        var _a;
-        (_a = this.billingFormRef) === null || _a === void 0 ? void 0 : _a.fill(fields);
-    }
-    async tokenizePaymentMethod(event) {
-        event === null || event === void 0 ? void 0 : event.preventDefault();
-        this.validateRequiredProps();
-        this.isLoading = true;
-        try {
-            const validation = await this.validate();
-            if (!validation.isValid) {
-                this.errorEvent.emit({
-                    errorCode: ComponentErrorCodes.TOKENIZE_ERROR,
-                    message: ERROR_MESSAGES.VALIDATION_ERROR,
-                });
-                this.isLoading = false;
-                return;
-            }
-            const tokenizeResponse = await this.resolvePaymentMethod({ isValid: true });
-            if (tokenizeResponse.error) {
-                this.emitError({
-                    errorCode: tokenizeResponse.error.code,
-                    message: tokenizeResponse.error.message,
-                });
-            }
-            this.submitEvent.emit({ response: tokenizeResponse });
-            return tokenizeResponse;
-        }
-        catch (error) {
-            const errorResponse = this.createErrorResponse(ComponentErrorCodes.TOKENIZE_ERROR, error.message);
-            this.emitError({
-                errorCode: ComponentErrorCodes.TOKENIZE_ERROR,
-                message: error.message,
-            });
-            this.submitEvent.emit({ response: errorResponse });
-            return errorResponse;
-        }
-        finally {
-            this.isLoading = false;
-        }
-    }
-    async validate() {
-        if (!this.areFormsReady()) {
-            return { isValid: false, errors: { general: ERROR_MESSAGES.FORM_NOT_READY } };
-        }
-        const [billingValidation, paymentMethodValidation] = await Promise.all([
-            this.billingFormRef.validate(),
-            this.paymentMethodFormRef.validate(),
-        ]);
-        return {
-            isValid: billingValidation.isValid && paymentMethodValidation.isValid,
-            errors: Object.assign(Object.assign({}, billingValidation.errors), paymentMethodValidation.errors),
-        };
-    }
-    validateRequiredProps() {
-        if (!this.authToken && !checkoutStore.authToken) {
-            this.emitError({
-                errorCode: ComponentErrorCodes.TOKENIZE_ERROR,
-                message: ERROR_MESSAGES.AUTH_TOKEN_REQUIRED,
-            });
-        }
-        if (!this.accountId && !checkoutStore.accountId) {
-            this.emitError({
-                errorCode: ComponentErrorCodes.TOKENIZE_ERROR,
-                message: ERROR_MESSAGES.ACCOUNT_ID_REQUIRED,
-            });
-        }
-    }
-    setDefaultSelectedPaymentMethod() {
-        if (this.selectedPaymentMethodId) {
-            return;
-        }
-        if (!this.disableCreditCard) {
-            this.selectedPaymentMethodId = PaymentMethodTypes.card;
-        }
-        else if (!this.disableBankAccount) {
-            this.selectedPaymentMethodId = PaymentMethodTypes.bankAccount;
-        }
-    }
-    setComputedHideSubmitButton() {
-        // If hideSubmitButton prop is explicitly set, use that value
-        if (this.hideSubmitButton !== undefined) {
-            this.computedHideSubmitButton = this.hideSubmitButton;
-            return;
-        }
-        // Otherwise, auto-detect if component is slotted within modular-checkout
-        const isWithinModularCheckout = this.isSlottedWithinModularCheckout();
-        this.computedHideSubmitButton = isWithinModularCheckout;
-    }
-    isSlottedWithinModularCheckout() {
-        var _a;
-        let parent = (_a = this.host) === null || _a === void 0 ? void 0 : _a.parentElement;
-        while (parent) {
-            if (parent.tagName === 'JUSTIFI-MODULAR-CHECKOUT') {
-                return true;
-            }
-            parent = parent.parentElement;
-        }
-        return false;
-    }
-    get availablePaymentMethods() {
-        const methods = [];
-        if (!this.disableCreditCard) {
-            methods.push(PaymentMethodTypes.card);
-        }
-        if (!this.disableBankAccount) {
-            methods.push(PaymentMethodTypes.bankAccount);
-        }
-        return methods;
-    }
-    areFormsReady() {
-        return !!(this.billingFormRef && this.paymentMethodFormRef);
-    }
-    emitError(errorData) {
-        this.errorEvent.emit(Object.assign(Object.assign({}, errorData), { severity: ComponentErrorSeverity.ERROR }));
-    }
-    createErrorResponse(code, message) {
-        return {
-            error: {
-                code: code,
-                message,
-                decline_code: undefined,
-            },
-        };
-    }
-    async resolvePaymentMethod(insuranceValidation) {
-        if (!this.areFormsReady()) {
-            return this.createErrorResponse('form_not_ready', ERROR_MESSAGES.FORM_NOT_READY);
-        }
-        try {
-            const validation = await this.validate();
-            if (!validation.isValid || !insuranceValidation.isValid) {
-                const errorMessage = Object.values(validation.errors)[0] || ERROR_MESSAGES.VALIDATION_ERROR;
-                return {
-                    validationError: true,
-                    error: {
-                        code: 'validation_error',
-                        message: String(errorMessage),
-                        decline_code: undefined,
-                    },
-                };
-            }
-            return await this.performTokenization();
-        }
-        catch (error) {
-            return { error };
-        }
-    }
-    async performTokenization() {
-        var _a, _b;
-        const tokenizeResponse = await this.tokenize();
-        if (tokenizeResponse.error) {
-            return { error: tokenizeResponse.error };
-        }
-        const tokenizeResponseData = tokenizeResponse.data;
-        return {
-            token: ((_a = tokenizeResponseData.card) === null || _a === void 0 ? void 0 : _a.token) || ((_b = tokenizeResponseData.bank_account) === null || _b === void 0 ? void 0 : _b.token),
-            data: tokenizeResponseData,
-        };
-    }
-    async tokenize() {
-        try {
-            const billingFormFieldValues = await this.billingFormRef.getValues();
-            const config = {
-                clientId: this.authToken || checkoutStore.authToken,
-                account: this.accountId || checkoutStore.accountId,
-                paymentMethodMetadata: this.buildPaymentMethodMetadata(billingFormFieldValues),
-            };
-            return await this.paymentMethodFormRef.tokenize(config);
-        }
-        catch (error) {
-            return error;
-        }
-    }
-    buildPaymentMethodMetadata(billingFormFieldValues) {
-        return this.shouldSavePaymentMethod
-            ? Object.assign(Object.assign({}, billingFormFieldValues), { payment_method_group_id: this.paymentMethodGroupID }) : Object.assign({}, billingFormFieldValues);
-    }
-    get paymentMethodGroupID() {
-        return this.paymentMethodGroupId || checkoutStore.paymentMethodGroupId;
-    }
-    get shouldSavePaymentMethod() {
-        return !!(this.paymentMethodGroupId || checkoutStore.savePaymentMethod);
-    }
-    get shouldHideRadioInput() {
-        return this.disableCreditCard || this.disableBankAccount;
-    }
-    renderPaymentMethodOption(paymentMethodType) {
-        const isSelected = this.selectedPaymentMethodId === paymentMethodType;
-        return (h("div", { class: "payment-method" }, h("justifi-radio-list-item", { name: "paymentMethodType", value: paymentMethodType, checked: isSelected, label: PAYMENT_METHOD_TYPE_LABELS[paymentMethodType], hidden: this.shouldHideRadioInput }), isSelected && this.renderSelectedPaymentMethodForm(paymentMethodType)));
-    }
-    renderSelectedPaymentMethodForm(paymentMethodId) {
-        return (h("div", { class: "mt-4 pb-4" }, this.renderPaymentMethodForm(paymentMethodId), h("div", { class: "mt-4" }, h("justifi-billing-form", { ref: (el) => (this.billingFormRef = el), hideCardBillingForm: this.hideCardBillingForm, hideBankAccountBillingForm: this.hideBankAccountBillingForm, paymentMethodType: paymentMethodId })), h("div", { class: "mt-4" }, h("justifi-save-new-payment-method", { hidden: !this.paymentMethodGroupID }))));
-    }
-    renderPaymentMethodForm(paymentMethodId) {
-        return paymentMethodId === PaymentMethodTypes.card ? (h("justifi-card-form", { ref: (el) => (this.paymentMethodFormRef = el) })) : (h("justifi-bank-account-form", { ref: (el) => (this.paymentMethodFormRef = el) }));
-    }
-    render() {
-        return (h(StyledHost, { key: '91aecb0a6d627adffa535424c3c9520b41df4361' }, h("form", { key: '7774c819c106f799b903b24a5d12b59a7b1e2353' }, h("fieldset", { key: 'a9c09136f00e96730a0f972a836ae56072afd02f' }, h("div", { key: 'cb20d29e8e3102d4db894f87e38e24ea367d1a4b', class: "row gy-3" }, h("div", { key: '191e06a9bc446e2043892d4c8a4060b00e87b1bf', class: "col-12" }, this.availablePaymentMethods.map((method) => this.renderPaymentMethodOption(method))), h("div", { key: '890bcd8a5a08a049d57385041b0b048fe3f04b51', class: "col-12" }, 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 getElement(this); }
-    static get watchers() { return {
-        "disableCreditCard": ["paymentMethodsChanged"],
-        "disableBankAccount": ["paymentMethodsChanged"]
-    }; }
-};
-
-export { Summary as justifi_checkout_summary, Header as justifi_header, ModularCheckout as justifi_modular_checkout, SavedPaymentMethods as justifi_saved_payment_methods, SezzlePaymentMethod as justifi_sezzle_payment_method, TokenizePaymentMethod as justifi_tokenize_payment_method };