Added callback onActiveDescendantChanged prop to FilteredActionList

[kendallgassner]

Closes #

When using the useVirtualizer hook to virtualize select panel items, keyboard navigation does not automatically scroll items into view. Although useVirtualizer provides a scrollToIndex function for handling navigation, this isn’t triggered with ariaActiveDescendant, since it keeps focus on the input element instead of moving it. To address this, we need to call virtualizer.scrollToIndex(Number(newActiveDescendant.getAttribute('data-index')), { align: 'auto' }) each time the active descendant changes, ensuring the newly highlighted item is visible during keyboard navigation. This can be accomplished if I can expose a onActiveDescendantChanged prop.

Changelog

New

Changed

Removed

Rollout strategy

• Patch release
• Minor release
• Major release; if selected, include a written rollout or migration plan
• None; if selected, include a brief description as to why

Testing & Reviewing

Merge checklist

• Added/updated tests
• Added/updated documentation
• Added/updated previews (Storybook)
• Changes are SSR compatible
• Tested in Chrome
• Tested in Firefox
• Tested in Safari
• Tested in Edge
• (GitHub staff only) Integration tests pass at github/github (Learn more about how to run integration tests)

[changeset-bot]

🦋 Changeset detected

Latest commit: 84d49c3

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@primer/react	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[github-actions]

👋 Hi, this pull request contains changes to the source code that github/github-ui depends on. If you are GitHub staff, test these changes with github/github-ui using the integration workflow. Or, apply the integration-tests: skipped manually label to skip these checks.

[Copilot]

Pull request overview

This PR adds a new onActiveDescendantChanged callback prop to FilteredActionList, enabling consumers to react to keyboard navigation changes. This is particularly useful for virtualized lists that need to programmatically scroll items into view when navigating with the keyboard, since aria-activedescendant keeps focus on the input element rather than moving it to list items.

Key changes:

• Added onActiveDescendantChanged callback prop to FilteredActionList with comprehensive JSDoc documentation
• Updated the Virtualized story in SelectPanel to demonstrate scrolling items into view using the new callback
• Incremented package versions to 38.4.0 (minor bump)

Reviewed changes

Copilot reviewed 3 out of 4 changed files in this pull request and generated 5 comments.

File	Description
packages/react/src/FilteredActionList/FilteredActionList.tsx	Added new optional onActiveDescendantChanged callback prop that forwards active descendant changes from the internal focus zone, including updated useMemo dependencies
packages/react/src/SelectPanel/SelectPanel.examples.stories.tsx	Updated Virtualized story to use the new callback for scrolling virtualized items into view during keyboard navigation, refactored code structure
.changeset/fruity-groups-brush.md	Added changeset documenting the new callback prop as a minor version change
package-lock.json	Updated version references from 38.3.0 to 38.4.0 and styled-react from 1.0.1 to 1.0.2 across workspaces

[Copilot]

Typo in changeset message: "FilterActionList" should be "FilteredActionList" (missing 'ed').

Suggested change

	Added callback prop onActiveDescendantChanged to FilterActionList'
	Added callback prop onActiveDescendantChanged to FilteredActionList

[Copilot]

Parameter name has inconsistent casing: newActivedescendant should use camelCase as newActiveDescendant (capital 'D' in 'Descendant') to match the parameter names in the callback signature and TypeScript naming conventions.

[Copilot]

Redundant check: The condition checks newActivedescendant === undefined on line 718 and returns early, making the null-safe optional chaining on line 720 (newActivedescendant?.getAttribute) unnecessary. After the early return, newActivedescendant is guaranteed to be defined. Consider using newActivedescendant.getAttribute('data-index') directly on line 720 for clearer logic.

Suggested change

	const index = newActivedescendant?.getAttribute('data-index')
	const range = virtualizer.range
	if (newActivedescendant === undefined) return
	if (newActivedescendant === undefined) return
	const index = newActivedescendant.getAttribute('data-index')
	const range = virtualizer.range