Skip to content

Conversation

@adierkens
Copy link
Contributor

Refactors the Breadcrumbs component to extract responsive overflow logic into a standalone hook (useBreadcrumbsResponsive) and separate overflow menu component, improving code organization and enabling SSR-friendly usage patterns.

Changelog

Changed

Refactor: Extract responsive breadcrumbs logic

  • New useBreadcrumbsResponsive hook - Encapsulates all overflow calculation logic (resize observation, width measurements, visibility state) into a reusable hook that can be used independently for custom
    implementations
  • New BreadcrumbsOverflowMenu component - Extracts the overflow menu dropdown into a standalone component
  • Adds new responsive prop to Breadcrumbs - allows opting out of automatic overflow handling for manual control
  • Exports useBreadcrumbsResponsive from the package for consumers who need SSR-friendly conditional rendering

Fix: Prevent overflow during SSR

  • Adds overflow: hidden to breadcrumbs container with menu or menu-with-root overflow modes to prevent content from overflowing before JavaScript calculates the overflow menu

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

@changeset-bot
Copy link

changeset-bot bot commented Feb 4, 2026

🦋 Changeset detected

Latest commit: 12c1d30

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
Copy link
Contributor

github-actions bot commented Feb 4, 2026

👋 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.

@github-actions github-actions bot added the integration-tests: recommended This change needs to be tested for breaking changes. See https://arc.net/l/quote/tdmpakpm label Feb 4, 2026
@adierkens adierkens changed the title Adierkens/breadcrumb Refactor Breadcrumb to be more SSR friendly Feb 4, 2026
@github-actions github-actions bot requested a deployment to storybook-preview-7502 February 4, 2026 04:08 Abandoned
@github-actions github-actions bot temporarily deployed to storybook-preview-7502 February 4, 2026 04:17 Inactive
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

integration-tests: recommended This change needs to be tested for breaking changes. See https://arc.net/l/quote/tdmpakpm

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants