Strange offset when dragging between trees

[pmkrawczyk]

Hi All,

First, kudos to the authors for this amazing component! :-)

I'm trying to implement two trees, sitting in two independent ControlledTreeEnvironment's. The issue I face is that when dragging item, e.g. 'g1' from the right tree into the folder 'A' in the left tree (see image below), the left tree detects the drag-over event with rather big Y offset.

This offset is not always the same - a small change (a few px) in Y of the dragged object when moving over the root element will cause the drag-over highlight to jump to the next tree item.

Here is an animated gif that illustrates the issue (the dragged object is not visible unfortunately but the cursor is outlined in red)

It looks like some CSS positioning issue but I can't figure out what it could be...
I wasn't sure whether this is a bug or something related to our particular DOM structure, so I thought I'll ask here first :-)

Any help will be greatly appreciated!

[lukasbach]

Is the user intended to be able to drag items from one tree to the other? Then both trees should be mounted within the same tree environment, that's the idea behind the environment. Not sure if this is related to the positioning issue though 😅

[pmkrawczyk]

Yes, that's the goal. And no, the trees are not in the same environment. In the docs i found that this is not required...

[lukasbach]

Well, they need to for your use case and that's also written in the page you linked:

The requirement for multiple trees sharing drag-and-drop capabilities and state is that they are placed within the same tree environment, i.e. either a shared ControlledTreeEnvironment or an UncontrolledTreeEnvironment.

[pmkrawczyk]

This is embarrassing, don't know how i missed this...
Anyway, thank you for the answers (and for RCT :-)!