Breadcrumbs: refresh menu overflow items when children content changes

[Copilot]

Changelog

Breadcrumbs with overflow="menu"/"menu-with-root" cached the visible/menu split and did not refresh it when children changed without a count change, causing stale crumbs after soft navigations. This updates overflow recomputation to react to child-content updates so consumers no longer need keyed remount workarounds.

New

• Regression test in Breadcrumbs.test.tsx that:
  • renders overflow menu with collapsed items
  • rerenders with same item count but updated crumb labels/hrefs
  • verifies menu content updates (new crumb present, old crumb absent) without key remounting

Changed

• Updated overflow recomputation logic in Breadcrumbs.tsx to recalculate menu/visible/effective-root split for menu variants whenever current children are re-derived (when childArray.length > 5), instead of only the initial menu creation path.
• Preserves existing wrap behavior and resize-driven recalculation.

useEffect(() => {
  if ((overflow === 'menu' || overflow === 'menu-with-root') && childArray.length > 5) {
    const containerWidth = containerRef.current?.offsetWidth || 800
    const result = calculateOverflow(containerWidth)
    setVisibleItems(result.visibleItems)
    setMenuItems(result.menuItems)
    setEffectiveHideRoot(result.effectiveHideRoot)
  }
}, [overflow, childArray, calculateOverflow])

Removed

• Implicit need for downstream key-based remount workaround to refresh stale overflow menu items on same-count child updates.

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

Review the rerender path for menu overflow specifically:

• Render Breadcrumbs overflow="menu" with 6+ items.
• Open overflow menu and confirm an initial collapsed crumb label.
• Rerender with the same number of items but different collapsed crumb labels/hrefs.
• Reopen overflow menu and confirm updated labels are shown and stale labels are not.

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-ui (Learn more about how to run integration tests)

[changeset-bot]

🦋 Changeset detected

Latest commit: 19fe8bc

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	Patch

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