igniteui-angular 21.2.11 → 21.2.13

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

@@ -2,7 +2,7 @@ import * as i0 from '@angular/core';
 import { Injectable, inject, ElementRef, ChangeDetectorRef, TemplateRef, HostBinding, HostListener, ViewChild, Input, ChangeDetectionStrategy, Component, Pipe, DOCUMENT, forwardRef, InjectionToken, QueryList, NgZone, IterableDiffers, ViewContainerRef, Injector, EnvironmentInjector, LOCALE_ID, EventEmitter, createComponent, booleanAttribute, ViewChildren, ContentChildren, ContentChild, Output, Directive, CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
 import { NgTemplateOutlet, NgClass, NgStyle } from '@angular/common';
 import { GridBaseAPIService, IGX_GRID_BASE, IgxGridSelectionService, IgxFilteringService, GridSelectionMode, IgxColumnFormatterPipe, IgxGroupByAreaDirective, IgxGroupAreaDropDirective, IgxGroupByMetaPipe, GridSummaryPosition, RowPinningPosition, IgxGridCellComponent, IgxGridCellImageAltPipe, IgxStringReplacePipe, IgxRowDirective, IgxRowDragDirective, IgxGridNotGroupedPipe, IgxGridTopLevelColumns, IgxGridCellStylesPipe, IgxGridCellStyleClassesPipe, IgxGridDataMapperPipe, IgxGridTransactionStatePipe, FilterMode, GridCellMergeMode, IgxGridValidationService, IgxColumnResizingService, IGX_GRID_SERVICE_BASE, IgxGridNavigationService, IgxGridSummaryService, IgxGridTransaction, RowEditPositionStrategy, getUUID, IgxGridExcelStyleFilteringComponent, DropPosition, IgxCell, IgxEditRow, IgxColumnComponent, CharSeparatedValueData, IgxAdvancedFilteringDialogComponent, IgxColumnGroupComponent, IgxGridPinningActionsComponent, IgxGridColumnResizerComponent, IgxGridHeaderRowComponent, IgxGridBodyDirective, IgxRowEditTabStopDirective, IgxSummaryRowComponent, IgxExcelStyleLoadingValuesTemplateDirective, IgxRowAddTextDirective, IgxRowExpandedIndicatorDirective, IgxRowCollapsedIndicatorDirective, IgxHeaderExpandedIndicatorDirective, IgxHeaderCollapsedIndicatorDirective, IgxExcelStyleHeaderIconDirective, IgxSortAscendingHeaderIconDirective, IgxSortDescendingHeaderIconDirective, IgxSortHeaderIconDirective, IgxGridLoadingTemplateDirective, IgxGridEmptyTemplateDirective, IgxHeadSelectorDirective, IgxRowSelectorDirective, IgxRowDragGhostDirective, IgxRowEditTemplateDirective, IgxRowEditTextDirective, IgxRowEditActionsDirective, IgxDragIndicatorIconDirective, IgxToolbarToken, WatchChanges, IgxGridRow, IgxGridCell, IgxGroupByRow, IgxSummaryRow, IgxGridMRLNavigationService, IgxGridDragSelectDirective, IgxColumnMovingDropDirective, IgxGridTransactionPipe, IgxHasVisibleColumnsPipe, IgxGridRowPinningPipe, IgxGridAddRowPipe, IgxGridRowClassesPipe, IgxGridRowStylesPipe, IgxSummaryDataPipe, IgxGridDetailTemplateDirective, IgxGroupByRowTemplateDirective, IgxGroupByRowSelectorDirective, IgxGridCRUDService, IgxGridFooterComponent, IgxGridStateDirective, IgxGridEditingActionsComponent, IgxGridActionsBaseDirective, IgxGridActionButtonComponent, IgxGridHeaderComponent, IgxGridHeaderGroupComponent, IgxFilterCellTemplateDirective, IgxSummaryTemplateDirective, IgxCellTemplateDirective, IgxCellValidationErrorDirective, IgxCellHeaderTemplateDirective, IgxCellFooterTemplateDirective, IgxCellEditorTemplateDirective, IgxCollapsibleIndicatorTemplateDirective, IgxColumnLayoutComponent, IgxColumnActionsComponent, IgxColumnHidingDirective, IgxColumnPinningDirective, IgxCSVTextDirective, IgxExcelTextDirective, IgxGridToolbarActionsComponent, IgxGridToolbarAdvancedFilteringComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarTitleComponent, IgxGridToolbarDirective, IgxExcelStyleHeaderComponent, IgxExcelStyleSortingComponent, IgxExcelStylePinningComponent, IgxExcelStyleHidingComponent, IgxExcelStyleSelectingComponent, IgxExcelStyleClearFiltersComponent, IgxExcelStyleConditionalFilterComponent, IgxExcelStyleMovingComponent, IgxExcelStyleSearchComponent, IgxExcelStyleColumnOperationsTemplateDirective, IgxExcelStyleFilterOperationsTemplateDirective, IgxColumnRequiredValidatorDirective, IgxColumnMinValidatorDirective, IgxColumnMaxValidatorDirective, IgxColumnEmailValidatorDirective, IgxColumnMinLengthValidatorDirective, IgxColumnMaxLengthValidatorDirective, IgxColumnPatternValidatorDirective } from 'igniteui-angular/grids/core';
-import { cloneArray, DataUtil, GridColumnDataType, IgxNumberFormatterPipe, IgxDateFormatterPipe, IgxPercentFormatterPipe, IgxCurrencyFormatterPipe, GridSummaryCalculationMode, FilteringExpressionsTree, FilterUtil, HammerGesturesManager, isTree, FilteringLogic, FilteringExpressionsTreeType, getCurrentResourceStrings, GridResourceStringsEN, isObject, TransactionType, IgxFlatTransactionFactory, IgxOverlayService, PlatformUtil, I18N_FORMATTER, DefaultMergeStrategy, FilteringStrategy, ColumnPinningPosition, VerticalAlignment, HorizontalAlignment, ConnectedPositioningStrategy, AbsoluteScrollStrategy, DefaultDataCloneStrategy, ɵSize as _Size, areEqualArrays, resizeObservable, compareMaps, TransactionEventOrigin, mergeObjects, ContainerPositionStrategy, resolveNestedPath, columnFieldPath, recreateTree, recreateTreeFromFields, DEFAULT_LOCALE, onResourceChangeHandle, IgxOverlayOutletDirective, IgxActionStripToken } from 'igniteui-angular/core';
+import { cloneArray, DataUtil, GridColumnDataType, IgxNumberFormatterPipe, IgxDateFormatterPipe, IgxPercentFormatterPipe, IgxCurrencyFormatterPipe, GridSummaryCalculationMode, FilteringExpressionsTree, FilterUtil, HammerGesturesManager, isTree, FilteringLogic, FilteringExpressionsTreeType, getCurrentResourceStrings, GridResourceStringsEN, isObject, TransactionType, IgxFlatTransactionFactory, IgxOverlayService, PlatformUtil, I18N_FORMATTER, DefaultMergeStrategy, FilteringStrategy, ColumnPinningPosition, VerticalAlignment, HorizontalAlignment, ConnectedPositioningStrategy, AbsoluteScrollStrategy, DefaultDataCloneStrategy, ɵSize as _Size, areEqualArrays, runAfterRenderOnce, resizeObservable, compareMaps, TransactionEventOrigin, mergeObjects, ContainerPositionStrategy, resolveNestedPath, columnFieldPath, recreateTree, recreateTreeFromFields, DEFAULT_LOCALE, onResourceChangeHandle, IgxOverlayOutletDirective, IgxActionStripToken } from 'igniteui-angular/core';
 import { takeUntil, shareReplay, filter, throttle, take, switchMap, throttleTime, takeWhile, map, first } from 'rxjs/operators';
 import { Subject, BehaviorSubject, animationFrameScheduler, fromEvent, timer, pipe, merge } from 'rxjs';
 import { IgxIconComponent } from 'igniteui-angular/icon';
@@ -4095,9 +4095,7 @@ class IgxGridBaseDirective {
             if (this.hasColumnsToAutosize) {
                 this.headerContainer?.dataChanged.pipe(takeUntil(this.destroy$)).subscribe(() => {
                     this.cdr.detectChanges();
-                    this.zone.onStable.pipe(first()).subscribe(() => {
-                        this.autoSizeColumnsInView();
-                    });
+                    runAfterRenderOnce(this.injector, () => this.autoSizeColumnsInView());
                 });
             }
             // Window resize observer not needed because when you resize the window element the tbody container always resize so
@@ -4545,7 +4543,7 @@ class IgxGridBaseDirective {
         // reset auto-size and calculate it again.
         this._columns.forEach(x => x.autoSize = undefined);
         this.resetCaches();
-        this.zone.onStable.pipe(first()).subscribe(() => {
+        runAfterRenderOnce(this.injector, () => {
             this.cdr.detectChanges();
             this.autoSizeColumnsInView();
         });
@@ -5407,6 +5405,15 @@ class IgxGridBaseDirective {
         if (!sumExistingWidths && !columnsToSize) {
             return '0px';
         }
+        // When the grid has no measurable width, calculateGridWidth() falls back to the
+        // sum of its column widths and sets isColumnWidthSum. If all visible columns
+        // already have explicit or constrained widths, columnsToSize is 0 and
+        // computedWidth equals sumExistingWidths, resulting in 0 / 0 = NaN.
+        // Return the "0px" sentinel so _derivePossibleWidth() preserves the existing
+        // valid column widths.
+        if (columnsToSize <= 0 && this.isColumnWidthSum) {
+            return '0px';
+        }
         computedWidth -= this.featureColumnsWidth();
         const columnWidth = !Number.isFinite(sumExistingWidths) ?
             computedWidth / columnsToSize :
@@ -6078,7 +6085,7 @@ class IgxGridBaseDirective {
             const tmplId = args.context.templateID.type;
             const index = args.context.index;
             args.view.detectChanges();
-            this.zone.onStable.pipe(first()).subscribe(() => {
+            runAfterRenderOnce(this.injector, () => {
                 const row = tmplId === 'dataRow' ? this.gridAPI.get_row_by_index(index) : null;
                 const summaryRow = tmplId === 'summaryRow' ? this.summariesRowList.find((sr) => sr.dataRowIndex === index) : null;
                 if (row && row instanceof IgxRowDirective) {
@@ -6713,25 +6720,16 @@ class IgxGridBaseDirective {
             this.calculateGridWidth();
             this.cdr.detectChanges();
         }
-        if (this.zone.isStable) {
+        runAfterRenderOnce(this.injector, () => {
             this.zone.run(() => {
                 this._applyWidthHostBinding();
                 this.cdr.detectChanges();
             });
-        }
-        else {
-            this.zone.onStable.pipe(first()).subscribe(() => {
-                this.zone.run(() => {
-                    this._applyWidthHostBinding();
-                });
-            });
-        }
+        });
         this.resetCaches(recalcFeatureWidth);
         if (this.hasColumnsToAutosize) {
             this.cdr.detectChanges();
-            this.zone.onStable.pipe(first()).subscribe(() => {
-                this._autoSizeColumnsNotify.next();
-            });
+            runAfterRenderOnce(this.injector, () => this._autoSizeColumnsNotify.next());
         }
         // in case horizontal scrollbar has appeared recalc to size correctly.
         if (hasHScroll !== this.hasHorizontalScroll()) {
@@ -7343,13 +7341,7 @@ class IgxGridBaseDirective {
                 this.changeRowEditingOverlayStateOnScroll(this.crudService.rowInEditMode);
             }
         };
-        if (this.isZonelessChangeDetection()) {
-            this.cdr.detectChanges();
-            callback();
-        }
-        else {
-            this.zone.onStable.pipe(first()).subscribe(callback);
-        }
+        runAfterRenderOnce(this.injector, callback);
         this.disableTransitions = false;
         this.hideOverlays();
         const context = this.actionStrip?.context;
@@ -7370,9 +7362,6 @@ class IgxGridBaseDirective {
         };
         this.gridScroll.emit(args);
     }
-    isZonelessChangeDetection() {
-        return this.zone.constructor.name === 'NoopNgZone';
-    }
     hasMenuPinningActions() {
         const strip = this.actionStrip;
         const actionButtons = strip?.actionButtons;
@@ -7390,7 +7379,7 @@ class IgxGridBaseDirective {
         this._horizontalForOfs.forEach(vfor => vfor.onHScroll(scrollLeft));
         this.cdr.markForCheck();
         this.zone.run(() => {
-            this.zone.onStable.pipe(first()).subscribe(() => {
+            runAfterRenderOnce(this.injector, () => {
                 this.parentVirtDir.chunkLoad.emit(this.headerContainer.state);
                 requestAnimationFrame(() => {
                     this.autoSizeColumnsInView();