-
-
Notifications
You must be signed in to change notification settings - Fork 997
Open
Labels
bugSomething isn't workingSomething isn't working
Description
1. Read the FAQs 👇
2. Describe the bug
If the result of dragging and dropping a motion.div
is that its position is moved horizontally, the drag transform sticks around, causing the element to end up much farther horizontally.
3. IMPORTANT: Provide a CodeSandbox reproduction of the bug.
https://codesandbox.io/p/sandbox/6nmt2v
4. Steps to reproduce
In the codesandbox:
- Drag a tile onto a tile in another row.
- If the tile is dragged to another row, they swap, as expected.
- Drag a tile onto another tile in the same row.
- The dropped tile flys off horizontally, ending up in the wrong place
5. Expected behavior
I expect the dropped element to be rendered as intended, with no transform applied.
6. Video or screenshots

Notice that 8 and 14 swapped ok, but 1 is offset to the right by the same distance it was dragged from its origin.
7. Environment details
Happens in Chrome and Safari
Things I've tried, but didn't work for me:
- Instead of setting
top
andleft
, I've triedx
andy
. - Applying
transform
with thetransformTemplate
- Instead of absolute positioning, if I lay the tiles out in a flexbox with flex-wrap, the problem gets worse. The vertical swaps are also offset by the drag distance in addition to the horizontal ones.
Metadata
Metadata
Assignees
Labels
bugSomething isn't workingSomething isn't working