@syncfusion/ej2-schedule 26.1.39 → 26.1.41-16103

package/src/schedule/actions/drag.js

@@ -1,16 +1,16 @@
-var __extends = (this && this.__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 = (this && this.__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 __());
+    };
+})();
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import { createElement, closest, Draggable, extend, formatUnit, isNullOrUndefined } from '@syncfusion/ej2-base';
 import { addClass, remove, removeClass, setStyleAttribute } from '@syncfusion/ej2-base';
@@ -49,14 +49,19 @@ var DragAndDrop = /** @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: '.' + cls.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),
@@ -80,6 +85,8 @@ var DragAndDrop = /** @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 ||
@@ -158,12 +165,21 @@ var DragAndDrop = /** @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 };
     };
@@ -215,6 +231,7 @@ var DragAndDrop = /** @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('.' + cls.CONTENT_WRAP_CLASS);
             _this.scrollArgs = { element: viewElement, width: viewElement.scrollWidth, height: viewElement.scrollHeight };
@@ -375,6 +392,7 @@ var DragAndDrop = /** @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);
@@ -443,7 +461,7 @@ var DragAndDrop = /** @class */ (function (_super) {
             this.timelineEventModule.cellWidth = this.actionObj.cellWidth;
             this.timelineEventModule.getSlotDates();
             this.actionObj.cellWidth = this.isHeaderRows ? this.timelineEventModule.cellWidth :
-                util.getElementWidth(this.parent.element.querySelector('.' + cls.WORK_CELLS_CLASS));
+                this.parent.getElementWidth(this.parent.element.querySelector('.' + cls.WORK_CELLS_CLASS));
             this.calculateTimelineTime(e);
         }
         else {
@@ -588,7 +606,7 @@ var DragAndDrop = /** @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);
             }
         }
@@ -620,7 +638,9 @@ var DragAndDrop = /** @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());
@@ -677,18 +697,34 @@ var DragAndDrop = /** @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);
+            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, util.resetTime(startTime));
+                    if (dayIndex < 0) {
+                        this.isPreventMultiDrag = true;
+                        break;
+                    }
+                    this.isPreventMultiDrag = false;
                 }
-                else {
-                    if (!isNullOrUndefined(this.actionObj.cloneElement[parseInt(index_2.toString(), 10)].parentNode)) {
-                        remove(this.actionObj.cloneElement[parseInt(index_2.toString(), 10)]);
+            }
+            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)]);
+                        }
                     }
                 }
             }
@@ -818,7 +854,7 @@ var DragAndDrop = /** @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);
@@ -906,6 +942,9 @@ var DragAndDrop = /** @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, '.' + cls.DATE_HEADER_WRAP_CLASS) &&
             !closest(this.actionObj.clone, '.' + cls.ALLDAY_APPOINTMENT_WRAPPER_CLASS)) {
@@ -1031,7 +1070,7 @@ var DragAndDrop = /** @class */ (function (_super) {
             util.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));
@@ -1217,7 +1256,7 @@ var DragAndDrop = /** @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;
         }
@@ -1262,7 +1301,7 @@ var DragAndDrop = /** @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))) -
-            util.getElementTop(dragArea)) / rowHeight);
+            util.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);
@@ -1278,7 +1317,7 @@ var DragAndDrop = /** @class */ (function (_super) {
         if (!isNullOrUndefined(this.parent.eventDragArea)) {
             return;
         }
-        var top = util.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) {

package/src/schedule/actions/keyboard.d.ts

@@ -13,6 +13,7 @@ export declare class KeyboardInteraction {
     private keyboardModule;
     constructor(parent: Schedule);
     private keyActionHandler;
+    private processShiftAltN;
     private processFTwelve;
     private addEventListener;
     private removeEventListener;

package/src/schedule/actions/keyboard.js

@@ -43,7 +43,9 @@ var KeyboardInteraction = /** @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;
@@ -124,6 +126,43 @@ var KeyboardInteraction = /** @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, '.' + cls.WORK_CELLS_CLASS)
+            || closest(target, '.' + cls.ALLDAY_CELLS_CLASS) || closest(target, '.' + cls.HEADER_CELLS_CLASS))) {
+            cellData = this.getSelectedElements(target);
+        }
+        else if (closest(target, '.' + cls.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) {
@@ -549,8 +588,11 @@ var KeyboardInteraction = /** @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) {

package/src/schedule/actions/resize.js

@@ -1,16 +1,16 @@
-var __extends = (this && this.__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 = (this && this.__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 __());
+    };
+})();
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import { addClass, Browser, EventHandler, remove, closest, extend, formatUnit, setStyleAttribute, isNullOrUndefined } from '@syncfusion/ej2-base';
 import { ActionBase } from '../actions/action-base';
@@ -86,8 +86,8 @@ var Resize = /** @class */ (function (_super) {
             };
             _this.actionObj.groupIndex = _this.parent.uiStateValues.isGroupAdaptive ? _this.parent.uiStateValues.groupIndex : 0;
             var workCell = _this.parent.element.querySelector('.' + cls.WORK_CELLS_CLASS);
-            _this.actionObj.cellWidth = util.getElementWidth(workCell);
-            _this.actionObj.cellHeight = util.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');
@@ -321,6 +321,7 @@ var Resize = /** @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');
@@ -397,9 +398,10 @@ var Resize = /** @class */ (function (_super) {
                     parseInt(this.actionObj.clone.style.left, 10);
                 offsetValue = Math.round(offsetValue / this.actionObj.cellWidth) * this.actionObj.cellWidth;
                 if (!isLeft) {
-                    offsetValue += (util.getElementWidth(this.actionObj.clone) - this.actionObj.cellWidth);
+                    offsetValue += (this.parent.getElementWidth(this.actionObj.clone) - this.actionObj.cellWidth);
                 }
-                cellIndex = Math.floor(offsetValue / Math.floor(util.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;
@@ -408,7 +410,7 @@ var Resize = /** @class */ (function (_super) {
             else {
                 var cellWidth = this.actionObj.cellWidth;
                 cellIndex = isLeft ? Math.floor(offset / this.actionObj.cellWidth) :
-                    Math.ceil((offset + (util.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 &&
@@ -416,7 +418,7 @@ var Resize = /** @class */ (function (_super) {
                         cellOffsetWidth = this.actionObj.cellWidth;
                     }
                     var offsetWidth = (Math.floor(offset / this.actionObj.cellWidth) *
-                        this.actionObj.cellWidth) + (isLeft ? 0 : util.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;
@@ -435,7 +437,7 @@ var Resize = /** @class */ (function (_super) {
             }
             else {
                 if (!isLeft) {
-                    offset += util.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));
@@ -447,9 +449,9 @@ var Resize = /** @class */ (function (_super) {
         }
         else {
             var cloneIndex = closest(this.actionObj.clone, 'td').cellIndex;
-            var originalWidth = Math.ceil((isLeft ? util.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((util.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;
@@ -512,9 +514,9 @@ var Resize = /** @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 ?
-            (util.getElementWidth(this.actionObj.element) / this.actionObj.cellWidth) * this.actionObj.cellWidth :
-            this.parent.currentView === 'Month' ? util.getElementWidth(this.actionObj.element) :
-                Math.ceil(util.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) {
@@ -529,7 +531,7 @@ var Resize = /** @class */ (function (_super) {
             this.actionObj.event[this.parent.eventFields.isAllDay] = false;
         }
         var width = !isLeft && ((offsetWidth + this.actionObj.clone.offsetLeft > this.scrollArgs.width)) ?
-            util.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);
@@ -543,7 +545,7 @@ var Resize = /** @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 ? util.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) :
@@ -551,12 +553,12 @@ var Resize = /** @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 - util.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 + util.getElementWidth(this.actionObj.clone) &&
-                        util.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;
                 }
             }
@@ -572,10 +574,10 @@ var Resize = /** @class */ (function (_super) {
                 }
                 else {
                     offsetLeft = 0;
-                    width = util.getElementWidth(this.actionObj.clone);
+                    width = this.parent.getElementWidth(this.actionObj.clone);
                 }
             }
-            var cloneWidth = Math.ceil(util.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 :

package/src/schedule/actions/touch.js

@@ -125,6 +125,7 @@ var ScheduleTouch = /** @class */ (function () {
                 this.parent.selectedElements = [];
                 this.parent.eventBase.getSelectedEventElements(target);
                 if (this.parent.resizeModule && closest(e.originalEvent.target, '.' + cls.EVENT_RESIZE_CLASS)) {
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
                     this.parent.resizeModule.resizeStart(e.originalEvent);
                 }
             }
@@ -211,6 +212,9 @@ var ScheduleTouch = /** @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(cls.TRANSLATE_CLASS)) {
+            return;
+        }
         removeClass([this.element], cls.TRANSLATE_CLASS);
         this.element.style.transitionDuration = '';
         this.element.style.transform = '';

package/src/schedule/actions/virtual-scroll.d.ts

@@ -16,6 +16,8 @@ export declare class VirtualScroll {
     isHorizontalScroll: boolean;
     isRemoteRefresh: boolean;
     private startIndex;
+    existingDataCollection: TdData[];
+    enableTransition: boolean;
     constructor(parent: Schedule);
     private addEventListener;
     private removeEventListener;
@@ -39,7 +41,11 @@ export declare class VirtualScroll {
     private getByIdCollection;
     private setStartEndIndex;
     updateContent(resWrap: HTMLElement, conWrap: HTMLElement, eventWrap: HTMLElement, resCollection: TdData[]): void;
+    private removeObsoleteRows;
     private updateHorizontalContent;
+    private updateMonthViewContent;
+    private updateOtherViewContent;
+    private mergeNewTdData;
     private getBufferCollection;
     private setTranslate;
     updateFocusedWorkCell(): void;