'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-a7b0c73d.js');
const DialogType = require('./DialogType-2114c337.js');
const core = require('@sankhyalabs/core');
const FocusResolver = require('./FocusResolver-885f2173.js');
const index$1 = require('./index-1be40f19.js');

const ezDialogCss = ":host{--dialog__container-padding:var(--space--md, 20px);--dialog__btn__close--background-color:var(--title--primary, #2b3a54);--dialog__btn__no--padding-right:var(--space--8, 8px);--dialog__btn__close__image:url('data:image/svg+xml;utf8,<svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" xmlns=\"http://www.w3.org/2000/svg%22%3E<path d=\"M 7.0060773,5.995511 11.461972,1.5397722 c 0.132856,-0.1328413 0.207547,-0.3130253 0.207547,-0.5009046 0,-0.18786999 -0.07469,-0.3680541 -0.207547,-0.5009048 -0.132857,-0.13284126 -0.31302,-0.20748126 -0.500927,-0.20748126 -0.187812,0 -0.36807,0.07464 -0.500926,0.20748126 L 6.0042244,4.9937015 1.5482921,0.5379628 C 1.4154357,0.40512154 1.2352533,0.33048154 1.0473657,0.33048154 c -0.18787813,0 -0.36807,0.07464 -0.50092647,0.20748126 -0.13285646,0.1328507 -0.20749026,0.31303481 -0.20749026,0.5009048 0,0.1878793 0.0746338,0.3680633 0.20749026,0.5009046 L 5.0023715,5.995511 0.54643923,10.452213 c -0.0676086,0.06534 -0.12151598,0.14352 -0.15859681,0.229916 -0.0370714,0.08639 -0.0565645,0.1794 -0.0573369,0.27335 -7.724e-4,0.09404 0.0171873,0.187331 0.0528423,0.274293 0.0356455,0.08705 0.0882688,0.166087 0.15479148,0.23256 0.0665321,0.06648 0.14562277,0.11897 0.2326735,0.154567 0.0870507,0.0356 0.18031463,0.05344 0.2743433,0.05259 0.094029,-8.5e-4 0.1869528,-0.02049 0.2733331,-0.0576 0.08639,-0.0372 0.1645078,-0.09121 0.2298029,-0.158817 L 6.0042244,6.9973204 10.460119,11.453078 c 0.132856,0.132851 0.313114,0.207444 0.500926,0.207444 0.187907,0 0.36807,-0.07459 0.500927,-0.207444 0.132856,-0.13285 0.207547,-0.313006 0.207547,-0.500904 0,-0.187898 -0.07469,-0.368054 -0.207547,-0.500905 z\"/></svg>');--dialog__btn__min-width:80px;--dialog__title--font-pattern:var(--font-pattern, \"Roboto\");--dialog__title--padding-left:var(--space--small, 6px);--dialog__title__container--padding-bottom:var(--space--medium, 12px);--dialog__title--weight--large:var(--text-weight--large, 600);--dialog__body--font-pattern:var(--font-pattern, \"Roboto\");--dialog__body--text-shadow:var(--text-shadow, \"0 0 0 #353535, 0 0 1px transparent\");--dialog__body--text-weight--medium:var(--text-weight--medium, 400);--dialog__body--padding-bottom:var(--space--medium, 12px);--dialog__body--font-size:var(--text--medium, 14px);--dialog__body--color:var(--text--primary, #626e82);--dialog__icon--color:var(--text--inverted, #fff);--dialog__critical--background-color:var(--color--alert-error-800, #BD0025);--dialog__warning--background-color:var(--color--alert-warning-500, #EFB103);--dialog__success--background-color:var(--color--alert-success-500, #00523c);--dialog-z-index:var(--elevation--100, 100);--dialog--warning__image:url('data: image/svg+xml;utf8,<svg width=\"15\" height=\"15\" viewBox=\"0 0 15 15\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M 7.5,0 0,13 h 15 z m 0,2.73684 5.1341,8.89476 H 2.36591 Z M 6.81818,5.47368 V 8.21053 H 8.18182 V 5.47368 Z m 0,4.10527 V 10.9474 H 8.18182 V 9.57895\"/></svg>');--dialog--critical__image:url('data: image/svg+xml;utf8,<svg width=\"13\" height=\"13\" viewBox=\"0 0 13 13\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M 7.6534493,6.4948538 12.762051,1.3864299 C 12.914368,1.2341297 13,1.027552 13,0.81215179 13,0.59676225 12.914369,0.39018443 12.762051,0.23787352 12.609733,0.08557341 12.40318,0 12.187747,0 11.972425,0 11.765762,0.08557341 11.613445,0.23787352 L 6.5048431,5.3462975 1.3961977,0.23787352 C 1.2438802,0.08557341 1.0373043,0 0.82189458,0 0.60649572,0 0.39990901,0.08557341 0.24759147,0.23787352 0.09527396,0.39018443 0.00970766,0.59676225 0.00970766,0.81215179 c 0,0.21540021 0.0855663,0.42197791 0.23788381,0.57427811 L 5.3562369,6.4948538 0.24759147,11.604381 c -0.0775121,0.07492 -0.13931586,0.164543 -0.18182835,0.263595 -0.04250169,0.09905 -0.064850182,0.205678 -0.0657357237,0.313391 -8.8554258e-4,0.107813 0.0197049337,0.214771 0.0605827337,0.314472 0.04086693,0.0998 0.10119858,0.190415 0.17746563,0.266625 0.0762779,0.07622 0.16695386,0.136398 0.26675594,0.177208 0.099802,0.04082 0.20672745,0.06127 0.31452961,0.06029 0.1078025,-9.53e-4 0.21433799,-0.0235 0.31337139,-0.06604 0.099045,-0.04265 0.1886052,-0.104571 0.263465,-0.182081 L 6.5048431,7.6434102 11.613445,12.751855 c 0.152317,0.152312 0.35898,0.237831 0.574302,0.237831 0.215433,0 0.421986,-0.08552 0.574304,-0.237831 C 12.914368,12.599545 13,12.393 13,12.177578 13,11.962157 12.91437,11.75561 12.762051,11.603299 Z\"/></svg>')}h2{margin-block-start:0;margin-block-end:0;margin-inline-start:0px;margin-inline-end:0px}.overlay{position:fixed;display:flex;top:0px;z-index:var(--dialog-z-index);left:0px;width:100%;box-sizing:border-box;height:100vh;background-color:rgba(var(--rgb-background--overlay), var(--opacity--soft));backdrop-filter:blur(var(--background-blur--medium))}.dialog{display:flex;width:80%;position:absolute;top:50%;left:50%;margin-right:-50%;box-sizing:border-box;transform:translate(-50%, -50%);box-shadow:0px 0px 16px rgba(0, 38, 111, 0.122)}@media screen and (min-width: 768px){.dialog{width:50%}}@media screen and (min-width: 992px){.dialog{width:33.33333%}}.dialog__container{width:100%;background:#FFFF;border-radius:0px 6px 6px 0px;box-sizing:border-box;padding:var(--dialog__container-padding)}.dialog__container--default{border-radius:6px 6px 6px 6px}.dialog__critical--indicator{box-sizing:border-box;width:12px;border-radius:6px 0px 0px 6px;background-color:var(--dialog__critical--background-color)}.dialog__warning--indicator{width:12px;border-radius:6px 0px 0px 6px;box-sizing:border-box;background-color:var(--dialog__warning--background-color)}.dialog__success--indicator{width:12px;border-radius:6px 0px 0px 6px;box-sizing:border-box;background-color:var(--dialog__success--background-color)}.message{font-size:var(--dialog__body--font-size);font-weight:var(--dialog__body--text-weight--medium);font-family:var(--dialog__body--font-pattern);text-shadow:var(--dialog__body--text-shadow);padding-bottom:var(--dialog__body--padding-bottom);color:var(--dialog__body--color);max-height:30vh;content-visibility:auto;margin-bottom:var(--space--medium);overflow-y:auto}.changeable__icon__container{background:var(--dialog__warning--background-color);display:flex;justify-content:center;align-items:center;min-width:26px;min-height:26px;border-radius:50%}.changeable__icon{--ez-icon--color:var(--dialog__icon--color)}.changeable__icon__container.title-icon--critical{background-color:var(--dialog__critical--background-color)}.changeable__icon__container.title-icon--success{background-color:var(--dialog__success--background-color)}.changeable__icon__container.title-icon--warn{background-color:var(--dialog__warning--background-color)}.changeable__icon__container.title-icon--warn ez-icon{transform:translateY(-1px)}.title{display:flex;font-family:var(--dialog__title--font-pattern);margin:0;font-weight:var(--dialog__title--weight--large);color:var(--title--primary)}.title__container{display:flex;padding-bottom:var(--dialog__title__container--padding-bottom)}.title__box{display:flex;width:100%;align-items:center;align-self:center}.title__label{padding-left:var(--dialog__title--padding-left)}.title__label--no-icon{padding-left:0}.btn-close{justify-content:flex-end;align-self:flex-start;align-items:flex-start;display:flex;outline:none;width:10%;border:none;background-color:unset;cursor:pointer}.btn-close::after{content:'';display:flex;background-color:var(--dialog__btn__close--background-color);width:12px;height:12px;-webkit-mask-image:var(--dialog__btn__close__image);mask-image:var(--dialog__btn__close__image)}.title-icon::after{content:'';display:flex;background-color:#FFFF;width:15px;height:15px;-webkit-mask-image:var(--dialog--warning__image);mask-image:var(--dialog--warning__image)}.button-yes-no__container{display:flex;box-sizing:border-box;align-self:center;align-items:center;justify-content:flex-end}.button__cancel{padding-right:var(--dialog__btn__no--padding-right);--ez-button--min-width:var(--dialog__btn__min-width)}.button__confirm{--ez-button--background-color:var(--color--primary);--ez-button--color:var(--color--inverted);--ez-button--hover--background-color:var(--color--primary-600);--ez-button--hover-color:var(--color--inverted);--ez-button--min-width:var(--dialog__btn__min-width)}.button__confirm--danger{--ez-button--background-color:var(--color--alert-error-800, #BD0025);--ez-button--color:var(--color--inverted);--ez-button--hover--background-color:var(--color-alert--error-900, #a10020);--ez-button--hover-color:var(--color--inverted);--ez-button--min-width:var(--dialog__btn__min-width)}.button__confirm--container{display:flex;justify-content:flex-end}.row{width:100%;display:flex;flex-wrap:wrap}.col{display:flex;flex-wrap:wrap;align-self:flex-start;box-sizing:border-box}.col--stretch{align-self:stretch}.col--undefined{width:unset}.col--nowrap{flex-wrap:nowrap}@media screen and (min-width: 320px){.col--sd-1{width:8.33333%}.col--sd-2{width:16.66667%}.col--sd-3{width:25%}.col--sd-4{width:33.33333%}.col--sd-5{width:41.66667%}.col--sd-6{width:50%}.col--sd-7{width:58.33333%}.col--sd-8{width:66.66667%}.col--sd-9{width:75%}.col--sd-10{width:83.33333%}.col--sd-11{width:91.66667%}.col--sd-12{width:100%}}@media screen and (min-width: 480px){.col--pn-1{width:8.33333%}.col--pn-2{width:16.66667%}.col--pn-3{width:25%}.col--pn-4{width:33.33333%}.col--pn-5{width:41.66667%}.col--pn-6{width:50%}.col--pn-7{width:58.33333%}.col--pn-8{width:66.66667%}.col--pn-9{width:75%}.col--pn-10{width:83.33333%}.col--pn-11{width:91.66667%}.col--pn-12{width:100%}}@media screen and (min-width: 768px){.col--tb-1{width:8.33333%}.col--tb-2{width:16.66667%}.col--tb-3{width:25%}.col--tb-4{width:33.33333%}.col--tb-5{width:41.66667%}.col--tb-6{width:50%}.col--tb-7{width:58.33333%}.col--tb-8{width:66.66667%}.col--tb-9{width:75%}.col--tb-10{width:83.33333%}.col--tb-11{width:91.66667%}.col--tb-12{width:100%}}@media screen and (min-width: 992px){.col--md-1{width:8.33333%}.col--md-2{width:16.66667%}.col--md-3{width:25%}.col--md-4{width:33.33333%}.col--md-5{width:41.66667%}.col--md-6{width:50%}.col--md-7{width:58.33333%}.col--md-8{width:66.66667%}.col--md-9{width:75%}.col--md-10{width:83.33333%}.col--md-11{width:91.66667%}.col--md-12{width:100%}}@media screen and (min-width: 1200px){.col--ld-1{width:8.33333%}.col--ld-2{width:16.66667%}.col--ld-3{width:25%}.col--ld-4{width:33.33333%}.col--ld-5{width:41.66667%}.col--ld-6{width:50%}.col--ld-7{width:58.33333%}.col--ld-8{width:66.66667%}.col--ld-9{width:75%}.col--ld-10{width:83.33333%}.col--ld-11{width:91.66667%}.col--ld-12{width:100%}}";

class Message {
  constructor(title, message, dialogType, confirm, icon, labelCancel, labelConfirm, btnConfirmDanger, callBack, beforeClose) {
    this.title = title;
    this.message = message;
    this.dialogType = dialogType;
    this.confirm = confirm;
    this.icon = icon;
    this.labelCancel = labelCancel;
    this.labelConfirm = labelConfirm;
    this.btnConfirmDanger = btnConfirmDanger;
    this.callBack = callBack;
    this.beforeClose = beforeClose;
  }
}
const EzDialog = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.ezCancel = index.createEvent(this, "ezCancel", 7);
    this.ezAccept = index.createEvent(this, "ezAccept", 7);
    this.PRIMARY_BUTTON_ID = "EZ_DIALOG_PRIMARY_BUTTON";
    this.btnConfirmDanger = false;
    this._messageQueue = [];
    this._canFocusOnPrimaryBtn = false;
    this.confirm = false;
    this.dialogType = undefined;
    this.message = undefined;
    this.opened = false;
    this.personalizedIconPath = undefined;
    this.ezTitle = undefined;
    this.beforeClose = undefined;
  }
  observeConfig(newValue, oldValue) {
    this.manageOverflow();
    //Eh preciso verificar se gouve de fato mudança do estado opened de FALSE para TRUE
    if (newValue && !oldValue) {
      this._canFocusOnPrimaryBtn = true;
    }
  }
  manageOverflow() {
    if (this.opened) {
      window.document.body.style.overflow = "hidden";
    }
    else {
      window.document.body.style.overflow = "";
    }
  }
  manageOverlay() {
    if (this.opened) {
      this._overlayId = core.FloatingManager.subscribeOverlayControl(this._overlayRef);
    }
    else {
      core.FloatingManager.unsubscribeOverlayControl(this._overlayRef || this._overlayId);
    }
  }
  handleButtonClick(selectedOption) {
    if (this._currentMessage.beforeClose && this._currentMessage.beforeClose(selectedOption) === false) {
      return;
    }
    this.opened = this._messageQueue.length > 0;
    if (this._currentMessage.callBack) {
      this._currentMessage.callBack(selectedOption);
    }
    selectedOption ? this.ezAccept.emit(selectedOption) : this.ezCancel.emit(selectedOption);
    this._currentMessage = this._messageQueue.shift();
    index.forceUpdate(this);
  }
  /**
   * Exibe o ez-dialog.
   */
  async show(title, message, dialogType, confirm, icon, labelCancel, labelConfirm, btnConfirmDanger, beforeClose) {
    this.opened = true;
    return new Promise(resolve => {
      this._messageQueue.push(new Message(title, message, dialogType, confirm, icon, labelCancel, labelConfirm, btnConfirmDanger, resolve, beforeClose));
    });
  }
  isCritical(dialogType) {
    return dialogType === DialogType.DialogType.CRITICAL;
  }
  getIconElement(message) {
    if (message.dialogType === DialogType.DialogType.DEFAULT) {
      return;
    }
    const iconClass = this.getIconClass(message.dialogType);
    return (index.h("div", { class: `changeable__icon__container ${iconClass}` }, index.h("ez-icon", { class: "changeable__icon", size: "small", iconName: this.getIconName(message) })));
  }
  getIconClass(dialogType) {
    if (this.isCritical(dialogType)) {
      return "title-icon--critical";
    }
    else if (dialogType === DialogType.DialogType.SUCCESS) {
      return "title-icon--success";
    }
    else if (dialogType === DialogType.DialogType.WARN) {
      return "title-icon--warn";
    }
    return "";
  }
  getIconName(message) {
    if (message.icon) {
      return message.icon;
    }
    else if (this.isCritical(message.dialogType)) {
      return "alert-circle-inverted";
    }
    else if (message.dialogType === DialogType.DialogType.WARN) {
      return "warning-outline";
    }
    else if (message.dialogType === DialogType.DialogType.SUCCESS) {
      return "check";
    }
  }
  getTypeIndicatorElement(message) {
    if (message.dialogType === DialogType.DialogType.DEFAULT) {
      return;
    }
    return index.h("div", { class: this.getClassIconIndicator(message.dialogType) });
  }
  getClassIconIndicator(dialogType) {
    if (this.isCritical(dialogType)) {
      return "dialog__critical--indicator";
    }
    else if (dialogType == DialogType.DialogType.SUCCESS) {
      return "dialog__success--indicator";
    }
    else if (dialogType == DialogType.DialogType.WARN) {
      return "dialog__warning--indicator";
    }
    return "";
  }
  getClassContainer(message) {
    const type = message.dialogType || DialogType.DialogType.DEFAULT;
    return type === DialogType.DialogType.DEFAULT ? "dialog__container dialog__container--default" : "dialog__container";
  }
  getClassTitleLabel(message) {
    return this.getIconElement(message) == undefined ? "title title__label title__label--no-icon" : "title title__label";
  }
  async componentWillLoad() {
    this.i18n = await index$1.initI18n();
  }
  componentWillRender() {
    if (!this._currentMessage) {
      if (this._messageQueue.length > 0) {
        this._currentMessage = this._messageQueue.pop();
      }
      else {
        if (this.opened) {
          this._currentMessage = new Message(this.ezTitle, this.message, this.dialogType, this.confirm, this.personalizedIconPath, this.i18n("app.no"), this.i18n("app.yes"), this.btnConfirmDanger, null, this.beforeClose);
        }
      }
    }
  }
  componentDidLoad() {
    core.ElementIDUtils.addIDInfo(this._element);
    this._keyboardManager = new core.KeyboardManager({ propagate: false, element: this._element })
      .bind("Enter", () => this.handleButtonClick(true), { description: this.i18n("ez-dialog.confirmButton"), element: this._element })
      .bind("Escape", () => this.handleButtonClick(false), { description: this.i18n("ez-dialog.closeButton"), element: this._element })
      .bind("Esc", () => this.handleButtonClick(false), { description: this.i18n("ez-dialog.closeButton"), element: this._element });
  }
  componentDidRender() {
    this.manageOverlay();
    this.focusOnDialog();
    this.handleFocusOnPrimaryButton();
  }
  focusOnDialog() {
    const dialog = this._element.shadowRoot.querySelector('.overlay .dialog');
    if (dialog instanceof HTMLDivElement) {
      dialog.style.outline = 'none';
      this._lastActiveElement = document.activeElement;
      dialog.focus();
    }
  }
  handleFocusOnPrimaryButton() {
    if (this._canFocusOnPrimaryBtn) {
      this.focusOnPrimaryButton();
      this._canFocusOnPrimaryBtn = false;
    }
  }
  focusOnPrimaryButton() {
    const btnConfirm = this._element.shadowRoot.querySelector(`#${this.PRIMARY_BUTTON_ID}`);
    const buttonElement = btnConfirm === null || btnConfirm === void 0 ? void 0 : btnConfirm.shadowRoot.querySelector('button');
    requestAnimationFrame(() => {
      buttonElement === null || buttonElement === void 0 ? void 0 : buttonElement.focus();
    });
  }
  disconnectedCallback() {
    var _a;
    FocusResolver.FocusResolver.resolveFocus(this._lastActiveElement);
    this._lastActiveElement = undefined;
    (_a = this._keyboardManager) === null || _a === void 0 ? void 0 : _a.unbindAllShortcutKeys();
  }
  render() {
    if (this.opened && this._currentMessage) {
      return (index.h("div", { class: "overlay", ref: ref => this._overlayRef = ref }, index.h("div", { tabindex: "-1", class: "dialog" }, this.getTypeIndicatorElement(this._currentMessage), index.h("div", { class: this.getClassContainer(this._currentMessage) }, index.h("div", { class: "title__container" }, index.h("div", { class: "title__box" }, this.getIconElement(this._currentMessage), index.h("div", { class: this.getClassTitleLabel(this._currentMessage), innerHTML: this._currentMessage.title, "data-element-id": core.ElementIDUtils.getInternalIDInfo("title") })), index.h("button", { class: "btn-close", onClick: () => this.handleButtonClick(false), "data-element-id": core.ElementIDUtils.getInternalIDInfo("buttonClose") })), index.h("div", { class: "message", innerHTML: this._currentMessage.message, "data-element-id": core.ElementIDUtils.getInternalIDInfo("message") }), this._currentMessage.confirm &&
        index.h("div", { class: "button-yes-no__container" }, index.h("ez-button", { class: "button__cancel", "data-element-id": core.ElementIDUtils.getInternalIDInfo("cancel"), label: this._currentMessage.labelCancel, onClick: () => this.handleButtonClick(false) }), index.h("ez-button", { id: this.PRIMARY_BUTTON_ID, class: !this._currentMessage.btnConfirmDanger ? "button__confirm" : "button__confirm--danger", "data-element-id": core.ElementIDUtils.getInternalIDInfo("confirm"), label: this._currentMessage.labelConfirm, onClick: () => this.handleButtonClick(true) })), !this._currentMessage.confirm &&
        index.h("div", { class: "button__confirm--container" }, index.h("ez-button", { id: this.PRIMARY_BUTTON_ID, label: 'Ok', "data-element-id": core.ElementIDUtils.getInternalIDInfo("ok"), class: "button__confirm", onClick: () => this.handleButtonClick(true) }))))));
    }
    return null;
  }
  get _element() { return index.getElement(this); }
  static get watchers() { return {
    "opened": ["observeConfig"]
  }; }
};
EzDialog.style = ezDialogCss;

exports.ez_dialog = EzDialog;
