@sankhyalabs/ezui 0.0.0-bugfix-dev-KB-78812-2.0 → 0.0.0-bugfix-dev-KB-76362.1

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

@@ -6,6 +6,8 @@
   --ez-text-input--width: 100%;
   /*@doc Define a largura do slot que contém o ícone.*/
   --ez-text-input__icon--width: 48px;
+  --ez-text-input__icon--left--width: var(--ez-text-input__icon--width);
+  --ez-text-input__icon--right--width: var(--ez-text-input__icon--width);
   /*@doc Define a altura do componente em modo "slim".*/
   --ez-text-input--height--slim: 32px;
 
@@ -46,9 +48,6 @@
   --ez-text-input__input--noborder-color: white;
   /*@doc Define o padding do input*/
   --ez-text-input__input--padding: var(--space--medium, 6px);
-  /*@doc Define a cor do placeholder do input.*/
-  --ez-text-input__placeholder--color: var(--text--secondary, #a2abb9);
-
 
   /* message box */
   /*@doc Define o tamanho da fonte da mensagem abaixo do input.*/
@@ -105,6 +104,8 @@ input {
   color: var(--ez-text-input--color);
   font-weight: var(--ez-text-input--font-weight);
   padding: var(--ez-text-input__input--padding);
+  text-overflow: ellipsis;
+  overflow: hidden;
 }
 
 input:disabled {
@@ -122,11 +123,11 @@ input:focus {
 }
 
 input.icon--left {
-  padding-left: var(--ez-text-input__icon--width);
+  padding-left: var(--ez-text-input__icon--left--width);
 }
 
 input.icon--right { 
-  padding-right: var(--ez-text-input__icon--width);
+  padding-right: var(--ez-text-input__icon--right--width);
 }
 
 input.hasError {
@@ -203,25 +204,23 @@ input:read-only {
   cursor: not-allowed;
 }
 
+.input__label--left.input__label--right {
+  left: calc(var(--ez-text-input__icon--left--width) + 2px);
+  /*borda*/
+  width: calc(100% - (var(--ez-text-input__icon--right--width) + var(--ez-text-input__icon--left--width)));
+}
 .input__label--left {
   /*public*/
   text-align: left;
-  left: calc(var(--ez-text-input__icon--width) + 2px);
+  left: calc(var(--ez-text-input__icon--left--width) + 2px);
   /*borda*/
-  width: calc(100% - var(--ez-text-input__icon--width));
+  width: calc(100% - var(--ez-text-input__icon--left--width));
 }
 
 .input__label--right {
   /*public*/
-  right: var(--ez-text-input__icon--width);
-  width: calc(100% - var(--ez-text-input__icon--width));
-}
-
-/* ISSO TA ERRADO CRIAR INPUT__LABEL--BOTH */
-.input__label--left.input__label--right {
-  left: calc(var(--ez-text-input__icon--width) + 2px);
-  /*borda*/
-  width: calc(100% - var(--ez-text-input__icon--width) * 2);
+  right: var(--ez-text-input__icon--right--width);
+  width: calc(100% - var(--ez-text-input__icon--right--width));
 }
 
 .input--with--label {
@@ -241,18 +240,45 @@ input:read-only {
   font-weight: bold;
 }
 
-.input--slim::-webkit-input-placeholder,  /* Edge */
-  .input--slim:-moz-placeholder,            /* Firefox 4-18 */
-  .input--slim::-moz-placeholder,           /* Firefox 19+ */
-  .input--slim:-ms-input-placeholder,       /* IE 10-11 */
-  .input--slim::placeholder {               /* Modern browsers */
-    /*public*/
-    font-family: var(--ez-text-input--font-family);
-    font-size: var(--ez-text-input--font-size);
-    font-weight: var(--ez-text-input--font-weight);
-    color: var(--ez-text-input__placeholder--color);
-  }
+.input--slim::-webkit-input-placeholder { /* Edge */
+  /*public*/
+  font-family: var(--ez-text-input--font-family);
+  font-size: var(--ez-text-input--font-size);
+  font-weight: var(--ez-text-input--font-weight);
+  color: var(--ez-text-input--color);
+}
 
+.input--slim:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
+  /*public*/
+  font-family: var(--ez-text-input--font-family);
+  font-size: var(--ez-text-input--font-size);
+  font-weight: var(--ez-text-input--font-weight);
+  color: var(--ez-text-input--color);
+}
+
+.input--slim::-moz-placeholder { /* Mozilla Firefox 19+ */
+  /*public*/
+  font-family: var(--ez-text-input--font-family);
+  font-size: var(--ez-text-input--font-size);
+  font-weight: var(--ez-text-input--font-weight);
+  color: var(--ez-text-input--color);
+}
+
+.input--slim:-ms-input-placeholder { /* Internet Explorer 10-11 */
+  /*public*/
+  font-family: var(--ez-text-input--font-family);
+  font-size: var(--ez-text-input--font-size);
+  font-weight: var(--ez-text-input--font-weight);
+  color: var(--ez-text-input--color);
+}
+
+.input--slim::placeholder {
+  /*public*/
+  font-family: var(--ez-text-input--font-family);
+  font-size: var(--ez-text-input--font-size);
+  font-weight: var(--ez-text-input--font-weight);
+  color: var(--ez-text-input--color);
+}
 
 .input--slim:disabled::-webkit-input-placeholder, /* WebKit browsers */
 .input--slim:disabled:-moz-placeholder, /* Mozilla Firefox 4 to 18 */

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

@@ -7,13 +7,11 @@ export class EzTextInput {
     this.enabled = true;
     this.errorMessage = undefined;
     this.mask = undefined;
-    this.cleanValueMask = false;
     this.canShowError = true;
     this.restrict = undefined;
     this.mode = "regular";
     this.noBorder = false;
     this.password = false;
-    this.autoFocus = false;
   }
   observeErrorMessage() {
     if (this._inputElem) {
@@ -123,12 +121,7 @@ export class EzTextInput {
     const value = this._inputElem.value;
     if (value && this._maskFormatter) {
       try {
-        if (this.cleanValueMask) {
-          this.applyMask(value);
-        }
-        else {
-          this._inputElem.value = this._maskFormatter.format(value);
-        }
+        this._inputElem.value = this._maskFormatter.format(value);
       }
       catch (e) {
         this.errorMessage = e.message;
@@ -146,34 +139,8 @@ export class EzTextInput {
   }
   controlChangeValue() {
     if (this._inputElem && (this.value || '') !== this._inputElem.value) {
-      if (this.cleanValueMask) {
-        this.value = this._maskFormatter.removeMask(this._inputElem.value);
-      }
-      else {
-        this.value = this._inputElem.value;
-      }
-    }
-  }
-  applyMask(value) {
-    if (!value || value === "")
-      return value;
-    if (this._maskFormatter) {
-      try {
-        const formattedValue = this._maskFormatter.applyMask(this._maskFormatter.removeMask(value));
-        if (this._inputElem) {
-          this._inputElem.value = formattedValue;
-          return this._inputElem.value;
-        }
-        else {
-          this.value = formattedValue;
-          return this.value;
-        }
-      }
-      catch (e) {
-        this.errorMessage = e.message;
-      }
+      this.value = this._inputElem.value;
     }
-    return value;
   }
   handleChange() {
     if (!this._inputElem) {
@@ -198,9 +165,9 @@ export class EzTextInput {
       content.style.justifyContent = "center";
       content.style.overflow = "hidden";
       content.style.top = "0px";
-      content.style.width = "var(--ez-text-input__icon--width)";
       content.style.height = this.mode != "slim" ? "var(--ez-text-input--height)" : "var(--ez-text-input--height--slim)";
       if (slot.name == "leftIcon") {
+        content.style.width = "var(--ez-text-input__icon--left--width)";
         content.style.left = "0px";
         content.style.borderRadius = "var(--ez-text-input--border-radius) 0 0 var(--ez-text-input--border-radius)";
         this._inputElem.classList.add("icon--left");
@@ -210,6 +177,7 @@ export class EzTextInput {
         this._contentLeftSlot = content;
       }
       else if (slot.name == "rightIcon") {
+        content.style.width = "var(--ez-text-input__icon--right--width)";
         content.style.right = "0px";
         content.style.borderRadius = "0 var(--ez-text-input--border-radius) var(--ez-text-input--border-radius) 0";
         this._inputElem.classList.add("icon--right");
@@ -235,11 +203,6 @@ export class EzTextInput {
     this.observeMask();
     this.adjustFloatingLabel();
     this.adjustBorderInput();
-    if (this.autoFocus) {
-      requestAnimationFrame(() => {
-        this.setFocus({ selectText: true });
-      });
-    }
     this._inputElem.addEventListener('focus', () => {
       this._inputElem.setSelectionRange(0, this._inputElem.value.length);
     });
@@ -249,12 +212,7 @@ export class EzTextInput {
     if (this.value) {
       if (this._maskFormatter) {
         try {
-          if (this.cleanValueMask) {
-            this.applyMask(this.value);
-          }
-          else {
-            this.value = this._maskFormatter.format(this.value);
-          }
+          this.value = this._maskFormatter.format(this.value);
         }
         catch (e) {
           this.errorMessage = e.message;
@@ -270,7 +228,7 @@ export class EzTextInput {
     ElementIDUtils.addIDInfoIfNotExists(this._hostElement, 'input');
     return (h(Host, { style: this._hostElement.classList.contains("grid_editor") ? { "height": "100%" } : null }, h("slot", { name: "leftIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.label && this.mode != "slim" ?
       h("label", { ref: (el) => this._labelElem = el, class: this.enabled ? "input__label" : "input__label input__label--disabled", onClick: () => this._inputElem.focus(), title: this.label }, this.label)
-      : null, h("input", { "data-element-id": ElementIDUtils.getInternalIDInfo("input"), onFocus: () => this.doFocus(), ref: (el) => this._inputElem = el, type: this.password ? "password" : "text", class: this.mode === "slim" ? "input--slim" : "", placeholder: this.mode === "slim" && this.label ? this.label : "", value: this.mask && this.cleanValueMask ? this.applyMask(this.value) : this.value, disabled: !this.enabled, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); } }), h("slot", { name: "rightIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.canShowError && this.mode != "slim" &&
+      : null, h("input", { "data-element-id": ElementIDUtils.getInternalIDInfo("input"), onFocus: () => this.doFocus(), ref: (el) => this._inputElem = el, type: this.password ? "password" : "text", class: this.mode === "slim" ? "input--slim" : "", placeholder: this.mode === "slim" && this.label ? this.label : "", value: this.value, disabled: !this.enabled, onInput: () => { this.handleChange(); }, onFocusout: () => { this.handleFocusout(); } }), h("slot", { name: "rightIcon", onSlotchange: (ev) => { this.handleSlotChange(ev); } }), this.canShowError && this.mode != "slim" &&
       h("span", { class: "message-box", ref: (el) => this._messageBoxElem = el, title: this.errorMessage, "data-element-id": ElementIDUtils.getInternalIDInfo("message_box") }, this.errorMessage)));
   }
   static get is() { return "ez-text-input"; }
@@ -373,24 +331,6 @@ export class EzTextInput {
         "attribute": "mask",
         "reflect": false
       },
-      "cleanValueMask": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Para remover a m\u00E1scara quando fizer um apply no formul\u00E1rio."
-        },
-        "attribute": "clean-value-mask",
-        "reflect": false,
-        "defaultValue": "false"
-      },
       "canShowError": {
         "type": "boolean",
         "mutable": false,
@@ -479,24 +419,6 @@ export class EzTextInput {
         "attribute": "password",
         "reflect": false,
         "defaultValue": "false"
-      },
-      "autoFocus": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Se true o campo receber\u00E1 o foco ao ser renderizado."
-        },
-        "attribute": "auto-focus",
-        "reflect": false,
-        "defaultValue": "false"
       }
     };
   }

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

@@ -10,7 +10,6 @@ export class EzTimeInput {
     this.showSeconds = false;
     this.mode = "regular";
     this.canShowError = true;
-    this.autoFocus = false;
   }
   observeErrorMessage() {
     var _a;
@@ -131,11 +130,6 @@ export class EzTimeInput {
   //---------------------------------------------
   componentDidLoad() {
     CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
-    if (this.autoFocus) {
-      requestAnimationFrame(() => {
-        this.setFocus({ selectText: true });
-      });
-    }
   }
   componentWillLoad() {
     this.observeShowSeconds();
@@ -287,24 +281,6 @@ export class EzTimeInput {
         "attribute": "can-show-error",
         "reflect": true,
         "defaultValue": "true"
-      },
-      "autoFocus": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Se true o campo de texto receber\u00E1 o foco ao ser renderizado."
-        },
-        "attribute": "auto-focus",
-        "reflect": false,
-        "defaultValue": "false"
       }
     };
   }

package/dist/collection/utils/form/DataBinder.js

@@ -22,7 +22,6 @@ export default class DataBinder {
           (_a = this._fields) === null || _a === void 0 ? void 0 : _a.forEach(field => {
             this.updateValue(field.fieldName, field.field);
           });
-          this.clearFieldError(Object.keys(action.payload)[0]);
           break;
         case Action.FIELD_INVALIDATED:
           (_b = this._fields) === null || _b === void 0 ? void 0 : _b.forEach(field => {
@@ -68,14 +67,11 @@ export default class DataBinder {
     });
     this._formMetadata = formMetadata;
     this._recordValidatorProcessor = new RecordValidationProcessor(this._dataUnit, {
-      getRequiredFields: () => this.getFormRequiredFields(),
+      getRequiredFields: () => this._formMetadata.getRequiredFields(),
       markAsInvalid: field => this.markInvalid(field),
       getMessageForField: field => this.getErrorMessage(field),
     }, recordsValidator);
   }
-  getFormRequiredFields() {
-    return this._formMetadata.getRequiredFields();
-  }
   disconnectDataUnit() {
     const dataBindersByDataUnit = ApplicationContext.getContextValue("__DATABINDER_BY_DATAUNIT__") || new Map();
     const dataBinders = dataBindersByDataUnit.get(this._dataUnit.dataUnitId);
@@ -115,14 +111,6 @@ export default class DataBinder {
       fieldElement["errorMessage"] = "";
     });
   }
-  clearFieldError(fieldName) {
-    var _a;
-    const field = (_a = this._fields.get(fieldName)) === null || _a === void 0 ? void 0 : _a.field;
-    if (field["errorMessage"]) {
-      field["errorMessage"] = "";
-      this._dataUnit.clearInvalid(this.getCurrentRecordId(), fieldName);
-    }
-  }
   updateValue(fieldName, field) {
     const bind = this._fields.get(fieldName);
     try {
@@ -143,7 +131,8 @@ export default class DataBinder {
   }
   static async validateByDataunit(dataUnit) {
     try {
-      const dataBinders = this.getDataBindersByDataUnit(dataUnit);
+      const dataBindersByDataUnit = ApplicationContext.getContextValue("__DATABINDER_BY_DATAUNIT__");
+      const dataBinders = dataBindersByDataUnit.get(dataUnit.dataUnitId) || [];
       await Promise.all(dataBinders.map((dataBinder) => dataBinder.validate()));
       return true;
     }
@@ -151,10 +140,6 @@ export default class DataBinder {
       return false;
     }
   }
-  static getDataBindersByDataUnit(dataUnit) {
-    const dataBindersByDataUnit = ApplicationContext.getContextValue("__DATABINDER_BY_DATAUNIT__");
-    return dataBindersByDataUnit.get(dataUnit.dataUnitId) || [];
-  }
   updateErrorMessage(fieldName, field, message) {
     if (message == undefined) {
       message = this._dataUnit.getInvalidMessage(this.getCurrentRecordId(), fieldName);

package/dist/collection/utils/form/FormMetadata.js

@@ -97,7 +97,7 @@ export const buildFormMetadata = (config, dataUnit, includeDetails = false) => {
         return;
       }
       const descriptor = dataUnit.getField(field.name);
-      if (descriptor && descriptor.visible && tabConfig.visible) {
+      if (descriptor && tabConfig.visible) {
         if (!sheets.has(tabConfig)) {
           sheets.set(tabConfig, []);
         }

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

@@ -16,6 +16,6 @@ export const buildFieldMetadata = (descriptor, config) => {
     name, label, group,
     readOnly, required,
     props,
-    userInterface: userInterface || UserInterface.SHORTTEXT,
+    userInterface: userInterface || UserInterface.SHORTTEXT
   };
 };