react-grid-layout 1.3.0 → 1.3.1

package/lib/GridItem.jsx

@@ -16,7 +16,7 @@ import {
   resizeHandleAxesType,
   resizeHandleType
 } from "./ReactGridLayoutPropTypes";
-import classNames from "classnames";
+import clsx from "clsx";
 import type { Element as ReactElement, Node as ReactNode } from "react";
 
 import type {
@@ -634,7 +634,7 @@ export default class GridItem extends React.Component<Props, State> {
     // Create the child element. We clone the existing element but modify its className and style.
     let newChild = React.cloneElement(child, {
       ref: this.elementRef,
-      className: classNames(
+      className: clsx(
         "react-grid-item",
         child.props.className,
         this.props.className,

package/lib/ReactGridLayout.jsx

@@ -2,7 +2,7 @@
 import * as React from "react";
 
 import isEqual from "lodash.isequal";
-import classNames from "classnames";
+import clsx from "clsx";
 import {
   bottom,
   childrenEqual,
@@ -252,7 +252,7 @@ export default class ReactGridLayout extends React.Component<Props, State> {
 
     this.setState({
       oldDragItem: cloneLayoutItem(l),
-      oldLayout: this.state.layout
+      oldLayout: layout
     });
 
     return this.props.onDragStart(layout, l, l, null, e, node);
@@ -274,7 +274,7 @@ export default class ReactGridLayout extends React.Component<Props, State> {
   ) => {
     const { oldDragItem } = this.state;
     let { layout } = this.state;
-    const { cols, allowOverlap } = this.props;
+    const { cols, allowOverlap, preventCollision } = this.props;
     const l = getLayoutItem(layout, i);
     if (!l) return;
 
@@ -296,7 +296,7 @@ export default class ReactGridLayout extends React.Component<Props, State> {
       x,
       y,
       isUserAction,
-      this.props.preventCollision,
+      preventCollision,
       compactType(this.props),
       cols,
       allowOverlap
@@ -659,7 +659,11 @@ export default class ReactGridLayout extends React.Component<Props, State> {
     const { layout } = this.state;
     // This is relative to the DOM element that this event fired for.
     const { layerX, layerY } = e.nativeEvent;
-    const droppingPosition = { left: layerX / transformScale, top: layerY / transformScale, e };
+    const droppingPosition = {
+      left: layerX / transformScale,
+      top: layerY / transformScale,
+      e
+    };
 
     if (!this.state.droppingDOMNode) {
       const positionParams: PositionParams = {
@@ -756,7 +760,7 @@ export default class ReactGridLayout extends React.Component<Props, State> {
   render(): React.Element<"div"> {
     const { className, style, isDroppable, innerRef } = this.props;
 
-    const mergedClassName = classNames(layoutClassName, className);
+    const mergedClassName = clsx(layoutClassName, className);
     const mergedStyle = {
       height: this.containerHeight(),
       ...style

package/lib/components/WidthProvider.jsx

@@ -1,7 +1,7 @@
 // @flow
 import * as React from "react";
 import PropTypes from "prop-types";
-import classNames from "classnames";
+import clsx from "clsx";
 import type { ReactRef } from "../ReactGridLayoutPropTypes";
 
 type WPDefaultProps = {|
@@ -88,7 +88,7 @@ export default function WidthProvideRGL<Config>(
       if (measureBeforeMount && !this.mounted) {
         return (
           <div
-            className={classNames(this.props.className, layoutClassName)}
+            className={clsx(this.props.className, layoutClassName)}
             style={this.props.style}
             // $FlowIgnore ref types
             ref={this.elementRef}

package/lib/utils.js

@@ -469,16 +469,23 @@ export function moveElement(
   // $FlowIgnore acceptable modification of read-only array as it was recently cloned
   if (movingUp) sorted = sorted.reverse();
   const collisions = getAllCollisions(sorted, l);
-
-  // There was a collision; abort
-  if (preventCollision && collisions.length) {
-    if (!allowOverlap) {
-      log(`Collision prevented on ${l.i}, reverting.`);
-      l.x = oldX;
-      l.y = oldY;
-      l.moved = false;
-    }
-    return layout;
+  const hasCollisions = collisions.length > 0;
+
+  // We may have collisions. We can short-circuit if we've turned off collisions or
+  // allowed overlap.
+  if (hasCollisions && allowOverlap) {
+    // Easy, we don't need to resolve collisions. But we *did* change the layout,
+    // so clone it on the way out.
+    return cloneLayout(layout);
+  } else if (hasCollisions && preventCollision) {
+    // If we are preventing collision but not allowing overlap, we need to
+    // revert the position of this element so it goes to where it came from, rather
+    // than the user's desired location.
+    log(`Collision prevented on ${l.i}, reverting.`);
+    l.x = oldX;
+    l.y = oldY;
+    l.moved = false;
+    return layout; // did not change so don't clone
   }
 
   // Move each item that collides away from this element.
@@ -714,13 +721,15 @@ export function synchronizeLayoutWithChildren(
       } else {
         // Nothing provided: ensure this is added to the bottom
         // FIXME clone not really necessary here
-        layout.push(cloneLayoutItem({
-          w: 1,
-          h: 1,
-          x: 0,
-          y: bottom(layout),
-          i: String(child.key)
-        }));
+        layout.push(
+          cloneLayoutItem({
+            w: 1,
+            h: 1,
+            x: 0,
+            y: bottom(layout),
+            i: String(child.key)
+          })
+        );
       }
     }
   });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-grid-layout",
-  "version": "1.3.0",
+  "version": "1.3.1",
   "description": "A draggable and resizable grid layout with responsive breakpoints, for React.",
   "main": "index.js",
   "scripts": {
@@ -35,7 +35,7 @@
   },
   "homepage": "https://github.com/STRML/react-grid-layout",
   "dependencies": {
-    "classnames": "2.3.1",
+    "clsx": "^1.1.1",
     "lodash.isequal": "^4.0.0",
     "prop-types": "^15.0.0",
     "react-draggable": "^4.0.0",

package/dist/react-grid-layout.min.js.LICENSE.txt

@@ -1,5 +0,0 @@
-/*!
-  Copyright (c) 2018 Jed Watson.
-  Licensed under the MIT License (MIT), see
-  http://jedwatson.github.io/classnames
-*/