igniteui-angular 22.2.0-rc.2 → 22.2.1

package/fesm2022/igniteui-angular-grids-tree-grid.mjs

@@ -231,19 +231,6 @@ class IgxTreeGridAPIService extends GridBaseAPIService {
         }
         return records;
     }
-    update_row_in_array(value, rowID, index) {
-        const grid = this.grid;
-        if (grid.primaryKey && grid.foreignKey) {
-            super.update_row_in_array(value, rowID, index);
-        }
-        else {
-            const record = grid.records.get(rowID);
-            const childData = record.parent ? record.parent.data[grid.childDataKey] : grid.data;
-            index = grid.primaryKey ? childData.map((c) => c[grid.primaryKey]).indexOf(rowID) :
-                childData.indexOf(rowID);
-            childData[index] = value;
-        }
-    }
     /**
      * Updates related row of provided grid's data source with provided new row value
      *
@@ -291,7 +278,7 @@ class IgxTreeGridAPIService extends GridBaseAPIService {
         }
         for (const record of records) {
             if (!record.isFilteredOutParent) {
-                data.push(record);
+                data.push(record.data);
             }
             this.getFlatDataFromFilteredRecords(record.children, data);
         }
@@ -304,10 +291,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImpor
         }] });
 
 /**
- * @hidden
+ * Marks an `ng-template` as the row loading indicator of an `igx-tree-grid` that loads its child rows on demand.
+ * The template is displayed in place of the expand indicator while the children of a row are being loaded.
+ *
+ * @example
+ * ```html
+ * <igx-tree-grid [data]="data" primaryKey="ID" foreignKey="ParentID" [loadChildrenOnDemand]="loadChildren">
+ *     <ng-template igxRowLoadingIndicator>
+ *         <igx-icon>loop</igx-icon>
+ *     </ng-template>
+ * </igx-tree-grid>
+ * ```
  */
 class IgxRowLoadingIndicatorTemplateDirective {
     constructor() {
+        /**
+         * The template reference of the row loading indicator.
+         *
+         * @returns The `TemplateRef` of the `ng-template` the directive is applied to.
+         * @example
+         * ```typescript
+         * @ViewChild(IgxRowLoadingIndicatorTemplateDirective) public loadingIndicator: IgxRowLoadingIndicatorTemplateDirective;
+         * const template = this.loadingIndicator.template;
+         * ```
+         */
         this.template = inject(TemplateRef);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxRowLoadingIndicatorTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
@@ -408,8 +415,8 @@ class IgxTreeGridSelectionService extends IgxGridSelectionService {
         return this.grid.selectionService;
     }
     emitCascadeRowSelectionEvent(newSelection, added, removed, event) {
-        const currSelection = this.getSelectedRows();
-        if (this.areEqualCollections(currSelection, newSelection)) {
+        // newSelection holds the rows' data, so compare it to the current selection by row IDs
+        if (this.areEqualCollections(this.getSelectedRows(), this.getRowIDs(newSelection))) {
             return;
         }
         const args = {
@@ -1697,15 +1704,15 @@ class IgxTreeGridComponent extends IgxGridBaseDirective {
      * @remarks
      * Accepted values for index are integers from 0 to this.grid.dataView.length
      * @remarks
-     * When adding the row as a child, the parent row is the specified row.
+     * When adding the row as a child, the parent row is the row at the specified index.
      * @remarks
-     * To spawn the UI on top, call the function with index = null or a negative number.
-     * In this case trying to add this row as a child will result in error.
+     * To spawn the UI on top, call the function with index = 0, null or a negative number.
+     * Trying to add the row as a child with index = null or a negative number will result in error.
      * @example
      * ```typescript
-     * this.grid.beginAddRowByIndex(10);
-     * this.grid.beginAddRowByIndex(10, true);
-     * this.grid.beginAddRowByIndex(null);
+     * this.grid.beginAddRowByIndex(10);       // spawns the add row UI at index 10
+     * this.grid.beginAddRowByIndex(10, true); // spawns the add row UI to add a child for the row at index 10
+     * this.grid.beginAddRowByIndex(0);        // spawns the add row UI as the first record
      * ```
      * @param index - The index to spawn the UI at. Accepts integers from 0 to this.grid.dataView.length
      * @param asChild - Whether the record should be added as a child. Only applicable to igxTreeGrid.
@@ -1714,7 +1721,13 @@ class IgxTreeGridComponent extends IgxGridBaseDirective {
         if (index === null || index < 0) {
             return this.beginAddRowById(null, asChild);
         }
-        return this._addRowForIndex(index - 1, asChild);
+        if (asChild) {
+            return this._addRowForIndex(index, asChild);
+        }
+        if (index === 0) {
+            return this.beginAddRowById(null);
+        }
+        return this._addRowForIndex(index - 1);
     }
     /**
      * @hidden
@@ -2001,9 +2014,6 @@ class IgxTreeGridComponent extends IgxGridBaseDirective {
         }
         super.transactionStatusUpdate(event);
     }
-    findRecordIndexInView(rec) {
-        return this.dataView.findIndex(x => x.data[this.primaryKey] === rec[this.primaryKey]);
-    }
     /**
      * @hidden @internal
      */
@@ -2041,18 +2051,14 @@ class IgxTreeGridComponent extends IgxGridBaseDirective {
         }
         this.scrollToHorizontally(column);
     }
-    writeToData(rowIndex, value) {
-        mergeObjects(this.flatData[rowIndex], value);
-    }
     /**
      * @hidden
      */
     initColumns(collection, cb = null) {
-        if (this.hasColumnLayouts) {
+        if (collection.some(col => col.columnLayout)) {
             // invalid configuration - tree grid should not allow column layouts
             // remove column layouts
-            const nonColumnLayoutColumns = this.columns.filter((col) => !col.columnLayout && !col.columnLayoutChild);
-            this.updateColumns(nonColumnLayoutColumns);
+            collection = collection.filter((col) => !col.columnLayout && !col.columnLayoutChild);
         }
         super.initColumns(collection, cb);
     }
@@ -2374,6 +2380,7 @@ const IGX_TREE_GRID_DIRECTIVES = [
     IgxTreeGridComponent,
     IgxTreeGridGroupByAreaComponent,
     IgxTreeGridGroupingPipe,
+    IgxRowLoadingIndicatorTemplateDirective,
     IgxRowAddTextDirective,
     IgxRowEditActionsDirective,
     IgxRowEditTextDirective,
@@ -2471,6 +2478,7 @@ class IgxTreeGridModule {
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.2.0", ngImport: i0, type: IgxTreeGridModule, imports: [IgxTreeGridComponent,
             IgxTreeGridGroupByAreaComponent,
             IgxTreeGridGroupingPipe,
+            IgxRowLoadingIndicatorTemplateDirective,
             IgxRowAddTextDirective,
             IgxRowEditActionsDirective,
             IgxRowEditTextDirective,
@@ -2560,6 +2568,7 @@ class IgxTreeGridModule {
             IgxPaginatorDirective], exports: [IgxTreeGridComponent,
             IgxTreeGridGroupByAreaComponent,
             IgxTreeGridGroupingPipe,
+            IgxRowLoadingIndicatorTemplateDirective,
             IgxRowAddTextDirective,
             IgxRowEditActionsDirective,
             IgxRowEditTextDirective,
@@ -2703,5 +2712,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { IGX_TREE_GRID_DIRECTIVES, ITreeGridAggregation, IgxGroupedTreeGridSorting, IgxTreeGridComponent, IgxTreeGridGroupByAreaComponent, IgxTreeGridGroupingPipe, IgxTreeGridModule };
+export { IGX_TREE_GRID_DIRECTIVES, ITreeGridAggregation, IgxGroupedTreeGridSorting, IgxRowLoadingIndicatorTemplateDirective, IgxTreeGridComponent, IgxTreeGridGroupByAreaComponent, IgxTreeGridGroupingPipe, IgxTreeGridModule };
 //# sourceMappingURL=igniteui-angular-grids-tree-grid.mjs.map