Providing both bounds (left, right) creates a weird snapping and then full-stop of resizing.

[growthwp]

trafficstars

Assuming your component looked like this:

<Draggable bounds={{ right: 580, right: 580 }} nodeRef={nodeRef} axis={'x'}>
</Draggable>

What ends up happening is the drag snaps to whatever direction and then becomes unusable. The expected behavior is that of being able to drag on the X axis for 1160px (so, we shouldn't hit the edges of a 1200px container).

[LoganDark]

I believe you would want bounds={{ left: -580, right: 580 }} in that case. Specifying both left and right as 580 allows you to drag the element a total of zero pixels to either side, as they are both on the X axis (left is not reversed).