Compatibility with React 18?

I just updated my app to React 18 and now I get an error on DndContext:

Uncaught Error: Maximum update depth exceeded.

It seems that I only have it on sortable multiple containers when I move items between containers. Sometimes it works and sometimes I get the error.

I don’t have this problem with React 17, is dnd-kit compatible with React 18?

[clauderic]

Assuming you copied the custom collision detection strategy in the Multiple Containers example:

const collisionDetectionStrategy: CollisionDetection = useCallback(
  (args) => {
    if (activeId && activeId in items) {
      return closestCenter({
        ...args,
        droppableContainers: args.droppableContainers.filter(
          (container) => container.id in items
        ),
      });
    }

    // Start by finding any intersecting droppable
-   const pointerIntersections = pointerWithin(args);
+   const intersections = args.pointerCoordinates ? pointerWithin(args) : rectIntersection(args);
-   const intersections =
-     pointerIntersections.length > 0
-       ? // If there are droppables intersecting with the pointer, return those
-         pointerIntersections
-       : rectIntersection(args);
    let overId = getFirstCollision(intersections, 'id');

[darren10201]

Assuming you copied the custom collision detection strategy in the Multiple Containers example:

const collisionDetectionStrategy: CollisionDetection = useCallback(
  (args) => {
    if (activeId && activeId in items) {
      return closestCenter({
        ...args,
        droppableContainers: args.droppableContainers.filter(
          (container) => container.id in items
        ),
      });
    }

    // Start by finding any intersecting droppable
-   const pointerIntersections = pointerWithin(args);
+   const intersections = args.pointerCoordinates ? pointerWithin(args) : rectIntersection(args);
-   const intersections =
-     pointerIntersections.length > 0
-       ? // If there are droppables intersecting with the pointer, return those
-         pointerIntersections
-       : rectIntersection(args);
    let overId = getFirstCollision(intersections, 'id');

its still happening unexpectedly. especially when its between two containers. I have one horizontal list on top and a row of vertical lists. the error occurs sometimes when a draggable is near the horizontal .