@sankhyalabs/ezui 1.1.131 → 1.1.134

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

@@ -4,7 +4,7 @@ import DataUnitBridge from "./controller/DataUnitBridge";
 export class EzGrid {
   constructor() {
     this._gridController = new AgGridController(false);
-    this._popUpVisible = false;
+    this._popUpGridConfig = false;
     /**
     * Determina o número de linhas de cada página. Caso informado o valor -1
     * não haverá paginação.
@@ -66,6 +66,74 @@ export class EzGrid {
   async quickFilter(term) {
     this._gridController.quickFilter(term);
   }
+  /**
+  * Método para fazer um filtro rápido na grid.
+  */
+  async nextPage() {
+    this._gridController.nextPage();
+  }
+  /**
+  * Método para fazer um filtro rápido na grid.
+  */
+  async previousPage() {
+    this._gridController.previousPage();
+  }
+  /**
+  * Método para fazer um filtro rápido na grid.
+  */
+  async hasNextPage() {
+    return new Promise(resolve => {
+      resolve(this._navigationHasNext);
+    });
+  }
+  /**
+  * Método para fazer um filtro rápido na grid.
+  */
+  async hasPreviousPage() {
+    return new Promise(resolve => {
+      resolve(this._navigationHasPrevious);
+    });
+  }
+  /**
+  * Método para verificar se o registro selecionado é o ultimo da página.
+  */
+  async isLastOfPage() {
+    return new Promise(resolve => {
+      resolve(this._gridController.isLastOfPage());
+    });
+  }
+  /**
+  * Método para verificar se o registro selecionado é o primeiro da página.
+  */
+  async isFirstOfPage() {
+    return new Promise(resolve => {
+      resolve(this._gridController.isFirstOfPage());
+    });
+  }
+  /**
+  * Método para navegar para o proxímo registro da grid.
+  */
+  async nextRecord() {
+    this._gridController.nextRecord();
+  }
+  /**
+  * Método para navegar para o registro anterior da grid.
+  */
+  async previousRecord() {
+    this._gridController.previousRecord();
+  }
+  /**
+  * Método para verificar se existem proximos registros.
+  */
+  async hasNextRecord() {
+    return Promise.resolve(this._gridController.hasNextRecord());
+  }
+  /**
+  * Método para verificar se existem registros anteriores.
+  */
+  async hasPreviousRecord() {
+    return Promise.resolve(this._gridController.hasPreviousRecord());
+  }
   componentWillLoad() {
     if (this.dataUnit) {
       this._dataUnitBridge = new DataUnitBridge(this._gridController, this.dataUnit);
@@ -138,7 +206,7 @@ export class EzGrid {
   componentDidLoad() {
     this._gridController.initDatagrid(this._container, {
       onColumnStateChange: (type, state, info) => this.onColumnStateChange(type, state, info),
-      onSelectionChange: (selection) => this.ezSelectionChange.emit(selection),
+      onSelectionChange: (state) => this.ezSelectionChange.emit(state.selection),
       onPaginationChange: (status) => {
         this._navigationHasPrevious = status.hasPrevious;
         this._navigationHasNext = status.hasNext;
@@ -174,34 +242,32 @@ export class EzGrid {
       h("div", { class: "ez-text ez-text--primary ez-text--medium ez-margin-right--medium" },
         h("strong", { class: "ez-text ez-text--primary ez-text--medium" }, `${this._navigationFirstRow}-${this._navigationLastRow}`),
         ` de ${this._navigationTotalRows}`),
-      h("ez-button", { size: "small", iconName: "chevron-left", class: "ez-margin-right--medium", mode: "icon", enabled: this._navigationHasPrevious, onClick: () => this._gridController.previousPage(), label: "P\u00E1gina anterior" }),
-      h("ez-button", { size: "small", iconName: "chevron-right", class: "ez-margin-right--medium", mode: "icon", enabled: this._navigationHasNext, onClick: () => this._gridController.nextPage(), label: "Pr\u00F3xima P\u00E1gina" })
+      h("ez-button", { size: "small", iconName: "chevron-left", class: "ez-margin-right--medium", mode: "icon", enabled: this._navigationHasPrevious, onClick: () => this.previousPage(), label: "P\u00E1gina anterior" }),
+      h("ez-button", { size: "small", iconName: "chevron-right", class: "ez-margin-right--medium", mode: "icon", enabled: this._navigationHasNext, onClick: () => this.nextPage(), label: "Pr\u00F3xima P\u00E1gina" })
     ];
   }
   applyConfig(config) {
     this._gridController.setColumnsState(config.columns);
-    this.closeConfig();
+    this.closeGridConfig();
   }
-  closeConfig() {
-    this._popUpVisible = false;
+  closeGridConfig() {
+    this._popUpGridConfig = false;
   }
-  openConfig() {
+  openGridConfig() {
     this._gridConfig.columns = this._gridController.getColumnsState().filter(c => c.name);
     this._gridConfig.selectedTab = "Colunas";
-    this._popUpVisible = true;
+    this._popUpGridConfig = true;
   }
   render() {
     return (h(Host, null,
       h("div", { class: "ez-box ez-box--shadow ez-padding--medium grid-header" },
         h("div", { class: "grid-header__container" },
           h("slot", { name: "leftButtons" })),
-        h("div", { class: "grid-header__container" },
-          this.getPaginationControl(),
-          h("ez-button", { size: "small", iconName: "settings", class: "ez-button--secondary", mode: "icon", onClick: () => { this.openConfig(); } }))),
+        h("div", { class: "grid-header__container" }, this.getPaginationControl())),
       h("div", { class: "grid__container ez-grid", ref: elem => this._container = elem }),
       h("div", { class: "grid__footer" }),
-      h("ez-modal", { modalSize: "small", closeEsc: true, closeOutsideClick: true, opened: this._popUpVisible, onEzCloseModal: () => this._popUpVisible = false },
-        h("grid-config", { ref: ref => this._gridConfig = ref, config: this.config, selectedTab: "Colunas", onConfigFinish: evt => { this.applyConfig(evt.detail); this.configChange.emit(evt.detail); }, onConfigCancel: _evt => this.closeConfig() }))));
+      h("ez-modal", { modalSize: "small", closeEsc: false, closeOutsideClick: false, opened: this._popUpGridConfig, onEzCloseModal: () => this.closeGridConfig() },
+        h("grid-config", { ref: ref => this._gridConfig = ref, config: this.config, selectedTab: "Colunas", onConfigFinish: evt => { this.applyConfig(evt.detail); this.configChange.emit(evt.detail); }, onConfigCancel: _evt => this.closeGridConfig() }))));
   }
   static get is() { return "ez-grid"; }
   static get encapsulation() { return "scoped"; }
@@ -312,7 +378,7 @@ export class EzGrid {
     "_navigationFirstRow": {},
     "_navigationLastRow": {},
     "_navigationTotalRows": {},
-    "_popUpVisible": {}
+    "_popUpGridConfig": {}
   }; }
   static get events() { return [{
       "method": "ezColumnStateChange",
@@ -591,6 +657,178 @@ export class EzGrid {
         "text": "M\u00E9todo para fazer um filtro r\u00E1pido na grid.",
         "tags": []
       }
+    },
+    "nextPage": {
+      "complexType": {
+        "signature": "() => Promise<void>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<void>"
+      },
+      "docs": {
+        "text": "M\u00E9todo para fazer um filtro r\u00E1pido na grid.",
+        "tags": []
+      }
+    },
+    "previousPage": {
+      "complexType": {
+        "signature": "() => Promise<void>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<void>"
+      },
+      "docs": {
+        "text": "M\u00E9todo para fazer um filtro r\u00E1pido na grid.",
+        "tags": []
+      }
+    },
+    "hasNextPage": {
+      "complexType": {
+        "signature": "() => Promise<boolean>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<boolean>"
+      },
+      "docs": {
+        "text": "M\u00E9todo para fazer um filtro r\u00E1pido na grid.",
+        "tags": []
+      }
+    },
+    "hasPreviousPage": {
+      "complexType": {
+        "signature": "() => Promise<boolean>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<boolean>"
+      },
+      "docs": {
+        "text": "M\u00E9todo para fazer um filtro r\u00E1pido na grid.",
+        "tags": []
+      }
+    },
+    "isLastOfPage": {
+      "complexType": {
+        "signature": "() => Promise<boolean>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<boolean>"
+      },
+      "docs": {
+        "text": "M\u00E9todo para verificar se o registro selecionado \u00E9 o ultimo da p\u00E1gina.",
+        "tags": []
+      }
+    },
+    "isFirstOfPage": {
+      "complexType": {
+        "signature": "() => Promise<boolean>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<boolean>"
+      },
+      "docs": {
+        "text": "M\u00E9todo para verificar se o registro selecionado \u00E9 o primeiro da p\u00E1gina.",
+        "tags": []
+      }
+    },
+    "nextRecord": {
+      "complexType": {
+        "signature": "() => Promise<void>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<void>"
+      },
+      "docs": {
+        "text": "M\u00E9todo para navegar para o prox\u00EDmo registro da grid.",
+        "tags": []
+      }
+    },
+    "previousRecord": {
+      "complexType": {
+        "signature": "() => Promise<void>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<void>"
+      },
+      "docs": {
+        "text": "M\u00E9todo para navegar para o registro anterior da grid.",
+        "tags": []
+      }
+    },
+    "hasNextRecord": {
+      "complexType": {
+        "signature": "() => Promise<boolean>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<boolean>"
+      },
+      "docs": {
+        "text": "M\u00E9todo para verificar se existem proximos registros.",
+        "tags": []
+      }
+    },
+    "hasPreviousRecord": {
+      "complexType": {
+        "signature": "() => Promise<boolean>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<boolean>"
+      },
+      "docs": {
+        "text": "M\u00E9todo para verificar se existem registros anteriores.",
+        "tags": []
+      }
+    },
+    "openGridConfig": {
+      "complexType": {
+        "signature": "() => Promise<void>",
+        "parameters": [],
+        "references": {},
+        "return": "Promise<void>"
+      },
+      "docs": {
+        "text": "",
+        "tags": []
+      }
     }
   }; }
   static get watchers() { return [{

package/dist/collection/components/ez-grid/subcomponents/gridconfig/grid-config.js

@@ -1,12 +1,14 @@
 import { StringUtils } from '@sankhyalabs/core';
 import { Component, Event, h, Host, Prop } from '@stencil/core';
 import { getSpritePath } from '../../../../utils/AssetsUtils';
+import ApplicationUtils from '../../../../utils/ApplicationUtils';
 export class GridConfig {
   constructor() {
     this._orderListItems = [];
     this._orderPriorityList = [];
     this._columListItems = [];
     this._selectedIndex = -1;
+    this._dataChanged = false;
     this.selectedTab = "Colunas";
   }
   /* Creation Methods */
@@ -84,6 +86,7 @@ export class GridConfig {
   }
   updateOrder(sortOrder, updatedItemLabel) {
     var _a;
+    this._dataChanged = true;
     let newList = [...this.columns];
     let newItem = newList.find(item => item.label === updatedItemLabel);
     if (newItem) {
@@ -112,6 +115,7 @@ export class GridConfig {
   switchColumnGroup(ev, switchedItem) {
     ev.stopPropagation();
     let newList = [...this._columListItems];
+    this._dataChanged = true;
     if (ev.detail === true) {
       let hiddenGroup = newList.find(group => group.group === "Ocultas");
       let index = hiddenGroup.items.findIndex(item => item.label === switchedItem.label);
@@ -151,6 +155,9 @@ export class GridConfig {
       });
     });
     this.columns = newColumnList;
+    this._dataChanged = false;
+    this.closeConfig();
+    ApplicationUtils.info("As configurações foram salvas com sucesso!");
     this.save();
   }
   save() {
@@ -333,13 +340,46 @@ export class GridConfig {
     return false;
   }
   closeConfig() {
-    this.configCancel.emit();
-    this._orderList.clearHistory();
+    this._orderList.scrollToTop();
+    this._columnList.scrollToTop();
+    this._searchElement.value = "";
+    if (this._dataChanged) {
+      let options = {
+        canClose: false,
+        labelCancel: "Descartar",
+        labelConfirm: "Salvar",
+        btnConfirmDanger: false
+      };
+      ApplicationUtils.confirm("Aviso", "As alterações realizadas serão descartadas. Gostaria de salvar antes de sair?", null, false, options)
+        .then(response => {
+        if (!response) {
+          this._dataChanged = false;
+          this.configCancel.emit();
+          this._orderList.clearHistory();
+        }
+        else {
+          this.finish();
+        }
+      });
+    }
+    else {
+      this.configCancel.emit();
+      this._orderList.clearHistory();
+    }
   }
   /* Handlers */
   handleTabChange(ev) {
     var _a;
     if ((_a = ev === null || ev === void 0 ? void 0 : ev.target) === null || _a === void 0 ? void 0 : _a.selectedTab) {
+      if (this.selectedTab !== ev.target.selectedTab) {
+        if (ev.target.selectedTab === "Colunas") {
+          this._orderList.scrollToTop();
+        }
+        else if (ev.target.selectedTab === "Ordenação das linhas") {
+          this._columnList.scrollToTop();
+        }
+        this._searchElement.value = "";
+      }
       if (ev.target.selectedTab === "Ordenação das linhas") {
         this.createOrderList();
       }
@@ -351,6 +391,7 @@ export class GridConfig {
     if (ev.detail) {
       let visibleItems = (_a = ev.detail.find(group => group.group === "Visíveis")) === null || _a === void 0 ? void 0 : _a.items;
       if (visibleItems) {
+        this._dataChanged = true;
         this._orderListItems = visibleItems;
       }
     }
@@ -359,6 +400,7 @@ export class GridConfig {
     if (ev.detail) {
       let orderPriorityList = ev.detail;
       if (orderPriorityList) {
+        this._dataChanged = true;
         this._orderPriorityList = orderPriorityList;
       }
     }

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

@@ -52,6 +52,17 @@ export class EzList {
     this._listItemsHistory = [];
   }
   /**
+  * Responsável por dar um scroll top no componente da lista.
+  */
+  async scrollToTop() {
+    if (this.useGroups) {
+      this._element.shadowRoot.querySelector('.group-container').scrollTop = 0;
+    }
+    else {
+      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).
   */
   async setSelection(selectedItem, scrollToOption) {
@@ -658,6 +669,22 @@ export class EzList {
         "tags": []
       }
     },
+    "scrollToTop": {
+      "complexType": {
+        "signature": "() => Promise<void>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<void>"
+      },
+      "docs": {
+        "text": "Respons\u00E1vel por dar um scroll top no componente da lista.",
+        "tags": []
+      }
+    },
     "setSelection": {
       "complexType": {
         "signature": "(selectedItem: ListItem, scrollToOption?: boolean) => Promise<void>",

package/dist/collection/components/ez-time-input/ez-time-input.js

@@ -1,7 +1,6 @@
 import { Element, Component, Prop, h, Watch, Host, Method } from "@stencil/core";
 import { TimeFormatter, MaskFormatter, NumberUtils } from "@sankhyalabs/core";
 import CSSVarsUtils from "../../utils/CSSVarsUtils";
-import { getSpritePath } from "../../utils/AssetsUtils";
 export class EzTimeInput {
   constructor() {
     /**
@@ -103,7 +102,7 @@ export class EzTimeInput {
   render() {
     return (h(Host, null,
       h("ez-text-input", { ref: (el) => this._inputElem = el, value: this.viewValue, enabled: this.enabled, label: this.label, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); }, errorMessage: this.errorMessage, mode: this.mode },
-        h("ez-icon", { slot: "leftIcon", href: getSpritePath("timer-outline") }))));
+        h("ez-icon", { slot: "leftIcon", iconName: "timer-outline" }))));
   }
   static get is() { return "ez-time-input"; }
   static get encapsulation() { return "shadow"; }

package/dist/collection/utils/interfaces/PageableComponent.js

@@ -0,0 +1 @@
+export {};