Skip to content

Commit 2072a5a

Browse files
authored
Fix sticky drop indicator when exiting list (#3497)
1 parent a8c3401 commit 2072a5a

File tree

1 file changed

+5
-1
lines changed

1 file changed

+5
-1
lines changed

packages/@react-stately/dnd/src/useDroppableCollectionState.ts

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212

1313
import {Collection, DragTypes, DropOperation, DroppableCollectionProps, DropTarget, ItemDropTarget, Node} from '@react-types/shared';
1414
import {MultipleSelectionManager} from '@react-stately/selection';
15-
import {useState} from 'react';
15+
import {useRef, useState} from 'react';
1616

1717
export interface DroppableCollectionStateOptions extends DroppableCollectionProps {
1818
collection: Collection<Node<unknown>>,
@@ -30,6 +30,7 @@ export interface DroppableCollectionState {
3030

3131
export function useDroppableCollectionState(props: DroppableCollectionStateOptions): DroppableCollectionState {
3232
let [target, setTarget] = useState<DropTarget>(null);
33+
let targetRef = useRef<DropTarget>(null);
3334

3435
let getOppositeTarget = (target: ItemDropTarget): ItemDropTarget => {
3536
if (target.dropPosition === 'before') {
@@ -50,6 +51,7 @@ export function useDroppableCollectionState(props: DroppableCollectionStateOptio
5051
return;
5152
}
5253

54+
let target = targetRef.current;
5355
if (target && typeof props.onDropExit === 'function') {
5456
props.onDropExit({
5557
type: 'dropexit',
@@ -69,8 +71,10 @@ export function useDroppableCollectionState(props: DroppableCollectionStateOptio
6971
}
7072

7173
setTarget(newTarget);
74+
targetRef.current = newTarget;
7275
},
7376
isDropTarget(dropTarget) {
77+
let target = targetRef.current;
7478
if (isEqualDropTarget(dropTarget, target)) {
7579
return true;
7680
}

0 commit comments

Comments
 (0)