Merge pull request #74 from brainhubeu/fix/renovate/npm-dependencies

[renovate] Update NPM dependencies

Author: piotr-s-brainhub

docs-www/.babelrc

@@ -3,6 +3,7 @@
     [
       "@babel/preset-env",
       {
+        "loose": true,
         "modules": false,
         "shippedProposals": true,
         "useBuiltIns": "usage"
@@ -11,7 +12,12 @@
     "@babel/react"
   ],
   "plugins": [
-    "@babel/plugin-proposal-class-properties"
+    [
+      "@babel/plugin-proposal-class-properties",
+      {
+        "loose": true
+      }
+    ]
   ],
   "env": {
     "production": {

docs-www/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@brainhubeu/gatsby-docs-kit-start",
   "description": "Gatsby-Docs-Kit starter repository",
-  "version": "0.0.49",
+  "version": "0.0.50",
   "author": "Brainhub",
   "license": "MIT",
   "scripts": {
@@ -15,29 +15,29 @@
   },
   "dependencies": {
     "@brainhubeu/gatsby-docs-kit": "3.0.8",
-    "@brainhubeu/react-file-input": "^0.8.2",
+    "@brainhubeu/react-file-input": "^0.9.3",
     "gatsby": "2.20.29",
     "gatsby-link": "2.3.0",
     "lodash": "^4.17.15",
     "react-fa": "^5.0.0"
   },
   "devDependencies": {
-    "@babel/plugin-proposal-class-properties": "^7.8.3",
-    "@babel/plugin-transform-react-constant-elements": "^7.9.0",
+    "@babel/plugin-proposal-class-properties": "^7.10.1",
+    "@babel/plugin-transform-react-constant-elements": "^7.10.1",
     "@babel/polyfill": "^7.8.7",
-    "@babel/preset-env": "^7.9.5",
-    "@babel/preset-react": "^7.9.4",
+    "@babel/preset-env": "^7.10.2",
+    "@babel/preset-react": "^7.10.1",
     "@babel/preset-stage-1": "^7.8.3",
-    "@babel/register": "^7.9.0",
+    "@babel/register": "^7.10.1",
     "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
     "eslint": "^6.8.0",
-    "eslint-config-brainhub": "^1.12.0",
+    "eslint-config-brainhub": "^1.13.0",
     "gatsby-plugin-google-analytics": "2.2.2",
     "gh-pages": "^2.2.0",
     "react": "^16.13.1",
     "react-dom": "^16.13.1"
   },
   "peerDependencies": {
-    "@babel/core": "^7.9.0"
+    "@babel/core": "^7.10.2"
   }
 }

docs-www/yarn.lock

@@ -27,57 +27,57 @@
   "author": "Brainhub",
   "license": "MIT",
   "dependencies": {
-    "@fortawesome/fontawesome-free-solid": "^5.0.6",
-    "browser-sync": "^2.18.12",
-    "connect-history-api-fallback": "^1.3.0",
-    "css-loader": "^0.28.4",
-    "express": "^4.15.2",
+    "@fortawesome/fontawesome-free-solid": "^5.0.13",
+    "browser-sync": "^2.26.7",
+    "connect-history-api-fallback": "^1.6.0",
+    "css-loader": "^0.28.11",
+    "express": "^4.17.1",
     "extract-text-webpack-plugin": "^3.0.2",
-    "file-loader": "^1.1.5",
-    "filesize": "^3.6.0",
-    "history": "^4.7.2",
-    "html-webpack-plugin": "^2.29.0",
+    "file-loader": "^1.1.11",
+    "filesize": "^3.6.1",
+    "history": "^4.10.1",
+    "html-webpack-plugin": "^2.30.1",
     "identity-obj-proxy": "^3.0.0",
-    "jsdom": "^11.6.2",
-    "json-loader": "^0.5.4",
-    "mime-db": "^1.32.0",
-    "node-sass": "^4.13.1",
-    "postcss-loader": "^2.0.8",
-    "prop-types": "^15.6.0",
-    "react": "^16.1.1",
-    "react-dom": "^16.1.1",
-    "react-router": "^4.1.1",
-    "react-router-dom": "^4.2.2",
-    "react-test-renderer": "^16.1.1",
-    "sass-loader": "^6.0.6",
-    "style-loader": "^0.19.0",
-    "superagent": "^3.8.1",
+    "jsdom": "^11.12.0",
+    "json-loader": "^0.5.7",
+    "mime-db": "^1.44.0",
+    "node-sass": "^4.14.1",
+    "postcss-loader": "^2.1.6",
+    "prop-types": "^15.7.2",
+    "react": "^16.13.1",
+    "react-dom": "^16.13.1",
+    "react-router": "^4.3.1",
+    "react-router-dom": "^4.3.1",
+    "react-test-renderer": "^16.13.1",
+    "sass-loader": "^6.0.7",
+    "style-loader": "^0.23.1",
+    "superagent": "^3.8.3",
     "url-loader": "^0.6.2",
-    "webpack": "^3.8.1",
-    "webpack-dev-middleware": "^1.11.0",
-    "webpack-hot-middleware": "^2.20.0"
+    "webpack": "^3.12.0",
+    "webpack-dev-middleware": "^1.12.2",
+    "webpack-hot-middleware": "^2.25.0"
   },
   "devDependencies": {
-    "@babel/cli": "^7.8.4",
-    "@babel/core": "^7.9.0",
-    "@babel/plugin-proposal-class-properties": "^7.8.3",
+    "@babel/cli": "^7.10.1",
+    "@babel/core": "^7.10.2",
+    "@babel/plugin-proposal-class-properties": "^7.10.1",
     "@babel/polyfill": "^7.8.7",
-    "@babel/preset-env": "^7.9.5",
-    "@babel/preset-react": "^7.9.4",
-    "@babel/register": "^7.9.0",
-    "@babel/plugin-transform-runtime": "^7.9.6",
-    "autoprefixer": "^9.7.6",
+    "@babel/preset-env": "^7.10.2",
+    "@babel/preset-react": "^7.10.1",
+    "@babel/register": "^7.10.1",
+    "@babel/plugin-transform-runtime": "^7.10.1",
+    "autoprefixer": "^9.8.0",
     "babel-eslint": "^10.1.0",
     "babel-loader": "^8.1.0",
     "babel-plugin-transform-react-constant-elements": "^6.23.0",
     "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
-    "chalk": "^2.3.0",
-    "coveralls": "^3.0.11",
-    "enzyme": "^3.3.0",
-    "enzyme-adapter-react-16": "^1.1.1",
-    "eslint": "^4.11.0",
-    "eslint-config-brainhub": "^1.6.3",
-    "eslint-watch": "^3.1.3",
+    "chalk": "^2.4.2",
+    "coveralls": "^3.1.0",
+    "enzyme": "^3.11.0",
+    "enzyme-adapter-react-16": "^1.15.2",
+    "eslint": "^4.19.1",
+    "eslint-config-brainhub": "^1.13.0",
+    "eslint-watch": "^3.1.5",
     "jest": "^26.0.1"
   },
   "keywords": [

package.json

@@ -10,7 +10,7 @@ const Metadata = ({ extension, name, size, type }) => {
   return (
     <div className="brainhub-file-info__metadata">
       <div className="brainhub-file-info__metadata__info">
-        <span className="brainhub-file-info__metadata__info_name">{name}</span>{extension ? `.${extension}`: ''} ({formattedSize}) {type}
+        <span className="brainhub-file-info__metadata__info_name">{name}</span>{extension ? `.${extension}` : ''} ({formattedSize}) {type}
       </div>
     </div>
   );

src/components/FileInfo/Metadata.js

@@ -71,8 +71,8 @@ class CanvasPrinter extends PureComponent {
     };
 
     const sourceSize = {
-      width: (x1 - x0 ) * widthFactor,
-      height: (y1 - y0 ) * heightFactor,
+      width: (x1 - x0) * widthFactor,
+      height: (y1 - y0) * heightFactor,
     };
 
     return this.printImage(image, offset, sourceSize, scaleOptions || sourceSize);
@@ -108,7 +108,7 @@ class CanvasPrinter extends PureComponent {
     const baseWidth = (scaleOptions && scaleOptions.width) || naturalWidth;
     const baseHeight = (scaleOptions && scaleOptions.height) || naturalHeight;
 
-    const inverted = !(angle %2 === 0);
+    const inverted = !(angle % 2 === 0);
 
     const width = (inverted && baseHeight) || baseWidth;
     const height = (inverted && baseWidth) || baseHeight;
@@ -123,7 +123,7 @@ class CanvasPrinter extends PureComponent {
     const context = this.canvas.getContext('2d');
 
     context.translate(baseWidth / 2, baseHeight / 2);
-    context.rotate((angle * Math.PI) /2);
+    context.rotate((angle * Math.PI) / 2);
     context.drawImage(
       image,
       offset.x,
@@ -144,7 +144,7 @@ class CanvasPrinter extends PureComponent {
   rotateImage(image, angle) {
     const { naturalWidth, naturalHeight } = image;
 
-    const inverted = !(angle %2 === 0);
+    const inverted = !(angle % 2 === 0);
 
     const width = (inverted && naturalHeight) || naturalWidth;
     const height = (inverted && naturalWidth) || naturalHeight;
@@ -155,7 +155,7 @@ class CanvasPrinter extends PureComponent {
     const context = this.canvas.getContext('2d');
 
     context.translate(width / 2, height / 2);
-    context.rotate((angle * Math.PI) /2);
+    context.rotate((angle * Math.PI) / 2);
     context.drawImage(
       image,
       - naturalWidth / 2,

src/components/ImageEditor/CanvasPrinter.js

@@ -45,7 +45,8 @@ class CropTool extends Component {
     this.saveEdition = this.saveEdition.bind(this);
   }
 
-  componentWillMount() {
+  // eslint-disable-next-line camelcase
+  UNSAFE_componentWillMount() {
     document.addEventListener('mousemove', this.onMouseMove, false);
     document.addEventListener('onmousemove', this.onMouseMove, false);
     document.addEventListener('mouseup', this.onMouseUp, false);
@@ -104,10 +105,10 @@ class CropTool extends Component {
     const { offsetLeft, offsetTop } = this.image;
 
     return {
-      top: `${100*(Math.min(y0, y1) + offsetTop) / height}%`,
-      right: `${100*(width - Math.max(x0, x1) - offsetLeft) / width}%`,
-      bottom: `${100*(height - Math.max(y0, y1) - offsetTop) / height}%`,
-      left: `${100*(Math.min(x0, x1) + offsetLeft) / width}%`,
+      top: `${100 * (Math.min(y0, y1) + offsetTop) / height}%`,
+      right: `${100 * (width - Math.max(x0, x1) - offsetLeft) / width}%`,
+      bottom: `${100 * (height - Math.max(y0, y1) - offsetTop) / height}%`,
+      left: `${100 * (Math.min(x0, x1) + offsetLeft) / width}%`,
     };
   }
 
@@ -154,7 +155,7 @@ class CropTool extends Component {
       resizeVertical: !!resizeVertical,
       x0: invertX ? state.x1 : state.x0,
       y0: invertY ? state.y1 : state.y0,
-      x1: invertX ? state.x0: state.x1,
+      x1: invertX ? state.x0 : state.x1,
       y1: invertY ? state.y0 : state.y1,
     }));
   }
@@ -177,7 +178,7 @@ class CropTool extends Component {
   }
 
   onMouseMove(event) {
-    const { isResizing, isMoving }= this.state;
+    const { isResizing, isMoving } = this.state;
     if (isMoving) {
       this.handleMove(event);
     } else if (isResizing) {
@@ -187,7 +188,7 @@ class CropTool extends Component {
 
   onMouseUp(event) {
     const { isResizing, isMoving } = this.state;
-    if ( isResizing || isMoving) {
+    if (isResizing || isMoving) {
       event.preventDefault();
 
       this.setState(state => ({
@@ -249,13 +250,13 @@ class CropTool extends Component {
             className="brainhub-crop-tool__button brainhub-crop-tool__button--cancel"
             onClick={this.cancelEdition}
           >
-          Cancel
+            Cancel
           </button>
           <button
             className="brainhub-crop-tool__button brainhub-crop-tool__button--save"
             onClick={this.saveEdition}
           >
-          Save image
+            Save image
           </button>
         </div>
       </div>

src/components/ImageEditor/CropTool.js

@@ -23,7 +23,8 @@ class ImageRotator extends PureComponent {
     this.save = this.save.bind(this);
   }
 
-  componentWillReceiveProps(nextProps) {
+  // eslint-disable-next-line camelcase
+  UNSAFE_componentWillReceiveProps(nextProps) {
     const { image } = this.props;
 
     if (nextProps.image !== image) {
@@ -81,7 +82,7 @@ class ImageRotator extends PureComponent {
             className="brainhub-image-rotator__button brainhub-image-rotator__button--save"
             onClick={this.save}
           >
-          Save image
+            Save image
           </button>
           <button
             className="brainhub-image-rotator__button brainhub-image-rotator__button--arrow"

src/components/ImageEditor/ImageRotator.js

@@ -30,7 +30,8 @@ class ImageEditor extends PureComponent {
     this.onCropCanceled = this.onCropCanceled.bind(this);
   }
 
-  componentWillReceiveProps(nextProps) {
+  // eslint-disable-next-line camelcase
+  UNSAFE_componentWillReceiveProps(nextProps) {
     const { image } = this.props;
 
     if (nextProps.image !== image) {

src/components/ImageEditor/index.js

@@ -24,7 +24,7 @@ const addPropsToFile = file => {
 };
 
 export const handleChangeEvent = event => {
-  if (!event.target || !event.target.files || !event.target.files.length ) {
+  if (!event.target || !event.target.files || !event.target.files.length) {
     return null;
   }