@sankhyalabs/ezui 0.0.0-bugfix-dev-KB-83282.0 → 0.0.0-bugfix-dev-KB-75065.1

package/dist/collection/components/ez-combo-box/ez-combo-box-list/ez-combo-box-list.css

@@ -1,205 +0,0 @@
-:host {
-  /* general */
-  /*@doc Define o raio da borda do input. */
-  --ez-combo-box--border-radius: var(--border--radius-medium, 12px);
-  /*@doc Define o tamanho da fonte dentro do input. */
-  --ez-combo-box--font-size: var(--text--medium, 14px);
-  /*@doc Define a família da fonte dentro do input. */
-  --ez-combo-box--font-family: var(--font-pattern, Arial);
-  /*@doc Define o peso da fonte dentro do input quando pesada. */
-  --ez-combo-box--font-weight--large: var(--text-weight--large, 500);
-  /*@doc Define o peso da fonte dentro do input quando média. */
-  --ez-combo-box--font-weight--medium: var(--text-weight--medium, 400);
-  /*@doc Define a cor de fundo da lista de opções. */
-  --ez-combo-box--background-color--xlight: var(--background--xlight, #fff);
-  /*@doc Define a cor de fundo dos itens da lista de opções. */
-  --ez-combo-box--background-medium: var(--background--medium, #f0f3f7);
-  /*@doc Define a altura da linha do texto dentro do input. */
-  --ez-combo-box--line-height: calc(var(--text--medium, 14px) + 4px);
-
-  /* list */
-  /*@doc Define a cor do texto da lista de opções. */
-  --ez-combo-box__list-title--primary: var(--title--primary, #2B3A54);
-  /*@doc Define a cor do texto do value da lista de opções. */
-  --ez-combo-box__list-text--primary: var(--text--primary, #626e82);
-  /*@doc Define a altura do box da lista de opções. */
-  --ez-combo-box__list-height: calc(var(--ez-combo-box--font-size) + var(--ez-combo-box--space--medium) + 4px);
-
-  /* espaçamento */
-  /*@doc Define um espaçamento mediano entre elementos do componente. */
-  --ez-combo-box--space--medium: var(--space--medium, 12px);
-  /*@doc Define um espaçamento pequeno entre elementos do componente. */
-  --ez-combo-box--space--small: var(--space--small, 6px);
-
-  /* scrollbar */
-  /*@doc Define a cor da barra de rolagem do componente. */
-  --ez-combo-box__scrollbar--color-default: var(--scrollbar--default, #626e82);
-  /*@doc Define a cor de fundo da barra de rolagem do componente. */
-  --ez-combo-box__scrollbar--color-background: var(--scrollbar--background, #E5EAF0);
-  /*@doc Define a cor do hover na barra de rolagem do componente. */
-  --ez-combo-box__scrollbar--color-hover: var(--scrollbar--hover, #2B3A54);
-  /*@doc Define a cor do active na barra de rolagem do componente. */
-  --ez-combo-box__scrollbar--color-clicked: var(--scrollbar--clicked, #a2abb9);
-  /*@doc Define o raio da borda da barra de rolagem do componente. */
-  --ez-combo-box__scrollbar--border-radius: var(--border--radius-small, 6px);
-  /*@doc Define a largura da barra de rolagem do componente. */
-  --ez-combo-box__scrollbar--width: var(--space--medium, 12px);
-
-  /* list-container */
-  /*@doc Define o padding do container da lista. */
-  --ez-combo-box__list-container--padding: var(--space--extra-small, 3px);
-}
-
-.list-container {
-  /*public*/
-  padding-top: var(--ez-combo-box__list-container--padding);
-}
-
-.list-wrapper {
-  display: flex;
-  flex-direction: column;
-  box-sizing: border-box;
-  width: 0;
-  z-index: var(--more-visible, 2);
-  max-height: calc(4*var(--ez-combo-box__list-height) + 2*var(--ez-combo-box--space--small) + 9px);
-  background-color: var(--ez-combo-box--background-color--xlight);
-  border-radius: var(--ez-combo-box--border-radius);
-  box-shadow: var(--shadow--medium, 0 8px 24px 0 rgba(43, 58, 84, 0.10));
-  padding: var(--ez-combo-box--space--small);
-}
-
-.list-options {
-  box-sizing: border-box;
-  width: 100%;
-  height: 100%;
-  padding: 0;
-  display: flex;
-  flex-direction: column;  
-  scroll-behavior: smooth;
-  overflow: auto;
-  scrollbar-width: thin;
-  gap: 3px;
-  scrollbar-color: var(--ez-combo-box__scrollbar--color-clicked) var(--ez-combo-box__scrollbar--color-background);
-}
-
-.list-options::-webkit-scrollbar {
-  background-color: var(--ez-combo-box__scrollbar--color-background);
-  width: var(--ez-combo-box__scrollbar--width);
-  max-width: var(--ez-combo-box__scrollbar--width);
-  min-width: var(--ez-combo-box__scrollbar--width);
-}
-
-.list-options::-webkit-scrollbar-track {
-  background-color: var(--ez-combo-box__scrollbar--color-background);
-  border-radius: var(--ez-combo-box__scrollbar--border-radius);
-}
-
-.list-options::-webkit-scrollbar-thumb {
-  background-color: var(--ez-combo-box__scrollbar--color-default);
-  border-radius: var(--ez-combo-box__scrollbar--border-radius);
-}
-
-.list-options::-webkit-scrollbar-thumb:vertical:hover,
-.list-options::-webkit-scrollbar-thumb:horizontal:hover {
-  background-color: var(--ez-combo-box__scrollbar--color-hover);
-}
-
-.list-options::-webkit-scrollbar-thumb:vertical:active,
-.list-options::-webkit-scrollbar-thumb:horizontal:active {
-  background-color: var(--ez-combo-box__scrollbar--color-clicked);
-}
-
-.item {
-  display: flex;
-  align-items: center;
-  width: 100%;
-  box-sizing: border-box;
-  list-style-type: none;
-  cursor: pointer;
-  border-radius: var(--ez-combo-box--border-radius-small);
-  padding: var(--ez-combo-box--space--small);
-  min-height: var(--ez-combo-box__list-height);
-  gap: var(--space--small, 6px);
-}
-
-.item__value,
-.item__label {
-  flex-basis: auto;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  color: var(--ez-combo-box__list-title--primary);
-  font-family: var(--ez-combo-box--font-family);
-  font-size: var(--ez-combo-box--font-size);
-  line-height: var(--ez-combo-box--line-height);
-}
-
-.item__label {
-  font-weight: var(--ez-combo-box--font-weight--medium);
-}
-
-.item__label--bold {
-  font-weight: var(--ez-combo-box--font-weight--large);
-}
-
-.item__value {
-  text-align: center;
-  color: var(--ez-combo-box__list-text--primary);
-  font-weight: var(--ez-combo-box--font-weight--large);
-}
-
-.item__value--hidden {
-  visibility: hidden;
-  position: absolute;
-  white-space: nowrap;
-  z-index: -1;
-  top: 0;
-  left: 0;
-}
-
-.item__label {
-  text-align: left;
-}
-
-.message {
-  text-align: center;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  list-style-type: none;
-  min-height: var(--ez-combo-box__list-height);
-}
-
-.message__no-result {
-  color: var(--ez-combo-box__list-title--primary);
-  font-family: var(--ez-combo-box--font-family);
-  font-size: var(--ez-combo-box--font-size);
-}
-
-.message__loading {
-  border-radius: 50%;
-  width: 14px;
-  height: 14px;
-  -webkit-animation: spin 1s linear infinite;
-  animation: spin 1s linear infinite;
-  border: 3px solid var(--ez-combo-box__list-title--primary);
-  border-top: 3px solid transparent;
-}
-
-li:hover {
-  background-color: var(--ez-combo-box--background-medium);
-}
-
-.preselected {
-  background-color: var(--background--medium);
-}
-
-@-webkit-keyframes spin {
-  0% { -webkit-transform: rotate(0deg); }
-  100% { -webkit-transform: rotate(360deg); }
-}
-
-@keyframes spin {
-  0% { transform: rotate(0deg); }
-  100% { transform: rotate(360deg); }
-}

package/dist/collection/components/ez-combo-box/ez-combo-box-list/ez-combo-box-list.js

@@ -1,426 +0,0 @@
-import { h } from "@stencil/core";
-import { ElementIDUtils } from "@sankhyalabs/core";
-export class EzComboBoxList {
-  constructor() {
-    this.showLoading = undefined;
-    this.visibleOptions = undefined;
-    this.textEmptyList = "Nenhum resultado encontrado";
-    this.showOptionValue = undefined;
-    this.preSelection = undefined;
-    this.maxWidth = undefined;
-    this.width = undefined;
-    this.onOptionSelect = undefined;
-    this.onOptionHover = undefined;
-  }
-  /**
-   * Move a seleção para a próxima opção na lista.
-   */
-  async nextOption() {
-    var _a;
-    if (!this.visibleOptions || this.visibleOptions.length === 0)
-      return;
-    const isAtLastOption = this.preSelection !== undefined && this.preSelection >= this.visibleOptions.length - 1;
-    if (!isAtLastOption) {
-      this.preSelection = this.preSelection === undefined ? 0 : this.preSelection + 1;
-      this.scrollToOption(this.visibleOptions[this.preSelection]);
-      (_a = this.onOptionHover) === null || _a === void 0 ? void 0 : _a.call(this, this.preSelection);
-    }
-  }
-  /**
-   * Move a seleção para a opção anterior na lista, sem ultrapassar o início.
-   */
-  async previousOption() {
-    var _a;
-    if (!this.visibleOptions || this.visibleOptions.length === 0)
-      return;
-    const isAtFirstOption = this.preSelection !== undefined && this.preSelection <= 0;
-    if (!isAtFirstOption) {
-      this.preSelection = this.preSelection === undefined ? this.visibleOptions.length - 1 : this.preSelection - 1;
-      this.scrollToOption(this.visibleOptions[this.preSelection]);
-      (_a = this.onOptionHover) === null || _a === void 0 ? void 0 : _a.call(this, this.preSelection);
-    }
-  }
-  /**
-   * Seleciona a opção atualmente pré-selecionada.
-   */
-  async selectCurrentOption() {
-    if (this.preSelection !== undefined) {
-      this.onOptionSelect(this.visibleOptions[this.preSelection]);
-      this.preSelection = undefined;
-    }
-  }
-  /**
-   * Observa mudanças na propriedade `width` e ajusta a largura da lista.
-   *
-   * @param newValue O novo valor da largura.
-   * @param oldValue O valor anterior da largura.
-   */
-  observeWidth(newValue, oldValue) {
-    if (newValue === oldValue)
-      return;
-    if (!this._listWrapper)
-      return;
-    this._listWrapper.style.width = `${this.width}px`;
-  }
-  /**
-   * Observa mudanças na propriedade `maxWidth` e ajusta a largura máxima da lista.
-   *
-   * @param newValue O novo valor da largura máxima.
-   * @param oldValue O valor anterior da largura máxima.
-   */
-  observeMaxWidth(newValue, oldValue) {
-    if (newValue === oldValue)
-      return;
-    if (!this._listWrapper)
-      return;
-    this._listWrapper.style.maxWidth = this.maxWidth ? `${this.maxWidth}px` : '';
-  }
-  /**
-   * Gerencia a navegação por teclado na lista do combo box.
-   *
-   * - `ArrowDown`: Move para a próxima opção.
-   * - `ArrowUp`: Move para a opção anterior.
-   * - `Enter`: Seleciona a opção atual.
-   * - `Escape`: Limpa a pré-seleção.
-   *
-   * @param event O evento de teclado.
-   */
-  handleKeyDown(event) {
-    switch (event.key) {
-      case "ArrowDown":
-        event.preventDefault();
-        event.stopPropagation();
-        this.nextOption();
-        break;
-      case "ArrowUp":
-        event.preventDefault();
-        event.stopPropagation();
-        this.previousOption();
-        break;
-      case "Enter":
-        this.selectCurrentOption();
-        break;
-      case "Escape":
-        this.preSelection = undefined;
-        break;
-    }
-  }
-  buildItem(opt, index) {
-    const widthValue = this.showOptionValue && this.maxWidth > 0 ? `${this.maxWidth}px` : '';
-    opt.label = opt.label || opt.value;
-    return h("li", { tabIndex: 1, class: index === this.preSelection ? "item preselected" : "item", id: `item_${opt.value}_${index}`, key: `item_${opt.value}_${index}`, onMouseDown: () => this.onOptionSelect(opt), onMouseOver: () => this.preSelection = index }, this.showOptionValue
-      ? h("span", { class: "item__value", title: opt.value, style: { width: widthValue, minWidth: widthValue, maxWidth: widthValue } }, opt.value)
-      : undefined, h("span", { class: "item__label " + (this.showOptionValue ? "item__label--bold" : ""), title: opt.label }, opt.label));
-  }
-  scrollToOption(opt) {
-    if (!opt || !opt.value || !this._optionsList)
-      return;
-    const index = this.visibleOptions.indexOf(opt);
-    if (index === -1)
-      return;
-    const liElem = this._optionsList.querySelector(`li#item_${CSS.escape(opt.value)}_${CSS.escape(String(index))}`);
-    if (liElem) {
-      liElem.scrollIntoView({
-        behavior: "smooth",
-        block: "nearest"
-      });
-    }
-  }
-  componentDidLoad() {
-    this._listWrapper.style.width = `${this.width}px`;
-    this._listWrapper.style.maxWidth = this.maxWidth ? `${this.maxWidth}px` : '';
-  }
-  componentDidRender() {
-    var _a;
-    (_a = this._optionsList) === null || _a === void 0 ? void 0 : _a.querySelectorAll(".item").forEach((elem) => {
-      ElementIDUtils.addIDInfoIfNotExists(elem, "itemComboBox");
-    });
-  }
-  render() {
-    return (h("section", { class: "list-container" }, h("div", { class: "list-wrapper", ref: elem => this._listWrapper = elem }, h("ul", { class: "list-options", ref: elem => this._optionsList = elem }, !this.showLoading && this.visibleOptions.length === 0 && (h("div", { class: "message" }, h("span", { class: "message__no-result" }, this.textEmptyList))), this.showLoading && (h("div", { class: "message" }, h("div", { class: "message__loading" }))), this.showOptionValue && (h("span", { class: "item__value item__value--hidden" })), !this.showLoading && this.visibleOptions.length > 0 &&
-      this.visibleOptions.map((opt, index) => this.buildItem(opt, index))))));
-  }
-  static get is() { return "ez-combo-box-list"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["ez-combo-box-list.css"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["ez-combo-box-list.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "showLoading": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "tipo",
-              "text": "{boolean}"
-            }],
-          "text": "Indica se o indicador de carregamento deve ser exibido."
-        },
-        "attribute": "show-loading",
-        "reflect": false
-      },
-      "visibleOptions": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "Array<IOption>",
-          "resolved": "IOption[]",
-          "references": {
-            "Array": {
-              "location": "global"
-            },
-            "IOption": {
-              "location": "import",
-              "path": "../ez-combo-box"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "tipo",
-              "text": "{Array<IOption>}"
-            }],
-          "text": "Lista de op\u00E7\u00F5es vis\u00EDveis que ser\u00E3o exibidas no componente."
-        }
-      },
-      "textEmptyList": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "padr\u00E3o",
-              "text": "\"Nenhum resultado encontrado\""
-            }, {
-              "name": "tipo",
-              "text": "{string}"
-            }],
-          "text": "Mensagem exibida quando a lista de op\u00E7\u00F5es est\u00E1 vazia."
-        },
-        "attribute": "text-empty-list",
-        "reflect": false,
-        "defaultValue": "\"Nenhum resultado encontrado\""
-      },
-      "showOptionValue": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "tipo",
-              "text": "{boolean}"
-            }],
-          "text": "Indica se o valor de cada op\u00E7\u00E3o deve ser exibido junto com o r\u00F3tulo."
-        },
-        "attribute": "show-option-value",
-        "reflect": false
-      },
-      "preSelection": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "tipo",
-              "text": "{number}"
-            }],
-          "text": "\u00CDndice da op\u00E7\u00E3o pr\u00E9-selecionada na lista."
-        },
-        "attribute": "pre-selection",
-        "reflect": false
-      },
-      "maxWidth": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "tipo",
-              "text": "{number}"
-            }],
-          "text": "Largura m\u00E1xima da lista, em pixels."
-        },
-        "attribute": "max-width",
-        "reflect": false
-      },
-      "width": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "tipo",
-              "text": "{number}"
-            }],
-          "text": "Largura fixa da lista, em pixels."
-        },
-        "attribute": "width",
-        "reflect": false
-      },
-      "onOptionSelect": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "(option: IOption) => void",
-          "resolved": "(option: IOption) => void",
-          "references": {
-            "IOption": {
-              "location": "import",
-              "path": "../ez-combo-box"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "param",
-              "text": "option A op\u00E7\u00E3o selecionada."
-            }, {
-              "name": "tipo",
-              "text": "{(option: IOption) => void}"
-            }],
-          "text": "Callback chamado quando uma op\u00E7\u00E3o \u00E9 selecionada."
-        }
-      },
-      "onOptionHover": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "(index: number) => void",
-          "resolved": "(index: number) => void",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "param",
-              "text": "index O \u00EDndice da op\u00E7\u00E3o em foco."
-            }, {
-              "name": "tipo",
-              "text": "{(index: number) => void}"
-            }],
-          "text": "Callback chamado quando o mouse passa sobre uma op\u00E7\u00E3o."
-        }
-      }
-    };
-  }
-  static get methods() {
-    return {
-      "nextOption": {
-        "complexType": {
-          "signature": "() => Promise<void>",
-          "parameters": [],
-          "references": {
-            "Promise": {
-              "location": "global"
-            }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "Move a sele\u00E7\u00E3o para a pr\u00F3xima op\u00E7\u00E3o na lista.",
-          "tags": []
-        }
-      },
-      "previousOption": {
-        "complexType": {
-          "signature": "() => Promise<void>",
-          "parameters": [],
-          "references": {
-            "Promise": {
-              "location": "global"
-            }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "Move a sele\u00E7\u00E3o para a op\u00E7\u00E3o anterior na lista, sem ultrapassar o in\u00EDcio.",
-          "tags": []
-        }
-      },
-      "selectCurrentOption": {
-        "complexType": {
-          "signature": "() => Promise<void>",
-          "parameters": [],
-          "references": {
-            "Promise": {
-              "location": "global"
-            }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "Seleciona a op\u00E7\u00E3o atualmente pr\u00E9-selecionada.",
-          "tags": []
-        }
-      }
-    };
-  }
-  static get watchers() {
-    return [{
-        "propName": "width",
-        "methodName": "observeWidth"
-      }, {
-        "propName": "maxWidth",
-        "methodName": "observeMaxWidth"
-      }];
-  }
-  static get listeners() {
-    return [{
-        "name": "keydown",
-        "method": "handleKeyDown",
-        "target": undefined,
-        "capture": false,
-        "passive": false
-      }];
-  }
-}

package/dist/collection/components/ez-popover-plus/subcomponent/ez-popover-core.css

@@ -1,67 +0,0 @@
-:host {
-
-  /* box */
-  /*@doc Define o raio da borda do popover.*/
-  --ez-popover__box--border-radius: var(--border--radius-medium, 12px);
-  /*@doc Define a sombra do popover.*/
-  --ez-popover__box--box-shadow: var(--shadow, 0px 0px 16px 0px #000);
-  /*@doc Define a cor de fundo do popover.*/
-  --ez-popover__box--background-color: var(--background--xlight, #fff);
-  /*@doc Define a camada de visibilidade do popover.*/
-  --ez-popover__box--z-index: var(--most-visible, 4);
-
-  /***************
-     host style  
-  ***************/
-  /*private*/
-  position: relative;
-  display: flex;
-  user-select: none;
-}
-
-.popover__overlay {
-  display: none;
-  position: fixed;
-  padding: 0;
-  top: 0px;
-  left: 0px;
-  width: 100%;
-  height: 100vh;
-  box-sizing: border-box;
-  z-index: var(--more-visible--2x, 3);
-}
-
-.popover__overlay--light {
-  background-color: rgba(var(--rgb-background--overlay), var(--opacity--bright)); 
-}
-
-.popover__overlay--medium {
-  background-color: rgba(var(--rgb-background--overlay), var(--opacity--soft));
-  backdrop-filter: blur(var(--background-blur--medium)); 
-}
-
-.popover__box {
-  /*private*/
-  display: none;
-  position: fixed;
-  top: 0;
-  left: 0;
-
-  z-index: var(--ez-popover__box--z-index);
-  flex-direction: column;
-
-  height: fit-content;
-
-  /*public*/
-  background-color: var(--ez-popover__box--background-color);
-  border-radius: var(--ez-popover__box--border-radius);
-  box-shadow: var(--ez-popover__box--box-shadow);
-}
-
-.popover__box--fit-content {
-  width: fit-content;
-}
-
-.popover__box--full-width {
-  width: calc(100% - 10px);
-}