From 7c6ea68356a68bba1088b671bc691b13b346e32d Mon Sep 17 00:00:00 2001
From: Tyler Jones <tylerjdev@github.com>
Date: Tue, 9 Jun 2026 18:33:48 -0400
Subject: [PATCH 1/3] Add settings for CSS anchor positioning

---
 packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx | 10 +++++++++-
 packages/react/src/SelectPanel/SelectPanel.tsx         |  2 ++
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx b/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx
index f532d590d81..5490a5aea46 100644
--- a/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx
+++ b/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx
@@ -124,6 +124,10 @@ interface AnchoredOverlayBaseProps extends Pick<OverlayProps, 'height' | 'width'
    * and the browser supports native CSS anchor positioning. Has no effect otherwise. Defaults to `"portal"`.
    */
   renderAs?: 'portal' | 'popover'
+  /**
+   * Settings for CSS anchor positioning behavior when CSS anchor positioning is active.
+   */
+  cssAnchorPositioningSettings?: {disable?: boolean}
 }
 
 export type AnchoredOverlayProps = AnchoredOverlayBaseProps &
@@ -167,6 +171,7 @@ export const AnchoredOverlay: React.FC<React.PropsWithChildren<AnchoredOverlayPr
   displayCloseButton = true,
   closeButtonProps = defaultCloseButtonProps,
   renderAs = 'portal',
+  cssAnchorPositioningSettings,
 }) => {
   const cssAnchorPositioningFlag = useFeatureFlag('primer_react_css_anchor_positioning')
   // Lazy initial state so feature detection runs once per mount on the client.
@@ -180,7 +185,10 @@ export const AnchoredOverlay: React.FC<React.PropsWithChildren<AnchoredOverlayPr
   )
 
   const cssAnchorPositioning =
-    cssAnchorPositioningFlag && supportsNativeCSSAnchorPositioning && !overlayProps?.portalContainerName
+    cssAnchorPositioningFlag &&
+    supportsNativeCSSAnchorPositioning &&
+    !overlayProps?.portalContainerName &&
+    !cssAnchorPositioningSettings?.disable
   // Only use Popover API when both CSS anchor positioning is enabled AND renderAs is true
   const shouldRenderAsPopover = cssAnchorPositioning && renderAs === 'popover'
   const anchorRef = useProvidedRefOrCreate(externalAnchorRef)
diff --git a/packages/react/src/SelectPanel/SelectPanel.tsx b/packages/react/src/SelectPanel/SelectPanel.tsx
index dcef288c1f7..95cbe2c6ad8 100644
--- a/packages/react/src/SelectPanel/SelectPanel.tsx
+++ b/packages/react/src/SelectPanel/SelectPanel.tsx
@@ -881,6 +881,8 @@ function Panel({
         displayCloseButton={showXCloseIcon}
         closeButtonProps={closeButtonProps}
         displayInViewport={displayInViewport}
+        // Modal variant is positioned manually so native CSS anchor positioning must not be used
+        cssAnchorPositioningSettings={{disable: variant === 'modal'}}
       >
         <div className={classes.Wrapper} data-variant={variant} data-component="SelectPanel">
           <div className={classes.Header} data-variant={currentResponsiveVariant} data-component="SelectPanel.Header">

From 02d632ab9fd4dd660bb3da6c897f7cbf11a82ee7 Mon Sep 17 00:00:00 2001
From: Tyler Jones <tylerjdev@github.com>
Date: Tue, 9 Jun 2026 19:15:09 -0400
Subject: [PATCH 2/3] Add changeset

---
 .changeset/select-panel-modal-css-anchor-positioning.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/select-panel-modal-css-anchor-positioning.md

diff --git a/.changeset/select-panel-modal-css-anchor-positioning.md b/.changeset/select-panel-modal-css-anchor-positioning.md
new file mode 100644
index 00000000000..f78c7c7fdba
--- /dev/null
+++ b/.changeset/select-panel-modal-css-anchor-positioning.md
@@ -0,0 +1,5 @@
+---
+'@primer/react': minor
+---
+
+AnchoredOverlay: Add `cssAnchorPositioningSettings` prop to allow opting out of native CSS anchor positioning (via `disable`), and use it in `SelectPanel` so the `modal` variant stays manually centered instead of being repositioned by CSS anchor positioning.

From 5b861d4781bb1760531d1f3940b6d3201a4a0baf Mon Sep 17 00:00:00 2001
From: Tyler Jones <tylerjdev@github.com>
Date: Tue, 9 Jun 2026 19:36:35 -0400
Subject: [PATCH 3/3] Potential fix for pull request finding

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
---
 packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx b/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx
index 5490a5aea46..c80fda0d17b 100644
--- a/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx
+++ b/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx
@@ -125,7 +125,10 @@ interface AnchoredOverlayBaseProps extends Pick<OverlayProps, 'height' | 'width'
    */
   renderAs?: 'portal' | 'popover'
   /**
-   * Settings for CSS anchor positioning behavior when CSS anchor positioning is active.
+   * Settings for native CSS anchor positioning.
+   *
+   * - `disable`: When `true`, opts this overlay out of native CSS anchor positioning (and the Popover API)
+   *   even if `primer_react_css_anchor_positioning` is enabled and the browser supports it.
    */
   cssAnchorPositioningSettings?: {disable?: boolean}
 }