Move all elements specific members from the angular grids into angular-element's source. #15304
Move all elements specific members from the angular grids into angular-element's source. #15304MayaKirova wants to merge 31 commits intomasterfrom
Conversation
|
@MayaKirova there is a conflict here |
|
@MayaKirova please resolve the conflicts here |
|
There has been no recent activity and this PR has been marked inactive. |
|
@MayaKirova there is a conflict here |
…ect (#17140) Co-authored-by: Damyan Petev <damyanpetev@users.noreply.github.com>
There was a problem hiding this comment.
Pull request overview
This PR moves Elements-/codegen-specific Grid members (Blazor/WC metadata and internal-only events/collections) out of igniteui-angular grid sources and into igniteui-angular-elements, by introducing Elements wrapper components and updating the Elements analyzer/registration to target them.
Changes:
- Removes Elements-only outputs/metadata from Angular grid base sources (e.g.,
columnsAutogenerated,childrenResolved, action strip collection tags) and adjusts internals (ContentChildren→ContentChildfor action strip). - Introduces Elements wrapper components for
Grid,TreeGrid,HierarchicalGrid, andRowIslandthat re-add Elements-only outputs/collections and re-emitcolumnsAutogenerated. - Updates Elements registration/analyzer configuration to use the new wrapper components, plus minor build config updates (
angular.jsonbundle budget;package-lock.jsonmetadata).
Reviewed changes
Copilot reviewed 22 out of 23 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| projects/igniteui-angular/paginator/src/paginator/paginator.component.ts | Updates @igxParent metadata to reference Elements grid wrappers. |
| projects/igniteui-angular/grids/tree-grid/src/tree-grid.component.ts | Removes Blazor dependency tags; adds blazorAlternateName/indirect-render metadata. |
| projects/igniteui-angular/grids/hierarchical-grid/src/row-island.component.ts | Removes Elements-only template/content/query/event members from Angular RowIsland. |
| projects/igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.component.ts | Removes Elements-only action strip query override; updates Blazor metadata. |
| projects/igniteui-angular/grids/grid/src/grid.component.ts | Removes Blazor dependency tags; adds blazorAlternateName/indirect-render metadata. |
| projects/igniteui-angular/grids/grid/src/grid-base.directive.ts | Removes Elements-only outputs (columnsAutogenerated, childrenResolved), changes action strip query to ContentChild, removes columnsAutogenerated emit. |
| projects/igniteui-angular/grids/core/src/toolbar/grid-toolbar.component.ts | Updates @igxParent metadata to reference Elements grid wrappers. |
| projects/igniteui-angular/grids/core/src/common/events.ts | Removes IColumnsAutoGeneratedEventArgs from Angular grids core (moved to Elements). |
| projects/igniteui-angular/grids/core/src/columns/column.component.ts | Updates @igxParent metadata to reference Elements grid wrappers. |
| projects/igniteui-angular/grids/core/src/columns/column-layout.component.ts | Updates @igxParent metadata to reference Elements grid wrappers. |
| projects/igniteui-angular/grids/core/src/columns/column-group.component.ts | Updates @igxParent metadata to reference Elements grid wrappers. |
| projects/igniteui-angular/action-strip/src/action-strip/action-strip.component.ts | Updates @igxParent metadata to reference Elements grid wrappers. |
| projects/igniteui-angular-elements/src/lib/state.component.ts | Updates @igxParent metadata to reference Elements grid wrappers. |
| projects/igniteui-angular-elements/src/lib/grids/tree-grid.component.ts | Adds Elements TreeGrid wrapper component, reintroducing Elements-only outputs/collections. |
| projects/igniteui-angular-elements/src/lib/grids/row-island.component.ts | Adds Elements RowIsland wrapper component, reintroducing Elements-only members and childDataKey. |
| projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts | Adds Elements HierarchicalGrid wrapper component, reintroducing Elements-only outputs/collections. |
| projects/igniteui-angular-elements/src/lib/grids/grid.component.ts | Adds Elements Grid wrapper component, reintroducing Elements-only outputs/collections. |
| projects/igniteui-angular-elements/src/lib/grids/events.ts | Adds Elements-only IColumnsAutoGeneratedEventArgs definition. |
| projects/igniteui-angular-elements/src/app/components.ts | Registers custom elements using Elements wrapper components instead of Angular grid components. |
| projects/igniteui-angular-elements/src/analyzer/elements.config.ts | Updates analyzer registration to prefer Elements wrapper components and adjusts content queries. |
| projects/igniteui-angular-elements/src/analyzer/config.template.ts | Updates analyzer template to use Elements wrapper components. |
| package-lock.json | Updates lockfile metadata (dev/optional/peer flags). |
| angular.json | Increases bundle budget maximum error threshold. |
projects/igniteui-angular-elements/src/lib/grids/hierarchical-grid.component.ts
Show resolved
Hide resolved
projects/igniteui-angular-elements/src/analyzer/elements.config.ts
Outdated
Show resolved
Hide resolved
projects/igniteui-angular-elements/src/analyzer/elements.config.ts
Outdated
Show resolved
Hide resolved
projects/igniteui-angular-elements/src/lib/grids/grid.component.ts
Outdated
Show resolved
Hide resolved
| /** | ||
| * State component allows saving and restoring the state of the grid features. | ||
| * @igxParent IgxGridComponent, IgxTreeGridComponent, IgxHierarchicalGridComponent, IgxPivotGridComponent, * | ||
| * @igxParent IgxGridElementsComponent, IgxTreeGridElementsComponent, IgxHierarchicalGridElementsComponent, IgxPivotGridComponent, * |
There was a problem hiding this comment.
Oh, well that's awkward to say the least. This goes directly into the public API docs for Ignite UI for Angular, so not really great to list the elements class names.
Two options:
- Make the parent resolve more flexible so old
IgxGridComponentalso recognizes the extendedIgxGridElementsComponent - OR, bit a odd idea, but might work: Re-define
IgxGridComponentas the extended class in Elements and simply alias the main component as something else:import { IgxGridComponent as IgxGrid } from 'igniteui-angular/grids/grid/src/grid.component'; @Component({ selector: 'igx-grid', templateUrl: '../../../../igniteui-angular/grids/grid/src/grid.component.html' }) export class IgxGridComponent extends IgxGrid {
Honestly, the second option would mean we touch almost nothing in the main source and the config for elements too, merely change the import path for IgxGridComponent to come from elements instead.
There was a problem hiding this comment.
Why would this go in the public api docs for Angular? It's under the projects/igniteui-angular-elements and the components should only ship with wc.
There was a problem hiding this comment.
Okay, left the comment on the wrong file for this, but applies to action strip and grid columns, those tags end up here:
https://www.infragistics.com/products/ignite-ui-angular/docs/typescript/latest/classes/igxactionstripcomponent.html
https://www.infragistics.com/products/ignite-ui-angular/docs/typescript/latest/classes/igxcolumncomponent.html
and so on.
There was a problem hiding this comment.
Seems to work with the aliases. Added the change.
| ], | ||
| schemas: [CUSTOM_ELEMENTS_SCHEMA] | ||
| }) | ||
| export class IgxHierarchicalGridElementsComponent extends IgxHierarchicalGridComponent { |
There was a problem hiding this comment.
One last concern I have is with the HGrid - I know we had functionality so toolbars and such as templates can discover their actual igx-hierarchical-grid parent that's not an Element. The selector is the same but the instance prototype won't be.
Not sure if the original Angular class missing from the elements config will cause issues with that functionality (must check carefully there)
…t.ts Co-authored-by: Damyan Petev <damyanpetev@users.noreply.github.com>
…teui-angular into mkirova/feat-15235
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Copilot Autofix powered by AI <223894421+github-code-quality[bot]@users.noreply.github.com>




Closes #15235
Additional information (check all that apply):
Checklist:
feature/README.MDupdates for the feature docsREADME.MDCHANGELOG.MDupdates for newly added functionalityng updatemigrations for the breaking changes (migrations guidelines)