diff --git a/README.md b/README.md
index e2314615edf7f1..9d6bc6d2ebcd44 100644
--- a/README.md
+++ b/README.md
@@ -8,7 +8,7 @@ that you can use to tag your questions.
 
 # [Material-Next](https://material-ui-next.com/)
 [![npm package](https://img.shields.io/npm/v/@material-next/core.svg)](https://www.npmjs.org/package/@material-next/core)
-![npm](https://img.shields.io/npm/dm/@material-next/core.svg)
+[![npm download](https://img.shields.io/npm/dm/@material-next/core.svg)](https://www.npmjs.com/package/@material-next/core)
 [![CircleCI](https://img.shields.io/circleci/project/github/material-next/material-next/master.svg)](https://circleci.com/gh/material-next/material-next/tree/master)
 [![Chat](https://img.shields.io/badge/chat-on%20discord-7289da.svg)](https://discord.gg/MwT5uvA)
 [![Coverage Status](https://img.shields.io/codecov/c/github/material-next/material-next/master.svg)](https://codecov.io/gh/material-next/material-next/branch/master)
diff --git a/src/ButtonBase/ButtonBase.js b/src/ButtonBase/ButtonBase.js
index b1eb018d2c8fe0..5818f6c0e343a6 100644
--- a/src/ButtonBase/ButtonBase.js
+++ b/src/ButtonBase/ButtonBase.js
@@ -311,21 +311,6 @@ class ButtonBase extends React.Component<ProvidedProps & Props, State> {
     }
   };
 
-  renderRipple() {
-    if (!this.props.disableRipple && !this.props.disabled) {
-      return (
-        <TouchRipple
-          innerRef={node => {
-            this.ripple = node;
-          }}
-          center={this.props.centerRipple}
-        />
-      );
-    }
-
-    return null;
-  }
-
   render() {
     const {
       centerRipple,
@@ -403,7 +388,14 @@ class ButtonBase extends React.Component<ProvidedProps & Props, State> {
         ref={rootRef}
       >
         {children}
-        {this.renderRipple()}
+        {!disableRipple && !disabled ? (
+          <TouchRipple
+            innerRef={node => {
+              this.ripple = node;
+            }}
+            center={centerRipple}
+          />
+        ) : null}
       </ComponentProp>
     );
   }
diff --git a/src/ButtonBase/Ripple.js b/src/ButtonBase/Ripple.js
index bbeeffaf7e5d69..e0eb3362eeffc8 100644
--- a/src/ButtonBase/Ripple.js
+++ b/src/ButtonBase/Ripple.js
@@ -50,17 +50,6 @@ class Ripple extends React.Component<ProvidedProps & Props, State> {
     rippleLeaving: false,
   };
 
-  getRippleStyles = props => {
-    const { rippleSize, rippleX, rippleY } = props;
-
-    return {
-      width: rippleSize,
-      height: rippleSize,
-      top: -(rippleSize / 2) + rippleY,
-      left: -(rippleSize / 2) + rippleX,
-    };
-  };
-
   handleEnter = () => {
     this.setState({
       rippleVisible: true,
@@ -99,10 +88,17 @@ class Ripple extends React.Component<ProvidedProps & Props, State> {
       [classes.rippleFast]: pulsate,
     });
 
+    const rippleStyles = {
+      width: rippleSize,
+      height: rippleSize,
+      top: -(rippleSize / 2) + rippleY,
+      left: -(rippleSize / 2) + rippleX,
+    };
+
     return (
       <Transition onEnter={this.handleEnter} onExit={this.handleExit} {...other}>
         <span className={className}>
-          <span className={rippleClassName} style={this.getRippleStyles(this.props)} />
+          <span className={rippleClassName} style={rippleStyles} />
         </span>
       </Transition>
     );
diff --git a/src/ButtonBase/TouchRipple.js b/src/ButtonBase/TouchRipple.js
index 859332e05649db..b7a03b2aa01501 100644
--- a/src/ButtonBase/TouchRipple.js
+++ b/src/ButtonBase/TouchRipple.js
@@ -237,7 +237,7 @@ class TouchRipple extends React.Component<ProvidedProps & Props, State> {
     const { pulsate, rippleX, rippleY, rippleSize, cb } = params;
     let ripples = this.state.ripples;
 
-    // Add a ripple to the ripples array
+    // Add a ripple to the ripples array.
     ripples = [
       ...ripples,
       <Ripple