Skip to content

Conversation

wagnermaciel
Copy link
Contributor

  • Adds a new List behavior class to @angular/cdk-experimental/ui-patterns/behaviors.
  • This new behavior composes the existing ListFocus, ListNavigation, ListSelection, and ListTypeahead behaviors into a single, cohesive class for managing the state and interactions of a list-based component.
  • This behavior is intended to be unify the copy/pasted logic in ListboxPattern, TreePattern, RadioGroupPattern, and any other patterns where it makes sense.

The List behavior provides a simplified, high-level API for common list operations, including:

  • Navigation (next, prev, first, last)
  • Selection (single, multi, range)
  • Typeahead search
  • Focus management (roving and activedescendant)

@wagnermaciel wagnermaciel requested a review from a team as a code owner July 25, 2025 15:11
@wagnermaciel wagnermaciel requested review from crisbeto and mmalerba and removed request for a team July 25, 2025 15:11
@angular-robot angular-robot bot added the detected: feature PR contains a feature commit label Jul 25, 2025
@wagnermaciel wagnermaciel requested a review from ok7sai July 25, 2025 15:12
@wagnermaciel wagnermaciel force-pushed the list-behavior branch 6 times, most recently from ea85bf3 to 23f0334 Compare July 29, 2025 15:51
@wagnermaciel wagnermaciel added the target: minor This PR is targeted for the next minor release label Jul 29, 2025
.on('Home', () => this.first())
.on('End', () => this.last())
.on(this.typeaheadRegexp, e => this.search(e.key));
.on(this.prevKey, () => this.listBehavior.prev())
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I with the List behavior can also provide basic event manager since the arrow keys and home/end behaviors are the same across UI patterns.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We could but I think decentralizing event handlers will make tracking event handler logic harder in the future

- Adds a new `List` behavior class to `@angular/cdk-experimental/ui-patterns/behaviors`.
- This new behavior composes the existing `ListFocus`, `ListNavigation`, `ListSelection`, and
  `ListTypeahead` behaviors into a single, cohesive class for managing the state and interactions
  of a list-based component.
- This behavior is intended to be unify the copy/pasted logic in `ListboxPattern`, `TreePattern`,
  `RadioGroupPattern`, and any other patterns where it makes sense.

The `List` behavior provides a simplified, high-level API for common list operations, including:

- Navigation (`next`, `prev`, `first`, `last`)
- Selection (single, multi, range)
- Typeahead search
- Focus management (`roving` and `activedescendant`)
@wagnermaciel wagnermaciel added the action: merge The PR is ready for merge by the caretaker label Jul 30, 2025
@wagnermaciel wagnermaciel merged commit 228aaf1 into angular:main Jul 31, 2025
23 of 25 checks passed
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Aug 31, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
action: merge The PR is ready for merge by the caretaker detected: feature PR contains a feature commit target: minor This PR is targeted for the next minor release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants