-
Hey, love the library! One thing that's come up that I've been having trouble with - I'm try to use a basic Sortable component, but dragging it more than a few pixels in one direction or another causes it to drop from the cursor. A really basic example of this in a sandbox here: https://codesandbox.io/s/recursing-dream-1jfbfw?file=/src/App.js |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment 1 reply
-
This is happening because the default collision detection algorithm for The behaviour you're seeing where the sortable item is returning to its initial position is happening because of this. As soon as the active sortable item is no longer intersecting with a droppable, it returns to its initial position because it isn't colliding with anything, so the For optimal user experience when building sortable interfaces, we recommend using a more permissive collision detection algorithm such as https://codesandbox.io/s/festive-field-xk760z?file=/src/App.js |
Beta Was this translation helpful? Give feedback.
This is happening because the default collision detection algorithm for
<DndContext>
isrectIntersection
. This collision detection algorithm requires both the draggable bounding box and the droppable bounding box to be intersecting to register a collision.The behaviour you're seeing where the sortable item is returning to its initial position is happening because of this. As soon as the active sortable item is no longer intersecting with a droppable, it returns to its initial position because it isn't colliding with anything, so the
over
property isnull
.For optimal user experience when building sortable interfaces, we recommend using a more permissive collision detection algorithm such…