refactor(aria/accordion): simplify code by using template references instead of user id to match panels with triggers#32855
Conversation
d4b9a3c to
6202429
Compare
|
Deployed dev-app for 03b1cf5 to: https://ng-dev-previews-comp--pr-angular-components-32855-dev-o5cstcah.web.app Note: As new commits are pushed to this pull request, this link is updated after the preview is rebuilt. |
6202429 to
26db0a8
Compare
|
Deployed docs-preview for 395625b to: https://ng-dev-previews-comp--pr-angular-components-32855-docs-3p0wfv7f.web.app Note: As new commits are pushed to this pull request, this link is updated after the preview is rebuilt. |
6881f1d to
bc23c8a
Compare
4ae78eb to
feac17f
Compare
21ea60e to
5c931a4
Compare
7a691f5 to
fc055d5
Compare
| private readonly _triggerPatterns = computed(() => | ||
| this._triggers() | ||
| .map(t => t._pattern) | ||
| .filter(p => !!p), |
There was a problem hiding this comment.
What's the case where there is no pattern on the triggers?
There was a problem hiding this comment.
The _pattern is set on ngOnInit so there is a time when _triggerPatterns is referenced in AccordionGroup before they have been initialized. As soon as everything is set up, then this won't happen.
…instead of user id to match panels with triggers
395625b to
03b1cf5
Compare
This CL refactors the Angular Components ARIA accordion to simplify how triggers are associated with their content panels.
Previously, ngAccordionTrigger and ngAccordionPanel were matched using a shared panelId string input. This required the ngAccordionGroup to query for all triggers and panels and link them up after they were rendered.
This change replaces the panelId system with a more direct approach:
The ngAccordionPanel is now given a template reference variable (e.g., #myPanel).
The corresponding ngAccordionTrigger now takes the template reference variable as an input (e.g., [panel]="myPanel").
This allows Angular to directly link the trigger and panel instances, removing the need for the group to match them based on IDs and eliminating the AccordionPanelPattern class. The logic for finding the active trigger based on an element has been moved into the AccordionGroupPattern.