@sankhyalabs/ezui 2.3.0 → 2.3.2

package/dist/cjs/ez-grid.cjs.entry.js

@@ -114796,6 +114796,7 @@ class AgGridController {
         sortingOrder: ['desc', 'asc', null],
         columnDefs: this._colDefs,
         blockLoadDebounceMillis: this.BLOCK_LOAD_DEBOUNCE,
+        navigateToNextCell: this.navigateToNextCell.bind(this),
         getRowNodeId: this._dataUnit ? (params) => typeof params === "string" ? params : params[this._idAttribName] : undefined,
         getMainMenuItems: (params) => {
           const column = params.column;
@@ -114835,6 +114836,45 @@ class AgGridController {
   getRowHeight() {
     return this.DEFAULT_ROW_HEIGHT;
   }
+  navigateToNextCell(params) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+    switch (params.key) {
+      case 'ArrowUp':
+        if (((_a = this._dataUnit) === null || _a === void 0 ? void 0 : _a.hasPrevious()) === false) {
+          return null;
+        }
+        this._gridOptions.api.deselectAll();
+        if (((_b = params.nextCellPosition) === null || _b === void 0 ? void 0 : _b.rowIndex) < 0) {
+          (_c = this._dataUnit) === null || _c === void 0 ? void 0 : _c.previousRecord();
+          return null;
+        }
+        else {
+          (_d = this._dataUnit) === null || _d === void 0 ? void 0 : _d.setSelectionByIndex([params.nextCellPosition.rowIndex]);
+          return params.nextCellPosition;
+        }
+      case 'ArrowDown':
+        if (((_e = this._dataUnit) === null || _e === void 0 ? void 0 : _e.hasNext()) === false) {
+          return null;
+        }
+        this._gridOptions.api.deselectAll();
+        if ((_f = params.nextCellPosition) === null || _f === void 0 ? void 0 : _f.rowIndex) {
+          (_g = this._dataUnit) === null || _g === void 0 ? void 0 : _g.setSelectionByIndex([params.nextCellPosition.rowIndex]);
+        }
+        else {
+          (_h = this._dataUnit) === null || _h === void 0 ? void 0 : _h.nextRecord();
+        }
+        return params.nextCellPosition;
+      case "ArrowLeft":
+      case "ArrowRight":
+        if (((_j = params.nextCellPosition) === null || _j === void 0 ? void 0 : _j.column.colDef.headerName) !== "") {
+          return params.nextCellPosition;
+        }
+        else {
+          return null;
+        }
+    }
+    return null;
+  }
   setOptionsEvents(opt) {
     opt.onSortChanged = e => this.onCallStateChange("sort", e);
     opt.onColumnResized = e => this.onCallStateChange("columnResize", e);
@@ -114895,7 +114935,14 @@ class AgGridController {
       throw new Error("Erro interno: Grid ainda não inicializado.");
     }
     this._gridOptions.api.forEachNode(node => {
-      node.setSelected(rowIds && rowIds.includes(node.id));
+      var _a;
+      if (rowIds && rowIds.includes(node.id)) {
+        node.setSelected(true);
+        (_a = this._gridOptions.api) === null || _a === void 0 ? void 0 : _a.ensureNodeVisible(node);
+      }
+      else {
+        node.setSelected(false);
+      }
     });
     const selectionHeader = this._gridOptions.context.selectionHeader;
     if (selectionHeader) {
@@ -114941,6 +114988,21 @@ class AgGridController {
     }
     this._gridOptions.api.refreshServerSide({ purge: false });
   }
+  setFocusFirstRow() {
+    const firstRow = this._gridOptions.api.getDisplayedRowAtIndex(0);
+    this.setFocusOnRow(firstRow.rowIndex);
+  }
+  setFocusLastRow() {
+    const lastRow = this._gridOptions.api.getDisplayedRowAtIndex(this._gridOptions.api.getLastDisplayedRow());
+    this.setFocusOnRow(lastRow.rowIndex);
+  }
+  setFocusOnRow(rowIndex) {
+    let displayedColumns = this._gridOptions.columnApi.getAllDisplayedColumns();
+    let firstCell = displayedColumns.find((column) => column.getColDef().headerName !== "");
+    this._gridOptions.api.ensureColumnVisible(firstCell);
+    this._gridOptions.api.ensureIndexVisible(rowIndex);
+    this._gridOptions.api.setFocusedCell(rowIndex, firstCell);
+  }
   setColumnsDef(cols) {
     const newColDefs = [Object.assign({ colId: this.CHECK_BOX_COL_ID, headerName: "", checkboxSelection: true, width: 28, suppressMovable: true, suppressAutoSize: true, suppressMenu: true, lockPosition: true, pinned: true }, this._multipleSelection && { headerComponent: "ezGridHeaderComponent", headerClass: "ag-column-select-header" })];
     if (this._statusResolver != undefined) {
@@ -115209,53 +115271,53 @@ let EzGrid = class {
     this.ezDoubleClick = index.createEvent(this, "ezDoubleClick", 7);
     this.configChange = index.createEvent(this, "configChange", 7);
     this._gridController = new AgGridController(false);
+    this._paginationChangedByKeyboard = true;
   }
   /**
-  * Método responsável por receber a definição das colunas
-  */
+   * Aplica a definição de colunas.
+   */
   async setColumnsDef(cols) {
     this._gridController.setColumnsDef(cols);
   }
   /**
-  * Adiciona item de menu nas colunas.
-  */
+   * Adiciona item de menu nas colunas.
+   */
   async addColumnMenuItem(label, name, action) {
     this._gridController.addColumnMenuItem({ label, name, action });
   }
   /**
-  * Método responsável por aplicar estado pré-existente nas colunas do grid.
-  */
+   * Aplica o estado das colunas.
+   */
   async setColumnsState(state) {
     this._gridController.setColumnsState(state);
   }
   /**
-  * Método de carga dos registros. Os objetos deste array devem conter atributos
-  * para as colunas desejadas.
-  */
+   * Insere os registros no ez-grid.
+   */
   async setData(data) {
     this._gridController.setData(data);
   }
   /**
-  * Retorna as linhas selecionadas na grade.
-  */
+   * Obtém as linhas selecionadas.
+   */
   async getSelection() {
     return Promise.resolve(this._gridController.getSelection());
   }
   /**
-  * Método retornar o estado atual das colunas do grid.
-  */
+   * Obtém o estado atual das colunas.
+   */
   async getColumnsState() {
     return Promise.resolve(this._gridController.getColumnsState());
   }
   /**
-  * Método retornar o estado atual das colunas do grid.
-  */
+   * Obtém a lista de definição de colunas.
+   */
   async getColumns() {
     return Promise.resolve(this._gridController.getColumnsDef());
   }
   /**
-  * Método para fazer um filtro rápido na grid.
-  */
+   * Aplica um filtro rápido.
+   */
   async quickFilter(term) {
     this._gridController.quickFilter(term);
   }
@@ -115333,7 +115395,17 @@ let EzGrid = class {
     this._gridController.initDatagrid(this._container, {
       onColumnStateChange: (type, state, info) => this.onColumnStateChange(type, state, info),
       onSelectionChange: (selection) => this.ezSelectionChange.emit(selection),
-      onPaginationChange: (paginationInfo) => this._paginationInfo = paginationInfo,
+      onPaginationChange: (paginationInfo) => {
+        var _a;
+        if (((_a = this._paginationInfo) === null || _a === void 0 ? void 0 : _a.currentPage) > paginationInfo.currentPage && this._paginationChangedByKeyboard) {
+          this._gridController.setFocusLastRow();
+        }
+        else {
+          this._gridController.setFocusFirstRow();
+          this._paginationChangedByKeyboard = true;
+        }
+        this._paginationInfo = paginationInfo;
+      },
       onDoubleClick: (row) => {
         this.ezDoubleClick.emit(row);
       },
@@ -115356,11 +115428,13 @@ let EzGrid = class {
   previousPage() {
     if (this.dataUnit) {
       this.dataUnit.previousPage();
+      this._paginationChangedByKeyboard = false;
     }
   }
   nextPage() {
     if (this.dataUnit) {
       this.dataUnit.nextPage();
+      this._paginationChangedByKeyboard = false;
     }
   }
   getPaginationControl() {

package/dist/cjs/ez-icon.cjs.entry.js

@@ -11,12 +11,12 @@ let EzIcon = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     /**
-     * Tamanho do ícone
+     * Define o tamanho do ícone.
      */
-    this.size = 'medium';
+    this.size = "medium";
   }
   isSprite() {
-    return this.href && this.href.indexOf('#') > -1;
+    return this.href && this.href.indexOf("#") > -1;
   }
   getIconClassName() {
     return `ez-icon-${this.iconName}`;

package/dist/cjs/ez-list.cjs.entry.js

@@ -14,64 +14,42 @@ let EzList = class {
     this._listGroupItems = [];
     this._listItemsHistory = [];
     /**
-    * Define a lista inicial do componente.
-    */
+     * Define a lista inicial do componente.
+     */
     this.dataSource = [];
     /**
-    * Define se o componente renderizará os itens separados em grupos..
-    */
+     * Se true os grupos serão exibidos.
+     */
     this.useGroups = false;
     /**
-    * Define se o componente terá o comportamento de arrasto de linhas.
-    */
+     * Se true habilita `drag and drop` para os itens.
+     */
     this.ezDraggable = false;
     /**
-    * Define se os items da lista serão selecionáveis.
-    */
+     * Se true os itens serão selecionáveis.
+     */
     this.ezSelectable = false;
   }
-  createList() {
-    if (this.useGroups) {
-      let list = [...this.dataSource];
-      list.forEach(itemGroup => {
-        this.sortGroup(itemGroup);
-      });
-      this._listGroupItems = list;
-    }
-    else {
-      this._listItems = this._listItemsHistory.length > 0 ? this._listItemsHistory : [...this.dataSource];
-    }
-  }
-  sortGroup(itemGroup) {
-    if (itemGroup.sort) {
-      itemGroup.items.sort(function (a, b) {
-        return a.label < b.label ? -1 : a.label > b.label ? 1 : 0;
-      });
-      if (itemGroup.sort === "DSC") {
-        itemGroup.items.reverse();
-      }
-    }
-  }
   /**
-  * Responsável por limpar a lista de histórico do componente.
-  */
+   * Limpa o histórico da lista.
+   */
   async clearHistory() {
     this._listItemsHistory = [];
   }
   /**
-  * Responsável por dar um scroll top no componente da lista.
-  */
+   * Traz o conteúdo da lista para a área visível.
+   */
   async scrollToTop() {
     if (this.useGroups) {
-      this._element.shadowRoot.querySelector('.group-container').scrollTop = 0;
+      this._element.shadowRoot.querySelector(".group-container").scrollTop = 0;
     }
     else {
-      this._element.shadowRoot.querySelector('.items-container').scrollTop = 0;
+      this._element.shadowRoot.querySelector(".items-container").scrollTop = 0;
     }
   }
   /**
-  * Recebe   como argumento um ListItem {label: string} e um booleano que define se o componente deve fazer scroll para exibir o item específico (opcional).
-  */
+   * Aplica seleção nas linhas da lista.
+   */
   async setSelection(selectedItem, scrollToOption) {
     if (selectedItem && this.ezSelectable) {
       if (this.useGroups) {
@@ -102,8 +80,8 @@ let EzList = class {
       }
       if (scrollToOption) {
         let liElem = this.useGroups ?
-          this._groupContainer.querySelector('li#item_' + this.getItemId(selectedItem.label))
-          : this._itemContainer.querySelector('li#item_' + this.getItemId(selectedItem.label));
+          this._groupContainer.querySelector("li#item_" + this.getItemId(selectedItem.label))
+          : this._itemContainer.querySelector("li#item_" + this.getItemId(selectedItem.label));
         if (liElem) {
           liElem.scrollIntoView();
         }
@@ -113,27 +91,9 @@ let EzList = class {
       this.removeSelection();
     }
   }
-  removeSelection() {
-    if (this.useGroups) {
-      let newList = [...this._listGroupItems];
-      newList.forEach(groupItem => {
-        groupItem.items.forEach(item => {
-          item.selected = false;
-        });
-      });
-      this._listGroupItems = newList;
-    }
-    else {
-      let newList = [...this._listItems];
-      newList.forEach(item => {
-        item.selected = false;
-      });
-      this._listItems = newList;
-    }
-  }
   /**
-   * Retorna   o item selecionado.
-  */
+   * Obtém o item selecionado.
+   */
   async getSelection() {
     let selectedItem;
     if (this.useGroups) {
@@ -152,7 +112,7 @@ let EzList = class {
     return selectedItem;
   }
   /**
-   * Retorna   a lista de items conforme o modo de uso.
+   * Obtém a lista de items ou grupos.
    */
   async getList() {
     if (this.useGroups) {
@@ -160,6 +120,46 @@ let EzList = class {
     }
     return this._listItems;
   }
+  createList() {
+    if (this.useGroups) {
+      let list = this.dataSource.map(item => item);
+      list.forEach(itemGroup => {
+        this.sortGroup(itemGroup);
+      });
+      this._listGroupItems = list;
+    }
+    else {
+      this._listItems = this._listItemsHistory.length > 0 ? this._listItemsHistory : this.dataSource.map(item => item);
+    }
+  }
+  sortGroup(itemGroup) {
+    if (itemGroup.sort) {
+      itemGroup.items.sort(function (a, b) {
+        return a.label < b.label ? -1 : a.label > b.label ? 1 : 0;
+      });
+      if (itemGroup.sort === "DSC") {
+        itemGroup.items.reverse();
+      }
+    }
+  }
+  removeSelection() {
+    if (this.useGroups) {
+      let newList = [...this._listGroupItems];
+      newList.forEach(groupItem => {
+        groupItem.items.forEach(item => {
+          item.selected = false;
+        });
+      });
+      this._listGroupItems = newList;
+    }
+    else {
+      let newList = [...this._listItems];
+      newList.forEach(item => {
+        item.selected = false;
+      });
+      this._listItems = newList;
+    }
+  }
   componentWillLoad() {
     this._listItemsHistory = [];
   }
@@ -282,7 +282,7 @@ let EzList = class {
   }
   addOverClass(element) {
     if ((element === null || element === void 0 ? void 0 : element.__proto__) == HTMLDivElement.prototype && element.classList.contains("draggable")) {
-      element.classList.add('over');
+      element.classList.add("over");
     }
     else if ((element === null || element === void 0 ? void 0 : element.parentElement) && !element.parentElement.classList.contains("draggable-list")) {
       this.addOverClass(element.parentElement);
@@ -307,21 +307,21 @@ let EzList = class {
     let overCollection;
     let overLastDroppableCollection;
     if (this.useGroups) {
-      overCollection = (_a = this._groupContainer) === null || _a === void 0 ? void 0 : _a.getElementsByClassName('over');
-      overLastDroppableCollection = this._groupContainer.getElementsByClassName('last-droppable-space');
+      overCollection = (_a = this._groupContainer) === null || _a === void 0 ? void 0 : _a.getElementsByClassName("over");
+      overLastDroppableCollection = this._groupContainer.getElementsByClassName("last-droppable-space");
     }
     else {
-      overCollection = (_b = this._itemContainer) === null || _b === void 0 ? void 0 : _b.getElementsByClassName('over');
-      overLastDroppableCollection = this._itemContainer.getElementsByClassName('last-droppable-space');
+      overCollection = (_b = this._itemContainer) === null || _b === void 0 ? void 0 : _b.getElementsByClassName("over");
+      overLastDroppableCollection = this._itemContainer.getElementsByClassName("last-droppable-space");
     }
     if (overCollection) {
       Array.from(overCollection).forEach(function (element) {
-        element.classList.remove('over');
+        element.classList.remove("over");
       });
     }
     if (overLastDroppableCollection) {
       Array.from(overLastDroppableCollection).forEach(function (element) {
-        element.classList.remove('over');
+        element.classList.remove("over");
       });
     }
   }
@@ -472,7 +472,7 @@ let EzList = class {
   onDragOverLastIndex(ev) {
     ev.preventDefault();
     if (this._dragStartItem) {
-      ev.target.classList.add('over');
+      ev.target.classList.add("over");
       ev.stopPropagation();
     }
   }
@@ -498,7 +498,7 @@ let EzList = class {
     return (index.h(index.Host, { ref: (el) => this._element = el }, this.useGroups ?
       index.h("div", { class: "group-container", ref: (el) => this._groupContainer = el, tabIndex: 0, onKeyDown: (event) => { this.keyDownHandler(event); } }, this._listGroupItems.map(group => {
         return index.h("div", { id: this.getDivGroupId(group.group), class: "group", key: group.group + group.items.length, onDrop: () => this.onDropGroup(group) }, index.h("label", { draggable: false, class: "group-name" }, group.group), index.h("section", { class: "section-container", onDragOver: (ev) => ev.preventDefault() }, index.h("div", { class: "group-items-container" }, index.h("div", { class: "draggable-list" }, group.items.map((item, index$1) => {
-          return index.h("li", { id: 'item_' + this.getItemId(item.label), class: this.ezSelectable ? "selectable-container" : "", key: 'item_' + this.getItemId(item.label) }, index.h("div", { class: "draggable" + (item.selected == true ? " selected-item " : "") + (this.ezSelectable == true ? " selectable " : ""), onClick: () => { this.setSelection(item); }, onDragLeave: () => { group.sort ? undefined : this.removeOverClass(); }, onDragEnd: () => this.onDragEnd(), onDragStart: () => this.onDragStart(item, group, index$1), onDragOver: (event) => { group.sort ? undefined : this.onDragOverItem(event); }, onDrop: (event) => this.onDrop(event, { groupName: group.group, item: item, index: index$1 }), draggable: this.ezDraggable }, index.h("div", { class: "item-content" }, this.ezDraggable ? index.h("span", { class: "draggable-icon" }) : undefined, index.h("p", { title: item.label, class: "person-name text--ellipsis" }, item.label)), this.itemSlotBuilder ?
+          return index.h("li", { id: "item_" + this.getItemId(item.label), class: this.ezSelectable ? "selectable-container" : "", key: "item_" + this.getItemId(item.label) }, index.h("div", { class: "draggable" + (item.selected == true ? " selected-item " : "") + (this.ezSelectable == true ? " selectable " : ""), onClick: () => { this.setSelection(item); }, onDragLeave: () => { group.sort ? undefined : this.removeOverClass(); }, onDragEnd: () => this.onDragEnd(), onDragStart: () => this.onDragStart(item, group, index$1), onDragOver: (event) => { group.sort ? undefined : this.onDragOverItem(event); }, onDrop: (event) => this.onDrop(event, { groupName: group.group, item: item, index: index$1 }), draggable: this.ezDraggable }, index.h("div", { class: "item-content" }, this.ezDraggable ? index.h("span", { class: "draggable-icon" }) : undefined, index.h("p", { title: item.label, class: "person-name text--ellipsis" }, item.label)), this.itemSlotBuilder ?
             index.h("div", { class: "slot-item" }, this.itemSlotBuilder(item, group))
             : undefined));
         })), index.h("div", { class: "last-droppable-space", onDragLeave: () => this.removeOverClass(), onDragOver: (event) => { this.onDragOverLastIndex(event); }, onDragEnd: () => this.onDragEnd(), onDrop: (event) => this.onDropLastIndex(event, group) })), group.sort ?
@@ -507,7 +507,7 @@ let EzList = class {
       }))
       :
         index.h("div", { class: "items-container", ref: (el) => this._itemContainer = el, tabIndex: 0, onKeyDown: (event) => { this.keyDownHandler(event); } }, index.h("div", { class: "draggable-list" }, this._listItems.map((item, index$1) => {
-          return index.h("li", { id: 'item_' + this.getItemId(item.label), class: this.ezSelectable ? "selectable-container" : "", key: 'item_' + this.getItemId(item.label) }, index.h("div", { class: "draggable" + (item.selected == true ? " selected-item " : "") + (this.ezSelectable == true ? " selectable " : ""), onDragStart: () => this.onDragStart({ item: item, index: index$1 }), onClick: () => { this.setSelection(item); }, onDragLeave: () => this.removeOverClass(), onDragOver: (event) => this.onDragOverItem(event), onDragEnd: () => this.onDragEnd(), onDrop: (event) => this.onDrop(event, { item: item, index: index$1 }), draggable: this.ezDraggable }, index.h("div", { class: "item-content" }, this.ezDraggable ? index.h("span", { class: "draggable-icon" }) : undefined, index.h("p", { title: item.label, class: "person-name text--ellipsis" }, item.label)), this.itemSlotBuilder ?
+          return index.h("li", { id: "item_" + this.getItemId(item.label), class: this.ezSelectable ? "selectable-container" : "", key: "item_" + this.getItemId(item.label) }, index.h("div", { class: "draggable" + (item.selected == true ? " selected-item " : "") + (this.ezSelectable == true ? " selectable " : ""), onDragStart: () => this.onDragStart({ item: item, index: index$1 }), onClick: () => { this.setSelection(item); }, onDragLeave: () => this.removeOverClass(), onDragOver: (event) => this.onDragOverItem(event), onDragEnd: () => this.onDragEnd(), onDrop: (event) => this.onDrop(event, { item: item, index: index$1 }), draggable: this.ezDraggable }, index.h("div", { class: "item-content" }, this.ezDraggable ? index.h("span", { class: "draggable-icon" }) : undefined, index.h("p", { title: item.label, class: "person-name text--ellipsis" }, item.label)), this.itemSlotBuilder ?
             index.h("div", null, this.itemSlotBuilder(item))
             : undefined));
         }), index.h("div", { class: "last-droppable-space", onDragLeave: () => this.removeOverClass(), onDragOver: (event) => { this.onDragOverLastIndex(event); }, onDragEnd: () => this.onDragEnd(), onDrop: (event) => this.onDropLastIndex(event) })))));

package/dist/cjs/ez-loading-bar.cjs.entry.js

@@ -11,13 +11,17 @@ let EzLoadingBar = class {
     index.registerInstance(this, hostRef);
     this._showLoading = true;
   }
-  hide() {
+  /**
+   * Oculta o ez-loading-bar.
+   */
+  async hide() {
     this._showLoading = false;
-    return Promise.resolve();
   }
-  show() {
+  /**
+   * Exibe o ez-loading-bar.
+   */
+  async show() {
     this._showLoading = true;
-    return Promise.resolve();
   }
   render() {
     return (index.h(index.Host, null, this._showLoading && index.h("div", { class: "loading-bar" }, index.h("div", { class: "loading-bar__container" }))));

package/dist/cjs/ez-modal-container.cjs.entry.js

@@ -28,7 +28,7 @@ let EzModalContainer = class {
     index.registerInstance(this, hostRef);
     this.ezModalAction = index.createEvent(this, "ezModalAction", 7);
     /**
-     * Determina se o cabeçalho com o título deverá ser mostrado
+     * Define se o cabeçalho será mostrado.
      */
     this.showTitleBar = true;
   }
@@ -50,7 +50,7 @@ let EzModalContainer = class {
     this._closeButton.focus();
   }
   render() {
-    return (index.h(index.Host, null, index.h("button", { class: "ez-modal-container__focus-ctrl", onFocusin: evt => this.focusLast(evt) }), this.showTitleBar && index.h("div", { class: "ez-modal-container__header ez-margin-bottom--large ez-align--middle" }, index.h("div", { class: "ez-col ez-align--middle ez-modal-container__title" }, index.h("h2", { class: "ez-text ez-title--large ez-title--primary ez-text--bold ez-margin-vertical--extra-small" }, this.modalTitle), this.modalSubTitle ? index.h("div", { class: "ez-text ez-text--medium ez-text--primary ez-margin-vertical--extra-small" }, this.modalSubTitle) : undefined), index.h("button", { ref: ref => this._closeButton = ref, class: "ez-modal-container__close-button", onClick: () => this.ezModalAction.emit(ModalAction$1.CLOSE) }, index.h("ez-icon", { class: "ez-modal-container__close-icon", size: "medium", iconName: "close" }))), index.h("div", null, index.h("slot", null)), index.h("div", { class: 'ez-col ez-margin-left--auto' }, this.cancelIsVisible() ? index.h("ez-button", { label: this.cancelButtonLabel, enabled: this.cancelButtonStatus !== ModalButtonStatus$1.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction$1.CANCEL) }) : undefined, this.okIsVisible() ? index.h("ez-button", { ref: ref => this._okButton = ref, label: this.okButtonLabel, enabled: this.okButtonStatus !== ModalButtonStatus$1.DISABLED, class: "ez-button--primary ez-margin-left--medium", onClick: () => this.ezModalAction.emit(ModalAction$1.OK) }) : undefined), index.h("button", { class: "ez-modal-container__focus-ctrl", onFocusin: evt => this.focusFirst(evt) })));
+    return (index.h(index.Host, null, index.h("button", { class: "ez-modal-container__focus-ctrl", onFocusin: evt => this.focusLast(evt) }), this.showTitleBar && index.h("div", { class: "ez-modal-container__header ez-margin-bottom--large ez-align--middle" }, index.h("div", { class: "ez-col ez-align--middle ez-modal-container__title" }, index.h("h2", { class: "ez-text ez-title--large ez-title--primary ez-text--bold ez-margin-vertical--extra-small" }, this.modalTitle), this.modalSubTitle ? index.h("div", { class: "ez-text ez-text--medium ez-text--primary ez-margin-vertical--extra-small" }, this.modalSubTitle) : undefined), index.h("button", { ref: ref => this._closeButton = ref, class: "ez-modal-container__close-button", onClick: () => this.ezModalAction.emit(ModalAction$1.CLOSE) }, index.h("ez-icon", { class: "ez-modal-container__close-icon", size: "medium", iconName: "close" }))), index.h("div", null, index.h("slot", null)), index.h("div", { class: "ez-col ez-margin-left--auto" }, this.cancelIsVisible() ? index.h("ez-button", { label: this.cancelButtonLabel, enabled: this.cancelButtonStatus !== ModalButtonStatus$1.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction$1.CANCEL) }) : undefined, this.okIsVisible() ? index.h("ez-button", { ref: ref => this._okButton = ref, label: this.okButtonLabel, enabled: this.okButtonStatus !== ModalButtonStatus$1.DISABLED, class: "ez-button--primary ez-margin-left--medium", onClick: () => this.ezModalAction.emit(ModalAction$1.OK) }) : undefined), index.h("button", { class: "ez-modal-container__focus-ctrl", onFocusin: evt => this.focusFirst(evt) })));
   }
 };
 EzModalContainer.style = ezModalContainerCss;

package/dist/cjs/ez-modal.cjs.entry.js

@@ -12,16 +12,16 @@ let EzModal = class {
     this.ezCloseModal = index.createEvent(this, "ezCloseModal", 7);
     this.ezOpenModal = index.createEvent(this, "ezOpenModal", 7);
     /**
-    * Controle de exibição do Modal
-    */
+     * Define se o ez-modal está aberto.
+     */
     this.opened = true;
     /**
-    * Define se o modal será fechado ao clicar ESC
-    */
+     * Define se o ez-modal será fechado ao clicar `ESC`.
+     */
     this.closeEsc = false;
     /**
-    * Define se o modal será fechado ao clicar fora do conteúdo.
-    */
+     * Define se o modal será fechado ao clicar fora do conteúdo.
+     */
     this.closeOutsideClick = false;
     this.handleKeyboardEvent = (ev) => {
       if ((ev === null || ev === void 0 ? void 0 : ev.key) === "Escape" && this.closeEsc) {

package/dist/cjs/ez-number-input.cjs.entry.js

@@ -16,28 +16,28 @@ let EzNumberInput = class {
     this.ezCancelWaitingChange = index.createEvent(this, "ezCancelWaitingChange", 7);
     this._focused = false;
     /**
-     * Deixa o campo disponível ou não para uso.
+     * Se false, o usuário não pode interagir com o campo.
      */
     this.enabled = true;
     /**
-     * Define o modo do tamanho do campo; opções: slim e regular.
+     * Define o tamanho do campo.
      */
     this.mode = "regular";
   }
   /**
-   * Realiza o foco no componente de input
+   * Aplica o foco no campo.
    */
   async setFocus() {
     this._textInput.setFocus();
   }
   /**
-   * Remove o foco no componente de input
+   * Remove o foco do campo.
    */
   async setBlur() {
     this._textInput.setBlur();
   }
   /**
-   * Retorna informando se o campo está inválido (true | false)
+   * Retorna se o conteúdo é inválido.
    */
   async isInvalid() {
     return typeof this.errorMessage === "string" && this.errorMessage.trim() !== "";

package/dist/cjs/ez-popover.cjs.entry.js

@@ -13,29 +13,27 @@ let EzPopover = class {
     this.ezVisibilityChange = index.createEvent(this, "ezVisibilityChange", 7);
     this._firstRender = true;
     /**
-     * No modo floating = false o popover só se tornará visível
-     * quando o método show() for acionado.
+     * Define que será fechado automaticamente quando o usuário clicar fora do conteúdo.
      */
     this.autoClose = true;
     /**
-     * Offset top do popover em relação ao componente pai
+     * Define a distância do topo. Devem ser usados valores válidos de CSS.
      */
     this.top = "0px";
     /**
-     * Offset left do popover em relação ao componente pai
+     * Define a distância do lado esquerdo. Devem ser usados valores válidos de CSS.
      */
     this.left = "0px";
     /**
-     * Offset bottom do popover em relação ao componente pai
+     * Define a distância de baixo. Devem ser usados valores válidos de CSS.
      */
     this.bottom = "0px";
     /**
-     * Offset right do popover em relação ao componente pai
+     * Define a distância do lado direito. Devem ser usados valores válidos de CSS.
      */
     this.right = "0px";
     /**
      * Ajusta o comportamento da largura do popover.
-     * Opções: "100% e "fit-content" (default)
      */
     this.boxWidth = "fit-content";
     this.innerClickTest = (_popOvercontainer, node, eventOrigin) => {
@@ -86,7 +84,7 @@ let EzPopover = class {
     }
   }
   /**
-   * Atualiza a posição do popover em relação ao componente pai.
+   * Atualiza a posição do popover.
    */
   async updatePosition(top = this.top, left = this.left, bottom = this.bottom, right = this.right) {
     const floatingOptions = {
@@ -101,7 +99,7 @@ let EzPopover = class {
     core.FloatingManager.updateFloatPosition(this._box, this._container, floatingOptions);
   }
   /**
-   * Faz com que o popover seja renderizado na DOM.
+   * Exibe o ez-popover.
    */
   async show(top = this.top, left = this.left, bottom = this.bottom, right = this.right) {
     const floatingOptions = {
@@ -117,7 +115,7 @@ let EzPopover = class {
     this.opened = true;
   }
   /**
-   * Usado no modo floating. Faz com que o componente seja ocultado.
+   * Oculta o ez-popover.
    */
   async hide() {
     if (this._floatingID !== undefined) {

package/dist/cjs/ez-popup.cjs.entry.js

@@ -18,20 +18,19 @@ let EzPopup = class {
       "x-large": "col--sd-11"
     };
     /**
-     * Define o width que o componente deve ter, seguindo o grid system. Os valores devem estar
-     * compreendidos em [x-small | small | medium | large | x-large].
+     * Define a largura do ez-popup.
      */
     this.size = "medium";
     /**
-     * Controla a exibição do componente.
+     * Define se o ez-popover está aberto.
      */
     this.opened = false;
     /**
-     * Define se o componente utilizará um cabeçalho com botão de fechamento.
+     * Define se o componente utilizará cabeçalho.
      */
     this.useHeader = true;
     /**
-     * Define se o componente utilizará um cabeçalho com botão de fechamento.
+     * Define altura do componente.
      */
     this.heightMode = "full";
   }