Upgrading deps

.size-snapshot.json

@@ -1,21 +1,21 @@
 {
   "dist/react-beautiful-dnd.js": {
-    "bundled": 372683,
-    "minified": 142833,
-    "gzipped": 40327
+    "bundled": 399623,
+    "minified": 149169,
+    "gzipped": 42431
   },
   "dist/react-beautiful-dnd.min.js": {
-    "bundled": 334038,
-    "minified": 126662,
-    "gzipped": 35556
+    "bundled": 360109,
+    "minified": 132835,
+    "gzipped": 37619
   },
   "dist/react-beautiful-dnd.esm.js": {
-    "bundled": 176840,
-    "minified": 88989,
-    "gzipped": 22594,
+    "bundled": 176651,
+    "minified": 88912,
+    "gzipped": 22572,
     "treeshaked": {
-      "rollup": 77631,
-      "webpack": 79229
+      "rollup": 77466,
+      "webpack": 79086
     }
   }
 }

package.json

@@ -56,9 +56,9 @@
   },
   "devDependencies": {
     "@atlaskit/css-reset": "^2.0.0",
-    "@storybook/react": "^3.2.16",
+    "@storybook/react": "^3.4.1",
     "babel-cli": "^6.26.0",
-    "babel-eslint": "^8.2.1",
+    "babel-eslint": "^8.2.3",
     "babel-plugin-transform-class-properties": "^6.24.1",
     "babel-plugin-transform-es2015-modules-commonjs": "^6.26.0",
     "babel-plugin-transform-export-extensions": "^6.22.0",
@@ -67,33 +67,33 @@
     "babel-preset-env": "^1.6.1",
     "babel-preset-flow": "^6.23.0",
     "babel-preset-react": "^6.24.1",
-    "cross-env": "^5.1.3",
+    "cross-env": "^5.1.4",
     "enzyme": "^3.3.0",
     "enzyme-adapter-react-16": "^1.1.1",
-    "eslint": "^4.15.0",
+    "eslint": "^4.19.1",
     "eslint-config-airbnb": "^16.1.0",
-    "eslint-plugin-flowtype": "^2.41.0",
-    "eslint-plugin-import": "^2.8.0",
-    "eslint-plugin-jest": "^21.6.1",
+    "eslint-plugin-flowtype": "^2.46.2",
+    "eslint-plugin-import": "^2.11.0",
+    "eslint-plugin-jest": "^21.15.0",
     "eslint-plugin-jsx-a11y": "^6.0.3",
-    "eslint-plugin-react": "^7.5.1",
-    "flow-bin": "0.69.0",
-    "jest": "^22.0.5",
-    "puppeteer": "^1.2.0",
+    "eslint-plugin-react": "^7.7.0",
+    "flow-bin": "0.70.0",
+    "jest": "^22.4.3",
+    "puppeteer": "^1.3.0",
     "raf-stub": "^2.0.2",
     "react": "^16.3.1",
     "react-dom": "^16.3.1",
     "react-test-renderer": "^16.3.1",
     "rimraf": "^2.6.2",
-    "rollup": "^0.56.2",
+    "rollup": "^0.58.0",
     "rollup-plugin-babel": "^3.0.3",
     "rollup-plugin-commonjs": "^8.2.6",
     "rollup-plugin-node-resolve": "^3.0.2",
     "rollup-plugin-replace": "^2.0.0",
     "rollup-plugin-size-snapshot": "^0.3.0",
     "rollup-plugin-strip": "^1.1.1",
     "rollup-plugin-uglify": "^2.0.1",
-    "styled-components": "^3.2.0"
+    "styled-components": "^3.2.5"
   },
   "peerDependencies": {
     "react": "^16.3.1"

src/state/auto-scroller/get-best-scrollable-droppable.js

@@ -1,4 +1,5 @@
 // @flow
+import invariant from 'invariant';
 import memoizeOne from 'memoize-one';
 import isPositionInFrame from '../visibility/is-position-in-frame';
 import type {
@@ -36,9 +37,7 @@ const getScrollableDroppableOver = (
   const maybe: ?DroppableDimension =
     getScrollableDroppables(droppables)
       .find((droppable: DroppableDimension): boolean => {
-        if (!droppable.viewport.closestScrollable) {
-          throw new Error('Invalid result');
-        }
+        invariant(droppable.viewport.closestScrollable, 'Invalid result');
         return isPositionInFrame(droppable.viewport.closestScrollable.frame)(target);
       });
 

src/state/dimension.js

@@ -134,10 +134,11 @@ export const scrollDroppable = (
     clipped,
   };
 
-  return ({
+  const result: DroppableDimension = {
     ...droppable,
     viewport,
-  }: any);
+  };
+  return result;
 };
 
 type GetDroppableArgs = {|

src/state/move-cross-axis/get-best-cross-axis-droppable.js

@@ -1,4 +1,5 @@
 // @flow
+import invariant from 'invariant';
 import { closest } from '../position';
 import isWithin from '../is-within';
 import { getCorners } from '../spacing';
@@ -27,9 +28,8 @@ type GetBestDroppableArgs = {|
 const getSafeClipped = (droppable: DroppableDimension): Area => {
   const area: ?Area = droppable.viewport.clipped;
 
-  if (!area) {
-    throw new Error('cannot get clipped area from droppable');
-  }
+  invariant(area, 'Cannot get clipped area from droppable');
+
   return area;
 };
 

src/state/reducer.js

@@ -266,13 +266,13 @@ export default (state: State = clean('IDLE'), action: Action): State => {
         return existing;
       }
 
-      const newDrag: DragState = ({
+      const newDrag: DragState = {
         ...existing,
         current: {
           ...existing.current,
           hasCompletedFirstBulkPublish: true,
         },
-      }: any);
+      };
 
       return newDrag;
     })();

src/types.js

@@ -364,15 +364,15 @@ export type DropState = {|
   result: ?DropResult,
 |}
 
-export type State = {
+export type State = {|
   phase: Phase,
   dimension: DimensionState,
   // null if not dragging
   drag: ?DragState,
 
   // available when dropping or cancelling
   drop: ?DropState,
-};
+|};
 
 export type Action = ActionCreators;
 export type Dispatch = ReduxDispatch<Action>;

src/view/announcer/announcer.js

@@ -1,4 +1,5 @@
 // @flow
+import invariant from 'invariant';
 import type { Announce } from '../../types';
 import type { Announcer } from './announcer-types';
 
@@ -65,9 +66,7 @@ export default (): Announcer => {
     // hide the element visually
     Object.assign(el.style, visuallyHidden);
 
-    if (!document.body) {
-      throw new Error('Cannot find the head to append a style to');
-    }
+    invariant(document.body, 'Cannot find the head to append a style to');
 
     // add el tag to body
     document.body.appendChild(el);

src/view/draggable-dimension-publisher/draggable-dimension-publisher.jsx

@@ -1,6 +1,7 @@
 // @flow
 import { Component } from 'react';
 import type { Node } from 'react';
+import invariant from 'invariant';
 import PropTypes from 'prop-types';
 import memoizeOne from 'memoize-one';
 import getWindowScroll from '../window/get-window-scroll';
@@ -90,15 +91,11 @@ export default class DraggableDimensionPublisher extends Component<Props> {
   getDimension = (): DraggableDimension => {
     const targetRef: ?HTMLElement = this.props.getDraggableRef();
 
-    if (!targetRef) {
-      throw new Error('DraggableDimensionPublisher cannot calculate a dimension when not attached to the DOM');
-    }
+    invariant(targetRef, 'DraggableDimensionPublisher cannot calculate a dimension when not attached to the DOM');
 
     const descriptor: ?DraggableDescriptor = this.publishedDescriptor;
 
-    if (!descriptor) {
-      throw new Error('Cannot get dimension for unpublished draggable');
-    }
+    invariant(descriptor, 'Cannot get dimension for unpublished draggable');
 
     const tagName: string = targetRef.tagName.toLowerCase();
     const style = window.getComputedStyle(targetRef);

src/view/draggable/draggable.jsx

@@ -250,9 +250,7 @@ export default class Draggable extends Component<Props> {
           return this.getNotDraggingStyle(movementStyle, shouldAnimateDisplacement);
         }
 
-        if (!dimension) {
-          throw new Error('draggable dimension required for dragging');
-        }
+        invariant(dimension, 'draggable dimension required for dragging');
 
         // Need to position element in original visual position. To do this
         // we position it without

src/view/droppable-dimension-publisher/droppable-dimension-publisher.jsx

@@ -1,6 +1,7 @@
 // @flow
 import { Component } from 'react';
 import type { Node } from 'react';
+import invariant from 'invariant';
 import PropTypes from 'prop-types';
 import memoizeOne from 'memoize-one';
 import rafSchedule from 'raf-schd';
@@ -239,20 +240,11 @@ export default class DroppableDimensionPublisher extends Component<Props> {
     } = this.props;
 
     const targetRef: ?HTMLElement = getDroppableRef();
-
-    if (!targetRef) {
-      throw new Error('DimensionPublisher cannot calculate a dimension when not attached to the DOM');
-    }
-
-    if (this.isWatchingScroll) {
-      throw new Error('Attempting to recapture Droppable dimension while already watching scroll on previous capture');
-    }
-
     const descriptor: ?DroppableDescriptor = this.publishedDescriptor;
 
-    if (!descriptor) {
-      throw new Error('Cannot get dimension for unpublished droppable');
-    }
+    invariant(targetRef, 'DimensionPublisher cannot calculate a dimension when not attached to the DOM');
+    invariant(!this.isWatchingScroll, 'Attempting to recapture Droppable dimension while already watching scroll on previous capture');
+    invariant(descriptor, 'Cannot get dimension for unpublished droppable');
 
     const style: Object = window.getComputedStyle(targetRef);
 

src/view/style-marshal/style-marshal.js

@@ -1,5 +1,6 @@
 // @flow
 import memoizeOne from 'memoize-one';
+import invariant from 'invariant';
 import getStyles, { type Styles } from './get-styles';
 import type { StyleMarshal } from './style-marshal-types';
 import type {
@@ -60,9 +61,7 @@ export default () => {
     el.setAttribute(prefix, context);
     const head: ?HTMLElement = document.querySelector('head');
 
-    if (!head) {
-      throw new Error('Cannot find the head to append a style to');
-    }
+    invariant(head, 'Cannot find the head to append a style to');
 
     // add style tag to head
     head.appendChild(el);

src/view/window/get-viewport.js

@@ -1,4 +1,5 @@
 // @flow
+import invariant from 'invariant';
 import type { Position, Area, Viewport } from '../../types';
 import getArea from '../../state/get-area';
 import getWindowScroll from './get-window-scroll';
@@ -10,7 +11,9 @@ export default (): Viewport => {
   const top: number = scroll.y;
   const left: number = scroll.x;
 
-  const doc: HTMLElement = (document.documentElement : any);
+  const doc: ?HTMLElement = document.documentElement;
+
+  invariant(doc, 'Could not find document.documentElement');
 
   // Using these values as they do not consider scrollbars
   const width: number = doc.clientWidth;

stories/src/multi-drag/utils.js

@@ -38,7 +38,6 @@ const reorderSingleDrag = ({
       destination.index,
     );
 
-    // $ExpectError - using spread
     const updated: Entities = {
       ...entities,
       columns: {
@@ -68,7 +67,6 @@ const reorderSingleDrag = ({
   const newForeignTaskIds: Id[] = [...foreign.taskIds];
   newForeignTaskIds.splice(destination.index, 0, taskId);
 
-  // $ExpectError - using spread
   const updated: Entities = {
     ...entities,
     columns: {
@@ -191,7 +189,6 @@ const reorderMultiDrag = ({
     [final.id]: withNewTaskIds(final, withInserted),
   };
 
-  // $ExpectError - using spread
   const updated: Entities = {
     ...entities,
     columns: withAddedTasks,

test/unit/integration/lift-action-and-dimension-marshal.spec.js

@@ -110,7 +110,6 @@ describe('lifting and the dimension marshal', () => {
 
             // registering updated draggables
 
-            // $ExpectError - using spread
             const postDragInHome1: DraggableDimension = {
               ...preset.inHome1,
               descriptor: {
@@ -119,7 +118,6 @@ describe('lifting and the dimension marshal', () => {
                 index: 1,
               },
             };
-            // $ExpectError - using spread
             const postDragInHome2: DraggableDimension = {
               ...preset.inHome2,
               descriptor: {

test/unit/state/auto-scroll/fluid-scroller.spec.js

@@ -288,12 +288,15 @@ describe('fluid auto scrolling', () => {
                 selection,
               );
 
+              if (!base.drag) {
+                throw new Error('Invalid state');
+              }
+
               const updated: State = {
                 ...base,
                 drag: {
                   ...base.drag,
                   initial: {
-                    // $ExpectError
                     ...base.drag.initial,
                     descriptor: tooBig.descriptor,
                   },
@@ -486,12 +489,15 @@ describe('fluid auto scrolling', () => {
                 selection,
               );
 
+              if (!base.drag) {
+                throw new Error('Invalid state');
+              }
+
               const updated: State = {
                 ...base,
                 drag: {
                   ...base.drag,
                   initial: {
-                    // $ExpectError
                     ...base.drag.initial,
                     descriptor: tooBig.descriptor,
                   },
@@ -1108,7 +1114,6 @@ describe('fluid auto scrolling', () => {
           });
 
           describe('over foreign list', () => {
-            // $ExpectError - using spread
             const foreign: DroppableDimension = {
               ...scrollable,
               descriptor: preset.foreign.descriptor,

test/unit/view/connected-droppable.spec.js

@@ -38,7 +38,6 @@ describe('Connected Droppable', () => {
       const selector: Selector = makeSelector();
       const ownProps: OwnProps = getOwnProps(preset.home);
       const defaultMapProps: MapProps = selector(state.idle, ownProps);
-      // $ExpectError - using spread
       const newProps: OwnProps = {
         ...ownProps,
         isDropDisabled: true,