@okta/odyssey-react-mui 1.14.1 → 1.14.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +6 -0
- package/dist/OdysseyProvider.js +0 -2
- package/dist/OdysseyProvider.js.map +1 -1
- package/dist/OdysseyThemeProvider.js +1 -28
- package/dist/OdysseyThemeProvider.js.map +1 -1
- package/dist/src/OdysseyProvider.d.ts.map +1 -1
- package/dist/src/OdysseyThemeProvider.d.ts +1 -3
- package/dist/src/OdysseyThemeProvider.d.ts.map +1 -1
- package/dist/tsconfig.production.tsbuildinfo +1 -1
- package/package.json +3 -3
- package/src/OdysseyProvider.tsx +0 -2
- package/src/OdysseyThemeProvider.tsx +5 -32
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@okta/odyssey-react-mui",
|
|
3
|
-
"version": "1.14.
|
|
3
|
+
"version": "1.14.2",
|
|
4
4
|
"description": "React MUI components for Odyssey, Okta's design system",
|
|
5
5
|
"author": "Okta, Inc.",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -51,7 +51,7 @@
|
|
|
51
51
|
"@mui/system": "^5.15.9",
|
|
52
52
|
"@mui/utils": "^5.15.9",
|
|
53
53
|
"@mui/x-date-pickers": "^5.0.15",
|
|
54
|
-
"@okta/odyssey-design-tokens": "^1.14.
|
|
54
|
+
"@okta/odyssey-design-tokens": "^1.14.2",
|
|
55
55
|
"date-fns": "^2.30.0",
|
|
56
56
|
"i18next": "^23.8.2",
|
|
57
57
|
"material-react-table": "^2.11.3",
|
|
@@ -63,5 +63,5 @@
|
|
|
63
63
|
"react": ">=17 <19",
|
|
64
64
|
"react-dom": ">=17 <19"
|
|
65
65
|
},
|
|
66
|
-
"gitHead": "
|
|
66
|
+
"gitHead": "0966a06e6eda85e0d9bae6a67988e08509feb82d"
|
|
67
67
|
}
|
package/src/OdysseyProvider.tsx
CHANGED
|
@@ -54,10 +54,8 @@ const OdysseyProvider = <SupportedLanguages extends string>({
|
|
|
54
54
|
>
|
|
55
55
|
<OdysseyThemeProvider
|
|
56
56
|
designTokensOverride={designTokensOverride}
|
|
57
|
-
emotionRoot={emotionRoot}
|
|
58
57
|
shadowDomElement={shadowDomElement}
|
|
59
58
|
themeOverride={themeOverride}
|
|
60
|
-
withCache={false}
|
|
61
59
|
>
|
|
62
60
|
<ScopedCssBaseline>
|
|
63
61
|
<OdysseyTranslationProvider<SupportedLanguages>
|
|
@@ -21,26 +21,24 @@ import { deepmerge } from "@mui/utils";
|
|
|
21
21
|
import { createOdysseyMuiTheme, DesignTokensOverride } from "./theme";
|
|
22
22
|
import * as Tokens from "@okta/odyssey-design-tokens";
|
|
23
23
|
import { OdysseyDesignTokensContext } from "./OdysseyDesignTokensContext";
|
|
24
|
-
import { CacheProvider } from "@emotion/react";
|
|
25
|
-
import createCache from "@emotion/cache";
|
|
26
|
-
import { useUniqueAlphabeticalId } from "./useUniqueAlphabeticalId";
|
|
27
24
|
|
|
28
25
|
export type OdysseyThemeProviderProps = {
|
|
29
26
|
children: ReactNode;
|
|
30
27
|
designTokensOverride?: DesignTokensOverride;
|
|
31
|
-
emotionRoot?: HTMLStyleElement;
|
|
32
28
|
shadowDomElement?: HTMLDivElement | HTMLElement | undefined;
|
|
33
29
|
themeOverride?: ThemeOptions;
|
|
34
|
-
withCache?: boolean;
|
|
35
30
|
};
|
|
36
31
|
|
|
32
|
+
/**
|
|
33
|
+
* This function doesn't include the Emotion Cache or Translations. You should probably be using `OdysseyProvider`.
|
|
34
|
+
*
|
|
35
|
+
* Some teams have a need to wrap separately (SIW), but most teams will never need to use this explicitly.
|
|
36
|
+
*/
|
|
37
37
|
const OdysseyThemeProvider = ({
|
|
38
38
|
children,
|
|
39
39
|
designTokensOverride,
|
|
40
|
-
emotionRoot,
|
|
41
40
|
shadowDomElement,
|
|
42
41
|
themeOverride,
|
|
43
|
-
withCache = true,
|
|
44
42
|
}: OdysseyThemeProviderProps) => {
|
|
45
43
|
const odysseyTokens = useMemo(
|
|
46
44
|
() => ({ ...Tokens, ...designTokensOverride }),
|
|
@@ -60,31 +58,6 @@ const OdysseyThemeProvider = ({
|
|
|
60
58
|
[odysseyTheme, themeOverride],
|
|
61
59
|
);
|
|
62
60
|
|
|
63
|
-
const uniqueAlphabeticalId = useUniqueAlphabeticalId();
|
|
64
|
-
|
|
65
|
-
const cache = useMemo(
|
|
66
|
-
() =>
|
|
67
|
-
createCache({
|
|
68
|
-
...(emotionRoot && { container: emotionRoot }),
|
|
69
|
-
key: uniqueAlphabeticalId,
|
|
70
|
-
prepend: true,
|
|
71
|
-
nonce: window.cspNonce,
|
|
72
|
-
speedy: false, // <-- Needs to be set to false when shadow-dom is used!! https://github.com/emotion-js/emotion/issues/2053#issuecomment-713429122
|
|
73
|
-
}),
|
|
74
|
-
[emotionRoot, uniqueAlphabeticalId],
|
|
75
|
-
);
|
|
76
|
-
|
|
77
|
-
if (withCache) {
|
|
78
|
-
return (
|
|
79
|
-
<CacheProvider value={cache}>
|
|
80
|
-
<MuiThemeProvider theme={customOdysseyTheme ?? odysseyTheme}>
|
|
81
|
-
<OdysseyDesignTokensContext.Provider value={odysseyTokens}>
|
|
82
|
-
{children}
|
|
83
|
-
</OdysseyDesignTokensContext.Provider>
|
|
84
|
-
</MuiThemeProvider>
|
|
85
|
-
</CacheProvider>
|
|
86
|
-
);
|
|
87
|
-
}
|
|
88
61
|
return (
|
|
89
62
|
<MuiThemeProvider theme={customOdysseyTheme ?? odysseyTheme}>
|
|
90
63
|
<OdysseyDesignTokensContext.Provider value={odysseyTokens}>
|