Bump to v1.5.1 (#82)

Changes:

- Use mangle to reduce internal variable names

mangle.json

@@ -0,0 +1,9 @@
+{
+  "minify": {
+    "mangle": {
+      "properties": {
+        "regex": "^_[^_]"
+      }
+    }
+  }
+}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-wavify",
-  "version": "1.5.0",
+  "version": "1.5.1",
   "description": "Animated wave component for React",
   "main": "lib/index.js",
   "module": "lib/index.module.js",

src/wave.js

@@ -3,28 +3,28 @@ import React, { Component } from 'react'
 class Wave extends Component {
   constructor (props) {
     super(props)
-    this.container = React.createRef()
+    this._container = React.createRef()
     this.state = { path: '' }
-    this.lastUpdate = 0
-    this.elapsed = 0
-    this.step = 0
-    this.update = this.update.bind(this)
+    this._lastUpdate = 0
+    this._elapsed = 0
+    this._step = 0
+    this._update = this._update.bind(this)
   }
 
-  calculateWavePoints () {
+  _calculateWavePoints () {
     const points = []
     for (let i = 0; i <= Math.max(this.props.points, 1); i ++) {
       const scale = 100
-      const x = i / this.props.points * this.width()
-      const seed = (this.step + (i + i % this.props.points)) * this.props.speed * scale
+      const x = i / this.props.points * this._width()
+      const seed = (this._step + (i + i % this.props.points)) * this.props.speed * scale
       const height = Math.sin(seed / scale) * this.props.amplitude
       const y = Math.sin(seed / scale) * height  + this.props.height
       points.push({x, y})
     }
     return points
   }
 
-  buildPath (points) {
+  _buildPath (points) {
     let svg = `M ${points[0].x} ${points[0].y}`
     const initial = {
       x: (points[1].x - points[0].x) / 2,
@@ -40,52 +40,52 @@ class Wave extends Component {
       }
       svg += cubic(point, points[i + 1])
     }
-    svg += ` L ${this.width()} ${this.height()}`
-    svg += ` L 0 ${this.height()} Z`
+    svg += ` L ${this._width()} ${this._height()}`
+    svg += ` L 0 ${this._height()} Z`
     return svg
   }
 
-  width = () => this.container.current.offsetWidth
-  height = () => this.container.current.offsetHeight
+  _width = () => this._container.current.offsetWidth
+  _height = () => this._container.current.offsetHeight
 
-  redraw () {
+  _redraw () {
     this.setState({
-      path: this.buildPath(this.calculateWavePoints())
+      path: this._buildPath(this._calculateWavePoints())
     })
   }
 
-  draw () {
+  _draw () {
     if (!this.props.paused) {
       const now = new Date()
-      this.elapsed += (now - this.lastUpdate)
-      this.lastUpdate = now
+      this._elapsed += (now - this._lastUpdate)
+      this._lastUpdate = now
     }
     const scale = 1000
-    this.step = this.elapsed * Math.PI / scale
-    this.redraw()
+    this._step = this._elapsed * Math.PI / scale
+    this._redraw()
   }
 
-  update () {
-    this.draw()
-    if (this.frameId) {
-      this.resume()
+  _update () {
+    this._draw()
+    if (this._frameId) {
+      this._resume()
     }
   }
 
-  resume () {
-    this.frameId = window.requestAnimationFrame(this.update)
-    this.lastUpdate = new Date()
+  _resume () {
+    this._frameId = window.requestAnimationFrame(this._update)
+    this._lastUpdate = new Date()
   }
 
   componentDidMount () {
-    if (!this.frameId) {
-      this.resume()
+    if (!this._frameId) {
+      this._resume()
     }
   }
 
   componentWillUnmount () {
-    window.cancelAnimationFrame(this.frameId)
-    this.frameId = 0
+    window.cancelAnimationFrame(this._frameId)
+    this._frameId = 0
   }
 
   render () {
@@ -102,7 +102,7 @@ class Wave extends Component {
     } = this.props
     return (
       <div style={{ width: '100%', display: 'inline-block', ...style }}
-           className={className} id={id} ref={this.container}>
+           className={className} id={id} ref={this._container}>
         <svg width="100%" height="100%" version="1.1" xmlns="http://www.w3.org/2000/svg">
           {children}
           <path d={this.state.path} fill={fill} {...rest} />