Max-width does not work as intended with resizable handle "w"

[JanStorm]

Subject of the issue

When using option resizable.handles 'sw', 'w' or 'nw' in combination with max-width, the widget can be dragged on x-axis instead of resizing, after we tried to make it further than the max-width property.

Your environment

• Gridstack Version 1.2.0
• Chrome Browser Version 85.0.4183.59

Steps to reproduce

• Add the following option to you GridStack.init method:

resizable: {
    handles: 'sw'
}

• Then add a max-width property to the widget you want to test
• Now, when trying to resize the widget to the left, making it bigger than the max-width, it will move (with placeholder below) until the grid ends, and then only the draggable floats free outside the grid, movable on the x-axis

JSFiddle

When using this fiddle, just resize to the left.
The Widget with the number 2 is an example without maxwidth, so it work as intended ;)
https://jsfiddle.net/c5z2ywtn/4/

Expected behaviour

It should stop resizing at max width, like when using the default handle on the bottom right corner. And not even move, when trying to make bigger as max-width

Actual behaviour

it will move (with placeholder below) instead of resize (when being larger than the max-width), until the grid ends, and then only the draggable floats freely outside the grid, movable on the x-axis

[JanStorm]

Edited because of course this applies to all handles which goes to the left: 'sw', 'w' or 'nw'

[adumesny]

yep, thanks for the test case.

[adumesny]

Note to test in float.html, just change to this

let grid = GridStack.init({float: true, resizable: { handles: 'sw' }});
...
{x: 3, y: 1, maxW: 2},

[adumesny]

fix in upcoming 3.1.1