Fix: ActionMenu with overflow doesn’t contain scrollbars within its rounded border

[pksjce]

Closes ##4938

Changelog

The fix is to have an element inside the Overlay that has overflow and max-height set to it.
This kind of works here. Not sure if there is a better way.

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: 71218ce

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	Patch
@primer/styled-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

[github-actions]

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

[pksjce]

With the same fix on copilot chat, it looks like this

Before

Screen.Recording.2025-10-14.at.3.01.30.pm.mov

After

Screen.Recording.2025-10-14.at.3.02.03.pm.mov

[Copilot]

Pull Request Overview

This PR fixes an issue where ActionMenu scrollbars extended beyond the component's rounded border by applying overflow and max-height styles to an inner container element rather than the Overlay itself. The solution moves these styling properties from the Overlay component to the ActionMenuContainer div, ensuring scrollbars remain within the bordered area.

Key changes:

• Added data attributes to ActionMenuContainer to conditionally apply overflow and max-height styles
• Introduced CSS rules that mirror Overlay's size tokens for consistent sizing behavior

Reviewed Changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 6 comments.

File	Description
packages/react/src/ActionMenu/ActionMenu.tsx	Added conditional data attributes to ActionMenuContainer for overflow and max-height props
packages/react/src/ActionMenu/ActionMenu.module.css	Added CSS rules for overflow variants and max-height size tokens matching Overlay sizes

[primer-integration]

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

[primer-integration]

🟢 ci completed with status success.

[pksjce]

@siddharthkp - These are the same changes as the previous PR. Somehow it wasn't creating an appropriate integration PR. But this one seems to work fine 👍

[siddharthkp]

nit: we should say what the new state is

for example:

Suggested change

	Fix: ActionMenu with overflow contains scrollbars within its rounded border
	ActionMenu: Scrollbars no longer overflow outside the menu's rounded border