Add Modal variant with declarative buttons to PRC SelectPanel

[hectahertz]

Note

This is a remake of #5817 to expedite merging to main.

Closes https://github.com/github/primer/issues/4106

Changelog

New

Adds the modal variant to SelectPanel, complete with Radio icons.

Single select modal

Screen.Recording.2025-04-06.at.18.21.19.mov

Multi select modal

Screen.Recording.2025-04-06.at.18.23.07.mov

See #5817 for all the context.

Shortcut

We are still using AnchoredOverlay underneath. But, for variant=modal, we override its position by directly passing top, left, etc. to overlayProps going down to the Overlay

The ideal super clean solution would have been to refactor SelectPanel and conditionally use useAnchoredPosition instead of AnchoredOverlay for variant=anchored. Something @siddharthkp attempted in #5230 earlier but had to revert.

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: 738cb3c

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]

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

[hectahertz]

@francinelucca All comments from #5817 have been addressed here, can I please have a review?

[primer-integration]

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

[github-actions]

👋 Hi, there are new commits since the last successful integration test. We recommend running the integration workflow once more, unless you are sure the new changes do not affect github/github. Thanks!

[primer-integration]

🟢 golden-jobs completed with status success.

[github-actions]

👋 Hi, there are new commits since the last successful integration test. We recommend running the integration workflow once more, unless you are sure the new changes do not affect github/github. Thanks!

[github-actions]

👋 Hi, there are new commits since the last successful integration test. We recommend running the integration workflow once more, unless you are sure the new changes do not affect github/github. Thanks!

[francinelucca]

✨