Nesting of Nodes DOES NOT WORK about dnd-kit

[clauderic]

I don't really understand your use-case well, but from what I understand, these are all issues related to not using the library correctly:

Nodes do not drag smoothly - They flicker when we drag

This is because you added a transition on your nodes for transform:

.node {
  transition: transform 250ms ease;
}

The node 1 goes under node 2 when dragged over. Both have same z-index. Node 2 goes over node 1 correctly

The library does manage z-index for you, it's up to the consumer to manage z-index properly.

The over property is null when node 2 is dropped over node 1. This is critical information to establish parent child relationship for nesting.
isOver from both Draggable and Droppable is not working as expected. They are false even when the node is dragged over.

This is because you are rendering all of the contents of your Background component within a nested <DndContext> provider, so when you are dragging a Node component there are no other droppable areas within the context provider where those nodes are rendered, which explains why over is null.

[pachu4u]

Hi @clauderic ,

It does not work even if I remove the nested dnd-context. Over is still null.

When I drop it, over is null. After dropping node 2 in node 1, if I just click on the handle without moving it. The over gets populated. It should definitely be a bug.

If I remove transition, I still see the flickering.