Drop is canceled even though placeholder is visible

[minop1205]

From PR below https://github.com/minop1205/react-dnd-treeview/pull/99#issue-1110578682

When Tree component is used to manual sort items, the user might drag items outside of the droppable area -- especially when trying to move it to the top or the bottom of the list. If we restrict the drop to only the tree area, we might have some weird behaviors, like rendering the placeholder somewhere, but not accepting a drop when the user releases the mouse button for example.

The default is still only allowing drop inside the tree area, but by setting cancelOnDropOutside as false we allow drops outside of the tree whenever there's a placeholder being rendered.

This is an example of the original issue:

https://user-images.githubusercontent.com/836386/150551213-773a2696-ac69-47b9-abdd-c17523f4936f.mov

[minop1205]

The end option of useDrag hook is called by dropping outside the dropable area or by canceling with the ESC key, so it is necessary to distinguish between these two.

If the drop is outside the dropable area, it should be dropped at the placeholder position, and if the ESC key is pressed, the drop should be canceled.

[mattevans-dev]

Hi @minop1205 , I'm currently having this exact issue. I'm trying to drop an item with a placeholder at the top or bottom (outside of the normal droppable area) but onDrop doesn't get called. Did you manage to find a solution for this or a potential work around?

[uffou]

Having this exact issue. Does anyone has a fix or a workaround?

[minop1205]

We have addressed this issue by not displaying placeholders when dragging over outside the dropable area.