chore: add portal context #6815

francinelucca · 2025-09-09T18:27:00Z

This pull request introduces a new PortalContext to the @primer/react library, allowing more flexible and context-driven control over where portal content is rendered. The changes include updates to the core Portal component, its exports, new Storybook examples, and additional tests to ensure correct behavior when using PortalContext and container overrides.

Changelog

New

Added PortalContext to Portal.tsx, allowing consumers to specify a portalContainerName via React context, which determines the portal root container for content rendering. The Portal component now prioritizes the context value unless overridden by its own containerName prop.
Added new tests in Portal.test.tsx to verify correct portal rendering behavior when using PortalContext, including context-only, default fallback, undefined context, and prop override scenarios.
Added a Storybook example (WithPortalContext) in Portal.features.stories.tsx to demonstrate how to use PortalContext for controlling portal rendering, including context and prop override cases.

Changed

Updated exports in index.ts and the package entry point to include PortalContext, making it available for consumers.

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 · 2025-09-09T18:27:04Z

🦋 Changeset detected

Latest commit: f31ce63

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

This PR includes changesets to release 2 packages

Name	Type
@primer/react	Minor
@primer/styled-react	Major

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 · 2025-09-09T18:27:38Z

👋 Hi, this pull request contains changes to the source code that github/github depends on. If you are GitHub staff, we recommend testing these changes with github/github using the integration workflow. Thanks!

francinelucca · 2025-09-09T18:30:51Z

@copilot add tests to ensure elements render correctly inside custom Portal when PortalContext is supplied and on the default otherwise

Copilot · 2025-09-09T18:31:00Z

@francinelucca I've opened a new pull request, #6816, to work on those changes. Once the pull request is ready, I'll request review from you.

github-actions · 2025-09-09T18:31:20Z

size-limit report 📦

Path	Size
packages/react/dist/browser.esm.js	88.61 KB (-0.04% 🔽)
packages/react/dist/browser.umd.js	88.66 KB (-0.08% 🔽)

Co-authored-by: copilot-swe-agent[bot] <[email protected]> Co-authored-by: francinelucca <[email protected]>

francinelucca · 2025-09-09T23:27:16Z

@copilot add a storybook story that demonstrates how to use PortalContext to render items within a different Portal than the default

Copilot · 2025-09-09T23:27:25Z

@francinelucca I've opened a new pull request, #6821, to work on those changes. Once the pull request is ready, I'll request review from you.

…#6821) Co-authored-by: copilot-swe-agent[bot] <[email protected]> Co-authored-by: francinelucca <[email protected]> Co-authored-by: Marie Lucca <[email protected]>

Co-authored-by: Copilot <[email protected]>

Copilot

Pull Request Overview

Copilot reviewed 6 out of 6 changed files in this pull request and generated 1 comment.

packages/react/src/Portal/Portal.tsx

primer-integration · 2025-09-10T14:23:56Z

👋 Hi from github/github-ui! Your integration PR is ready: https://github.com/github/github-ui/pull/2184

francinelucca · 2025-09-10T14:27:12Z

@copilot fix failing test

Copilot · 2025-09-10T14:27:21Z

@francinelucca I've opened a new pull request, #6826, to work on those changes. Once the pull request is ready, I'll request review from you.

primer-integration · 2025-09-10T14:37:33Z

🔴 ci completed with status failure.

adierkens · 2025-09-10T19:47:30Z

packages/react/src/Portal/Portal.tsx

@@ -43,6 +43,10 @@ function ensureDefaultPortal() {
  }
 }

+export const PortalContext = React.createContext<{


Are there any docs we can provide as a jsdoc here to give a brief description?

Suggested change

export const PortalContext = React.createContext<{

/**

* Provides the ability for component trees to override the portal root container for a sub-set of the experience.

* The portal will prioritize the context value unless overridden by their own `containerName` prop, and fallback to the default root if neither are specified

*/

export const PortalContext = React.createContext<{

chore: add portal context

d562130

github-actions bot added staff Author is a staff member integration-tests: recommended This change needs to be tested for breaking changes. See https://arc.net/l/quote/tdmpakpm labels Sep 9, 2025

Copilot AI mentioned this pull request Sep 9, 2025

chore: add portal context with comprehensive tests #6816

Merged

13 tasks

francinelucca and others added 2 commits September 9, 2025 14:32

fix rule of hooks

9f4bc0e

Merge branch 'main' into chore/add-portal-context

ef1df23

github-actions bot temporarily deployed to storybook-preview-6815 September 9, 2025 18:51 Inactive

francinelucca deployed to github-pages September 9, 2025 19:08 — with GitHub Actions View deployment

github-actions bot temporarily deployed to storybook-preview-6815 September 9, 2025 19:09 Inactive

chore: add portal context with comprehensive tests (#6816)

b221f84

Co-authored-by: copilot-swe-agent[bot] <[email protected]> Co-authored-by: francinelucca <[email protected]>

Copilot AI mentioned this pull request Sep 9, 2025

chore: add portal context with comprehensive tests and storybook demo #6821

Merged

13 tasks

francinelucca had a problem deploying to github-pages September 9, 2025 23:28 — with GitHub Actions Failure

github-actions bot requested a deployment to storybook-preview-6815 September 9, 2025 23:29 Abandoned

Copilot AI and others added 2 commits September 10, 2025 10:14

chore: add portal context with comprehensive tests and storybook demo (…

c19577c

…#6821) Co-authored-by: copilot-swe-agent[bot] <[email protected]> Co-authored-by: francinelucca <[email protected]> Co-authored-by: Marie Lucca <[email protected]>

Update version for @primer/react and rename context

ebfc648

francinelucca marked this pull request as ready for review September 10, 2025 14:18

Copilot AI review requested due to automatic review settings September 10, 2025 14:18

francinelucca requested a review from a team as a code owner September 10, 2025 14:18

francinelucca requested review from joshblack and adierkens September 10, 2025 14:18

github-actions bot requested a deployment to storybook-preview-6815 September 10, 2025 14:19 Abandoned

This comment was marked as outdated.

Sign in to view

Update packages/react/src/Portal/Portal.tsx

de1e26e

Co-authored-by: Copilot <[email protected]>

Update packages/react/src/Portal/Portal.tsx

c21c234

Co-authored-by: Copilot <[email protected]>

francinelucca requested a review from Copilot September 10, 2025 14:20

This comment was marked as outdated.

Sign in to view

Update packages/react/src/Portal/Portal.tsx

f31ce63

Co-authored-by: Copilot <[email protected]>

francinelucca requested a review from Copilot September 10, 2025 14:21

Copilot AI reviewed Sep 10, 2025

View reviewed changes

packages/react/src/Portal/Portal.tsx Show resolved Hide resolved

github-actions bot requested a deployment to storybook-preview-6815 September 10, 2025 14:23 Abandoned

Copilot AI mentioned this pull request Sep 10, 2025

[WIP] fix: address failing test from portal context PR #6826

Closed

5 tasks

francinelucca deployed to github-pages September 10, 2025 14:31 — with GitHub Actions View deployment

github-actions bot deployed to storybook-preview-6815 September 10, 2025 14:32 View deployment

github-actions bot added integration-tests: failing Changes in this PR cause breaking changes in gh/gh and removed integration-tests: recommended This change needs to be tested for breaking changes. See https://arc.net/l/quote/tdmpakpm labels Sep 10, 2025

joshblack approved these changes Sep 10, 2025

View reviewed changes

adierkens reviewed Sep 10, 2025

View reviewed changes

adierkens approved these changes Sep 10, 2025

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

chore: add portal context #6815

chore: add portal context #6815

francinelucca commented Sep 9, 2025 •

edited

Loading

Uh oh!

changeset-bot bot commented Sep 9, 2025 •

edited

Loading

Uh oh!

github-actions bot commented Sep 9, 2025

Uh oh!

francinelucca commented Sep 9, 2025

Uh oh!

Copilot AI commented Sep 9, 2025

Uh oh!

github-actions bot commented Sep 9, 2025 •

edited

Loading

Uh oh!

francinelucca commented Sep 9, 2025

Uh oh!

Copilot AI commented Sep 9, 2025

Uh oh!

This comment was marked as outdated.

Uh oh!

This comment was marked as outdated.

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

primer-integration bot commented Sep 10, 2025

Uh oh!

francinelucca commented Sep 10, 2025

Uh oh!

Copilot AI commented Sep 10, 2025

Uh oh!

primer-integration bot commented Sep 10, 2025

Uh oh!

adierkens Sep 10, 2025

Uh oh!

Uh oh!

chore: add portal context #6815

Are you sure you want to change the base?

chore: add portal context #6815

Conversation

francinelucca commented Sep 9, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Changelog

New

Changed

Removed

Rollout strategy

Testing & Reviewing

Merge checklist

Uh oh!

changeset-bot bot commented Sep 9, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

github-actions bot commented Sep 9, 2025

Uh oh!

francinelucca commented Sep 9, 2025

Uh oh!

Copilot AI commented Sep 9, 2025

Uh oh!

github-actions bot commented Sep 9, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

size-limit report 📦

Uh oh!

francinelucca commented Sep 9, 2025

Uh oh!

Copilot AI commented Sep 9, 2025

Uh oh!

This comment was marked as outdated.

Uh oh!

This comment was marked as outdated.

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Uh oh!

Uh oh!

primer-integration bot commented Sep 10, 2025

Uh oh!

francinelucca commented Sep 10, 2025

Uh oh!

Copilot AI commented Sep 10, 2025

Uh oh!

primer-integration bot commented Sep 10, 2025

Uh oh!

adierkens Sep 10, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

francinelucca commented Sep 9, 2025 •

edited

Loading

changeset-bot bot commented Sep 9, 2025 •

edited

Loading

github-actions bot commented Sep 9, 2025 •

edited

Loading