Skip to content

refactor(aria/accordion): simplify code by using template references instead of user id to match panels with triggers#32855

Open
adolgachev wants to merge 1 commit intoangular:mainfrom
adolgachev:aria-accordion
Open

refactor(aria/accordion): simplify code by using template references instead of user id to match panels with triggers#32855
adolgachev wants to merge 1 commit intoangular:mainfrom
adolgachev:aria-accordion

Conversation

@adolgachev
Copy link
Contributor

@adolgachev adolgachev commented Feb 25, 2026

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.

@adolgachev adolgachev added dev-app preview When applied, previews of the dev-app are deployed to Firebase area: docs Related to the documentation Accessibility This issue is related to accessibility (a11y) labels Feb 25, 2026
@github-actions
Copy link

github-actions bot commented Feb 25, 2026

Deployed dev-app for 7a691f5 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.

@adolgachev adolgachev changed the title Aria accordion Refactor(aria/accordion): Change to use template references to match panel with trigger Feb 26, 2026
@adolgachev adolgachev added docs: preview When applied, a preview of the documentation site is deployed to Firebase and removed area: docs Related to the documentation labels Feb 26, 2026
@github-actions
Copy link

github-actions bot commented Feb 26, 2026

Deployed docs-preview for 7a691f5 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.

@adolgachev adolgachev marked this pull request as ready for review February 26, 2026 05:39
@adolgachev adolgachev requested review from ok7sai and tjshiu and removed request for crisbeto and wagnermaciel February 26, 2026 05:40
@adolgachev adolgachev force-pushed the aria-accordion branch 2 times, most recently from 4ae78eb to feac17f Compare March 2, 2026 19:20
@adolgachev adolgachev added the action: review The PR is still awaiting reviews from at least one requested reviewer label Mar 2, 2026
@adolgachev adolgachev changed the title Refactor(aria/accordion): Change to use template references to match panel with trigger refactor(aria/accordion): use template references instead of user id to match panels with triggers and refactor and simplify code Mar 7, 2026
@adolgachev adolgachev changed the title refactor(aria/accordion): use template references instead of user id to match panels with triggers and refactor and simplify code refactor(aria/accordion): simplify code by using template references instead of user id to match panels with triggers Mar 7, 2026
…instead of user id to match panels with triggers
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Accessibility This issue is related to accessibility (a11y) action: review The PR is still awaiting reviews from at least one requested reviewer dev-app preview When applied, previews of the dev-app are deployed to Firebase docs: preview When applied, a preview of the documentation site is deployed to Firebase

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant