2

As seen in the attached video clip, I can move the items in container A to B without any problem. But if the speed of my drag increase, the list in the over container starts to behave abnormally. I tried the example multi container story but didn't capture this type of behavior.

Once the list items start to jump all over the place, if click on an item, it immediately switch place with another one, as the argument {over} is now not itself even in dragStart.

Sandbox: https://codesandbox.io/s/eloquent-kirch-t9r13j?file=/Dnd.js

Video: https://user-images.githubusercontent.com/83575213/170879626-de413f22-1236-4128-baec-c95363e61b47.mp4

Really appreciate any helps. Cheers

Sydth
  • 31
  • 1
  • 3
  • Please provide enough code so others can better understand or reproduce the problem. – Community May 30 '22 at 11:15
  • You should not write so complex sandbox, it is extremely hard to find anything there. Try to write as simple as possible just to show the issue. – Werthis Feb 13 '23 at 13:25

2 Answers2

1

I had the same issue, it was the problem with arrays not updating after drag end. Dnd navigates by keys and it looks like there are more than 1 element with the same key in one array, that's why it is grabbing 2 elements at ones.

Werthis
  • 557
  • 3
  • 15
0

Apparently it was the issue from the dnd-kit library at version 6.0.6 or lower.

However this issue has been fixed in v6.0.7, you can see the PR here: https://github.com/clauderic/dnd-kit/pull/788