import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
import { g as getQueryArg, a as apiFetch } from './fetch.js';
import { _ as __ } from './default-i18n.js';
import './index2.js';
import { U as Universe } from './universe.js';
import { d as defineCustomElement$4 } from './sc-alert2.js';
import { d as defineCustomElement$3 } from './sc-heading2.js';
import { d as defineCustomElement$2 } from './sc-icon2.js';
import { a as addQueryArgs } from './add-query-args.js';

const scOrderConfirmationCss = ":host{display:block;max-width:800px;margin:auto}.order-confirmation__content{display:grid;gap:var(--sc-form-row-spacing-large)}.order-confirmation__content.hidden{display:none}::part(line-items){display:grid;gap:0.5em}";

const ScOrderConfirmation$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
  constructor() {
    super();
    this.__registerHost();
    this.__attachShadow();
    /** Loading */
    this.loading = false;
  }
  componentWillLoad() {
    // @ts-ignore
    Universe.create(this, this.state());
    // get teh session
    this.getSession();
  }
  /** Get session id from url. */
  getSessionId() {
    var _a;
    if ((_a = this.order) === null || _a === void 0 ? void 0 : _a.id)
      return this.order.id;
    return getQueryArg(window.location.href, 'order');
  }
  /** Update a session */
  async getSession() {
    var _a;
    if (!this.getSessionId())
      return;
    if ((_a = this.order) === null || _a === void 0 ? void 0 : _a.id)
      return;
    try {
      this.loading = true;
      this.order = (await await apiFetch({
        path: addQueryArgs(`surecart/v1/checkouts/${this.getSessionId()}`, {
          expand: [
            'line_items',
            'line_item.price',
            'price.product',
            'customer',
            'customer.shipping_address',
            'payment_intent',
            'discount',
            'discount.promotion',
            'billing_address',
            'shipping_address',
          ],
          refresh_status: true,
        }),
      }));
    }
    catch (e) {
      if (e === null || e === void 0 ? void 0 : e.message) {
        this.error = e.message;
      }
      else {
        this.error = __('Something went wrong', 'surecart');
      }
    }
    finally {
      this.loading = false;
    }
  }
  state() {
    var _a;
    return {
      processor: 'stripe',
      loading: this.loading,
      orderId: this.getSessionId(),
      order: this.order,
      customer: (_a = this.order) === null || _a === void 0 ? void 0 : _a.customer,
    };
  }
  renderOnHold() {
    var _a, _b, _c;
    if (((_a = this.order) === null || _a === void 0 ? void 0 : _a.status) !== 'requires_approval')
      return null;
    if (((_c = (_b = this === null || this === void 0 ? void 0 : this.order) === null || _b === void 0 ? void 0 : _b.payment_intent) === null || _c === void 0 ? void 0 : _c.processor_type) === 'paypal') {
      return (h("sc-alert", { type: "warning", open: true }, __('Paypal is taking a closer look at this payment. It’s required for some payments and normally takes up to 3 business days.', 'surecart')));
    }
    return 'asdf';
  }
  render() {
    var _a, _b;
    return (h(Universe.Provider, { state: this.state() }, h("div", { class: { 'order-confirmation': true } }, h("div", { class: {
        'order-confirmation__content': true,
        'hidden': !((_a = this.order) === null || _a === void 0 ? void 0 : _a.id) && !this.loading,
      } }, this.renderOnHold(), h("slot", null)), !((_b = this.order) === null || _b === void 0 ? void 0 : _b.id) && !this.loading && (h("sc-heading", null, __('Order not found.', 'surecart'), h("span", { slot: "description" }, __('This order could not be found. Please try again.', 'surecart')))))));
  }
  static get style() { return scOrderConfirmationCss; }
}, [1, "sc-order-confirmation", {
    "order": [1040],
    "loading": [32],
    "error": [32]
  }]);
function defineCustomElement$1() {
  if (typeof customElements === "undefined") {
    return;
  }
  const components = ["sc-order-confirmation", "sc-alert", "sc-heading", "sc-icon"];
  components.forEach(tagName => { switch (tagName) {
    case "sc-order-confirmation":
      if (!customElements.get(tagName)) {
        customElements.define(tagName, ScOrderConfirmation$1);
      }
      break;
    case "sc-alert":
      if (!customElements.get(tagName)) {
        defineCustomElement$4();
      }
      break;
    case "sc-heading":
      if (!customElements.get(tagName)) {
        defineCustomElement$3();
      }
      break;
    case "sc-icon":
      if (!customElements.get(tagName)) {
        defineCustomElement$2();
      }
      break;
  } });
}
defineCustomElement$1();

const ScOrderConfirmation = ScOrderConfirmation$1;
const defineCustomElement = defineCustomElement$1;

export { ScOrderConfirmation, defineCustomElement };
