@codecademy/gamut

72.3.172.3.2-alpha.bccc0b.0
dist/Toaster/index.js
~dist/Toaster/index.jsModified
+23−18
Index: package/dist/Toaster/index.js
===================================================================
--- package/dist/Toaster/index.js
+++ package/dist/Toaster/index.js
@@ -10,26 +10,31 @@
   toasts = [],
   onClose,
   colorMode = 'light'
 }) => {
-  return /*#__PURE__*/_jsx(BodyPortal, {
-    children: /*#__PURE__*/_jsx(ColorMode, {
-      mode: colorMode,
-      children: /*#__PURE__*/_jsx(Box, {
-        "aria-live": "polite",
-        bottom: 88,
-        position: "fixed",
-        right: 16,
-        children: /*#__PURE__*/_jsx(AnimatePresence, {
-          children: toasts.map(toast => /*#__PURE__*/_jsx(FadeInSlideOut, {
-            children: /*#__PURE__*/_jsx(Toast, {
-              icon: toast.icon,
-              title: toast.title,
-              onClose: () => onClose(toast.id),
-              children: toast.children
-            })
-          }, toast.id))
+  return (
+    /*#__PURE__*/
+    // TEMPORARY: zIndex override to stay above Overlay's default of 3 until GM-624 lands a shared z-index scale
+    _jsx(BodyPortal, {
+      zIndex: 4,
+      children: /*#__PURE__*/_jsx(ColorMode, {
+        mode: colorMode,
+        children: /*#__PURE__*/_jsx(Box, {
+          "aria-live": "polite",
+          bottom: 88,
+          position: "fixed",
+          right: 16,
+          children: /*#__PURE__*/_jsx(AnimatePresence, {
+            children: toasts.map(toast => /*#__PURE__*/_jsx(FadeInSlideOut, {
+              children: /*#__PURE__*/_jsx(Toast, {
+                icon: toast.icon,
+                title: toast.title,
+                onClose: () => onClose(toast.id),
+                children: toast.children
+              })
+            }, toast.id))
+          })
         })
       })
     })
-  });
+  );
 };
\ No newline at end of file