From c893f917ba39c76696718bc094dfd0f45f2ad2cc Mon Sep 17 00:00:00 2001 From: MKirova Date: Tue, 21 Jan 2025 14:58:35 +0200 Subject: [PATCH 01/28] feat(elements): Move elements specific members of IgxGrid into elements. --- .../src/analyzer/config.template.ts | 4 +- .../src/analyzer/elements.config.ts | 73 ++++--- .../src/app/components.ts | 4 +- .../src/lib/grids/events.ts | 8 + .../src/lib/grids/grid.component.ts | 184 ++++++++++++++++++ .../src/lib/state.component.ts | 2 +- .../action-strip/action-strip.component.ts | 2 +- .../grids/columns/column-group.component.ts | 2 +- .../grids/columns/column-layout.component.ts | 2 +- .../src/lib/grids/columns/column.component.ts | 8 +- .../src/lib/grids/common/events.ts | 8 - .../src/lib/grids/grid-base.directive.ts | 32 +-- .../hierarchical-grid.component.ts | 3 - .../hierarchical-grid/row-island.component.ts | 2 +- .../grids/toolbar/grid-toolbar.component.ts | 2 +- .../src/lib/paginator/paginator.component.ts | 2 +- 16 files changed, 246 insertions(+), 92 deletions(-) create mode 100644 projects/igniteui-angular-elements/src/lib/grids/events.ts create mode 100644 projects/igniteui-angular-elements/src/lib/grids/grid.component.ts diff --git a/projects/igniteui-angular-elements/src/analyzer/config.template.ts b/projects/igniteui-angular-elements/src/analyzer/config.template.ts index 59a992dbfe6..e0e31cfbae5 100644 --- a/projects/igniteui-angular-elements/src/analyzer/config.template.ts +++ b/projects/igniteui-angular-elements/src/analyzer/config.template.ts @@ -1,13 +1,13 @@ import { - IgxGridComponent, IgxHierarchicalGridComponent, IgxPivotDataSelectorComponent, IgxPivotGridComponent, IgxTreeGridComponent } from '../../../igniteui-angular/src/public_api'; +import { IgxGridElementsComponent } from '../lib/grids/grid.component'; export const registerComponents = [ - IgxGridComponent, + IgxGridElementsComponent, IgxHierarchicalGridComponent, IgxTreeGridComponent, IgxPivotGridComponent, diff --git a/projects/igniteui-angular-elements/src/analyzer/elements.config.ts b/projects/igniteui-angular-elements/src/analyzer/elements.config.ts index 1873b1de146..a6c2564bc38 100644 --- a/projects/igniteui-angular-elements/src/analyzer/elements.config.ts +++ b/projects/igniteui-angular-elements/src/analyzer/elements.config.ts @@ -1,10 +1,10 @@ import { - IgxGridComponent, IgxHierarchicalGridComponent, IgxPivotDataSelectorComponent, IgxPivotGridComponent, IgxTreeGridComponent, } from "../../../igniteui-angular/src/public_api"; +import { IgxGridElementsComponent } from "../lib/grids/grid.component"; import { IgxPaginatorComponent } from "../../../igniteui-angular/src/lib/paginator/paginator.component"; import { IgxPaginatorToken } from "../../../igniteui-angular/src/lib/paginator/token"; import { IgxActionStripComponent } from "../../../igniteui-angular/src/lib/action-strip/action-strip.component"; @@ -27,7 +27,7 @@ import { IgxGridToolbarPinningComponent } from "../../../igniteui-angular/src/li import { IgxGridStateComponent } from "../lib/state.component"; export const registerComponents = [ - IgxGridComponent, + IgxGridElementsComponent, IgxHierarchicalGridComponent, IgxTreeGridComponent, IgxPivotGridComponent, @@ -40,10 +40,10 @@ export var registerConfig = [ component: IgxActionStripComponent, selector: "igc-action-strip", parents: [ - IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxRowIslandComponent, + IgxGridElementsComponent, ], contentQueries: [ { @@ -61,13 +61,13 @@ export var registerConfig = [ component: IgxColumnComponent, selector: "igc-column", parents: [ - IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, IgxRowIslandComponent, IgxColumnGroupComponent, IgxColumnLayoutComponent, + IgxGridElementsComponent, ], contentQueries: [], additionalProperties: [ @@ -117,11 +117,11 @@ export var registerConfig = [ component: IgxColumnGroupComponent, selector: "igc-column-group", parents: [ - IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxColumnGroupComponent, IgxRowIslandComponent, + IgxGridElementsComponent, ], contentQueries: [ { @@ -177,7 +177,7 @@ export var registerConfig = [ { component: IgxColumnLayoutComponent, selector: "igc-column-layout", - parents: [IgxGridComponent], + parents: [IgxGridElementsComponent], contentQueries: [ { property: "children", @@ -230,21 +230,32 @@ export var registerConfig = [ provideAs: IgxColumnComponent, }, { - component: IgxGridComponent, + component: IgxGridEditingActionsComponent, + selector: "igc-grid-editing-actions", + parents: [IgxActionStripComponent], + contentQueries: [], + additionalProperties: [{ name: "hasChildren" }], + methods: ["startEdit"], + boolProps: ["addRow", "editRow", "deleteRow", "addChild", "asMenuItems"], + provideAs: IgxGridActionsBaseDirective, + }, + { + component: IgxGridElementsComponent, selector: "igc-grid", parents: [], contentQueries: [ { - property: "columnList", - childType: IgxColumnComponent, + property: "actionStripComponents", + childType: IgxActionStripToken, isQueryList: true, - descendants: true, }, { - property: "actionStripComponents", - childType: IgxActionStripToken, + property: "columnList", + childType: IgxColumnComponent, isQueryList: true, + descendants: true, }, + { property: "actionStripComponent", childType: IgxActionStripToken }, { property: "toolbar", childType: IgxToolbarToken, isQueryList: true }, { property: "paginationComponents", @@ -253,6 +264,11 @@ export var registerConfig = [ }, ], additionalProperties: [ + { name: "validation" }, + { name: "gridAPI" }, + { name: "cdr" }, + { name: "navigation", writable: true }, + { name: "actionStripComponents", writable: true }, { name: "groupsRecords" }, { name: "selectedCells" }, { name: "shouldGenerate", writable: true }, @@ -264,10 +280,6 @@ export var registerConfig = [ { name: "lastSearchInfo" }, { name: "filteredData" }, { name: "filteredSortedData" }, - { name: "validation" }, - { name: "gridAPI" }, - { name: "cdr" }, - { name: "navigation", writable: true }, { name: "virtualizationState" }, { name: "nativeElement" }, { name: "defaultRowHeight" }, @@ -398,16 +410,6 @@ export var registerConfig = [ "selectRowOnClick", ], }, - { - component: IgxGridEditingActionsComponent, - selector: "igc-grid-editing-actions", - parents: [IgxActionStripComponent], - contentQueries: [], - additionalProperties: [{ name: "hasChildren" }], - methods: ["startEdit"], - boolProps: ["addRow", "editRow", "deleteRow", "addChild", "asMenuItems"], - provideAs: IgxGridActionsBaseDirective, - }, { component: IgxGridPinningActionsComponent, selector: "igc-grid-pinning-actions", @@ -422,10 +424,10 @@ export var registerConfig = [ component: IgxGridStateComponent, selector: "igc-grid-state", parents: [ - IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, + IgxGridElementsComponent, ], contentQueries: [], additionalProperties: [{ name: "grid", writable: true }], @@ -456,10 +458,10 @@ export var registerConfig = [ component: IgxGridToolbarComponent, selector: "igc-grid-toolbar", parents: [ - IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, + IgxGridElementsComponent, ], contentQueries: [ { property: "hasActions", childType: IgxGridToolbarActionsComponent }, @@ -528,17 +530,13 @@ export var registerConfig = [ isQueryList: true, descendants: true, }, - { - property: "actionStripComponents", - childType: IgxActionStripToken, - isQueryList: true, - }, { property: "columnList", childType: IgxColumnComponent, isQueryList: true, descendants: true, }, + { property: "actionStripComponent", childType: IgxActionStripToken }, { property: "toolbar", childType: IgxToolbarToken, isQueryList: true }, { property: "paginationComponents", @@ -683,10 +681,10 @@ export var registerConfig = [ component: IgxPaginatorComponent, selector: "igc-paginator", parents: [ - IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, + IgxGridElementsComponent, ], contentQueries: [], additionalProperties: [ @@ -857,6 +855,7 @@ export var registerConfig = [ isQueryList: true, descendants: true, }, + { property: "actionStripComponent", childType: IgxActionStripToken }, ], additionalProperties: [ { name: "rowIslandAPI", writable: true }, @@ -986,11 +985,7 @@ export var registerConfig = [ isQueryList: true, descendants: true, }, - { - property: "actionStripComponents", - childType: IgxActionStripToken, - isQueryList: true, - }, + { property: "actionStripComponent", childType: IgxActionStripToken }, { property: "toolbar", childType: IgxToolbarToken, isQueryList: true }, { property: "paginationComponents", diff --git a/projects/igniteui-angular-elements/src/app/components.ts b/projects/igniteui-angular-elements/src/app/components.ts index d3f0eb47270..917425684f0 100644 --- a/projects/igniteui-angular-elements/src/app/components.ts +++ b/projects/igniteui-angular-elements/src/app/components.ts @@ -4,7 +4,6 @@ import { IgxColumnComponent, IgxColumnGroupComponent, IgxColumnLayoutComponent, - IgxGridComponent, IgxGridEditingActionsComponent, IgxGridPinningActionsComponent, IgxGridToolbarActionsComponent, @@ -26,6 +25,7 @@ import { GridType } from 'projects/igniteui-angular/src/lib/grids/common/grid.in import { registerConfig } from "../analyzer/elements.config"; import { createIgxCustomElement, withRegister } from './create-custom-element'; import { IgxGridStateComponent } from '../lib/state.component'; +import { IgxGridElementsComponent } from '../lib/grids/grid.component'; import { IgxIconBroadcastService } from '../lib/icon.broadcast.service'; import { injector } from '../utils/injector-ref'; import { registerComponent } from '../utils/register'; @@ -33,7 +33,7 @@ import { registerComponent } from '../utils/register'; // force-create icon service, TODO: move to initializer or register/define mechanic to avoid side-effect? const _iconBroadcast: IgxIconBroadcastService = injector.get(IgxIconBroadcastService); -const grid = createIgxCustomElement(IgxGridComponent, { injector, registerConfig }); +const grid = createIgxCustomElement(IgxGridElementsComponent, { injector, registerConfig }); const IgcGridComponent = withRegister(grid, () => { registerComponent(IgcGridComponent) }); const treeGrid = createIgxCustomElement(IgxTreeGridComponent, { injector, registerConfig }); diff --git a/projects/igniteui-angular-elements/src/lib/grids/events.ts b/projects/igniteui-angular-elements/src/lib/grids/events.ts new file mode 100644 index 00000000000..d1bce6a0c25 --- /dev/null +++ b/projects/igniteui-angular-elements/src/lib/grids/events.ts @@ -0,0 +1,8 @@ +import { ColumnType } from '../../../../igniteui-angular/src/lib/grids/common/grid.interface'; +import { IBaseEventArgs } from 'igniteui-angular/src/lib/core/utils'; + +export interface IColumnsAutoGeneratedEventArgs extends IBaseEventArgs { + /* blazorTreatAsCollection */ + /* blazorCollectionName: ColumnCollection */ + columns?: ColumnType[] +} diff --git a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts new file mode 100644 index 00000000000..33c7a8ee666 --- /dev/null +++ b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts @@ -0,0 +1,184 @@ +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, CUSTOM_ELEMENTS_SCHEMA, ElementRef, EnvironmentInjector, EventEmitter, Inject, Injector, IterableDiffers, LOCALE_ID, NgZone, Optional, Output, QueryList, ViewContainerRef } from '@angular/core'; +import { IgxGridComponent } from '../../../../igniteui-angular/src/lib/grids/grid/grid.component'; +import { IColumnsAutoGeneratedEventArgs } from './events'; +import { IgxGridCRUDService } from '../../../../igniteui-angular/src/lib/grids/common/crud.service'; +import { IgxGridNavigationService } from '../../../../igniteui-angular/src/lib/grids/grid-navigation.service'; +import { IgxGridSummaryService } from '../../../../igniteui-angular/src/lib/grids/summaries/grid-summary.service'; +import { IgxGridSelectionService } from '../../../../igniteui-angular/src/lib/grids/selection/selection.service'; +import { IgxGridValidationService } from '../../../../igniteui-angular/src/lib/grids/grid/grid-validation.service'; +import { GridServiceType, IGX_GRID_BASE, IGX_GRID_SERVICE_BASE, IgxButtonDirective, IgxCircularProgressBarComponent, IgxColumnComponent, IgxFlatTransactionFactory, IgxGridForOfDirective, IgxGridHeaderRowComponent, IgxGridToolbarComponent, IgxGridTransaction, IgxIconComponent, IgxOverlayOutletDirective, IgxOverlayService, IgxPaginatorComponent, IgxRippleDirective, IgxRowEditTabStopDirective, IgxSnackbarComponent, IgxTemplateOutletDirective, IgxTextHighlightService, IgxToggleDirective, State, Transaction, TransactionService } from 'igniteui-angular'; +import { IgxGridAPIService } from '../../../../igniteui-angular/src/lib/grids/grid/grid-api.service'; +import { IgxFilteringService } from '../../../../igniteui-angular/src/lib/grids/filtering/grid-filtering.service'; +import { IgxColumnResizingService } from '../../../../igniteui-angular/src/lib/grids/resizing/resizing.service'; +import { IgxForOfScrollSyncService, IgxForOfSyncService } from '../../../../igniteui-angular/src/lib/directives/for-of/for_of.sync.service'; +import { IgxActionStripToken } from '../../../../igniteui-angular/src/lib/action-strip/token'; +import { takeUntil } from 'rxjs'; +import { DOCUMENT, NgClass, NgFor, NgIf, NgStyle, NgTemplateOutlet } from '@angular/common'; +import { PlatformUtil } from '../../../../igniteui-angular/src/lib/core/utils'; +import { IgxGridGroupByAreaComponent } from '../../../../igniteui-angular/src/lib/grids/grouping/grid-group-by-area.component'; +import { IgxGridBodyDirective } from '../../../../igniteui-angular/src/lib/grids/grid.common'; +import { IgxGridDragSelectDirective } from '../../../../igniteui-angular/src/lib/grids/selection/drag-select.directive'; +import { IgxColumnMovingDropDirective } from '../../../../igniteui-angular/src/lib/grids/moving/moving.drop.directive'; +import { IgxGridRowComponent } from '../../../../igniteui-angular/src/lib/grids/grid/grid-row.component'; +import { IgxGridGroupByRowComponent } from '../../../../igniteui-angular/src/lib/grids/grid/groupby-row.component'; +import { IgxSummaryRowComponent } from '../../../../igniteui-angular/src/lib/grids/summaries/summary-row.component'; +import { IgxGridColumnResizerComponent } from '../../../../igniteui-angular/src/lib/grids/resizing/resizer.component'; +import { IgxGridAddRowPipe, IgxGridRowClassesPipe, IgxGridRowPinningPipe, IgxGridRowStylesPipe, IgxGridTransactionPipe, IgxHasVisibleColumnsPipe, IgxStringReplacePipe } from '../../../../igniteui-angular/src/lib/grids/common/pipes'; +import { IgxSummaryDataPipe } from '../../../../igniteui-angular/src/lib/grids/summaries/grid-root-summary.pipe'; +import { IgxGridFilteringPipe, IgxGridGroupingPipe, IgxGridPagingPipe, IgxGridSortingPipe } from '../../../../igniteui-angular/src/lib/grids/grid/grid.pipes'; +import { IgxGridSummaryPipe } from '../../../../igniteui-angular/src/lib/grids/grid/grid.summary.pipe'; +import { IgxGridDetailsPipe } from '../../../../igniteui-angular/src/lib/grids/grid/grid.details.pipe'; + +/* blazorAdditionalDependency: Column */ +/* blazorAdditionalDependency: ColumnGroup */ +/* blazorAdditionalDependency: ColumnLayout */ +/* blazorAdditionalDependency: GridToolbar */ +/* blazorAdditionalDependency: GridToolbarActions */ +/* blazorAdditionalDependency: GridToolbarTitle */ +/* blazorAdditionalDependency: GridToolbarAdvancedFiltering */ +/* blazorAdditionalDependency: GridToolbarExporter */ +/* blazorAdditionalDependency: GridToolbarHiding */ +/* blazorAdditionalDependency: GridToolbarPinning */ +/* blazorAdditionalDependency: ActionStrip */ +/* blazorAdditionalDependency: GridActionsBaseDirective */ +/* blazorAdditionalDependency: GridEditingActions */ +/* blazorAdditionalDependency: GridPinningActions */ +/* blazorIndirectRender */ +/** + * Grid provides a way to present and manipulate tabular data. + * + * @igxModule IgxGridModule + * @igxGroup Grids & Lists + * @igxKeywords grid, table + * @igxTheme igx-grid-theme + * @remarks + * The Ignite UI Grid is used for presenting and manipulating tabular data in the simplest way possible. Once data + * has been bound, it can be manipulated through filtering, sorting & editing operations. + * @example + * ```html + * + * + * + * + * + * ``` + */ +@Component({ + changeDetection: ChangeDetectionStrategy.OnPush, + preserveWhitespaces: false, + providers: [ + IgxGridCRUDService, + IgxGridNavigationService, + IgxGridSummaryService, + IgxGridSelectionService, + IgxGridValidationService, + { provide: IGX_GRID_SERVICE_BASE, useClass: IgxGridAPIService }, + { provide: IGX_GRID_BASE, useExisting: IgxGridElementsComponent }, + IgxFilteringService, + IgxColumnResizingService, + IgxForOfSyncService, + IgxForOfScrollSyncService, + ], + imports: [ + NgIf, + NgClass, + NgFor, + NgStyle, + NgTemplateOutlet, + IgxGridGroupByAreaComponent, + IgxGridHeaderRowComponent, + IgxGridBodyDirective, + IgxGridDragSelectDirective, + IgxColumnMovingDropDirective, + IgxGridForOfDirective, + IgxTemplateOutletDirective, + IgxGridRowComponent, + IgxGridGroupByRowComponent, + IgxSummaryRowComponent, + IgxOverlayOutletDirective, + IgxToggleDirective, + IgxCircularProgressBarComponent, + IgxSnackbarComponent, + IgxButtonDirective, + IgxRippleDirective, + IgxIconComponent, + IgxRowEditTabStopDirective, + IgxGridColumnResizerComponent, + IgxGridTransactionPipe, + IgxHasVisibleColumnsPipe, + IgxGridRowPinningPipe, + IgxGridAddRowPipe, + IgxGridRowClassesPipe, + IgxGridRowStylesPipe, + IgxSummaryDataPipe, + IgxGridGroupingPipe, + IgxGridPagingPipe, + IgxGridSortingPipe, + IgxGridFilteringPipe, + IgxGridSummaryPipe, + IgxGridDetailsPipe, + IgxStringReplacePipe, + ], + selector: 'igx-grid', + templateUrl: '../../../../igniteui-angular/src/lib/grids/grid/grid.component.html', + schemas: [CUSTOM_ELEMENTS_SCHEMA] +}) +export class IgxGridElementsComponent extends IgxGridComponent { + + constructor( + public override readonly validation: IgxGridValidationService, + /** @hidden @internal */ + public override readonly selectionService: IgxGridSelectionService, + protected override colResizingService: IgxColumnResizingService, + @Inject(IGX_GRID_SERVICE_BASE) public override readonly gridAPI: GridServiceType, + protected override transactionFactory: IgxFlatTransactionFactory, + private elementRef1: ElementRef, + protected override zone: NgZone, + /** @hidden @internal */ + @Inject(DOCUMENT) public override document: any, + public override readonly cdr: ChangeDetectorRef, + protected override differs: IterableDiffers, + protected override viewRef: ViewContainerRef, + protected override injector: Injector, + protected override envInjector: EnvironmentInjector, + public override navigation: IgxGridNavigationService, + /** @hidden @internal */ + public override filteringService: IgxFilteringService, + protected override textHighlightService: IgxTextHighlightService, + @Inject(IgxOverlayService) protected override overlayService: IgxOverlayService, + /** @hidden @internal */ + public override summaryService: IgxGridSummaryService, + @Inject(LOCALE_ID) private localeId1: string, + protected override platform: PlatformUtil, + @Optional() @Inject(IgxGridTransaction) protected override _diTransactions?: TransactionService, + ) { + super(validation, selectionService,colResizingService, gridAPI, transactionFactory, elementRef1, zone, + document, cdr, differs, viewRef,injector, envInjector, navigation, filteringService, textHighlightService, overlayService, + summaryService, localeId1, platform, _diTransactions + ); + console.log("init"); + this.selectionService.selectedRowsChange.pipe(takeUntil(this.destroy$)).subscribe((args: any[]) => { + this.selectedRowsChange.emit(args); + }); + } + + @Output() + public columnsAutogenerated = new EventEmitter(); + + @Output() + public selectedRowsChange = new EventEmitter(); + + /* contentChildren */ + /* blazorInclude */ + /* blazorTreatAsCollection */ + /* blazorCollectionName: ActionStripCollection */ + /* blazorCollectionItemName: ActionStrip */ + /* ngQueryListName: actionStripComponents */ + @ContentChildren(IgxActionStripToken) + public actionStripComponents: QueryList; + + protected override autogenerateColumns() { + super.autogenerateColumns(); + this.columnsAutogenerated.emit({ columns: this._autoGeneratedCols }); + } +} diff --git a/projects/igniteui-angular-elements/src/lib/state.component.ts b/projects/igniteui-angular-elements/src/lib/state.component.ts index ddf53d77efb..b07af14888a 100644 --- a/projects/igniteui-angular-elements/src/lib/state.component.ts +++ b/projects/igniteui-angular-elements/src/lib/state.component.ts @@ -41,7 +41,7 @@ export interface IGridStateInfo { /* jsonAPIManageCollectionInMarkup */ /** * State component allows saving and restoring the state of the grid features. - * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, * + * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, IgxGridElementsComponent, * */ @Component({ selector: 'igx-grid-state', diff --git a/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts b/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts index 5c407a0f3f0..33b363165c3 100644 --- a/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts +++ b/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts @@ -58,7 +58,7 @@ export class IgxActionStripMenuItemDirective { * * @igxGroup Data Entry & Display * - * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxRowIslandComponent, * + * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxRowIslandComponent, IgxGridElementsComponent, * * * @remarks * The Ignite UI Action Strip is a container, overlaying its parent container, diff --git a/projects/igniteui-angular/src/lib/grids/columns/column-group.component.ts b/projects/igniteui-angular/src/lib/grids/columns/column-group.component.ts index 0dc61063adf..3f70debeb24 100644 --- a/projects/igniteui-angular/src/lib/grids/columns/column-group.component.ts +++ b/projects/igniteui-angular/src/lib/grids/columns/column-group.component.ts @@ -24,7 +24,7 @@ import { CellType, ColumnType, IgxColumnTemplateContext } from '../common/grid.i /** * **Ignite UI for Angular Column Group** * - * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxColumnGroupComponent, IgxRowIslandComponent + * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxColumnGroupComponent, IgxRowIslandComponent, IgxGridElementsComponent */ @Component({ changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/projects/igniteui-angular/src/lib/grids/columns/column-layout.component.ts b/projects/igniteui-angular/src/lib/grids/columns/column-layout.component.ts index 2580d4f927a..d673a75cb05 100644 --- a/projects/igniteui-angular/src/lib/grids/columns/column-layout.component.ts +++ b/projects/igniteui-angular/src/lib/grids/columns/column-layout.component.ts @@ -18,7 +18,7 @@ import { IgxColumnGroupComponent } from './column-group.component'; /** * Column layout for declaration of Multi-row Layout * - * @igxParent IgxGridComponent + * @igxParent IgxGridComponent, IgxGridElementsComponent */ @Component({ changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/projects/igniteui-angular/src/lib/grids/columns/column.component.ts b/projects/igniteui-angular/src/lib/grids/columns/column.component.ts index 9cffef0cb57..786f2b2f005 100644 --- a/projects/igniteui-angular/src/lib/grids/columns/column.component.ts +++ b/projects/igniteui-angular/src/lib/grids/columns/column.component.ts @@ -76,7 +76,7 @@ const DEFAULT_DIGITS_INFO = '1.0-3'; * filtering & editing are enabled at the column level. You can also provide a template containing custom content inside * the column using `ng-template` which will be used for all cells within the column. * - * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, IgxRowIslandComponent, IgxColumnGroupComponent, IgxColumnLayoutComponent + * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, IgxRowIslandComponent, IgxColumnGroupComponent, IgxColumnLayoutComponent, IgxGridElementsComponent */ @Component({ changeDetection: ChangeDetectionStrategy.OnPush, @@ -1437,7 +1437,7 @@ export class IgxColumnComponent implements AfterContentInit, OnDestroy, ColumnTy } const unpinnedColumns = this.grid.unpinnedColumns.filter(c => !c.columnGroup); const pinnedColumns = this.grid.pinnedColumns.filter(c => !c.columnGroup); - + let col = this; let vIndex = -1; @@ -2326,10 +2326,10 @@ export class IgxColumnComponent implements AfterContentInit, OnDestroy, ColumnTy columns = columns.filter(c => c.level >= this.level && c !== this && c.parent !== this && c.topLevelParent === this.topLevelParent); } - + // If isPreceding, find a target such that when the current column is placed after it, current colummn will receive a visibleIndex === index. This takes into account visible children of the columns. // If !isPreceding, finds a column of the same level and visible index that equals the passed index agument (c.visibleIndex === index). No need to consider the children here. - + if (isPreceding) { columns = columns.filter(c => c.visibleIndex > this.visibleIndex); target = columns.find(c => c.level === this.level && c.visibleIndex + (c as any).calcChildren() - this.calcChildren() === index); diff --git a/projects/igniteui-angular/src/lib/grids/common/events.ts b/projects/igniteui-angular/src/lib/grids/common/events.ts index 93ece9f277a..e00bdab243a 100644 --- a/projects/igniteui-angular/src/lib/grids/common/events.ts +++ b/projects/igniteui-angular/src/lib/grids/common/events.ts @@ -512,14 +512,6 @@ export interface ISortingEventArgs extends IBaseEventArgs, CancelableEventArgs { groupingExpressions?: IGroupingExpression | Array; } -/* blazorInclude */ -/** @hidden @internal */ -export interface IColumnsAutoGeneratedEventArgs extends IBaseEventArgs { - /* blazorTreatAsCollection */ - /* blazorCollectionName: ColumnCollection */ - columns?: ColumnType[] -} - /** * Represents event arguments related to filtering operations * The event is cancelable diff --git a/projects/igniteui-angular/src/lib/grids/grid-base.directive.ts b/projects/igniteui-angular/src/lib/grids/grid-base.directive.ts index f766a5d6b29..78ed49fa129 100644 --- a/projects/igniteui-angular/src/lib/grids/grid-base.directive.ts +++ b/projects/igniteui-angular/src/lib/grids/grid-base.directive.ts @@ -122,8 +122,7 @@ import { IRowDataCancelableEventArgs, IGridEditDoneEventArgs, IGridRowEventArgs, - IGridContextMenuEventArgs, - IColumnsAutoGeneratedEventArgs + IGridContextMenuEventArgs } from './common/events'; import { IgxAdvancedFilteringDialogComponent } from './filtering/advanced-filtering/advanced-filtering-dialog.component'; import { @@ -730,12 +729,6 @@ export abstract class IgxGridBaseDirective implements GridType, @Output() public columnInit = new EventEmitter(); - /* blazorInclude */ - /** - * @hidden @internal - */ - @Output() - public columnsAutogenerated = new EventEmitter(); /** * Emitted before sorting expressions are applied. @@ -995,11 +988,6 @@ export abstract class IgxGridBaseDirective implements GridType, @Output() public expansionStatesChange = new EventEmitter>(); - /* blazorInclude */ - /** @hidden @internal */ - @Output() - public selectedRowsChange = new EventEmitter(); - /** * Emitted when the expanded state of a row gets changed. * @@ -1150,19 +1138,13 @@ export abstract class IgxGridBaseDirective implements GridType, @ContentChildren(IgxColumnComponent, { read: IgxColumnComponent, descendants: true }) public columnList: QueryList = new QueryList(); - /* contentChildren */ - /* blazorInclude */ - /* blazorTreatAsCollection */ - /* blazorCollectionName: ActionStripCollection */ - /* blazorCollectionItemName: ActionStrip */ - /* ngQueryListName: actionStripComponents */ /** @hidden @internal */ - @ContentChildren(IgxActionStripToken) - protected actionStripComponents: QueryList; + @ContentChild(IgxActionStripToken) + public actionStripComponent: IgxActionStripToken; /** @hidden @internal */ public get actionStrip() { - return this.actionStripComponents?.first; + return this.actionStripComponent; } /** @@ -3422,9 +3404,6 @@ export abstract class IgxGridBaseDirective implements GridType, this._transactions = this.transactionFactory.create(TRANSACTION_TYPE.None); this._transactions.cloneStrategy = this.dataCloneStrategy; this.cdr.detach(); - this.selectionService.selectedRowsChange.pipe(takeUntil(this.destroy$)).subscribe((args: any[]) => { - this.selectedRowsChange.emit(args); - }); IgcTrialWatermark.register(); } @@ -4930,7 +4909,7 @@ export abstract class IgxGridBaseDirective implements GridType, * @param value * @param condition * @param ignoreCase - * @deprecated in version 19.0.0. + * @deprecated in version 19.0.0. */ public filterGlobal(value: any, condition, ignoreCase?) { this.filteringService.filterGlobal(value, condition, ignoreCase); @@ -7081,7 +7060,6 @@ export abstract class IgxGridBaseDirective implements GridType, this._autoGeneratedCols = columns; this.updateColumns(columns); - this.columnsAutogenerated.emit({ columns: this._autoGeneratedCols }); } protected generateDataFields(data: any[]): string[] { diff --git a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.ts b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.ts index 7e23eff7060..58219781f9c 100644 --- a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.ts +++ b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.ts @@ -440,9 +440,6 @@ export class IgxHierarchicalGridComponent extends IgxHierarchicalGridBaseDirecti */ public childRow: IgxChildGridRowComponent; - @ContentChildren(IgxActionStripToken, { read: IgxActionStripToken, descendants: false }) - protected override actionStripComponents: QueryList; - /** @hidden @internal */ public override get actionStrip() { return this.parentIsland ? this.parentIsland.actionStrip : super.actionStrip; diff --git a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/row-island.component.ts b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/row-island.component.ts index c1ff8761a48..0d97960951a 100644 --- a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/row-island.component.ts +++ b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/row-island.component.ts @@ -181,7 +181,7 @@ export class IgxRowIslandComponent extends IgxHierarchicalGridBaseDirective /* ngQueryListName: actionStripComponents */ /** @hidden @internal */ @ContentChildren(IgxActionStripToken, { read: IgxActionStripToken, descendants: false }) - protected override actionStripComponents: QueryList; + protected actionStripComponents: QueryList; /** * @hidden diff --git a/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar.component.ts b/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar.component.ts index 3d98ac1d799..ad2d3de5f41 100644 --- a/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar.component.ts +++ b/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar.component.ts @@ -31,7 +31,7 @@ import { NgIf, NgTemplateOutlet } from '@angular/common'; * Provides a context-aware container component for UI operations for the grid components. * * @igxModule IgxGridToolbarModule - * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent + * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, IgxGridElementsComponent * */ @Component({ diff --git a/projects/igniteui-angular/src/lib/paginator/paginator.component.ts b/projects/igniteui-angular/src/lib/paginator/paginator.component.ts index 9214a7d6761..8b6a43bd088 100644 --- a/projects/igniteui-angular/src/lib/paginator/paginator.component.ts +++ b/projects/igniteui-angular/src/lib/paginator/paginator.component.ts @@ -38,7 +38,7 @@ export class IgxPaginatorContentDirective { /* jsonAPIManageCollectionInMarkup */ /** * Paginator component description - * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, * + * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, IgxGridElementsComponent, * */ @Component({ selector: 'igx-paginator', From fe6512f69a4e855707ece65533a957cfb96ae7fe Mon Sep 17 00:00:00 2001 From: MKirova Date: Wed, 22 Jan 2025 13:18:27 +0200 Subject: [PATCH 02/28] feat(igxHGrid): Extract elements specific members for hgrid. --- .../src/analyzer/config.template.ts | 4 +- .../src/analyzer/elements.config.ts | 50 +++--- .../src/app/components.ts | 4 +- .../src/lib/grids/grid.component.ts | 2 - .../lib/grids/hierarchical-grid.component.ts | 167 ++++++++++++++++++ .../src/lib/state.component.ts | 2 +- .../action-strip/action-strip.component.ts | 2 +- .../grids/columns/column-group.component.ts | 2 +- .../grids/columns/column-layout.component.ts | 2 +- .../src/lib/grids/columns/column.component.ts | 2 +- .../hierarchical-grid/row-island.component.ts | 2 +- .../grids/toolbar/grid-toolbar.component.ts | 2 +- .../src/lib/paginator/paginator.component.ts | 2 +- 13 files changed, 209 insertions(+), 34 deletions(-) create mode 100644 projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts diff --git a/projects/igniteui-angular-elements/src/analyzer/config.template.ts b/projects/igniteui-angular-elements/src/analyzer/config.template.ts index e0e31cfbae5..23491aa4572 100644 --- a/projects/igniteui-angular-elements/src/analyzer/config.template.ts +++ b/projects/igniteui-angular-elements/src/analyzer/config.template.ts @@ -1,14 +1,14 @@ import { - IgxHierarchicalGridComponent, IgxPivotDataSelectorComponent, IgxPivotGridComponent, IgxTreeGridComponent } from '../../../igniteui-angular/src/public_api'; import { IgxGridElementsComponent } from '../lib/grids/grid.component'; +import { IgxHierarchicalGridElementsComponent } from '../lib/grids/hierarchical-grid.component'; export const registerComponents = [ IgxGridElementsComponent, - IgxHierarchicalGridComponent, + IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxPivotGridComponent, IgxPivotDataSelectorComponent diff --git a/projects/igniteui-angular-elements/src/analyzer/elements.config.ts b/projects/igniteui-angular-elements/src/analyzer/elements.config.ts index a6c2564bc38..82827a02429 100644 --- a/projects/igniteui-angular-elements/src/analyzer/elements.config.ts +++ b/projects/igniteui-angular-elements/src/analyzer/elements.config.ts @@ -1,10 +1,10 @@ import { - IgxHierarchicalGridComponent, IgxPivotDataSelectorComponent, IgxPivotGridComponent, IgxTreeGridComponent, } from "../../../igniteui-angular/src/public_api"; import { IgxGridElementsComponent } from "../lib/grids/grid.component"; +import { IgxHierarchicalGridElementsComponent } from "../lib/grids/hierarchical-grid.component"; import { IgxPaginatorComponent } from "../../../igniteui-angular/src/lib/paginator/paginator.component"; import { IgxPaginatorToken } from "../../../igniteui-angular/src/lib/paginator/token"; import { IgxActionStripComponent } from "../../../igniteui-angular/src/lib/action-strip/action-strip.component"; @@ -28,7 +28,7 @@ import { IgxGridStateComponent } from "../lib/state.component"; export const registerComponents = [ IgxGridElementsComponent, - IgxHierarchicalGridComponent, + IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxPivotGridComponent, IgxPivotDataSelectorComponent, @@ -40,10 +40,10 @@ export var registerConfig = [ component: IgxActionStripComponent, selector: "igc-action-strip", parents: [ + IgxGridElementsComponent, + IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, - IgxHierarchicalGridComponent, IgxRowIslandComponent, - IgxGridElementsComponent, ], contentQueries: [ { @@ -61,13 +61,13 @@ export var registerConfig = [ component: IgxColumnComponent, selector: "igc-column", parents: [ + IgxGridElementsComponent, + IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, - IgxHierarchicalGridComponent, IgxPivotGridComponent, IgxRowIslandComponent, IgxColumnGroupComponent, IgxColumnLayoutComponent, - IgxGridElementsComponent, ], contentQueries: [], additionalProperties: [ @@ -117,11 +117,11 @@ export var registerConfig = [ component: IgxColumnGroupComponent, selector: "igc-column-group", parents: [ + IgxGridElementsComponent, + IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, - IgxHierarchicalGridComponent, IgxColumnGroupComponent, IgxRowIslandComponent, - IgxGridElementsComponent, ], contentQueries: [ { @@ -424,10 +424,10 @@ export var registerConfig = [ component: IgxGridStateComponent, selector: "igc-grid-state", parents: [ + IgxGridElementsComponent, IgxTreeGridComponent, - IgxHierarchicalGridComponent, + IgxHierarchicalGridElementsComponent, IgxPivotGridComponent, - IgxGridElementsComponent, ], contentQueries: [], additionalProperties: [{ name: "grid", writable: true }], @@ -458,10 +458,10 @@ export var registerConfig = [ component: IgxGridToolbarComponent, selector: "igc-grid-toolbar", parents: [ + IgxGridElementsComponent, + IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, - IgxHierarchicalGridComponent, IgxPivotGridComponent, - IgxGridElementsComponent, ], contentQueries: [ { property: "hasActions", childType: IgxGridToolbarActionsComponent }, @@ -509,10 +509,15 @@ export var registerConfig = [ methods: [], }, { - component: IgxHierarchicalGridComponent, + component: IgxHierarchicalGridElementsComponent, selector: "igc-hierarchical-grid", parents: [], contentQueries: [ + { + property: "actionStripComponents", + childType: IgxActionStripToken, + isQueryList: true, + }, { property: "childLayoutList", childType: IgxRowIslandComponent, @@ -545,9 +550,13 @@ export var registerConfig = [ }, ], additionalProperties: [ + { name: "validation" }, + { name: "gridAPI" }, + { name: "cdr" }, + { name: "navigation", writable: true }, + { name: "actionStripComponents", writable: true }, { name: "foreignKey" }, { name: "selectedCells" }, - { name: "gridAPI", writable: true }, { name: "shouldGenerate", writable: true }, { name: "rowList" }, { name: "dataRowList" }, @@ -557,9 +566,6 @@ export var registerConfig = [ { name: "lastSearchInfo" }, { name: "filteredData" }, { name: "filteredSortedData" }, - { name: "validation" }, - { name: "cdr" }, - { name: "navigation", writable: true }, { name: "virtualizationState" }, { name: "nativeElement" }, { name: "defaultRowHeight" }, @@ -681,10 +687,10 @@ export var registerConfig = [ component: IgxPaginatorComponent, selector: "igc-paginator", parents: [ + IgxGridElementsComponent, + IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, - IgxHierarchicalGridComponent, IgxPivotGridComponent, - IgxGridElementsComponent, ], contentQueries: [], additionalProperties: [ @@ -827,7 +833,11 @@ export var registerConfig = [ { component: IgxRowIslandComponent, selector: "igc-row-island", - parents: [IgxHierarchicalGridComponent, IgxRowIslandComponent], + parents: [ + IgxGridElementsComponent, + IgxHierarchicalGridElementsComponent, + IgxRowIslandComponent, + ], contentQueries: [ { property: "children", diff --git a/projects/igniteui-angular-elements/src/app/components.ts b/projects/igniteui-angular-elements/src/app/components.ts index 917425684f0..e84aa04cd9d 100644 --- a/projects/igniteui-angular-elements/src/app/components.ts +++ b/projects/igniteui-angular-elements/src/app/components.ts @@ -13,7 +13,6 @@ import { IgxGridToolbarPinningComponent, IgxGridToolbarAdvancedFilteringComponent, IgxGridToolbarTitleComponent, - IgxHierarchicalGridComponent, IgxPaginatorComponent, IgxPivotGridComponent, IgxRowIslandComponent, @@ -29,6 +28,7 @@ import { IgxGridElementsComponent } from '../lib/grids/grid.component'; import { IgxIconBroadcastService } from '../lib/icon.broadcast.service'; import { injector } from '../utils/injector-ref'; import { registerComponent } from '../utils/register'; +import { IgxHierarchicalGridElementsComponent } from '../lib/grids/hierarchical-grid.component'; // force-create icon service, TODO: move to initializer or register/define mechanic to avoid side-effect? const _iconBroadcast: IgxIconBroadcastService = injector.get(IgxIconBroadcastService); @@ -39,7 +39,7 @@ const IgcGridComponent = withRegister(grid, () => { registerComponent(IgcGridCom const treeGrid = createIgxCustomElement(IgxTreeGridComponent, { injector, registerConfig }); const IgcTreeGridComponent = withRegister(treeGrid, () => { registerComponent(IgcTreeGridComponent) }); -const hGrid = createIgxCustomElement(IgxHierarchicalGridComponent, { injector, registerConfig }); +const hGrid = createIgxCustomElement(IgxHierarchicalGridElementsComponent, { injector, registerConfig }); const IgcHierarchicalGridComponent = withRegister(hGrid, () => { registerComponent(IgcHierarchicalGridComponent) }); const pivot = createIgxCustomElement(IgxPivotGridComponent, { injector, registerConfig }); diff --git a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts index 33c7a8ee666..ce23db97f31 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts @@ -156,7 +156,6 @@ export class IgxGridElementsComponent extends IgxGridComponent { document, cdr, differs, viewRef,injector, envInjector, navigation, filteringService, textHighlightService, overlayService, summaryService, localeId1, platform, _diTransactions ); - console.log("init"); this.selectionService.selectedRowsChange.pipe(takeUntil(this.destroy$)).subscribe((args: any[]) => { this.selectedRowsChange.emit(args); }); @@ -169,7 +168,6 @@ export class IgxGridElementsComponent extends IgxGridComponent { public selectedRowsChange = new EventEmitter(); /* contentChildren */ - /* blazorInclude */ /* blazorTreatAsCollection */ /* blazorCollectionName: ActionStripCollection */ /* blazorCollectionItemName: ActionStrip */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts new file mode 100644 index 00000000000..6a37cd78a65 --- /dev/null +++ b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts @@ -0,0 +1,167 @@ + +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, CUSTOM_ELEMENTS_SCHEMA, ElementRef, EnvironmentInjector, EventEmitter, Inject, Injector, IterableDiffers, LOCALE_ID, NgZone, Optional, Output, QueryList, ViewContainerRef } from '@angular/core'; +import { IgxChildGridRowComponent, IgxHierarchicalGridComponent } from '../../../../igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component'; +import { IgxGridCRUDService } from '../../../../igniteui-angular/src/lib/grids/common/crud.service'; +import { IgxGridValidationService } from '../../../../igniteui-angular/src/lib/grids/grid/grid-validation.service'; +import { IgxGridSelectionService } from '../../../../igniteui-angular/src/lib/grids/selection/selection.service'; +import { IGX_GRID_BASE, IGX_GRID_SERVICE_BASE, IgxButtonDirective, IgxCircularProgressBarComponent, IgxFlatTransactionFactory, IgxGridForOfDirective, IgxGridHeaderRowComponent, IgxGridTransaction, IgxIconComponent, IgxOverlayOutletDirective, IgxOverlayService, IgxRippleDirective, IgxRowEditTabStopDirective, IgxSnackbarComponent, IgxTemplateOutletDirective, IgxTextHighlightService, IgxToggleDirective, State, Transaction, TransactionService } from 'igniteui-angular'; +import { IgxHierarchicalGridAPIService } from '../../../../igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid-api.service'; +import { IgxGridSummaryService } from '../../../../igniteui-angular/src/lib/grids/summaries/grid-summary.service'; +import { IgxFilteringService } from '../../../../igniteui-angular/src/lib/grids/filtering/grid-filtering.service'; +import { IgxHierarchicalGridNavigationService } from '../../../../igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid-navigation.service'; +import { IgxColumnResizingService } from '../../../../igniteui-angular/src/lib/grids/resizing/resizing.service'; +import { IgxForOfScrollSyncService, IgxForOfSyncService } from '../../../../igniteui-angular/src/lib/directives/for-of/for_of.sync.service'; +import { IgxRowIslandAPIService } from '../../../../igniteui-angular/src/lib/grids/hierarchical-grid/row-island-api.service'; +import { DOCUMENT, NgClass, NgFor, NgIf, NgStyle, NgTemplateOutlet } from '@angular/common'; +import { IgxGridBodyDirective } from '../../../../igniteui-angular/src/lib/grids/grid.common'; +import { IgxGridDragSelectDirective } from '../../../../igniteui-angular/src/lib/grids/selection/drag-select.directive'; +import { IgxColumnMovingDropDirective } from '../../../../igniteui-angular/src/lib/grids/moving/moving.drop.directive'; +import { IgxHierarchicalRowComponent } from '../../../../igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-row.component'; +import { IgxSummaryRowComponent } from '../../../../igniteui-angular/src/lib/grids/summaries/summary-row.component'; +import { IgxGridColumnResizerComponent } from '../../../../igniteui-angular/src/lib/grids/resizing/resizer.component'; +import { IgxGridFilteringPipe, IgxGridSortingPipe } from '../../../../igniteui-angular/src/lib/grids/grid/grid.pipes'; +import { IgxGridAddRowPipe, IgxGridRowClassesPipe, IgxGridRowPinningPipe, IgxGridRowStylesPipe, IgxGridTransactionPipe, IgxHasVisibleColumnsPipe, IgxStringReplacePipe } from '../../../../igniteui-angular/src/lib/grids/common/pipes'; +import { IgxSummaryDataPipe } from '../../../../igniteui-angular/src/lib/grids/summaries/grid-root-summary.pipe'; +import { IgxGridHierarchicalPagingPipe, IgxGridHierarchicalPipe } from '../../../../igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.pipes'; +import { PlatformUtil } from '../../../../igniteui-angular/src/lib/core/utils'; +import { takeUntil } from 'rxjs'; +import { IColumnsAutoGeneratedEventArgs } from './events'; +import { IgxActionStripToken } from '../../../../igniteui-angular/src/lib/action-strip/token'; + + +/* blazorAdditionalDependency: Column */ +/* blazorAdditionalDependency: ColumnGroup */ +/* blazorAdditionalDependency: ColumnLayout */ +/* blazorAdditionalDependency: GridToolbar */ +/* blazorAdditionalDependency: GridToolbarActions */ +/* blazorAdditionalDependency: GridToolbarTitle */ +/* blazorAdditionalDependency: GridToolbarAdvancedFiltering */ +/* blazorAdditionalDependency: GridToolbarExporter */ +/* blazorAdditionalDependency: GridToolbarHiding */ +/* blazorAdditionalDependency: GridToolbarPinning */ +/* blazorAdditionalDependency: ActionStrip */ +/* blazorAdditionalDependency: GridActionsBaseDirective */ +/* blazorAdditionalDependency: GridEditingActions */ +/* blazorAdditionalDependency: GridPinningActions */ +/* blazorAdditionalDependency: RowIsland */ +/* blazorIndirectRender */ +/** + * Hierarchical grid + * + * @igxModule IgxHierarchicalGridModule + * + */ +@Component({ + changeDetection: ChangeDetectionStrategy.OnPush, + selector: 'igx-hierarchical-grid', + templateUrl: '../../../../igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.html', + providers: [ + IgxGridCRUDService, + IgxGridValidationService, + IgxGridSelectionService, + { provide: IGX_GRID_SERVICE_BASE, useClass: IgxHierarchicalGridAPIService }, + { provide: IGX_GRID_BASE, useExisting: IgxHierarchicalGridElementsComponent }, + IgxGridSummaryService, + IgxFilteringService, + IgxHierarchicalGridNavigationService, + IgxColumnResizingService, + IgxForOfSyncService, + IgxForOfScrollSyncService, + IgxRowIslandAPIService + ], + imports: [ + NgIf, + NgClass, + NgFor, + NgTemplateOutlet, + NgStyle, + IgxGridHeaderRowComponent, + IgxGridBodyDirective, + IgxGridDragSelectDirective, + IgxColumnMovingDropDirective, + IgxGridForOfDirective, + IgxTemplateOutletDirective, + IgxHierarchicalRowComponent, + IgxOverlayOutletDirective, + IgxToggleDirective, + IgxCircularProgressBarComponent, + IgxSnackbarComponent, + IgxSummaryRowComponent, + IgxButtonDirective, + IgxRippleDirective, + IgxIconComponent, + IgxRowEditTabStopDirective, + IgxGridColumnResizerComponent, + IgxChildGridRowComponent, + IgxGridSortingPipe, + IgxGridFilteringPipe, + IgxGridTransactionPipe, + IgxHasVisibleColumnsPipe, + IgxGridRowPinningPipe, + IgxGridAddRowPipe, + IgxGridRowClassesPipe, + IgxGridRowStylesPipe, + IgxSummaryDataPipe, + IgxGridHierarchicalPipe, + IgxGridHierarchicalPagingPipe, + IgxStringReplacePipe + ], + schemas: [CUSTOM_ELEMENTS_SCHEMA] +}) +export class IgxHierarchicalGridElementsComponent extends IgxHierarchicalGridComponent { + + constructor( + public override readonly validation: IgxGridValidationService, + /** @hidden @internal */ + public override readonly selectionService: IgxGridSelectionService, + protected override colResizingService: IgxColumnResizingService, + @Inject(IGX_GRID_SERVICE_BASE) public override readonly gridAPI: IgxHierarchicalGridAPIService, + protected override transactionFactory: IgxFlatTransactionFactory, + private elementRef1: ElementRef, + protected override zone: NgZone, + /** @hidden @internal */ + @Inject(DOCUMENT) public override document: any, + public override readonly cdr: ChangeDetectorRef, + protected override differs: IterableDiffers, + protected override viewRef: ViewContainerRef, + protected override injector: Injector, + protected override envInjector: EnvironmentInjector, + public override navigation: IgxHierarchicalGridNavigationService, + /** @hidden @internal */ + public override filteringService: IgxFilteringService, + protected override textHighlightService: IgxTextHighlightService, + @Inject(IgxOverlayService) protected override overlayService: IgxOverlayService, + /** @hidden @internal */ + public override summaryService: IgxGridSummaryService, + @Inject(LOCALE_ID) private localeId1: string, + protected override platform: PlatformUtil, + @Optional() @Inject(IgxGridTransaction) protected override _diTransactions?: TransactionService, + ) { + super(validation, selectionService,colResizingService, gridAPI, transactionFactory, elementRef1, zone, + document, cdr, differs, viewRef,injector, envInjector, navigation, filteringService, textHighlightService, overlayService, + summaryService, localeId1, platform, _diTransactions + ); + this.selectionService.selectedRowsChange.pipe(takeUntil(this.destroy$)).subscribe((args: any[]) => { + this.selectedRowsChange.emit(args); + }); + } + + @Output() + public columnsAutogenerated = new EventEmitter(); + + @Output() + public selectedRowsChange = new EventEmitter(); + + /* contentChildren */ + /* blazorTreatAsCollection */ + /* blazorCollectionName: ActionStripCollection */ + /* blazorCollectionItemName: ActionStrip */ + /* ngQueryListName: actionStripComponents */ + @ContentChildren(IgxActionStripToken) + public actionStripComponents: QueryList; + + protected override autogenerateColumns() { + super.autogenerateColumns(); + this.columnsAutogenerated.emit({ columns: this._autoGeneratedCols }); + } +} diff --git a/projects/igniteui-angular-elements/src/lib/state.component.ts b/projects/igniteui-angular-elements/src/lib/state.component.ts index b07af14888a..33d77b20e3d 100644 --- a/projects/igniteui-angular-elements/src/lib/state.component.ts +++ b/projects/igniteui-angular-elements/src/lib/state.component.ts @@ -41,7 +41,7 @@ export interface IGridStateInfo { /* jsonAPIManageCollectionInMarkup */ /** * State component allows saving and restoring the state of the grid features. - * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, IgxGridElementsComponent, * + * @igxParent IgxGridElementsComponent, IgxTreeGridComponent, IgxHierarchicalGridElementsComponent, IgxPivotGridComponent, * */ @Component({ selector: 'igx-grid-state', diff --git a/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts b/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts index 33b363165c3..8046c45488a 100644 --- a/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts +++ b/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts @@ -58,7 +58,7 @@ export class IgxActionStripMenuItemDirective { * * @igxGroup Data Entry & Display * - * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxRowIslandComponent, IgxGridElementsComponent, * + * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxRowIslandComponent, * * * @remarks * The Ignite UI Action Strip is a container, overlaying its parent container, diff --git a/projects/igniteui-angular/src/lib/grids/columns/column-group.component.ts b/projects/igniteui-angular/src/lib/grids/columns/column-group.component.ts index 3f70debeb24..30f3ab21135 100644 --- a/projects/igniteui-angular/src/lib/grids/columns/column-group.component.ts +++ b/projects/igniteui-angular/src/lib/grids/columns/column-group.component.ts @@ -24,7 +24,7 @@ import { CellType, ColumnType, IgxColumnTemplateContext } from '../common/grid.i /** * **Ignite UI for Angular Column Group** * - * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxColumnGroupComponent, IgxRowIslandComponent, IgxGridElementsComponent + * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxColumnGroupComponent, IgxRowIslandComponent */ @Component({ changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/projects/igniteui-angular/src/lib/grids/columns/column-layout.component.ts b/projects/igniteui-angular/src/lib/grids/columns/column-layout.component.ts index d673a75cb05..0637969deb0 100644 --- a/projects/igniteui-angular/src/lib/grids/columns/column-layout.component.ts +++ b/projects/igniteui-angular/src/lib/grids/columns/column-layout.component.ts @@ -18,7 +18,7 @@ import { IgxColumnGroupComponent } from './column-group.component'; /** * Column layout for declaration of Multi-row Layout * - * @igxParent IgxGridComponent, IgxGridElementsComponent + * @igxParent IgxGridElementsComponent */ @Component({ changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/projects/igniteui-angular/src/lib/grids/columns/column.component.ts b/projects/igniteui-angular/src/lib/grids/columns/column.component.ts index 786f2b2f005..3f9851ea99e 100644 --- a/projects/igniteui-angular/src/lib/grids/columns/column.component.ts +++ b/projects/igniteui-angular/src/lib/grids/columns/column.component.ts @@ -76,7 +76,7 @@ const DEFAULT_DIGITS_INFO = '1.0-3'; * filtering & editing are enabled at the column level. You can also provide a template containing custom content inside * the column using `ng-template` which will be used for all cells within the column. * - * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, IgxRowIslandComponent, IgxColumnGroupComponent, IgxColumnLayoutComponent, IgxGridElementsComponent + * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxPivotGridComponent, IgxRowIslandComponent, IgxColumnGroupComponent, IgxColumnLayoutComponent, */ @Component({ changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/row-island.component.ts b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/row-island.component.ts index 0d97960951a..644e15d5c76 100644 --- a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/row-island.component.ts +++ b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/row-island.component.ts @@ -65,7 +65,7 @@ import { IgxPaginatorComponent } from '../../paginator/paginator.component'; * Row island * * @igxModule IgxHierarchicalGridModule - * @igxParent IgxHierarchicalGridComponent, IgxRowIslandComponent + * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxRowIslandComponent * */ @Component({ diff --git a/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar.component.ts b/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar.component.ts index ad2d3de5f41..28dc34351b4 100644 --- a/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar.component.ts +++ b/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar.component.ts @@ -31,7 +31,7 @@ import { NgIf, NgTemplateOutlet } from '@angular/common'; * Provides a context-aware container component for UI operations for the grid components. * * @igxModule IgxGridToolbarModule - * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, IgxGridElementsComponent + * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxPivotGridComponent, * */ @Component({ diff --git a/projects/igniteui-angular/src/lib/paginator/paginator.component.ts b/projects/igniteui-angular/src/lib/paginator/paginator.component.ts index 8b6a43bd088..7f186fdc8f5 100644 --- a/projects/igniteui-angular/src/lib/paginator/paginator.component.ts +++ b/projects/igniteui-angular/src/lib/paginator/paginator.component.ts @@ -38,7 +38,7 @@ export class IgxPaginatorContentDirective { /* jsonAPIManageCollectionInMarkup */ /** * Paginator component description - * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, IgxGridElementsComponent, * + * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, * */ @Component({ selector: 'igx-paginator', From f3b3821a9aacfdf0e39d77432d887da9d16e8f70 Mon Sep 17 00:00:00 2001 From: MKirova Date: Mon, 27 Jan 2025 14:58:00 +0200 Subject: [PATCH 03/28] chore(*): Move row island elements specific members to elements. --- .../src/analyzer/elements.config.ts | 165 ++++++++++++++++-- .../src/app/components.ts | 4 +- .../lib/grids/hierarchical-grid.component.ts | 22 +++ .../src/lib/grids/row-island.component.ts | 154 ++++++++++++++++ .../action-strip/action-strip.component.ts | 2 +- .../grids/columns/column-group.component.ts | 2 +- .../src/lib/grids/columns/column.component.ts | 2 +- .../hierarchical-grid/row-island.component.ts | 34 +--- 8 files changed, 329 insertions(+), 56 deletions(-) create mode 100644 projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts diff --git a/projects/igniteui-angular-elements/src/analyzer/elements.config.ts b/projects/igniteui-angular-elements/src/analyzer/elements.config.ts index 82827a02429..2ec37cdae02 100644 --- a/projects/igniteui-angular-elements/src/analyzer/elements.config.ts +++ b/projects/igniteui-angular-elements/src/analyzer/elements.config.ts @@ -24,6 +24,7 @@ import { IgxRowIslandComponent } from "../../../igniteui-angular/src/lib/grids/h import { IgxGridToolbarExporterComponent } from "../../../igniteui-angular/src/lib/grids/toolbar/grid-toolbar-exporter.component"; import { IgxGridToolbarHidingComponent } from "../../../igniteui-angular/src/lib/grids/toolbar/grid-toolbar-hiding.component"; import { IgxGridToolbarPinningComponent } from "../../../igniteui-angular/src/lib/grids/toolbar/grid-toolbar-pinning.component"; +import { IgxRowIslandElementsComponent } from "../lib/grids/row-island.component"; import { IgxGridStateComponent } from "../lib/state.component"; export const registerComponents = [ @@ -43,7 +44,7 @@ export var registerConfig = [ IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, - IgxRowIslandComponent, + IgxRowIslandElementsComponent, ], contentQueries: [ { @@ -65,7 +66,7 @@ export var registerConfig = [ IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxPivotGridComponent, - IgxRowIslandComponent, + IgxRowIslandElementsComponent, IgxColumnGroupComponent, IgxColumnLayoutComponent, ], @@ -121,7 +122,7 @@ export var registerConfig = [ IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxColumnGroupComponent, - IgxRowIslandComponent, + IgxRowIslandElementsComponent, ], contentQueries: [ { @@ -513,22 +514,22 @@ export var registerConfig = [ selector: "igc-hierarchical-grid", parents: [], contentQueries: [ - { - property: "actionStripComponents", - childType: IgxActionStripToken, - isQueryList: true, - }, { property: "childLayoutList", - childType: IgxRowIslandComponent, + childType: IgxRowIslandElementsComponent, isQueryList: true, }, { property: "allLayoutList", - childType: IgxRowIslandComponent, + childType: IgxRowIslandElementsComponent, isQueryList: true, descendants: true, }, + { + property: "actionStripComponents", + childType: IgxActionStripToken, + isQueryList: true, + }, { property: "paginatorList", childType: IgxPaginatorToken, @@ -836,22 +837,143 @@ export var registerConfig = [ parents: [ IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, - IgxRowIslandComponent, + IgxRowIslandElementsComponent, + ], + contentQueries: [], + additionalProperties: [ + { name: "rowIslandAPI", writable: true }, + { name: "gridAPI", writable: true }, + { name: "shouldGenerate", writable: true }, + { name: "rowList" }, + { name: "dataRowList" }, + { name: "transactions" }, + { name: "validation" }, + { name: "cdr" }, + { name: "navigation", writable: true }, + { name: "nativeElement" }, + { name: "defaultRowHeight" }, + { name: "defaultHeaderGroupMinWidth" }, + { name: "columns" }, + { name: "pinnedRows" }, + ], + methods: [ + "isRecordPinnedByIndex", + "toggleColumnVisibility", + "expandAll", + "collapseAll", + "expandRow", + "collapseRow", + "toggleRow", + "getHeaderGroupWidth", + "getColumnByName", + "getColumnByVisibleIndex", + "recalculateAutoSizes", + "moveColumn", + "markForCheck", + "addRow", + "deleteRow", + "updateCell", + "updateRow", + "getRowData", + "sort", + "filter", + "filterGlobal", + "enableSummaries", + "disableSummaries", + "clearFilter", + "clearSort", + "pinColumn", + "unpinColumn", + "pinRow", + "unpinRow", + "findNext", + "findPrev", + "refreshSearch", + "clearSearch", + "getPinnedWidth", + "selectRows", + "deselectRows", + "selectAllRows", + "deselectAllRows", + "clearCellSelection", + "selectRange", + "getSelectedRanges", + "getSelectedData", + "selectedColumns", + "selectColumns", + "deselectColumns", + "deselectAllColumns", + "selectAllColumns", + "getSelectedColumnsData", + "navigateTo", + "getNextCell", + "getPreviousCell", + "openAdvancedFilteringDialog", + "closeAdvancedFilteringDialog", + "endEdit", + "beginAddRowById", + "beginAddRowByIndex", + ], + templateProps: [ + "toolbarTemplate", + "paginatorTemplate", + "emptyGridTemplate", + "addRowEmptyTemplate", + "loadingGridTemplate", + "dragGhostCustomTemplate", + "rowEditTextTemplate", + "rowAddTextTemplate", + "rowEditActionsTemplate", + "rowExpandedIndicatorTemplate", + "rowCollapsedIndicatorTemplate", + "headerExpandedIndicatorTemplate", + "headerCollapsedIndicatorTemplate", + "excelStyleHeaderIconTemplate", + "sortAscendingHeaderIconTemplate", + "sortDescendingHeaderIconTemplate", + "sortHeaderIconTemplate", + "headSelectorTemplate", + "rowSelectorTemplate", + "dragIndicatorIconTemplate", + ], + numericProps: [ + "snackbarDisplayTime", + "summaryRowHeight", + "rowHeight", + "totalRecords", + ], + boolProps: [ + "expandChildren", + "showExpandAll", + "autoGenerate", + "moving", + "hideRowSelectors", + "rowDraggable", + "rowEditable", + "isLoading", + "allowFiltering", + "allowAdvancedFiltering", + "showSummaryOnCollapse", + "selectRowOnClick", + ], + }, + { + component: IgxRowIslandElementsComponent, + selector: "igc-row-island", + parents: [ + IgxGridElementsComponent, + IgxHierarchicalGridElementsComponent, + IgxRowIslandElementsComponent, ], contentQueries: [ - { - property: "children", - childType: IgxRowIslandComponent, - isQueryList: true, - }, { property: "childLayoutList", - childType: IgxRowIslandComponent, + childType: IgxRowIslandElementsComponent, isQueryList: true, }, { - property: "childColumns", - childType: IgxColumnComponent, + property: "children", + childType: IgxRowIslandElementsComponent, isQueryList: true, }, { @@ -859,6 +981,11 @@ export var registerConfig = [ childType: IgxActionStripToken, isQueryList: true, }, + { + property: "childColumns", + childType: IgxColumnComponent, + isQueryList: true, + }, { property: "columnList", childType: IgxColumnComponent, diff --git a/projects/igniteui-angular-elements/src/app/components.ts b/projects/igniteui-angular-elements/src/app/components.ts index e84aa04cd9d..5ae5627bcd4 100644 --- a/projects/igniteui-angular-elements/src/app/components.ts +++ b/projects/igniteui-angular-elements/src/app/components.ts @@ -15,7 +15,6 @@ import { IgxGridToolbarTitleComponent, IgxPaginatorComponent, IgxPivotGridComponent, - IgxRowIslandComponent, IgxTreeGridComponent, IgxPivotDataSelectorComponent } from 'igniteui-angular'; @@ -29,6 +28,7 @@ import { IgxIconBroadcastService } from '../lib/icon.broadcast.service'; import { injector } from '../utils/injector-ref'; import { registerComponent } from '../utils/register'; import { IgxHierarchicalGridElementsComponent } from '../lib/grids/hierarchical-grid.component'; +import { IgxRowIslandElementsComponent } from '../lib/grids/row-island.component'; // force-create icon service, TODO: move to initializer or register/define mechanic to avoid side-effect? const _iconBroadcast: IgxIconBroadcastService = injector.get(IgxIconBroadcastService); @@ -48,7 +48,7 @@ const IgcPivotGridComponent = withRegister(pivot, () => { registerComponent(IgcP const pivotDataSelector = createIgxCustomElement(IgxPivotDataSelectorComponent, { injector, registerConfig }); const IgcPivotDataSelectorComponent = withRegister(pivotDataSelector, () => { registerComponent(IgcPivotDataSelectorComponent) }); -const rowIsland = createIgxCustomElement(IgxRowIslandComponent, { injector, registerConfig }); +const rowIsland = createIgxCustomElement(IgxRowIslandElementsComponent, { injector, registerConfig }); const IgcRowIslandComponent = withRegister(rowIsland, () => { registerComponent(IgcRowIslandComponent) }); const columnGroup = createIgxCustomElement(IgxColumnGroupComponent, { injector, registerConfig }); diff --git a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts index 6a37cd78a65..16d2bb33c77 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts @@ -27,6 +27,7 @@ import { PlatformUtil } from '../../../../igniteui-angular/src/lib/core/utils'; import { takeUntil } from 'rxjs'; import { IColumnsAutoGeneratedEventArgs } from './events'; import { IgxActionStripToken } from '../../../../igniteui-angular/src/lib/action-strip/token'; +import { IgxRowIslandElementsComponent } from './row-island.component'; /* blazorAdditionalDependency: Column */ @@ -146,6 +147,27 @@ export class IgxHierarchicalGridElementsComponent extends IgxHierarchicalGridCom }); } + +//childLayoutList +//allLayoutList + + /* contentChildren */ + /* blazorInclude */ + /* blazorTreatAsCollection */ + /* blazorCollectionName: RowIslandCollection */ + /* ngQueryListName: childLayoutList */ + /** + * @hidden + */ + @ContentChildren(IgxRowIslandElementsComponent, { read: IgxRowIslandElementsComponent, descendants: false }) + public override childLayoutList: QueryList; + + /** + * @hidden + */ + @ContentChildren(IgxRowIslandElementsComponent, { read: IgxRowIslandElementsComponent, descendants: true }) + public override allLayoutList: QueryList; + @Output() public columnsAutogenerated = new EventEmitter(); diff --git a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts new file mode 100644 index 00000000000..f7904db5bac --- /dev/null +++ b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts @@ -0,0 +1,154 @@ +/* blazorCopyInheritedMembers */ +/* blazorElement */ +/* wcElementTag: igc-row-island */ +/* blazorIndirectRender */ +/* jsonAPIManageCollectionInMarkup */ +/* jsonAPIManageItemInMarkup */ +/* mustUseNGParentAnchor */ +/* additionalIdentifier: ChildDataKey */ +/* contentParent: RowIsland */ +/* contentParent: HierarchicalGrid */ + +import { DOCUMENT } from '@angular/common'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, ElementRef, EnvironmentInjector, EventEmitter, forwardRef, Inject, Injector, Input, IterableDiffers, LOCALE_ID, NgZone, Optional, Output, QueryList, ViewContainerRef } from '@angular/core'; +import { IGX_GRID_SERVICE_BASE, IgxFlatTransactionFactory, IgxGridTransaction, IgxOverlayService, IgxRowIslandComponent, IgxTextHighlightService, State, Transaction, TransactionService } from 'igniteui-angular'; +import { PlatformUtil } from 'igniteui-angular/src/lib/core/utils'; +import { IgxFilteringService } from 'igniteui-angular/src/lib/grids/filtering/grid-filtering.service'; +import { IgxGridValidationService } from 'igniteui-angular/src/lib/grids/grid/grid-validation.service'; +import { IgxHierarchicalGridAPIService } from 'igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid-api.service'; +import { IgxHierarchicalGridNavigationService } from 'igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid-navigation.service'; +import { IgxRowIslandAPIService } from 'igniteui-angular/src/lib/grids/hierarchical-grid/row-island-api.service'; +import { IgxColumnResizingService } from 'igniteui-angular/src/lib/grids/resizing/resizing.service'; +import { IgxGridSelectionService } from 'igniteui-angular/src/lib/grids/selection/selection.service'; +import { IgxGridSummaryService } from 'igniteui-angular/src/lib/grids/summaries/grid-summary.service'; +import { takeUntil } from 'rxjs'; +import { IColumnsAutoGeneratedEventArgs } from './events'; +import { IgxActionStripToken } from 'igniteui-angular/src/lib/action-strip/token'; + +/** + * Row island + * + * @igxModule IgxHierarchicalGridModule + * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxRowIslandElementsComponent + * + */ +@Component({ + changeDetection: ChangeDetectionStrategy.OnPush, + selector: 'igx-row-island', + template: `
+ + +
`, + providers: [ + IgxRowIslandAPIService, + IgxFilteringService, + IgxGridSelectionService + ], + standalone: true +}) +export class IgxRowIslandElementsComponent extends IgxRowIslandComponent { + + constructor( + validationService: IgxGridValidationService, + selectionService: IgxGridSelectionService, + colResizingService: IgxColumnResizingService, + @Inject(IGX_GRID_SERVICE_BASE) gridAPI: IgxHierarchicalGridAPIService, + transactionFactory: IgxFlatTransactionFactory, + elementRef: ElementRef, + zone: NgZone, + @Inject(DOCUMENT) document, + cdr: ChangeDetectorRef, + differs: IterableDiffers, + viewRef: ViewContainerRef, + injector: Injector, + envInjector: EnvironmentInjector, + navigation: IgxHierarchicalGridNavigationService, + filteringService: IgxFilteringService, + textHighlightService: IgxTextHighlightService, + @Inject(IgxOverlayService) overlayService: IgxOverlayService, + summaryService: IgxGridSummaryService, + public override rowIslandAPI: IgxRowIslandAPIService, + @Inject(LOCALE_ID) localeId: string, + platform: PlatformUtil) { + super( + validationService, + selectionService, + colResizingService, + gridAPI, + transactionFactory, + elementRef, + zone, + document, + cdr, + differs, + viewRef, + injector, + envInjector, + navigation, + filteringService, + textHighlightService, + overlayService, + summaryService, + rowIslandAPI, + localeId, + platform + ); + this.selectionService.selectedRowsChange.pipe(takeUntil(this.destroy$)).subscribe((args: any[]) => { + this.selectedRowsChange.emit(args); + }); + } + + //children + // childLayoutList + + /* contentChildren */ + /* blazorInclude */ + /* blazorTreatAsCollection */ + /* blazorCollectionName: RowIslandCollection */ + /* ngQueryListName: childLayoutList */ + /** + * @hidden + */ + @ContentChildren(IgxRowIslandElementsComponent, { read: IgxRowIslandElementsComponent, descendants: false }) + public override childLayoutList: QueryList; + + /** + * @hidden + */ + @ContentChildren(forwardRef(() => IgxRowIslandElementsComponent), { read: IgxRowIslandElementsComponent, descendants: false }) + public override children = new QueryList(); + + @Output() + public columnsAutogenerated = new EventEmitter(); + + @Output() + public selectedRowsChange = new EventEmitter(); + + // TODO(api-analyzer): Shouldn't need all tags to copy from base or hidden/internal due to include tag + /* contentChildren */ + /* blazorInclude */ + /* blazorTreatAsCollection */ + /* blazorCollectionName: ActionStripCollection */ + /* blazorCollectionItemName: ActionStrip */ + /* ngQueryListName: actionStripComponents */ + /** @hidden @internal */ + @ContentChildren(IgxActionStripToken, { read: IgxActionStripToken, descendants: false }) + protected actionStripComponents: QueryList; + + protected override autogenerateColumns() { + super.autogenerateColumns(); + this.columnsAutogenerated.emit({ columns: this._autoGeneratedCols }); + } + + /** + * Sets the key of the row island by which child data would be taken from the row data if such is provided. + */ + @Input() + public get childDataKey() { + return this.key; + } + + public set childDataKey(value: string) { + this.key = value; + } +} diff --git a/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts b/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts index 8046c45488a..390ba1ebfa5 100644 --- a/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts +++ b/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts @@ -58,7 +58,7 @@ export class IgxActionStripMenuItemDirective { * * @igxGroup Data Entry & Display * - * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxRowIslandComponent, * + * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxRowIslandElementsComponent, * * * @remarks * The Ignite UI Action Strip is a container, overlaying its parent container, diff --git a/projects/igniteui-angular/src/lib/grids/columns/column-group.component.ts b/projects/igniteui-angular/src/lib/grids/columns/column-group.component.ts index 30f3ab21135..5be2d78802f 100644 --- a/projects/igniteui-angular/src/lib/grids/columns/column-group.component.ts +++ b/projects/igniteui-angular/src/lib/grids/columns/column-group.component.ts @@ -24,7 +24,7 @@ import { CellType, ColumnType, IgxColumnTemplateContext } from '../common/grid.i /** * **Ignite UI for Angular Column Group** * - * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxColumnGroupComponent, IgxRowIslandComponent + * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxColumnGroupComponent, IgxRowIslandElementsComponent */ @Component({ changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/projects/igniteui-angular/src/lib/grids/columns/column.component.ts b/projects/igniteui-angular/src/lib/grids/columns/column.component.ts index 3f9851ea99e..4a220460449 100644 --- a/projects/igniteui-angular/src/lib/grids/columns/column.component.ts +++ b/projects/igniteui-angular/src/lib/grids/columns/column.component.ts @@ -76,7 +76,7 @@ const DEFAULT_DIGITS_INFO = '1.0-3'; * filtering & editing are enabled at the column level. You can also provide a template containing custom content inside * the column using `ng-template` which will be used for all cells within the column. * - * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxPivotGridComponent, IgxRowIslandComponent, IgxColumnGroupComponent, IgxColumnLayoutComponent, + * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxPivotGridComponent, IgxRowIslandElementsComponent, IgxColumnGroupComponent, IgxColumnLayoutComponent, */ @Component({ changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/row-island.component.ts b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/row-island.component.ts index 644e15d5c76..dce63544bdc 100644 --- a/projects/igniteui-angular/src/lib/grids/hierarchical-grid/row-island.component.ts +++ b/projects/igniteui-angular/src/lib/grids/hierarchical-grid/row-island.component.ts @@ -65,18 +65,13 @@ import { IgxPaginatorComponent } from '../../paginator/paginator.component'; * Row island * * @igxModule IgxHierarchicalGridModule - * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxRowIslandComponent + * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxRowIslandElementsComponent * */ @Component({ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'igx-row-island', - template: `@if (platform.isElements) { -
- - -
- }`, + template: ``, providers: [ IgxRowIslandAPIService, IgxFilteringService, @@ -103,20 +98,6 @@ export class IgxRowIslandComponent extends IgxHierarchicalGridBaseDirective @Input() public key: string; - /* blazorInclude,wcInclude TODO: Move to Elements-only component */ - /** - * Sets the key of the row island by which child data would be taken from the row data if such is provided. - * @hidden @internal - */ - @Input() - public get childDataKey() { - return this.key; - } - /* blazorInclude,wcInclude */ - public set childDataKey(value: string) { - this.key = value; - } - /** * @hidden */ @@ -172,17 +153,6 @@ export class IgxRowIslandComponent extends IgxHierarchicalGridBaseDirective this._paginatorTemplate = template; } - // TODO(api-analyzer): Shouldn't need all tags to copy from base or hidden/internal due to include tag - /* contentChildren */ - /* blazorInclude */ - /* blazorTreatAsCollection */ - /* blazorCollectionName: ActionStripCollection */ - /* blazorCollectionItemName: ActionStrip */ - /* ngQueryListName: actionStripComponents */ - /** @hidden @internal */ - @ContentChildren(IgxActionStripToken, { read: IgxActionStripToken, descendants: false }) - protected actionStripComponents: QueryList; - /** * @hidden */ From 45df002b7b1e24db82eced2ea623b604e22926fe Mon Sep 17 00:00:00 2001 From: MKirova Date: Mon, 27 Jan 2025 16:22:34 +0200 Subject: [PATCH 04/28] chore(*): Extract tree grid elements members into elements. --- .../src/analyzer/config.template.ts | 6 +- .../src/analyzer/elements.config.ts | 26 ++- .../src/app/components.ts | 6 +- .../lib/grids/hierarchical-grid.component.ts | 8 - .../src/lib/grids/row-island.component.ts | 9 - .../src/lib/grids/tree-grid.component.ts | 192 ++++++++++++++++++ .../src/lib/state.component.ts | 2 +- .../action-strip/action-strip.component.ts | 2 +- .../grids/columns/column-group.component.ts | 2 +- .../src/lib/grids/columns/column.component.ts | 2 +- .../grids/toolbar/grid-toolbar.component.ts | 2 +- .../src/lib/paginator/paginator.component.ts | 2 +- 12 files changed, 221 insertions(+), 38 deletions(-) create mode 100644 projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts diff --git a/projects/igniteui-angular-elements/src/analyzer/config.template.ts b/projects/igniteui-angular-elements/src/analyzer/config.template.ts index 23491aa4572..f0130422677 100644 --- a/projects/igniteui-angular-elements/src/analyzer/config.template.ts +++ b/projects/igniteui-angular-elements/src/analyzer/config.template.ts @@ -1,15 +1,15 @@ import { IgxPivotDataSelectorComponent, - IgxPivotGridComponent, - IgxTreeGridComponent + IgxPivotGridComponent } from '../../../igniteui-angular/src/public_api'; import { IgxGridElementsComponent } from '../lib/grids/grid.component'; import { IgxHierarchicalGridElementsComponent } from '../lib/grids/hierarchical-grid.component'; +import { IgxTreeGridElementsComponent } from '../lib/grids/tree-grid.component'; export const registerComponents = [ IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, - IgxTreeGridComponent, + IgxTreeGridElementsComponent, IgxPivotGridComponent, IgxPivotDataSelectorComponent ]; diff --git a/projects/igniteui-angular-elements/src/analyzer/elements.config.ts b/projects/igniteui-angular-elements/src/analyzer/elements.config.ts index 2ec37cdae02..9003a81632b 100644 --- a/projects/igniteui-angular-elements/src/analyzer/elements.config.ts +++ b/projects/igniteui-angular-elements/src/analyzer/elements.config.ts @@ -1,10 +1,10 @@ import { IgxPivotDataSelectorComponent, IgxPivotGridComponent, - IgxTreeGridComponent, } from "../../../igniteui-angular/src/public_api"; import { IgxGridElementsComponent } from "../lib/grids/grid.component"; import { IgxHierarchicalGridElementsComponent } from "../lib/grids/hierarchical-grid.component"; +import { IgxTreeGridElementsComponent } from "../lib/grids/tree-grid.component"; import { IgxPaginatorComponent } from "../../../igniteui-angular/src/lib/paginator/paginator.component"; import { IgxPaginatorToken } from "../../../igniteui-angular/src/lib/paginator/token"; import { IgxActionStripComponent } from "../../../igniteui-angular/src/lib/action-strip/action-strip.component"; @@ -30,7 +30,7 @@ import { IgxGridStateComponent } from "../lib/state.component"; export const registerComponents = [ IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, - IgxTreeGridComponent, + IgxTreeGridElementsComponent, IgxPivotGridComponent, IgxPivotDataSelectorComponent, ]; @@ -43,7 +43,7 @@ export var registerConfig = [ parents: [ IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, - IgxTreeGridComponent, + IgxTreeGridElementsComponent, IgxRowIslandElementsComponent, ], contentQueries: [ @@ -64,7 +64,7 @@ export var registerConfig = [ parents: [ IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, - IgxTreeGridComponent, + IgxTreeGridElementsComponent, IgxPivotGridComponent, IgxRowIslandElementsComponent, IgxColumnGroupComponent, @@ -120,7 +120,7 @@ export var registerConfig = [ parents: [ IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, - IgxTreeGridComponent, + IgxTreeGridElementsComponent, IgxColumnGroupComponent, IgxRowIslandElementsComponent, ], @@ -426,7 +426,7 @@ export var registerConfig = [ selector: "igc-grid-state", parents: [ IgxGridElementsComponent, - IgxTreeGridComponent, + IgxTreeGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxPivotGridComponent, ], @@ -461,7 +461,7 @@ export var registerConfig = [ parents: [ IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, - IgxTreeGridComponent, + IgxTreeGridElementsComponent, IgxPivotGridComponent, ], contentQueries: [ @@ -555,6 +555,7 @@ export var registerConfig = [ { name: "gridAPI" }, { name: "cdr" }, { name: "navigation", writable: true }, + { name: "childLayoutList", writable: true }, { name: "actionStripComponents", writable: true }, { name: "foreignKey" }, { name: "selectedCells" }, @@ -690,7 +691,7 @@ export var registerConfig = [ parents: [ IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, - IgxTreeGridComponent, + IgxTreeGridElementsComponent, IgxPivotGridComponent, ], contentQueries: [], @@ -996,6 +997,7 @@ export var registerConfig = [ ], additionalProperties: [ { name: "rowIslandAPI", writable: true }, + { name: "childLayoutList", writable: true }, { name: "gridAPI", writable: true }, { name: "shouldGenerate", writable: true }, { name: "rowList" }, @@ -1112,10 +1114,15 @@ export var registerConfig = [ ], }, { - component: IgxTreeGridComponent, + component: IgxTreeGridElementsComponent, selector: "igc-tree-grid", parents: [], contentQueries: [ + { + property: "actionStripComponents", + childType: IgxActionStripToken, + isQueryList: true, + }, { property: "columnList", childType: IgxColumnComponent, @@ -1131,6 +1138,7 @@ export var registerConfig = [ }, ], additionalProperties: [ + { name: "actionStripComponents", writable: true }, { name: "rootRecords", writable: true }, { name: "records", writable: true }, { name: "processedRootRecords", writable: true }, diff --git a/projects/igniteui-angular-elements/src/app/components.ts b/projects/igniteui-angular-elements/src/app/components.ts index 5ae5627bcd4..03fa40e598e 100644 --- a/projects/igniteui-angular-elements/src/app/components.ts +++ b/projects/igniteui-angular-elements/src/app/components.ts @@ -15,7 +15,6 @@ import { IgxGridToolbarTitleComponent, IgxPaginatorComponent, IgxPivotGridComponent, - IgxTreeGridComponent, IgxPivotDataSelectorComponent } from 'igniteui-angular'; import { GridType } from 'projects/igniteui-angular/src/lib/grids/common/grid.interface'; @@ -29,6 +28,7 @@ import { injector } from '../utils/injector-ref'; import { registerComponent } from '../utils/register'; import { IgxHierarchicalGridElementsComponent } from '../lib/grids/hierarchical-grid.component'; import { IgxRowIslandElementsComponent } from '../lib/grids/row-island.component'; +import { IgxTreeGridElementsComponent } from '../lib/grids/tree-grid.component'; // force-create icon service, TODO: move to initializer or register/define mechanic to avoid side-effect? const _iconBroadcast: IgxIconBroadcastService = injector.get(IgxIconBroadcastService); @@ -36,7 +36,7 @@ const _iconBroadcast: IgxIconBroadcastService = injector.get(IgxIconBroadcastSer const grid = createIgxCustomElement(IgxGridElementsComponent, { injector, registerConfig }); const IgcGridComponent = withRegister(grid, () => { registerComponent(IgcGridComponent) }); -const treeGrid = createIgxCustomElement(IgxTreeGridComponent, { injector, registerConfig }); +const treeGrid = createIgxCustomElement(IgxTreeGridElementsComponent, { injector, registerConfig }); const IgcTreeGridComponent = withRegister(treeGrid, () => { registerComponent(IgcTreeGridComponent) }); const hGrid = createIgxCustomElement(IgxHierarchicalGridElementsComponent, { injector, registerConfig }); @@ -122,7 +122,7 @@ export { // TODO: Custom elements JSON as well declare global { type IgxGridElement = NgElement & WithProperties; - type IgxTreeGridElement = NgElement & WithProperties; + type IgxTreeGridElement = NgElement & WithProperties; interface HTMLElementTagNameMap { 'igc-grid': NgElement & WithProperties; 'igc-tree-grid': NgElement & WithProperties; diff --git a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts index 16d2bb33c77..9f5a3cfdd72 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts @@ -147,18 +147,10 @@ export class IgxHierarchicalGridElementsComponent extends IgxHierarchicalGridCom }); } - -//childLayoutList -//allLayoutList - /* contentChildren */ - /* blazorInclude */ /* blazorTreatAsCollection */ /* blazorCollectionName: RowIslandCollection */ /* ngQueryListName: childLayoutList */ - /** - * @hidden - */ @ContentChildren(IgxRowIslandElementsComponent, { read: IgxRowIslandElementsComponent, descendants: false }) public override childLayoutList: QueryList; diff --git a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts index f7904db5bac..136495537e5 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts @@ -98,17 +98,10 @@ export class IgxRowIslandElementsComponent extends IgxRowIslandComponent { }); } - //children - // childLayoutList - /* contentChildren */ - /* blazorInclude */ /* blazorTreatAsCollection */ /* blazorCollectionName: RowIslandCollection */ /* ngQueryListName: childLayoutList */ - /** - * @hidden - */ @ContentChildren(IgxRowIslandElementsComponent, { read: IgxRowIslandElementsComponent, descendants: false }) public override childLayoutList: QueryList; @@ -126,12 +119,10 @@ export class IgxRowIslandElementsComponent extends IgxRowIslandComponent { // TODO(api-analyzer): Shouldn't need all tags to copy from base or hidden/internal due to include tag /* contentChildren */ - /* blazorInclude */ /* blazorTreatAsCollection */ /* blazorCollectionName: ActionStripCollection */ /* blazorCollectionItemName: ActionStrip */ /* ngQueryListName: actionStripComponents */ - /** @hidden @internal */ @ContentChildren(IgxActionStripToken, { read: IgxActionStripToken, descendants: false }) protected actionStripComponents: QueryList; diff --git a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts new file mode 100644 index 00000000000..8b99c2fe7ae --- /dev/null +++ b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts @@ -0,0 +1,192 @@ +import { DOCUMENT, NgClass, NgFor, NgIf, NgStyle, NgTemplateOutlet } from '@angular/common'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, CUSTOM_ELEMENTS_SCHEMA, ElementRef, EnvironmentInjector, EventEmitter, Inject, Injector, IterableDiffers, LOCALE_ID, NgZone, Optional, Output, QueryList, ViewContainerRef } from '@angular/core'; +import { GridServiceType, HierarchicalState, HierarchicalTransaction, HierarchicalTransactionService, IGX_GRID_BASE, IGX_GRID_SERVICE_BASE, IgxButtonDirective, IgxCircularProgressBarComponent, IgxGridForOfDirective, IgxGridHeaderRowComponent, IgxGridTransaction, IgxHierarchicalTransactionFactory, IgxIconComponent, IgxOverlayOutletDirective, IgxOverlayService, IgxRippleDirective, IgxRowEditTabStopDirective, IgxSnackbarComponent, IgxTemplateOutletDirective, IgxTextHighlightService, IgxToggleDirective, IgxTreeGridComponent } from 'igniteui-angular'; +import { PlatformUtil } from 'igniteui-angular/src/lib/core/utils'; +import { IgxForOfScrollSyncService, IgxForOfSyncService } from 'igniteui-angular/src/lib/directives/for-of/for_of.sync.service'; +import { IgxGridCRUDService } from 'igniteui-angular/src/lib/grids/common/crud.service'; +import { IgxGridRowClassesPipe, IgxGridRowPinningPipe, IgxGridRowStylesPipe, IgxHasVisibleColumnsPipe, IgxStringReplacePipe } from 'igniteui-angular/src/lib/grids/common/pipes'; +import { IgxFilteringService } from 'igniteui-angular/src/lib/grids/filtering/grid-filtering.service'; +import { IgxGridNavigationService } from 'igniteui-angular/src/lib/grids/grid-navigation.service'; +import { IgxGridBodyDirective } from 'igniteui-angular/src/lib/grids/grid.common'; +import { IgxGridValidationService } from 'igniteui-angular/src/lib/grids/grid/grid-validation.service'; +import { IgxColumnMovingDropDirective } from 'igniteui-angular/src/lib/grids/moving/moving.drop.directive'; +import { IgxGridColumnResizerComponent } from 'igniteui-angular/src/lib/grids/resizing/resizer.component'; +import { IgxColumnResizingService } from 'igniteui-angular/src/lib/grids/resizing/resizing.service'; +import { IgxGridDragSelectDirective } from 'igniteui-angular/src/lib/grids/selection/drag-select.directive'; +import { IgxGridSelectionService } from 'igniteui-angular/src/lib/grids/selection/selection.service'; +import { IgxSummaryDataPipe } from 'igniteui-angular/src/lib/grids/summaries/grid-root-summary.pipe'; +import { IgxGridSummaryService } from 'igniteui-angular/src/lib/grids/summaries/grid-summary.service'; +import { IgxSummaryRowComponent } from 'igniteui-angular/src/lib/grids/summaries/summary-row.component'; +import { IgxTreeGridAPIService } from 'igniteui-angular/src/lib/grids/tree-grid/tree-grid-api.service'; +import { IgxTreeGridRowComponent } from 'igniteui-angular/src/lib/grids/tree-grid/tree-grid-row.component'; +import { IgxTreeGridSelectionService } from 'igniteui-angular/src/lib/grids/tree-grid/tree-grid-selection.service'; +import { IgxTreeGridFilteringPipe } from 'igniteui-angular/src/lib/grids/tree-grid/tree-grid.filtering.pipe'; +import { IgxTreeGridAddRowPipe, IgxTreeGridFlatteningPipe, IgxTreeGridHierarchizingPipe, IgxTreeGridNormalizeRecordsPipe, IgxTreeGridPagingPipe, IgxTreeGridSortingPipe, IgxTreeGridTransactionPipe } from 'igniteui-angular/src/lib/grids/tree-grid/tree-grid.pipes'; +import { IgxTreeGridSummaryPipe } from 'igniteui-angular/src/lib/grids/tree-grid/tree-grid.summary.pipe'; +import { takeUntil } from 'rxjs'; +import { IColumnsAutoGeneratedEventArgs } from './events'; +import { IgxActionStripToken } from 'igniteui-angular/src/lib/action-strip/token'; + + +/* blazorAdditionalDependency: Column */ +/* blazorAdditionalDependency: ColumnGroup */ +/* blazorAdditionalDependency: ColumnLayout */ +/* blazorAdditionalDependency: GridToolbar */ +/* blazorAdditionalDependency: GridToolbarActions */ +/* blazorAdditionalDependency: GridToolbarTitle */ +/* blazorAdditionalDependency: GridToolbarAdvancedFiltering */ +/* blazorAdditionalDependency: GridToolbarExporter */ +/* blazorAdditionalDependency: GridToolbarHiding */ +/* blazorAdditionalDependency: GridToolbarPinning */ +/* blazorAdditionalDependency: ActionStrip */ +/* blazorAdditionalDependency: GridActionsBaseDirective */ +/* blazorAdditionalDependency: GridEditingActions */ +/* blazorAdditionalDependency: GridPinningActions */ +/* blazorIndirectRender */ +/** + * **Ignite UI for Angular Tree Grid** - + * [Documentation](https://www.infragistics.com/products/ignite-ui-angular/angular/components/grid/grid) + * + * The Ignite UI Tree Grid displays and manipulates hierarchical data with consistent schema formatted as a table and + * provides features such as sorting, filtering, editing, column pinning, paging, column moving and hiding. + * + * Example: + * ```html + * + * + * + * + * + * ``` + */ +@Component({ + changeDetection: ChangeDetectionStrategy.OnPush, + selector: 'igx-tree-grid', + templateUrl: '../../../../igniteui-angular/src/lib/grids/tree-grid/tree-grid.component.html', + providers: [ + IgxGridCRUDService, + IgxGridValidationService, + IgxGridSummaryService, + IgxGridNavigationService, + { provide: IgxGridSelectionService, useClass: IgxTreeGridSelectionService }, + { provide: IGX_GRID_SERVICE_BASE, useClass: IgxTreeGridAPIService }, + { provide: IGX_GRID_BASE, useExisting: IgxTreeGridElementsComponent }, + IgxFilteringService, + IgxColumnResizingService, + IgxForOfSyncService, + IgxForOfScrollSyncService + ], + imports: [ + NgIf, + NgFor, + NgClass, + NgStyle, + NgTemplateOutlet, + IgxGridHeaderRowComponent, + IgxGridBodyDirective, + IgxGridDragSelectDirective, + IgxColumnMovingDropDirective, + IgxGridForOfDirective, + IgxTemplateOutletDirective, + IgxTreeGridRowComponent, + IgxSummaryRowComponent, + IgxOverlayOutletDirective, + IgxToggleDirective, + IgxCircularProgressBarComponent, + IgxSnackbarComponent, + IgxButtonDirective, + IgxRippleDirective, + IgxRowEditTabStopDirective, + IgxIconComponent, + IgxGridColumnResizerComponent, + IgxHasVisibleColumnsPipe, + IgxGridRowPinningPipe, + IgxGridRowClassesPipe, + IgxGridRowStylesPipe, + IgxSummaryDataPipe, + IgxTreeGridHierarchizingPipe, + IgxTreeGridFlatteningPipe, + IgxTreeGridSortingPipe, + IgxTreeGridFilteringPipe, + IgxTreeGridPagingPipe, + IgxTreeGridTransactionPipe, + IgxTreeGridSummaryPipe, + IgxTreeGridNormalizeRecordsPipe, + IgxTreeGridAddRowPipe, + IgxStringReplacePipe + ], + schemas: [CUSTOM_ELEMENTS_SCHEMA] +}) +export class IgxTreeGridElementsComponent extends IgxTreeGridComponent { + constructor( + validationService: IgxGridValidationService, + selectionService: IgxGridSelectionService, + colResizingService: IgxColumnResizingService, + @Inject(IGX_GRID_SERVICE_BASE) gridAPI: GridServiceType, + // public gridAPI: GridBaseAPIService, + transactionFactory: IgxHierarchicalTransactionFactory, + _elementRef: ElementRef, + _zone: NgZone, + @Inject(DOCUMENT) document: any, + cdr: ChangeDetectorRef, + differs: IterableDiffers, + viewRef: ViewContainerRef, + injector: Injector, + envInjector: EnvironmentInjector, + navigation: IgxGridNavigationService, + filteringService: IgxFilteringService, + textHighlightService: IgxTextHighlightService, + @Inject(IgxOverlayService) overlayService: IgxOverlayService, + summaryService: IgxGridSummaryService, + @Inject(LOCALE_ID) localeId: string, + platform: PlatformUtil, + @Optional() @Inject(IgxGridTransaction) protected override _diTransactions?: + HierarchicalTransactionService, + ) { + super( + validationService, + selectionService, + colResizingService, + gridAPI, + transactionFactory, + _elementRef, + _zone, + document, + cdr, + differs, + viewRef, + injector, + envInjector, + navigation, + filteringService, + textHighlightService, + overlayService, + summaryService, + localeId, + platform, + _diTransactions, + ); + this.selectionService.selectedRowsChange.pipe(takeUntil(this.destroy$)).subscribe((args: any[]) => { + this.selectedRowsChange.emit(args); + }); + } + + @Output() + public columnsAutogenerated = new EventEmitter(); + + @Output() + public selectedRowsChange = new EventEmitter(); + + /* contentChildren */ + /* blazorTreatAsCollection */ + /* blazorCollectionName: ActionStripCollection */ + /* blazorCollectionItemName: ActionStrip */ + /* ngQueryListName: actionStripComponents */ + @ContentChildren(IgxActionStripToken) + public actionStripComponents: QueryList; + + protected override autogenerateColumns() { + super.autogenerateColumns(); + this.columnsAutogenerated.emit({ columns: this._autoGeneratedCols }); + } +} diff --git a/projects/igniteui-angular-elements/src/lib/state.component.ts b/projects/igniteui-angular-elements/src/lib/state.component.ts index 33d77b20e3d..f1866071eaf 100644 --- a/projects/igniteui-angular-elements/src/lib/state.component.ts +++ b/projects/igniteui-angular-elements/src/lib/state.component.ts @@ -41,7 +41,7 @@ export interface IGridStateInfo { /* jsonAPIManageCollectionInMarkup */ /** * State component allows saving and restoring the state of the grid features. - * @igxParent IgxGridElementsComponent, IgxTreeGridComponent, IgxHierarchicalGridElementsComponent, IgxPivotGridComponent, * + * @igxParent IgxGridElementsComponent, IgxTreeGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxPivotGridComponent, * */ @Component({ selector: 'igx-grid-state', diff --git a/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts b/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts index 390ba1ebfa5..db75e2346db 100644 --- a/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts +++ b/projects/igniteui-angular/src/lib/action-strip/action-strip.component.ts @@ -58,7 +58,7 @@ export class IgxActionStripMenuItemDirective { * * @igxGroup Data Entry & Display * - * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxRowIslandElementsComponent, * + * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridElementsComponent, IgxRowIslandElementsComponent, * * * @remarks * The Ignite UI Action Strip is a container, overlaying its parent container, diff --git a/projects/igniteui-angular/src/lib/grids/columns/column-group.component.ts b/projects/igniteui-angular/src/lib/grids/columns/column-group.component.ts index 5be2d78802f..d4f08d3a3cb 100644 --- a/projects/igniteui-angular/src/lib/grids/columns/column-group.component.ts +++ b/projects/igniteui-angular/src/lib/grids/columns/column-group.component.ts @@ -24,7 +24,7 @@ import { CellType, ColumnType, IgxColumnTemplateContext } from '../common/grid.i /** * **Ignite UI for Angular Column Group** * - * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxColumnGroupComponent, IgxRowIslandElementsComponent + * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridElementsComponent, IgxColumnGroupComponent, IgxRowIslandElementsComponent */ @Component({ changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/projects/igniteui-angular/src/lib/grids/columns/column.component.ts b/projects/igniteui-angular/src/lib/grids/columns/column.component.ts index 4a220460449..c522fb343cd 100644 --- a/projects/igniteui-angular/src/lib/grids/columns/column.component.ts +++ b/projects/igniteui-angular/src/lib/grids/columns/column.component.ts @@ -76,7 +76,7 @@ const DEFAULT_DIGITS_INFO = '1.0-3'; * filtering & editing are enabled at the column level. You can also provide a template containing custom content inside * the column using `ng-template` which will be used for all cells within the column. * - * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxPivotGridComponent, IgxRowIslandElementsComponent, IgxColumnGroupComponent, IgxColumnLayoutComponent, + * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridElementsComponent, IgxPivotGridComponent, IgxRowIslandElementsComponent, IgxColumnGroupComponent, IgxColumnLayoutComponent, */ @Component({ changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar.component.ts b/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar.component.ts index 28dc34351b4..7dcfc8fc5c9 100644 --- a/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar.component.ts +++ b/projects/igniteui-angular/src/lib/grids/toolbar/grid-toolbar.component.ts @@ -31,7 +31,7 @@ import { NgIf, NgTemplateOutlet } from '@angular/common'; * Provides a context-aware container component for UI operations for the grid components. * * @igxModule IgxGridToolbarModule - * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxPivotGridComponent, + * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridElementsComponent, IgxPivotGridComponent, * */ @Component({ diff --git a/projects/igniteui-angular/src/lib/paginator/paginator.component.ts b/projects/igniteui-angular/src/lib/paginator/paginator.component.ts index 7f186fdc8f5..21a6095123b 100644 --- a/projects/igniteui-angular/src/lib/paginator/paginator.component.ts +++ b/projects/igniteui-angular/src/lib/paginator/paginator.component.ts @@ -38,7 +38,7 @@ export class IgxPaginatorContentDirective { /* jsonAPIManageCollectionInMarkup */ /** * Paginator component description - * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, * + * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridElementsComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, * */ @Component({ selector: 'igx-paginator', From dd534120e7757b3a8509d0c4fc6eefe0f9860c4d Mon Sep 17 00:00:00 2001 From: MKirova Date: Tue, 17 Jun 2025 11:26:50 +0300 Subject: [PATCH 05/28] chore(*): Bring back selectedRowsChange in base since it has become public. --- .../src/lib/grids/grid.component.ts | 6 ------ .../src/lib/grids/row-island.component.ts | 6 ------ .../src/lib/grids/tree-grid.component.ts | 6 ------ .../igniteui-angular/src/lib/grids/grid-base.directive.ts | 3 +++ 4 files changed, 3 insertions(+), 18 deletions(-) diff --git a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts index ce23db97f31..d6191ec8ea6 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts @@ -156,17 +156,11 @@ export class IgxGridElementsComponent extends IgxGridComponent { document, cdr, differs, viewRef,injector, envInjector, navigation, filteringService, textHighlightService, overlayService, summaryService, localeId1, platform, _diTransactions ); - this.selectionService.selectedRowsChange.pipe(takeUntil(this.destroy$)).subscribe((args: any[]) => { - this.selectedRowsChange.emit(args); - }); } @Output() public columnsAutogenerated = new EventEmitter(); - @Output() - public selectedRowsChange = new EventEmitter(); - /* contentChildren */ /* blazorTreatAsCollection */ /* blazorCollectionName: ActionStripCollection */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts index 136495537e5..1cd4d104fc3 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts @@ -93,9 +93,6 @@ export class IgxRowIslandElementsComponent extends IgxRowIslandComponent { localeId, platform ); - this.selectionService.selectedRowsChange.pipe(takeUntil(this.destroy$)).subscribe((args: any[]) => { - this.selectedRowsChange.emit(args); - }); } /* contentChildren */ @@ -114,9 +111,6 @@ export class IgxRowIslandElementsComponent extends IgxRowIslandComponent { @Output() public columnsAutogenerated = new EventEmitter(); - @Output() - public selectedRowsChange = new EventEmitter(); - // TODO(api-analyzer): Shouldn't need all tags to copy from base or hidden/internal due to include tag /* contentChildren */ /* blazorTreatAsCollection */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts index 8b99c2fe7ae..3ad08c93d48 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts @@ -166,17 +166,11 @@ export class IgxTreeGridElementsComponent extends IgxTreeGridComponent { platform, _diTransactions, ); - this.selectionService.selectedRowsChange.pipe(takeUntil(this.destroy$)).subscribe((args: any[]) => { - this.selectedRowsChange.emit(args); - }); } @Output() public columnsAutogenerated = new EventEmitter(); - @Output() - public selectedRowsChange = new EventEmitter(); - /* contentChildren */ /* blazorTreatAsCollection */ /* blazorCollectionName: ActionStripCollection */ diff --git a/projects/igniteui-angular/src/lib/grids/grid-base.directive.ts b/projects/igniteui-angular/src/lib/grids/grid-base.directive.ts index b78ed84aeee..e6793699cde 100644 --- a/projects/igniteui-angular/src/lib/grids/grid-base.directive.ts +++ b/projects/igniteui-angular/src/lib/grids/grid-base.directive.ts @@ -3456,6 +3456,9 @@ export abstract class IgxGridBaseDirective implements GridType, this._transactions = this.transactionFactory.create(TRANSACTION_TYPE.None); this._transactions.cloneStrategy = this.dataCloneStrategy; this.cdr.detach(); + this.selectionService.selectedRowsChange.pipe(takeUntil(this.destroy$)).subscribe((args: any[]) => { + this.selectedRowsChange.emit(args); + }); IgcTrialWatermark.register(); } From cbad25d9ee519b3244d6a399edd6dcadd40a168c Mon Sep 17 00:00:00 2001 From: MKirova Date: Tue, 17 Jun 2025 14:12:23 +0300 Subject: [PATCH 06/28] chore(*): Fix build errors. --- .../src/lib/grids/grid.component.ts | 2 -- .../src/lib/grids/hierarchical-grid.component.ts | 5 ----- .../src/lib/grids/tree-grid.component.ts | 2 -- 3 files changed, 9 deletions(-) diff --git a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts index d6191ec8ea6..1b5f5f726bd 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts @@ -80,9 +80,7 @@ import { IgxGridDetailsPipe } from '../../../../igniteui-angular/src/lib/grids/g IgxForOfScrollSyncService, ], imports: [ - NgIf, NgClass, - NgFor, NgStyle, NgTemplateOutlet, IgxGridGroupByAreaComponent, diff --git a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts index 9f5a3cfdd72..1df4b1e6746 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts @@ -71,9 +71,7 @@ import { IgxRowIslandElementsComponent } from './row-island.component'; IgxRowIslandAPIService ], imports: [ - NgIf, NgClass, - NgFor, NgTemplateOutlet, NgStyle, IgxGridHeaderRowComponent, @@ -163,9 +161,6 @@ export class IgxHierarchicalGridElementsComponent extends IgxHierarchicalGridCom @Output() public columnsAutogenerated = new EventEmitter(); - @Output() - public selectedRowsChange = new EventEmitter(); - /* contentChildren */ /* blazorTreatAsCollection */ /* blazorCollectionName: ActionStripCollection */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts index 3ad08c93d48..475bce0a428 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts @@ -77,8 +77,6 @@ import { IgxActionStripToken } from 'igniteui-angular/src/lib/action-strip/token IgxForOfScrollSyncService ], imports: [ - NgIf, - NgFor, NgClass, NgStyle, NgTemplateOutlet, From d647b843bbbb10cf831cf20fa20cfeab4e7f81db Mon Sep 17 00:00:00 2001 From: MKirova Date: Mon, 30 Mar 2026 14:01:42 +0300 Subject: [PATCH 07/28] chore(*): Fix imports after merge. --- package-lock.json | 29 ++- .../src/analyzer/elements.config.ts | 5 +- .../src/lib/grids/events.ts | 4 +- .../src/lib/grids/grid.component.ts | 185 ++++++++---------- .../lib/grids/hierarchical-grid.component.ts | 100 ++++------ .../src/lib/grids/row-island.component.ts | 67 +------ .../src/lib/grids/tree-grid.component.ts | 124 +++++------- 7 files changed, 204 insertions(+), 310 deletions(-) diff --git a/package-lock.json b/package-lock.json index a10091cc2fe..4a185a2e398 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4726,6 +4726,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -4746,6 +4747,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -4766,6 +4768,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -4786,6 +4789,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -4806,6 +4810,7 @@ "cpu": [ "arm" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -4826,6 +4831,7 @@ "cpu": [ "arm" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -4846,6 +4852,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -4866,6 +4873,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -4886,6 +4894,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -4906,6 +4915,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -4926,6 +4936,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -4946,6 +4957,7 @@ "cpu": [ "ia32" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -4966,6 +4978,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -22409,8 +22422,10 @@ "version": "3.6.0", "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz", "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==", - "extraneous": true, + "dev": true, "license": "MIT", + "optional": true, + "peer": true, "dependencies": { "anymatch": "~3.1.2", "braces": "~3.0.2", @@ -22462,8 +22477,10 @@ "version": "5.1.2", "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", - "extraneous": true, + "dev": true, "license": "ISC", + "optional": true, + "peer": true, "dependencies": { "is-glob": "^4.0.1" }, @@ -22511,8 +22528,10 @@ "version": "2.3.2", "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.2.tgz", "integrity": "sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA==", - "extraneous": true, + "dev": true, "license": "MIT", + "optional": true, + "peer": true, "engines": { "node": ">=8.6" }, @@ -22524,8 +22543,10 @@ "version": "3.6.0", "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz", "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==", - "extraneous": true, + "dev": true, "license": "MIT", + "optional": true, + "peer": true, "dependencies": { "picomatch": "^2.2.1" }, diff --git a/projects/igniteui-angular-elements/src/analyzer/elements.config.ts b/projects/igniteui-angular-elements/src/analyzer/elements.config.ts index 98e12619ee3..0767fc8273e 100644 --- a/projects/igniteui-angular-elements/src/analyzer/elements.config.ts +++ b/projects/igniteui-angular-elements/src/analyzer/elements.config.ts @@ -1,11 +1,8 @@ import { IgxQueryBuilderComponent } from "../../../igniteui-angular/query-builder"; -import { IgxGridComponent } from "../../../igniteui-angular/grids/grid"; -import { IgxHierarchicalGridComponent } from "../../../igniteui-angular/grids/hierarchical-grid"; import { IgxPivotDataSelectorComponent, IgxPivotGridComponent, } from "../../../igniteui-angular/grids/pivot-grid"; -import { IgxTreeGridComponent } from "../../../igniteui-angular/grids/tree-grid"; import { IgxActionStripComponent } from "../../../igniteui-angular/action-strip/src/action-strip/action-strip.component"; import { IgxActionStripToken } from "../../../igniteui-angular/core/src/grid-column-actions/token"; import { IgxPaginatorComponent } from "../../../igniteui-angular/paginator/src/paginator/paginator.component"; @@ -30,6 +27,8 @@ import { IgxGridStateComponent } from "../lib/state.component"; import { IgxGridElementsComponent } from "../lib/grids/grid.component"; import { IgxHierarchicalGridElementsComponent } from "../lib/grids/hierarchical-grid.component"; import { IgxTreeGridElementsComponent } from "../lib/grids/tree-grid.component"; +import { IgxRowIslandElementsComponent } from '../lib/grids/row-island.component'; +import { IgxGridActionsBaseDirective } from '../../../igniteui-angular/grids/core/src/grid-actions/grid-actions-base.directive'; export const registerComponents = [ IgxGridElementsComponent, diff --git a/projects/igniteui-angular-elements/src/lib/grids/events.ts b/projects/igniteui-angular-elements/src/lib/grids/events.ts index d1bce6a0c25..0d90bf035e5 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/events.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/events.ts @@ -1,5 +1,5 @@ -import { ColumnType } from '../../../../igniteui-angular/src/lib/grids/common/grid.interface'; -import { IBaseEventArgs } from 'igniteui-angular/src/lib/core/utils'; +import { ColumnType } from 'igniteui-angular/core/src/data-operations/grid-types'; +import { IBaseEventArgs } from 'igniteui-angular/core/src/core/utils'; export interface IColumnsAutoGeneratedEventArgs extends IBaseEventArgs { /* blazorTreatAsCollection */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts index 1b5f5f726bd..b77cbf18727 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts @@ -1,33 +1,48 @@ -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, CUSTOM_ELEMENTS_SCHEMA, ElementRef, EnvironmentInjector, EventEmitter, Inject, Injector, IterableDiffers, LOCALE_ID, NgZone, Optional, Output, QueryList, ViewContainerRef } from '@angular/core'; -import { IgxGridComponent } from '../../../../igniteui-angular/src/lib/grids/grid/grid.component'; +import { + Component, ChangeDetectionStrategy, Output, EventEmitter, + QueryList, ContentChildren, CUSTOM_ELEMENTS_SCHEMA +} from '@angular/core'; +import { NgTemplateOutlet, NgClass, NgStyle } from '@angular/common'; +import { + IGX_GRID_BASE, + IGX_GRID_SERVICE_BASE, + IgxColumnMovingDropDirective, + IgxColumnResizingService, + IgxFilteringService, + IgxGridAddRowPipe, + IgxGridBodyDirective, + IgxGridColumnResizerComponent, + IgxGridCRUDService, + IgxGridDragSelectDirective, + IgxGridHeaderRowComponent, + IgxGridNavigationService, + IgxGridRowClassesPipe, + IgxGridRowPinningPipe, + IgxGridRowStylesPipe, + IgxGridSelectionService, + IgxGridSummaryService, + IgxGridTransactionPipe, + IgxGridValidationService, + IgxHasVisibleColumnsPipe, + IgxRowEditTabStopDirective, + IgxStringReplacePipe, + IgxSummaryDataPipe, + IgxSummaryRowComponent, +} from 'igniteui-angular/grids/core'; +import { IgxGridAPIService } from 'igniteui-angular/grids/grid/src/grid-api.service'; +import { IgxGridGroupByRowComponent } from 'igniteui-angular/grids/grid/src/groupby-row.component'; +import { IgxGridGroupByAreaComponent } from 'igniteui-angular/grids/grid/src/grouping/grid-group-by-area.component'; +import { IgxActionStripToken, IgxOverlayOutletDirective } from 'igniteui-angular/core'; +import { IgxGridDetailsPipe } from 'igniteui-angular/grids/grid/src/grid.details.pipe'; +import { IgxGridSummaryPipe } from 'igniteui-angular/grids/grid/src/grid.summary.pipe'; +import { IgxGridGroupingPipe, IgxGridPagingPipe, IgxGridSortingPipe, IgxGridFilteringPipe, IgxGridCellMergePipe, IgxGridUnmergeActivePipe } from 'igniteui-angular/grids/grid/src/grid.pipes'; +import { IgxGridRowComponent } from 'igniteui-angular/grids/grid/src/grid-row.component'; +import { IgxButtonDirective, IgxForOfScrollSyncService, IgxForOfSyncService, IgxGridForOfDirective, IgxRippleDirective, IgxScrollInertiaDirective, IgxTemplateOutletDirective, IgxToggleDirective } from 'igniteui-angular/directives'; +import { IgxCircularProgressBarComponent } from 'igniteui-angular/progressbar'; +import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; +import { IgxIconComponent } from 'igniteui-angular/icon'; import { IColumnsAutoGeneratedEventArgs } from './events'; -import { IgxGridCRUDService } from '../../../../igniteui-angular/src/lib/grids/common/crud.service'; -import { IgxGridNavigationService } from '../../../../igniteui-angular/src/lib/grids/grid-navigation.service'; -import { IgxGridSummaryService } from '../../../../igniteui-angular/src/lib/grids/summaries/grid-summary.service'; -import { IgxGridSelectionService } from '../../../../igniteui-angular/src/lib/grids/selection/selection.service'; -import { IgxGridValidationService } from '../../../../igniteui-angular/src/lib/grids/grid/grid-validation.service'; -import { GridServiceType, IGX_GRID_BASE, IGX_GRID_SERVICE_BASE, IgxButtonDirective, IgxCircularProgressBarComponent, IgxColumnComponent, IgxFlatTransactionFactory, IgxGridForOfDirective, IgxGridHeaderRowComponent, IgxGridToolbarComponent, IgxGridTransaction, IgxIconComponent, IgxOverlayOutletDirective, IgxOverlayService, IgxPaginatorComponent, IgxRippleDirective, IgxRowEditTabStopDirective, IgxSnackbarComponent, IgxTemplateOutletDirective, IgxTextHighlightService, IgxToggleDirective, State, Transaction, TransactionService } from 'igniteui-angular'; -import { IgxGridAPIService } from '../../../../igniteui-angular/src/lib/grids/grid/grid-api.service'; -import { IgxFilteringService } from '../../../../igniteui-angular/src/lib/grids/filtering/grid-filtering.service'; -import { IgxColumnResizingService } from '../../../../igniteui-angular/src/lib/grids/resizing/resizing.service'; -import { IgxForOfScrollSyncService, IgxForOfSyncService } from '../../../../igniteui-angular/src/lib/directives/for-of/for_of.sync.service'; -import { IgxActionStripToken } from '../../../../igniteui-angular/src/lib/action-strip/token'; -import { takeUntil } from 'rxjs'; -import { DOCUMENT, NgClass, NgFor, NgIf, NgStyle, NgTemplateOutlet } from '@angular/common'; -import { PlatformUtil } from '../../../../igniteui-angular/src/lib/core/utils'; -import { IgxGridGroupByAreaComponent } from '../../../../igniteui-angular/src/lib/grids/grouping/grid-group-by-area.component'; -import { IgxGridBodyDirective } from '../../../../igniteui-angular/src/lib/grids/grid.common'; -import { IgxGridDragSelectDirective } from '../../../../igniteui-angular/src/lib/grids/selection/drag-select.directive'; -import { IgxColumnMovingDropDirective } from '../../../../igniteui-angular/src/lib/grids/moving/moving.drop.directive'; -import { IgxGridRowComponent } from '../../../../igniteui-angular/src/lib/grids/grid/grid-row.component'; -import { IgxGridGroupByRowComponent } from '../../../../igniteui-angular/src/lib/grids/grid/groupby-row.component'; -import { IgxSummaryRowComponent } from '../../../../igniteui-angular/src/lib/grids/summaries/summary-row.component'; -import { IgxGridColumnResizerComponent } from '../../../../igniteui-angular/src/lib/grids/resizing/resizer.component'; -import { IgxGridAddRowPipe, IgxGridRowClassesPipe, IgxGridRowPinningPipe, IgxGridRowStylesPipe, IgxGridTransactionPipe, IgxHasVisibleColumnsPipe, IgxStringReplacePipe } from '../../../../igniteui-angular/src/lib/grids/common/pipes'; -import { IgxSummaryDataPipe } from '../../../../igniteui-angular/src/lib/grids/summaries/grid-root-summary.pipe'; -import { IgxGridFilteringPipe, IgxGridGroupingPipe, IgxGridPagingPipe, IgxGridSortingPipe } from '../../../../igniteui-angular/src/lib/grids/grid/grid.pipes'; -import { IgxGridSummaryPipe } from '../../../../igniteui-angular/src/lib/grids/grid/grid.summary.pipe'; -import { IgxGridDetailsPipe } from '../../../../igniteui-angular/src/lib/grids/grid/grid.details.pipe'; +import { IgxGridComponent } from 'igniteui-angular/grids/grid/src/grid.component'; /* blazorAdditionalDependency: Column */ /* blazorAdditionalDependency: ColumnGroup */ @@ -80,82 +95,52 @@ import { IgxGridDetailsPipe } from '../../../../igniteui-angular/src/lib/grids/g IgxForOfScrollSyncService, ], imports: [ - NgClass, - NgStyle, - NgTemplateOutlet, - IgxGridGroupByAreaComponent, - IgxGridHeaderRowComponent, - IgxGridBodyDirective, - IgxGridDragSelectDirective, - IgxColumnMovingDropDirective, - IgxGridForOfDirective, - IgxTemplateOutletDirective, - IgxGridRowComponent, - IgxGridGroupByRowComponent, - IgxSummaryRowComponent, - IgxOverlayOutletDirective, - IgxToggleDirective, - IgxCircularProgressBarComponent, - IgxSnackbarComponent, - IgxButtonDirective, - IgxRippleDirective, - IgxIconComponent, - IgxRowEditTabStopDirective, - IgxGridColumnResizerComponent, - IgxGridTransactionPipe, - IgxHasVisibleColumnsPipe, - IgxGridRowPinningPipe, - IgxGridAddRowPipe, - IgxGridRowClassesPipe, - IgxGridRowStylesPipe, - IgxSummaryDataPipe, - IgxGridGroupingPipe, - IgxGridPagingPipe, - IgxGridSortingPipe, - IgxGridFilteringPipe, - IgxGridSummaryPipe, - IgxGridDetailsPipe, - IgxStringReplacePipe, - ], + NgClass, + NgStyle, + NgTemplateOutlet, + IgxGridGroupByAreaComponent, + IgxGridHeaderRowComponent, + IgxGridBodyDirective, + IgxGridDragSelectDirective, + IgxColumnMovingDropDirective, + IgxGridForOfDirective, + IgxTemplateOutletDirective, + IgxGridRowComponent, + IgxGridGroupByRowComponent, + IgxSummaryRowComponent, + IgxOverlayOutletDirective, + IgxToggleDirective, + IgxCircularProgressBarComponent, + IgxSnackbarComponent, + IgxButtonDirective, + IgxRippleDirective, + IgxIconComponent, + IgxRowEditTabStopDirective, + IgxGridColumnResizerComponent, + IgxGridTransactionPipe, + IgxHasVisibleColumnsPipe, + IgxGridRowPinningPipe, + IgxGridAddRowPipe, + IgxGridRowClassesPipe, + IgxGridRowStylesPipe, + IgxSummaryDataPipe, + IgxGridGroupingPipe, + IgxGridPagingPipe, + IgxGridSortingPipe, + IgxGridFilteringPipe, + IgxGridSummaryPipe, + IgxGridDetailsPipe, + IgxStringReplacePipe, + IgxGridCellMergePipe, + IgxGridUnmergeActivePipe, + IgxScrollInertiaDirective + ], selector: 'igx-grid', - templateUrl: '../../../../igniteui-angular/src/lib/grids/grid/grid.component.html', + templateUrl: '../../../../igniteui-angular/grids/grid/src/grid.component.html', schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class IgxGridElementsComponent extends IgxGridComponent { - constructor( - public override readonly validation: IgxGridValidationService, - /** @hidden @internal */ - public override readonly selectionService: IgxGridSelectionService, - protected override colResizingService: IgxColumnResizingService, - @Inject(IGX_GRID_SERVICE_BASE) public override readonly gridAPI: GridServiceType, - protected override transactionFactory: IgxFlatTransactionFactory, - private elementRef1: ElementRef, - protected override zone: NgZone, - /** @hidden @internal */ - @Inject(DOCUMENT) public override document: any, - public override readonly cdr: ChangeDetectorRef, - protected override differs: IterableDiffers, - protected override viewRef: ViewContainerRef, - protected override injector: Injector, - protected override envInjector: EnvironmentInjector, - public override navigation: IgxGridNavigationService, - /** @hidden @internal */ - public override filteringService: IgxFilteringService, - protected override textHighlightService: IgxTextHighlightService, - @Inject(IgxOverlayService) protected override overlayService: IgxOverlayService, - /** @hidden @internal */ - public override summaryService: IgxGridSummaryService, - @Inject(LOCALE_ID) private localeId1: string, - protected override platform: PlatformUtil, - @Optional() @Inject(IgxGridTransaction) protected override _diTransactions?: TransactionService, - ) { - super(validation, selectionService,colResizingService, gridAPI, transactionFactory, elementRef1, zone, - document, cdr, differs, viewRef,injector, envInjector, navigation, filteringService, textHighlightService, overlayService, - summaryService, localeId1, platform, _diTransactions - ); - } - @Output() public columnsAutogenerated = new EventEmitter(); diff --git a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts index 1df4b1e6746..5178ee19481 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts @@ -1,33 +1,37 @@ -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, CUSTOM_ELEMENTS_SCHEMA, ElementRef, EnvironmentInjector, EventEmitter, Inject, Injector, IterableDiffers, LOCALE_ID, NgZone, Optional, Output, QueryList, ViewContainerRef } from '@angular/core'; -import { IgxChildGridRowComponent, IgxHierarchicalGridComponent } from '../../../../igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component'; -import { IgxGridCRUDService } from '../../../../igniteui-angular/src/lib/grids/common/crud.service'; -import { IgxGridValidationService } from '../../../../igniteui-angular/src/lib/grids/grid/grid-validation.service'; -import { IgxGridSelectionService } from '../../../../igniteui-angular/src/lib/grids/selection/selection.service'; -import { IGX_GRID_BASE, IGX_GRID_SERVICE_BASE, IgxButtonDirective, IgxCircularProgressBarComponent, IgxFlatTransactionFactory, IgxGridForOfDirective, IgxGridHeaderRowComponent, IgxGridTransaction, IgxIconComponent, IgxOverlayOutletDirective, IgxOverlayService, IgxRippleDirective, IgxRowEditTabStopDirective, IgxSnackbarComponent, IgxTemplateOutletDirective, IgxTextHighlightService, IgxToggleDirective, State, Transaction, TransactionService } from 'igniteui-angular'; -import { IgxHierarchicalGridAPIService } from '../../../../igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid-api.service'; -import { IgxGridSummaryService } from '../../../../igniteui-angular/src/lib/grids/summaries/grid-summary.service'; -import { IgxFilteringService } from '../../../../igniteui-angular/src/lib/grids/filtering/grid-filtering.service'; -import { IgxHierarchicalGridNavigationService } from '../../../../igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid-navigation.service'; -import { IgxColumnResizingService } from '../../../../igniteui-angular/src/lib/grids/resizing/resizing.service'; -import { IgxForOfScrollSyncService, IgxForOfSyncService } from '../../../../igniteui-angular/src/lib/directives/for-of/for_of.sync.service'; -import { IgxRowIslandAPIService } from '../../../../igniteui-angular/src/lib/grids/hierarchical-grid/row-island-api.service'; -import { DOCUMENT, NgClass, NgFor, NgIf, NgStyle, NgTemplateOutlet } from '@angular/common'; -import { IgxGridBodyDirective } from '../../../../igniteui-angular/src/lib/grids/grid.common'; -import { IgxGridDragSelectDirective } from '../../../../igniteui-angular/src/lib/grids/selection/drag-select.directive'; -import { IgxColumnMovingDropDirective } from '../../../../igniteui-angular/src/lib/grids/moving/moving.drop.directive'; -import { IgxHierarchicalRowComponent } from '../../../../igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-row.component'; -import { IgxSummaryRowComponent } from '../../../../igniteui-angular/src/lib/grids/summaries/summary-row.component'; -import { IgxGridColumnResizerComponent } from '../../../../igniteui-angular/src/lib/grids/resizing/resizer.component'; -import { IgxGridFilteringPipe, IgxGridSortingPipe } from '../../../../igniteui-angular/src/lib/grids/grid/grid.pipes'; -import { IgxGridAddRowPipe, IgxGridRowClassesPipe, IgxGridRowPinningPipe, IgxGridRowStylesPipe, IgxGridTransactionPipe, IgxHasVisibleColumnsPipe, IgxStringReplacePipe } from '../../../../igniteui-angular/src/lib/grids/common/pipes'; -import { IgxSummaryDataPipe } from '../../../../igniteui-angular/src/lib/grids/summaries/grid-root-summary.pipe'; -import { IgxGridHierarchicalPagingPipe, IgxGridHierarchicalPipe } from '../../../../igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.pipes'; -import { PlatformUtil } from '../../../../igniteui-angular/src/lib/core/utils'; -import { takeUntil } from 'rxjs'; -import { IColumnsAutoGeneratedEventArgs } from './events'; -import { IgxActionStripToken } from '../../../../igniteui-angular/src/lib/action-strip/token'; +import { ChangeDetectionStrategy, Component, ContentChildren, CUSTOM_ELEMENTS_SCHEMA, EventEmitter, Output, QueryList } from '@angular/core'; +import { NgClass, NgTemplateOutlet, NgStyle } from '@angular/common'; + +import { IgxHierarchicalGridAPIService } from 'igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid-api.service'; +import { IgxFilteringService, IgxGridValidationService } from 'igniteui-angular/grids/core'; +import { IgxHierarchicalGridNavigationService } from 'igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid-navigation.service'; +import { IgxGridSummaryService } from 'igniteui-angular/grids/core'; +import { takeUntil } from 'rxjs/operators'; +import { IGX_GRID_BASE, IGX_GRID_SERVICE_BASE } from 'igniteui-angular/grids/core'; +import { IgxRowIslandAPIService } from 'igniteui-angular/grids/hierarchical-grid/src/row-island-api.service'; +import { IgxGridCRUDService } from 'igniteui-angular/grids/core'; +import { IgxColumnResizingService } from 'igniteui-angular/grids/core'; +import { IgxGridHierarchicalPipe, IgxGridHierarchicalPagingPipe } from 'igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.pipes'; +import { IgxSummaryDataPipe } from 'igniteui-angular/grids/core'; +import { IgxGridTransactionPipe, IgxHasVisibleColumnsPipe, IgxGridRowPinningPipe, IgxGridAddRowPipe, IgxGridRowClassesPipe, IgxGridRowStylesPipe, IgxStringReplacePipe } from 'igniteui-angular/grids/core'; +import { IgxGridColumnResizerComponent } from 'igniteui-angular/grids/core'; +import { IgxRowEditTabStopDirective } from 'igniteui-angular/grids/core'; +import { IgxSummaryRowComponent } from 'igniteui-angular/grids/core'; +import { IgxHierarchicalRowComponent } from 'igniteui-angular/grids/hierarchical-grid/src/hierarchical-row.component'; +import { IgxColumnMovingDropDirective } from 'igniteui-angular/grids/core'; +import { IgxGridDragSelectDirective } from 'igniteui-angular/grids/core'; +import { IgxGridBodyDirective } from 'igniteui-angular/grids/core'; +import { IgxGridHeaderRowComponent } from 'igniteui-angular/grids/core'; +import { IgxGridSelectionService } from 'igniteui-angular/grids/core'; +import { IgxButtonDirective, IgxForOfScrollSyncService, IgxForOfSyncService, IgxGridForOfDirective, IgxRippleDirective, IgxScrollInertiaDirective, IgxTemplateOutletDirective, IgxToggleDirective } from 'igniteui-angular/directives'; +import { IgxCircularProgressBarComponent } from 'igniteui-angular/progressbar'; +import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; +import { IgxIconComponent } from 'igniteui-angular/icon'; +import {IgxActionStripToken, IgxOverlayOutletDirective } from 'igniteui-angular/core'; +import { IgxGridCellMergePipe, IgxGridFilteringPipe, IgxGridSortingPipe, IgxGridUnmergeActivePipe } from 'igniteui-angular/grids/grid'; +import { IgxChildGridRowComponent, IgxHierarchicalGridComponent } from 'igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component'; import { IgxRowIslandElementsComponent } from './row-island.component'; +import { IColumnsAutoGeneratedEventArgs } from './events'; /* blazorAdditionalDependency: Column */ @@ -55,7 +59,7 @@ import { IgxRowIslandElementsComponent } from './row-island.component'; @Component({ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'igx-hierarchical-grid', - templateUrl: '../../../../igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.html', + templateUrl: '../../../../igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component.html', providers: [ IgxGridCRUDService, IgxGridValidationService, @@ -103,43 +107,17 @@ import { IgxRowIslandElementsComponent } from './row-island.component'; IgxSummaryDataPipe, IgxGridHierarchicalPipe, IgxGridHierarchicalPagingPipe, - IgxStringReplacePipe + IgxStringReplacePipe, + IgxGridCellMergePipe, + IgxScrollInertiaDirective, + IgxGridUnmergeActivePipe ], schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class IgxHierarchicalGridElementsComponent extends IgxHierarchicalGridComponent { - constructor( - public override readonly validation: IgxGridValidationService, - /** @hidden @internal */ - public override readonly selectionService: IgxGridSelectionService, - protected override colResizingService: IgxColumnResizingService, - @Inject(IGX_GRID_SERVICE_BASE) public override readonly gridAPI: IgxHierarchicalGridAPIService, - protected override transactionFactory: IgxFlatTransactionFactory, - private elementRef1: ElementRef, - protected override zone: NgZone, - /** @hidden @internal */ - @Inject(DOCUMENT) public override document: any, - public override readonly cdr: ChangeDetectorRef, - protected override differs: IterableDiffers, - protected override viewRef: ViewContainerRef, - protected override injector: Injector, - protected override envInjector: EnvironmentInjector, - public override navigation: IgxHierarchicalGridNavigationService, - /** @hidden @internal */ - public override filteringService: IgxFilteringService, - protected override textHighlightService: IgxTextHighlightService, - @Inject(IgxOverlayService) protected override overlayService: IgxOverlayService, - /** @hidden @internal */ - public override summaryService: IgxGridSummaryService, - @Inject(LOCALE_ID) private localeId1: string, - protected override platform: PlatformUtil, - @Optional() @Inject(IgxGridTransaction) protected override _diTransactions?: TransactionService, - ) { - super(validation, selectionService,colResizingService, gridAPI, transactionFactory, elementRef1, zone, - document, cdr, differs, viewRef,injector, envInjector, navigation, filteringService, textHighlightService, overlayService, - summaryService, localeId1, platform, _diTransactions - ); + constructor() { + super(); this.selectionService.selectedRowsChange.pipe(takeUntil(this.destroy$)).subscribe((args: any[]) => { this.selectedRowsChange.emit(args); }); diff --git a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts index 1cd4d104fc3..532d5a37438 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts @@ -9,21 +9,13 @@ /* contentParent: RowIsland */ /* contentParent: HierarchicalGrid */ -import { DOCUMENT } from '@angular/common'; -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, ElementRef, EnvironmentInjector, EventEmitter, forwardRef, Inject, Injector, Input, IterableDiffers, LOCALE_ID, NgZone, Optional, Output, QueryList, ViewContainerRef } from '@angular/core'; -import { IGX_GRID_SERVICE_BASE, IgxFlatTransactionFactory, IgxGridTransaction, IgxOverlayService, IgxRowIslandComponent, IgxTextHighlightService, State, Transaction, TransactionService } from 'igniteui-angular'; -import { PlatformUtil } from 'igniteui-angular/src/lib/core/utils'; -import { IgxFilteringService } from 'igniteui-angular/src/lib/grids/filtering/grid-filtering.service'; -import { IgxGridValidationService } from 'igniteui-angular/src/lib/grids/grid/grid-validation.service'; -import { IgxHierarchicalGridAPIService } from 'igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid-api.service'; -import { IgxHierarchicalGridNavigationService } from 'igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid-navigation.service'; -import { IgxRowIslandAPIService } from 'igniteui-angular/src/lib/grids/hierarchical-grid/row-island-api.service'; -import { IgxColumnResizingService } from 'igniteui-angular/src/lib/grids/resizing/resizing.service'; -import { IgxGridSelectionService } from 'igniteui-angular/src/lib/grids/selection/selection.service'; -import { IgxGridSummaryService } from 'igniteui-angular/src/lib/grids/summaries/grid-summary.service'; -import { takeUntil } from 'rxjs'; +import { ChangeDetectionStrategy, Component, ContentChildren, EventEmitter, forwardRef, Input, Output, QueryList } from '@angular/core'; +import { IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid/src/row-island.component'; +import { IgxFilteringService } from 'igniteui-angular/grids/core'; +import { IgxRowIslandAPIService } from 'igniteui-angular/grids/hierarchical-grid/src/row-island-api.service'; +import { IgxGridSelectionService } from 'igniteui-angular/grids/core'; import { IColumnsAutoGeneratedEventArgs } from './events'; -import { IgxActionStripToken } from 'igniteui-angular/src/lib/action-strip/token'; +import { IgxActionStripToken } from 'igniteui-angular/core'; /** * Row island @@ -48,53 +40,6 @@ import { IgxActionStripToken } from 'igniteui-angular/src/lib/action-strip/token }) export class IgxRowIslandElementsComponent extends IgxRowIslandComponent { - constructor( - validationService: IgxGridValidationService, - selectionService: IgxGridSelectionService, - colResizingService: IgxColumnResizingService, - @Inject(IGX_GRID_SERVICE_BASE) gridAPI: IgxHierarchicalGridAPIService, - transactionFactory: IgxFlatTransactionFactory, - elementRef: ElementRef, - zone: NgZone, - @Inject(DOCUMENT) document, - cdr: ChangeDetectorRef, - differs: IterableDiffers, - viewRef: ViewContainerRef, - injector: Injector, - envInjector: EnvironmentInjector, - navigation: IgxHierarchicalGridNavigationService, - filteringService: IgxFilteringService, - textHighlightService: IgxTextHighlightService, - @Inject(IgxOverlayService) overlayService: IgxOverlayService, - summaryService: IgxGridSummaryService, - public override rowIslandAPI: IgxRowIslandAPIService, - @Inject(LOCALE_ID) localeId: string, - platform: PlatformUtil) { - super( - validationService, - selectionService, - colResizingService, - gridAPI, - transactionFactory, - elementRef, - zone, - document, - cdr, - differs, - viewRef, - injector, - envInjector, - navigation, - filteringService, - textHighlightService, - overlayService, - summaryService, - rowIslandAPI, - localeId, - platform - ); - } - /* contentChildren */ /* blazorTreatAsCollection */ /* blazorCollectionName: RowIslandCollection */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts index 475bce0a428..f9488ec22ff 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts @@ -1,31 +1,44 @@ -import { DOCUMENT, NgClass, NgFor, NgIf, NgStyle, NgTemplateOutlet } from '@angular/common'; -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, CUSTOM_ELEMENTS_SCHEMA, ElementRef, EnvironmentInjector, EventEmitter, Inject, Injector, IterableDiffers, LOCALE_ID, NgZone, Optional, Output, QueryList, ViewContainerRef } from '@angular/core'; -import { GridServiceType, HierarchicalState, HierarchicalTransaction, HierarchicalTransactionService, IGX_GRID_BASE, IGX_GRID_SERVICE_BASE, IgxButtonDirective, IgxCircularProgressBarComponent, IgxGridForOfDirective, IgxGridHeaderRowComponent, IgxGridTransaction, IgxHierarchicalTransactionFactory, IgxIconComponent, IgxOverlayOutletDirective, IgxOverlayService, IgxRippleDirective, IgxRowEditTabStopDirective, IgxSnackbarComponent, IgxTemplateOutletDirective, IgxTextHighlightService, IgxToggleDirective, IgxTreeGridComponent } from 'igniteui-angular'; -import { PlatformUtil } from 'igniteui-angular/src/lib/core/utils'; -import { IgxForOfScrollSyncService, IgxForOfSyncService } from 'igniteui-angular/src/lib/directives/for-of/for_of.sync.service'; -import { IgxGridCRUDService } from 'igniteui-angular/src/lib/grids/common/crud.service'; -import { IgxGridRowClassesPipe, IgxGridRowPinningPipe, IgxGridRowStylesPipe, IgxHasVisibleColumnsPipe, IgxStringReplacePipe } from 'igniteui-angular/src/lib/grids/common/pipes'; -import { IgxFilteringService } from 'igniteui-angular/src/lib/grids/filtering/grid-filtering.service'; -import { IgxGridNavigationService } from 'igniteui-angular/src/lib/grids/grid-navigation.service'; -import { IgxGridBodyDirective } from 'igniteui-angular/src/lib/grids/grid.common'; -import { IgxGridValidationService } from 'igniteui-angular/src/lib/grids/grid/grid-validation.service'; -import { IgxColumnMovingDropDirective } from 'igniteui-angular/src/lib/grids/moving/moving.drop.directive'; -import { IgxGridColumnResizerComponent } from 'igniteui-angular/src/lib/grids/resizing/resizer.component'; -import { IgxColumnResizingService } from 'igniteui-angular/src/lib/grids/resizing/resizing.service'; -import { IgxGridDragSelectDirective } from 'igniteui-angular/src/lib/grids/selection/drag-select.directive'; -import { IgxGridSelectionService } from 'igniteui-angular/src/lib/grids/selection/selection.service'; -import { IgxSummaryDataPipe } from 'igniteui-angular/src/lib/grids/summaries/grid-root-summary.pipe'; -import { IgxGridSummaryService } from 'igniteui-angular/src/lib/grids/summaries/grid-summary.service'; -import { IgxSummaryRowComponent } from 'igniteui-angular/src/lib/grids/summaries/summary-row.component'; -import { IgxTreeGridAPIService } from 'igniteui-angular/src/lib/grids/tree-grid/tree-grid-api.service'; -import { IgxTreeGridRowComponent } from 'igniteui-angular/src/lib/grids/tree-grid/tree-grid-row.component'; -import { IgxTreeGridSelectionService } from 'igniteui-angular/src/lib/grids/tree-grid/tree-grid-selection.service'; -import { IgxTreeGridFilteringPipe } from 'igniteui-angular/src/lib/grids/tree-grid/tree-grid.filtering.pipe'; -import { IgxTreeGridAddRowPipe, IgxTreeGridFlatteningPipe, IgxTreeGridHierarchizingPipe, IgxTreeGridNormalizeRecordsPipe, IgxTreeGridPagingPipe, IgxTreeGridSortingPipe, IgxTreeGridTransactionPipe } from 'igniteui-angular/src/lib/grids/tree-grid/tree-grid.pipes'; -import { IgxTreeGridSummaryPipe } from 'igniteui-angular/src/lib/grids/tree-grid/tree-grid.summary.pipe'; -import { takeUntil } from 'rxjs'; +import { NgClass, NgStyle, NgTemplateOutlet } from '@angular/common'; +import { ChangeDetectionStrategy, Component, ContentChildren, CUSTOM_ELEMENTS_SCHEMA, EventEmitter, Output, QueryList } from '@angular/core'; +import { IgxTreeGridAPIService } from 'igniteui-angular/grids/tree-grid/src/tree-grid-api.service'; +import { IgxGridCellMergePipe, IgxGridUnmergeActivePipe } from 'igniteui-angular/grids/grid'; +import { + IGX_GRID_BASE, + IGX_GRID_SERVICE_BASE, + IgxColumnMovingDropDirective, + IgxColumnResizingService, + IgxFilteringService, + IgxGridBodyDirective, + IgxGridColumnResizerComponent, + IgxGridCRUDService, + IgxGridDragSelectDirective, + IgxGridHeaderRowComponent, + IgxGridNavigationService, + IgxGridRowClassesPipe, + IgxGridRowPinningPipe, + IgxGridRowStylesPipe, + IgxGridSelectionService, + IgxGridSummaryService, + IgxGridTransaction, + IgxGridValidationService, + IgxHasVisibleColumnsPipe, + IgxRowEditTabStopDirective, + IgxStringReplacePipe, + IgxSummaryDataPipe, + IgxSummaryRowComponent, +} from 'igniteui-angular/grids/core'; +import { IgxTreeGridSelectionService } from 'igniteui-angular/grids/tree-grid/src/tree-grid-selection.service'; +import { IgxActionStripToken, IgxOverlayOutletDirective } from 'igniteui-angular/core'; +import { IgxTreeGridSummaryPipe } from 'igniteui-angular/grids/tree-grid/src/tree-grid.summary.pipe'; +import { IgxTreeGridFilteringPipe } from 'igniteui-angular/grids/tree-grid/src/tree-grid.filtering.pipe'; +import { IgxTreeGridHierarchizingPipe, IgxTreeGridFlatteningPipe, IgxTreeGridSortingPipe, IgxTreeGridPagingPipe, IgxTreeGridTransactionPipe, IgxTreeGridNormalizeRecordsPipe, IgxTreeGridAddRowPipe } from 'igniteui-angular/grids/tree-grid/src/tree-grid.pipes'; +import { IgxTreeGridRowComponent } from 'igniteui-angular/grids/tree-grid/src/tree-grid-row.component'; +import { IgxButtonDirective, IgxForOfScrollSyncService, IgxForOfSyncService, IgxGridForOfDirective, IgxRippleDirective, IgxScrollInertiaDirective, IgxTemplateOutletDirective, IgxToggleDirective } from 'igniteui-angular/directives'; +import { IgxCircularProgressBarComponent } from 'igniteui-angular/progressbar'; +import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; +import { IgxIconComponent } from 'igniteui-angular/icon'; +import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid/src/tree-grid.component'; import { IColumnsAutoGeneratedEventArgs } from './events'; -import { IgxActionStripToken } from 'igniteui-angular/src/lib/action-strip/token'; /* blazorAdditionalDependency: Column */ @@ -62,7 +75,7 @@ import { IgxActionStripToken } from 'igniteui-angular/src/lib/action-strip/token @Component({ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'igx-tree-grid', - templateUrl: '../../../../igniteui-angular/src/lib/grids/tree-grid/tree-grid.component.html', + templateUrl: '../../../../igniteui-angular/grids/tree-grid/src/tree-grid.component.html', providers: [ IgxGridCRUDService, IgxGridValidationService, @@ -111,61 +124,14 @@ import { IgxActionStripToken } from 'igniteui-angular/src/lib/action-strip/token IgxTreeGridSummaryPipe, IgxTreeGridNormalizeRecordsPipe, IgxTreeGridAddRowPipe, - IgxStringReplacePipe + IgxStringReplacePipe, + IgxGridCellMergePipe, + IgxScrollInertiaDirective, + IgxGridUnmergeActivePipe ], schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class IgxTreeGridElementsComponent extends IgxTreeGridComponent { - constructor( - validationService: IgxGridValidationService, - selectionService: IgxGridSelectionService, - colResizingService: IgxColumnResizingService, - @Inject(IGX_GRID_SERVICE_BASE) gridAPI: GridServiceType, - // public gridAPI: GridBaseAPIService, - transactionFactory: IgxHierarchicalTransactionFactory, - _elementRef: ElementRef, - _zone: NgZone, - @Inject(DOCUMENT) document: any, - cdr: ChangeDetectorRef, - differs: IterableDiffers, - viewRef: ViewContainerRef, - injector: Injector, - envInjector: EnvironmentInjector, - navigation: IgxGridNavigationService, - filteringService: IgxFilteringService, - textHighlightService: IgxTextHighlightService, - @Inject(IgxOverlayService) overlayService: IgxOverlayService, - summaryService: IgxGridSummaryService, - @Inject(LOCALE_ID) localeId: string, - platform: PlatformUtil, - @Optional() @Inject(IgxGridTransaction) protected override _diTransactions?: - HierarchicalTransactionService, - ) { - super( - validationService, - selectionService, - colResizingService, - gridAPI, - transactionFactory, - _elementRef, - _zone, - document, - cdr, - differs, - viewRef, - injector, - envInjector, - navigation, - filteringService, - textHighlightService, - overlayService, - summaryService, - localeId, - platform, - _diTransactions, - ); - } - @Output() public columnsAutogenerated = new EventEmitter(); From d5e9356b2cb408d84a001a6683b5009917ea8d87 Mon Sep 17 00:00:00 2001 From: MKirova Date: Mon, 30 Mar 2026 14:04:01 +0300 Subject: [PATCH 08/28] chore(*): Regen elements cofig. --- .../src/analyzer/elements.config.ts | 41 ++++++------------- 1 file changed, 12 insertions(+), 29 deletions(-) diff --git a/projects/igniteui-angular-elements/src/analyzer/elements.config.ts b/projects/igniteui-angular-elements/src/analyzer/elements.config.ts index 0767fc8273e..eb41e6f62a7 100644 --- a/projects/igniteui-angular-elements/src/analyzer/elements.config.ts +++ b/projects/igniteui-angular-elements/src/analyzer/elements.config.ts @@ -3,6 +3,9 @@ import { IgxPivotDataSelectorComponent, IgxPivotGridComponent, } from "../../../igniteui-angular/grids/pivot-grid"; +import { IgxGridElementsComponent } from "../lib/grids/grid.component"; +import { IgxHierarchicalGridElementsComponent } from "../lib/grids/hierarchical-grid.component"; +import { IgxTreeGridElementsComponent } from "../lib/grids/tree-grid.component"; import { IgxActionStripComponent } from "../../../igniteui-angular/action-strip/src/action-strip/action-strip.component"; import { IgxActionStripToken } from "../../../igniteui-angular/core/src/grid-column-actions/token"; import { IgxPaginatorComponent } from "../../../igniteui-angular/paginator/src/paginator/paginator.component"; @@ -23,12 +26,8 @@ import { IgxGridToolbarExporterComponent } from "../../../igniteui-angular/grids import { IgxGridToolbarHidingComponent } from "../../../igniteui-angular/grids/core/src/toolbar/grid-toolbar-hiding.component"; import { IgxGridToolbarPinningComponent } from "../../../igniteui-angular/grids/core/src/toolbar/grid-toolbar-pinning.component"; import { IgxRowIslandComponent } from "../../../igniteui-angular/grids/hierarchical-grid/src/row-island.component"; +import { IgxRowIslandElementsComponent } from "../lib/grids/row-island.component"; import { IgxGridStateComponent } from "../lib/state.component"; -import { IgxGridElementsComponent } from "../lib/grids/grid.component"; -import { IgxHierarchicalGridElementsComponent } from "../lib/grids/hierarchical-grid.component"; -import { IgxTreeGridElementsComponent } from "../lib/grids/tree-grid.component"; -import { IgxRowIslandElementsComponent } from '../lib/grids/row-island.component'; -import { IgxGridActionsBaseDirective } from '../../../igniteui-angular/grids/core/src/grid-actions/grid-actions-base.directive'; export const registerComponents = [ IgxGridElementsComponent, @@ -245,7 +244,7 @@ export var registerConfig = [ additionalProperties: [{ name: "hasChildren" }], methods: ["startEdit"], boolProps: ["addRow", "editRow", "deleteRow", "addChild", "asMenuItems"], - provideAs: IgxGridActionsBaseDirective, + provideAs: IgxActionStripActionsToken, }, { component: IgxGridElementsComponent, @@ -272,10 +271,6 @@ export var registerConfig = [ }, ], additionalProperties: [ - { name: "validation" }, - { name: "gridAPI" }, - { name: "cdr" }, - { name: "navigation", writable: true }, { name: "actionStripComponents", writable: true }, { name: "groupsRecords" }, { name: "selectedCells" }, @@ -424,16 +419,6 @@ export var registerConfig = [ "selectRowOnClick", ], }, - { - component: IgxGridEditingActionsComponent, - selector: "igc-grid-editing-actions", - parents: [IgxActionStripComponent], - contentQueries: [], - additionalProperties: [{ name: "hasChildren" }], - methods: ["startEdit"], - boolProps: ["addRow", "editRow", "deleteRow", "addChild", "asMenuItems"], - provideAs: IgxGridActionsBaseDirective, - }, { component: IgxGridPinningActionsComponent, selector: "igc-grid-pinning-actions", @@ -574,16 +559,14 @@ export var registerConfig = [ }, ], additionalProperties: [ - { name: "validation" }, - { name: "gridAPI" }, - { name: "cdr" }, - { name: "navigation", writable: true }, { name: "childLayoutList", writable: true }, { name: "actionStripComponents", writable: true }, { name: "foreignKey" }, { name: "selectedCells" }, { name: "gridAPI", writable: true }, { name: "navigation", writable: true }, + { name: "validation" }, + { name: "cdr" }, { name: "shouldGenerate", writable: true }, { name: "rowList" }, { name: "dataRowList" }, @@ -903,15 +886,14 @@ export var registerConfig = [ { name: "rowIslandAPI", writable: true }, { name: "gridAPI", writable: true }, { name: "navigation", writable: true }, + { name: "validation" }, + { name: "cdr" }, { name: "shouldGenerate", writable: true }, { name: "rowList" }, { name: "dataRowList" }, { name: "transactions" }, - { name: "validation" }, - { name: "cdr" }, { name: "nativeElement" }, { name: "defaultRowHeight" }, - { name: "defaultHeaderGroupMinWidth" }, { name: "columns" }, { name: "pinnedRows" }, ], @@ -949,7 +931,8 @@ export var registerConfig = [ "findPrev", "refreshSearch", "clearSearch", - "getPinnedWidth", + "getPinnedStartWidth", + "getPinnedEndWidth", "selectRows", "deselectRows", "selectAllRows", @@ -1054,8 +1037,8 @@ export var registerConfig = [ { property: "actionStripComponent", childType: IgxActionStripToken }, ], additionalProperties: [ - { name: "rowIslandAPI", writable: true }, { name: "childLayoutList", writable: true }, + { name: "rowIslandAPI", writable: true }, { name: "gridAPI", writable: true }, { name: "navigation", writable: true }, { name: "validation" }, From 31657b68f769d2b12ee0daec9e0bef7f04d5c88c Mon Sep 17 00:00:00 2001 From: MKirova Date: Mon, 30 Mar 2026 14:25:40 +0300 Subject: [PATCH 09/28] chore(*): Add missing nav service provider. --- projects/igniteui-angular-elements/src/app/components.ts | 3 --- .../src/lib/grids/hierarchical-grid.component.ts | 5 +++-- 2 files changed, 3 insertions(+), 5 deletions(-) diff --git a/projects/igniteui-angular-elements/src/app/components.ts b/projects/igniteui-angular-elements/src/app/components.ts index 96f29b0af0a..7d19d8163d3 100644 --- a/projects/igniteui-angular-elements/src/app/components.ts +++ b/projects/igniteui-angular-elements/src/app/components.ts @@ -8,9 +8,6 @@ import { injector } from '../utils/injector-ref'; import { registerComponent } from '../utils/register'; import { IgxPaginatorComponent } from 'igniteui-angular/paginator'; import { IgxActionStripComponent } from 'igniteui-angular/action-strip'; -import { IgxGridComponent } from 'igniteui-angular/grids/grid'; -import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid'; -import { IgxHierarchicalGridComponent, IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid'; import { IgxPivotDataSelectorComponent, IgxPivotGridComponent } from 'igniteui-angular/grids/pivot-grid'; import { GridType, IgxColumnComponent, IgxColumnGroupComponent, IgxColumnLayoutComponent, IgxGridEditingActionsComponent, IgxGridPinningActionsComponent, IgxGridToolbarActionsComponent, IgxGridToolbarAdvancedFilteringComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; import { IgxQueryBuilderComponent, IgxQueryBuilderHeaderComponent } from 'igniteui-angular/query-builder'; diff --git a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts index 5178ee19481..2fe04e56c10 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts @@ -3,7 +3,7 @@ import { ChangeDetectionStrategy, Component, ContentChildren, CUSTOM_ELEMENTS_SC import { NgClass, NgTemplateOutlet, NgStyle } from '@angular/common'; import { IgxHierarchicalGridAPIService } from 'igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid-api.service'; -import { IgxFilteringService, IgxGridValidationService } from 'igniteui-angular/grids/core'; +import { IgxFilteringService, IgxGridNavigationService, IgxGridValidationService } from 'igniteui-angular/grids/core'; import { IgxHierarchicalGridNavigationService } from 'igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid-navigation.service'; import { IgxGridSummaryService } from 'igniteui-angular/grids/core'; import { takeUntil } from 'rxjs/operators'; @@ -27,7 +27,7 @@ import { IgxButtonDirective, IgxForOfScrollSyncService, IgxForOfSyncService, Igx import { IgxCircularProgressBarComponent } from 'igniteui-angular/progressbar'; import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; import { IgxIconComponent } from 'igniteui-angular/icon'; -import {IgxActionStripToken, IgxOverlayOutletDirective } from 'igniteui-angular/core'; +import { IgxActionStripToken, IgxOverlayOutletDirective } from 'igniteui-angular/core'; import { IgxGridCellMergePipe, IgxGridFilteringPipe, IgxGridSortingPipe, IgxGridUnmergeActivePipe } from 'igniteui-angular/grids/grid'; import { IgxChildGridRowComponent, IgxHierarchicalGridComponent } from 'igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component'; import { IgxRowIslandElementsComponent } from './row-island.component'; @@ -68,6 +68,7 @@ import { IColumnsAutoGeneratedEventArgs } from './events'; { provide: IGX_GRID_BASE, useExisting: IgxHierarchicalGridElementsComponent }, IgxGridSummaryService, IgxFilteringService, + IgxGridNavigationService, IgxHierarchicalGridNavigationService, IgxColumnResizingService, IgxForOfSyncService, From f9eaa452e17c71625d822f9bcbc9f54b6ebd4661 Mon Sep 17 00:00:00 2001 From: MKirova Date: Mon, 30 Mar 2026 14:31:28 +0300 Subject: [PATCH 10/28] chore(*): Remove unused import. --- .../src/lib/grids/tree-grid.component.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts index f9488ec22ff..72e5678037e 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts @@ -19,7 +19,6 @@ import { IgxGridRowStylesPipe, IgxGridSelectionService, IgxGridSummaryService, - IgxGridTransaction, IgxGridValidationService, IgxHasVisibleColumnsPipe, IgxRowEditTabStopDirective, From d3a225382ac4737a5883bd5149f81047362609a5 Mon Sep 17 00:00:00 2001 From: MKirova Date: Mon, 30 Mar 2026 17:32:37 +0300 Subject: [PATCH 11/28] chore(*): Bump a bit maximumError size. --- angular.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/angular.json b/angular.json index a8157cba8d9..a095141d2af 100644 --- a/angular.json +++ b/angular.json @@ -360,7 +360,7 @@ { "type": "allScript", "maximumWarning": "2.5mb", - "maximumError": "3mb" + "maximumError": "3.5mb" }, { "type": "bundle", From fae2aaaf2659159a2bcda4e38b8df188af1b8d32 Mon Sep 17 00:00:00 2001 From: Copilot <198982749+Copilot@users.noreply.github.com> Date: Tue, 31 Mar 2026 17:30:24 +0300 Subject: [PATCH 12/28] refactor(elements,grid): move childrenResolved event to elements project (#17140) Co-authored-by: Damyan Petev --- .../src/lib/grids/grid.component.ts | 6 ++++++ .../src/lib/grids/hierarchical-grid.component.ts | 6 ++++++ .../src/lib/grids/tree-grid.component.ts | 6 ++++++ .../grids/grid/src/grid-base.directive.ts | 8 -------- 4 files changed, 18 insertions(+), 8 deletions(-) diff --git a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts index b77cbf18727..15e78c0ebcf 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts @@ -144,6 +144,12 @@ export class IgxGridElementsComponent extends IgxGridComponent { @Output() public columnsAutogenerated = new EventEmitter(); + /** + * Emitted when content children are resolved and collections in grid are updated. + */ + @Output() + public childrenResolved = new EventEmitter(); + /* contentChildren */ /* blazorTreatAsCollection */ /* blazorCollectionName: ActionStripCollection */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts index 2fe04e56c10..92d83325c1c 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts @@ -140,6 +140,12 @@ export class IgxHierarchicalGridElementsComponent extends IgxHierarchicalGridCom @Output() public columnsAutogenerated = new EventEmitter(); + /** + * Emitted when content children are resolved and collections in grid are updated. + */ + @Output() + public childrenResolved = new EventEmitter(); + /* contentChildren */ /* blazorTreatAsCollection */ /* blazorCollectionName: ActionStripCollection */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts index 72e5678037e..cfea0a0b4c9 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts @@ -134,6 +134,12 @@ export class IgxTreeGridElementsComponent extends IgxTreeGridComponent { @Output() public columnsAutogenerated = new EventEmitter(); + /** + * Emitted when content children are resolved and collections in grid are updated. + */ + @Output() + public childrenResolved = new EventEmitter(); + /* contentChildren */ /* blazorTreatAsCollection */ /* blazorCollectionName: ActionStripCollection */ diff --git a/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts b/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts index 83a1e054f2b..552783c7a12 100644 --- a/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts +++ b/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts @@ -1008,14 +1008,6 @@ export abstract class IgxGridBaseDirective implements GridType, @Output() public selectedRowsChange = new EventEmitter(); - /* blazorInclude */ - /** @hidden @internal */ - /** - * Emitted when content children are resolved and collections in grid are updated. - */ - @Output() - public childrenResolved = new EventEmitter(); - /** * Emitted when the expanded state of a row gets changed. * From a43f5a0073063c3af1fa0b091ea9bb909e8e8fbc Mon Sep 17 00:00:00 2001 From: MKirova Date: Wed, 1 Apr 2026 12:34:56 +0300 Subject: [PATCH 13/28] chore(*): Adjust tags for Blazor. --- .../src/lib/grids/grid.component.ts | 1 + .../lib/grids/hierarchical-grid.component.ts | 1 + .../src/lib/grids/row-island.component.ts | 1 + .../src/lib/grids/tree-grid.component.ts | 2 +- .../grids/grid/src/grid.component.ts | 20 +++++------------ .../src/hierarchical-grid.component.ts | 22 +++++-------------- .../src/row-island.component.ts | 15 +++++-------- .../tree-grid/src/tree-grid.component.ts | 20 +++++------------ 8 files changed, 24 insertions(+), 58 deletions(-) diff --git a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts index b77cbf18727..332d2a6cf0d 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts @@ -44,6 +44,7 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; import { IColumnsAutoGeneratedEventArgs } from './events'; import { IgxGridComponent } from 'igniteui-angular/grids/grid/src/grid.component'; +/* blazorAlternateName: Grid */ /* blazorAdditionalDependency: Column */ /* blazorAdditionalDependency: ColumnGroup */ /* blazorAdditionalDependency: ColumnLayout */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts index 2fe04e56c10..13c7e087022 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts @@ -34,6 +34,7 @@ import { IgxRowIslandElementsComponent } from './row-island.component'; import { IColumnsAutoGeneratedEventArgs } from './events'; +/* blazorAlternateName: HierarchicalGrid */ /* blazorAdditionalDependency: Column */ /* blazorAdditionalDependency: ColumnGroup */ /* blazorAdditionalDependency: ColumnLayout */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts index 532d5a37438..0d6f76a0516 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts @@ -4,6 +4,7 @@ /* blazorIndirectRender */ /* jsonAPIManageCollectionInMarkup */ /* jsonAPIManageItemInMarkup */ +/* blazorAlternateName: RowIsland */ /* mustUseNGParentAnchor */ /* additionalIdentifier: ChildDataKey */ /* contentParent: RowIsland */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts index 72e5678037e..eaf3cdc4600 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts @@ -39,7 +39,7 @@ import { IgxIconComponent } from 'igniteui-angular/icon'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid/src/tree-grid.component'; import { IColumnsAutoGeneratedEventArgs } from './events'; - +/* blazorAlternateName: TreeGrid */ /* blazorAdditionalDependency: Column */ /* blazorAdditionalDependency: ColumnGroup */ /* blazorAdditionalDependency: ColumnLayout */ diff --git a/projects/igniteui-angular/grids/grid/src/grid.component.ts b/projects/igniteui-angular/grids/grid/src/grid.component.ts index 602070787a0..54729b75d23 100644 --- a/projects/igniteui-angular/grids/grid/src/grid.component.ts +++ b/projects/igniteui-angular/grids/grid/src/grid.component.ts @@ -70,21 +70,11 @@ export interface IGroupingDoneEventArgs extends IBaseEventArgs { ungroupedColumns: Array | IgxColumnComponent; } -/* blazorAdditionalDependency: Column */ -/* blazorAdditionalDependency: ColumnGroup */ -/* blazorAdditionalDependency: ColumnLayout */ -/* blazorAdditionalDependency: GridToolbar */ -/* blazorAdditionalDependency: GridToolbarActions */ -/* blazorAdditionalDependency: GridToolbarTitle */ -/* blazorAdditionalDependency: GridToolbarAdvancedFiltering */ -/* blazorAdditionalDependency: GridToolbarExporter */ -/* blazorAdditionalDependency: GridToolbarHiding */ -/* blazorAdditionalDependency: GridToolbarPinning */ -/* blazorAdditionalDependency: ActionStrip */ -/* blazorAdditionalDependency: GridActionsBaseDirective */ -/* blazorAdditionalDependency: GridEditingActions */ -/* blazorAdditionalDependency: GridPinningActions */ -/* blazorIndirectRender */ +/* blazorAlternateName: GridBase */ +/* blazorIndirectRender + blazorComponent + omitModule + wcSkipComponentSuffix */ /** * Grid provides a way to present and manipulate tabular data. * diff --git a/projects/igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component.ts b/projects/igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component.ts index d253fac26a0..70612da4a9f 100644 --- a/projects/igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component.ts +++ b/projects/igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component.ts @@ -246,23 +246,11 @@ export class IgxChildGridRowComponent implements AfterViewInit, OnInit { } } - -/* blazorAdditionalDependency: Column */ -/* blazorAdditionalDependency: ColumnGroup */ -/* blazorAdditionalDependency: ColumnLayout */ -/* blazorAdditionalDependency: GridToolbar */ -/* blazorAdditionalDependency: GridToolbarActions */ -/* blazorAdditionalDependency: GridToolbarTitle */ -/* blazorAdditionalDependency: GridToolbarAdvancedFiltering */ -/* blazorAdditionalDependency: GridToolbarExporter */ -/* blazorAdditionalDependency: GridToolbarHiding */ -/* blazorAdditionalDependency: GridToolbarPinning */ -/* blazorAdditionalDependency: ActionStrip */ -/* blazorAdditionalDependency: GridActionsBaseDirective */ -/* blazorAdditionalDependency: GridEditingActions */ -/* blazorAdditionalDependency: GridPinningActions */ -/* blazorAdditionalDependency: RowIsland */ -/* blazorIndirectRender */ +/* blazorAlternateName: HierarchicalGridBase */ +/* blazorIndirectRender + blazorComponent + omitModule + wcSkipComponentSuffix */ /** * Hierarchical grid * diff --git a/projects/igniteui-angular/grids/hierarchical-grid/src/row-island.component.ts b/projects/igniteui-angular/grids/hierarchical-grid/src/row-island.component.ts index 110000d977e..2506649b17b 100644 --- a/projects/igniteui-angular/grids/hierarchical-grid/src/row-island.component.ts +++ b/projects/igniteui-angular/grids/hierarchical-grid/src/row-island.component.ts @@ -36,16 +36,11 @@ import { IGridCreatedEventArgs } from './events'; import { IgxPaginatorComponent, IgxPaginatorDirective } from 'igniteui-angular/paginator'; import { IForOfState } from 'igniteui-angular/directives'; -/* blazorCopyInheritedMembers */ -/* blazorElement */ -/* wcElementTag: igc-row-island */ -/* blazorIndirectRender */ -/* jsonAPIManageCollectionInMarkup */ -/* jsonAPIManageItemInMarkup */ -/* mustUseNGParentAnchor */ -/* additionalIdentifier: ChildDataKey */ -/* contentParent: RowIsland */ -/* contentParent: HierarchicalGrid */ +/* blazorAlternateName: RowIslandBase */ +/* blazorIndirectRender + blazorComponent + omitModule + wcSkipComponentSuffix */ /** * Row island * diff --git a/projects/igniteui-angular/grids/tree-grid/src/tree-grid.component.ts b/projects/igniteui-angular/grids/tree-grid/src/tree-grid.component.ts index 111e589abb0..39b94927378 100644 --- a/projects/igniteui-angular/grids/tree-grid/src/tree-grid.component.ts +++ b/projects/igniteui-angular/grids/tree-grid/src/tree-grid.component.ts @@ -54,21 +54,11 @@ import { IgxTreeGridGroupByAreaComponent } from './tree-grid-group-by-area.compo let NEXT_ID = 0; -/* blazorAdditionalDependency: Column */ -/* blazorAdditionalDependency: ColumnGroup */ -/* blazorAdditionalDependency: ColumnLayout */ -/* blazorAdditionalDependency: GridToolbar */ -/* blazorAdditionalDependency: GridToolbarActions */ -/* blazorAdditionalDependency: GridToolbarTitle */ -/* blazorAdditionalDependency: GridToolbarAdvancedFiltering */ -/* blazorAdditionalDependency: GridToolbarExporter */ -/* blazorAdditionalDependency: GridToolbarHiding */ -/* blazorAdditionalDependency: GridToolbarPinning */ -/* blazorAdditionalDependency: ActionStrip */ -/* blazorAdditionalDependency: GridActionsBaseDirective */ -/* blazorAdditionalDependency: GridEditingActions */ -/* blazorAdditionalDependency: GridPinningActions */ -/* blazorIndirectRender */ +/* blazorAlternateName: TreeGridBase */ +/* blazorIndirectRender + blazorComponent + omitModule + wcSkipComponentSuffix */ /** * **Ignite UI for Angular Tree Grid** - * [Documentation](https://www.infragistics.com/products/ignite-ui-angular/angular/components/grid/grid) From 37a528caf17ca75dbe402872c2b35e53ac866864 Mon Sep 17 00:00:00 2001 From: Maya Date: Thu, 2 Apr 2026 17:38:53 +0300 Subject: [PATCH 14/28] Update projects/igniteui-angular-elements/src/lib/grids/grid.component.ts Co-authored-by: Damyan Petev --- .../src/lib/grids/grid.component.ts | 8 -------- 1 file changed, 8 deletions(-) diff --git a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts index 210297132c6..85b3cf81de6 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts @@ -70,14 +70,6 @@ import { IgxGridComponent } from 'igniteui-angular/grids/grid/src/grid.component * @remarks * The Ignite UI Grid is used for presenting and manipulating tabular data in the simplest way possible. Once data * has been bound, it can be manipulated through filtering, sorting & editing operations. - * @example - * ```html - * - * - * - * - * - * ``` */ @Component({ changeDetection: ChangeDetectionStrategy.OnPush, From 5fb2f19c614e6e04774b3ad978beb1a5f60046b4 Mon Sep 17 00:00:00 2001 From: MKirova Date: Thu, 2 Apr 2026 17:39:55 +0300 Subject: [PATCH 15/28] chore(*): Apply review comments. --- .../igniteui-angular-elements/src/lib/grids/grid.component.ts | 2 ++ .../src/lib/grids/hierarchical-grid.component.ts | 2 ++ .../src/lib/grids/tree-grid.component.ts | 2 ++ 3 files changed, 6 insertions(+) diff --git a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts index 210297132c6..1eaebead984 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts @@ -151,6 +151,8 @@ export class IgxGridElementsComponent extends IgxGridComponent { @Output() public childrenResolved = new EventEmitter(); + /** @hidden @internal */ + /* blazorInclude */ /* contentChildren */ /* blazorTreatAsCollection */ /* blazorCollectionName: ActionStripCollection */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts index ac6c9650b8e..8f40e1ec474 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts @@ -147,6 +147,8 @@ export class IgxHierarchicalGridElementsComponent extends IgxHierarchicalGridCom @Output() public childrenResolved = new EventEmitter(); + /** @hidden @internal */ + /* blazorInclude */ /* contentChildren */ /* blazorTreatAsCollection */ /* blazorCollectionName: ActionStripCollection */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts index b79744c5eaf..ae4c9010e84 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts @@ -140,6 +140,8 @@ export class IgxTreeGridElementsComponent extends IgxTreeGridComponent { @Output() public childrenResolved = new EventEmitter(); + /** @hidden @internal */ + /* blazorInclude */ /* contentChildren */ /* blazorTreatAsCollection */ /* blazorCollectionName: ActionStripCollection */ From 949f4356853634479f9b7fda5f12b28b6cb33dd9 Mon Sep 17 00:00:00 2001 From: MKirova Date: Thu, 2 Apr 2026 17:43:28 +0300 Subject: [PATCH 16/28] chore(*): regenerate config. --- .../igniteui-angular-elements/src/analyzer/elements.config.ts | 3 --- 1 file changed, 3 deletions(-) diff --git a/projects/igniteui-angular-elements/src/analyzer/elements.config.ts b/projects/igniteui-angular-elements/src/analyzer/elements.config.ts index eb41e6f62a7..b0b7606192e 100644 --- a/projects/igniteui-angular-elements/src/analyzer/elements.config.ts +++ b/projects/igniteui-angular-elements/src/analyzer/elements.config.ts @@ -271,7 +271,6 @@ export var registerConfig = [ }, ], additionalProperties: [ - { name: "actionStripComponents", writable: true }, { name: "groupsRecords" }, { name: "selectedCells" }, { name: "validation" }, @@ -560,7 +559,6 @@ export var registerConfig = [ ], additionalProperties: [ { name: "childLayoutList", writable: true }, - { name: "actionStripComponents", writable: true }, { name: "foreignKey" }, { name: "selectedCells" }, { name: "gridAPI", writable: true }, @@ -1179,7 +1177,6 @@ export var registerConfig = [ }, ], additionalProperties: [ - { name: "actionStripComponents", writable: true }, { name: "rootRecords", writable: true }, { name: "records", writable: true }, { name: "processedRootRecords", writable: true }, From 80fc01b5cfe4cc125faf3524a174bc06b9992bbe Mon Sep 17 00:00:00 2001 From: MKirova Date: Thu, 2 Apr 2026 17:48:55 +0300 Subject: [PATCH 17/28] chore(*): Move two-way bind emitter in elements. --- .../src/lib/grids/grid.component.ts | 88 ++++++++++--------- .../src/lib/grids/tree-grid.component.ts | 8 ++ .../grids/grid/src/grid-base.directive.ts | 3 - 3 files changed, 56 insertions(+), 43 deletions(-) diff --git a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts index 08051d8025a..ba2f6703e14 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts @@ -43,6 +43,7 @@ import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { IColumnsAutoGeneratedEventArgs } from './events'; import { IgxGridComponent } from 'igniteui-angular/grids/grid/src/grid.component'; +import { takeUntil } from 'rxjs'; /* blazorAlternateName: Grid */ /* blazorAdditionalDependency: Column */ @@ -88,52 +89,59 @@ import { IgxGridComponent } from 'igniteui-angular/grids/grid/src/grid.component IgxForOfScrollSyncService, ], imports: [ - NgClass, - NgStyle, - NgTemplateOutlet, - IgxGridGroupByAreaComponent, - IgxGridHeaderRowComponent, - IgxGridBodyDirective, - IgxGridDragSelectDirective, - IgxColumnMovingDropDirective, - IgxGridForOfDirective, - IgxTemplateOutletDirective, - IgxGridRowComponent, - IgxGridGroupByRowComponent, - IgxSummaryRowComponent, - IgxOverlayOutletDirective, - IgxToggleDirective, - IgxCircularProgressBarComponent, - IgxSnackbarComponent, - IgxButtonDirective, - IgxRippleDirective, - IgxIconComponent, - IgxRowEditTabStopDirective, - IgxGridColumnResizerComponent, - IgxGridTransactionPipe, - IgxHasVisibleColumnsPipe, - IgxGridRowPinningPipe, - IgxGridAddRowPipe, - IgxGridRowClassesPipe, - IgxGridRowStylesPipe, - IgxSummaryDataPipe, - IgxGridGroupingPipe, - IgxGridPagingPipe, - IgxGridSortingPipe, - IgxGridFilteringPipe, - IgxGridSummaryPipe, - IgxGridDetailsPipe, - IgxStringReplacePipe, - IgxGridCellMergePipe, - IgxGridUnmergeActivePipe, - IgxScrollInertiaDirective - ], + NgClass, + NgStyle, + NgTemplateOutlet, + IgxGridGroupByAreaComponent, + IgxGridHeaderRowComponent, + IgxGridBodyDirective, + IgxGridDragSelectDirective, + IgxColumnMovingDropDirective, + IgxGridForOfDirective, + IgxTemplateOutletDirective, + IgxGridRowComponent, + IgxGridGroupByRowComponent, + IgxSummaryRowComponent, + IgxOverlayOutletDirective, + IgxToggleDirective, + IgxCircularProgressBarComponent, + IgxSnackbarComponent, + IgxButtonDirective, + IgxRippleDirective, + IgxIconComponent, + IgxRowEditTabStopDirective, + IgxGridColumnResizerComponent, + IgxGridTransactionPipe, + IgxHasVisibleColumnsPipe, + IgxGridRowPinningPipe, + IgxGridAddRowPipe, + IgxGridRowClassesPipe, + IgxGridRowStylesPipe, + IgxSummaryDataPipe, + IgxGridGroupingPipe, + IgxGridPagingPipe, + IgxGridSortingPipe, + IgxGridFilteringPipe, + IgxGridSummaryPipe, + IgxGridDetailsPipe, + IgxStringReplacePipe, + IgxGridCellMergePipe, + IgxGridUnmergeActivePipe, + IgxScrollInertiaDirective + ], selector: 'igx-grid', templateUrl: '../../../../igniteui-angular/grids/grid/src/grid.component.html', schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class IgxGridElementsComponent extends IgxGridComponent { + constructor() { + super(); + this.selectionService.selectedRowsChange.pipe(takeUntil(this.destroy$)).subscribe((args: any[]) => { + this.selectedRowsChange.emit(args);IGX_GRID_BASE + }); + } + @Output() public columnsAutogenerated = new EventEmitter(); diff --git a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts index ae4c9010e84..3ab7fc76d4e 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts @@ -38,6 +38,7 @@ import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid/src/tree-grid.component'; import { IColumnsAutoGeneratedEventArgs } from './events'; +import { takeUntil } from 'rxjs'; /* blazorAlternateName: TreeGrid */ /* blazorAdditionalDependency: Column */ @@ -131,6 +132,13 @@ import { IColumnsAutoGeneratedEventArgs } from './events'; schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class IgxTreeGridElementsComponent extends IgxTreeGridComponent { + constructor() { + super(); + this.selectionService.selectedRowsChange.pipe(takeUntil(this.destroy$)).subscribe((args: any[]) => { + this.selectedRowsChange.emit(args); + }); + } + @Output() public columnsAutogenerated = new EventEmitter(); diff --git a/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts b/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts index 552783c7a12..a939e522117 100644 --- a/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts +++ b/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts @@ -3490,9 +3490,6 @@ export abstract class IgxGridBaseDirective implements GridType, this._transactions = this.transactionFactory.create(TRANSACTION_TYPE.None); this._transactions.cloneStrategy = this.dataCloneStrategy; this.cdr.detach(); - this.selectionService.selectedRowsChange.pipe(takeUntil(this.destroy$)).subscribe((args: any[]) => { - this.selectedRowsChange.emit(args); - }); IgcTrialWatermark.register(); } From f654099083afdc56046a2a843d07c23de0cc47f8 Mon Sep 17 00:00:00 2001 From: Maya Date: Thu, 2 Apr 2026 17:51:59 +0300 Subject: [PATCH 18/28] Update projects/igniteui-angular-elements/src/lib/grids/events.ts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> --- projects/igniteui-angular-elements/src/lib/grids/events.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/projects/igniteui-angular-elements/src/lib/grids/events.ts b/projects/igniteui-angular-elements/src/lib/grids/events.ts index 0d90bf035e5..e08a89fb913 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/events.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/events.ts @@ -1,5 +1,4 @@ -import { ColumnType } from 'igniteui-angular/core/src/data-operations/grid-types'; -import { IBaseEventArgs } from 'igniteui-angular/core/src/core/utils'; +import { ColumnType, IBaseEventArgs } from 'igniteui-angular/core'; export interface IColumnsAutoGeneratedEventArgs extends IBaseEventArgs { /* blazorTreatAsCollection */ From d2fe83cdf4aac4f077042f07ed428e48aff50de3 Mon Sep 17 00:00:00 2001 From: Maya Date: Thu, 2 Apr 2026 17:57:53 +0300 Subject: [PATCH 19/28] Potential fix for pull request finding 'Expression has no effect' Co-authored-by: Copilot Autofix powered by AI <223894421+github-code-quality[bot]@users.noreply.github.com> --- .../igniteui-angular-elements/src/lib/grids/grid.component.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts index ba2f6703e14..bfbb601342d 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts @@ -138,7 +138,7 @@ export class IgxGridElementsComponent extends IgxGridComponent { constructor() { super(); this.selectionService.selectedRowsChange.pipe(takeUntil(this.destroy$)).subscribe((args: any[]) => { - this.selectedRowsChange.emit(args);IGX_GRID_BASE + this.selectedRowsChange.emit(args); }); } From 6d1c52beacef1c88b608b1b3dab4dccfe4695f8c Mon Sep 17 00:00:00 2001 From: MKirova Date: Fri, 3 Apr 2026 18:06:48 +0300 Subject: [PATCH 20/28] chore(*): Use aliases so that igxParent don't have to change. --- .../src/analyzer/config.template.ts | 12 +- .../src/analyzer/elements.config.ts | 226 ++++-------------- .../src/app/components.ts | 18 +- .../src/lib/grids/grid.component.ts | 6 +- .../lib/grids/hierarchical-grid.component.ts | 16 +- .../src/lib/grids/row-island.component.ts | 14 +- .../src/lib/grids/tree-grid.component.ts | 6 +- .../src/lib/state.component.ts | 2 +- .../action-strip/action-strip.component.ts | 2 +- .../src/columns/column-group.component.ts | 2 +- .../src/columns/column-layout.component.ts | 2 +- .../core/src/columns/column.component.ts | 2 +- .../src/toolbar/grid-toolbar.component.ts | 2 +- .../src/row-island.component.ts | 2 +- .../src/paginator/paginator.component.ts | 2 +- 15 files changed, 94 insertions(+), 220 deletions(-) diff --git a/projects/igniteui-angular-elements/src/analyzer/config.template.ts b/projects/igniteui-angular-elements/src/analyzer/config.template.ts index b79a28263c3..5940c4e5bd5 100644 --- a/projects/igniteui-angular-elements/src/analyzer/config.template.ts +++ b/projects/igniteui-angular-elements/src/analyzer/config.template.ts @@ -1,13 +1,13 @@ import { IgxQueryBuilderComponent } from '../../../igniteui-angular/query-builder'; import { IgxPivotDataSelectorComponent, IgxPivotGridComponent } from '../../../igniteui-angular/grids/pivot-grid'; -import { IgxGridElementsComponent } from '../lib/grids/grid.component'; -import { IgxHierarchicalGridElementsComponent } from '../lib/grids/hierarchical-grid.component'; -import { IgxTreeGridElementsComponent } from '../lib/grids/tree-grid.component'; +import { IgxGridComponent } from '../lib/grids/grid.component'; +import { IgxHierarchicalGridComponent } from '../lib/grids/hierarchical-grid.component'; +import { IgxTreeGridComponent } from '../lib/grids/tree-grid.component'; export const registerComponents = [ - IgxGridElementsComponent, - IgxHierarchicalGridElementsComponent, - IgxTreeGridElementsComponent, + IgxGridComponent, + IgxHierarchicalGridComponent, + IgxTreeGridComponent, IgxPivotGridComponent, IgxPivotDataSelectorComponent, IgxQueryBuilderComponent diff --git a/projects/igniteui-angular-elements/src/analyzer/elements.config.ts b/projects/igniteui-angular-elements/src/analyzer/elements.config.ts index b0b7606192e..b76e3f4fa34 100644 --- a/projects/igniteui-angular-elements/src/analyzer/elements.config.ts +++ b/projects/igniteui-angular-elements/src/analyzer/elements.config.ts @@ -3,9 +3,9 @@ import { IgxPivotDataSelectorComponent, IgxPivotGridComponent, } from "../../../igniteui-angular/grids/pivot-grid"; -import { IgxGridElementsComponent } from "../lib/grids/grid.component"; -import { IgxHierarchicalGridElementsComponent } from "../lib/grids/hierarchical-grid.component"; -import { IgxTreeGridElementsComponent } from "../lib/grids/tree-grid.component"; +import { IgxGridComponent } from "../lib/grids/grid.component"; +import { IgxHierarchicalGridComponent } from "../lib/grids/hierarchical-grid.component"; +import { IgxTreeGridComponent } from "../lib/grids/tree-grid.component"; import { IgxActionStripComponent } from "../../../igniteui-angular/action-strip/src/action-strip/action-strip.component"; import { IgxActionStripToken } from "../../../igniteui-angular/core/src/grid-column-actions/token"; import { IgxPaginatorComponent } from "../../../igniteui-angular/paginator/src/paginator/paginator.component"; @@ -25,14 +25,13 @@ import { IgxToolbarToken } from "../../../igniteui-angular/grids/core/src/toolba import { IgxGridToolbarExporterComponent } from "../../../igniteui-angular/grids/core/src/toolbar/grid-toolbar-exporter.component"; import { IgxGridToolbarHidingComponent } from "../../../igniteui-angular/grids/core/src/toolbar/grid-toolbar-hiding.component"; import { IgxGridToolbarPinningComponent } from "../../../igniteui-angular/grids/core/src/toolbar/grid-toolbar-pinning.component"; -import { IgxRowIslandComponent } from "../../../igniteui-angular/grids/hierarchical-grid/src/row-island.component"; -import { IgxRowIslandElementsComponent } from "../lib/grids/row-island.component"; +import { IgxRowIslandComponent } from "../lib/grids/row-island.component"; import { IgxGridStateComponent } from "../lib/state.component"; export const registerComponents = [ - IgxGridElementsComponent, - IgxHierarchicalGridElementsComponent, - IgxTreeGridElementsComponent, + IgxGridComponent, + IgxHierarchicalGridComponent, + IgxTreeGridComponent, IgxPivotGridComponent, IgxPivotDataSelectorComponent, IgxQueryBuilderComponent, @@ -44,10 +43,10 @@ export var registerConfig = [ component: IgxActionStripComponent, selector: "igc-action-strip", parents: [ - IgxGridElementsComponent, - IgxHierarchicalGridElementsComponent, - IgxTreeGridElementsComponent, - IgxRowIslandElementsComponent, + IgxGridComponent, + IgxHierarchicalGridComponent, + IgxTreeGridComponent, + IgxRowIslandComponent, ], contentQueries: [ { @@ -65,11 +64,11 @@ export var registerConfig = [ component: IgxColumnComponent, selector: "igc-column", parents: [ - IgxGridElementsComponent, - IgxHierarchicalGridElementsComponent, - IgxTreeGridElementsComponent, + IgxGridComponent, + IgxHierarchicalGridComponent, + IgxTreeGridComponent, IgxPivotGridComponent, - IgxRowIslandElementsComponent, + IgxRowIslandComponent, IgxColumnGroupComponent, IgxColumnLayoutComponent, ], @@ -122,11 +121,11 @@ export var registerConfig = [ component: IgxColumnGroupComponent, selector: "igc-column-group", parents: [ - IgxGridElementsComponent, - IgxHierarchicalGridElementsComponent, - IgxTreeGridElementsComponent, + IgxGridComponent, + IgxHierarchicalGridComponent, + IgxTreeGridComponent, IgxColumnGroupComponent, - IgxRowIslandElementsComponent, + IgxRowIslandComponent, ], contentQueries: [ { @@ -183,7 +182,7 @@ export var registerConfig = [ { component: IgxColumnLayoutComponent, selector: "igc-column-layout", - parents: [IgxGridElementsComponent], + parents: [IgxGridComponent], contentQueries: [ { property: "children", @@ -237,17 +236,7 @@ export var registerConfig = [ provideAs: IgxColumnComponent, }, { - component: IgxGridEditingActionsComponent, - selector: "igc-grid-editing-actions", - parents: [IgxActionStripComponent], - contentQueries: [], - additionalProperties: [{ name: "hasChildren" }], - methods: ["startEdit"], - boolProps: ["addRow", "editRow", "deleteRow", "addChild", "asMenuItems"], - provideAs: IgxActionStripActionsToken, - }, - { - component: IgxGridElementsComponent, + component: IgxGridComponent, selector: "igc-grid", parents: [], contentQueries: [ @@ -418,6 +407,16 @@ export var registerConfig = [ "selectRowOnClick", ], }, + { + component: IgxGridEditingActionsComponent, + selector: "igc-grid-editing-actions", + parents: [IgxActionStripComponent], + contentQueries: [], + additionalProperties: [{ name: "hasChildren" }], + methods: ["startEdit"], + boolProps: ["addRow", "editRow", "deleteRow", "addChild", "asMenuItems"], + provideAs: IgxActionStripActionsToken, + }, { component: IgxGridPinningActionsComponent, selector: "igc-grid-pinning-actions", @@ -432,9 +431,9 @@ export var registerConfig = [ component: IgxGridStateComponent, selector: "igc-grid-state", parents: [ - IgxGridElementsComponent, - IgxTreeGridElementsComponent, - IgxHierarchicalGridElementsComponent, + IgxGridComponent, + IgxTreeGridComponent, + IgxHierarchicalGridComponent, IgxPivotGridComponent, ], contentQueries: [], @@ -466,9 +465,9 @@ export var registerConfig = [ component: IgxGridToolbarComponent, selector: "igc-grid-toolbar", parents: [ - IgxGridElementsComponent, - IgxHierarchicalGridElementsComponent, - IgxTreeGridElementsComponent, + IgxGridComponent, + IgxHierarchicalGridComponent, + IgxTreeGridComponent, IgxPivotGridComponent, ], contentQueries: [ @@ -517,18 +516,18 @@ export var registerConfig = [ methods: [], }, { - component: IgxHierarchicalGridElementsComponent, + component: IgxHierarchicalGridComponent, selector: "igc-hierarchical-grid", parents: [], contentQueries: [ { property: "childLayoutList", - childType: IgxRowIslandElementsComponent, + childType: IgxRowIslandComponent, isQueryList: true, }, { property: "allLayoutList", - childType: IgxRowIslandElementsComponent, + childType: IgxRowIslandComponent, isQueryList: true, descendants: true, }, @@ -697,9 +696,10 @@ export var registerConfig = [ component: IgxPaginatorComponent, selector: "igc-paginator", parents: [ - IgxGridElementsComponent, - IgxHierarchicalGridElementsComponent, - IgxTreeGridElementsComponent, + IgxGridComponent, + IgxHierarchicalGridComponent, + IgxTreeGridComponent, + IgxHierarchicalGridComponent, IgxPivotGridComponent, ], contentQueries: [], @@ -875,145 +875,19 @@ export var registerConfig = [ component: IgxRowIslandComponent, selector: "igc-row-island", parents: [ - IgxGridElementsComponent, - IgxHierarchicalGridElementsComponent, - IgxRowIslandElementsComponent, - ], - contentQueries: [], - additionalProperties: [ - { name: "rowIslandAPI", writable: true }, - { name: "gridAPI", writable: true }, - { name: "navigation", writable: true }, - { name: "validation" }, - { name: "cdr" }, - { name: "shouldGenerate", writable: true }, - { name: "rowList" }, - { name: "dataRowList" }, - { name: "transactions" }, - { name: "nativeElement" }, - { name: "defaultRowHeight" }, - { name: "columns" }, - { name: "pinnedRows" }, - ], - methods: [ - "isRecordPinnedByIndex", - "toggleColumnVisibility", - "expandAll", - "collapseAll", - "expandRow", - "collapseRow", - "toggleRow", - "getHeaderGroupWidth", - "getColumnByName", - "getColumnByVisibleIndex", - "recalculateAutoSizes", - "moveColumn", - "markForCheck", - "addRow", - "deleteRow", - "updateCell", - "updateRow", - "getRowData", - "sort", - "filter", - "filterGlobal", - "enableSummaries", - "disableSummaries", - "clearFilter", - "clearSort", - "pinColumn", - "unpinColumn", - "pinRow", - "unpinRow", - "findNext", - "findPrev", - "refreshSearch", - "clearSearch", - "getPinnedStartWidth", - "getPinnedEndWidth", - "selectRows", - "deselectRows", - "selectAllRows", - "deselectAllRows", - "clearCellSelection", - "selectRange", - "getSelectedRanges", - "getSelectedData", - "selectedColumns", - "selectColumns", - "deselectColumns", - "deselectAllColumns", - "selectAllColumns", - "getSelectedColumnsData", - "navigateTo", - "getNextCell", - "getPreviousCell", - "openAdvancedFilteringDialog", - "closeAdvancedFilteringDialog", - "endEdit", - "beginAddRowById", - "beginAddRowByIndex", - ], - templateProps: [ - "toolbarTemplate", - "paginatorTemplate", - "emptyGridTemplate", - "addRowEmptyTemplate", - "loadingGridTemplate", - "dragGhostCustomTemplate", - "rowEditTextTemplate", - "rowAddTextTemplate", - "rowEditActionsTemplate", - "rowExpandedIndicatorTemplate", - "rowCollapsedIndicatorTemplate", - "headerExpandedIndicatorTemplate", - "headerCollapsedIndicatorTemplate", - "excelStyleHeaderIconTemplate", - "sortAscendingHeaderIconTemplate", - "sortDescendingHeaderIconTemplate", - "sortHeaderIconTemplate", - "headSelectorTemplate", - "rowSelectorTemplate", - "dragIndicatorIconTemplate", - ], - numericProps: [ - "snackbarDisplayTime", - "summaryRowHeight", - "rowHeight", - "totalRecords", - ], - boolProps: [ - "expandChildren", - "showExpandAll", - "autoGenerate", - "moving", - "hideRowSelectors", - "rowDraggable", - "rowEditable", - "isLoading", - "allowFiltering", - "allowAdvancedFiltering", - "showSummaryOnCollapse", - "selectRowOnClick", - ], - }, - { - component: IgxRowIslandElementsComponent, - selector: "igc-row-island", - parents: [ - IgxGridElementsComponent, - IgxHierarchicalGridElementsComponent, - IgxRowIslandElementsComponent, + IgxGridComponent, + IgxHierarchicalGridComponent, + IgxRowIslandComponent, ], contentQueries: [ { property: "childLayoutList", - childType: IgxRowIslandElementsComponent, + childType: IgxRowIslandComponent, isQueryList: true, }, { property: "children", - childType: IgxRowIslandElementsComponent, + childType: IgxRowIslandComponent, isQueryList: true, }, { @@ -1153,7 +1027,7 @@ export var registerConfig = [ ], }, { - component: IgxTreeGridElementsComponent, + component: IgxTreeGridComponent, selector: "igc-tree-grid", parents: [], contentQueries: [ diff --git a/projects/igniteui-angular-elements/src/app/components.ts b/projects/igniteui-angular-elements/src/app/components.ts index 7d19d8163d3..bf03a9a84c0 100644 --- a/projects/igniteui-angular-elements/src/app/components.ts +++ b/projects/igniteui-angular-elements/src/app/components.ts @@ -2,7 +2,7 @@ import { NgElement, WithProperties } from '@angular/elements'; import { registerConfig } from "../analyzer/elements.config"; import { createIgxCustomElement, withRegister } from './create-custom-element'; import { IgxGridStateComponent } from '../lib/state.component'; -import { IgxGridElementsComponent } from '../lib/grids/grid.component'; +import { IgxGridComponent } from '../lib/grids/grid.component'; import { IgxIconBroadcastService } from '../lib/icon.broadcast.service'; import { injector } from '../utils/injector-ref'; import { registerComponent } from '../utils/register'; @@ -11,24 +11,24 @@ import { IgxActionStripComponent } from 'igniteui-angular/action-strip'; import { IgxPivotDataSelectorComponent, IgxPivotGridComponent } from 'igniteui-angular/grids/pivot-grid'; import { GridType, IgxColumnComponent, IgxColumnGroupComponent, IgxColumnLayoutComponent, IgxGridEditingActionsComponent, IgxGridPinningActionsComponent, IgxGridToolbarActionsComponent, IgxGridToolbarAdvancedFilteringComponent, IgxGridToolbarComponent, IgxGridToolbarExporterComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxGridToolbarTitleComponent } from 'igniteui-angular/grids/core'; import { IgxQueryBuilderComponent, IgxQueryBuilderHeaderComponent } from 'igniteui-angular/query-builder'; -import { IgxHierarchicalGridElementsComponent } from '../lib/grids/hierarchical-grid.component'; -import { IgxRowIslandElementsComponent } from '../lib/grids/row-island.component'; -import { IgxTreeGridElementsComponent } from '../lib/grids/tree-grid.component'; +import { IgxHierarchicalGridComponent } from '../lib/grids/hierarchical-grid.component'; +import { IgxRowIslandComponent } from '../lib/grids/row-island.component'; +import { IgxTreeGridComponent } from '../lib/grids/tree-grid.component'; // force-create icon service, TODO: move to initializer or register/define mechanic to avoid side-effect? const _iconBroadcast: IgxIconBroadcastService = injector.get(IgxIconBroadcastService); -const grid = createIgxCustomElement(IgxGridElementsComponent, { injector, registerConfig }); +const grid = createIgxCustomElement(IgxGridComponent, { injector, registerConfig }); const IgcGridComponent = withRegister(grid, () => { registerComponent(IgcGridComponent) }); -const treeGrid = createIgxCustomElement(IgxTreeGridElementsComponent, { injector, registerConfig }); +const treeGrid = createIgxCustomElement(IgxTreeGridComponent, { injector, registerConfig }); const IgcTreeGridComponent = withRegister(treeGrid, () => { registerComponent(IgcTreeGridComponent) }); -const hGrid = createIgxCustomElement(IgxHierarchicalGridElementsComponent, { injector, registerConfig }); +const hGrid = createIgxCustomElement(IgxHierarchicalGridComponent, { injector, registerConfig }); const IgcHierarchicalGridComponent = withRegister(hGrid, () => { registerComponent(IgcHierarchicalGridComponent) }); @@ -43,7 +43,7 @@ const IgcPivotDataSelectorComponent = withRegister(pivotDataSelector, () => { registerComponent(IgcPivotDataSelectorComponent) }); -const rowIsland = createIgxCustomElement(IgxRowIslandElementsComponent, { injector, registerConfig }); +const rowIsland = createIgxCustomElement(IgxRowIslandComponent, { injector, registerConfig }); const IgcRowIslandComponent = withRegister(rowIsland, () => { registerComponent(IgcRowIslandComponent) }); @@ -161,7 +161,7 @@ export { // TODO: Custom elements JSON as well declare global { type IgxGridElement = NgElement & WithProperties; - type IgxTreeGridElement = NgElement & WithProperties; + type IgxTreeGridElement = NgElement & WithProperties; interface HTMLElementTagNameMap { 'igc-grid': NgElement & WithProperties; 'igc-tree-grid': NgElement & WithProperties; diff --git a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts index bfbb601342d..aa5e5c2492b 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts @@ -42,7 +42,7 @@ import { IgxCircularProgressBarComponent } from 'igniteui-angular/progressbar'; import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { IColumnsAutoGeneratedEventArgs } from './events'; -import { IgxGridComponent } from 'igniteui-angular/grids/grid/src/grid.component'; +import { IgxGridComponent as IgxGrid } from 'igniteui-angular/grids/grid/src/grid.component'; import { takeUntil } from 'rxjs'; /* blazorAlternateName: Grid */ @@ -82,7 +82,7 @@ import { takeUntil } from 'rxjs'; IgxGridSelectionService, IgxGridValidationService, { provide: IGX_GRID_SERVICE_BASE, useClass: IgxGridAPIService }, - { provide: IGX_GRID_BASE, useExisting: IgxGridElementsComponent }, + { provide: IGX_GRID_BASE, useExisting: IgxGridComponent }, IgxFilteringService, IgxColumnResizingService, IgxForOfSyncService, @@ -133,7 +133,7 @@ import { takeUntil } from 'rxjs'; templateUrl: '../../../../igniteui-angular/grids/grid/src/grid.component.html', schemas: [CUSTOM_ELEMENTS_SCHEMA] }) -export class IgxGridElementsComponent extends IgxGridComponent { +export class IgxGridComponent extends IgxGrid { constructor() { super(); diff --git a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts index 8f40e1ec474..8a711901c55 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts @@ -29,8 +29,8 @@ import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { IgxActionStripToken, IgxOverlayOutletDirective } from 'igniteui-angular/core'; import { IgxGridCellMergePipe, IgxGridFilteringPipe, IgxGridSortingPipe, IgxGridUnmergeActivePipe } from 'igniteui-angular/grids/grid'; -import { IgxChildGridRowComponent, IgxHierarchicalGridComponent } from 'igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component'; -import { IgxRowIslandElementsComponent } from './row-island.component'; +import { IgxChildGridRowComponent, IgxHierarchicalGridComponent as IgxHierarchicalGrid } from 'igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component'; +import { IgxRowIslandComponent } from './row-island.component'; import { IColumnsAutoGeneratedEventArgs } from './events'; @@ -66,7 +66,7 @@ import { IColumnsAutoGeneratedEventArgs } from './events'; IgxGridValidationService, IgxGridSelectionService, { provide: IGX_GRID_SERVICE_BASE, useClass: IgxHierarchicalGridAPIService }, - { provide: IGX_GRID_BASE, useExisting: IgxHierarchicalGridElementsComponent }, + { provide: IGX_GRID_BASE, useExisting: IgxHierarchicalGridComponent }, IgxGridSummaryService, IgxFilteringService, IgxGridNavigationService, @@ -116,7 +116,7 @@ import { IColumnsAutoGeneratedEventArgs } from './events'; ], schemas: [CUSTOM_ELEMENTS_SCHEMA] }) -export class IgxHierarchicalGridElementsComponent extends IgxHierarchicalGridComponent { +export class IgxHierarchicalGridComponent extends IgxHierarchicalGrid { constructor() { super(); @@ -129,14 +129,14 @@ export class IgxHierarchicalGridElementsComponent extends IgxHierarchicalGridCom /* blazorTreatAsCollection */ /* blazorCollectionName: RowIslandCollection */ /* ngQueryListName: childLayoutList */ - @ContentChildren(IgxRowIslandElementsComponent, { read: IgxRowIslandElementsComponent, descendants: false }) - public override childLayoutList: QueryList; + @ContentChildren(IgxRowIslandComponent, { read: IgxRowIslandComponent, descendants: false }) + public override childLayoutList: QueryList; /** * @hidden */ - @ContentChildren(IgxRowIslandElementsComponent, { read: IgxRowIslandElementsComponent, descendants: true }) - public override allLayoutList: QueryList; + @ContentChildren(IgxRowIslandComponent, { read: IgxRowIslandComponent, descendants: true }) + public override allLayoutList: QueryList; @Output() public columnsAutogenerated = new EventEmitter(); diff --git a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts index 0d6f76a0516..a08f4daf775 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts @@ -11,7 +11,7 @@ /* contentParent: HierarchicalGrid */ import { ChangeDetectionStrategy, Component, ContentChildren, EventEmitter, forwardRef, Input, Output, QueryList } from '@angular/core'; -import { IgxRowIslandComponent } from 'igniteui-angular/grids/hierarchical-grid/src/row-island.component'; +import { IgxRowIslandComponent as IgxRowIsland } from 'igniteui-angular/grids/hierarchical-grid/src/row-island.component'; import { IgxFilteringService } from 'igniteui-angular/grids/core'; import { IgxRowIslandAPIService } from 'igniteui-angular/grids/hierarchical-grid/src/row-island-api.service'; import { IgxGridSelectionService } from 'igniteui-angular/grids/core'; @@ -22,7 +22,7 @@ import { IgxActionStripToken } from 'igniteui-angular/core'; * Row island * * @igxModule IgxHierarchicalGridModule - * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxRowIslandElementsComponent + * @igxParent IgxGridComponent, IgxHierarchicalGridComponent, IgxRowIslandComponent * */ @Component({ @@ -39,20 +39,20 @@ import { IgxActionStripToken } from 'igniteui-angular/core'; ], standalone: true }) -export class IgxRowIslandElementsComponent extends IgxRowIslandComponent { +export class IgxRowIslandComponent extends IgxRowIsland { /* contentChildren */ /* blazorTreatAsCollection */ /* blazorCollectionName: RowIslandCollection */ /* ngQueryListName: childLayoutList */ - @ContentChildren(IgxRowIslandElementsComponent, { read: IgxRowIslandElementsComponent, descendants: false }) - public override childLayoutList: QueryList; + @ContentChildren(IgxRowIslandComponent, { read: IgxRowIslandComponent, descendants: false }) + public override childLayoutList: QueryList; /** * @hidden */ - @ContentChildren(forwardRef(() => IgxRowIslandElementsComponent), { read: IgxRowIslandElementsComponent, descendants: false }) - public override children = new QueryList(); + @ContentChildren(forwardRef(() => IgxRowIslandComponent), { read: IgxRowIslandComponent, descendants: false }) + public override children = new QueryList(); @Output() public columnsAutogenerated = new EventEmitter(); diff --git a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts index 3ab7fc76d4e..3744e24e0b9 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts @@ -36,7 +36,7 @@ import { IgxButtonDirective, IgxForOfScrollSyncService, IgxForOfSyncService, Igx import { IgxCircularProgressBarComponent } from 'igniteui-angular/progressbar'; import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; import { IgxIconComponent } from 'igniteui-angular/icon'; -import { IgxTreeGridComponent } from 'igniteui-angular/grids/tree-grid/src/tree-grid.component'; +import { IgxTreeGridComponent as IgxTreeGrid } from 'igniteui-angular/grids/tree-grid/src/tree-grid.component'; import { IColumnsAutoGeneratedEventArgs } from './events'; import { takeUntil } from 'rxjs'; @@ -83,7 +83,7 @@ import { takeUntil } from 'rxjs'; IgxGridNavigationService, { provide: IgxGridSelectionService, useClass: IgxTreeGridSelectionService }, { provide: IGX_GRID_SERVICE_BASE, useClass: IgxTreeGridAPIService }, - { provide: IGX_GRID_BASE, useExisting: IgxTreeGridElementsComponent }, + { provide: IGX_GRID_BASE, useExisting: IgxTreeGridComponent }, IgxFilteringService, IgxColumnResizingService, IgxForOfSyncService, @@ -131,7 +131,7 @@ import { takeUntil } from 'rxjs'; ], schemas: [CUSTOM_ELEMENTS_SCHEMA] }) -export class IgxTreeGridElementsComponent extends IgxTreeGridComponent { +export class IgxTreeGridComponent extends IgxTreeGrid { constructor() { super(); this.selectionService.selectedRowsChange.pipe(takeUntil(this.destroy$)).subscribe((args: any[]) => { diff --git a/projects/igniteui-angular-elements/src/lib/state.component.ts b/projects/igniteui-angular-elements/src/lib/state.component.ts index a5ec4b46704..f5b142bf575 100644 --- a/projects/igniteui-angular-elements/src/lib/state.component.ts +++ b/projects/igniteui-angular-elements/src/lib/state.component.ts @@ -35,7 +35,7 @@ export interface IGridStateInfo { /* jsonAPIManageCollectionInMarkup */ /** * State component allows saving and restoring the state of the grid features. - * @igxParent IgxGridElementsComponent, IgxTreeGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxPivotGridComponent, * + * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, * */ @Component({ selector: 'igx-grid-state', diff --git a/projects/igniteui-angular/action-strip/src/action-strip/action-strip.component.ts b/projects/igniteui-angular/action-strip/src/action-strip/action-strip.component.ts index 659c5eb4358..ce8a22d23b4 100644 --- a/projects/igniteui-angular/action-strip/src/action-strip/action-strip.component.ts +++ b/projects/igniteui-angular/action-strip/src/action-strip/action-strip.component.ts @@ -65,7 +65,7 @@ export class IgxActionStripMenuItemDirective { * * @igxGroup Data Entry & Display * - * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridElementsComponent, IgxRowIslandElementsComponent, * + * @igxParent IgxGridComponent, IgxHierarchicalGridComponent, IgxTreeGridComponent, IgxRowIslandComponent, * * * @remarks * The Ignite UI Action Strip is a container, overlaying its parent container, diff --git a/projects/igniteui-angular/grids/core/src/columns/column-group.component.ts b/projects/igniteui-angular/grids/core/src/columns/column-group.component.ts index 80c2ca3dcc2..669c4ee995b 100644 --- a/projects/igniteui-angular/grids/core/src/columns/column-group.component.ts +++ b/projects/igniteui-angular/grids/core/src/columns/column-group.component.ts @@ -24,7 +24,7 @@ import { CellType, IgxColumnTemplateContext } from '../common/grid.interface'; /** * **Ignite UI for Angular Column Group** * - * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridElementsComponent, IgxColumnGroupComponent, IgxRowIslandElementsComponent + * @igxParent IgxGridComponent, IgxHierarchicalGridComponent, IgxTreeGridComponent, IgxColumnGroupComponent, IgxRowIslandComponent */ @Component({ changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/projects/igniteui-angular/grids/core/src/columns/column-layout.component.ts b/projects/igniteui-angular/grids/core/src/columns/column-layout.component.ts index 10e72ef3e77..86781e45269 100644 --- a/projects/igniteui-angular/grids/core/src/columns/column-layout.component.ts +++ b/projects/igniteui-angular/grids/core/src/columns/column-layout.component.ts @@ -18,7 +18,7 @@ import { IgxColumnGroupComponent } from './column-group.component'; /** * Column layout for declaration of Multi-row Layout * - * @igxParent IgxGridElementsComponent + * @igxParent IgxGridComponent */ @Component({ changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/projects/igniteui-angular/grids/core/src/columns/column.component.ts b/projects/igniteui-angular/grids/core/src/columns/column.component.ts index 38b447f512b..668f7d32222 100644 --- a/projects/igniteui-angular/grids/core/src/columns/column.component.ts +++ b/projects/igniteui-angular/grids/core/src/columns/column.component.ts @@ -45,7 +45,7 @@ const DEFAULT_DIGITS_INFO = '1.0-3'; * filtering & editing are enabled at the column level. You can also provide a template containing custom content inside * the column using `ng-template` which will be used for all cells within the column. * - * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridElementsComponent, IgxPivotGridComponent, IgxRowIslandElementsComponent, IgxColumnGroupComponent, IgxColumnLayoutComponent, + * @igxParent IgxGridComponent, IgxHierarchicalGridComponent, IgxTreeGridComponent, IgxPivotGridComponent, IgxRowIslandComponent, IgxColumnGroupComponent, IgxColumnLayoutComponent, */ @Component({ changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/projects/igniteui-angular/grids/core/src/toolbar/grid-toolbar.component.ts b/projects/igniteui-angular/grids/core/src/toolbar/grid-toolbar.component.ts index 03f4535034b..9b94dde5e1f 100644 --- a/projects/igniteui-angular/grids/core/src/toolbar/grid-toolbar.component.ts +++ b/projects/igniteui-angular/grids/core/src/toolbar/grid-toolbar.component.ts @@ -22,7 +22,7 @@ import { IgxIconService } from 'igniteui-angular/icon'; * Provides a context-aware container component for UI operations for the grid components. * * @igxModule IgxGridToolbarModule - * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridElementsComponent, IgxPivotGridComponent, + * @igxParent IgxGridComponent, IgxHierarchicalGridComponent, IgxTreeGridComponent, IgxPivotGridComponent, * */ @Component({ diff --git a/projects/igniteui-angular/grids/hierarchical-grid/src/row-island.component.ts b/projects/igniteui-angular/grids/hierarchical-grid/src/row-island.component.ts index 2506649b17b..f48bf7bad6e 100644 --- a/projects/igniteui-angular/grids/hierarchical-grid/src/row-island.component.ts +++ b/projects/igniteui-angular/grids/hierarchical-grid/src/row-island.component.ts @@ -45,7 +45,7 @@ import { IForOfState } from 'igniteui-angular/directives'; * Row island * * @igxModule IgxHierarchicalGridModule - * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxRowIslandElementsComponent + * @igxParent IgxGridComponent, IgxHierarchicalGridComponent, IgxRowIslandComponent * */ @Component({ diff --git a/projects/igniteui-angular/paginator/src/paginator/paginator.component.ts b/projects/igniteui-angular/paginator/src/paginator/paginator.component.ts index 9d08d30a453..f9fd576d133 100644 --- a/projects/igniteui-angular/paginator/src/paginator/paginator.component.ts +++ b/projects/igniteui-angular/paginator/src/paginator/paginator.component.ts @@ -37,7 +37,7 @@ export class IgxPaginatorContentDirective { /* jsonAPIManageCollectionInMarkup */ /** * Paginator component description - * @igxParent IgxGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxTreeGridElementsComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, * + * @igxParent IgxGridComponent, IgxHierarchicalGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, * */ @Component({ selector: 'igx-paginator', From 9648222cb8e24228b6407741cb926a66973b0a86 Mon Sep 17 00:00:00 2001 From: MKirova Date: Mon, 6 Apr 2026 13:55:30 +0300 Subject: [PATCH 21/28] chore(*): apply review comments --- .../src/analyzer/elements.config.ts | 7 +------ .../src/lib/grids/hierarchical-grid.component.ts | 5 +++++ .../src/lib/grids/row-island.component.ts | 2 +- .../igniteui-angular/grids/grid/src/grid-base.directive.ts | 2 +- .../grids/hierarchical-grid/src/row-island.component.ts | 2 +- 5 files changed, 9 insertions(+), 9 deletions(-) diff --git a/projects/igniteui-angular-elements/src/analyzer/elements.config.ts b/projects/igniteui-angular-elements/src/analyzer/elements.config.ts index b76e3f4fa34..9ec24bcf15e 100644 --- a/projects/igniteui-angular-elements/src/analyzer/elements.config.ts +++ b/projects/igniteui-angular-elements/src/analyzer/elements.config.ts @@ -557,7 +557,6 @@ export var registerConfig = [ }, ], additionalProperties: [ - { name: "childLayoutList", writable: true }, { name: "foreignKey" }, { name: "selectedCells" }, { name: "gridAPI", writable: true }, @@ -874,11 +873,7 @@ export var registerConfig = [ { component: IgxRowIslandComponent, selector: "igc-row-island", - parents: [ - IgxGridComponent, - IgxHierarchicalGridComponent, - IgxRowIslandComponent, - ], + parents: [IgxHierarchicalGridComponent, IgxRowIslandComponent], contentQueries: [ { property: "childLayoutList", diff --git a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts index 8a711901c55..f5799ddb7bf 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts @@ -125,6 +125,11 @@ export class IgxHierarchicalGridComponent extends IgxHierarchicalGrid { }); } + /** + * @hidden + * @internal + */ + /* blazorInclude */ /* contentChildren */ /* blazorTreatAsCollection */ /* blazorCollectionName: RowIslandCollection */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts index a08f4daf775..f8d3ba6b7dc 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts @@ -22,7 +22,7 @@ import { IgxActionStripToken } from 'igniteui-angular/core'; * Row island * * @igxModule IgxHierarchicalGridModule - * @igxParent IgxGridComponent, IgxHierarchicalGridComponent, IgxRowIslandComponent + * @igxParent IgxHierarchicalGridComponent, IgxRowIslandComponent * */ @Component({ diff --git a/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts b/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts index a939e522117..ae5b2bf6b31 100644 --- a/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts +++ b/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts @@ -1160,7 +1160,7 @@ export abstract class IgxGridBaseDirective implements GridType, /** @hidden @internal */ @ContentChild(IgxActionStripToken) - public actionStripComponent: IgxActionStripToken; + protected actionStripComponent: IgxActionStripToken; /** @hidden @internal */ public get actionStrip() { diff --git a/projects/igniteui-angular/grids/hierarchical-grid/src/row-island.component.ts b/projects/igniteui-angular/grids/hierarchical-grid/src/row-island.component.ts index f48bf7bad6e..37c33c96a6e 100644 --- a/projects/igniteui-angular/grids/hierarchical-grid/src/row-island.component.ts +++ b/projects/igniteui-angular/grids/hierarchical-grid/src/row-island.component.ts @@ -45,7 +45,7 @@ import { IForOfState } from 'igniteui-angular/directives'; * Row island * * @igxModule IgxHierarchicalGridModule - * @igxParent IgxGridComponent, IgxHierarchicalGridComponent, IgxRowIslandComponent + * @igxParent IgxHierarchicalGridComponent, IgxRowIslandComponent * */ @Component({ From 1a3fd79a1f705d023ba4c63f7297aa8602c0c1e4 Mon Sep 17 00:00:00 2001 From: MKirova Date: Mon, 6 Apr 2026 16:16:59 +0300 Subject: [PATCH 22/28] chore(*): Move comments to correct place. --- .../src/lib/grids/row-island.component.ts | 17 ++++++++--------- 1 file changed, 8 insertions(+), 9 deletions(-) diff --git a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts index f8d3ba6b7dc..22607127b40 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts @@ -1,3 +1,11 @@ +import { ChangeDetectionStrategy, Component, ContentChildren, EventEmitter, forwardRef, Input, Output, QueryList } from '@angular/core'; +import { IgxRowIslandComponent as IgxRowIsland } from 'igniteui-angular/grids/hierarchical-grid/src/row-island.component'; +import { IgxFilteringService } from 'igniteui-angular/grids/core'; +import { IgxRowIslandAPIService } from 'igniteui-angular/grids/hierarchical-grid/src/row-island-api.service'; +import { IgxGridSelectionService } from 'igniteui-angular/grids/core'; +import { IColumnsAutoGeneratedEventArgs } from './events'; +import { IgxActionStripToken } from 'igniteui-angular/core'; + /* blazorCopyInheritedMembers */ /* blazorElement */ /* wcElementTag: igc-row-island */ @@ -9,15 +17,6 @@ /* additionalIdentifier: ChildDataKey */ /* contentParent: RowIsland */ /* contentParent: HierarchicalGrid */ - -import { ChangeDetectionStrategy, Component, ContentChildren, EventEmitter, forwardRef, Input, Output, QueryList } from '@angular/core'; -import { IgxRowIslandComponent as IgxRowIsland } from 'igniteui-angular/grids/hierarchical-grid/src/row-island.component'; -import { IgxFilteringService } from 'igniteui-angular/grids/core'; -import { IgxRowIslandAPIService } from 'igniteui-angular/grids/hierarchical-grid/src/row-island-api.service'; -import { IgxGridSelectionService } from 'igniteui-angular/grids/core'; -import { IColumnsAutoGeneratedEventArgs } from './events'; -import { IgxActionStripToken } from 'igniteui-angular/core'; - /** * Row island * From 804680dc31adecbea55b8754a8d61636e0b6f852 Mon Sep 17 00:00:00 2001 From: skrustev Date: Tue, 7 Apr 2026 10:30:07 +0300 Subject: [PATCH 23/28] fix(elements): Apply wc alternate name tag instead. --- .../igniteui-angular-elements/src/lib/grids/grid.component.ts | 1 - .../src/lib/grids/hierarchical-grid.component.ts | 2 -- .../src/lib/grids/row-island.component.ts | 1 - .../src/lib/grids/tree-grid.component.ts | 1 - projects/igniteui-angular/grids/grid/src/grid.component.ts | 2 +- .../grids/hierarchical-grid/src/hierarchical-grid.component.ts | 2 +- .../grids/hierarchical-grid/src/row-island.component.ts | 2 +- .../igniteui-angular/grids/tree-grid/src/tree-grid.component.ts | 2 +- 8 files changed, 4 insertions(+), 9 deletions(-) diff --git a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts index aa5e5c2492b..ce940b2c050 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts @@ -45,7 +45,6 @@ import { IColumnsAutoGeneratedEventArgs } from './events'; import { IgxGridComponent as IgxGrid } from 'igniteui-angular/grids/grid/src/grid.component'; import { takeUntil } from 'rxjs'; -/* blazorAlternateName: Grid */ /* blazorAdditionalDependency: Column */ /* blazorAdditionalDependency: ColumnGroup */ /* blazorAdditionalDependency: ColumnLayout */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts index f5799ddb7bf..d7a662d81f7 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts @@ -33,8 +33,6 @@ import { IgxChildGridRowComponent, IgxHierarchicalGridComponent as IgxHierarchic import { IgxRowIslandComponent } from './row-island.component'; import { IColumnsAutoGeneratedEventArgs } from './events'; - -/* blazorAlternateName: HierarchicalGrid */ /* blazorAdditionalDependency: Column */ /* blazorAdditionalDependency: ColumnGroup */ /* blazorAdditionalDependency: ColumnLayout */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts index 22607127b40..dba8db93f18 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts @@ -12,7 +12,6 @@ import { IgxActionStripToken } from 'igniteui-angular/core'; /* blazorIndirectRender */ /* jsonAPIManageCollectionInMarkup */ /* jsonAPIManageItemInMarkup */ -/* blazorAlternateName: RowIsland */ /* mustUseNGParentAnchor */ /* additionalIdentifier: ChildDataKey */ /* contentParent: RowIsland */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts index 3744e24e0b9..1e213baadbc 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts @@ -40,7 +40,6 @@ import { IgxTreeGridComponent as IgxTreeGrid } from 'igniteui-angular/grids/tree import { IColumnsAutoGeneratedEventArgs } from './events'; import { takeUntil } from 'rxjs'; -/* blazorAlternateName: TreeGrid */ /* blazorAdditionalDependency: Column */ /* blazorAdditionalDependency: ColumnGroup */ /* blazorAdditionalDependency: ColumnLayout */ diff --git a/projects/igniteui-angular/grids/grid/src/grid.component.ts b/projects/igniteui-angular/grids/grid/src/grid.component.ts index 54729b75d23..5395e287d0f 100644 --- a/projects/igniteui-angular/grids/grid/src/grid.component.ts +++ b/projects/igniteui-angular/grids/grid/src/grid.component.ts @@ -70,7 +70,7 @@ export interface IGroupingDoneEventArgs extends IBaseEventArgs { ungroupedColumns: Array | IgxColumnComponent; } -/* blazorAlternateName: GridBase */ +/* wcAlternateName: GridBase */ /* blazorIndirectRender blazorComponent omitModule diff --git a/projects/igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component.ts b/projects/igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component.ts index 70612da4a9f..d729e025ecc 100644 --- a/projects/igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component.ts +++ b/projects/igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component.ts @@ -246,7 +246,7 @@ export class IgxChildGridRowComponent implements AfterViewInit, OnInit { } } -/* blazorAlternateName: HierarchicalGridBase */ +/* wcAlternateName: HierarchicalGridBase */ /* blazorIndirectRender blazorComponent omitModule diff --git a/projects/igniteui-angular/grids/hierarchical-grid/src/row-island.component.ts b/projects/igniteui-angular/grids/hierarchical-grid/src/row-island.component.ts index 37c33c96a6e..44bbb538807 100644 --- a/projects/igniteui-angular/grids/hierarchical-grid/src/row-island.component.ts +++ b/projects/igniteui-angular/grids/hierarchical-grid/src/row-island.component.ts @@ -36,7 +36,7 @@ import { IGridCreatedEventArgs } from './events'; import { IgxPaginatorComponent, IgxPaginatorDirective } from 'igniteui-angular/paginator'; import { IForOfState } from 'igniteui-angular/directives'; -/* blazorAlternateName: RowIslandBase */ +/* wcAlternateName: RowIslandBase */ /* blazorIndirectRender blazorComponent omitModule diff --git a/projects/igniteui-angular/grids/tree-grid/src/tree-grid.component.ts b/projects/igniteui-angular/grids/tree-grid/src/tree-grid.component.ts index 39b94927378..e98274769d5 100644 --- a/projects/igniteui-angular/grids/tree-grid/src/tree-grid.component.ts +++ b/projects/igniteui-angular/grids/tree-grid/src/tree-grid.component.ts @@ -54,7 +54,7 @@ import { IgxTreeGridGroupByAreaComponent } from './tree-grid-group-by-area.compo let NEXT_ID = 0; -/* blazorAlternateName: TreeGridBase */ +/* wcAlternateName: TreeGridBase */ /* blazorIndirectRender blazorComponent omitModule From 2257b3c5d01284f02651750f6cdea1f5b794e795 Mon Sep 17 00:00:00 2001 From: MKirova Date: Thu, 9 Apr 2026 15:47:43 +0300 Subject: [PATCH 24/28] chore(*): Make sure elements specific events re-emit for row island. --- .../igniteui-angular-elements/src/index.html | 3 + .../lib/grids/hierarchical-grid.component.ts | 82 ++++++++++++++++++- .../src/hierarchical-grid.component.ts | 4 +- 3 files changed, 85 insertions(+), 4 deletions(-) diff --git a/projects/igniteui-angular-elements/src/index.html b/projects/igniteui-angular-elements/src/index.html index 8985cbd96a1..b5ef372b9a0 100644 --- a/projects/igniteui-angular-elements/src/index.html +++ b/projects/igniteui-angular-elements/src/index.html @@ -527,6 +527,9 @@

Flat Grid (MRL column layout)

`; + virtualMachinesRowIsland.addEventListener('columnsAutogenerated', (e) => { + console.log('columns autogenerated for VirtualMachinesRowIsland', e); + }); diff --git a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts index d7a662d81f7..1b29aed6511 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts @@ -1,5 +1,5 @@ -import { ChangeDetectionStrategy, Component, ContentChildren, CUSTOM_ELEMENTS_SCHEMA, EventEmitter, Output, QueryList } from '@angular/core'; +import { ChangeDetectionStrategy, Component, ContentChildren, CUSTOM_ELEMENTS_SCHEMA, EventEmitter, Output, QueryList, reflectComponentType, ViewChildren } from '@angular/core'; import { NgClass, NgTemplateOutlet, NgStyle } from '@angular/common'; import { IgxHierarchicalGridAPIService } from 'igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid-api.service'; @@ -29,10 +29,82 @@ import { IgxSnackbarComponent } from 'igniteui-angular/snackbar'; import { IgxIconComponent } from 'igniteui-angular/icon'; import { IgxActionStripToken, IgxOverlayOutletDirective } from 'igniteui-angular/core'; import { IgxGridCellMergePipe, IgxGridFilteringPipe, IgxGridSortingPipe, IgxGridUnmergeActivePipe } from 'igniteui-angular/grids/grid'; -import { IgxChildGridRowComponent, IgxHierarchicalGridComponent as IgxHierarchicalGrid } from 'igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component'; +import { IgxChildGridRowComponent as IgxChildGridRow, IgxHierarchicalGridComponent as IgxHierarchicalGrid } from 'igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component'; import { IgxRowIslandComponent } from './row-island.component'; import { IColumnsAutoGeneratedEventArgs } from './events'; + +/** + * @hidden @internal + */ +@Component({ + changeDetection: ChangeDetectionStrategy.OnPush, + selector: 'igx-child-grid-row', + templateUrl: '../../../../igniteui-angular/grids/hierarchical-grid/src/child-grid-row.component.html', + imports: [NgClass] +}) +export class IgxChildGridRowComponent extends IgxChildGridRow { + + /** + * @hidden + */ + public override hGrid: IgxHierarchicalGridComponent; + + /** + * @hidden + */ + public override ngOnInit() { + const ref = this.container.createComponent(IgxHierarchicalGridComponent, { injector: this.container.injector }); + this.hGrid = ref.instance; + this.hGrid.setDataInternal(this.data.childGridsData[this.layout.key]); + this.hGrid.nativeElement["__componentRef"] = ref; + this.layout.layoutChange.subscribe((ch) => { + this._handleLayoutChanges(ch); + }); + const changes = this.layout.initialChanges; + changes.forEach(change => { + this._handleLayoutChanges(change); + }); + this.hGrid.parent = this.parentGrid; + this.hGrid.parentIsland = this.layout; + this.hGrid.childRow = this; + // handler logic that re-emits hgrid events on the row island + this.setupEventEmitters(); + this.layout.gridCreated.emit({ + owner: this.layout, + parentID: this.data.rowID, + grid: this.hGrid, + parentRowData: this.data.parentRowData, + }); + } + + protected override setupEventEmitters() { + const destructor = takeUntil(this.hGrid.destroy$); + // use wc type so that it includes elements specific events: childrenResolved, columnsAutogenerated, etc. + const mirror = reflectComponentType(IgxHierarchicalGridComponent); + // exclude outputs related to two-way binding functionality + const inputNames = mirror.inputs.map(input => input.propName); + const outputs = mirror.outputs.filter(o => { + const matchingInputPropName = o.propName.slice(0, o.propName.indexOf('Change')); + return inputNames.indexOf(matchingInputPropName) === -1; + }); + + // TODO: Skip the `rendered` output. Rendered should be called once per grid. + outputs.filter(o => o.propName !== 'rendered').forEach(output => { + if (this.hGrid[output.propName]) { + this.hGrid[output.propName].pipe(destructor).subscribe((args) => { + if (!args) { + args = {}; + } + args.owner = this.hGrid; + this.layout[output.propName].emit(args); + }); + } + }); + } + +} + /* blazorAdditionalDependency: Column */ /* blazorAdditionalDependency: ColumnGroup */ /* blazorAdditionalDependency: ColumnLayout */ @@ -123,6 +195,12 @@ export class IgxHierarchicalGridComponent extends IgxHierarchicalGrid { }); } + /** + * @hidden + */ + @ViewChildren(IgxChildGridRowComponent) + public override hierarchicalRows: QueryList; + /** * @hidden * @internal diff --git a/projects/igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component.ts b/projects/igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component.ts index d729e025ecc..2799d36fefc 100644 --- a/projects/igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component.ts +++ b/projects/igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component.ts @@ -211,7 +211,7 @@ export class IgxChildGridRowComponent implements AfterViewInit, OnInit { this.hGrid.cdr.detectChanges(); } - private setupEventEmitters() { + protected setupEventEmitters() { const destructor = takeUntil(this.hGrid.destroy$); const mirror = reflectComponentType(IgxGridComponent); @@ -237,7 +237,7 @@ export class IgxChildGridRowComponent implements AfterViewInit, OnInit { } - private _handleLayoutChanges(changes: SimpleChanges) { + protected _handleLayoutChanges(changes: SimpleChanges) { for (const change in changes) { if (changes.hasOwnProperty(change)) { this.hGrid[change] = changes[change].currentValue; From 14ce17e0a5695a57cdc2edd63d6bae154cea98ab Mon Sep 17 00:00:00 2001 From: MKirova Date: Thu, 9 Apr 2026 15:58:22 +0300 Subject: [PATCH 25/28] chore(*): Move actionStripComponents.changes to elements. --- .../src/lib/grids/grid.component.ts | 12 ++++++++++++ .../src/lib/grids/hierarchical-grid.component.ts | 12 ++++++++++++ .../src/lib/grids/tree-grid.component.ts | 12 ++++++++++++ .../grids/grid/src/grid-base.directive.ts | 6 ------ 4 files changed, 36 insertions(+), 6 deletions(-) diff --git a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts index ce940b2c050..91ebdfd67c3 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts @@ -141,6 +141,18 @@ export class IgxGridComponent extends IgxGrid { }); } + /** + * @hidden + */ + public override ngAfterContentInit() { + this.actionStripComponents.changes.pipe(takeUntil(this.destroy$)).subscribe(() => { + if (this.actionStrip) { + this.actionStrip.menuOverlaySettings.outlet = this.outlet; + } + }); + super.ngAfterContentInit(); + } + @Output() public columnsAutogenerated = new EventEmitter(); diff --git a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts index 1b29aed6511..dac6d26153c 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts @@ -195,6 +195,18 @@ export class IgxHierarchicalGridComponent extends IgxHierarchicalGrid { }); } + /** + * @hidden + */ + public override ngAfterContentInit() { + this.actionStripComponents.changes.pipe(takeUntil(this.destroy$)).subscribe(() => { + if (this.actionStrip) { + this.actionStrip.menuOverlaySettings.outlet = this.outlet; + } + }); + super.ngAfterContentInit(); + } + /** * @hidden */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts index 1e213baadbc..ea64b678d74 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts @@ -138,6 +138,18 @@ export class IgxTreeGridComponent extends IgxTreeGrid { }); } + /** + * @hidden + */ + public override ngAfterContentInit() { + this.actionStripComponents.changes.pipe(takeUntil(this.destroy$)).subscribe(() => { + if (this.actionStrip) { + this.actionStrip.menuOverlaySettings.outlet = this.outlet; + } + }); + super.ngAfterContentInit(); + } + @Output() public columnsAutogenerated = new EventEmitter(); diff --git a/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts b/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts index a391225ddaa..04afb2abc7b 100644 --- a/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts +++ b/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts @@ -4049,12 +4049,6 @@ export abstract class IgxGridBaseDirective implements GridType, this.setUpPaginator(); }); - this.actionStripComponents.changes.pipe(takeUntil(this.destroy$)).subscribe(() => { - if (this.actionStrip) { - this.actionStrip.menuOverlaySettings.outlet = this.outlet; - } - }); - if (this.actionStrip) { this.actionStrip.menuOverlaySettings.outlet = this.outlet; } From 31f6ffa6344f5faa407cb16acc02ff1eb4212ded Mon Sep 17 00:00:00 2001 From: MKirova Date: Thu, 9 Apr 2026 16:14:03 +0300 Subject: [PATCH 26/28] chore(*): revert Move actionStripComponents.changes to elements." --- .../src/lib/grids/grid.component.ts | 12 ------------ .../src/lib/grids/hierarchical-grid.component.ts | 12 ------------ .../src/lib/grids/tree-grid.component.ts | 12 ------------ .../grids/grid/src/grid-base.directive.ts | 6 ++++++ 4 files changed, 6 insertions(+), 36 deletions(-) diff --git a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts index 91ebdfd67c3..ce940b2c050 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts @@ -141,18 +141,6 @@ export class IgxGridComponent extends IgxGrid { }); } - /** - * @hidden - */ - public override ngAfterContentInit() { - this.actionStripComponents.changes.pipe(takeUntil(this.destroy$)).subscribe(() => { - if (this.actionStrip) { - this.actionStrip.menuOverlaySettings.outlet = this.outlet; - } - }); - super.ngAfterContentInit(); - } - @Output() public columnsAutogenerated = new EventEmitter(); diff --git a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts index dac6d26153c..1b29aed6511 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts @@ -195,18 +195,6 @@ export class IgxHierarchicalGridComponent extends IgxHierarchicalGrid { }); } - /** - * @hidden - */ - public override ngAfterContentInit() { - this.actionStripComponents.changes.pipe(takeUntil(this.destroy$)).subscribe(() => { - if (this.actionStrip) { - this.actionStrip.menuOverlaySettings.outlet = this.outlet; - } - }); - super.ngAfterContentInit(); - } - /** * @hidden */ diff --git a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts index ea64b678d74..1e213baadbc 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts @@ -138,18 +138,6 @@ export class IgxTreeGridComponent extends IgxTreeGrid { }); } - /** - * @hidden - */ - public override ngAfterContentInit() { - this.actionStripComponents.changes.pipe(takeUntil(this.destroy$)).subscribe(() => { - if (this.actionStrip) { - this.actionStrip.menuOverlaySettings.outlet = this.outlet; - } - }); - super.ngAfterContentInit(); - } - @Output() public columnsAutogenerated = new EventEmitter(); diff --git a/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts b/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts index 04afb2abc7b..a391225ddaa 100644 --- a/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts +++ b/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts @@ -4049,6 +4049,12 @@ export abstract class IgxGridBaseDirective implements GridType, this.setUpPaginator(); }); + this.actionStripComponents.changes.pipe(takeUntil(this.destroy$)).subscribe(() => { + if (this.actionStrip) { + this.actionStrip.menuOverlaySettings.outlet = this.outlet; + } + }); + if (this.actionStrip) { this.actionStrip.menuOverlaySettings.outlet = this.outlet; } From e350400952bd42b9eb5a75326e267839fe79f2f3 Mon Sep 17 00:00:00 2001 From: MKirova Date: Thu, 9 Apr 2026 16:16:57 +0300 Subject: [PATCH 27/28] chore(*): Move actionStripComponents back to base. --- .../igniteui-angular-elements/src/lib/grids/grid.component.ts | 2 +- .../src/lib/grids/hierarchical-grid.component.ts | 2 +- .../src/lib/grids/row-island.component.ts | 2 +- .../src/lib/grids/tree-grid.component.ts | 2 +- .../igniteui-angular/grids/grid/src/grid-base.directive.ts | 4 ++++ 5 files changed, 8 insertions(+), 4 deletions(-) diff --git a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts index ce940b2c050..c8ff0a578b0 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/grid.component.ts @@ -158,7 +158,7 @@ export class IgxGridComponent extends IgxGrid { /* blazorCollectionItemName: ActionStrip */ /* ngQueryListName: actionStripComponents */ @ContentChildren(IgxActionStripToken) - public actionStripComponents: QueryList; + public override actionStripComponents: QueryList; protected override autogenerateColumns() { super.autogenerateColumns(); diff --git a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts index 1b29aed6511..17e728b54df 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts @@ -236,7 +236,7 @@ export class IgxHierarchicalGridComponent extends IgxHierarchicalGrid { /* blazorCollectionItemName: ActionStrip */ /* ngQueryListName: actionStripComponents */ @ContentChildren(IgxActionStripToken) - public actionStripComponents: QueryList; + public override actionStripComponents: QueryList; protected override autogenerateColumns() { super.autogenerateColumns(); diff --git a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts index dba8db93f18..83b86a317b6 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts @@ -62,7 +62,7 @@ export class IgxRowIslandComponent extends IgxRowIsland { /* blazorCollectionItemName: ActionStrip */ /* ngQueryListName: actionStripComponents */ @ContentChildren(IgxActionStripToken, { read: IgxActionStripToken, descendants: false }) - protected actionStripComponents: QueryList; + protected override actionStripComponents: QueryList; protected override autogenerateColumns() { super.autogenerateColumns(); diff --git a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts index 1e213baadbc..f058ddd0af2 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts @@ -155,7 +155,7 @@ export class IgxTreeGridComponent extends IgxTreeGrid { /* blazorCollectionItemName: ActionStrip */ /* ngQueryListName: actionStripComponents */ @ContentChildren(IgxActionStripToken) - public actionStripComponents: QueryList; + public override actionStripComponents: QueryList; protected override autogenerateColumns() { super.autogenerateColumns(); diff --git a/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts b/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts index a391225ddaa..5850cfa314e 100644 --- a/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts +++ b/projects/igniteui-angular/grids/grid/src/grid-base.directive.ts @@ -1612,6 +1612,10 @@ export abstract class IgxGridBaseDirective implements GridType, return this._sortAscendingHeaderIconTemplate; } + /** @hidden @internal */ + @ContentChildren(IgxActionStripToken) + public actionStripComponents: QueryList; + /** * Sets a custom template that should be used when rendering a header sorting indicator when columns are sorted in asc order. *```html From e4fada2ef63c50ef33f162d72f2af4589487531a Mon Sep 17 00:00:00 2001 From: MKirova Date: Thu, 9 Apr 2026 16:32:42 +0300 Subject: [PATCH 28/28] fix(row-island): change actionStripComponents visibility to public. --- .../src/lib/grids/row-island.component.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts index 83b86a317b6..11d7e8eef3e 100644 --- a/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts +++ b/projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts @@ -55,6 +55,8 @@ export class IgxRowIslandComponent extends IgxRowIsland { @Output() public columnsAutogenerated = new EventEmitter(); + /** @hidden @internal */ + /* blazorInclude */ // TODO(api-analyzer): Shouldn't need all tags to copy from base or hidden/internal due to include tag /* contentChildren */ /* blazorTreatAsCollection */ @@ -62,7 +64,7 @@ export class IgxRowIslandComponent extends IgxRowIsland { /* blazorCollectionItemName: ActionStrip */ /* ngQueryListName: actionStripComponents */ @ContentChildren(IgxActionStripToken, { read: IgxActionStripToken, descendants: false }) - protected override actionStripComponents: QueryList; + public override actionStripComponents: QueryList; protected override autogenerateColumns() { super.autogenerateColumns();