prevwong / craft.js

🚀 A React Framework for building extensible drag and drop page editors
https://craft.js.org
MIT License
7.64k stars 743 forks source link

Cancel drop #610

Open danielbattat opened 9 months ago

danielbattat commented 9 months ago

Is your feature request related to a problem? Please describe. When a user moves their mouse outside of the canvas, the last "touched" point in the canvas is where the element will drop when the mouse is released, even if the mouse is outside the canvas. There are times when a user changes their mind re dragging. It would be intuitive, IMO, to have the drag cancel when the mouse is outside of the canvas, especially, if the drag is to create a new element, and then the user moves the element "back" into the toolbox. It will still drop into the last touched place on the canvas

Describe the solution you'd like A way to cancel the drag action if over a certain area, or outside the canvas

Additional context Add any other context or screenshots about the feature request here.

danielbattat commented 9 months ago

I worked around this by making the background area around the droppable area also a canvas, but with rule: canMoveIn => false. It works but I think there should be a better way.

jamime commented 8 months ago

I found you can customise the events https://craft.js.org/docs/api/editor#override-default-event-handlers

I tried using setIndicator(null) and clearEvents(), but neither worked. Even when pressing the ESC key, the component is dropped to the last indicator position.

If the indicator is false, the drop is canceled - however, this comes directly from the positioner and not from the editor store.

https://github.com/prevwong/craft.js/blob/05ce87535047e9fa75d30b0627450ad00d0bc16d/packages/core/src/events/DefaultEventHandlers.ts#L364C1-L366C6