@sankhyalabs/ezui 1.1.142 → 1.1.145

package/dist/collection/components/ez-card-item/ez-card-item.js

@@ -0,0 +1,86 @@
+import { Component, Event, h, Host, Prop } from '@stencil/core';
+export class EzCardItem {
+  componentWillRender() {
+    this.createDetailList();
+  }
+  createDetailList() {
+    var _a, _b, _c;
+    this._details = { detailsLeft: [], detailsRight: [] };
+    let cont = 0;
+    if ((_a = this.item) === null || _a === void 0 ? void 0 : _a.details) {
+      for (const attribute in this.item.details) {
+        cont < 3 ?
+          this._details.detailsLeft.push({ label: attribute, value: (_b = this.item.details[attribute]) === null || _b === void 0 ? void 0 : _b.toString() }) :
+          this._details.detailsRight.push({ label: attribute, value: (_c = this.item.details[attribute]) === null || _c === void 0 ? void 0 : _c.toString() });
+        cont++;
+      }
+    }
+  }
+  buildDetailContent(detail) {
+    return h("div", { class: "card-item__detail" },
+      h("label", { class: "card-item__detail-label" }, detail.label),
+      ": ",
+      h("label", { class: "card-item__detail-value", innerHTML: detail.value }));
+  }
+  render() {
+    return (h(Host, null, this.item &&
+      h("div", { class: "card-item", onClick: () => { this.ezClick.emit(this.item); } },
+        h("label", { class: "card-item__title", innerHTML: this.item.key + ' - ' + this.item.title }),
+        h("div", { class: "card-item__details" },
+          h("div", { class: "card-item__details-left" }, this._details.detailsLeft.map(detail => {
+            return this.buildDetailContent(detail);
+          })),
+          h("div", { class: "card-item__details-right" }, this._details.detailsRight.map(detail => {
+            return this.buildDetailContent(detail);
+          }))))));
+  }
+  static get is() { return "ez-card-item"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["ez-card-item.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["ez-card-item.css"]
+  }; }
+  static get properties() { return {
+    "item": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "CardItem",
+        "resolved": "CardItem",
+        "references": {
+          "CardItem": {
+            "location": "local"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      }
+    }
+  }; }
+  static get events() { return [{
+      "method": "ezClick",
+      "name": "ezClick",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "complexType": {
+        "original": "CardItem",
+        "resolved": "CardItem",
+        "references": {
+          "CardItem": {
+            "location": "local"
+          }
+        }
+      }
+    }]; }
+}

package/dist/collection/components/ez-collapsible-box/ez-collapsible-box.css

@@ -132,6 +132,10 @@ ez-icon {
   justify-content: space-between;
 }
 
+.collapsible-box__title--no-margin {
+  margin-bottom: 0;
+}
+
 .collapsible-box__content {
   /*private*/
   display: flex;

package/dist/collection/components/ez-collapsible-box/ez-collapsible-box.js

@@ -42,7 +42,8 @@ export class EzCollapsibleBox {
       h("div", { class: "collapsible-box__header" },
         h("button", { onClick: () => this.showHide(), class: "collapsible-box__title" +
             (this.iconPlacement === "right" ? " collapsible-box__title--icon-right" : "") +
-            (this.stretchTitle ? " collapsible-box__title--stretched" : "") },
+            (this.stretchTitle ? " collapsible-box__title--stretched" : "") +
+            (this.value ? " collapsible-box__title--no-margin" : "") },
           h("ez-icon", { slot: "icon", "icon-name": "chevron-right", size: this.getHeaderSize(), class: "collapsible-box__icon collapsible-box__icon--" + this.getHeaderSize() + (this.value ? " collapsible-box__icon--collapsed" : "") }),
           h("label", { class: "collapsible-box__label font--" + this.getHeaderSize(), title: this.label }, this.label))),
       h("div", { class: "collapsible-box__content" + (this.value ? "" : " collapsible-box__content--show") },

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

@@ -3,6 +3,9 @@ import { Component, h, Host, Prop, State, Event, Element, Watch, Method } from "
 import CSSVarsUtils from "../../utils/CSSVarsUtils";
 export class EzComboBox {
   constructor() {
+    this._limitCharsToSearch = 3;
+    this._deboucingTime = 300;
+    this._startLoading = false;
     /**
      * Deixa o campo disponível ou não para interação com usuário.
      */
@@ -141,19 +144,8 @@ export class EzComboBox {
       this._preSelection = undefined;
     }
   }
-  selectOption(opt) {
-    const currentOpt = this.getSelectedOption();
-    if (currentOpt !== opt) {
-      const adjustedOpt = !(opt === null || opt === void 0 ? void 0 : opt.value) ? undefined : opt;
-      this.value = adjustedOpt;
-      this.errorMessage = "";
-      this.ezChange.emit(adjustedOpt);
-    }
-    else {
-      this.observeValue();
-    }
-  }
   updateSource(source) {
+    this._startLoading = false;
     if (source instanceof Promise) {
       source.then(result => this.updateSource(result));
       this.updateVisibleOptions();
@@ -164,12 +156,26 @@ export class EzComboBox {
         this.updateVisibleOptions();
       }
       else {
-        this.value = source;
+        this.selectOption(source);
       }
     }
   }
+  selectOption(newOption) {
+    var _a, _b;
+    const currentOpt = this.getSelectedOption();
+    if (((_a = currentOpt === null || currentOpt === void 0 ? void 0 : currentOpt.value) === null || _a === void 0 ? void 0 : _a.toString()) !== ((_b = newOption === null || newOption === void 0 ? void 0 : newOption.value) === null || _b === void 0 ? void 0 : _b.toString())) {
+      const adjustedOpt = !(newOption === null || newOption === void 0 ? void 0 : newOption.value) ? undefined : newOption;
+      this.value = adjustedOpt;
+      this.errorMessage = "";
+      this.ezChange.emit(this.value);
+    }
+    else {
+      this.observeValue();
+    }
+  }
   loadOptions(mode, argument = "") {
     this._criteria = argument;
+    this._startLoading = true;
     if (this.optionLoader) {
       this.updateSource(this.optionLoader({ mode, argument }));
     }
@@ -226,25 +232,40 @@ export class EzComboBox {
     this.searchMode ? this.loadOptions("ADVANCED") : this.showOptions();
   }
   onTextInputChangeHandler(event) {
+    var _a;
+    this.clearDeboucingTimeout();
+    if (this._startLoading) {
+      this._changeDeboucingTimeout = window.setTimeout(() => {
+        this.onTextInputChangeHandler(event);
+      }, this._deboucingTime);
+      return;
+    }
     if (!this._criteria) {
       this._inputElement.value = event.data;
     }
-    const argument = event.target.value;
+    const argument = (_a = event.target.value) === null || _a === void 0 ? void 0 : _a.trim();
+    const argumentNumber = Number(argument || undefined);
     this._criteria = argument;
-    if (this._criteria) {
+    if (argument && (!isNaN(argumentNumber) || argument.length >= this._limitCharsToSearch)) {
       if (this.searchMode) {
-        if (this._changeDeboucingTimeout) {
-          window.clearTimeout(this._changeDeboucingTimeout);
-        }
         this._changeDeboucingTimeout = window.setTimeout(() => {
-          this.loadOptions("PREDICTIVE", argument);
-        }, 200);
+          this.loadOptions("PREDICTIVE", isNaN(argumentNumber) ? argument : argumentNumber.toString());
+        }, this._deboucingTime);
       }
       else {
         this.updateVisibleOptions();
       }
       this.showOptions();
     }
+    else {
+      this.hideOptions();
+    }
+  }
+  clearDeboucingTimeout() {
+    if (this._changeDeboucingTimeout) {
+      window.clearTimeout(this._changeDeboucingTimeout);
+      this._changeDeboucingTimeout = undefined;
+    }
   }
   onTextInputClickHandler() {
     if (!this.searchMode) {
@@ -530,7 +551,8 @@ export class EzComboBox {
   }; }
   static get states() { return {
     "_preSelection": {},
-    "_visibleOptions": {}
+    "_visibleOptions": {},
+    "_startLoading": {}
   }; }
   static get events() { return [{
       "method": "ezChange",

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

@@ -45,12 +45,20 @@ export class EzForm {
     requiredFields.forEach(field => {
       const value = record[field];
       const fieldElem = this._element.querySelector(`[data-field-name=${field}]`);
-      if (value === null || value === undefined || value === "") {
-        invalidFields.push(field);
-        fieldElem["errorMessage"] = "Essa informação é obrigatória";
-      }
-      else {
-        fieldElem["errorMessage"] = "";
+      /**
+       * TODO: fieldElem vai ser vazio quando o campo está em uma aba que
+       * está escondida.
+       * Temos que tratar esse caso para apresentar a mensagem de erro
+       * na aba, isso será tratado no card: https://sankhya.atlassian.net/browse/SKA-44182
+       */
+      if (fieldElem) {
+        if (value === null || value === undefined || value === "") {
+          invalidFields.push(field);
+          fieldElem["errorMessage"] = "Essa informação é obrigatória";
+        }
+        else {
+          fieldElem["errorMessage"] = "";
+        }
       }
     });
     const isValid = invalidFields.length === 0;

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

@@ -45,7 +45,7 @@ export const buildFromDataUnit = (dataUnit) => {
         .filter(descriptor => descriptor.required)
         .map(descriptor => descriptor.name),
       cleanOnCopyFields: visibleFields
-        .filter(descriptor => { var _a; return (_a = descriptor.properties) === null || _a === void 0 ? void 0 : _a.cleanOnCopy; })
+        .filter(descriptor => { var _a, _b; return ((_a = descriptor.properties) === null || _a === void 0 ? void 0 : _a.cleanOnCopy) || ((_b = descriptor.properties) === null || _b === void 0 ? void 0 : _b.autoNum); })
         .map(descriptor => descriptor.name),
       defaultValues
     });
@@ -57,7 +57,7 @@ function getTabConfig(tab, sheets) {
   return tabConfig || { label: tab, visible: true };
 }
 function sortTabs(a, b) {
-  return a[0].label == 'Geral' ? -1 : (a[0].order || 10000) - (b[0].order || 10000);
+  return a[0].label == '__main' ? -1 : (a[0].order || 10000) - (b[0].order || 10000);
 }
 export const buildFromConfig = (fields, dataUnit) => {
   const sheets = new Map();
@@ -65,9 +65,9 @@ export const buildFromConfig = (fields, dataUnit) => {
   const cleanOnCopyFields = [];
   const defaultValues = {};
   fields.forEach(config => {
-    var _a, _b;
+    var _a, _b, _c;
     if (config.visible !== false) {
-      const tabConfig = getTabConfig(config.tab || "Geral", sheets);
+      const tabConfig = getTabConfig(config.tab || "__main", sheets);
       const descriptor = dataUnit.getField(config.name);
       if (descriptor && tabConfig.visible) {
         if (!sheets.has(tabConfig)) {
@@ -78,11 +78,11 @@ export const buildFromConfig = (fields, dataUnit) => {
         if (isRequired) {
           requiredFields.push(config.name);
         }
-        const clearOnCopy = config.cleanOnCopy === undefined ? (_a = descriptor.properties) === null || _a === void 0 ? void 0 : _a.cleanOnCopy : config.cleanOnCopy;
+        const clearOnCopy = config.cleanOnCopy === undefined ? (((_a = descriptor.properties) === null || _a === void 0 ? void 0 : _a.cleanOnCopy) || ((_b = descriptor.properties) === null || _b === void 0 ? void 0 : _b.autoNum)) : config.cleanOnCopy;
         if (clearOnCopy) {
           cleanOnCopyFields.push(config.name);
         }
-        const defaultValue = config.defaultValue === undefined ? (_b = descriptor.properties) === null || _b === void 0 ? void 0 : _b.defaultValue : config.defaultValue;
+        const defaultValue = config.defaultValue === undefined ? (_c = descriptor.properties) === null || _c === void 0 ? void 0 : _c.defaultValue : config.defaultValue;
         if (defaultValue) {
           defaultValues[config.name] = config.defaultValue;
         }
@@ -108,7 +108,7 @@ export const buildFromConfig = (fields, dataUnit) => {
     .sort(sortTabs)
     .forEach(([key, value]) => {
     metadata.addSheet({
-      label: key.label,
+      label: (key.label === "__main") ? "Principal" : key.label,
       name: key.label,
       items: Array.from(value.values()),
       requiredFields,

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

@@ -11,6 +11,7 @@ export default class AgGridController {
     this.DEFAULT_ROW_HEIGHT = 25;
     this.CHECK_BOX_COL_ID = "checkBoxColumn";
     this.RECORD_ARCHIVE_COL_ID = "__RECORD_ARCHIVE__";
+    this.BLOCK_LOAD_DEBOUNCE = 400;
     this._menuItems = [];
     this._idAttribName = "__record__id__";
     this._isFirstRecordOfPage = true;
@@ -54,6 +55,7 @@ export default class AgGridController {
         rowSelection: this._multipleSelection ? "multiple" : "single",
         serverSideDatasource: this._dataSource,
         sortingOrder: ['desc', 'asc', null],
+        blockLoadDebounceMillis: this.BLOCK_LOAD_DEBOUNCE,
         getRowNodeId: this._dataUnit ? (params) => typeof params === "string" ? params : params[this._idAttribName] : undefined,
         getMainMenuItems: (params) => {
           const column = params.column;

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

@@ -101,7 +101,7 @@ export class EzUpload {
         }
         this._filePointers.set(file.name, uploadingFile);
         uploadingFile.upload(this.urlUpload, this._requestHeaders, (file) => this.updateFeedback(file))
-          .then((files) => files.forEach(ezFile => this.finishUpload(ezFile)))
+          .then((files) => files.forEach(ezFile => this.finishUpload(uploadingFile.name, ezFile)))
           .catch(msg => {
           this.ezCancelWaitingChange.emit();
           this.showError(msg);
@@ -114,8 +114,8 @@ export class EzUpload {
       throw error;
     }
   }
-  finishUpload(ezFile) {
-    this._filePointers.set(ezFile.name, ezFile);
+  finishUpload(key, ezFile) {
+    this._filePointers.set(key, ezFile);
     this.updateValue();
   }
   updateValue() {

package/dist/custom-elements/index.d.ts

@@ -20,6 +20,12 @@ export const EzCalendar: {
   new (): EzCalendar;
 };
 
+interface EzCardItem extends Components.EzCardItem, HTMLElement {}
+export const EzCardItem: {
+  prototype: EzCardItem;
+  new (): EzCardItem;
+};
+
 interface EzCheck extends Components.EzCheck, HTMLElement {}
 export const EzCheck: {
   prototype: EzCheck;