import { ElementIDUtils } from "@sankhyalabs/core";
import { Host, h } from "@stencil/core";
export class EzPopoverPlus {
  constructor() {
    this.autoClose = true;
    this.boxWidth = "fit-content";
    this.opened = false;
    this.overlayType = "light";
    this.anchorElement = undefined;
    this.options = { horizontalGap: 0, verticalGap: 0, fromRight: false };
    this.useAnchorSize = false;
    this.minWidth = 150;
  }
  async observeOpened(newValue) {
    if (newValue && !this._popOverCore) {
      this.renderPopoverCore();
    }
    this._popOverCore.opened = newValue;
  }
  /**
   * Atualiza a posição do popover.
   */
  async updatePosition(top, left) {
    var _a;
    await ((_a = this._popOverCore) === null || _a === void 0 ? void 0 : _a.updatePosition(top, left));
  }
  /**
   * Exibe o ez-popover.
   */
  async show(top, left) {
    if (!this._popOverCore) {
      this.renderPopoverCore();
    }
    await this._popOverCore.show(top, left);
  }
  /**
   * Ancora a exibição do popOver a um elemento HTML.
   */
  async showUnder(element, options) {
    if (!this._popOverCore) {
      this.renderPopoverCore();
    }
    await this._popOverCore.showUnder(element, options);
  }
  /**
   * Oculta o ez-popover.
   */
  async hide() {
    var _a;
    await ((_a = this._popOverCore) === null || _a === void 0 ? void 0 : _a.hide());
  }
  /**
   * Altera as opções.
  */
  async setOptions(options) {
    var _a;
    await ((_a = this._popOverCore) === null || _a === void 0 ? void 0 : _a.setOptions(options));
  }
  /**
   * Altera o elemento de ancoragem.
  */
  async setAnchorElement(anchor) {
    var _a;
    await ((_a = this._popOverCore) === null || _a === void 0 ? void 0 : _a.setAnchorElement(anchor));
    this.anchorElement = anchor;
  }
  getFirstElement(collection) {
    if (Array.isArray(collection) && collection.length) {
      return collection[0];
    }
    if (!Array.isArray(collection) && collection.item) {
      return collection.item(0);
    }
    return null;
  }
  buildElementId(keys) {
    const filteredKeys = keys.filter((key) => !!key);
    return ElementIDUtils.getInternalIDInfo(filteredKeys.join("_"));
  }
  renderPopoverCore() {
    var _a;
    this._popOverCore = document.createElement('ez-popover-core');
    this._popOverCore.opened = this.opened;
    this._popOverCore.anchorElement = this.anchorElement;
    this._popOverCore.autoClose = this.autoClose;
    this._popOverCore.boxWidth = this.boxWidth;
    this._popOverCore.overlayType = this.overlayType;
    this._popOverCore.options = this.options;
    this._popOverCore.useAnchorSize = this.useAnchorSize;
    this._popOverCore.minWidth = this.minWidth;
    this._popOverCore.setAttribute("data-element-id", this.buildElementId(["ez-popover-core", this._host.getAttribute("data-element-id")]));
    this._popOverCore.addEventListener('ezVisibilityChange', ({ detail }) => {
      this.ezVisibilityChange.emit(detail);
      this.opened = detail;
    });
    const firstChild = this.getFirstElement(this._host.children);
    if (firstChild) {
      this._popOverCore.appendChild(firstChild);
    }
    else {
      console.warn('O slot do popover está vazio. Adicione conteúdo ao slot para exibição correta.');
    }
    const root = document.body.querySelector("#root");
    const firstDiv = this.getFirstElement(document.body.getElementsByTagName("div"));
    const parentElement = (_a = root !== null && root !== void 0 ? root : firstDiv) !== null && _a !== void 0 ? _a : document.body;
    parentElement.appendChild(this._popOverCore);
  }
  render() {
    return (h(Host, null, h("slot", null)));
  }
  static get is() { return "ez-popover-plus"; }
  static get encapsulation() { return "shadow"; }
  static get originalStyleUrls() {
    return {
      "$": ["ez-popover-plus.css"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["ez-popover-plus.css"]
    };
  }
  static get properties() {
    return {
      "autoClose": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Define que ser\u00E1 fechado automaticamente quando o usu\u00E1rio clicar fora do conte\u00FAdo."
        },
        "attribute": "auto-close",
        "reflect": true,
        "defaultValue": "true"
      },
      "boxWidth": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "\"full-width\" | \"fit-content\"",
          "resolved": "\"fit-content\" | \"full-width\"",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Ajusta o comportamento da largura do popover."
        },
        "attribute": "box-width",
        "reflect": true,
        "defaultValue": "\"fit-content\""
      },
      "opened": {
        "type": "boolean",
        "mutable": true,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Define se o ez-popover est\u00E1 aberto."
        },
        "attribute": "opened",
        "reflect": true,
        "defaultValue": "false"
      },
      "overlayType": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "\"medium\" | \"light\" | \"none\"",
          "resolved": "\"light\" | \"medium\" | \"none\"",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Define o tipo de overlay do popover."
        },
        "attribute": "overlay-type",
        "reflect": true,
        "defaultValue": "\"light\""
      },
      "anchorElement": {
        "type": "string",
        "mutable": true,
        "complexType": {
          "original": "Array<HTMLElement | string> | HTMLElement | string",
          "resolved": "(string | HTMLElement)[] | HTMLElement | string",
          "references": {
            "Array": {
              "location": "global"
            },
            "HTMLElement": {
              "location": "global"
            }
          }
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Define o elemento de ancoragem."
        },
        "attribute": "anchor-element",
        "reflect": true
      },
      "options": {
        "type": "unknown",
        "mutable": true,
        "complexType": {
          "original": "IEzPopoverAnchorOptions",
          "resolved": "IEzPopoverAnchorOptions",
          "references": {
            "IEzPopoverAnchorOptions": {
              "location": "local"
            }
          }
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Define as op\u00E7\u00F5es do elemento."
        },
        "defaultValue": "{ horizontalGap: 0, verticalGap: 0, fromRight: false }"
      },
      "useAnchorSize": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Define se o elemento manter\u00E1 o mesmo tamanho do componente de ancora."
        },
        "attribute": "use-anchor-size",
        "reflect": true,
        "defaultValue": "false"
      },
      "minWidth": {
        "type": "number",
        "mutable": false,
        "complexType": {
          "original": "number",
          "resolved": "number",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Define a largura m\u00EDnima do elemento (apenas ser\u00E1 considerada caso a propriedade useAnchorSize seja verdadeira)."
        },
        "attribute": "min-width",
        "reflect": true,
        "defaultValue": "150"
      }
    };
  }
  static get events() {
    return [{
        "method": "ezVisibilityChange",
        "name": "ezVisibilityChange",
        "bubbles": true,
        "cancelable": true,
        "composed": true,
        "docs": {
          "tags": [],
          "text": "Emitido quando acontece a altera\u00E7\u00E3o de estado do componente."
        },
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        }
      }];
  }
  static get methods() {
    return {
      "updatePosition": {
        "complexType": {
          "signature": "(top?: string, left?: string) => Promise<void>",
          "parameters": [{
              "tags": [],
              "text": ""
            }, {
              "tags": [],
              "text": ""
            }],
          "references": {
            "Promise": {
              "location": "global"
            }
          },
          "return": "Promise<void>"
        },
        "docs": {
          "text": "Atualiza a posi\u00E7\u00E3o do popover.",
          "tags": []
        }
      },
      "show": {
        "complexType": {
          "signature": "(top?: string | number, left?: string | number) => Promise<void>",
          "parameters": [{
              "tags": [],
              "text": ""
            }, {
              "tags": [],
              "text": ""
            }],
          "references": {
            "Promise": {
              "location": "global"
            }
          },
          "return": "Promise<void>"
        },
        "docs": {
          "text": "Exibe o ez-popover.",
          "tags": []
        }
      },
      "showUnder": {
        "complexType": {
          "signature": "(element: HTMLElement | string, options?: IEzPopoverAnchorOptions) => Promise<void>",
          "parameters": [{
              "tags": [],
              "text": ""
            }, {
              "tags": [],
              "text": ""
            }],
          "references": {
            "Promise": {
              "location": "global"
            },
            "HTMLElement": {
              "location": "global"
            },
            "IEzPopoverAnchorOptions": {
              "location": "local"
            }
          },
          "return": "Promise<void>"
        },
        "docs": {
          "text": "Ancora a exibi\u00E7\u00E3o do popOver a um elemento HTML.",
          "tags": []
        }
      },
      "hide": {
        "complexType": {
          "signature": "() => Promise<void>",
          "parameters": [],
          "references": {
            "Promise": {
              "location": "global"
            }
          },
          "return": "Promise<void>"
        },
        "docs": {
          "text": "Oculta o ez-popover.",
          "tags": []
        }
      },
      "setOptions": {
        "complexType": {
          "signature": "(options: IEzPopoverAnchorOptions) => Promise<void>",
          "parameters": [{
              "tags": [],
              "text": ""
            }],
          "references": {
            "Promise": {
              "location": "global"
            },
            "IEzPopoverAnchorOptions": {
              "location": "local"
            }
          },
          "return": "Promise<void>"
        },
        "docs": {
          "text": "Altera as op\u00E7\u00F5es.",
          "tags": []
        }
      },
      "setAnchorElement": {
        "complexType": {
          "signature": "(anchor: HTMLElement | string) => Promise<void>",
          "parameters": [{
              "tags": [],
              "text": ""
            }],
          "references": {
            "Promise": {
              "location": "global"
            },
            "HTMLElement": {
              "location": "global"
            }
          },
          "return": "Promise<void>"
        },
        "docs": {
          "text": "Altera o elemento de ancoragem.",
          "tags": []
        }
      }
    };
  }
  static get elementRef() { return "_host"; }
  static get watchers() {
    return [{
        "propName": "opened",
        "methodName": "observeOpened"
      }];
  }
}
