refactor: move ScopedCssBaseline to OdysseyProvider (#1940)

okta · Aug 24, 2023 · b5a16c1 · b5a16c1
1 parent 7e1e9ad
commit b5a16c1
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 12 deletions.
diff --git a/packages/odyssey-react-mui/src/OdysseyProvider.tsx b/packages/odyssey-react-mui/src/OdysseyProvider.tsx
@@ -11,6 +11,7 @@
  */
 
 import { memo, ReactNode } from "react";
+import { ScopedCssBaseline } from "@mui/material";
 
 import {
   OdysseyCacheProvider,
@@ -45,12 +46,14 @@ const OdysseyProvider = ({
       themeOverride={themeOverride}
       designTokensOverride={designTokensOverride}
     >
-      <OdysseyTranslationProvider
-        languageCode={languageCode}
-        translationOverrides={translationOverrides}
-      >
-        {children}
-      </OdysseyTranslationProvider>
+      <ScopedCssBaseline>
+        <OdysseyTranslationProvider
+          languageCode={languageCode}
+          translationOverrides={translationOverrides}
+        >
+          {children}
+        </OdysseyTranslationProvider>
+      </ScopedCssBaseline>
     </OdysseyThemeProvider>
   </OdysseyCacheProvider>
 );

diff --git a/packages/odyssey-react-mui/src/OdysseyThemeProvider.tsx b/packages/odyssey-react-mui/src/OdysseyThemeProvider.tsx
@@ -16,7 +16,7 @@ import {
 } from "@mui/material/styles";
 import { memo, ReactNode, useMemo } from "react";
 
-import { ScopedCssBaseline, ThemeOptions } from "@mui/material";
+import { ThemeOptions } from "@mui/material";
 import { deepmerge } from "@mui/utils";
 import { createOdysseyMuiTheme, DesignTokensOverride } from "./theme";
 import * as Tokens from "@okta/odyssey-design-tokens";
@@ -49,11 +49,9 @@ const OdysseyThemeProvider = ({
 
   return (
     <MuiThemeProvider theme={customOdysseyTheme ?? odysseyTheme}>
-      <ScopedCssBaseline>
-        <OdysseyDesignTokensContext.Provider value={odysseyTokens}>
-          {children}
-        </OdysseyDesignTokensContext.Provider>
-      </ScopedCssBaseline>
+      <OdysseyDesignTokensContext.Provider value={odysseyTokens}>
+        {children}
+      </OdysseyDesignTokensContext.Provider>
     </MuiThemeProvider>
   );
 };