I'd like to limit the movement of the element to a certain bound.
Today, It's possible with the following code
<div style={translateY <= 0 ? {transform: ``translate3d(0, ${translateY}px, 0)``}: {}}...
Where translateY is the property passed from the draggable function.
The code above will prevent the element from moving below its current position.
However, the <draggable/> component keeps an internal registry of the position, so if I'll move it down for a while - nothing will happen to the UI, but when I'll try to move it up - it will remain still until the internal value reaches below zero.

There are two possible solutions I can think of:
- create a configurable threshold and prevent the internal counter from keeping out of bound values
- poll the position data from the UI (don't like it) so that it basically acts the same.
What do you think?
I'd like to limit the movement of the element to a certain bound.
Today, It's possible with the following code
<div style={translateY <= 0 ? {transform: ``translate3d(0, ${translateY}px, 0)``}: {}}...Where translateY is the property passed from the draggable function.
The code above will prevent the element from moving below its current position.
However, the
<draggable/>component keeps an internal registry of the position, so if I'll move it down for a while - nothing will happen to the UI, but when I'll try to move it up - it will remain still until the internal value reaches below zero.There are two possible solutions I can think of:
What do you think?