@syncfusion/ej2-treegrid 31.2.15 → 32.1.19

package/dist/global/index.d.ts

@@ -1,12 +1,3 @@
-/*!
-*  filename: index.d.ts
-*  version : 31.2.15
-*  Copyright Syncfusion Inc. 2001 - 2025. All rights reserved.
-*  Use of this code is subject to the terms of our license.
-*  A copy of the current license can be obtained at any time by e-mailing
-*  licensing@syncfusion.com. Any infringement will be prosecuted under
-*  applicable laws. 
-*/
 import * as _treegrid from '@syncfusion/ej2-treegrid';
 
 export declare namespace ej {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@syncfusion/ej2-treegrid",
-  "version": "31.2.15",
+  "version": "32.1.19",
   "description": "Essential JS 2 TreeGrid Component",
   "author": "Syncfusion Inc.",
   "license": "SEE LICENSE IN license",
@@ -8,10 +8,10 @@
   "module": "./index.js",
   "es2015": "./dist/es6/ej2-treegrid.es5.js",
   "dependencies": {
-    "@syncfusion/ej2-base": "~31.2.12",
-    "@syncfusion/ej2-data": "~31.2.12",
-    "@syncfusion/ej2-grids": "~31.2.15",
-    "@syncfusion/ej2-popups": "~31.2.12"
+    "@syncfusion/ej2-base": "~32.1.19",
+    "@syncfusion/ej2-data": "~32.1.19",
+    "@syncfusion/ej2-grids": "~32.1.19",
+    "@syncfusion/ej2-popups": "~32.1.19"
   },
   "devDependencies": {},
   "keywords": [

package/src/treegrid/actions/batch-edit.js

@@ -273,13 +273,22 @@ var BatchEdit = /** @class */ (function () {
                 focusModule.getContent().matrix.matrix = this.matrix;
             }
             else {
-                actualIndex = table.getElementsByClassName('e-batchrow')[0].rowIndex;
+                if (this.parent.frozenRows) {
+                    actualIndex = this.batchIndex;
+                }
+                else if (this.parent.editModule.isAddedMultipleRowsByMethod) {
+                    actualIndex = e.index;
+                }
+                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]];
-            if (this.parent.editModule['isAddedRowByMethod'] && !isNullOrUndefined(this.parent.editModule['addRowIndex']) && !this.parent.editModule['isAddedRowByContextMenu']) {
+            if (this.parent.editModule['isAddedRowByMethod'] && !isNullOrUndefined(this.parent.editModule['addRowIndex']) &&
+                !this.parent.editModule['isAddedRowByContextMenu'] && !this.parent.editModule.isAddedMultipleRowsByMethod) {
                 var newlyAddedRecords = this.parent.getBatchChanges()['addedRecords'];
                 var index = parseInt(this.parent.getContentTable().getElementsByClassName('e-insertedrow')[newlyAddedRecords.length - 1].getAttribute('aria-rowindex'), 10) - 1;
                 this.batchRecords.splice(index, 0, newlyAddedRecords[newlyAddedRecords.length - 1]);
@@ -528,7 +537,12 @@ var BatchEdit = /** @class */ (function () {
                     this.parent.editModule['previousNewRowPosition'] = rowPosition;
                 }
                 addRecords[parseInt(i.toString(), 10)].taskData = taskData;
-                addRowRecord_1 = this.batchAddRowRecord[parseInt(i.toString(), 10)];
+                if (this.batchAddRowRecord.length > 1) {
+                    addRowRecord_1 = this.batchAddRowRecord[parseInt(i.toString(), 10)];
+                }
+                else {
+                    addRowRecord_1 = this.batchAddRowRecord[0];
+                }
                 if (isNullOrUndefined(addRowRecord_1)) {
                     addRowRecord_1 = this.batchAddRowRecord[i - 1];
                 }
@@ -543,6 +557,10 @@ var BatchEdit = /** @class */ (function () {
                 if (isNullOrUndefined(addRecords[parseInt(i.toString(), 10)].index)) {
                     addRowIndex = 0;
                 }
+                if (this.parent.editModule.isAddedMultipleRowsByMethod && this.isSelfReference && (this.parent.editSettings.newRowPosition === 'Above' || this.parent.editSettings.newRowPosition === 'Below')) {
+                    addRowIndex = args.index;
+                    addRowRecord_1 = this.parent.flatData[args.index];
+                }
                 if (this.parent.editSettings.newRowPosition !== 'Top' && this.parent.editSettings.newRowPosition !== 'Bottom') {
                     if (isNullOrUndefined(addRecords[parseInt(i.toString(), 10)].parentItem) && this.selectedIndex === -1) {
                         selectedIndex = -1;

package/src/treegrid/actions/context-menu.d.ts

@@ -17,6 +17,7 @@ export declare class ContextMenu {
      * @returns {void}
      */
     removeEventListener(): void;
+    private contextMenuItemClick;
     private contextMenuOpen;
     private contextMenuClick;
     /**

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

@@ -18,6 +18,7 @@ var ContextMenu = /** @class */ (function () {
     ContextMenu.prototype.addEventListener = function () {
         this.parent.on('contextMenuOpen', this.contextMenuOpen, this);
         this.parent.on('contextMenuClick', this.contextMenuClick, this);
+        this.parent.on('contextMenuItemClick', this.contextMenuItemClick, this);
     };
     /**
      * @hidden
@@ -29,6 +30,21 @@ var ContextMenu = /** @class */ (function () {
         }
         this.parent.off('contextMenuOpen', this.contextMenuOpen);
         this.parent.off('contextMenuClick', this.contextMenuClick);
+        this.parent.off('contextMenuItemClick', this.contextMenuItemClick);
+    };
+    ContextMenu.prototype.contextMenuItemClick = function (args) {
+        var id = args.item && args.item.id ? args.item.id : '';
+        var delId = this.parent.element.id + '_gridcontrol_cmenu_Delete';
+        if (id !== delId) {
+            return;
+        }
+        if (this.parent.getSelectedRecords()[0].hasChildRecords || this.parent.getSelectedRecords().length > 1) {
+            this.parent.deleteRecord();
+        }
+        else {
+            this.parent.deleteRow(this.parent.getSelectedRows()[0]);
+        }
+        args.cancel = true;
     };
     ContextMenu.prototype.contextMenuOpen = function (args) {
         var addRow = select('#' + this.parent.element.id + '_gridcontrol_cmenu_AddRow', args.element);

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

@@ -26,6 +26,9 @@ export declare class Edit {
     private editedRowIndex;
     private isScrollByFocus;
     private isIndexUndefined;
+    isAddedMultipleRowsByMethod: boolean;
+    private multipleRowIndex;
+    private updatedRecords;
     /**
      * Constructor for Edit module
      *
@@ -93,7 +96,7 @@ export declare class Edit {
      *
      * @returns {void}
      */
-    addRecord(data?: Object, index?: number, position?: RowPosition): void;
+    addRecord(data?: Object | Object[], index?: number, position?: RowPosition): void;
     /**
      * Checks the status of validation at the time of editing. If validation is passed, it returns true.
      *

package/src/treegrid/actions/edit.js

@@ -23,6 +23,7 @@ var Edit = /** @class */ (function () {
         this.isAddedRowByMethod = false;
         this.isAddedRowByContextMenu = false;
         this.isIndexUndefined = false;
+        this.isAddedMultipleRowsByMethod = false;
         Grid.Inject(GridEdit);
         this.parent = parent;
         this.isSelfReference = !isNullOrUndefined(parent.parentIdMapping);
@@ -682,7 +683,8 @@ var Edit = /** @class */ (function () {
                 }
             }
         }
-        if (this.parent.editSettings.mode === 'Batch' && !isNullOrUndefined(this.addRowIndex) && this.addRowIndex !== -1 && this['isAddedRowByMethod'] && !this.isAddedRowByContextMenu) {
+        if (this.parent.editSettings.mode === 'Batch' && !isNullOrUndefined(this.addRowIndex) && this.addRowIndex !== -1 &&
+            !this.isAddedMultipleRowsByMethod && this['isAddedRowByMethod'] && !this.isAddedRowByContextMenu) {
             index = this.batchEditModule.getAddRowIndex();
             this.selectedIndex = this.batchEditModule.getSelectedIndex();
             var batchAddedRecords = this.parent.getBatchChanges()['addedRecords'];
@@ -704,6 +706,28 @@ var Edit = /** @class */ (function () {
             this.batchEditModule['batchAddRowRecord'].push(this.batchEditModule['addRowRecord']);
             this.batchEditModule['batchAddedRecords'].push(args['data']);
         }
+        else if (this.parent.editSettings.mode === 'Batch' && this.isAddedMultipleRowsByMethod && (this.parent.editSettings.newRowPosition === 'Above' || this.parent.editSettings.newRowPosition === 'Below')) {
+            index = this.multipleRowIndex;
+            this.selectedIndex = this.multipleRowIndex;
+            var batchAddedRecords = this.updatedRecords.addedRecords;
+            var newlyAddedRecord = void 0;
+            if (batchAddedRecords.length) {
+                for (var i = 0; i < batchAddedRecords.length; i++) {
+                    if (isNullOrUndefined(batchAddedRecords[parseInt(i.toString(), 10)].uniqueID)) {
+                        newlyAddedRecord = batchAddedRecords[parseInt(i.toString(), 10)];
+                    }
+                    var args = {
+                        action: 'add',
+                        data: newlyAddedRecord,
+                        index: index,
+                        seletedRow: 0
+                    };
+                    this.beginAddEdit(args);
+                    this.batchEditModule['batchAddRowRecord'].push(this.batchEditModule['addRowRecord']);
+                    this.batchEditModule['batchAddedRecords'].push(args['data']);
+                }
+            }
+        }
     };
     // private beforeDataBound(args: BeforeDataBoundArgs): void {
     //   if (this.parent.grid.isEdit && this.parent.dataSource instanceof DataManager &&
@@ -998,7 +1022,35 @@ var Edit = /** @class */ (function () {
         if (isNullOrUndefined(index)) {
             this.isIndexUndefined = true;
         }
-        if (!this.isSelfReference && !isNullOrUndefined(data) && Object.hasOwnProperty.call(data, this.parent.childMapping)) {
+        if (!isNullOrUndefined(data) && Array.isArray(data)) {
+            var addRecords = [];
+            var previousEditMode = this.parent.editSettings.mode;
+            var previousGridEditMode = this.parent.grid.editSettings.mode;
+            if (!this.isSelfReference && !isNullOrUndefined(data) && Object.hasOwnProperty.call(data, this.parent.childMapping)) {
+                addRecords.push(data);
+            }
+            else if (Array.isArray(data)) {
+                addRecords = data;
+            }
+            this.parent.setProperties({ editSettings: { mode: 'Batch' } }, true);
+            this.parent.grid.setProperties({ editSettings: { mode: 'Batch' } }, true);
+            if (!isNullOrUndefined(position)) {
+                this.parent.setProperties({ editSettings: { newRowPosition: position } }, true);
+            }
+            this.updatedRecords = { addedRecords: addRecords, changedRecords: [], deletedRecords: [] };
+            if ((position === 'Above' || position === 'Below') && this.isSelfReference) {
+                this.isAddedMultipleRowsByMethod = true;
+                this.multipleRowIndex = index;
+                this.addRowIndex = index;
+                this.parent.notify(events.batchAdd, { updatedRecords: this.updatedRecords, index: index });
+            }
+            var updatedRecords = this.updatedRecords;
+            this.parent.notify(events.batchSave, { updatedRecords: updatedRecords, index: index });
+            this.parent.setProperties({ editSettings: { mode: previousEditMode } }, true);
+            this.parent.grid.setProperties({ editSettings: { mode: previousGridEditMode } }, true);
+            this.parent.refresh();
+        }
+        else if (!this.isSelfReference && !isNullOrUndefined(data) && Object.hasOwnProperty.call(data, this.parent.childMapping)) {
             var addRecords = [];
             var previousEditMode = this.parent.editSettings.mode;
             var previousGridEditMode = this.parent.grid.editSettings.mode;
@@ -1008,7 +1060,8 @@ var Edit = /** @class */ (function () {
             if (!isNullOrUndefined(position)) {
                 this.parent.setProperties({ editSettings: { newRowPosition: position } }, true);
             }
-            var updatedRecords = { addedRecords: addRecords, changedRecords: [], deletedRecords: [] };
+            this.updatedRecords = { addedRecords: addRecords, changedRecords: [], deletedRecords: [] };
+            var updatedRecords = this.updatedRecords;
             this.parent.notify(events.batchSave, { updatedRecords: updatedRecords, index: index });
             this.parent.setProperties({ editSettings: { mode: previousEditMode } }, true);
             this.parent.grid.setProperties({ editSettings: { mode: previousGridEditMode } }, true);

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

@@ -62,7 +62,7 @@ var Freeze = /** @class */ (function () {
             }
             var queryselector = args.action === 'e-childrow-hidden' ? '.e-treecolumn-container .e-treegridcollapse'
                 : '.e-treecolumn-container .e-treegridexpand';
-            if (frozenrows[row.rowIndex].querySelector(queryselector)) {
+            if (frozenrows[parseInt(row.getAttribute('aria-rowindex'), 10) - 1].querySelector(queryselector)) {
                 var cRow = [];
                 for (var i_1 = 0; i_1 < movableRows.length; i_1++) {
                     if (movableRows[parseInt(i_1.toString(), 10)].querySelector('.e-gridrowindex' + rData.index + 'level' + (rData.level + 1))) {

package/src/treegrid/actions/rowdragdrop.js

@@ -205,6 +205,9 @@ var RowDD = /** @class */ (function () {
             this.selectedItem = isNullOrUndefined(record) ?
                 tObj.getCurrentViewRecords()[parseInt(selectedItemIndex.toString(), 10)] : record;
             var primaryKeyField = this.parent.getPrimaryKeyFieldNames()[0];
+            if (!primaryKeyField) {
+                return;
+            }
             var rowIndex = this.parent.grid.getRowIndexByPrimaryKey(this.selectedItem["" + primaryKeyField]);
             this.selectedRow = this.parent[this.selectedRows] = selectedItemIndex !== -1 ?
                 this.parent.getSelectedRows()[0]

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

@@ -1,4 +1,5 @@
 import { TreeGrid } from '../base/treegrid';
+import { ITreeData } from '../base/interface';
 /**
  * TreeGrid Selection module
  *
@@ -11,41 +12,258 @@ export declare class Selection {
     private selectedIndexes;
     private filteredList;
     private searchingRecords;
+    private headerCheckboxFrameEl;
+    private checkboxColIndexCache;
+    private parentSelectionCounters;
+    private selectedUidMap;
+    private totalSelectableCount;
+    private headerSelectionState;
+    private checkedItemCount;
     /**
-     * Constructor for Selection module
+     * Creates an instance of Selection.
      *
-     * @param {TreeGrid} parent - Tree Grid instance
+     * @param {TreeGrid} parent - The TreeGrid instance this selection module is associated with.
      */
     constructor(parent: TreeGrid);
     /**
-     * For internal use only - Get the module name.
+     * Gets the module name.
      *
-     * @private
-     * @returns {string} Returns Selection module name
+     * @returns {string} The name of the module ('selection').
      */
     private getModuleName;
+    private visibleUidIndex;
+    /**
+     * Builds a map from visible record uniqueID to its visible index.
+     * This map is crucial for finding the *current visible index* of a record.
+     *
+     * @returns {void}
+     */
+    private buildVisibleUidMap;
+    /**
+     * Adds required event listeners for selection handling.
+     *
+     * @returns {void}
+     */
     addEventListener(): void;
+    /**
+     * Removes previously added event listeners.
+     *
+     * @returns {void}
+     */
     removeEventListener(): void;
     /**
-     * To destroy the Selection
+     * Destroys the selection module and clears internal caches.
      *
      * @returns {void}
-     * @hidden
      */
     destroy(): void;
+    /**
+     * Handles checkbox click events from the DOM and dispatches selection logic.
+     *
+     * @param {Object} args - Event args containing the click target.
+     * @returns {void}
+     */
     private checkboxSelection;
+    /**
+     * Triggers the checkboxChange event with the appropriate arguments.
+     *
+     * @param {HTMLInputElement} checkBox - The checkbox input element that changed.
+     * @param {boolean} checkState - The new checked state.
+     * @param {HTMLTableRowElement} rowElement - The row element where the change occurred.
+     * @returns {void}
+     */
     private triggerChkChangeEvent;
+    /**
+     * Determines the index of the checkbox column in the header.
+     *
+     * @returns {number} The index of the checkbox column, or -1 if not found.
+     */
     private getCheckboxcolumnIndex;
+    /**
+     * Renders and initializes the header checkbox element.
+     *
+     * @returns {void}
+     */
     private headerCheckbox;
+    /**
+     * Renders a checkbox element for a column cell.
+     *
+     * @param {QueryCellInfoEventArgs} args - The QueryCellInfoEventArgs for the cell.
+     * @returns {Element} The rendered checkbox wrapper element.
+     */
     private renderColumnCheckbox;
+    /**
+     * Injects the checkbox into a column cell during QueryCellInfo.
+     *
+     * @param {QueryCellInfoEventArgs} container - The cell event args.
+     * @returns {void}
+     */
     private columnCheckbox;
+    /**
+     * Selects or toggles checkboxes for the provided row indexes.
+     *
+     * @param {number[]} rowIndexes - Array of row indexes to toggle selection for.
+     * @returns {void}
+     */
     selectCheckboxes(rowIndexes: number[]): void;
+    /**
+     * Traverses selection for a record and cascades selections to children/parents as necessary.
+     *
+     * @param {ITreeData} record - The record to process.
+     * @param {string} checkboxState - The desired checkbox state ('check'|'uncheck'|'indeterminate').
+     * @param {boolean} isChildItem - True if this invocation is for a child during recursion.
+     * @returns {void}
+     */
     private traverSelection;
+    /**
+     * Filters provided child records against the current filter result.
+     *
+     * @param {ITreeData[]} childRecords - The array of child records to filter.
+     * @returns {ITreeData[]} The filtered child records array.
+     */
     private getFilteredChildRecords;
+    /**
+     * Derives children for a record from flatData using the parentItem link.
+     * Used when childRecords is missing or empty.
+     *
+     * @param {ITreeData} record - The record for which to find child elements.
+     * @returns {ITreeData[]} An array of child records derived from flatData.
+     */
+    private getChildrenFromFlat;
+    /**
+     * Updates parent selection by rebuilding summary and applying deltas, then bubbling up if required.
+     *
+     * @param {ITreeData} parentRecord - The parent record reference.
+     * @param {string} [previousChildState] - Previous state of the child that changed.
+     * @param {string} [nextChildState] - Next state of the child that changed.
+     * @returns {void}
+     */
     private updateParentSelection;
+    /**
+     * Builds a selection summary for a record's children.
+     *
+     * @param {Object} record - The record whose children should be summarized.
+     * @param {boolean} [ignoreFilter] - If true, ignore current filter when computing summary.
+     * @returns {{ total: number, checked: number, indeterminate: number }} The computed summary.
+     */
+    private buildSelectionSummary;
+    /**
+     * Applies a delta to a selection summary based on a state change.
+     *
+     * @param {Object} summary - The summary to modify. Object with numeric properties: total, checked, indeterminate.
+     * @param {string} state - The state that changed ('check' | 'indeterminate').
+     * @param {number} delta - The delta to apply (e.g. +1 or -1).
+     * @returns {void}
+     */
+    private applySummaryDelta;
+    /**
+     * Derives the parent's checkbox state based on children summary counts.
+     *
+     * @param {ITreeData} record The parent record.
+     * @param {{ total: number, checked: number, indeterminate: number }} summary The children summary.
+     * @returns {'check'|'indeterminate'|'uncheck'} The derived checkbox state.
+     */
+    private deriveParentState;
+    /**
+     * Handles header checkbox (select all / clear all) behavior.
+     *
+     * @param {boolean} [checkAll] - Optional explicit flag to check or uncheck all.
+     * @returns {void}
+     */
     private headerSelection;
+    /**
+     * Finalizes parent states after a bulk header operation (e.g., Select All).
+     * This ensures parent states (checked/indeterminate) are correct after cascades.
+     *
+     * @param {ITreeData[]} records - The records that were processed in the bulk operation.
+     * @returns {void}
+     */
+    private finalizeParentsAfterBulk;
+    /**
+     * Processes header selection for each record, setting their state silently in the data model.
+     * Called during bulk operations like "select all".
+     *
+     * @param {ITreeData[]} records - The records to process.
+     * @param {string} targetState - The target state to set on each record.
+     * @returns {void}
+     */
+    private processHeaderSelection;
+    /**
+     * Rebuilds `selectedItems`, `selectedUidMap`, and `selectedIndexes` based on the current data states in the model.
+     * This method is called after bulk operations (like headerSelection, grid actions, etc.) to synchronize internal collections.
+     * It ensures `selectedItems` retains original selection order *as much as possible* for currently checked items
+     * and `selectedIndexes` reflects their *current visible order*.
+     *
+     * @param {ITreeData[]} records - The records that were processed (or the full data set if re-evaluating everything).
+     * @param {string} requestType - The data action type such as filtering, searching, refresh,etc.
+     * @returns {void}
+     */
+    private updateSelectedCollectionsAfterBulk;
+    /**
+     * Refreshes visible checkbox DOM elements to reflect the current data state.
+     * This method exclusively updates the UI representation of checkboxes.
+     *
+     * @returns {void}
+     */
+    private refreshVisibleCheckboxes;
+    /**
+     * Resets internal selection caches to their initial state.
+     * This is usually called before a bulk selection operation (like "select all").
+     *
+     * @returns {void}
+     */
+    resetSelectionCaches(): void;
+    /**
+     * Counts selectable (non-summary) records in the provided array.
+     *
+     * @param {ITreeData[]} records - The records to count.
+     * @returns {number} The number of selectable records.
+     */
+    private countSelectableRecords;
+    /**
+     * Resolves the list of records used for header selection operations (e.g., for `select all`).
+     *
+     * @param {boolean} [includeAll] - If true and data is local, returns flatData (all records for full dataset actions).
+     * @returns {ITreeData[]} The array of records to consider for header operations.
+     */
+    private resolveHeaderSelectionList;
+    /**
+     * Updates the header checkbox state (checked/indeterminate/unchecked) based on current selections.
+     *
+     * @returns {void}
+     */
+    private updateHeaderCheckboxState;
+    /**
+     * Updates selection arrays (selectedItems, selectedUidMap, selectedIndexes) and visible DOM for a single record.
+     * This is the core method for managing the state of a single checkbox.
+     *
+     * @param {ITreeData} currentRecord - The record to update.
+     * @param {string} checkState - The new checkbox state ('check' | 'uncheck' | 'indeterminate').
+     * @param {boolean} [silent] - If true, update is silent (only updates data model, no collection management or DOM update).
+     * @returns {void}
+     */
     private updateSelectedItems;
+    /**
+     * Handles various grid actions and updates selection state accordingly.
+     * This method ensures that selection state is maintained and UI is refreshed after grid operations.
+     *
+     * @param {CellSaveEventArgs} args - Action arguments containing requestType and data.
+     * @returns {void}
+     */
     private updateGridActions;
-    getCheckedrecords(): Object[];
+    /**
+     * Retrieves checked record objects.
+     * This array maintains the `ITreeData` objects in the order they were selected.
+     *
+     * @returns {ITreeData[]} Array of checked records.
+     */
+    getCheckedrecords(): ITreeData[];
+    /**
+     * Retrieves visible indexes of checked rows in the current view, in the order they were selected.
+     * This method dynamically generates the list of visible indexes by iterating through `selectedItems`
+     * (which preserves selection order) and finding their *current* visible index.
+     *
+     * @returns {number[]} Array of checked row indexes in selection order.
+     */
     getCheckedRowIndexes(): number[];
 }