react-grid-layout 0.16.4 → 0.17.1

package/build/utils.js

@@ -1,10 +1,8 @@
 "use strict";
 
-exports.__esModule = true;
-exports.noop = undefined;
-
-var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
-
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 exports.bottom = bottom;
 exports.cloneLayout = cloneLayout;
 exports.cloneLayoutItem = cloneLayoutItem;
@@ -28,47 +26,65 @@ exports.sortLayoutItemsByColRow = sortLayoutItemsByColRow;
 exports.synchronizeLayoutWithChildren = synchronizeLayoutWithChildren;
 exports.validateLayout = validateLayout;
 exports.autoBindHandlers = autoBindHandlers;
+exports.noop = void 0;
 
-var _lodash = require("lodash.isequal");
+var _lodash = _interopRequireDefault(require("lodash.isequal"));
 
-var _lodash2 = _interopRequireDefault(_lodash);
+var _react = _interopRequireDefault(require("react"));
 
-var _react = require("react");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _react2 = _interopRequireDefault(_react);
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-// All callbacks are of the signature (layout, oldItem, newItem, placeholder, e).
 var isProduction = process.env.NODE_ENV === "production";
 var DEBUG = false;
-
 /**
  * Return the bottom coordinate of the layout.
  *
  * @param  {Array} layout Layout array.
  * @return {Number}       Bottom coordinate.
  */
-function bottom(layout) {
+
+function bottom(layout
+/*: Layout*/
+)
+/*: number*/
+{
   var max = 0,
-      bottomY = void 0;
-  for (var _i = 0, len = layout.length; _i < len; _i++) {
-    bottomY = layout[_i].y + layout[_i].h;
+      bottomY;
+
+  for (var i = 0, len = layout.length; i < len; i++) {
+    bottomY = layout[i].y + layout[i].h;
     if (bottomY > max) max = bottomY;
   }
+
   return max;
 }
 
-function cloneLayout(layout) {
+function cloneLayout(layout
+/*: Layout*/
+)
+/*: Layout*/
+{
   var newLayout = Array(layout.length);
-  for (var _i2 = 0, len = layout.length; _i2 < len; _i2++) {
-    newLayout[_i2] = cloneLayoutItem(layout[_i2]);
+
+  for (var i = 0, len = layout.length; i < len; i++) {
+    newLayout[i] = cloneLayoutItem(layout[i]);
   }
+
   return newLayout;
-}
+} // Fast path to cloning, since this is monomorphic
 
-// Fast path to cloning, since this is monomorphic
-function cloneLayoutItem(layoutItem) {
+
+function cloneLayoutItem(layoutItem
+/*: LayoutItem*/
+)
+/*: LayoutItem*/
+{
   return {
     w: layoutItem.w,
     h: layoutItem.h,
@@ -86,31 +102,49 @@ function cloneLayoutItem(layoutItem) {
     isResizable: layoutItem.isResizable
   };
 }
-
 /**
  * Comparing React `children` is a bit difficult. This is a good way to compare them.
  * This will catch differences in keys, order, and length.
  */
-function childrenEqual(a, b) {
-  return (0, _lodash2.default)(_react2.default.Children.map(a, function (c) {
+
+
+function childrenEqual(a
+/*: ReactChildren*/
+, b
+/*: ReactChildren*/
+)
+/*: boolean*/
+{
+  return (0, _lodash.default)(_react.default.Children.map(a, function (c) {
     return c.key;
-  }), _react2.default.Children.map(b, function (c) {
+  }), _react.default.Children.map(b, function (c) {
     return c.key;
   }));
 }
-
 /**
  * Given two layoutitems, check if they collide.
  */
-function collides(l1, l2) {
-  if (l1 === l2) return false; // same element
+
+
+function collides(l1
+/*: LayoutItem*/
+, l2
+/*: LayoutItem*/
+)
+/*: boolean*/
+{
+  if (l1.i === l2.i) return false; // same element
+
   if (l1.x + l1.w <= l2.x) return false; // l1 is left of l2
+
   if (l1.x >= l2.x + l2.w) return false; // l1 is right of l2
+
   if (l1.y + l1.h <= l2.y) return false; // l1 is above l2
+
   if (l1.y >= l2.y + l2.h) return false; // l1 is below l2
+
   return true; // boxes overlap
 }
-
 /**
  * Given a layout, compact it. This involves going down each y coordinate and removing gaps
  * between items.
@@ -120,51 +154,73 @@ function collides(l1, l2) {
  *   vertically.
  * @return {Array}       Compacted Layout.
  */
-function compact(layout, compactType, cols) {
+
+
+function compact(layout
+/*: Layout*/
+, compactType
+/*: CompactType*/
+, cols
+/*: number*/
+)
+/*: Layout*/
+{
   // Statics go in the compareWith array right away so items flow around them.
-  var compareWith = getStatics(layout);
-  // We go through the items by row and column.
-  var sorted = sortLayoutItems(layout, compactType);
-  // Holding for new items.
+  var compareWith = getStatics(layout); // We go through the items by row and column.
+
+  var sorted = sortLayoutItems(layout, compactType); // Holding for new items.
+
   var out = Array(layout.length);
 
-  for (var _i3 = 0, len = sorted.length; _i3 < len; _i3++) {
-    var l = cloneLayoutItem(sorted[_i3]);
+  for (var i = 0, len = sorted.length; i < len; i++) {
+    var l = cloneLayoutItem(sorted[i]); // Don't move static elements
 
-    // Don't move static elements
     if (!l.static) {
-      l = compactItem(compareWith, l, compactType, cols, sorted);
-
-      // Add to comparison array. We only collide with items before this one.
+      l = compactItem(compareWith, l, compactType, cols, sorted); // Add to comparison array. We only collide with items before this one.
       // Statics are already in this array.
+
       compareWith.push(l);
-    }
+    } // Add to output array to make sure they still come out in the right order.
+
 
-    // Add to output array to make sure they still come out in the right order.
-    out[layout.indexOf(sorted[_i3])] = l;
+    out[layout.indexOf(sorted[i])] = l; // Clear moved flag, if it exists.
 
-    // Clear moved flag, if it exists.
     l.moved = false;
   }
 
   return out;
 }
 
-var heightWidth = { x: "w", y: "h" };
+var heightWidth = {
+  x: "w",
+  y: "h"
+};
 /**
  * Before moving item down, it will check if the movement will cause collisions and move those items down before.
  */
-function resolveCompactionCollision(layout, item, moveToCoord, axis) {
+
+function resolveCompactionCollision(layout
+/*: Layout*/
+, item
+/*: LayoutItem*/
+, moveToCoord
+/*: number*/
+, axis
+/*: "x" | "y"*/
+) {
   var sizeProp = heightWidth[axis];
   item[axis] += 1;
-  var itemIndex = layout.indexOf(item);
+  var itemIndex = layout.map(function (layoutItem) {
+    return layoutItem.i;
+  }).indexOf(item.i); // Go through each item we collide with.
+
+  for (var i = itemIndex + 1; i < layout.length; i++) {
+    var otherItem = layout[i]; // Ignore static items
 
-  // Go through each item we collide with.
-  for (var _i4 = itemIndex + 1; _i4 < layout.length; _i4++) {
-    var otherItem = layout[_i4];
+    if (otherItem.static) continue; // Optimization: we can break early if we know we're past this el
+    // We can do this b/c it's a sorted layout
 
-    // Ignore static items
-    if (otherItem.static) continue;
+    if (otherItem.y > item.y + item.h) break;
 
     if (collides(item, otherItem)) {
       resolveCompactionCollision(layout, otherItem, moveToCoord + item[sizeProp], axis);
@@ -173,64 +229,90 @@ function resolveCompactionCollision(layout, item, moveToCoord, axis) {
 
   item[axis] = moveToCoord;
 }
-
 /**
  * Compact an item in the layout.
  */
-function compactItem(compareWith, l, compactType, cols, fullLayout) {
+
+
+function compactItem(compareWith
+/*: Layout*/
+, l
+/*: LayoutItem*/
+, compactType
+/*: CompactType*/
+, cols
+/*: number*/
+, fullLayout
+/*: Layout*/
+)
+/*: LayoutItem*/
+{
   var compactV = compactType === "vertical";
   var compactH = compactType === "horizontal";
+
   if (compactV) {
     // Bottom 'y' possible is the bottom of the layout.
     // This allows you to do nice stuff like specify {y: Infinity}
     // This is here because the layout must be sorted in order to get the correct bottom `y`.
-    l.y = Math.min(bottom(compareWith), l.y);
-    // Move the element up as far as it can go without colliding.
+    l.y = Math.min(bottom(compareWith), l.y); // Move the element up as far as it can go without colliding.
+
     while (l.y > 0 && !getFirstCollision(compareWith, l)) {
       l.y--;
     }
   } else if (compactH) {
-    l.y = Math.min(bottom(compareWith), l.y);
-    // Move the element left as far as it can go without colliding.
+    l.y = Math.min(bottom(compareWith), l.y); // Move the element left as far as it can go without colliding.
+
     while (l.x > 0 && !getFirstCollision(compareWith, l)) {
       l.x--;
     }
-  }
+  } // Move it down, and keep moving it down if it's colliding.
+
+
+  var collides;
 
-  // Move it down, and keep moving it down if it's colliding.
-  var collides = void 0;
   while (collides = getFirstCollision(compareWith, l)) {
     if (compactH) {
       resolveCompactionCollision(fullLayout, l, collides.x + collides.w, "x");
     } else {
       resolveCompactionCollision(fullLayout, l, collides.y + collides.h, "y");
-    }
-    // Since we can't grow without bounds horizontally, if we've overflown, let's move it down and try again.
+    } // Since we can't grow without bounds horizontally, if we've overflown, let's move it down and try again.
+
+
     if (compactH && l.x + l.w > cols) {
       l.x = cols - l.w;
       l.y++;
     }
   }
+
   return l;
 }
-
 /**
  * Given a layout, make sure all elements fit within its bounds.
  *
  * @param  {Array} layout Layout array.
  * @param  {Number} bounds Number of columns.
  */
-function correctBounds(layout, bounds) {
+
+
+function correctBounds(layout
+/*: Layout*/
+, bounds
+/*: { cols: number }*/
+)
+/*: Layout*/
+{
   var collidesWith = getStatics(layout);
-  for (var _i5 = 0, len = layout.length; _i5 < len; _i5++) {
-    var l = layout[_i5];
-    // Overflows right
-    if (l.x + l.w > bounds.cols) l.x = bounds.cols - l.w;
-    // Overflows left
+
+  for (var i = 0, len = layout.length; i < len; i++) {
+    var l = layout[i]; // Overflows right
+
+    if (l.x + l.w > bounds.cols) l.x = bounds.cols - l.w; // Overflows left
+
     if (l.x < 0) {
       l.x = 0;
       l.w = bounds.cols;
     }
+
     if (!l.static) collidesWith.push(l);else {
       // If this is static and collides with other statics, we must move it down.
       // We have to do something nicer than just letting them overlap.
@@ -239,9 +321,9 @@ function correctBounds(layout, bounds) {
       }
     }
   }
+
   return layout;
 }
-
 /**
  * Get a layout item by ID. Used so we can override later on if necessary.
  *
@@ -249,12 +331,19 @@ function correctBounds(layout, bounds) {
  * @param  {String} id     ID
  * @return {LayoutItem}    Item at ID.
  */
-function getLayoutItem(layout, id) {
-  for (var _i6 = 0, len = layout.length; _i6 < len; _i6++) {
-    if (layout[_i6].i === id) return layout[_i6];
+
+
+function getLayoutItem(layout
+/*: Layout*/
+, id
+/*: string*/
+)
+/*: ?LayoutItem*/
+{
+  for (var i = 0, len = layout.length; i < len; i++) {
+    if (layout[i].i === id) return layout[i];
   }
 }
-
 /**
  * Returns the first item this layout collides with.
  * It doesn't appear to matter which order we approach this from, although
@@ -263,29 +352,47 @@ function getLayoutItem(layout, id) {
  * @param  {Object} layoutItem Layout item.
  * @return {Object|undefined}  A colliding layout item, or undefined.
  */
-function getFirstCollision(layout, layoutItem) {
-  for (var _i7 = 0, len = layout.length; _i7 < len; _i7++) {
-    if (collides(layout[_i7], layoutItem)) return layout[_i7];
+
+
+function getFirstCollision(layout
+/*: Layout*/
+, layoutItem
+/*: LayoutItem*/
+)
+/*: ?LayoutItem*/
+{
+  for (var i = 0, len = layout.length; i < len; i++) {
+    if (collides(layout[i], layoutItem)) return layout[i];
   }
 }
 
-function getAllCollisions(layout, layoutItem) {
+function getAllCollisions(layout
+/*: Layout*/
+, layoutItem
+/*: LayoutItem*/
+)
+/*: Array<LayoutItem>*/
+{
   return layout.filter(function (l) {
     return collides(l, layoutItem);
   });
 }
-
 /**
  * Get all static elements.
  * @param  {Array} layout Array of layout objects.
  * @return {Array}        Array of static layout items..
  */
-function getStatics(layout) {
+
+
+function getStatics(layout
+/*: Layout*/
+)
+/*: Array<LayoutItem>*/
+{
   return layout.filter(function (l) {
     return l.static;
   });
 }
-
 /**
  * Move an element. Responsible for doing cascading movements of other elements.
  *
@@ -294,48 +401,61 @@ function getStatics(layout) {
  * @param  {Number}     [x]               X position in grid units.
  * @param  {Number}     [y]               Y position in grid units.
  */
-function moveElement(layout, l, x, y, isUserAction, preventCollision, compactType, cols) {
-  if (l.static) return layout;
-  log("Moving element " + l.i + " to [" + x + "," + y + "] from [" + l.x + "," + l.y + "]");
 
-  // Short-circuit if nothing to do.
-  if (l.y === y && l.x === x) return layout;
 
-  var oldX = l.x;
-  var oldY = l.y;
+function moveElement(layout
+/*: Layout*/
+, l
+/*: LayoutItem*/
+, x
+/*: ?number*/
+, y
+/*: ?number*/
+, isUserAction
+/*: ?boolean*/
+, preventCollision
+/*: ?boolean*/
+, compactType
+/*: CompactType*/
+, cols
+/*: number*/
+)
+/*: Layout*/
+{
+  if (l.static) return layout; // Short-circuit if nothing to do.
 
-  // This is quite a bit faster than extending the object
-  l.x = x;
-  l.y = y;
-  l.moved = true;
+  if (l.y === y && l.x === x) return layout;
+  log("Moving element ".concat(l.i, " to [").concat(String(x), ",").concat(String(y), "] from [").concat(l.x, ",").concat(l.y, "]"));
+  var oldX = l.x;
+  var oldY = l.y; // This is quite a bit faster than extending the object
 
-  // If this collides with anything, move it.
+  if (typeof x === "number") l.x = x;
+  if (typeof y === "number") l.y = y;
+  l.moved = true; // If this collides with anything, move it.
   // When doing this comparison, we have to sort the items we compare with
   // to ensure, in the case of multiple collisions, that we're getting the
   // nearest collision.
+
   var sorted = sortLayoutItems(layout, compactType);
-  var movingUp = compactType === "vertical" ? oldY >= y : compactType === "horizontal" ? oldX >= x : false;
+  var movingUp = compactType === "vertical" && typeof y === "number" ? oldY >= y : compactType === "horizontal" && typeof x === "number" ? oldX >= x : false;
   if (movingUp) sorted = sorted.reverse();
-  var collisions = getAllCollisions(sorted, l);
+  var collisions = getAllCollisions(sorted, l); // There was a collision; abort
 
-  // There was a collision; abort
   if (preventCollision && collisions.length) {
-    log("Collision prevented on " + l.i + ", reverting.");
+    log("Collision prevented on ".concat(l.i, ", reverting."));
     l.x = oldX;
     l.y = oldY;
     l.moved = false;
     return layout;
-  }
+  } // Move each item that collides away from this element.
+
 
-  // Move each item that collides away from this element.
-  for (var _i8 = 0, len = collisions.length; _i8 < len; _i8++) {
-    var collision = collisions[_i8];
-    log("Resolving collision between " + l.i + " at [" + l.x + "," + l.y + "] and " + collision.i + " at [" + collision.x + "," + collision.y + "]");
+  for (var i = 0, len = collisions.length; i < len; i++) {
+    var collision = collisions[i];
+    log("Resolving collision between ".concat(l.i, " at [").concat(l.x, ",").concat(l.y, "] and ").concat(collision.i, " at [").concat(collision.x, ",").concat(collision.y, "]")); // Short circuit so we can't infinite loop
 
-    // Short circuit so we can't infinite loop
-    if (collision.moved) continue;
+    if (collision.moved) continue; // Don't move static items - we have to move *this* element away
 
-    // Don't move static items - we have to move *this* element away
     if (collision.static) {
       layout = moveElementAwayFromCollision(layout, collision, l, isUserAction, compactType, cols);
     } else {
@@ -345,7 +465,6 @@ function moveElement(layout, l, x, y, isUserAction, preventCollision, compactTyp
 
   return layout;
 }
-
 /**
  * This is where the magic needs to happen - given a collision, move an element away from the collision.
  * We attempt to move it up if there's room, otherwise it goes below.
@@ -354,100 +473,128 @@ function moveElement(layout, l, x, y, isUserAction, preventCollision, compactTyp
  * @param  {LayoutItem} collidesWith Layout item we're colliding with.
  * @param  {LayoutItem} itemToMove   Layout item we're moving.
  */
-function moveElementAwayFromCollision(layout, collidesWith, itemToMove, isUserAction, compactType, cols) {
-  var compactH = compactType === "horizontal";
-  var compactV = compactType === "vertical";
-  var preventCollision = false; // we're already colliding
 
+
+function moveElementAwayFromCollision(layout
+/*: Layout*/
+, collidesWith
+/*: LayoutItem*/
+, itemToMove
+/*: LayoutItem*/
+, isUserAction
+/*: ?boolean*/
+, compactType
+/*: CompactType*/
+, cols
+/*: number*/
+)
+/*: Layout*/
+{
+  var compactH = compactType === "horizontal"; // Compact vertically if not set to horizontal
+
+  var compactV = compactType !== "horizontal";
+  var preventCollision = collidesWith.static; // we're already colliding (not for static items)
   // If there is enough space above the collision to put this element, move it there.
   // We only do this on the main collision as this can get funky in cascades and cause
   // unwanted swapping behavior.
+
   if (isUserAction) {
-    // Make a mock item so we don't modify the item here, only modify in moveElement.
-    var fakeItem = {
+    // Reset isUserAction flag because we're not in the main collision anymore.
+    isUserAction = false; // Make a mock item so we don't modify the item here, only modify in moveElement.
+
+    var fakeItem
+    /*: LayoutItem*/
+    = {
       x: compactH ? Math.max(collidesWith.x - itemToMove.w, 0) : itemToMove.x,
-      y: !compactH ? Math.max(collidesWith.y - itemToMove.h, 0) : itemToMove.y,
+      y: compactV ? Math.max(collidesWith.y - itemToMove.h, 0) : itemToMove.y,
       w: itemToMove.w,
       h: itemToMove.h,
       i: "-1"
-    };
-
-    // This makes it feel a bit more precise by waiting to swap for just a bit when moving up.
-
-    var _ref = compactType === "horizontal" ? ["x", "w"] : ["y", "h"],
-        axis = _ref[0],
-        dimension = _ref[1];
-
-    var shouldSkip = false &&
-    // Our collision is below the item to move, and only encroaches by 25% of its dimension; ignore
-    collidesWith[axis] > itemToMove[axis] && collidesWith[axis] - itemToMove[axis] > itemToMove[dimension] / 4;
+    }; // No collision? If so, we can go up there; otherwise, we'll end up moving down as normal
 
-    // No collision? If so, we can go up there; otherwise, we'll end up moving down as normal
-    if (!shouldSkip && !getFirstCollision(layout, fakeItem)) {
-      log("Doing reverse collision on " + itemToMove.i + " up to [" + fakeItem.x + "," + fakeItem.y + "].");
-      return moveElement(layout, itemToMove, fakeItem.x, fakeItem.y, isUserAction, preventCollision, compactType, cols);
+    if (!getFirstCollision(layout, fakeItem)) {
+      log("Doing reverse collision on ".concat(itemToMove.i, " up to [").concat(fakeItem.x, ",").concat(fakeItem.y, "]."));
+      return moveElement(layout, itemToMove, compactH ? fakeItem.x : undefined, compactV ? fakeItem.y : undefined, isUserAction, preventCollision, compactType, cols);
     }
   }
 
-  return moveElement(layout, itemToMove, compactH ? collidesWith.x + collidesWith.w : itemToMove.x, compactV ? collidesWith.y + collidesWith.h : itemToMove.y, isUserAction, preventCollision, compactType, cols);
+  return moveElement(layout, itemToMove, compactH ? itemToMove.x + 1 : undefined, compactV ? itemToMove.y + 1 : undefined, isUserAction, preventCollision, compactType, cols);
 }
-
 /**
  * Helper to convert a number to a percentage string.
  *
  * @param  {Number} num Any number
  * @return {String}     That number as a percentage.
  */
-function perc(num) {
+
+
+function perc(num
+/*: number*/
+)
+/*: string*/
+{
   return num * 100 + "%";
 }
 
-function setTransform(_ref2) {
-  var top = _ref2.top,
-      left = _ref2.left,
-      width = _ref2.width,
-      height = _ref2.height;
-
+function setTransform(_ref)
+/*: Object*/
+{
+  var top = _ref.top,
+      left = _ref.left,
+      width = _ref.width,
+      height = _ref.height;
   // Replace unitless items with px
-  var translate = "translate(" + left + "px," + top + "px)";
+  var translate = "translate(".concat(left, "px,").concat(top, "px)");
   return {
     transform: translate,
     WebkitTransform: translate,
     MozTransform: translate,
     msTransform: translate,
     OTransform: translate,
-    width: width + "px",
-    height: height + "px",
+    width: "".concat(width, "px"),
+    height: "".concat(height, "px"),
     position: "absolute"
   };
 }
 
-function setTopLeft(_ref3) {
-  var top = _ref3.top,
-      left = _ref3.left,
-      width = _ref3.width,
-      height = _ref3.height;
-
+function setTopLeft(_ref2)
+/*: Object*/
+{
+  var top = _ref2.top,
+      left = _ref2.left,
+      width = _ref2.width,
+      height = _ref2.height;
   return {
-    top: top + "px",
-    left: left + "px",
-    width: width + "px",
-    height: height + "px",
+    top: "".concat(top, "px"),
+    left: "".concat(left, "px"),
+    width: "".concat(width, "px"),
+    height: "".concat(height, "px"),
     position: "absolute"
   };
 }
-
 /**
  * Get layout items sorted from top left to right and down.
  *
  * @return {Array} Array of layout objects.
  * @return {Array}        Layout, sorted static items first.
  */
-function sortLayoutItems(layout, compactType) {
+
+
+function sortLayoutItems(layout
+/*: Layout*/
+, compactType
+/*: CompactType*/
+)
+/*: Layout*/
+{
   if (compactType === "horizontal") return sortLayoutItemsByColRow(layout);else return sortLayoutItemsByRowCol(layout);
 }
 
-function sortLayoutItemsByRowCol(layout) {
+function sortLayoutItemsByRowCol(layout
+/*: Layout*/
+)
+/*: Layout*/
+{
   return [].concat(layout).sort(function (a, b) {
     if (a.y > b.y || a.y === b.y && a.x > b.x) {
       return 1;
@@ -455,19 +602,24 @@ function sortLayoutItemsByRowCol(layout) {
       // Without this, we can get different sort results in IE vs. Chrome/FF
       return 0;
     }
+
     return -1;
   });
 }
 
-function sortLayoutItemsByColRow(layout) {
+function sortLayoutItemsByColRow(layout
+/*: Layout*/
+)
+/*: Layout*/
+{
   return [].concat(layout).sort(function (a, b) {
     if (a.x > b.x || a.x === b.x && a.y > b.y) {
       return 1;
     }
+
     return -1;
   });
 }
-
 /**
  * Generate a layout using the initialLayout and children as a template.
  * Missing entries will be added, extraneous ones will be truncated.
@@ -477,14 +629,33 @@ function sortLayoutItemsByColRow(layout) {
  * @param  {?String} compact      Compaction option.
  * @return {Array}                Working layout.
  */
-function synchronizeLayoutWithChildren(initialLayout, children, cols, compactType) {
-  initialLayout = initialLayout || [];
 
-  // Generate one layout item per child.
-  var layout = [];
-  _react2.default.Children.forEach(children, function (child, i) {
+
+function synchronizeLayoutWithChildren(initialLayout
+/*: Layout*/
+, children
+/*: ReactChildren*/
+, cols
+/*: number*/
+, compactType
+/*: CompactType*/
+)
+/*: Layout*/
+{
+  initialLayout = initialLayout || []; // Generate one layout item per child.
+
+  var layout
+  /*: Layout*/
+  = [];
+
+  _react.default.Children.forEach(children, function (child
+  /*: ReactElement<any>*/
+  , i
+  /*: number*/
+  ) {
     // Don't overwrite if it already exists.
     var exists = getLayoutItem(initialLayout, String(child.key));
+
     if (exists) {
       layout[i] = cloneLayoutItem(exists);
     } else {
@@ -492,14 +663,17 @@ function synchronizeLayoutWithChildren(initialLayout, children, cols, compactTyp
         console.warn("`_grid` properties on children have been deprecated as of React 15.2. " + // eslint-disable-line
         "Please use `data-grid` or add your properties directly to the `layout`.");
       }
-      var g = child.props["data-grid"] || child.props._grid;
 
-      // Hey, this item has a data-grid property, use it.
+      var g = child.props["data-grid"] || child.props._grid; // Hey, this item has a data-grid property, use it.
+
       if (g) {
         if (!isProduction) {
           validateLayout([g], "ReactGridLayout.children");
         }
-        layout[i] = cloneLayoutItem(_extends({}, g, { i: child.key }));
+
+        layout[i] = cloneLayoutItem(_objectSpread({}, g, {
+          i: child.key
+        }));
       } else {
         // Nothing provided: ensure this is added to the bottom
         layout[i] = cloneLayoutItem({
@@ -511,15 +685,15 @@ function synchronizeLayoutWithChildren(initialLayout, children, cols, compactTyp
         });
       }
     }
-  });
+  }); // Correct the layout.
 
-  // Correct the layout.
-  layout = correctBounds(layout, { cols: cols });
-  layout = compact(layout, compactType, cols);
 
+  layout = correctBounds(layout, {
+    cols: cols
+  });
+  layout = compact(layout, compactType, cols);
   return layout;
 }
-
 /**
  * Validate a layout. Throws errors.
  *
@@ -527,29 +701,46 @@ function synchronizeLayoutWithChildren(initialLayout, children, cols, compactTyp
  * @param  {String} [contextName] Context name for errors.
  * @throw  {Error}                Validation error.
  */
-function validateLayout(layout) {
-  var contextName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "Layout";
 
+
+function validateLayout(layout
+/*: Layout*/
+)
+/*: void*/
+{
+  var contextName
+  /*: string*/
+  = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "Layout";
   var subProps = ["x", "y", "w", "h"];
   if (!Array.isArray(layout)) throw new Error(contextName + " must be an array!");
-  for (var _i9 = 0, len = layout.length; _i9 < len; _i9++) {
-    var item = layout[_i9];
+
+  for (var i = 0, len = layout.length; i < len; i++) {
+    var item = layout[i];
+
     for (var j = 0; j < subProps.length; j++) {
       if (typeof item[subProps[j]] !== "number") {
-        throw new Error("ReactGridLayout: " + contextName + "[" + _i9 + "]." + subProps[j] + " must be a number!");
+        throw new Error("ReactGridLayout: " + contextName + "[" + i + "]." + subProps[j] + " must be a number!");
       }
     }
+
     if (item.i && typeof item.i !== "string") {
-      throw new Error("ReactGridLayout: " + contextName + "[" + _i9 + "].i must be a string!");
+      throw new Error("ReactGridLayout: " + contextName + "[" + i + "].i must be a string!");
     }
+
     if (item.static !== undefined && typeof item.static !== "boolean") {
-      throw new Error("ReactGridLayout: " + contextName + "[" + _i9 + "].static must be a boolean!");
+      throw new Error("ReactGridLayout: " + contextName + "[" + i + "].static must be a boolean!");
     }
   }
-}
+} // Flow can't really figure this out, so we just use Object
 
-// Flow can't really figure this out, so we just use Object
-function autoBindHandlers(el, fns) {
+
+function autoBindHandlers(el
+/*: Object*/
+, fns
+/*: Array<string>*/
+)
+/*: void*/
+{
   fns.forEach(function (key) {
     return el[key] = el[key].bind(el);
   });
@@ -558,9 +749,11 @@ function autoBindHandlers(el, fns) {
 function log() {
   var _console;
 
-  if (!DEBUG) return;
-  // eslint-disable-next-line no-console
+  if (!DEBUG) return; // eslint-disable-next-line no-console
+
   (_console = console).log.apply(_console, arguments);
 }
 
-var noop = exports.noop = function noop() {};
+var noop = function noop() {};
+
+exports.noop = noop;