import { Component, Event, h, Listen, Prop, State, Watch, Element } from '@stencil/core';
/**
 * This component listens for a confirmed event and redirects to the success url.
 */
export class ScFormErrorProvider {
  /** 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);
  }
  static get is() { return "sc-form-error-provider"; }
  static get encapsulation() { return "shadow"; }
  static get properties() { return {
    "checkoutState": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "FormState",
        "resolved": "\"confirmed\" | \"confirming\" | \"draft\" | \"expired\" | \"failure\" | \"finalizing\" | \"idle\" | \"loading\" | \"paid\" | \"paying\" | \"redirecting\" | \"updating\"",
        "references": {
          "FormState": {
            "location": "import",
            "path": "../../../types"
          }
        }
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": "The current order."
      },
      "attribute": "checkout-state",
      "reflect": false
    }
  }; }
  static get states() { return {
    "error": {}
  }; }
  static get events() { return [{
      "method": "scUpdateError",
      "name": "scUpdateError",
      "bubbles": true,
      "cancelable": true,
      "composed": true,
      "docs": {
        "tags": [],
        "text": "Set the state."
      },
      "complexType": {
        "original": "ResponseError",
        "resolved": "ResponseError",
        "references": {
          "ResponseError": {
            "location": "import",
            "path": "../../../types"
          }
        }
      }
    }, {
      "method": "scSetState",
      "name": "scSetState",
      "bubbles": true,
      "cancelable": true,
      "composed": true,
      "docs": {
        "tags": [],
        "text": "Form state event."
      },
      "complexType": {
        "original": "FormStateSetter",
        "resolved": "\"EXPIRE\" | \"FETCH\" | \"FINALIZE\" | \"PAID\" | \"PAYING\" | \"REJECT\" | \"RESOLVE\"",
        "references": {
          "FormStateSetter": {
            "location": "import",
            "path": "../../../types"
          }
        }
      }
    }]; }
  static get elementRef() { return "el"; }
  static get watchers() { return [{
      "propName": "error",
      "methodName": "handleErrorUpdate"
    }, {
      "propName": "checkoutState",
      "methodName": "handleStateChange"
    }]; }
  static get listeners() { return [{
      "name": "scError",
      "method": "handleErrorEvent",
      "target": undefined,
      "capture": false,
      "passive": false
    }, {
      "name": "scPayError",
      "method": "handlePayError",
      "target": undefined,
      "capture": false,
      "passive": false
    }]; }
}
