implement @primer/behaviors displayInViewport for ActionMenu

[francinelucca]

Relates to https://github.com/github/primer/issues/6361

This pull request enhances the ActionMenu component in several ways, focusing on improving its usability within dialogs and adding more flexibility to its overlay positioning. The most notable changes include the addition of a new example demonstrating ActionMenu inside a dialog, support for constraining overlays to the viewport, and a minor dependency update for @primer/behaviors.

Changelog

New

• Added a default max-height: 100vh to .ActionMenuContainer in ActionMenu.module.css to ensure overlays do not exceed the viewport height.
• InsideDialog example to ActionMenu.examples.stories.tsx demonstrating how ActionMenu can be used interactively inside a scrollable dialog.

Changed

• update @primer/behaviors version to. v 1.10.2
• Extended the ActionMenu.Overlay and AnchoredOverlay components to accept a new displayInViewport prop, allowing overlays to be constrained within the viewport for better handling in dialogs and scrollable layouts.

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]

⚠️ No Changeset found

Latest commit: 8933a55

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a 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 pull request implements support for displayInViewport from @primer/behaviors in the ActionMenu and AnchoredOverlay components to improve overlay positioning within dialogs and scrollable containers. The changes enhance the ActionMenu's usability by ensuring overlays remain constrained within the viewport, preventing overflow issues.

Changes:

• Added displayInViewport prop support to ActionMenu.Overlay and AnchoredOverlay components, allowing overlays to be constrained within the viewport
• Updated @primer/behaviors dependency from v1.10.0 to v1.10.2 to support the new functionality
• Added default max-height: 100vh CSS rule to .ActionMenuContainer to prevent overlays from exceeding viewport height
• Created InsideDialog example story demonstrating ActionMenu usage within a scrollable dialog

Reviewed changes

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

Show a summary per file

File	Description
packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx	Extends type definition to include displayInViewport and threads the prop to useAnchoredPosition hook
packages/react/src/ActionMenu/ActionMenu.tsx	Extends MenuOverlayProps type to include displayInViewport and passes it to AnchoredOverlay component
packages/react/src/ActionMenu/ActionMenu.module.css	Adds default max-height: 100vh to .ActionMenuContainer to constrain overlays within viewport
packages/react/src/ActionMenu/ActionMenu.examples.stories.tsx	Adds comprehensive InsideDialog example demonstrating the new feature with scrollable content
packages/react/package.json	Updates @primer/behaviors dependency to v1.10.2
package-lock.json	Updates dependency tree for @primer/behaviors and workspace version references

[primer-integration]

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

[primer-integration]

Integration test results from github/github-ui:

  CI Passed
  VRT Passed
  Projects Passed

All checks passed!

[TylerJDev]

LGTM!