chore(*): fix prettier (#557)

* Fix

* Test

* Changes

* Run prettier

* Remove single quote

.eslintrc

@@ -19,7 +19,8 @@
     "max-len": ["warn", { "code": 120 , "ignoreComments": true }],
     "quotes": ["warn", "single", "avoid-escape"],
     "jsx-quotes": ["warn", "prefer-double"],
-    "react/prop-types": 0
+    "react/prop-types": 0,
+    "prettier/prettier": "error"
   },
   "plugins": [
     "prettier",

.prettierignore

@@ -0,0 +1,9 @@
+*.log
+.idea
+lib
+dist
+umd
+build
+coverage
+node_modules
+__snapshots__

.prettierrc

@@ -0,0 +1,3 @@
+{
+  "singleQuote": true
+}

package.json

@@ -7,6 +7,7 @@
     "eslint-plugin-babel": "^5.3.1",
     "eslint-plugin-prettier": "^3.1.4",
     "eslint-plugin-react": "^7.20.5",
+    "husky": "^4.2.5",
     "jest": "^24.9.0",
     "lerna": "^3.22.1",
     "lint-staged": "^8.2.1",
@@ -19,11 +20,10 @@
     "publish": "lerna publish",
     "canary": "lerna publish --canary preminor --npm-tag alpha",
     "next": "lerna publish --bump prerelease --npm-tag next",
-    "lint": "eslint '**/*.{js,jsx}' --cache",
+    "lint": "eslint \"**/*.{js,jsx}\" --cache",
-    "lint:fix": "eslint '**/*.{js,jsx}' --fix --cache",
+    "lint:fix": "eslint \"**/*.{js,jsx}\" --fix --cache",
-    "lint:all": "eslint '**/*.{js,jsx}'",
+    "lint:all": "eslint \"**/*.{js,jsx}\"",
-    "prettify": "prettier '**/*.{js,jsx,json,css,html,md}' --ignore-path .eslintignore --single-quote --write",
+    "prettify": "prettier \"**/*.{js,jsx,json,css,html,md}\" --write",
-    "precommit": "lint-staged",
     "test": "jest --onlyChanged",
     "test:all": "jest"
   },
@@ -36,16 +36,21 @@
     "packages/redux-slider-monitor/examples/todomvc"
   ],
   "engines": {
-    "node": ">=8.0.0"
+    "node": ">=10.0.0"
+  },
+  "husky": {
+    "hooks": {
+      "pre-commit": "lint-staged"
+    }
   },
   "lint-staged": {
     "*.{js,jsx}": [
-      "prettier --single-quote --write",
+      "prettier --write",
       "yarn lint:fix",
       "git add"
     ],
     "*.{json,css,html,md}": [
-      "prettier --single-quote --write",
+      "prettier --write",
       "git add"
     ]
   }

packages/d3-state-visualizer/examples/tree/index.js

@@ -3,7 +3,7 @@ import { tree } from 'd3-state-visualizer';
 const appState = {
   todoStore: {
     todos: [
-      { title: 'd3'},
+      { title: 'd3' },
       { title: 'state' },
       { title: 'visualizer' },
       { title: 'tree' }
@@ -28,8 +28,8 @@ const render = tree(document.getElementById('root'), {
   isSorted: false,
   widthBetweenNodesCoeff: 1.5,
   heightBetweenNodesCoeff: 2,
-  style: {border: '1px solid black'},
+  style: { border: '1px solid black' },
-  tooltipOptions: {offset: {left: 30, top: 10}, indentationSize: 2}
+  tooltipOptions: { offset: { left: 30, top: 10 }, indentationSize: 2 }
 });
 
 render();

packages/d3-state-visualizer/examples/tree/server.js

@@ -9,7 +9,7 @@ new WebpackDevServer(webpack(config), {
   stats: {
     colors: true
   }
-}).listen(3000, 'localhost', function (err) {
+}).listen(3000, 'localhost', function(err) {
   if (err) {
     // eslint-disable-next-line no-console
     console.log(err);

packages/d3-state-visualizer/examples/tree/webpack.config.js

@@ -14,18 +14,18 @@ module.exports = {
     filename: 'bundle.js',
     publicPath: '/static/'
   },
-  plugins: [
+  plugins: [new webpack.HotModuleReplacementPlugin()],
-    new webpack.HotModuleReplacementPlugin(),
-  ],
   resolve: {
     extensions: ['.js']
   },
   module: {
-    rules: [{
+    rules: [
-      test: /\.js$/,
+      {
-      loaders: ['babel-loader'],
+        test: /\.js$/,
-      exclude: /node_modules/,
+        loaders: ['babel-loader'],
-      include: __dirname
+        exclude: /node_modules/,
-    }]
+        include: __dirname
+      }
+    ]
   }
 };

packages/d3-state-visualizer/src/charts/tree/sortAndSerialize.js

@@ -1,23 +1,25 @@
 function sortObject(obj, strict) {
   if (obj instanceof Array) {
-    let ary
+    let ary;
     if (strict) {
-      ary = obj.sort()
+      ary = obj.sort();
     } else {
-      ary = obj
+      ary = obj;
     }
-    return ary
+    return ary;
   }
 
   if (obj && typeof obj === 'object') {
-    const tObj = {}
+    const tObj = {};
-    Object.keys(obj).sort().forEach(key => tObj[key] = sortObject(obj[key]))
+    Object.keys(obj)
-    return tObj
+      .sort()
+      .forEach(key => (tObj[key] = sortObject(obj[key])));
+    return tObj;
   }
 
-  return obj
+  return obj;
 }
 
 export default function sortAndSerialize(obj) {
-  return JSON.stringify(sortObject(obj, true), undefined, 2)
+  return JSON.stringify(sortObject(obj, true), undefined, 2);
 }

packages/d3-state-visualizer/src/charts/tree/tree.js

@@ -1,9 +1,14 @@
-import d3 from 'd3'
+import d3 from 'd3';
-import { isEmpty } from 'ramda'
+import { isEmpty } from 'ramda';
-import map2tree from 'map2tree'
+import map2tree from 'map2tree';
-import deepmerge from 'deepmerge'
+import deepmerge from 'deepmerge';
-import { getTooltipString, toggleChildren, visit, getNodeGroupByDepthCount } from './utils'
+import {
-import d3tooltip from 'd3tooltip'
+  getTooltipString,
+  toggleChildren,
+  visit,
+  getNodeGroupByDepthCount
+} from './utils';
+import d3tooltip from 'd3tooltip';
 
 const defaultOptions = {
   state: undefined,
@@ -14,7 +19,7 @@ const defaultOptions = {
   style: {
     node: {
       colors: {
-        'default': '#ccc',
+        default: '#ccc',
         collapsed: 'lightsteelblue',
         parent: 'white'
       },
@@ -22,7 +27,7 @@ const defaultOptions = {
     },
     text: {
       colors: {
-        'default': 'black',
+        default: 'black',
         hover: 'skyblue'
       }
     },
@@ -56,7 +61,7 @@ const defaultOptions = {
     },
     style: undefined
   }
-}
+};
 
 export default function(DOMNode, options = {}) {
   const {
@@ -77,48 +82,55 @@ export default function(DOMNode, options = {}) {
     tree,
     tooltipOptions,
     onClickText
-    } = deepmerge(defaultOptions, options)
+  } = deepmerge(defaultOptions, options);
 
-  const width = size - margin.left - margin.right
+  const width = size - margin.left - margin.right;
-  const height = size * aspectRatio - margin.top - margin.bottom
+  const height = size * aspectRatio - margin.top - margin.bottom;
-  const fullWidth = size
+  const fullWidth = size;
-  const fullHeight = size * aspectRatio
+  const fullHeight = size * aspectRatio;
 
   const attr = {
     id,
     preserveAspectRatio: 'xMinYMin slice'
-  }
+  };
 
   if (!style.width) {
-    attr.width = fullWidth
+    attr.width = fullWidth;
   }
 
   if (!style.width || !style.height) {
-    attr.viewBox = `0 0 ${fullWidth} ${fullHeight}`
+    attr.viewBox = `0 0 ${fullWidth} ${fullHeight}`;
   }
 
-  const root = d3.select(DOMNode)
+  const root = d3.select(DOMNode);
-  const zoom = d3.behavior.zoom()
+  const zoom = d3.behavior
+    .zoom()
     .scaleExtent([0.1, 3])
-    .scale(initialZoom)
+    .scale(initialZoom);
   const vis = root
     .append('svg')
     .attr(attr)
-    .style({cursor: '-webkit-grab', ...style})
+    .style({ cursor: '-webkit-grab', ...style })
-    .call(zoom.on('zoom', () => {
+    .call(
-      const { translate, scale } = d3.event
+      zoom.on('zoom', () => {
-      vis.attr('transform', `translate(${translate})scale(${scale})`)
+        const { translate, scale } = d3.event;
-    }))
+        vis.attr('transform', `translate(${translate})scale(${scale})`);
+      })
+    )
     .append('g')
     .attr({
-      transform: `translate(${margin.left + style.node.radius}, ${margin.top}) scale(${initialZoom})`
+      transform: `translate(${margin.left + style.node.radius}, ${
-    })
+        margin.top
+      }) scale(${initialZoom})`
+    });
 
-  let layout = d3.layout.tree().size([width, height])
+  let layout = d3.layout.tree().size([width, height]);
-  let data
+  let data;
 
   if (isSorted) {
-    layout.sort((a, b) => b.name.toLowerCase() < a.name.toLowerCase() ? 1 : -1)
+    layout.sort((a, b) =>
+      b.name.toLowerCase() < a.name.toLowerCase() ? 1 : -1
+    );
   }
 
   // previousNodePositionsById stores node x and y
@@ -131,85 +143,109 @@ export default function(DOMNode, options = {}) {
       x: height / 2,
       y: 0
     }
-  }
+  };
 
   // traverses a map with node positions by going through the chain
   // of parent ids; once a parent that matches the given filter is found,
   // the parent position gets returned
   function findParentNodePosition(nodePositionsById, nodeId, filter) {
-    let currentPosition = nodePositionsById[nodeId]
+    let currentPosition = nodePositionsById[nodeId];
     while (currentPosition) {
-      currentPosition = nodePositionsById[currentPosition.parentId]
+      currentPosition = nodePositionsById[currentPosition.parentId];
       if (!currentPosition) {
-        return null
+        return null;
       }
       if (!filter || filter(currentPosition)) {
-        return currentPosition
+        return currentPosition;
       }
     }
   }
 
   return function renderChart(nextState = tree || state) {
-    data = !tree ? map2tree(nextState, {key: rootKeyName, pushMethod}) : nextState
+    data = !tree
+      ? map2tree(nextState, { key: rootKeyName, pushMethod })
+      : nextState;
 
     if (isEmpty(data) || !data.name) {
-      data = { name: 'error', message: 'Please provide a state map or a tree structure'}
+      data = {
+        name: 'error',
+        message: 'Please provide a state map or a tree structure'
+      };
     }
 
-    let nodeIndex = 0
+    let nodeIndex = 0;
-    let maxLabelLength = 0
+    let maxLabelLength = 0;
 
     // nodes are assigned with string ids, which reflect their location
     // within the hierarcy; e.g. "root|branch|subBranch|subBranch[0]|property"
     // top-level elemnt always has id "root"
-    visit(data,
+    visit(
-        node => {
+      data,
-          maxLabelLength = Math.max(node.name.length, maxLabelLength)
+      node => {
-          node.id = node.id || 'root'
+        maxLabelLength = Math.max(node.name.length, maxLabelLength);
-        },
+        node.id = node.id || 'root';
-        node => node.children && node.children.length > 0 ? node.children.map((c) => {
+      },
-          c.id = `${node.id || ''}|${c.name}`
+      node =>
-          return c
+        node.children && node.children.length > 0
-        }) : null
+          ? node.children.map(c => {
-    )
+              c.id = `${node.id || ''}|${c.name}`;
+              return c;
+            })
+          : null
+    );
 
     /*eslint-disable*/
-    update()
+    update();
     /*eslint-enable*/
 
     function update() {
       // path generator for links
-      const diagonal = d3.svg.diagonal().projection(d => [d.y, d.x])
+      const diagonal = d3.svg.diagonal().projection(d => [d.y, d.x]);
       // set tree dimensions and spacing between branches and nodes
-      const maxNodeCountByLevel = Math.max(...getNodeGroupByDepthCount(data))
+      const maxNodeCountByLevel = Math.max(...getNodeGroupByDepthCount(data));
 
-      layout = layout.size([maxNodeCountByLevel * 25 * heightBetweenNodesCoeff, width])
+      layout = layout.size([
+        maxNodeCountByLevel * 25 * heightBetweenNodesCoeff,
+        width
+      ]);
 
-      let nodes = layout.nodes(data)
+      let nodes = layout.nodes(data);
-      let links = layout.links(nodes)
+      let links = layout.links(nodes);
 
-      nodes.forEach(node => node.y = node.depth * (maxLabelLength * 7 * widthBetweenNodesCoeff))
+      nodes.forEach(
+        node =>
+          (node.y = node.depth * (maxLabelLength * 7 * widthBetweenNodesCoeff))
+      );
 
       const nodePositions = nodes.map(n => ({
         parentId: n.parent && n.parent.id,
         id: n.id,
         x: n.x,
         y: n.y
-      }))
+      }));
-      const nodePositionsById = {}
+      const nodePositionsById = {};
-      nodePositions.forEach(node => nodePositionsById[node.id] = node)
+      nodePositions.forEach(node => (nodePositionsById[node.id] = node));
 
       // process the node selection
-      let node = vis.selectAll('g.node')
+      let node = vis
+        .selectAll('g.node')
         .property('__oldData__', d => d)
-        .data(nodes, d => d.id || (d.id = ++nodeIndex))
+        .data(nodes, d => d.id || (d.id = ++nodeIndex));
-      let nodeEnter = node.enter().append('g')
+      let nodeEnter = node
+        .enter()
+        .append('g')
         .attr({
-          'class': 'node',
+          class: 'node',
           transform: d => {
-            const position = findParentNodePosition(nodePositionsById, d.id, (n) => previousNodePositionsById[n.id])
+            const position = findParentNodePosition(
-            const previousPosition = position && previousNodePositionsById[position.id] || previousNodePositionsById.root
+              nodePositionsById,
-            return `translate(${previousPosition.y},${previousPosition.x})`
+              d.id,
+              n => previousNodePositionsById[n.id]
+            );
+            const previousPosition =
+              (position && previousNodePositionsById[position.id]) ||
+              previousNodePositionsById.root;
+            return `translate(${previousPosition.y},${previousPosition.x})`;
           }
         })
         .style({
@@ -220,43 +256,46 @@ export default function(DOMNode, options = {}) {
           mouseover: function mouseover() {
             d3.select(this).style({
               fill: style.text.colors.hover
-            })
+            });
           },
           mouseout: function mouseout() {
             d3.select(this).style({
               fill: style.text.colors.default
-            })
+            });
           }
-        })
+        });
 
       if (!tooltipOptions.disabled) {
-        nodeEnter.call(d3tooltip(d3, 'tooltip', {...tooltipOptions, root})
+        nodeEnter.call(
-          .text((d, i) => getTooltipString(d, i, tooltipOptions))
+          d3tooltip(d3, 'tooltip', { ...tooltipOptions, root })
-          .style(tooltipOptions.style)
+            .text((d, i) => getTooltipString(d, i, tooltipOptions))
-        )
+            .style(tooltipOptions.style)
+        );
       }
 
       // g inside node contains circle and text
       // this extra wrapper helps run d3 transitions in parallel
-      const nodeEnterInnerGroup = nodeEnter.append('g')
+      const nodeEnterInnerGroup = nodeEnter.append('g');
-      nodeEnterInnerGroup.append('circle')
+      nodeEnterInnerGroup
+        .append('circle')
         .attr({
-          'class': 'nodeCircle',
+          class: 'nodeCircle',
           r: 0
         })
         .on({
           click: clickedNode => {
-            if (d3.event.defaultPrevented) return
+            if (d3.event.defaultPrevented) return;
-            toggleChildren(clickedNode)
+            toggleChildren(clickedNode);
-            update()
+            update();
           }
-        })
+        });
 
-      nodeEnterInnerGroup.append('text')
+      nodeEnterInnerGroup
+        .append('text')
         .attr({
-          'class': 'nodeText',
+          class: 'nodeText',
           'text-anchor': 'middle',
-          'transform': `translate(0,0)`,
+          transform: 'translate(0,0)',
           dy: '.35em'
         })
         .style({
@@ -265,118 +304,148 @@ export default function(DOMNode, options = {}) {
         .text(d => d.name)
         .on({
           click: onClickText
-        })
+        });
 
       // update the text to reflect whether node has children or not
-      node.select('text')
+      node.select('text').text(d => d.name);
-        .text(d => d.name)
 
       // change the circle fill depending on whether it has children and is collapsed
-      node.select('circle')
+      node.select('circle').style({
-        .style({
+        stroke: 'black',
-          stroke: 'black',
+        'stroke-width': '1.5px',
-          'stroke-width': '1.5px',
+        fill: d =>
-          fill: d => d._children ? style.node.colors.collapsed : (d.children ? style.node.colors.parent : style.node.colors.default)
+          d._children
-        })
+            ? style.node.colors.collapsed
+            : d.children
+            ? style.node.colors.parent
+            : style.node.colors.default
+      });
 
       // transition nodes to their new position
-      let nodeUpdate = node.transition()
+      let nodeUpdate = node
+        .transition()
         .duration(transitionDuration)
         .attr({
           transform: d => `translate(${d.y},${d.x})`
-        })
+        });
 
       // ensure circle radius is correct
-      nodeUpdate.select('circle')
+      nodeUpdate.select('circle').attr('r', style.node.radius);
-        .attr('r', style.node.radius)
 
       // fade the text in and align it
-      nodeUpdate.select('text')
+      nodeUpdate
+        .select('text')
         .style('fill-opacity', 1)
         .attr({
           transform: function transform(d) {
-            const x = (d.children || d._children ? -1 : 1) * (this.getBBox().width / 2 + style.node.radius + 5)
+            const x =
-            return `translate(${x},0)`
+              (d.children || d._children ? -1 : 1) *
+              (this.getBBox().width / 2 + style.node.radius + 5);
+            return `translate(${x},0)`;
           }
-        })
+        });
 
       // blink updated nodes
-      node.filter(function flick(d) {
+      node
-        // test whether the relevant properties of d match
+        .filter(function flick(d) {
-        // the equivalent property of the oldData
+          // test whether the relevant properties of d match
-        // also test whether the old data exists,
+          // the equivalent property of the oldData
-        // to catch the entering elements!
+          // also test whether the old data exists,
-        return (this.__oldData__ && d.value !== this.__oldData__.value)
+          // to catch the entering elements!
-      })
+          return this.__oldData__ && d.value !== this.__oldData__.value;
+        })
         .select('g')
-        .style('opacity', '0.3').transition()
+        .style('opacity', '0.3')
-        .duration(blinkDuration).style('opacity', '1')
+        .transition()
+        .duration(blinkDuration)
+        .style('opacity', '1');
 
       // transition exiting nodes to the parent's new position
-      let nodeExit = node.exit().transition()
+      let nodeExit = node
+        .exit()
+        .transition()
         .duration(transitionDuration)
         .attr({
           transform: d => {
-            const position = findParentNodePosition(previousNodePositionsById, d.id, (n) => nodePositionsById[n.id])
+            const position = findParentNodePosition(
-            const futurePosition = position && nodePositionsById[position.id] || nodePositionsById.root
+              previousNodePositionsById,
-            return `translate(${futurePosition.y},${futurePosition.x})`
+              d.id,
+              n => nodePositionsById[n.id]
+            );
+            const futurePosition =
+              (position && nodePositionsById[position.id]) ||
+              nodePositionsById.root;
+            return `translate(${futurePosition.y},${futurePosition.x})`;
           }
         })
-        .remove()
+        .remove();
 
-      nodeExit.select('circle')
+      nodeExit.select('circle').attr('r', 0);
-        .attr('r', 0)
 
-      nodeExit.select('text')
+      nodeExit.select('text').style('fill-opacity', 0);
-        .style('fill-opacity', 0)
 
       // update the links
-      let link = vis.selectAll('path.link')
+      let link = vis.selectAll('path.link').data(links, d => d.target.id);
-        .data(links, d => d.target.id)
 
       // enter any new links at the parent's previous position
-      link.enter().insert('path', 'g')
+      link
+        .enter()
+        .insert('path', 'g')
         .attr({
-          'class': 'link',
+          class: 'link',
           d: d => {
-            const position = findParentNodePosition(nodePositionsById, d.target.id, (n) => previousNodePositionsById[n.id])
+            const position = findParentNodePosition(
-            const previousPosition = position && previousNodePositionsById[position.id] || previousNodePositionsById.root
+              nodePositionsById,
+              d.target.id,
+              n => previousNodePositionsById[n.id]
+            );
+            const previousPosition =
+              (position && previousNodePositionsById[position.id]) ||
+              previousNodePositionsById.root;
             return diagonal({
               source: previousPosition,
               target: previousPosition
-            })
+            });
           }
         })
-        .style(style.link)
+        .style(style.link);
 
       // transition links to their new position
-      link.transition()
+      link
+        .transition()
         .duration(transitionDuration)
         .attr({
           d: diagonal
-        })
+        });
 
       // transition exiting nodes to the parent's new position
-      link.exit()
+      link
+        .exit()
         .transition()
         .duration(transitionDuration)
         .attr({
           d: d => {
-            const position = findParentNodePosition(previousNodePositionsById, d.target.id, (n) => nodePositionsById[n.id])
+            const position = findParentNodePosition(
-            const futurePosition = position && nodePositionsById[position.id] || nodePositionsById.root
+              previousNodePositionsById,
+              d.target.id,
+              n => nodePositionsById[n.id]
+            );
+            const futurePosition =
+              (position && nodePositionsById[position.id]) ||
+              nodePositionsById.root;
             return diagonal({
               source: futurePosition,
               target: futurePosition
-            })
+            });
           }
         })
-        .remove()
+        .remove();
 
       // delete the old data once it's no longer needed
-      node.property('__oldData__', null)
+      node.property('__oldData__', null);
 
       // stash the old positions for transition
-      previousNodePositionsById = nodePositionsById
+      previousNodePositionsById = nodePositionsById;
     }
-  }
+  };
 }

packages/devui/src/Slider/styles/default.js

@@ -56,9 +56,7 @@ export const style = ({ theme, percent, disabled, withLabel }) => css`
     height: 0.8em;
     border-radius: 0.5em;
     box-shadow: 0 0 .125em ${theme.base04};
-    background: linear-gradient(${theme.base01}, ${theme.base02} 40%, ${
+    background: linear-gradient(${theme.base01}, ${theme.base02} 40%, ${theme.base01})
-      theme.base01
-    })
       no-repeat ${theme.base00};
     background-size: ${percent}% 100%;
   }`

packages/devui/src/Tabs/Tabs.js

@@ -76,7 +76,7 @@ export default class Tabs extends Component {
       <TabsContainer position={this.props.position}>
         {tabsHeader}
         <div>
-          <this.SelectedComponent {...this.selector && this.selector()} />
+          <this.SelectedComponent {...(this.selector && this.selector())} />
         </div>
       </TabsContainer>
     );

packages/devui/src/utils/animations.js

@@ -36,9 +36,7 @@ export const ripple = theme => `
     top: 0;
     left: 0;
     pointer-events: none;
-    background-image: radial-gradient(circle, ${
+    background-image: radial-gradient(circle, ${theme.base07} 11%, transparent 11%);
-      theme.base07
-    } 11%, transparent 11%);
     background-repeat: no-repeat;
     background-position: 50%;
     transform: scale(10, 10);

packages/devui/src/utils/createStyledComponent.js

@@ -10,7 +10,10 @@ export default (styles, component) =>
       props.theme.type
         ? getStyle(styles, props.theme.type)
         : // used outside of container (theme provider)
-          getStyle(styles, 'default')({
+          getStyle(
+            styles,
+            'default'
+          )({
             ...props,
             theme: getDefaultTheme(props.theme)
           })}

packages/map2tree/test/map2tree.spec.js

@@ -31,7 +31,10 @@ describe('# shallow map', () => {
 
     const expected = {
       name: 'state',
-      children: [{ name: 'a', value: 'foo' }, { name: 'b', value: 'bar' }]
+      children: [
+        { name: 'a', value: 'foo' },
+        { name: 'b', value: 'bar' }
+      ]
     };
 
     expect(map2tree(map)).toEqual(expected);
@@ -62,7 +65,10 @@ describe('# shallow map', () => {
       children: [
         {
           name: 'a',
-          children: [{ name: 'aa', value: 'foo' }, { name: 'ab', value: 'bar' }]
+          children: [
+            { name: 'aa', value: 'foo' },
+            { name: 'ab', value: 'bar' }
+          ]
         }
       ]
     };
@@ -132,7 +138,10 @@ describe('# array map', () => {
       children: [
         {
           name: 'a',
-          children: [{ name: 'a[0]', value: 1 }, { name: 'a[1]', value: 2 }]
+          children: [
+            { name: 'a[0]', value: 1 },
+            { name: 'a[1]', value: 2 }
+          ]
         }
       ]
     };
@@ -148,7 +157,10 @@ describe('# array map', () => {
       children: [
         {
           name: 'a',
-          children: [{ name: 'a[1]', value: 2 }, { name: 'a[0]', value: 1 }]
+          children: [
+            { name: 'a[1]', value: 2 },
+            { name: 'a[0]', value: 1 }
+          ]
         }
       ]
     };

packages/react-json-tree/examples/webpack.config.js

@@ -16,9 +16,7 @@ module.exports = {
     filename: 'bundle.js',
     publicPath: '/static/'
   },
-  plugins: [
+  plugins: [new webpack.HotModuleReplacementPlugin()],
-    new webpack.HotModuleReplacementPlugin(),
-  ],
   module: {
     rules: [
       {

packages/redux-devtools-chart-monitor/src/Chart.js

@@ -20,7 +20,7 @@ class Chart extends Component {
     style: PropTypes.shape({
       node: PropTypes.shape({
         colors: PropTypes.shape({
-          'default': PropTypes.string,
+          default: PropTypes.string,
           parent: PropTypes.string,
           collapsed: PropTypes.string
         }),
@@ -28,7 +28,7 @@ class Chart extends Component {
       }),
       text: PropTypes.shape({
         colors: PropTypes.shape({
-          'default': PropTypes.string,
+          default: PropTypes.string,
           hover: PropTypes.string
         })
       }),
@@ -79,7 +79,7 @@ class Chart extends Component {
   }
 
   render() {
-    return <div style={wrapperStyle} ref={this.divRef}/>;
+    return <div style={wrapperStyle} ref={this.divRef} />;
   }
 }
 

packages/redux-devtools-chart-monitor/src/ChartMonitor.js

@@ -50,15 +50,12 @@ class ChartMonitor extends Component {
 
     preserveScrollTop: PropTypes.bool,
     select: PropTypes.func.isRequired,
-    theme: PropTypes.oneOfType([
+    theme: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
-      PropTypes.object,
-      PropTypes.string
-    ]),
     invertTheme: PropTypes.bool
   };
 
   static defaultProps = {
-    select: (state) => state,
+    select: state => state,
     theme: 'nicinabox',
     preserveScrollTop: true,
     invertTheme: false
@@ -106,7 +103,9 @@ class ChartMonitor extends Component {
     }
 
     // eslint-disable-next-line no-console
-    console.warn('DevTools theme ' + theme + ' not found, defaulting to nicinabox');
+    console.warn(
+      'DevTools theme ' + theme + ' not found, defaulting to nicinabox'
+    );
     return invertTheme ? invertColors(themes.nicinabox) : themes.nicinabox;
   }
 
@@ -118,7 +117,7 @@ class ChartMonitor extends Component {
       height: '100%',
       node: {
         colors: {
-          'default': theme.base0B,
+          default: theme.base0B,
           collapsed: theme.base0B,
           parent: theme.base0E
         },
@@ -126,7 +125,7 @@ class ChartMonitor extends Component {
       },
       text: {
         colors: {
-          'default': theme.base0D,
+          default: theme.base0D,
           hover: theme.base06
         }
       }
@@ -139,18 +138,20 @@ class ChartMonitor extends Component {
 
     const tooltipOptions = {
       disabled: false,
-      offset: {left: 30, top: 10},
+      offset: { left: 30, top: 10 },
       indentationSize: 2,
       style: {
         'background-color': theme.base06,
-        'opacity': '0.7',
+        opacity: '0.7',
         'border-radius': '5px',
-        'padding': '5px'
+        padding: '5px'
       }
     };
 
     const defaultOptions = {
-      state: computedStates.length ? computedStates[props.currentStateIndex].state : null,
+      state: computedStates.length
+        ? computedStates[props.currentStateIndex].state
+        : null,
       isSorted: false,
       heightBetweenNodesCoeff: 1,
       widthBetweenNodesCoeff: 1.3,
@@ -165,7 +166,7 @@ class ChartMonitor extends Component {
     const theme = this.getTheme();
 
     return (
-      <div style={{...styles.container, backgroundColor: theme.base07}}>
+      <div style={{ ...styles.container, backgroundColor: theme.base07 }}>
         <Chart {...this.getChartOptions()} />
       </div>
     );

packages/redux-devtools-chart-monitor/src/actions.js

@@ -1 +1,2 @@
-export const TOGGLE_VISIBILITY = '@@redux-devtools-log-monitor/TOGGLE_VISIBILITY';
+export const TOGGLE_VISIBILITY =
+  '@@redux-devtools-log-monitor/TOGGLE_VISIBILITY';

packages/redux-devtools-cli/src/routes.js

@@ -9,7 +9,11 @@ var graphqlMiddleware = require('./middleware/graphql');
 var app = express.Router();
 
 function serveUmdModule(name) {
-  app.use(express.static(path.dirname(require.resolve(name + '/package.json')) + '/umd'));
+  app.use(
+    express.static(
+      path.dirname(require.resolve(name + '/package.json')) + '/umd'
+    )
+  );
 }
 
 function routes(options, store, scServer) {

packages/redux-devtools-core/src/app/components/Header.js

@@ -75,7 +75,4 @@ function mapDispatchToProps(dispatch) {
   };
 }
 
-export default connect(
+export default connect(null, mapDispatchToProps)(Header);
-  null,
-  mapDispatchToProps
-)(Header);

packages/redux-devtools-core/src/app/components/InstanceSelector.js

@@ -45,7 +45,4 @@ function mapDispatchToProps(dispatch) {
   };
 }
 
-export default connect(
+export default connect(mapStateToProps, mapDispatchToProps)(InstanceSelector);
-  mapStateToProps,
-  mapDispatchToProps
-)(InstanceSelector);

packages/redux-devtools-core/src/app/components/MonitorSelector.js

@@ -42,7 +42,4 @@ function mapDispatchToProps(dispatch) {
   };
 }
 
-export default connect(
+export default connect(mapStateToProps, mapDispatchToProps)(MonitorSelector);
-  mapStateToProps,
-  mapDispatchToProps
-)(MonitorSelector);

packages/redux-devtools-core/src/app/components/Settings/Connection.js

@@ -129,7 +129,4 @@ function mapDispatchToProps(dispatch) {
   };
 }
 
-export default connect(
+export default connect(mapStateToProps, mapDispatchToProps)(Connection);
-  mapStateToProps,
-  mapDispatchToProps
-)(Connection);

packages/redux-devtools-core/src/app/components/Settings/Themes.js

@@ -61,7 +61,4 @@ function mapDispatchToProps(dispatch) {
   };
 }
 
-export default connect(
+export default connect(mapStateToProps, mapDispatchToProps)(Themes);
-  mapStateToProps,
-  mapDispatchToProps
-)(Themes);

packages/redux-devtools-core/src/app/components/buttons/DispatcherButton.js

@@ -38,7 +38,4 @@ function mapDispatchToProps(dispatch) {
   };
 }
 
-export default connect(
+export default connect(null, mapDispatchToProps)(DispatcherButton);
-  null,
-  mapDispatchToProps
-)(DispatcherButton);

packages/redux-devtools-core/src/app/components/buttons/ExportButton.js

@@ -30,7 +30,4 @@ function mapDispatchToProps(dispatch) {
   };
 }
 
-export default connect(
+export default connect(null, mapDispatchToProps)(ExportButton);
-  null,
-  mapDispatchToProps
-)(ExportButton);

packages/redux-devtools-core/src/app/components/buttons/ImportButton.js

@@ -61,7 +61,4 @@ function mapDispatchToProps(dispatch) {
   };
 }
 
-export default connect(
+export default connect(null, mapDispatchToProps)(ImportButton);
-  null,
-  mapDispatchToProps
-)(ImportButton);

packages/redux-devtools-core/src/app/components/buttons/LockButton.js

@@ -37,7 +37,4 @@ function mapDispatchToProps(dispatch, ownProps) {
   };
 }
 
-export default connect(
+export default connect(null, mapDispatchToProps)(LockButton);
-  null,
-  mapDispatchToProps
-)(LockButton);

packages/redux-devtools-core/src/app/components/buttons/PersistButton.js

@@ -49,7 +49,4 @@ function mapDispatchToProps(dispatch) {
   };
 }
 
-export default connect(
+export default connect(mapStateToProps, mapDispatchToProps)(LockButton);
-  mapStateToProps,
-  mapDispatchToProps
-)(LockButton);

packages/redux-devtools-core/src/app/components/buttons/RecordButton.js

@@ -35,7 +35,4 @@ function mapDispatchToProps(dispatch, ownProps) {
   };
 }
 
-export default connect(
+export default connect(null, mapDispatchToProps)(RecordButton);
-  null,
-  mapDispatchToProps
-)(RecordButton);

packages/redux-devtools-core/src/app/components/buttons/SliderButton.js

@@ -36,7 +36,4 @@ function mapDispatchToProps(dispatch) {
   };
 }
 
-export default connect(
+export default connect(null, mapDispatchToProps)(SliderButton);
-  null,
-  mapDispatchToProps
-)(SliderButton);

packages/redux-devtools-core/src/app/components/buttons/SyncButton.js

@@ -42,7 +42,4 @@ function mapDispatchToProps(dispatch) {
   };
 }
 
-export default connect(
+export default connect(mapStateToProps, mapDispatchToProps)(SyncButton);
-  mapStateToProps,
-  mapDispatchToProps
-)(SyncButton);

packages/redux-devtools-core/src/app/containers/Actions.js

@@ -82,7 +82,4 @@ function mapDispatchToProps(dispatch) {
   };
 }
 
-export default connect(
+export default connect(mapStateToProps, mapDispatchToProps)(Actions);
-  mapStateToProps,
-  mapDispatchToProps
-)(Actions);

packages/redux-devtools-core/src/app/containers/App.js

@@ -61,7 +61,4 @@ function mapDispatchToProps(dispatch) {
   };
 }
 
-export default connect(
+export default connect(mapStateToProps, mapDispatchToProps)(App);
-  mapStateToProps,
-  mapDispatchToProps
-)(App);

packages/redux-devtools-core/src/app/containers/monitors/ChartMonitorWrapper.js

@@ -53,7 +53,4 @@ function mapDispatchToProps(dispatch) {
   };
 }
 
-export default connect(
+export default connect(null, mapDispatchToProps)(ChartMonitorWrapper);
-  null,
-  mapDispatchToProps
-)(ChartMonitorWrapper);

packages/redux-devtools-core/src/app/containers/monitors/Dispatcher.js

@@ -214,7 +214,4 @@ function mapDispatchToProps(dispatch) {
   };
 }
 
-export default connect(
+export default connect(null, mapDispatchToProps)(Dispatcher);
-  null,
-  mapDispatchToProps
-)(Dispatcher);

packages/redux-devtools-core/src/app/containers/monitors/InspectorWrapper/ChartTab.js

@@ -105,8 +105,5 @@ function mapDispatchToProps(dispatch) {
   };
 }
 
-const ConnectedChartTab = connect(
+const ConnectedChartTab = connect(null, mapDispatchToProps)(ChartTab);
-  null,
-  mapDispatchToProps
-)(ChartTab);
 export default withTheme(ConnectedChartTab);

packages/redux-devtools-core/src/app/containers/monitors/InspectorWrapper/SubTabs.js

@@ -109,7 +109,4 @@ function mapDispatchToProps(dispatch) {
   };
 }
 
-export default connect(
+export default connect(mapStateToProps, mapDispatchToProps)(SubTabs);
-  mapStateToProps,
-  mapDispatchToProps
-)(SubTabs);

packages/redux-devtools-core/src/utils/filters.js

@@ -45,7 +45,8 @@ export function isFiltered(action, localFilter) {
   const opts = getDevToolsOptions();
   if (
     (!localFilter &&
-      (opts.filter && opts.filter === FilterState.DO_NOT_FILTER)) ||
+      opts.filter &&
+      opts.filter === FilterState.DO_NOT_FILTER) ||
     (type && typeof type.match !== 'function')
   )
     return false;

packages/redux-devtools-inspector/demo/src/js/DemoApp.jsx

@@ -236,33 +236,30 @@ class DemoApp extends React.Component {
   };
 }
 
-export default connect(
+export default connect(state => state, {
-  state => state,
+  toggleTimeoutUpdate: timeoutUpdateEnabled => ({
-  {
+    type: 'TOGGLE_TIMEOUT_UPDATE',
-    toggleTimeoutUpdate: timeoutUpdateEnabled => ({
+    timeoutUpdateEnabled
-      type: 'TOGGLE_TIMEOUT_UPDATE',
+  }),
-      timeoutUpdateEnabled
+  timeoutUpdate: () => ({ type: 'TIMEOUT_UPDATE' }),
-    }),
+  increment: () => ({ type: 'INCREMENT' }),
-    timeoutUpdate: () => ({ type: 'TIMEOUT_UPDATE' }),
+  push: () => ({ type: 'PUSH' }),
-    increment: () => ({ type: 'INCREMENT' }),
+  pop: () => ({ type: 'POP' }),
-    push: () => ({ type: 'PUSH' }),
+  replace: () => ({ type: 'REPLACE' }),
-    pop: () => ({ type: 'POP' }),
+  changeNested: () => ({ type: 'CHANGE_NESTED' }),
-    replace: () => ({ type: 'REPLACE' }),
+  pushHugeArray: () => ({ type: 'PUSH_HUGE_ARRAY' }),
-    changeNested: () => ({ type: 'CHANGE_NESTED' }),
+  addIterator: () => ({ type: 'ADD_ITERATOR' }),
-    pushHugeArray: () => ({ type: 'PUSH_HUGE_ARRAY' }),
+  addHugeObect: () => ({ type: 'ADD_HUGE_OBJECT' }),
-    addIterator: () => ({ type: 'ADD_ITERATOR' }),
+  addRecursive: () => ({ type: 'ADD_RECURSIVE' }),
-    addHugeObect: () => ({ type: 'ADD_HUGE_OBJECT' }),
+  addNativeMap: () => ({ type: 'ADD_NATIVE_MAP' }),
-    addRecursive: () => ({ type: 'ADD_RECURSIVE' }),
+  addImmutableMap: () => ({ type: 'ADD_IMMUTABLE_MAP' }),
-    addNativeMap: () => ({ type: 'ADD_NATIVE_MAP' }),
+  changeImmutableNested: () => ({ type: 'CHANGE_IMMUTABLE_NESTED' }),
-    addImmutableMap: () => ({ type: 'ADD_IMMUTABLE_MAP' }),
+  hugePayload: () => ({
-    changeImmutableNested: () => ({ type: 'CHANGE_IMMUTABLE_NESTED' }),
+    type: 'HUGE_PAYLOAD',
-    hugePayload: () => ({
+    payload: Array.from({ length: 10000 }).map((_, i) => i)
-      type: 'HUGE_PAYLOAD',
+  }),
-      payload: Array.from({ length: 10000 }).map((_, i) => i)
+  addFunction: () => ({ type: 'ADD_FUNCTION' }),
-    }),
+  addSymbol: () => ({ type: 'ADD_SYMBOL' }),
-    addFunction: () => ({ type: 'ADD_FUNCTION' }),
+  shuffleArray: () => ({ type: 'SHUFFLE_ARRAY' }),
-    addSymbol: () => ({ type: 'ADD_SYMBOL' }),
+  pushRoute
-    shuffleArray: () => ({ type: 'SHUFFLE_ARRAY' }),
+})(DemoApp);
-    pushRoute
-  }
-)(DemoApp);

packages/redux-devtools-inspector/demo/src/js/reducers.js

@@ -28,8 +28,20 @@ const IMMUTABLE_MAP = Immutable.Map({
 });
 
 const NATIVE_MAP = new window.Map([
-  ['map', new window.Map([[{ first: true }, 1], ['second', 2]])],
+  [
-  ['weakMap', new window.WeakMap([[{ first: true }, 1], [{ second: 1 }, 2]])],
+    'map',
+    new window.Map([
+      [{ first: true }, 1],
+      ['second', 2]
+    ])
+  ],
+  [
+    'weakMap',
+    new window.WeakMap([
+      [{ first: true }, 1],
+      [{ second: 1 }, 2]
+    ])
+  ],
   ['set', new window.Set([{ first: true }, 'second'])],
   ['weakSet', new window.WeakSet([{ first: true }, { second: 1 }])]
 ]);

packages/redux-devtools-instrument/src/instrument.js

@@ -80,7 +80,9 @@ export const ActionCreators = {
             stack = frames
               .slice(
                 0,
-                traceLimit + extraFrames + (frames[0].startsWith('Error') ? 1 : 0)
+                traceLimit +
+                  extraFrames +
+                  (frames[0].startsWith('Error') ? 1 : 0)
               )
               .join('\n');
           }

packages/redux-devtools-instrument/test/instrument.spec.js

@@ -983,7 +983,9 @@ describe('instrument', () => {
       exportedState = monitoredLiftedStore.getState();
       expect(exportedState.actionsById[0].stack).toBe(undefined);
       expect(typeof exportedState.actionsById[1].stack).toBe('string');
-      expect(exportedState.actionsById[1].stack).toContain('at Object.performAction');
+      expect(exportedState.actionsById[1].stack).toContain(
+        'at Object.performAction'
+      );
       expect(exportedState.actionsById[1].stack).toContain('instrument.js');
       expect(exportedState.actionsById[1].stack).toContain(
         'instrument.spec.js'
@@ -1318,13 +1320,7 @@ describe('instrument', () => {
 
   it('throws if there are more than one instrument enhancer included', () => {
     expect(() => {
-      createStore(
+      createStore(counter, compose(instrument(), instrument()));
-        counter,
-        compose(
-          instrument(),
-          instrument()
-        )
-      );
     }).toThrow(
       'DevTools instrumentation should not be applied more than once. ' +
         'Check your store configuration.'

packages/redux-devtools/examples/todomvc/containers/TodoApp.js

@@ -30,7 +30,4 @@ function mapDispatch(dispatch) {
   };
 }
 
-export default connect(
+export default connect(mapState, mapDispatch)(TodoApp);
-  mapState,
-  mapDispatch
-)(TodoApp);

packages/redux-devtools/test/persistState.spec.js

@@ -41,10 +41,7 @@ describe('persistState', () => {
   it('should persist state', () => {
     const store = createStore(
       reducer,
-      compose(
+      compose(instrument(), persistState('id'))
-        instrument(),
-        persistState('id')
-      )
     );
     expect(store.getState()).toBe(0);
 
@@ -54,35 +51,20 @@ describe('persistState', () => {
 
     const store2 = createStore(
       reducer,
-      compose(
+      compose(instrument(), persistState('id'))
-        instrument(),
-        persistState('id')
-      )
     );
     expect(store2.getState()).toBe(2);
   });
 
   it('should not persist state if no session id', () => {
-    const store = createStore(
+    const store = createStore(reducer, compose(instrument(), persistState()));
-      reducer,
-      compose(
-        instrument(),
-        persistState()
-      )
-    );
     expect(store.getState()).toBe(0);
 
     store.dispatch({ type: 'INCREMENT' });
     store.dispatch({ type: 'INCREMENT' });
     expect(store.getState()).toBe(2);
 
-    const store2 = createStore(
+    const store2 = createStore(reducer, compose(instrument(), persistState()));
-      reducer,
-      compose(
-        instrument(),
-        persistState()
-      )
-    );
     expect(store2.getState()).toBe(0);
   });
 
@@ -90,10 +72,7 @@ describe('persistState', () => {
     const oneLess = state => (state === undefined ? -1 : state - 1);
     const store = createStore(
       reducer,
-      compose(
+      compose(instrument(), persistState('id', oneLess))
-        instrument(),
-        persistState('id', oneLess)
-      )
     );
     expect(store.getState()).toBe(0);
 
@@ -103,10 +82,7 @@ describe('persistState', () => {
 
     const store2 = createStore(
       reducer,
-      compose(
+      compose(instrument(), persistState('id', oneLess))
-        instrument(),
-        persistState('id', oneLess)
-      )
     );
     expect(store2.getState()).toBe(1);
   });
@@ -116,10 +92,7 @@ describe('persistState', () => {
       action.type === 'INCREMENT' ? { type: 'DECREMENT' } : action;
     const store = createStore(
       reducer,
-      compose(
+      compose(instrument(), persistState('id', undefined, incToDec))
-        instrument(),
-        persistState('id', undefined, incToDec)
-      )
     );
     expect(store.getState()).toBe(0);
 
@@ -129,10 +102,7 @@ describe('persistState', () => {
 
     const store2 = createStore(
       reducer,
-      compose(
+      compose(instrument(), persistState('id', undefined, incToDec))
-        instrument(),
-        persistState('id', undefined, incToDec)
-      )
     );
     expect(store2.getState()).toBe(-2);
   });
@@ -140,13 +110,7 @@ describe('persistState', () => {
   it('should warn if read from localStorage fails', () => {
     const spy = jest.spyOn(console, 'warn').mockImplementation(() => {});
     delete global.localStorage.getItem;
-    createStore(
+    createStore(reducer, compose(instrument(), persistState('id')));
-      reducer,
-      compose(
-        instrument(),
-        persistState('id')
-      )
-    );
 
     expect(spy.mock.calls[0]).toContain(
       'Could not read debug session from localStorage:'
@@ -160,10 +124,7 @@ describe('persistState', () => {
     delete global.localStorage.setItem;
     const store = createStore(
       reducer,
-      compose(
+      compose(instrument(), persistState('id'))
-        instrument(),
-        persistState('id')
-      )
     );
 
     store.dispatch({ type: 'INCREMENT' });

packages/redux-slider-monitor/examples/todomvc/containers/TodoApp.js

@@ -30,7 +30,4 @@ function mapDispatch(dispatch) {
   };
 }
 
-export default connect(
+export default connect(mapState, mapDispatch)(TodoApp);
-  mapState,
-  mapDispatch
-)(TodoApp);

packages/redux-slider-monitor/examples/todomvc/webpack.config.js

@@ -20,9 +20,7 @@ module.exports = {
     path: path.join(__dirname, 'dist'),
     filename: 'bundle.js'
   },
-  plugins: [
+  plugins: [new webpack.HotModuleReplacementPlugin()],
-    new webpack.HotModuleReplacementPlugin()
-  ],
   module: {
     rules: [
       {

yarn.lock

@@ -2875,6 +2875,11 @@
   dependencies:
     "@babel/types" "^7.3.0"
 
+"@types/color-name@^1.1.1":
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/@types/color-name/-/color-name-1.1.1.tgz#1c1261bbeaa10a8055bbc5d8ab84b7b2afc846a0"
+  integrity sha512-rr+OQyAjxze7GgWrSaJwydHStIhHq2lvY3BOC2Mj7KnzI7XK0Uw1TOOdI9lDoajEbSWLiYgoo4f1R51erQfhPQ==
+
 "@types/glob@^7.1.1":
   version "7.1.3"
   resolved "https://registry.yarnpkg.com/@types/glob/-/glob-7.1.3.tgz#e6ba80f36b7daad2c685acd9266382e68985c183"
@@ -3394,6 +3399,14 @@ ansi-styles@^3.2.0, ansi-styles@^3.2.1:
   dependencies:
     color-convert "^1.9.0"
 
+ansi-styles@^4.1.0:
+  version "4.2.1"
+  resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-4.2.1.tgz#90ae75c424d008d2624c5bf29ead3177ebfcf359"
+  integrity sha512-9VGjrMsG1vePxcSweQsN20KY/c4zN0h9fLjqAbwbPfahM3t+NL+M9HC8xeXG2I8pX5NoamTGNuomEUFI7fcUjA==
+  dependencies:
+    "@types/color-name" "^1.1.1"
+    color-convert "^2.0.1"
+
 any-observable@^0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/any-observable/-/any-observable-0.3.0.tgz#af933475e5806a67d0d7df090dd5e8bef65d119b"
@@ -4858,6 +4871,14 @@ chalk@^2.0.0, chalk@^2.0.1, chalk@^2.1.0, chalk@^2.3.0, chalk@^2.3.1, chalk@^2.4
     escape-string-regexp "^1.0.5"
     supports-color "^5.3.0"
 
+chalk@^4.0.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/chalk/-/chalk-4.1.0.tgz#4e14870a618d9e2edd97dd8345fd9d9dc315646a"
+  integrity sha512-qwx12AxXe2Q5xQ43Ac//I6v5aXTipYrSESdOgzrN+9XjgEpyjpKuvSGaN4qE93f7TQTlerQQ8S+EQ0EyDoVL1A==
+  dependencies:
+    ansi-styles "^4.1.0"
+    supports-color "^7.1.0"
+
 chardet@^0.4.0:
   version "0.4.2"
   resolved "https://registry.yarnpkg.com/chardet/-/chardet-0.4.2.tgz#b5473b33dc97c424e5d98dc87d55d4d8a29c8bf2"
@@ -5119,6 +5140,13 @@ color-convert@^1.9.0, color-convert@^1.9.1:
   dependencies:
     color-name "1.1.3"
 
+color-convert@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-2.0.1.tgz#72d3a68d598c9bdb3af2ad1e84f21d896abd4de3"
+  integrity sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==
+  dependencies:
+    color-name "~1.1.4"
+
 color-diff@^0.1.3:
   version "0.1.7"
   resolved "https://registry.yarnpkg.com/color-diff/-/color-diff-0.1.7.tgz#6db78cd9482a8e459d40821eaf4b503283dcb8e2"
@@ -5129,7 +5157,7 @@ color-name@1.1.3:
   resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.3.tgz#a7d0558bd89c42f795dd42328f740831ca53bc25"
   integrity sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=
 
-color-name@^1.0.0:
+color-name@^1.0.0, color-name@~1.1.4:
   version "1.1.4"
   resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2"
   integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==
@@ -5247,6 +5275,11 @@ compare-func@^1.3.1:
     array-ify "^1.0.0"
     dot-prop "^3.0.0"
 
+compare-versions@^3.6.0:
+  version "3.6.0"
+  resolved "https://registry.yarnpkg.com/compare-versions/-/compare-versions-3.6.0.tgz#1a5689913685e5a87637b8d3ffca75514ec41d62"
+  integrity sha512-W6Af2Iw1z4CB7q4uU4hv646dW9GQuBM+YpC0UvUCWSD8w90SJjp+ujJuXaEMtAXBtSqGfMPuFOVn4/+FlaqfBA==
+
 component-emitter@1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/component-emitter/-/component-emitter-1.2.0.tgz#ccd113a86388d06482d03de3fc7df98526ba8efe"
@@ -7427,7 +7460,7 @@ find-up@^2.0.0, find-up@^2.1.0:
   dependencies:
     locate-path "^2.0.0"
 
-find-up@^4.1.0:
+find-up@^4.0.0, find-up@^4.1.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/find-up/-/find-up-4.1.0.tgz#97afe7d6cdc0bc5928584b7c8d7b16e8a9aa5d19"
   integrity sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==
@@ -7435,6 +7468,13 @@ find-up@^4.1.0:
     locate-path "^5.0.0"
     path-exists "^4.0.0"
 
+find-versions@^3.2.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/find-versions/-/find-versions-3.2.0.tgz#10297f98030a786829681690545ef659ed1d254e"
+  integrity sha512-P8WRou2S+oe222TOCHitLy8zj+SIsVJh52VP4lvXkaFVnOFFdoWv1H1Jjvel1aI6NCFOAaeAVm8qrI0odiLcww==
+  dependencies:
+    semver-regex "^2.0.0"
+
 findup-sync@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/findup-sync/-/findup-sync-3.0.0.tgz#17b108f9ee512dfb7a5c7f3c8b27ea9e1a9c08d1"
@@ -8192,6 +8232,11 @@ has-flag@^3.0.0:
   resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd"
   integrity sha1-tdRU3CGZriJWmfNGfloH87lVuv0=
 
+has-flag@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-4.0.0.tgz#944771fd9c81c81265c4d6941860da06bb59479b"
+  integrity sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==
+
 has-symbols@^1.0.0, has-symbols@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/has-symbols/-/has-symbols-1.0.1.tgz#9f5214758a44196c406d9bd76cebf81ec2dd31e8"
@@ -8552,6 +8597,22 @@ humanize-ms@^1.2.1:
   dependencies:
     ms "^2.0.0"
 
+husky@^4.2.5:
+  version "4.2.5"
+  resolved "https://registry.yarnpkg.com/husky/-/husky-4.2.5.tgz#2b4f7622673a71579f901d9885ed448394b5fa36"
+  integrity sha512-SYZ95AjKcX7goYVZtVZF2i6XiZcHknw50iXvY7b0MiGoj5RwdgRQNEHdb+gPDPCXKlzwrybjFjkL6FOj8uRhZQ==
+  dependencies:
+    chalk "^4.0.0"
+    ci-info "^2.0.0"
+    compare-versions "^3.6.0"
+    cosmiconfig "^6.0.0"
+    find-versions "^3.2.0"
+    opencollective-postinstall "^2.0.2"
+    pkg-dir "^4.2.0"
+    please-upgrade-node "^3.2.0"
+    slash "^3.0.0"
+    which-pm-runs "^1.0.0"
+
 hyphenate-style-name@^1.0.1:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/hyphenate-style-name/-/hyphenate-style-name-1.0.4.tgz#691879af8e220aea5750e8827db4ef62a54e361d"
@@ -11859,6 +11920,11 @@ onetime@^2.0.0:
   dependencies:
     mimic-fn "^1.0.0"
 
+opencollective-postinstall@^2.0.2:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/opencollective-postinstall/-/opencollective-postinstall-2.0.3.tgz#7a0fff978f6dbfa4d006238fbac98ed4198c3259"
+  integrity sha512-8AV/sCtuzUeTo8gQK5qDZzARrulB3egtLzFgteqB2tcT4Mw7B8Kt7JcDHmltjz6FOAHsvTevk70gZEbhM4ZS9Q==
+
 opn@5.4.0:
   version "5.4.0"
   resolved "https://registry.yarnpkg.com/opn/-/opn-5.4.0.tgz#cb545e7aab78562beb11aa3bfabc7042e1761035"
@@ -12405,6 +12471,13 @@ pkg-dir@^3.0.0:
   dependencies:
     find-up "^3.0.0"
 
+pkg-dir@^4.2.0:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/pkg-dir/-/pkg-dir-4.2.0.tgz#f099133df7ede422e81d1d8448270eeb3e4261f3"
+  integrity sha512-HRDzbaKjC+AOWVXxAU/x54COGeIv9eb+6CkDSQoNTt4XyWoIJvuPsXizxu/Fr23EiekbtZwmh1IcIG/l/a10GQ==
+  dependencies:
+    find-up "^4.0.0"
+
 pkg-up@2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/pkg-up/-/pkg-up-2.0.0.tgz#c819ac728059a461cab1c3889a2be3c49a004d7f"
@@ -12412,7 +12485,7 @@ pkg-up@2.0.0:
   dependencies:
     find-up "^2.1.0"
 
-please-upgrade-node@^3.0.2:
+please-upgrade-node@^3.0.2, please-upgrade-node@^3.2.0:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/please-upgrade-node/-/please-upgrade-node-3.2.0.tgz#aeddd3f994c933e4ad98b99d9a556efa0e2fe942"
   integrity sha512-gQR3WpIgNIKwBMVLkpMUeR3e1/E1y42bqDQZfql+kDeXd8COYfM8PQA4X6y7a8u9Ua9FHmsrrmirW2vHs45hWg==
@@ -14296,6 +14369,11 @@ semver-compare@^1.0.0:
   resolved "https://registry.yarnpkg.com/semver-compare/-/semver-compare-1.0.0.tgz#0dee216a1c941ab37e9efb1788f6afc5ff5537fc"
   integrity sha1-De4hahyUGrN+nvsXiPavxf9VN/w=
 
+semver-regex@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/semver-regex/-/semver-regex-2.0.0.tgz#a93c2c5844539a770233379107b38c7b4ac9d338"
+  integrity sha512-mUdIBBvdn0PLOeP3TEkMH7HHeUP3GjsXCwKarjv/kGmUFOYg1VqEemKhoQpWMu6X2I8kHeuVdGibLGkVK+/5Qw==
+
 "semver@2 || 3 || 4 || 5", "semver@2.x || 3.x || 4 || 5", semver@^5.3.0, semver@^5.4.1, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0, semver@^5.7.0, semver@^5.7.1:
   version "5.7.1"
   resolved "https://registry.yarnpkg.com/semver/-/semver-5.7.1.tgz#a954f931aeba508d307bbf069eff0c01c96116f7"
@@ -14553,6 +14631,11 @@ slash@^2.0.0:
   resolved "https://registry.yarnpkg.com/slash/-/slash-2.0.0.tgz#de552851a1759df3a8f206535442f5ec4ddeab44"
   integrity sha512-ZYKh3Wh2z1PpEXWr0MpSBZ0V6mZHAQfYevttO11c51CaWjGTaadiKZ+wVt1PbMlDV5qhMFslpZCemhwOK7C89A==
 
+slash@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/slash/-/slash-3.0.0.tgz#6539be870c165adbd5240220dbe361f1bc4d4634"
+  integrity sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==
+
 slice-ansi@0.0.4:
   version "0.0.4"
   resolved "https://registry.yarnpkg.com/slice-ansi/-/slice-ansi-0.0.4.tgz#edbf8903f66f7ce2f8eafd6ceed65e264c831b35"
@@ -15404,6 +15487,13 @@ supports-color@^6.1.0:
   dependencies:
     has-flag "^3.0.0"
 
+supports-color@^7.1.0:
+  version "7.1.0"
+  resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-7.1.0.tgz#68e32591df73e25ad1c4b49108a2ec507962bfd1"
+  integrity sha512-oRSIpR8pxT1Wr2FquTNnGet79b3BWljqOuoW/h4oBhxJ/HUbX5nX6JSruTkvXDCFMwDPvsaTTbvMLKZWSy0R5g==
+  dependencies:
+    has-flag "^4.0.0"
+
 svg-parser@^2.0.0:
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/svg-parser/-/svg-parser-2.0.4.tgz#fdc2e29e13951736140b76cb122c8ee6630eb6b5"
@@ -16498,6 +16588,11 @@ which-module@^2.0.0:
   resolved "https://registry.yarnpkg.com/which-module/-/which-module-2.0.0.tgz#d9ef07dce77b9902b8a3a8fa4b31c3e3f7e6e87a"
   integrity sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho=
 
+which-pm-runs@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/which-pm-runs/-/which-pm-runs-1.0.0.tgz#670b3afbc552e0b55df6b7780ca74615f23ad1cb"
+  integrity sha1-Zws6+8VS4LVd9rd4DKdGFfI60cs=
+
 which@^1.2.10, which@^1.2.14, which@^1.2.9, which@^1.3.0, which@^1.3.1:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/which/-/which-1.3.1.tgz#a45043d54f5805316da8d62f9f50918d3da70b0a"