MenuRenderer, OverflowMenu: Ensure menus work in Modal components (#1665

)
seek-oss · Dec 9, 2024 · f44473a · f44473a
1 parent 18a9c98
commit f44473a
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 2 deletions.
diff --git a/.changeset/tender-olives-sell.md b/.changeset/tender-olives-sell.md
@@ -0,0 +1,11 @@
+---
+'braid-design-system': patch
+---
+
+---
+updated:
+  - MenuRenderer
+  - OverflowMenu
+---
+
+**MenuRenderer, OverflowMenu:** Fixes a bug where menus could be obscured when rendered inside a `Dialog` or `Drawer` component.
diff --git a/packages/braid-design-system/src/lib/components/MenuRenderer/MenuRenderer.tsx b/packages/braid-design-system/src/lib/components/MenuRenderer/MenuRenderer.tsx
@@ -363,7 +363,7 @@ export const MenuRenderer = ({
               dispatch({ type: BACKDROP_CLICK });
             }}
             position="fixed"
-            zIndex="dropdownBackdrop"
+            zIndex="modal"
             top={0}
             left={0}
             className={styles.backdrop}
@@ -423,7 +423,7 @@ export function Menu({
       <Box
         role="menu"
         position={position}
-        zIndex="dropdown"
+        zIndex="modal"
         boxShadow={placement === 'top' ? 'small' : 'medium'}
         borderRadius={borderRadius}
         background="surface"