can I apply react-draggable and react-resizable on a div at the same time?

[jjzjx118]

trafficstars

if I want a div can be draggable and resizable at the same time. Can I do this ? :

<Draggable>
  <ResizableBox width={200} height={200} draggableOpts={{...}}
        minConstraints={[100, 100]} maxConstraints={[300, 300]}>
      <span>Contents</span>
   </ResizableBox>
</Draggable>

[zkwsk]

I was struggling a bit with this as well. The key for me was to add a cancel prop. I have a small prototype you can check out here: https://codesandbox.io/s/react-resizable-react-draggable-zue38

[Ibby-debug]

Still not sure how to persist location of Draggable after re-renders. Check out my question on https://stackoverflow.com/questions/67775912/react-draggable-save-position-of-element-after-re-render

[UserJHansen]

There is a package that handles alot of this automatically called react-rnd you can see here