import { h, Host, forceUpdate } from '@stencil/core';
import { ElementIDUtils } from "@sankhyalabs/core";
export class EzToast {
  constructor() {
    this._nextMessages = [];
    this._currentMessageInfo = { message: "", fadeTime: undefined, useIcon: undefined };
    this._toastOpenedClass = "toast__container--opened";
    this._lastTimeOut = undefined;
    this._lang = "pt"; // Controla qual idioma será usado para definir a regras de hifenização.
    this.message = undefined;
    this.fadeTime = 5000;
    this.useIcon = false;
    this.canClose = true;
  }
  /**
   * Exibe o ez-toast.
   */
  async show(message, fadeTime, useIcon, canClose) {
    const isClosable = (canClose !== undefined) ? canClose : this.canClose;
    return new Promise(resolve => {
      var _a;
      if ((_a = this.container) === null || _a === void 0 ? void 0 : _a.classList.contains(this._toastOpenedClass)) {
        if (this.isRepeatedMessage(message)) {
          return;
        }
        this._nextMessages.push({ message, fadeTime, useIcon, canClose: isClosable, callBack: resolve });
      }
      else {
        this._currentMessageInfo.message = message || this.message;
        this._currentMessageInfo.fadeTime = fadeTime || this.fadeTime;
        this._currentMessageInfo.useIcon = useIcon || this.useIcon;
        this._currentMessageInfo.callBack = resolve;
        if (isClosable) {
          this._currentMessageInfo.canClose = isClosable;
        }
        forceUpdate(this);
        this.displayToast();
        this._lastTimeOut = setTimeout(() => {
          this.hideToast();
        }, this._currentMessageInfo.fadeTime + 400);
      }
    });
  }
  hideToast() {
    this.makeToastInvisible();
    if (this._nextMessages.length > 0) {
      if (this._currentMessageInfo.callBack) {
        this._currentMessageInfo.callBack(true);
      }
      setTimeout(() => {
        let newMessageInfo = this._nextMessages.shift();
        this.show(newMessageInfo.message, newMessageInfo.fadeTime, newMessageInfo.useIcon);
      });
    }
    if (this._currentMessageInfo.callBack) {
      this._currentMessageInfo.callBack(true);
    }
  }
  isRepeatedMessage(message) {
    var _a, _b;
    return ((_a = this._nextMessages) === null || _a === void 0 ? void 0 : _a.some((info) => info.message === message))
      || ((_b = this._currentMessageInfo) === null || _b === void 0 ? void 0 : _b.message) === message;
  }
  makeToastInvisible() {
    this.container.classList.remove(this._toastOpenedClass);
    this.container.style.animation = `none`;
    if (this._lastTimeOut)
      clearTimeout(this._lastTimeOut);
  }
  displayToast() {
    this.container.classList.add(this._toastOpenedClass);
    this.container.style.animation = `fadein 0.5s, fadeout 0.5s ${this.fadeTime / 1000}s`;
  }
  buildDataElementId() {
    var _a, _b;
    const dataElementId = ElementIDUtils.addIDInfo(this._element);
    const attribute = ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME;
    (_a = this._elemBtnClose) === null || _a === void 0 ? void 0 : _a.setAttribute(attribute, `${dataElementId}_buttonClose`);
    (_b = this._elemText) === null || _b === void 0 ? void 0 : _b.setAttribute(attribute, `${dataElementId}_title`);
  }
  componentDidLoad() {
    this.buildDataElementId();
  }
  render() {
    return (h(Host, null, h("div", { ref: (el) => this.container = el, class: "toast__container" }, this._currentMessageInfo.useIcon &&
      h("slot", { name: "icon" }), h("div", { lang: this._lang, ref: (el) => this._elemText = el, class: this._currentMessageInfo.useIcon ? "message__container message__container--icon" : "message__container", title: this._currentMessageInfo.message, innerHTML: this._currentMessageInfo.message }), this._currentMessageInfo.canClose &&
      h("button", { class: "btn-close", onClick: () => { this.hideToast(); }, ref: (el) => this._elemBtnClose = el }))));
  }
  static get is() { return "ez-toast"; }
  static get encapsulation() { return "shadow"; }
  static get originalStyleUrls() {
    return {
      "$": ["ez-toast.css"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["ez-toast.css"]
    };
  }
  static get properties() {
    return {
      "message": {
        "type": "string",
        "mutable": true,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Mensagem a ser exibida no componente."
        },
        "attribute": "message",
        "reflect": false
      },
      "fadeTime": {
        "type": "number",
        "mutable": true,
        "complexType": {
          "original": "number",
          "resolved": "number",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Define o tempo de exibi\u00E7\u00E3o em milissegundos."
        },
        "attribute": "fade-time",
        "reflect": false,
        "defaultValue": "5000"
      },
      "useIcon": {
        "type": "boolean",
        "mutable": true,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Se true permite a utiliza\u00E7\u00E3o do slot de \u00EDcone."
        },
        "attribute": "use-icon",
        "reflect": false,
        "defaultValue": "false"
      },
      "canClose": {
        "type": "boolean",
        "mutable": true,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Se false, o usu\u00E1rio n\u00E3o consegue fechar."
        },
        "attribute": "can-close",
        "reflect": false,
        "defaultValue": "true"
      }
    };
  }
  static get methods() {
    return {
      "show": {
        "complexType": {
          "signature": "(message: string, fadeTime: number, useIcon: boolean, canClose?: boolean) => Promise<void>",
          "parameters": [{
              "tags": [],
              "text": ""
            }, {
              "tags": [],
              "text": ""
            }, {
              "tags": [],
              "text": ""
            }, {
              "tags": [],
              "text": ""
            }],
          "references": {
            "Promise": {
              "location": "global"
            }
          },
          "return": "Promise<void>"
        },
        "docs": {
          "text": "Exibe o ez-toast.",
          "tags": []
        }
      }
    };
  }
  static get elementRef() { return "_element"; }
}
