Unexpected reordering of grid items when dragging (Regression since v1.4.0)
Describe the bug
In a certain scenario, when moving a grid item, I observe unexpected behavior: items that are outside the area affected by the dragging item suddenly jump into the drag zone.
Your Example Website or App
Steps to Reproduce the Bug or Issue
In the demo, you need to grab block number 1 and start dragging it vertically down onto block number 7. At some point, blocks number 8 and 14 will suddenly appear above both blocks 1 and 7. If you then drag block number 1 back up (without dropping) and drop it in its original position, the order of the blocks will be broken: blocks 8 and 14 will be under block 1.
Expected behavior
The expected behavior is that blocks 8 and 14 should only move after block 7.
react-grid-layout library version
1.5.1
Operating System Version
Windows
Browser
Edge
Additional context
Why do I think this is a bug? Other libraries behave consistently in a similar scenario. For example, I tried https://gridstackjs.com/demo/react.html. Also, if you use react-grid-layout v1.3.4, the behavior is also consistent. Here is the same demo, but with version 1.3.4: https://codesandbox.io/p/devbox/relaxed-gwen-rrvhhf?workspaceId=ws_YLP4mqeH7m8C25HZREJW1n.
The bug first appears in react-grid-layout v1.4.0.
Screenshots or Videos
Below is the repro-video from Grafana:
https://github.com/user-attachments/assets/f3a1fe2c-18e5-47c6-832c-38394ca0d23e
Source: react-grid-layout/react-grid-layout