components/provider/SCThemeProvider
Variables
SCThemeContext
const
SCThemeContext:Context
<SCThemeContextType
>
Creates Global Context
1. <SCThemeContext.Consumer>{(theme,) => (...)}</SCThemeContext.Consumer>
2. const scThemeContext: SCThemeContextType = useContext(SCThemeContext);
3. const scThemeContext: SCThemeContextType = useSCTheme();
Source
packages/react-core/src/components/provider/SCThemeProvider/index.tsx:28
Functions
SCThemeProvider()
SCThemeProvider(
children
):JSX.Element
Description:
This component makes the theme
available down the React tree.
It should preferably be used at the root of your component tree.
See: https://mui.com/system/styled/
Parameters
Parameter | Type | Description |
---|---|---|
children | object | |
children.children | ReactNode | - |
Returns
JSX.Element
<SCThemeContext.Provider value={{theme, setTheme: setCustomTheme}}>
<ThemeProvider theme={theme}>{children}</ThemeProvider>
</SCThemeContext.Provider>
Source
packages/react-core/src/components/provider/SCThemeProvider/index.tsx:44
useSCTheme()
useSCTheme():
SCThemeContextType
Let's only export the useSCTheme
hook instead of the context.
We only want to use the hook directly and never the context component.
Returns
Source
packages/react-core/src/components/provider/SCThemeProvider/index.tsx:89
withSCTheme()
withSCTheme(
Component
): (props
) =>Element
Export hoc to inject the base theme to components
Parameters
Parameter | Type | Description |
---|---|---|
Component | any |
Returns
Function
Parameters
Parameter | Type |
---|---|
props | any |
Returns
Element
Source
packages/react-core/src/components/provider/SCThemeProvider/index.tsx:76