updateXarrow on a grid

[pmorim]

Describe the bug & Expected behavior When using updateXarrow from V2 with a react-draggable component on a grid, the arrow points to the previous component position but only while dragging. I had created an issue about this before the release of V2 and it seems that the bug is still present.

To Reproduce Simply put the react-draggable component on a grid like grid={[25, 25]}.

Screenshots As the screenshot shows, the arrow is pointing to the previous position of the component on the right.

[Eliav2]

As I explained in previous answer, it's a limition as both xarrow and draggable updates based on the same dom frame. You can go around it with another rerender.

[pmorim]

If it doesn't do a double render, then what is the use of the V2's useXarrow hook?

[pmorim]

I was trying to force another re-render and it did not work. So I created a simple CodeSandbox to understand what the problem was and I found out that forcing a re-render works on version 1.7.2 but doesn't work on version 2.x.x.

Here is the CodeSandbox: https://codesandbox.io/s/react-xarrows-bug-force-render-owdb7?file=/src/App.jsx

[Eliav2]

thank you. interesting. will look into that soon.

by the way, you did not used the v2 way. this is how to write it in v2. but as you said this workaround does not work on v2.

[Eliav2]

a new very smart prop that in simple words delays the render(using memorization and extra renders) of xarrow will be available on the next release, that would handle cases like this.