@syncfusion/ej2-calendars 35.1.41 → 35.1.43

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 35.1.41
+*  version : 35.1.43
 *  Copyright Syncfusion Inc. 2001 - 2025. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@syncfusion/ej2-calendars",
-  "version": "35.1.41",
+  "version": "35.1.43",
   "description": "A complete package of date or time components with built-in features such as date formatting, inline editing, multiple (range) selection, range restriction, month and year selection, strict mode, and globalization.",
   "author": "Syncfusion Inc.",
   "license": "SEE LICENSE IN license",
@@ -10,9 +10,9 @@
   "dependencies": {
     "@syncfusion/ej2-base": "~35.1.37",
     "@syncfusion/ej2-buttons": "~35.1.41",
-    "@syncfusion/ej2-inputs": "~35.1.41",
-    "@syncfusion/ej2-lists": "~35.1.37",
-    "@syncfusion/ej2-popups": "~35.1.39"
+    "@syncfusion/ej2-inputs": "~35.1.43",
+    "@syncfusion/ej2-lists": "~35.1.43",
+    "@syncfusion/ej2-popups": "~35.1.42"
   },
   "devDependencies": {},
   "keywords": [

package/src/calendar/calendar.js

@@ -2350,6 +2350,12 @@ var Calendar = /** @class */ (function (_super) {
         else {
             tempValue = new Date(tempValue.getFullYear(), tempValue.getMonth(), tempValue.getDate(), 0, 0, 0, 0);
         }
+        if (+tempValue < +this.min) {
+            tempValue = new Date(+this.min);
+        }
+        else if (+tempValue > +this.max) {
+            tempValue = new Date(+this.max);
+        }
         return tempValue;
     };
     Calendar.prototype.todayButtonClick = function (e) {

package/src/datepicker/datepicker.d.ts

@@ -438,6 +438,9 @@ export declare class DatePicker extends Calendar implements IInput {
     private clear;
     private preventEventBubbling;
     private updateInputValue;
+    private isMaskPlaceholderSwap;
+    private setMaskedInputValue;
+    private swapMaskPlaceholder;
     private windowResize;
     private dateIconHandler;
     protected updateHtmlAttributeToWrapper(): void;

package/src/datepicker/datepicker.js

@@ -163,7 +163,7 @@ var DatePicker = /** @class */ (function (_super) {
         this.setAllowEdit();
         if (this.enableMask && !this.value && this.maskedDateValue && (this.floatLabelType === 'Always' || !this.floatLabelType || !this.placeholder)) {
             this.updateInput(true);
-            this.updateInputValue(this.maskedDateValue);
+            this.setMaskedInputValue();
         }
         else if (!this.enableMask) {
             this.updateInput(true);
@@ -285,7 +285,7 @@ var DatePicker = /** @class */ (function (_super) {
                 this.updateInputValue('');
             }
             else {
-                this.updateInputValue(this.maskedDateValue);
+                this.setMaskedInputValue();
                 this.notify('createMask', {
                     module: 'MaskedDateTime'
                 });
@@ -579,6 +579,31 @@ var DatePicker = /** @class */ (function (_super) {
     DatePicker.prototype.updateInputValue = function (value) {
         Input.setValue(value, this.inputElement, this.floatLabelType, this.showClearButton);
     };
+    DatePicker.prototype.isMaskPlaceholderSwap = function () {
+        return this.getModuleName() === 'datepicker' && this.enableMask && this.strictMode
+            && (!this.placeholder || this.floatLabelType === 'Always') && !!this.maskedDateValue
+            && !this.value && !isNullOrUndefined(this.inputElement) && !isNullOrUndefined(closest(this.inputElement, 'form'));
+    };
+    DatePicker.prototype.setMaskedInputValue = function () {
+        if (this.isMaskPlaceholderSwap() && (this.isBlur || document.activeElement !== this.inputElement)) {
+            this.swapMaskPlaceholder(false);
+        }
+        else {
+            this.updateInputValue(this.maskedDateValue);
+        }
+    };
+    DatePicker.prototype.swapMaskPlaceholder = function (toValue) {
+        if (toValue) {
+            this.updateInputValue(this.maskedDateValue);
+            if (this.inputElement.hasAttribute('placeholder')) {
+                this.inputElement.removeAttribute('placeholder');
+            }
+        }
+        else {
+            this.updateInputValue('');
+            this.inputElement.setAttribute('placeholder', this.maskedDateValue);
+        }
+    };
     DatePicker.prototype.windowResize = function () {
         this.updateFloatLabelOverflowWidth(true);
     };
@@ -715,7 +740,10 @@ var DatePicker = /** @class */ (function (_super) {
         if (this.initTimeZone !== new Date().getTimezoneOffset()) {
             this.strictModeUpdate(true);
         }
-        if (this.enableMask && !this.inputElement.value && this.placeholder) {
+        if (this.isMaskPlaceholderSwap() && (!this.inputElement.value || this.inputElement.value === this.maskedDateValue)) {
+            this.swapMaskPlaceholder(true);
+        }
+        else if (this.enableMask && !this.inputElement.value && this.placeholder) {
             if (this.maskedDateValue && !this.value && (this.floatLabelType === 'Auto' || this.floatLabelType === 'Never' || this.placeholder)) {
                 this.updateInputValue(this.maskedDateValue);
                 this.inputElement.selectionStart = 0;
@@ -766,7 +794,10 @@ var DatePicker = /** @class */ (function (_super) {
         this.isBlur = false;
         this.popupUpdate();
         this.changeTrigger(e);
-        if (this.enableMask && this.maskedDateValue && this.placeholder && this.floatLabelType !== 'Always') {
+        if (this.isMaskPlaceholderSwap() && (!this.inputElement.value || this.inputElement.value === this.maskedDateValue)) {
+            this.swapMaskPlaceholder(false);
+        }
+        else if (this.enableMask && this.maskedDateValue && this.placeholder && this.floatLabelType !== 'Always') {
             if (this.inputElement.value === this.maskedDateValue && !this.value && (this.floatLabelType === 'Auto' || this.floatLabelType === 'Never' || this.placeholder)) {
                 this.updateInputValue('');
             }
@@ -2035,7 +2066,7 @@ var DatePicker = /** @class */ (function (_super) {
         if (!this.popupObj) {
             this.updateInputValue(inputVal);
             if (this.enableMask) {
-                this.updateInputValue(this.maskedDateValue);
+                this.setMaskedInputValue();
                 this.notify('createMask', {
                     module: 'MaskedDateTime', isBlur: isBlur
                 });
@@ -2108,7 +2139,7 @@ var DatePicker = /** @class */ (function (_super) {
                     this.previousElementValue = this.inputElement.value;
                     if (isNullOrUndefined(this.value)) {
                         if (this.enableMask) {
-                            this.updateInputValue(this.maskedDateValue);
+                            this.setMaskedInputValue();
                         }
                         else {
                             this.updateInputValue('');
@@ -2220,13 +2251,21 @@ var DatePicker = /** @class */ (function (_super) {
                         this.notify('createMask', {
                             module: 'MaskedDateTime'
                         });
-                        this.updateInputValue(this.maskedDateValue);
+                        if (this.isMaskPlaceholderSwap() && document.activeElement !== this.inputElement) {
+                            this.swapMaskPlaceholder(false);
+                        }
+                        else {
+                            this.updateInputValue(this.maskedDateValue);
+                        }
                         this.bindInputEvent();
                     }
                     else {
                         if (this.inputElement.value === this.maskedDateValue) {
                             this.updateInputValue('');
                         }
+                        if (!this.placeholder && this.inputElement.hasAttribute('placeholder') && this.inputElement.getAttribute('placeholder') === this.maskedDateValue) {
+                            this.inputElement.removeAttribute('placeholder');
+                        }
                     }
                     break;
                 case 'min':