@sankhyalabs/ezui 1.1.104 → 1.1.107

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

@@ -1,4 +1,4 @@
-import { Component, h, Host, Prop, Element, forceUpdate, Method } from "@stencil/core";
+import { Component, h, Host, Prop, Element, forceUpdate, Method, Watch } from "@stencil/core";
 import { DataUnit, Action, DataUnitAction } from "@sankhyalabs/core";
 import { FormSheet } from "./structure/FormSheet";
 import { buildFromConfig, buildFromDataUnit } from "./structure/FormSheetMetadata";
@@ -30,6 +30,9 @@ export class EzForm {
       accept();
     });
   }
+  configChanged() {
+    this.processMetadata();
+  }
   validateRequired(requiredFields, record) {
     const invalidFields = [];
     requiredFields.forEach(field => {
@@ -222,4 +225,8 @@ export class EzForm {
     }
   }; }
   static get elementRef() { return "_element"; }
+  static get watchers() { return [{
+      "propName": "config",
+      "methodName": "configChanged"
+    }]; }
 }

package/dist/collection/components/ez-form/fieldbuilder/tpl/CheckBox.tpl.js

@@ -6,6 +6,6 @@ export const buildCheckBox = (fieldConfig) => {
   return buildField(fieldConfig.name, fieldConfig.label, fieldConfig.readOnly, false);
 };
 function buildField(fieldName, fieldLabel, readOnly, switchMode = false) {
-  return (h("div", { class: "col col--sd-12 col--tb-3 padding--small align--middle padding-bottom--large" },
+  return (h("div", { class: "col col--sd-12 col--tb-3 align--middle padding-horizontal--small padding-bottom--large" },
     h("ez-check", { enabled: !readOnly, label: fieldLabel, mode: switchMode ? "switch" : "regular", "data-field-name": fieldName, key: fieldName })));
 }

package/dist/collection/components/ez-form/fieldbuilder/tpl/ComboBox.tpl.js

@@ -9,6 +9,6 @@ export const buildComboBox = ({ name, label, readOnly }, properties) => {
   else {
     options = prop;
   }
-  return (h("div", { class: "col col--sd-12 col--tb-3 padding--small" },
+  return (h("div", { class: "col col--sd-12 col--tb-3 padding-horizontal--small" },
     h("ez-combo-box", { enabled: !readOnly, label: label, "data-field-name": name, key: name, options: options })));
 };

package/dist/collection/components/ez-form/fieldbuilder/tpl/DateInput.tpl.js

@@ -1,13 +1,13 @@
 import { h } from "@stencil/core";
 export const buildDate = ({ name, label, readOnly }) => {
-  return (h("div", { class: "col col--sd-12 col--tb-3 padding--small" },
+  return (h("div", { class: "col col--sd-12 col--tb-3 padding-horizontal--small" },
     h("ez-date-input", { enabled: !readOnly, label: label, "data-field-name": name, key: name })));
 };
 export const buildTime = ({ name, label }) => {
-  return (h("div", { class: "col col--sd-12 col--tb-3 padding--small" },
+  return (h("div", { class: "col col--sd-12 col--tb-3 padding-horizontal--small" },
     h("ez-time-input", { label: label, "data-field-name": name, key: name })));
 };
 export const buildTimeDate = ({ name, label }) => {
-  return (h("div", { class: "col col--sd-12 col--tb-3 padding--small" },
+  return (h("div", { class: "col col--sd-12 col--tb-3 padding-horizontal--small" },
     h("ez-date-time-input", { label: label, "data-field-name": name, key: name })));
 };

package/dist/collection/components/ez-form/fieldbuilder/tpl/FileInput.tpl.js

@@ -1,5 +1,5 @@
 import { h } from "@stencil/core";
 export const buildFile = ({ name, label, readOnly }) => {
-  return (h("div", { class: "col col--sd-12 padding--small" },
+  return (h("div", { class: "col col--sd-12 padding-horizontal--small" },
     h("ez-upload", { enabled: !readOnly, label: label, urlUpload: "", requestHeaders: "", maxFiles: 10, "data-field-name": name, key: name })));
 };

package/dist/collection/components/ez-form/fieldbuilder/tpl/NumberInput.tpl.js

@@ -8,6 +8,6 @@ export const buildInteger = ({ name, label, readOnly }) => {
   return buildNumeric(name, label, readOnly, 0, 0);
 };
 function buildNumeric(fieldName, fieldLabel, readOnly, precision, prettyPrecision) {
-  return (h("div", { class: "col col--sd-12 col--tb-3 padding--small" },
+  return (h("div", { class: "col col--sd-12 col--tb-3 padding-horizontal--small" },
     h("ez-number-input", { enabled: !readOnly, label: fieldLabel, precision: precision, prettyPrecision: prettyPrecision, "data-field-name": fieldName, key: fieldName })));
 }

package/dist/collection/components/ez-form/fieldbuilder/tpl/SearchInput.tpl.js

@@ -1,5 +1,5 @@
 import { h } from "@stencil/core";
 export const buildSearch = ({ name, label, readOnly }) => {
-  return (h("div", { class: "col col--sd-12 col--tb-3 padding--small" },
+  return (h("div", { class: "col col--sd-12 col--tb-3 padding-horizontal--small" },
     h("ez-search", { enabled: !readOnly, label: label, "data-field-name": name, key: name })));
 };

package/dist/collection/components/ez-form/fieldbuilder/tpl/TextArea.tpl.js

@@ -1,5 +1,5 @@
 import { h } from "@stencil/core";
 export const buildTextArea = ({ name, label, readOnly }) => {
-  return (h("div", { class: "col col--sd-12 padding--small", key: name },
+  return (h("div", { class: "col col--sd-12 padding-horizontal--small", key: name },
     h("ez-text-area", { enabled: !readOnly, label: label, "data-field-name": name })));
 };

package/dist/collection/components/ez-form/fieldbuilder/tpl/TextInput.tpl.js

@@ -1,5 +1,5 @@
 import { h } from "@stencil/core";
 export const buildTextInput = ({ name, label }) => {
-  return (h("div", { class: "col col--sd-12 col--tb-3 padding--small" },
+  return (h("div", { class: "col col--sd-12 col--tb-3 padding-horizontal--small" },
     h("ez-text-input", { label: label, "data-field-name": name, key: name })));
 };

package/dist/collection/components/ez-form/structure/FormSheet.js

@@ -1,5 +1,6 @@
 import { h } from "@stencil/core";
 import { FormItem } from "./FormItem";
 export const FormSheet = ({ store, source }) => {
-  return (h("div", { class: "box__container" }, source.items.map(item => h(FormItem, { store: store, source: item }))));
+  return (h("div", { class: "box__container" },
+    h("div", { class: "row padding-vertical--small" }, source.items.map(item => h(FormItem, { store: store, source: item })))));
 };

package/dist/collection/components/ez-grid/controller/ag-grid/AgGridController.js

@@ -4,7 +4,7 @@ import gridTerms from "./i18n/pt-BR.js";
 import HeaderColumnTemplate from "./template/HeaderColumnTemplate.js";
 import DataSource from "./DataSource";
 import { DataType } from "@sankhyalabs/core";
-import { SortMode } from "@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata";
+import { SortMode, UserInterface } from "@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata";
 export default class AgGridController {
   constructor(enterprise) {
     this._menuItems = [];
@@ -40,6 +40,7 @@ export default class AgGridController {
         serverSideStoreType: "partial",
         rowSelection: this._multipleSelection ? "multiple" : "single",
         serverSideDatasource: new DataSource(this._dataUnit, this._serverURL),
+        getRowNodeId: (params) => params.__record__id__,
         getMainMenuItems: (params) => {
           const column = params.column;
           const items = [column.isPinned() ? "clearPinned" : "pinLeft", "separator"];
@@ -48,6 +49,16 @@ export default class AgGridController {
             action: () => m.action(column.getColId(), m.name)
           }));
           return items;
+        },
+        onViewportChanged: (evt) => {
+          if (this._gridOptions && this._gridOptions.api && evt && evt.api) {
+            if (this._dataUnit.getSelection()) {
+              this._dataUnit.getSelection().forEach(id => {
+                let node = evt.api.getRowNode(id);
+                node.setSelected(true);
+              });
+            }
+          }
         }
       };
       this.setOptionsEvents(this._gridOptions);
@@ -218,7 +229,14 @@ export default class AgGridController {
       }
     }
     if ((source === null || source === void 0 ? void 0 : source.userInterface) === "SEARCH") {
-      return ((_a = params === null || params === void 0 ? void 0 : params.value) === null || _a === void 0 ? void 0 : _a.value) + " - " + ((_b = params === null || params === void 0 ? void 0 : params.value) === null || _b === void 0 ? void 0 : _b.label);
+      if (params.value !== undefined) {
+        return ((_a = params === null || params === void 0 ? void 0 : params.value) === null || _a === void 0 ? void 0 : _a.value) + " - " + ((_b = params === null || params === void 0 ? void 0 : params.value) === null || _b === void 0 ? void 0 : _b.label);
+      }
+    }
+    if ((source === null || source === void 0 ? void 0 : source.userInterface) === UserInterface.DATE || (source === null || source === void 0 ? void 0 : source.userInterface) === UserInterface.DATETIME) {
+      if (params.value !== undefined) {
+        return params.value.toLocaleDateString();
+      }
     }
   }
   buildColState(source) {

package/dist/collection/components/ez-text-area/ez-text-area.css

@@ -113,7 +113,7 @@ textarea:disabled {
   /*private*/
   min-height: 16px;
   min-width: 100%;
-  margin-top: 2px;
+  margin-top: 3px;
   line-height: 12px;
   overflow: hidden;
   text-overflow: ellipsis;

package/dist/collection/components/ez-text-area/ez-text-area.js

@@ -22,7 +22,7 @@ export class EzTextArea {
     }
   }
   updateInputValue() {
-    this._inputElem.value = this.value;
+    this._inputElem.value = this.value === undefined ? "" : this.value;
     this.handleChange();
     this.adjustFloatingLabel();
     this.ezChange.emit(this.value);

package/dist/collection/components/ez-text-input/ez-text-input.css

@@ -116,10 +116,9 @@ input.text--right {
 
 .message-box {
   /*private*/
-  display: flex;
   min-height: 16px;
   min-width: 100%;
-  margin-top: 2px;
+  margin-top: 3px;
   line-height: 12px;
   overflow: hidden;
   text-overflow: ellipsis;

package/dist/collection/components/ez-toast/ez-toast.css

@@ -21,7 +21,7 @@
   bottom: 100px;
   z-index: var(--ez-toast__container-z-index);
   left: 100px;
-  width: 30%;
+  width: 280px;
   box-sizing: border-box;
   background-color: var(--ez-toast__container--background-color);
   border-radius: 6px;
@@ -37,7 +37,11 @@
   font-size: 14px;
   width: 90%;
   overflow: hidden;
-  white-space: nowrap;
+  word-break: break-all;
+  height: auto;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 4;
+  display: -webkit-box;
   text-overflow: ellipsis;
 }
 
@@ -47,8 +51,10 @@
 }
 
 .btn-close {
+  margin-top: 3px;
   display: flex;
   justify-content: flex-end;
+  align-self: flex-start;
   padding: 0;
   outline: none;
   width: 10%;

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

@@ -9,6 +9,10 @@ export class EzToast {
     * Adiciona ícone de check no componente.
     */
     this.useIcon = false;
+    /**
+    * Controla o uso do icone de fechar o toast.
+    */
+    this.canClose = true;
   }
   /**
   * Exibe o componente na tela.
@@ -23,14 +27,11 @@ export class EzToast {
   }
   render() {
     return (h("div", { ref: (el) => this.container = el, class: "toast__container" },
-      this.useIcon ?
-        h("slot", { name: "icon" })
-        : undefined,
-      h("div", { class: this.useIcon ? "message__container message__conteiner--icon" : "message__container", title: this.message },
-        " ",
-        this.message,
-        " "),
-      h("button", { class: "btn-close", onClick: () => { this.container.classList.remove("toast__container--oppened"); this.container.style.animation = `none`; } })));
+      this.useIcon &&
+        h("slot", { name: "icon" }),
+      h("div", { class: this.useIcon ? "message__container message__conteiner--icon" : "message__container", title: this.message, innerHTML: this.message }),
+      this.canClose &&
+        h("button", { class: "btn-close", onClick: () => { this.container.classList.remove("toast__container--oppened"); this.container.style.animation = `none`; } })));
   }
   static get is() { return "ez-toast"; }
   static get encapsulation() { return "shadow"; }
@@ -93,6 +94,24 @@ export class EzToast {
       "attribute": "use-icon",
       "reflect": false,
       "defaultValue": "false"
+    },
+    "canClose": {
+      "type": "boolean",
+      "mutable": true,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Controla o uso do icone de fechar o toast."
+      },
+      "attribute": "can-close",
+      "reflect": false,
+      "defaultValue": "true"
     }
   }; }
   static get methods() { return {

package/dist/collection/utils/ApplicationUtils.js

@@ -18,14 +18,19 @@ export default class ApplicationUtils {
   static async confirm(title, message, icon = null, critical = false) {
     return ApplicationUtils.showDialog(title, message, icon, true, critical);
   }
-  static async info(message) {
+  static async info(message, options = ApplicationUtils.defaultMessageOptions) {
     let toast = document.querySelector("ez-toast");
     if (!toast) {
       toast = document.createElement("ez-toast");
       window.document.body.appendChild(toast);
     }
+    toast.canClose = options.canClose;
     toast.message = message;
     toast.fadeTime = 4000;
     toast.show();
   }
 }
+ApplicationUtils.defaultMessageOptions = {
+  canClose: true
+};
+;