-
-
Notifications
You must be signed in to change notification settings - Fork 86
Description
Describe the bug
I have a reagraph component that users can toggle between two different sizes (normal and enlarged). This works fine except when repositioning nodes with draggable={true}.
Dragging nodes in the original size works as expected.
Flipping to the other size and dragging nodes causes the nodes to suddenly jump vertically by hundreds of pixels. They continue to drag correctly in the x-axis but remain massively offset from the cursor position in the y-axis.
Return to the original size, and everything is working as expected again.
It seems like the reagraph component is caching the height of the canvas internally and not updating its drag logic when that height changes.
I have tried forcing an update of the nodes state with a useEffect when the size of the graph is switched, but that didn't help.
Is there anything I can do to work around this?
Steps to Reproduce the Bug or Issue
- Create a React application with a reagraph component, enclosed in a div that can be resized by controlling a state variable.
- Enable
draggableon the GraphCanvas - Confirm that nodes can be repositioned by dragging in the normal size mode
- Change the size mode and try repositioning nodes again
Expected behavior
I expect that dragging nodes will work correctly after updating the size of the GraphCanvas.
Instead, after updating the size of the GraphCanvas, nodes get flung off to a distant y-value when I drag them.
Screenshots or Videos
No response
Platform
- Reagraph Version: ^4.19.3
- OS: Ubuntu 22.04
- Browser: Firefox
- NodeJS version: 20.16.0
Your Example Website or App
No response
Additional context
I will try to work up a minimal example in Codesandbox and update this issue when it's ready.