@syncfusion/ej2-treegrid 20.2.46 → 20.3.47

package/dist/global/index.d.ts

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

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-treegrid@*",
-  "_id": "@syncfusion/ej2-treegrid@20.2.45",
+  "_id": "@syncfusion/ej2-treegrid@20.4.3",
   "_inBundle": false,
-  "_integrity": "sha512-DHlvVmftx1FJ8oOvYex8mPsEs5UaO1OOLy3HBjPD7VzRakVp0MXfuuL1fjGxdIBgfgxnm2BdZbpoaMKBpocj4w==",
+  "_integrity": "sha512-7aLSdNf8+b6TlRdFServ47CFnkLWCRjwuU24Bilr2Rrvqn+XSdL5UxLTIPB0pCb8vH2U52sVLFDlfblpLRfC+Q==",
   "_location": "/@syncfusion/ej2-treegrid",
   "_phantomChildren": {},
   "_requested": {
@@ -24,8 +24,8 @@
     "/@syncfusion/ej2-react-treegrid",
     "/@syncfusion/ej2-vue-treegrid"
   ],
-  "_resolved": "http://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-treegrid/-/ej2-treegrid-20.2.45.tgz",
-  "_shasum": "51398d20b4de093ab6ff0a38f58fd0d30db95247",
+  "_resolved": "http://nexus.syncfusion.com/repository/ej2-release/@syncfusion/ej2-treegrid/-/ej2-treegrid-20.4.3.tgz",
+  "_shasum": "30d76503766adfbcd5aed10e0f881609dc0c34e6",
   "_spec": "@syncfusion/ej2-treegrid@*",
   "_where": "/jenkins/workspace/automation_release_19.1.0.1-ZPMUBNQ6AUYH6YGEFBPVYMEQLRRW2SLD4XCZ6GATNZJFYJ3RIAOA/packages/included",
   "author": {
@@ -36,15 +36,15 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~20.2.46",
-    "@syncfusion/ej2-data": "~20.2.45",
-    "@syncfusion/ej2-grids": "~20.2.46",
-    "@syncfusion/ej2-popups": "~20.2.45"
+    "@syncfusion/ej2-base": "~20.3.47",
+    "@syncfusion/ej2-data": "~20.3.47",
+    "@syncfusion/ej2-grids": "~20.3.47",
+    "@syncfusion/ej2-popups": "~20.3.47"
   },
   "deprecated": false,
   "description": "Essential JS 2 TreeGrid Component",
   "devDependencies": {},
-  "es2015": "./dist/es6/ej2-treegrid.es2015.js",
+  "es2015": "./dist/es6/ej2-treegrid.es5.js",
   "homepage": "https://github.com/syncfusion/ej2-treegrid#readme",
   "keywords": [
     "ej2",
@@ -60,6 +60,6 @@
     "url": "git+https://github.com/syncfusion/ej2-treegrid.git"
   },
   "typings": "index.d.ts",
-  "version": "20.2.46",
+  "version": "20.3.47",
   "sideEffects": false
 }

package/src/treegrid/actions/clipboard.d.ts

@@ -2,7 +2,7 @@
  * clipboard.ts file
  */
 import { TreeGrid } from '../base/treegrid';
-import { Clipboard as GridClipboard } from '@syncfusion/ej2-grids';
+import { Clipboard as GridClipboard, ServiceLocator } from '@syncfusion/ej2-grids';
 /**
  * The `Clipboard` module is used to handle clipboard copy action.
  *
@@ -12,7 +12,8 @@ export declare class TreeClipboard extends GridClipboard {
     private treeGridParent;
     private treeCopyContent;
     private copiedUniqueIdCollection;
-    constructor(parent?: TreeGrid);
+    protected serviceLocator: ServiceLocator;
+    constructor(parent?: TreeGrid, serviceLocator?: ServiceLocator);
     protected setCopyData(withHeader?: boolean): void;
     private parentContentData;
     copy(withHeader?: boolean): void;

package/src/treegrid/actions/clipboard.js

@@ -21,11 +21,12 @@ import { Clipboard as GridClipboard } from '@syncfusion/ej2-grids';
  */
 var TreeClipboard = /** @class */ (function (_super) {
     __extends(TreeClipboard, _super);
-    function TreeClipboard(parent) {
-        var _this = _super.call(this, parent.grid) || this;
+    function TreeClipboard(parent, serviceLocator) {
+        var _this = _super.call(this, parent.grid, serviceLocator) || this;
         _this.treeCopyContent = '';
         _this.copiedUniqueIdCollection = [];
         _this.treeGridParent = parent;
+        _this.serviceLocator = serviceLocator;
         return _this;
     }
     TreeClipboard.prototype.setCopyData = function (withHeader) {

package/src/treegrid/actions/context-menu.js

@@ -36,7 +36,7 @@ var ContextMenu = /** @class */ (function () {
         var indent = select('#' + this.parent.element.id + '_gridcontrol_cmenu_Indent', args.element);
         var outdent = select('#' + this.parent.element.id + '_gridcontrol_cmenu_Outdent', args.element);
         if (addRow) {
-            if (this.parent.grid.editSettings.allowAdding === false) {
+            if (this.parent.grid.editSettings.allowAdding === false || this.parent.grid.isEdit) {
                 addRow.style.display = 'none';
             }
             else {

package/src/treegrid/actions/crud-actions.js

@@ -306,6 +306,10 @@ export function updateParentRow(key, record, action, control, isSelfReference, c
             index_1 = i;
             return;
         } });
+        if (control.enableVirtualization && isNullOrUndefined(index_1)) {
+            var updatedParent = getValue('uniqueIDCollection.' + child.parentUniqueID, control);
+            record = updatedParent;
+        }
         if (!isNullOrUndefined(index_1)) {
             record = currentRecords[index_1];
         }

package/src/treegrid/actions/edit.js

@@ -313,6 +313,9 @@ var Edit = /** @class */ (function () {
                 args.cancel = true;
             }
         }
+        if (this.parent.enableVirtualization) {
+            this.parent.grid.contentModule['editedRowIndex'] = this.parent.grid.editModule.editModule['index'];
+        }
         // if (this.isAdd && this.parent.editSettings.mode === 'Batch' && !args.cell.parentElement.classList.contains('e-insertedrow')) {
         //   this.isAdd = false;
         // }
@@ -432,6 +435,9 @@ var Edit = /** @class */ (function () {
                 this.parent.grid.isEdit = true;
             }
         }
+        if (this.parent.enableVirtualization) {
+            this.parent.grid.contentModule['virtualData'] = {};
+        }
     };
     Edit.prototype.afterCellSave = function (args, row, rowIndex) {
         var mRow;
@@ -681,7 +687,12 @@ var Edit = /** @class */ (function () {
                 if (isVirtualization) {
                     this.prevAriaRowIndex = '-1';
                 }
-                focussedElement.focus();
+                if (!this.parent.enableVirtualization || this.parent.enableVirtualization && !Object.keys(this.parent.grid.contentModule['emptyRowData']).length) {
+                    focussedElement.focus();
+                }
+                if (this.parent.enableVirtualization && !Object.keys(this.parent.grid.contentModule['emptyRowData']).length) {
+                    this.parent.grid.contentModule['createEmptyRowdata']();
+                }
             }
         }
         if (this.parent.editSettings.mode === 'Batch' && !isNullOrUndefined(this.addRowIndex) && this.addRowIndex !== -1 && this['isAddedRowByMethod'] && !this.isAddedRowByContextMenu) {
@@ -805,6 +816,9 @@ var Edit = /** @class */ (function () {
             }
             if (this.isAddedRowByMethod && (this.parent.enableVirtualization || this.parent.enableInfiniteScrolling)) {
                 this.addRowRecord = this.parent.flatData[this.parent.grid.selectedRowIndex];
+                if (this.parent.enableVirtualization && this.isAddedRowByContextMenu) {
+                    this.addRowRecord = this.parent.getCurrentViewRecords()[this.addRowIndex];
+                }
             }
             else {
                 this.addRowRecord = this.parent.getSelectedRecords()[0];
@@ -841,15 +855,18 @@ var Edit = /** @class */ (function () {
             var position = null;
             value.taskData = isNullOrUndefined(value.taskData) ? extend({}, args.data) : value.taskData;
             var currentData = void 0;
-            if (this.parent.editSettings.mode === 'Batch' && this['isAddedRowByMethod'] && !isNullOrUndefined(this.addRowIndex)) {
+            if (this.parent.enableVirtualization && args.index !== 0) {
+                currentData = this.parent.flatData;
+            }
+            else if (this.parent.editSettings.mode === 'Batch' && this['isAddedRowByMethod'] && !isNullOrUndefined(this.addRowIndex)) {
                 currentData = this.batchEditModule['batchRecords'];
             }
             else {
                 currentData = this.parent.grid.getCurrentViewRecords();
             }
             if (this.parent.enableVirtualization && args.index !== 0) {
-                this.addRowIndex = this.parent.grid.getCurrentViewRecords().indexOf(this.addRowRecord);
-                this.selectedIndex = parseInt(this.parent.getRows()[this.addRowIndex].getAttribute('data-rowindex'), 10);
+                this.addRowIndex = this.parent.flatData.indexOf(this.addRowRecord);
+                this.selectedIndex = this.addRowIndex;
             }
             var index = this.addRowIndex;
             value.uniqueID = getUid(this.parent.element.id + '_data_');
@@ -863,7 +880,8 @@ var Edit = /** @class */ (function () {
             var rows = this.parent.getRows();
             var firstAriaIndex = rows.length ? currentData.indexOf(currentData[0]) : 0;
             var lastAriaIndex = rows.length ? +rows[rows.length - 1].getAttribute('data-rowindex') : 0;
-            var withinRange = this.selectedIndex >= firstAriaIndex && this.selectedIndex <= lastAriaIndex;
+            var withinRange = this.parent.enableVirtualization && args.index !== 0 ? true :
+                this.selectedIndex >= firstAriaIndex && this.selectedIndex <= lastAriaIndex;
             if (currentData.length) {
                 idMapping = currentData[this.addRowIndex][this.parent.idMapping];
                 parentIdMapping = currentData[this.addRowIndex][this.parent.parentIdMapping];

package/src/treegrid/actions/filter.js

@@ -155,10 +155,6 @@ var Filter = /** @class */ (function () {
                     }
                 }
                 else {
-                    if ((!this.parent.enableCollapseAll || !this.parent.initialRender && isNullOrUndefined(this.parent['dataResults']['result']))
-                        && parent['expanded'] === false && this.parent.getVisibleRecords().indexOf(record) === -1) {
-                        this.parent.expandRow(this.parent.getRows()[parent['index']], parent);
-                    }
                     this.addParentRecord(parent);
                 }
             }

package/src/treegrid/actions/freeze-column.d.ts

@@ -14,6 +14,7 @@ export declare class Freeze {
     constructor(parent?: TreeGrid);
     addEventListener(): void;
     removeEventListener(): void;
+    protected instantiateRenderer(): void;
     private rowExpandCollapse;
     private dblClickHandler;
     private dataBoundArg;

package/src/treegrid/actions/freeze-column.js

@@ -1,6 +1,7 @@
-import { parentsUntil } from '@syncfusion/ej2-grids';
+import { ColumnFreezeContentRenderer, ColumnFreezeHeaderRenderer, FreezeContentRender, FreezeRender, parentsUntil, RenderType } from '@syncfusion/ej2-grids';
 import { Grid, Freeze as FreezeColumn } from '@syncfusion/ej2-grids';
-import { addClass } from '@syncfusion/ej2-base';
+import { addClass, getValue } from '@syncfusion/ej2-base';
+import { ColumnVirtualTreeFreezeRenderer, VirtualTreeFreezeRenderer, VirtualTreeFreezeHdrRenderer } from '../renderer/virtual-tree-freeze-render';
 /**
  * TreeGrid Freeze module
  *
@@ -21,6 +22,7 @@ var Freeze = /** @class */ (function () {
         this.parent.on('rowExpandCollapse', this.rowExpandCollapse, this);
         this.parent.on('dataBoundArg', this.dataBoundArg, this);
         this.parent.grid.on('dblclick', this.dblClickHandler, this);
+        this.parent.grid.on('initial-load', this.instantiateRenderer, this);
     };
     Freeze.prototype.removeEventListener = function () {
         if (this.parent.isDestroyed) {
@@ -29,6 +31,40 @@ var Freeze = /** @class */ (function () {
         this.parent.off('rowExpandCollapse', this.rowExpandCollapse);
         this.parent.off('dataBoundArg', this.dataBoundArg);
         this.parent.grid.off('dblclick', this.dblClickHandler);
+        this.parent.grid.off('initial-load', this.instantiateRenderer);
+    };
+    Freeze.prototype.instantiateRenderer = function () {
+        var renderer = getValue('serviceLocator', this.parent.grid).getService('rendererFactory');
+        if (this.parent.getFrozenColumns()) {
+            if (this.parent.enableColumnVirtualization) {
+                getValue('addRenderer', renderer)
+                    .apply(renderer, [RenderType.Header, new VirtualTreeFreezeHdrRenderer(getValue('grid', this.parent), getValue('serviceLocator', this.parent.grid))]);
+            }
+            else {
+                getValue('addRenderer', renderer)
+                    .apply(renderer, [RenderType.Header, new FreezeRender(getValue('grid', this.parent), getValue('serviceLocator', this.parent.grid))]);
+            }
+            if (this.parent.enableVirtualization) {
+                getValue('addRenderer', renderer)
+                    .apply(renderer, [RenderType.Content, new VirtualTreeFreezeRenderer(getValue('grid', this.parent), getValue('serviceLocator', this.parent.grid))]);
+            }
+            else {
+                getValue('addRenderer', renderer)
+                    .apply(renderer, [RenderType.Content, new FreezeContentRender(getValue('grid', this.parent), getValue('serviceLocator', this.parent.grid))]);
+            }
+        }
+        if (this.parent.getFrozenLeftColumnsCount() || this.parent.getFrozenRightColumnsCount()) {
+            getValue('addRenderer', renderer)
+                .apply(renderer, [RenderType.Header, new ColumnFreezeHeaderRenderer(getValue('grid', this.parent), getValue('serviceLocator', this.parent.grid))]);
+            if (this.parent.enableVirtualization) {
+                getValue('addRenderer', renderer)
+                    .apply(renderer, [RenderType.Content, new ColumnVirtualTreeFreezeRenderer(getValue('grid', this.parent), getValue('serviceLocator', this.parent.grid))]);
+            }
+            else {
+                getValue('addRenderer', renderer)
+                    .apply(renderer, [RenderType.Content, new ColumnFreezeContentRenderer(getValue('grid', this.parent), getValue('serviceLocator', this.parent.grid))]);
+            }
+        }
     };
     Freeze.prototype.rowExpandCollapse = function (args) {
         var movableRows = this.parent.getMovableDataRows();
@@ -73,7 +109,7 @@ var Freeze = /** @class */ (function () {
     };
     Freeze.prototype.dblClickHandler = function (e) {
         if (parentsUntil(e.target, 'e-rowcell') &&
-            this.parent.grid.editSettings.allowEditOnDblClick && this.parent.editSettings.mode !== 'Cell') {
+            this.parent.grid.editSettings.allowEditOnDblClick && this.parent.editSettings.mode !== 'Cell' && (!e.target['classList'].contains('e-treegridcollapse') && !e.target['classList'].contains('e-treegridexpand'))) {
             this.parent.grid.editModule.startEdit(parentsUntil(e.target, 'e-row'));
         }
     };

package/src/treegrid/actions/rowdragdrop.js

@@ -183,13 +183,16 @@ var RowDD = /** @class */ (function () {
                     for (var i = 0; i < tObj.getCurrentViewRecords().length; i++) {
                         if (tObj.getCurrentViewRecords()[i].taskData === record_1.parentItem.taskData) {
                             dropIndex = i;
+                            if (tObj.enableVirtualization) {
+                                dropIndex = parseInt(tObj.getRows()[i].getAttribute('data-rowindex'), 10);
+                            }
                         }
                     }
                 }
                 else {
                     dropIndex = this.selectedRow.rowIndex - 1;
                 }
-                if (this.parent.enableVirtualization && this.parent.allowRowDragAndDrop && this.selectedRecord) {
+                if (this.parent.enableVirtualization && this.selectedRecord && !(record_1.level > this.selectedRecord.level)) {
                     dropIndex = parseInt(this.selectedRow.getAttribute('data-rowindex'), 10) - 1;
                 }
                 tObj[action] = 'indenting';
@@ -204,11 +207,11 @@ var RowDD = /** @class */ (function () {
                 var dropIndex = void 0;
                 var parentItem = this.selectedRecord.parentItem;
                 for (var i = 0; i < tObj.getCurrentViewRecords().length; i++) {
-                    if (tObj.getCurrentViewRecords()[i].taskData === parentItem.taskData) {
+                    if (tObj.getCurrentViewRecords()[i].uniqueID === parentItem.uniqueID) {
                         dropIndex = i;
                     }
                 }
-                if (this.parent.enableVirtualization && this.parent.allowRowDragAndDrop && this.selectedRecord) {
+                if (this.parent.enableVirtualization && this.selectedRecord) {
                     dropIndex = parseInt(this.parent.getRows()[dropIndex].getAttribute('data-rowindex'), 10);
                 }
                 tObj[action] = 'outdenting';
@@ -228,7 +231,7 @@ var RowDD = /** @class */ (function () {
         this.parent.trigger(events.actionBegin, actionArgs, function (actionArgs) {
             if (!actionArgs.cancel) {
                 if (actionArgs.action === 'indenting') {
-                    if (_this.parent.enableVirtualization && _this.parent.allowRowDragAndDrop) {
+                    if (_this.parent.enableVirtualization) {
                         _this.reorderRows([parseInt(_this.selectedRow.getAttribute('data-rowindex'), 10)], dropIndex, 'child');
                     }
                     else {
@@ -236,7 +239,7 @@ var RowDD = /** @class */ (function () {
                     }
                 }
                 else if (actionArgs.action === 'outdenting') {
-                    if (_this.parent.enableVirtualization && _this.parent.allowRowDragAndDrop) {
+                    if (_this.parent.enableVirtualization) {
                         _this.reorderRows([parseInt(_this.selectedRow.getAttribute('data-rowindex'), 10)], dropIndex, 'below');
                     }
                     else {

package/src/treegrid/actions/selection.js

@@ -266,6 +266,8 @@ var Selection = /** @class */ (function () {
         var _this = this;
         var index = -1;
         var length = 0;
+        //This property used to maintain the check state of the currentview data after clear filtering
+        var multiFilterCheckState = false;
         if (!isNullOrUndefined(this.parent.filterModule) && this.parent.filterModule.filteredResult.length > 0) {
             var filterResult = this.parent.filterModule.filteredResult;
             if (this.filteredList.length === 0) {
@@ -274,6 +276,10 @@ var Selection = /** @class */ (function () {
             else {
                 if (this.filteredList !== filterResult) {
                     this.filteredList = filterResult;
+                    multiFilterCheckState = true;
+                }
+                else {
+                    multiFilterCheckState = false;
                 }
             }
         }
@@ -292,6 +298,9 @@ var Selection = /** @class */ (function () {
                     if (data[i].checkboxState === 'check') {
                         continue;
                     }
+                    if (multiFilterCheckState) {
+                        continue;
+                    }
                     data[i].checkboxState = 'check';
                     this.updateSelectedItems(data[i], data[i].checkboxState);
                 }
@@ -440,8 +449,8 @@ var Selection = /** @class */ (function () {
                     childData = (!isNullOrUndefined(this.parent.filterModule) && this.parent.filterModule.filteredResult.length > 0) ?
                         this.parent.getCurrentViewRecords() : this.parent.flatData;
                     childData.forEach(function (record) {
-                        if (_this.parent.enableVirtualization && record.childRecords.length > 0) {
-                            if (record.hasChildRecords) {
+                        if (_this.parent.enableVirtualization) {
+                            if (record.hasChildRecords && record.childRecords.length > 0) {
                                 _this.updateParentSelection(record);
                             }
                             else {

package/src/treegrid/actions/toolbar.js

@@ -43,53 +43,55 @@ var Toolbar = /** @class */ (function () {
         this.parent.off(events.toolbarClick, this.toolbarClickHandler);
     };
     Toolbar.prototype.refreshToolbar = function (args) {
-        var tObj = this.parent;
-        var indentElement;
-        var outdentElement;
-        var indentID = tObj.element.id + '_gridcontrol_indent';
-        var outdentID = tObj.element.id + '_gridcontrol_outdent';
         var toolbarElement = this.parent.grid.toolbarModule.getToolbar();
-        var indentEle = toolbarElement.querySelector('#' + indentID);
-        var outdentEle = toolbarElement.querySelector('#' + outdentID);
-        var row = args.row;
-        var selectedrow = tObj.getSelectedRows()[0];
-        if (!isNullOrUndefined(row[0])) {
-            row = row[0];
-        }
-        row = (!isNullOrUndefined(selectedrow) && selectedrow.rowIndex !== row.rowIndex) ? selectedrow : row;
-        if (indentEle !== null && outdentEle !== null) {
-            indentElement = toolbarElement.querySelector('#' + indentID).parentElement;
-            outdentElement = toolbarElement.querySelector('#' + outdentID).parentElement;
-            if (row.rowIndex === 0 || tObj.getSelectedRowIndexes().length > 1) {
-                indentElement.classList.add('e-hidden');
-                outdentElement.classList.add('e-hidden');
+        if (!isNullOrUndefined(toolbarElement)) {
+            var tObj = this.parent;
+            var indentElement = void 0;
+            var outdentElement = void 0;
+            var indentID = tObj.element.id + '_gridcontrol_indent';
+            var outdentID = tObj.element.id + '_gridcontrol_outdent';
+            var indentEle = toolbarElement.querySelector('#' + indentID);
+            var outdentEle = toolbarElement.querySelector('#' + outdentID);
+            var row = args.row;
+            var selectedrow = tObj.getSelectedRows()[0];
+            if (!isNullOrUndefined(row[0])) {
+                row = row[0];
             }
-            else if (args['name'] !== 'rowDeselected' || (!isNullOrUndefined(selectedrow) && tObj.grid.isCheckBoxSelection)) {
-                var selectedItem = tObj.getCurrentViewRecords()[row.rowIndex];
-                if (!isNullOrUndefined(selectedItem)) {
-                    if ((selectedItem.level > tObj.getCurrentViewRecords()[row.rowIndex - 1].level)) {
-                        indentElement.classList.add('e-hidden');
-                    }
-                    else {
-                        indentElement.classList.remove('e-hidden');
+            row = (!isNullOrUndefined(selectedrow) && selectedrow.rowIndex !== row.rowIndex) ? selectedrow : row;
+            if (indentEle !== null && outdentEle !== null) {
+                indentElement = toolbarElement.querySelector('#' + indentID).parentElement;
+                outdentElement = toolbarElement.querySelector('#' + outdentID).parentElement;
+                if (row.rowIndex === 0 || tObj.getSelectedRowIndexes().length > 1) {
+                    indentElement.classList.add('e-hidden');
+                    outdentElement.classList.add('e-hidden');
+                }
+                else if (args['name'] !== 'rowDeselected' || (!isNullOrUndefined(selectedrow) && tObj.grid.isCheckBoxSelection)) {
+                    var selectedItem = tObj.getCurrentViewRecords()[row.rowIndex];
+                    if (!isNullOrUndefined(selectedItem)) {
+                        if ((selectedItem.level > tObj.getCurrentViewRecords()[row.rowIndex - 1].level)) {
+                            indentElement.classList.add('e-hidden');
+                        }
+                        else {
+                            indentElement.classList.remove('e-hidden');
+                        }
+                        if (selectedItem.level === tObj.getCurrentViewRecords()[row.rowIndex - 1].level) {
+                            indentElement.classList.remove('e-hidden');
+                        }
+                        if (selectedItem.level === 0) {
+                            outdentElement.classList.add('e-hidden');
+                        }
+                        if (selectedItem.level !== 0) {
+                            outdentElement.classList.remove('e-hidden');
+                        }
                     }
-                    if (selectedItem.level === tObj.getCurrentViewRecords()[row.rowIndex - 1].level) {
-                        indentElement.classList.remove('e-hidden');
+                }
+                if (args['name'] === 'rowDeselected' && isNullOrUndefined(selectedrow) && !tObj.grid.isCheckBoxSelection) {
+                    if (this.parent.toolbar['includes']('Indent')) {
+                        indentElement.classList.add('e-hidden');
                     }
-                    if (selectedItem.level === 0) {
+                    if (this.parent.toolbar['includes']('Outdent')) {
                         outdentElement.classList.add('e-hidden');
                     }
-                    if (selectedItem.level !== 0) {
-                        outdentElement.classList.remove('e-hidden');
-                    }
-                }
-            }
-            if (args['name'] === 'rowDeselected' && isNullOrUndefined(selectedrow) && !tObj.grid.isCheckBoxSelection) {
-                if (this.parent.toolbar['includes']('Indent')) {
-                    indentElement.classList.add('e-hidden');
-                }
-                if (this.parent.toolbar['includes']('Outdent')) {
-                    outdentElement.classList.add('e-hidden');
                 }
             }
         }

package/src/treegrid/actions/virtual-scroll.js

@@ -157,6 +157,7 @@ var VirtualScroll = /** @class */ (function () {
                 }
             }
             this.expandCollapseRec = null;
+            startIndex = startIndex < 0 ? 0 : startIndex;
             pageingDetails.result = visualData.slice(startIndex, endIndex);
             this.prevstartIndex = startIndex;
             this.prevendIndex = endIndex;
@@ -190,12 +191,14 @@ var TreeVirtual = /** @class */ (function (_super) {
         var parentGrid = getValue('parent', this);
         getValue('parent', this).log(['limitation', 'virtual_height'], 'virtualization');
         var renderer = getValue('locator', this).getService('rendererFactory');
-        if (parentGrid.enableColumnVirtualization) {
+        if (!parentGrid.isFrozenGrid()) {
+            if (parentGrid.enableColumnVirtualization) {
+                getValue('addRenderer', renderer)
+                    .apply(renderer, [RenderType.Header, new VirtualHeaderRenderer(getValue('parent', this), getValue('locator', this))]);
+            }
             getValue('addRenderer', renderer)
-                .apply(renderer, [RenderType.Header, new VirtualHeaderRenderer(getValue('parent', this), getValue('locator', this))]);
+                .apply(renderer, [RenderType.Content, new VirtualTreeContentRenderer(getValue('parent', this), getValue('locator', this))]);
         }
-        getValue('addRenderer', renderer)
-            .apply(renderer, [RenderType.Content, new VirtualTreeContentRenderer(getValue('parent', this), getValue('locator', this))]);
         //renderer.addRenderer(RenderType.Content, new VirtualTreeContentRenderer(getValue('parent', this), getValue('locator', this)));
         this.ensurePageSize();
     };

package/src/treegrid/base/constant.d.ts

@@ -130,3 +130,31 @@ export declare const rowDropped: string;
 export declare const autoCol: string;
 /** @hidden */
 export declare const rowDeselecting: string;
+/** @hidden */
+export declare const headerContent: string;
+/** @hidden */
+export declare const movableContent: string;
+/** @hidden */
+export declare const movableHeader: string;
+/** @hidden */
+export declare const frozenContent: string;
+/** @hidden */
+export declare const frozenHeader: string;
+/** @hidden */
+export declare const content: string;
+/** @hidden */
+export declare const table: string;
+/** @hidden */
+export declare const leftRight: string;
+/** @hidden */
+export declare const frozenRight: string;
+/** @hidden */
+export declare const frozenLeft: string;
+/** @hidden */
+export declare const dataColIndex: string;
+/** @hidden */
+export declare const ariaColIndex: string;
+/** @hidden */
+export declare const dataRowIndex: string;
+/** @hidden */
+export declare const ariaRowIndex: string;

package/src/treegrid/base/constant.js

@@ -130,3 +130,31 @@ export var rowDropped = 'row-dropped';
 export var autoCol = 'auto-col';
 /** @hidden */
 export var rowDeselecting = 'rowDeselecting';
+/** @hidden */
+export var headerContent = 'e-headercontent';
+/** @hidden */
+export var movableContent = 'e-movablecontent';
+/** @hidden */
+export var movableHeader = 'e-movableheader';
+/** @hidden */
+export var frozenContent = 'e-frozencontent';
+/** @hidden */
+export var frozenHeader = 'e-frozenheader';
+/** @hidden */
+export var content = 'e-content';
+/** @hidden */
+export var table = 'e-table';
+/** @hidden */
+export var leftRight = 'Left-Right';
+/** @hidden */
+export var frozenRight = 'frozen-right';
+/** @hidden */
+export var frozenLeft = 'frozen-left';
+/** @hidden */
+export var dataColIndex = 'data-colindex';
+/** @hidden */
+export var ariaColIndex = 'aria-colindex';
+/** @hidden */
+export var dataRowIndex = 'data-rowindex';
+/** @hidden */
+export var ariaRowIndex = 'aria-rowindex';

package/src/treegrid/base/data.d.ts

@@ -18,6 +18,7 @@ export declare class DataManipulation {
     private hierarchyData;
     private isSelfReference;
     private isSortAction;
+    private infiniteScrollData;
     constructor(grid: TreeGrid);
     /**
      * @hidden

package/src/treegrid/base/data.js

@@ -377,8 +377,8 @@ var DataManipulation = /** @class */ (function () {
             if (!Object.prototype.hasOwnProperty.call(currentData, 'index')) {
                 currentData.index = this.storedIndex;
             }
-            if ((!isNullOrUndefined(currentData[this.parent.childMapping]) && !isCountRequired(this.parent)) ||
-                ((currentData[this.parent.hasChildMapping]) && isCountRequired(this.parent) && (this.parent.initialRender || isNullOrUndefined(this.parent['dataResults'].result)))) {
+            if ((!isNullOrUndefined(currentData[this.parent.childMapping]) && !isCountRequired(this.parent)) || ((currentData[this.parent.hasChildMapping]) &&
+                isCountRequired(this.parent) && (this.parent.initialRender || isNullOrUndefined(this.parent['dataResults'].result) || this.parent.enableInfiniteScrolling))) {
                 currentData.hasChildRecords = true;
                 if (this.parent.enableCollapseAll || !isNullOrUndefined(this.parent.dataStateChange)
                     && isNullOrUndefined(currentData[this.parent.childMapping])) {
@@ -414,6 +414,7 @@ var DataManipulation = /** @class */ (function () {
             currentData.checkboxState = 'uncheck';
             if (isNullOrUndefined(currentData[this.parent.parentIdMapping]) || currentData.parentItem) {
                 this.parent.flatData.push(currentData);
+                this.parent['infiniteScrollData'].push(currentData);
             }
             if (!this.isSelfReference && currentData.level === 0) {
                 this.parent.parentData.push(currentData);

package/src/treegrid/base/treegrid-model.d.ts

@@ -1,4 +1,4 @@
-import { Component, addClass, createElement, EventHandler, isNullOrUndefined, Ajax, ModuleDeclaration, extend, merge} from '@syncfusion/ej2-base';import { removeClass, EmitType, Complex, Collection, KeyboardEventArgs, getValue } from '@syncfusion/ej2-base';import {Event, Property, NotifyPropertyChanges, INotifyPropertyChanged, setValue, KeyboardEvents, L10n } from '@syncfusion/ej2-base';import { Column, ColumnModel } from '../models/column';import { BeforeBatchSaveArgs, BeforeBatchAddArgs, BatchDeleteArgs, BeforeBatchDeleteArgs } from '@syncfusion/ej2-grids';import { GridModel, ColumnQueryModeType, HeaderCellInfoEventArgs, EditSettingsModel as GridEditModel } from '@syncfusion/ej2-grids';import {RowDragEventArgs, RowDropEventArgs, RowDropSettingsModel, RowDropSettings, getUid } from '@syncfusion/ej2-grids';import { ActionEventArgs, TextAlign } from'@syncfusion/ej2-grids';import { DetailDataBoundEventArgs, ClipMode, ColumnChooser}  from '@syncfusion/ej2-grids';import { SearchEventArgs, AddEventArgs, EditEventArgs, DeleteEventArgs}  from '@syncfusion/ej2-grids';import { SaveEventArgs, CellSaveArgs, BatchAddArgs, BatchCancelArgs,  BeginEditArgs, CellEditArgs}  from '@syncfusion/ej2-grids';import { FilterSettings } from '../models/filter-settings';import { TextWrapSettings } from '../models/textwrap-settings';import { TextWrapSettingsModel } from '../models/textwrap-settings-model';import {Filter} from '../actions/filter';import { Logger as TreeLogger } from '../actions/logger';import { BeforeCopyEventArgs, BeforePasteEventArgs } from '@syncfusion/ej2-grids';import { TreeClipboard } from '../actions/clipboard';import {Aggregate} from '../actions/summary';import { Reorder } from '../actions/reorder';import { Resize } from '../actions/resize';import { Selection as TreeGridSelection } from '../actions/selection';import { ColumnMenu } from '../actions/column-menu';import { DetailRow } from '../actions/detail-row';import { Freeze } from '../actions/freeze-column';import { Print } from '../actions/print';import * as events from '../base/constant';import { FilterSettingsModel } from '../models/filter-settings-model';import { SearchSettings} from '../models/search-settings';import { SearchSettingsModel } from '../models/search-settings-model';import {RowInfo, RowDataBoundEventArgs, PageEventArgs, FilterEventArgs, FailureEventArgs, SortEventArgs } from '@syncfusion/ej2-grids';import { RowSelectingEventArgs, RowSelectEventArgs, RowDeselectEventArgs, IIndex, ISelectedCell } from '@syncfusion/ej2-grids';import {ColumnModel as GridColumnModel, Column as GridColumn, CellSelectEventArgs, CellDeselectEventArgs } from '@syncfusion/ej2-grids';import { SelectionSettings } from '../models/selection-settings';import { SelectionSettingsModel } from '../models/selection-settings-model';import {getActualProperties, SortDirection, getObject, ColumnDragEventArgs } from '@syncfusion/ej2-grids';import { PrintMode, Data, IGrid, ContextMenuItemModel } from '@syncfusion/ej2-grids';import { ColumnMenuItem, ColumnMenuItemModel, CheckBoxChangeEventArgs } from '@syncfusion/ej2-grids';import { ExcelExportCompleteArgs, ExcelHeaderQueryCellInfoEventArgs, ExcelQueryCellInfoEventArgs } from '@syncfusion/ej2-grids';import { PdfExportCompleteArgs, PdfHeaderQueryCellInfoEventArgs, PdfQueryCellInfoEventArgs } from '@syncfusion/ej2-grids';import { ExcelExportProperties, PdfExportProperties, CellSelectingEventArgs, PrintEventArgs } from '@syncfusion/ej2-grids';import { ColumnMenuOpenEventArgs } from '@syncfusion/ej2-grids';import {BeforeDataBoundArgs} from '@syncfusion/ej2-grids';import { DataManager, ReturnOption, RemoteSaveAdaptor, Query, JsonAdaptor, Deferred } from '@syncfusion/ej2-data';import { createSpinner, hideSpinner, showSpinner, Dialog } from '@syncfusion/ej2-popups';import { isRemoteData, isOffline, extendArray, isCountRequired, findChildrenRecords } from '../utils';import { Grid, QueryCellInfoEventArgs, Logger } from '@syncfusion/ej2-grids';import { Render } from '../renderer/render';import { VirtualTreeContentRenderer } from '../renderer/virtual-tree-content-render';import { DataManipulation } from './data';import { RowDD } from '../actions/rowdragdrop';import { Sort } from '../actions/sort';import { ITreeData, RowExpandedEventArgs, RowCollapsedEventArgs, RowCollapsingEventArgs, TreeGridExcelExportProperties } from './interface';import { CellSaveEventArgs, DataStateChangeEventArgs, RowExpandingEventArgs, TreeGridPdfExportProperties } from './interface';import { iterateArrayOrObject, GridLine } from '@syncfusion/ej2-grids';import { DataSourceChangedEventArgs, RecordDoubleClickEventArgs, ResizeArgs } from '@syncfusion/ej2-grids';import { ToolbarItems, ToolbarItem, ContextMenuItem, ContextMenuItems, RowPosition, CopyHierarchyType } from '../enum';import { ItemModel, ClickEventArgs, BeforeOpenCloseMenuEventArgs, MenuEventArgs } from '@syncfusion/ej2-navigations';import { PageSettings } from '../models/page-settings';import { PageSettingsModel } from '../models/page-settings-model';import { AggregateRow } from '../models/summary';import { AggregateRowModel } from '../models/summary-model';import { ExcelExport } from '../actions/excel-export';import { PdfExport } from '../actions/pdf-export';import { Toolbar } from '../actions/toolbar';import { Page } from '../actions/page';import { ContextMenu } from '../actions/context-menu';import { EditSettings } from '../models/edit-settings';import { EditSettingsModel } from '../models/edit-settings-model';import { Edit} from '../actions/edit';import { SortSettings } from '../models/sort-settings';import { SortSettingsModel } from '../models/sort-settings-model';import { isHidden, getExpandStatus } from '../utils';import { editAction } from '../actions/crud-actions';import { InfiniteScrollSettings } from '../models/infinite-scroll-settings';import { InfiniteScrollSettingsModel } from '../models/infinite-scroll-settings-model';import { TreeActionEventArgs } from '..';
+import { Component, addClass, createElement, EventHandler, isNullOrUndefined, Ajax, ModuleDeclaration, extend, merge} from '@syncfusion/ej2-base';import { removeClass, EmitType, Complex, Collection, KeyboardEventArgs, getValue } from '@syncfusion/ej2-base';import {Event, Property, NotifyPropertyChanges, INotifyPropertyChanged, setValue, KeyboardEvents, L10n } from '@syncfusion/ej2-base';import { Column, ColumnModel } from '../models/column';import { BeforeBatchSaveArgs, BeforeBatchAddArgs, BatchDeleteArgs, BeforeBatchDeleteArgs, Row } from '@syncfusion/ej2-grids';import { GridModel, ColumnQueryModeType, HeaderCellInfoEventArgs, EditSettingsModel as GridEditModel } from '@syncfusion/ej2-grids';import {RowDragEventArgs, RowDropEventArgs, RowDropSettingsModel, RowDropSettings, getUid } from '@syncfusion/ej2-grids';import { ActionEventArgs, TextAlign } from'@syncfusion/ej2-grids';import { DetailDataBoundEventArgs, ClipMode, ColumnChooser}  from '@syncfusion/ej2-grids';import { SearchEventArgs, AddEventArgs, EditEventArgs, DeleteEventArgs}  from '@syncfusion/ej2-grids';import { SaveEventArgs, CellSaveArgs, BatchAddArgs, BatchCancelArgs,  BeginEditArgs, CellEditArgs}  from '@syncfusion/ej2-grids';import { FilterSettings } from '../models/filter-settings';import { TextWrapSettings } from '../models/textwrap-settings';import { TextWrapSettingsModel } from '../models/textwrap-settings-model';import {Filter} from '../actions/filter';import { Logger as TreeLogger } from '../actions/logger';import { BeforeCopyEventArgs, BeforePasteEventArgs } from '@syncfusion/ej2-grids';import { TreeClipboard } from '../actions/clipboard';import {Aggregate} from '../actions/summary';import { Reorder } from '../actions/reorder';import { Resize } from '../actions/resize';import { Selection as TreeGridSelection } from '../actions/selection';import { ColumnMenu } from '../actions/column-menu';import { DetailRow } from '../actions/detail-row';import { Freeze } from '../actions/freeze-column';import { Print } from '../actions/print';import * as events from '../base/constant';import { FilterSettingsModel } from '../models/filter-settings-model';import { SearchSettings} from '../models/search-settings';import { SearchSettingsModel } from '../models/search-settings-model';import {RowInfo, RowDataBoundEventArgs, PageEventArgs, FilterEventArgs, FailureEventArgs, SortEventArgs } from '@syncfusion/ej2-grids';import { RowSelectingEventArgs, RowSelectEventArgs, RowDeselectEventArgs, IIndex, ISelectedCell } from '@syncfusion/ej2-grids';import {ColumnModel as GridColumnModel, Column as GridColumn, CellSelectEventArgs, CellDeselectEventArgs } from '@syncfusion/ej2-grids';import { SelectionSettings } from '../models/selection-settings';import { SelectionSettingsModel } from '../models/selection-settings-model';import {getActualProperties, SortDirection, getObject, ColumnDragEventArgs } from '@syncfusion/ej2-grids';import { PrintMode, Data, IGrid, ContextMenuItemModel } from '@syncfusion/ej2-grids';import { ColumnMenuItem, ColumnMenuItemModel, CheckBoxChangeEventArgs } from '@syncfusion/ej2-grids';import { ExcelExportCompleteArgs, ExcelHeaderQueryCellInfoEventArgs, ExcelQueryCellInfoEventArgs } from '@syncfusion/ej2-grids';import { PdfExportCompleteArgs, PdfHeaderQueryCellInfoEventArgs, PdfQueryCellInfoEventArgs } from '@syncfusion/ej2-grids';import { ExcelExportProperties, PdfExportProperties, CellSelectingEventArgs, PrintEventArgs } from '@syncfusion/ej2-grids';import { ColumnMenuOpenEventArgs } from '@syncfusion/ej2-grids';import {BeforeDataBoundArgs} from '@syncfusion/ej2-grids';import { DataManager, ReturnOption, RemoteSaveAdaptor, Query, JsonAdaptor, Deferred } from '@syncfusion/ej2-data';import { createSpinner, hideSpinner, showSpinner, Dialog } from '@syncfusion/ej2-popups';import { isRemoteData, isOffline, extendArray, isCountRequired, findChildrenRecords } from '../utils';import { Grid, QueryCellInfoEventArgs, Logger } from '@syncfusion/ej2-grids';import { Render } from '../renderer/render';import { VirtualTreeContentRenderer } from '../renderer/virtual-tree-content-render';import { DataManipulation } from './data';import { RowDD } from '../actions/rowdragdrop';import { Sort } from '../actions/sort';import { ITreeData, RowExpandedEventArgs, RowCollapsedEventArgs, RowCollapsingEventArgs, TreeGridExcelExportProperties } from './interface';import { CellSaveEventArgs, DataStateChangeEventArgs, RowExpandingEventArgs, TreeGridPdfExportProperties } from './interface';import { iterateArrayOrObject, GridLine } from '@syncfusion/ej2-grids';import { DataSourceChangedEventArgs, RecordDoubleClickEventArgs, ResizeArgs } from '@syncfusion/ej2-grids';import { ToolbarItems, ToolbarItem, ContextMenuItem, ContextMenuItems, RowPosition, CopyHierarchyType } from '../enum';import { ItemModel, ClickEventArgs, BeforeOpenCloseMenuEventArgs, MenuEventArgs } from '@syncfusion/ej2-navigations';import { PageSettings } from '../models/page-settings';import { PageSettingsModel } from '../models/page-settings-model';import { AggregateRow } from '../models/summary';import { AggregateRowModel } from '../models/summary-model';import { ExcelExport } from '../actions/excel-export';import { PdfExport } from '../actions/pdf-export';import { Toolbar } from '../actions/toolbar';import { Page } from '../actions/page';import { ContextMenu } from '../actions/context-menu';import { EditSettings } from '../models/edit-settings';import { EditSettingsModel } from '../models/edit-settings-model';import { Edit} from '../actions/edit';import { SortSettings } from '../models/sort-settings';import { SortSettingsModel } from '../models/sort-settings-model';import { isHidden, getExpandStatus } from '../utils';import { editAction } from '../actions/crud-actions';import { InfiniteScrollSettings } from '../models/infinite-scroll-settings';import { InfiniteScrollSettingsModel } from '../models/infinite-scroll-settings-model';import { TreeActionEventArgs } from '..';import * as literals from '../base/constant';
 import {ComponentModel} from '@syncfusion/ej2-base';
 
 /**