@syncfusion/ej2-schedule 26.1.39 → 26.1.41-16103

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

@@ -107,15 +107,16 @@ var MS_PER_MINUTE = 60000;
  *
  * @param {Element} container Accepts the DOM element
  * @param {string} elementClass Accepts the element class
+ * @param {boolean} isTransformed Accepts the boolean value that indicates the status of the transform style applied to the element
  * @returns {number} Returns the height of the element
  */
-function getElementHeightFromClass(container, elementClass) {
+function getElementHeightFromClass(container, elementClass, isTransformed) {
     var height = 0;
     var el = createElement('div', { className: elementClass }).cloneNode();
     el.style.visibility = 'hidden';
     el.style.position = 'absolute';
     container.appendChild(el);
-    height = getElementHeight(el);
+    height = getElementHeight(el, isTransformed);
     remove(el);
     return height;
 }
@@ -124,15 +125,16 @@ function getElementHeightFromClass(container, elementClass) {
  *
  * @param {Element} container Accepts the DOM element
  * @param {string} elementClass Accepts the element class
+ * @param {boolean} isTransformed Accepts the boolean value that indicates the status of the transform style applied to the element
  * @returns {number} Returns the width of the element
  */
-function getElementWidthFromClass(container, elementClass) {
+function getElementWidthFromClass(container, elementClass, isTransformed) {
     var width = 0;
     var el = createElement('div', { className: elementClass }).cloneNode();
     el.style.visibility = 'hidden';
     el.style.position = 'absolute';
     container.appendChild(el);
-    width = getElementWidth(el);
+    width = getElementWidth(el, isTransformed);
     remove(el);
     return width;
 }
@@ -524,28 +526,31 @@ function capitalizeFirstWord(inputString, type) {
  * Method to get element cell width
  *
  * @param {HTMLElement} element Accepts the DOM element
+ * @param {boolean} isTransformed Accepts the boolean value that indicates the status of the transform style applied to the element
  * @returns {number} Returns the width of the given element
  */
-function getElementWidth(element) {
-    return document.body.style.transform.includes('scale') ? element.offsetWidth : element.getBoundingClientRect().width;
+function getElementWidth(element, isTransformed) {
+    return isTransformed ? element.offsetWidth : element.getBoundingClientRect().width;
 }
 /**
  * Method to get element cell Height
  *
  * @param {HTMLElement} element Accepts the DOM element
+ * @param {boolean} isTransformed Accepts the boolean value that indicates the status of the transform style applied to the element
  * @returns {number} Returns the Height of the given element
  */
-function getElementHeight(element) {
-    return document.body.style.transform.includes('scale') ? element.offsetHeight : element.getBoundingClientRect().height;
+function getElementHeight(element, isTransformed) {
+    return isTransformed ? element.offsetHeight : element.getBoundingClientRect().height;
 }
 /**
  * Method to get element cell Top
  *
  * @param {HTMLElement} element Accepts the DOM element
+ * @param {boolean} isTransformed Accepts the boolean value that indicates the status of the transform style applied to the element
  * @returns {number} Returns the top value of the given element
  */
-function getElementTop(element) {
-    return document.body.style.transform.includes('scale') ? element.offsetTop : element.getBoundingClientRect().top;
+function getElementTop(element, isTransformed) {
+    return isTransformed ? element.offsetTop : element.getBoundingClientRect().top;
 }
 
 /**
@@ -1016,21 +1021,21 @@ var ALLDAY_APPOINTMENT_SCROLL = 'e-all-day-scroll';
 /** @private */
 var ALLDAY_APPOINTMENT_AUTO = 'e-all-day-auto';
 
-var __assign = (undefined && undefined.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
+var __assign = (undefined && undefined.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 /**
  * Header module
  */
-var HeaderRenderer = /** @__PURE__ @class */ (function () {
+var HeaderRenderer = /** @class */ (function () {
     function HeaderRenderer(parent) {
         this.parent = parent;
         this.l10n = this.parent.localeObj;
@@ -1091,10 +1096,12 @@ var HeaderRenderer = /** @__PURE__ @class */ (function () {
                 items: args.items,
                 overflowMode: 'Popup',
                 clicked: _this.toolbarClickHandler.bind(_this),
+                created: _this.toolbarCreateHandler.bind(_this),
                 enableRtl: _this.parent.enableRtl,
                 enableHtmlSanitizer: _this.parent.enableHtmlSanitizer,
                 locale: _this.parent.locale
             });
+            _this.toolbarObj.isStringTemplate = true;
             _this.toolbarObj.root = _this.parent.root ? _this.parent.root : _this.parent;
             _this.toolbarObj.appendTo(_this.parent.element.querySelector('.' + HEADER_TOOLBAR));
             _this.toolbarObj.element.setAttribute('aria-label', 'Scheduler');
@@ -1527,6 +1534,12 @@ var HeaderRenderer = /** @__PURE__ @class */ (function () {
         var views = [].slice.call(this.element.querySelectorAll('.e-views'));
         return views.indexOf(target);
     };
+    HeaderRenderer.prototype.toolbarCreateHandler = function () {
+        if (this.parent && this.parent.portals && this.toolbarObj && this.toolbarObj.portals) {
+            this.parent.portals = this.parent.portals.concat(this.toolbarObj.portals);
+            this.parent['renderReactTemplates']();
+        }
+    };
     HeaderRenderer.prototype.toolbarClickHandler = function (args) {
         if (!args.item) {
             return;
@@ -1670,7 +1683,7 @@ var HeaderRenderer = /** @__PURE__ @class */ (function () {
         var firstDate = new Date(dates[0].getTime());
         var lastDate = new Date(dates[dates.length - 1].getTime());
         if (this.parent.currentView === 'WorkWeek' || this.parent.currentView === 'TimelineWorkWeek') {
-            firstDate = getWeekFirstDate(resetTime(this.parent.selectedDate), this.parent.firstDayOfWeek);
+            firstDate = getWeekFirstDate(resetTime(this.parent.selectedDate), this.parent.activeViewOptions.firstDayOfWeek);
             lastDate = addDays(firstDate, 7 * this.parent.activeViewOptions.interval);
         }
         else if (this.parent.currentView === 'Month') {
@@ -1716,7 +1729,7 @@ var HeaderRenderer = /** @__PURE__ @class */ (function () {
 /**
  * `Scroll` module
  */
-var Scroll = /** @__PURE__ @class */ (function () {
+var Scroll = /** @class */ (function () {
     /**
      * Constructor for the scrolling.
      *
@@ -1809,7 +1822,7 @@ var Scroll = /** @__PURE__ @class */ (function () {
 /**
  * `touch` module is used to handle touch interactions.
  */
-var ScheduleTouch = /** @__PURE__ @class */ (function () {
+var ScheduleTouch = /** @class */ (function () {
     function ScheduleTouch(parent) {
         this.parent = parent;
         this.element = this.parent.element.querySelector('.' + TABLE_CONTAINER_CLASS);
@@ -1928,6 +1941,7 @@ var ScheduleTouch = /** @__PURE__ @class */ (function () {
                 this.parent.selectedElements = [];
                 this.parent.eventBase.getSelectedEventElements(target);
                 if (this.parent.resizeModule && closest(e.originalEvent.target, '.' + EVENT_RESIZE_CLASS)) {
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
                     this.parent.resizeModule.resizeStart(e.originalEvent);
                 }
             }
@@ -2014,6 +2028,9 @@ var ScheduleTouch = /** @__PURE__ @class */ (function () {
         this.element.style.transform = 'translatex(' + (this.parent.enableRtl ? prevWidth : -this.currentPanel.element.offsetLeft) + 'px)';
     };
     ScheduleTouch.prototype.onTransitionEnd = function () {
+        if (!isNullOrUndefined(this.element) && !this.element.classList.contains(TRANSLATE_CLASS)) {
+            return;
+        }
         removeClass([this.element], TRANSLATE_CLASS);
         this.element.style.transitionDuration = '';
         this.element.style.transform = '';
@@ -2064,7 +2081,7 @@ var ScheduleTouch = /** @__PURE__ @class */ (function () {
 /**
  * Keyboard interaction
  */
-var KeyboardInteraction = /** @__PURE__ @class */ (function () {
+var KeyboardInteraction = /** @class */ (function () {
     function KeyboardInteraction(parent) {
         this.selectedCells = [];
         this.keyConfigs = {
@@ -2099,7 +2116,9 @@ var KeyboardInteraction = /** @__PURE__ @class */ (function () {
             ctrlShiftUpArrow: 'ctrl+shift+uparrow',
             ctrlShiftDownArrow: 'ctrl+shift+downarrow',
             ctrlShiftLeftArrow: 'ctrl+shift+leftarrow',
-            ctrlShiftRightArrow: 'ctrl+shift+rightarrow'
+            ctrlShiftRightArrow: 'ctrl+shift+rightarrow',
+            shiftAltY: 'shift+alt+y',
+            shiftAltN: 'shift+alt+n'
         };
         this.parent = parent;
         this.parent.element.tabIndex = this.parent.element.tabIndex === -1 ? 0 : this.parent.element.tabIndex;
@@ -2180,6 +2199,43 @@ var KeyboardInteraction = /** @__PURE__ @class */ (function () {
                     this.processFTwelve(e);
                 }
                 break;
+            case 'shiftAltY':
+                this.parent.changeDate(new Date(), e);
+                break;
+            case 'shiftAltN':
+                if (this.parent.currentView === 'Agenda' || this.parent.currentView === 'MonthAgenda' ||
+                    this.parent.currentView === 'Year') {
+                    return;
+                }
+                this.processShiftAltN(e);
+                break;
+        }
+    };
+    KeyboardInteraction.prototype.processShiftAltN = function (e) {
+        var selectedCells = this.parent.getSelectedCells();
+        var target = e.target;
+        var cellData = extend({}, null, true);
+        if (selectedCells.length > 0 && (closest(target, '.' + WORK_CELLS_CLASS)
+            || closest(target, '.' + ALLDAY_CELLS_CLASS) || closest(target, '.' + HEADER_CELLS_CLASS))) {
+            cellData = this.getSelectedElements(target);
+        }
+        else if (closest(target, '.' + APPOINTMENT_CLASS) && !isNullOrUndefined(this.parent.activeEventData.event)) {
+            var event_1 = this.parent.activeEventData.event;
+            cellData.startTime = event_1.StartTime;
+            cellData.endTime = event_1.EndTime;
+            cellData.isAllDay = event_1.IsAllDay;
+        }
+        else {
+            var workHour = this.parent.getStartEndTime(this.parent.workHours.start);
+            var slotInterval = this.parent.activeViewOptions.timeScale.interval /
+                this.parent.activeViewOptions.timeScale.slotCount;
+            cellData.startTime = new Date(this.parent.selectedDate);
+            cellData.startTime.setHours(workHour.getHours(), workHour.getMinutes(), 0, 0);
+            cellData.endTime = new Date(cellData.startTime.getTime() + slotInterval * 60000);
+        }
+        var args = extend(cellData, { cancel: false, event: e });
+        if (args != null) {
+            this.parent.eventWindow.openEditor(args, 'Add');
         }
     };
     KeyboardInteraction.prototype.processFTwelve = function (e) {
@@ -2605,8 +2661,11 @@ var KeyboardInteraction = /** @__PURE__ @class */ (function () {
         return this.parent.eventBase.selectWorkCellByTime([selectedObject]);
     };
     KeyboardInteraction.prototype.processViewNavigation = function (e) {
-        var index = parseInt(e.key, 10) - 1;
-        if (!isNullOrUndefined(this.parent.views) && index < this.parent.views.length) {
+        if (isNullOrUndefined(e.code)) {
+            return;
+        }
+        var index = parseInt(e.code.slice(e.code.length - 1), 10) - 1;
+        if (!isNaN(index) && !isNullOrUndefined(this.parent.views) && index < this.parent.views.length) {
             var view = this.parent.viewCollections[parseInt(index.toString(), 10)].option;
             this.parent.changeView(view, e, undefined, index);
             if (this.parent.headerModule) {
@@ -3223,7 +3282,7 @@ var KeyboardInteraction = /** @__PURE__ @class */ (function () {
  *
  * @private
  */
-var Data = /** @__PURE__ @class */ (function () {
+var Data = /** @class */ (function () {
     /**
      * Constructor for data module
      *
@@ -3333,7 +3392,7 @@ var Data = /** @__PURE__ @class */ (function () {
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
 /** @private */
-var Gregorian = /** @__PURE__ @class */ (function () {
+var Gregorian = /** @class */ (function () {
     function Gregorian() {
     }
     Gregorian.prototype.firstDateOfMonth = function (date) {
@@ -3418,7 +3477,7 @@ var Gregorian = /** @__PURE__ @class */ (function () {
     return Gregorian;
 }());
 /** @private */
-var Islamic = /** @__PURE__ @class */ (function () {
+var Islamic = /** @class */ (function () {
     function Islamic() {
     }
     Islamic.prototype.firstDateOfMonth = function (date) {
@@ -3560,7 +3619,7 @@ var Islamic = /** @__PURE__ @class */ (function () {
 /**
  * Time zone
  */
-var Timezone = /** @__PURE__ @class */ (function () {
+var Timezone = /** @class */ (function () {
     function Timezone() {
         this.timezoneData = [];
         this.timezoneData = this.getTimezoneData();
@@ -4167,6 +4226,9 @@ function weeklyType(startDate, endDate, data, ruleObject) {
     }
     else {
         tempDate = getStartDateForWeek(startDate, ruleObject.day);
+        if (interval > 1 && dayIndex.indexOf(ruleObject.day[0]) < startDate.getDay()) {
+            tempDate.setDate(tempDate.getDate() + ((interval - 1) * 7));
+        }
         while (compareDates(tempDate, endDate)) {
             weekState = validateRules(tempDate, ruleObject);
             if (weekState && (expectedDays.indexOf(DAYINDEX[tempDate.getDay()]) > -1)) {
@@ -5496,7 +5558,7 @@ function roundDateValues(date) {
 /**
  * EventBase for appointment rendering
  */
-var EventBase = /** @__PURE__ @class */ (function () {
+var EventBase = /** @class */ (function () {
     /**
      * Constructor for EventBase
      *
@@ -6383,6 +6445,7 @@ var EventBase = /** @__PURE__ @class */ (function () {
         this.parent.activeEventData = { event: eventObject, element: target };
     };
     EventBase.prototype.generateOccurrence = function (event, viewDate, isMaxCount) {
+        var _this = this;
         var startDate = event[this.parent.eventFields.startTime];
         var endDate = event[this.parent.eventFields.endTime];
         var eventRule = event[this.parent.eventFields.recurrenceRule];
@@ -6397,6 +6460,10 @@ var EventBase = /** @__PURE__ @class */ (function () {
         var newTimezone = this.parent.timezone || this.parent.tzModule.getLocalTimezoneName();
         var firstDay = this.parent.activeViewOptions.firstDayOfWeek;
         var calendarMode = this.parent.calendarMode;
+        if (event[this.parent.eventFields.recurrenceRule] && event[this.parent.eventFields.recurrenceRule].includes('BYMONTHDAY') &&
+            this.parent.timezone && event[this.parent.eventFields.startTimezone] && event[this.parent.eventFields.endTimezone]) {
+            startDate = this.parent.tzModule.convert(event[this.parent.eventFields.startTime], this.parent.timezone, event[this.parent.eventFields.startTimezone]);
+        }
         var dates = generate(startDate, eventRule, exception, firstDay, maxCount, viewDate, calendarMode, newTimezone);
         if (this.parent.currentView === 'Agenda' && eventRule.indexOf('COUNT') === -1 && eventRule.indexOf('UNTIL') === -1) {
             if (isNullOrUndefined(event.generatedDates)) {
@@ -6411,11 +6478,21 @@ var EventBase = /** @__PURE__ @class */ (function () {
                 }
             }
         }
+        var isDSTAdjusted = false;
+        var convertedDates = [];
+        if (event[this.parent.eventFields.recurrenceRule] && event[this.parent.eventFields.recurrenceRule].includes('BYMONTHDAY') &&
+            this.parent.timezone && event[this.parent.eventFields.startTimezone] && event[this.parent.eventFields.endTimezone]) {
+            isDSTAdjusted = true;
+            convertedDates.push.apply(convertedDates, dates.map(function (date) {
+                return _this.parent.tzModule.convert(new Date(date), event[_this.parent.eventFields.startTimezone], _this.parent.timezone).getTime();
+            }));
+        }
+        convertedDates = convertedDates.length > 0 ? convertedDates : dates;
         var occurrenceCollection = [];
-        for (var _i = 0, dates_1 = dates; _i < dates_1.length; _i++) {
-            var date = dates_1[_i];
+        for (var _i = 0, convertedDates_1 = convertedDates; _i < convertedDates_1.length; _i++) {
+            var date = convertedDates_1[_i];
             var clonedObject = extend({}, event, null, true);
-            date = this.getDSTAdjustedTime(date, clonedObject);
+            date = !isDSTAdjusted ? this.getDSTAdjustedTime(date, clonedObject) : date;
             clonedObject[this.parent.eventFields.startTime] = new Date(date);
             clonedObject[this.parent.eventFields.endTime] = new Date(new Date(date).setMilliseconds(duration));
             clonedObject[this.parent.eventFields.recurrenceID] = clonedObject[this.parent.eventFields.id];
@@ -6868,23 +6945,23 @@ var EventBase = /** @__PURE__ @class */ (function () {
     return EventBase;
 }());
 
-var __extends = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __extends = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 /**
  * Vertical view appointment rendering
  */
-var VerticalEvent = /** @__PURE__ @class */ (function (_super) {
+var VerticalEvent = /** @class */ (function (_super) {
     __extends(VerticalEvent, _super);
     function VerticalEvent(parent) {
         var _this = _super.call(this, parent) || this;
@@ -6898,8 +6975,8 @@ var VerticalEvent = /** @__PURE__ @class */ (function (_super) {
         _this.slotCount = _this.parent.activeViewOptions.timeScale.slotCount;
         _this.interval = _this.parent.activeViewOptions.timeScale.interval;
         _this.allDayLevel = 0;
-        _this.startHour = _this.parent.activeView.getStartHour();
-        _this.endHour = _this.parent.activeView.getEndHour();
+        _this.startHour = _this.getStartEndHours(_this.parent.activeViewOptions.startHour);
+        _this.endHour = _this.getStartEndHours(_this.parent.activeViewOptions.endHour);
         _this.element = _this.parent.activeView.getPanel();
         _this.fields = _this.parent.eventFields;
         _this.animation = new Animation({ progress: _this.animationUiUpdate.bind(_this) });
@@ -6978,7 +7055,7 @@ var VerticalEvent = /** @__PURE__ @class */ (function (_super) {
             this.parent.crudModule.crudObj.isCrudAction = false;
         }
         this.parent.renderTemplates(function () {
-            if (_this.parent.isReact && _this.parent.activeViewOptions.eventTemplate) {
+            if (_this.parent && _this.parent.isReact && _this.parent.activeViewOptions.eventTemplate) {
                 var wraps = [].slice.call(_this.parent.element.querySelectorAll('.' + APPOINTMENT_WRAPPER_HIDDEN_CLASS));
                 removeClass(wraps, APPOINTMENT_WRAPPER_HIDDEN_CLASS);
             }
@@ -6992,7 +7069,7 @@ var VerticalEvent = /** @__PURE__ @class */ (function (_super) {
             this.resources = this.parent.resourceBase.renderedResources;
         }
         this.cellHeight =
-            parseFloat(getElementHeight(this.parent.element.querySelector('.e-content-wrap tbody tr')).toFixed(2));
+            parseFloat(this.parent.getElementHeight(this.parent.element.querySelector('.e-content-wrap tbody tr')).toFixed(2));
         this.dateRender[0] = this.parent.activeView.renderDates;
         if (this.parent.activeViewOptions.group.resources.length > 0) {
             for (var i = 0, len = this.resources.length; i < len; i++) {
@@ -7033,7 +7110,7 @@ var VerticalEvent = /** @__PURE__ @class */ (function (_super) {
             var renderDates = this.dateRender[parseInt(resource.toString(), 10)];
             for (var day = 0, length_1 = renderDates.length; day < length_1; day++) {
                 var startDate = new Date(renderDates[parseInt(day.toString(), 10)].getTime());
-                var endDate = addDays(renderDates[parseInt(day.toString(), 10)], 1);
+                var endDate = resetTime(addDays(renderDates[parseInt(day.toString(), 10)], 1));
                 var filterEvents = this.filterEvents(startDate, endDate, this.parent.blockProcessed, this.resources[parseInt(resource.toString(), 10)]);
                 for (var _a = 0, filterEvents_1 = filterEvents; _a < filterEvents_1.length; _a++) {
                     var event_1 = filterEvents_1[_a];
@@ -7064,7 +7141,7 @@ var VerticalEvent = /** @__PURE__ @class */ (function (_super) {
             }
             else {
                 blockHeight = formatUnit(this.getHeight(eStart, eEnd));
-                blockTop = formatUnit(this.getTopValue(eStart, dayIndex, resource));
+                blockTop = formatUnit(this.getTopValue(eStart));
             }
             var appointmentElement = this.createBlockAppointmentElement(eventObj, resource, this.isResourceEventTemplate);
             setStyleAttribute(appointmentElement, { 'width': '100%', 'height': blockHeight, 'top': blockTop });
@@ -7078,7 +7155,7 @@ var VerticalEvent = /** @__PURE__ @class */ (function (_super) {
         var resources = this.getResourceList();
         var dateCount = this.getStartCount();
         var isRender;
-        var appHeight = eventType === 'allDayEvents' ? getElementHeightFromClass(this.element.querySelector('.' + ALLDAY_APPOINTMENT_WRAPPER_CLASS), APPOINTMENT_CLASS) : 0;
+        var appHeight = eventType === 'allDayEvents' ? this.parent.getElementHeightFromClass(this.element.querySelector('.' + ALLDAY_APPOINTMENT_WRAPPER_CLASS), APPOINTMENT_CLASS) : 0;
         var allDayRowTop = eventType === 'allDayEvents' && this.allDayElement.length > 0 ? this.allDayElement[0].offsetTop : 0;
         var _loop_1 = function (resource) {
             isRender = true;
@@ -7097,7 +7174,7 @@ var VerticalEvent = /** @__PURE__ @class */ (function (_super) {
                 renderDates[parseInt(day.toString(), 10)] <= renderedDate[renderedDate.length - 1]; day++) {
                 this_1.renderedEvents = [];
                 var startDate = new Date(renderDates[parseInt(day.toString(), 10)].getTime());
-                var endDate = addDays(renderDates[parseInt(day.toString(), 10)], 1);
+                var endDate = resetTime(addDays(renderDates[parseInt(day.toString(), 10)], 1));
                 var filterEvents = this_1.filterEvents(startDate, endDate, eventCollection, this_1.resources[parseInt(resource.toString(), 10)]);
                 if (isRender) {
                     for (var _i = 0, filterEvents_2 = filterEvents; _i < filterEvents_2.length; _i++) {
@@ -7319,7 +7396,10 @@ var VerticalEvent = /** @__PURE__ @class */ (function (_super) {
         var field = this.parent.eventFields;
         var schedule = getStartEndHours(currentDate, this.startHour, this.endHour);
         var event = extend({}, record, null, true);
-        event.isSpanned = { isBottom: false, isTop: false };
+        event.isSpanned = {
+            isBottom: false, isTop: false,
+            isSameDuration: event[field.startTime].getTime() === event[field.endTime].getTime()
+        };
         if (record[field.startTime].getTime() < schedule.startHour.getTime()) {
             event[field.startTime] = schedule.startHour;
             event.isSpanned.isTop = true;
@@ -7437,9 +7517,9 @@ var VerticalEvent = /** @__PURE__ @class */ (function (_super) {
             return;
         }
         if (eStart <= eEnd && isValidEvent && this.isWorkDayAvailable(resource, eStart)) {
-            var appHeight = this.getHeight(eStart, eEnd);
+            var appHeight = record.isSpanned.isSameDuration ? this.cellHeight : this.getHeight(eStart, eEnd);
             if (eStart.getTime() >= schedule.startHour.getTime()) {
-                topValue = this.getTopValue(eStart, dayIndex, resource);
+                topValue = this.getTopValue(eStart);
             }
             var appIndex = this.getOverlapIndex(record, dayIndex, false, resource);
             record.Index = appIndex;
@@ -7500,13 +7580,20 @@ var VerticalEvent = /** @__PURE__ @class */ (function (_super) {
         var tempLeft = (parseFloat(appWidth) + 1) * index;
         return (tempLeft > 99 ? 99 : tempLeft) + '%';
     };
-    VerticalEvent.prototype.getTopValue = function (date, day, resource) {
-        var viewDate = resetTime(this.dateRender[parseInt(resource.toString(), 10)][parseInt(day.toString(), 10)]);
-        var startEndHours = getStartEndHours(viewDate, this.startHour, this.endHour);
-        var startHour = startEndHours.startHour;
-        var adjustedStartHour = isDaylightSavingTime(viewDate) && (startHour.getHours() !== this.startHour.getHours()) ?
-            this.startHour.getHours() : startHour.getHours();
-        var diffInMinutes = ((date.getHours() - adjustedStartHour) * 60) + (date.getMinutes() - startHour.getMinutes());
+    VerticalEvent.prototype.getStartEndHours = function (startEndTime) {
+        if (!isNullOrUndefined(startEndTime) && startEndTime !== '') {
+            var startEndDate = new Date(2000, 0, 0, 0);
+            var timeString = startEndTime.split(':');
+            if (timeString.length === 2) {
+                startEndDate.setHours(parseInt(timeString[0], 10), parseInt(timeString[1], 10), 0);
+            }
+            return startEndDate;
+        }
+        return null;
+    };
+    VerticalEvent.prototype.getTopValue = function (date) {
+        var startHour = this.getStartEndHours(this.parent.activeViewOptions.startHour);
+        var diffInMinutes = ((date.getHours() - startHour.getHours()) * 60) + (date.getMinutes() - startHour.getMinutes());
         return (this.parent.activeViewOptions.timeScale.enable) ? ((diffInMinutes * this.cellHeight * this.slotCount) / this.interval) : 0;
     };
     VerticalEvent.prototype.getOverlapIndex = function (record, day, isAllDay, resource) {
@@ -7542,10 +7629,32 @@ var VerticalEvent = /** @__PURE__ @class */ (function (_super) {
             if (this.parent.activeViewOptions.group.resources.length > 0) {
                 this.overlapList = this.filterEventsByResource(this.resources[parseInt(resource.toString(), 10)], this.overlapList);
             }
+            var queue_1 = [];
             this.overlapList.forEach(function (obj) {
-                var filterList = appointmentList_1.filter(function (data) {
-                    return data[fieldMapping.endTime] > obj[fieldMapping.startTime] && data[fieldMapping.startTime] <= obj[fieldMapping.endTime];
-                });
+                queue_1.push(obj);
+                var filterList = [];
+                var processedIds = new Set();
+                var _loop_2 = function () {
+                    var currentObj = queue_1.shift();
+                    var overlaps = appointmentList_1.filter(function (data) {
+                        return data[fieldMapping.endTime] > currentObj[fieldMapping.startTime] &&
+                            data[fieldMapping.startTime] <= currentObj[fieldMapping.endTime] &&
+                            !processedIds.has(data[fieldMapping.id]);
+                    });
+                    overlaps.forEach(function (overlap) {
+                        filterList.push(overlap);
+                        processedIds.add(overlap[fieldMapping.id]);
+                        queue_1.push(overlap);
+                    });
+                    if (processedIds.size < appointmentList_1.length - 1) {
+                        return "break";
+                    }
+                };
+                while (queue_1.length > 0) {
+                    var state_1 = _loop_2();
+                    if (state_1 === "break")
+                        break;
+                }
                 if (_this.parent.activeViewOptions.group.resources.length > 0) {
                     filterList = _this.filterEventsByResource(_this.resources[parseInt(resource.toString(), 10)], filterList);
                 }
@@ -7742,24 +7851,24 @@ var VerticalEvent = /** @__PURE__ @class */ (function (_super) {
     return VerticalEvent;
 }(EventBase));
 
-var __extends$1 = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __extends$1 = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var EVENT_GAP = 0;
 /**
  * Month view events render
  */
-var MonthEvent = /** @__PURE__ @class */ (function (_super) {
+var MonthEvent = /** @class */ (function (_super) {
     __extends$1(MonthEvent, _super);
     function MonthEvent(parent) {
         var _this = _super.call(this, parent) || this;
@@ -7833,7 +7942,7 @@ var MonthEvent = /** @__PURE__ @class */ (function (_super) {
             this.monthHeaderHeight = wrapper.offsetTop - cellTd.offsetTop;
             cellTd.removeChild(wrapper);
         }
-        this.eventHeight = getElementHeightFromClass(this.element, APPOINTMENT_CLASS);
+        this.eventHeight = this.parent.getElementHeightFromClass(this.element, APPOINTMENT_CLASS);
         var selector = '.' + CONTENT_TABLE_CLASS + ' tbody tr';
         this.addCellHeight(selector, this.eventHeight, (this.parent.currentView === 'Month' ? EVENT_GAP : 2), this.monthHeaderHeight, this.moreIndicatorHeight);
         var scrollTop = conWrap.scrollTop;
@@ -7912,8 +8021,8 @@ var MonthEvent = /** @__PURE__ @class */ (function (_super) {
             });
         }
         var cellDetail = this.workCells[this.parent.activeView.isTimelineView() ? 0 : this.workCells.length - 1];
-        this.cellWidth = getElementWidth(cellDetail);
-        this.cellHeight = getElementHeight(cellDetail);
+        this.cellWidth = this.parent.getElementWidth(cellDetail);
+        this.cellHeight = this.parent.getElementHeight(cellDetail);
         this.dateRender = dateRender;
         var filteredDates = this.getRenderedDates(dateRender);
         this.getSlotDates(workDays || this.parent.activeViewOptions.workDays);
@@ -8084,7 +8193,10 @@ var MonthEvent = /** @__PURE__ @class */ (function (_super) {
         if (this.parent.crudModule && this.parent.crudModule.crudObj.isCrudAction) {
             for (var i = 0, len = this.parent.crudModule.crudObj.sourceEvent.length; i < len; i++) {
                 var sourceRes = this.parent.crudModule.crudObj.sourceEvent[parseInt(i.toString(), 10)];
-                this.renderEventsHandler(sourceRes.renderDates, sourceRes.workDays, sourceRes);
+                if (!this.parent.uiStateValues.isGroupAdaptive ||
+                    (this.parent.uiStateValues.groupIndex === sourceRes.groupIndex && this.parent.uiStateValues.isGroupAdaptive)) {
+                    this.renderEventsHandler(sourceRes.renderDates, sourceRes.workDays, sourceRes);
+                }
                 if (this.parent.crudModule.crudObj.sourceEvent[parseInt(i.toString(), 10)].groupIndex !==
                     this.parent.crudModule.crudObj.targetEvent[parseInt(i.toString(), 10)].groupIndex) {
                     var target = this.parent.crudModule.crudObj.targetEvent[parseInt(i.toString(), 10)];
@@ -8450,26 +8562,26 @@ var MonthEvent = /** @__PURE__ @class */ (function (_super) {
     return MonthEvent;
 }(EventBase));
 
-var __extends$2 = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __extends$2 = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var EVENT_GAP$1 = 2;
 var BLOCK_INDICATOR_WIDTH = 22;
 var BLOCK_INDICATOR_HEIGHT = 18;
 /**
  * Timeline view events render
  */
-var TimelineEvent = /** @__PURE__ @class */ (function (_super) {
+var TimelineEvent = /** @class */ (function (_super) {
     __extends$2(TimelineEvent, _super);
     function TimelineEvent(parent, type) {
         var _this = _super.call(this, parent) || this;
@@ -8494,7 +8606,7 @@ var TimelineEvent = /** @__PURE__ @class */ (function (_super) {
             this.parent.activeViewOptions.headerRows.slice(-1)[0].option !== 'Hour') {
             this.renderType = 'day';
             var workCell = this.content.querySelector('.' + WORK_CELLS_CLASS);
-            this.cellWidth = getElementWidth(workCell) / +(workCell.getAttribute('colspan') || 1);
+            this.cellWidth = this.parent.getElementWidth(workCell) / +(workCell.getAttribute('colspan') || 1);
             this.slotsPerDay = 1;
         }
         else {
@@ -8579,7 +8691,10 @@ var TimelineEvent = /** @__PURE__ @class */ (function (_super) {
             for (var i = 0, len = this.parent.crudModule.crudObj.sourceEvent.length; i < len; i++) {
                 var source = this.parent.crudModule.crudObj.sourceEvent[parseInt(i.toString(), 10)];
                 this.rowIndex = source.groupIndex;
-                this.renderEventsHandler(this.parent.activeView.renderDates, this.parent.activeViewOptions.workDays, source);
+                if (!this.parent.uiStateValues.isGroupAdaptive ||
+                    (this.parent.uiStateValues.groupIndex === source.groupIndex && this.parent.uiStateValues.isGroupAdaptive)) {
+                    this.renderEventsHandler(this.parent.activeView.renderDates, this.parent.activeViewOptions.workDays, source);
+                }
                 if (this.parent.crudModule.crudObj.targetEvent[parseInt(i.toString(), 10)] && this.parent.crudModule.crudObj.sourceEvent[parseInt(i.toString(), 10)].groupIndex !==
                     this.parent.crudModule.crudObj.targetEvent[parseInt(i.toString(), 10)].groupIndex) {
                     var target = this.parent.crudModule.crudObj.targetEvent[parseInt(i.toString(), 10)];
@@ -8664,14 +8779,14 @@ var TimelineEvent = /** @__PURE__ @class */ (function (_super) {
                 this.wireAppointmentEvents(appointmentElement, event);
                 if (this.parent.rowAutoHeight) {
                     var conWrap = this.parent.element.querySelector('.' + CONTENT_WRAP_CLASS);
-                    var conWidth = getElementWidth(conWrap);
+                    var conWidth = this.parent.getElementWidth(conWrap);
                     var isWithoutScroll = conWrap.offsetHeight === conWrap.clientHeight &&
                         conWrap.offsetWidth === conWrap.clientWidth;
                     this.renderEventElement(event, appointmentElement, cellTd);
                     var firstChild = this.getFirstChild(resIndex);
                     this.updateCellHeight(firstChild, height);
                     if (isWithoutScroll &&
-                        (conWrap.offsetWidth > conWrap.clientWidth || conWidth !== getElementWidth(conWrap))) {
+                        (conWrap.offsetWidth > conWrap.clientWidth || conWidth !== this.parent.getElementWidth(conWrap))) {
                         this.adjustAppointments(conWidth);
                     }
                 }
@@ -8790,7 +8905,7 @@ var TimelineEvent = /** @__PURE__ @class */ (function (_super) {
     TimelineEvent.prototype.adjustAppointments = function (conWidth) {
         var _this = this;
         var tr = this.parent.element.querySelector('.' + CONTENT_TABLE_CLASS + ' tbody tr');
-        var actualCellWidth = getElementWidth(this.workCells[0]);
+        var actualCellWidth = this.parent.getElementWidth(this.workCells[0]);
         this.cellWidth = actualCellWidth / +(this.workCells[0].getAttribute('colspan') || 1);
         var currentPercentage = (actualCellWidth * tr.children.length) / (conWidth / 100);
         var apps = [].slice.call(this.parent.element.querySelectorAll('.' + APPOINTMENT_CLASS));
@@ -9055,7 +9170,7 @@ var TimelineEvent = /** @__PURE__ @class */ (function (_super) {
 /**
  * Inline Edit interactions
  */
-var InlineEdit = /** @__PURE__ @class */ (function () {
+var InlineEdit = /** @class */ (function () {
     function InlineEdit(parent) {
         this.parent = parent;
         this.parent.on(inlineClick, this.inlineEdit, this);
@@ -9136,7 +9251,15 @@ var InlineEdit = /** @__PURE__ @class */ (function () {
                 subjectWrap.insertBefore(inlineSubject, subjectWrap.firstChild);
             }
             else {
-                args.element.querySelector('.e-appointment-details').prepend(inlineSubject);
+                var elementSelector = ['TimelineDay', 'TimelineWeek', 'TimelineWorkWeek', 'TimelineMonth'].indexOf(this.parent.currentView) > -1 ?
+                    '.e-inner-wrap' : '.e-appointment-details';
+                var innerWrapElement = args.element.querySelector(elementSelector);
+                if (isNullOrUndefined(innerWrapElement)) {
+                    args.element.querySelector('.e-appointment-details').prepend(inlineSubject);
+                }
+                else {
+                    innerWrapElement.prepend(inlineSubject);
+                }
             }
             inlineSubject.focus();
         }
@@ -9154,11 +9277,11 @@ var InlineEdit = /** @__PURE__ @class */ (function () {
             var allDayElements = [].slice.call(this.parent.element.querySelectorAll('.' + ALLDAY_APPOINTMENT_CLASS));
             var allDayLevel = 0;
             if (allDayElements.length > 0) {
-                allDayLevel = Math.floor(getElementHeight(this.parent.element.querySelector('.' + ALLDAY_ROW_CLASS)) /
+                allDayLevel = Math.floor(this.parent.getElementHeight(this.parent.element.querySelector('.' + ALLDAY_ROW_CLASS)) /
                     allDayElements[0].offsetHeight) - 1;
             }
             verticalEvent.allDayLevel = allDayLevel;
-            var appHeight = getElementHeightFromClass(this.parent.element.querySelector('.' + ALLDAY_APPOINTMENT_WRAPPER_CLASS), APPOINTMENT_CLASS);
+            var appHeight = this.parent.getElementHeightFromClass(this.parent.element.querySelector('.' + ALLDAY_APPOINTMENT_WRAPPER_CLASS), APPOINTMENT_CLASS);
             var cellTop = verticalEvent.allDayElement.length > 0 ? verticalEvent.allDayElement[0].offsetTop : 0;
             verticalEvent.renderAllDayEvents(saveObj, index, resIndex, daysCount, this.parent.allowInline, cellTop, appHeight);
         }
@@ -9186,7 +9309,7 @@ var InlineEdit = /** @__PURE__ @class */ (function () {
         monthEvent.cellWidth = monthEvent.workCells[0].offsetWidth;
         monthEvent.cellHeight = monthEvent.workCells[0].offsetHeight;
         monthEvent.eventHeight =
-            getElementHeightFromClass(this.parent.monthModule.element || monthEvent.element, APPOINTMENT_CLASS);
+            this.parent.getElementHeightFromClass(this.parent.monthModule.element || monthEvent.element, APPOINTMENT_CLASS);
         monthEvent.getSlotDates(workDays);
         var filteredDates = monthEvent.getRenderedDates(renderDates);
         var spannedEvents = monthEvent.splitEvent(saveObject, filteredDates || renderDates);
@@ -9210,7 +9333,7 @@ var InlineEdit = /** @__PURE__ @class */ (function () {
         var dayLength = this.parent.element.querySelectorAll('.' + CONTENT_TABLE_CLASS + ' tbody tr').length === 0 ?
             0 : this.parent.element.querySelectorAll('.' + CONTENT_TABLE_CLASS + ' tbody tr')[0].children.length;
         timelineView.slotsPerDay = dayLength / timelineView.dateRender.length;
-        timelineView.eventHeight = getElementHeightFromClass(timelineView.element, APPOINTMENT_CLASS);
+        timelineView.eventHeight = this.parent.getElementHeightFromClass(timelineView.element, APPOINTMENT_CLASS);
         timelineView.renderEvents(saveObject, resIndex);
     };
     InlineEdit.prototype.getEventDaysCount = function (saveObj) {
@@ -9299,7 +9422,7 @@ var InlineEdit = /** @__PURE__ @class */ (function () {
 /**
  * Appointment window field validation
  */
-var FieldValidator = /** @__PURE__ @class */ (function () {
+var FieldValidator = /** @class */ (function () {
     function FieldValidator() {
     }
     FieldValidator.prototype.renderFormValidator = function (form, rules, element, locale) {
@@ -9403,7 +9526,7 @@ var EVENT_FIELD = 'e-field';
 /**
  * Quick Popups interactions
  */
-var QuickPopups = /** @__PURE__ @class */ (function () {
+var QuickPopups = /** @class */ (function () {
     function QuickPopups(parent) {
         this.isMultipleEventSelect = false;
         this.isCrudAction = false;
@@ -10819,7 +10942,7 @@ var QuickPopups = /** @__PURE__ @class */ (function () {
 /**
  * Tooltip for Schedule
  */
-var EventTooltip = /** @__PURE__ @class */ (function () {
+var EventTooltip = /** @class */ (function () {
     function EventTooltip(parent) {
         this.parent = parent;
         this.tooltipObj = new Tooltip({
@@ -10892,7 +11015,8 @@ var EventTooltip = /** @__PURE__ @class */ (function () {
             var fields = this.parent.eventFields;
             var eventStart = new Date('' + record[fields.startTime]);
             var eventEnd = new Date('' + record[fields.endTime]);
-            eventEnd = (eventEnd.getHours() === 0 && eventEnd.getMinutes() === 0) ? new Date(eventEnd.setMilliseconds(-1000)) : eventEnd;
+            eventEnd = ((eventEnd.getTime() - eventStart.getTime() !== 0) && eventEnd.getHours() === 0 && eventEnd.getMinutes() === 0) ?
+                new Date(eventEnd.setMilliseconds(-1000)) : eventEnd;
             var startDate = resetTime(new Date('' + eventStart));
             var endDate = resetTime(new Date('' + eventEnd));
             var tooltipSubject = (record[fields.subject] || this.parent.eventSettings.fields.subject.default
@@ -10962,25 +11086,25 @@ var EventTooltip = /** @__PURE__ @class */ (function () {
     return EventTooltip;
 }());
 
-var __extends$3 = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends$3 = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 var HEADER = 'e-editor';
 var INPUTWARAPPER = 'e-input-wrapper';
 var INPUTWARAPPERSIDE = 'e-input-wrapper-side';
@@ -11105,7 +11229,7 @@ var endOnDateClassList = [ENDONCOUNTWRAPPER];
  * </script>
  * ```
  */
-var RecurrenceEditor = /** @__PURE__ @class */ (function (_super) {
+var RecurrenceEditor = /** @class */ (function (_super) {
     __extends$3(RecurrenceEditor, _super);
     /**
      * Constructor for creating the widget
@@ -12122,7 +12246,7 @@ var HIDE_STYLE_CLASS = 'e-hide';
 /**
  * Event editor window
  */
-var EventWindow = /** @__PURE__ @class */ (function () {
+var EventWindow = /** @class */ (function () {
     function EventWindow(parent) {
         this.parent = parent;
         this.l10n = this.parent.localeObj;
@@ -12260,8 +12384,13 @@ var EventWindow = /** @__PURE__ @class */ (function () {
             this.addEventHandlers();
         }
         if (!isNullOrUndefined(this.parent.editorTemplate)) {
-            this.renderFormElements(this.element.querySelector('.e-schedule-form'), data);
+            this.renderFormElements(this.element.querySelector('.e-schedule-form'), data, type, repeatType);
+        }
+        else {
+            this.setEditorContent(data, type, repeatType);
         }
+    };
+    EventWindow.prototype.setEditorContent = function (data, type, repeatType) {
         if (!this.parent.isAdaptive && isNullOrUndefined(this.parent.editorTemplate)) {
             removeClass([this.dialogObject.element.querySelector('.e-recurrenceeditor')], DISABLE_CLASS);
         }
@@ -12442,7 +12571,7 @@ var EventWindow = /** @__PURE__ @class */ (function () {
         container.appendChild(form);
         return container;
     };
-    EventWindow.prototype.renderFormElements = function (form, args) {
+    EventWindow.prototype.renderFormElements = function (form, args, type, repeatType) {
         var _this = this;
         if (!isNullOrUndefined(this.parent.editorTemplate)) {
             if (args) {
@@ -12455,12 +12584,15 @@ var EventWindow = /** @__PURE__ @class */ (function () {
                     this.recurrenceEditor = null;
                 }
                 this.destroyComponents();
-                var formElements = [].slice.call(form.children);
-                for (var _i = 0, formElements_1 = formElements; _i < formElements_1.length; _i++) {
-                    var element = formElements_1[_i];
-                    remove(element);
-                }
                 this.parent.resetTemplates(['editorTemplate']);
+                EventHandler.clearEvents(form);
+                if (!this.parent.isReact) {
+                    var formElements = [].slice.call(form.children);
+                    for (var _i = 0, formElements_1 = formElements; _i < formElements_1.length; _i++) {
+                        var element = formElements_1[_i];
+                        remove(element);
+                    }
+                }
             }
             var templateId = this.parent.element.id + '_editorTemplate';
             var tempEle = [].slice.call(this.parent.getEditorTemplate()(args || {}, this.parent, 'editorTemplate', templateId, false));
@@ -12468,15 +12600,17 @@ var EventWindow = /** @__PURE__ @class */ (function () {
             this.parent.renderTemplates(function () {
                 if (_this.element) {
                     _this.applyFormValidation();
-                    if (_this.eventCrudData) {
-                        _this.showDetails(_this.eventCrudData);
-                        _this.eventCrudData = null;
+                    if (args) {
+                        _this.setEditorContent(args, type, repeatType);
                     }
                 }
             });
         }
         else {
             form.appendChild(this.getDefaultEventWindowContent());
+            if (args) {
+                this.setEditorContent(args, type, repeatType);
+            }
         }
     };
     EventWindow.prototype.getDefaultEventWindowContent = function () {
@@ -13067,17 +13201,17 @@ var EventWindow = /** @__PURE__ @class */ (function () {
         if (!isNullOrUndefined(descriptionRule)) {
             rules[this.parent.eventSettings.fields.description.name] = descriptionRule;
         }
+        if (this.fieldValidator) {
+            this.fieldValidator.destroy();
+            this.fieldValidator = null;
+        }
         this.fieldValidator = new FieldValidator();
         this.fieldValidator.renderFormValidator(form, rules, this.element, this.parent.locale);
     };
     EventWindow.prototype.showDetails = function (eventData) {
-        this.eventData = this.eventCrudData ? this.eventData : eventData;
+        this.eventData = eventData;
         var eventObj = extend({}, eventData, null, true);
         var formElements = this.getFormElements(EVENT_WINDOW_DIALOG_CLASS);
-        if (this.parent.isReact && formElements.length < 1 && !this.cellClickAction) {
-            this.eventCrudData = eventObj;
-            return;
-        }
         if ((!this.cellClickAction || this.cellClickAction && !isNullOrUndefined(this.parent.editorTemplate)) &&
             eventObj[this.fields.endTime].getHours() === 0 && eventObj[this.fields.endTime].getMinutes() === 0) {
             this.trimAllDay(eventObj);
@@ -14096,7 +14230,7 @@ var EventWindow = /** @__PURE__ @class */ (function () {
 /**
  * Virtual Scroll
  */
-var VirtualScroll = /** @__PURE__ @class */ (function () {
+var VirtualScroll = /** @class */ (function () {
     function VirtualScroll(parent) {
         this.translateY = 0;
         this.itemSize = 60;
@@ -14104,6 +14238,8 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
         this.renderedLength = 0;
         this.averageRowHeight = 0;
         this.startIndex = 0;
+        this.existingDataCollection = [];
+        this.enableTransition = true;
         this.parent = parent;
         this.addEventListener();
     }
@@ -14176,10 +14312,10 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
     };
     VirtualScroll.prototype.setItemSize = function () {
         if (this.isHorizontalScroll) {
-            this.itemSize = getElementWidthFromClass(this.parent.activeView.element, WORK_CELLS_CLASS) || this.itemSize;
+            this.itemSize = getElementWidthFromClass(this.parent.activeView.element, WORK_CELLS_CLASS, this.parent.uiStateValues.isTransformed) || this.itemSize;
         }
         else {
-            this.itemSize = getElementHeightFromClass(this.parent.activeView.element, WORK_CELLS_CLASS) || this.itemSize;
+            this.itemSize = this.parent.getElementHeightFromClass(this.parent.activeView.element, WORK_CELLS_CLASS) || this.itemSize;
         }
     };
     VirtualScroll.prototype.refreshLayout = function () {
@@ -14193,11 +14329,16 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
             var resWrap = this.parent.element.querySelector('.' + RESOURCE_COLUMN_WRAP_CLASS);
             var conWrap = this.parent.element.querySelector('.' + CONTENT_WRAP_CLASS);
             var eventWrap = this.parent.element.querySelector('.' + EVENT_TABLE_CLASS);
+            if (!this.parent.rowAutoHeight) {
+                this.enableTransition = false;
+                removeClass([conWrap, resWrap], 'e-transition');
+            }
             var firstTDIndex = parseInt(resWrap.querySelector('tbody td').getAttribute('data-group-index'), 10);
             var endIndex = (firstTDIndex + this.renderedLength);
             firstTDIndex = (endIndex > this.parent.resourceBase.expandedResources.length) ?
                 (this.parent.resourceBase.expandedResources.length - this.renderedLength) : firstTDIndex;
             firstTDIndex = firstTDIndex < 0 ? 0 : firstTDIndex;
+            this.existingDataCollection = this.parent.resourceBase.renderedResources;
             this.parent.resourceBase.renderedResources = this.parent.resourceBase.expandedResources.slice(firstTDIndex, endIndex);
             if (this.parent.resourceBase.renderedResources.length > 0) {
                 this.updateContent(resWrap, conWrap, eventWrap, this.parent.resourceBase.renderedResources);
@@ -14247,6 +14388,7 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
             var scrollHeight = this.parent.rowAutoHeight ?
                 (conTable.offsetHeight - conWrap.offsetHeight) : this.bufferCount * this.itemSize;
             var resCollection = [];
+            this.existingDataCollection = this.parent.resourceBase.renderedResources;
             if ((conWrap.scrollTop) - this.translateY < 0) {
                 resCollection = this.upScroll(conWrap, firstTDIndex);
             }
@@ -14450,56 +14592,133 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
             this.parent.element.focus();
         }
         for (var i = 0; i < renderedLength; i++) {
-            remove(resWrap.querySelector('tbody tr'));
-            remove(conWrap.querySelector('tbody tr'));
             remove(eventWrap.querySelector('div'));
         }
         this.parent.resourceBase.renderedResources = resCollection;
+        var currentGroupIndices = this.parent.activeView.getGroupIndices(resCollection);
+        var previousGroupIndices = this.parent.activeView.getGroupIndices(this.existingDataCollection);
+        var newGroupIndices = currentGroupIndices.filter(function (index) { return previousGroupIndices.indexOf(index) < 0; });
+        var resWrapRows = Array.from(resWrap.querySelectorAll('tbody tr'));
+        var conWrapRows = Array.from(conWrap.querySelectorAll('tbody tr'));
+        var resWrapBody = resWrap.querySelector('tbody');
+        var conWrapBody = conWrap.querySelector('tbody');
+        this.removeObsoleteRows(resWrapRows, currentGroupIndices);
+        this.removeObsoleteRows(conWrapRows, currentGroupIndices);
         var resourceRows = this.parent.resourceBase.getContentRows(resCollection, true);
         var contentRows = this.parent.activeView.getContentRows();
         var eventRows = this.parent.activeView.getEventRows(resCollection.length);
-        append(resourceRows, resWrap.querySelector('tbody'));
-        append(contentRows, conWrap.querySelector('tbody'));
+        for (var i = 0; i < newGroupIndices.length; i++) {
+            var index = currentGroupIndices.indexOf(newGroupIndices[parseInt(i.toString(), 10)]);
+            if (index === 0) {
+                prepend([resourceRows[parseInt(i.toString(), 10)]], resWrapBody);
+                prepend([contentRows[parseInt(i.toString(), 10)]], conWrapBody);
+            }
+            else if (resWrapBody && conWrapBody && resWrapBody.children[parseInt(index.toString(), 10)] &&
+                conWrapBody.children[parseInt(index.toString(), 10)]) {
+                resWrapBody.insertBefore(resourceRows[parseInt(i.toString(), 10)], resWrapBody.children[parseInt(index.toString(), 10)]);
+                conWrapBody.insertBefore(contentRows[parseInt(i.toString(), 10)], conWrapBody.children[parseInt(index.toString(), 10)]);
+            }
+            else {
+                append([resourceRows[parseInt(i.toString(), 10)]], resWrapBody);
+                append([contentRows[parseInt(i.toString(), 10)]], conWrapBody);
+            }
+        }
         append(eventRows, eventWrap);
     };
+    VirtualScroll.prototype.removeObsoleteRows = function (elements, currentGroupIndices) {
+        elements.forEach(function (element) {
+            var groupIndex = parseInt(element.firstElementChild.getAttribute('data-group-index'), 10);
+            if (currentGroupIndices.indexOf(groupIndex) < 0) {
+                remove(element);
+            }
+        });
+    };
     VirtualScroll.prototype.updateHorizontalContent = function (conWrap, resCollection) {
+        this.existingDataCollection = this.parent.resourceBase.expandedResources;
         this.parent.resourceBase.expandedResources = resCollection;
         var selectedEle = this.parent.getSelectedCells();
         this.focusedEle = selectedEle[selectedEle.length - 1] || this.focusedEle;
-        var renderedLength = conWrap.querySelectorAll('tbody tr').length;
+        var tbody = conWrap.querySelector('tbody');
+        var renderedRows = Array.from(tbody.querySelectorAll('tr'));
+        if (this.parent.currentView === 'Month') {
+            this.updateMonthViewContent(conWrap, resCollection);
+        }
+        else {
+            this.updateOtherViewContent(conWrap, resCollection, renderedRows);
+        }
+    };
+    VirtualScroll.prototype.updateMonthViewContent = function (conWrap, resCollection) {
+        var renderedLength = conWrap.querySelectorAll(' tr').length;
         for (var i = 0; i < renderedLength; i++) {
             remove(conWrap.querySelector('tbody tr'));
         }
-        if (this.parent.currentView === 'Month') {
-            if (this.parent.activeViewOptions.group.byDate) {
-                this.parent.activeView.colLevels[0] = resCollection;
-            }
-            else {
-                this.parent.activeView.colLevels[this.parent.activeView.colLevels.length - 2] = resCollection;
-            }
-            var contentRows = this.parent.activeView.getContentRows();
-            append(contentRows, conWrap.querySelector('tbody'));
+        if (this.parent.activeViewOptions.group.byDate) {
+            this.parent.activeView.colLevels[0] = resCollection;
         }
         else {
-            var col = [].slice.call(conWrap.querySelector('colgroup').children);
-            for (var i = 0; i < col.length; i++) {
-                remove(col[parseInt(i.toString(), 10)]);
-            }
-            this.parent.activeView.colLevels[this.parent.activeView.colLevels.length - 1] = resCollection;
-            var contentRows = this.parent.activeView.getContentRows();
-            var table = conWrap.querySelector('table');
-            var thead = conWrap.querySelector('thead');
-            var colGroupEle_1 = conWrap.querySelector('colgroup');
-            resCollection.forEach(function () {
-                colGroupEle_1.appendChild(createElement('col'));
+            this.parent.activeView.colLevels[this.parent.activeView.colLevels.length - 2] = resCollection;
+        }
+        var contentRows = this.parent.activeView.getContentRows();
+        append(contentRows, conWrap.querySelector('tbody'));
+    };
+    VirtualScroll.prototype.updateOtherViewContent = function (conWrap, resCollection, renderedRows) {
+        var tbody = conWrap.querySelector('tbody');
+        var colGroup = conWrap.querySelector('colgroup');
+        var thead = conWrap.querySelector('thead');
+        var table = conWrap.querySelector('table');
+        this.parent.activeView.colLevels[this.parent.activeView.colLevels.length - 1] = resCollection;
+        var newGroupIndices = new Set(resCollection.map(function (data) { return data.groupIndex; }));
+        renderedRows.forEach(function (row) {
+            var tdElements = row.querySelectorAll('td');
+            tdElements.forEach(function (td) {
+                var groupIndex = parseInt(td.getAttribute('data-group-index'), 10);
+                if (!newGroupIndices.has(groupIndex)) {
+                    td.remove();
+                }
             });
-            thead.appendChild(this.parent.eventBase.createEventWrapper('', this.startIndex > 0 ? this.startIndex : 0));
-            if (this.parent.activeViewOptions.timeScale.enable) {
-                thead.appendChild(this.parent.eventBase.createEventWrapper('timeIndicator'));
-            }
-            prepend([thead], table);
-            append(contentRows, conWrap.querySelector('tbody'));
+        });
+        var col = [].slice.call(conWrap.querySelector('colgroup').children);
+        for (var i = 0; i < col.length; i++) {
+            remove(col[parseInt(i.toString(), 10)]);
+        }
+        resCollection.forEach(function () { return colGroup.appendChild(createElement('col')); });
+        var tHead = [].slice.call(conWrap.querySelector('thead').children);
+        for (var i = 0; i < tHead.length; i++) {
+            remove(tHead[parseInt(i.toString(), 10)]);
+        }
+        thead.appendChild(this.parent.eventBase.createEventWrapper('', this.startIndex > 0 ? this.startIndex : 0));
+        if (this.parent.activeViewOptions.timeScale.enable) {
+            thead.appendChild(this.parent.eventBase.createEventWrapper('timeIndicator'));
         }
+        prepend([thead], table);
+        var contentRows = this.parent.activeView.getContentRows();
+        this.mergeNewTdData(tbody, contentRows);
+    };
+    VirtualScroll.prototype.mergeNewTdData = function (tbody, contentRows) {
+        var existingRows = Array.from(tbody.querySelectorAll('tr'));
+        existingRows.forEach(function (existingRow, rowIndex) {
+            if (rowIndex < contentRows.length) {
+                var newRow = contentRows[parseInt(rowIndex.toString(), 10)];
+                var existingTds_1 = Array.from(existingRow.querySelectorAll('td'));
+                var newTds = Array.from(newRow.querySelectorAll('td'));
+                newTds.forEach(function (newTd) {
+                    var newGroupIndex = parseInt(newTd.getAttribute('data-group-index').toString(), 10);
+                    var inserted = false;
+                    for (var _i = 0, existingTds_2 = existingTds_1; _i < existingTds_2.length; _i++) {
+                        var existingTd = existingTds_2[_i];
+                        var existingGroupIndex = parseInt(existingTd.getAttribute('data-group-index').toString(), 10);
+                        if (newGroupIndex < existingGroupIndex) {
+                            existingRow.insertBefore(newTd, existingTd);
+                            inserted = true;
+                            break;
+                        }
+                    }
+                    if (!inserted) {
+                        existingRow.appendChild(newTd);
+                    }
+                });
+            }
+        });
     };
     VirtualScroll.prototype.getBufferCollection = function (startIndex, endIndex) {
         return this.parent.resourceBase.expandedResources.slice(startIndex, endIndex);
@@ -14560,7 +14779,7 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
 /**
  * Schedule DOM rendering
  */
-var Render = /** @__PURE__ @class */ (function () {
+var Render = /** @class */ (function () {
     function Render(parent) {
         this.parent = parent;
     }
@@ -14715,29 +14934,29 @@ var Render = /** @__PURE__ @class */ (function () {
     return Render;
 }());
 
-var __extends$4 = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends$4 = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * A class that represents the configuration of working hours related options of scheduler.
  */
-var WorkHours = /** @__PURE__ @class */ (function (_super) {
+var WorkHours = /** @class */ (function (_super) {
     __extends$4(WorkHours, _super);
     function WorkHours() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -14754,29 +14973,29 @@ var WorkHours = /** @__PURE__ @class */ (function (_super) {
     return WorkHours;
 }(ChildProperty));
 
-var __extends$5 = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __decorate$2 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends$5 = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __decorate$2 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * A class that represents the configuration of options related to timescale on scheduler.
  */
-var TimeScale = /** @__PURE__ @class */ (function (_super) {
+var TimeScale = /** @class */ (function (_super) {
     __extends$5(TimeScale, _super);
     function TimeScale() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -14799,29 +15018,29 @@ var TimeScale = /** @__PURE__ @class */ (function (_super) {
     return TimeScale;
 }(ChildProperty));
 
-var __extends$6 = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends$6 = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * A class that defines the template options available to customize the quick popup of scheduler.
  */
-var QuickInfoTemplates = /** @__PURE__ @class */ (function (_super) {
+var QuickInfoTemplates = /** @class */ (function (_super) {
     __extends$6(QuickInfoTemplates, _super);
     function QuickInfoTemplates() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -14841,29 +15060,29 @@ var QuickInfoTemplates = /** @__PURE__ @class */ (function (_super) {
     return QuickInfoTemplates;
 }(ChildProperty));
 
-var __extends$7 = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __decorate$4 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends$7 = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __decorate$4 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * A class that represents the header rows related configurations on timeline views.
  */
-var HeaderRows = /** @__PURE__ @class */ (function (_super) {
+var HeaderRows = /** @class */ (function (_super) {
     __extends$7(HeaderRows, _super);
     function HeaderRows() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -14881,7 +15100,7 @@ var HeaderRows = /** @__PURE__ @class */ (function (_super) {
 /**
  * Schedule CRUD operations
  */
-var Crud = /** @__PURE__ @class */ (function () {
+var Crud = /** @class */ (function () {
     function Crud(parent) {
         this.parent = parent;
         this.crudObj = { sourceEvent: null, targetEvent: null, isCrudAction: false };
@@ -14986,10 +15205,10 @@ var Crud = /** @__PURE__ @class */ (function () {
             addedRecords: args.editParams.addedRecords, changedRecords: args.editParams.changedRecords,
             deletedRecords: args.editParams.deletedRecords
         };
-        if (this.parent.dragAndDropModule && this.parent.dragAndDropModule.actionObj && this.parent.dragAndDropModule.actionObj.element) {
+        if (this.parent.dragAndDropModule && this.parent.dragAndDropModule.actionObj && this.parent.dragAndDropModule.actionObj.element && this.parent.dragAndDropModule.actionObj.action) {
             this.parent.dragAndDropModule.actionObj.element.style.display = 'none';
         }
-        if (this.parent.resizeModule && this.parent.resizeModule.actionObj && this.parent.resizeModule.actionObj.element) {
+        if (this.parent.resizeModule && this.parent.resizeModule.actionObj && this.parent.resizeModule.actionObj.element && this.parent.resizeModule.actionObj.action) {
             this.parent.resizeModule.actionObj.element.style.display = 'none';
         }
         if (this.parent.isSpecificResourceEvents()) {
@@ -15378,16 +15597,32 @@ var Crud = /** @__PURE__ @class */ (function () {
         var updateSeriesEvents = (eventData instanceof Array) ? eventData : [eventData];
         var args = {
             requestType: action === 'EditSeries' ? 'eventChange' : 'eventRemove', cancel: false,
-            addedRecords: [], changedRecords: updateSeriesEvents, deletedRecords: []
+            addedRecords: [], changedRecords: [], deletedRecords: []
         };
         args.data = seriesData;
+        if (action === 'EditSeries') {
+            args.changedRecords = updateSeriesEvents;
+        }
+        else {
+            args.deletedRecords = updateSeriesEvents;
+        }
+        if (action === 'EditSeries' && !this.parent.uiStateValues.isIgnoreOccurrence) {
+            var seriesEvents = seriesData instanceof Array ? seriesData : [seriesData];
+            for (var a = 0, count = args.changedRecords.length; a < count; a++) {
+                var parentEvent = seriesEvents[parseInt(a.toString(), 10)];
+                var eventCollections = this.parent.eventBase.getEventCollections(parentEvent);
+                var deletedEvents = eventCollections.follow.concat(eventCollections.occurrence);
+                args.deletedRecords = args.deletedRecords.concat(deletedEvents);
+            }
+        }
         this.parent.trigger(actionBegin, args, function (seriesArgs) {
             if (!seriesArgs.cancel) {
                 var fields_2 = _this.parent.eventFields;
                 var editParams = { addedRecords: [], changedRecords: [], deletedRecords: [] };
                 var seriesEvents = seriesData instanceof Array ? seriesData : [seriesData];
+                var records = action === 'EditSeries' ? seriesArgs.changedRecords : seriesArgs.deletedRecords;
                 var _loop_4 = function (a, count) {
-                    var childEvent = seriesArgs.changedRecords[parseInt(a.toString(), 10)];
+                    var childEvent = records[parseInt(a.toString(), 10)];
                     var parentEvent = seriesEvents[parseInt(a.toString(), 10)];
                     var eventCollections = _this.parent.eventBase.getEventCollections(parentEvent);
                     var deletedEvents = eventCollections.follow.concat(eventCollections.occurrence);
@@ -15417,11 +15652,11 @@ var Crud = /** @__PURE__ @class */ (function () {
                             break;
                     }
                 };
-                for (var a = 0, count = seriesArgs.changedRecords.length; a < count; a++) {
+                for (var a = 0, count = records.length; a < count; a++) {
                     _loop_4(a, count);
                 }
                 var promise = _this.parent.dataModule.dataManager.saveChanges(editParams, fields_2.id, _this.getTable(), _this.getQuery());
-                var cloneEvent = extend({}, seriesArgs.changedRecords[seriesArgs.changedRecords.length - 1], null, true);
+                var cloneEvent = extend({}, records[records.length - 1], null, true);
                 _this.parent.eventBase.selectWorkCellByTime(action === 'EditSeries' ? [_this.parent.eventBase.processTimezone(cloneEvent)] : [cloneEvent]);
                 var crudArgs = {
                     requestType: action === 'EditSeries' ? 'eventChanged' : 'eventRemoved',
@@ -15626,7 +15861,7 @@ var Crud = /** @__PURE__ @class */ (function () {
 /**
  * Work cell interactions
  */
-var WorkCellInteraction = /** @__PURE__ @class */ (function () {
+var WorkCellInteraction = /** @class */ (function () {
     function WorkCellInteraction(parent) {
         this.parent = parent;
         EventHandler.add(this.parent.element, 'mouseover', this.onHover, this);
@@ -15762,29 +15997,29 @@ var WorkCellInteraction = /** @__PURE__ @class */ (function () {
     return WorkCellInteraction;
 }());
 
-var __extends$8 = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __decorate$5 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends$8 = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __decorate$5 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * Configuration that applies on each appointment field options of scheduler.
  */
-var FieldOptions = /** @__PURE__ @class */ (function (_super) {
+var FieldOptions = /** @class */ (function (_super) {
     __extends$8(FieldOptions, _super);
     function FieldOptions() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -15804,25 +16039,25 @@ var FieldOptions = /** @__PURE__ @class */ (function (_super) {
     return FieldOptions;
 }(ChildProperty));
 
-var __extends$9 = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __decorate$6 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends$9 = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __decorate$6 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * A class that holds the collection of event fields that requires to be mapped with the dataSource
  * fields along with its available configuration settings. Each field in it accepts both string and object
@@ -15830,7 +16065,7 @@ var __decorate$6 = (undefined && undefined.__decorate) || function (decorators,
  *  name is mapped with it. If the `object` type is defined on each fields, then the validation related settings and mapping of
  *  those fields with dataSource can be given altogether within it.
  */
-var Field = /** @__PURE__ @class */ (function (_super) {
+var Field = /** @class */ (function (_super) {
     __extends$9(Field, _super);
     function Field() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -15883,29 +16118,29 @@ var Field = /** @__PURE__ @class */ (function (_super) {
     return Field;
 }(ChildProperty));
 
-var __extends$a = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __decorate$7 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends$a = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __decorate$7 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * Holds the configuration of event related options and dataSource binding to Schedule.
  */
-var EventSettings = /** @__PURE__ @class */ (function (_super) {
+var EventSettings = /** @class */ (function (_super) {
     __extends$a(EventSettings, _super);
     function EventSettings() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -15967,29 +16202,29 @@ var EventSettings = /** @__PURE__ @class */ (function (_super) {
     return EventSettings;
 }(ChildProperty));
 
-var __extends$b = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __decorate$8 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends$b = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __decorate$8 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * A class that holds the resource grouping related configurations on Schedule.
  */
-var Group = /** @__PURE__ @class */ (function (_super) {
+var Group = /** @class */ (function (_super) {
     __extends$b(Group, _super);
     function Group() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -16018,29 +16253,29 @@ var Group = /** @__PURE__ @class */ (function (_super) {
     return Group;
 }(ChildProperty));
 
-var __extends$c = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __decorate$9 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends$c = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __decorate$9 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * A class that represents the resource related configurations and its data binding options.
  */
-var Resources = /** @__PURE__ @class */ (function (_super) {
+var Resources = /** @class */ (function (_super) {
     __extends$c(Resources, _super);
     function Resources() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -16094,7 +16329,7 @@ var Resources = /** @__PURE__ @class */ (function (_super) {
 }(ChildProperty));
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
-var ResourceBase = /** @__PURE__ @class */ (function () {
+var ResourceBase = /** @class */ (function () {
     function ResourceBase(parent) {
         this.resourceCollection = [];
         this.leftPixel = 25;
@@ -16182,7 +16417,11 @@ var ResourceBase = /** @__PURE__ @class */ (function () {
         var resColl = this.resourceCollection;
         var tr = createElement('tr');
         var td = createElement('td', { attrs: { tabindex: isVirtualScroll ? '-1' : '0' } });
+        var existingGroupIndices = this.parent.activeView.getGroupIndices();
         for (var i = 0; i < resData.length; i++) {
+            if (existingGroupIndices.length > 0 && existingGroupIndices.indexOf(resData[parseInt(i.toString(), 10)].groupIndex) > -1) {
+                continue;
+            }
             var ntd = td.cloneNode();
             rIndex = findIndexInData(resColl, 'name', resData[parseInt(i.toString(), 10)].resource.name);
             if (rIndex === resColl.length - 1) {
@@ -16363,6 +16602,7 @@ var ResourceBase = /** @__PURE__ @class */ (function () {
         this.setExpandedResources();
         var resourceCount = this.parent.virtualScrollModule.getRenderedCount();
         var startIndex = this.expandedResources.indexOf(this.renderedResources[0]);
+        this.parent.virtualScrollModule.existingDataCollection = this.renderedResources;
         this.renderedResources = this.expandedResources.slice(startIndex, startIndex + resourceCount);
         if (this.renderedResources.length < resourceCount) {
             var sIndex = this.expandedResources.length - resourceCount;
@@ -17196,26 +17436,26 @@ var ResourceBase = /** @__PURE__ @class */ (function () {
     return ResourceBase;
 }());
 
-var __extends$d = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __decorate$a = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var ToolbarItem = /** @__PURE__ @class */ (function (_super) {
+var __extends$d = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __decorate$a = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var ToolbarItem = /** @class */ (function (_super) {
     __extends$d(ToolbarItem, _super);
     function ToolbarItem() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -17280,25 +17520,25 @@ var ToolbarItem = /** @__PURE__ @class */ (function (_super) {
     return ToolbarItem;
 }(ChildProperty));
 
-var __extends$e = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __decorate$b = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends$e = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __decorate$b = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * Represents the Schedule component that displays a list of events scheduled against specific date and timings,
  * thus helping us to plan and manage it properly.
@@ -17312,7 +17552,7 @@ var __decorate$b = (undefined && undefined.__decorate) || function (decorators,
  * </script>
  * ```
  */
-var Schedule = /** @__PURE__ @class */ (function (_super) {
+var Schedule = /** @class */ (function (_super) {
     __extends$e(Schedule, _super);
     /**
      * Constructor for creating the Schedule widget
@@ -17397,6 +17637,37 @@ var Schedule = /** @__PURE__ @class */ (function (_super) {
         }
         return templateName;
     };
+    /**
+     * Method to get element width
+     *
+     * @param {HTMLElement} element Accepts the DOM element
+     * @returns {number} Returns the width of the given element
+     * @private
+     */
+    Schedule.prototype.getElementWidth = function (element) {
+        return getElementWidth(element, this.uiStateValues.isTransformed);
+    };
+    /**
+     * Method to get element height
+     *
+     * @param {HTMLElement} element Accepts the DOM element
+     * @returns {number} Returns the Height of the given element
+     * @private
+     */
+    Schedule.prototype.getElementHeight = function (element) {
+        return getElementHeight(element, this.uiStateValues.isTransformed);
+    };
+    /**
+     * Method to get height from element
+     *
+     * @param {Element} element Accepts the DOM element
+     * @param {string} elementClass Accepts the element class
+     * @returns {number} Returns the height of the element
+     * @private
+     */
+    Schedule.prototype.getElementHeightFromClass = function (element, elementClass) {
+        return getElementHeightFromClass(element, elementClass, this.uiStateValues.isTransformed);
+    };
     /**
      * Method to render react templates
      *
@@ -17477,6 +17748,7 @@ var Schedule = /** @__PURE__ @class */ (function (_super) {
             this.headerModule = new HeaderRenderer(this);
         }
         this.renderTableContainer();
+        this.uiStateValues.isTransformed = Math.round(this.element.getBoundingClientRect().width) !== this.element.offsetWidth;
         if (Browser.isDevice || Browser.isTouch) {
             this.scheduleTouchModule = new ScheduleTouch(this);
         }
@@ -17980,7 +18252,7 @@ var Schedule = /** @__PURE__ @class */ (function (_super) {
             this.uiStateValues = {
                 expand: false, isInitial: true, left: 0, top: 0, isGroupAdaptive: false,
                 isIgnoreOccurrence: false, groupIndex: this.adaptiveGroupIndex, action: false,
-                isBlock: false, isCustomMonth: true, isPreventTimezone: false
+                isBlock: false, isCustomMonth: true, isPreventTimezone: false, isTransformed: false
             };
         }
         this.currentTimezoneDate = this.getCurrentTime();
@@ -18474,7 +18746,8 @@ var Schedule = /** @__PURE__ @class */ (function (_super) {
     };
     Schedule.prototype.onScheduleResize = function () {
         if (isNullOrUndefined(this.activeView) || ((this.isAdaptive || isMobile()) && document.activeElement
-            && document.activeElement.classList.contains(SUBJECT_CLASS)) || this.uiStateValues.isTapHold) {
+            && (document.activeElement.classList.contains(SUBJECT_CLASS) ||
+                document.activeElement.classList.contains(INLINE_SUBJECT_CLASS))) || this.uiStateValues.isTapHold) {
             return;
         }
         if (this.virtualScrollModule && this.activeView.isTimelineView()) {
@@ -18497,6 +18770,12 @@ var Schedule = /** @__PURE__ @class */ (function (_super) {
                 this.virtualScrollModule.isRemoteRefresh = false;
             }
             this.refreshEvents(isRemoteRefresh);
+            if (this.virtualScrollModule && !this.virtualScrollModule.enableTransition) {
+                var resWrap = this.element.querySelector('.' + RESOURCE_COLUMN_WRAP_CLASS);
+                var conWrap = this.element.querySelector('.' + CONTENT_WRAP_CLASS);
+                this.virtualScrollModule.enableTransition = true;
+                addClass([conWrap, resWrap], 'e-transition');
+            }
         }
         else {
             this.notify(contentReady, {});
@@ -19373,6 +19652,9 @@ var Schedule = /** @__PURE__ @class */ (function (_super) {
      * @returns {void}
      */
     Schedule.prototype.scrollTo = function (hour, scrollDate) {
+        if (this.currentView.indexOf('Agenda') < 0 && isNullOrUndefined(this.element.querySelector('.e-work-cells'))) {
+            return;
+        }
         if (this.activeView.scrollToDate && isNullOrUndefined(hour) && scrollDate) {
             this.activeView.scrollToDate(scrollDate);
         }
@@ -20354,7 +20636,7 @@ var Schedule = /** @__PURE__ @class */ (function (_super) {
 /**
  * Base class for the common drag and resize related actions
  */
-var ActionBase = /** @__PURE__ @class */ (function () {
+var ActionBase = /** @class */ (function () {
     function ActionBase(parent) {
         this.daysVariation = 0;
         this.parent = parent;
@@ -20811,23 +21093,23 @@ var ActionBase = /** @__PURE__ @class */ (function () {
     return ActionBase;
 }());
 
-var __extends$f = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __extends$f = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 /**
  * Schedule events resize actions
  */
-var Resize = /** @__PURE__ @class */ (function (_super) {
+var Resize = /** @class */ (function (_super) {
     __extends$f(Resize, _super);
     function Resize() {
         return _super !== null && _super.apply(this, arguments) || this;
@@ -20892,8 +21174,8 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
             };
             _this.actionObj.groupIndex = _this.parent.uiStateValues.isGroupAdaptive ? _this.parent.uiStateValues.groupIndex : 0;
             var workCell = _this.parent.element.querySelector('.' + WORK_CELLS_CLASS);
-            _this.actionObj.cellWidth = getElementWidth(workCell);
-            _this.actionObj.cellHeight = getElementHeight(workCell);
+            _this.actionObj.cellWidth = _this.parent.getElementWidth(workCell);
+            _this.actionObj.cellHeight = _this.parent.getElementHeight(workCell);
             var hRows = _this.parent.activeViewOptions.headerRows.map(function (row) { return row.option; });
             if (_this.parent.activeView.isTimelineView() && hRows.length > 0 && ['Date', 'Hour'].indexOf(hRows.slice(-1)[0]) < 0) {
                 var tr = _this.parent.getContentTable().querySelector('tr');
@@ -21127,6 +21409,7 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
         EventHandler.remove(document, Browser.touchEndEvent, this.resizeStop);
         clearInterval(this.actionObj.scrollInterval);
         this.actionObj.scrollInterval = null;
+        this.actionObj.action = null;
         this.removeCloneElementClasses();
         this.removeCloneElement();
         this.actionClass('removeClass');
@@ -21203,9 +21486,10 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
                     parseInt(this.actionObj.clone.style.left, 10);
                 offsetValue = Math.round(offsetValue / this.actionObj.cellWidth) * this.actionObj.cellWidth;
                 if (!isLeft) {
-                    offsetValue += (getElementWidth(this.actionObj.clone) - this.actionObj.cellWidth);
+                    offsetValue += (this.parent.getElementWidth(this.actionObj.clone) - this.actionObj.cellWidth);
                 }
-                cellIndex = Math.floor(offsetValue / Math.floor(getElementWidth(tr) / noOfDays));
+                cellIndex = !isTimelineMonth ? Math.round(offsetValue / (this.parent.getElementWidth(tr) / noOfDays)) :
+                    Math.floor(offsetValue / Math.floor(this.parent.getElementWidth(tr) / noOfDays));
                 isDateHeader = isTimeViews && headerName === 'Date';
                 cellIndex = isLeft ? cellIndex : isTimelineMonth ? cellIndex + 1 : cellIndex;
                 isLastCell = cellIndex === tdCollections.length;
@@ -21214,7 +21498,7 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
             else {
                 var cellWidth = this.actionObj.cellWidth;
                 cellIndex = isLeft ? Math.floor(offset / this.actionObj.cellWidth) :
-                    Math.ceil((offset + (getElementWidth(this.actionObj.clone) - cellWidth)) / this.actionObj.cellWidth);
+                    Math.ceil((offset + (this.parent.getElementWidth(this.actionObj.clone) - cellWidth)) / this.actionObj.cellWidth);
                 if (this.parent.enableRtl) {
                     var cellOffsetWidth = 0;
                     if (headerName === 'TimelineMonth' || (!this.parent.activeViewOptions.timeScale.enable &&
@@ -21222,7 +21506,7 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
                         cellOffsetWidth = this.actionObj.cellWidth;
                     }
                     var offsetWidth = (Math.floor(offset / this.actionObj.cellWidth) *
-                        this.actionObj.cellWidth) + (isLeft ? 0 : getElementWidth(this.actionObj.clone) - cellOffsetWidth);
+                        this.actionObj.cellWidth) + (isLeft ? 0 : this.parent.getElementWidth(this.actionObj.clone) - cellOffsetWidth);
                     cellIndex = Math.floor(offsetWidth / this.actionObj.cellWidth);
                 }
                 isLastCell = cellIndex === tdCollections.length;
@@ -21241,7 +21525,7 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
             }
             else {
                 if (!isLeft) {
-                    offset += getElementWidth(this.actionObj.clone);
+                    offset += this.parent.getElementWidth(this.actionObj.clone);
                 }
                 var spanMinutes = Math.ceil((this.actionObj.slotInterval / this.actionObj.cellWidth) *
                     (offset - Math.floor(offset / this.actionObj.cellWidth) * this.actionObj.cellWidth));
@@ -21253,9 +21537,9 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
         }
         else {
             var cloneIndex = closest(this.actionObj.clone, 'td').cellIndex;
-            var originalWidth = Math.ceil((isLeft ? getElementWidth(this.actionObj.element) : 0) /
+            var originalWidth = Math.ceil((isLeft ? this.parent.getElementWidth(this.actionObj.element) : 0) /
                 this.actionObj.cellWidth) * this.actionObj.cellWidth;
-            var noOfDays = Math.ceil((getElementWidth(this.actionObj.clone) - originalWidth) /
+            var noOfDays = Math.ceil((this.parent.getElementWidth(this.actionObj.clone) - originalWidth) /
                 this.actionObj.cellWidth);
             var tr = closest(this.actionObj.clone, 'tr');
             var dayIndex = isLeft ? cloneIndex - noOfDays : cloneIndex + noOfDays - 1;
@@ -21318,9 +21602,9 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
         var slotInterval = (this.actionObj.cellWidth / this.actionObj.slotInterval) * this.actionObj.interval;
         var pageWidth = isLeft ? (this.actionObj.X - this.actionObj.pageX) : (this.actionObj.pageX - this.actionObj.X);
         var targetWidth = isTimelineView ?
-            (getElementWidth(this.actionObj.element) / this.actionObj.cellWidth) * this.actionObj.cellWidth :
-            this.parent.currentView === 'Month' ? getElementWidth(this.actionObj.element) :
-                Math.ceil(getElementWidth(this.actionObj.element) / this.actionObj.cellWidth) * this.actionObj.cellWidth;
+            (this.parent.getElementWidth(this.actionObj.element) / this.actionObj.cellWidth) * this.actionObj.cellWidth :
+            this.parent.currentView === 'Month' ? this.parent.getElementWidth(this.actionObj.element) :
+                Math.ceil(this.parent.getElementWidth(this.actionObj.element) / this.actionObj.cellWidth) * this.actionObj.cellWidth;
         var offsetWidth = targetWidth + (Math.ceil(pageWidth / this.actionObj.cellWidth) * this.actionObj.cellWidth);
         var left = (this.parent.enableRtl) ? parseInt(this.actionObj.element.style.right, 10) : this.actionObj.clone.offsetLeft;
         if (isTimeViews) {
@@ -21335,7 +21619,7 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
             this.actionObj.event[this.parent.eventFields.isAllDay] = false;
         }
         var width = !isLeft && ((offsetWidth + this.actionObj.clone.offsetLeft > this.scrollArgs.width)) ?
-            getElementWidth(this.actionObj.clone) : (offsetWidth < this.actionObj.cellWidth) ? offsetWidth : offsetWidth;
+            this.parent.getElementWidth(this.actionObj.clone) : (offsetWidth < this.actionObj.cellWidth) ? offsetWidth : offsetWidth;
         if (this.parent.enableRtl) {
             var rightValue = isTimelineView ? parseInt(this.actionObj.element.style.right, 10) :
                 -(offsetWidth - this.actionObj.cellWidth);
@@ -21349,7 +21633,7 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
             }
             rightValue = rightValue >= this.scrollArgs.width ? this.scrollArgs.width - this.actionObj.cellWidth : rightValue;
             styles.right = formatUnit(rightValue);
-            width = width + rightValue > this.scrollArgs.width ? getElementWidth(this.actionObj.clone) : width;
+            width = width + rightValue > this.scrollArgs.width ? this.parent.getElementWidth(this.actionObj.clone) : width;
         }
         else {
             var offsetLeft = isLeft ? this.actionObj.element.offsetLeft - (this.actionObj.X - this.actionObj.pageX) :
@@ -21357,12 +21641,12 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
             if (isTimelineView) {
                 offsetLeft = isLeft ? offsetLeft : parseInt(this.actionObj.clone.style.left, 10);
                 if (this.parent.enableRtl) {
-                    offsetLeft = !isLeft ? (this.actionObj.pageX < this.actionObj.X - getElementWidth(this.actionObj.clone))
+                    offsetLeft = !isLeft ? (this.actionObj.pageX < this.actionObj.X - this.parent.getElementWidth(this.actionObj.clone))
                         ? parseInt(this.actionObj.clone.style.right, 10) : offsetLeft : offsetLeft;
                 }
                 else {
-                    offsetLeft = isLeft ? (this.actionObj.pageX > this.actionObj.X + getElementWidth(this.actionObj.clone) &&
-                        getElementWidth(this.actionObj.clone) === this.actionObj.cellWidth) ?
+                    offsetLeft = isLeft ? (this.actionObj.pageX > this.actionObj.X + this.parent.getElementWidth(this.actionObj.clone) &&
+                        this.parent.getElementWidth(this.actionObj.clone) === this.actionObj.cellWidth) ?
                         parseInt(this.actionObj.clone.style.left, 10) : offsetLeft : offsetLeft;
                 }
             }
@@ -21378,10 +21662,10 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
                 }
                 else {
                     offsetLeft = 0;
-                    width = getElementWidth(this.actionObj.clone);
+                    width = this.parent.getElementWidth(this.actionObj.clone);
                 }
             }
-            var cloneWidth = Math.ceil(getElementWidth(this.actionObj.clone) / this.actionObj.cellWidth) *
+            var cloneWidth = Math.ceil(this.parent.getElementWidth(this.actionObj.clone) / this.actionObj.cellWidth) *
                 this.actionObj.cellWidth;
             if (isLeft) {
                 styles.left = formatUnit(isTimelineView ? offsetLeft : isLeft ? leftValue < 0 ? -offsetLeft :
@@ -21428,24 +21712,24 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
     return Resize;
 }(ActionBase));
 
-var __extends$g = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __extends$g = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var EVENT_GAP$2 = 2;
 /**
  * Year view events render
  */
-var YearEvent = /** @__PURE__ @class */ (function (_super) {
+var YearEvent = /** @class */ (function (_super) {
     __extends$g(YearEvent, _super);
     function YearEvent(parent) {
         var _this = _super.call(this, parent, 'day') || this;
@@ -21490,8 +21774,8 @@ var YearEvent = /** @__PURE__ @class */ (function (_super) {
             var monthDate = new Date(this.parent.selectedDate.getFullYear(), month, 1);
             var monthStart = this.parent.calendarUtil.getMonthStartDate(new Date(monthDate.getTime()));
             var monthEnd = this.parent.calendarUtil.getMonthEndDate(new Date(monthDate.getTime()));
-            var startDate = getWeekFirstDate(monthStart, this.parent.firstDayOfWeek);
-            var endDate = addDays(getWeekLastDate(monthEnd, this.parent.firstDayOfWeek), 1);
+            var startDate = getWeekFirstDate(monthStart, this.parent.activeViewOptions.firstDayOfWeek);
+            var endDate = addDays(getWeekLastDate(monthEnd, this.parent.activeViewOptions.firstDayOfWeek), 1);
             for (var index = 0; startDate.getTime() < endDate.getTime(); index++) {
                 var start = resetTime(new Date(startDate.getTime()));
                 var end = addDays(new Date(start.getTime()), 1);
@@ -21512,10 +21796,10 @@ var YearEvent = /** @__PURE__ @class */ (function (_super) {
     YearEvent.prototype.timelineYearViewEvents = function () {
         var _this = this;
         var workCell = this.parent.element.querySelector('.' + WORK_CELLS_CLASS + ':not(.' + OTHERMONTH_CLASS + ')');
-        this.cellWidth = getElementWidth(workCell);
+        this.cellWidth = this.parent.getElementWidth(workCell);
         this.cellHeader = getOuterHeight(workCell.querySelector('.' + DATE_HEADER_CLASS));
         var eventTable = this.parent.element.querySelector('.' + EVENT_TABLE_CLASS);
-        this.eventHeight = getElementHeightFromClass(eventTable, APPOINTMENT_CLASS);
+        this.eventHeight = this.parent.getElementHeightFromClass(eventTable, APPOINTMENT_CLASS);
         var selector = "." + MONTH_HEADER_WRAPPER + " tbody tr,." + RESOURCE_COLUMN_TABLE_CLASS + " tbody tr,." + CONTENT_TABLE_CLASS + " tbody tr";
         this.addCellHeight(selector, this.eventHeight, EVENT_GAP$2, this.cellHeader, this.moreIndicatorHeight);
         var wrapperCollection = [].slice.call(this.parent.element.querySelectorAll('.' + APPOINTMENT_CONTAINER_CLASS));
@@ -21671,10 +21955,10 @@ var YearEvent = /** @__PURE__ @class */ (function (_super) {
         var contentTable = this.parent.element.querySelector('.' + CONTENT_WRAP_CLASS);
         var isVerticalScrollbarAvail = contentTable.offsetWidth > contentTable.clientWidth;
         var workCell = this.parent.element.querySelector('.' + WORK_CELLS_CLASS);
-        this.cellWidth = getElementWidth(workCell);
+        this.cellWidth = this.parent.getElementWidth(workCell);
         this.cellHeader = 0;
         var eventTable = this.parent.element.querySelector('.' + EVENT_TABLE_CLASS);
-        this.eventHeight = getElementHeightFromClass(eventTable, APPOINTMENT_CLASS);
+        this.eventHeight = this.parent.getElementHeightFromClass(eventTable, APPOINTMENT_CLASS);
         var selector = "." + MONTH_HEADER_WRAPPER + " tbody tr,." + RESOURCE_COLUMN_TABLE_CLASS + " tbody tr,." + CONTENT_TABLE_CLASS + " tbody tr";
         this.addCellHeight(selector, this.eventHeight, EVENT_GAP$2, this.cellHeader, this.moreIndicatorHeight);
         var wrapperCollection = [].slice.call(this.parent.element.querySelectorAll('.' + APPOINTMENT_CONTAINER_CLASS));
@@ -21716,7 +22000,7 @@ var YearEvent = /** @__PURE__ @class */ (function (_super) {
                 appWrapper.forEach(function (appWrap, cellIndex) {
                     var td = row.querySelector("td:nth-child(" + (cellIndex + 1) + ")");
                     var app = [].slice.call(appWrap.children);
-                    var width = getElementWidth(td);
+                    var width = _this.parent.getElementWidth(td);
                     var left = td.offsetLeft;
                     if (_this.parent.enableRtl) {
                         var right_1 = conTable_1.offsetWidth - left - td.offsetWidth;
@@ -22051,24 +22335,24 @@ var YearEvent = /** @__PURE__ @class */ (function (_super) {
     return YearEvent;
 }(TimelineEvent));
 
-var __extends$h = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __extends$h = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var MINUTES_PER_DAY = 1440;
 /**
  * Schedule events drag actions
  */
-var DragAndDrop = /** @__PURE__ @class */ (function (_super) {
+var DragAndDrop = /** @class */ (function (_super) {
     __extends$h(DragAndDrop, _super);
     function DragAndDrop() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
@@ -22091,14 +22375,19 @@ var DragAndDrop = /** @__PURE__ @class */ (function (_super) {
         _this.isAllDayTarget = false;
         _this.targetTd = null;
         _this.isCursorAhead = false;
+        _this.enableCurrentViewDrag = false;
+        _this.isPreventMultiDrag = false;
+        _this.slotsUptoCursor = -1;
+        _this.eleTop = 0;
         return _this;
     }
     DragAndDrop.prototype.wireDragEvent = function (element) {
+        var isVerticalView = ['Day', 'Week', 'WorkWeek'].indexOf(this.parent.currentView) > -1;
         new Draggable(element, {
             abort: '.' + EVENT_RESIZE_CLASS,
             clone: true,
             isDragScroll: true,
-            enableTailMode: (this.parent.eventDragArea) ? true : false,
+            enableTailMode: (this.parent.eventDragArea || isVerticalView) ? true : false,
             cursorAt: (this.parent.eventDragArea) ? { left: -20, top: -20 } : { left: 0, top: 0 },
             dragArea: this.dragArea,
             dragStart: this.dragStart.bind(this),
@@ -22122,6 +22411,8 @@ var DragAndDrop = /** @__PURE__ @class */ (function (_super) {
         }
         this.setDragActionDefaultValues();
         this.actionObj.element = e.element;
+        this.eleTop = parseFloat(this.actionObj.element.style.top);
+        this.slotsUptoCursor = -1;
         this.actionObj.action = 'drag';
         var elements = [];
         if (!this.parent.allowMultiDrag || isNullOrUndefined(this.parent.selectedElements) || this.parent.selectedElements.length === 0 ||
@@ -22200,12 +22491,21 @@ var DragAndDrop = /** @__PURE__ @class */ (function (_super) {
             }
             var top_1 = parseInt(e.top, 10);
             top_1 = top_1 < 0 ? 0 : top_1;
-            topValue = formatUnit(Math.ceil(top_1 / cellHeight) * cellHeight);
+            if (this.slotsUptoCursor < 0) {
+                var cellsCountUptoCursor = Math.floor(top_1 / cellHeight);
+                var cellsCountUptoEleTop = Math.floor(this.eleTop / cellHeight);
+                this.slotsUptoCursor = cellsCountUptoCursor - cellsCountUptoEleTop;
+            }
+            top_1 = (Math.floor((top_1 + 1) / cellHeight) - this.slotsUptoCursor) * cellHeight;
+            topValue = formatUnit(top_1 < 0 ? 0 : top_1);
             var scrollHeight = this.parent.element.querySelector('.e-content-wrap').scrollHeight;
             var cloneBottom = parseInt(topValue, 10) + this.actionObj.clone.offsetHeight;
             if (cloneBottom > scrollHeight) {
                 topValue = (parseInt(topValue, 10) - (cloneBottom - scrollHeight)) + 'px';
             }
+            if (this.isPreventMultiDrag) {
+                topValue = formatUnit(this.actionObj.clone.offsetTop);
+            }
         }
         return { left: leftValue, top: topValue };
     };
@@ -22257,6 +22557,7 @@ var DragAndDrop = /** @__PURE__ @class */ (function (_super) {
             _this.actionObj.interval = dragEventArgs.interval;
             _this.actionObj.navigation = dragEventArgs.navigation;
             _this.actionObj.scroll = dragEventArgs.scroll;
+            _this.enableCurrentViewDrag = dragArgs.dragWithinRange && !dragArgs.navigation.enable && _this.parent.allowMultiDrag;
             _this.actionObj.excludeSelectors = dragEventArgs.excludeSelectors;
             var viewElement = _this.parent.element.querySelector('.' + CONTENT_WRAP_CLASS);
             _this.scrollArgs = { element: viewElement, width: viewElement.scrollWidth, height: viewElement.scrollHeight };
@@ -22417,6 +22718,7 @@ var DragAndDrop = /** @__PURE__ @class */ (function (_super) {
     DragAndDrop.prototype.dragStop = function (e) {
         var _this = this;
         this.isCursorAhead = false;
+        this.isPreventMultiDrag = false;
         this.removeCloneElementClasses();
         this.removeCloneElement();
         clearInterval(this.actionObj.navigationInterval);
@@ -22485,7 +22787,7 @@ var DragAndDrop = /** @__PURE__ @class */ (function (_super) {
             this.timelineEventModule.cellWidth = this.actionObj.cellWidth;
             this.timelineEventModule.getSlotDates();
             this.actionObj.cellWidth = this.isHeaderRows ? this.timelineEventModule.cellWidth :
-                getElementWidth(this.parent.element.querySelector('.' + WORK_CELLS_CLASS));
+                this.parent.getElementWidth(this.parent.element.querySelector('.' + WORK_CELLS_CLASS));
             this.calculateTimelineTime(e);
         }
         else {
@@ -22630,7 +22932,7 @@ var DragAndDrop = /** @__PURE__ @class */ (function (_super) {
                 (dragArea.scrollTop + dragArea.offsetHeight - this.actionObj.clone.offsetHeight + window.pageYOffset) +
                     (this.actionObj.clone.offsetHeight - this.heightUptoCursorPoint);
             offsetTop = Math.round(offsetTop / this.actionObj.cellHeight) * this.actionObj.cellHeight;
-            if (dragArea.scrollTop > 0) {
+            if (dragArea.scrollTop > 0 && offsetTop < dragArea.scrollHeight) {
                 this.actionObj.clone.style.top = formatUnit(offsetTop);
             }
         }
@@ -22662,7 +22964,9 @@ var DragAndDrop = /** @__PURE__ @class */ (function (_super) {
         var dragStart;
         var dragEnd;
         if (this.parent.activeViewOptions.timeScale.enable && !this.isAllDayDrag) {
-            this.appendCloneElement(this.getEventWrapper(colIndex));
+            if (!this.enableCurrentViewDrag || this.multiData.length === 0) {
+                this.appendCloneElement(this.getEventWrapper(colIndex));
+            }
             dragStart = this.parent.getDateFromElement(td);
             dragStart.setMinutes(dragStart.getMinutes() + (diffInMinutes / heightPerMinute));
             dragEnd = new Date(dragStart.getTime());
@@ -22719,18 +23023,34 @@ var DragAndDrop = /** @__PURE__ @class */ (function (_super) {
                 this.startTime = eventObj_1[this.parent.eventFields.startTime].getTime();
             }
             var startTimeDiff = event[this.parent.eventFields.startTime].getTime() - this.startTime;
-            for (var index_2 = 0; index_2 < this.multiData.length; index_2++) {
-                this.updatedData[parseInt(index_2.toString(), 10)] =
-                    this.updateMultipleData(this.multiData[parseInt(index_2.toString(), 10)], startTimeDiff);
-                var dayIndex = this.getDayIndex(this.updatedData[parseInt(index_2.toString(), 10)]);
-                if (dayIndex >= 0) {
-                    var wrapper = this.getEventWrapper(dayIndex, this.updatedData[parseInt(index_2.toString(), 10)][this.parent.eventFields.isAllDay]);
-                    this.appendCloneElement(wrapper, this.actionObj.cloneElement[parseInt(index_2.toString(), 10)]);
-                    this.updateEventHeight(this.updatedData[parseInt(index_2.toString(), 10)], index_2, dayIndex);
-                }
-                else {
-                    if (!isNullOrUndefined(this.actionObj.cloneElement[parseInt(index_2.toString(), 10)].parentNode)) {
-                        remove(this.actionObj.cloneElement[parseInt(index_2.toString(), 10)]);
+            if (this.enableCurrentViewDrag) {
+                var renderDates = this.getRenderedDates();
+                for (var i = 0; i < this.multiData.length; i++) {
+                    var eventObj_2 = extend({}, this.multiData[parseInt(i.toString(), 10)], null, true);
+                    var startTime = new Date(eventObj_2[this.parent.eventFields.startTime].getTime() + startTimeDiff);
+                    var dayIndex = this.parent.getIndexOfDate(renderDates, resetTime(startTime));
+                    if (dayIndex < 0) {
+                        this.isPreventMultiDrag = true;
+                        break;
+                    }
+                    this.isPreventMultiDrag = false;
+                }
+            }
+            if (!this.isPreventMultiDrag) {
+                for (var index_2 = 0; index_2 < this.multiData.length; index_2++) {
+                    this.updatedData[parseInt(index_2.toString(), 10)] =
+                        this.updateMultipleData(this.multiData[parseInt(index_2.toString(), 10)], startTimeDiff);
+                    var dayIndex = this.getDayIndex(this.updatedData[parseInt(index_2.toString(), 10)]);
+                    if (dayIndex >= 0) {
+                        var isAllDay = this.updatedData[parseInt(index_2.toString(), 10)][this.parent.eventFields.isAllDay];
+                        var wrapper = this.getEventWrapper(dayIndex, isAllDay);
+                        this.appendCloneElement(wrapper, this.actionObj.cloneElement[parseInt(index_2.toString(), 10)]);
+                        this.updateEventHeight(this.updatedData[parseInt(index_2.toString(), 10)], index_2, dayIndex);
+                    }
+                    else {
+                        if (!isNullOrUndefined(this.actionObj.cloneElement[parseInt(index_2.toString(), 10)].parentNode)) {
+                            remove(this.actionObj.cloneElement[parseInt(index_2.toString(), 10)]);
+                        }
                     }
                 }
             }
@@ -22860,7 +23180,7 @@ var DragAndDrop = /** @__PURE__ @class */ (function (_super) {
                     var appHeight = this.parent.activeViewOptions.timeScale.enable ? this.verticalEvent.getHeight(eStart, eEnd) :
                         this.actionObj.element.offsetHeight;
                     var topValue = this.parent.activeViewOptions.timeScale.enable ?
-                        this.verticalEvent.getTopValue(eStart, dayIndex, indexGroup) : this.actionObj.element.offsetTop;
+                        this.verticalEvent.getTopValue(eStart) : this.actionObj.element.offsetTop;
                     if (isNullOrUndefined(index)) {
                         if (i === 0) {
                             this.actionObj.clone.style.top = formatUnit(topValue);
@@ -22948,6 +23268,9 @@ var DragAndDrop = /** @__PURE__ @class */ (function (_super) {
     };
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     DragAndDrop.prototype.swapDragging = function (e) {
+        if (this.isPreventMultiDrag) {
+            return;
+        }
         var colIndex = !isNullOrUndefined(closest(this.actionObj.target, 'td')) && closest(this.actionObj.target, 'td').cellIndex;
         if (closest(this.actionObj.target, '.' + DATE_HEADER_WRAP_CLASS) &&
             !closest(this.actionObj.clone, '.' + ALLDAY_APPOINTMENT_WRAPPER_CLASS)) {
@@ -23073,7 +23396,7 @@ var DragAndDrop = /** @__PURE__ @class */ (function (_super) {
             getUniversalTime(eventObj[this.parent.eventFields.startTime]);
         var offsetLeft = this.parent.enableRtl ? Math.abs(this.actionObj.clone.offsetLeft) - this.actionObj.clone.offsetWidth :
             parseInt(this.actionObj.clone.style.left, 10);
-        offsetLeft = Math.floor(offsetLeft / Math.trunc(this.actionObj.cellWidth)) * this.actionObj.cellWidth;
+        offsetLeft = Math.round(offsetLeft / this.actionObj.cellWidth) * this.actionObj.cellWidth;
         var rightOffset;
         if (this.parent.enableRtl) {
             rightOffset = Math.abs(parseInt(this.actionObj.clone.style.right, 10));
@@ -23259,7 +23582,7 @@ var DragAndDrop = /** @__PURE__ @class */ (function (_super) {
         return 0;
     };
     DragAndDrop.prototype.getColumnIndex = function (offsetLeft) {
-        var index = Math.floor(offsetLeft / Math.trunc(this.actionObj.cellWidth));
+        var index = Math.round(offsetLeft / this.actionObj.cellWidth);
         if (this.isHeaderRows) {
             return index;
         }
@@ -23304,7 +23627,7 @@ var DragAndDrop = /** @__PURE__ @class */ (function (_super) {
             ~~(dragArea.querySelector('table').offsetHeight / trCollection.length) : this.actionObj.cellHeight;
         var rowIndex = Math.floor(Math.floor((this.actionObj.Y +
             (dragArea.scrollTop - translateY - (window.scrollY || window.pageYOffset))) -
-            getElementTop(dragArea)) / rowHeight);
+            getElementTop(dragArea, this.parent.uiStateValues.isTransformed)) / rowHeight);
         rowIndex = (rowIndex < 0) ? 0 : (rowIndex > trCollection.length - 1) ? trCollection.length - 1 : rowIndex;
         this.actionObj.index = rowIndex;
         var eventContainer = this.parent.element.querySelectorAll('.e-appointment-container:not(.e-hidden)').item(rowIndex);
@@ -23320,7 +23643,7 @@ var DragAndDrop = /** @__PURE__ @class */ (function (_super) {
         if (!isNullOrUndefined(this.parent.eventDragArea)) {
             return;
         }
-        var top = getElementHeight(trCollection[parseInt(rowIndex.toString(), 10)]) * rowIndex;
+        var top = this.parent.getElementHeight(trCollection[parseInt(rowIndex.toString(), 10)]) * rowIndex;
         if (this.parent.rowAutoHeight) {
             var cursorElement = this.getCursorElement(e);
             if (cursorElement) {
@@ -23397,7 +23720,7 @@ var DragAndDrop = /** @__PURE__ @class */ (function (_super) {
 /**
  * view base
  */
-var ViewBase = /** @__PURE__ @class */ (function () {
+var ViewBase = /** @class */ (function () {
     /**
      * Constructor
      *
@@ -23656,6 +23979,10 @@ var ViewBase = /** @__PURE__ @class */ (function () {
         }
         startHour.setMilliseconds(0);
         endHour.setMilliseconds(0);
+        if (resetTime(date).getTime() !== resetTime(startHour).getTime()) {
+            startHour = new Date(2000, 0, 0, startHour.getHours(), startHour.getMinutes(), startHour.getMilliseconds());
+            endHour = new Date(2000, 0, 0, endHour.getHours(), endHour.getMinutes(), endHour.getMilliseconds());
+        }
         return !(getDateInMs(date) < getDateInMs(startHour) || getDateInMs(date) >= getDateInMs(endHour) ||
             !this.isWorkDay(date, workDays));
     };
@@ -23885,7 +24212,7 @@ var ViewBase = /** @__PURE__ @class */ (function () {
         if (this.isTimelineView()) {
             var colElements = this.getColElements();
             var contentBody = this.element.querySelector('.' + CONTENT_TABLE_CLASS + ' tbody');
-            var colWidth_1 = (getElementWidth(contentBody) / (colElements.length / 2));
+            var colWidth_1 = (this.parent.getElementWidth(contentBody) / (colElements.length / 2));
             if (content.offsetHeight !== content.clientHeight) {
                 var resourceColumn = this.parent.element.querySelector('.' + RESOURCE_COLUMN_WRAP_CLASS);
                 if (!isNullOrUndefined(resourceColumn) && resourceColumn.offsetHeight !== content.clientHeight) {
@@ -24017,6 +24344,15 @@ var ViewBase = /** @__PURE__ @class */ (function () {
             this.parent.resourceBase.expandedResources = this.colLevels[this.colLevels.length - 1];
         }
     };
+    ViewBase.prototype.getGroupIndices = function (dataCollection) {
+        var groupIndices = [];
+        if (this.parent.virtualScrollModule && this.parent.activeViewOptions.group.resources.length > 0 && (dataCollection ||
+            this.parent.virtualScrollModule.existingDataCollection.length > 0) && !this.parent.uiStateValues.isGroupAdaptive) {
+            dataCollection = isNullOrUndefined(dataCollection) ? this.parent.virtualScrollModule.existingDataCollection : dataCollection;
+            groupIndices = dataCollection.map(function (data) { return data.groupIndex; });
+        }
+        return groupIndices;
+    };
     ViewBase.prototype.destroy = function () {
         if (this.element && this.element.parentNode) {
             remove(this.element);
@@ -24028,23 +24364,23 @@ var ViewBase = /** @__PURE__ @class */ (function () {
     return ViewBase;
 }());
 
-var __extends$i = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __extends$i = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 /**
  * vertical view
  */
-var VerticalView = /** @__PURE__ @class */ (function (_super) {
+var VerticalView = /** @class */ (function (_super) {
     __extends$i(VerticalView, _super);
     function VerticalView(parent) {
         var _this = _super.call(this, parent) || this;
@@ -24267,11 +24603,8 @@ var VerticalView = /** @__PURE__ @class */ (function (_super) {
         var currentDate = this.parent.getCurrentTime();
         if (this.parent.showTimeIndicator && this.isWorkHourRange(currentDate)) {
             var currentDateIndex = this.getCurrentTimeIndicatorIndex();
-            if (currentDateIndex.length > 0) {
-                var workCells = [].slice.call(this.element.querySelectorAll('.' + WORK_CELLS_CLASS));
-                if (workCells.length > 0) {
-                    this.changeCurrentTimePosition();
-                }
+            if (currentDateIndex.length > 0 && !isNullOrUndefined(this.element.querySelector('.' + WORK_CELLS_CLASS))) {
+                this.changeCurrentTimePosition();
                 if (isNullOrUndefined(this.currentTimeIndicatorTimer)) {
                     var interval = MS_PER_MINUTE - ((currentDate.getSeconds() * 1000) + currentDate.getMilliseconds());
                     if (interval <= (MS_PER_MINUTE - 1000)) {
@@ -24373,7 +24706,11 @@ var VerticalView = /** @__PURE__ @class */ (function (_super) {
         }
         for (var _i = 0, currentDateIndex_1 = currentDateIndex; _i < currentDateIndex_1.length; _i++) {
             var day = currentDateIndex_1[_i];
-            curTimeWrap[parseInt(day.toString(), 10)].appendChild(createElement('div', { className: CURRENT_TIMELINE_CLASS, styles: 'top:' + topInPx }));
+            if (curTimeWrap.length > day) {
+                curTimeWrap[parseInt(day.toString(), 10)].appendChild(createElement('div', {
+                    className: CURRENT_TIMELINE_CLASS, styles: 'top:' + topInPx
+                }));
+            }
         }
         var currentTimeEle = createElement('div', {
             innerHTML: this.parent.getTimeString(this.parent.getCurrentTime()),
@@ -24390,13 +24727,13 @@ var VerticalView = /** @__PURE__ @class */ (function (_super) {
         }
     };
     VerticalView.prototype.getTopFromDateTime = function (date) {
-        var startHour = this.getStartHour();
+        var startHour = this.getStartEndHours(this.parent.activeViewOptions.startHour);
         var diffInMinutes = ((date.getHours() - startHour.getHours()) * 60) + (date.getMinutes() - startHour.getMinutes());
         return (diffInMinutes * this.getWorkCellHeight() * this.parent.activeViewOptions.timeScale.slotCount) /
             this.parent.activeViewOptions.timeScale.interval;
     };
     VerticalView.prototype.getWorkCellHeight = function () {
-        return parseFloat(getElementHeight(this.element.querySelector('.' + WORK_CELLS_CLASS)).toFixed(2));
+        return parseFloat(this.parent.getElementHeight(this.element.querySelector('.' + WORK_CELLS_CLASS)).toFixed(2));
     };
     VerticalView.prototype.getTdContent = function (date, type, groupIndex) {
         var cntEle;
@@ -24699,12 +25036,21 @@ var VerticalView = /** @__PURE__ @class */ (function (_super) {
         var rows = [];
         var tr = createElement('tr');
         var td = createElement('td', { attrs: { 'aria-selected': 'false' } });
+        var existingGroupIndices = this.getGroupIndices();
         var handler = function (r) {
             var ntr = tr.cloneNode();
             for (var _i = 0, _a = _this.colLevels[_this.colLevels.length - 1]; _i < _a.length; _i++) {
                 var tdData = _a[_i];
-                var ntd = _this.createContentTd(tdData, r, td);
-                ntr.appendChild(ntd);
+                var isAllowTdCreation = true;
+                if (_this.parent.virtualScrollModule && _this.parent.activeViewOptions.group.resources.length > 0) {
+                    if (existingGroupIndices.indexOf(tdData.groupIndex) > -1) {
+                        isAllowTdCreation = false;
+                    }
+                }
+                if (isAllowTdCreation) {
+                    var ntd = _this.createContentTd(tdData, r, td);
+                    ntr.appendChild(ntd);
+                }
             }
             rows.push(ntr);
             return r;
@@ -24892,23 +25238,23 @@ var VerticalView = /** @__PURE__ @class */ (function (_super) {
     return VerticalView;
 }(ViewBase));
 
-var __extends$j = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __extends$j = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 /**
  * day view
  */
-var Day = /** @__PURE__ @class */ (function (_super) {
+var Day = /** @class */ (function (_super) {
     __extends$j(Day, _super);
     /**
      * Constructor for day view
@@ -24931,23 +25277,23 @@ var Day = /** @__PURE__ @class */ (function (_super) {
     return Day;
 }(VerticalView));
 
-var __extends$k = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __extends$k = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 /**
  * week view
  */
-var Week = /** @__PURE__ @class */ (function (_super) {
+var Week = /** @class */ (function (_super) {
     __extends$k(Week, _super);
     /**
      * Constructor for week view
@@ -24976,23 +25322,23 @@ var Week = /** @__PURE__ @class */ (function (_super) {
     return Week;
 }(VerticalView));
 
-var __extends$l = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __extends$l = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 /**
  * work week view
  */
-var WorkWeek = /** @__PURE__ @class */ (function (_super) {
+var WorkWeek = /** @class */ (function (_super) {
     __extends$l(WorkWeek, _super);
     /**
      * Constructor for work week view
@@ -25021,23 +25367,23 @@ var WorkWeek = /** @__PURE__ @class */ (function (_super) {
     return WorkWeek;
 }(VerticalView));
 
-var __extends$m = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __extends$m = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 /**
  * month view
  */
-var Month = /** @__PURE__ @class */ (function (_super) {
+var Month = /** @class */ (function (_super) {
     __extends$m(Month, _super);
     function Month(parent) {
         var _this = _super.call(this, parent) || this;
@@ -25499,7 +25845,13 @@ var Month = /** @__PURE__ @class */ (function (_super) {
         var tr = createElement('tr');
         var td = createElement('td', { attrs: { 'aria-selected': 'false' } });
         var slotDatas = this.getContentSlots();
+        var isTimeline = this.parent.currentView === 'TimelineMonth';
+        var existingGroupIndices = isTimeline ? this.getGroupIndices() : [];
         for (var row = 0; row < slotDatas.length; row++) {
+            if (existingGroupIndices.length > 0 &&
+                existingGroupIndices.indexOf(slotDatas[parseInt(row.toString(), 10)][0].groupIndex) > -1) {
+                continue;
+            }
             var ntr = tr.cloneNode();
             for (var col = 0; col < slotDatas[parseInt(row.toString(), 10)].length; col++) {
                 var ntd = this.createContentTd(slotDatas[parseInt(row.toString(), 10)][parseInt(col.toString(), 10)], td);
@@ -25736,23 +26088,23 @@ var Month = /** @__PURE__ @class */ (function (_super) {
     return Month;
 }(ViewBase));
 
-var __extends$n = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __extends$n = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 /**
  * year view
  */
-var Year = /** @__PURE__ @class */ (function (_super) {
+var Year = /** @class */ (function (_super) {
     __extends$n(Year, _super);
     function Year(parent) {
         var _this = _super.call(this, parent) || this;
@@ -25844,7 +26196,7 @@ var Year = /** @__PURE__ @class */ (function (_super) {
         this.setAriaAttributes(contentTable);
         var thead = createElement('thead', { className: 'e-week-header' });
         var tr = createElement('tr');
-        var currentWeek = getWeekFirstDate(firstDateOfMonth(currentDate), this.parent.firstDayOfWeek);
+        var currentWeek = getWeekFirstDate(firstDateOfMonth(currentDate), this.parent.activeViewOptions.firstDayOfWeek);
         if (this.parent.activeViewOptions.showWeekNumber) {
             tr.appendChild(createElement('th'));
         }
@@ -25973,7 +26325,7 @@ var Year = /** @__PURE__ @class */ (function (_super) {
         return dateCol;
     };
     Year.prototype.getMonthDates = function (date) {
-        var startDate = getWeekFirstDate(firstDateOfMonth(date), this.parent.firstDayOfWeek);
+        var startDate = getWeekFirstDate(firstDateOfMonth(date), this.parent.activeViewOptions.firstDayOfWeek);
         var endDate = addDays(new Date(+startDate), (6 * WEEK_LENGTH));
         var dateCollection = [];
         for (var start = startDate; start.getTime() < endDate.getTime(); start = addDays(start, 1)) {
@@ -26109,10 +26461,10 @@ var Year = /** @__PURE__ @class */ (function (_super) {
         return addDays(addMonths(this.getStartDate(), this.parent.monthsCount), -1);
     };
     Year.prototype.startDate = function () {
-        return this.parent.currentView === 'Year' ? getWeekFirstDate(this.getStartDate(), this.parent.firstDayOfWeek) : this.getStartDate();
+        return this.parent.currentView === 'Year' ? getWeekFirstDate(this.getStartDate(), this.parent.activeViewOptions.firstDayOfWeek) : this.getStartDate();
     };
     Year.prototype.endDate = function () {
-        return this.parent.currentView === 'Year' ? addDays(getWeekLastDate(this.getEndDate(), this.parent.firstDayOfWeek), 1) :
+        return this.parent.currentView === 'Year' ? addDays(getWeekLastDate(this.getEndDate(), this.parent.activeViewOptions.firstDayOfWeek), 1) :
             addDays(this.getEndDate(), 1);
     };
     Year.prototype.getEndDateFromStartDate = function (start) {
@@ -26180,20 +26532,20 @@ var Year = /** @__PURE__ @class */ (function (_super) {
     return Year;
 }(ViewBase));
 
-var __extends$o = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var AgendaBase = /** @__PURE__ @class */ (function (_super) {
+var __extends$o = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var AgendaBase = /** @class */ (function (_super) {
     __extends$o(AgendaBase, _super);
     function AgendaBase(parent) {
         return _super.call(this, parent) || this;
@@ -26243,7 +26595,8 @@ var AgendaBase = /** @__PURE__ @class */ (function (_super) {
                     var scheduleId = _this.parent.element.id + '_';
                     var viewName = _this.parent.activeViewOptions.eventTemplateName;
                     var templateId = scheduleId + viewName + 'eventTemplate';
-                    templateEle = _this.parent.getAppointmentTemplate()(listData[parseInt(li.toString(), 10)], _this.parent, 'eventTemplate', templateId, false, undefined, undefined, _this.parent.root);
+                    templateEle =
+                        _this.parent.getAppointmentTemplate()(listData[parseInt(li.toString(), 10)], _this.parent, 'eventTemplate', templateId, false, undefined, undefined, _this.parent.root);
                     if (!isNullOrUndefined(listData[parseInt(li.toString(), 10)][fieldMapping.recurrenceRule])) {
                         var iconClass = (listData[parseInt(li.toString(), 10)][fieldMapping.id] ===
                             listData[parseInt(li.toString(), 10)][fieldMapping.recurrenceID]) ?
@@ -26590,23 +26943,23 @@ var AgendaBase = /** @__PURE__ @class */ (function (_super) {
     return AgendaBase;
 }(ViewBase));
 
-var __extends$p = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __extends$p = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 /**
  * agenda view
  */
-var Agenda = /** @__PURE__ @class */ (function (_super) {
+var Agenda = /** @class */ (function (_super) {
     __extends$p(Agenda, _super);
     function Agenda(parent) {
         var _this = _super.call(this, parent) || this;
@@ -27083,23 +27436,23 @@ var Agenda = /** @__PURE__ @class */ (function (_super) {
     return Agenda;
 }(AgendaBase));
 
-var __extends$q = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __extends$q = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 /**
  * month agenda view
  */
-var MonthAgenda = /** @__PURE__ @class */ (function (_super) {
+var MonthAgenda = /** @class */ (function (_super) {
     __extends$q(MonthAgenda, _super);
     function MonthAgenda(parent) {
         var _this = _super.call(this, parent) || this;
@@ -27262,7 +27615,7 @@ var MonthAgenda = /** @__PURE__ @class */ (function (_super) {
 /**
  * timeline header rows
  */
-var TimelineHeaderRow = /** @__PURE__ @class */ (function () {
+var TimelineHeaderRow = /** @class */ (function () {
     function TimelineHeaderRow(parent, renderDates) {
         this.parent = parent;
         this.renderDates = renderDates;
@@ -27294,7 +27647,7 @@ var TimelineHeaderRow = /** @__PURE__ @class */ (function () {
             var jsDate = +new Date(1970, 0, 1);
             var tzOffsetDiff = d.getTimezoneOffset() - new Date(1970, 0, 1).getTimezoneOffset();
             var key = Math.ceil(((((+d - jsDate) - (tzOffsetDiff * 60 * 1000)) / MS_PER_DAY) + new Date(jsDate).getDay() + 1) / 7);
-            if (this.parent.firstDayOfWeek && this.parent.firstDayOfWeek > new Date(+d).getDay()) {
+            if (this.parent.activeViewOptions.firstDayOfWeek && this.parent.activeViewOptions.firstDayOfWeek > new Date(+d).getDay()) {
                 key = key - 1;
             }
             result[parseInt(key.toString(), 10)] = result[parseInt(key.toString(), 10)] || [];
@@ -27385,23 +27738,23 @@ var TimelineHeaderRow = /** @__PURE__ @class */ (function () {
     return TimelineHeaderRow;
 }());
 
-var __extends$r = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __extends$r = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 /**
  * timeline views
  */
-var TimelineViews = /** @__PURE__ @class */ (function (_super) {
+var TimelineViews = /** @class */ (function (_super) {
     __extends$r(TimelineViews, _super);
     function TimelineViews(parent) {
         var _this = _super.call(this, parent) || this;
@@ -27452,7 +27805,7 @@ var TimelineViews = /** @__PURE__ @class */ (function (_super) {
         }
         var scrollLeft;
         if (isNullOrUndefined(hour) || !this.parent.activeViewOptions.timeScale.enable) {
-            scrollLeft = index * getElementWidth(this.element.querySelector('.e-work-cells'));
+            scrollLeft = index * this.parent.getElementWidth(this.element.querySelector('.e-work-cells'));
         }
         else {
             scrollLeft = isNullOrUndefined(scrollDate) ? this.getLeftFromDateTime(null, date) :
@@ -27539,7 +27892,7 @@ var TimelineViews = /** @__PURE__ @class */ (function (_super) {
                 if (this.parent.activeView.colLevels[parseInt(index.toString(), 10)] &&
                     this.parent.activeView.colLevels[parseInt(index.toString(), 10)][0].colSpan) {
                     diffInDates = currentDateIndex[0] * this.parent.activeView.colLevels[parseInt(index.toString(), 10)][0].colSpan *
-                        getElementWidth(this.element.querySelector('.e-work-cells'));
+                        this.parent.getElementWidth(this.element.querySelector('.e-work-cells'));
                 }
                 else {
                     var endHour = this.getEndHour();
@@ -27549,8 +27902,8 @@ var TimelineViews = /** @__PURE__ @class */ (function (_super) {
                 }
             }
         }
-        return diffInDates + ((diffInMinutes * getElementWidth(this.element.querySelector('.e-work-cells')) * this.parent.activeViewOptions.timeScale.slotCount) /
-            this.parent.activeViewOptions.timeScale.interval);
+        return diffInDates + ((diffInMinutes * this.parent.getElementWidth(this.element.querySelector('.e-work-cells'))
+            * this.parent.activeViewOptions.timeScale.slotCount) / this.parent.activeViewOptions.timeScale.interval);
     };
     TimelineViews.prototype.renderHeader = function () {
         var tr = createElement('tr');
@@ -27617,7 +27970,12 @@ var TimelineViews = /** @__PURE__ @class */ (function (_super) {
         var tr = createElement('tr');
         var td = createElement('td', { attrs: { 'aria-selected': 'false' } });
         var trCount = this.getRowCount();
+        var existingGroupIndices = this.getGroupIndices();
         for (var i = 0; i < trCount; i++) {
+            if (existingGroupIndices.length > 0 &&
+                existingGroupIndices.indexOf(this.parent.resourceBase.renderedResources[parseInt(i.toString(), 10)].groupIndex) > -1) {
+                continue;
+            }
             var ntr = tr.cloneNode();
             for (var _i = 0, _a = this.colLevels[this.colLevels.length - 1]; _i < _a.length; _i++) {
                 var tdData = _a[_i];
@@ -27667,23 +28025,23 @@ var TimelineViews = /** @__PURE__ @class */ (function (_super) {
     return TimelineViews;
 }(VerticalView));
 
-var __extends$s = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __extends$s = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 /**
  * timeline month view
  */
-var TimelineMonth = /** @__PURE__ @class */ (function (_super) {
+var TimelineMonth = /** @class */ (function (_super) {
     __extends$s(TimelineMonth, _super);
     function TimelineMonth(parent) {
         var _this = _super.call(this, parent) || this;
@@ -27840,23 +28198,23 @@ var TimelineMonth = /** @__PURE__ @class */ (function (_super) {
     return TimelineMonth;
 }(Month));
 
-var __extends$t = (undefined && undefined.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __extends$t = (undefined && undefined.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 /**
  * timeline year view
  */
-var TimelineYear = /** @__PURE__ @class */ (function (_super) {
+var TimelineYear = /** @class */ (function (_super) {
     __extends$t(TimelineYear, _super);
     function TimelineYear(parent) {
         var _this = _super.call(this, parent) || this;
@@ -28137,13 +28495,17 @@ var TimelineYear = /** @__PURE__ @class */ (function (_super) {
     TimelineYear.prototype.getContentRows = function () {
         var tRow = [];
         var monthCells = this.getMonths();
+        var existingGroupIndices = this.getGroupIndices();
         for (var row = 0; row < this.parent.resourceBase.renderedResources.length; row++) {
-            var tr = createElement('tr');
-            tRow.push(tr);
             var resData = void 0;
             if (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {
                 resData = this.parent.resourceBase.renderedResources[parseInt(row.toString(), 10)];
+                if (existingGroupIndices.length > 0 && existingGroupIndices.indexOf(resData.groupIndex) > -1) {
+                    continue;
+                }
             }
+            var tr = createElement('tr');
+            tRow.push(tr);
             var monthDate = new Date(this.parent.selectedDate.getFullYear(), monthCells[parseInt(row.toString(), 10)], 1);
             var date = this.parent.calendarUtil.getMonthStartDate(new Date(monthDate.getTime()));
             for (var month = 0; month < this.columnCount; month++) {
@@ -28313,7 +28675,7 @@ var TimelineYear = /** @__PURE__ @class */ (function (_super) {
 /**
  * ICalendar Export Module
  */
-var ICalendarExport = /** @__PURE__ @class */ (function () {
+var ICalendarExport = /** @class */ (function () {
     function ICalendarExport(parent) {
         this.parent = parent;
     }
@@ -28462,7 +28824,7 @@ var ICalendarExport = /** @__PURE__ @class */ (function () {
 /**
  * ICalendar Import Module
  */
-var ICalendarImport = /** @__PURE__ @class */ (function () {
+var ICalendarImport = /** @class */ (function () {
     function ICalendarImport(parent) {
         this.allDay = false;
         this.parent = parent;
@@ -28727,7 +29089,7 @@ var ICalendarImport = /** @__PURE__ @class */ (function () {
 /**
  * Excel Export Module
  */
-var ExcelExport = /** @__PURE__ @class */ (function () {
+var ExcelExport = /** @class */ (function () {
     function ExcelExport(parent) {
         this.parent = parent;
     }
@@ -28800,7 +29162,7 @@ var ExcelExport = /** @__PURE__ @class */ (function () {
 /**
  * Print Module
  */
-var Print = /** @__PURE__ @class */ (function () {
+var Print = /** @class */ (function () {
     function Print(parent) {
         this.parent = parent;
     }
@@ -28863,6 +29225,7 @@ var Print = /** @__PURE__ @class */ (function () {
         Schedule.Inject(Day, Week, WorkWeek, Month, Agenda, MonthAgenda, TimelineViews, TimelineMonth, Year, TimelineYear);
         this.printInstance = new Schedule(this.getPrintScheduleModel(printOptions));
         this.printInstance.isPrinting = true;
+        this.printInstance.registeredTemplate = this.parent.registeredTemplate;
         this.printInstance.root = this.parent.root ? this.parent.root : this.parent;
         this.printInstance.appendTo(element);
         this.printInstance.on(print, this.contentReady, this);