import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
import { d as defineCustomElement$3 } from './sc-alert2.js';
import { d as defineCustomElement$2 } from './sc-checkout-form-errors2.js';
import { d as defineCustomElement$1 } from './sc-icon2.js';

const ScFormErrorProvider = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
  constructor() {
    super();
    this.__registerHost();
    this.__attachShadow();
    this.scUpdateError = createEvent(this, "scUpdateError", 7);
    this.scSetState = createEvent(this, "scSetState", 7);
  }
  /** Trigger the error event when an error happens  */
  handleErrorUpdate(val) {
    this.scUpdateError.emit(val);
  }
  handleStateChange(val) {
    if (['finalizing', 'updating'].includes(val)) {
      this.error = null;
    }
  }
  /** Listen for error events in component. */
  handleErrorEvent(e) {
    this.error = e.detail;
    if (Object.keys((e === null || e === void 0 ? void 0 : e.detail) || {}).length) {
      this.scSetState.emit('REJECT'); // make sure we are rejecting the current state.
    }
  }
  /** Listen for pay errors. */
  handlePayError(e) {
    var _a;
    this.error = ((_a = e.detail) === null || _a === void 0 ? void 0 : _a.message) || {
      code: '',
      message: 'Something went wrong with your payment.',
    };
  }
  componentWillLoad() {
    this.maybeAddErrorsComponent();
  }
  maybeAddErrorsComponent() {
    if (!!this.el.querySelector('sc-checkout-form-errors'))
      return;
    const errorsComponent = document.createElement('sc-checkout-form-errors');
    console.log(this.el.querySelector('sc-form'));
    this.el.querySelector('sc-form').prepend(errorsComponent);
  }
  render() {
    return h("slot", null);
  }
  get el() { return this; }
  static get watchers() { return {
    "error": ["handleErrorUpdate"],
    "checkoutState": ["handleStateChange"]
  }; }
}, [1, "sc-form-error-provider", {
    "checkoutState": [1, "checkout-state"],
    "error": [32]
  }, [[0, "scError", "handleErrorEvent"], [0, "scPayError", "handlePayError"]]]);
function defineCustomElement() {
  if (typeof customElements === "undefined") {
    return;
  }
  const components = ["sc-form-error-provider", "sc-alert", "sc-checkout-form-errors", "sc-icon"];
  components.forEach(tagName => { switch (tagName) {
    case "sc-form-error-provider":
      if (!customElements.get(tagName)) {
        customElements.define(tagName, ScFormErrorProvider);
      }
      break;
    case "sc-alert":
      if (!customElements.get(tagName)) {
        defineCustomElement$3();
      }
      break;
    case "sc-checkout-form-errors":
      if (!customElements.get(tagName)) {
        defineCustomElement$2();
      }
      break;
    case "sc-icon":
      if (!customElements.get(tagName)) {
        defineCustomElement$1();
      }
      break;
  } });
}
defineCustomElement();

export { ScFormErrorProvider as S, defineCustomElement as d };
