Get width of <Button/> for create a perfect size <Ripple/>

components/button.cjsx

@@ -36,6 +36,7 @@ module.exports = React.createClass
     @setState ripple:
                 left  : event.pageX - client?.left
                 top   : event.pageY - client?.top
+                width : (client?.width * 2.5)
     @props.onClick? event, @
 
   # -- Render

components/ripple.cjsx

@@ -32,4 +32,8 @@ module.exports = React.createClass
     className += " loading" if @props.loading
     <div  data-component-ripple
           className={className}
-          style={left: @props.origin?.left, top: @props.origin?.top} />
+          style={
+            left  : @props.origin?.left,
+            top   : @props.origin?.top,
+            width : @props.origin?.width,
+            height: @props.origin?.width} />

components/style/ripple.styl

@@ -5,6 +5,10 @@
   background-color            : alpha(WHITE, 0.65)
   transform                     translateX(-50%) translateY(-50%)
   border-radius               : 50%
+  width                       : SIZE = (4 * UNIT)
+  height                      : SIZE
+  opacity                     : 0
+
   // -- Classes
   &.active, &.loading
     animation-name              ripple
@@ -23,6 +27,4 @@
     height                    : 0
     opacity                   : 1
   100%
-    width                     : SIZE = (4 * UNIT)
-    height                    : SIZE
     opacity                   : 0