Feature Description
I would like to build reusable components based on Angular Aria directives - currently, specifically the Grid. However, I believe this feature request also applies to other Aria directives and related use cases.
Specific problem: I want to provide custom CSS and add the ability to disable rows (and programmatically disable the corresponding cells). This leads to some new, as well as some well-known, limitations and challenges.
My first idea was to extend the directives as components, which would allow me to deliver custom CSS. This approach would also let me obtain ComponentRefs of my cell components in order to set the input signals (for forwarding the disabled state), thus avoiding issue angular/angular#54782.
Unfortunately it is not possible to provide my derived Components because the corresponding injection tokens are private. This results in the following error:
NG0201: No provider found for InjectionToken GRID_ROW
I've set up a Stackblitz to demonstrate the idea.
My second idea was to use directive composition. This way, I can build my (non-derived) components, deliver custom CSS, and set the Aria directives as hostDirectives. Unfortunately, programmatically setting the disabled state is not possible here either, as I can't bind the inputs due to angular/angular#50510.
Use Case
Build reusable Components based on Angular Aria directives, allowing to bundle CSS and customize behaviour programmatically.
Feature Description
I would like to build reusable components based on Angular Aria directives - currently, specifically the Grid. However, I believe this feature request also applies to other Aria directives and related use cases.
Specific problem: I want to provide custom CSS and add the ability to disable rows (and programmatically disable the corresponding cells). This leads to some new, as well as some well-known, limitations and challenges.
My first idea was to extend the directives as components, which would allow me to deliver custom CSS. This approach would also let me obtain ComponentRefs of my cell components in order to set the input signals (for forwarding the disabled state), thus avoiding issue angular/angular#54782.
Unfortunately it is not possible to provide my derived Components because the corresponding injection tokens are private. This results in the following error:
I've set up a Stackblitz to demonstrate the idea.
My second idea was to use directive composition. This way, I can build my (non-derived) components, deliver custom CSS, and set the Aria directives as hostDirectives. Unfortunately, programmatically setting the disabled state is not possible here either, as I can't bind the inputs due to angular/angular#50510.
Use Case
Build reusable Components based on Angular Aria directives, allowing to bundle CSS and customize behaviour programmatically.