chore(types): prep for Flow 0.151.2

This version has a new `method-unbinding` rule, and it
can't understand our autobind helper.

Author: STRML

lib/ReactGridLayout.jsx

@@ -4,7 +4,6 @@ import * as React from "react";
 import isEqual from "lodash.isequal";
 import classNames from "classnames";
 import {
-  autoBindHandlers,
   bottom,
   childrenEqual,
   cloneLayoutItem,
@@ -138,18 +137,6 @@ export default class ReactGridLayout extends React.Component<Props, State> {
 
   dragEnterCounter: number = 0;
 
-  constructor(props: Props, context: any): void {
-    super(props, context);
-    autoBindHandlers(this, [
-      "onDragStart",
-      "onDrag",
-      "onDragStop",
-      "onResizeStart",
-      "onResize",
-      "onResizeStop"
-    ]);
-  }
-
   componentDidMount() {
     this.setState({ mounted: true });
     // Possibly call back with layout on mount. This should be done after correcting the layout width
@@ -252,12 +239,12 @@ export default class ReactGridLayout extends React.Component<Props, State> {
    * @param {Event} e The mousedown event
    * @param {Element} node The current dragging DOM element
    */
-  onDragStart(
+  onDragStart: (i: string, x: number, y: number, GridDragEvent) => void = (
     i: string,
     x: number,
     y: number,
     { e, node }: GridDragEvent
-  ): void {
+  ) => {
     const { layout } = this.state;
     const l = getLayoutItem(layout, i);
     if (!l) return;
@@ -268,7 +255,7 @@ export default class ReactGridLayout extends React.Component<Props, State> {
     });
 
     return this.props.onDragStart(layout, l, l, null, e, node);
-  }
+  };
 
   /**
    * Each drag movement create a new dragelement and move the element to the dragged location
@@ -278,7 +265,12 @@ export default class ReactGridLayout extends React.Component<Props, State> {
    * @param {Event} e The mousedown event
    * @param {Element} node The current dragging DOM element
    */
-  onDrag(i: string, x: number, y: number, { e, node }: GridDragEvent): void {
+  onDrag: (i: string, x: number, y: number, GridDragEvent) => void = (
+    i,
+    x,
+    y,
+    { e, node }
+  ) => {
     const { oldDragItem } = this.state;
     let { layout } = this.state;
     const { cols, allowOverlap } = this.props;
@@ -317,7 +309,7 @@ export default class ReactGridLayout extends React.Component<Props, State> {
         : compact(layout, compactType(this.props), cols),
       activeDrag: placeholder
     });
-  }
+  };
 
   /**
    * When dragging stops, figure out which position the element is closest to and update its x and y.
@@ -327,12 +319,12 @@ export default class ReactGridLayout extends React.Component<Props, State> {
    * @param {Event} e The mousedown event
    * @param {Element} node The current dragging DOM element
    */
-  onDragStop(
-    i: string,
-    x: number,
-    y: number,
-    { e, node }: GridDragEvent
-  ): void {
+  onDragStop: (i: string, x: number, y: number, GridDragEvent) => void = (
+    i,
+    x,
+    y,
+    { e, node }
+  ) => {
     if (!this.state.activeDrag) return;
 
     const { oldDragItem } = this.state;
@@ -370,7 +362,7 @@ export default class ReactGridLayout extends React.Component<Props, State> {
     });
 
     this.onLayoutMaybeChanged(newLayout, oldLayout);
-  }
+  };
 
   onLayoutMaybeChanged(newLayout: Layout, oldLayout: ?Layout) {
     if (!oldLayout) oldLayout = this.state.layout;
@@ -380,7 +372,12 @@ export default class ReactGridLayout extends React.Component<Props, State> {
     }
   }
 
-  onResizeStart(i: string, w: number, h: number, { e, node }: GridResizeEvent) {
+  onResizeStart: (i: string, w: number, h: number, GridResizeEvent) => void = (
+    i,
+    w,
+    h,
+    { e, node }
+  ) => {
     const { layout } = this.state;
     const l = getLayoutItem(layout, i);
     if (!l) return;
@@ -391,9 +388,14 @@ export default class ReactGridLayout extends React.Component<Props, State> {
     });
 
     this.props.onResizeStart(layout, l, l, null, e, node);
-  }
+  };
 
-  onResize(i: string, w: number, h: number, { e, node }: GridResizeEvent) {
+  onResize: (i: string, w: number, h: number, GridResizeEvent) => void = (
+    i,
+    w,
+    h,
+    { e, node }
+  ) => {
     const { layout, oldResizeItem } = this.state;
     const { cols, preventCollision, allowOverlap } = this.props;
 
@@ -453,9 +455,14 @@ export default class ReactGridLayout extends React.Component<Props, State> {
         : compact(newLayout, compactType(this.props), cols),
       activeDrag: placeholder
     });
-  }
+  };
 
-  onResizeStop(i: string, w: number, h: number, { e, node }: GridResizeEvent) {
+  onResizeStop: (i: string, w: number, h: number, GridResizeEvent) => void = (
+    i,
+    w,
+    h,
+    { e, node }
+  ) => {
     const { layout, oldResizeItem } = this.state;
     const { cols, allowOverlap } = this.props;
     const l = getLayoutItem(layout, i);
@@ -475,7 +482,7 @@ export default class ReactGridLayout extends React.Component<Props, State> {
     });
 
     this.onLayoutMaybeChanged(newLayout, oldLayout);
-  }
+  };
 
   /**
    * Create a placeholder object.

lib/ResponsiveReactGridLayout.jsx

@@ -21,6 +21,7 @@ import {
 } from "./responsiveUtils";
 import ReactGridLayout from "./ReactGridLayout";
 
+// $FlowFixMe[method-unbinding]
 const type = obj => Object.prototype.toString.call(obj);
 
 /**

lib/utils.js

@@ -328,7 +328,7 @@ export function compactItem(
       l.y++;
     }
   }
-    
+
   // Ensure that there are no negative positions
   l.y = Math.max(l.y, 0);
   l.x = Math.max(l.x, 0);
@@ -472,7 +472,7 @@ export function moveElement(
 
   // There was a collision; abort
   if (preventCollision && collisions.length) {
-    if(!allowOverlap){
+    if (!allowOverlap) {
       log(`Collision prevented on ${l.i}, reverting.`);
       l.x = oldX;
       l.y = oldY;
@@ -724,7 +724,9 @@ export function synchronizeLayoutWithChildren(
 
   // Correct the layout.
   const correctedLayout = correctBounds(layout, { cols: cols });
-  return allowOverlap ? correctedLayout : compact(correctedLayout, compactType, cols);
+  return allowOverlap
+    ? correctedLayout
+    : compact(correctedLayout, compactType, cols);
 }
 
 /**
@@ -781,11 +783,6 @@ export function compactType(
   return verticalCompact === false ? null : compactType;
 }
 
-// Flow can't really figure this out, so we just use Object
-export function autoBindHandlers(el: Object, fns: Array<string>): void {
-  fns.forEach(key => (el[key] = el[key].bind(el)));
-}
-
 function log(...args) {
   if (!DEBUG) return;
   // eslint-disable-next-line no-console

test/examples/3-messy.jsx

@@ -56,9 +56,9 @@ export default class MessyLayout extends React.PureComponent<Props, State> {
     });
   }
 
-  onLayoutChange(layout: Layout) {
+  onLayoutChange: (Layout) => void = (layout: Layout) => {
     this.props.onLayoutChange(layout);
-  }
+  };
 
   render(): React.Node {
     // eslint-disable-next-line no-unused-vars