@syncfusion/ej2-treegrid - npm Package Compare versions

Comparing version 17.4.51 to 18.1.36-beta

CHANGELOG.md

@@ -5,38 +5,14 @@ # Changelog
 
-## 17.4.49 (2020-02-11)
-
 ### TreeGrid
 
-#### Bug Fixes
+#### New Features
 
-- `#262583`- Row Drag and drop works fine for newly added records in self-referential data binding.
+- Provides support to copy the selected rows or cells data into clipboard.
+- Provides support to load large amount of data on-demand in Virtual Scrolling.
+- Provides batch editing support for bulk add, edit and delete operations.
 
-## 17.4.46 (2020-01-30)
-
-### TreeGrid
-
 #### Bug Fixes
 
-- `#245194`- Cleared the template elements on performing TreeGrid actions.
-- `#260348`- Editing works fine when we dynamically change allowEditing property.
+- `#262583`- Dragging a row works fine, when Tree Grid is in Edit state.
 
-## 17.4.43 (2020-01-14)
-
-### TreeGrid
-
-#### Bug Fixes
-
-- `#258560`- Fixed issue in alignment of newly added child record when auto increment column is used for primary key column.
-
-## 17.4.40 (2019-12-24)
-
-### TreeGrid
-
-#### Bug Fixes
-
-- `#257683`- Delete action works properly for the newly added record in TreeGrid using RemoteSaveAdaptor.
-- `#254018`- Alignment issue when enabling Row Drag and Drop has been fixed.
-- `#249633`- Dragged row removed properly from dragged position in Row Drag and Drop when we bind sorted data to Tree Grid data source.
-- `#147099`- Stacked Header works properly when we add dynamically.
-
 ## 17.4.39 (2019-12-17)
@@ -43,0 +19,0 @@

dist/global/index.d.ts

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

package.json

 {
   "_from": "@syncfusion/ej2-treegrid@*",
-  "_id": "@syncfusion/ej2-treegrid@17.4.50",
+  "_id": "@syncfusion/ej2-treegrid@17.4.39",
   "_inBundle": false,
-  "_integrity": "sha512-Wtn4l2hPw1+Waamw2Lmm1PSngqRMt//zq0ALMaFckEJsbpFajIgvxziiIXrPDp9FjP/Lqq9cvPzVjDHJ55kGqA==",
+  "_integrity": "sha512-jDlVcMgRUAgMIOj8xsR7JCSjPG0gK4I7RBOy/BhStUxA9Ljc3zOSyBUxmpY8RgwhKkTlBT0f0tCmBogxm2/Ntg==",
   "_location": "/@syncfusion/ej2-treegrid",
@@ -27,6 +27,6 @@ "_phantomChildren": {},
   ],
-  "_resolved": "http://nexus.syncfusion.com/repository/ej2-hotfix/@syncfusion/ej2-treegrid/-/ej2-treegrid-17.4.50.tgz",
-  "_shasum": "eb75892700440661acef52d822ac341ae5c4be35",
+  "_resolved": "http://nexus.syncfusion.com/repository/ej2-release/@syncfusion/ej2-treegrid/-/ej2-treegrid-17.4.39.tgz",
+  "_shasum": "2c2036f8ae8a1e8502f75db88fe33cbfd7f83081",
   "_spec": "@syncfusion/ej2-treegrid@*",
-  "_where": "/jenkins/workspace/ation_hotfix_17.2.0.34_Vol2-DDPJ6C2YEWTWLLKKNA7AG2JBE6DYTCTNGMHGORWGAYAVCL6L7OLQ/packages/included",
+  "_where": "/jenkins/workspace/automation_release_18.1.0.1-52JLNOGRCDHXRVQM3W564VPLFCPHWUYDYU3I3DVRABSR7F6AIFYQ/packages/included",
   "author": {
@@ -40,6 +40,6 @@ "name": "Syncfusion Inc."
   "dependencies": {
-    "@syncfusion/ej2-base": "~17.4.51",
-    "@syncfusion/ej2-data": "~17.4.51",
-    "@syncfusion/ej2-grids": "~17.4.51",
-    "@syncfusion/ej2-popups": "~17.4.51"
+    "@syncfusion/ej2-base": "~18.1.36-beta",
+    "@syncfusion/ej2-data": "~18.1.36-beta",
+    "@syncfusion/ej2-grids": "~18.1.36-beta",
+    "@syncfusion/ej2-popups": "~18.1.36-beta"
   },
@@ -65,4 +65,4 @@ "deprecated": false,
   "typings": "index.d.ts",
-  "version": "17.4.51",
+  "version": "18.1.36-beta",
   "sideEffects": false
 }

src/treegrid/actions/batch-edit.d.ts

 import { TreeGrid } from '../base';
-import { BeforeBatchSaveArgs } from '@syncfusion/ej2-grids';
-export declare function batchSaveAction(control: TreeGrid): void;
-export declare function beforeBatchSaveAction(e: BeforeBatchSaveArgs, control: TreeGrid): void;
+/**
+ * `BatchEdit` module is used to handle batch editing actions.
+ * @hidden
+ */
+export declare class BatchEdit {
+    private parent;
+    private isSelfReference;
+    private addRowRecord;
+    private batchChildCount;
+    private addedRecords;
+    private deletedRecords;
+    private matrix;
+    private batchRecords;
+    private currentViewRecords;
+    private batchAddedRecords;
+    private batchDeletedRecords;
+    private batchIndex;
+    private batchAddRowRecord;
+    private isAdd;
+    private newBatchRowAdded;
+    private selectedIndex;
+    private addRowIndex;
+    constructor(parent: TreeGrid);
+    addEventListener(): void;
+    /**
+     * @hidden
+     */
+    removeEventListener(): void;
+    /**
+     * To destroy the editModule
+     * @return {void}
+     * @hidden
+     */
+    destroy(): void;
+    /**
+     * @hidden
+     */
+    getBatchRecords(): Object[];
+    /**
+     * @hidden
+     */
+    getAddRowIndex(): number;
+    /**
+     * @hidden
+     */
+    getSelectedIndex(): number;
+    /**
+     * @hidden
+     */
+    getBatchChildCount(): number;
+    private batchPageAction;
+    private cellSaved;
+    private beforeBatchAdd;
+    private batchAdd;
+    private beforeBatchDelete;
+    private updateRowIndex;
+    private updateChildCount;
+    private beforeBatchSave;
+    private deleteUniqueID;
+    private batchCancelAction;
+    private batchSave;
+}

src/treegrid/actions/batch-edit.js

@@ -1,26 +0,485 @@
-import { isNullOrUndefined } from '@syncfusion/ej2-base';
+import { isNullOrUndefined, extend, setValue, getValue } from '@syncfusion/ej2-base';
 import * as events from '../base/constant';
-import { editAction } from './crud-actions';
-export function batchSaveAction(control) {
-    var i;
-    var batchChanges = control.getBatchChanges();
-    var addedRecords = 'addedRecords';
-    if (batchChanges[addedRecords].length) {
-        for (i = 0; i < batchChanges[addedRecords].length; i++) {
-            control.notify(events.crudAction, { value: batchChanges[addedRecords][i], action: 'batchsave' });
-        }
+import { DataManager } from '@syncfusion/ej2-data';
+import { findChildrenRecords, getParentData, extendArray } from '../utils';
+import { getUid } from '@syncfusion/ej2-grids';
+import { updateParentRow, editAction } from './crud-actions';
+/**
+ * `BatchEdit` module is used to handle batch editing actions.
+ * @hidden
+ */
+var BatchEdit = /** @class */ (function () {
+    function BatchEdit(parent) {
+        this.batchChildCount = 0;
+        this.addedRecords = 'addedRecords';
+        this.deletedRecords = 'deletedRecords';
+        this.batchAddedRecords = [];
+        this.batchDeletedRecords = [];
+        this.batchAddRowRecord = [];
+        this.parent = parent;
+        this.isSelfReference = !isNullOrUndefined(parent.parentIdMapping);
+        this.batchRecords = [];
+        this.currentViewRecords = [];
+        this.isAdd = false;
+        this.addEventListener();
     }
-}
-export function beforeBatchSaveAction(e, control) {
-    var changeRecords = 'changedRecords';
-    var changedRecords = e.batchChanges[changeRecords];
-    if (e.batchChanges[changeRecords].length) {
-        var selectedIndex = void 0;
-        var addRowIndex = void 0;
-        var columnName = void 0;
-        var isSelfReference = !isNullOrUndefined(control.parentIdMapping);
-        for (var i = 0; i < changedRecords.length; i++) {
-            editAction({ value: changedRecords[i], action: 'edit' }, control, isSelfReference, addRowIndex, selectedIndex, columnName);
+    BatchEdit.prototype.addEventListener = function () {
+        this.parent.on(events.cellSaved, this.cellSaved, this);
+        this.parent.on(events.batchAdd, this.batchAdd, this);
+        this.parent.on(events.beforeBatchAdd, this.beforeBatchAdd, this);
+        this.parent.on(events.batchSave, this.batchSave, this);
+        this.parent.on(events.beforeBatchDelete, this.beforeBatchDelete, this);
+        this.parent.on(events.beforeBatchSave, this.beforeBatchSave, this);
+        this.parent.on('batchPageAction', this.batchPageAction, this);
+        this.parent.on('batchCancelAction', this.batchCancelAction, this);
+    };
+    /**
+     * @hidden
+     */
+    BatchEdit.prototype.removeEventListener = function () {
+        if (this.parent.isDestroyed) {
+            return;
         }
-    }
-}
+        this.parent.off(events.cellSaved, this.cellSaved);
+        this.parent.off(events.batchAdd, this.batchAdd);
+        this.parent.off(events.batchSave, this.batchSave);
+        this.parent.off(events.beforeBatchAdd, this.beforeBatchAdd);
+        this.parent.off(events.beforeBatchDelete, this.beforeBatchDelete);
+        this.parent.off(events.beforeBatchSave, this.beforeBatchSave);
+        this.parent.off('batchPageAction', this.batchPageAction);
+        this.parent.off('batchCancelAction', this.batchCancelAction);
+    };
+    /**
+     * To destroy the editModule
+     * @return {void}
+     * @hidden
+     */
+    BatchEdit.prototype.destroy = function () {
+        this.removeEventListener();
+    };
+    /**
+     * @hidden
+     */
+    BatchEdit.prototype.getBatchRecords = function () {
+        return this.batchRecords;
+    };
+    /**
+     * @hidden
+     */
+    BatchEdit.prototype.getAddRowIndex = function () {
+        return this.addRowIndex;
+    };
+    /**
+     * @hidden
+     */
+    BatchEdit.prototype.getSelectedIndex = function () {
+        return this.selectedIndex;
+    };
+    /**
+     * @hidden
+     */
+    BatchEdit.prototype.getBatchChildCount = function () {
+        return this.batchChildCount;
+    };
+    BatchEdit.prototype.batchPageAction = function () {
+        var data = (this.parent.grid.dataSource instanceof DataManager ?
+            this.parent.grid.dataSource.dataSource.json : this.parent.grid.dataSource);
+        var primaryKey = this.parent.grid.getPrimaryKeyFieldNames()[0];
+        var index;
+        if (!isNullOrUndefined(this.batchAddedRecords) && this.batchAddedRecords.length) {
+            for (var i = 0; i < this.batchAddedRecords.length; i++) {
+                index = data.map(function (e) { return e[primaryKey]; }).indexOf(this.batchAddedRecords[i][primaryKey]);
+                data.splice(index, 1);
+            }
+        }
+        this.batchAddedRecords = this.batchRecords = this.batchAddRowRecord = this.batchDeletedRecords = this.currentViewRecords = [];
+    };
+    BatchEdit.prototype.cellSaved = function (args) {
+        if (args.cell.cellIndex === this.parent.treeColumnIndex) {
+            this.parent.renderModule.cellRender({
+                data: args.rowData,
+                cell: args.cell,
+                column: this.parent.grid.getColumnByIndex(args.cell.cellIndex)
+            });
+        }
+        if (this.isAdd && this.parent.editSettings.mode === 'Batch' && this.parent.editSettings.newRowPosition !== 'Bottom') {
+            var data = (this.parent.grid.dataSource instanceof DataManager ?
+                this.parent.grid.dataSource.dataSource.json : this.parent.grid.dataSource);
+            var added = void 0;
+            var level = 'level';
+            var expanded = 'expanded';
+            var primaryKey_1 = this.parent.grid.getPrimaryKeyFieldNames()[0];
+            var currentDataIndex = void 0;
+            var parentRecord = void 0;
+            var indexvalue = void 0;
+            var index = 'index';
+            var parentItem = 'parentItem';
+            var uniqueID = 'uniqueID';
+            parentRecord = this.selectedIndex > -1 ? this.batchRecords[this.addRowIndex][parentItem] : null;
+            var idMapping = void 0;
+            var parentUniqueID = void 0;
+            var parentIdMapping = void 0;
+            if (this.newBatchRowAdded) {
+                if (this.batchRecords.length) {
+                    idMapping = this.batchRecords[this.addRowIndex][this.parent.idMapping];
+                    parentIdMapping = this.batchRecords[this.addRowIndex][this.parent.parentIdMapping];
+                    if (this.batchRecords[this.addRowIndex][parentItem]) {
+                        parentUniqueID = this.batchRecords[this.addRowIndex][parentItem][uniqueID];
+                    }
+                }
+                this.batchAddedRecords = extendArray(this.batchAddedRecords);
+                this.batchAddRowRecord = extendArray(this.batchAddRowRecord);
+                this.batchAddRowRecord.push(this.batchRecords[this.addRowIndex]);
+                added = this.parent.grid.getRowsObject()[0].changes;
+                added.uniqueID = getUid(this.parent.element.id + '_data_');
+                setValue('uniqueIDCollection.' + added.uniqueID, added, this.parent);
+                if (!added.hasOwnProperty('level')) {
+                    this.batchIndex = this.selectedIndex === -1 ? 0 : this.batchIndex;
+                    if (this.parent.editSettings.newRowPosition === 'Child') {
+                        added.primaryParent = parentRecord;
+                        if (this.selectedIndex > -1) {
+                            added.parentItem = extend({}, this.batchRecords[this.addRowIndex]);
+                            added.parentUniqueID = added.parentItem.uniqueID;
+                            delete added.parentItem.childRecords;
+                            delete added.parentItem[this.parent.childMapping];
+                            added.level = added.parentItem.level + 1;
+                            added.index = this.batchIndex;
+                            var childRecordCount = findChildrenRecords(this.batchRecords[this.addRowIndex]).length;
+                            var record = findChildrenRecords(this.batchRecords[this.addRowIndex])[childRecordCount - 1];
+                            record = isNullOrUndefined(record) ? this.batchRecords[this.addRowIndex] : record;
+                            currentDataIndex = data.map(function (e) { return e[primaryKey_1]; }).indexOf(record[primaryKey_1]);
+                            if (this.isSelfReference) {
+                                added[this.parent.parentIdMapping] = idMapping;
+                            }
+                            updateParentRow(primaryKey_1, added.parentItem, 'add', this.parent, this.isSelfReference, added);
+                        }
+                    }
+                    else if (this.parent.editSettings.newRowPosition === 'Above' || this.parent.editSettings.newRowPosition === 'Below') {
+                        added.level = this.batchRecords[this.addRowIndex][level];
+                        if (added.level) {
+                            added.parentItem = parentRecord;
+                            added.parentUniqueID = parentUniqueID;
+                            delete added.parentItem.childRecords;
+                            delete added.parentItem[this.parent.childMapping];
+                        }
+                        added.index = this.parent.editSettings.newRowPosition === 'Below' ? this.batchIndex : this.batchIndex - 1;
+                        if (this.parent.editSettings.newRowPosition === 'Below' && this.selectedIndex > -1) {
+                            var childRecordCount = findChildrenRecords(this.batchRecords[this.addRowIndex]).length;
+                            var record = findChildrenRecords(this.batchRecords[this.addRowIndex])[childRecordCount - 1];
+                            record = isNullOrUndefined(record) ? this.batchRecords[this.addRowIndex] : record;
+                            currentDataIndex = data.map(function (e) { return e[primaryKey_1]; }).indexOf(record[primaryKey_1]);
+                        }
+                        if (this.parent.editSettings.newRowPosition === 'Above' && this.selectedIndex > -1) {
+                            var record = this.batchRecords[this.addRowIndex];
+                            currentDataIndex = data.map(function (e) { return e[primaryKey_1]; }).indexOf(record[primaryKey_1]);
+                        }
+                        if (this.isSelfReference) {
+                            added[this.parent.parentIdMapping] = parentIdMapping;
+                        }
+                    }
+                    added.index = added.index === -1 ? 0 : added.index;
+                    added.hasChildRecords = false;
+                    added.childRecords = [];
+                    this.batchRecords.splice(added.index, 0, added);
+                    this.currentViewRecords.splice(added.index, 0, added);
+                    if (currentDataIndex) {
+                        indexvalue = currentDataIndex;
+                    }
+                    else {
+                        indexvalue = added.index;
+                    }
+                    if (this.parent.editSettings.newRowPosition !== 'Above') {
+                        indexvalue = added.index === 0 ? indexvalue : indexvalue + 1;
+                    }
+                    data.splice(indexvalue, 0, added);
+                    this.batchAddedRecords.push(added);
+                }
+                this.parent.grid.getRowsObject()[0].data = added;
+                this.newBatchRowAdded = false;
+            }
+        }
+    };
+    BatchEdit.prototype.beforeBatchAdd = function (e) {
+        this.selectedIndex = this.parent.grid.selectedRowIndex;
+        this.addRowIndex = this.parent.grid.selectedRowIndex > -1 ? this.parent.grid.selectedRowIndex : 0;
+        this.addRowRecord = this.parent.getSelectedRecords()[0];
+    };
+    BatchEdit.prototype.batchAdd = function (e) {
+        if (this.parent.editSettings.newRowPosition !== 'Bottom') {
+            this.isAdd = true;
+            this.newBatchRowAdded = true;
+            var actualIndex = 0;
+            if (!this.batchRecords.length) {
+                this.batchAddedRecords = [];
+                this.batchRecords = extendArray(this.parent.grid.getCurrentViewRecords());
+                this.currentViewRecords = extendArray(this.parent.grid.getCurrentViewRecords());
+            }
+            if (this.parent.editSettings.newRowPosition !== 'Top') {
+                var records = this.parent.grid.getCurrentViewRecords();
+                if (this.parent.editSettings.mode === 'Batch' && (this.parent.getBatchChanges()[this.addedRecords].length > 1
+                    || this.parent.getBatchChanges()[this.deletedRecords].length)) {
+                    records = this.batchRecords;
+                }
+                this.updateChildCount(records);
+                this.parent.notify(events.beginAdd, {});
+                this.batchChildCount = 0;
+            }
+            this.updateRowIndex();
+            // update focus module, need to refix this once grid source modified.
+            var focusModule = getValue('focusModule', this.parent.grid);
+            var table = this.parent.getContentTable();
+            if (this.parent.getBatchChanges()[this.deletedRecords].length && this.parent.editSettings.newRowPosition === 'Above') {
+                actualIndex = e.row.rowIndex;
+                focusModule.getContent().matrix.matrix = this.matrix;
+            }
+            else {
+                actualIndex = table.getElementsByClassName('e-batchrow')[0].rowIndex;
+                if (this.parent.frozenRows || this.parent.frozenColumns) {
+                    actualIndex = this.batchIndex;
+                }
+            }
+            focusModule.getContent().matrix.current = [actualIndex, focusModule.getContent().matrix.current[1]];
+        }
+    };
+    BatchEdit.prototype.beforeBatchDelete = function (e) {
+        if (!this.batchRecords.length) {
+            this.batchRecords = extendArray(this.parent.grid.getCurrentViewRecords());
+            this.currentViewRecords = extendArray(this.parent.grid.getCurrentViewRecords());
+        }
+        var focusModule = getValue('focusModule', this.parent.grid);
+        this.matrix = focusModule.getContent().matrix.matrix;
+        this.parent = this.parent;
+        var row = [];
+        var records;
+        var data;
+        var primarykey = this.parent.grid.getPrimaryKeyFieldNames()[0];
+        data = this.parent.grid.getSelectedRecords()[this.parent.grid.getSelectedRecords().length - 1];
+        var childs = findChildrenRecords(data);
+        if (childs.length) {
+            for (var i = 0; i < childs.length; i++) {
+                var index = this.parent.grid.getRowIndexByPrimaryKey(childs[i][primarykey]);
+                row.push(this.parent.grid.getRows()[index]);
+            }
+        }
+        if (!isNullOrUndefined(data.parentItem)) {
+            var parentItem = getParentData(this.parent, data.parentItem.uniqueID);
+            if (!isNullOrUndefined(parentItem) && parentItem.hasChildRecords) {
+                var childIndex = parentItem.childRecords.indexOf(data);
+                parentItem.childRecords.splice(childIndex, 1);
+            }
+            this.batchDeletedRecords = extendArray(this.batchDeletedRecords);
+            this.batchDeletedRecords.push(data);
+        }
+        childs.push(data);
+        records = childs;
+        for (var i = 0; i < records.length; i++) {
+            var indexvalue = this.batchRecords.map(function (e) { return e[primarykey]; }).indexOf(records[i][primarykey]);
+            if (indexvalue !== -1) {
+                this.batchRecords.splice(indexvalue, 1);
+            }
+        }
+        for (var i = 0; i < row.length; i++) {
+            if (!isNullOrUndefined(row[i])) {
+                this.parent.grid.selectionModule.selectedRecords.push(row[i]);
+            }
+        }
+    };
+    BatchEdit.prototype.updateRowIndex = function () {
+        var rows = this.parent.grid.getDataRows();
+        for (var i = 0; i < rows.length; i++) {
+            rows[i].setAttribute('aria-rowindex', i.toString());
+        }
+    };
+    BatchEdit.prototype.updateChildCount = function (records) {
+        var primaryKey = this.parent.grid.getPrimaryKeyFieldNames()[0];
+        var addedRecords = 'addedRecords';
+        var deletedRecords = 'deletedRecords';
+        var parentItem = this.parent.editSettings.newRowPosition === 'Child' ? 'primaryParent' : 'parentItem';
+        for (var i = 1; i < this.parent.getBatchChanges()[addedRecords].length; i++) {
+            if (!isNullOrUndefined(this.parent.getBatchChanges()[addedRecords][i][parentItem])) {
+                if (this.parent.getBatchChanges()[addedRecords][i][parentItem][primaryKey] === records[this.addRowIndex][primaryKey]) {
+                    this.batchChildCount = this.batchChildCount + 1;
+                }
+            }
+        }
+    };
+    BatchEdit.prototype.beforeBatchSave = function (e) {
+        var changeRecords = 'changedRecords';
+        var deleterecords = 'deletedRecords';
+        var changedRecords = e.batchChanges[changeRecords];
+        if (e.batchChanges[changeRecords].length) {
+            var columnName = void 0;
+            for (var i = 0; i < changedRecords.length; i++) {
+                editAction({ value: changedRecords[i], action: 'edit' }, this.parent, this.isSelfReference, this.addRowIndex, this.selectedIndex, columnName);
+            }
+        }
+        if (e.batchChanges[deleterecords].length) {
+            var deletedRecords = e.batchChanges[deleterecords];
+            var record = deletedRecords;
+            for (var i = 0; i < record.length; i++) {
+                this.deleteUniqueID(record[i].uniqueID);
+                var childs = findChildrenRecords(record[i]);
+                for (var c = 0; c < childs.length; c++) {
+                    this.deleteUniqueID(childs[c].uniqueID);
+                }
+                e.batchChanges[deleterecords] = e.batchChanges[deleterecords].concat(childs);
+            }
+        }
+        this.isAdd = false;
+    };
+    BatchEdit.prototype.deleteUniqueID = function (value) {
+        var idFilter = 'uniqueIDFilterCollection';
+        delete this.parent[idFilter][value];
+        var id = 'uniqueIDCollection';
+        delete this.parent[id][value];
+    };
+    BatchEdit.prototype.batchCancelAction = function () {
+        var targetElement = 'targetElement';
+        var index;
+        var parentItem = 'parentItem';
+        var indexvalue = 'index';
+        var currentViewRecords = this.parent.grid.getCurrentViewRecords();
+        var childRecords = 'childRecords';
+        var data = (this.parent.grid.dataSource instanceof DataManager ?
+            this.parent.grid.dataSource.dataSource.json : this.parent.grid.dataSource);
+        var primaryKey = this.parent.grid.getPrimaryKeyFieldNames()[0];
+        if (!isNullOrUndefined(this.parent[targetElement])) {
+            var row = this.parent[targetElement].closest('tr');
+            this.parent.collapseRow(row);
+            this.parent[targetElement] = null;
+        }
+        if (!isNullOrUndefined(this.batchAddedRecords)) {
+            for (var i = 0; i < this.batchAddedRecords.length; i++) {
+                index = data.map(function (e) { return e[primaryKey]; }).indexOf(this.batchAddedRecords[i][primaryKey]);
+                data.splice(index, 1);
+                if (this.parent.editSettings.newRowPosition === 'Child') {
+                    index = currentViewRecords.map(function (e) { return e[primaryKey]; })
+                        .indexOf(this.batchAddedRecords[i][parentItem][primaryKey]);
+                    var children = currentViewRecords[index][childRecords];
+                    for (var j = 0; j < children.length; j++) {
+                        if (children[j][primaryKey] === this.batchAddedRecords[i][primaryKey]) {
+                            currentViewRecords[index][childRecords].splice(j, 1);
+                        }
+                    }
+                }
+            }
+        }
+        if (!isNullOrUndefined(this.batchDeletedRecords)) {
+            for (var i = 0; i < this.batchDeletedRecords.length; i++) {
+                if (!isNullOrUndefined(this.batchDeletedRecords[i][parentItem])) {
+                    index = currentViewRecords.map(function (e) { return e[primaryKey]; })
+                        .indexOf(this.batchDeletedRecords[i][parentItem][primaryKey]);
+                    var positionIndex = this.batchDeletedRecords[i][indexvalue] === 0 ? this.batchDeletedRecords[i][indexvalue] :
+                        this.batchDeletedRecords[i][indexvalue] - 1;
+                    currentViewRecords[index][childRecords].splice(positionIndex, 0, this.batchDeletedRecords[i]);
+                }
+            }
+        }
+        this.batchAddedRecords = this.batchRecords = this.batchAddRowRecord = this.currentViewRecords = [];
+        this.batchRecords = extendArray(this.parent.grid.getCurrentViewRecords());
+        this.batchIndex = 0;
+        this.currentViewRecords = extendArray(this.parent.grid.getCurrentViewRecords());
+        this.batchDeletedRecords = [];
+        this.parent.refresh();
+    };
+    BatchEdit.prototype.batchSave = function (args) {
+        if (this.parent.editSettings.mode === 'Batch') {
+            var i = void 0;
+            var batchChanges = this.parent.getBatchChanges();
+            var deletedRecords = 'deletedRecords';
+            var addedRecords = 'addedRecords';
+            var index = 'index';
+            var uniqueID = 'uniqueID';
+            var data = (this.parent.grid.dataSource instanceof DataManager ?
+                this.parent.grid.dataSource.dataSource.json : this.parent.grid.dataSource);
+            var currentViewRecords = this.parent.grid.getCurrentViewRecords();
+            var primarykey_1 = this.parent.grid.getPrimaryKeyFieldNames()[0];
+            var level = 'level';
+            var addRecords = batchChanges[addedRecords];
+            var parentItem = 'parentItem';
+            var selectedIndex = void 0;
+            var addRowIndex = void 0;
+            var columnName = void 0;
+            var addRowRecord = void 0;
+            var childRecords = 'childRecords';
+            if (addRecords.length > 1 && this.parent.editSettings.newRowPosition !== 'Bottom') {
+                addRecords.reverse();
+            }
+            if (this.parent.editSettings.newRowPosition !== 'Bottom') {
+                data.splice(data.length - addRecords.length, addRecords.length);
+                if (!this.parent.allowPaging) {
+                    if (currentViewRecords.length > addRecords.length) {
+                        currentViewRecords.splice(currentViewRecords.length - addRecords.length, addRecords.length);
+                    }
+                }
+                else {
+                    var totalRecords = extendArray(data);
+                    var startIndex = totalRecords.map(function (e) { return e[primarykey_1]; })
+                        .indexOf(currentViewRecords[0][primarykey_1]);
+                    var endIndex = startIndex + this.parent.grid.pageSettings.pageSize;
+                    currentViewRecords = totalRecords.splice(startIndex, endIndex);
+                }
+            }
+            for (i = 0; i < addRecords.length; i++) {
+                var taskData = extend({}, addRecords[i]);
+                delete taskData.parentItem;
+                delete taskData.uniqueID;
+                delete taskData.index;
+                delete taskData.level;
+                delete taskData.hasChildRecords;
+                delete taskData.childRecords;
+                delete taskData.parentUniqueID;
+                if (!isNullOrUndefined(taskData.primaryParent)) {
+                    delete taskData.primaryParent;
+                }
+                addRecords[i].taskData = taskData;
+                addRowRecord = this.batchAddRowRecord[i];
+                if (isNullOrUndefined(addRowRecord)) {
+                    addRowRecord = this.batchAddRowRecord[i - 1];
+                }
+                if (this.isSelfReference) {
+                    if (!isNullOrUndefined(addRecords[i].parentItem)) {
+                        updateParentRow(primarykey_1, addRecords[i].parentItem, 'add', this.parent, this.isSelfReference, addRecords[i]);
+                    }
+                }
+                if (!isNullOrUndefined(addRowRecord)) {
+                    addRowIndex = addRowRecord.index;
+                }
+                if (this.parent.editSettings.newRowPosition !== 'Top' && this.parent.editSettings.newRowPosition !== 'Bottom') {
+                    if (isNullOrUndefined(addRecords[i].parentItem) && this.selectedIndex === -1) {
+                        selectedIndex = -1;
+                        addRowRecord = null;
+                    }
+                }
+                editAction({ value: addRecords[i], action: 'add' }, this.parent, this.isSelfReference, addRowIndex, selectedIndex, columnName, addRowRecord);
+                selectedIndex = null;
+                if (this.parent.editSettings.newRowPosition === 'Child' && !isNullOrUndefined(addRecords[i][parentItem])) {
+                    var indexValue = currentViewRecords.map(function (e) { return e[primarykey_1]; })
+                        .indexOf(addRecords[i][parentItem][primarykey_1]);
+                    var children = currentViewRecords[indexValue][childRecords];
+                    for (var j = 0; j < children.length; j++) {
+                        if (children[j][primarykey_1] === addRecords[i][primarykey_1]) {
+                            currentViewRecords[indexValue][childRecords].splice(j, 1);
+                        }
+                    }
+                }
+            }
+            if (batchChanges[deletedRecords].length) {
+                for (i = 0; i < batchChanges[deletedRecords].length; i++) {
+                    editAction({ value: batchChanges[deletedRecords][i], action: 'delete' }, this.parent, this.isSelfReference, addRowIndex, selectedIndex, columnName, addRowRecord);
+                }
+            }
+            this.parent.parentData = [];
+            for (var i_1 = 0; i_1 < data.length; i_1++) {
+                data[i_1][index] = i_1;
+                setValue('uniqueIDCollection.' + data[i_1][uniqueID] + '.index', i_1, this.parent);
+                if (!data[i_1][level]) {
+                    this.parent.parentData.push(data[i_1]);
+                }
+            }
+        }
+        this.batchAddRowRecord = this.batchAddedRecords = this.batchRecords = this.batchDeletedRecords = this.currentViewRecords = [];
+    };
+    return BatchEdit;
+}());
+export { BatchEdit };

src/treegrid/actions/crud-actions.js

@@ -130,8 +130,3 @@ import { isNullOrUndefined, extend } from '@syncfusion/ej2-base';
         case 'Top':
-            if (control.editSettings.mode === 'Batch') {
-                treeData.splice(treeData.length, 0, value);
-            }
-            else {
-                treeData.unshift(value);
-            }
+            treeData.unshift(value);
             isSkip = true;
@@ -230,5 +225,3 @@ break;
         var parentData = getParentData(control, child.parentItem.uniqueID);
-        if (parentData.childRecords.indexOf(child) === -1) {
-            parentData.childRecords.push(child);
-        }
+        parentData.childRecords.push(child);
     }
@@ -258,20 +251,22 @@ else {
             var childRecords = child ? child instanceof Array ? child[0] : child : currentRecords[index_1 + 1];
-            if (!record.hasOwnProperty('childRecords')) {
-                record.childRecords = [];
-            }
-            else {
-                if (!isNullOrUndefined(child)) {
-                    record.childRecords.push(child);
+            if (control.editSettings.newRowPosition !== 'Below') {
+                if (!record.hasOwnProperty('childRecords')) {
+                    record.childRecords = [];
                 }
-            }
-            if (record.childRecords.indexOf(childRecords) === -1) {
-                record.childRecords.unshift(childRecords);
-            }
-            if (isSelfReference) {
-                if (!record.hasOwnProperty(control.childMapping)) {
-                    record[control.childMapping] = [];
+                else {
+                    if (!isNullOrUndefined(child) && record[key] !== child[key]) {
+                        record.childRecords.push(child);
+                    }
                 }
-                if (record[control.childMapping].indexOf(childRecords) === -1) {
-                    record[control.childMapping].unshift(childRecords);
+                if (record.childRecords.indexOf(childRecords) === -1 && record[key] !== child[key]) {
+                    record.childRecords.unshift(childRecords);
                 }
+                if (isSelfReference) {
+                    if (!record.hasOwnProperty(control.childMapping)) {
+                        record[control.childMapping] = [];
+                    }
+                    if (record[control.childMapping].indexOf(childRecords) === -1 && record[key] !== child[key]) {
+                        record[control.childMapping].unshift(childRecords);
+                    }
+                }
             }
@@ -290,2 +285,5 @@ }
         var row = control.getRowByIndex(index_1);
+        if (control.editSettings.mode === 'Batch') {
+            row = control.getRows()[control.grid.getRowIndexByPrimaryKey(record[key])];
+        }
         var movableRow = void 0;
@@ -292,0 +290,0 @@ if (control.frozenRows || control.getFrozenColumns()) {

src/treegrid/actions/edit.d.ts

@@ -11,2 +11,4 @@ import { Column } from '@syncfusion/ej2-grids';
     private isSelfReference;
+    private addedRecords;
+    private deletedRecords;
     private addRowIndex;
@@ -20,2 +22,3 @@ private addRowRecord;
     private previousNewRowPosition;
+    private batchEditModule;
     /**
@@ -60,2 +63,3 @@ * Constructor for Edit module
     private cellSave;
+    private blazorTemplates;
     private updateCell;
@@ -88,4 +92,2 @@ private crudAction;
     editCell(rowIndex?: number, field?: string): void;
-    private beforeBatchSave;
-    private batchSave;
 }

src/treegrid/actions/edit.js

 import { Grid, Edit as GridEdit, getUid, getObject } from '@syncfusion/ej2-grids';
 import * as events from '../base/constant';
 import { isNullOrUndefined, extend, setValue, removeClass, addClass, getValue, isBlazor } from '@syncfusion/ej2-base';
+import { updateBlazorTemplate } from '@syncfusion/ej2-base';
 import { DataManager, RemoteSaveAdaptor } from '@syncfusion/ej2-data';
 import { findChildrenRecords, getParentData, isRemoteData } from '../utils';
 import { editAction, updateParentRow } from './crud-actions';
-import { beforeBatchSaveAction, batchSaveAction } from './batch-edit';
+import { BatchEdit } from './batch-edit';
 /**
@@ -17,10 +18,10 @@ * TreeGrid Edit Module
     function Edit(parent) {
+        this.addedRecords = 'addedRecords';
+        this.deletedRecords = 'deletedRecords';
         Grid.Inject(GridEdit);
         this.parent = parent;
         this.isSelfReference = !isNullOrUndefined(parent.parentIdMapping);
-        // this.batchDeleted = {};
-        // this.batchRecords = [];
-        // this.isAdd = false;
         this.previousNewRowPosition = null;
         this.internalProperties = {};
+        this.batchEditModule = new BatchEdit(this.parent);
         this.addEventListener();
@@ -54,11 +55,4 @@ }
         // this.parent.on(events.beforeDataBound, this.beforeDataBound, this);
-        // this.parent.on(events.cellSaved, this.cellSaved, this);
-        // this.parent.on(events.batchDelete, this.batchDelete, this);
-        // this.parent.on(events.batchAdd, this.batchAdd, this);
-        // this.parent.on(events.beforeBatchAdd, this.beforeBatchAdd, this);
-        this.parent.on(events.beforeBatchSave, this.beforeBatchSave, this);
-        this.parent.on(events.batchSave, this.batchSave, this);
         this.parent.grid.on(events.beforeStartEdit, this.beforeStartEdit, this);
         this.parent.grid.on(events.beforeBatchCancel, this.beforeBatchCancel, this);
-        //this.parent.grid.on(events.batchEditFormRendered, this.batchEditFormRendered, this);
     };
@@ -72,7 +66,6 @@ Edit.prototype.gridDblClick = function (e) {
     Edit.prototype.beforeBatchCancel = function (args) {
-        this.parent.trigger(events.actionComplete, args);
+        if (this.parent.editSettings.mode === 'Cell') {
+            this.parent.trigger(events.actionComplete, args);
+        }
     };
-    /*private batchEditFormRendered(args: Object):void {
-      this.parent.trigger(events.actionComplete, args);
-    }*/
     /**
@@ -86,8 +79,5 @@ * @hidden
         this.parent.off(events.crudAction, this.crudAction);
-        this.parent.off(events.beforeBatchSave, this.beforeBatchSave);
-        this.parent.off(events.batchSave, this.batchSave);
         this.parent.off(events.beginEdit, this.beginEdit);
         this.parent.off(events.beginAdd, this.beginAdd);
         this.parent.off(events.recordDoubleClick, this.recordDoubleClick);
-        this.parent.off(events.cellSave, this.cellSave);
         this.parent.off(events.batchCancel, this.batchCancel);
@@ -105,3 +95,2 @@ this.parent.grid.off(events.keyPressed, this.keyPressed);
         //this.parent.grid.off('click', this.gridSingleClick);
-        //this.parent.grid.off(events.batchEditFormRendered, this.batchEditFormRendered);
     };
@@ -147,2 +136,5 @@ /**
         }
+        if (this.parent.editSettings.mode === 'Batch' && eventArgs.requestType === 'paging') {
+            this.parent.notify('batchPageAction', {});
+        }
     };
@@ -156,3 +148,3 @@ Edit.prototype.recordDoubleClick = function (args) {
         if (this.parent.editSettings.mode === 'Cell' && !this.isOnBatch && column && !column.isPrimaryKey &&
-            column.allowEditing && this.parent.editSettings.allowEditing && !(target.classList.contains('e-treegridexpand') ||
+            column.allowEditing && !(target.classList.contains('e-treegridexpand') ||
             target.classList.contains('e-treegridcollapse')) && this.parent.editSettings.allowEditOnDblClick) {
@@ -233,12 +225,5 @@ this.isOnBatch = true;
             var selectRowIndex = cellDetails.rowIndex;
-            var treeColumnIndexValue = void 0;
-            if (this.parent.allowRowDragAndDrop) {
-                treeColumnIndexValue = this.parent.treeColumnIndex + 1;
-            }
-            else {
-                treeColumnIndexValue = this.parent.treeColumnIndex;
-            }
             this.parent.renderModule.cellRender({
                 data: cellDetails.rowData,
-                cell: this.parent.getRows()[selectRowIndex].cells[treeColumnIndexValue],
+                cell: this.parent.getRows()[selectRowIndex].cells[this.parent.treeColumnIndex],
                 column: this.parent.grid.getColumns()[this.parent.treeColumnIndex]
@@ -250,26 +235,4 @@ });
         if (this.parent.editSettings.mode === 'Batch') {
-            var targetElement = 'targetElement';
-            if (!isNullOrUndefined(this.parent[targetElement])) {
-                var row = this.parent[targetElement].closest('tr');
-                this.parent.collapseRow(row);
-                this.parent[targetElement] = null;
-            }
+            this.parent.notify('batchCancelAction', {});
         }
-        // this.batchRecords = [];
-        // let keys: string[] = Object.keys(this.batchDeleted);
-        // let primaryLey: string = this.parent.grid.getPrimaryKeyFieldNames()[0];
-        // let currentViewRecords: ITreeData[] = this.parent.grid.getCurrentViewRecords();
-        // for (let i: number = 0; i < keys.length; i++) {
-        //   let index: number;
-        //   currentViewRecords.map((e: ITreeData, j: number) => {
-        //     if (this.batchDeleted.hasOwnProperty(keys[i]) && e[primaryLey] === this.batchDeleted[keys[i]][primaryLey]) {
-        //       index = j; return;
-        //     }
-        //   });
-        //   this.parent.renderModule.cellRender({
-        //     data: currentViewRecords[index],
-        //     cell: (<HTMLTableRowElement>this.parent.getRowByIndex(index)).cells[this.parent.treeColumnIndex],
-        //     column: this.parent.grid.getColumns()[this.parent.treeColumnIndex]
-        //   });
-        // }
     };
@@ -310,2 +273,3 @@ Edit.prototype.cellSave = function (args) {
             if (!arg.cancel) {
+                this.blazorTemplates(args);
                 this.updateCell(args, rowIndex_1);
@@ -323,2 +287,3 @@ if (this.parent.grid.aggregateModule) {
                 removeClass(row.querySelectorAll('.e-rowcell'), ['e-editedbatchcell', 'e-updatedtd']);
+                this.parent.grid.focusModule.restoreFocus();
                 editAction({ value: args.rowData, action: 'edit' }, this.parent, this.isSelfReference, this.addRowIndex, this.selectedIndex, args.columnName);
@@ -336,2 +301,22 @@ var saveArgs = {
     };
+    Edit.prototype.blazorTemplates = function (args) {
+        if (isBlazor() && this.parent.isServerRendered) {
+            var cols = this.parent.grid.getColumns();
+            var colModel = 'columnModel';
+            var columnModel = this.parent.grid[colModel];
+            var str = 'isStringTemplate';
+            for (var i = 0; i < cols.length; i++) {
+                if (columnModel[i].template) {
+                    var templateID = this.parent.grid.element.id + cols[i].uid;
+                    columnModel[i].getColumnTemplate()(extend({ 'index': [i] }, args.rowData), this.parent.grid, 'template', templateID, this.parent.grid[str], null);
+                }
+                if (cols[i].editTemplate) {
+                    updateBlazorTemplate(this.parent.grid.element.id + cols[i].uid + 'editTemplate', 'EditTemplate', cols[i]);
+                }
+                if (cols[i].template) {
+                    updateBlazorTemplate(this.parent.grid.element.id + cols[i].uid, 'Template', cols[i], false);
+                }
+            }
+        }
+    };
     Edit.prototype.updateCell = function (args, rowIndex) {
@@ -419,2 +404,10 @@ this.parent.grid.editModule.updateRow(rowIndex, args.rowData);
         var records = this.parent.grid.getCurrentViewRecords();
+        if (this.parent.editSettings.mode === 'Batch') {
+            index = this.batchEditModule.getAddRowIndex();
+            this.selectedIndex = this.batchEditModule.getSelectedIndex();
+            if (this.parent.getBatchChanges()[this.addedRecords].length > 1
+                || this.parent.getBatchChanges()[this.deletedRecords].length) {
+                records = this.batchEditModule.getBatchRecords();
+            }
+        }
         var rows = this.parent.grid.getDataRows();
@@ -429,8 +422,18 @@ var movableRows;
             }
-            else if ((this.parent.editSettings.newRowPosition === 'Below' || this.parent.editSettings.newRowPosition === 'Child')
+            else if ((this.parent.editSettings.newRowPosition === 'Below' ||
+                this.parent.editSettings.newRowPosition === 'Child')
                 && this.selectedIndex > -1) {
                 position = 'after';
-                // let records: Object[] = this.batchRecords.length ? this.batchRecords : this.parent.grid.getCurrentViewRecords();
                 if (records[index].expanded) {
-                    index += findChildrenRecords(records[index]).length;
+                    if (this.parent.editSettings.mode === 'Batch' && (this.parent.getBatchChanges()[this.addedRecords].length > 1
+                        || this.parent.getBatchChanges()[this.deletedRecords].length)) {
+                        index += findChildrenRecords(records[index]).length;
+                        if (this.parent.editSettings.newRowPosition !== 'Child') {
+                            var batchChildCount = this.batchEditModule.getBatchChildCount();
+                            index = index + batchChildCount;
+                        }
+                    }
+                    else {
+                        index += findChildrenRecords(records[index]).length;
+                    }
                 }
@@ -445,4 +448,6 @@ }
                 rows[index + 1][position](rows[0]);
+                setValue('batchIndex', index + 1, this.batchEditModule);
                 if (this.parent.frozenRows || this.parent.getFrozenColumns()) {
                     movableRows[index + 1][position](movableRows[0]);
+                    setValue('batchIndex', index + 1, this.batchEditModule);
                 }
@@ -693,12 +698,4 @@ if (this.parent.editSettings.mode === 'Row' || this.parent.editSettings.mode === 'Cell') {
     };
-    Edit.prototype.beforeBatchSave = function (e) {
-        beforeBatchSaveAction(e, this.parent);
-    };
-    Edit.prototype.batchSave = function (args) {
-        if (this.parent.editSettings.mode === 'Batch') {
-            batchSaveAction(this.parent);
-        }
-    };
     return Edit;
 }());
 export { Edit };

src/treegrid/actions/index.d.ts

@@ -13,2 +13,3 @@ /**
 export * from './resize';
+export * from './clipboard';
 export * from './column-menu';
@@ -22,2 +23,1 @@ export * from './context-menu';
 export * from './freeze-column';
-export * from './rowdragdrop';

src/treegrid/actions/index.js

@@ -13,2 +13,3 @@ /**
 export * from './resize';
+export * from './clipboard';
 export * from './column-menu';
@@ -22,2 +23,1 @@ export * from './context-menu';
 export * from './freeze-column';
-export * from './rowdragdrop';

src/treegrid/actions/reorder.js

@@ -43,3 +43,4 @@ import { getObject, Grid, Reorder as GridReorder } from '@syncfusion/ej2-grids';
     Reorder.prototype.getTreeColumn = function () {
-        var treeColumn = this.parent.columns[this.parent.treeColumnIndex];
+        var columnModel = 'columnModel';
+        var treeColumn = this.parent[columnModel][this.parent.treeColumnIndex];
         var treeIndex;
@@ -46,0 +47,0 @@ var updatedCols = this.parent.getColumns();

src/treegrid/actions/rowdragdrop.js

@@ -364,8 +364,2 @@ import { Grid, RowDD as GridDragDrop, parentsUntil } from '@syncfusion/ej2-grids';
             spanContent.innerHTML = content;
-            if (!isNullOrUndefined(spanContent.children) && spanContent.children.length >= 1
-                && spanContent.children[0].classList.contains('e-treecolumn-container')) {
-                spanContent.children[0].style.display = 'inline-block';
-                spanContent.children[0].style.verticalAlign = 'middle';
-                ele.style.display = 'inline-block';
-            }
             dragelem.querySelector('.e-rowcell').appendChild(ele);
@@ -809,3 +803,2 @@ dragelem.querySelector('.e-rowcell').appendChild(spanContent);
                 var idx = void 0;
-                var idz = void 0;
                 var treeGridData = dataSource;
@@ -817,11 +810,5 @@ for (var i = 0; i < treeGridData.length; i++) {
                 }
-                for (var i = 0; i < this.treeGridData.length; i++) {
-                    if (this.treeGridData[i][this.parent.idMapping] === deletedRow.taskData[this.parent.idMapping]) {
-                        idz = i;
-                        break;
-                    }
-                }
-                if (idx !== -1 || idz !== -1) {
+                if (idx !== -1) {
                     dataSource.splice(idx, 1);
-                    this.treeGridData.splice(idz, 1);
+                    this.treeGridData.splice(idx, 1);
                 }
@@ -828,0 +815,0 @@ }

src/treegrid/actions/selection.js

@@ -1,6 +0,6 @@
-import { isNullOrUndefined, removeClass, isBlazor, addClass } from '@syncfusion/ej2-base';
+import { isNullOrUndefined, removeClass, isBlazor } from '@syncfusion/ej2-base';
 import { createCheckBox } from '@syncfusion/ej2-buttons';
 import { parentsUntil, getObject } from '@syncfusion/ej2-grids';
 import * as events from '../base/constant';
-import { getParentData } from '../utils';
+import { getParentData, isRemoteData, isCheckboxcolumn } from '../utils';
 /**
@@ -60,3 +60,3 @@ * TreeGrid Selection module
             rowIndex = [];
-            rowIndex.push(+target.closest('tr').getAttribute('aria-rowindex'));
+            rowIndex.push(target.closest('tr').rowIndex);
             this.selectCheckboxes(rowIndex);
@@ -72,26 +72,2 @@ this.triggerChkChangeEvent(checkBox, checkBox.nextElementSibling.classList.contains('e-check'), target.closest('tr'));
         }
-        var summaryLength = Object.keys(this.parent.aggregates).length;
-        var childSummary;
-        for (var i = 0; i < summaryLength; i++) {
-            if (this.parent.aggregates[i].showChildSummary) {
-                childSummary = true;
-                break;
-            }
-        }
-        if (childSummary) {
-            var checkedLen = this.parent.getSelectedRowIndexes().length;
-            var totalRecords = [];
-            var isSummaryRow = 'isSummaryRow';
-            for (var i = 0; i < this.parent.getCurrentViewRecords().length; i++) {
-                if (!this.parent.getCurrentViewRecords()[i][isSummaryRow]) {
-                    totalRecords.push(this.parent.getCurrentViewRecords()[i]);
-                }
-            }
-            if (checkedLen === totalRecords.length) {
-                var getCheckAllBox = 'getCheckAllBox';
-                var spanEle = this.parent.grid.selectionModule[getCheckAllBox]().nextElementSibling;
-                removeClass([spanEle], ['e-check', 'e-stop', 'e-uncheck']);
-                addClass([spanEle], ['e-check']);
-            }
-        }
     };
@@ -141,2 +117,9 @@ Selection.prototype.triggerChkChangeEvent = function (checkBox, checkState, rowElement) {
         }
+        else if (this.columnIndex > -1 && this.parent.getHeaderContent().querySelectorAll('.e-treeselectall').length > 0) {
+            var checkWrap = this.parent.getHeaderContent().querySelectorAll('.e-checkbox-wrapper')[0];
+            var checkBoxvalue = checkWrap.querySelector('.e-frame').classList.contains('e-check');
+            if (this.parent.autoCheckHierarchy && checkBoxvalue) {
+                this.headerSelection(checkBoxvalue);
+            }
+        }
     };
@@ -279,2 +262,3 @@ Selection.prototype.renderColumnCheckbox = function (args) {
     Selection.prototype.headerSelection = function (checkAll) {
+        var _this = this;
         var adaptorName = 'adaptorName';
@@ -286,3 +270,3 @@ var index = -1;
             this.parent.flatData;
-        data = (isBlazor() && this.parent.dataSource[adaptorName] === 'BlazorAdaptor') ?
+        data = (isBlazor() && this.parent.dataSource[adaptorName] === 'BlazorAdaptor') || isRemoteData(this.parent) ?
             this.parent.getCurrentViewRecords() : data;
@@ -310,6 +294,14 @@ if (!isNullOrUndefined(checkAll)) {
         }
+        if (checkAll === false && this.parent.enableVirtualization) {
+            this.selectedItems = [];
+            this.selectedIndexes = [];
+            data.filter(function (rec) {
+                rec.checkboxState = 'uncheck';
+                _this.updateSelectedItems(rec, rec.checkboxState);
+            });
+        }
         length = this.selectedItems.length;
         var checkbox = this.parent.getHeaderContent().querySelectorAll('.e-frame')[0];
         if (length > 0 && data.length > 0) {
-            if (length !== data.length) {
+            if (length !== data.length && !checkAll) {
                 removeClass([checkbox], ['e-check']);
@@ -388,51 +380,55 @@ checkbox.classList.add('e-stop');
     Selection.prototype.updateGridActions = function (args) {
+        var _this = this;
         var requestType = args.requestType;
         var childData;
         var childLength;
-        if (this.parent.autoCheckHierarchy) {
-            if ((requestType === 'sorting' || requestType === 'paging')) {
-                childData = this.parent.getCurrentViewRecords();
-                childLength = childData.length;
-                this.selectedIndexes = [];
-                for (var i = 0; i < childLength; i++) {
-                    this.updateSelectedItems(childData[i], childData[i].checkboxState, true);
+        if (isCheckboxcolumn(this.parent)) {
+            if (this.parent.autoCheckHierarchy) {
+                if ((requestType === 'sorting' || requestType === 'paging')) {
+                    childData = this.parent.getCurrentViewRecords();
+                    childLength = childData.length;
+                    this.selectedIndexes = [];
+                    for (var i = 0; i < childLength; i++) {
+                        this.updateSelectedItems(childData[i], childData[i].checkboxState, true);
+                    }
                 }
-            }
-            else if (requestType === 'delete' || args.action === 'add') {
-                var updatedData = [];
-                if (requestType === 'delete') {
-                    updatedData = args.data;
-                }
-                else {
-                    updatedData.push(args.data);
-                }
-                for (var i = 0; i < updatedData.length; i++) {
+                else if (requestType === 'delete' || args.action === 'add') {
+                    var updatedData = [];
                     if (requestType === 'delete') {
-                        var index = this.parent.flatData.indexOf(updatedData[i]);
-                        var checkedIndex = this.selectedIndexes.indexOf(index);
-                        this.selectedIndexes.splice(checkedIndex, 1);
-                        this.updateSelectedItems(updatedData[i], 'uncheck');
+                        updatedData = args.data;
                     }
-                    if (!isNullOrUndefined(updatedData[i].parentItem)) {
-                        this.updateParentSelection(updatedData[i].parentItem);
+                    else {
+                        updatedData.push(args.data);
                     }
-                }
-            }
-            else if (args.requestType === 'add' && this.parent.autoCheckHierarchy) {
-                args.data.checkboxState = 'uncheck';
-            }
-            else if (requestType === 'filtering' || requestType === 'searching' || requestType === 'refresh') {
-                this.selectedItems = [];
-                this.selectedIndexes = [];
-                childData = (!isNullOrUndefined(this.parent.filterModule) && this.parent.filterModule.filteredResult.length > 0) ?
-                    this.parent.getCurrentViewRecords() : this.parent.flatData;
-                for (var i = 0; i < childData.length; i++) {
-                    if (childData[i].hasChildRecords) {
-                        this.updateParentSelection(childData[i]);
+                    for (var i = 0; i < updatedData.length; i++) {
+                        if (requestType === 'delete') {
+                            var index = this.parent.flatData.indexOf(updatedData[i]);
+                            var checkedIndex = this.selectedIndexes.indexOf(index);
+                            this.selectedIndexes.splice(checkedIndex, 1);
+                            this.updateSelectedItems(updatedData[i], 'uncheck');
+                        }
+                        if (!isNullOrUndefined(updatedData[i].parentItem)) {
+                            this.updateParentSelection(updatedData[i].parentItem);
+                        }
                     }
-                    else {
-                        this.updateSelectedItems(childData[i], childData[i].checkboxState);
-                    }
                 }
-                this.headerSelection();
+                else if (args.requestType === 'add' && this.parent.autoCheckHierarchy) {
+                    args.data.checkboxState = 'uncheck';
+                }
+                else if (requestType === 'filtering' || requestType === 'searching' || requestType === 'refresh'
+                    && !isRemoteData(this.parent)) {
+                    this.selectedItems = [];
+                    this.selectedIndexes = [];
+                    childData = (!isNullOrUndefined(this.parent.filterModule) && this.parent.filterModule.filteredResult.length > 0) ?
+                        this.parent.getCurrentViewRecords() : this.parent.flatData;
+                    childData.forEach(function (record) {
+                        if (record.hasChildRecords) {
+                            _this.updateParentSelection(record);
+                        }
+                        else {
+                            _this.updateSelectedItems(record, record.checkboxState);
+                        }
+                    });
+                    this.headerSelection();
+                }
             }
@@ -439,0 +435,0 @@ }

src/treegrid/actions/toolbar.js

@@ -41,25 +41,28 @@ import { Grid, Toolbar as tool } from '@syncfusion/ej2-grids';
         var isParent;
-        if (args.rowIndex === 0 || tObj.getSelectedRecords().length > 1) {
+        if (args.row.rowIndex === 0 || tObj.getSelectedRecords().length > 1) {
             this.enableItems([tObj.element.id + '_gridcontrol_indent', tObj.element.id + '_gridcontrol_outdent'], false);
         }
         else {
-            if (tObj.getCurrentViewRecords()[args.rowIndex].level >
-                tObj.getCurrentViewRecords()[args.rowIndex - 1].level) {
-                this.enableItems([tObj.element.id + '_gridcontrol_indent'], false);
+            if (!isNullOrUndefined(tObj.getCurrentViewRecords()[args.row.rowIndex])) {
+                if (!isNullOrUndefined(tObj.getCurrentViewRecords()[args.row.rowIndex]) &&
+                    (tObj.getCurrentViewRecords()[args.row.rowIndex].level >
+                        tObj.getCurrentViewRecords()[args.row.rowIndex - 1].level)) {
+                    this.enableItems([tObj.element.id + '_gridcontrol_indent'], false);
+                }
+                else {
+                    this.enableItems([tObj.element.id + '_gridcontrol_indent'], true);
+                }
+                if (tObj.getCurrentViewRecords()[args.row.rowIndex].level ===
+                    tObj.getCurrentViewRecords()[args.row.rowIndex - 1].level) {
+                    this.enableItems([tObj.element.id + '_gridcontrol_indent'], true);
+                }
+                if (tObj.getCurrentViewRecords()[args.row.rowIndex].level === 0) {
+                    this.enableItems([tObj.element.id + '_gridcontrol_outdent'], false);
+                }
+                if (tObj.getCurrentViewRecords()[args.row.rowIndex].level !== 0) {
+                    this.enableItems([tObj.element.id + '_gridcontrol_outdent'], true);
+                }
             }
-            else {
-                this.enableItems([tObj.element.id + '_gridcontrol_indent'], true);
-            }
-            if (tObj.getCurrentViewRecords()[args.rowIndex].level ===
-                tObj.getCurrentViewRecords()[args.rowIndex - 1].level) {
-                this.enableItems([tObj.element.id + '_gridcontrol_indent'], true);
-            }
-            if (tObj.getCurrentViewRecords()[args.rowIndex].level === 0) {
-                this.enableItems([tObj.element.id + '_gridcontrol_outdent'], false);
-            }
-            if (tObj.getCurrentViewRecords()[args.rowIndex].level !== 0) {
-                this.enableItems([tObj.element.id + '_gridcontrol_outdent'], true);
-            }
         }
-        if (args.rowIndex === 0 && !isNullOrUndefined(args.data.parentItem)) {
+        if (args.row.rowIndex === 0 && !isNullOrUndefined(args.data.parentItem)) {
             this.enableItems([tObj.element.id + '_gridcontrol_outdent'], true);
@@ -66,0 +69,0 @@ }

src/treegrid/base/constant.d.ts

@@ -56,2 +56,6 @@ /**
 /** @hidden */
+export declare const beforeCopy: string;
+/** @hidden */
+export declare const beforePaste: string;
+/** @hidden */
 export declare const savePreviousRowPosition: string;
@@ -79,2 +83,4 @@ /** @hidden */
 /** @hidden */
+export declare const beforeBatchDelete: string;
+/** @hidden */
 export declare const beforeBatchAdd: string;
@@ -81,0 +87,0 @@ /** @hidden */

src/treegrid/base/constant.js

@@ -56,2 +56,6 @@ /**
 /** @hidden */
+export var beforeCopy = 'beforeCopy';
+/** @hidden */
+export var beforePaste = 'beforePaste';
+/** @hidden */
 export var savePreviousRowPosition = 'savePreviousRowPosition';
@@ -79,2 +83,4 @@ /** @hidden */
 /** @hidden */
+export var beforeBatchDelete = 'beforeBatchDelete';
+/** @hidden */
 export var beforeBatchAdd = 'beforeBatchAdd';
@@ -81,0 +87,0 @@ /** @hidden */

src/treegrid/base/data.d.ts

@@ -53,2 +53,3 @@ import { TreeGrid } from './treegrid';
     private collectExpandingRecs;
+    private remoteVirtualAction;
     private beginSorting;
@@ -55,0 +56,0 @@ private createRecords;

src/treegrid/base/data.js

@@ -199,2 +199,3 @@ import { extend, isNullOrUndefined, setValue, getValue, isBlazor, addClass, removeClass } from '@syncfusion/ej2-base';
                         records[rec].hasChildRecords = true;
+                        records[rec].checkboxState = 'uncheck';
                     }
@@ -204,6 +205,8 @@ }
             else {
-                this.convertToFlatData(records);
+                if (!isNullOrUndefined(records)) {
+                    this.convertToFlatData(records);
+                }
             }
         }
-        args.result = (this.parent.dataSource[adaptorName] === 'BlazorAdaptor' && !this.parent[clientRender])
+        args.result = (this.parent.dataSource[adaptorName] === 'BlazorAdaptor' && !this.parent[clientRender] && !isNullOrUndefined(records))
             || this.parent.loadChildOnDemand ? this.parent.flatData : records;
@@ -296,3 +299,3 @@ this.parent.notify('updateResults', args);
                 hideSpinner(_this.parent.element);
-                if (_this.parent.grid.aggregates.length > 0) {
+                if (_this.parent.grid.aggregates.length > 0 && !_this.parent.enableVirtualization) {
                     var gridQuery = getObject('query', e);
@@ -309,3 +312,7 @@ var result_1 = 'result';
                 e.count = _this.parent.grid.pageSettings.totalRecordsCount;
-                getValue('grid.renderModule', _this.parent).dataManagerSuccess(e);
+                var virtualArgs = {};
+                if (_this.parent.enableVirtualization) {
+                    _this.remoteVirtualAction(virtualArgs);
+                }
+                getValue('grid.renderModule', _this.parent).dataManagerSuccess(e, virtualArgs);
                 _this.parent.trigger(events.expanded, args);
@@ -315,2 +322,12 @@ });
     };
+    DataManipulation.prototype.remoteVirtualAction = function (virtualArgs) {
+        virtualArgs.requestType = 'refresh';
+        setValue('isExpandCollapse', true, virtualArgs);
+        var contentModule = getValue('grid.contentModule', this.parent);
+        var currentInfo = getValue('currentInfo', contentModule);
+        var prevInfo = getValue('prevInfo', contentModule);
+        if (currentInfo.loadNext && this.parent.grid.pageSettings.currentPage === currentInfo.nextInfo.page) {
+            this.parent.grid.pageSettings.currentPage = prevInfo.page;
+        }
+    };
     DataManipulation.prototype.beginSorting = function () {
@@ -317,0 +334,0 @@ this.isSortAction = true;

src/treegrid/base/index.d.ts

@@ -9,1 +9,4 @@ /**
 export * from './interface';
+export * from '../actions/reorder';
+export * from '../actions/resize';
+export * from '../actions/rowdragdrop';

src/treegrid/base/index.js

@@ -7,1 +7,4 @@ /**
 export * from './data';
+export * from '../actions/reorder';
+export * from '../actions/resize';
+export * from '../actions/rowdragdrop';

src/treegrid/base/interface.d.ts

@@ -63,2 +63,6 @@ import { Column } from '../models/column';
     taskData?: ITreeData;
+    /**
+     * Specifies the Primary data
+     */
+    primaryParent?: ITreeData;
 }
@@ -65,0 +69,0 @@ export interface AggregateTemplateContext {

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

@@ -1,2 +0,2 @@
-import { Component, addClass, createElement, EventHandler, isNullOrUndefined, Ajax, ModuleDeclaration, extend} from '@syncfusion/ej2-base';import { removeClass, EmitType, Complex, Collection, KeyboardEventArgs, isBlazor, getElement, getValue } from '@syncfusion/ej2-base';import {Event, Property, NotifyPropertyChanges, INotifyPropertyChanged, setValue, KeyboardEvents, L10n } from '@syncfusion/ej2-base';import { Column, ColumnModel } from '../models/column';import { GridModel, ColumnQueryModeType, HeaderCellInfoEventArgs, EditSettingsModel as GridEditModel } from '@syncfusion/ej2-grids';import {RowDragEventArgs, RowDropEventArgs, RowDropSettingsModel, RowDropSettings, ReturnType, getUid } from '@syncfusion/ej2-grids';import { ActionEventArgs } from'@syncfusion/ej2-grids';import { DetailDataBoundEventArgs, Row}  from '@syncfusion/ej2-grids';import { SearchEventArgs, AddEventArgs, EditEventArgs, DeleteEventArgs, BeforeBatchSaveArgs}  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 { gridObserver } from '@syncfusion/ej2-grids';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 } from '../utils';import { Grid, QueryCellInfoEventArgs } from '@syncfusion/ej2-grids';import { Render } from '../renderer/render';import { DataManipulation } from './data';import { RowDD } from '../actions/rowdragdrop';import { Sort } from '../actions/sort';import { ITreeData, RowExpandedEventArgs, RowCollapsedEventArgs, RowCollapsingEventArgs } from './interface';import { CellSaveEventArgs, DataStateChangeEventArgs, RowExpandingEventArgs } from './interface';import { iterateArrayOrObject, GridLine } from '@syncfusion/ej2-grids';import { DataSourceChangedEventArgs, RecordDoubleClickEventArgs, ResizeArgs } from '@syncfusion/ej2-grids';import { ToolbarItems, ToolbarItem, ContextMenuItem, ContextMenuItems, RowPosition } 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 { Component, addClass, createElement, EventHandler, isNullOrUndefined, Ajax, ModuleDeclaration, extend} from '@syncfusion/ej2-base';import { removeClass, EmitType, Complex, Collection, KeyboardEventArgs, isBlazor, getElement, 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, ReturnType, getUid } from '@syncfusion/ej2-grids';import { ActionEventArgs } from'@syncfusion/ej2-grids';import { DetailDataBoundEventArgs, Row, ClipMode}  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 { gridObserver, 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 } from '../utils';import { Grid, QueryCellInfoEventArgs } 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 } from './interface';import { CellSaveEventArgs, DataStateChangeEventArgs, RowExpandingEventArgs } 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 {ComponentModel} from '@syncfusion/ej2-base';
@@ -22,2 +22,15 @@
     /**
+   *  Defines the mode of clip. The available modes are, 
+   * `Clip`: Truncates the cell content when it overflows its area. 
+   * `Ellipsis`: Displays ellipsis when the cell content overflows its area.
+   * `EllipsisWithTooltip`:  Displays ellipsis when the cell content overflows its area,
+   *  also it will display the tooltip while hover on ellipsis is applied.. 
+   * @default Syncfusion.EJ2.Grids.ClipMode.Ellipsis
+   * @aspType Syncfusion.EJ2.Grids.ClipMode
+   * @isEnumeration true
+   * @blazorType Syncfusion.Blazor.Grids.ClipMode
+   */
+    clipMode?: ClipMode;
+
+    /**
    * Defines the schema of dataSource. 
@@ -89,3 +102,3 @@ * If the `columns` declaration is empty or undefined then the `columns` are automatically generated from data source.
    * @default null    
-   * @blazorType Syncfusion.EJ2.Blazor.Data.Query
+   * @blazorType Syncfusion.Blazor.Data.Query
    */
@@ -106,3 +119,3 @@ query?: Query;
   * @aspType Syncfusion.EJ2.Grids.PrintMode
-  * @blazorType Syncfusion.EJ2.Blazor.Grids.PrintMode
+  * @blazorType Syncfusion.Blazor.Grids.PrintMode
   */
@@ -276,3 +289,3 @@ printMode?: PrintMode;
    * @aspType Syncfusion.EJ2.Grids.GridLine
-   * @blazorType Syncfusion.EJ2.Blazor.Grids.GridLine
+   * @blazorType Syncfusion.Blazor.Grids.GridLine
    */
@@ -329,2 +342,14 @@ gridLines?: GridLine;
     /**
+     * `copyHierarchyMode` Defines the copy clipboard types.
+     * <br><br> 
+     * The available built-in items are,
+     * * `Parent` - Copy the selected data with parent record. 
+     * * `Child` - Copy the selected data with child record.
+     * * `Both` - Copy the selected data with both parent and child record.
+     * * `None` - Copy only the selected record.
+     * @default Parent
+     */
+    copyHierarchyMode?: CopyHierarchyType;
+
+    /**
    * Defines the height of TreeGrid rows.
@@ -436,3 +461,3 @@ * @default null
    * @blazorproperty 'OnCellSave'
-   * @blazorType Syncfusion.EJ2.Blazor.Grids.CellSaveArgs<TValue>
+   * @blazorType Syncfusion.Blazor.Grids.CellSaveArgs<TValue>
    */
@@ -442,6 +467,14 @@ cellSave?: EmitType<CellSaveArgs>;
     /**
+   * Triggers when cell is saved.
+   * @event
+   * @blazorproperty 'CellSaved'
+   * @blazorType Syncfusion.Blazor.Grids.CellSaveArgs<TValue>
+   */
+    cellSaved?: EmitType<CellSaveArgs>;
+
+    /**
    * Triggers when TreeGrid actions such as sorting, filtering, paging etc., starts.
    * @event
    * @blazorproperty 'OnActionBegin'
-   * @blazorType Syncfusion.EJ2.Blazor.Grids.ActionEventArgs<TValue>
+   * @blazorType Syncfusion.Blazor.Grids.ActionEventArgs<TValue>
    */
@@ -454,3 +487,3 @@ actionBegin?: EmitType<PageEventArgs | FilterEventArgs | SortEventArgs | SearchEventArgs | AddEventArgs | SaveEventArgs | EditEventArgs | DeleteEventArgs>;
    * @blazorproperty 'OnActionComplete'
-   * @blazorType Syncfusion.EJ2.Blazor.Grids.ActionEventArgs<TValue>
+   * @blazorType Syncfusion.Blazor.Grids.ActionEventArgs<TValue>
    */
@@ -464,3 +497,3 @@
    * @blazorproperty 'OnBeginEdit'
-   * @blazorType Syncfusion.EJ2.Blazor.Grids.BeginEditArgs<TValue>
+   * @blazorType Syncfusion.Blazor.Grids.BeginEditArgs<TValue>
    */
@@ -470,6 +503,42 @@ beginEdit?: EmitType<BeginEditArgs>;
     /**
+   * Triggers when records are added in batch mode.
+   * @event
+   */
+    batchAdd?: EmitType<BatchAddArgs>;
+
+    /**
+   * Triggers when records are deleted in batch mode.
+   * @event
+   */
+    batchDelete?: EmitType<BatchDeleteArgs>;
+
+    /**
+   * Triggers before records are added in batch mode.
+   * @event
+   */
+    batchCancel?: EmitType<BatchCancelArgs>;
+
+    /**
+   * Triggers before records are added in batch mode.
+   * @event
+   */
+    beforeBatchAdd?: EmitType<BeforeBatchAddArgs>;
+
+    /**
+   * Triggers before records are deleted in batch mode.
+   * @event
+   */
+    beforeBatchDelete?: EmitType<BeforeBatchDeleteArgs>;
+
+    /**
+   * Triggers before records are saved in batch mode.
+   * @event
+   */
+    beforeBatchSave?: EmitType<BeforeBatchSaveArgs>;
+
+    /**
    * Triggers when the cell is being edited.
    * @event
    * @blazorproperty 'OnCellEdit'
-   * @blazorType Syncfusion.EJ2.Blazor.Grids.CellEditArgs<TValue>
+   * @blazorType Syncfusion.Blazor.Grids.CellEditArgs<TValue>
    */
@@ -482,3 +551,3 @@ cellEdit?: EmitType<CellEditArgs>;
    * @blazorproperty 'OnActionFailure'
-   * @blazorType Syncfusion.EJ2.Blazor.Grids.FailureEventArgs
+   * @blazorType Syncfusion.Blazor.Grids.FailureEventArgs
    */
@@ -498,5 +567,5 @@ actionFailure?: EmitType<FailureEventArgs>;
    * @event
-   * @deprecated
+
    * @blazorProperty 'dataSourceUpdated'
-   * @blazorType Syncfusion.EJ2.Blazor.Grids.DataSourceChangedEventArgs
+   * @blazorType Syncfusion.Blazor.Grids.DataSourceChangedEventArgs
    */
@@ -509,4 +578,4 @@ dataSourceChanged?: EmitType<DataSourceChangedEventArgs>;
    * @event
-   * @deprecated
-   * @blazorType Syncfusion.EJ2.Blazor.Grids.DataStateChangeEventArgs
+
+   * @blazorType Syncfusion.Blazor.Grids.DataStateChangeEventArgs
    */
@@ -519,3 +588,3 @@ dataStateChange?: EmitType<DataStateChangeEventArgs>;
    * @blazorproperty 'OnRecordDoubleClick'
-   * @blazorType Syncfusion.EJ2.Blazor.Grids.RecordDoubleClickEventArgs<TValue>
+   * @blazorType Syncfusion.Blazor.Grids.RecordDoubleClickEventArgs<TValue>
    */
@@ -529,3 +598,3 @@ recordDoubleClick?: EmitType<RecordDoubleClickEventArgs>;
    * @blazorproperty 'RowDataBound'
-   * @blazorType Syncfusion.EJ2.Blazor.Grids.RowDataBoundEventArgs<TValue>
+   * @blazorType Syncfusion.Blazor.Grids.RowDataBoundEventArgs<TValue>
    */
@@ -539,3 +608,3 @@ rowDataBound?: EmitType<RowDataBoundEventArgs>;
    * @blazorproperty 'DetailDataBound'
-   * @blazorType Syncfusion.EJ2.Blazor.Grids.DetailDataBoundEventArgs<TValue>
+   * @blazorType Syncfusion.Blazor.Grids.DetailDataBoundEventArgs<TValue>
    */
@@ -549,3 +618,3 @@ detailDataBound?: EmitType<DetailDataBoundEventArgs>;
    * @blazorproperty 'QueryCellInfo'
-   * @blazorType Syncfusion.EJ2.Blazor.Grids.QueryCellInfoEventArgs<TValue>
+   * @blazorType Syncfusion.Blazor.Grids.QueryCellInfoEventArgs<TValue>
    */
@@ -564,3 +633,3 @@ queryCellInfo?: EmitType<QueryCellInfoEventArgs>;
      * @blazorproperty 'RowSelecting'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.RowSelectingEventArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.RowSelectingEventArgs<TValue>
      */
@@ -573,3 +642,3 @@ rowSelecting?: EmitType<RowSelectingEventArgs>;
      * @blazorproperty 'RowSelected'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.RowSelectEventArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.RowSelectEventArgs<TValue>
      */
@@ -581,4 +650,4 @@ rowSelected?: EmitType<RowSelectEventArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.RowDeselectEventArgs<TValue>
+
+     * @blazorType Syncfusion.Blazor.Grids.RowDeselectEventArgs<TValue>
      */
@@ -591,3 +660,3 @@ rowDeselecting?: EmitType<RowDeselectEventArgs>;
      * @blazorproperty 'RowDeselected'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.RowDeselectEventArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.RowDeselectEventArgs<TValue>
      */
@@ -600,3 +669,3 @@ rowDeselected?: EmitType<RowDeselectEventArgs>;
      * @blazorproperty 'HeaderCellInfo'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.HeaderCellInfoEventArgs 
+     * @blazorType Syncfusion.Blazor.Grids.HeaderCellInfoEventArgs 
      */
@@ -609,3 +678,3 @@ headerCellInfo?: EmitType<HeaderCellInfoEventArgs>;
        * @blazorproperty 'CellSelecting'
-       * @blazorType Syncfusion.EJ2.Blazor.Grids.CellSelectingEventArgs<TValue>
+       * @blazorType Syncfusion.Blazor.Grids.CellSelectingEventArgs<TValue>
        */
@@ -617,4 +686,4 @@ cellSelecting?: EmitType<CellSelectingEventArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.ColumnMenuOpenEventArgs
+
+     * @blazorType Syncfusion.Blazor.Grids.ColumnMenuOpenEventArgs
      */
@@ -627,3 +696,3 @@ columnMenuOpen?: EmitType<ColumnMenuOpenEventArgs>;
      * @blazorproperty 'ColumnMenuItemClicked'
-     * @blazorType Syncfusion.EJ2.Blazor.Navigations.MenuEventArgs
+     * @blazorType Syncfusion.Blazor.Navigations.MenuEventArgs
      */
@@ -636,3 +705,3 @@ columnMenuClick?: EmitType<MenuEventArgs>;
      * @blazorproperty 'CellSelected'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.CellSelectEventArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.CellSelectEventArgs<TValue>
      */
@@ -644,4 +713,4 @@ cellSelected?: EmitType<CellSelectEventArgs>;
      * @event 
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.CellDeselectEventArgs
+
+     * @blazorType Syncfusion.Blazor.Grids.CellDeselectEventArgs
      */
@@ -653,4 +722,4 @@ cellDeselecting?: EmitType<CellDeselectEventArgs>;
    * @event 
-   * @deprecated
-   * @blazorType Syncfusion.EJ2.Blazor.Grids.CellDeselectEventArgs
+
+   * @blazorType Syncfusion.Blazor.Grids.CellDeselectEventArgs
    */
@@ -662,3 +731,3 @@ cellDeselected?: EmitType<CellDeselectEventArgs>;
    * @event
-   * @deprecated
+
    */
@@ -670,3 +739,3 @@ resizeStart?: EmitType<ResizeArgs>;
    * @event
-   * @deprecated
+
    */
@@ -678,3 +747,3 @@ resizing?: EmitType<ResizeArgs>;
    * @event
-   * @deprecated
+
    */
@@ -686,4 +755,4 @@ resizeStop?: EmitType<ResizeArgs>;
    * @event  
-   * @deprecated
-   * @blazorType Syncfusion.EJ2.Blazor.Grids.ColumnDragEventArgs
+
+   * @blazorType Syncfusion.Blazor.Grids.ColumnDragEventArgs
    */
@@ -695,4 +764,4 @@ columnDragStart?: EmitType<ColumnDragEventArgs>;
    * @event  
-   * @deprecated
-   * @blazorType Syncfusion.EJ2.Blazor.Grids.ColumnDragEventArgs
+
+   * @blazorType Syncfusion.Blazor.Grids.ColumnDragEventArgs
    */
@@ -704,4 +773,4 @@ columnDrag?: EmitType<ColumnDragEventArgs>;
   * @event  
-  * @deprecated
-  * @blazorType Syncfusion.EJ2.Blazor.Grids.ColumnDragEventArgs
+
+  * @blazorType Syncfusion.Blazor.Grids.ColumnDragEventArgs
   */
@@ -713,3 +782,3 @@ columnDrop?: EmitType<ColumnDragEventArgs>;
    * @event
-   * @deprecated
+
    */
@@ -721,4 +790,4 @@ checkboxChange?: EmitType<CheckBoxChangeEventArgs>;
   * @event 
-  * @deprecated
-  * @blazorType Syncfusion.EJ2.Blazor.Grids.PrintEventArgs
+
+  * @blazorType Syncfusion.Blazor.Grids.PrintEventArgs
   */
@@ -730,4 +799,4 @@ printComplete?: EmitType<PrintEventArgs>;
   * @event 
-  * @deprecated
-  * @blazorType Syncfusion.EJ2.Blazor.Grids.PrintEventArgs
+
+  * @blazorType Syncfusion.Blazor.Grids.PrintEventArgs
   */
@@ -740,3 +809,3 @@ beforePrint?: EmitType<PrintEventArgs>;
    * @blazorproperty 'OnToolbarClick'
-   * @blazorType Syncfusion.EJ2.Blazor.Navigations.ClickEventArgs
+   * @blazorType Syncfusion.Blazor.Navigations.ClickEventArgs
    */
@@ -749,3 +818,3 @@ toolbarClick?: EmitType<ClickEventArgs>;
    * @blazorproperty 'OnDataBound'
-   * @blazorType Syncfusion.EJ2.Blazor.Grids.BeforeDataBoundArgs<TValue>
+   * @blazorType Syncfusion.Blazor.Grids.BeforeDataBoundArgs<TValue>
    */
@@ -757,4 +826,4 @@ beforeDataBound?: EmitType<BeforeDataBoundArgs>;
    * @event
-   * @deprecated
-   * @blazorType Syncfusion.EJ2.Blazor.Navigations.BeforeOpenCloseMenuEventArgs
+
+   * @blazorType Syncfusion.Blazor.Navigations.BeforeOpenCloseMenuEventArgs
    */
@@ -767,3 +836,3 @@ contextMenuOpen?: EmitType<BeforeOpenCloseMenuEventArgs>;
    * @blazorproperty 'ContextMenuItemClicked'
-   * @blazorType Syncfusion.EJ2.Blazor.Navigations.MenuEventArgs
+   * @blazorType Syncfusion.Blazor.Navigations.MenuEventArgs
    */
@@ -773,5 +842,19 @@ contextMenuClick?: EmitType<MenuEventArgs>;
     /**
+   * Triggers before TreeGrid copy action.
+   * @event
+
+   */
+    beforeCopy?: EmitType<BeforeCopyEventArgs>;
+
+    /**
+   * Triggers before TreeGrid paste action.
+   * @event
+
+   */
+    beforePaste?: EmitType<BeforePasteEventArgs>;
+
+    /**
    * Triggers when row elements are dragged (moved) continuously.
    * @event
-   * @deprecated
+
    */
@@ -783,3 +866,3 @@ rowDrag?: EmitType<RowDragEventArgs>;
    * @event
-   * @deprecated
+
    */
@@ -791,3 +874,3 @@ rowDragStart?: EmitType<RowDragEventArgs>;
    * @event
-   * @deprecated
+
    */
@@ -799,3 +882,3 @@ rowDragStartHelper?: EmitType<RowDragEventArgs>;
    * @event
-   * @deprecated
+
    */
@@ -837,4 +920,4 @@ rowDrop?: EmitType<RowDragEventArgs>;
      * @event 
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.PdfQueryCellInfoEventArgs
+
+     * @blazorType Syncfusion.Blazor.Grids.PdfQueryCellInfoEventArgs
      */
@@ -847,4 +930,4 @@ pdfQueryCellInfo?: EmitType<PdfQueryCellInfoEventArgs>;
  * @event 
- * @deprecated
- * @blazorType Syncfusion.EJ2.Blazor.Grids.PdfHeaderQueryCellInfoEventArgs
+
+ * @blazorType Syncfusion.Blazor.Grids.PdfHeaderQueryCellInfoEventArgs
  */
@@ -857,4 +940,4 @@ pdfHeaderQueryCellInfo?: EmitType<PdfHeaderQueryCellInfoEventArgs>;
  * @event
- * @deprecated
- * @blazorType Syncfusion.EJ2.Blazor.Grids.ExcelQueryCellInfoEventArgs
+
+ * @blazorType Syncfusion.Blazor.Grids.ExcelQueryCellInfoEventArgs
  */
@@ -867,4 +950,4 @@ excelQueryCellInfo?: EmitType<ExcelQueryCellInfoEventArgs>;
  * @event
- * @deprecated
- * @blazorType Syncfusion.EJ2.Blazor.Grids.ExcelHeaderQueryCellInfoEventArgs
+
+ * @blazorType Syncfusion.Blazor.Grids.ExcelHeaderQueryCellInfoEventArgs
  */
@@ -883,4 +966,4 @@ excelHeaderQueryCellInfo?: EmitType<ExcelHeaderQueryCellInfoEventArgs>;
  * @event
- * @deprecated
- * @blazorType Syncfusion.EJ2.Blazor.Grids.ExcelExportCompleteArgs
+
+ * @blazorType Syncfusion.Blazor.Grids.ExcelExportCompleteArgs
  */
@@ -899,4 +982,4 @@ excelExportComplete?: EmitType<ExcelExportCompleteArgs>;
  * @event
- * @deprecated
- * @blazorType Syncfusion.EJ2.Blazor.Grids.PdfExportCompleteArgs
+
+ * @blazorType Syncfusion.Blazor.Grids.PdfExportCompleteArgs
  */
@@ -903,0 +986,0 @@ pdfExportComplete?: EmitType<PdfExportCompleteArgs>;

src/treegrid/base/treegrid.d.ts

@@ -5,9 +5,12 @@ import { Component, ModuleDeclaration } from '@syncfusion/ej2-base';
 import { Column, ColumnModel } from '../models/column';
+import { BeforeBatchSaveArgs, BeforeBatchAddArgs, BatchDeleteArgs, BeforeBatchDeleteArgs } from '@syncfusion/ej2-grids';
 import { ColumnQueryModeType, HeaderCellInfoEventArgs } from '@syncfusion/ej2-grids';
 import { RowDragEventArgs, RowDropSettingsModel } from '@syncfusion/ej2-grids';
-import { DetailDataBoundEventArgs } from '@syncfusion/ej2-grids';
+import { DetailDataBoundEventArgs, ClipMode } from '@syncfusion/ej2-grids';
 import { SearchEventArgs, AddEventArgs, EditEventArgs, DeleteEventArgs } from '@syncfusion/ej2-grids';
-import { SaveEventArgs, CellSaveArgs, BeginEditArgs, CellEditArgs } from '@syncfusion/ej2-grids';
+import { SaveEventArgs, CellSaveArgs, BatchAddArgs, BatchCancelArgs, BeginEditArgs, CellEditArgs } from '@syncfusion/ej2-grids';
 import { TextWrapSettingsModel } from '../models/textwrap-settings-model';
 import { Filter } from '../actions/filter';
+import { BeforeCopyEventArgs, BeforePasteEventArgs } from '@syncfusion/ej2-grids';
+import { TreeClipboard } from '../actions/clipboard';
 import { Aggregate } from '../actions/summary';
@@ -46,3 +49,3 @@ import { Reorder } from '../actions/reorder';
 import { DataSourceChangedEventArgs, RecordDoubleClickEventArgs, ResizeArgs } from '@syncfusion/ej2-grids';
-import { ToolbarItems, ToolbarItem, ContextMenuItem, RowPosition } from '../enum';
+import { ToolbarItems, ToolbarItem, ContextMenuItem, RowPosition, CopyHierarchyType } from '../enum';
 import { ItemModel, ClickEventArgs, BeforeOpenCloseMenuEventArgs, MenuEventArgs } from '@syncfusion/ej2-navigations';
@@ -79,2 +82,4 @@ import { PageSettingsModel } from '../models/page-settings-model';
     private changedRecords;
+    private deletedRecords;
+    private addedRecords;
     private targetElement;
@@ -143,2 +148,14 @@ /**
     /**
+     *  Defines the mode of clip. The available modes are,
+     * `Clip`: Truncates the cell content when it overflows its area.
+     * `Ellipsis`: Displays ellipsis when the cell content overflows its area.
+     * `EllipsisWithTooltip`:  Displays ellipsis when the cell content overflows its area,
+     *  also it will display the tooltip while hover on ellipsis is applied..
+     * @default Syncfusion.EJ2.Grids.ClipMode.Ellipsis
+     * @aspType Syncfusion.EJ2.Grids.ClipMode
+     * @isEnumeration true
+     * @blazorType Syncfusion.Blazor.Grids.ClipMode
+     */
+    clipMode: ClipMode;
+    /**
      * `resizeModule` is used to manipulate resizing in the TreeGrid.
@@ -156,2 +173,6 @@ * @hidden
     printModule: Print;
+    /**
+     * `clipboardModule` is used to handle TreeGrid copy action.
+     */
+    clipboardModule: TreeClipboard;
     private keyConfigs;
@@ -223,3 +244,3 @@ /** @hidden */
      * @default null
-     * @blazorType Syncfusion.EJ2.Blazor.Data.Query
+     * @blazorType Syncfusion.Blazor.Data.Query
      */
@@ -238,3 +259,3 @@ query: Query;
      * @aspType Syncfusion.EJ2.Grids.PrintMode
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.PrintMode
+     * @blazorType Syncfusion.Blazor.Grids.PrintMode
      */
@@ -385,3 +406,3 @@ printMode: PrintMode;
      * @aspType Syncfusion.EJ2.Grids.GridLine
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.GridLine
+     * @blazorType Syncfusion.Blazor.Grids.GridLine
      */
@@ -434,2 +455,13 @@ gridLines: GridLine;
     /**
+     * `copyHierarchyMode` Defines the copy clipboard types.
+     * <br><br>
+     * The available built-in items are,
+     * * `Parent` - Copy the selected data with parent record.
+     * * `Child` - Copy the selected data with child record.
+     * * `Both` - Copy the selected data with both parent and child record.
+     * * `None` - Copy only the selected record.
+     * @default Parent
+     */
+    copyHierarchyMode: CopyHierarchyType;
+    /**
      * Defines the height of TreeGrid rows.
@@ -526,10 +558,17 @@ * @default null
      * @blazorproperty 'OnCellSave'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.CellSaveArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.CellSaveArgs<TValue>
      */
     cellSave: EmitType<CellSaveArgs>;
     /**
+     * Triggers when cell is saved.
+     * @event
+     * @blazorproperty 'CellSaved'
+     * @blazorType Syncfusion.Blazor.Grids.CellSaveArgs<TValue>
+     */
+    cellSaved: EmitType<CellSaveArgs>;
+    /**
      * Triggers when TreeGrid actions such as sorting, filtering, paging etc., starts.
      * @event
      * @blazorproperty 'OnActionBegin'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.ActionEventArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.ActionEventArgs<TValue>
      */
@@ -541,3 +580,3 @@ actionBegin: EmitType<PageEventArgs | FilterEventArgs | SortEventArgs | SearchEventArgs | AddEventArgs | SaveEventArgs | EditEventArgs | DeleteEventArgs>;
      * @blazorproperty 'OnActionComplete'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.ActionEventArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.ActionEventArgs<TValue>
      */
@@ -549,10 +588,40 @@ actionComplete: EmitType<PageEventArgs | FilterEventArgs | SortEventArgs | SearchEventArgs | AddEventArgs | SaveEventArgs | EditEventArgs | DeleteEventArgs | CellSaveEventArgs>;
      * @blazorproperty 'OnBeginEdit'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.BeginEditArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.BeginEditArgs<TValue>
      */
     beginEdit: EmitType<BeginEditArgs>;
     /**
+     * Triggers when records are added in batch mode.
+     * @event
+     */
+    batchAdd: EmitType<BatchAddArgs>;
+    /**
+     * Triggers when records are deleted in batch mode.
+     * @event
+     */
+    batchDelete: EmitType<BatchDeleteArgs>;
+    /**
+     * Triggers before records are added in batch mode.
+     * @event
+     */
+    batchCancel: EmitType<BatchCancelArgs>;
+    /**
+     * Triggers before records are added in batch mode.
+     * @event
+     */
+    beforeBatchAdd: EmitType<BeforeBatchAddArgs>;
+    /**
+     * Triggers before records are deleted in batch mode.
+     * @event
+     */
+    beforeBatchDelete: EmitType<BeforeBatchDeleteArgs>;
+    /**
+     * Triggers before records are saved in batch mode.
+     * @event
+     */
+    beforeBatchSave: EmitType<BeforeBatchSaveArgs>;
+    /**
      * Triggers when the cell is being edited.
      * @event
      * @blazorproperty 'OnCellEdit'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.CellEditArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.CellEditArgs<TValue>
      */
@@ -564,3 +633,3 @@ cellEdit: EmitType<CellEditArgs>;
      * @blazorproperty 'OnActionFailure'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.FailureEventArgs
+     * @blazorType Syncfusion.Blazor.Grids.FailureEventArgs
      */
@@ -578,5 +647,5 @@ actionFailure: EmitType<FailureEventArgs>;
      * @event
-     * @deprecated
+
      * @blazorProperty 'dataSourceUpdated'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.DataSourceChangedEventArgs
+     * @blazorType Syncfusion.Blazor.Grids.DataSourceChangedEventArgs
      */
@@ -588,4 +657,4 @@ dataSourceChanged: EmitType<DataSourceChangedEventArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.DataStateChangeEventArgs
+
+     * @blazorType Syncfusion.Blazor.Grids.DataStateChangeEventArgs
      */
@@ -597,3 +666,3 @@ dataStateChange: EmitType<DataStateChangeEventArgs>;
      * @blazorproperty 'OnRecordDoubleClick'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.RecordDoubleClickEventArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.RecordDoubleClickEventArgs<TValue>
      */
@@ -606,3 +675,3 @@ recordDoubleClick: EmitType<RecordDoubleClickEventArgs>;
      * @blazorproperty 'RowDataBound'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.RowDataBoundEventArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.RowDataBoundEventArgs<TValue>
      */
@@ -615,3 +684,3 @@ rowDataBound: EmitType<RowDataBoundEventArgs>;
      * @blazorproperty 'DetailDataBound'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.DetailDataBoundEventArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.DetailDataBoundEventArgs<TValue>
      */
@@ -624,3 +693,3 @@ detailDataBound: EmitType<DetailDataBoundEventArgs>;
      * @blazorproperty 'QueryCellInfo'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.QueryCellInfoEventArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.QueryCellInfoEventArgs<TValue>
      */
@@ -637,3 +706,3 @@ queryCellInfo: EmitType<QueryCellInfoEventArgs>;
      * @blazorproperty 'RowSelecting'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.RowSelectingEventArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.RowSelectingEventArgs<TValue>
      */
@@ -645,3 +714,3 @@ rowSelecting: EmitType<RowSelectingEventArgs>;
      * @blazorproperty 'RowSelected'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.RowSelectEventArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.RowSelectEventArgs<TValue>
      */
@@ -652,4 +721,4 @@ rowSelected: EmitType<RowSelectEventArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.RowDeselectEventArgs<TValue>
+
+     * @blazorType Syncfusion.Blazor.Grids.RowDeselectEventArgs<TValue>
      */
@@ -661,3 +730,3 @@ rowDeselecting: EmitType<RowDeselectEventArgs>;
      * @blazorproperty 'RowDeselected'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.RowDeselectEventArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.RowDeselectEventArgs<TValue>
      */
@@ -669,3 +738,3 @@ rowDeselected: EmitType<RowDeselectEventArgs>;
      * @blazorproperty 'HeaderCellInfo'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.HeaderCellInfoEventArgs
+     * @blazorType Syncfusion.Blazor.Grids.HeaderCellInfoEventArgs
      */
@@ -677,3 +746,3 @@ headerCellInfo: EmitType<HeaderCellInfoEventArgs>;
      * @blazorproperty 'CellSelecting'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.CellSelectingEventArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.CellSelectingEventArgs<TValue>
      */
@@ -684,4 +753,4 @@ cellSelecting: EmitType<CellSelectingEventArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.ColumnMenuOpenEventArgs
+
+     * @blazorType Syncfusion.Blazor.Grids.ColumnMenuOpenEventArgs
      */
@@ -693,3 +762,3 @@ columnMenuOpen: EmitType<ColumnMenuOpenEventArgs>;
      * @blazorproperty 'ColumnMenuItemClicked'
-     * @blazorType Syncfusion.EJ2.Blazor.Navigations.MenuEventArgs
+     * @blazorType Syncfusion.Blazor.Navigations.MenuEventArgs
      */
@@ -701,3 +770,3 @@ columnMenuClick: EmitType<MenuEventArgs>;
      * @blazorproperty 'CellSelected'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.CellSelectEventArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.CellSelectEventArgs<TValue>
      */
@@ -708,4 +777,4 @@ cellSelected: EmitType<CellSelectEventArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.CellDeselectEventArgs
+
+     * @blazorType Syncfusion.Blazor.Grids.CellDeselectEventArgs
      */
@@ -716,4 +785,4 @@ cellDeselecting: EmitType<CellDeselectEventArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.CellDeselectEventArgs
+
+     * @blazorType Syncfusion.Blazor.Grids.CellDeselectEventArgs
      */
@@ -724,3 +793,3 @@ cellDeselected: EmitType<CellDeselectEventArgs>;
      * @event
-     * @deprecated
+
      */
@@ -731,3 +800,3 @@ resizeStart: EmitType<ResizeArgs>;
      * @event
-     * @deprecated
+
      */
@@ -738,3 +807,3 @@ resizing: EmitType<ResizeArgs>;
      * @event
-     * @deprecated
+
      */
@@ -745,4 +814,4 @@ resizeStop: EmitType<ResizeArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.ColumnDragEventArgs
+
+     * @blazorType Syncfusion.Blazor.Grids.ColumnDragEventArgs
      */
@@ -753,4 +822,4 @@ columnDragStart: EmitType<ColumnDragEventArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.ColumnDragEventArgs
+
+     * @blazorType Syncfusion.Blazor.Grids.ColumnDragEventArgs
      */
@@ -761,4 +830,4 @@ columnDrag: EmitType<ColumnDragEventArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.ColumnDragEventArgs
+
+     * @blazorType Syncfusion.Blazor.Grids.ColumnDragEventArgs
      */
@@ -769,3 +838,3 @@ columnDrop: EmitType<ColumnDragEventArgs>;
      * @event
-     * @deprecated
+
      */
@@ -776,4 +845,4 @@ checkboxChange: EmitType<CheckBoxChangeEventArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.PrintEventArgs
+
+     * @blazorType Syncfusion.Blazor.Grids.PrintEventArgs
      */
@@ -784,4 +853,4 @@ printComplete: EmitType<PrintEventArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.PrintEventArgs
+
+     * @blazorType Syncfusion.Blazor.Grids.PrintEventArgs
      */
@@ -793,3 +862,3 @@ beforePrint: EmitType<PrintEventArgs>;
      * @blazorproperty 'OnToolbarClick'
-     * @blazorType Syncfusion.EJ2.Blazor.Navigations.ClickEventArgs
+     * @blazorType Syncfusion.Blazor.Navigations.ClickEventArgs
      */
@@ -801,3 +870,3 @@ toolbarClick: EmitType<ClickEventArgs>;
      * @blazorproperty 'OnDataBound'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.BeforeDataBoundArgs<TValue>
+     * @blazorType Syncfusion.Blazor.Grids.BeforeDataBoundArgs<TValue>
      */
@@ -808,4 +877,4 @@ beforeDataBound: EmitType<BeforeDataBoundArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Navigations.BeforeOpenCloseMenuEventArgs
+
+     * @blazorType Syncfusion.Blazor.Navigations.BeforeOpenCloseMenuEventArgs
      */
@@ -817,9 +886,21 @@ contextMenuOpen: EmitType<BeforeOpenCloseMenuEventArgs>;
      * @blazorproperty 'ContextMenuItemClicked'
-     * @blazorType Syncfusion.EJ2.Blazor.Navigations.MenuEventArgs
+     * @blazorType Syncfusion.Blazor.Navigations.MenuEventArgs
      */
     contextMenuClick: EmitType<MenuEventArgs>;
     /**
+     * Triggers before TreeGrid copy action.
+     * @event
+
+     */
+    beforeCopy: EmitType<BeforeCopyEventArgs>;
+    /**
+     * Triggers before TreeGrid paste action.
+     * @event
+
+     */
+    beforePaste: EmitType<BeforePasteEventArgs>;
+    /**
      * Triggers when row elements are dragged (moved) continuously.
      * @event
-     * @deprecated
+
      */
@@ -830,3 +911,3 @@ rowDrag: EmitType<RowDragEventArgs>;
      * @event
-     * @deprecated
+
      */
@@ -837,3 +918,3 @@ rowDragStart: EmitType<RowDragEventArgs>;
      * @event
-     * @deprecated
+
      */
@@ -844,3 +925,3 @@ rowDragStartHelper: EmitType<RowDragEventArgs>;
      * @event
-     * @deprecated
+
      */
@@ -877,4 +958,4 @@ rowDrop: EmitType<RowDragEventArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.PdfQueryCellInfoEventArgs
+
+     * @blazorType Syncfusion.Blazor.Grids.PdfQueryCellInfoEventArgs
      */
@@ -886,4 +967,4 @@ pdfQueryCellInfo: EmitType<PdfQueryCellInfoEventArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.PdfHeaderQueryCellInfoEventArgs
+
+     * @blazorType Syncfusion.Blazor.Grids.PdfHeaderQueryCellInfoEventArgs
      */
@@ -895,4 +976,4 @@ pdfHeaderQueryCellInfo: EmitType<PdfHeaderQueryCellInfoEventArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.ExcelQueryCellInfoEventArgs
+
+     * @blazorType Syncfusion.Blazor.Grids.ExcelQueryCellInfoEventArgs
      */
@@ -904,4 +985,4 @@ excelQueryCellInfo: EmitType<ExcelQueryCellInfoEventArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.ExcelHeaderQueryCellInfoEventArgs
+
+     * @blazorType Syncfusion.Blazor.Grids.ExcelHeaderQueryCellInfoEventArgs
      */
@@ -918,4 +999,4 @@ excelHeaderQueryCellInfo: EmitType<ExcelHeaderQueryCellInfoEventArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.ExcelExportCompleteArgs
+
+     * @blazorType Syncfusion.Blazor.Grids.ExcelExportCompleteArgs
      */
@@ -932,4 +1013,4 @@ excelExportComplete: EmitType<ExcelExportCompleteArgs>;
      * @event
-     * @deprecated
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.PdfExportCompleteArgs
+
+     * @blazorType Syncfusion.Blazor.Grids.PdfExportCompleteArgs
      */
@@ -1057,3 +1138,5 @@ pdfExportComplete: EmitType<PdfExportCompleteArgs>;
     protected render(): void;
+    private afterGridRender;
     private gridRendered;
+    private setColIndex;
     private setBlazorGUID;
@@ -1064,2 +1147,3 @@ private convertTreeData;
     private bindGridEvents;
+    private extendedGridDataBoundEvent;
     private bindCallBackEvents;
@@ -1148,2 +1232,19 @@ private extendedGridEditEvents;
     /**
+     * Saves the cell that is currently edited. It does not save the value to the DataSource.
+     */
+    saveCell(): void;
+    /**
+     * To update the specified cell by given value without changing into edited state.
+     * @param {number} rowIndex Defines the row index.
+     * @param {string} field Defines the column field.
+     * @param {string | number | boolean | Date} value - Defines the value to be changed.
+     */
+    updateCell(rowIndex: number, field: string, value: string | number | boolean | Date): void;
+    /**
+     * To update the specified row by given values without changing into edited state.
+     * @param {number} index Defines the row index.
+     * @param {Object} data Defines the data object to be updated.
+     */
+    updateRow(index: number, data: Object): void;
+    /**
      * Delete a record with Given options. If fieldName and data is not given then TreeGrid will delete the selected record.
@@ -1200,3 +1301,3 @@ * > `editSettings.allowDeleting` should be true.
      */
-    setRowData(key: string | number, rowData?: Object): void;
+    setRowData(key: string | number, rowData?: object): void;
     /**
@@ -1497,2 +1598,14 @@ * Navigates to the specified target page.
     /**
+     * Copy the selected rows or cells data into clipboard.
+     * @param {boolean} withHeader - Specifies whether the column header text needs to be copied along with rows or cells.
+     */
+    copy(withHeader?: boolean): void;
+    /**
+     * Paste data from clipboard to selected cells.
+     * @param {boolean} data - Specifies the date for paste.
+     * @param {boolean} rowIndex - Specifies the row index.
+     * @param {boolean} colIndex - Specifies the column index.
+     */
+    paste(data: string, rowIndex: number, colIndex: number): void;
+    /**
      * Selects a cell by the given index.
@@ -1499,0 +1612,0 @@ * @param  {IIndex} cellIndex - Defines the row and column indexes.

src/treegrid/enum.d.ts

@@ -177,1 +177,17 @@ /**
 'Content';
+/**
+ * Defines types of CopyHierarchyMode. They are
+ * * Parent
+ * * Child
+ * * Both
+ * * None
+ */
+export declare type CopyHierarchyType = 
+/**  Defines CopyHiearchyMode as Parent */
+'Parent' | 
+/**  Defines CopyHiearchyMode as Child */
+'Child' | 
+/**  Defines CopyHiearchyMode as Both */
+'Both' | 
+/**  Defines CopyHiearchyMode as None */
+'None';

src/treegrid/models/column.d.ts

@@ -76,4 +76,4 @@ import { TextAlign, ClipMode, ValueAccessor, IFilter, IFilterUI, IEditCell, CommandModel } from '@syncfusion/ej2-grids';
      * @default 'stringedit'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.EditType
-     * @blazorDefaultValue Syncfusion.EJ2.Blazor.Grids.EditType.DefaultEdit
+     * @blazorType Syncfusion.Blazor.Grids.EditType
+     * @blazorDefaultValue Syncfusion.Blazor.Grids.EditType.DefaultEdit
      */
@@ -154,3 +154,3 @@ editType: string;
      * @blazorDefaultValueIgnore
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.ColumnType
+     * @blazorType Syncfusion.Blazor.Grids.ColumnType
      */
@@ -332,3 +332,3 @@ type: string;
      * @aspType Syncfusion.EJ2.Grids.TextAlign
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.TextAlign
+     * @blazorType Syncfusion.Blazor.Grids.TextAlign
      */
@@ -350,3 +350,3 @@ textAlign?: TextAlign;
      * @aspType Syncfusion.EJ2.Grids.ClipMode
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.ClipMode
+     * @blazorType Syncfusion.Blazor.Grids.ClipMode
      */
@@ -361,3 +361,3 @@ clipMode?: ClipMode;
      * @aspType Syncfusion.EJ2.Grids.TextAlign
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.TextAlign
+     * @blazorType Syncfusion.Blazor.Grids.TextAlign
      */
@@ -373,3 +373,3 @@ headerTextAlign?: TextAlign;
      * @default null
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.ColumnType
+     * @blazorType Syncfusion.Blazor.Grids.ColumnType
      * @blazorDefaultValueIgnore
@@ -563,4 +563,4 @@ */
      * @default 'stringedit'
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.EditType
-     * @blazorDefaultValue Syncfusion.EJ2.Blazor.Grids.EditType.DefaultEdit
+     * @blazorType Syncfusion.Blazor.Grids.EditType
+     * @blazorDefaultValue Syncfusion.Blazor.Grids.EditType.DefaultEdit
      */
@@ -567,0 +567,0 @@ editType?: string;

src/treegrid/models/filter-settings-model.d.ts

@@ -69,4 +69,4 @@ import { Collection, Property, ChildProperty } from '@syncfusion/ej2-base';import { ICustomOptr, FilterBarMode, FilterType } from '@syncfusion/ej2-grids';import { FilterHierarchyMode } from '../enum';
    * @default null
-   * @blazorType Syncfusion.EJ2.Blazor.Operator
-   * @blazorDefaultValue Syncfusion.EJ2.Blazor.Operator.None
+   * @blazorType Syncfusion.Blazor.Operator
+   * @blazorDefaultValue Syncfusion.Blazor.Operator.None
    */
@@ -164,3 +164,3 @@ operator?: string;
      * @aspType Syncfusion.EJ2.Grids.FilterBarMode
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.FilterBarMode
+     * @blazorType Syncfusion.Blazor.Grids.FilterBarMode
      */
@@ -167,0 +167,0 @@ mode?: FilterBarMode;

src/treegrid/models/filter-settings.d.ts

@@ -69,4 +69,4 @@ import { ChildProperty } from '@syncfusion/ej2-base';
      * @default null
-     * @blazorType Syncfusion.EJ2.Blazor.Operator
-     * @blazorDefaultValue Syncfusion.EJ2.Blazor.Operator.None
+     * @blazorType Syncfusion.Blazor.Operator
+     * @blazorDefaultValue Syncfusion.Blazor.Operator.None
      */
@@ -149,3 +149,3 @@ operator: string;
      * @aspType Syncfusion.EJ2.Grids.FilterBarMode
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.FilterBarMode
+     * @blazorType Syncfusion.Blazor.Grids.FilterBarMode
      */
@@ -152,0 +152,0 @@ mode: FilterBarMode;

src/treegrid/models/search-settings-model.d.ts

@@ -51,4 +51,4 @@ import { Property, ChildProperty } from '@syncfusion/ej2-base';import { FilterHierarchyMode } from '../enum';
      * @default 'contains'
-     * @blazorType Syncfusion.EJ2.Blazor.Operator
-     * @blazorDefaultValue Syncfusion.EJ2.Blazor.Operator.Contains
+     * @blazorType Syncfusion.Blazor.Operator
+     * @blazorDefaultValue Syncfusion.Blazor.Operator.Contains
      */
@@ -55,0 +55,0 @@ operator?: string;

src/treegrid/models/search-settings.d.ts

@@ -48,4 +48,4 @@ import { ChildProperty } from '@syncfusion/ej2-base';
      * @default 'contains'
-     * @blazorType Syncfusion.EJ2.Blazor.Operator
-     * @blazorDefaultValue Syncfusion.EJ2.Blazor.Operator.Contains
+     * @blazorType Syncfusion.Blazor.Operator
+     * @blazorDefaultValue Syncfusion.Blazor.Operator.Contains
      */
@@ -52,0 +52,0 @@ operator: string;

src/treegrid/models/selection-settings-model.d.ts

@@ -13,3 +13,3 @@ import { Property, ChildProperty } from '@syncfusion/ej2-base';import { SelectionMode, CellSelectionMode, SelectionType, CheckboxSelectionType } from '@syncfusion/ej2-grids';
      * @aspType Syncfusion.EJ2.Grids.SelectionMode
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.SelectionMode
+     * @blazorType Syncfusion.Blazor.Grids.SelectionMode
      */
@@ -26,3 +26,3 @@ mode?: SelectionMode;
      * @aspType Syncfusion.EJ2.Grids.CellSelectionMode
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.CellSelectionMode
+     * @blazorType Syncfusion.Blazor.Grids.CellSelectionMode
      */
@@ -38,3 +38,3 @@ cellSelectionMode?: CellSelectionMode;
      * @aspType Syncfusion.EJ2.Grids.SelectionType
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.SelectionType
+     * @blazorType Syncfusion.Blazor.Grids.SelectionType
      */
@@ -58,3 +58,3 @@ type?: SelectionType;
      * @aspType Syncfusion.EJ2.Grids.CheckboxSelectionType
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.CheckboxSelectionType
+     * @blazorType Syncfusion.Blazor.Grids.CheckboxSelectionType
      */
@@ -61,0 +61,0 @@ checkboxMode?: CheckboxSelectionType;

src/treegrid/models/selection-settings.d.ts

@@ -12,3 +12,3 @@ import { ChildProperty } from '@syncfusion/ej2-base';
      * @aspType Syncfusion.EJ2.Grids.SelectionMode
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.SelectionMode
+     * @blazorType Syncfusion.Blazor.Grids.SelectionMode
      */
@@ -24,3 +24,3 @@ mode: SelectionMode;
      * @aspType Syncfusion.EJ2.Grids.CellSelectionMode
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.CellSelectionMode
+     * @blazorType Syncfusion.Blazor.Grids.CellSelectionMode
      */
@@ -35,3 +35,3 @@ cellSelectionMode: CellSelectionMode;
      * @aspType Syncfusion.EJ2.Grids.SelectionType
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.SelectionType
+     * @blazorType Syncfusion.Blazor.Grids.SelectionType
      */
@@ -53,3 +53,3 @@ type: SelectionType;
      * @aspType Syncfusion.EJ2.Grids.CheckboxSelectionType
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.CheckboxSelectionType
+     * @blazorType Syncfusion.Blazor.Grids.CheckboxSelectionType
      */
@@ -56,0 +56,0 @@ checkboxMode: CheckboxSelectionType;

src/treegrid/models/sort-settings-model.d.ts

@@ -20,3 +20,3 @@ import { ChildProperty, Property, Collection } from '@syncfusion/ej2-base';import { SortDirection } from '@syncfusion/ej2-grids';
      * @aspType Syncfusion.EJ2.Grids.SortDirection
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.SortDirection
+     * @blazorType Syncfusion.Blazor.Grids.SortDirection
      */
@@ -23,0 +23,0 @@ direction?: SortDirection;

src/treegrid/models/sort-settings.d.ts

@@ -19,3 +19,3 @@ import { ChildProperty } from '@syncfusion/ej2-base';
      * @aspType Syncfusion.EJ2.Grids.SortDirection
-     * @blazorType Syncfusion.EJ2.Blazor.Grids.SortDirection
+     * @blazorType Syncfusion.Blazor.Grids.SortDirection
      */
@@ -22,0 +22,0 @@ direction: SortDirection;

src/treegrid/renderer/render.js

@@ -55,5 +55,2 @@ import { getObject, appendChildren } from '@syncfusion/ej2-grids';
         if (summaryRow) {
-            if (args.row.querySelector('.e-gridchkbox')) {
-                args.row.querySelector('.e-gridchkbox').innerHTML = '';
-            }
             addClass([args.row], 'e-summaryrow');
@@ -60,0 +57,0 @@ }

src/treegrid/renderer/virtual-row-model-generator.js

@@ -17,2 +17,3 @@ var __extends = (this && this.__extends) || (function () {
 import { isNullOrUndefined } from '@syncfusion/ej2-base';
+import { DataManager } from '@syncfusion/ej2-data';
 /**
@@ -36,19 +37,41 @@ * RowModelGenerator is used to generate grid data rows.
     TreeVirtualRowModelGenerator.prototype.generateRows = function (data, notifyArgs) {
-        if (!isNullOrUndefined(notifyArgs.requestType) && notifyArgs.requestType.toString() === 'collapseAll') {
-            notifyArgs.requestType = 'refresh';
+        if (this.parent.dataSource instanceof DataManager && this.parent.dataSource.dataSource.url !== undefined
+            && this.parent.dataSource.dataSource.url !== '') {
+            return _super.prototype.generateRows.call(this, data, notifyArgs);
         }
-        var rows = _super.prototype.generateRows.call(this, data, notifyArgs);
-        for (var r = 0; r < rows.length; r++) {
-            rows[r].index = (this.visualData).indexOf(rows[r].data);
+        else {
+            if (!isNullOrUndefined(notifyArgs.requestType) && notifyArgs.requestType.toString() === 'collapseAll') {
+                notifyArgs.requestType = 'refresh';
+            }
+            var rows = _super.prototype.generateRows.call(this, data, notifyArgs);
+            for (var r = 0; r < rows.length; r++) {
+                rows[r].index = (this.visualData).indexOf(rows[r].data);
+            }
+            return rows;
         }
-        return rows;
     };
     TreeVirtualRowModelGenerator.prototype.checkAndResetCache = function (action) {
-        var clear = ['paging', 'refresh', 'sorting', 'filtering', 'searching', 'virtualscroll', 'reorder',
+        var clear = ['paging', 'refresh', 'sorting', 'filtering', 'searching', 'reorder',
             'save', 'delete'].some(function (value) { return action === value; });
-        if (clear) {
-            this.cache = {};
-            this.data = {};
-            this.groups = {};
+        if (this.parent.dataSource instanceof DataManager && this.parent.dataSource.dataSource.url !== undefined
+            && this.parent.dataSource.dataSource.url !== '') {
+            var model = 'model';
+            var currentPage = this[model].currentPage;
+            if (clear) {
+                this.cache = {};
+                this.data = {};
+                this.groups = {};
+            }
+            else if (action === 'virtualscroll' && this.cache[currentPage] &&
+                this.cache[currentPage].length > (this.parent.contentModule).getBlockSize()) {
+                delete this.cache[currentPage];
+            }
         }
+        else {
+            if (clear || action === 'virtualscroll') {
+                this.cache = {};
+                this.data = {};
+                this.groups = {};
+            }
+        }
         return clear;
@@ -55,0 +78,0 @@ };

src/treegrid/renderer/virtual-tree-content-render.d.ts

 import { Column, NotifyArgs, SentinelType } from '@syncfusion/ej2-grids';
-import { Offsets, ServiceLocator, IGrid, IModelGenerator } from '@syncfusion/ej2-grids';
+import { Offsets, VirtualInfo, ServiceLocator, IGrid, IModelGenerator } from '@syncfusion/ej2-grids';
 import { VirtualContentRenderer } from '@syncfusion/ej2-grids';
@@ -20,2 +20,5 @@ import { InterSectionObserver } from '@syncfusion/ej2-grids';
     private contents;
+    private fn;
+    private preTranslate;
+    private isRemoteExpand;
     getRowByIndex(index: number): Element;
@@ -28,4 +31,6 @@ addEventListener(): void;
     renderTable(): void;
+    protected getTranslateY(sTop: number, cHeight: number, info?: VirtualInfo, isOnenter?: boolean): number;
     scrollListeners(scrollArgs: ScrollArg): void;
     appendContent(target: HTMLElement, newChild: DocumentFragment, e: NotifyArgs): void;
+    removeEventListener(): void;
 }
@@ -32,0 +37,0 @@ export declare class TreeInterSectionObserver extends InterSectionObserver {

src/treegrid/renderer/virtual-tree-content-render.js

@@ -19,2 +19,3 @@ var __extends = (this && this.__extends) || (function () {
 import { isNullOrUndefined, EventHandler, getValue, setValue } from '@syncfusion/ej2-base';
+import { DataManager } from '@syncfusion/ej2-data';
 /**
@@ -33,2 +34,4 @@ * Content renderer for TreeGrid
         _this.endIndex = -1;
+        _this.preTranslate = 0;
+        _this.isRemoteExpand = false;
         _this.addEventListener();
@@ -63,27 +66,55 @@ return _this;
         var _this = this;
-        this.parent[action]('data-ready', this.onDataReady, this);
-        //this.parent[action]('refresh-virtual-block', this.refreshContentRows, this);
-        var fn = function () {
-            _this.observers.observes(function (scrollArgs) { return _this.scrollListeners(scrollArgs); });
-            _this.parent.off('content-ready', fn);
-        };
-        this.parent.on('content-ready', fn, this);
+        if (!(this.parent.dataSource instanceof DataManager && this.parent.dataSource.dataSource.url !== undefined
+            && this.parent.dataSource.dataSource.url !== '')) {
+            this.parent[action]('data-ready', this.onDataReady, this);
+            //this.parent[action]('refresh-virtual-block', this.refreshContentRows, this);
+            this.fn = function () {
+                _this.observers.observes(function (scrollArgs) { return _this.scrollListeners(scrollArgs); });
+                _this.parent.off('content-ready', _this.fn);
+            };
+            this.parent.on('content-ready', this.fn, this);
+        }
+        else {
+            _super.prototype.eventListener.call(this, 'on');
+        }
     };
     VirtualTreeContentRenderer.prototype.onDataReady = function (e) {
         _super.prototype.onDataReady.call(this, e);
-        if (!isNullOrUndefined(e.count)) {
-            this.totalRecords = e.count;
-            getValue('virtualEle', this).setVirtualHeight(this.parent.getRowHeight() * e.count, '100%');
-            var outBuffer = 4; // this.parent.pageSettings.pageSize - Math.ceil(this.parent.pageSettings.pageSize / 1.5);
+        if (!(this.parent.dataSource instanceof DataManager && this.parent.dataSource.dataSource.url !== undefined
+            && this.parent.dataSource.dataSource.url !== '')) {
+            if (!isNullOrUndefined(e.count)) {
+                this.totalRecords = e.count;
+                getValue('virtualEle', this).setVirtualHeight(this.parent.getRowHeight() * e.count, '100%');
+                var outBuffer = 4; // this.parent.pageSettings.pageSize - Math.ceil(this.parent.pageSettings.pageSize / 1.5);
+            }
+            if (!isNullOrUndefined(e.requestType) && e.requestType.toString() === 'collapseAll') {
+                this.contents.scrollTop = 0;
+            }
         }
-        if (!isNullOrUndefined(e.requestType) && e.requestType.toString() === 'collapseAll') {
-            this.contents.scrollTop = 0;
-        }
     };
     VirtualTreeContentRenderer.prototype.renderTable = function () {
         _super.prototype.renderTable.call(this);
-        getValue('observer', this).options.debounceEvent = false;
-        this.observers = new TreeInterSectionObserver(this.parent, getValue('observer', this).element, getValue('observer', this).options);
-        this.contents = this.getPanel().firstChild;
+        if (!(this.parent.dataSource instanceof DataManager && this.parent.dataSource.dataSource.url !== undefined
+            && this.parent.dataSource.dataSource.url !== '')) {
+            getValue('observer', this).options.debounceEvent = false;
+            this.observers = new TreeInterSectionObserver(this.parent, getValue('observer', this).element, getValue('observer', this).options);
+            this.contents = this.getPanel().firstChild;
+        }
     };
+    VirtualTreeContentRenderer.prototype.getTranslateY = function (sTop, cHeight, info, isOnenter) {
+        if (this.parent.dataSource instanceof DataManager && this.parent.dataSource.dataSource.url !== undefined
+            && this.parent.dataSource.dataSource.url !== '') {
+            if (this.isRemoteExpand) {
+                this.isRemoteExpand = false;
+                return this.preTranslate;
+            }
+            else {
+                this.preTranslate = _super.prototype.getTranslateY.call(this, sTop, cHeight, info, isOnenter);
+                return _super.prototype.getTranslateY.call(this, sTop, cHeight, info, isOnenter);
+            }
+        }
+        else {
+            return _super.prototype.getTranslateY.call(this, sTop, cHeight, info, isOnenter);
+        }
+    };
     VirtualTreeContentRenderer.prototype.scrollListeners = function (scrollArgs) {
@@ -147,19 +178,38 @@ var info = scrollArgs.sentinel;
     VirtualTreeContentRenderer.prototype.appendContent = function (target, newChild, e) {
-        var info = e.virtualInfo.sentinelInfo && e.virtualInfo.sentinelInfo.axis === 'Y' && getValue('currentInfo', this).page &&
-            getValue('currentInfo', this).page !== e.virtualInfo.page ? getValue('currentInfo', this) : e.virtualInfo;
-        var cBlock = (info.columnIndexes[0]) - 1;
-        var cOffset = this.getColumnOffset(cBlock);
-        //this.virtualEle.setWrapperWidth(width, ( Browser.isIE || Browser.info.name === 'edge') as boolean);
-        target = this.parent.createElement('tbody');
-        target.appendChild(newChild);
-        var replace = 'replaceWith';
-        this.getTable().querySelector('tbody')[replace](target);
-        if (!this.isExpandCollapse || this.translateY === 0) {
-            getValue('virtualEle', this).adjustTable(cOffset, this.translateY);
+        if (this.parent.dataSource instanceof DataManager && this.parent.dataSource.dataSource.url !== undefined
+            && this.parent.dataSource.dataSource.url !== '') {
+            if (getValue('isExpandCollapse', e)) {
+                this.isRemoteExpand = true;
+            }
+            _super.prototype.appendContent.call(this, target, newChild, e);
         }
         else {
-            this.isExpandCollapse = false;
+            var info = e.virtualInfo.sentinelInfo && e.virtualInfo.sentinelInfo.axis === 'Y' &&
+                getValue('currentInfo', this).page && getValue('currentInfo', this).page !== e.virtualInfo.page ?
+                getValue('currentInfo', this) : e.virtualInfo;
+            var cBlock = (info.columnIndexes[0]) - 1;
+            var cOffset = this.getColumnOffset(cBlock);
+            //this.virtualEle.setWrapperWidth(width, ( Browser.isIE || Browser.info.name === 'edge') as boolean);
+            target = this.parent.createElement('tbody');
+            target.appendChild(newChild);
+            var replace = 'replaceWith';
+            this.getTable().querySelector('tbody')[replace](target);
+            if (!this.isExpandCollapse || this.translateY === 0) {
+                getValue('virtualEle', this).adjustTable(cOffset, this.translateY);
+            }
+            else {
+                this.isExpandCollapse = false;
+            }
+            setValue('prevInfo', info, this);
         }
-        setValue('prevInfo', info, this);
     };
+    VirtualTreeContentRenderer.prototype.removeEventListener = function () {
+        if (this.parent.isDestroyed) {
+            return;
+        }
+        this.parent.off('data-ready', this.onDataReady);
+        this.parent.off('content-ready', this.fn);
+        this.parent.off(events.virtualActionArgs, this.virtualOtherAction);
+        this.parent.off(events.indexModifier, this.indexModifier);
+    };
     return VirtualTreeContentRenderer;
@@ -166,0 +216,0 @@ }(VirtualContentRenderer));

src/treegrid/utils.d.ts

@@ -5,2 +5,3 @@ import { TreeGrid } from './base/treegrid';
 export declare function isCountRequired(parent: TreeGrid): boolean;
+export declare function isCheckboxcolumn(parent: TreeGrid): boolean;
 export declare function isFilterChildHierarchy(parent: TreeGrid): boolean;
@@ -7,0 +8,0 @@ /**

src/treegrid/utils.js

@@ -20,2 +20,10 @@ import { getObject } from '@syncfusion/ej2-grids';
 }
+export function isCheckboxcolumn(parent) {
+    for (var i = 0; i < parent.columns.length; i++) {
+        if (parent.columns[i].showCheckbox) {
+            return true;
+        }
+    }
+    return false;
+}
 export function isFilterChildHierarchy(parent) {
@@ -22,0 +30,0 @@ if ((!isNullOrUndefined(parent.grid.searchSettings.key) && parent.grid.searchSettings.key !== '' &&

New alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

5011180

increased by11.07%

Lines of code

42797

increased by7.92%

Worsened metrics

Number of package files

175

decreased by-0.57%

Number of low quality alerts

3

increased by50%

Dependency changes

• + Added@syncfusion/ej2-base@18.1.57(transitive)

• + Added@syncfusion/ej2-buttons@18.1.56(transitive)

• + Added@syncfusion/ej2-calendars@18.1.57(transitive)

• + Added@syncfusion/ej2-compression@18.1.52(transitive)

• + Added@syncfusion/ej2-data@18.1.55(transitive)

• + Added@syncfusion/ej2-dropdowns@18.1.59(transitive)

• + Added@syncfusion/ej2-excel-export@18.1.53(transitive)

• + Added@syncfusion/ej2-file-utils@18.1.52(transitive)

• + Added@syncfusion/ej2-grids@18.1.59(transitive)

• + Added@syncfusion/ej2-icons@18.1.52(transitive)

• + Added@syncfusion/ej2-inputs@18.1.59(transitive)

• + Added@syncfusion/ej2-lists@18.1.53(transitive)

• + Added@syncfusion/ej2-navigations@18.1.57(transitive)

• + Added@syncfusion/ej2-pdf-export@18.1.53(transitive)

• + Added@syncfusion/ej2-popups@18.1.57(transitive)

• + Added@syncfusion/ej2-splitbuttons@18.1.52(transitive)

• - Removed@syncfusion/ej2-base@17.4.51(transitive)

• - Removed@syncfusion/ej2-buttons@17.4.51(transitive)

• - Removed@syncfusion/ej2-calendars@17.4.51(transitive)

• - Removed@syncfusion/ej2-compression@17.4.51(transitive)

• - Removed@syncfusion/ej2-data@17.4.51(transitive)

• - Removed@syncfusion/ej2-dropdowns@17.4.51(transitive)

• - Removed@syncfusion/ej2-excel-export@17.4.51(transitive)

• - Removed@syncfusion/ej2-file-utils@17.4.51(transitive)

• - Removed@syncfusion/ej2-grids@17.4.55(transitive)

• - Removed@syncfusion/ej2-icons@17.4.51(transitive)

• - Removed@syncfusion/ej2-inputs@17.4.55(transitive)

• - Removed@syncfusion/ej2-lists@17.4.51(transitive)

• - Removed@syncfusion/ej2-navigations@17.4.55(transitive)

• - Removed@syncfusion/ej2-pdf-export@17.4.51(transitive)

• - Removed@syncfusion/ej2-popups@17.4.51(transitive)

• - Removed@syncfusion/ej2-splitbuttons@17.4.55(transitive)

• Updated@syncfusion/ej2-base@~18.1.36-beta

• Updated@syncfusion/ej2-data@~18.1.36-beta

• Updated@syncfusion/ej2-grids@~18.1.36-beta

• Updated@syncfusion/ej2-popups@~18.1.36-beta