@sankhyalabs/ezui 2.3.0 → 2.3.2

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

@@ -1,4 +1,4 @@
-import { Component, Event, h, Host, Method, Prop, State } from '@stencil/core';
+import { Component, Event, h, Host, Method, Prop, State } from "@stencil/core";
 ;
 ;
 export class EzList {
@@ -7,64 +7,42 @@ export class EzList {
     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) {
@@ -95,8 +73,8 @@ export class EzList {
       }
       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();
         }
@@ -106,27 +84,9 @@ export class EzList {
       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) {
@@ -145,7 +105,7 @@ export class EzList {
     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) {
@@ -153,6 +113,46 @@ export class EzList {
     }
     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 = [];
   }
@@ -275,7 +275,7 @@ export class EzList {
   }
   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);
@@ -300,21 +300,21 @@ export class EzList {
     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");
       });
     }
   }
@@ -465,7 +465,7 @@ export class EzList {
   onDragOverLastIndex(ev) {
     ev.preventDefault();
     if (this._dragStartItem) {
-      ev.target.classList.add('over');
+      ev.target.classList.add("over");
       ev.stopPropagation();
     }
   }
@@ -495,7 +495,7 @@ export class EzList {
           h("section", { class: "section-container", onDragOver: (ev) => ev.preventDefault() },
             h("div", { class: "group-items-container" },
               h("div", { class: "draggable-list" }, group.items.map((item, index) => {
-                return h("li", { id: 'item_' + this.getItemId(item.label), class: this.ezSelectable ? "selectable-container" : "", key: 'item_' + this.getItemId(item.label) },
+                return h("li", { id: "item_" + this.getItemId(item.label), class: this.ezSelectable ? "selectable-container" : "", key: "item_" + this.getItemId(item.label) },
                   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), onDragOver: (event) => { group.sort ? undefined : this.onDragOverItem(event); }, onDrop: (event) => this.onDrop(event, { groupName: group.group, item: item, index: index }), draggable: this.ezDraggable },
                     h("div", { class: "item-content" },
                       this.ezDraggable ? h("span", { class: "draggable-icon" }) : undefined,
@@ -515,7 +515,7 @@ export class EzList {
         h("div", { class: "items-container", ref: (el) => this._itemContainer = el, tabIndex: 0, onKeyDown: (event) => { this.keyDownHandler(event); } },
           h("div", { class: "draggable-list" },
             this._listItems.map((item, index) => {
-              return h("li", { id: 'item_' + this.getItemId(item.label), class: this.ezSelectable ? "selectable-container" : "", key: 'item_' + this.getItemId(item.label) },
+              return h("li", { id: "item_" + this.getItemId(item.label), class: this.ezSelectable ? "selectable-container" : "", key: "item_" + this.getItemId(item.label) },
                 h("div", { class: "draggable" + (item.selected == true ? " selected-item " : "") + (this.ezSelectable == true ? " selectable " : ""), onDragStart: () => this.onDragStart({ item: item, index: index }), onClick: () => { this.setSelection(item); }, onDragLeave: () => this.removeOverClass(), onDragOver: (event) => this.onDragOverItem(event), onDragEnd: () => this.onDragEnd(), onDrop: (event) => this.onDrop(event, { item: item, index: index }), draggable: this.ezDraggable },
                   h("div", { class: "item-content" },
                     this.ezDraggable ? h("span", { class: "draggable-icon" }) : undefined,
@@ -539,9 +539,19 @@ export class EzList {
       "type": "unknown",
       "mutable": true,
       "complexType": {
-        "original": "any[]",
-        "resolved": "any[]",
-        "references": {}
+        "original": "Array<ListGroup | ListItem>",
+        "resolved": "(ListGroup | ListItem)[]",
+        "references": {
+          "Array": {
+            "location": "global"
+          },
+          "ListGroup": {
+            "location": "local"
+          },
+          "ListItem": {
+            "location": "local"
+          }
+        }
       },
       "required": false,
       "optional": false,
@@ -563,7 +573,7 @@ export class EzList {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Define se o componente renderizar\u00E1 os itens separados em grupos.."
+        "text": "Se true os grupos ser\u00E3o exibidos."
       },
       "attribute": "use-groups",
       "reflect": true,
@@ -581,7 +591,7 @@ export class EzList {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Define se o componente ter\u00E1 o comportamento de arrasto de linhas."
+        "text": "Se true habilita `drag and drop` para os itens."
       },
       "attribute": "ez-draggable",
       "reflect": false,
@@ -599,7 +609,7 @@ export class EzList {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Define se os items da lista ser\u00E3o selecion\u00E1veis."
+        "text": "Se true os itens ser\u00E3o selecion\u00E1veis."
       },
       "attribute": "ez-selectable",
       "reflect": false,
@@ -621,7 +631,7 @@ export class EzList {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Define se \u00E9 poss\u00EDvel selecionar mais de um registro.\n\n/**\nFun\u00E7\u00E3o respons\u00E1vel por renderizar um conte\u00FAdo dentro do item da lista."
+        "text": "Define um `builder` para construir o `HTMLElement` do item da lista."
       }
     }
   }; }
@@ -637,12 +647,15 @@ export class EzList {
       "composed": true,
       "docs": {
         "tags": [],
-        "text": "Evento disparado ao modificar ordena\u00E7\u00E3o nas linhas da grade."
+        "text": "Emitido quando acontece a altera\u00E7\u00E3o de estado da lista."
       },
       "complexType": {
-        "original": "ListItem[] | ListGroup[]",
-        "resolved": "ListGroup[] | ListItem[]",
+        "original": "Array<ListItem|ListGroup>",
+        "resolved": "(ListGroup | ListItem)[]",
         "references": {
+          "Array": {
+            "location": "global"
+          },
           "ListItem": {
             "location": "local"
           },
@@ -665,7 +678,7 @@ export class EzList {
         "return": "Promise<void>"
       },
       "docs": {
-        "text": "Respons\u00E1vel por limpar a lista de hist\u00F3rico do componente.",
+        "text": "Limpa o hist\u00F3rico da lista.",
         "tags": []
       }
     },
@@ -681,7 +694,7 @@ export class EzList {
         "return": "Promise<void>"
       },
       "docs": {
-        "text": "Respons\u00E1vel por dar um scroll top no componente da lista.",
+        "text": "Traz o conte\u00FAdo da lista para a \u00E1rea vis\u00EDvel.",
         "tags": []
       }
     },
@@ -706,45 +719,51 @@ export class EzList {
         "return": "Promise<void>"
       },
       "docs": {
-        "text": "Recebe   como argumento um ListItem {label: string} e um booleano que define se o componente deve fazer scroll para exibir o item espec\u00EDfico (opcional).",
+        "text": "Aplica sele\u00E7\u00E3o nas linhas da lista.",
         "tags": []
       }
     },
     "getSelection": {
       "complexType": {
-        "signature": "() => Promise<any>",
+        "signature": "() => Promise<ListItem>",
         "parameters": [],
         "references": {
           "Promise": {
             "location": "global"
+          },
+          "ListItem": {
+            "location": "local"
           }
         },
-        "return": "Promise<any>"
+        "return": "Promise<ListItem>"
       },
       "docs": {
-        "text": "Retorna   o item selecionado.",
+        "text": "Obt\u00E9m o item selecionado.",
         "tags": []
       }
     },
     "getList": {
       "complexType": {
-        "signature": "() => Promise<ListItem[] | ListGroup[]>",
+        "signature": "() => Promise<Array<ListItem | ListGroup>>",
         "parameters": [],
         "references": {
           "Promise": {
             "location": "global"
           },
-          "ListItem": {
+          "ListGroup": {
             "location": "local"
           },
-          "ListGroup": {
+          "ListItem": {
             "location": "local"
+          },
+          "Array": {
+            "location": "global"
           }
         },
-        "return": "Promise<ListItem[] | ListGroup[]>"
+        "return": "Promise<(ListGroup | ListItem)[]>"
       },
       "docs": {
-        "text": "Retorna   a lista de items conforme o modo de uso.",
+        "text": "Obt\u00E9m a lista de items ou grupos.",
         "tags": []
       }
     }

package/dist/collection/components/ez-loading-bar/ez-loading-bar.js

@@ -3,13 +3,17 @@ export class EzLoadingBar {
   constructor() {
     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 (h(Host, null, this._showLoading && h("div", { class: "loading-bar" },
@@ -39,7 +43,7 @@ export class EzLoadingBar {
         "return": "Promise<void>"
       },
       "docs": {
-        "text": "",
+        "text": "Oculta o ez-loading-bar.",
         "tags": []
       }
     },
@@ -55,7 +59,7 @@ export class EzLoadingBar {
         "return": "Promise<void>"
       },
       "docs": {
-        "text": "",
+        "text": "Exibe o ez-loading-bar.",
         "tags": []
       }
     }

package/dist/collection/components/ez-modal/ez-modal.js

@@ -2,16 +2,16 @@ import { Component, Host, h, Prop, Watch, Event } from "@stencil/core";
 export class EzModal {
   constructor() {
     /**
-    * 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) {
@@ -76,7 +76,7 @@ export class EzModal {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Define o tamanho do modal. Devem ser utilizados os tamanhos definidos de colunas como \"col-sd-3\""
+        "text": "Define o tamanho do ez-modal. Devem ser definidas seguindo grid-layout. Exemplo: `col-sd-3`."
       },
       "attribute": "modal-size",
       "reflect": false
@@ -85,15 +85,15 @@ export class EzModal {
       "type": "string",
       "mutable": false,
       "complexType": {
-        "original": "string",
-        "resolved": "string",
+        "original": "\"right\" | \"left\"",
+        "resolved": "\"left\" | \"right\"",
         "references": {}
       },
       "required": false,
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Define o alinhamento do modal. Seus valores podem ser \"right\" ou \"left\""
+        "text": "Define o alinhamento do ez-modal."
       },
       "attribute": "align",
       "reflect": false
@@ -110,7 +110,7 @@ export class EzModal {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Controle de exibi\u00E7\u00E3o do Modal"
+        "text": "Define se o ez-modal est\u00E1 aberto."
       },
       "attribute": "opened",
       "reflect": false,
@@ -128,7 +128,7 @@ export class EzModal {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Define se o modal ser\u00E1 fechado ao clicar ESC"
+        "text": "Define se o ez-modal ser\u00E1 fechado ao clicar `ESC`."
       },
       "attribute": "close-esc",
       "reflect": false,
@@ -161,7 +161,7 @@ export class EzModal {
       "composed": true,
       "docs": {
         "tags": [],
-        "text": "Um evento disparado quando o modal \u00E9 fechado (onEzCloseModal)."
+        "text": "Emitido quando o modal \u00E9 fechado."
       },
       "complexType": {
         "original": "boolean",
@@ -176,7 +176,7 @@ export class EzModal {
       "composed": true,
       "docs": {
         "tags": [],
-        "text": "Um evento disparado quando o modal \u00E9 aberto (onEzOpenModal)."
+        "text": "Emitido quando o modal \u00E9 aberto."
       },
       "complexType": {
         "original": "any",

package/dist/collection/components/ez-modal-container/ez-modal-container.js

@@ -1,10 +1,10 @@
-import { Component, h, Host, Prop, Event } from '@stencil/core';
-import ModalAction from './modal-action';
-import ModalButtonStatus from './modal-button-status';
+import { Component, h, Host, Prop, Event } from "@stencil/core";
+import ModalAction from "./modal-action";
+import ModalButtonStatus from "./modal-button-status";
 export class EzModalContainer {
   constructor() {
     /**
-     * Determina se o cabeçalho com o título deverá ser mostrado
+     * Define se o cabeçalho será mostrado.
      */
     this.showTitleBar = true;
   }
@@ -36,7 +36,7 @@ export class EzModalContainer {
           h("ez-icon", { class: "ez-modal-container__close-icon", size: "medium", iconName: "close" }))),
       h("div", null,
         h("slot", null)),
-      h("div", { class: 'ez-col ez-margin-left--auto' },
+      h("div", { class: "ez-col ez-margin-left--auto" },
         this.cancelIsVisible() ? h("ez-button", { label: this.cancelButtonLabel, enabled: this.cancelButtonStatus !== ModalButtonStatus.DISABLED, onClick: () => this.ezModalAction.emit(ModalAction.CANCEL) }) : undefined,
         this.okIsVisible() ? h("ez-button", { ref: ref => this._okButton = ref, label: this.okButtonLabel, enabled: this.okButtonStatus !== ModalButtonStatus.DISABLED, class: "ez-button--primary ez-margin-left--medium", onClick: () => this.ezModalAction.emit(ModalAction.OK) }) : undefined),
       h("button", { class: "ez-modal-container__focus-ctrl", onFocusin: evt => this.focusFirst(evt) })));
@@ -62,7 +62,7 @@ export class EzModalContainer {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "T\u00EDtulo do modal"
+        "text": "Texto a ser apresentado como t\u00EDtulo do modal."
       },
       "attribute": "modal-title",
       "reflect": false
@@ -79,7 +79,7 @@ export class EzModalContainer {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Subt\u00EDtulo (opcional), geralmente usado para orienta\u00E7\u00E3o do usu\u00E1rio"
+        "text": "Texto do subt\u00EDtulo, geralmente usado para orienta\u00E7\u00E3o do usu\u00E1rio."
       },
       "attribute": "modal-sub-title",
       "reflect": false
@@ -96,7 +96,7 @@ export class EzModalContainer {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Determina se o cabe\u00E7alho com o t\u00EDtulo dever\u00E1 ser mostrado"
+        "text": "Define se o cabe\u00E7alho ser\u00E1 mostrado."
       },
       "attribute": "show-title-bar",
       "reflect": false,
@@ -114,7 +114,7 @@ export class EzModalContainer {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Determina o texto do bot\u00E3o de cancelar"
+        "text": "Define o texto do bot\u00E3o de cancelamento."
       },
       "attribute": "cancel-button-label",
       "reflect": false
@@ -131,7 +131,7 @@ export class EzModalContainer {
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Determina o texto do bot\u00E3o de Ok"
+        "text": "Determina o texto do bot\u00E3o de confirma\u00E7\u00E3o."
       },
       "attribute": "ok-button-label",
       "reflect": false
@@ -140,15 +140,15 @@ export class EzModalContainer {
       "type": "string",
       "mutable": false,
       "complexType": {
-        "original": "string",
-        "resolved": "string",
+        "original": "\"HIDDEN\"|\"ENABLED\"|\"DISABLED\"",
+        "resolved": "\"DISABLED\" | \"ENABLED\" | \"HIDDEN\"",
         "references": {}
       },
       "required": false,
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Varia\u00E7\u00E3o de estado do bot\u00E3o de cancelar: [HIDDEN|ENABLED|DISABLED]"
+        "text": "Define o estado do bot\u00E3o de cancelamento."
       },
       "attribute": "cancel-button-status",
       "reflect": false
@@ -157,15 +157,15 @@ export class EzModalContainer {
       "type": "string",
       "mutable": false,
       "complexType": {
-        "original": "string",
-        "resolved": "string",
+        "original": "\"HIDDEN\"|\"ENABLED\"|\"DISABLED\"",
+        "resolved": "\"DISABLED\" | \"ENABLED\" | \"HIDDEN\"",
         "references": {}
       },
       "required": false,
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "Varia\u00E7\u00E3o de estado do bot\u00E3o de ok: [HIDDEN|ENABLED|DISABLED]"
+        "text": "Define o estado do bot\u00E3o de confirma\u00E7\u00E3o."
       },
       "attribute": "ok-button-status",
       "reflect": false