import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
import { a as state } from './watchers.js';
import './watchers2.js';
import { s as state$1 } from './getters.js';
import { s as state$3 } from './store.js';
import { s as state$2 } from './store2.js';
import { _ as __ } from './default-i18n.js';
import './index2.js';
import { U as Universe } from './universe.js';
import { d as defineCustomElement$C } from './sc-address2.js';
import { d as defineCustomElement$B } from './sc-alert2.js';
import { d as defineCustomElement$A } from './sc-block-ui2.js';
import { d as defineCustomElement$z } from './sc-button2.js';
import { d as defineCustomElement$y } from './sc-checkout-form-errors2.js';
import { d as defineCustomElement$x } from './sc-checkout-unsaved-changes-warning2.js';
import { d as defineCustomElement$w } from './sc-choice2.js';
import { d as defineCustomElement$v } from './sc-compact-address2.js';
import { d as defineCustomElement$u } from './sc-dashboard-module2.js';
import { d as defineCustomElement$t } from './sc-dialog2.js';
import { d as defineCustomElement$s } from './sc-divider2.js';
import { d as defineCustomElement$r } from './dropdown.js';
import { d as defineCustomElement$q } from './sc-form2.js';
import { d as defineCustomElement$p } from './sc-form-components-validator2.js';
import { d as defineCustomElement$o } from './sc-form-control2.js';
import { d as defineCustomElement$n } from './sc-form-error-provider2.js';
import { d as defineCustomElement$m } from './sc-form-state-provider2.js';
import { d as defineCustomElement$l } from './sc-format-number2.js';
import { d as defineCustomElement$k } from './sc-icon2.js';
import { d as defineCustomElement$j } from './sc-input2.js';
import { d as defineCustomElement$i } from './sc-line-item2.js';
import { d as defineCustomElement$h } from './sc-line-item-tax2.js';
import { d as defineCustomElement$g } from './sc-line-items-provider2.js';
import { d as defineCustomElement$f } from './sc-login-provider2.js';
import { d as defineCustomElement$e } from './sc-menu2.js';
import { d as defineCustomElement$d } from './sc-menu-item2.js';
import { d as defineCustomElement$c } from './sc-menu-label2.js';
import { d as defineCustomElement$b } from './sc-order-bump2.js';
import { d as defineCustomElement$a } from './sc-order-bumps2.js';
import { d as defineCustomElement$9 } from './sc-order-confirm-provider2.js';
import { d as defineCustomElement$8 } from './sc-order-shipping-address2.js';
import { d as defineCustomElement$7 } from './sc-order-tax-id-input2.js';
import { d as defineCustomElement$6 } from './sc-select2.js';
import { d as defineCustomElement$5 } from './sc-session-provider2.js';
import { d as defineCustomElement$4 } from './sc-spinner2.js';
import { d as defineCustomElement$3 } from './sc-tax-id-input2.js';
import { d as defineCustomElement$2 } from './sc-tooltip2.js';

const scCheckoutCss = "sc-checkout{display:block;font-family:var(--sc-font-sans);font-size:var(--sc-checkout-font-size, 16px);position:relative}sc-checkout h3{font-size:var(--sc-input-label-font-size-medium)}sc-alert{margin-bottom:var(--sc-form-row-spacing)}.sc-checkout-container.sc-align-center{max-width:500px;margin-left:auto;margin-right:auto}.sc-checkout-container.sc-align-wide{max-width:800px;margin-left:auto;margin-right:auto}::slotted(*){font-family:var(--sc-font-sans)}";

const ScCheckout$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
  constructor() {
    super();
    this.__registerHost();
    this.scOrderUpdated = createEvent(this, "scOrderUpdated", 7);
    this.scOrderFinalized = createEvent(this, "scOrderFinalized", 7);
    this.scOrderError = createEvent(this, "scOrderError", 7);
    /** An array of prices to pre-fill in the form. */
    this.prices = [];
    /** Are we in test or live mode. */
    this.mode = 'live';
    /** Currency to use for this checkout. */
    this.currencyCode = 'usd';
    /** Whether to persist the session in the browser between visits. */
    this.persistSession = true;
    /** Where to go on success */
    this.successUrl = '';
    /** Can we edit line items? */
    this.editLineItems = true;
    /** Can we remove line items? */
    this.removeLineItems = true;
    /** Use the Stripe payment element. */
    this.stripePaymentElement = false;
    /** Stores fetched prices for use throughout component.  */
    this.pricesEntities = {};
    /** Stores fetched products for use throughout component.  */
    this.productsEntities = {};
    /** Loading states for different parts of the form. */
    this.checkoutState = 'idle';
    /** The currenly selected processor */
    this.processor = 'stripe';
    /** Holds the payment intents for the checkout. */
    this.paymentIntents = {};
  }
  handleOrderStateUpdate(e) {
    state.checkout = e.detail;
  }
  handleMethodChange(e) {
    this.method = e.detail;
  }
  handleAddEntities(e) {
    const { products, prices } = e.detail;
    // add products.
    if (Object.keys((products === null || products === void 0 ? void 0 : products.length) || {})) {
      this.productsEntities = {
        ...this.productsEntities,
        ...products,
      };
    }
    // add prices.
    if (Object.keys((prices === null || prices === void 0 ? void 0 : prices.length) || {})) {
      this.pricesEntities = {
        ...this.pricesEntities,
        ...prices,
      };
    }
  }
  /**
   * Submit the form
   */
  async submit({ skip_validation } = { skip_validation: false }) {
    if (!skip_validation) {
      await this.validate();
    }
    return await this.sessionProvider.finalize();
  }
  /**
   * Validate the form.
   */
  async validate() {
    const form = this.el.querySelector('sc-form');
    return await form.validate();
  }
  componentWillLoad() {
    const checkout = document.querySelector('sc-checkout');
    this.isDuplicate = !!checkout && checkout !== this.el;
    if (this.isDuplicate)
      return;
    Universe.create(this, this.state());
    state$1.processors = this.processors;
    state$1.manualPaymentMethods = this.manualPaymentMethods;
    state$1.config.stripe.paymentElement = this.stripePaymentElement;
    state.formId = this.formId;
    state.mode = this.mode;
    state.product = this.product || null;
    state.currencyCode = this.currencyCode;
    state.groupId = this.el.id;
    state.abandonedCheckoutReturnUrl = this.abandonedCheckoutReturnUrl;
    state$2.loggedIn = this.loggedIn;
  }
  state() {
    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
    return {
      processor: this.processor,
      method: this.method,
      selectedProcessorId: this.processor,
      manualPaymentMethods: this.manualPaymentMethods,
      processor_data: (_a = state.checkout) === null || _a === void 0 ? void 0 : _a.processor_data,
      state: this.checkoutState,
      formState: state$3.formState.value,
      paymentIntents: this.paymentIntents,
      successUrl: this.successUrl,
      bumps: (_c = (_b = state.checkout) === null || _b === void 0 ? void 0 : _b.recommended_bumps) === null || _c === void 0 ? void 0 : _c.data,
      order: state.checkout,
      abandonedCheckoutEnabled: (_d = state.checkout) === null || _d === void 0 ? void 0 : _d.abandoned_checkout_enabled,
      checkout: state.checkout,
      shippingEnabled: (_e = state.checkout) === null || _e === void 0 ? void 0 : _e.shipping_enabled,
      lineItems: ((_g = (_f = state.checkout) === null || _f === void 0 ? void 0 : _f.line_items) === null || _g === void 0 ? void 0 : _g.data) || [],
      editLineItems: this.editLineItems,
      removeLineItems: this.removeLineItems,
      // checkout states
      loading: state$3.formState.value === 'loading',
      busy: ['updating', 'finalizing', 'paying', 'confirming'].includes(state$3.formState.value),
      paying: ['finalizing', 'paying', 'confirming'].includes(state$3.formState.value),
      empty: !['loading', 'updating'].includes(state$3.formState.value) && !((_k = (_j = (_h = state.checkout) === null || _h === void 0 ? void 0 : _h.line_items) === null || _j === void 0 ? void 0 : _j.pagination) === null || _k === void 0 ? void 0 : _k.count),
      // checkout states
      // stripe.
      stripePaymentElement: this.stripePaymentElement,
      stripePaymentIntent: (((_m = (_l = state.checkout) === null || _l === void 0 ? void 0 : _l.staged_payment_intents) === null || _m === void 0 ? void 0 : _m.data) || []).find(intent => intent.processor_type === 'stripe'),
      error: this.error,
      customer: this.customer,
      tax_status: (_o = state.checkout) === null || _o === void 0 ? void 0 : _o.tax_status,
      taxEnabled: (_p = state.checkout) === null || _p === void 0 ? void 0 : _p.tax_enabled,
      customerShippingAddress: typeof ((_q = state.checkout) === null || _q === void 0 ? void 0 : _q.customer) !== 'string' ? (_s = (_r = state.checkout) === null || _r === void 0 ? void 0 : _r.customer) === null || _s === void 0 ? void 0 : _s.shipping_address : {},
      shippingAddress: (_t = state.checkout) === null || _t === void 0 ? void 0 : _t.shipping_address,
      taxStatus: (_u = state.checkout) === null || _u === void 0 ? void 0 : _u.tax_status,
      taxIdentifier: (_v = state.checkout) === null || _v === void 0 ? void 0 : _v.tax_identifier,
      totalAmount: (_w = state.checkout) === null || _w === void 0 ? void 0 : _w.total_amount,
      taxProtocol: this.taxProtocol,
      lockedChoices: this.prices,
      products: this.productsEntities,
      prices: this.pricesEntities,
      country: 'US',
      loggedIn: this.loggedIn,
      emailExists: (_x = state.checkout) === null || _x === void 0 ? void 0 : _x.email_exists,
      formId: this.formId,
      mode: this.mode,
      currencyCode: this.currencyCode,
    };
  }
  render() {
    var _a, _b, _c, _d;
    if (this.isDuplicate) {
      return h("sc-alert", { open: true }, __('Due to processor restrictions, only one checkout form is allowed on the page.', 'surecart'));
    }
    return (h("div", { class: {
        'sc-checkout-container': true,
        'sc-align-center': this.alignment === 'center',
        'sc-align-wide': this.alignment === 'wide',
        'sc-align-full': this.alignment === 'full',
      } }, h("sc-checkout-unsaved-changes-warning", { state: this.checkoutState }), h(Universe.Provider, { state: this.state() }, h("sc-login-provider", { loggedIn: this.loggedIn, onScSetCustomer: e => (this.customer = e.detail), onScSetLoggedIn: e => (this.loggedIn = e.detail), order: state.checkout }, h("sc-form-state-provider", { onScSetCheckoutFormState: e => (this.checkoutState = e.detail) }, h("sc-form-error-provider", { checkoutState: state$3.formState.value, onScUpdateError: e => (this.error = e.detail) }, h("sc-form-components-validator", { order: state.checkout, disabled: this.disableComponentsValidation, taxProtocol: this.taxProtocol }, h("sc-order-confirm-provider", { "success-url": this.successUrl, successText: this.successText }, h("sc-session-provider", { ref: el => (this.sessionProvider = el), prices: this.prices, persist: this.persistSession, onScError: e => (this.error = e.detail) }, h("slot", null))))))), this.state().busy && h("sc-block-ui", { class: "busy-block-ui", "z-index": 30 }), state$3.formState.value === 'finalizing' && (h("sc-block-ui", { "z-index": 30, spinner: true, style: { '--sc-block-ui-opacity': '0.75' } }, ((_a = this.loadingText) === null || _a === void 0 ? void 0 : _a.finalizing) || __('Submitting order...', 'surecart'))), state$3.formState.value === 'paying' && (h("sc-block-ui", { "z-index": 30, spinner: true, style: { '--sc-block-ui-opacity': '0.75' } }, ((_b = this.loadingText) === null || _b === void 0 ? void 0 : _b.paying) || __('Processing payment...', 'surecart'))), state$3.formState.value === 'confirming' && (h("sc-block-ui", { "z-index": 30, spinner: true, style: { '--sc-block-ui-opacity': '0.75' } }, ((_c = this.loadingText) === null || _c === void 0 ? void 0 : _c.confirming) || __('Finalizing order...', 'surecart'))), state$3.formState.value === 'redirecting' && (h("sc-block-ui", { "z-index": 30, spinner: true, style: { '--sc-block-ui-opacity': '0.75' } }, ((_d = this.loadingText) === null || _d === void 0 ? void 0 : _d.confirmed) || __('Success! Redirecting...', 'surecart'))))));
  }
  get el() { return this; }
  static get style() { return scCheckoutCss; }
}, [4, "sc-checkout", {
    "prices": [16],
    "product": [16],
    "mode": [1],
    "formId": [2, "form-id"],
    "modified": [1],
    "currencyCode": [1, "currency-code"],
    "persistSession": [4, "persist-session"],
    "successUrl": [1, "success-url"],
    "customer": [1040],
    "alignment": [1],
    "taxProtocol": [16],
    "loggedIn": [1028, "logged-in"],
    "disableComponentsValidation": [4, "disable-components-validation"],
    "processors": [1040],
    "manualPaymentMethods": [16],
    "editLineItems": [4, "edit-line-items"],
    "removeLineItems": [4, "remove-line-items"],
    "abandonedCheckoutReturnUrl": [1, "abandoned-checkout-return-url"],
    "stripePaymentElement": [4, "stripe-payment-element"],
    "loadingText": [16],
    "successText": [16],
    "pricesEntities": [32],
    "productsEntities": [32],
    "checkoutState": [32],
    "error": [32],
    "processor": [32],
    "method": [32],
    "isManualProcessor": [32],
    "paymentIntents": [32],
    "isDuplicate": [32],
    "submit": [64],
    "validate": [64]
  }, [[0, "scUpdateOrderState", "handleOrderStateUpdate"], [0, "scSetMethod", "handleMethodChange"], [0, "scAddEntities", "handleAddEntities"]]]);
function defineCustomElement$1() {
  if (typeof customElements === "undefined") {
    return;
  }
  const components = ["sc-checkout", "sc-address", "sc-alert", "sc-block-ui", "sc-button", "sc-checkout-form-errors", "sc-checkout-unsaved-changes-warning", "sc-choice", "sc-compact-address", "sc-dashboard-module", "sc-dialog", "sc-divider", "sc-dropdown", "sc-form", "sc-form-components-validator", "sc-form-control", "sc-form-error-provider", "sc-form-state-provider", "sc-format-number", "sc-icon", "sc-input", "sc-line-item", "sc-line-item-tax", "sc-line-items-provider", "sc-login-provider", "sc-menu", "sc-menu-item", "sc-menu-label", "sc-order-bump", "sc-order-bumps", "sc-order-confirm-provider", "sc-order-shipping-address", "sc-order-tax-id-input", "sc-select", "sc-session-provider", "sc-spinner", "sc-tax-id-input", "sc-tooltip"];
  components.forEach(tagName => { switch (tagName) {
    case "sc-checkout":
      if (!customElements.get(tagName)) {
        customElements.define(tagName, ScCheckout$1);
      }
      break;
    case "sc-address":
      if (!customElements.get(tagName)) {
        defineCustomElement$C();
      }
      break;
    case "sc-alert":
      if (!customElements.get(tagName)) {
        defineCustomElement$B();
      }
      break;
    case "sc-block-ui":
      if (!customElements.get(tagName)) {
        defineCustomElement$A();
      }
      break;
    case "sc-button":
      if (!customElements.get(tagName)) {
        defineCustomElement$z();
      }
      break;
    case "sc-checkout-form-errors":
      if (!customElements.get(tagName)) {
        defineCustomElement$y();
      }
      break;
    case "sc-checkout-unsaved-changes-warning":
      if (!customElements.get(tagName)) {
        defineCustomElement$x();
      }
      break;
    case "sc-choice":
      if (!customElements.get(tagName)) {
        defineCustomElement$w();
      }
      break;
    case "sc-compact-address":
      if (!customElements.get(tagName)) {
        defineCustomElement$v();
      }
      break;
    case "sc-dashboard-module":
      if (!customElements.get(tagName)) {
        defineCustomElement$u();
      }
      break;
    case "sc-dialog":
      if (!customElements.get(tagName)) {
        defineCustomElement$t();
      }
      break;
    case "sc-divider":
      if (!customElements.get(tagName)) {
        defineCustomElement$s();
      }
      break;
    case "sc-dropdown":
      if (!customElements.get(tagName)) {
        defineCustomElement$r();
      }
      break;
    case "sc-form":
      if (!customElements.get(tagName)) {
        defineCustomElement$q();
      }
      break;
    case "sc-form-components-validator":
      if (!customElements.get(tagName)) {
        defineCustomElement$p();
      }
      break;
    case "sc-form-control":
      if (!customElements.get(tagName)) {
        defineCustomElement$o();
      }
      break;
    case "sc-form-error-provider":
      if (!customElements.get(tagName)) {
        defineCustomElement$n();
      }
      break;
    case "sc-form-state-provider":
      if (!customElements.get(tagName)) {
        defineCustomElement$m();
      }
      break;
    case "sc-format-number":
      if (!customElements.get(tagName)) {
        defineCustomElement$l();
      }
      break;
    case "sc-icon":
      if (!customElements.get(tagName)) {
        defineCustomElement$k();
      }
      break;
    case "sc-input":
      if (!customElements.get(tagName)) {
        defineCustomElement$j();
      }
      break;
    case "sc-line-item":
      if (!customElements.get(tagName)) {
        defineCustomElement$i();
      }
      break;
    case "sc-line-item-tax":
      if (!customElements.get(tagName)) {
        defineCustomElement$h();
      }
      break;
    case "sc-line-items-provider":
      if (!customElements.get(tagName)) {
        defineCustomElement$g();
      }
      break;
    case "sc-login-provider":
      if (!customElements.get(tagName)) {
        defineCustomElement$f();
      }
      break;
    case "sc-menu":
      if (!customElements.get(tagName)) {
        defineCustomElement$e();
      }
      break;
    case "sc-menu-item":
      if (!customElements.get(tagName)) {
        defineCustomElement$d();
      }
      break;
    case "sc-menu-label":
      if (!customElements.get(tagName)) {
        defineCustomElement$c();
      }
      break;
    case "sc-order-bump":
      if (!customElements.get(tagName)) {
        defineCustomElement$b();
      }
      break;
    case "sc-order-bumps":
      if (!customElements.get(tagName)) {
        defineCustomElement$a();
      }
      break;
    case "sc-order-confirm-provider":
      if (!customElements.get(tagName)) {
        defineCustomElement$9();
      }
      break;
    case "sc-order-shipping-address":
      if (!customElements.get(tagName)) {
        defineCustomElement$8();
      }
      break;
    case "sc-order-tax-id-input":
      if (!customElements.get(tagName)) {
        defineCustomElement$7();
      }
      break;
    case "sc-select":
      if (!customElements.get(tagName)) {
        defineCustomElement$6();
      }
      break;
    case "sc-session-provider":
      if (!customElements.get(tagName)) {
        defineCustomElement$5();
      }
      break;
    case "sc-spinner":
      if (!customElements.get(tagName)) {
        defineCustomElement$4();
      }
      break;
    case "sc-tax-id-input":
      if (!customElements.get(tagName)) {
        defineCustomElement$3();
      }
      break;
    case "sc-tooltip":
      if (!customElements.get(tagName)) {
        defineCustomElement$2();
      }
      break;
  } });
}
defineCustomElement$1();

const ScCheckout = ScCheckout$1;
const defineCustomElement = defineCustomElement$1;

export { ScCheckout, defineCustomElement };
