From 7d4dd7bbeaae452e06a3cd8249ecff63aa00105b Mon Sep 17 00:00:00 2001 From: Dan Train Date: Mon, 6 May 2019 15:40:59 +0100 Subject: [PATCH] Update deps Update babel and webpack Fix test script Add prettier, update eslint config Prettify and fix lint errors Update gulp-eslint Update mocha Fix measureItems defect Update husky --- .babelrc | 3 +- .eslintrc.json | 3 +- demo/src/components/App.jsx | 96 +- gulpfile.babel.js | 127 +- package-lock.json | 5097 ++++++++++------ package.json | 49 +- src/components/CSSGridItem.jsx | 56 +- src/components/SpringGrid.jsx | 92 +- src/higher-order-components/measureItems.jsx | 58 +- src/index.js | 30 +- src/layouts/pinterest.js | 12 +- src/utils/assertIsElement.js | 8 +- src/utils/commonProps.js | 12 +- src/utils/easings.js | 48 +- src/utils/transformHelpers.js | 42 +- test/.eslintrc.json | 8 - yarn.lock | 5658 ------------------ 17 files changed, 3452 insertions(+), 7947 deletions(-) delete mode 100644 test/.eslintrc.json delete mode 100644 yarn.lock diff --git a/.babelrc b/.babelrc index 27b5c0d..e60d303 100644 --- a/.babelrc +++ b/.babelrc @@ -1,3 +1,4 @@ { - "presets": ["es2015", "react", "stage-2"] + "presets": ["@babel/preset-env", "@babel/preset-react"], + "plugins": ["@babel/plugin-proposal-class-properties"] } diff --git a/.eslintrc.json b/.eslintrc.json index fbb3a7f..6bfd893 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -25,7 +25,6 @@ "ignoreRegExpLiterals": true } ], - "quote-props": [1, "consistent-as-needed"], "radix": 0, "no-unused-vars": [1, { "vars": "local", "args": "after-used" }], "no-param-reassign": 0, @@ -73,7 +72,7 @@ "node": true, "browser": true }, - "extends": "airbnb", + "extends": ["airbnb", "prettier", "prettier/react"], "parser": "babel-eslint", "parserOptions": { "sourceType": "module" diff --git a/demo/src/components/App.jsx b/demo/src/components/App.jsx index 7665891..d4a21eb 100644 --- a/demo/src/components/App.jsx +++ b/demo/src/components/App.jsx @@ -1,13 +1,14 @@ +/* eslint-disable jsx-a11y/label-has-associated-control */ /* eslint-disable react/no-array-index-key */ -import React, { Component } from 'react'; -import { RadioGroup, Radio } from 'react-radio-group'; -import Slider, { createSliderWithTooltip } from 'rc-slider'; -import shuffle from 'lodash.shuffle'; -import camelCase from 'lodash.camelcase'; -import Grid from './Grid'; -import { easings } from '../../../src/index'; +import React, { Component } from "react"; +import { RadioGroup, Radio } from "react-radio-group"; +import Slider, { createSliderWithTooltip } from "rc-slider"; +import shuffle from "lodash.shuffle"; +import camelCase from "lodash.camelcase"; +import Grid from "./Grid"; +import { easings } from "../../../src/index"; -const alphabet = 'abcdefghijklmnopqrstuvwxyz'.split(''); +const alphabet = "abcdefghijklmnopqrstuvwxyz".split(""); const ipsum = `Who controls the British crown? Who keeps the metric system down? @@ -16,18 +17,18 @@ Who keeps the Martians under wraps? Who holds back the electric car? Who makes Steve Guttenberg a star? Who robs cavefish of their sight? -Who rigs every Oscar night?`.split('\n'); +Who rigs every Oscar night?`.split("\n"); -const layouts = ['Pinterest', 'Simple']; +const layouts = ["Pinterest", "Simple"]; const enterExitStyles = [ - 'Simple', - 'Skew', - 'Newspaper', - 'Fold Up', - 'From Center', - 'From Left to Right', - 'From Top', - 'From Bottom' + "Simple", + "Skew", + "Newspaper", + "Fold Up", + "From Center", + "From Left to Right", + "From Top", + "From Bottom" ]; const SliderWithTooltip = createSliderWithTooltip(Slider); @@ -61,14 +62,13 @@ export default class extends Component { }); }; - generateData = () => - shuffle(alphabet) - .slice( - 0, - this.props.minItems + - Math.floor(Math.random() * (26 - this.props.minItems)) - ) + generateData = () => { + const { minItems } = this.props; + + return shuffle(alphabet) + .slice(0, minItems + Math.floor(Math.random() * (26 - minItems))) .sort(); + }; render() { const { data, ...gridProps } = this.state; @@ -85,9 +85,9 @@ export default class extends Component { easing } = this.state; - const itemHeight = layout === 'simple' ? 190 : null; + const itemHeight = layout === "simple" ? 190 : null; - const items = data.map((letter) => { + const items = data.map(letter => { const contentIndex = letter.charCodeAt(0) % 6; const content = ipsum.slice( contentIndex, @@ -104,7 +104,9 @@ export default class extends Component { }} >

{letter.toUpperCase()}

- {content.map((p, i) =>

{p}

)} + {content.map((p, i) => ( +

{p}

+ ))}

We do! We do!

); @@ -116,14 +118,16 @@ export default class extends Component { this.setState({ useCSS: value === 'css' })} + selectedValue={useCSS ? "css" : "spring"} + onChange={value => this.setState({ useCSS: value === "css" })} >