Skip to content

Commit 2564e45

Browse files
oliviertassinarioliviertassinari
committed
[styles] Remove the old styles modules
1 parent 7a49f80 commit 2564e45

File tree

108 files changed

+565
-2508
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

108 files changed

+565
-2508
lines changed

‎docs/scripts/buildApi.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import generateMarkdown from '../src/modules/utils/generateMarkdown';
88
import { findPagesMarkdown, findComponents } from '../src/modules/utils/find';
99
import { getHeaders } from '../src/modules/utils/parseMarkdown';
1010
import createMuiTheme from '../../packages/material-ui/src/styles/createMuiTheme';
11-
import getStylesCreator from '../../packages/material-ui/src/styles/getStylesCreator';
11+
import getStylesCreator from '../../packages/material-ui-styles/src/getStylesCreator';
1212

1313
function ensureExists(pat, mask, cb) {
1414
mkdir(pat, mask, err => {

‎docs/src/modules/components/AppWrapper.js

+2-3
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,7 @@ import React from 'react';
22
import PropTypes from 'prop-types';
33
import { connect } from 'react-redux';
44
import url from 'url';
5-
import { MuiThemeProvider } from '@material-ui/core/styles';
6-
import { StylesProvider } from '@material-ui/styles';
5+
import { StylesProvider, ThemeProvider } from '@material-ui/styles';
76
import acceptLanguage from 'accept-language';
87
import { lightTheme, darkTheme, setPrismTheme } from '@material-ui/docs/MarkdownElement/prism';
98
import { updatePageContext } from 'docs/src/modules/styles/getPageContext';
@@ -186,7 +185,7 @@ class AppWrapper extends React.Component {
186185
sheetsManager={pageContext.sheetsManager}
187186
sheetsRegistry={pageContext.sheetsRegistry}
188187
>
189-
<MuiThemeProvider theme={pageContext.theme}>{children}</MuiThemeProvider>
188+
<ThemeProvider theme={pageContext.theme}>{children}</ThemeProvider>
190189
<SideEffects />
191190
</StylesProvider>
192191
);

‎docs/src/modules/components/DemoFrame.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import React from 'react';
22
import PropTypes from 'prop-types';
33
import { create } from 'jss';
4-
import { withStyles, jssPreset } from '@material-ui/core/styles';
5-
import { StylesProvider } from '@material-ui/styles';
4+
import { withStyles } from '@material-ui/core/styles';
5+
import { jssPreset, StylesProvider } from '@material-ui/styles';
66
import NoSsr from '@material-ui/core/NoSsr';
77
import rtl from 'jss-rtl';
88
import Frame from 'react-frame-component';

‎docs/src/modules/components/bootstrap.js

-3
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,10 @@
11
// Use the same helper as Babel to avoid bundle bloat.
22
import 'core-js/modules/es6.array.find-index';
33
import 'core-js/modules/es6.set';
4-
import { install } from '@material-ui/styles';
54

65
// Disable auto highlighting
76
// https://github.com/PrismJS/prism/issues/765
87
if (process.browser) {
98
window.Prism = window.Prism || {};
109
window.Prism.manual = true;
1110
}
12-
13-
install();

‎docs/src/pages/customization/overrides/DynamicThemeNesting.js

+4-3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React from 'react';
22
import Button from '@material-ui/core/Button';
3-
import { createMuiTheme, MuiThemeProvider } from '@material-ui/core/styles';
3+
import { createMuiTheme } from '@material-ui/core/styles';
4+
import { ThemeProvider } from '@material-ui/styles';
45
import FormControlLabel from '@material-ui/core/FormControlLabel';
56
import blue from '@material-ui/core/colors/blue';
67
import Switch from '@material-ui/core/Switch';
@@ -30,7 +31,7 @@ class DynamicThemeNesting extends React.Component {
3031
}
3132
label="Blue"
3233
/>
33-
<MuiThemeProvider
34+
<ThemeProvider
3435
theme={
3536
this.state.color === 'blue'
3637
? {
@@ -49,7 +50,7 @@ class DynamicThemeNesting extends React.Component {
4950
<Button variant="contained" color="secondary">
5051
{'Theme nesting'}
5152
</Button>
52-
</MuiThemeProvider>
53+
</ThemeProvider>
5354
</React.Fragment>
5455
);
5556
}

‎docs/src/pages/customization/themes/CustomStyles.js

+4-3
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,8 @@
11
import React from 'react';
22
import PropTypes from 'prop-types';
33
import Checkbox from '@material-ui/core/Checkbox';
4-
import { createMuiTheme, MuiThemeProvider, withStyles } from '@material-ui/core/styles';
4+
import { createMuiTheme, withStyles } from '@material-ui/core/styles';
5+
import { ThemeProvider } from '@material-ui/styles';
56
import orange from '@material-ui/core/colors/orange';
67

78
const styles = theme => ({
@@ -39,9 +40,9 @@ const theme = createMuiTheme({
3940

4041
function CustomStyles() {
4142
return (
42-
<MuiThemeProvider theme={theme}>
43+
<ThemeProvider theme={theme}>
4344
<CustomCheckbox />
44-
</MuiThemeProvider>
45+
</ThemeProvider>
4546
);
4647
}
4748

‎docs/src/pages/customization/themes/DarkTheme.js

+4-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import React from 'react';
2-
import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles';
2+
import { createMuiTheme } from '@material-ui/core/styles';
3+
import { ThemeProvider } from '@material-ui/styles';
34
import WithTheme from './WithTheme';
45

56
const theme = createMuiTheme({
@@ -10,9 +11,9 @@ const theme = createMuiTheme({
1011

1112
function DarkTheme() {
1213
return (
13-
<MuiThemeProvider theme={theme}>
14+
<ThemeProvider theme={theme}>
1415
<WithTheme />
15-
</MuiThemeProvider>
16+
</ThemeProvider>
1617
);
1718
}
1819

‎docs/src/pages/customization/themes/FontSizeTheme.js

+4-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import React from 'react';
2-
import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles';
2+
import { createMuiTheme } from '@material-ui/core/styles';
3+
import { ThemeProvider } from '@material-ui/styles';
34
import Typography from '@material-ui/core/Typography';
45

56
const theme = createMuiTheme({
@@ -11,9 +12,9 @@ const theme = createMuiTheme({
1112

1213
function FontSizeTheme() {
1314
return (
14-
<MuiThemeProvider theme={theme}>
15+
<ThemeProvider theme={theme}>
1516
<Typography>body1</Typography>
16-
</MuiThemeProvider>
17+
</ThemeProvider>
1718
);
1819
}
1920

‎docs/src/pages/customization/themes/OverridesCss.js

+4-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import React from 'react';
2-
import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles';
2+
import { createMuiTheme } from '@material-ui/core/styles';
3+
import { ThemeProvider } from '@material-ui/styles';
34
import Button from '@material-ui/core/Button';
45

56
const theme = createMuiTheme({
@@ -23,9 +24,9 @@ const theme = createMuiTheme({
2324

2425
function OverridesCss() {
2526
return (
26-
<MuiThemeProvider theme={theme}>
27+
<ThemeProvider theme={theme}>
2728
<Button>Overrides CSS</Button>
28-
</MuiThemeProvider>
29+
</ThemeProvider>
2930
);
3031
}
3132

‎docs/src/pages/customization/themes/OverridesProperties.js

+4-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import React from 'react';
2-
import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles';
2+
import { createMuiTheme } from '@material-ui/core/styles';
3+
import { ThemeProvider } from '@material-ui/styles';
34
import Button from '@material-ui/core/Button';
45

56
const theme = createMuiTheme({
@@ -14,9 +15,9 @@ const theme = createMuiTheme({
1415

1516
function OverridesProperties() {
1617
return (
17-
<MuiThemeProvider theme={theme}>
18+
<ThemeProvider theme={theme}>
1819
<Button>Overrides properties</Button>
19-
</MuiThemeProvider>
20+
</ThemeProvider>
2021
);
2122
}
2223

‎docs/src/pages/customization/themes/Palette.js

+4-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import React from 'react';
2-
import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles';
2+
import { createMuiTheme } from '@material-ui/core/styles';
3+
import { ThemeProvider } from '@material-ui/styles';
34
import purple from '@material-ui/core/colors/purple';
45
import Button from '@material-ui/core/Button';
56

@@ -12,10 +13,10 @@ const theme = createMuiTheme({
1213

1314
function Palette() {
1415
return (
15-
<MuiThemeProvider theme={theme}>
16+
<ThemeProvider theme={theme}>
1617
<Button color="primary">Primary</Button>
1718
<Button color="secondary">Secondary</Button>
18-
</MuiThemeProvider>
19+
</ThemeProvider>
1920
);
2021
}
2122

‎docs/src/pages/customization/themes/ThemeNesting.js

+6-5
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import React from 'react';
2-
import { createMuiTheme, MuiThemeProvider } from '@material-ui/core/styles';
2+
import { createMuiTheme } from '@material-ui/core/styles';
3+
import { ThemeProvider } from '@material-ui/styles';
34
import Checkbox from '@material-ui/core/Checkbox';
45
import orange from '@material-ui/core/colors/orange';
56
import green from '@material-ui/core/colors/green';
@@ -22,12 +23,12 @@ const innerTheme = createMuiTheme({
2223

2324
function ThemeNesting() {
2425
return (
25-
<MuiThemeProvider theme={outerTheme}>
26+
<ThemeProvider theme={outerTheme}>
2627
<Checkbox defaultChecked />
27-
<MuiThemeProvider theme={innerTheme}>
28+
<ThemeProvider theme={innerTheme}>
2829
<Checkbox defaultChecked />
29-
</MuiThemeProvider>
30-
</MuiThemeProvider>
30+
</ThemeProvider>
31+
</ThemeProvider>
3132
);
3233
}
3334

‎docs/src/pages/customization/themes/ThemeNestingExtend.js

+6-5
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import React from 'react';
2-
import { createMuiTheme, MuiThemeProvider } from '@material-ui/core/styles';
2+
import { createMuiTheme } from '@material-ui/core/styles';
3+
import { ThemeProvider } from '@material-ui/styles';
34
import Checkbox from '@material-ui/core/Checkbox';
45
import orange from '@material-ui/core/colors/orange';
56
import green from '@material-ui/core/colors/green';
@@ -14,9 +15,9 @@ const outerTheme = createMuiTheme({
1415

1516
function ThemeNestingExtend() {
1617
return (
17-
<MuiThemeProvider theme={outerTheme}>
18+
<ThemeProvider theme={outerTheme}>
1819
<Checkbox defaultChecked />
19-
<MuiThemeProvider
20+
<ThemeProvider
2021
theme={theme =>
2122
createMuiTheme({
2223
...theme,
@@ -31,8 +32,8 @@ function ThemeNestingExtend() {
3132
>
3233
<Checkbox defaultChecked color="primary" />
3334
<Checkbox defaultChecked color="secondary" />
34-
</MuiThemeProvider>
35-
</MuiThemeProvider>
35+
</ThemeProvider>
36+
</ThemeProvider>
3637
);
3738
}
3839

‎docs/src/pages/customization/themes/TypographyTheme.js

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React from 'react';
22
import PropTypes from 'prop-types';
3-
import { MuiThemeProvider, createMuiTheme, withStyles } from '@material-ui/core/styles';
3+
import { createMuiTheme, withStyles } from '@material-ui/core/styles';
4+
import { ThemeProvider } from '@material-ui/styles';
45
import Typography from '@material-ui/core/Typography';
56
import Button from '@material-ui/core/Button';
67

@@ -52,7 +53,7 @@ function TypographyTheme(props) {
5253
return (
5354
<div className={classes.root}>
5455
{children}
55-
<MuiThemeProvider theme={theme}>{children}</MuiThemeProvider>
56+
<ThemeProvider theme={theme}>{children}</ThemeProvider>
5657
</div>
5758
);
5859
}

‎docs/src/pages/demos/buttons/CustomizedButtons.js

+5-4
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,8 @@
11
import React from 'react';
22
import PropTypes from 'prop-types';
33
import clsx from 'clsx';
4-
import { createMuiTheme, MuiThemeProvider, withStyles } from '@material-ui/core/styles';
4+
import { createMuiTheme, withStyles } from '@material-ui/core/styles';
5+
import { ThemeProvider } from '@material-ui/styles';
56
import Button from '@material-ui/core/Button';
67
import purple from '@material-ui/core/colors/purple';
78
import green from '@material-ui/core/colors/green';
@@ -67,11 +68,11 @@ function CustomizedButtons(props) {
6768
<Button variant="contained" color="primary" className={clsx(classes.margin, classes.cssRoot)}>
6869
Custom CSS
6970
</Button>
70-
<MuiThemeProvider theme={theme}>
71+
<ThemeProvider theme={theme}>
7172
<Button variant="contained" color="primary" className={classes.margin}>
72-
MuiThemeProvider
73+
ThemeProvider
7374
</Button>
74-
</MuiThemeProvider>
75+
</ThemeProvider>
7576
<Button
7677
variant="contained"
7778
color="primary"

‎docs/src/pages/demos/buttons/CustomizedButtons.tsx

+4-4
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,11 @@ import clsx from 'clsx';
44
import {
55
createMuiTheme,
66
createStyles,
7-
MuiThemeProvider,
87
Theme,
98
withStyles,
109
WithStyles,
1110
} from '@material-ui/core/styles';
11+
import { ThemeProvider } from '@material-ui/styles';
1212
import Button from '@material-ui/core/Button';
1313
import purple from '@material-ui/core/colors/purple';
1414
import green from '@material-ui/core/colors/green';
@@ -75,11 +75,11 @@ function CustomizedButtons(props: WithStyles<typeof styles>) {
7575
<Button variant="contained" color="primary" className={clsx(classes.margin, classes.cssRoot)}>
7676
Custom CSS
7777
</Button>
78-
<MuiThemeProvider theme={theme}>
78+
<ThemeProvider theme={theme}>
7979
<Button variant="contained" color="primary" className={classes.margin}>
80-
MuiThemeProvider
80+
ThemeProvider
8181
</Button>
82-
</MuiThemeProvider>
82+
</ThemeProvider>
8383
<Button
8484
variant="contained"
8585
color="primary"

‎docs/src/pages/demos/text-fields/CustomizedInputs.js

+6-5
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React from 'react';
22
import PropTypes from 'prop-types';
3-
import { withStyles, MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles';
3+
import { withStyles, createMuiTheme } from '@material-ui/core/styles';
4+
import { ThemeProvider } from '@material-ui/styles';
45
import Input from '@material-ui/core/Input';
56
import InputBase from '@material-ui/core/InputBase';
67
import { fade } from '@material-ui/core/styles/colorManipulator';
@@ -136,20 +137,20 @@ function CustomizedInputs(props) {
136137
id="custom-css-outlined-input"
137138
/>
138139

139-
<MuiThemeProvider theme={theme}>
140+
<ThemeProvider theme={theme}>
140141
<TextField
141142
className={classes.margin}
142-
label="MuiThemeProvider"
143+
label="ThemeProvider"
143144
id="mui-theme-provider-standard-input"
144145
/>
145146

146147
<TextField
147148
className={classes.margin}
148-
label="MuiThemeProvider"
149+
label="ThemeProvider"
149150
variant="outlined"
150151
id="mui-theme-provider-outlined-input"
151152
/>
152-
</MuiThemeProvider>
153+
</ThemeProvider>
153154
<FormControl className={classes.margin}>
154155
<InputLabel shrink htmlFor="bootstrap-input" className={classes.bootstrapFormLabel}>
155156
Bootstrap

‎docs/src/pages/demos/text-fields/CustomizedInputs.tsx

+5-5
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,9 @@ import {
55
Theme,
66
withStyles,
77
WithStyles,
8-
MuiThemeProvider,
98
createMuiTheme,
109
} from '@material-ui/core/styles';
10+
import { ThemeProvider } from '@material-ui/styles';
1111
import Input from '@material-ui/core/Input';
1212
import InputBase from '@material-ui/core/InputBase';
1313
import { fade } from '@material-ui/core/styles/colorManipulator';
@@ -145,19 +145,19 @@ function CustomizedInputs(props: Props) {
145145
variant="outlined"
146146
id="custom-css-outlined-input"
147147
/>
148-
<MuiThemeProvider theme={theme}>
148+
<ThemeProvider theme={theme}>
149149
<TextField
150150
className={classes.margin}
151-
label="MuiThemeProvider"
151+
label="ThemeProvider"
152152
id="mui-theme-provider-standard-input"
153153
/>
154154
<TextField
155155
className={classes.margin}
156-
label="MuiThemeProvider"
156+
label="ThemeProvider"
157157
variant="outlined"
158158
id="mui-theme-provider-outlined-input"
159159
/>
160-
</MuiThemeProvider>
160+
</ThemeProvider>
161161
<FormControl className={classes.margin}>
162162
<InputLabel shrink htmlFor="bootstrap-input" className={classes.bootstrapFormLabel}>
163163
Bootstrap

0 commit comments

Comments
 (0)