import { Component, Event, h, Prop, State } from '@stencil/core';
import apiFetch from '../../../../functions/fetch';
export class ScCancelDialog {
  constructor() {
    this.step = 'cancel';
  }
  close() {
    this.reset();
    this.trackAttempt();
    this.scRequestClose.emit('close-button');
  }
  reset() {
    var _a;
    this.reason = null;
    this.step = ((_a = this.protocol) === null || _a === void 0 ? void 0 : _a.preservation_enabled) ? 'survey' : 'cancel';
  }
  async trackAttempt() {
    var _a, _b;
    if (!((_a = this.protocol) === null || _a === void 0 ? void 0 : _a.preservation_enabled))
      return;
    await apiFetch({
      method: 'PATCH',
      path: `surecart/v1/subscriptions/${(_b = this.subscription) === null || _b === void 0 ? void 0 : _b.id}/preserve`,
    });
  }
  componentWillLoad() {
    this.reset();
  }
  render() {
    return (h("sc-dialog", { style: {
        '--width': this.step === 'survey' ? '675px' : '500px',
        '--body-spacing': 'var(--sc-spacing-xxx-large)',
      }, noHeader: true, open: this.open, onScRequestClose: () => this.close() },
      h("div", { class: {
          cancel: true,
        } },
        h("sc-button", { class: "close__button", type: "text", circle: true, onClick: () => this.close() },
          h("sc-icon", { name: "x" })),
        this.step === 'cancel' && (h("sc-subscription-cancel", { subscription: this.subscription, protocol: this.protocol, reason: this.reason, comment: this.comment, onScAbandon: () => this.close(), onScCancelled: () => {
            this.scRefresh.emit();
            this.reset();
            this.scRequestClose.emit('close-button');
          } })),
        this.step === 'survey' && (h("sc-cancel-survey", { protocol: this.protocol, onScAbandon: () => this.close(), onScSubmitReason: e => {
            const { comment, reason } = e.detail;
            this.reason = reason;
            this.comment = comment;
            this.step = (reason === null || reason === void 0 ? void 0 : reason.coupon_enabled) ? 'discount' : 'cancel';
          } })),
        this.step === 'discount' && (h("sc-cancel-discount", { protocol: this.protocol, subscription: this.subscription, reason: this.reason, comment: this.comment, onScCancel: () => (this.step = 'cancel'), onScPreserved: () => {
            this.scRefresh.emit();
            this.reset();
            this.scRequestClose.emit('close-button');
          } })))));
  }
  static get is() { return "sc-cancel-dialog"; }
  static get encapsulation() { return "shadow"; }
  static get originalStyleUrls() { return {
    "$": ["sc-cancel-dialog.scss"]
  }; }
  static get styleUrls() { return {
    "$": ["sc-cancel-dialog.css"]
  }; }
  static get properties() { return {
    "open": {
      "type": "boolean",
      "mutable": false,
      "complexType": {
        "original": "boolean",
        "resolved": "boolean",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "open",
      "reflect": false
    },
    "protocol": {
      "type": "unknown",
      "mutable": false,
      "complexType": {
        "original": "SubscriptionProtocol",
        "resolved": "SubscriptionProtocol",
        "references": {
          "SubscriptionProtocol": {
            "location": "import",
            "path": "../../../../types"
          }
        }
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      }
    },
    "subscription": {
      "type": "unknown",
      "mutable": false,
      "complexType": {
        "original": "Subscription",
        "resolved": "Subscription",
        "references": {
          "Subscription": {
            "location": "import",
            "path": "../../../../types"
          }
        }
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      }
    }
  }; }
  static get states() { return {
    "reasons": {},
    "reason": {},
    "step": {},
    "comment": {}
  }; }
  static get events() { return [{
      "method": "scRequestClose",
      "name": "scRequestClose",
      "bubbles": true,
      "cancelable": true,
      "composed": true,
      "docs": {
        "tags": [],
        "text": ""
      },
      "complexType": {
        "original": "'close-button' | 'keyboard' | 'overlay'",
        "resolved": "\"close-button\" | \"keyboard\" | \"overlay\"",
        "references": {}
      }
    }, {
      "method": "scRefresh",
      "name": "scRefresh",
      "bubbles": true,
      "cancelable": true,
      "composed": true,
      "docs": {
        "tags": [],
        "text": ""
      },
      "complexType": {
        "original": "void",
        "resolved": "void",
        "references": {}
      }
    }]; }
}
