[core] Remove `createStyles` from `@material-ui/core` #26018

mnajdova · 2021-04-28T13:21:05Z

Deprecations

The createStyles function from @material-ui/core/styles was moved to @material-ui/styles. This helps use remove JSS from the core package.

-import { createStyles } from '@material-ui/core/styles';
+import { createStyles } from '@material-ui/styles';

One of the PRs that is necessary for removing @material-ui/styles as a dependency of @material-ui/core.

…ec.ts

eps1lon · 2021-04-28T15:36:14Z

On second thought, let's not go that way. Too many possible opinionated discussions. Let's keep it as function createStyles(): never; in the declarations and identity function at runtime.

mnajdova · 2021-04-28T16:15:06Z

On second thought, let's not go that way. Too many possible opinionated discussions. Let's keep it as function createStyles(): never; in the declarations and identity function at runtime.

Just to make sure I understand, are you saying I should add it back to @material-ui/core, just not to reference it from @material-ui/styles?

Edit: @eps1lon does this look correct e5ea6c2

eps1lon · 2021-04-28T16:44:44Z

packages/material-ui/src/styles/createStyles.js

-
-// let warnOnce = false;
-
-// To remove in v5


Let's move this to v6

Should we add a deprecation notice now? It was mentioned that it's only needed for notistack. notistack could clone this helper.

Also, with #1824 and #18098 we will likely roll out our own solution to the problem, so this demo https://next.material-ui.com/components/snackbars/#notistack is likely on its way out, in the long term.

Added back warning

docs/src/pages/styles/advanced/ThemeNesting.tsx

oliviertassinari · 2021-04-28T16:50:20Z

Just to make sure I understand, are you saying I should add it back to @material-ui/core, just not to reference it from @material-ui/styles?

I understood this as: it's too early to remove the module from the codebase, moving it from the core to styles should be enough.

mnajdova · 2021-04-28T17:27:41Z

I understood this as: it's too early to remove the module from the codebase, moving it from the core to styles should be enough.

Alright, but I cannot remove it from core completely because of the failing issue with notistack. So far I just replaced the imports, but looks like it’s better to just remove the usages of createStyles. Correct?

eps1lon · 2021-04-29T08:10:41Z

but looks like it’s better to just remove the usages of createStyles. Correct?

Yes. We'll just keep it at runtime to not cause crashes needlessly.

eps1lon

If the docs demos don't use createStyles we can drop the babel plugin as well. That was only used for internal usage.

eps1lon · 2021-04-29T08:17:10Z

docs/src/pages/guides/typescript/typescript.md

@@ -179,7 +179,8 @@ interface Props {
 However this isn't very [DRY](https://en.wikipedia.org/wiki/Don%27t_repeat_yourself) because it requires you to maintain the class names (`'root'`, `'paper'`, `'button'`, ...) in two different places. We provide a type operator `WithStyles` to help with this, so that you can just write:

 ```ts
-import { WithStyles, createStyles } from '@material-ui/core';
+import { createStyles } from '@material-ui/styles';


Let's remove the usage here as well.

Looks like if we remove this we should update the whole page, as it actually talks about how to solve typescript issues for withStyles. Should we recommend casting to const there too?

Yeah, let's do this another time.

mnajdova · 2021-04-29T08:26:22Z

@eps1lon how should we fix the type errors? There are issues on each file I touched. There are types issues on classes.root as well as on withStyles args.

eps1lon · 2021-04-29T08:28:47Z

Where removal of createStyles causes types issues use as const assertions:

-const styles = createStyles({});
+const styles = {} as const;

mnajdova · 2021-04-29T09:09:49Z

If the docs demos don't use createStyles we can drop the babel plugin as well. That was only used for internal usage.

Removed.

oliviertassinari · 2021-04-29T10:18:44Z

packages/material-ui/src/styles/createStyles.js

-
-// let warnOnce = false;
-
-// To remove in v5


Should we add a deprecation notice now? It was mentioned that it's only needed for notistack. notistack could clone this helper.

Also, with #1824 and #18098 we will likely roll out our own solution to the problem, so this demo https://next.material-ui.com/components/snackbars/#notistack is likely on its way out, in the long term.

docs/src/pages/guides/migration-v4/migration-v4.md

Co-authored-by: Olivier Tassinari <olivier.tassinari@gmail.com>

eps1lon

+291 −716

😍

oliviertassinari · 2021-04-29T11:57:58Z

I have updated the label as it seems to only be a depreciation now (there are no breaking changes).

mnajdova added 30 commits April 26, 2021 16:51

init

f65c6a5

revert

0492da2

test updates

a198803

remove warning

bd8a443

misc

8b81eeb

media query

10cd53f

fixes

14e546b

fixes

93a9281

ts fixes

7f63ba3

prettier

c7885cc

init

54ca796

reverted some changes

1e245c0

prettier & Popper fix

896d973

Merge branch 'next' into feat/extract-material-ui-theming

a69548a

add in ci.json

38ec9b2

update rollup

224f6d4

fix package

e34a84b

bump utils package

fd016d3

size snapshot

ae4713e

rename package

9cc6155

prettier

4aaa2fb

duplicate utlities

30bb8ed

spec fixes

ec40710

moved test to @material-ui/styles

b06797b

Update packages/material-ui-styles/src/getThemeProps/getThemeProps.sp…

40423b5

…ec.ts

Update packages/material-ui/src/styles/variants.d.ts

9f6cdbc

Merge branch 'feat/create-styles' into feat/remove-createStyles

5ea31d4

changes

031da6f

migration guide

5a023f2

Merge branch 'next' into feat/remove-createStyles

0038937

bring back createStyles

e5ea6c2

eps1lon reviewed Apr 28, 2021

View reviewed changes

github-actions bot mentioned this pull request Apr 28, 2021

Update snapshots for pr/26018 eps1lon/mui-scripts-incubator#2217

Closed

Merge branch 'next' into feat/remove-createStyles

7bdee91

mnajdova added 2 commits April 29, 2021 10:12

removed usages of createStyles & revreted heleprs.js changes

c09c7ec

add comment for removing it in v6

b8e70d5

eps1lon reviewed Apr 29, 2021

View reviewed changes

mnajdova added 2 commits April 29, 2021 10:35

add cast

ce52e09

removed plugin

80011da

mnajdova requested review from eps1lon and oliviertassinari April 29, 2021 09:20

oliviertassinari approved these changes Apr 29, 2021

View reviewed changes

mnajdova and others added 2 commits April 29, 2021 12:28

Update docs/src/pages/guides/migration-v4/migration-v4.md

555f4fd

Co-authored-by: Olivier Tassinari <olivier.tassinari@gmail.com>

add back warning

62d43a4

eps1lon approved these changes Apr 29, 2021

View reviewed changes

eps1lon added breaking change package: material-ui Specific to @mui/material package: styles Specific to @mui/styles. Legacy package, @material-ui/styled-engine is taking over in v5. labels Apr 29, 2021

mnajdova merged commit 14a4289 into mui:next Apr 29, 2021

oliviertassinari added deprecation New deprecation message and removed breaking change labels Apr 29, 2021

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[core] Remove `createStyles` from `@material-ui/core` #26018

[core] Remove `createStyles` from `@material-ui/core` #26018

mnajdova commented Apr 28, 2021 •

edited by oliviertassinari

eps1lon commented Apr 28, 2021

mnajdova commented Apr 28, 2021 •

edited

eps1lon Apr 28, 2021

oliviertassinari Apr 29, 2021 •

edited

mnajdova Apr 29, 2021

oliviertassinari commented Apr 28, 2021 •

edited

mnajdova commented Apr 28, 2021

eps1lon commented Apr 29, 2021

eps1lon left a comment

eps1lon Apr 29, 2021

mnajdova Apr 29, 2021

eps1lon Apr 29, 2021

mnajdova commented Apr 29, 2021

eps1lon commented Apr 29, 2021

mnajdova commented Apr 29, 2021

oliviertassinari Apr 29, 2021 •

edited

eps1lon left a comment

oliviertassinari commented Apr 29, 2021

[core] Remove createStyles from @material-ui/core #26018

[core] Remove createStyles from @material-ui/core #26018

Conversation

mnajdova commented Apr 28, 2021 • edited by oliviertassinari

eps1lon commented Apr 28, 2021

mnajdova commented Apr 28, 2021 • edited

eps1lon Apr 28, 2021

Choose a reason for hiding this comment

oliviertassinari Apr 29, 2021 • edited

Choose a reason for hiding this comment

mnajdova Apr 29, 2021

Choose a reason for hiding this comment

oliviertassinari commented Apr 28, 2021 • edited

mnajdova commented Apr 28, 2021

eps1lon commented Apr 29, 2021

eps1lon left a comment

Choose a reason for hiding this comment

eps1lon Apr 29, 2021

Choose a reason for hiding this comment

mnajdova Apr 29, 2021

Choose a reason for hiding this comment

eps1lon Apr 29, 2021

Choose a reason for hiding this comment

mnajdova commented Apr 29, 2021

eps1lon commented Apr 29, 2021

mnajdova commented Apr 29, 2021

oliviertassinari Apr 29, 2021 • edited

Choose a reason for hiding this comment

eps1lon left a comment

Choose a reason for hiding this comment

oliviertassinari commented Apr 29, 2021

[core] Remove `createStyles` from `@material-ui/core` #26018

[core] Remove `createStyles` from `@material-ui/core` #26018

mnajdova commented Apr 28, 2021 •

edited by oliviertassinari

mnajdova commented Apr 28, 2021 •

edited

oliviertassinari Apr 29, 2021 •

edited

oliviertassinari commented Apr 28, 2021 •

edited

oliviertassinari Apr 29, 2021 •

edited