@syncfusion/ej2-calendars 27.2.2 → 27.2.3

package/dist/es6/ej2-calendars.es5.js

@@ -3940,6 +3940,9 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                 this.inputElement.selectionEnd = this.inputElement.value.length;
             }
         }
+        if (this.enableMask && this.showClearButton && this.inputElement && this.inputElement.value === this.maskedDateValue && this.inputWrapper && this.inputWrapper.clearButton && !this.inputWrapper.clearButton.classList.contains('e-clear-icon-hide')) {
+            this.inputWrapper.clearButton.classList.add('e-clear-icon-hide');
+        }
         var focusArguments = {
             model: this
         };
@@ -4446,6 +4449,9 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
     };
     DatePicker.prototype.keyupHandler = function (e) {
         this.isKeyAction = (this.inputElement.value !== this.previousElementValue) ? true : false;
+        if (this.enableMask && this.showClearButton && this.inputElement && this.inputElement.value === this.maskedDateValue && this.inputWrapper && this.inputWrapper.clearButton && !this.inputWrapper.clearButton.classList.contains('e-clear-icon-hide')) {
+            this.inputWrapper.clearButton.classList.add('e-clear-icon-hide');
+        }
     };
     DatePicker.prototype.changeEvent = function (event) {
         if (!this.isIconClicked && !(this.isBlur || this.isKeyAction)) {
@@ -11368,6 +11374,7 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
         EventHandler.add(this.inputElement, 'input', this.inputEventHandler, this);
         if (this.enableMask) {
             EventHandler.add(this.inputElement, 'keydown', this.keydownHandler, this);
+            EventHandler.add(this.inputElement, 'keyup', this.keyupHandler, this);
         }
         if (this.showClearButton && this.inputWrapper.clearButton) {
             EventHandler.add(this.inputWrapper.clearButton, 'mousedown', this.clearHandler, this);
@@ -11399,6 +11406,11 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                 break;
         }
     };
+    TimePicker.prototype.keyupHandler = function (e) {
+        if ((e.code === 'Backspace' || e.code === 'Delete') && (this.enableMask && this.showClearButton && this.inputElement && this.inputElement.value === this.maskedDateValue && this.inputWrapper && this.inputWrapper.clearButton && !this.inputWrapper.clearButton.classList.contains('e-clear-icon-hide'))) {
+            this.inputWrapper.clearButton.classList.add('e-clear-icon-hide');
+        }
+    };
     TimePicker.prototype.formResetHandler = function () {
         if (!this.enabled) {
             return;
@@ -11449,6 +11461,9 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
         EventHandler.remove(this.inputElement, 'focus', this.inputFocusHandler);
         EventHandler.remove(this.inputElement, 'change', this.inputChangeHandler);
         EventHandler.remove(this.inputElement, 'input', this.inputEventHandler);
+        if (this.enableMask) {
+            EventHandler.remove(this.inputElement, 'keyup', this.keyupHandler);
+        }
         if (this.inputEvent) {
             this.inputEvent.destroy();
         }
@@ -12197,6 +12212,9 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                 this.inputElement.selectionEnd = this.inputElement.value.length;
             }
         }
+        if (this.enableMask && this.showClearButton && this.inputElement && this.inputElement.value === this.maskedDateValue && this.inputWrapper && this.inputWrapper.clearButton && !this.inputWrapper.clearButton.classList.contains('e-clear-icon-hide')) {
+            this.inputWrapper.clearButton.classList.add('e-clear-icon-hide');
+        }
         this.trigger('focus', focusArguments);
         this.clearIconState();
         if (this.openOnFocus) {
@@ -15367,6 +15385,9 @@ var MaskedDateTime = /** @__PURE__ @class */ (function () {
     MaskedDateTime.prototype.clearHandler = function () {
         this.isDayPart = this.isMonthPart = this.isYearPart = this.isHourPart = this.isMinutePart = this.isSecondsPart = false;
         this.updateValue();
+        if (this.parent.inputElement && this.parent.inputElement.value === this.parent.maskedDateValue && this.parent.inputWrapper && this.parent.inputWrapper.clearButton && !this.parent.inputWrapper.clearButton.classList.contains('e-clear-icon-hide')) {
+            this.parent.inputWrapper.clearButton.classList.add('e-clear-icon-hide');
+        }
     };
     MaskedDateTime.prototype.updateValue = function () {
         this.monthCharacter = this.periodCharacter = '';