fix: detect drag state on pointer release
This commit is contained in:
@@ -1,7 +1,7 @@
|
|||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
|
|
||||||
const DRAG_THRESHOLD = 5
|
const DRAG_THRESHOLD = 5
|
||||||
const CLICK_SUPPRESSION_MS = 250
|
const CLICK_SUPPRESSION_MS = 400
|
||||||
|
|
||||||
export interface FlowPosition {
|
export interface FlowPosition {
|
||||||
x: number
|
x: number
|
||||||
@@ -93,14 +93,16 @@ export function useFlowCanvasInteractions(options: UseFlowCanvasInteractionsOpti
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function onPointerUp() {
|
function onPointerUp(e: PointerEvent) {
|
||||||
if (!drag.value) return
|
if (!drag.value) return
|
||||||
|
|
||||||
const currentDrag = drag.value
|
const currentDrag = drag.value
|
||||||
|
const endDistance = Math.hypot(e.clientX - currentDrag.startX, e.clientY - currentDrag.startY)
|
||||||
|
const wasDragged = currentDrag.moved || endDistance >= DRAG_THRESHOLD
|
||||||
const node = options.flowRef.value?.querySelector(`.node[data-id="${currentDrag.id}"]`) as HTMLElement | null
|
const node = options.flowRef.value?.querySelector(`.node[data-id="${currentDrag.id}"]`) as HTMLElement | null
|
||||||
if (node) node.classList.remove('dragging')
|
if (node) node.classList.remove('dragging')
|
||||||
|
|
||||||
if (currentDrag.moved) {
|
if (wasDragged) {
|
||||||
suppressClickUntil.value = performance.now() + CLICK_SUPPRESSION_MS
|
suppressClickUntil.value = performance.now() + CLICK_SUPPRESSION_MS
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user