Merge pull request #6911 from oliviertassinari/hoc-migration

[core] Add a new classes property to all the components
mui · May 22, 2017 · cc591b1 · cc591b1
2 parents e004435 + b8feb4f
commit cc591b1
Show file tree

Hide file tree

Showing 374 changed files with 4,016 additions and 4,028 deletions.
diff --git a/docs/src/components/AppContent.js b/docs/src/components/AppContent.js
@@ -6,21 +6,19 @@ import classNames from 'classnames';
 import { withStyles, createStyleSheet } from 'material-ui/styles';
 import MarkdownElement from 'docs/src/components/MarkdownElement';
 
-const styleSheet = createStyleSheet('AppContent', (theme) => {
-  return {
-    content: theme.mixins.gutters({
-      paddingTop: 80,
-      flex: '1 1 100%',
-      maxWidth: '100%',
-      margin: '0 auto',
-    }),
-    [theme.breakpoints.up(948)]: {
-      content: {
-        maxWidth: 900,
-      },
+const styleSheet = createStyleSheet('AppContent', (theme) => ({
+  content: theme.mixins.gutters({
+    paddingTop: 80,
+    flex: '1 1 100%',
+    maxWidth: '100%',
+    margin: '0 auto',
+  }),
+  [theme.breakpoints.up(948)]: {
+    content: {
+      maxWidth: 900,
     },
-  };
-});
+  },
+}));
 
 function AppContent(props) {
   const {

diff --git a/docs/src/components/AppDrawer.js b/docs/src/components/AppDrawer.js
@@ -11,28 +11,26 @@ import Divider from 'material-ui/Divider';
 import AppDrawerNavItem from 'docs/src/components/AppDrawerNavItem';
 import Link from 'docs/src/components/Link';
 
-const styleSheet = createStyleSheet('AppDrawer', (theme) => {
-  return {
-    paper: {
-      width: 250,
-      backgroundColor: theme.palette.background.paper,
+const styleSheet = createStyleSheet('AppDrawer', (theme) => ({
+  paper: {
+    width: 250,
+    backgroundColor: theme.palette.background.paper,
+  },
+  title: {
+    color: theme.palette.text.secondary,
+    '&:hover': {
+      color: theme.palette.primary[500],
     },
-    title: {
-      color: theme.palette.text.secondary,
-      '&:hover': {
-        color: theme.palette.primary[500],
-      },
-    },
-    toolbar: {
-      flexDirection: 'column',
-      alignItems: 'flex-start',
-      justifyContent: 'center',
-    },
-    anchor: {
-      color: theme.palette.text.secondary,
-    },
-  };
-});
+  },
+  toolbar: {
+    flexDirection: 'column',
+    alignItems: 'flex-start',
+    justifyContent: 'center',
+  },
+  anchor: {
+    color: theme.palette.text.secondary,
+  },
+}));
 
 function renderNavItems(props, navRoot) {
   let navItems = null;
@@ -120,8 +118,4 @@ AppDrawer.propTypes = {
   routes: PropTypes.array.isRequired,
 };
 
-AppDrawer.contextTypes = {
-  styleManager: PropTypes.object.isRequired,
-};
-
 export default withStyles(styleSheet)(AppDrawer);
diff --git a/docs/src/components/AppDrawerNavItem.js b/docs/src/components/AppDrawerNavItem.js
@@ -9,39 +9,37 @@ import { ListItem } from 'material-ui/List';
 import Button from 'material-ui/Button';
 import Collapse from 'material-ui/transitions/Collapse';
 
-const styleSheet = createStyleSheet('AppDrawerNavItem', (theme) => {
-  return {
-    button: theme.mixins.gutters({
-      borderRadius: 0,
-      justifyContent: 'flex-start',
-      textTransform: 'none',
-      width: '100%',
-      '&:hover': {
-        textDecoration: 'none',
-      },
-    }),
-    navItem: {
-      ...theme.typography.body2,
-      display: 'block',
-      paddingTop: 0,
-      paddingBottom: 0,
+const styleSheet = createStyleSheet('AppDrawerNavItem', (theme) => ({
+  button: theme.mixins.gutters({
+    borderRadius: 0,
+    justifyContent: 'flex-start',
+    textTransform: 'none',
+    width: '100%',
+    '&:hover': {
+      textDecoration: 'none',
     },
-    navLink: {
-      fontWeight: theme.typography.fontWeightRegular,
-      display: 'flex',
-      paddingTop: 0,
-      paddingBottom: 0,
-    },
-    navLinkButton: {
-      color: theme.palette.text.secondary,
-      textIndent: 24,
-      fontSize: 13,
-    },
-    activeButton: {
-      color: theme.palette.text.primary,
-    },
-  };
-});
+  }),
+  navItem: {
+    ...theme.typography.body2,
+    display: 'block',
+    paddingTop: 0,
+    paddingBottom: 0,
+  },
+  navLink: {
+    fontWeight: theme.typography.fontWeightRegular,
+    display: 'flex',
+    paddingTop: 0,
+    paddingBottom: 0,
+  },
+  navLinkButton: {
+    color: theme.palette.text.secondary,
+    textIndent: 24,
+    fontSize: 13,
+  },
+  activeButton: {
+    color: theme.palette.text.primary,
+  },
+}));
 
 class AppDrawerNavItem extends Component {
   static defaultProps = {

diff --git a/docs/src/components/AppFrame.js b/docs/src/components/AppFrame.js
@@ -28,65 +28,63 @@ function getTitle(routes) {
   return null;
 }
 
-const styleSheet = createStyleSheet('AppFrame', (theme) => {
-  return {
-    '@global': {
-      html: {
-        boxSizing: 'border-box',
-      },
-      '*, *:before, *:after': {
-        boxSizing: 'inherit',
-      },
-      body: {
-        margin: 0,
-        background: theme.palette.background.default,
-        color: theme.palette.text.primary,
-        lineHeight: '1.2',
-        overflowX: 'hidden',
-        WebkitFontSmoothing: 'antialiased', // Antialiasing.
-        MozOsxFontSmoothing: 'grayscale', // Antialiasing.
-      },
-      img: {
-        maxWidth: '100%',
-        height: 'auto',
-        width: 'auto',
-      },
+const styleSheet = createStyleSheet('AppFrame', (theme) => ({
+  '@global': {
+    html: {
+      boxSizing: 'border-box',
     },
-    appFrame: {
-      display: 'flex',
-      alignItems: 'stretch',
-      minHeight: '100vh',
-      width: '100%',
+    '*, *:before, *:after': {
+      boxSizing: 'inherit',
     },
-    grow: {
-      flex: '1 1 auto',
+    body: {
+      margin: 0,
+      background: theme.palette.background.default,
+      color: theme.palette.text.primary,
+      lineHeight: '1.2',
+      overflowX: 'hidden',
+      WebkitFontSmoothing: 'antialiased', // Antialiasing.
+      MozOsxFontSmoothing: 'grayscale', // Antialiasing.
     },
-    title: {
-      marginLeft: 24,
-      flex: '0 1 auto',
+    img: {
+      maxWidth: '100%',
+      height: 'auto',
+      width: 'auto',
     },
-    appBar: {
-      left: 'auto',
-      right: 0,
-      transition: theme.transitions.create('width'),
+  },
+  appFrame: {
+    display: 'flex',
+    alignItems: 'stretch',
+    minHeight: '100vh',
+    width: '100%',
+  },
+  grow: {
+    flex: '1 1 auto',
+  },
+  title: {
+    marginLeft: 24,
+    flex: '0 1 auto',
+  },
+  appBar: {
+    left: 'auto',
+    right: 0,
+    transition: theme.transitions.create('width'),
+  },
+  appBarHome: {
+    backgroundColor: 'transparent',
+    boxShadow: 'none',
+  },
+  [theme.breakpoints.up('lg')]: {
+    drawer: {
+      width: '250px',
     },
-    appBarHome: {
-      backgroundColor: 'transparent',
-      boxShadow: 'none',
+    appBarShift: {
+      width: 'calc(100% - 250px)',
     },
-    [theme.breakpoints.up('lg')]: {
-      drawer: {
-        width: '250px',
-      },
-      appBarShift: {
-        width: 'calc(100% - 250px)',
-      },
-      navIconHide: {
-        display: 'none',
-      },
+    navIconHide: {
+      display: 'none',
     },
-  };
-});
+  },
+}));
 
 class AppFrame extends Component {
   state = {