diff --git a/.size-limit.js b/.size-limit.js
index ac67804328f5ea..20cde62c5609ba 100644
--- a/.size-limit.js
+++ b/.size-limit.js
@@ -27,7 +27,7 @@ module.exports = [
     name: 'The size of all the modules of material-ui.',
     webpack: true,
     path: 'packages/material-ui/build/index.js',
-    limit: '95.2 KB',
+    limit: '95.4 KB',
   },
   {
     name: 'The main bundle of the docs',
diff --git a/docs/src/modules/components/AppDrawer.js b/docs/src/modules/components/AppDrawer.js
index 64dad2671fd8ea..d3150bd92cd374 100644
--- a/docs/src/modules/components/AppDrawer.js
+++ b/docs/src/modules/components/AppDrawer.js
@@ -118,7 +118,7 @@ function AppDrawer(props, context) {
 
   return (
     <div className={className}>
-      <Hidden lgUp={!disablePermanent}>
+      <Hidden lgUp={!disablePermanent} implementation="js">
         <SwipeableDrawer
           classes={{
             paper: classNames(classes.paper, 'algolia-drawer'),
diff --git a/docs/src/modules/components/HomeBackers.js b/docs/src/modules/components/HomeBackers.js
index 8007e074816d9d..80efa19e29d7bb 100644
--- a/docs/src/modules/components/HomeBackers.js
+++ b/docs/src/modules/components/HomeBackers.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { withStyles } from '@material-ui/core/styles';
-import NoSSR from '@material-ui/docs/NoSSR';
+import NoSSR from '@material-ui/core/NoSSR';
 import MarkdownElement from '@material-ui/docs/MarkdownElement';
 
 const styles = theme => ({
diff --git a/docs/src/modules/components/HomeSteps.js b/docs/src/modules/components/HomeSteps.js
index a8de92ca3e03df..729f3e08b38798 100644
--- a/docs/src/modules/components/HomeSteps.js
+++ b/docs/src/modules/components/HomeSteps.js
@@ -10,7 +10,7 @@ import FileDownloadIcon from '@material-ui/docs/svgIcons/FileDownload';
 import BuildIcon from '@material-ui/icons/Build'; // eslint-disable-line import/no-unresolved
 import WhatshotIcon from '@material-ui/icons/Whatshot';
 import MarkdownElement from '@material-ui/docs/MarkdownElement';
-import NoSSR from '@material-ui/docs/NoSSR';
+import NoSSR from '@material-ui/core/NoSSR';
 import Link from 'docs/src/modules/components/Link';
 
 const styles = theme => ({
diff --git a/docs/src/pages/demos/autocomplete/IntegrationReactSelect.js b/docs/src/pages/demos/autocomplete/IntegrationReactSelect.js
index 793ee06fd7a5d8..341c377838aec8 100644
--- a/docs/src/pages/demos/autocomplete/IntegrationReactSelect.js
+++ b/docs/src/pages/demos/autocomplete/IntegrationReactSelect.js
@@ -6,7 +6,7 @@ import classNames from 'classnames';
 import Select from 'react-select';
 import { withStyles } from '@material-ui/core/styles';
 import Typography from '@material-ui/core/Typography';
-import NoSSR from '@material-ui/docs/NoSSR';
+import NoSSR from '@material-ui/core/NoSSR';
 import TextField from '@material-ui/core/TextField';
 import Chip from '@material-ui/core/Chip';
 import MenuItem from '@material-ui/core/MenuItem';
diff --git a/packages/material-ui-docs/src/index.js b/packages/material-ui-docs/src/index.js
index c5e1295f624656..def14612c4cb6f 100644
--- a/packages/material-ui-docs/src/index.js
+++ b/packages/material-ui-docs/src/index.js
@@ -1,3 +1,2 @@
 export { default as MarkdownElement } from './MarkdownElement';
-export { default as NoSSR } from './NoSSR';
 export { default as NProgressBar } from './NProgressBar';
diff --git a/packages/material-ui/src/NoSSR/NoSSR.d.ts b/packages/material-ui/src/NoSSR/NoSSR.d.ts
new file mode 100644
index 00000000000000..38d95e59371b75
--- /dev/null
+++ b/packages/material-ui/src/NoSSR/NoSSR.d.ts
@@ -0,0 +1,10 @@
+import * as React from 'react';
+
+export interface NoSSRProps {
+  children: React.ReactNode;
+  fallback?: React.ReactNode;
+}
+
+declare const NoSSR: React.ComponentType<NoSSRProps>;
+
+export default NoSSR;
diff --git a/packages/material-ui-docs/src/NoSSR/NoSSR.js b/packages/material-ui/src/NoSSR/NoSSR.js
similarity index 91%
rename from packages/material-ui-docs/src/NoSSR/NoSSR.js
rename to packages/material-ui/src/NoSSR/NoSSR.js
index ef4e6fa9b47e08..aebfcf3a1e7a2a 100644
--- a/packages/material-ui-docs/src/NoSSR/NoSSR.js
+++ b/packages/material-ui/src/NoSSR/NoSSR.js
@@ -1,5 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
+import exactProp from '../utils/exactProp';
 
 const Fallback = () => null;
 
@@ -32,6 +33,8 @@ NoSSR.propTypes = {
   fallback: PropTypes.node,
 };
 
+NoSSR.propTypes = exactProp(NoSSR.propTypes);
+
 NoSSR.defaultProps = {
   fallback: <Fallback />,
 };
diff --git a/packages/material-ui/src/NoSSR/NoSSR.test.js b/packages/material-ui/src/NoSSR/NoSSR.test.js
new file mode 100644
index 00000000000000..9b268044aa914f
--- /dev/null
+++ b/packages/material-ui/src/NoSSR/NoSSR.test.js
@@ -0,0 +1,53 @@
+// @flow
+
+import React from 'react';
+import { assert } from 'chai';
+import { createMount, createShallow } from '../test-utils';
+import NoSSR from './NoSSR';
+
+describe('<NoSSR />', () => {
+  let mount;
+  let shallow;
+
+  before(() => {
+    mount = createMount();
+    shallow = createShallow({ disableLifecycleMethods: true });
+  });
+
+  after(() => {
+    mount.cleanUp();
+  });
+
+  describe('server side rendering', () => {
+    it('should not render the children as the width is unknown', () => {
+      const wrapper = shallow(
+        <NoSSR>
+          <span>Hello</span>
+        </NoSSR>,
+      );
+      assert.strictEqual(wrapper.name(), 'Fallback');
+    });
+  });
+
+  describe('mounted', () => {
+    it('should render the children', () => {
+      const wrapper = mount(
+        <NoSSR>
+          <span>Hello</span>
+        </NoSSR>,
+      );
+      assert.strictEqual(wrapper.find('span').length, 1);
+    });
+  });
+
+  describe('prop: fallback', () => {
+    it('should render the fallback', () => {
+      const wrapper = shallow(
+        <NoSSR fallback="fallback">
+          <span>Hello</span>
+        </NoSSR>,
+      );
+      assert.strictEqual(wrapper.text(), 'fallback');
+    });
+  });
+});
diff --git a/packages/material-ui/src/NoSSR/index.d.ts b/packages/material-ui/src/NoSSR/index.d.ts
new file mode 100644
index 00000000000000..a3bf2aeec739cf
--- /dev/null
+++ b/packages/material-ui/src/NoSSR/index.d.ts
@@ -0,0 +1,2 @@
+export { default } from './NoSSR';
+export * from './NoSSR';
diff --git a/packages/material-ui-docs/src/NoSSR/index.js b/packages/material-ui/src/NoSSR/index.js
similarity index 100%
rename from packages/material-ui-docs/src/NoSSR/index.js
rename to packages/material-ui/src/NoSSR/index.js
diff --git a/packages/material-ui/src/SwipeableDrawer/SwipeArea.js b/packages/material-ui/src/SwipeableDrawer/SwipeArea.js
index 9e45df613d7193..9115f3dcd4ca42 100644
--- a/packages/material-ui/src/SwipeableDrawer/SwipeArea.js
+++ b/packages/material-ui/src/SwipeableDrawer/SwipeArea.js
@@ -11,21 +11,21 @@ export const styles = theme => ({
     position: 'fixed',
     top: 0,
     left: 0,
-    height: '100vh',
+    bottom: 0,
     zIndex: theme.zIndex.drawer - 1,
   },
-  discoveryAnchorLeft: {
+  anchorLeft: {
     right: 'auto',
   },
-  discoveryAnchorRight: {
+  anchorRight: {
     left: 'auto',
     right: 0,
   },
-  discoveryAnchorTop: {
+  anchorTop: {
     bottom: 'auto',
     right: 0,
   },
-  discoveryAnchorBottom: {
+  anchorBottom: {
     top: 'auto',
     bottom: 0,
     right: 0,
@@ -36,13 +36,13 @@ export const styles = theme => ({
  * @ignore - internal component.
  */
 function SwipeArea(props) {
-  const { anchor, classes, swipeAreaWidth, ...other } = props;
+  const { anchor, classes, width, ...other } = props;
 
   return (
     <div
-      className={classNames(classes.root, classes[`discoveryAnchor${capitalize(anchor)}`])}
+      className={classNames(classes.root, classes[`anchor${capitalize(anchor)}`])}
       style={{
-        [isHorizontal(props) ? 'width' : 'height']: swipeAreaWidth,
+        [isHorizontal(props) ? 'width' : 'height']: width,
       }}
       {...other}
     />
@@ -62,7 +62,7 @@ SwipeArea.propTypes = {
    * The width of the left most (or right most) area in pixels where the
    * drawer can be swiped open from.
    */
-  swipeAreaWidth: PropTypes.number.isRequired,
+  width: PropTypes.number.isRequired,
 };
 
 export default withStyles(styles)(SwipeArea);
diff --git a/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.js b/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.js
index fc82f4176c2cab..b48221c0bbe114 100644
--- a/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.js
+++ b/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.js
@@ -8,6 +8,7 @@ import Drawer, { getAnchor, isHorizontal } from '../Drawer/Drawer';
 import { duration } from '../styles/transitions';
 import withTheme from '../styles/withTheme';
 import { getTransitionProps } from '../transitions/utils';
+import NoSSR from '../NoSSR';
 import SwipeArea from './SwipeArea';
 
 // This value is closed to what browsers are using internally to
@@ -332,6 +333,7 @@ class SwipeableDrawer extends React.Component {
 
   render() {
     const {
+      anchor,
       disableBackdropTransition,
       disableDiscovery,
       disableSwipeToOpen,
@@ -365,12 +367,15 @@ class SwipeableDrawer extends React.Component {
             },
             ref: this.handlePaperRef,
           }}
+          anchor={anchor}
           {...other}
         />
         {!disableDiscovery &&
           !disableSwipeToOpen &&
           variant === 'temporary' && (
-            <SwipeArea anchor={other.anchor} swipeAreaWidth={swipeAreaWidth} />
+            <NoSSR>
+              <SwipeArea anchor={anchor} width={swipeAreaWidth} />
+            </NoSSR>
           )}
       </React.Fragment>
     );
diff --git a/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.test.js b/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.test.js
index 9c0f16b6cccb31..9c7e056284d830 100644
--- a/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.test.js
+++ b/packages/material-ui/src/SwipeableDrawer/SwipeableDrawer.test.js
@@ -50,25 +50,14 @@ describe('<SwipeableDrawer />', () => {
         theme={createMuiTheme()}
       />,
     );
-    if (React.Fragment) {
-      assert.strictEqual(wrapper.childAt(0).type(), Drawer);
-      assert.strictEqual(wrapper.childAt(1).type(), SwipeArea);
-    } else {
-      assert.strictEqual(
-        wrapper
-          .childAt(0)
-          .childAt(0)
-          .type(),
-        Drawer,
-      );
-      assert.strictEqual(
-        wrapper
-          .childAt(0)
-          .childAt(1)
-          .type(),
-        SwipeArea,
-      );
-    }
+    assert.strictEqual(wrapper.childAt(0).type(), Drawer);
+    assert.strictEqual(
+      wrapper
+        .childAt(1)
+        .childAt(0)
+        .type(),
+      SwipeArea,
+    );
     wrapper.unmount();
   });
 
diff --git a/packages/material-ui/src/index.d.ts b/packages/material-ui/src/index.d.ts
index dcc6080becc9d8..62ff1111ee823d 100644
--- a/packages/material-ui/src/index.d.ts
+++ b/packages/material-ui/src/index.d.ts
@@ -141,6 +141,7 @@ export { default as MenuList } from './MenuList';
 export { default as MobileStepper } from './MobileStepper';
 export { default as Modal, ModalManager } from './Modal';
 export { default as NativeSelect } from './NativeSelect';
+export { default as NoSSR } from './NoSSR';
 export { default as Paper } from './Paper';
 export { default as Popover } from './Popover';
 export { default as Popper } from './Popper';
diff --git a/packages/material-ui/src/index.js b/packages/material-ui/src/index.js
index 92734bcc3e30c2..05ae92f3db928c 100644
--- a/packages/material-ui/src/index.js
+++ b/packages/material-ui/src/index.js
@@ -74,6 +74,7 @@ export { default as MenuList } from './MenuList';
 export { default as MobileStepper } from './MobileStepper';
 export { default as Modal, ModalManager } from './Modal';
 export { default as NativeSelect } from './NativeSelect';
+export { default as NoSSR } from './NoSSR';
 export { default as Paper } from './Paper';
 export { default as Popover } from './Popover';
 export { default as Popper } from './Popper';
diff --git a/packages/material-ui/src/withWidth/withWidth.test.js b/packages/material-ui/src/withWidth/withWidth.test.js
index f63310ee8b5b02..980c78149e6a65 100644
--- a/packages/material-ui/src/withWidth/withWidth.test.js
+++ b/packages/material-ui/src/withWidth/withWidth.test.js
@@ -35,7 +35,7 @@ describe('withWidth', () => {
   describe('server side rendering', () => {
     it('should not render the children as the width is unknown', () => {
       const wrapper = shallow(<EmptyWithWidth />);
-      assert.strictEqual(wrapper.type(), null, 'should render nothing');
+      assert.strictEqual(wrapper.type(), null);
     });
   });