@sankhyalabs/ezui 1.1.139 → 1.1.142

package/dist/custom-elements/index.js

@@ -1,6 +1,6 @@
 import { HTMLElement as HTMLElement$1, createEvent, h, forceUpdate, Host, proxyCustomElement } from '@stencil/core/internal/client';
 export { setAssetPath, setPlatformOptions } from '@stencil/core/internal/client';
-import { FloatingManager, DateUtils, TimeFormatter, UserInterface, Action, ApplicationContext, DataUnitAction, DataUnit, NumberUtils, DataType, StringUtils, MaskFormatter } from '@sankhyalabs/core';
+import { FloatingManager, DateUtils, TimeFormatter, UserInterface, Action, WaitingChangeException, ApplicationContext, DataUnitAction, DataUnit, NumberUtils, DataType, StringUtils, MaskFormatter } from '@sankhyalabs/core';
 import { UserInterface as UserInterface$1, SortMode } from '@sankhyalabs/core/dist/dataunit/metadata/UnitMetadata';
 
 const ezApplicationCss = "";
@@ -844,6 +844,8 @@ let EzDateInput$1 = class extends HTMLElement$1 {
     this.__registerHost();
     this.__attachShadow();
     this.ezChange = createEvent(this, "ezChange", 7);
+    this.ezStartChange = createEvent(this, "ezStartChange", 7);
+    this.ezCancelWaitingChange = createEvent(this, "ezCancelWaitingChange", 7);
     /**
      * Deixa o campo disponível ou não para uso.
      */
@@ -857,11 +859,16 @@ let EzDateInput$1 = class extends HTMLElement$1 {
     this._textInput.label = this.label;
   }
   observeErrorMessage() {
-    this._textInput.errorMessage = this.errorMessage;
-  }
-  observeValue() {
     if (this._textInput) {
-      this._textInput.value = this.getTextValue(this.value);
+      this._textInput.errorMessage = this.errorMessage;
+    }
+  }
+  observeValue(newValue, oldValue) {
+    if (newValue != oldValue) {
+      if (this._textInput) {
+        this.errorMessage = "";
+        this._textInput.value = this.getTextValue(this.value);
+      }
     }
   }
   /**
@@ -911,12 +918,16 @@ let EzDateInput$1 = class extends HTMLElement$1 {
       }
     }
     else {
+      this.ezCancelWaitingChange.emit();
       this._textInput.errorMessage = "O valor digitado não é uma data válida";
     }
   }
   getTextValue(d) {
     return d ? new Intl.DateTimeFormat("pt-BR").format(d) : undefined;
   }
+  startChange() {
+    this.ezStartChange.emit({ waitmessage: "", blocking: false });
+  }
   componentDidLoad() {
     CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
   }
@@ -924,7 +935,7 @@ let EzDateInput$1 = class extends HTMLElement$1 {
     return (h(Host, null, h("ez-text-input", { ref: elem => this._textInput = elem, onBlur: () => this.parseDate(), onKeyDown: event => {
         if (event.key === "H" || event.key === "h")
           this.changeValue(new Date());
-      }, label: this.label, value: this.getTextValue(this.value), restrict: "0123456789/", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, slaveMode: true }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem })));
+      }, label: this.label, value: this.getTextValue(this.value), onInput: () => this.startChange(), restrict: "0123456789/", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, slaveMode: true }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem })));
   }
   get _elem() { return this; }
   static get watchers() { return {
@@ -943,6 +954,8 @@ let EzDateTimeInput$1 = class extends HTMLElement$1 {
     this.__registerHost();
     this.__attachShadow();
     this.ezChange = createEvent(this, "ezChange", 7);
+    this.ezStartChange = createEvent(this, "ezStartChange", 7);
+    this.ezCancelWaitingChange = createEvent(this, "ezCancelWaitingChange", 7);
     /**
      * Deixa o campo disponível ou não para uso.
      */
@@ -1048,6 +1061,7 @@ let EzDateTimeInput$1 = class extends HTMLElement$1 {
       }
     }
     else {
+      this.ezCancelWaitingChange.emit();
       this._textInput.errorMessage = "O valor digitado não é uma data válida";
     }
   }
@@ -1062,11 +1076,14 @@ let EzDateTimeInput$1 = class extends HTMLElement$1 {
     };
     return d ? (new Intl.DateTimeFormat('pt-BR', this.showSeconds ? optionsSecond : options).format(d)) : undefined;
   }
+  startChange() {
+    this.ezStartChange.emit({ waitmessage: "", blocking: false });
+  }
   componentDidLoad() {
     CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
   }
   render() {
-    return (h(Host, null, h("ez-text-input", { ref: elem => this._textInput = elem, onBlur: () => this.parseDate(), onKeyDown: event => { this.onChangeKeyDown(event); }, label: this.label, value: this.getTextValue(this.value), restrict: "0123456789/: ", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, onFocus: () => this.onFocused(), onClick: () => this.onClicked(), slaveMode: true }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { onEzChange: (event) => { this.changeValue(this._calendar.value); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem, time: true, showSeconds: this.showSeconds })));
+    return (h(Host, null, h("ez-text-input", { ref: elem => this._textInput = elem, onBlur: () => this.parseDate(), onKeyDown: event => { this.onChangeKeyDown(event); }, label: this.label, value: this.getTextValue(this.value), restrict: "0123456789/: ", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, onInput: () => this.startChange(), onFocus: () => this.onFocused(), onClick: () => this.onClicked(), slaveMode: true }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { onEzChange: (event) => { this.changeValue(this._calendar.value); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem, time: true, showSeconds: this.showSeconds })));
   }
   get _elem() { return this; }
   static get watchers() { return {
@@ -1880,11 +1897,7 @@ class DataBinder {
     this._dataUnit.unsubscribe(this.onDataUnitEvent);
   }
   updateValue(fieldName, field) {
-    const oldValue = field["value"];
-    const newValue = this._dataUnit.getFieldValue(fieldName);
-    if (oldValue != newValue) {
-      field["value"] = newValue;
-    }
+    field["value"] = this._dataUnit.getFieldValue(fieldName);
   }
   updateBind(fieldName, field) {
     const oldBind = this._fields.get(fieldName);
@@ -1892,21 +1905,53 @@ class DataBinder {
       oldBind.destroy();
     }
     field["value"] = this._dataUnit.getFieldValue(fieldName);
-    this._fields.set(fieldName, Bind.create(fieldName, field, (fieldName, waitingChange) => this.changeStarted(fieldName, waitingChange), (fieldName, newValue) => this.setFieldValue(fieldName, newValue)));
+    this._fields.set(fieldName, Bind.create(fieldName, field, (fieldName, waitingChange) => this.changeStarted(fieldName, waitingChange), (fieldName) => this.cancelWaitingChange(fieldName), (fieldName, newValue) => this.setFieldValue(fieldName, newValue)));
     this.bindSearchOptionsLoader(fieldName, field);
     this.applyEzUploadContext(fieldName, field);
   }
   changeStarted(fieldName, waitingChange) {
+    /**
+     * se o waitingChange não é blocante, add um event listener pra
+     * fazer o accept da promise
+     *
+     * se não tiver promise no waitingChange, eu crio uma e resolvo no bind
+     *
+     *
+     */
     if (this._dataUnit.records.length === 0) {
       this._dataUnit.addRecord();
     }
+    if (!waitingChange.blocking && waitingChange.promise == undefined) {
+      const bind = this._fields.get(fieldName);
+      if (bind) {
+        waitingChange.promise = new Promise((resolve, reject) => {
+          bind.waitingChangePromiseResolve = resolve;
+          bind.waitingChangePromiseReject = reject;
+        });
+      }
+    }
     this._dataUnit.startChange(fieldName, waitingChange);
   }
+  cancelWaitingChange(fieldName) {
+    if (this._dataUnit.waitingForChange(fieldName)) {
+      this._dataUnit.cancelWaitingChange(fieldName);
+      const bind = this._fields.get(fieldName);
+      if (bind) {
+        bind.rejectWaitingChange(new WaitingChangeException("Change canceled", fieldName));
+      }
+    }
+  }
   setFieldValue(fieldName, newValue) {
     if (this._dataUnit.records.length === 0) {
       this._dataUnit.addRecord();
     }
     this._dataUnit.setFieldValue(fieldName, newValue);
+    if (this._dataUnit.waitingForChange(fieldName)) {
+      const bind = this._fields.get(fieldName);
+      if (bind) {
+        bind.acceptWaitingChange();
+      }
+    }
   }
   bindSearchOptionsLoader(fieldName, field) {
     if (field.nodeName === "EZ-SEARCH" && field["optionLoader"] == undefined) {
@@ -1935,18 +1980,36 @@ class DataBinder {
 class Bind {
   constructor() {
     this.startChangeEventName = "ezStartChange";
+    this.cancelWaitingChangeEventName = "ezCancelWaitingChange";
     this.changeEventName = "ezChange";
   }
   destroy() {
     this.field.removeEventListener(this.startChangeEventName, this.startChangeListener);
+    this.field.removeEventListener(this.cancelWaitingChangeEventName, this.cancelWaitingChangeListener);
     this.field.removeEventListener(this.changeEventName, this.changeListener);
   }
-  static create(fieldName, field, startChangeCallback, changeCallback) {
+  acceptWaitingChange() {
+    if (this.waitingChangePromiseResolve) {
+      this.waitingChangePromiseResolve();
+      this.waitingChangePromiseReject = undefined;
+      this.waitingChangePromiseResolve = undefined;
+    }
+  }
+  rejectWaitingChange(reason) {
+    if (this.waitingChangePromiseReject) {
+      this.waitingChangePromiseReject(reason);
+      this.waitingChangePromiseReject = undefined;
+      this.waitingChangePromiseResolve = undefined;
+    }
+  }
+  static create(fieldName, field, startChangeCallback, cancelWaitingChangeCallback, changeCallback) {
     const b = new Bind();
     b.field = field;
     b.fieldName = fieldName;
     b.startChangeListener = (evt) => { startChangeCallback(fieldName, evt.detail); };
     b.field.addEventListener(b.startChangeEventName, b.startChangeListener);
+    b.cancelWaitingChangeListener = () => { cancelWaitingChangeCallback(fieldName); };
+    b.field.addEventListener(b.cancelWaitingChangeEventName, b.cancelWaitingChangeListener);
     b.changeListener = (evt) => { changeCallback(fieldName, evt.detail); };
     b.field.addEventListener(b.changeEventName, b.changeListener);
     return b;
@@ -2091,7 +2154,6 @@ let EzForm$1 = class extends HTMLElement$1 {
       }
     }
     if (action.type === Action.RECORDS_ADDED) {
-      debugger;
       const metadata = selectFormMetadata(this._store.getState());
       const defaultValues = metadata.getDefaultValues();
       if (defaultValues) {
@@ -112169,7 +112231,7 @@ class DataSource {
       }
     }
     else {
-      this.loadData({ limit: params.api.paginationGetPageSize(), offset: params.request.startRow, quickFilter: this._quickFilterTerm })
+      this.loadData({ limit: params.api.paginationGetPageSize(), offset: params.request.startRow, quickFilter: this._quickFilter })
         .then(data => params.success(data))
         .catch(() => params.fail());
     }
@@ -112188,14 +112250,16 @@ class DataSource {
       }
     });
   }
-  setQuickFilter(term) {
-    this._quickFilterTerm = term;
+  setQuickFilter(term, fields) {
+    this._quickFilter = { term, fields };
   }
 }
 
 class AgGridController {
   constructor(enterprise) {
     this.DEFAULT_ROW_HEIGHT = 25;
+    this.CHECK_BOX_COL_ID = "checkBoxColumn";
+    this.RECORD_ARCHIVE_COL_ID = "__RECORD_ARCHIVE__";
     this._menuItems = [];
     this._idAttribName = "__record__id__";
     this._isFirstRecordOfPage = true;
@@ -112219,6 +112283,7 @@ class AgGridController {
   ;
   initDatagrid(container, options) {
     if (this._grid === undefined) {
+      agGridEnterprise_cjs.LicenseManager.setLicenseKey(ApplicationContext.getContextValue("__EZUI__GRID_LICENSE__"));
       this._columnStateChangeCallback = options.onColumnStateChange;
       this._selectionChangeCallback = options.onSelectionChange;
       this._paginationChangeCallback = options.onPaginationChange;
@@ -112364,7 +112429,7 @@ class AgGridController {
     const colDefs = [];
     if (showCheckSelection) {
       colDefs.push({
-        colId: "checkBoxColumn",
+        colId: this.CHECK_BOX_COL_ID,
         headerName: "",
         checkboxSelection: true,
         headerCheckboxSelection: false,
@@ -112455,7 +112520,10 @@ class AgGridController {
     this._gridOptions.api.paginationGoToPage(page);
   }
   quickFilter(term) {
-    this._dataSource.setQuickFilter(term);
+    this._dataSource.setQuickFilter(term, this._gridOptions.columnApi
+      .getAllColumns()
+      .filter(col => col.isVisible() && ![this.CHECK_BOX_COL_ID, this.RECORD_ARCHIVE_COL_ID].includes(col.getColId()))
+      .map(col => col.getColId()));
     this.goToPage(0);
     this._gridOptions.api.refreshServerSideStore({ purge: true });
   }
@@ -113632,6 +113700,8 @@ let EzNumberInput$1 = class extends HTMLElement$1 {
     this.__registerHost();
     this.__attachShadow();
     this.ezChange = createEvent(this, "ezChange", 7);
+    this.ezStartChange = createEvent(this, "ezStartChange", 7);
+    this.ezCancelWaitingChange = createEvent(this, "ezCancelWaitingChange", 7);
     /**
      * Deixa o campo disponível ou não para uso.
      */
@@ -113681,6 +113751,7 @@ let EzNumberInput$1 = class extends HTMLElement$1 {
   parseNumber() {
     const parsedNumber = this._textInput.value ? NumberUtils.stringToNumber(this._textInput.value) : undefined;
     if (parsedNumber !== undefined && isNaN(parsedNumber)) {
+      this.ezCancelWaitingChange.emit();
       this.errorMessage = "O valor digitado não é um número válido";
     }
     else {
@@ -113688,6 +113759,7 @@ let EzNumberInput$1 = class extends HTMLElement$1 {
         this.changeValue(parsedNumber);
       }
       catch (e) {
+        this.ezCancelWaitingChange.emit();
         this.errorMessage = e.message;
         return;
       }
@@ -113699,11 +113771,14 @@ let EzNumberInput$1 = class extends HTMLElement$1 {
     }
     return undefined;
   }
+  startChange() {
+    this.ezStartChange.emit({ waitmessage: "", blocking: false });
+  }
   componentDidLoad() {
     CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
   }
   render() {
-    return (h("ez-text-input", { ref: elem => this._textInput = elem, onBlur: () => this.parseNumber(), label: this.label, value: this.getTextValue(this.value), restrict: this.precision > 0 ? "0123456789-,." : "0123456789-", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, slaveMode: true }));
+    return (h("ez-text-input", { ref: elem => this._textInput = elem, onBlur: () => this.parseNumber(), label: this.label, onInput: () => this.startChange(), value: this.getTextValue(this.value), restrict: this.precision > 0 ? "0123456789-,." : "0123456789-", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, slaveMode: true }));
   }
   get _elem() { return this; }
   static get watchers() { return {
@@ -114186,11 +114261,17 @@ let EzTextArea$1 = class extends HTMLElement$1 {
       (_b = this._messageBoxElem) === null || _b === void 0 ? void 0 : _b.classList.remove('hasError');
     }
   }
-  observeValue() {
-    this._inputElem.value = this.value == undefined ? "" : this.value;
-    this.handleChange();
-    this.adjustFloatingLabel();
-    this.ezChange.emit(this.value);
+  observeValue(newValue, oldValue) {
+    if (this._inputElem) {
+      if (newValue != oldValue) {
+        if (this.canChangeValue()) {
+          this._inputElem.value = this.value || "";
+        }
+        this.adjustFloatingLabel();
+        this.errorMessage = "";
+        this.ezChange.emit(this.value);
+      }
+    }
   }
   observeMode() {
     if (this._initialRows == undefined) {
@@ -114208,6 +114289,27 @@ let EzTextArea$1 = class extends HTMLElement$1 {
       this._initialRows = rows;
     }
   }
+  //---------------------------------------------
+  // Public methods
+  //---------------------------------------------
+  /**
+   * Faz o foco no componente de input
+   */
+  async setFocus() {
+    this._inputElem.focus();
+  }
+  /**
+   * Remove o foco no componente de input
+   */
+  async setBlur() {
+    this._inputElem.blur();
+  }
+  //---------------------------------------------
+  // Private methods
+  //---------------------------------------------
+  canChangeValue() {
+    return this._inputElem && (this.value || "") !== this._inputElem.value;
+  }
   adjustFloatingLabel() {
     if (this.label && this._labelElem) {
       const hasValue = this.value && this.value.toString().length > 0;
@@ -114228,21 +114330,6 @@ let EzTextArea$1 = class extends HTMLElement$1 {
     return this._hostElement.shadowRoot.activeElement !== null;
   }
   //---------------------------------------------
-  // Public methods
-  //---------------------------------------------
-  /**
-   * Faz o foco no componente de input
-   */
-  async setFocus() {
-    this._inputElem.focus();
-  }
-  /**
-   * Remove o foco no componente de input
-   */
-  async setBlur() {
-    this._inputElem.blur();
-  }
-  //---------------------------------------------
   // Event handlers
   //---------------------------------------------
   handleFocusout() {
@@ -114252,8 +114339,9 @@ let EzTextArea$1 = class extends HTMLElement$1 {
     }
   }
   handleChange() {
-    this.errorMessage = "";
-    this.value = this._inputElem.value;
+    if (this.canChangeValue()) {
+      this.value = this._inputElem.value;
+    }
   }
   handleFocus() {
     if (this.label && this._labelElem && !this._labelElem.classList.contains("textarea__label--floated")) {
@@ -114336,17 +114424,19 @@ let EzTextInput$1 = class extends HTMLElement$1 {
       }
     }
   }
-  observeValue() {
+  observeValue(newValue, oldValue) {
     if (this._inputElem) {
-      this._inputElem.value = this.value || "";
-    }
-    this.handleChange();
-    this.adjustFloatingLabel();
-    if (this.slaveMode) {
-      return;
+      if (newValue != oldValue) {
+        this._inputElem.value = this.value || "";
+        this.handleChange();
+        this.adjustFloatingLabel();
+        if (this.slaveMode) {
+          return;
+        }
+        this.errorMessage = "";
+        this.ezChange.emit(this.value);
+      }
     }
-    this.errorMessage = "";
-    this.ezChange.emit(this.value);
   }
   adjustFloatingLabel() {
     if (this.label && this._labelElem) {
@@ -114509,6 +114599,8 @@ let EzTimeInput$1 = class extends HTMLElement$1 {
     this.__registerHost();
     this.__attachShadow();
     this.ezChange = createEvent(this, "ezChange", 7);
+    this.ezStartChange = createEvent(this, "ezStartChange", 7);
+    this.ezCancelWaitingChange = createEvent(this, "ezCancelWaitingChange", 7);
     /**
      * Deixa o campo disponível ou não para digitação.
      */
@@ -114569,10 +114661,12 @@ let EzTimeInput$1 = class extends HTMLElement$1 {
     this.prepareValue(this.viewValue);
     if (this.viewValue && !TimeFormatter.validateTime(this.viewValue, this.showSeconds)) {
       this._oldViewValue = this.viewValue;
+      this.ezCancelWaitingChange.emit();
       this.errorMessage = "Favor inserir um horário válido.";
     }
     else {
       if (this.viewValue === this._oldViewValue) {
+        this.ezCancelWaitingChange.emit();
         return;
       }
       this._oldViewValue = this.viewValue;
@@ -114591,6 +114685,7 @@ let EzTimeInput$1 = class extends HTMLElement$1 {
     }
   }
   handleChange() {
+    this.ezStartChange.emit({ waitmessage: "", blocking: false });
     this.viewValue = this._inputElem.value;
     this.value = NumberUtils.stringToNumber(this.viewValue.replace(/\D/g, ""));
   }
@@ -114750,7 +114845,12 @@ class RemoteFile {
           }
           const response = xhr.response;
           if (response) {
-            resolve(JSON.parse(response));
+            try {
+              resolve(JSON.parse(response));
+            }
+            catch (error) {
+              reject(`Servidor não retornou um objeto válido: ${response}.\n${error}`);
+            }
           }
         }
       };
@@ -114804,6 +114904,7 @@ let EzUpload$1 = class extends HTMLElement$1 {
     this.__attachShadow();
     this.ezChange = createEvent(this, "ezChange", 7);
     this.ezStartChange = createEvent(this, "ezStartChange", 7);
+    this.ezCancelWaitingChange = createEvent(this, "ezCancelWaitingChange", 7);
     this._filePointers = new Map();
     /**
     * Deixa o campo disponível ou não para digitação.
@@ -114892,14 +114993,27 @@ let EzUpload$1 = class extends HTMLElement$1 {
     }
   }
   async doAddFile(file) {
-    if (this.validateFile(file)) {
-      this.ezStartChange.emit({ waitmessage: "Há arquivos sendo enviados. Por favor aguarde a conclusão ou cancele o envio." });
-      const uploadingFile = new RemoteFile(file);
-      this._filePointers.set(file.name, uploadingFile);
-      uploadingFile.upload(this.urlUpload, this._requestHeaders, (file) => this.updateFeedback(file))
-        .then((files) => files.forEach(ezFile => this.finishUpload(ezFile)))
-        .catch(msg => this.showError(msg));
-      forceUpdate(this);
+    try {
+      if (this.validateFile(file)) {
+        this.ezStartChange.emit({ waitmessage: "Há arquivos sendo enviados. Por favor aguarde a conclusão ou cancele o envio.", blocking: true });
+        const uploadingFile = new RemoteFile(file);
+        const oldPointer = this._filePointers.get(file.name);
+        if (oldPointer && this.isRemoteFile(oldPointer)) {
+          oldPointer.abortUpload();
+        }
+        this._filePointers.set(file.name, uploadingFile);
+        uploadingFile.upload(this.urlUpload, this._requestHeaders, (file) => this.updateFeedback(file))
+          .then((files) => files.forEach(ezFile => this.finishUpload(ezFile)))
+          .catch(msg => {
+          this.ezCancelWaitingChange.emit();
+          this.showError(msg);
+        });
+        forceUpdate(this);
+      }
+    }
+    catch (error) {
+      this.ezCancelWaitingChange.emit();
+      throw error;
     }
   }
   finishUpload(ezFile) {

package/dist/esm/ez-date-input.entry.js

@@ -8,6 +8,8 @@ let EzDateInput = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.ezChange = createEvent(this, "ezChange", 7);
+    this.ezStartChange = createEvent(this, "ezStartChange", 7);
+    this.ezCancelWaitingChange = createEvent(this, "ezCancelWaitingChange", 7);
     /**
      * Deixa o campo disponível ou não para uso.
      */
@@ -21,11 +23,16 @@ let EzDateInput = class {
     this._textInput.label = this.label;
   }
   observeErrorMessage() {
-    this._textInput.errorMessage = this.errorMessage;
-  }
-  observeValue() {
     if (this._textInput) {
-      this._textInput.value = this.getTextValue(this.value);
+      this._textInput.errorMessage = this.errorMessage;
+    }
+  }
+  observeValue(newValue, oldValue) {
+    if (newValue != oldValue) {
+      if (this._textInput) {
+        this.errorMessage = "";
+        this._textInput.value = this.getTextValue(this.value);
+      }
     }
   }
   /**
@@ -75,12 +82,16 @@ let EzDateInput = class {
       }
     }
     else {
+      this.ezCancelWaitingChange.emit();
       this._textInput.errorMessage = "O valor digitado não é uma data válida";
     }
   }
   getTextValue(d) {
     return d ? new Intl.DateTimeFormat("pt-BR").format(d) : undefined;
   }
+  startChange() {
+    this.ezStartChange.emit({ waitmessage: "", blocking: false });
+  }
   componentDidLoad() {
     CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
   }
@@ -88,7 +99,7 @@ let EzDateInput = class {
     return (h(Host, null, h("ez-text-input", { ref: elem => this._textInput = elem, onBlur: () => this.parseDate(), onKeyDown: event => {
         if (event.key === "H" || event.key === "h")
           this.changeValue(new Date());
-      }, label: this.label, value: this.getTextValue(this.value), restrict: "0123456789/", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, slaveMode: true }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem })));
+      }, label: this.label, value: this.getTextValue(this.value), onInput: () => this.startChange(), restrict: "0123456789/", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, slaveMode: true }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { onEzChange: (event) => { this.hideCalendar(); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem })));
   }
   get _elem() { return getElement(this); }
   static get watchers() { return {

package/dist/esm/ez-date-time-input.entry.js

@@ -8,6 +8,8 @@ let EzDateTimeInput = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.ezChange = createEvent(this, "ezChange", 7);
+    this.ezStartChange = createEvent(this, "ezStartChange", 7);
+    this.ezCancelWaitingChange = createEvent(this, "ezCancelWaitingChange", 7);
     /**
      * Deixa o campo disponível ou não para uso.
      */
@@ -113,6 +115,7 @@ let EzDateTimeInput = class {
       }
     }
     else {
+      this.ezCancelWaitingChange.emit();
       this._textInput.errorMessage = "O valor digitado não é uma data válida";
     }
   }
@@ -127,11 +130,14 @@ let EzDateTimeInput = class {
     };
     return d ? (new Intl.DateTimeFormat('pt-BR', this.showSeconds ? optionsSecond : options).format(d)) : undefined;
   }
+  startChange() {
+    this.ezStartChange.emit({ waitmessage: "", blocking: false });
+  }
   componentDidLoad() {
     CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
   }
   render() {
-    return (h(Host, null, h("ez-text-input", { ref: elem => this._textInput = elem, onBlur: () => this.parseDate(), onKeyDown: event => { this.onChangeKeyDown(event); }, label: this.label, value: this.getTextValue(this.value), restrict: "0123456789/: ", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, onFocus: () => this.onFocused(), onClick: () => this.onClicked(), slaveMode: true }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { onEzChange: (event) => { this.changeValue(this._calendar.value); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem, time: true, showSeconds: this.showSeconds })));
+    return (h(Host, null, h("ez-text-input", { ref: elem => this._textInput = elem, onBlur: () => this.parseDate(), onKeyDown: event => { this.onChangeKeyDown(event); }, label: this.label, value: this.getTextValue(this.value), restrict: "0123456789/: ", enabled: this.enabled, errorMessage: this.errorMessage, mode: this.mode, onInput: () => this.startChange(), onFocus: () => this.onFocused(), onClick: () => this.onClicked(), slaveMode: true }, h("button", { disabled: !this.enabled, tabindex: -1, class: "btn-open-cal", onClick: () => this.showCalendar(), slot: "leftIcon" })), h("ez-calendar", { onEzChange: (event) => { this.changeValue(this._calendar.value); event.stopPropagation(); }, floating: true, ref: elem => this._calendar = elem, time: true, showSeconds: this.showSeconds })));
   }
   get _elem() { return getElement(this); }
   static get watchers() { return {