collision detection

hi, i have this collision detection problem

NOTE: this happens when dragoverlay hover over item

https://github.com/user-attachments/assets/475f912e-c026-4659-bb2f-00e8503f7471

```tsx
{
const { source } = e.operation;

if (!source || source.type === 'column') return;

setColumns((cols) => {
const moved = move(
cols.reduce(
(acc, col) => ({ ...acc, [`column-${col.id}`]: col.items }),
{} as Record<
UniqueIdentifier,
{ id: number; title: string; columnId: number }[]
>,
),
e,
);

return cols.map((col) => ({
...col,
items: moved[`column-${col.id}`] || col.items,
}));
});
}}
>
{columns.map((col, index) => (

{col.items.map((item, itemIdx) => (

))}

))}

{(source) =>
source.type === 'column' ? (

) : (

)
}

```

Start by reproducing the behavior from the provided DragDropProvider, DragOverlay, and onDragOver example, focusing on collision detection when the overlay hovers over an item. The issue does not specify the expected behavior or mention a file or test, so clarify the intended result before defining what a fix should cover.

Written by the indexing model from the issue text.