react-grid-layout 1.5.1 → 1.5.3

package/.babelrc.js

@@ -16,7 +16,7 @@ module.exports = {
   ],
   plugins: [
     "@babel/plugin-transform-flow-comments",
-    "@babel/plugin-proposal-class-properties",
+    "@babel/plugin-transform-class-properties",
     "babel-plugin-preval"
   ]
 };

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # Changelog
 
+## 1.5.3 (Dec 5, 2025)
+
+- Fix collision detection y-coordinate offset. [#2173](https://github.com/react-grid-layout/react-grid-layout/pull/2173)
+- Memoize bottom computation in compact for performance. [#2115](https://github.com/react-grid-layout/react-grid-layout/pull/2115)
+- Make `b` param in `compactItem` optional. [#2165](https://github.com/react-grid-layout/react-grid-layout/pull/2165)
+- Fix example animations and rework example styles.
+- Various devDependency updates and security fixes. [#2179](https://github.com/react-grid-layout/react-grid-layout/pull/2179)
+
+## 1.5.2 (Jun 25, 2025)
+
+- Fix `calcXY` when `isBounded=true` moving items incorrectly. Likely related to #2059. Thanks @wanpan11. [#2102](https://github.com/react-grid-layout/react-grid-layout/pull/2102)
+
+## 1.5.1 (Mar 11, 2025)
+
+- Fix for React 18: wrap state calls in `flushSync`. Thanks @ashharrison90. [#2043](https://github.com/react-grid-layout/react-grid-layout/pull/2043)
+
+## 1.5.0 (Oct 9, 2024)
+
+- Fix `calcXY` moving grid items slightly above and to the left of where they should be. Thanks @MaxMusing. [#2059](https://github.com/react-grid-layout/react-grid-layout/pull/2059)
+- Change `onBreakpointChange`/`onLayoutChange` event order. `onBreakpointChange` now fires first. This should make managing responsive layouts easier, as you can set the current breakpoint in storage, then save the new layout to it.
+
 ## 1.4.4 (Nov 28, 2023)
 
 ### Bugfixes
@@ -427,7 +448,6 @@ Thanks to @daynin and @n1ghtmare for taking an active role in maintaining RGL, a
 ---
 
 - Fix React PropTypes & createClass warnings
-
   - See https://github.com/facebook/react/issues/10583
 
     0.15.0 (Aug 21, 2017)
@@ -443,7 +463,6 @@ Thanks to @daynin and @n1ghtmare for taking an active role in maintaining RGL, a
 ---
 
 - Fixed a dragging bug when the grid container is scrollable. Thanks @chultquist.
-
   - Ref: https://github.com/STRML/react-grid-layout/pull/555
 
     0.14.6 (Apr 19, 2017)
@@ -518,7 +537,6 @@ Thanks to @daynin and @n1ghtmare for taking an active role in maintaining RGL, a
 #### Fixes:
 
 - Fixed sorting of layout items, which could be different in IE if two items have the same x & y coordinate.
-
   - See [#369](https://github.com/STRML/react-grid-layout/issues/369).
 
     0.13.8 (Oct 13, 2016)
@@ -528,7 +546,6 @@ Thanks to @daynin and @n1ghtmare for taking an active role in maintaining RGL, a
 #### Fixes:
 
 - Fixed breakage introduced in `0.13.7` when items are added without a layout or `data-grid` property.
-
   - See [#368](https://github.com/STRML/react-grid-layout/issues/368).
 
     0.13.7 (Oct 3, 2016)
@@ -566,7 +583,6 @@ Thanks to @daynin and @n1ghtmare for taking an active role in maintaining RGL, a
 
 - Fixed potential call to `ReactDOM.findDOMNode(this)` after unmount of `WidthProvider`.
 - Fixed an issue where layout items using `data-grid` could rearrange on mount depending on how they were ordered.
-
   - See [#342](https://github.com/STRML/react-grid-layout/pull/342) for reference.
 
     0.13.3 (Aug 31, 2016)
@@ -589,7 +605,6 @@ Thanks to @daynin and @n1ghtmare for taking an active role in maintaining RGL, a
   - I'm aware this could be a breaking change if you were relying on this bad behavior. If so, please
     use your own `WidthProvider`-style HOC.
 - `babel-plugin-transform-flow-comments` had limited support for defining types like transpiled classes.
-
   - This has been updated to instead copy source to `.js.flow` files, which preserves all type information.
 
     0.13.1 (Aug 16, 2016)
@@ -637,7 +652,6 @@ Thanks to @daynin and @n1ghtmare for taking an active role in maintaining RGL, a
 ---
 
 - Update to React-Draggable v2. Fixes: #241, #239, #24
-
   - v2 contains a number of bugfixes & enhancements for touchscreens, multitouch, and scrolling containers.
 
     0.12.3 (May 3, 2016)
@@ -815,7 +829,6 @@ Other changes:
 - Upgraded to Babel 6.
 - Full typechecking via Flow.
 - Lots of misc bugfixes.
-
   - See beta releases below for more details.
 
     0.10.0-beta1

package/README.md

@@ -62,6 +62,7 @@ RGL is React-only and does not require jQuery.
 
 #### Projects Using React-Grid-Layout
 
+- [Basedash](https://www.basedash.com)
 - [BitMEX](https://www.bitmex.com/)
 - [AWS CloudFront Dashboards](https://aws.amazon.com/blogs/aws/cloudwatch-dashboards-create-use-customized-metrics-views/)
 - [Grafana](https://grafana.com/)

package/build/GridItem.js

@@ -13,10 +13,12 @@ var _utils = require("./utils");
 var _calculateUtils = require("./calculateUtils");
 var _ReactGridLayoutPropTypes = require("./ReactGridLayoutPropTypes");
 var _clsx = _interopRequireDefault(require("clsx"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 /*:: import type { Element as ReactElement, Node as ReactNode } from "react";*/
 /*:: import type {
   ReactDraggableCallbackData,
@@ -201,14 +203,13 @@ class GridItem extends _react.default.Component /*:: <Props, State>*/{
         if (offsetParent) {
           const {
             margin,
-            rowHeight,
-            containerPadding
+            rowHeight
           } = this.props;
           const bottomBoundary = offsetParent.clientHeight - (0, _calculateUtils.calcGridItemWHPx)(h, rowHeight, margin[1]);
-          top = (0, _calculateUtils.clamp)(top - containerPadding[1], 0, bottomBoundary);
+          top = (0, _calculateUtils.clamp)(top, 0, bottomBoundary);
           const colWidth = (0, _calculateUtils.calcGridColWidth)(positionParams);
           const rightBoundary = containerWidth - (0, _calculateUtils.calcGridItemWHPx)(w, colWidth, margin[0]);
-          left = (0, _calculateUtils.clamp)(left - containerPadding[0], 0, rightBoundary);
+          left = (0, _calculateUtils.clamp)(left, 0, rightBoundary);
         }
       }
       const newPosition /*: PartialPosition*/ = {
@@ -345,7 +346,6 @@ class GridItem extends _react.default.Component /*:: <Props, State>*/{
       );
     }
   }
-
   getPositionParams() /*: PositionParams*/{
     let props /*: Props*/ = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props;
     return {
@@ -545,11 +545,7 @@ class GridItem extends _react.default.Component /*:: <Props, State>*/{
         cssTransforms: useCSSTransforms
       }),
       // We can set the width and height on the child, but unfortunately we can't set the position.
-      style: {
-        ...this.props.style,
-        ...child.props.style,
-        ...this.createStyle(pos)
-      }
+      style: _objectSpread(_objectSpread(_objectSpread({}, this.props.style), child.props.style), this.createStyle(pos))
     });
 
     // Resizable support. This is usually on but the user can toggle it off.

package/build/ReactGridLayout.js

@@ -11,12 +11,13 @@ var _utils = require("./utils");
 var _calculateUtils = require("./calculateUtils");
 var _GridItem = _interopRequireDefault(require("./GridItem"));
 var _ReactGridLayoutPropTypes = _interopRequireDefault(require("./ReactGridLayoutPropTypes"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 /*:: import type {
   ChildrenArray as ReactChildrenArray,
   Element as ReactElement
@@ -266,13 +267,12 @@ class ReactGridLayout extends React.Component /*:: <Props, State>*/{
         // Something like quad tree should be used
         // to find collisions faster
         if (preventCollision && !allowOverlap) {
-          const collisions = (0, _utils.getAllCollisions)(layout, {
-            ...l,
+          const collisions = (0, _utils.getAllCollisions)(layout, _objectSpread(_objectSpread({}, l), {}, {
             w,
             h,
             x,
             y
-          }).filter(layoutItem => layoutItem.i !== l.i);
+          })).filter(layoutItem => layoutItem.i !== l.i);
           hasCollisions = collisions.length > 0;
 
           // If we're colliding, we need adjust the placeholder.
@@ -349,6 +349,7 @@ class ReactGridLayout extends React.Component /*:: <Props, State>*/{
     // Called while dragging an element. Part of browser native drag/drop API.
     // Native event target might be the layout itself, or an element within the layout.
     _defineProperty(this, "onDragOver", e => {
+      var _e$nativeEvent$target;
       e.preventDefault(); // Prevent any browser native action
       e.stopPropagation();
 
@@ -357,7 +358,7 @@ class ReactGridLayout extends React.Component /*:: <Props, State>*/{
       // FIXME remove this hack
       if (isFirefox &&
       // $FlowIgnore can't figure this out
-      !e.nativeEvent.target?.classList.contains(layoutClassName)) {
+      !((_e$nativeEvent$target = e.nativeEvent.target) !== null && _e$nativeEvent$target !== void 0 && _e$nativeEvent$target.classList.contains(layoutClassName))) {
         return false;
       }
       const {
@@ -373,17 +374,14 @@ class ReactGridLayout extends React.Component /*:: <Props, State>*/{
       } = this.props;
       // Allow user to customize the dropping item or short-circuit the drop based on the results
       // of the `onDragOver(e: Event)` callback.
-      const onDragOverResult = onDropDragOver?.(e);
+      const onDragOverResult = onDropDragOver === null || onDropDragOver === void 0 ? void 0 : onDropDragOver(e);
       if (onDragOverResult === false) {
         if (this.state.droppingDOMNode) {
           this.removeDroppingPlaceholder();
         }
         return false;
       }
-      const finalDroppingItem = {
-        ...droppingItem,
-        ...onDragOverResult
-      };
+      const finalDroppingItem = _objectSpread(_objectSpread({}, droppingItem), onDragOverResult);
       const {
         layout
       } = this.state;
@@ -414,13 +412,12 @@ class ReactGridLayout extends React.Component /*:: <Props, State>*/{
             key: finalDroppingItem.i
           }),
           droppingPosition,
-          layout: [...layout, {
-            ...finalDroppingItem,
+          layout: [...layout, _objectSpread(_objectSpread({}, finalDroppingItem), {}, {
             x: calculatedPosition.x,
             y: calculatedPosition.y,
             static: false,
             isDraggable: true
-          }]
+          })]
         });
       } else if (this.state.droppingPosition) {
         const {
@@ -585,7 +582,7 @@ class ReactGridLayout extends React.Component /*:: <Props, State>*/{
       x: activeDrag.x,
       y: activeDrag.y,
       i: activeDrag.i,
-      className: `react-grid-placeholder ${this.state.resizing ? "placeholder-resizing" : ""}`,
+      className: "react-grid-placeholder ".concat(this.state.resizing ? "placeholder-resizing" : ""),
       containerWidth: width,
       cols: cols,
       margin: margin,
@@ -684,10 +681,9 @@ class ReactGridLayout extends React.Component /*:: <Props, State>*/{
       innerRef
     } = this.props;
     const mergedClassName = (0, _clsx.default)(layoutClassName, className);
-    const mergedStyle = {
-      height: this.containerHeight(),
-      ...style
-    };
+    const mergedStyle = _objectSpread({
+      height: this.containerHeight()
+    }, style);
     return /*#__PURE__*/React.createElement("div", {
       ref: innerRef,
       className: mergedClassName,

package/build/ReactGridLayoutPropTypes.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.resizeHandleType = exports.resizeHandleAxesType = exports.default = void 0;
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _react = _interopRequireDefault(require("react"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /*:: import type {
   Ref,
   ChildrenArray as ReactChildrenArray,
@@ -198,7 +198,7 @@ var _default = exports.default = {
     // Check children keys for duplicates. Throw if found.
     const keys = {};
     _react.default.Children.forEach(children, function (child) {
-      if (child?.key == null) return;
+      if ((child === null || child === void 0 ? void 0 : child.key) == null) return;
       if (keys[child.key]) {
         throw new Error('Duplicate child key "' + child.key + '" found! This will cause problems in ReactGridLayout.');
       }

package/build/ResponsiveReactGridLayout.js

@@ -10,13 +10,17 @@ var _fastEquals = require("fast-equals");
 var _utils = require("./utils");
 var _responsiveUtils = require("./responsiveUtils");
 var _ReactGridLayout = _interopRequireDefault(require("./ReactGridLayout"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _extends() { _extends = Object.assign ? Object.assign.bind() : 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; }; return _extends.apply(this, arguments); }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } /*:: import { type Layout, type Pick } from "./utils";*/ /*:: import { type ResponsiveLayout, type OnLayoutChangeCallback, type Breakpoints } from "./responsiveUtils";*/
+const _excluded = ["breakpoint", "breakpoints", "cols", "layouts", "margin", "containerPadding", "onBreakpointChange", "onLayoutChange", "onWidthChange"];
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } /*:: import { type Layout, type Pick } from "./utils";*/ /*:: import { type ResponsiveLayout, type OnLayoutChangeCallback, type Breakpoints } from "./responsiveUtils";*/
 // $FlowFixMe[method-unbinding]
 const type = obj => Object.prototype.toString.call(obj);
 
@@ -87,10 +91,9 @@ class ResponsiveReactGridLayout extends React.Component
     _defineProperty(this, "state", this.generateInitialState());
     // wrap layouts so we do not need to pass layouts to child
     _defineProperty(this, "onLayoutChange", (layout /*: Layout*/) => {
-      this.props.onLayoutChange(layout, {
-        ...this.props.layouts,
+      this.props.onLayoutChange(layout, _objectSpread(_objectSpread({}, this.props.layouts), {}, {
         [this.state.breakpoint]: layout
-      });
+      }));
     });
   }
   generateInitialState() /*: State*/{
@@ -151,9 +154,7 @@ class ResponsiveReactGridLayout extends React.Component
     const newBreakpoint = this.props.breakpoint || (0, _responsiveUtils.getBreakpointFromWidth)(this.props.breakpoints, this.props.width);
     const lastBreakpoint = this.state.breakpoint;
     const newCols /*: number*/ = (0, _responsiveUtils.getColsFromBreakpoint)(newBreakpoint, cols);
-    const newLayouts = {
-      ...layouts
-    };
+    const newLayouts = _objectSpread({}, layouts);
 
     // Breakpoint change
     if (lastBreakpoint !== newBreakpoint || prevProps.breakpoints !== breakpoints || prevProps.cols !== cols) {
@@ -186,18 +187,19 @@ class ResponsiveReactGridLayout extends React.Component
   }
   render() /*: React.Element<typeof ReactGridLayout>*/{
     /* eslint-disable no-unused-vars */
-    const {
-      breakpoint,
-      breakpoints,
-      cols,
-      layouts,
-      margin,
-      containerPadding,
-      onBreakpointChange,
-      onLayoutChange,
-      onWidthChange,
-      ...other
-    } = this.props;
+    const _this$props = this.props,
+      {
+        breakpoint,
+        breakpoints,
+        cols,
+        layouts,
+        margin,
+        containerPadding,
+        onBreakpointChange,
+        onLayoutChange,
+        onWidthChange
+      } = _this$props,
+      other = _objectWithoutProperties(_this$props, _excluded);
     /* eslint-enable no-unused-vars */
 
     return /*#__PURE__*/React.createElement(_ReactGridLayout.default, _extends({}, other, {

package/build/components/WidthProvider.js

@@ -8,13 +8,15 @@ var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _resizeObserverPolyfill = _interopRequireDefault(require("resize-observer-polyfill"));
 var _clsx = _interopRequireDefault(require("clsx"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _extends() { _extends = Object.assign ? Object.assign.bind() : 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; }; return _extends.apply(this, arguments); }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+const _excluded = ["measureBeforeMount"];
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 /*:: import type { ReactRef } from "../ReactGridLayoutPropTypes";*/
 /*:: type WPDefaultProps = {|
   measureBeforeMount: boolean
@@ -44,8 +46,8 @@ const layoutClassName = "react-grid-layout";
  * a flow bug of some sort that causes it to stop typechecking.
  */
 function WidthProvideRGL /*:: <Config>*/(ComposedComponent /*: React.AbstractComponent<Config>*/) /*: React.AbstractComponent<ComposedProps<Config>>*/{
-  var _class;
-  return _class = class WidthProvider extends React.Component
+  var _WidthProvider;
+  return _WidthProvider = class WidthProvider extends React.Component
   /*:: <
       ComposedProps<Config>,
       WPState
@@ -85,10 +87,11 @@ function WidthProvideRGL /*:: <Config>*/(ComposedComponent /*: React.AbstractCom
       this.resizeObserver.disconnect();
     }
     render() {
-      const {
-        measureBeforeMount,
-        ...rest
-      } = this.props;
+      const _this$props = this.props,
+        {
+          measureBeforeMount
+        } = _this$props,
+        rest = _objectWithoutProperties(_this$props, _excluded);
       if (measureBeforeMount && !this.mounted) {
         return /*#__PURE__*/React.createElement("div", {
           className: (0, _clsx.default)(this.props.className, layoutClassName),
@@ -102,11 +105,11 @@ function WidthProvideRGL /*:: <Config>*/(ComposedComponent /*: React.AbstractCom
         innerRef: this.elementRef
       }, rest, this.state));
     }
-  }, _defineProperty(_class, "defaultProps", {
+  }, _defineProperty(_WidthProvider, "defaultProps", {
     measureBeforeMount: false
-  }), _defineProperty(_class, "propTypes", {
+  }), _defineProperty(_WidthProvider, "propTypes", {
     // If true, will not render children until mounted. Useful for getting the exact width before
     // rendering, to prevent any unsightly resizing.
     measureBeforeMount: _propTypes.default.bool
-  }), _class;
+  }), _WidthProvider;
 }