lukasbach/react-complex-tree

Unexpected behavior for drag between line

Closed this issue · 5 comments

julianpoy commented

Describe the bug
The drag line doesn't disappear if the user's cursor leaves the dragline area.

To Reproduce
https://rct.lukasbach.com/docs/guides/drag-and-drop#only-reordering-of-items-allowed
Can be reproduced here.

  1. Drag an item
  2. Move your cursor between items to display the drag between line
  3. Move your cursor horizontally outside of the tree and see that the drag between line is still shown, even though dropping won't result in the item actually going there

You can also reproduce this (more significantly) when moving the cursor to the top or bottom of the tree, and then outside.

Expected behavior
The drag between line should only appear if the user's cursor is in a valid position to drop between items.

julianpoy commented

It looks like the same behavior can occur with dragging over items, not just the drag between line.

doulighan commented

+1, I feel removing the drag line is a better indicator to the user that a drop will fail, rather than adjusting the dataTransfer.dropEffect cursor icon. However I don't see an easy way to accomplish this, I think the InteractionManager would need to communicate with the tree.

julianpoy commented

Adding to this, if I drag an element over another element and then decide I don't want to actually drop it there, the element I was dragging over remains selected as the place to drop.

2024-11-11.11-47-17.mp4

This is particularly undesirable.

lukasbach commented

Hi, thanks for the report! I pushed a new release 2.4.6 which hopefully solves the issues you described. Let me know if that worked for you.

julianpoy commented

Hi @lukasbach looks great - I've been testing for several days now and can confirm all of the issues seem to be resolved. Thank you!

  • 🎉1
  • ❤️1