[Docs] Clean the docs

docs/src/app/app-routes.jsx

@@ -114,4 +114,4 @@ const AppRoutes = (
   </Route>
 );
 
-module.exports = AppRoutes;
+export default AppRoutes;

docs/src/app/components/app-left-nav.jsx

@@ -91,4 +91,4 @@ const AppLeftNav = React.createClass({
 
 });
 
-module.exports = AppLeftNav;
+export default AppLeftNav;

docs/src/app/components/code-example/code-block.jsx

@@ -57,4 +57,4 @@ const CodeBlock = React.createClass({
   },
 });
 
-module.exports = CodeBlock;
+export default CodeBlock;

docs/src/app/components/code-example/code-example.jsx

@@ -94,4 +94,4 @@ const CodeExample = React.createClass({
   },
 });
 
-module.exports = CodeExample;
+export default CodeExample;

docs/src/app/components/component-doc.jsx

@@ -135,4 +135,4 @@ const ComponentDoc = React.createClass({
 
 });
 
-module.exports = ComponentDoc;
+export default ComponentDoc;

docs/src/app/components/component-info.jsx

@@ -177,4 +177,4 @@ const ComponentInfo = React.createClass({
   },
 });
 
-module.exports = ComponentInfo;
+export default ComponentInfo;

docs/src/app/components/full-width-section.jsx

@@ -78,4 +78,4 @@ let FullWidthSection = React.createClass({
   },
 });
 
-module.exports = FullWidthSection;
+export default FullWidthSection;

docs/src/app/components/master.jsx

@@ -255,4 +255,4 @@ const Master = React.createClass({
   },
 });
 
-module.exports = Master;
+export default Master;

docs/src/app/components/mobile-tear-sheet.jsx

@@ -57,4 +57,4 @@ const MobileTearSheet = React.createClass({
 
 });
 
-module.exports = MobileTearSheet;
+export default MobileTearSheet;

docs/src/app/components/pages/components/app-bar.jsx

@@ -1,15 +1,16 @@
 import React from 'react';
-import {AppBar, Paper} from 'material-ui';
+import AppBar from 'material-ui/app-bar';
+import Paper from 'material-ui/paper';
 import IconButton from 'icon-button';
-import NavigationClose from 'svg-icons/navigation/close';
+import NavigationClose from 'material-ui/svg-icons/navigation/close';
 import FlatButton from 'flat-button';
 import ComponentDoc from '../../component-doc';
 import CodeExample from '../../code-example/code-example';
 import CodeBlock from '../../code-example/code-block';
 import Code from 'app-bar-code';
 import IconMenu from 'menus/icon-menu';
 import MenuItem from 'menus/menu-item';
-import MoreVertIcon from 'svg-icons/navigation/more-vert';
+import MoreVertIcon from 'material-ui/svg-icons/navigation/more-vert';
 
 const styles = {
   title: {

docs/src/app/components/pages/components/auto-complete.jsx

@@ -92,4 +92,4 @@ class AutoCompletePage extends React.Component {
 
 }
 
-module.exports = AutoCompletePage;
+export default AutoCompletePage;

docs/src/app/components/pages/components/avatars.jsx

@@ -1,7 +1,14 @@
 import React from 'react';
-import {Avatar, FontIcon, List, ListItem, Styles, Paper} from 'material-ui';
+import {
+  Avatar,
+  FontIcon,
+  List,
+  ListItem,
+  Styles,
+  Paper,
+} from 'material-ui';
 import ComponentDoc from '../../component-doc';
-import FileFolder from 'svg-icons/file/folder';
+import FileFolder from 'material-ui/svg-icons/file/folder';
 const {Colors} = Styles;
 import Code from 'avatars-code';
 import CodeExample from '../../code-example/code-example';

docs/src/app/components/pages/components/badge.jsx

@@ -1,12 +1,16 @@
 import React from 'react';
-import {IconButton, Badge, Paper} from 'material-ui';
+import {
+  IconButton,
+  Badge,
+  Paper,
+} from 'material-ui';
 import ComponentDoc from '../../component-doc';
 import Code from 'badge-code';
 import CodeExample from '../../code-example/code-example';
-import NotificationsIcon from 'svg-icons/social/notifications';
-import ShoppingCartIcon from 'svg-icons/action/shopping-cart';
-import FolderIcon from 'svg-icons/file/folder-open';
-import UploadIcon from 'svg-icons/file/cloud-upload';
+import NotificationsIcon from 'material-ui/svg-icons/social/notifications';
+import ShoppingCartIcon from 'material-ui/svg-icons/action/shopping-cart';
+import FolderIcon from 'material-ui/svg-icons/file/folder-open';
+import UploadIcon from 'material-ui/svg-icons/file/cloud-upload';
 import CodeBlock from '../../code-example/code-block';
 
 export default class BadgePage extends React.Component {

docs/src/app/components/pages/components/buttons.jsx

@@ -1,9 +1,8 @@
 import React from 'react';
 import ComponentDoc from '../../component-doc';
-import mui from 'material-ui';
-import ToggleStar from 'svg-icons/toggle/star';
+import ToggleStar from 'material-ui/svg-icons/toggle/star';
 
-const {
+import {
   FlatButton,
   FloatingActionButton,
   FontIcon,
@@ -13,7 +12,7 @@ const {
   Tab,
   Tabs,
   Utils,
-} = mui;
+} from 'material-ui';
 const extend = Utils.Extend;
 const {Colors, Typography} = Styles;
 import RaisedButtonCode from 'raised-button-code';

docs/src/app/components/pages/components/grid-list.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import {GridList, GridTile, Paper} from 'material-ui';
 
-import StarBorder from 'svg-icons/toggle/star-border';
+import StarBorder from 'material-ui/svg-icons/toggle/star-border';
 import IconButton from 'icon-button';
 
 import ComponentDoc from '../../component-doc';
@@ -241,4 +241,4 @@ class GridListPage extends React.Component {
 
 }
 
-module.exports = GridListPage;
+export default GridListPage;

docs/src/app/components/pages/components/icon-buttons.jsx

@@ -1,7 +1,11 @@
 import React from 'react';
-import {FontIcon, IconButton, Paper} from 'material-ui';
+import {
+  FontIcon,
+  IconButton,
+  Paper,
+} from 'material-ui';
 import ComponentDoc from '../../component-doc';
-import ActionGrade from 'svg-icons/action/grade';
+import ActionGrade from 'material-ui/svg-icons/action/grade';
 import Code from 'icon-buttons-code';
 import CodeExample from '../../code-example/code-example';
 import CodeBlock from '../../code-example/code-block';
@@ -11,11 +15,12 @@ export default class IconButtonsPage extends React.Component {
   render() {
 
     let desc = (
-      <p>
-        This component generates a button element and all props.
-        Also, focus styles will happen on tab but not on click.
-        There are three ways to add an icon:
-        <br/>
+      <div>
+        <p>
+          This component generates a button element and all props.
+          Also, focus styles will happen on tab but not on click.
+          There are three ways to add an icon:
+        </p>
         <ol>
           <li>
             For stylesheets: Set the prop "iconClassName" to the
@@ -40,7 +45,7 @@ export default class IconButtonsPage extends React.Component {
             iconClassName prop.
           </li>
         </ol>
-      </p>
+      </div>
     );
 
     let componentInfo = [

docs/src/app/components/pages/components/icon-menus.jsx

@@ -3,17 +3,17 @@ import {IconButton, Paper} from 'material-ui';
 import IconMenu from 'menus/icon-menu';
 import MenuItem from 'menus/menu-item';
 import MenuDivider from 'menus/menu-divider';
-import MoreVertIcon from 'svg-icons/navigation/more-vert';
+import MoreVertIcon from 'material-ui/svg-icons/navigation/more-vert';
 import ComponentDoc from '../../component-doc';
 
-import ContentCopy from 'svg-icons/content/content-copy';
-import ContentFilter from 'svg-icons/content/filter-list';
-import ContentLink from 'svg-icons/content/link';
-import Delete from 'svg-icons/action/delete';
-import Download from 'svg-icons/file/file-download';
-import MapsPlace from 'svg-icons/maps/place';
-import PersonAdd from 'svg-icons/social/person-add';
-import RemoveRedEye from 'svg-icons/image/remove-red-eye';
+import ContentCopy from 'material-ui/svg-icons/content/content-copy';
+import ContentFilter from 'material-ui/svg-icons/content/filter-list';
+import ContentLink from 'material-ui/svg-icons/content/link';
+import Delete from 'material-ui/svg-icons/action/delete';
+import Download from 'material-ui/svg-icons/file/file-download';
+import MapsPlace from 'material-ui/svg-icons/maps/place';
+import PersonAdd from 'material-ui/svg-icons/social/person-add';
+import RemoveRedEye from 'material-ui/svg-icons/image/remove-red-eye';
 import Code from 'icon-menus-code';
 import CodeExample from '../../code-example/code-example';
 import CodeBlock from '../../code-example/code-block';

docs/src/app/components/pages/components/icons.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import {FontIcon, Styles, Paper} from 'material-ui';
 import CodeBlock from '../../code-example/code-block';
 import ComponentDoc from '../../component-doc';
-import ActionHome from 'svg-icons/action/home';
+import ActionHome from 'material-ui/svg-icons/action/home';
 
 const {Colors, Typography} = Styles;
 import IconButtonCode from 'icons-code';
@@ -26,24 +26,26 @@ export default class FontIconPage extends React.Component {
 
   render() {
 
-    let fontIconDesc = (
-      <p style={this.getStyles()}>
-        This component will render any icon defined in any style sheets included in your
-        project. We are using <a title="Google's Material Design Icons GitHub"
-        href="https://github.com/google/material-design-icons">Google&#39;s Material Design
-        Icons</a> for our documentation site along with some custom icons. You can use
-        sites like <a title="Icomoon website" href="https://icomoon.io/">IcoMoon</a> for
-        generating custom font files. To use FontIcons, add your stylesheet to your project
-        and reference the icon&#39;s className in the "className" prop. <br /><br />
-        We also support <a title="Google's
-        Material Icons" href="https://google.github.io/material-design-icons">Google&#39;s
-        Material Icons</a> as seen in the third block of code. If you&#39;re using the material icons, be sure to include the link to the font icon file in your head section:
+    const fontIconDesc = (
+      <div>
+        <p style={this.getStyles()}>
+          This component will render any icon defined in any style sheets included in your
+          project. We are using <a title="Google's Material Design Icons GitHub"
+          href="https://github.com/google/material-design-icons">Google&#39;s Material Design
+          Icons</a> for our documentation site along with some custom icons. You can use
+          sites like <a title="Icomoon website" href="https://icomoon.io/">IcoMoon</a> for
+          generating custom font files. To use FontIcons, add your stylesheet to your project
+          and reference the icon&#39;s className in the "className" prop. <br /><br />
+          We also support <a title="Google's
+          Material Icons" href="https://google.github.io/material-design-icons">Google&#39;s
+          Material Icons</a> as seen in the third block of code. If you&#39;re using the material icons, be sure to include the link to the font icon file in your head section:
+        </p>
         <Paper>
           <CodeBlock>
             {'<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">'}
           </CodeBlock>
         </Paper>
-      </p>
+      </div>
     );
 
     let svgIconDesc = (

docs/src/app/components/pages/components/lists.jsx

@@ -2,18 +2,18 @@ import React from 'react';
 import mui from 'material-ui';
 import ComponentDoc from '../../component-doc';
 import MobileTearSheet from '../../mobile-tear-sheet';
-import ActionAssignment from 'svg-icons/action/assignment';
-import ActionGrade from 'svg-icons/action/grade';
-import ActionInfo from 'svg-icons/action/info';
-import CommunicationCall from 'svg-icons/communication/call';
-import CommunicationChatBubble from 'svg-icons/communication/chat-bubble';
-import CommunicationEmail from 'svg-icons/communication/email';
-import ContentDrafts from 'svg-icons/content/drafts';
-import ContentInbox from 'svg-icons/content/inbox';
-import ContentSend from 'svg-icons/content/send';
-import EditorInsertChart from 'svg-icons/editor/insert-chart';
-import FileFolder from 'svg-icons/file/folder';
-import MoreVertIcon from 'svg-icons/navigation/more-vert';
+import ActionAssignment from 'material-ui/svg-icons/action/assignment';
+import ActionGrade from 'material-ui/svg-icons/action/grade';
+import ActionInfo from 'material-ui/svg-icons/action/info';
+import CommunicationCall from 'material-ui/svg-icons/communication/call';
+import CommunicationChatBubble from 'material-ui/svg-icons/communication/chat-bubble';
+import CommunicationEmail from 'material-ui/svg-icons/communication/email';
+import ContentDrafts from 'material-ui/svg-icons/content/drafts';
+import ContentInbox from 'material-ui/svg-icons/content/inbox';
+import ContentSend from 'material-ui/svg-icons/content/send';
+import EditorInsertChart from 'material-ui/svg-icons/editor/insert-chart';
+import FileFolder from 'material-ui/svg-icons/file/folder';
+import MoreVertIcon from 'material-ui/svg-icons/navigation/more-vert';
 import {SelectableContainerEnhance} from 'material-ui/hoc/selectable-enhance';
 
 const {

docs/src/app/components/pages/components/menus.jsx

@@ -5,13 +5,13 @@ import MenuItem from 'menus/menu-item';
 import MenuDivider from 'menus/menu-divider';
 import ComponentDoc from '../../component-doc';
 
-import ArrowDropRight from 'svg-icons/navigation-arrow-drop-right';
-import ContentCopy from 'svg-icons/content/content-copy';
-import ContentLink from 'svg-icons/content/link';
-import Delete from 'svg-icons/action/delete';
-import Download from 'svg-icons/file/file-download';
-import PersonAdd from 'svg-icons/social/person-add';
-import RemoveRedEye from 'svg-icons/image/remove-red-eye';
+import ArrowDropRight from 'material-ui/svg-icons/navigation-arrow-drop-right';
+import ContentCopy from 'material-ui/svg-icons/content/content-copy';
+import ContentLink from 'material-ui/svg-icons/content/link';
+import Delete from 'material-ui/svg-icons/action/delete';
+import Download from 'material-ui/svg-icons/file/file-download';
+import PersonAdd from 'material-ui/svg-icons/social/person-add';
+import RemoveRedEye from 'material-ui/svg-icons/image/remove-red-eye';
 import Code from 'menus-code';
 import CodeExample from '../../code-example/code-example';
 import CodeBlock from '../../code-example/code-block';

docs/src/app/components/pages/components/paper.jsx

@@ -119,10 +119,9 @@ import Paper from 'material-ui/lib/paper';
   },
 
   _createPaperElement(zDepth, text) {
-    let styles = this.getStyles();
     return (
       <Paper
-        style={styles.root}
+        style={this.getStyles().root}
         zDepth={zDepth}>
         {this._createParagraphElement(text)}
       </Paper>
@@ -155,4 +154,4 @@ import Paper from 'material-ui/lib/paper';
 
 });
 
-module.exports = PaperPage;
+export default PaperPage;

docs/src/app/components/pages/components/popover.jsx

@@ -185,4 +185,4 @@ let PopoverPage = React.createClass({
 
 });
 
-module.exports = PopoverPage;
+export default PopoverPage;

docs/src/app/components/pages/components/progress.jsx

@@ -133,4 +133,4 @@ const ProgressPage = React.createClass({
 
 });
 
-module.exports = ProgressPage;
+export default ProgressPage;

docs/src/app/components/pages/components/refresh-indicator.jsx

@@ -124,4 +124,4 @@ let RefreshIndicatorPage = React.createClass({
 
 });
 
-module.exports = RefreshIndicatorPage;
+export default RefreshIndicatorPage;

docs/src/app/components/pages/components/select-fields.jsx

@@ -276,4 +276,4 @@ const SelectFieldsPage = React.createClass({
   },
 });
 
-module.exports = SelectFieldsPage;
+export default SelectFieldsPage;

docs/src/app/components/pages/components/switches.jsx

@@ -2,8 +2,8 @@ import React from 'react';
 import mui from 'material-ui';
 import CodeExample from '../../code-example/code-example';
 import ComponentDoc from '../../component-doc';
-import ToggleStar from 'svg-icons/toggle/star';
-import ToggleStarBorder from 'svg-icons/toggle/star-border';
+import ToggleStar from 'material-ui/svg-icons/toggle/star';
+import ToggleStarBorder from 'material-ui/svg-icons/toggle/star-border';
 
 const {
   Checkbox,

docs/src/app/components/pages/components/text-fields.jsx

@@ -413,4 +413,4 @@ const TextFieldsPage = React.createClass({
 
 });
 
-module.exports = TextFieldsPage;
+export default TextFieldsPage;

docs/src/app/components/pages/components/time-picker.jsx

@@ -186,4 +186,4 @@ const TimePickerPage = React.createClass({
 
 });
 
-module.exports = TimePickerPage;
+export default TimePickerPage;

docs/src/app/components/pages/customization/colors.jsx

@@ -152,4 +152,4 @@ const ColorsPage = React.createClass({
 
 });
 
-module.exports = ColorsPage;
+export default ColorsPage;