@syncfusion/ej2-treegrid 25.2.6 → 26.1.35-760834

package/src/treegrid/base/treegrid.js

@@ -1,29 +1,29 @@
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 import { Component, addClass, createElement, EventHandler, isNullOrUndefined, extend, merge, SanitizeHtmlHelper } from '@syncfusion/ej2-base';
 import { removeClass, Complex, Collection, getValue } from '@syncfusion/ej2-base';
 import { Event, Property, NotifyPropertyChanges, setValue, KeyboardEvents, L10n } from '@syncfusion/ej2-base';
 import { Column } from '../models/column';
 import { getNumberFormat } from '@syncfusion/ej2-grids';
 import { Freeze as FreezeColumn } from '@syncfusion/ej2-grids';
-import { RowDropSettings, getUid } from '@syncfusion/ej2-grids';
+import { RowDropSettings, getUid, parentsUntil } from '@syncfusion/ej2-grids';
 import { LoadingIndicator } from '../models/loading-indicator';
 import { FilterSettings } from '../models/filter-settings';
 import { TextWrapSettings } from '../models/textwrap-settings';
@@ -184,6 +184,7 @@ var TreeGrid = /** @class */ (function (_super) {
     };
     /**
      * Exports the TreeGrid data to the specified URL using a POST request.
+     *
      * @param {string} url - Defines exporting url
      * @returns {void}
      */
@@ -214,6 +215,7 @@ var TreeGrid = /** @class */ (function (_super) {
     };
     /**
      * Sets the header text and other properties for an array of columns based on specified criteria.
+     *
      * @param {Column[]} columns - Defines array of columns
      * @param {string[]} include - Defines array of sting
      * @returns {Column[]} returns array of columns
@@ -300,6 +302,10 @@ var TreeGrid = /** @class */ (function (_super) {
      * @returns {void}
      */
     TreeGrid.prototype.sortByColumn = function (columnName, direction, isMultiSort) {
+        if (isNullOrUndefined(columnName) && isNullOrUndefined(direction)) {
+            var error = 'The provided value for the columnName and direction is undefined. Please ensure the columnName and direction contains string.';
+            this.trigger(events.actionFailure, { error: error });
+        }
         if (this.sortModule) {
             this.sortModule.sortColumn(columnName, direction, isMultiSort);
         }
@@ -360,21 +366,27 @@ var TreeGrid = /** @class */ (function (_super) {
      * @returns {void}
      */
     TreeGrid.prototype.reorderColumns = function (fromFName, toFName) {
+        if (isNullOrUndefined(fromFName) && isNullOrUndefined(toFName)) {
+            var error = 'The provided value for the fromFName and toFName is undefined. Please ensure the fromFName and toFName contains string.';
+            this.trigger(events.actionFailure, { error: error });
+        }
         this.grid.reorderColumns(fromFName, toFName);
     };
     TreeGrid.prototype.TreeGridLocale = function () {
-        /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
-        var locale = L10n.locale;
-        var localeObject = {};
-        setValue(this.locale, {}, localeObject);
-        var gridLocale;
-        gridLocale = {};
-        gridLocale = getObject(this.locale, locale);
-        var treeGridLocale;
-        treeGridLocale = {};
-        treeGridLocale = getObject(this.getModuleName(), gridLocale);
-        setValue('grid', treeGridLocale, getObject(this.locale, localeObject));
-        L10n.load(localeObject);
+        if (!isNullOrUndefined(this.locale)) {
+            /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+            var locale = L10n.locale;
+            var localeObject = {};
+            setValue(this.locale, {}, localeObject);
+            var gridLocale = void 0;
+            gridLocale = {};
+            gridLocale = getObject(this.locale, locale);
+            var treeGridLocale = void 0;
+            treeGridLocale = {};
+            treeGridLocale = getObject(this.getModuleName(), gridLocale);
+            setValue('grid', treeGridLocale, getObject(this.locale, localeObject));
+            L10n.load(localeObject);
+        }
     };
     /**
      * By default, prints all the pages of the TreeGrid and hides the pager.
@@ -421,45 +433,61 @@ var TreeGrid = /** @class */ (function (_super) {
                     }
                     break;
                 case 'downArrow':
-                    if (!this.enableVirtualization) {
+                    if (!this.enableVirtualization && isNullOrUndefined(this.rowTemplate)) {
                         target = e.target;
-                        parentTarget = target.parentElement;
-                        if (!isNullOrUndefined(parentTarget)) {
-                            var cellIndex = parentTarget.cellIndex;
-                            if (this.grid.getColumnByIndex(cellIndex).editType === 'dropdownedit' && isNullOrUndefined(this.grid.getColumnByIndex(cellIndex).edit['obj'])) {
-                                parentTarget = target;
-                            }
-                            summaryElement = this.findnextRowElement(parentTarget);
-                            if (summaryElement !== null) {
-                                var cellIndex_1 = e.target.cellIndex;
-                                var row_1 = summaryElement.children[parseInt(cellIndex_1.toString(), 10)];
-                                addClass([row_1], 'e-focused');
-                                addClass([row_1], 'e-focus');
-                            }
-                            else {
-                                this.clearSelection();
+                        if (!isNullOrUndefined(target.querySelectorAll('.e-rowcell'))) {
+                            target = parentsUntil(target, 'e-rowcell');
+                        }
+                        if (!isNullOrUndefined(target)) {
+                            parentTarget = target.parentElement;
+                            if (!isNullOrUndefined(parentTarget)) {
+                                var cellIndex = parentTarget.cellIndex;
+                                if (this.grid.getColumnByIndex(cellIndex).editType === 'dropdownedit' && isNullOrUndefined(this.grid.getColumnByIndex(cellIndex).edit['obj'])) {
+                                    parentTarget = target;
+                                }
+                                summaryElement = this.findnextRowElement(parentTarget);
+                                if (summaryElement !== null) {
+                                    var cellIndex_1 = target.cellIndex;
+                                    var row_1 = summaryElement.children[parseInt(cellIndex_1.toString(), 10)];
+                                    if (!isNullOrUndefined(row_1) && !this.grid.isEdit) {
+                                        addClass([row_1], 'e-focused');
+                                        addClass([row_1], 'e-focus');
+                                    }
+                                }
+                                else {
+                                    this.clearSelection();
+                                }
                             }
                         }
                     }
                     break;
                 case 'upArrow':
-                    if (!this.enableVirtualization) {
+                    if (!this.enableVirtualization && isNullOrUndefined(this.rowTemplate)) {
                         target = e.target;
-                        parentTarget = target.parentElement;
-                        if (!isNullOrUndefined(parentTarget)) {
-                            var cellIndex = parentTarget.cellIndex;
-                            if (this.grid.getColumnByIndex(cellIndex).editType === 'dropdownedit' && isNullOrUndefined(this.grid.getColumnByIndex(cellIndex).edit['obj'])) {
-                                parentTarget = target;
-                            }
-                            summaryElement = this.findPreviousRowElement(parentTarget);
-                            if (summaryElement !== null) {
-                                var cIndex = e.target.cellIndex;
-                                var rows = summaryElement.children[parseInt(cIndex.toString(), 10)];
-                                addClass([rows], 'e-focused');
-                                addClass([rows], 'e-focus');
-                            }
-                            else {
-                                this.clearSelection();
+                        if (!isNullOrUndefined(target.querySelectorAll('.e-rowcell'))) {
+                            target = parentsUntil(target, 'e-rowcell');
+                        }
+                        if (!isNullOrUndefined(target)) {
+                            parentTarget = target.parentElement;
+                            if (!isNullOrUndefined(parentTarget)) {
+                                var cellIndex = parentTarget.cellIndex;
+                                if (this.grid.getColumnByIndex(cellIndex).editType === 'dropdownedit' && isNullOrUndefined(this.grid.getColumnByIndex(cellIndex).edit['obj'])) {
+                                    parentTarget = target;
+                                }
+                                summaryElement = this.findPreviousRowElement(parentTarget);
+                                if (summaryElement !== null) {
+                                    var cellIndex_2 = target.cellIndex;
+                                    if (!isNullOrUndefined(cellIndex_2)) {
+                                        var row_2 = summaryElement.children[parseInt(cellIndex_2.toString(), 10)];
+                                        if (!isNullOrUndefined(row_2) && !this.grid.isEdit) {
+                                            addClass([row_2], 'e-focused');
+                                            addClass([row_2], 'e-focus');
+                                        }
+                                    }
+                                }
+                                else {
+                                    this.clearSelection();
+                                }
                             }
                         }
                     }
@@ -533,7 +561,9 @@ var TreeGrid = /** @class */ (function (_super) {
     TreeGrid.prototype.requiredModules = function () {
         var modules = [];
         var splitFrozenCount = 'splitFrozenCount';
-        this.grid["" + splitFrozenCount](this.getColumns());
+        if (!this.isReact && isNullOrUndefined(this['changedProperties'].columns)) {
+            this.grid["" + splitFrozenCount](this.getColumns());
+        }
         if (this.isDestroyed) {
             return modules;
         }
@@ -653,7 +683,7 @@ var TreeGrid = /** @class */ (function (_super) {
                 name: 'Edit'
             });
         }
-        if (this.isCommandColumn(this.columns)) {
+        if (!isNullOrUndefined(this.columns) && this.isCommandColumn(this.columns)) {
             modules.push({
                 member: 'commandColumn',
                 args: [this],
@@ -786,6 +816,7 @@ var TreeGrid = /** @class */ (function (_super) {
         var root = 'root';
         this.grid["" + root] = this["" + root] ? this["" + root] : this;
         this.grid.appendTo(gridContainer);
+        this.actionFailureHandler();
         var gridContent = this.element.getElementsByClassName('e-gridcontent')[0].childNodes[0];
         gridContent.setAttribute('tabindex', '0');
         var contentTable = this.element.getElementsByClassName('e-content')[0].querySelector('.e-table');
@@ -808,6 +839,85 @@ var TreeGrid = /** @class */ (function (_super) {
             }
         };
     };
+    TreeGrid.prototype.actionFailureHandler = function () {
+        var _this = this;
+        var failureCases = [];
+        var primaryKeyFieldNames = this.getPrimaryKeyFieldNames();
+        var RecordsCount = this.flatData.length;
+        if ((this.editSettings.allowAdding || this.editSettings.allowDeleting || this.editSettings.allowEditing)
+            && primaryKeyFieldNames.length === 0 && RecordsCount !== 0) {
+            failureCases.push('For the CRUD actions, it is necessary to enable Primary Key field for the unique data column.');
+        }
+        if (this.allowRowDragAndDrop && primaryKeyFieldNames.length === 0 && RecordsCount !== 0) {
+            failureCases.push('For the Row Drag and Drop actions, it is necessary to enable Primary Key field for the unique data column.');
+        }
+        if (this.allowPaging && this.enableVirtualization) {
+            failureCases.push('Paging is not allowed in virtualization case.');
+        }
+        if (RecordsCount === 0 && this.columns.length === 0) {
+            failureCases.push('Either of the Data source or columns should be given.');
+        }
+        if (this.frozenColumns > 0 && this.columnModel.filter(function (col) { return col.isFrozen; })) {
+            failureCases.push('Use only one attribute for Frozen either IsFrozen or FrozenColumns.');
+        }
+        if (this.enableVirtualization && !isNullOrUndefined(this.detailTemplate)) {
+            failureCases.push('Virtual scrolling is not compatible with the detail template');
+        }
+        if (this.stackedHeader && !isNullOrUndefined(this.detailTemplate)) {
+            failureCases.push('Virtual scrolling is not compatible with the detail template');
+        }
+        if ((this.frozenColumns > 0 || this.columnModel.filter(function (col) { return col.isFrozen; }) || this.frozenRows > 0)
+            && (!isNullOrUndefined(this.detailTemplate) || !isNullOrUndefined(this.rowTemplate))) {
+            failureCases.push('Frozen rows and columns are not supported with the Detail template and row template.');
+        }
+        if ((this.frozenColumns > 0 || this.columnModel.filter(function (col) { return col.isFrozen; }).length > 0 || this.frozenRows > 0) && this.editSettings.mode === 'Cell') {
+            failureCases.push('Frozen rows and columns are not supported with cell editing.');
+        }
+        if (this.allowSelection && !isNullOrUndefined(this.rowTemplate)) {
+            failureCases.push('Selection is not supported in RowTemplate');
+        }
+        if (this.treeColumnIndex < 0) {
+            failureCases.push('For showing tree structure it is must to set the TreeColumnIndex value.');
+        }
+        if (this.treeColumnIndex >= this.columns.length) {
+            failureCases.push('TreeColumnIndex value should not exceed the total column count.');
+        }
+        if (this.enableVirtualization &&
+            (this.columnModel.some(function (col) { return /%$/.test(col.width); }) ||
+                /%$/.test(this.height.toString()))) {
+            failureCases.push('column width and height should be in pixels');
+        }
+        if ((this.childMapping !== 'Children') && !isNullOrUndefined(this.idMapping)) {
+            failureCases.push('Both IdMapping and ChildMapping should not be used together for tree grid rendering.');
+        }
+        if ((!isNullOrUndefined(this.idMapping) && (isNullOrUndefined(this.parentIdMapping))) ||
+            ((isNullOrUndefined(this.idMapping) && (!isNullOrUndefined(this.parentIdMapping))))) {
+            failureCases.push('IdMapping and ParentIdMapping properties should be defined and vice versa.');
+        }
+        var checkboxColumn = this.columnModel.filter(function (col) { return col.showCheckbox; });
+        var treeColumn = this.columns[this.treeColumnIndex];
+        if (checkboxColumn.length !== 0) {
+            if (checkboxColumn !== treeColumn) {
+                failureCases.push('ShowCheckbox column should not be defined other than the tree column.');
+            }
+            if (checkboxColumn.length > 1) {
+                failureCases.push('Only one column can have the ShowCheckbox option enabled.');
+            }
+        }
+        var alignColumn = this.columnModel.filter(function (col) { return col.textAlign === 'Right' && col.field === _this.columnModel[_this.treeColumnIndex].field; });
+        if (alignColumn.length !== 0) {
+            failureCases.push('TextAlign right for the tree column is not applicable.');
+        }
+        if (failureCases.length > 0) {
+            var failureEventArgs_1 = {
+                error: {}
+            };
+            failureCases.forEach(function (failureCase, index) {
+                failureEventArgs_1.error[parseInt(index.toString(), 10)] = failureCase;
+            });
+            this.trigger(events.actionFailure, failureEventArgs_1);
+        }
+    };
     TreeGrid.prototype.refreshToolbarItems = function () {
         var toolbarElement = this.toolbarModule.getToolbar();
         var indentID = this.element.id + '_gridcontrol_indent';
@@ -942,10 +1052,28 @@ var TreeGrid = /** @class */ (function (_super) {
         var _this = this;
         this.grid.rowSelecting = function (args) {
             _this.IsExpandCollapseClicked(args);
+            if (!isNullOrUndefined(args.data) && _this.selectionSettings.persistSelection
+                && _this.columnModel.filter(function (col) { return col.type === 'checkbox'; }).length > 0 && isRemoteData(_this)) {
+                if (!isNullOrUndefined(args.data.parentItem) || args.isHeaderCheckboxClicked) {
+                    _this.parentQuery = _this.query.queries.filter(function (q) { return q.e.field === _this.parentIdMapping; });
+                    _this.query.queries = _this.query.queries.slice(0, 0);
+                }
+            }
+            if (_this.pageSettings.pageSizeMode === 'Root') {
+                _this.grid.selectionModule['totalRecordsCount'] = _this.grid.currentViewData.length;
+            }
+            if (_this.enableVirtualization && args.rowIndex === _this.selectedRowIndex) {
+                args.cancel = true;
+            }
             _this.trigger(events.rowSelecting, args);
         };
         this.grid.rowDeselecting = function (args) {
             _this.IsExpandCollapseClicked(args);
+            if (!isNullOrUndefined(args.data) && _this.selectionSettings.persistSelection
+                && _this.columnModel.filter(function (col) { return col.type === 'checkbox'; }).length > 0 && isRemoteData(_this)) {
+                _this.parentQuery = _this.query.queries.filter(function (q) { return q.e.field === _this.parentIdMapping; });
+                _this.query.queries = _this.query.queries.slice(0, 0);
+            }
             _this.trigger(events.rowDeselecting, args);
         };
         this.grid.rowSelected = function (args) {
@@ -1019,7 +1147,9 @@ var TreeGrid = /** @class */ (function (_super) {
             }
         };
         this.grid.printComplete = this.triggerEvents.bind(this);
-        this.grid.actionFailure = this.triggerEvents.bind(this);
+        this.grid.actionFailure = function (args) {
+            _this.trigger(events.actionFailure, args);
+        };
         this.extendedGridDataBoundEvent();
         this.extendedGridEvents();
         this.extendedGridActionEvents();
@@ -1084,6 +1214,16 @@ var TreeGrid = /** @class */ (function (_super) {
                     _this.grid.selectionModule["" + updateRowSelection](_this.getRows()[parseInt(index.toString(), 10)], index);
                 }
             }
+            if (_this.enableVirtualization && _this.selectionSettings.persistSelection
+                && !isNullOrUndefined(_this.virtualScrollModule.prevSelectedRecord)) {
+                for (var i = 0; i < _this.virtualScrollModule.prevSelectedRecord.length; i++) {
+                    var updateRowSelection = 'updateRowSelection';
+                    var index = 
+                    // eslint-disable-next-line max-len
+                    _this.getCurrentViewRecords().indexOf(_this.virtualScrollModule.prevSelectedRecord[parseInt(i.toString(), 10)]);
+                    _this.grid.selectionModule["" + updateRowSelection](_this.getRows()[parseInt(index.toString(), 10)], index);
+                }
+            }
             _this.trigger(events.dataBound, args);
             _this.initialRender = false;
         };
@@ -1696,6 +1836,12 @@ var TreeGrid = /** @class */ (function (_super) {
     TreeGrid.prototype.onPropertyChanged = function (newProp) {
         var properties = Object.keys(newProp);
         var requireRefresh = false;
+        if (properties.indexOf('columns') > -1 && !isNullOrUndefined(newProp.columns) && this.frozenColumns === 0
+            && this.frozenRows === 0 && !this.columnModel.some(function (col) { return col.isFrozen || col.freeze; })) {
+            this.grid.columns = this.getGridColumns(newProp.columns);
+            this.grid['updateColumnObject']();
+            requireRefresh = true;
+        }
         for (var _i = 0, properties_1 = properties; _i < properties_1.length; _i++) {
             var prop = properties_1[_i];
             switch (prop) {
@@ -2011,6 +2157,7 @@ var TreeGrid = /** @class */ (function (_super) {
         }
     };
     TreeGrid.prototype.mouseClickHandler = function (e) {
+        var _this = this;
         if (!isNullOrUndefined(e.touches)) {
             return;
         }
@@ -2038,6 +2185,22 @@ var TreeGrid = /** @class */ (function (_super) {
                 }
             }
         }
+        if (((target.classList.contains('e-flmenu-cancelbtn') || target.classList.contains('e-flmenu-okbtn')
+            || target.classList.contains('e-content') || target.classList.contains('e-rowcell'))
+            && !isNullOrUndefined(this.filterModule) && this.isReact)) {
+            if (!isNullOrUndefined(this.grid.filterModule['column'])) {
+                if (this.grid.filterModule['column'].filterTemplate) {
+                    var elem = document.getElementById(this.grid.filterModule.filterModule['dlgObj'].element.id);
+                    this.grid.filterModule['fltrDlgDetails'].isOpen = false;
+                    if (this.grid.filterModule.filterModule['dlgObj'] && !this.grid.filterModule.filterModule['dlgObj'].isDestroyed && elem) {
+                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                        this.clearTemplate(['filterTemplate'], undefined, function () {
+                            _this.grid.filterModule.filterModule['dlgObj'].destroy();
+                        });
+                    }
+                }
+            }
+        }
     };
     /**
      * Returns TreeGrid rows
@@ -2132,6 +2295,10 @@ var TreeGrid = /** @class */ (function (_super) {
      * @returns {void}
      */
     TreeGrid.prototype.deleteRecord = function (fieldName, data) {
+        if ((isNullOrUndefined(fieldName) && (isNullOrUndefined(data)) || (this.getSelectedRecords().length <= 0))) {
+            var error = 'The provided value for the fieldName and data is undefined. Please ensure the fieldName and data contains number.';
+            this.trigger(events.actionFailure, { error: error });
+        }
         if (this.grid.editModule) {
             this.grid.editModule.deleteRecord(fieldName, data);
         }
@@ -2200,6 +2367,10 @@ var TreeGrid = /** @class */ (function (_super) {
      * @returns {void}
      */
     TreeGrid.prototype.deleteRow = function (tr) {
+        if (isNullOrUndefined(tr)) {
+            var error = 'The provided value for the tr is undefined. Please ensure the tr contains HTMLTableRowElement.';
+            this.trigger(events.actionFailure, { error: error });
+        }
         if (this.grid.editModule) {
             this.grid.editModule.deleteRow(tr);
         }
@@ -2225,9 +2396,11 @@ var TreeGrid = /** @class */ (function (_super) {
         this.grid.setCellValue(key, field, value);
         var rowIndex = this.grid.getRowIndexByPrimaryKey(key);
         var record = this.getCurrentViewRecords()[parseInt(rowIndex.toString(), 10)];
-        if (!isNullOrUndefined(record)) {
-            editAction({ value: record, action: 'edit' }, this, this.isSelfReference, record.index, this.grid.selectedRowIndex, field);
+        if (isNullOrUndefined(record)) {
+            var error = 'The provided value for the record is undefined. Please ensure the record contains ITreeData.';
+            this.trigger(events.actionFailure, { error: error });
         }
+        editAction({ value: record, action: 'edit' }, this, this.isSelfReference, record.index, this.grid.selectedRowIndex, field);
     };
     /**
      * Updates and refresh the particular row values based on the given primary key value.
@@ -2278,6 +2451,10 @@ var TreeGrid = /** @class */ (function (_super) {
      * @returns {void}
      */
     TreeGrid.prototype.goToPage = function (pageNo) {
+        if (isNullOrUndefined(pageNo)) {
+            var error = 'The provided value for the pageNo is undefined. Please ensure the pageNo contains number.';
+            this.trigger(events.actionFailure, { error: error });
+        }
         if (this.grid.pagerModule) {
             this.grid.pagerModule.goToPage(pageNo);
         }
@@ -2379,6 +2556,10 @@ var TreeGrid = /** @class */ (function (_super) {
      * @returns {void}
      */
     TreeGrid.prototype.hideColumns = function (keys, hideBy) {
+        if (isNullOrUndefined(keys)) {
+            var error = 'The provided value for the keys is undefined. Please ensure the keys contains string.';
+            this.trigger(events.actionFailure, { error: error });
+        }
         this.grid.hideColumns(keys, hideBy);
         this.updateColumnModel();
     };
@@ -2476,10 +2657,10 @@ var TreeGrid = /** @class */ (function (_super) {
         if (this.grid.columns.length !== this.columnModel.length) {
             this.stackedHeader = true;
         }
-        if (this.stackedHeader && this.allowResizing) {
+        if (this.stackedHeader && this.allowResizing && !isNullOrUndefined(this.columns)) {
             this.updateColumnsWidth(this.columns);
         }
-        if (!this.stackedHeader) {
+        if (!this.stackedHeader && !isNullOrUndefined(this.columns)) {
             merge(this.columns, this.columnModel);
         }
         this["" + deepMerge] = undefined; // Workaround for blazor updateModel
@@ -2488,10 +2669,10 @@ var TreeGrid = /** @class */ (function (_super) {
     TreeGrid.prototype.updateColumnsWidth = function (columns) {
         var _this = this;
         columns.forEach(function (column) {
-            if (column.columns) {
+            if (!isNullOrUndefined(column) && column.columns) {
                 _this.updateColumnsWidth(column.columns);
             }
-            else if (column.field) {
+            else if (!isNullOrUndefined(column) && column.field) {
                 var currentColumn = _this.grid.getColumnByField(column.field);
                 if (!isNullOrUndefined(currentColumn)) {
                     column.width = currentColumn.width;
@@ -2796,6 +2977,11 @@ var TreeGrid = /** @class */ (function (_super) {
      */
     TreeGrid.prototype.expandRow = function (row, record, key, level) {
         var _this = this;
+        this.isCollapseAll = false;
+        if (isNullOrUndefined(row) && isNullOrUndefined(record) && isNullOrUndefined(key) && isNullOrUndefined(level)) {
+            var error = 'The provided value for the row is undefined. Please ensure the row contains row element.';
+            this.trigger(events.actionFailure, { error: error });
+        }
         var parentRec = this.parentData;
         if (!this.enableVirtualization) {
             parentRec = this.flatData.filter(function (e) {
@@ -2819,13 +3005,13 @@ var TreeGrid = /** @class */ (function (_super) {
                         if (expandingArgs.expandAll) {
                             _this.expandCollapseAllChildren(record, 'expand', key, level);
                         }
-                        _this.expandRows(row, record, parentRec, key, level);
+                        _this.expandRows(row, record, parentRec);
                     }
                 });
             }
             else if ((!this.allowPaging || (pagerValuePresent && this.grid.pagerModule.pagerObj.pagerdropdownModule['dropDownListObject'].value === 'All')) &&
                 !this.expandAllPrevent && this.isExpandingEventTriggered) {
-                this.expandRows(row, record, parentRec, key, level);
+                this.expandRows(row, record, parentRec);
             }
             this.isExpandingEventTriggered = true;
         }
@@ -2836,13 +3022,13 @@ var TreeGrid = /** @class */ (function (_super) {
                     if (expandingArgs.expandAll) {
                         _this.expandCollapseAllChildren(record, 'expand', key, level);
                     }
-                    _this.expandRows(row, record, parentRec, key, level);
+                    _this.expandRows(row, record, parentRec);
                 }
             });
         }
     };
     // Internal method to handle the rows expand
-    TreeGrid.prototype.expandRows = function (row, record, parentRec, key, level) {
+    TreeGrid.prototype.expandRows = function (row, record, parentRec) {
         this.expandCollapse('expand', row, record);
         var children = 'Children';
         if (!(isRemoteData(this) && !isOffline(this)) && (!isCountRequired(this) || !isNullOrUndefined(record["" + children]))) {
@@ -2855,6 +3041,10 @@ var TreeGrid = /** @class */ (function (_super) {
                 expandArgs = { data: parentRec, row: row };
                 this.trigger(events.expanded, expandArgs);
             }
+            else if (!this.isExpandAll && this.enableVirtualization && this.selectionSettings.persistSelection
+                && !isNullOrUndefined(this.virtualScrollModule.prevSelectedRecord)) {
+                this.virtualScrollModule.prevSelectedRecord = [];
+            }
             else if (!this.isExpandAll) {
                 this.trigger(events.expanded, expandArgs);
             }
@@ -2880,13 +3070,13 @@ var TreeGrid = /** @class */ (function (_super) {
                 return e.hasChildRecords;
             });
         }
-        else if (isNullOrUndefined(record)) {
+        else if (isNullOrUndefined(record) && !isNullOrUndefined(row)) {
             if (this.detailTemplate) {
                 record = this.grid.getCurrentViewRecords()[row.getAttribute('data-rowindex')];
             }
             else {
-                if (this.enableVirtualization && this.isCollapseAll) {
-                    if (this.isExpandAll && row.rowIndex === -1) {
+                if (this.enableVirtualization && (this.isCollapseAll || this.isExpandAll)) {
+                    if (row.rowIndex === -1) {
                         record = this.grid.getCurrentViewRecords()[parseInt(row.getAttribute('data-rowindex'), 10)];
                     }
                     else {
@@ -2913,6 +3103,11 @@ var TreeGrid = /** @class */ (function (_super) {
      */
     TreeGrid.prototype.collapseRow = function (row, record, key) {
         var _this = this;
+        this.isExpandAll = false;
+        if (isNullOrUndefined(row) && isNullOrUndefined(record) && isNullOrUndefined(key)) {
+            var error = 'The provided value for the row is undefined. Please ensure the row contains row element.';
+            this.trigger(events.actionFailure, { error: error });
+        }
         var parentRec = this.parentData;
         if (!this.enableVirtualization) {
             parentRec = this.flatData.filter(function (e) {
@@ -2929,12 +3124,12 @@ var TreeGrid = /** @class */ (function (_super) {
                         if (collapsingArgs.collapseAll) {
                             _this.expandCollapseAllChildren(record, 'collapse', key);
                         }
-                        _this.collapseRows(row, record, parentRec, key);
+                        _this.collapseRows(row, record, parentRec);
                     }
                 });
             }
             else if (!this.allowPaging && !this.collapseAllPrevent && this.isCollapsingEventTriggered) {
-                this.collapseRows(row, record, parentRec, key);
+                this.collapseRows(row, record, parentRec);
             }
             this.isCollapsingEventTriggered = true;
         }
@@ -2942,13 +3137,13 @@ var TreeGrid = /** @class */ (function (_super) {
             var args = { data: record, row: row, cancel: false };
             this.trigger(events.collapsing, args, function (collapsingArgs) {
                 if (!collapsingArgs.cancel && !isNullOrUndefined(record)) {
-                    _this.collapseRows(row, record, parentRec, key);
+                    _this.collapseRows(row, record, parentRec);
                 }
             });
         }
     };
     // Internal method for handling the rows collapse
-    TreeGrid.prototype.collapseRows = function (row, record, parentRec, key) {
+    TreeGrid.prototype.collapseRows = function (row, record, parentRec) {
         this.expandCollapse('collapse', row, record);
         var collapseArgs = { data: record, row: row };
         if (!isRemoteData(this)) {
@@ -2992,6 +3187,10 @@ var TreeGrid = /** @class */ (function (_super) {
      * @returns {void}
      */
     TreeGrid.prototype.expandAtLevel = function (level) {
+        if (isNullOrUndefined(level)) {
+            var error = 'The provided value for the level is undefined. Please ensure the level contains number.';
+            this.trigger(events.actionFailure, { error: error });
+        }
         if (((this.allowPaging && this.pageSettings.pageSizeMode === 'All') || this.enableVirtualization) && !isRemoteData(this)) {
             var rec = this.grid.dataSource.filter(function (e) {
                 if (e.hasChildRecords && e.level === level) {
@@ -3014,6 +3213,10 @@ var TreeGrid = /** @class */ (function (_super) {
      * @returns {void}
      */
     TreeGrid.prototype.expandByKey = function (key) {
+        if (isNullOrUndefined(key)) {
+            var error = 'The provided value for the key is undefined. Please ensure the key contains number.';
+            this.trigger(events.actionFailure, { error: error });
+        }
         this.expandCollapseActionByKey(key, 'Expand');
     };
     TreeGrid.prototype.expandAction = function (record, key, level, isPaging) {
@@ -3071,6 +3274,10 @@ var TreeGrid = /** @class */ (function (_super) {
      * @returns {void}
      */
     TreeGrid.prototype.collapseAtLevel = function (level) {
+        if (isNullOrUndefined(level)) {
+            var error = 'The provided value for the level is undefined. Please ensure the level contains number.';
+            this.trigger(events.actionFailure, { error: error });
+        }
         if (((this.allowPaging && this.pageSettings.pageSizeMode === 'All') || this.enableVirtualization) && !isRemoteData(this)) {
             var record = this.grid.dataSource.filter(function (e) {
                 if (e.hasChildRecords && e.level === level) {
@@ -3093,6 +3300,10 @@ var TreeGrid = /** @class */ (function (_super) {
      * @returns {void}
      */
     TreeGrid.prototype.collapseByKey = function (key) {
+        if (isNullOrUndefined(key)) {
+            var error = 'The provided value for the key is undefined. Please ensure the key contains number.';
+            this.trigger(events.actionFailure, { error: error });
+        }
         this.expandCollapseActionByKey(key, 'Collapse');
     };
     TreeGrid.prototype.expandCollapseActionByKey = function (key, action) {
@@ -3133,6 +3344,10 @@ var TreeGrid = /** @class */ (function (_super) {
      * @returns {void}
      */
     TreeGrid.prototype.expandAll = function () {
+        if (this.getCurrentViewRecords().length === 0) {
+            var error = 'The provided value for the datasource is undefined. Please ensure to add the dataSource.';
+            this.trigger(events.actionFailure, { error: error });
+        }
         this.isExpandedEventTriggered = false;
         this.isExpandingEventTriggered = false;
         this.expandCollapseAll('expand');
@@ -3143,6 +3358,10 @@ var TreeGrid = /** @class */ (function (_super) {
      * @returns {void}
      */
     TreeGrid.prototype.collapseAll = function () {
+        if (this.getCurrentViewRecords().length === 0) {
+            var error = 'The provided value for the datasource is undefined. Please ensure to add the dataSource.';
+            this.trigger(events.actionFailure, { error: error });
+        }
         this.isCollapsedEventTriggered = false;
         this.isCollapsingEventTriggered = false;
         this.expandCollapseAll('collapse');
@@ -3159,6 +3378,9 @@ var TreeGrid = /** @class */ (function (_super) {
                 return e.querySelector('.e-treegrid' + (action === 'expand' ? 'collapse' : 'expand'));
             });
         }
+        if (!rows.length && this.getRows().length) {
+            rows.push(this.getRows()[0]);
+        }
         this.isExpandAll = true;
         this.isCollapseAll = true;
         if (((this.allowPaging && this.pageSettings.pageSizeMode === 'All') || this.enableVirtualization || this.enableInfiniteScrolling) && !isRemoteData(this)) {
@@ -3207,9 +3429,12 @@ var TreeGrid = /** @class */ (function (_super) {
     TreeGrid.prototype.expandCollapse = function (action, row, record, isChild) {
         var _this = this;
         var expandingArgs = { row: row, data: record, childData: [], requestType: action };
-        var childRecords = this.grid.currentViewData.filter(function (e) {
-            return e.parentUniqueID === record.uniqueID;
-        });
+        var childRecords;
+        if (!isNullOrUndefined(record)) {
+            childRecords = this.grid.currentViewData.filter(function (e) {
+                return e.parentUniqueID === record.uniqueID;
+            });
+        }
         var targetEle;
         if ((!isRemoteData(this) && action === 'expand' && this.isSelfReference && isCountRequired(this) && !childRecords.length) || (action === 'collapse' || (this.isExpandAll && this.loadChildOnDemand) && !isRemoteData(this) && this.isSelfReference && isCountRequired(this))) {
             this.updateChildOnDemand(expandingArgs);
@@ -3238,7 +3463,7 @@ var TreeGrid = /** @class */ (function (_super) {
             var displayAction = void 0;
             if (action === 'expand') {
                 displayAction = 'table-row';
-                if (!isChild) {
+                if (!isChild && !isNullOrUndefined(record)) {
                     record.expanded = true;
                     this.uniqueIDCollection[record.uniqueID].expanded = record.expanded;
                 }
@@ -3259,7 +3484,7 @@ var TreeGrid = /** @class */ (function (_super) {
             }
             else {
                 displayAction = 'none';
-                if (!isChild || isCountRequired(this)) {
+                if ((!isChild || isCountRequired(this)) && !isNullOrUndefined(row)) {
                     record.expanded = false;
                     this.uniqueIDCollection[record.uniqueID].expanded = record.expanded;
                 }
@@ -3702,6 +3927,10 @@ var TreeGrid = /** @class */ (function (_super) {
      * @returns {void}
      */
     TreeGrid.prototype.filterByColumn = function (fieldName, filterOperator, filterValue, predicate, matchCase, ignoreAccent, actualFilterValue, actualOperator) {
+        if (isNullOrUndefined(fieldName) && isNullOrUndefined(filterOperator) && isNullOrUndefined(filterValue)) {
+            var error = 'The provided value for the fieldName, filterOperator and filterValue are undefined. Please ensure the fieldName, filterOperator and filterValue.';
+            this.trigger(events.actionFailure, { error: error });
+        }
         this.grid.filterByColumn(fieldName, filterOperator, filterValue, predicate, matchCase, ignoreAccent, actualFilterValue, actualOperator);
     };
     /**
@@ -3768,6 +3997,10 @@ var TreeGrid = /** @class */ (function (_super) {
      * @returns {void}
      */
     TreeGrid.prototype.paste = function (data, rowIndex, colIndex) {
+        if (isNullOrUndefined(data) && isNullOrUndefined(rowIndex) && isNullOrUndefined(colIndex)) {
+            var error = 'The provided value for the index is undefined. Please ensure the index contains number.';
+            this.trigger(events.actionFailure, { error: error });
+        }
         this.clipboardModule.paste(data, rowIndex, colIndex);
     };
     /**
@@ -3795,7 +4028,7 @@ var TreeGrid = /** @class */ (function (_super) {
      * @param  {number} columnIndex - Specifies the column index.
      * @returns {Element} - Returns movable cell element from the indexes passed
      *
-
+     * @deprecated This method is deprecated. Use getCellFromIndex method instead.
      */
     TreeGrid.prototype.getMovableCellFromIndex = function (rowIndex, columnIndex) {
         return this.grid.getCellFromIndex(rowIndex, columnIndex);
@@ -3805,7 +4038,7 @@ var TreeGrid = /** @class */ (function (_super) {
      *
      * @returns {Element[]} - Returns element collection of movable rows
      *
-
+     * @deprecated This method is deprecated. Use getDataRows method instead.
      */
     TreeGrid.prototype.getMovableDataRows = function () {
         return this.grid.getDataRows();
@@ -3816,7 +4049,7 @@ var TreeGrid = /** @class */ (function (_super) {
      * @param  {number} index - Specifies the row index.
      * @returns {Element} - Returns movable row based on index passed
      *
-
+     * @deprecated This method is deprecated. Use getRowByIndex method instead.
      */
     TreeGrid.prototype.getMovableRowByIndex = function (index) {
         return this.grid.getRowByIndex(index);
@@ -3825,7 +4058,7 @@ var TreeGrid = /** @class */ (function (_super) {
      * Gets the TreeGrid's movable content rows from frozen treegrid.
      *
      * @returns {Element[]}: Returns movable row element
-
+     * @deprecated This method is deprecated. Use getRows method instead.
      */
     TreeGrid.prototype.getMovableRows = function () {
         return this.grid.getRows();
@@ -3836,7 +4069,7 @@ var TreeGrid = /** @class */ (function (_super) {
      * @param  {number} index - Specifies the row index.
      * @returns {Element} returns the element
      *
-
+     * @deprecated This method is deprecated. Use getRowByIndex method instead.
      */
     TreeGrid.prototype.getFrozenRightRowByIndex = function (index) {
         return this.grid.getRowByIndex(index);
@@ -3846,7 +4079,7 @@ var TreeGrid = /** @class */ (function (_super) {
      *
      * @returns {Element[]} returns the element
      *
-
+     * @deprecated This method is deprecated. Use getRows method instead.
      */
     TreeGrid.prototype.getFrozenRightRows = function () {
         return this.grid.getRows();
@@ -3856,7 +4089,7 @@ var TreeGrid = /** @class */ (function (_super) {
      *
      * @returns {Element[]} Returns the Element
      *
-
+     * @deprecated This method is deprecated. Use getDataRows method instead.
      */
     TreeGrid.prototype.getFrozenRightDataRows = function () {
         return this.grid.getDataRows();
@@ -3868,7 +4101,7 @@ var TreeGrid = /** @class */ (function (_super) {
      * @param  {number} columnIndex - Specifies the column index.
      * @returns {Element} Returns the Element
      *
-
+     * @deprecated This method is deprecated. Use getCellFromIndex method instead.
      */
     TreeGrid.prototype.getFrozenRightCellFromIndex = function (rowIndex, columnIndex) {
         return this.grid.getCellFromIndex(rowIndex, columnIndex);
@@ -3879,7 +4112,7 @@ var TreeGrid = /** @class */ (function (_super) {
      * @param  {number} index - Specifies the column index.
      * @returns {Element} Returns the Element
      *
-
+     * @deprecated This method is deprecated. Use getColumnHeaderByIndex method instead.
      */
     TreeGrid.prototype.getFrozenLeftColumnHeaderByIndex = function (index) {
         return this.grid.getColumnHeaderByIndex(index);
@@ -3890,7 +4123,7 @@ var TreeGrid = /** @class */ (function (_super) {
      * @param  {number} index - Specifies the column index.
      * @returns {Element} Returns the Element
      *
-
+     * @deprecated This method is deprecated. Use getColumnHeaderByIndex method instead.
      */
     TreeGrid.prototype.getFrozenRightColumnHeaderByIndex = function (index) {
         return this.grid.getColumnHeaderByIndex(index);
@@ -3901,7 +4134,7 @@ var TreeGrid = /** @class */ (function (_super) {
      * @param  {number} index - Specifies the column index.
      * @returns {Element} Returns the Element
      *
-
+     * @deprecated This method is deprecated. Use getColumnHeaderByIndex method instead.
      */
     TreeGrid.prototype.getMovableColumnHeaderByIndex = function (index) {
         return this.grid.getColumnHeaderByIndex(index);
@@ -3979,7 +4212,7 @@ var TreeGrid = /** @class */ (function (_super) {
      * @returns {number} - Returns frozen column count
      */
     TreeGrid.prototype.getFrozenColumns = function () {
-        return this.getFrozenCount(this.columns, 0) + this.frozenColumns;
+        return this.getFrozenCount(!isNullOrUndefined(this.columns) && this.columns, 0) + this.frozenColumns;
     };
     TreeGrid.prototype.getFrozenCount = function (cols, cnt) {
         for (var j = 0, len = cols.length; j < len; j++) {
@@ -4036,6 +4269,10 @@ var TreeGrid = /** @class */ (function (_super) {
      * @returns {void}
      */
     TreeGrid.prototype.reorderRows = function (fromIndexes, toIndex, position) {
+        if (isNullOrUndefined(fromIndexes) && isNullOrUndefined(toIndex) && isNullOrUndefined(position)) {
+            var error = 'The provided value for the fromIndexes, toIndex and position is undefined. Please ensure the fromIndexes and toIndex contains number and position contains string.';
+            this.trigger(events.actionFailure, { error: error });
+        }
         this.rowDragAndDropModule.reorderRows(fromIndexes, toIndex, position);
     };
     /**