-1

I have found the layer remains in dragmove state when a it is dragged out of the viewport and the mouse button is released. Did you experience this kind of issue?

Have a look over here: https://codesandbox.io/s/llxq3yv829?file=/index.js

Drag the red rectangle out of the viewport and it remains sticky to the cursor.

Thank you!

spancioc
  • 23
  • 2

1 Answers1

0

Set a global event for mouseleave

Use useState to set a state at app level. This can be passed down to components relying on the mouse being in the viewport. Then trigger something to "release" the dragged object.

document.addEventListener("mouseleave", (event) => {
  setState({inViewport: false})
}

In the example pass the state to the component.

Joe Lloyd
  • 19,471
  • 7
  • 53
  • 81
  • Good point, Joe! I ve tried to hack somehow in order to "release" the dragged object but here is the real challenge - for instance at the first glance a click on page body seems to work perfectly by mouse doing but programmatically nothing happens. – spancioc May 25 '20 at 10:07