@syncfusion/ej2-treegrid 32.2.9 → 33.1.45

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

@@ -1,5 +1,5 @@
 import { Property, merge, ChildProperty, Collection, isNullOrUndefined, Browser, removeClass, addClass, getValue, createElement, setValue, extend as extend$1, Internationalization, getEnumValue, compile, Component, L10n, EventHandler, KeyboardEvents, SanitizeHtmlHelper, Complex, Event, NotifyPropertyChanges, closest, setStyleAttribute, select, classList, debounce, remove } from '@syncfusion/ej2-base';
-import { Grid, Logger as Logger$1, detailLists, Clipboard, getObject, parentsUntil, Print as Print$1, templateCompiler, appendChildren, extend, CellRenderer, getUid, CellType, Freeze as Freeze$1, getNumberFormat, getActualProperties, iterateArrayOrObject, RowDropSettings as RowDropSettings$1, Reorder as Reorder$1, Resize as Resize$1, Scroll, RowDD as RowDD$1, VirtualRowModelGenerator, Filter as Filter$1, Data, ExportHelper, ExcelExport as ExcelExport$1, PdfExport as PdfExport$1, Page as Page$1, Toolbar as Toolbar$1, calculateAggregate, Aggregate as Aggregate$1, Sort as Sort$1, ColumnMenu as ColumnMenu$1, ContextMenu as ContextMenu$1, resetRowIndex, Edit as Edit$1, CommandColumn as CommandColumn$1, DetailRow as DetailRow$1, Cell, getVisiblePage, VirtualContentRenderer, InterSectionObserver, getTransformValues, RenderType, VirtualHeaderRenderer, VirtualScroll as VirtualScroll$1, ColumnChooser as ColumnChooser$1, getRowIndexFromElement, RowRenderer, InfiniteScroll as InfiniteScroll$1 } from '@syncfusion/ej2-grids';
+import { Grid, Logger as Logger$1, detailLists, Clipboard, getObject, parentsUntil, Print as Print$1, templateCompiler, appendChildren, extend, CellRenderer, getUid, CellType, Freeze as Freeze$1, getNumberFormat, setEnableSeamlessScrolling, getActualProperties, iterateArrayOrObject, RowDropSettings as RowDropSettings$1, Reorder as Reorder$1, Resize as Resize$1, Scroll, RowDD as RowDD$1, VirtualRowModelGenerator, Filter as Filter$1, Data, ExportHelper, ExcelExport as ExcelExport$1, PdfExport as PdfExport$1, Page as Page$1, Toolbar as Toolbar$1, calculateAggregate, Aggregate as Aggregate$1, Sort as Sort$1, ColumnMenu as ColumnMenu$1, ContextMenu as ContextMenu$1, resetRowIndex, Edit as Edit$1, CommandColumn as CommandColumn$1, DetailRow as DetailRow$1, Cell, getVisiblePage, VirtualContentRenderer, InterSectionObserver, getTransformValues, RenderType, VirtualHeaderRenderer, VirtualScroll as VirtualScroll$1, ColumnChooser as ColumnChooser$1, getRowIndexFromElement, RowRenderer, InfiniteScroll as InfiniteScroll$1 } from '@syncfusion/ej2-grids';
 import { createCheckBox } from '@syncfusion/ej2-buttons';
 import { DataManager, ODataAdaptor, WebApiAdaptor, WebMethodAdaptor, CacheAdaptor, UrlAdaptor, Query, DataUtil, RemoteSaveAdaptor, Deferred, JsonAdaptor, Predicate as Predicate$1 } from '@syncfusion/ej2-data';
 import { showSpinner, hideSpinner, createSpinner } from '@syncfusion/ej2-popups';
@@ -2180,6 +2180,16 @@ var Render = /** @__PURE__ @class */ (function () {
         }
         var data = args.data;
         var parentData = data.parentItem;
+        if (!isNullOrUndefined(parentData) && data.isCollapsedChild && !isNullOrUndefined(args.row)) {
+            this.parent['toggleRowVisibility'](args.row, 'e-childrow-hidden');
+            var rowsObj = this.parent.grid.getRowsObject();
+            if (!this.parent.grid.isFrozenGrid() && !isNullOrUndefined(args.row.getAttribute('data-uid'))) {
+                var row = rowsObj.filter(function (e) { return e.uid === args.row.getAttribute('data-uid'); })[0];
+                if (row) {
+                    row.visible = false;
+                }
+            }
+        }
         if (!isNullOrUndefined(data.parentItem) && !isFilterChildHierarchy(this.parent) &&
             (!(this.parent.allowPaging && !(this.parent.pageSettings.pageSizeMode === 'Root')) ||
                 (isRemoteData(this.parent) && !isOffline(this.parent)))) {
@@ -2208,6 +2218,11 @@ var Render = /** @__PURE__ @class */ (function () {
         var summaryRow = getObject('isSummaryRow', args.data);
         if (summaryRow) {
             addClass([args.row], 'e-summaryrow');
+            var isDragandDropCell = args.row.querySelector('.e-rowdragdrop') || args.row.querySelector('.e-rowdragdrop.e-dragging');
+            if (isDragandDropCell) {
+                args.row.cells[0].className = 'e-rowcell e-summarycell';
+                args.row.cells[0].innerHTML = '';
+            }
         }
         if (!isNullOrUndefined(args.row)) {
             if (args.row.querySelector('.e-treegridexpand')) {
@@ -3311,7 +3326,6 @@ var DataManipulation = /** @__PURE__ @class */ (function () {
         var results = dataObj instanceof DataManager ? dataObj.dataSource.json : dataObj;
         var count = isCountRequired(this.parent) ? getValue('count', this.parent.dataSource)
             : results.length;
-        var qry = new Query();
         var gridQuery = getObject('query', args);
         var filterQuery;
         var searchQuery;
@@ -3327,11 +3341,7 @@ var DataManipulation = /** @__PURE__ @class */ (function () {
                 gridQuery = getValue('grid.renderModule.data', this.parent).filterQuery(gridQuery);
                 gridQuery = getValue('grid.renderModule.data', this.parent).searchQuery(gridQuery);
             }
-            var fltrQuery = gridQuery.queries.filter(function (q) { return q.fn === 'onWhere'; });
-            var srchQuery = gridQuery.queries.filter(function (q) { return q.fn === 'onSearch'; });
-            qry.queries = fltrQuery.concat(srchQuery);
-            var filteredData = new DataManager(results).executeLocal(qry);
-            this.parent.notify('updateFilterRecs', { data: filteredData });
+            this.parent.getData({ query: gridQuery, isFilter: true });
             results = this.dataResults.result;
             this.dataResults.result = null;
             if (this.parent.grid.aggregates.length > 0) {
@@ -3356,34 +3366,8 @@ var DataManipulation = /** @__PURE__ @class */ (function () {
         }
         if (this.parent.grid.sortSettings.columns.length > 0 || this.isSortAction) {
             this.isSortAction = false;
-            var parentData = this.parent.parentData;
             var query = getObject('query', args);
-            var srtQry = new Query();
-            for (var srt = this.parent.grid.sortSettings.columns.length - 1; srt >= 0; srt--) {
-                var getColumnByField = 'getColumnByField';
-                var col = this.parent.grid.renderModule.data["" + getColumnByField](this.parent.grid.
-                    sortSettings.columns[parseInt(srt.toString(), 10)].field);
-                var compFun = col.sortComparer && isOffline(this.parent) ?
-                    col.sortComparer.bind(col) :
-                    this.parent.grid.sortSettings.columns[parseInt(srt.toString(), 10)].direction;
-                srtQry.sortBy(this.parent.grid.sortSettings.columns[parseInt(srt.toString(), 10)].field, compFun);
-            }
-            var modifiedData = new DataManager(parentData).executeLocal(srtQry);
-            if (this.parent.allowRowDragAndDrop && !isNullOrUndefined(this.parent.rowDragAndDropModule['draggedRecord']) &&
-                this.parent.rowDragAndDropModule['droppedRecord'].hasChildRecords && this.parent.rowDragAndDropModule['dropPosition'] !== 'middleSegment') {
-                var dragdIndex = modifiedData.indexOf(this.parent.rowDragAndDropModule['draggedRecord']);
-                modifiedData.splice(dragdIndex, 1);
-                var dropdIndex = modifiedData.indexOf(this.parent.rowDragAndDropModule['droppedRecord']);
-                if (this.parent.rowDragAndDropModule['droppedRecord'].hasChildRecords && this.parent.rowDragAndDropModule['dropPosition'] === 'topSegment') {
-                    modifiedData.splice(dropdIndex, 0, this.parent.rowDragAndDropModule['draggedRecord']);
-                }
-                else if (this.parent.rowDragAndDropModule['dropPosition'] === 'bottomSegment') {
-                    modifiedData.splice(dropdIndex + 1, 0, this.parent.rowDragAndDropModule['draggedRecord']);
-                }
-            }
-            var sortArgs = { modifiedData: modifiedData, filteredData: results, srtQry: srtQry };
-            this.parent.notify('createSort', sortArgs);
-            results = sortArgs.modifiedData;
+            results = this.parent.getData({ query: query, isSort: true });
             this.dataResults.result = null;
             this.sortedData = results;
             this.parent.notify('updateModel', {});
@@ -4351,6 +4335,8 @@ var TreeGrid = /** @__PURE__ @class */ (function (_super) {
         _this.isComponentRefresh = false;
         _this.isVirtualExpandCollapse = false;
         _this.isInfiniteCollapse = false;
+        /** @hidden */
+        _this.enableSeamlessScrolling = false;
         _this.objectEqualityChecker = function (old, current) {
             if (old) {
                 var keys = Object.keys(old);
@@ -5098,7 +5084,15 @@ var TreeGrid = /** @__PURE__ @class */ (function (_super) {
         this.renderModule = new Render(this);
         this.dataModule = new DataManipulation(this);
         this.printModule = new Print(this);
-        this.trigger(load);
+        if (this.enableVirtualization || this.enableColumnVirtualization) {
+            var args = { enableSeamlessScrolling: this.enableSeamlessScrolling };
+            this.trigger(load, args);
+            this.enableSeamlessScrolling = args.enableSeamlessScrolling;
+            setEnableSeamlessScrolling(this.enableSeamlessScrolling);
+        }
+        else {
+            this.trigger(load);
+        }
         this.autoGenerateColumns();
         this.initialRender = true;
         if (!isNullOrUndefined(this.dataSource)) {
@@ -5371,6 +5365,7 @@ var TreeGrid = /** @__PURE__ @class */ (function (_super) {
         this.grid.clipMode = getActualProperties(this.clipMode);
         this.grid.enableColumnSpan = this.enableColumnSpan;
         this.grid.enableRowSpan = this.enableRowSpan;
+        this.grid.enableSeamlessScrolling = this.enableSeamlessScrolling;
         var templateInstance = 'templateDotnetInstance';
         this.grid["" + templateInstance] = this["" + templateInstance];
         var isJsComponent = 'isJsComponent';
@@ -5848,7 +5843,7 @@ var TreeGrid = /** @__PURE__ @class */ (function (_super) {
             }
             _this.notify('updateGridActions', args);
             _this.isVirtualExpandCollapse = false;
-            if (args.requestType === 'save' && _this.aggregates.map(function (ag) { return ag.showChildSummary === true; }).length) {
+            if (args.requestType === 'save' && _this.aggregates.some(function (ag) { return ag.showChildSummary === true; })) {
                 _this.grid.refresh();
             }
             if ((args.action === 'clearFilter' || args.action === 'clear-filter' || args.requestType === 'sorting') && _this.enableInfiniteScrolling) {
@@ -6594,6 +6589,115 @@ var TreeGrid = /** @__PURE__ @class */ (function (_super) {
             }
         }
     };
+    /**
+     * Retrieves all records that match the current search criteria and are sorted according to the active sort settings.
+     *
+     * This method processes the data source by applying search filters and sort operations,
+     * returning the searched and sorted records excluding summary rows.
+     *
+     * @param {Object} args - Optional arguments object to control query execution behavior.
+     * @param {Query} args.query - Optional custom Query object to override the default generated query.
+     * @param {boolean} args.isFilter - Optional flag to include only filtered records without sorting (default: false).
+     * @param {boolean} args.isSort - Optional flag to apply only sorting without filtering (default: false).
+     *
+     * @returns {ITreeData[]} - Array of searched and sorted TreeGrid records with summary rows excluded.
+     * @hidden
+     */
+    TreeGrid.prototype.getData = function (args) {
+        var dataObj = isCountRequired(this) ? getValue('result', this.grid.dataSource)
+            : this.grid.dataSource;
+        var results = dataObj instanceof DataManager ? dataObj.dataSource.json : dataObj;
+        var gridQuery = (!isNullOrUndefined(args) && args.query) ? args.query : this.getDataModule().baseModule.generateQuery();
+        var filterQuery;
+        var searchQuery;
+        if (!isNullOrUndefined(gridQuery)) {
+            filterQuery = gridQuery.queries.filter(function (q) { return q.fn === 'onWhere'; });
+            searchQuery = gridQuery.queries.filter(function (q) { return q.fn === 'onSearch'; });
+        }
+        var skipFilterSearch = (!isNullOrUndefined(args) && args.isSort);
+        if (!skipFilterSearch && (this.grid.allowFiltering && this.grid.filterSettings.columns.length) ||
+            (this.grid.searchSettings.key.length > 0) && (!isNullOrUndefined(gridQuery))
+            || ((filterQuery && filterQuery.length > 0) || (searchQuery && searchQuery.length > 0))) {
+            var filterQuery_1 = gridQuery.queries.filter(function (q) { return q.fn === 'onWhere'; });
+            var searchQuery_1 = gridQuery.queries.filter(function (q) { return q.fn === 'onSearch'; });
+            var query = new Query();
+            query.queries = filterQuery_1.concat(searchQuery_1);
+            var filteredData = new DataManager(results).executeLocal(query);
+            this.notify('updateFilterRecs', { data: filteredData });
+            results = isRemoteData(this) ? this.dataResults : this.filterModule.filteredResult;
+            if (!isNullOrUndefined(args) && args.isFilter) {
+                return isRemoteData(this) ? results.result.filter(function (item) { return !item.isSummaryRow; })
+                    : results.filter(function (item) { return !item.isSummaryRow; });
+            }
+        }
+        var sortQuery = gridQuery.queries.filter(function (q) { return q.fn === 'onSortBy'; });
+        if (this.grid.sortSettings.columns.length > 0 || sortQuery.length) {
+            var parentData = this.parentData;
+            var query = new Query();
+            query.queries = sortQuery;
+            var modifiedData = new DataManager(parentData).executeLocal(query);
+            if (this.allowRowDragAndDrop && !isNullOrUndefined(this.rowDragAndDropModule['draggedRecord']) &&
+                this.rowDragAndDropModule['droppedRecord'].hasChildRecords && this.rowDragAndDropModule['dropPosition'] !== 'middleSegment') {
+                var dragdIndex = modifiedData.indexOf(this.rowDragAndDropModule['draggedRecord']);
+                modifiedData.splice(dragdIndex, 1);
+                var dropdIndex = modifiedData.indexOf(this.rowDragAndDropModule['droppedRecord']);
+                if (this.rowDragAndDropModule['droppedRecord'].hasChildRecords && this.rowDragAndDropModule['dropPosition'] === 'topSegment') {
+                    modifiedData.splice(dropdIndex, 0, this.rowDragAndDropModule['draggedRecord']);
+                }
+                else if (this.rowDragAndDropModule['dropPosition'] === 'bottomSegment') {
+                    modifiedData.splice(dropdIndex + 1, 0, this.rowDragAndDropModule['draggedRecord']);
+                }
+            }
+            var sortArgs = { modifiedData: modifiedData, filteredData: results, srtQry: query };
+            this.notify('createSort', sortArgs);
+            results = isRemoteData(this) ? this.dataResults : sortArgs.modifiedData;
+        }
+        return isRemoteData(this) ? this.dataResults.result.filter(function (item) { return !item.isSummaryRow; })
+            : results.filter(function (item) { return !item.isSummaryRow; });
+    };
+    /**
+     * Retrieves the processed Tree Grid data based on current operations such as
+     * sorting, filtering, and searching. Maintains hierarchy and current structure.
+     *
+     * For local data: when skipPage is true (the default), it returns all available records;
+     * when skipPage is false, it returns only the records for the current page.
+     * For remote data: it always returns only the records for the current page.
+     *
+     * @param {boolean} skipPage - if set to false, returns only the records for the current page.
+     * @returns {ITreeData[]} - Array of tree records (summary rows excluded).
+     * @hidden
+     */
+    TreeGrid.prototype.getProcessedRecords = function (skipPage) {
+        var _this = this;
+        var result;
+        if (skipPage !== true || isRemoteData(this)) {
+            result = this.getData();
+            var dm = new DataManager(result);
+            var expanded = new Predicate$1('expanded', 'notequal', null).or('expanded', 'notequal', undefined);
+            var parents_1 = dm.executeLocal(new Query().where(expanded));
+            var visualData = parents_1.filter(function (e) {
+                return getExpandStatus(_this, e);
+            });
+            var query = new Query();
+            if (this.allowPaging || this.enableVirtualization || this.enableInfiniteScrolling) {
+                var pageSize = this.grid.pageSettings.pageSize;
+                var currentPage = this.grid.pageSettings.currentPage;
+                if (visualData.length < (currentPage * pageSize)) {
+                    currentPage = (Math.floor(visualData.length / pageSize)) + ((visualData.length % pageSize) ? 1 : 0);
+                    currentPage = currentPage ? currentPage : 1;
+                    this.grid.setProperties({ pageSettings: { currentPage: currentPage } }, true);
+                }
+                var skip = pageSize * (currentPage - 1);
+                query = query.skip(skip).take(pageSize);
+            }
+            dm.dataSource.json = visualData;
+            result = dm.executeLocal(query);
+        }
+        else {
+            result = this.getData();
+        }
+        return result;
+    };
     /**
      * Retrieves all the TreeGrid row elements.
      *
@@ -10010,8 +10114,10 @@ var RowDD = /** @__PURE__ @class */ (function () {
                 var record = this.getChildrecordsByParentID(droppedRecord.parentUniqueID)[0];
                 var childRecords = record.childRecords;
                 for (var i = 0; i < childRecords.length; i++) {
-                    droppedRecord.parentItem.taskData[this.parent.childMapping][parseInt(i.toString(), 10)]
-                        = childRecords[parseInt(i.toString(), 10)].taskData;
+                    if (!isNullOrUndefined(childRecords[parseInt(i.toString(), 10)].taskData)) {
+                        droppedRecord.parentItem.taskData[this.parent.childMapping][parseInt(i.toString(), 10)]
+                            = childRecords[parseInt(i.toString(), 10)].taskData;
+                    }
                 }
             }
         }
@@ -10597,6 +10703,11 @@ var RowDD = /** @__PURE__ @class */ (function () {
      * @returns {void} This function does not return a value.
      */
     RowDD.prototype.rowDropped = function (args) {
+        if (!isNullOrUndefined(this.parent.aggregates[0]) && this.parent.aggregates[0].showChildSummary) {
+            var records = this.parent.grid.getCurrentViewRecords();
+            args.fromIndex = records[args.fromIndex].index;
+            args.dropIndex = records[args.dropIndex].index;
+        }
         var tObj = this.parent;
         var parentItem = 'parentItem';
         if (!tObj.rowDropSettings.targetID) {
@@ -10821,10 +10932,16 @@ var RowDD = /** @__PURE__ @class */ (function () {
             var droppedRecord = void 0;
             if (isNullOrUndefined(args.dropIndex)) {
                 var primaryKeyField = this.parent.getPrimaryKeyFieldNames()[0];
-                var rowIndex = tObj.selectedRowIndex === -1 ?
+                var rowIndex_1 = tObj.selectedRowIndex === -1 ?
                     (this.parent.grid.getRowIndexByPrimaryKey(args.data[0]["" + primaryKeyField])) - 1
                     : tObj.getSelectedRowIndexes()[0] - 1;
-                var record = tObj.getCurrentViewRecords()[parseInt(rowIndex.toString(), 10)];
+                var record = void 0;
+                if (this.parent.enableVirtualization) {
+                    record = tObj.getCurrentViewRecords().find(function (e) { return e.index === rowIndex_1; });
+                }
+                else {
+                    record = tObj.getCurrentViewRecords()[parseInt(rowIndex_1.toString(), 10)];
+                }
                 this.getParentData(record, args.data);
             }
             else {
@@ -11640,6 +11757,25 @@ var Filter = /** @__PURE__ @class */ (function () {
         if (this.flatFilteredData.length > 0 && this.isHierarchyFilter) {
             this.updateFilterLevel();
         }
+        var _loop_1 = function (i) {
+            var record = this_1.filteredResult[parseInt(i.toString(), 10)];
+            if (!isNullOrUndefined(record.parentItem)) {
+                var parentUID_1 = record.parentItem.uniqueID;
+                var parentPresent = this_1.filteredResult.some(function (r) {
+                    return !isNullOrUndefined(r.uniqueID) && r.uniqueID === parentUID_1;
+                });
+                if (parentPresent) {
+                    record.isCollapsedChild = !getExpandStatus(this_1.parent, record, this_1.parent.parentData);
+                }
+                else {
+                    record.isCollapsedChild = false;
+                }
+            }
+        };
+        var this_1 = this;
+        for (var i = 0; i < this.filteredResult.length; i++) {
+            _loop_1(i);
+        }
         this.parent.notify('updateAction', { result: this.filteredResult });
     };
     Filter.prototype.updateParentFilteredRecord = function (record) {
@@ -13360,7 +13496,7 @@ var BatchEdit = /** @__PURE__ @class */ (function () {
                         added.childRecords = [];
                         this.batchRecords.splice(added.index, 0, added);
                         this.currentViewRecords.splice(added.index, 0, added);
-                        if (currentDataIndex) {
+                        if (currentDataIndex > -1) {
                             indexvalue = currentDataIndex;
                         }
                         else {
@@ -13998,6 +14134,9 @@ var Edit = /** @__PURE__ @class */ (function () {
                 }
             }
         }
+        if (eventName === 'actionComplete' && eventArgs.requestType === 'save') {
+            this.addRowRecord = null;
+        }
         if (this.parent.enableInfiniteScrolling && eventName === 'actionComplete') {
             this.infiniteAddAction(eventArgs);
         }
@@ -15299,7 +15438,11 @@ var VirtualTreeContentRenderer = /** @__PURE__ @class */ (function (_super) {
             && this.parent.dataSource.dataSource.offline && this.parent.dataSource.dataSource.url !== '') || !isCountRequired(this.parent)) {
             this.parent["" + action]('data-ready', this.onDataReady, this);
             this.parent["" + action]('refresh-virtual-block', this.refreshContentRows, this);
+            this.parent.on(destroy, this.destroy, this);
             this.fn = function () {
+                if (_this.parent.root.enableSeamlessScrolling) {
+                    window.addEventListener('resize', _this.updateScrollbar.bind(_this));
+                }
                 _this.observers.observes(function (scrollArgs) { return _this.scrollListeners(scrollArgs); }, _this.onEnteredAction(), _this.parent);
                 var gObj = _this.parent;
                 if (gObj.root.enablePersistence && gObj.root.scrollPosition) {
@@ -15349,6 +15492,10 @@ var VirtualTreeContentRenderer = /** @__PURE__ @class */ (function (_super) {
         var virtualCellFocus = 'virtualCellFocus';
         _super.prototype["" + virtualCellFocus].call(this, e);
     };
+    VirtualTreeContentRenderer.prototype.updateScrollbar = function () {
+        var updateScrollbarOnResize = 'updateScrollbarOnResize';
+        _super.prototype["" + updateScrollbarOnResize].call(this);
+    };
     /**
      * Handles the data ready event for the virtual tree grid content renderer.
      *
@@ -15389,9 +15536,6 @@ var VirtualTreeContentRenderer = /** @__PURE__ @class */ (function (_super) {
         _super.prototype.renderTable.call(this);
         if (!(this.parent.dataSource instanceof DataManager && this.parent.dataSource.dataSource.url !== undefined
             && this.parent.dataSource.dataSource.offline && this.parent.dataSource.dataSource.url !== '') || !isCountRequired(this.parent)) {
-            if (this.observers) {
-                this.observers.disconnect();
-            }
             getValue('observer', this).options.debounceEvent = false;
             this.observers = new TreeInterSectionObserver(getValue('observer', this).element, getValue('observer', this).options);
             this.contents = this.getPanel().firstChild;
@@ -15472,7 +15616,7 @@ var VirtualTreeContentRenderer = /** @__PURE__ @class */ (function (_super) {
         }
         var treeGridParent = this.parent.clipboardModule['treeGridParent'];
         if (isNullOrUndefined(treeGridParent.editModule) ||
-            isNullOrUndefined(treeGridParent.editModule['addRowIndex']) || args.selectedIndex !== 0) {
+            isNullOrUndefined(treeGridParent.editModule['addRowIndex']) || args.selectedIndex !== -1) {
             if (!isNullOrUndefined(treeGridParent.grid.sortModule) && treeGridParent.grid.sortModule['sortedColumns'].length > 0) {
                 var sortedData = treeGridParent.dataModule['sortedData'];
                 if (!isNullOrUndefined(sortedData) && sortedData.length > 0) {
@@ -15772,16 +15916,28 @@ var VirtualTreeContentRenderer = /** @__PURE__ @class */ (function (_super) {
                     var maxLeft = _this.vgenerator.cOffsets[idx - 1];
                     x = x > maxLeft ? maxLeft : x; //TODO: This fix horizontal scrollbar jumping issue in column virtualization.
                 }
-                var y = _this.getTranslateY(e.top, height, xAxis && top_1 === e.top ? _this.prevInfo : undefined, true);
+                var isRowScrollAction = _this.prevInfo && _this.prevInfo.page === 1 &&
+                    (direction !== _this.prevInfo.direction || direction !== _this.prevInfo.direction);
+                var translateY = _this.getTranslateY(e.top, height, xAxis && top_1 === e.top ? _this.prevInfo : undefined, isRowScrollAction ? false : true);
                 if (!_this.parent.isFrozenGrid() || _this.parent.enableVirtualMaskRow) {
                     if (_this.parent.enableVirtualMaskRow) {
                         var upScroll = (e.top - _this.translateY) < 0;
-                        y = (Math.round(_this.translateY) > y && !upScroll) ? Math.round(_this.translateY) : y;
-                        _this.virtualEle.adjustTable(x, y);
+                        translateY = (Math.round(_this.translateY) > translateY && !upScroll) ? Math.round(_this.translateY) : translateY;
+                        _this.virtualEle.adjustTable(x, translateY);
                     }
                     else {
                         _this.virtualEle.adjustTable(x, _this.translateY);
                     }
+                    var wrapperBottom = _this.virtualEle.wrapper.getBoundingClientRect().bottom;
+                    var contentBottom = _this.virtualEle.content.getBoundingClientRect().bottom;
+                    if (direction === 'up' && _this.prevInfo.page === Math.ceil(_this.getTotalBlocks() / 2) &&
+                        Math.round(wrapperBottom) < Math.round(contentBottom)) {
+                        var bottomGap = Math.round(contentBottom) - Math.round(wrapperBottom);
+                        var adjustedTranslateY = Math.min(translateY + bottomGap, _this.offsets[_this['maxBlock']]);
+                        if (adjustedTranslateY !== translateY) {
+                            _this.virtualEle.adjustTable(x, adjustedTranslateY);
+                        }
+                    }
                     if (_this.parent.enableColumnVirtualization) {
                         _this.header.virtualEle.adjustTable(x, 0);
                         if (_this.parent.isFrozenGrid()) {
@@ -16110,10 +16266,17 @@ var VirtualTreeContentRenderer = /** @__PURE__ @class */ (function (_super) {
         this.parent.off('refresh-virtual-editform-cells', this.refreshCell);
         this.parent.off('virtaul-cell-focus', this.cellFocus);
         this.parent.off('virtual-scroll-edit', this.restoreEditState);
-        if (this.observers) {
-            this.observers.disconnect();
+        this.parent.off(destroy, this.destroy);
+        if (this.parent.root.enableSeamlessScrolling) {
+            window.removeEventListener('resize', this.updateScrollbar);
         }
     };
+    VirtualTreeContentRenderer.prototype.destroy = function () {
+        if (this.parent.isDestroyed) {
+            return;
+        }
+        this.removeEventListener();
+    };
     return VirtualTreeContentRenderer;
 }(VirtualContentRenderer));
 var TreeInterSectionObserver = /** @__PURE__ @class */ (function (_super) {
@@ -16126,6 +16289,9 @@ var TreeInterSectionObserver = /** @__PURE__ @class */ (function (_super) {
         _this.timer = 0;
         return _this;
     }
+    TreeInterSectionObserver.prototype.onWheelEvent = function () {
+        this.isWheeling = true;
+    };
     /**
      * Sets up observers to monitor scroll events on a given container
      * and its movable companion within a virtual grid setup.
@@ -16138,28 +16304,28 @@ var TreeInterSectionObserver = /** @__PURE__ @class */ (function (_super) {
     TreeInterSectionObserver.prototype.observes = function (callback, onEnterCallback, instance) {
         var containerRect = 'containerRect';
         _super.prototype["" + containerRect] = getValue('options', this).container.getBoundingClientRect();
-        this.containerEl = getValue('options', this).container;
-        this.containerScrollHandler = this.virtualScrollHandlers(callback, onEnterCallback, instance);
-        EventHandler.add(this.containerEl, 'scroll', this.containerScrollHandler, this);
-        if (getValue('options', this).movableContainer) {
-            var movableContainerRect = 'movableContainerRect';
-            _super.prototype["" + movableContainerRect] = getValue('options', this).movableContainer.getBoundingClientRect();
-            this.movableContainerEl = getValue('options', this).movableContainer;
-            this.movableScrollHandler = this.virtualScrollHandlers(callback, onEnterCallback, instance);
-            EventHandler.add(this.movableContainerEl, 'scroll', this.movableScrollHandler, this);
-        }
-    };
-    TreeInterSectionObserver.prototype.disconnect = function () {
-        if (this.containerEl && this.containerScrollHandler) {
-            EventHandler.remove(this.containerEl, 'scroll', this.containerScrollHandler);
-            this.containerScrollHandler = null;
+        var options = getValue('options', this);
+        EventHandler.add(options.container, 'wheel', this.onWheelEvent, this);
+        if (!isNullOrUndefined(options.horizontalScrollbar)) {
+            EventHandler.add(options.horizontalScrollbar, 'wheel', this.onWheelEvent, this);
+            EventHandler.add(options.horizontalScrollbar, 'scroll', this.onVirtualContentScrolling(), this);
         }
-        if (this.movableContainerEl && this.movableScrollHandler) {
-            EventHandler.remove(this.movableContainerEl, 'scroll', this.movableScrollHandler);
-            this.movableScrollHandler = null;
+        if (!isNullOrUndefined(options.verticalScrollbar)) {
+            EventHandler.add(options.verticalScrollbar, 'wheel', this.onWheelEvent, this);
+            EventHandler.add(options.verticalScrollbar, 'scroll', this.onVirtualContentScrolling(), this);
         }
-        this.containerEl = null;
-        this.movableContainerEl = null;
+        EventHandler.add(options.container, 'scroll', this.virtualScrollHandlers(callback, onEnterCallback, instance), this);
+    };
+    TreeInterSectionObserver.prototype.onVirtualContentScrolling = function () {
+        var _this = this;
+        return function (e) {
+            if (e.target.classList.contains('e-virtual-vertical-scrollbar')) {
+                getValue('options', _this).container.scrollTop = e.target.scrollTop;
+            }
+            if (e.target.classList.contains('e-virtual-horizontal-scrollbar')) {
+                getValue('options', _this).container.scrollLeft = e.target.scrollLeft;
+            }
+        };
     };
     /**
      * Clears the last known position.
@@ -16205,6 +16371,12 @@ var TreeInterSectionObserver = /** @__PURE__ @class */ (function (_super) {
             direction = _this["" + options].prevLeft === left ? direction : _this["" + options].prevLeft < left ? 'right' : 'left';
             _this["" + options].prevTop = top;
             _this["" + options].prevLeft = left;
+            if (!isNullOrUndefined(_this["" + options].verticalScrollbar)) {
+                _this["" + options].verticalScrollbar.scrollTop = _this["" + options].container.scrollTop;
+            }
+            if (!isNullOrUndefined(_this["" + options].horizontalScrollbar)) {
+                _this["" + options].horizontalScrollbar.scrollLeft = _this["" + options].container.scrollLeft;
+            }
             var current = _this.sentinelInfo["" + direction];
             var delta = 0;
             _this.newPos = top;
@@ -16384,7 +16556,8 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
         var dm = new DataManager(pageingDetails.result);
         var expanded = new Predicate$1('expanded', 'notequal', null).or('expanded', 'notequal', undefined);
         var parents = dm.executeLocal(new Query().where(expanded));
-        var isFiltering = pageingDetails.actionArgs.requestType === 'filtering';
+        var isFiltering = (pageingDetails.actionArgs.requestType === 'filtering' && pageingDetails.actionArgs.action !== 'clear-filter') ||
+            (!isNullOrUndefined(this.parent['filterModule']) && (this.parent['filterModule'].filteredResult && this.parent['filterModule'].filteredResult.length > 0));
         var isFlatHierarchy = this.parent.filterSettings.hierarchyMode === 'Child' ||
             this.parent.filterSettings.hierarchyMode === 'None';
         var visualData = isFiltering && isFlatHierarchy