import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
import { _ as __ } from './default-i18n.js';
import './index2.js';
import { a as apiFetch } from './fetch.js';
import { e as expand } from './index4.js';
import { a as state } from './watchers.js';
import { c as clearCheckout } from './mutations.js';
import { d as defineCustomElement$6 } from './sc-alert2.js';
import { d as defineCustomElement$5 } from './sc-button2.js';
import { d as defineCustomElement$4 } from './sc-dashboard-module2.js';
import { d as defineCustomElement$3 } from './sc-dialog2.js';
import { d as defineCustomElement$2 } from './sc-icon2.js';
import { d as defineCustomElement$1 } from './sc-spinner2.js';
import { a as addQueryArgs } from './add-query-args.js';

const scOrderConfirmProviderCss = ".confirm__icon{margin-bottom:var(--sc-spacing-medium);display:flex;justify-content:center}.confirm__icon-container{background:var(--sc-color-primary-500);width:55px;height:55px;border-radius:999999px;display:flex;align-items:center;justify-content:center;font-size:26px;line-height:1;color:white}sc-dialog::part(overlay){backdrop-filter:blur(4px)}";

const ScOrderConfirmProvider = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
  constructor() {
    super();
    this.__registerHost();
    this.__attachShadow();
    this.scOrderPaid = createEvent(this, "scOrderPaid", 7);
    this.scSetState = createEvent(this, "scSetState", 7);
    this.scError = createEvent(this, "scError", 7);
    /** Whether to show success modal */
    this.showSuccessModal = false;
  }
  /** Listen for paid event. This is triggered by Stripe or Paypal elements when payment succeeds. */
  handlePaidEvent() {
    this.confirmOrder();
  }
  /** Confirm the order. */
  async confirmOrder() {
    var _a, _b, _c;
    try {
      this.confirmedCheckout = (await apiFetch({
        method: 'PATCH',
        path: addQueryArgs(`surecart/v1/checkouts/${(_a = state === null || state === void 0 ? void 0 : state.checkout) === null || _a === void 0 ? void 0 : _a.id}/confirm`, [expand]),
      }));
      this.scSetState.emit('CONFIRMED');
      // emit the order paid event for tracking scripts.
      this.scOrderPaid.emit(this.confirmedCheckout);
    }
    catch (e) {
      console.error(e);
      this.scError.emit(e);
    }
    finally {
      // always clear the checkout.
      clearCheckout();
      // get success url.
      const successUrl = ((_c = (_b = this.confirmedCheckout) === null || _b === void 0 ? void 0 : _b.metadata) === null || _c === void 0 ? void 0 : _c.success_url) || this.successUrl;
      if (successUrl) {
        // set state to redirecting.
        this.scSetState.emit('REDIRECT');
        setTimeout(() => { var _a; return window.location.assign(addQueryArgs(successUrl, { order: (_a = this.confirmedCheckout) === null || _a === void 0 ? void 0 : _a.id })); }, 50);
      }
      else {
        this.showSuccessModal = true;
      }
    }
  }
  getSuccessUrl() {
    var _a, _b, _c, _d, _e;
    const url = ((_b = (_a = this.confirmedCheckout) === null || _a === void 0 ? void 0 : _a.metadata) === null || _b === void 0 ? void 0 : _b.success_url) || this.successUrl;
    return url ? addQueryArgs(url, { order: (_c = this.confirmedCheckout) === null || _c === void 0 ? void 0 : _c.id }) : (_e = (_d = window === null || window === void 0 ? void 0 : window.scData) === null || _d === void 0 ? void 0 : _d.pages) === null || _e === void 0 ? void 0 : _e.dashboard;
  }
  render() {
    var _a, _b, _c, _d;
    const manualPaymentMethod = (_a = this.confirmedCheckout) === null || _a === void 0 ? void 0 : _a.manual_payment_method;
    return (h(Host, null, h("slot", null), h("sc-dialog", { open: !!this.showSuccessModal, style: { '--body-spacing': 'var(--sc-spacing-xxx-large)' }, noHeader: true, onScRequestClose: e => e.preventDefault() }, h("div", { class: "confirm__icon" }, h("div", { class: "confirm__icon-container" }, h("sc-icon", { name: "check" }))), h("sc-dashboard-module", { heading: ((_b = this.successText) === null || _b === void 0 ? void 0 : _b.title) || __('Thanks for your order!', 'surecart'), style: { '--sc-dashboard-module-spacing': 'var(--sc-spacing-x-large)', 'textAlign': 'center' } }, h("span", { slot: "description" }, ((_c = this.successText) === null || _c === void 0 ? void 0 : _c.description) || __('Your payment was successful, and your order is complete. A receipt is on its way to your inbox.', 'surecart')), !!(manualPaymentMethod === null || manualPaymentMethod === void 0 ? void 0 : manualPaymentMethod.name) && !!(manualPaymentMethod === null || manualPaymentMethod === void 0 ? void 0 : manualPaymentMethod.instructions) && (h("sc-alert", { type: "info", open: true, style: { 'text-align': 'left' } }, h("span", { slot: "title" }, manualPaymentMethod === null || manualPaymentMethod === void 0 ? void 0 : manualPaymentMethod.name), manualPaymentMethod === null || manualPaymentMethod === void 0 ? void 0 :
      manualPaymentMethod.instructions.split('\n').map(i => {
        return h("p", null, i);
      }))), h("sc-button", { href: this.getSuccessUrl(), size: "large", type: "primary" }, ((_d = this.successText) === null || _d === void 0 ? void 0 : _d.button) || __('Continue', 'surecart'), h("sc-icon", { name: "arrow-right", slot: "suffix" }))))));
  }
  get el() { return this; }
  static get style() { return scOrderConfirmProviderCss; }
}, [1, "sc-order-confirm-provider", {
    "successUrl": [1, "success-url"],
    "successText": [16],
    "showSuccessModal": [32],
    "confirmedCheckout": [32]
  }, [[0, "scPaid", "handlePaidEvent"]]]);
function defineCustomElement() {
  if (typeof customElements === "undefined") {
    return;
  }
  const components = ["sc-order-confirm-provider", "sc-alert", "sc-button", "sc-dashboard-module", "sc-dialog", "sc-icon", "sc-spinner"];
  components.forEach(tagName => { switch (tagName) {
    case "sc-order-confirm-provider":
      if (!customElements.get(tagName)) {
        customElements.define(tagName, ScOrderConfirmProvider);
      }
      break;
    case "sc-alert":
      if (!customElements.get(tagName)) {
        defineCustomElement$6();
      }
      break;
    case "sc-button":
      if (!customElements.get(tagName)) {
        defineCustomElement$5();
      }
      break;
    case "sc-dashboard-module":
      if (!customElements.get(tagName)) {
        defineCustomElement$4();
      }
      break;
    case "sc-dialog":
      if (!customElements.get(tagName)) {
        defineCustomElement$3();
      }
      break;
    case "sc-icon":
      if (!customElements.get(tagName)) {
        defineCustomElement$2();
      }
      break;
    case "sc-spinner":
      if (!customElements.get(tagName)) {
        defineCustomElement$1();
      }
      break;
  } });
}
defineCustomElement();

export { ScOrderConfirmProvider as S, defineCustomElement as d };
