Sortable icon indicating copy to clipboard operation
Sortable copied to clipboard

[bug] Item disappears when dragging to top, left corner of document

Open nwhittaker opened this issue 6 months ago • 0 comments

Describe the bug

Given multiple lists in a group where at least one list is empty and initially hidden (via display: hidden), dragging an item to within 5px of the owner document's top, left corner causes the item to disappear from the source list.

To Reproduce Steps to reproduce the behavior:

  1. Go to the preview area in the codesandbox.
  2. Drag item "one" out of the first list and to within 5px of the top, left corner of the preview area.
  3. See item "one" disappears from its list.
  4. The item may be dragged back to the visible list, however dropping it in the corner causes it to disappear permanently.

Expected behavior

Item "one" does not disappear from the list when dragging to the top, left corner and the empty list is hidden.

Information

Versions - Look in your package.json for this information: sortablejs = 1.15.6 @types/sortablejs = 1.15.8

Additional context The real-world scenario is a UI for paginating many items. Each page is its own list within the same group. All background lists are initially hidden while the foreground list is visible. As the user drags an item to a pagination button, the corresponding list becomes visible as the new foreground list. For performance reasons, the items within background lists are not rendered until they enter the foreground. As a result, background lists appear to be empty when they're hidden.

Reproduction codesandbox: https://codesandbox.io/p/sandbox/gracious-hodgkin-kysvzy

nwhittaker avatar Aug 11 '25 18:08 nwhittaker