import { h, proxyCustomElement, HTMLElement, createEvent } from '@stencil/core/internal/client';
import { b as formatCurrency } from './utils2.js';
import { c as checkoutStore } from './checkout.store.js';
import { S as StyledHost } from './styled-host.js';
import './justifi-details2.js';
import './event-types.js';
import './justifi-radio-list-item2.js';
import { P as PAYMENT_METHODS } from './ModularCheckout.js';

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 JustifiSezzlePaymentMethod = /*@__PURE__*/ proxyCustomElement(class JustifiSezzlePaymentMethod extends HTMLElement {
    constructor(registerHost) {
        super();
        if (registerHost !== false) {
            this.__registerHost();
        }
        this.__attachShadow();
        this.paymentMethodOptionSelected = createEvent(this, "paymentMethodOptionSelected", 7);
        this.paymentMethodOptionId = PAYMENT_METHODS.SEZZLE;
        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;
    }
    async handleSelectionClick() {
        checkoutStore.selectedPaymentMethod = { type: PAYMENT_METHODS.SEZZLE };
        this.paymentMethodOptionSelected.emit(this.paymentMethodOptionId);
    }
    render() {
        var _a, _b;
        if (!checkoutStore.bnplEnabled) {
            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", 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)))))));
    }
}, [257, "justifi-sezzle-payment-method", {
        "installmentPlan": [32],
        "sezzleCheckout": [32],
        "sezzlePromise": [32],
        "resolvePaymentMethod": [64],
        "handleSelectionClick": [64]
    }]);
function defineCustomElement() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["justifi-sezzle-payment-method"];
    components.forEach(tagName => { switch (tagName) {
        case "justifi-sezzle-payment-method":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, JustifiSezzlePaymentMethod);
            }
            break;
    } });
}
defineCustomElement();

export { JustifiSezzlePaymentMethod as J, defineCustomElement as d };
