[Docs] No mention of having to wrap the components with ThemeProvider

I upgraded my project from Material UI V3 to V4 (Beta).

After the upgrade I changed my withStyles imports from:

import withStyles from '@material-ui/core/styles/withStyles';

to

import withStyles from '@material-ui/styles/withStyles';

Now I get the error message:

index.js:1446 Warning: Material-UI: the `styles` argument provided is invalid.
You are providing a function without a theme in the context.
One of the parent elements needs to use a ThemeProvider.

Do you always have to use a ThemeProvider as of Material-UI 4? If yes, I think this should be mentioned in the docs somewhere. Before I think the was a default value supplied. At least my styles would work without having a ThemeProvider.

[Zache]

I’m on vacation so I don’t have computer access, but the makeStyles function takes an object with options. One of the options is defaultTheme, which I assign the same theme that the ThemeProvider gets (imported from some module)

I hope this makes sense

On Thu, 1 Aug 2019, 12:42 Harley Alexander, [e-mail] wrote:

@Zache https://github.com/Zache can you please provide an example?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/mui-org/material-ui/issues/15528?email_source=notifications&email_token=AA3AXQBWIDFEKW7TPH35443QCK4ZDA5CNFSM4HJJFZFKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD3KEZTQ#issuecomment-517229774, or mute the thread https://github.com/notifications/unsubscribe-auth/AA3AXQBQGXF6ABQ52VDAPHTQCK4ZDANCNFSM4HJJFZFA .

[eps1lon]

Do you always have to use a ThemeProvider as of Material-UI 4?

For import withStyles from '@material-ui/styles/withStyles';, yes. For import withStyles from '@material-ui/core/styles/withStyles';, no.

It’s the first segment in https://next.material-ui.com/css-in-js/advanced/. Maybe we can emphasize more that the two imports use different defaults but I doubt it will help much.

PS: Prefer import { withStyles } from '@material-ui/core/styles'; . The path import has limited tree-shaking support.