forked from mui/material-ui
-
Notifications
You must be signed in to change notification settings - Fork 1
/
BrandingProvider.tsx
36 lines (34 loc) · 1.17 KB
/
BrandingProvider.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
import * as React from 'react';
import { ThemeProvider, useTheme, createTheme } from '@mui/material/styles';
import CssBaseline from '@mui/material/CssBaseline';
import { getDesignTokens, getThemedComponents } from 'docs/src/modules/brandingTheme';
import { NextNProgressBar } from 'docs/src/modules/components/AppFrame';
import SkipLink from 'docs/src/modules/components/SkipLink';
interface BrandingProviderProps {
children: React.ReactNode;
/**
* If not `undefined`, the provider is considered nesting and does not render NextNProgressBar & CssBaseline
*/
mode?: 'light' | 'dark';
}
export default function BrandingProvider(props: BrandingProviderProps) {
const { children, mode: modeProp } = props;
const upperTheme = useTheme();
const mode = modeProp || upperTheme.palette.mode;
const theme = React.useMemo(
() =>
createTheme({
...getDesignTokens(mode),
...getThemedComponents(),
}),
[mode],
);
return (
<ThemeProvider theme={modeProp ? () => theme : theme}>
{modeProp ? null : <NextNProgressBar />}
{modeProp ? null : <CssBaseline />}
{modeProp ? null : <SkipLink />}
{children}
</ThemeProvider>
);
}