Feature Request: Component follow scroll

[wootencl]

First of all, want to say thanks for the excellent module and all the hard work you've put into it :)

Onto my feature request/enhancement: Would be great if the draggable component would follow along as the page is scrolled. Would be useful in the scenario where you have a parent container that has a height greater than the viewport and you wish to drag the component to an area outside of the current viewport (but still within the bounds of the parent).

Currently the mouse will continue to scroll down (desired effect), but the draggable component will halt at where the viewport border is/was.

Reproduced project

https://codesandbox.io/s/l2knp9y8oq

Quick gif of the current functionality:

(apologies for the poor quality 😞)

[rjtwoh01]

This would be a great enhancement. Has anyone figured out a work around in the mean time?

[JosemarVarela]

Apoiado

[aruggles]

add the style position: absolute; to the container div.

[gambolputty]

You can achieve this by applying the following style to the outer container <Rnd> is in:

{
  position: "fixed",
  top: 0,
  right: 0,
  bottom: 0,
  left: 0,
  pointerEvents: "none"
}

The outer container is now above all other content (maybe set zIndex as well). If we don't set pointerEvents: "none", the content behind the outer container wouldn't be clickable. Not sure if this method is wise in terms of accessibility, though.

At last, pointerEvents needs to be reset on the <Rnd>-element (pointerEvents: "auto"), to make content inside the <Rnd>-element clickable again (if needed).

I modified your codesandbox to give an example: https://codesandbox.io/s/exciting-solomon-nqb32