@syncfusion/ej2-calendars 19.2.62 → 19.3.53

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

@@ -1,4 +1,4 @@
-import { Animation, Browser, ChildProperty, Collection, Component, Event, EventHandler, HijriParser, Internationalization, KeyboardEvents, L10n, NotifyPropertyChanges, Property, addClass, append, attributes, blazorCultureFormats, cldrData, closest, createElement, detach, extend, formatUnit, getDefaultDateObject, getUniqueID, getValue, isBlazor, isNullOrUndefined, isUndefined, merge, prepend, remove, removeClass, rippleEffect, select, setStyleAttribute, setValue, throwError } from '@syncfusion/ej2-base';
+import { Animation, Browser, ChildProperty, Collection, Component, Event, EventHandler, HijriParser, Internationalization, KeyboardEvents, L10n, NotifyPropertyChanges, Property, addClass, append, attributes, cldrData, closest, createElement, detach, extend, formatUnit, getDefaultDateObject, getUniqueID, getValue, isNullOrUndefined, isUndefined, merge, prepend, remove, removeClass, rippleEffect, select, setStyleAttribute, setValue, throwError } from '@syncfusion/ej2-base';
 import { Popup } from '@syncfusion/ej2-popups';
 import { Input } from '@syncfusion/ej2-inputs';
 import { Button } from '@syncfusion/ej2-buttons';
@@ -301,7 +301,7 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
     CalendarBase.prototype.getCultureValues = function () {
         var culShortNames = [];
         var cldrObj;
-        var dayFormat = (isBlazor() ? 'days.' : 'days.stand-alone.') + this.dayHeaderFormat.toLowerCase();
+        var dayFormat = 'days.stand-alone.' + this.dayHeaderFormat.toLowerCase();
         if (this.locale === 'en' || this.locale === 'en-US') {
             cldrObj = (getValue(dayFormat, getDefaultDateObject()));
         }
@@ -410,17 +410,8 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
         }
     };
     CalendarBase.prototype.wireEvents = function (id, ref, keyConfig, moduleName) {
-        if (!(isBlazor() && ref)) {
-            EventHandler.add(this.headerTitleElement, 'click', this.navigateTitle, this);
-            this.defaultKeyConfigs = extend(this.defaultKeyConfigs, this.keyConfigs);
-        }
-        else {
-            this.element = document.getElementById(id);
-            this.defaultKeyConfigs = this.getDefaultKeyConfig();
-            this.defaultKeyConfigs = extend(this.defaultKeyConfigs, keyConfig);
-            this.blazorRef = ref;
-            this.serverModuleName = moduleName;
-        }
+        EventHandler.add(this.headerTitleElement, 'click', this.navigateTitle, this);
+        this.defaultKeyConfigs = extend(this.defaultKeyConfigs, this.keyConfigs);
         if (this.getModuleName() === 'calendar') {
             this.keyboardModule = new KeyboardEvents(this.element, {
                 eventName: 'keydown',
@@ -439,7 +430,6 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
     CalendarBase.prototype.dateWireEvents = function (id, ref, keyConfig, moduleName) {
         this.defaultKeyConfigs = this.getDefaultKeyConfig();
         this.defaultKeyConfigs = extend(this.defaultKeyConfigs, keyConfig);
-        this.blazorRef = ref;
         this.serverModuleName = moduleName;
     };
     CalendarBase.prototype.todayButtonClick = function (e, value, isCustomDate) {
@@ -470,21 +460,7 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
         this.renderDayCellArgs = null;
         this.calendarElement = this.tableBodyElement = this.footer = this.tableHeadElement = this.nextIcon = this.previousIcon = this.table = null;
     };
-    CalendarBase.prototype.checkDeviceMode = function (ref) {
-        if (Browser.isDevice && isBlazor() && ref) {
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            ref.invokeMethodAsync('OnDevice', true);
-        }
-    };
     CalendarBase.prototype.keyActionHandle = function (e, value, multiSelection) {
-        if (isBlazor() && this.blazorRef) {
-            e.preventDefault();
-            if (!this.tableBodyElement) {
-                this.element = closest(e.target, '.' + 'e-calendar');
-                this.tableBodyElement = this.element.querySelector('tbody');
-            }
-            multiSelection = false;
-        }
         var focusedDate = this.tableBodyElement.querySelector('tr td.e-focused-date');
         var selectedDate;
         if (multiSelection) {
@@ -498,147 +474,124 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
         else {
             selectedDate = this.tableBodyElement.querySelector('tr td.e-selected');
         }
-        if (isBlazor() && this.blazorRef) {
-            this.tableBodyElement.focus();
-            var targetEle = e.target;
-            var args = {
-                Action: e.action, Key: e.key, Events: e,
-                SelectDate: selectedDate ? selectedDate.id : null,
-                FocusedDate: focusedDate ? focusedDate.id : null,
-                classList: selectedDate ? selectedDate.classList.toString() : focusedDate ? focusedDate.classList.toString() : 'e-cell',
-                Id: focusedDate ? focusedDate.id : selectedDate ? selectedDate.id : null,
-                TargetClassList: targetEle.classList.toString()
-            };
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            this.blazorRef.invokeMethodAsync('OnCalendarKeyboardEvent', args);
-            if (targetEle.classList.contains('e-today')) {
-                targetEle.blur();
-                this.tableBodyElement.focus();
-            }
-            if (this.serverModuleName === 'sf.calendars.Calendar') {
-                this.tableBodyElement = null;
-            }
-        }
-        else {
-            var view = this.getViewNumber(this.currentView());
-            var depthValue = this.getViewNumber(this.depth);
-            var levelRestrict = (view === depthValue && this.getViewNumber(this.start) >= depthValue);
-            this.effect = '';
-            switch (e.action) {
-                case 'moveLeft':
-                    this.keyboardNavigate(-1, view, e, this.max, this.min);
-                    e.preventDefault();
-                    break;
-                case 'moveRight':
-                    this.keyboardNavigate(1, view, e, this.max, this.min);
-                    e.preventDefault();
-                    break;
-                case 'moveUp':
-                    if (view === 0) {
-                        this.keyboardNavigate(-7, view, e, this.max, this.min); // move the current date to the previous seven days.
-                    }
-                    else {
-                        this.keyboardNavigate(-4, view, e, this.max, this.min); // move the current year to the previous four days.
-                    }
-                    e.preventDefault();
-                    break;
-                case 'moveDown':
-                    if (view === 0) {
-                        this.keyboardNavigate(7, view, e, this.max, this.min);
-                    }
-                    else {
-                        this.keyboardNavigate(4, view, e, this.max, this.min);
-                    }
-                    e.preventDefault();
-                    break;
-                case 'select':
-                    if (e.target === this.todayElement) {
-                        this.todayButtonClick(e, value);
-                    }
-                    else {
-                        var element = !isNullOrUndefined(focusedDate) ? focusedDate : selectedDate;
-                        if (!isNullOrUndefined(element) && !element.classList.contains(DISABLED)) {
-                            if (levelRestrict) {
-                                // eslint-disable-next-line radix
-                                var d = new Date(parseInt('' + (element).id, 0));
-                                this.selectDate(e, d, (element));
-                            }
-                            else {
-                                this.contentClick(null, --view, (element), value);
-                            }
+        var view = this.getViewNumber(this.currentView());
+        var depthValue = this.getViewNumber(this.depth);
+        var levelRestrict = (view === depthValue && this.getViewNumber(this.start) >= depthValue);
+        this.effect = '';
+        switch (e.action) {
+            case 'moveLeft':
+                this.keyboardNavigate(-1, view, e, this.max, this.min);
+                e.preventDefault();
+                break;
+            case 'moveRight':
+                this.keyboardNavigate(1, view, e, this.max, this.min);
+                e.preventDefault();
+                break;
+            case 'moveUp':
+                if (view === 0) {
+                    this.keyboardNavigate(-7, view, e, this.max, this.min); // move the current date to the previous seven days.
+                }
+                else {
+                    this.keyboardNavigate(-4, view, e, this.max, this.min); // move the current year to the previous four days.
+                }
+                e.preventDefault();
+                break;
+            case 'moveDown':
+                if (view === 0) {
+                    this.keyboardNavigate(7, view, e, this.max, this.min);
+                }
+                else {
+                    this.keyboardNavigate(4, view, e, this.max, this.min);
+                }
+                e.preventDefault();
+                break;
+            case 'select':
+                if (e.target === this.todayElement) {
+                    this.todayButtonClick(e, value);
+                }
+                else {
+                    var element = !isNullOrUndefined(focusedDate) ? focusedDate : selectedDate;
+                    if (!isNullOrUndefined(element) && !element.classList.contains(DISABLED)) {
+                        if (levelRestrict) {
+                            // eslint-disable-next-line radix
+                            var d = new Date(parseInt('' + (element).id, 0));
+                            this.selectDate(e, d, (element));
+                        }
+                        else {
+                            this.contentClick(null, --view, (element), value);
                         }
                     }
-                    break;
-                case 'controlUp':
-                    this.title();
-                    e.preventDefault();
-                    break;
-                case 'controlDown':
-                    if (!isNullOrUndefined(focusedDate) || !isNullOrUndefined(selectedDate) && !levelRestrict) {
-                        this.contentClick(null, --view, (focusedDate || selectedDate), value);
-                    }
-                    e.preventDefault();
-                    break;
-                case 'home':
-                    this.currentDate = this.firstDay(this.currentDate);
-                    detach(this.tableBodyElement);
-                    if (view === 0) {
-                        this.renderMonths(e);
-                    }
-                    else if (view === 1) {
-                        this.renderYears(e);
-                    }
-                    else {
-                        this.renderDecades(e);
-                    }
-                    e.preventDefault();
-                    break;
-                case 'end':
-                    this.currentDate = this.lastDay(this.currentDate, view);
-                    detach(this.tableBodyElement);
-                    if (view === 0) {
-                        this.renderMonths(e);
-                    }
-                    else if (view === 1) {
-                        this.renderYears(e);
-                    }
-                    else {
-                        this.renderDecades(e);
-                    }
-                    e.preventDefault();
-                    break;
-                case 'pageUp':
-                    this.addMonths(this.currentDate, -1);
-                    this.navigateTo('Month', this.currentDate);
-                    e.preventDefault();
-                    break;
-                case 'pageDown':
-                    this.addMonths(this.currentDate, 1);
-                    this.navigateTo('Month', this.currentDate);
-                    e.preventDefault();
-                    break;
-                case 'shiftPageUp':
-                    this.addYears(this.currentDate, -1);
-                    this.navigateTo('Month', this.currentDate);
-                    e.preventDefault();
-                    break;
-                case 'shiftPageDown':
-                    this.addYears(this.currentDate, 1);
-                    this.navigateTo('Month', this.currentDate);
-                    e.preventDefault();
-                    break;
-                case 'controlHome':
-                    this.navigateTo('Month', new Date(this.currentDate.getFullYear(), 0, 1));
-                    e.preventDefault();
-                    break;
-                case 'controlEnd':
-                    this.navigateTo('Month', new Date(this.currentDate.getFullYear(), 11, 31));
-                    e.preventDefault();
-                    break;
-            }
-            if (this.getModuleName() === 'calendar') {
-                this.table.focus();
-            }
+                }
+                break;
+            case 'controlUp':
+                this.title();
+                e.preventDefault();
+                break;
+            case 'controlDown':
+                if (!isNullOrUndefined(focusedDate) || !isNullOrUndefined(selectedDate) && !levelRestrict) {
+                    this.contentClick(null, --view, (focusedDate || selectedDate), value);
+                }
+                e.preventDefault();
+                break;
+            case 'home':
+                this.currentDate = this.firstDay(this.currentDate);
+                detach(this.tableBodyElement);
+                if (view === 0) {
+                    this.renderMonths(e);
+                }
+                else if (view === 1) {
+                    this.renderYears(e);
+                }
+                else {
+                    this.renderDecades(e);
+                }
+                e.preventDefault();
+                break;
+            case 'end':
+                this.currentDate = this.lastDay(this.currentDate, view);
+                detach(this.tableBodyElement);
+                if (view === 0) {
+                    this.renderMonths(e);
+                }
+                else if (view === 1) {
+                    this.renderYears(e);
+                }
+                else {
+                    this.renderDecades(e);
+                }
+                e.preventDefault();
+                break;
+            case 'pageUp':
+                this.addMonths(this.currentDate, -1);
+                this.navigateTo('Month', this.currentDate);
+                e.preventDefault();
+                break;
+            case 'pageDown':
+                this.addMonths(this.currentDate, 1);
+                this.navigateTo('Month', this.currentDate);
+                e.preventDefault();
+                break;
+            case 'shiftPageUp':
+                this.addYears(this.currentDate, -1);
+                this.navigateTo('Month', this.currentDate);
+                e.preventDefault();
+                break;
+            case 'shiftPageDown':
+                this.addYears(this.currentDate, 1);
+                this.navigateTo('Month', this.currentDate);
+                e.preventDefault();
+                break;
+            case 'controlHome':
+                this.navigateTo('Month', new Date(this.currentDate.getFullYear(), 0, 1));
+                e.preventDefault();
+                break;
+            case 'controlEnd':
+                this.navigateTo('Month', new Date(this.currentDate.getFullYear(), 11, 31));
+                e.preventDefault();
+                break;
+        }
+        if (this.getModuleName() === 'calendar') {
+            this.table.focus();
         }
     };
     CalendarBase.prototype.keyboardNavigate = function (number, currentView, e, max, min) {
@@ -762,12 +715,12 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
             }
             minMaxDate = new Date(+localDate);
             localDate = this.minMaxDate(localDate);
-            var dateFormatOptions = { type: 'dateTime', skeleton: isBlazor() ? 'D' : 'full' };
+            var dateFormatOptions = { type: 'dateTime', skeleton: 'full' };
             var date = this.globalize.parseDate(this.globalize.formatDate(localDate, dateFormatOptions), dateFormatOptions);
             var tdEle = this.dayCell(localDate);
-            var title = this.globalize.formatDate(localDate, { type: 'date', skeleton: isBlazor() ? 'D' : 'full' });
+            var title = this.globalize.formatDate(localDate, { type: 'date', skeleton: 'full' });
             var dayLink = this.createElement('span');
-            dayLink.textContent = this.globalize.formatDate(localDate, { format: 'd', type: 'date', skeleton: isBlazor() ? 'd' : 'yMd' });
+            dayLink.textContent = this.globalize.formatDate(localDate, { format: 'd', type: 'date', skeleton: 'yMd' });
             var disabled = (this.min > localDate) || (this.max < localDate);
             if (disabled) {
                 addClass([tdEle], DISABLED);
@@ -797,8 +750,8 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
                 if (multiSelection) {
                     if (!isNullOrUndefined(values) && values.length > 0) {
                         for (var index = 0; index < values.length; index++) {
-                            var localDateString = +new Date(this.globalize.formatDate(argument.date, { type: 'date', skeleton: isBlazor() ? 'd' : 'yMd' }));
-                            var tempDateString = +new Date(this.globalize.formatDate(values[index], { type: 'date', skeleton: isBlazor() ? 'd' : 'yMd' }));
+                            var localDateString = +new Date(this.globalize.formatDate(argument.date, { type: 'date', skeleton: 'yMd' }));
+                            var tempDateString = +new Date(this.globalize.formatDate(values[index], { type: 'date', skeleton: 'yMd' }));
                             if (localDateString === tempDateString) {
                                 values.splice(index, 1);
                                 index = -1;
@@ -829,7 +782,7 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
             if (multiSelection && !isNullOrUndefined(values) && !disabledCls) {
                 for (var tempValue = 0; tempValue < values.length; tempValue++) {
                     var type = (this.calendarMode === 'Gregorian') ? 'gregorian' : 'islamic';
-                    var formatOptions = { format: this.getFromatStringValue(), type: 'date', skeleton: 'short', calendar: type };
+                    var formatOptions = { format: null, type: 'date', skeleton: 'short', calendar: type };
                     var localDateString = this.globalize.formatDate(localDate, formatOptions);
                     var tempDateString = this.globalize.formatDate(values[tempValue], formatOptions);
                     if ((localDateString === tempDateString && this.getDateVal(localDate, values[tempValue]))
@@ -896,7 +849,7 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
             var localMonth = (value && (value).getMonth() === localDate.getMonth());
             var select$$1 = (value && (value).getFullYear() === yr && localMonth);
             dayLink.textContent = this.toCapitalize(this.globalize.formatDate(localDate, {
-                format: isBlazor() ? 'MMM' : null, type: 'dateTime', skeleton: 'MMM'
+                format: null, type: 'dateTime', skeleton: 'MMM'
             }));
             if ((this.min && (curYrs < minYr || (month < minMonth && curYrs === minYr))) || (this.max && (curYrs > maxYr || (month > maxMonth && curYrs >= maxYr)))) {
                 addClass([tdEle], DISABLED);
@@ -933,9 +886,9 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
         var startFullYr = startYr.getFullYear();
         var endFullYr = endYr.getFullYear();
         var startHdrYr = this.globalize.formatDate(startYr, {
-            format: isBlazor() ? 'yyyy' : null, type: 'dateTime', skeleton: 'y'
+            format: null, type: 'dateTime', skeleton: 'y'
         });
-        var endHdrYr = this.globalize.formatDate(endYr, { format: isBlazor() ? 'yyyy' : null, type: 'dateTime', skeleton: 'y' });
+        var endHdrYr = this.globalize.formatDate(endYr, { format: null, type: 'dateTime', skeleton: 'y' });
         this.headerTitleElement.textContent = startHdrYr + ' - ' + (endHdrYr);
         var start = new Date(localYr - (localYr % 10) - 1, 0, 1);
         var startYear = start.getFullYear();
@@ -946,7 +899,7 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
             attributes(tdEle, { 'role': 'gridcell' });
             var dayLink = this.createElement('span');
             dayLink.textContent = this.globalize.formatDate(localDate, {
-                format: isBlazor() ? 'yyyy' : null, type: 'dateTime', skeleton: 'y'
+                format: null, type: 'dateTime', skeleton: 'y'
             });
             if ((year < startFullYr) || (year > endFullYr)) {
                 addClass([tdEle], OTHERDECADE);
@@ -980,7 +933,7 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
     };
     CalendarBase.prototype.dayCell = function (localDate) {
         var type = (this.calendarMode === 'Gregorian') ? 'gregorian' : 'islamic';
-        var dateFormatOptions = { skeleton: isBlazor() ? 'F' : 'full', type: 'dateTime', calendar: type };
+        var dateFormatOptions = { skeleton: 'full', type: 'dateTime', calendar: type };
         var date = this.globalize.parseDate(this.globalize.formatDate(localDate, dateFormatOptions), dateFormatOptions);
         var value = date.valueOf();
         var attrs = {
@@ -1365,15 +1318,15 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
                 var type = (this.calendarMode === 'Gregorian') ? 'gregorian' : 'islamic';
                 var tempValueString = void 0;
                 if (this.calendarMode === 'Gregorian') {
-                    tempValueString = this.globalize.formatDate(tempValue, { type: 'date', skeleton: isBlazor() ? 'd' : 'yMd' });
+                    tempValueString = this.globalize.formatDate(tempValue, { type: 'date', skeleton: 'yMd' });
                 }
                 else {
                     tempValueString = this.globalize.formatDate(tempValue, { type: 'dateTime', skeleton: 'full', calendar: 'islamic' });
                 }
-                var minFormatOption = { type: 'date', skeleton: isBlazor() ? 'd' : 'yMd', calendar: type };
+                var minFormatOption = { type: 'date', skeleton: 'yMd', calendar: type };
                 var minStringValue = this.globalize.formatDate(this.min, minFormatOption);
                 var minString = minStringValue;
-                var maxFormatOption = { type: 'date', skeleton: isBlazor() ? 'd' : 'yMd', calendar: type };
+                var maxFormatOption = { type: 'date', skeleton: 'yMd', calendar: type };
                 var maxStringValue = this.globalize.formatDate(this.max, maxFormatOption);
                 var maxString = maxStringValue;
                 if (+new Date(tempValueString) < +new Date(minString) ||
@@ -1407,9 +1360,9 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
         var monthFormatOptions;
         var type = (this.calendarMode === 'Gregorian') ? 'gregorian' : 'islamic';
         if (this.calendarMode === 'Gregorian') {
-            dayFormatOptions = globalize.formatDate(date, { type: 'dateTime', skeleton: isBlazor() ? 'y' : 'yMMMM', calendar: type });
+            dayFormatOptions = globalize.formatDate(date, { type: 'dateTime', skeleton: 'yMMMM', calendar: type });
             monthFormatOptions = globalize.formatDate(date, {
-                format: isBlazor() ? 'yyyy' : null, type: 'dateTime', skeleton: 'y', calendar: type
+                format: null, type: 'dateTime', skeleton: 'y', calendar: type
             });
         }
         else {
@@ -1432,11 +1385,11 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
         var title;
         var view = this.currentView();
         if (view === 'Month') {
-            title = this.globalize.formatDate(this.currentDate, { type: 'date', skeleton: isBlazor() ? 'D' : 'full', calendar: type });
+            title = this.globalize.formatDate(this.currentDate, { type: 'date', skeleton: 'full', calendar: type });
         }
         else if (view === 'Year') {
             if (type !== 'islamic') {
-                title = this.globalize.formatDate(this.currentDate, { type: 'date', skeleton: isBlazor() ? 'y' : 'yMMMM', calendar: type });
+                title = this.globalize.formatDate(this.currentDate, { type: 'date', skeleton: 'yMMMM', calendar: type });
             }
             else {
                 title = this.globalize.formatDate(this.currentDate, { type: 'date', skeleton: 'GyMMM', calendar: type });
@@ -1444,7 +1397,7 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
         }
         else {
             title = this.globalize.formatDate(this.currentDate, {
-                format: isBlazor() ? 'yyyy' : null, type: 'date', skeleton: 'y', calendar: type
+                format: null, type: 'date', skeleton: 'y', calendar: type
             });
         }
         if (selectedEle || focusedEle) {
@@ -1642,11 +1595,9 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
     };
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     CalendarBase.prototype.getCultureObjects = function (ld, c) {
-        var gregorianFormat = (isBlazor() ? '.dates.days.' :
-            '.dates.calendars.gregorian.days.format.') + this.dayHeaderFormat.toLowerCase();
-        var islamicFormat = (isBlazor() ? '.dates.days.' :
-            '.dates.calendars.islamic.days.format.') + this.dayHeaderFormat.toLowerCase();
-        var mainVal = isBlazor() ? '' : 'main.';
+        var gregorianFormat = '.dates.calendars.gregorian.days.format.' + this.dayHeaderFormat.toLowerCase();
+        var islamicFormat = '.dates.calendars.islamic.days.format.' + this.dayHeaderFormat.toLowerCase();
+        var mainVal = 'main.';
         if (this.calendarMode === 'Gregorian') {
             return getValue(mainVal + '' + this.locale + gregorianFormat, ld);
         }
@@ -1698,7 +1649,7 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
             eve = element;
         }
         var type = (this.calendarMode === 'Gregorian') ? 'gregorian' : 'islamic';
-        var dateFormatOptions = { type: 'dateTime', skeleton: isBlazor() ? 'F' : 'full', calendar: type };
+        var dateFormatOptions = { type: 'dateTime', skeleton: 'full', calendar: type };
         // eslint-disable-next-line radix
         var dateString = this.globalize.formatDate(new Date(parseInt('' + eve.getAttribute('id'), 0)), dateFormatOptions);
         var date = this.globalize.parseDate(dateString, dateFormatOptions);
@@ -1766,7 +1717,7 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
                 removeClass([element], SELECTED);
                 for (var i = 0; i < copyValues.length; i++) {
                     var type = (this.calendarMode === 'Gregorian') ? 'gregorian' : 'islamic';
-                    var formatOptions = { format: this.getFromatStringValue(), type: 'date', skeleton: 'short', calendar: type };
+                    var formatOptions = { format: null, type: 'date', skeleton: 'short', calendar: type };
                     var localDateString = this.globalize.formatDate(date, formatOptions);
                     var tempDateString = this.globalize.formatDate(copyValues[i], formatOptions);
                     if (localDateString === tempDateString) {
@@ -1786,22 +1737,16 @@ var CalendarBase = /** @__PURE__ @class */ (function (_super) {
         }
         this.isDateSelected = true;
     };
-    CalendarBase.prototype.getFromatStringValue = function () {
-        return isBlazor() ?
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            'M' + getDefaultDateObject().dateSeperator + 'd' + getDefaultDateObject().dateSeperator + 'yy'
-            : null;
-    };
     CalendarBase.prototype.checkPresentDate = function (dates, values) {
         var previousValue = false;
         if (!isNullOrUndefined(values)) {
             for (var checkPrevious = 0; checkPrevious < values.length; checkPrevious++) {
                 var type = (this.calendarMode === 'Gregorian') ? 'gregorian' : 'islamic';
                 var localDateString = this.globalize.formatDate(dates, {
-                    format: this.getFromatStringValue(), type: 'date', skeleton: 'short', calendar: type
+                    format: null, type: 'date', skeleton: 'short', calendar: type
                 });
                 var tempDateString = this.globalize.formatDate(values[checkPrevious], {
-                    format: this.getFromatStringValue(), type: 'date', skeleton: 'short', calendar: type
+                    format: null, type: 'date', skeleton: 'short', calendar: type
                 });
                 if (localDateString === tempDateString) {
                     previousValue = true;
@@ -3126,7 +3071,6 @@ var ERROR = 'e-error';
 var ACTIVE = 'e-active';
 var OVERFLOW = 'e-date-overflow';
 var DATEICON = 'e-date-icon';
-var CLEARICON = 'e-clear-icon';
 var ICONS = 'e-icons';
 var OPENDURATION = 300;
 var OFFSETVALUE = 4;
@@ -3162,7 +3106,6 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         _this.isDateIconClicked = false;
         _this.isAltKeyPressed = false;
         _this.isInteracted = true;
-        _this.isBlazorServer = false;
         _this.invalidValueString = null;
         _this.checkPreviousValue = null;
         _this.maskedDateValue = '';
@@ -3184,9 +3127,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         this.initialize();
         this.bindEvents();
         this.renderComplete();
-        if (!this.isBlazorServer) {
-            this.setTimeZone(this.serverTimezoneOffset);
-        }
+        this.setTimeZone(this.serverTimezoneOffset);
     };
     DatePicker.prototype.setTimeZone = function (offsetValue) {
         if (!isNullOrUndefined(this.serverTimezoneOffset) && this.value) {
@@ -3228,36 +3169,18 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         }
     };
     DatePicker.prototype.initialize = function () {
-        if (!this.isBlazorServer) {
-            if (this.enableMask) {
-                this.notify("createMask", {
-                    module: "MaskedDateTime",
-                });
-            }
-            this.checkInvalidValue(this.value);
-            this.createInput();
-            this.updateHtmlAttributeToWrapper();
-            this.setAllowEdit();
-            this.updateInput();
-            if (this.enableMask && !this.value && this.maskedDateValue && (this.floatLabelType == 'Always' || !this.floatLabelType || !this.placeholder)) {
-                this.updateInputValue(this.maskedDateValue);
-            }
-        }
-        else {
-            var parentElement = this.element.parentElement;
-            this.inputWrapper = {
-                container: parentElement,
-                clearButton: parentElement.querySelector('.' + CLEARICON),
-                buttons: [parentElement.querySelector('.' + DATEICON)]
-            };
-            Input.bindInitialEvent({
-                element: this.inputElement,
-                floatLabelType: this.floatLabelType
+        if (this.enableMask) {
+            this.notify("createMask", {
+                module: "MaskedDateTime",
             });
-            if (this.showClearButton && this.inputWrapper.clearButton) {
-                Input.wireClearBtnEvents(this.inputElement, this.inputWrapper.clearButton, this.inputWrapper.container);
-            }
-            this.setAllowEdit();
+        }
+        this.checkInvalidValue(this.value);
+        this.createInput();
+        this.updateHtmlAttributeToWrapper();
+        this.setAllowEdit();
+        this.updateInput();
+        if (this.enableMask && !this.value && this.maskedDateValue && (this.floatLabelType == 'Always' || !this.floatLabelType || !this.placeholder)) {
+            this.updateInputValue(this.maskedDateValue);
         }
         this.previousElementValue = this.inputElement.value;
         this.previousDate = !isNullOrUndefined(this.value) ? new Date(+this.value) : null;
@@ -3319,9 +3242,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         if (isDynamic === void 0) { isDynamic = false; }
         var formatOptions;
         if (this.value && !this.isCalendar() && !isDynamic) {
-            if (!this.isBlazorServer) {
-                this.disabledDates();
-            }
+            this.disabledDates();
         }
         if (isNaN(+new Date(this.checkValue(this.value)))) {
             this.setProperties({ value: null }, true);
@@ -3339,7 +3260,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
             if (this.getModuleName() === 'datetimepicker') {
                 if (this.calendarMode === 'Gregorian') {
                     dateString = this.globalize.formatDate(this.value, {
-                        format: tempFormat, type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd'
+                        format: tempFormat, type: 'dateTime', skeleton: 'yMd'
                     });
                 }
                 else {
@@ -3350,7 +3271,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
             }
             else {
                 if (this.calendarMode === 'Gregorian') {
-                    formatOptions = { format: this.formatString, type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd' };
+                    formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd' };
                 }
                 else {
                     formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };
@@ -3404,8 +3325,8 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         if (this.getModuleName() === 'datetimepicker') {
             var culture = new Internationalization(this.locale);
             if (this.calendarMode === 'Gregorian') {
-                formatOptions = { format: this.dateTimeFormat, type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd' };
-                formatDateTime = { format: culture.getDatePattern({ skeleton: isBlazor() ? 'd' : 'yMd' }), type: 'dateTime' };
+                formatOptions = { format: this.dateTimeFormat, type: 'dateTime', skeleton: 'yMd' };
+                formatDateTime = { format: culture.getDatePattern({ skeleton: 'yMd' }), type: 'dateTime' };
             }
             else {
                 formatOptions = { format: this.dateTimeFormat, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };
@@ -3414,7 +3335,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         }
         else {
             if (this.calendarMode === 'Gregorian') {
-                formatOptions = { format: this.formatString, type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd' };
+                formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd' };
             }
             else {
                 formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };
@@ -3438,8 +3359,8 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
             if (this.getModuleName() === 'datetimepicker') {
                 var culture = new Internationalization(this.locale);
                 if (this.calendarMode === 'Gregorian') {
-                    formatOptions = { format: this.dateTimeFormat, type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd' };
-                    formatDateTime = { format: culture.getDatePattern({ skeleton: isBlazor() ? 'd' : 'yMd' }), type: 'dateTime' };
+                    formatOptions = { format: this.dateTimeFormat, type: 'dateTime', skeleton: 'yMd' };
+                    formatDateTime = { format: culture.getDatePattern({ skeleton: 'yMd' }), type: 'dateTime' };
                 }
                 else {
                     formatOptions = { format: this.dateTimeFormat, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };
@@ -3449,7 +3370,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
             }
             else {
                 if (this.calendarMode === 'Gregorian') {
-                    formatOptions = { format: this.formatString, type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd' };
+                    formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd' };
                 }
                 else {
                     // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -3504,7 +3425,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         }
     };
     DatePicker.prototype.bindEvents = function () {
-        EventHandler.add(this.inputWrapper.buttons[0], 'mousedown touchstart', (this.isBlazorServer ? this.preventEventBubbling : this.dateIconHandler), this);
+        EventHandler.add(this.inputWrapper.buttons[0], 'mousedown touchstart', this.dateIconHandler, this);
         EventHandler.add(this.inputElement, 'mouseup', this.mouseUpHandler, this);
         EventHandler.add(this.inputElement, 'focus', this.inputFocusHandler, this);
         EventHandler.add(this.inputElement, 'blur', this.inputBlurHandler, this);
@@ -3514,7 +3435,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         this.bindInputEvent();
         // To prevent the twice triggering.
         EventHandler.add(this.inputElement, 'change', this.inputChangeHandler, this);
-        if (this.showClearButton && (this.inputWrapper.clearButton || (this.isBlazorServer))) {
+        if (this.showClearButton && this.inputWrapper.clearButton) {
             EventHandler.add(this.inputWrapper.clearButton, 'mousedown touchstart', this.resetHandler, this);
         }
         if (this.formElement) {
@@ -3551,7 +3472,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         }
     };
     DatePicker.prototype.unBindEvents = function () {
-        EventHandler.remove(this.inputWrapper.buttons[0], 'mousedown touchstart', (this.isBlazorServer ? this.preventEventBubbling : this.dateIconHandler));
+        EventHandler.remove(this.inputWrapper.buttons[0], 'mousedown touchstart', this.dateIconHandler);
         EventHandler.remove(this.inputElement, 'mouseup', this.mouseUpHandler);
         EventHandler.remove(this.inputElement, 'focus', this.inputFocusHandler);
         EventHandler.remove(this.inputElement, 'blur', this.inputBlurHandler);
@@ -3559,7 +3480,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         if (this.enableMask) {
             EventHandler.remove(this.inputElement, 'keydown', this.keydownHandler);
         }
-        if (this.showClearButton && (this.inputWrapper.clearButton || (this.isBlazorServer))) {
+        if (this.showClearButton && this.inputWrapper.clearButton) {
             EventHandler.remove(this.inputWrapper.clearButton, 'mousedown touchstart', this.resetHandler);
         }
         if (this.formElement) {
@@ -3577,13 +3498,11 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                 this.inputValueCopy = null;
                 this.inputElement.setAttribute('value', '');
             }
-            if (!this.isBlazorServer) {
-                this.setProperties({ value: this.inputValueCopy }, true);
-                this.restoreValue();
-                if (this.inputElement) {
-                    this.updateInputValue(value);
-                    this.errorClass();
-                }
+            this.setProperties({ value: this.inputValueCopy }, true);
+            this.restoreValue();
+            if (this.inputElement) {
+                this.updateInputValue(value);
+                this.errorClass();
             }
         }
     };
@@ -3592,7 +3511,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         this.previousDate = this.value;
         this.previousElementValue = (isNullOrUndefined(this.inputValueCopy)) ? '' :
             this.globalize.formatDate(this.inputValueCopy, {
-                format: this.formatString, type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd'
+                format: this.formatString, type: 'dateTime', skeleton: 'yMd'
             });
     };
     DatePicker.prototype.inputChangeHandler = function (e) {
@@ -3622,9 +3541,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         }
     };
     DatePicker.prototype.clear = function (event) {
-        if (!this.isBlazorServer) {
-            this.setProperties({ value: null }, true);
-        }
+        this.setProperties({ value: null }, true);
         if (!this.enableMask) {
             this.updateInputValue('');
         }
@@ -3633,19 +3550,13 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         };
         this.trigger('cleared', clearedArgs);
         this.invalidValueString = '';
-        if (!this.isBlazorServer) {
-            this.updateInput();
-            this.popupUpdate();
-            this.changeEvent(event);
-            if (this.enableMask) {
-                this.notify("clearHandler", {
-                    module: "MaskedDateTime"
-                });
-            }
-        }
-        if (this.isBlazorServer) {
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            this.interopAdaptor.invokeMethodAsync('OnValueCleared');
+        this.updateInput();
+        this.popupUpdate();
+        this.changeEvent(event);
+        if (this.enableMask) {
+            this.notify("clearHandler", {
+                module: "MaskedDateTime"
+            });
         }
     };
     DatePicker.prototype.preventEventBubbling = function (e) {
@@ -3665,24 +3576,20 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
             this.inputElement.setAttribute('readonly', '');
             this.inputElement.blur();
         }
-        if (!this.isBlazorServer) {
-            e.preventDefault();
-        }
+        e.preventDefault();
         if (!this.readonly) {
-            if (this.isCalendar() && !this.isBlazorServer) {
+            if (this.isCalendar()) {
                 this.hide(e);
             }
             else {
-                if (!this.isBlazorServer || (this.isBlazorServer && this.inputWrapper.container.nextElementSibling)) {
-                    this.isDateIconClicked = true;
-                    this.show(null, e);
-                    if (this.getModuleName() === 'datetimepicker') {
-                        this.inputElement.focus();
-                    }
+                this.isDateIconClicked = true;
+                this.show(null, e);
+                if (this.getModuleName() === 'datetimepicker') {
                     this.inputElement.focus();
-                    addClass([this.inputWrapper.container], [INPUTFOCUS]);
-                    addClass(this.inputWrapper.buttons, ACTIVE);
                 }
+                this.inputElement.focus();
+                addClass([this.inputWrapper.container], [INPUTFOCUS]);
+                addClass(this.inputWrapper.buttons, ACTIVE);
             }
         }
         this.isIconClicked = false;
@@ -3783,7 +3690,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
             }
         }
         var focusArguments = {
-            model: isBlazor() && this.isServerRendered ? null : this
+            model: this
         };
         this.isDateIconClicked = false;
         this.trigger('focus', focusArguments);
@@ -3804,32 +3711,26 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         if (!this.enabled) {
             return;
         }
-        if (!this.isBlazorServer) {
-            this.strictModeUpdate();
-            if (this.inputElement.value === '' && isNullOrUndefined(this.value)) {
-                this.invalidValueString = null;
+        this.strictModeUpdate();
+        if (this.inputElement.value === '' && isNullOrUndefined(this.value)) {
+            this.invalidValueString = null;
+            this.updateInputValue('');
+        }
+        this.updateInput();
+        this.popupUpdate();
+        this.changeTrigger(e);
+        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('');
             }
-            this.updateInput();
-            this.popupUpdate();
-            this.changeTrigger(e);
-            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('');
-                }
-            }
-            this.errorClass();
-        }
-        else {
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            this.interopAdaptor.invokeMethodAsync('OnStrictModeUpdate', this.inputElement.value);
         }
+        this.errorClass();
         if (this.isCalendar() && document.activeElement === this.inputElement) {
             this.hide(e);
         }
         if (this.getModuleName() === 'datepicker') {
             var blurArguments = {
-                model: isBlazor() && this.isServerRendered ? null : this
+                model: this
             };
             this.trigger('blur', blurArguments);
         }
@@ -3867,7 +3768,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
             else if (closest(target, '.e-footer-container')
                 && target.classList.contains('e-today')
                 && target.classList.contains('e-btn')
-                && (+new Date(+this.value) === +_super.prototype.generateTodayVal.call(this, this.value) && !this.isBlazorServer)) {
+                && (+new Date(+this.value) === +_super.prototype.generateTodayVal.call(this, this.value))) {
                 this.hide(e);
             }
         }
@@ -3882,40 +3783,22 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                 break;
             case 'altDownArrow':
                 this.isAltKeyPressed = true;
-                if (!this.isBlazorServer) {
-                    this.strictModeUpdate();
-                    this.updateInput();
-                    this.changeTrigger(e);
-                }
-                else {
-                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                    this.interopAdaptor.invokeMethodAsync('OnStrictModeUpdate', this.inputElement.value);
-                }
+                this.strictModeUpdate();
+                this.updateInput();
+                this.changeTrigger(e);
                 if (this.getModuleName() === 'datepicker') {
-                    if (!this.isBlazorServer) {
-                        this.show(null, e);
-                    }
-                    else {
-                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                        this.interopAdaptor.invokeMethodAsync('OnPopupHide', true);
-                    }
+                    this.show(null, e);
                 }
                 break;
             case 'escape':
                 this.hide(e);
                 break;
             case 'enter':
-                if (!this.isBlazorServer) {
-                    this.strictModeUpdate();
-                    this.updateInput();
-                    this.popupUpdate();
-                    this.changeTrigger(e);
-                    this.errorClass();
-                }
-                else {
-                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                    this.interopAdaptor.invokeMethodAsync('OnStrictModeUpdate', this.inputElement.value);
-                }
+                this.strictModeUpdate();
+                this.updateInput();
+                this.popupUpdate();
+                this.changeTrigger(e);
+                this.errorClass();
                 if (!this.isCalendar() && document.activeElement === this.inputElement) {
                     this.hide(e);
                 }
@@ -3940,17 +3823,11 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                     start = this.inputElement.selectionStart;
                     end = this.inputElement.selectionEnd;
                 }
-                if (!this.isBlazorServer) {
-                    this.strictModeUpdate();
-                    this.updateInput();
-                    this.popupUpdate();
-                    this.changeTrigger(e);
-                    this.errorClass();
-                }
-                else {
-                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                    this.interopAdaptor.invokeMethodAsync('OnStrictModeUpdate', this.inputElement.value);
-                }
+                this.strictModeUpdate();
+                this.updateInput();
+                this.popupUpdate();
+                this.changeTrigger(e);
+                this.errorClass();
                 if (this.enableMask) {
                     this.inputElement.selectionStart = start;
                     this.inputElement.selectionEnd = end;
@@ -3969,7 +3846,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         this.previousDate = ((!isNullOrUndefined(this.value) && new Date(+this.value)) || null);
         if (this.isCalendar()) {
             _super.prototype.keyActionHandle.call(this, e);
-            if (!this.isBlazorServer && this.isCalendar()) {
+            if (this.isCalendar()) {
                 attributes(this.inputElement, {
                     'aria-activedescendant': '' + this.setActiveDescendant()
                 });
@@ -3984,7 +3861,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                     removeClass(this.popupObj.element.querySelectorAll('.' + SELECTED$2), [SELECTED$2]);
                 }
             }
-            if (!isNullOrUndefined(this.value) && !this.isBlazorServer) {
+            if (!isNullOrUndefined(this.value)) {
                 if ((+this.value >= +this.min) && (+this.value <= +this.max)) {
                     var targetdate = new Date(this.checkValue(this.value));
                     _super.prototype.navigateTo.call(this, 'Month', targetdate);
@@ -4012,7 +3889,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
             if (this.calendarMode === 'Gregorian') {
                 dateOptions = {
                     format: !isNullOrUndefined(this.formatString) ? this.formatString : this.dateTimeFormat,
-                    type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd'
+                    type: 'dateTime', skeleton: 'yMd'
                 };
             }
             else {
@@ -4024,7 +3901,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         }
         else {
             if (this.calendarMode === 'Gregorian') {
-                formatOptions = { format: format, type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd' };
+                formatOptions = { format: format, type: 'dateTime', skeleton: 'yMd' };
             }
             else {
                 formatOptions = { format: format, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };
@@ -4041,7 +3918,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
             }
             else {
                 if (this.calendarMode === 'Gregorian') {
-                    formatOptions = { type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd' };
+                    formatOptions = { type: 'dateTime', skeleton: 'yMd' };
                 }
                 else {
                     formatOptions = { type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };
@@ -4086,17 +3963,9 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
     };
     DatePicker.prototype.createCalendar = function () {
         var _this = this;
-        if (!this.isBlazorServer) {
-            this.popupWrapper = this.createElement('div', { className: '' + ROOT$1 + ' ' + POPUPWRAPPER });
-            if (!isNullOrUndefined(this.cssClass)) {
-                this.popupWrapper.className += ' ' + this.cssClass;
-            }
-        }
-        else {
-            this.popupWrapper = this.inputWrapper.container.nextElementSibling;
-            this.calendarElement = this.popupWrapper.firstElementChild;
-            this.tableBodyElement = select('tbody', this.calendarElement);
-            this.contentElement = select('.e-content', this.calendarElement);
+        this.popupWrapper = this.createElement('div', { className: '' + ROOT$1 + ' ' + POPUPWRAPPER });
+        if (!isNullOrUndefined(this.cssClass)) {
+            this.popupWrapper.className += ' ' + this.cssClass;
         }
         if (Browser.isDevice) {
             this.modelHeader();
@@ -4109,7 +3978,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         //this.calendarElement represent the Calendar object from the Calendar class.
         this.calendarElement.querySelector('table tbody').className = '';
         this.popupObj = new Popup(this.popupWrapper, {
-            content: this.isBlazorServer ? null : this.calendarElement,
+            content: this.calendarElement,
             relateTo: Browser.isDevice ? document.body : this.inputWrapper.container,
             position: Browser.isDevice ? { X: 'center', Y: 'center' } : { X: 'left', Y: 'bottom' },
             offsetY: OFFSETVALUE,
@@ -4138,7 +4007,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                 if (_this.isDateIconClicked) {
                     _this.inputWrapper.container.children[_this.index].focus();
                 }
-                if (_this.value && !_this.isBlazorServer) {
+                if (_this.value) {
                     _this.disabledDates();
                 }
                 if (_this.popupObj) {
@@ -4156,9 +4025,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                 }
             }
         });
-        if (!this.isBlazorServer) {
-            this.popupObj.element.className += ' ' + this.cssClass;
-        }
+        this.popupObj.element.className += ' ' + this.cssClass;
         this.setAriaAttributes();
     };
     DatePicker.prototype.setAriaDisabled = function () {
@@ -4271,7 +4138,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         if (this.value) {
             if (this.getModuleName() === 'datetimepicker') {
                 if (this.calendarMode === 'Gregorian') {
-                    formatOptions = { format: tempFormat, type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd' };
+                    formatOptions = { format: tempFormat, type: 'dateTime', skeleton: 'yMd' };
                 }
                 else {
                     formatOptions = { format: tempFormat, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };
@@ -4280,7 +4147,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
             }
             else {
                 if (this.calendarMode === 'Gregorian') {
-                    formatOptions = { format: this.formatString, type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd' };
+                    formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd' };
                 }
                 else {
                     formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };
@@ -4336,18 +4203,14 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
             var outOfRange = void 0;
             if (!isNullOrUndefined(this.value) && !(+this.value >= +this.min && +this.value <= +this.max)) {
                 outOfRange = new Date(this.checkValue(this.value));
-                if (!this.isBlazorServer) {
-                    this.setProperties({ 'value': null }, true);
-                }
+                this.setProperties({ 'value': null }, true);
             }
             else {
                 outOfRange = this.value || null;
             }
             if (!this.isCalendar()) {
-                if (!this.isBlazorServer) {
-                    _super.prototype.render.call(this);
-                    this.setProperties({ 'value': outOfRange || null }, true);
-                }
+                _super.prototype.render.call(this);
+                this.setProperties({ 'value': outOfRange || null }, true);
                 this.previousDate = outOfRange;
                 this.createCalendar();
             }
@@ -4359,7 +4222,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                 preventDefault: function () {
                     prevent_1 = false;
                 },
-                popup: isBlazor() && this.isServerRendered ? null : this.popupObj,
+                popup: this.popupObj,
                 event: e || null,
                 cancel: false,
                 appendTo: Browser.isDevice ? this.mobilePopupWrapper : document.body
@@ -4368,11 +4231,6 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
             this.trigger('open', eventArgs, function (eventArgs) {
                 _this.preventArgs = eventArgs;
                 if (prevent_1 && !_this.preventArgs.cancel) {
-                    if (_this.isBlazorServer) {
-                        _this.popupWrapper.style.visibility = '';
-                        _this.popupWrapper.style.width = 'auto';
-                        _this.popupWrapper.style.height = 'auto';
-                    }
                     addClass(_this.inputWrapper.buttons, ACTIVE);
                     _this.preventArgs.appendTo.appendChild(_this.popupWrapper);
                     _this.popupObj.refreshPosition(_this.inputElement);
@@ -4386,18 +4244,12 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                     else {
                         _this.popupObj.show(new Animation(openAnimation), null);
                     }
-                    if (!_this.isBlazorServer) {
-                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                        _super.prototype.setOverlayIndex.call(_this, _this.mobilePopupWrapper, _this.popupObj.element, _this.modal, Browser.isDevice);
-                    }
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    _super.prototype.setOverlayIndex.call(_this, _this.mobilePopupWrapper, _this.popupObj.element, _this.modal, Browser.isDevice);
                     _this.setAriaAttributes();
                 }
                 else {
                     _this.popupObj.destroy();
-                    if (_this.isBlazorServer) {
-                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                        _this.interopAdaptor.invokeMethodAsync('OnPopupHide', false);
-                    }
                     _this.popupWrapper = _this.popupObj = null;
                 }
                 if (!isNullOrUndefined(_this.inputElement) && _this.inputElement.value === '') {
@@ -4424,7 +4276,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                 preventDefault: function () {
                     prevent_2 = false;
                 },
-                popup: isBlazor() && this.isServerRendered ? null : this.popupObj,
+                popup: this.popupObj,
                 event: event || null,
                 cancel: false
             };
@@ -4451,17 +4303,9 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
     DatePicker.prototype.closeEventCallback = function (prevent, eventArgs) {
         this.preventArgs = eventArgs;
         if (this.isCalendar() && (prevent && !this.preventArgs.cancel)) {
-            if (!this.isBlazorServer) {
-                this.popupObj.hide();
-                this.isAltKeyPressed = false;
-                this.keyboardModule.destroy();
-            }
-            else {
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                this.interopAdaptor.invokeMethodAsync('OnPopupHide', false);
-                this.isAltKeyPressed = false;
-                this.popupWrapper = this.popupObj = null;
-            }
+            this.popupObj.hide();
+            this.isAltKeyPressed = false;
+            this.keyboardModule.destroy();
             removeClass(this.inputWrapper.buttons, ACTIVE);
         }
         this.setAriaAttributes();
@@ -4544,12 +4388,10 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
      */
     DatePicker.prototype.destroy = function () {
         this.unBindEvents();
-        if (!this.isBlazorServer) {
+        _super.prototype.destroy.call(this);
+        this.keyboardModules.destroy();
+        if (this.popupObj && this.popupObj.element.classList.contains(POPUP)) {
             _super.prototype.destroy.call(this);
-            this.keyboardModules.destroy();
-            if (this.popupObj && this.popupObj.element.classList.contains(POPUP)) {
-                _super.prototype.destroy.call(this);
-            }
         }
         var ariaAttrs = {
             'aria-live': 'assertive', 'aria-atomic': 'true', 'aria-disabled': 'true',
@@ -4574,9 +4416,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                 detach(this.popupWrapper);
             }
             this.popupObj = this.popupWrapper = null;
-            if (!this.isBlazorServer) {
-                this.keyboardModule.destroy();
-            }
+            this.keyboardModule.destroy();
         }
         if (this.ngTag === null) {
             if (this.inputElement) {
@@ -4622,45 +4462,40 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         this.inputElement = this.element;
         this.formElement = closest(this.inputElement, 'form');
         this.index = this.showClearButton ? 2 : 1;
-        this.isBlazorServer = (isBlazor() && this.isServerRendered && this.getModuleName() === 'datepicker') ? true : false;
-        if (!this.isBlazorServer) {
-            this.ngTag = null;
-            if (this.element.tagName === 'EJS-DATEPICKER' || this.element.tagName === 'EJS-DATETIMEPICKER') {
-                this.ngTag = this.element.tagName;
-                this.inputElement = this.createElement('input');
-                this.element.appendChild(this.inputElement);
+        this.ngTag = null;
+        if (this.element.tagName === 'EJS-DATEPICKER' || this.element.tagName === 'EJS-DATETIMEPICKER') {
+            this.ngTag = this.element.tagName;
+            this.inputElement = this.createElement('input');
+            this.element.appendChild(this.inputElement);
+        }
+        if (this.element.getAttribute('id')) {
+            if (this.ngTag !== null) {
+                this.inputElement.id = this.element.getAttribute('id') + '_input';
             }
-            if (this.element.getAttribute('id')) {
+        }
+        else {
+            if (this.getModuleName() === 'datetimepicker') {
+                this.element.id = getUniqueID('ej2-datetimepicker');
                 if (this.ngTag !== null) {
-                    this.inputElement.id = this.element.getAttribute('id') + '_input';
+                    attributes(this.inputElement, { 'id': this.element.id + '_input' });
                 }
             }
             else {
-                if (this.getModuleName() === 'datetimepicker') {
-                    this.element.id = getUniqueID('ej2-datetimepicker');
-                    if (this.ngTag !== null) {
-                        attributes(this.inputElement, { 'id': this.element.id + '_input' });
-                    }
-                }
-                else {
-                    this.element.id = getUniqueID('ej2-datepicker');
-                    if (this.ngTag !== null) {
-                        attributes(this.inputElement, { 'id': this.element.id + '_input' });
-                    }
+                this.element.id = getUniqueID('ej2-datepicker');
+                if (this.ngTag !== null) {
+                    attributes(this.inputElement, { 'id': this.element.id + '_input' });
                 }
             }
-            if (this.ngTag !== null) {
-                this.validationAttribute(this.element, this.inputElement);
-            }
-            this.updateHtmlAttributeToElement();
         }
+        if (this.ngTag !== null) {
+            this.validationAttribute(this.element, this.inputElement);
+        }
+        this.updateHtmlAttributeToElement();
         this.defaultKeyConfigs = this.getDefaultKeyConfig();
         this.checkHtmlAttributes(false);
         this.tabIndex = this.element.hasAttribute('tabindex') ? this.element.getAttribute('tabindex') : '0';
-        if (!this.isBlazorServer) {
-            this.element.removeAttribute('tabindex');
-            _super.prototype.preRender.call(this);
-        }
+        this.element.removeAttribute('tabindex');
+        _super.prototype.preRender.call(this);
     };
     DatePicker.prototype.getDefaultKeyConfig = function () {
         this.defaultKeyConfigs = {
@@ -4706,7 +4541,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         var culture = new Internationalization(this.locale);
         if (this.format) {
             if (typeof this.format === 'string') {
-                this.formatString = isBlazor() ? this.format.replace(/tt/, 'a') : this.format;
+                this.formatString = this.format;
             }
             else if (this.format.skeleton !== '' && !isNullOrUndefined(this.format.skeleton)) {
                 var skeletonString = this.format.skeleton;
@@ -4741,7 +4576,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
             if (this.calendarMode === 'Gregorian') {
                 options = {
                     format: !isNullOrUndefined(this.formatString) ? this.formatString : this.dateTimeFormat,
-                    type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd'
+                    type: 'dateTime', skeleton: 'yMd'
                 };
             }
             else {
@@ -4753,7 +4588,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         }
         else {
             if (this.calendarMode === 'Gregorian') {
-                options = { format: this.formatString, type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd' };
+                options = { format: this.formatString, type: 'dateTime', skeleton: 'yMd' };
             }
             else {
                 options = { format: this.formatString, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };
@@ -4764,8 +4599,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
             if (!isNullOrUndefined(this.inputElement.getAttribute(prop))) {
                 switch (prop) {
                     case 'disabled':
-                        if (((isNullOrUndefined(this.datepickerOptions) || (this.datepickerOptions['enabled'] === undefined)) || dynamic) &&
-                            !this.isBlazorServer) {
+                        if (((isNullOrUndefined(this.datepickerOptions) || (this.datepickerOptions['enabled'] === undefined)) || dynamic)) {
                             var enabled = this.inputElement.getAttribute(prop) === 'disabled' ||
                                 this.inputElement.getAttribute(prop) === '' ||
                                 this.inputElement.getAttribute(prop) === 'true' ? false : true;
@@ -4773,32 +4607,25 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                         }
                         break;
                     case 'readonly':
-                        if (((isNullOrUndefined(this.datepickerOptions) || (this.datepickerOptions['readonly'] === undefined)) || dynamic) &&
-                            !this.isBlazorServer) {
+                        if (((isNullOrUndefined(this.datepickerOptions) || (this.datepickerOptions['readonly'] === undefined)) || dynamic)) {
                             var readonly = this.inputElement.getAttribute(prop) === 'readonly' ||
                                 this.inputElement.getAttribute(prop) === '' || this.inputElement.getAttribute(prop) === 'true' ? true : false;
                             this.setProperties({ readonly: readonly }, !dynamic);
                         }
                         break;
                     case 'placeholder':
-                        if (((isNullOrUndefined(this.datepickerOptions) || (this.datepickerOptions['placeholder'] === undefined)) || dynamic) &&
-                            !this.isBlazorServer) {
+                        if (((isNullOrUndefined(this.datepickerOptions) || (this.datepickerOptions['placeholder'] === undefined)) || dynamic)) {
                             this.setProperties({ placeholder: this.inputElement.getAttribute(prop) }, !dynamic);
                         }
                         break;
                     case 'style':
-                        if (!this.isBlazorServer) {
-                            this.inputElement.setAttribute('style', '' + this.inputElement.getAttribute(prop));
-                        }
+                        this.inputElement.setAttribute('style', '' + this.inputElement.getAttribute(prop));
                         break;
                     case 'name':
-                        if (!this.isBlazorServer) {
-                            this.inputElement.setAttribute('name', '' + this.inputElement.getAttribute(prop));
-                        }
+                        this.inputElement.setAttribute('name', '' + this.inputElement.getAttribute(prop));
                         break;
                     case 'value':
-                        if (((isNullOrUndefined(this.datepickerOptions) || (this.datepickerOptions['value'] === undefined)) || dynamic) &&
-                            !this.isBlazorServer) {
+                        if (((isNullOrUndefined(this.datepickerOptions) || (this.datepickerOptions['value'] === undefined)) || dynamic)) {
                             var value = this.inputElement.getAttribute(prop);
                             this.setProperties(setValue(prop, this.globalize.parseDate(value, options), {}), !dynamic);
                         }
@@ -4816,7 +4643,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                         }
                         break;
                     case 'type':
-                        if (this.inputElement.getAttribute(prop) !== 'text' && !this.isBlazorServer) {
+                        if (this.inputElement.getAttribute(prop) !== 'text') {
                             this.inputElement.setAttribute('type', 'text');
                         }
                         break;
@@ -4840,9 +4667,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         var previousValCopy = this.previousDate;
         //calls the Calendar render method to check the disabled dates through renderDayCell event and update the input value accordingly.
         this.minMaxUpdates();
-        if (!this.isBlazorServer) {
-            _super.prototype.render.call(this);
-        }
+        _super.prototype.render.call(this);
         this.previousDate = previousValCopy;
         var date = valueCopy && +(valueCopy);
         var dateIdString = '*[id^="/id"]'.replace('/id', '' + date);
@@ -4863,7 +4688,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
             if (this.calendarMode === 'Gregorian') {
                 globalize = this.globalize.formatDate(valueCopy, {
                     format: !isNullOrUndefined(this.formatString) ? this.formatString : this.dateTimeFormat,
-                    type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd'
+                    type: 'dateTime', skeleton: 'yMd'
                 });
             }
             else {
@@ -4876,7 +4701,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         }
         else {
             if (this.calendarMode === 'Gregorian') {
-                formatOptions = { format: this.formatString, type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd' };
+                formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd' };
             }
             else {
                 formatOptions = { format: this.formatString, type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };
@@ -4894,26 +4719,13 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
         }
     };
     DatePicker.prototype.setAriaAttributes = function () {
-        if (this.isBlazorServer) {
-            if (this.isCalendar()) {
-                var focusedEle = this.tableBodyElement.querySelector('tr td.e-focused-date');
-                var selectedEle = this.tableBodyElement.querySelector('tr td.e-selected');
-                var id = (focusedEle || selectedEle) ? (focusedEle || selectedEle).getAttribute('id') : 'null';
-                attributes(this.inputElement, { 'aria-activedescendant': '' + id });
-            }
-            else {
-                attributes(this.inputElement, { 'aria-activedescendant': 'null' });
-            }
+        if (this.isCalendar()) {
+            Input.addAttributes({ 'aria-expanded': 'true' }, this.inputElement);
+            attributes(this.inputElement, { 'aria-activedescendant': '' + this.setActiveDescendant() });
         }
         else {
-            if (this.isCalendar()) {
-                Input.addAttributes({ 'aria-expanded': 'true' }, this.inputElement);
-                attributes(this.inputElement, { 'aria-activedescendant': '' + this.setActiveDescendant() });
-            }
-            else {
-                Input.addAttributes({ 'aria-expanded': 'false' }, this.inputElement);
-                attributes(this.inputElement, { 'aria-activedescendant': 'null' });
-            }
+            Input.addAttributes({ 'aria-expanded': 'false' }, this.inputElement);
+            attributes(this.inputElement, { 'aria-activedescendant': 'null' });
         }
     };
     DatePicker.prototype.errorClass = function () {
@@ -4948,20 +4760,16 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                     this.isDynamicValueChanged = true;
                     this.isInteracted = false;
                     this.invalidValueString = null;
-                    if (!this.isBlazorServer) {
-                        this.checkInvalidValue(newProp.value);
-                    }
+                    this.checkInvalidValue(newProp.value);
                     newProp.value = this.value;
                     this.previousElementValue = this.inputElement.value;
-                    if (!this.isBlazorServer) {
-                        if (isNullOrUndefined(this.value)) {
-                            this.updateInputValue('');
-                            this.currentDate = new Date(new Date().setHours(0, 0, 0, 0));
-                        }
-                        this.updateInput(true);
-                        if (+this.previousDate !== +this.value) {
-                            this.changeTrigger(null);
-                        }
+                    if (isNullOrUndefined(this.value)) {
+                        this.updateInputValue('');
+                        this.currentDate = new Date(new Date().setHours(0, 0, 0, 0));
+                    }
+                    this.updateInput(true);
+                    if (+this.previousDate !== +this.value) {
+                        this.changeTrigger(null);
                     }
                     this.isInteracted = true;
                     this.preventChange = this.isAngular && this.preventChange ? !this.preventChange : this.preventChange;
@@ -4974,15 +4782,13 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                 case 'format':
                     this.checkFormat();
                     this.bindInputEvent();
-                    if (!this.isBlazorServer) {
-                        this.updateInput();
-                        if (this.enableMask) {
-                            this.notify("createMask", {
-                                module: "MaskedDateTime",
-                            });
-                            if (!this.value) {
-                                this.updateInputValue(this.maskedDateValue);
-                            }
+                    this.updateInput();
+                    if (this.enableMask) {
+                        this.notify("createMask", {
+                            module: "MaskedDateTime",
+                        });
+                        if (!this.value) {
+                            this.updateInputValue(this.maskedDateValue);
                         }
                     }
                     break;
@@ -5009,13 +4815,11 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                     this.l10n.setLocale(this.locale);
                     this.setProperties({ placeholder: this.l10n.getConstant('placeholder') }, true);
                     Input.setPlaceholder(this.placeholder, this.inputElement);
-                    if (!this.isBlazorServer) {
-                        this.updateInput();
-                        if (this.enableMask) {
-                            this.notify("createMask", {
-                                module: "MaskedDateTime",
-                            });
-                        }
+                    this.updateInput();
+                    if (this.enableMask) {
+                        this.notify("createMask", {
+                            module: "MaskedDateTime",
+                        });
                     }
                     break;
                 case 'enableRtl':
@@ -5024,7 +4828,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                 case 'start':
                 case 'depth':
                     this.checkView();
-                    if (this.calendarElement && !this.isBlazorServer) {
+                    if (this.calendarElement) {
                         _super.prototype.onPropertyChanged.call(this, newProp, oldProp);
                     }
                     break;
@@ -5041,9 +4845,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                     break;
                 case 'strictMode':
                     this.invalidValueString = null;
-                    if (!this.isBlazorServer) {
-                        this.updateInput();
-                    }
+                    this.updateInput();
                     break;
                 case 'width':
                     this.setWidth(newProp.width);
@@ -5068,7 +4870,7 @@ var DatePicker = /** @__PURE__ @class */ (function (_super) {
                     }
                     break;
                 default:
-                    if (this.calendarElement && !this.isBlazorServer && this.isCalendar()) {
+                    if (this.calendarElement && this.isCalendar()) {
                         _super.prototype.onPropertyChanged.call(this, newProp, oldProp);
                     }
                     break;
@@ -5698,7 +5500,7 @@ var DateRangePicker = /** @__PURE__ @class */ (function (_super) {
     };
     DateRangePicker.prototype.updateHiddenInput = function () {
         if (this.firstHiddenChild && this.secondHiddenChild) {
-            var format = { type: 'datetime', skeleton: isBlazor() ? 'd' : 'yMd' };
+            var format = { type: 'datetime', skeleton: 'yMd' };
             if (typeof this.startDate === 'string') {
                 this.startDate = this.globalize.parseDate(this.startDate, format);
             }
@@ -5838,7 +5640,7 @@ var DateRangePicker = /** @__PURE__ @class */ (function (_super) {
         var attributes$$1 = isDynamic ? isNullOrUndefined(this.htmlAttributes) ? [] : Object.keys(this.htmlAttributes) :
             ['startDate', 'endDate', 'minDays', 'maxDays', 'min', 'max', 'disabled', 'readonly', 'style', 'name', 'placeholder',
                 'type', 'value'];
-        var format = { format: this.formatString, type: 'date', skeleton: isBlazor() ? 'd' : 'yMd' };
+        var format = { format: this.formatString, type: 'date', skeleton: 'yMd' };
         for (var _i = 0, attributes_1 = attributes$$1; _i < attributes_1.length; _i++) {
             var prop = attributes_1[_i];
             if (!isNullOrUndefined(this.inputElement.getAttribute(prop))) {
@@ -6093,7 +5895,7 @@ var DateRangePicker = /** @__PURE__ @class */ (function (_super) {
         }
         this.preventBlur = false;
         var focusArguments = {
-            model: (isBlazor() && this.isServerRendered) ? null : this
+            model: this
         };
         if (!this.preventFocus) {
             this.trigger('focus', focusArguments);
@@ -6124,7 +5926,7 @@ var DateRangePicker = /** @__PURE__ @class */ (function (_super) {
                 var range = value.split(' ' + this.separator + ' ');
                 if (range.length > 1) {
                     this.invalidValueString = null;
-                    var dateOptions = { format: this.formatString, type: 'date', skeleton: isBlazor() ? 'd' : 'yMd' };
+                    var dateOptions = { format: this.formatString, type: 'date', skeleton: 'yMd' };
                     var startDate = this.globalize.parseDate(range[0].trim(), dateOptions);
                     var endDate = this.globalize.parseDate(range[1].trim(), dateOptions);
                     if (!isNullOrUndefined(startDate) && !isNaN(+startDate) && !isNullOrUndefined(endDate) && !isNaN(+endDate)) {
@@ -6140,7 +5942,7 @@ var DateRangePicker = /** @__PURE__ @class */ (function (_super) {
                         if (!this.preventBlur && document.activeElement !== this.inputElement) {
                             this.preventFocus = false;
                             var blurArguments = {
-                                model: (isBlazor() && this.isServerRendered) ? null : this
+                                model: this
                             };
                             this.trigger('blur', blurArguments);
                         }
@@ -6191,7 +5993,7 @@ var DateRangePicker = /** @__PURE__ @class */ (function (_super) {
             if (!this.preventBlur && document.activeElement !== this.inputElement) {
                 this.preventFocus = false;
                 var blurArguments = {
-                    model: (isBlazor() && this.isServerRendered) ? null : this
+                    model: this
                 };
                 this.trigger('blur', blurArguments);
             }
@@ -6751,11 +6553,11 @@ var DateRangePicker = /** @__PURE__ @class */ (function (_super) {
         var range;
         var startDate = !isNullOrUndefined(this.startValue) ?
             this.globalize.formatDate(this.startValue, {
-                format: this.formatString, type: 'date', skeleton: isBlazor() ? 'd' : 'yMd'
+                format: this.formatString, type: 'date', skeleton: 'yMd'
             }) : null;
         var endDate = !isNullOrUndefined(this.endValue) ?
             this.globalize.formatDate(this.endValue, {
-                format: this.formatString, type: 'date', skeleton: isBlazor() ? 'd' : 'yMd'
+                format: this.formatString, type: 'date', skeleton: 'yMd'
             }) : null;
         if (!isNullOrUndefined(this.endValue) && !isNullOrUndefined(this.startValue)) {
             inputValue = startDate + ' ' + this.separator + ' ' + endDate;
@@ -7116,7 +6918,7 @@ var DateRangePicker = /** @__PURE__ @class */ (function (_super) {
         }
     };
     DateRangePicker.prototype.updateHeader = function () {
-        var format = { type: 'date', skeleton: isBlazor() ? 'D' : 'yMMMd' };
+        var format = { type: 'date', skeleton: 'yMMMd' };
         if (!isNullOrUndefined(this.endValue) && !isNullOrUndefined(this.startValue)) {
             var range = (Math.round(Math.abs((this.removeTimeValueFromDate(this.startValue).getTime() -
                 this.removeTimeValueFromDate(this.endValue).getTime()) / (1000 * 60 * 60 * 24))) + 1);
@@ -7197,7 +6999,7 @@ var DateRangePicker = /** @__PURE__ @class */ (function (_super) {
     };
     DateRangePicker.prototype.addSelectedAttributes = function (ele, date, isStartDate, sameDate) {
         if (ele) {
-            var title = this.globalize.formatDate(date, { type: 'date', skeleton: isBlazor() ? 'D' : 'full' });
+            var title = this.globalize.formatDate(date, { type: 'date', skeleton: 'full' });
             if (!isNullOrUndefined(sameDate) && sameDate) {
                 ele.setAttribute('aria-label', 'The current start and end date is ' + '' + title);
             }
@@ -8482,7 +8284,7 @@ var DateRangePicker = /** @__PURE__ @class */ (function (_super) {
     };
     DateRangePicker.prototype.updateInput = function () {
         if (!isNullOrUndefined(this.endValue) && !isNullOrUndefined(this.startValue)) {
-            var formatOption = { format: this.formatString, type: 'date', skeleton: isBlazor() ? 'd' : 'yMd' };
+            var formatOption = { format: this.formatString, type: 'date', skeleton: 'yMd' };
             var startDate = this.globalize.formatDate(this.startValue, formatOption);
             var endDate = this.globalize.formatDate(this.endValue, formatOption);
             Input.setValue(startDate + ' ' + this.separator + ' ' + endDate, this.inputElement, this.floatLabelType, this.showClearButton);
@@ -8596,7 +8398,7 @@ var DateRangePicker = /** @__PURE__ @class */ (function (_super) {
         var valueString = value;
         var invalid = false;
         var formatOpt = null;
-        formatOpt = { format: this.formatString, type: 'date', skeleton: isBlazor() ? 'd' : 'yMd' };
+        formatOpt = { format: this.formatString, type: 'date', skeleton: 'yMd' };
         if (typeof valueString !== 'string') {
             invalid = true;
         }
@@ -8981,10 +8783,10 @@ var DateRangePicker = /** @__PURE__ @class */ (function (_super) {
                     document.body.appendChild(this.mobileRangePopupWrap);
                 }
                 this.openEventArgs = {
-                    popup: (isBlazor() && this.isServerRendered) ? null : this.popupObj || null,
+                    popup: this.popupObj || null,
                     cancel: false,
                     date: this.inputElement.value,
-                    model: (isBlazor() && this.isServerRendered) ? null : this,
+                    model: this,
                     event: event ? event : null,
                     appendTo: this.isMobile || Browser.isDevice ? this.mobileRangePopupWrap : document.body
                 };
@@ -9046,9 +8848,9 @@ var DateRangePicker = /** @__PURE__ @class */ (function (_super) {
             if (this.isPopupOpen()) {
                 this.closeEventArgs = {
                     cancel: false,
-                    popup: (isBlazor() && this.isServerRendered) ? null : this.popupObj,
+                    popup: this.popupObj,
                     date: this.inputElement.value,
-                    model: (isBlazor() && this.isServerRendered) ? null : this,
+                    model: this,
                     event: event ? event : null
                 };
                 var eventArgs = this.closeEventArgs;
@@ -9173,7 +8975,7 @@ var DateRangePicker = /** @__PURE__ @class */ (function (_super) {
         attributes(this.secondHiddenChild, {
             'type': 'text', 'name': this.inputElement.getAttribute('data-name'), 'class': HIDDENELEMENT
         });
-        var format = { type: 'datetime', skeleton: isBlazor() ? 'd' : 'yMd' };
+        var format = { type: 'datetime', skeleton: 'yMd' };
         this.firstHiddenChild.value = this.startDate && this.globalize.formatDate(this.startDate, format);
         this.secondHiddenChild.value = this.endDate && this.globalize.formatDate(this.endDate, format);
         this.inputElement.parentElement.appendChild(this.firstHiddenChild);
@@ -9204,7 +9006,7 @@ var DateRangePicker = /** @__PURE__ @class */ (function (_super) {
      * @private
      */
     DateRangePicker.prototype.onPropertyChanged = function (newProp, oldProp) {
-        var format = { format: this.formatString, type: 'date', skeleton: isBlazor() ? 'd' : 'yMd' };
+        var format = { format: this.formatString, type: 'date', skeleton: 'yMd' };
         for (var _i = 0, _a = Object.keys(newProp); _i < _a.length; _i++) {
             var prop = _a[_i];
             var openPopup = ['maxDays', 'minDays', 'value'];
@@ -9589,8 +9391,6 @@ var HOVER$1 = 'e-hover';
 var NAVIGATION = 'e-navigation';
 var DISABLED$3 = 'e-disabled';
 var ICONANIMATION = 'e-icon-anim';
-var TIMEICON = 'e-time-icon';
-var CLEARICON$1 = 'e-clear-icon';
 var FOCUS = 'e-input-focus';
 var LISTCLASS$1 = 'e-list-item';
 var HALFPOSITION = 2;
@@ -9679,10 +9479,8 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
         var _this = _super.call(this, options, element) || this;
         _this.liCollections = [];
         _this.timeCollections = [];
-        _this.blazorTimeCollections = [];
         _this.disableItemCollection = [];
         _this.invalidValueString = null;
-        _this.isBlazorServer = false;
         _this.isAngular = false;
         _this.preventChange = false;
         _this.maskedDateValue = '';
@@ -9715,62 +9513,35 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
         this.inputElement = this.element;
         this.angularTag = null;
         this.formElement = closest(this.element, 'form');
-        this.isBlazorServer = (isBlazor() && this.isServerRendered && this.getModuleName() === 'timepicker') ? true : false;
-        if (!this.isBlazorServer) {
-            if (this.element.tagName === 'EJS-TIMEPICKER') {
-                this.angularTag = this.element.tagName;
-                this.inputElement = this.createElement('input');
-                this.element.appendChild(this.inputElement);
-            }
-            this.tabIndex = this.element.hasAttribute('tabindex') ? this.element.getAttribute('tabindex') : '0';
-            this.element.removeAttribute('tabindex');
-            this.openPopupEventArgs = {
-                appendTo: document.body
-            };
+        if (this.element.tagName === 'EJS-TIMEPICKER') {
+            this.angularTag = this.element.tagName;
+            this.inputElement = this.createElement('input');
+            this.element.appendChild(this.inputElement);
         }
+        this.tabIndex = this.element.hasAttribute('tabindex') ? this.element.getAttribute('tabindex') : '0';
+        this.element.removeAttribute('tabindex');
+        this.openPopupEventArgs = {
+            appendTo: document.body
+        };
     };
     // element creation
     TimePicker.prototype.render = function () {
-        if (!this.isBlazorServer) {
-            this.initialize();
-            this.createInputElement();
-            this.updateHtmlAttributeToWrapper();
-            this.setTimeAllowEdit();
-            this.setEnable();
-            this.validateInterval();
-        }
-        else {
-            this.globalize = new Internationalization(this.locale);
-            this.defaultCulture = new Internationalization('en');
-            this.checkTimeFormat();
-            var parentElement = this.element.parentElement;
-            this.inputWrapper = {
-                container: parentElement,
-                clearButton: parentElement.querySelector('.' + CLEARICON$1),
-                buttons: [parentElement.querySelector('.' + TIMEICON)]
-            };
-            Input.bindInitialEvent({
-                element: this.inputElement,
-                floatLabelType: this.floatLabelType
-            });
-            if (this.showClearButton && this.inputWrapper.clearButton) {
-                Input.wireClearBtnEvents(this.inputElement, this.inputWrapper.clearButton, this.inputWrapper.container);
-            }
-        }
+        this.initialize();
+        this.createInputElement();
+        this.updateHtmlAttributeToWrapper();
+        this.setTimeAllowEdit();
+        this.setEnable();
+        this.validateInterval();
         this.bindEvents();
-        if (!this.isBlazorServer) {
-            this.validateDisable();
-            this.setValue(this.getFormattedValue(this.value));
-            if (this.enableMask && !this.value && this.maskedDateValue && (this.floatLabelType == 'Always' || !this.floatLabelType || !this.placeholder)) {
-                this.updateInputValue(this.maskedDateValue);
-                this.checkErrorState(this.maskedDateValue);
-            }
+        this.validateDisable();
+        this.setValue(this.getFormattedValue(this.value));
+        if (this.enableMask && !this.value && this.maskedDateValue && (this.floatLabelType == 'Always' || !this.floatLabelType || !this.placeholder)) {
+            this.updateInputValue(this.maskedDateValue);
+            this.checkErrorState(this.maskedDateValue);
         }
         this.anchor = this.inputElement;
         this.inputElement.setAttribute('value', this.inputElement.value);
-        if (!this.isBlazorServer) {
-            this.inputEleValue = this.getDateObject(this.inputElement.value);
-        }
+        this.inputEleValue = this.getDateObject(this.inputElement.value);
         this.renderComplete();
     };
     TimePicker.prototype.setTimeAllowEdit = function () {
@@ -9928,7 +9699,7 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
     TimePicker.prototype.getCldrDateTimeFormat = function () {
         var culture = new Internationalization(this.locale);
         var cldrTime;
-        var dateFormat = culture.getDatePattern({ skeleton: isBlazor() ? 'd' : 'yMd' });
+        var dateFormat = culture.getDatePattern({ skeleton: 'yMd' });
         if (this.isNullOrEmpty(this.formatString)) {
             cldrTime = dateFormat + ' ' + this.cldrFormat('time');
         }
@@ -9958,7 +9729,7 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                         }));
                         if (isNullOrUndefined(valueExpression)) {
                             valueExpression = this.checkDateValue(this.globalize.parseDate(valueString, {
-                                format: this.formatString, type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd'
+                                format: this.formatString, type: 'dateTime', skeleton: 'yMd'
                             }));
                         }
                     }
@@ -10007,8 +9778,7 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
     TimePicker.prototype.cldrFormat = function (type) {
         var cldrDateTimeString;
         if (this.locale === 'en' || this.locale === 'en-US') {
-            cldrDateTimeString = isBlazor() ? this.getBlazorCultureFormat('t') :
-                (getValue('timeFormats.short', getDefaultDateObject()));
+            cldrDateTimeString = (getValue('timeFormats.short', getDefaultDateObject()));
         }
         else {
             cldrDateTimeString = (this.getCultureTimeObject(cldrData, '' + this.locale));
@@ -10017,48 +9787,43 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
     };
     // destroy function
     TimePicker.prototype.destroy = function () {
-        if (this.isBlazorServer) {
-            this.unBindEvents();
-        }
-        else {
-            this.hide();
-            this.unBindEvents();
-            var ariaAttribute = {
-                'aria-haspopup': 'true', 'aria-autocomplete': 'list', 'tabindex': '0', 'aria-activedescendant': 'null',
-                'aria-owns': this.element.id + '_options', 'aria-expanded': 'false', 'role': 'combobox', 'autocomplete': 'off',
-                'autocorrect': 'off', 'autocapitalize': 'off', 'spellcheck': 'false', 'aria-disabled': 'true', 'aria-invalid': 'false'
-            };
-            if (this.inputElement) {
-                Input.removeAttributes(ariaAttribute, this.inputElement);
-                if (this.angularTag === null) {
-                    this.inputWrapper.container.parentElement.appendChild(this.inputElement);
-                }
-                if (!isNullOrUndefined(this.cloneElement.getAttribute('tabindex'))) {
-                    this.inputElement.setAttribute('tabindex', this.tabIndex);
-                }
-                else {
-                    this.inputElement.removeAttribute('tabindex');
-                }
-                this.ensureInputAttribute();
-                this.enableElement([this.inputElement]);
-                this.inputElement.classList.remove('e-input');
-                if (isNullOrUndefined(this.cloneElement.getAttribute('disabled'))) {
-                    Input.setEnabled(true, this.inputElement, this.floatLabelType);
-                }
+        this.hide();
+        this.unBindEvents();
+        var ariaAttribute = {
+            'aria-haspopup': 'true', 'aria-autocomplete': 'list', 'tabindex': '0', 'aria-activedescendant': 'null',
+            'aria-owns': this.element.id + '_options', 'aria-expanded': 'false', 'role': 'combobox', 'autocomplete': 'off',
+            'autocorrect': 'off', 'autocapitalize': 'off', 'spellcheck': 'false', 'aria-disabled': 'true', 'aria-invalid': 'false'
+        };
+        if (this.inputElement) {
+            Input.removeAttributes(ariaAttribute, this.inputElement);
+            if (this.angularTag === null) {
+                this.inputWrapper.container.parentElement.appendChild(this.inputElement);
             }
-            if (this.inputWrapper.container) {
-                detach(this.inputWrapper.container);
+            if (!isNullOrUndefined(this.cloneElement.getAttribute('tabindex'))) {
+                this.inputElement.setAttribute('tabindex', this.tabIndex);
             }
-            this.inputWrapper = this.popupWrapper = this.cloneElement = undefined;
-            this.liCollections = this.timeCollections = this.disableItemCollection = [];
-            if (!isNullOrUndefined(this.rippleFn)) {
-                this.rippleFn();
+            else {
+                this.inputElement.removeAttribute('tabindex');
             }
-            _super.prototype.destroy.call(this);
-            if (this.formElement) {
-                EventHandler.remove(this.formElement, 'reset', this.formResetHandler);
+            this.ensureInputAttribute();
+            this.enableElement([this.inputElement]);
+            this.inputElement.classList.remove('e-input');
+            if (isNullOrUndefined(this.cloneElement.getAttribute('disabled'))) {
+                Input.setEnabled(true, this.inputElement, this.floatLabelType);
             }
         }
+        if (this.inputWrapper.container) {
+            detach(this.inputWrapper.container);
+        }
+        this.inputWrapper = this.popupWrapper = this.cloneElement = undefined;
+        this.liCollections = this.timeCollections = this.disableItemCollection = [];
+        if (!isNullOrUndefined(this.rippleFn)) {
+            this.rippleFn();
+        }
+        _super.prototype.destroy.call(this);
+        if (this.formElement) {
+            EventHandler.remove(this.formElement, 'reset', this.formResetHandler);
+        }
     };
     TimePicker.prototype.ensureInputAttribute = function () {
         var propertyList = [];
@@ -10082,24 +9847,18 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
     };
     //popup creation
     TimePicker.prototype.popupCreation = function () {
-        if (!this.isBlazorServer) {
-            this.popupWrapper = this.createElement('div', {
-                className: ROOT$3 + ' ' + POPUP$2,
-                attrs: { 'id': this.element.id + '_popup', 'style': 'visibility:hidden' }
-            });
-            if (!isNullOrUndefined(this.cssClass)) {
-                this.popupWrapper.className += ' ' + this.cssClass;
-            }
-            if (!isNullOrUndefined(this.step) && this.step > 0) {
-                this.generateList();
-                append([this.listWrapper], this.popupWrapper);
-            }
-            this.openPopupEventArgs.appendTo.appendChild(this.popupWrapper);
+        this.popupWrapper = this.createElement('div', {
+            className: ROOT$3 + ' ' + POPUP$2,
+            attrs: { 'id': this.element.id + '_popup', 'style': 'visibility:hidden' }
+        });
+        if (!isNullOrUndefined(this.cssClass)) {
+            this.popupWrapper.className += ' ' + this.cssClass;
         }
-        else {
-            this.popupWrapper = this.inputWrapper.container.nextElementSibling;
+        if (!isNullOrUndefined(this.step) && this.step > 0) {
             this.generateList();
+            append([this.listWrapper], this.popupWrapper);
         }
+        this.openPopupEventArgs.appendTo.appendChild(this.popupWrapper);
         this.addSelection();
         this.renderPopup();
         detach(this.popupWrapper);
@@ -10110,22 +9869,11 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
         return popupHeight > height ? height : popupHeight;
     };
     TimePicker.prototype.generateList = function () {
-        if (!this.isBlazorServer) {
-            this.createListItems();
-        }
-        else {
-            this.listWrapper = this.popupWrapper.querySelector('.e-content');
-        }
+        this.createListItems();
         this.wireListEvents();
         var rippleModel = { duration: 300, selector: '.' + LISTCLASS$1 };
         this.rippleFn = rippleEffect(this.listWrapper, rippleModel);
         this.liCollections = this.listWrapper.querySelectorAll('.' + LISTCLASS$1);
-        if (this.isBlazorServer) {
-            this.blazorTimeCollections = [];
-            for (var index = 0; index < this.liCollections.length; index++) {
-                this.blazorTimeCollections.push(this.liCollections[index].getAttribute('data-value'));
-            }
-        }
     };
     TimePicker.prototype.renderPopup = function () {
         var _this = this;
@@ -10146,11 +9894,9 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                 removeClass([_this.inputWrapper.buttons[0]], SELECTED$4);
                 _this.unWireListEvents();
                 _this.inputElement.setAttribute('aria-activedescendant', 'null');
-                if (!_this.isBlazorServer) {
-                    remove(_this.popupObj.element);
-                    _this.popupObj.destroy();
-                    _this.popupWrapper.innerHTML = '';
-                }
+                remove(_this.popupObj.element);
+                _this.popupObj.destroy();
+                _this.popupWrapper.innerHTML = '';
                 _this.listWrapper = _this.popupWrapper = _this.listTag = undefined;
             }, targetExitViewport: function () {
                 if (!Browser.isDevice) {
@@ -10169,7 +9915,7 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
             return null;
         }
         else {
-            return this.globalize.formatDate(value, { skeleton: isBlazor() ? 't' : 'medium', type: 'time' });
+            return this.globalize.formatDate(value, { skeleton: 'medium', type: 'time' });
         }
     };
     TimePicker.prototype.getDateObject = function (text) {
@@ -10272,12 +10018,11 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
     TimePicker.prototype.getMeridianText = function () {
         var meridian;
         if (this.locale === 'en' || this.locale === 'en-US') {
-            meridian = getValue((isBlazor() ? 'dayPeriods.wide' : 'dayPeriods.format.wide'), getDefaultDateObject());
+            meridian = getValue('dayPeriods.format.wide', getDefaultDateObject());
         }
         else {
-            var gregorianFormat = (isBlazor() ? '.dates.dayPeriods.abbreviated' :
-                '.dates.calendars.gregorian.dayPeriods.format.abbreviated');
-            var mainVal = isBlazor() ? '' : 'main.';
+            var gregorianFormat = '.dates.calendars.gregorian.dayPeriods.format.abbreviated';
+            var mainVal = 'main.';
             meridian = getValue(mainVal + '' + this.locale + gregorianFormat, cldrData);
         }
         return meridian;
@@ -10354,11 +10099,8 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
         if (!isNullOrUndefined(this.popupWrapper)) {
             var items = this.popupWrapper.querySelectorAll('.' + LISTCLASS$1);
             if (items.length) {
-                var initialTime = this.isBlazorServer ? new Date(new Date().toDateString() + ' ' +
-                    this.blazorTimeCollections[0]).setMilliseconds(0) : this.timeCollections[0];
-                var scrollTime = this.isBlazorServer ? new Date(new Date().toDateString() + ' ' +
-                    this.scrollTo.toLocaleTimeString()).setMilliseconds(0) :
-                    this.getDateObject(this.checkDateValue(this.scrollTo)).getTime();
+                var initialTime = this.timeCollections[0];
+                var scrollTime = this.getDateObject(this.checkDateValue(this.scrollTo)).getTime();
                 element = items[Math.round((scrollTime - initialTime) / (this.step * 60000))];
             }
         }
@@ -10383,23 +10125,18 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
     TimePicker.prototype.cldrDateFormat = function () {
         var cldrDate;
         if (this.locale === 'en' || this.locale === 'en-US') {
-            cldrDate = isBlazor() ? (getValue('d', getValue(this.locale, blazorCultureFormats))) :
-                (getValue('dateFormats.short', getDefaultDateObject()));
+            cldrDate = (getValue('dateFormats.short', getDefaultDateObject()));
         }
         else {
             cldrDate = (this.getCultureDateObject(cldrData, '' + this.locale));
         }
         return cldrDate;
     };
-    TimePicker.prototype.getBlazorCultureFormat = function (formatVal) {
-        return (getValue(formatVal, getValue(this.locale, blazorCultureFormats))).replace(/tt/, 'a');
-    };
     TimePicker.prototype.cldrTimeFormat = function () {
         var cldrTime;
         if (this.isNullOrEmpty(this.formatString)) {
             if (this.locale === 'en' || this.locale === 'en-US') {
-                cldrTime = isBlazor() ? this.getBlazorCultureFormat('t') :
-                    (getValue('timeFormats.short', getDefaultDateObject()));
+                cldrTime = (getValue('timeFormats.short', getDefaultDateObject()));
             }
             else {
                 cldrTime = (this.getCultureTimeObject(cldrData, '' + this.locale));
@@ -10413,12 +10150,10 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
     TimePicker.prototype.dateToNumeric = function () {
         var cldrTime;
         if (this.locale === 'en' || this.locale === 'en-US') {
-            cldrTime = isBlazor() ? this.getBlazorCultureFormat('T') :
-                (getValue('timeFormats.medium', getDefaultDateObject()));
+            cldrTime = (getValue('timeFormats.medium', getDefaultDateObject()));
         }
         else {
-            cldrTime = isBlazor() ? this.getBlazorCultureFormat('T') :
-                (getValue('main.' + '' + this.locale + '.dates.calendars.gregorian.timeFormats.medium', cldrData));
+            cldrTime = (getValue('main.' + '' + this.locale + '.dates.calendars.gregorian.timeFormats.medium', cldrData));
         }
         return cldrTime;
     };
@@ -10466,9 +10201,6 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
         e.preventDefault();
         this.interopAdaptor.invokeMethodAsync('OnTimeIconClick');
     };
-    TimePicker.prototype.updateBlazorTimeCollections = function (listData) {
-        this.blazorTimeCollections = listData;
-    };
     TimePicker.prototype.popupHandler = function (e) {
         if (!this.enabled) {
             return;
@@ -10476,10 +10208,8 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
         if (Browser.isDevice) {
             this.inputElement.setAttribute('readonly', '');
         }
-        if (!this.isBlazorServer) {
-            e.preventDefault();
-        }
-        if (this.isPopupOpen() && !this.isBlazorServer) {
+        e.preventDefault();
+        if (this.isPopupOpen()) {
             this.closePopup(0, e);
         }
         else {
@@ -10577,22 +10307,11 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                 case 'enter':
                     if (this.isNavigate) {
                         this.selectedElement = this.liCollections[this.activeIndex];
-                        if (!this.isBlazorServer) {
-                            this.valueWithMinutes = new Date(this.timeCollections[this.activeIndex]);
-                            this.updateValue(this.valueWithMinutes, event);
-                        }
-                        else {
-                            this.inputElement.setAttribute('value', this.selectedElement.getAttribute('data-value'));
-                            this.interopAdaptor.invokeMethodAsync('OnListItemClick', this.activeIndex, true);
-                        }
+                        this.valueWithMinutes = new Date(this.timeCollections[this.activeIndex]);
+                        this.updateValue(this.valueWithMinutes, event);
                     }
                     else {
-                        if (!this.isBlazorServer) {
-                            this.updateValue(this.inputElement.value, event);
-                        }
-                        else {
-                            this.interopAdaptor.invokeMethodAsync('OnStrictMode', this.inputElement.value);
-                        }
+                        this.updateValue(this.inputElement.value, event);
                     }
                     this.hide();
                     this.isNavigate = false;
@@ -10601,24 +10320,17 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                     }
                     break;
                 case 'open':
-                    if (this.isBlazorServer) {
-                        this.interopAdaptor.invokeMethodAsync('OnPopupHide', true);
-                    }
-                    else {
-                        this.show(event);
-                    }
+                    this.show(event);
                     break;
                 case 'escape':
-                    if (!this.isBlazorServer) {
-                        this.updateInputValue(this.objToString(this.value));
-                        if (this.enableMask) {
-                            if (!this.value) {
-                                this.updateInputValue(this.maskedDateValue);
-                            }
-                            this.createMask();
+                    this.updateInputValue(this.objToString(this.value));
+                    if (this.enableMask) {
+                        if (!this.value) {
+                            this.updateInputValue(this.maskedDateValue);
                         }
-                        this.previousState(this.value);
+                        this.createMask();
                     }
+                    this.previousState(this.value);
                     this.hide();
                     break;
                 case 'close':
@@ -10657,7 +10369,7 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
         var _this = this;
         if (this.isPopupOpen() && this.popupWrapper) {
             var args = {
-                popup: this.isBlazorServer ? null : this.popupObj,
+                popup: this.popupObj,
                 event: e || null,
                 cancel: false,
                 name: 'open'
@@ -10674,12 +10386,6 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                     removeClass([_this.inputWrapper.container], [ICONANIMATION]);
                     attributes(_this.inputElement, { 'aria-expanded': 'false' });
                     EventHandler.remove(document, 'mousedown touchstart', _this.documentClickHandler);
-                    if (_this.isBlazorServer) {
-                        _this.disposeServerPopup();
-                        _this.inputWrapper.container.parentElement.insertBefore(_this.popupWrapper, _this.inputWrapper.container.nextElementSibling);
-                        _this.interopAdaptor.invokeMethodAsync('OnPopupHide', false);
-                        _this.popupWrapper = _this.popupObj = null;
-                    }
                 }
                 if (Browser.isDevice && _this.modal) {
                     _this.modal.style.display = 'none';
@@ -10752,30 +10458,19 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
         }
     };
     TimePicker.prototype.setSelection = function (li, event) {
-        if (this.isValidLI(li) && !li.classList.contains(SELECTED$4)) {
-            if (!this.isBlazorServer) {
-                this.checkValue(li.getAttribute('data-value'));
-                if (this.enableMask) {
-                    this.notify("setMaskSelection", {
-                        module: "MaskedDateTime"
-                    });
-                }
-                this.selectedElement = li;
-                this.activeIndex = Array.prototype.slice.call(this.liCollections).indexOf(li);
-                this.valueWithMinutes = new Date(this.timeCollections[this.activeIndex]);
-                addClass([this.selectedElement], SELECTED$4);
-                this.selectedElement.setAttribute('aria-selected', 'true');
-                this.checkValueChange(event, true);
-            }
-            else {
-                this.selectedElement = li;
-                this.activeIndex = Array.prototype.slice.call(this.liCollections).indexOf(li);
-                addClass([this.selectedElement], SELECTED$4);
-                this.selectedElement.setAttribute('aria-selected', 'true');
-                this.inputElement.setAttribute('value', li.getAttribute('data-value'));
-                this.interopAdaptor.invokeMethodAsync('OnListItemClick', this.activeIndex, false);
-                this.addSelection();
+        if (this.isValidLI(li)) {
+            this.checkValue(li.getAttribute('data-value'));
+            if (this.enableMask) {
+                this.notify("setMaskSelection", {
+                    module: "MaskedDateTime"
+                });
             }
+            this.selectedElement = li;
+            this.activeIndex = Array.prototype.slice.call(this.liCollections).indexOf(li);
+            this.valueWithMinutes = new Date(this.timeCollections[this.activeIndex]);
+            addClass([this.selectedElement], SELECTED$4);
+            this.selectedElement.setAttribute('aria-selected', 'true');
+            this.checkValueChange(event, true);
         }
     };
     TimePicker.prototype.onMouseLeave = function () {
@@ -10883,7 +10578,7 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
         return dateVal;
     };
     TimePicker.prototype.bindEvents = function () {
-        EventHandler.add(this.inputWrapper.buttons[0], 'mousedown', (this.isBlazorServer ? this.preventEventBubbling : this.popupHandler), this);
+        EventHandler.add(this.inputWrapper.buttons[0], 'mousedown', this.popupHandler, this);
         EventHandler.add(this.inputElement, 'blur', this.inputBlurHandler, this);
         EventHandler.add(this.inputElement, 'focus', this.inputFocusHandler, this);
         EventHandler.add(this.inputElement, 'change', this.inputChangeHandler, this);
@@ -10929,18 +10624,16 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
         }
         if (!this.inputElement.disabled) {
             var timeValue = this.inputElement.getAttribute('value');
-            var val = this.isBlazorServer ? this.inputEleValue : this.checkDateValue(this.inputEleValue);
+            var val = this.checkDateValue(this.inputEleValue);
             if (this.element.tagName === 'EJS-TIMEPICKER') {
                 val = null;
                 timeValue = '';
                 this.inputElement.setAttribute('value', '');
             }
-            if (!this.isBlazorServer) {
-                this.setProperties({ value: val }, true);
-                this.prevDate = this.value;
-                this.valueWithMinutes = this.value;
-                this.initValue = this.value;
-            }
+            this.setProperties({ value: val }, true);
+            this.prevDate = this.value;
+            this.valueWithMinutes = this.value;
+            this.initValue = this.value;
             if (this.inputElement) {
                 this.updateInputValue(timeValue);
                 if (this.enableMask) {
@@ -10949,9 +10642,7 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                     }
                     this.createMask();
                 }
-                if (!this.isBlazorServer) {
-                    this.checkErrorState(timeValue);
-                }
+                this.checkErrorState(timeValue);
                 this.prevValue = this.inputElement.value;
             }
         }
@@ -10971,7 +10662,7 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
     };
     TimePicker.prototype.unBindEvents = function () {
         if (this.inputWrapper) {
-            EventHandler.remove(this.inputWrapper.buttons[0], 'mousedown touchstart', (this.isBlazorServer ? this.preventEventBubbling : this.popupHandler));
+            EventHandler.remove(this.inputWrapper.buttons[0], 'mousedown touchstart', this.popupHandler);
         }
         EventHandler.remove(this.inputElement, 'blur', this.inputBlurHandler);
         EventHandler.remove(this.inputElement, 'focus', this.inputFocusHandler);
@@ -11011,9 +10702,6 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
             this.resetState();
             this.raiseClearedEvent(e);
         }
-        if (this.isBlazorServer) {
-            this.interopAdaptor.invokeMethodAsync('OnValueCleared');
-        }
         if (this.popupWrapper) {
             this.popupWrapper.scrollTop = 0;
         }
@@ -11024,15 +10712,11 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
         }
     };
     TimePicker.prototype.clear = function (event) {
-        if (!this.isBlazorServer) {
-            this.setProperties({ value: null }, true);
-        }
+        this.setProperties({ value: null }, true);
         this.initValue = null;
         this.resetState();
         this.raiseClearedEvent(event);
-        if (!this.isBlazorServer) {
-            this.changeEvent(event);
-        }
+        this.changeEvent(event);
     };
     TimePicker.prototype.setZIndex = function () {
         if (this.popupObj) {
@@ -11077,34 +10761,28 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                         }
                         break;
                     case 'min':
-                        if (!this.isBlazorServer) {
-                            if ((isNullOrUndefined(this.timeOptions) || (this.timeOptions['min'] === undefined)) || isDynamic) {
-                                value = new Date(this.inputElement.getAttribute(prop));
-                                if (!isNullOrUndefined(this.checkDateValue(value))) {
-                                    this.setProperties({ min: value }, !isDynamic);
-                                }
+                        if ((isNullOrUndefined(this.timeOptions) || (this.timeOptions['min'] === undefined)) || isDynamic) {
+                            value = new Date(this.inputElement.getAttribute(prop));
+                            if (!isNullOrUndefined(this.checkDateValue(value))) {
+                                this.setProperties({ min: value }, !isDynamic);
                             }
                         }
                         break;
                     case 'max':
-                        if (!this.isBlazorServer) {
-                            if ((isNullOrUndefined(this.timeOptions) || (this.timeOptions['max'] === undefined)) || isDynamic) {
-                                value = new Date(this.inputElement.getAttribute(prop));
-                                if (!isNullOrUndefined(this.checkDateValue(value))) {
-                                    this.setProperties({ max: value }, !isDynamic);
-                                }
+                        if ((isNullOrUndefined(this.timeOptions) || (this.timeOptions['max'] === undefined)) || isDynamic) {
+                            value = new Date(this.inputElement.getAttribute(prop));
+                            if (!isNullOrUndefined(this.checkDateValue(value))) {
+                                this.setProperties({ max: value }, !isDynamic);
                             }
                         }
                         break;
                     case 'value':
-                        if (!this.isBlazorServer) {
-                            if ((isNullOrUndefined(this.timeOptions) || (this.timeOptions['value'] === undefined)) || isDynamic) {
-                                value = new Date(this.inputElement.getAttribute(prop));
-                                if (!isNullOrUndefined(this.checkDateValue(value))) {
-                                    this.initValue = value;
-                                    this.updateInput(false, this.initValue);
-                                    this.setProperties({ value: value }, !isDynamic);
-                                }
+                        if ((isNullOrUndefined(this.timeOptions) || (this.timeOptions['value'] === undefined)) || isDynamic) {
+                            value = new Date(this.inputElement.getAttribute(prop));
+                            if (!isNullOrUndefined(this.checkDateValue(value))) {
+                                this.initValue = value;
+                                this.updateInput(false, this.initValue);
+                                this.setProperties({ value: value }, !isDynamic);
                             }
                         }
                         break;
@@ -11172,7 +10850,7 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
         this.removeSelection();
         Input.setValue('', this.inputElement, this.floatLabelType, false);
         this.valueWithMinutes = this.activeIndex = null;
-        if (!this.strictMode && !this.isBlazorServer) {
+        if (!this.strictMode) {
             this.checkErrorState(null);
         }
     };
@@ -11235,44 +10913,34 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
     };
     TimePicker.prototype.findNextElement = function (event) {
         var textVal = (this.inputElement).value;
-        var value = isNullOrUndefined(this.valueWithMinutes) || this.isBlazorServer ? this.createDateObj(textVal) :
+        var value = isNullOrUndefined(this.valueWithMinutes) ? this.createDateObj(textVal) :
             this.getDateObject(this.valueWithMinutes);
         var timeVal = null;
         var count = this.liCollections.length;
-        var collections = this.isBlazorServer ? (isNullOrUndefined(this.blazorTimeCollections) ? [] :
-            this.blazorTimeCollections) : this.timeCollections;
+        var collections = this.timeCollections;
         if (!isNullOrUndefined(this.checkDateValue(value)) || !isNullOrUndefined(this.activeIndex)) {
             if (event.action === 'home') {
                 var index = this.validLiElement(0);
-                if (!this.isBlazorServer) {
-                    timeVal = +(this.createDateObj(new Date(this.timeCollections[index])));
-                }
+                timeVal = +(this.createDateObj(new Date(this.timeCollections[index])));
                 this.activeIndex = index;
             }
             else if (event.action === 'end') {
                 var index = this.validLiElement(collections.length - 1, true);
-                if (!this.isBlazorServer) {
-                    timeVal = +(this.createDateObj(new Date(this.timeCollections[index])));
-                }
+                timeVal = +(this.createDateObj(new Date(this.timeCollections[index])));
                 this.activeIndex = index;
             }
             else {
                 if (event.action === 'down') {
                     for (var i = 0; i < count; i++) {
-                        if (this.isBlazorServer ? (+value < +this.createDateObj(this.blazorTimeCollections[i])) :
-                            (+value < this.timeCollections[i])) {
+                        if (+value < this.timeCollections[i]) {
                             var index = this.validLiElement(i);
-                            if (!this.isBlazorServer) {
-                                timeVal = +(this.createDateObj(new Date(this.timeCollections[index])));
-                            }
+                            timeVal = +(this.createDateObj(new Date(this.timeCollections[index])));
                             this.activeIndex = index;
                             break;
                         }
                         else if (i === count - 1) {
                             var index = this.validLiElement(0);
-                            if (!this.isBlazorServer) {
-                                timeVal = +(this.createDateObj(new Date(this.timeCollections[index])));
-                            }
+                            timeVal = +(this.createDateObj(new Date(this.timeCollections[index])));
                             this.activeIndex = index;
                             break;
                         }
@@ -11280,20 +10948,15 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                 }
                 else {
                     for (var i = count - 1; i >= 0; i--) {
-                        if (this.isBlazorServer ? (+value > +this.createDateObj(this.blazorTimeCollections[i])) :
-                            (+value > this.timeCollections[i])) {
+                        if (+value > this.timeCollections[i]) {
                             var index = this.validLiElement(i, true);
-                            if (!this.isBlazorServer) {
-                                timeVal = +(this.createDateObj(new Date(this.timeCollections[index])));
-                            }
+                            timeVal = +(this.createDateObj(new Date(this.timeCollections[index])));
                             this.activeIndex = index;
                             break;
                         }
                         else if (i === 0) {
                             var index = this.validLiElement(count - 1);
-                            if (!this.isBlazorServer) {
-                                timeVal = +(this.createDateObj(new Date(this.timeCollections[index])));
-                            }
+                            timeVal = +(this.createDateObj(new Date(this.timeCollections[index])));
                             this.activeIndex = index;
                             break;
                         }
@@ -11301,13 +10964,7 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                 }
             }
             this.selectedElement = this.liCollections[this.activeIndex];
-            if (this.isBlazorServer) {
-                this.inputElement.setAttribute('value', this.selectedElement.getAttribute('data-value'));
-                this.interopAdaptor.invokeMethodAsync('OnListItemClick', this.activeIndex, true);
-            }
-            else {
-                this.elementValue(isNullOrUndefined(timeVal) ? null : new Date(timeVal));
-            }
+            this.elementValue(isNullOrUndefined(timeVal) ? null : new Date(timeVal));
         }
         else {
             this.selectNextItem(event);
@@ -11317,58 +10974,7 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
         var index = this.validLiElement(0, event.action === 'down' ? false : true);
         this.activeIndex = index;
         this.selectedElement = this.liCollections[index];
-        if (this.isBlazorServer) {
-            this.inputElement.setAttribute('value', this.selectedElement.getAttribute('data-value'));
-            this.interopAdaptor.invokeMethodAsync('OnListItemClick', index, true);
-        }
-        else {
-            this.elementValue(new Date(this.timeCollections[index]));
-        }
-    };
-    TimePicker.prototype.findNextInBlazor = function (event) {
-        var count = isNullOrUndefined(this.blazorTimeCollections) ? 0 : this.blazorTimeCollections.length;
-        var index = 0;
-        var value = this.createDateObj(this.inputElement.value);
-        switch (event.action) {
-            case 'home':
-                this.activeIndex = index;
-                break;
-            case 'end':
-                index = count - 1;
-                this.activeIndex = index;
-                break;
-            case 'down':
-                for (var i = 0; i < count; i++) {
-                    if (this.isBlazorServer ? (+value < +this.createDateObj(this.blazorTimeCollections[i])) :
-                        (+value < this.timeCollections[i])) {
-                        var index_1 = this.validLiElement(i);
-                        this.activeIndex = index_1;
-                        break;
-                    }
-                    else if (i === count - 1) {
-                        var index_2 = this.validLiElement(0);
-                        this.activeIndex = index_2;
-                        break;
-                    }
-                }
-                break;
-            case 'up':
-                for (var i = count - 1; i >= 0; i--) {
-                    if (this.isBlazorServer ? (+value > +this.createDateObj(this.blazorTimeCollections[i])) :
-                        (+value > this.timeCollections[i])) {
-                        var index_3 = this.validLiElement(i, true);
-                        this.activeIndex = index_3;
-                        break;
-                    }
-                    else if (i === 0) {
-                        var index_4 = this.validLiElement(count - 1);
-                        this.activeIndex = index_4;
-                        break;
-                    }
-                }
-                break;
-        }
-        this.interopAdaptor.invokeMethodAsync('OnListItemClick', this.activeIndex, true);
+        this.elementValue(new Date(this.timeCollections[index]));
     };
     TimePicker.prototype.elementValue = function (value) {
         if (!isNullOrUndefined(this.checkDateValue(value))) {
@@ -11377,53 +10983,34 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
     };
     TimePicker.prototype.validLiElement = function (index, backward) {
         var elementIndex = null;
-        if (this.isBlazorServer && isNullOrUndefined(this.popupWrapper)) {
-            var items = this.blazorTimeCollections;
-            if (items.length) {
-                if (backward) {
-                    for (var i = index; i >= 0; i--) {
+        var items = isNullOrUndefined(this.popupWrapper) ? this.liCollections :
+            this.popupWrapper.querySelectorAll('.' + LISTCLASS$1);
+        var isCheck = true;
+        if (items.length) {
+            if (backward) {
+                for (var i = index; i >= 0; i--) {
+                    if (!items[i].classList.contains(DISABLED$3)) {
                         elementIndex = i;
                         break;
                     }
-                }
-                else {
-                    for (var i = index; i <= items.length - 1; i++) {
-                        elementIndex = i;
-                        break;
+                    else if (i === 0) {
+                        if (isCheck) {
+                            index = i = items.length;
+                            isCheck = false;
+                        }
                     }
                 }
             }
-        }
-        else {
-            var items = isNullOrUndefined(this.popupWrapper) ? this.liCollections :
-                this.popupWrapper.querySelectorAll('.' + LISTCLASS$1);
-            var isCheck = true;
-            if (items.length) {
-                if (backward) {
-                    for (var i = index; i >= 0; i--) {
-                        if (!items[i].classList.contains(DISABLED$3)) {
-                            elementIndex = i;
-                            break;
-                        }
-                        else if (i === 0) {
-                            if (isCheck) {
-                                index = i = items.length;
-                                isCheck = false;
-                            }
-                        }
+            else {
+                for (var i = index; i <= items.length - 1; i++) {
+                    if (!items[i].classList.contains(DISABLED$3)) {
+                        elementIndex = i;
+                        break;
                     }
-                }
-                else {
-                    for (var i = index; i <= items.length - 1; i++) {
-                        if (!items[i].classList.contains(DISABLED$3)) {
-                            elementIndex = i;
-                            break;
-                        }
-                        else if (i === items.length - 1) {
-                            if (isCheck) {
-                                index = i = -1;
-                                isCheck = false;
-                            }
+                    else if (i === items.length - 1) {
+                        if (isCheck) {
+                            index = i = -1;
+                            isCheck = false;
                         }
                     }
                 }
@@ -11435,32 +11022,21 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
         if (isNullOrUndefined(this.step) || this.step <= 0 || this.inputWrapper.buttons[0].classList.contains(DISABLED$3)) {
             return;
         }
-        var count = this.isBlazorServer ? (isNullOrUndefined(this.blazorTimeCollections) ? 0 :
-            this.blazorTimeCollections.length) : this.timeCollections.length;
+        var count = this.timeCollections.length;
         if (isNullOrUndefined(this.getActiveElement()) || this.getActiveElement().length === 0) {
-            if (isNullOrUndefined(this.popupObj) && this.isBlazorServer) {
-                if (isNullOrUndefined(this.activeIndex)) {
+            if (this.liCollections.length > 0) {
+                if (isNullOrUndefined(this.value) && isNullOrUndefined(this.activeIndex)) {
                     var index = this.validLiElement(0, event.action === 'down' ? false : true);
                     this.activeIndex = index;
-                    this.interopAdaptor.invokeMethodAsync('OnListItemClick', index, true);
+                    this.selectedElement = this.liCollections[index];
+                    this.elementValue(new Date(this.timeCollections[index]));
                 }
                 else {
-                    this.findNextInBlazor(event);
+                    this.findNextElement(event);
                 }
             }
             else {
-                if (this.liCollections.length > 0) {
-                    if (this.isBlazorServer ? (isNullOrUndefined(this.activeIndex)) : (isNullOrUndefined(this.value) &&
-                        isNullOrUndefined(this.activeIndex))) {
-                        this.selectNextItem(event);
-                    }
-                    else {
-                        this.findNextElement(event);
-                    }
-                }
-                else {
-                    this.findNextElement(event);
-                }
+                this.findNextElement(event);
             }
         }
         else {
@@ -11471,50 +11047,34 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                 this.activeIndex = index = this.activeIndex < 0 ? (count - 1) : this.activeIndex;
                 this.activeIndex = index = this.validLiElement(this.activeIndex, (event.keyCode === 40 || event.keyCode === 39) ?
                     false : true);
-                if (!this.isBlazorServer) {
-                    nextItem = isNullOrUndefined(this.timeCollections[index]) ? this.timeCollections[0] : this.timeCollections[index];
-                }
+                nextItem = isNullOrUndefined(this.timeCollections[index]) ? this.timeCollections[0] : this.timeCollections[index];
             }
             else if (event.action === 'home') {
                 var index = this.validLiElement(0);
                 this.activeIndex = index;
-                if (!this.isBlazorServer) {
-                    nextItem = this.timeCollections[index];
-                }
+                nextItem = this.timeCollections[index];
             }
             else if (event.action === 'end') {
                 var index = this.validLiElement(count - 1, true);
                 this.activeIndex = index;
-                if (!this.isBlazorServer) {
-                    nextItem = this.timeCollections[index];
-                }
+                nextItem = this.timeCollections[index];
             }
             this.selectedElement = this.liCollections[this.activeIndex];
-            if (this.isBlazorServer) {
-                this.inputElement.setAttribute('value', this.selectedElement.getAttribute('data-value'));
-                this.interopAdaptor.invokeMethodAsync('OnListItemClick', this.activeIndex, true);
-            }
-            else {
-                this.elementValue(new Date(nextItem));
-            }
+            this.elementValue(new Date(nextItem));
         }
         this.isNavigate = true;
         this.setHover(this.selectedElement, NAVIGATION);
         this.setActiveDescendant();
-        if (!this.isBlazorServer) {
-            this.selectInputText();
-        }
+        this.selectInputText();
         if (this.isPopupOpen() && this.selectedElement !== null && (!event || event.type !== 'click')) {
             this.setScrollPosition();
         }
     };
     TimePicker.prototype.getCultureTimeObject = function (ld, c) {
-        return isBlazor() ? (getValue('t', getValue(c, blazorCultureFormats))).replace(/tt/, 'a') :
-            getValue('main.' + c + '.dates.calendars.gregorian.timeFormats.short', ld);
+        return getValue('main.' + c + '.dates.calendars.gregorian.timeFormats.short', ld);
     };
     TimePicker.prototype.getCultureDateObject = function (ld, c) {
-        return isBlazor() ? (getValue('d', getValue(c, blazorCultureFormats))) :
-            getValue('main.' + c + '.dates.calendars.gregorian.dateFormats.short', ld);
+        return getValue('main.' + c + '.dates.calendars.gregorian.dateFormats.short', ld);
     };
     TimePicker.prototype.wireListEvents = function () {
         EventHandler.add(this.listWrapper, 'click', this.onMouseClick, this);
@@ -11616,8 +11176,7 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
             var items = this.popupWrapper.querySelectorAll('.' + LISTCLASS$1);
             if (items.length) {
                 for (var i = 0; i < items.length; i++) {
-                    if ((!this.isBlazorServer && this.timeCollections[i] === +this.getDateObject(this.valueWithMinutes))
-                        || (this.isBlazorServer && this.blazorTimeCollections[i] === this.blazorTimeCollections[this.activeIndex])) {
+                    if ((this.timeCollections[i] === +this.getDateObject(this.valueWithMinutes))) {
                         items[i].setAttribute('aria-selected', 'true');
                         this.selectedElement = items[i];
                         this.activeIndex = i;
@@ -11640,9 +11199,7 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
         return (li && li.classList.contains(LISTCLASS$1) && !li.classList.contains(DISABLED$3));
     };
     TimePicker.prototype.createDateObj = function (val) {
-        var formatStr = isBlazor() ?
-            'M' + getDefaultDateObject().dateSeperator + 'd' + getDefaultDateObject().dateSeperator + 'yy'
-            : null;
+        var formatStr = null;
         var today = this.globalize.formatDate(new Date(), { format: formatStr, skeleton: 'short', type: 'date' });
         var value = null;
         if (typeof val === 'string') {
@@ -11785,18 +11342,15 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
         }
         removeClass([this.inputWrapper.container], [FOCUS]);
         var blurArguments = {
-            model: this.isBlazorServer ? null : this
+            model: this
         };
         this.trigger('blur', blurArguments);
-        if (!this.isBlazorServer && this.getText() !== this.inputElement.value) {
+        if (this.getText() !== this.inputElement.value) {
             this.updateValue((this.inputElement).value, e);
         }
         else if (this.inputElement.value.trim().length === 0) {
             this.resetState();
         }
-        if (this.isBlazorServer) {
-            this.interopAdaptor.invokeMethodAsync('OnStrictMode', this.inputElement.value);
-        }
         this.cursorDetails = null;
         this.isNavigate = false;
         if (this.inputElement.value === '') {
@@ -11813,7 +11367,7 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
             this.inputElement.blur();
             removeClass([this.inputWrapper.container], [FOCUS]);
             var blurArguments = {
-                model: this.isBlazorServer ? null : this
+                model: this
             };
             this.trigger('blur', blurArguments);
         }
@@ -11829,7 +11383,7 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
             return;
         }
         var focusArguments = {
-            model: this.isBlazorServer ? null : this
+            model: this
         };
         if (!this.readonly && !Browser.isDevice && !this.enableMask) {
             this.selectInputText();
@@ -11892,7 +11446,7 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                 document.body.appendChild(this.mobileTimePopupWrap);
             }
             this.openPopupEventArgs = {
-                popup: this.isBlazorServer ? null : (this.popupObj || null),
+                popup: this.popupObj || null,
                 cancel: false,
                 event: event || null,
                 name: 'open',
@@ -11900,19 +11454,8 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
             };
             var eventArgs = this.openPopupEventArgs;
             this.trigger('open', eventArgs, function (eventArgs) {
-                if ((isBlazor() && _this.isServerRendered)) {
-                    eventArgs.popup = _this.popupObj || null;
-                }
                 _this.openPopupEventArgs = eventArgs;
                 if (!_this.openPopupEventArgs.cancel && !_this.inputWrapper.buttons[0].classList.contains(DISABLED$3)) {
-                    if (_this.isBlazorServer) {
-                        _this.popupWrapper.style.visibility = '';
-                        _this.popupWrapper.style.width = _this.inputWrapper.container.offsetWidth + 'px';
-                        _this.popupWrapper.style.height = 'auto';
-                    }
-                    if (_this.isBlazorServer) {
-                        _this.openPopupEventArgs.popup = _this.popupObj;
-                    }
                     _this.openPopupEventArgs.appendTo.appendChild(_this.popupWrapper);
                     _this.popupAlignment(_this.openPopupEventArgs);
                     _this.setScrollPosition();
@@ -11938,11 +11481,6 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                 }
                 else {
                     _this.popupObj.destroy();
-                    if (_this.isBlazorServer) {
-                        _this.disposeServerPopup();
-                        _this.inputWrapper.container.parentElement.insertBefore(_this.popupWrapper, _this.inputWrapper.container.nextElementSibling);
-                        _this.interopAdaptor.invokeMethodAsync('OnPopupHide', false);
-                    }
                     _this.popupWrapper = _this.listTag = undefined;
                     _this.liCollections = _this.timeCollections = _this.disableItemCollection = [];
                     _this.popupObj = null;
@@ -12067,10 +11605,8 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                     this.setTimeAllowEdit();
                     break;
                 case 'enableRtl':
-                    if (!this.isBlazorServer) {
-                        this.setProperties({ enableRtl: newProp.enableRtl }, true);
-                        this.setEnableRtl();
-                    }
+                    this.setProperties({ enableRtl: newProp.enableRtl }, true);
+                    this.setEnableRtl();
                     break;
                 case 'cssClass':
                     this.updateCssClass(newProp.cssClass, oldProp.cssClass);
@@ -12086,9 +11622,7 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                     break;
                 case 'min':
                 case 'max':
-                    if (!this.isBlazorServer) {
-                        this.getProperty(newProp, prop);
-                    }
+                    this.getProperty(newProp, prop);
                     break;
                 case 'showClearButton':
                     Input.setClearButton(this.showClearButton, this.inputElement, this.inputWrapper);
@@ -12099,13 +11633,11 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                     this.globalize = new Internationalization(this.locale);
                     this.l10n.setLocale(this.locale);
                     this.updatePlaceHolder();
-                    if (!this.isBlazorServer) {
-                        this.setValue(this.value);
-                        if (this.enableMask) {
-                            this.notify("createMask", {
-                                module: "MaskedDateTime",
-                            });
-                        }
+                    this.setValue(this.value);
+                    if (this.enableMask) {
+                        this.notify("createMask", {
+                            module: "MaskedDateTime",
+                        });
                     }
                     break;
                 case 'width':
@@ -12115,50 +11647,46 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                 case 'format':
                     this.setProperties({ format: newProp.format }, true);
                     this.checkTimeFormat();
-                    if (!this.isBlazorServer) {
-                        this.setValue(this.value);
-                        if (this.enableMask) {
-                            this.createMask();
-                            if (!this.value) {
-                                this.updateInputValue(this.maskedDateValue);
-                            }
+                    this.setValue(this.value);
+                    if (this.enableMask) {
+                        this.createMask();
+                        if (!this.value) {
+                            this.updateInputValue(this.maskedDateValue);
                         }
                     }
                     break;
                 case 'value':
-                    if (!this.isBlazorServer) {
-                        this.invalidValueString = null;
-                        this.checkInvalidValue(newProp.value);
-                        newProp.value = this.value;
-                        if (!this.invalidValueString) {
-                            if (typeof newProp.value === 'string') {
-                                this.setProperties({ value: this.checkDateValue(new Date(newProp.value)) }, true);
-                                newProp.value = this.value;
-                            }
-                            else {
-                                if ((newProp.value && +new Date(+newProp.value).setMilliseconds(0)) !== +this.value) {
-                                    newProp.value = this.checkDateValue(new Date('' + newProp.value));
-                                }
-                            }
-                            this.initValue = newProp.value;
-                            newProp.value = this.compareFormatChange(this.checkValue(newProp.value));
+                    this.invalidValueString = null;
+                    this.checkInvalidValue(newProp.value);
+                    newProp.value = this.value;
+                    if (!this.invalidValueString) {
+                        if (typeof newProp.value === 'string') {
+                            this.setProperties({ value: this.checkDateValue(new Date(newProp.value)) }, true);
+                            newProp.value = this.value;
                         }
                         else {
-                            this.updateInputValue(this.invalidValueString);
-                            this.checkErrorState(this.invalidValueString);
-                        }
-                        this.checkValueChange(null, false);
-                        if (this.isPopupOpen()) {
-                            this.setScrollPosition();
-                        }
-                        if (this.isAngular && this.preventChange) {
-                            this.preventChange = false;
-                        }
-                        if (this.enableMask) {
-                            this.notify("createMask", {
-                                module: "MaskedDateTime",
-                            });
+                            if ((newProp.value && +new Date(+newProp.value).setMilliseconds(0)) !== +this.value) {
+                                newProp.value = this.checkDateValue(new Date('' + newProp.value));
+                            }
                         }
+                        this.initValue = newProp.value;
+                        newProp.value = this.compareFormatChange(this.checkValue(newProp.value));
+                    }
+                    else {
+                        this.updateInputValue(this.invalidValueString);
+                        this.checkErrorState(this.invalidValueString);
+                    }
+                    this.checkValueChange(null, false);
+                    if (this.isPopupOpen()) {
+                        this.setScrollPosition();
+                    }
+                    if (this.isAngular && this.preventChange) {
+                        this.preventChange = false;
+                    }
+                    if (this.enableMask) {
+                        this.notify("createMask", {
+                            module: "MaskedDateTime",
+                        });
                     }
                     break;
                 case 'floatLabelType':
@@ -12167,32 +11695,23 @@ var TimePicker = /** @__PURE__ @class */ (function (_super) {
                     Input.addFloating(this.inputElement, this.floatLabelType, this.placeholder);
                     break;
                 case 'strictMode':
-                    if (!this.isBlazorServer) {
-                        this.invalidValueString = null;
-                        if (newProp.strictMode) {
-                            this.checkErrorState(null);
-                        }
-                        this.setProperties({ strictMode: newProp.strictMode }, true);
-                        this.checkValue((this.inputElement).value);
-                        this.checkValueChange(null, false);
+                    this.invalidValueString = null;
+                    if (newProp.strictMode) {
+                        this.checkErrorState(null);
                     }
+                    this.setProperties({ strictMode: newProp.strictMode }, true);
+                    this.checkValue((this.inputElement).value);
+                    this.checkValueChange(null, false);
                     break;
                 case 'scrollTo':
-                    if (!this.isBlazorServer) {
-                        if (this.checkDateValue(new Date(this.checkInValue(newProp.scrollTo)))) {
-                            if (this.popupWrapper) {
-                                this.setScrollTo();
-                            }
-                            this.setProperties({ scrollTo: this.checkDateValue(new Date(this.checkInValue(newProp.scrollTo))) }, true);
-                        }
-                        else {
-                            this.setProperties({ scrollTo: null }, true);
-                        }
-                    }
-                    else {
+                    if (this.checkDateValue(new Date(this.checkInValue(newProp.scrollTo)))) {
                         if (this.popupWrapper) {
                             this.setScrollTo();
                         }
+                        this.setProperties({ scrollTo: this.checkDateValue(new Date(this.checkInValue(newProp.scrollTo))) }, true);
+                    }
+                    else {
+                        this.setProperties({ scrollTo: null }, true);
                     }
                     break;
                 case 'enableMask':
@@ -12441,7 +11960,7 @@ var DateTimePicker = /** @__PURE__ @class */ (function (_super) {
         }
         removeClass([this.inputWrapper.container], INPUTFOCUS$2);
         var blurArguments = {
-            model: (isBlazor() && this.isServerRendered) ? null : this
+            model: this
         };
         if (this.isTimePopupOpen()) {
             this.hide(e);
@@ -12620,7 +12139,7 @@ var DateTimePicker = /** @__PURE__ @class */ (function (_super) {
         var dateOptions;
         if (!isNullOrUndefined(value)) {
             if (this.calendarMode === 'Gregorian') {
-                dateOptions = { format: this.cldrDateTimeFormat(), type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd' };
+                dateOptions = { format: this.cldrDateTimeFormat(), type: 'dateTime', skeleton: 'yMd' };
             }
             else {
                 dateOptions = { format: this.cldrDateTimeFormat(), type: 'dateTime', skeleton: 'yMd', calendar: 'islamic' };
@@ -12671,8 +12190,7 @@ var DateTimePicker = /** @__PURE__ @class */ (function (_super) {
         var cldrTime;
         if (this.isNullOrEmpty(this.timeFormat)) {
             if (this.locale === 'en' || this.locale === 'en-US') {
-                cldrTime = isBlazor() ? (getValue('t', getValue(this.locale, blazorCultureFormats))).replace(/tt/, 'a') :
-                    (getValue('timeFormats.short', getDefaultDateObject()));
+                cldrTime = (getValue('timeFormats.short', getDefaultDateObject()));
             }
             else {
                 cldrTime = (this.getCultureTimeObject(cldrData, '' + this.locale));
@@ -12686,7 +12204,7 @@ var DateTimePicker = /** @__PURE__ @class */ (function (_super) {
     DateTimePicker.prototype.cldrDateTimeFormat = function () {
         var cldrTime;
         var culture = new Internationalization(this.locale);
-        var dateFormat = culture.getDatePattern({ skeleton: isBlazor() ? 'd' : 'yMd' });
+        var dateFormat = culture.getDatePattern({ skeleton: 'yMd' });
         if (this.isNullOrEmpty(this.formatString)) {
             cldrTime = dateFormat + ' ' + this.getCldrFormat('time');
         }
@@ -12699,8 +12217,7 @@ var DateTimePicker = /** @__PURE__ @class */ (function (_super) {
     DateTimePicker.prototype.getCldrFormat = function (type) {
         var cldrDateTime;
         if (this.locale === 'en' || this.locale === 'en-US') {
-            cldrDateTime = isBlazor() ? (getValue('t', getValue(this.locale, blazorCultureFormats))).replace(/tt/, 'a') :
-                (getValue('timeFormats.short', getDefaultDateObject()));
+            cldrDateTime = (getValue('timeFormats.short', getDefaultDateObject()));
         }
         else {
             cldrDateTime = (this.getCultureTimeObject(cldrData, '' + this.locale));
@@ -12718,8 +12235,7 @@ var DateTimePicker = /** @__PURE__ @class */ (function (_super) {
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     DateTimePicker.prototype.getCultureTimeObject = function (ld, c) {
         if (this.calendarMode === 'Gregorian') {
-            return isBlazor() ? (getValue('t', getValue(this.locale, blazorCultureFormats))).replace(/tt/, 'a') :
-                (getValue('main.' + '' + this.locale + '.dates.calendars.gregorian.timeFormats.short', ld));
+            return getValue('main.' + '' + this.locale + '.dates.calendars.gregorian.timeFormats.short', ld);
         }
         else {
             return getValue('main.' + '' + this.locale + '.dates.calendars.islamic.timeFormats.short', ld);
@@ -12866,7 +12382,7 @@ var DateTimePicker = /** @__PURE__ @class */ (function (_super) {
         var _this = this;
         this.preventArgs = {
             cancel: false,
-            popup: (isBlazor() && this.isServerRendered) ? null : this.popupObject,
+            popup: this.popupObject,
             event: e || null
         };
         var eventArgs = this.preventArgs;
@@ -13275,7 +12791,7 @@ var DateTimePicker = /** @__PURE__ @class */ (function (_super) {
         if (this.popupObj || this.dateTimeWrapper) {
             this.preventArgs = {
                 cancel: false,
-                popup: (isBlazor() && this.isServerRendered) ? null : this.popupObj || this.popupObject,
+                popup: this.popupObj || this.popupObject,
                 event: e || null
             };
             var eventArgs = this.preventArgs;
@@ -13516,7 +13032,7 @@ var DateTimePicker = /** @__PURE__ @class */ (function (_super) {
         if (this.calendarMode === 'Gregorian') {
             dateString = this.globalize.formatDate(time, {
                 format: !isNullOrUndefined(this.formatString) ? this.formatString : this.cldrDateTimeFormat(),
-                type: 'dateTime', skeleton: isBlazor() ? 'd' : 'yMd'
+                type: 'dateTime', skeleton: 'yMd'
             });
         }
         else {
@@ -13940,9 +13456,14 @@ var MaskedDateTime = /** @__PURE__ @class */ (function () {
         this.isDeletion = false;
         this.isShortYear = false;
         this.isDeleteKey = false;
+        this.isDateZero = false;
+        this.isMonthZero = false;
+        this.isYearZero = false;
+        this.dayTypeCount = 0;
+        this.monthTypeCount = 0;
         this.parent = parent;
         this.dateformat = this.getCulturedFormat();
-        this.maskDateValue = this.parent.value != null ? this.parent.value : new Date();
+        this.maskDateValue = this.parent.value != null ? new Date(+this.parent.value) : new Date();
         this.maskDateValue.setMonth(0);
         this.maskDateValue.setHours(0);
         this.maskDateValue.setMinutes(0);
@@ -14100,6 +13621,7 @@ var MaskedDateTime = /** @__PURE__ @class */ (function () {
         switch (this.previousHiddenMask[start - 1]) {
             case 'd':
                 var date = (this.isDayPart && newDateValue.getDate().toString().length < 2 ? newDateValue.getDate() * 10 : 0) + parseInt(newVal[start - 1], 10);
+                this.isDateZero = (newVal[start - 1] == '0');
                 if (isNaN(date)) {
                     return;
                 }
@@ -14114,9 +13636,11 @@ var MaskedDateTime = /** @__PURE__ @class */ (function () {
                         return;
                     }
                     this.isDayPart = true;
+                    this.dayTypeCount = this.dayTypeCount + 1;
                 }
                 else {
                     this.isDayPart = false;
+                    this.dayTypeCount = this.isDateZero ? this.dayTypeCount + 1 : this.dayTypeCount;
                 }
                 break;
             case 'M':
@@ -14127,6 +13651,7 @@ var MaskedDateTime = /** @__PURE__ @class */ (function () {
                 else {
                     month = parseInt(newVal[start - 1], 10);
                 }
+                this.isMonthZero = (newVal[start - 1] == '0');
                 if (!isNaN(month)) {
                     while (month > 12) {
                         month = parseInt(month.toString().slice(1), 10);
@@ -14147,10 +13672,12 @@ var MaskedDateTime = /** @__PURE__ @class */ (function () {
                         }
                         this.previousDate = new Date(newDateValue.getFullYear(), newDateValue.getMonth(), newDateValue.getDate());
                         this.isMonthPart = true;
+                        this.monthTypeCount = this.monthTypeCount + 1;
                     }
                     else {
                         newDateValue.setMonth(0);
                         this.isMonthPart = false;
+                        this.monthTypeCount = this.isMonthZero ? this.monthTypeCount + 1 : this.monthTypeCount;
                     }
                 }
                 else { // let monthString: string[] = <string[]>(getValue('months[stand-alone].wide', getDefaultDateObject()));
@@ -14176,6 +13703,7 @@ var MaskedDateTime = /** @__PURE__ @class */ (function () {
             case 'y':
                 var year = (this.isYearPart && (newDateValue.getFullYear().toString().length < 4 && !this.isShortYear) ? newDateValue.getFullYear() * 10 : 0) + parseInt(newVal[start - 1], 10);
                 this.isShortYear = false;
+                this.isYearZero = (newVal[start - 1] == '0');
                 if (isNaN(year)) {
                     return;
                 }
@@ -14283,9 +13811,15 @@ var MaskedDateTime = /** @__PURE__ @class */ (function () {
                 case 'dddd':
                 case 'd':
                     result = proxy.isDayPart ? proxy.maskDateValue.getDate().toString() : proxy.defaultConstant['day'].toString();
+                    result = proxy.zeroCheck(proxy.isDateZero, proxy.isDayPart, result);
                     break;
                 case 'dd':
                     result = proxy.isDayPart ? proxy.roundOff(proxy.maskDateValue.getDate(), 2) : proxy.defaultConstant['day'].toString();
+                    result = proxy.zeroCheck(proxy.isDateZero, proxy.isDayPart, result);
+                    if (proxy.dayTypeCount == 2) {
+                        proxy.isNavigate = true;
+                        proxy.dayTypeCount = 0;
+                    }
                     break;
                 case 'E':
                 case 'EE':
@@ -14300,9 +13834,15 @@ var MaskedDateTime = /** @__PURE__ @class */ (function () {
                     break;
                 case 'M':
                     result = proxy.isMonthPart ? (proxy.maskDateValue.getMonth() + 1).toString() : proxy.defaultConstant['month'].toString();
+                    result = proxy.zeroCheck(proxy.isMonthZero, proxy.isMonthPart, result);
                     break;
                 case 'MM':
                     result = proxy.isMonthPart ? proxy.roundOff(proxy.maskDateValue.getMonth() + 1, 2) : proxy.defaultConstant['month'].toString();
+                    result = proxy.zeroCheck(proxy.isMonthZero, proxy.isMonthPart, result);
+                    if (proxy.monthTypeCount == 2) {
+                        proxy.isNavigate = true;
+                        proxy.monthTypeCount = 0;
+                    }
                     break;
                 case 'MMM':
                     result = proxy.isMonthPart ? monthAbbreviated[proxy.maskDateValue.getMonth() + 1] : proxy.defaultConstant['month'].toString();
@@ -14312,6 +13852,7 @@ var MaskedDateTime = /** @__PURE__ @class */ (function () {
                     break;
                 case 'yy':
                     result = proxy.isYearPart ? proxy.roundOff(proxy.maskDateValue.getFullYear() % 100, 2) : proxy.defaultConstant['year'].toString();
+                    result = proxy.zeroCheck(proxy.isYearZero, proxy.isYearPart, result);
                     if (proxy.isYearPart) {
                         proxy.isNavigate = proxy.isShortYear = (proxy.maskDateValue.getFullYear() % 100).toString().length === 2;
                     }
@@ -14319,6 +13860,7 @@ var MaskedDateTime = /** @__PURE__ @class */ (function () {
                 case 'y':
                 case 'yyyy':
                     result = proxy.isYearPart ? proxy.roundOff(proxy.maskDateValue.getFullYear(), 4) : proxy.defaultConstant['year'].toString();
+                    result = proxy.zeroCheck(proxy.isYearZero, proxy.isYearPart, result);
                     break;
                 case 'h':
                     result = proxy.isHourPart ? (proxy.maskDateValue.getHours() % 12 || 12).toString() : proxy.defaultConstant['hour'].toString();
@@ -14394,6 +13936,7 @@ var MaskedDateTime = /** @__PURE__ @class */ (function () {
         inputValue = this.dateformat.replace(this.formatRegex, this.formatCheck());
         this.isHiddenMask = true;
         this.hiddenMask = this.dateformat.replace(this.formatRegex, this.formatCheck());
+        this.isDateZero = this.isMonthZero = this.isYearZero = false;
         this.isHiddenMask = false;
         this.previousHiddenMask = this.hiddenMask;
         this.previousValue = inputValue;
@@ -14430,6 +13973,13 @@ var MaskedDateTime = /** @__PURE__ @class */ (function () {
         }
         return result + valueText;
     };
+    MaskedDateTime.prototype.zeroCheck = function (isZero, isDayPart, resultValue) {
+        var result = resultValue;
+        if (isZero && !isDayPart) {
+            result = '0';
+        }
+        return result;
+    };
     MaskedDateTime.prototype.handleDeletion = function (format, isSegment) {
         switch (format) {
             case 'd':