(format): update standard to latest v13

- v13 requires const instead of let usage
- v13 requires line in b/t class members
- v12 requires spacing in curly braces

- the last two I'm not a huge fan of, but they make sense matching
  behavior elsewhere more or else. also it's standard so that's just
  what it is, no bikeshedding

- the **very old** webpack.production.config.js also had a lint error
  from v6+ on using __dirname without path.join

Author: agilgur5

example/app.js

@@ -6,20 +6,24 @@ import SignaturePad from '../src/index.js'
 import styles from './styles.cssm'
 
 class App extends Component {
-  state = {trimmedDataURL: null}
+  state = { trimmedDataURL: null }
+
   sigPad = {}
+
   clear = () => {
     this.sigPad.clear()
   }
+
   trim = () => {
-    this.setState({trimmedDataURL: this.sigPad.getTrimmedCanvas()
-      .toDataURL('image/png')})
+    this.setState({ trimmedDataURL: this.sigPad.getTrimmedCanvas()
+      .toDataURL('image/png') })
   }
+
   render () {
-    let {trimmedDataURL} = this.state
+    const { trimmedDataURL } = this.state
     return <div className={styles.container}>
       <div className={styles.sigContainer}>
-        <SignaturePad canvasProps={{className: styles.sigPad}}
+        <SignaturePad canvasProps={{ className: styles.sigPad }}
           ref={(ref) => { this.sigPad = ref }} />
       </div>
       <div>

src/index.js

@@ -27,7 +27,7 @@ export default class SignatureCanvas extends Component {
   _sigPad = null
 
   _excludeOurProps = () => {
-    let {canvasProps, clearOnResize, ...sigPadProps} = this.props
+    const { canvasProps, clearOnResize, ...sigPadProps } = this.props
     return sigPadProps
   }
 
@@ -54,7 +54,7 @@ export default class SignatureCanvas extends Component {
   // return a trimmed copy of the canvas
   getTrimmedCanvas = () => {
     // copy the canvas
-    let copy = document.createElement('canvas')
+    const copy = document.createElement('canvas')
     copy.width = this._canvas.width
     copy.height = this._canvas.height
     copy.getContext('2d').drawImage(this._canvas, 0, 0)
@@ -75,18 +75,18 @@ export default class SignatureCanvas extends Component {
   }
 
   _resizeCanvas = () => {
-    let canvasProps = this.props.canvasProps || {}
-    let {width, height} = canvasProps
+    const canvasProps = this.props.canvasProps || {}
+    const { width, height } = canvasProps
     // don't resize if the canvas has fixed width and height
     if (width && height) {
       return
     }
 
-    let canvas = this._canvas
+    const canvas = this._canvas
     /* When zoomed out to less than 100%, for some very strange reason,
       some browsers report devicePixelRatio as less than 1
       and only part of the canvas is cleared then. */
-    let ratio = Math.max(window.devicePixelRatio || 1, 1)
+    const ratio = Math.max(window.devicePixelRatio || 1, 1)
 
     if (!width) {
       canvas.width = canvas.offsetWidth * ratio
@@ -99,7 +99,7 @@ export default class SignatureCanvas extends Component {
   }
 
   render () {
-    let {canvasProps} = this.props
+    const { canvasProps } = this.props
     return <canvas ref={(ref) => { this._canvas = ref }} {...canvasProps} />
   }
 

webpack.config.js

@@ -16,7 +16,7 @@ module.exports = {
       exclude: /node_modules/,
       loaders: [
         'react-hot',
-        query('babel-loader', {presets: ['es2015', 'react', 'stage-2']})
+        query('babel-loader', { presets: ['es2015', 'react', 'stage-2'] })
       ]
     }, {
       test: /\.cssm$/, loader: 'style-loader!css-loader?modules'

webpack.production.config.js

@@ -1,10 +1,12 @@
+const path = require('path')
+
 module.exports = {
   entry: './src/index.js',
   output: {
-    path: __dirname + '/build',
+    path: path.join(__dirname, '/build'),
     filename: 'index.js',
     library: 'SignatureCanvas',
-    libraryTarget: 'umd',
+    libraryTarget: 'umd'
   },
   // don't bundle non-relative packages
   externals: /^[^.]/,
@@ -13,7 +15,7 @@ module.exports = {
       test: /\.js$/,
       exclude: /node_modules/,
       loader: 'babel-loader',
-      query: {presets: ['es2015', 'react', 'stage-2']}
+      query: { presets: ['es2015', 'react', 'stage-2'] }
     }]
   }
 }