fix(core): correct pane pointer evt handlers (#1505)
This commit is contained in:
@@ -2,7 +2,7 @@
|
|||||||
import { ref, toRef, watch } from 'vue'
|
import { ref, toRef, watch } from 'vue'
|
||||||
import UserSelection from '../../components/UserSelection/UserSelection.vue'
|
import UserSelection from '../../components/UserSelection/UserSelection.vue'
|
||||||
import NodesSelection from '../../components/NodesSelection/NodesSelection.vue'
|
import NodesSelection from '../../components/NodesSelection/NodesSelection.vue'
|
||||||
import { type GraphNode, SelectionMode } from '../../types'
|
import { SelectionMode } from '../../types'
|
||||||
import { useKeyPress, useVueFlow } from '../../composables'
|
import { useKeyPress, useVueFlow } from '../../composables'
|
||||||
import { getConnectedEdges, getNodesInside } from '../../utils'
|
import { getConnectedEdges, getNodesInside } from '../../utils'
|
||||||
import { getMousePosition } from './utils'
|
import { getMousePosition } from './utils'
|
||||||
@@ -54,28 +54,11 @@ watch(deleteKeyPressed, (isKeyPressed) => {
|
|||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
const nodesToRemove: GraphNode[] = []
|
removeNodes(getSelectedNodes.value)
|
||||||
for (const node of getNodes.value) {
|
|
||||||
if (!node.selected && node.parentNode && nodesToRemove.some((n) => n.id === node.parentNode)) {
|
|
||||||
nodesToRemove.push(node)
|
|
||||||
} else if (node.selected) {
|
|
||||||
nodesToRemove.push(node)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (nodesToRemove || getSelectedEdges.value) {
|
removeEdges(getSelectedEdges.value)
|
||||||
if (getSelectedEdges.value.length > 0) {
|
|
||||||
removeEdges(getSelectedEdges.value)
|
|
||||||
}
|
|
||||||
|
|
||||||
if (nodesToRemove.length > 0) {
|
nodesSelectionActive.value = false
|
||||||
removeNodes(nodesToRemove)
|
|
||||||
}
|
|
||||||
|
|
||||||
nodesSelectionActive.value = false
|
|
||||||
|
|
||||||
removeSelectedElements()
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
|
|
||||||
watch(multiSelectKeyPressed, (isKeyPressed) => {
|
watch(multiSelectKeyPressed, (isKeyPressed) => {
|
||||||
@@ -125,17 +108,14 @@ function onWheel(event: WheelEvent) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function onPointerDown(event: PointerEvent) {
|
function onPointerDown(event: PointerEvent) {
|
||||||
|
if (!hasActiveSelection.value) {
|
||||||
|
return emits.paneMouseMove(event)
|
||||||
|
}
|
||||||
|
|
||||||
containerBounds.value = vueFlowRef.value?.getBoundingClientRect()
|
containerBounds.value = vueFlowRef.value?.getBoundingClientRect()
|
||||||
container.value?.setPointerCapture(event.pointerId)
|
container.value?.setPointerCapture(event.pointerId)
|
||||||
|
|
||||||
if (
|
if (!elementsSelectable || !isSelecting || event.button !== 0 || event.target !== container.value || !containerBounds.value) {
|
||||||
!hasActiveSelection.value ||
|
|
||||||
!elementsSelectable ||
|
|
||||||
!isSelecting ||
|
|
||||||
event.button !== 0 ||
|
|
||||||
event.target !== container.value ||
|
|
||||||
!containerBounds.value
|
|
||||||
) {
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -198,12 +178,16 @@ function onPointerMove(event: PointerEvent) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function onPointerUp(event: PointerEvent) {
|
function onPointerUp(event: PointerEvent) {
|
||||||
if (!hasActiveSelection.value || event.button !== 0) {
|
if (event.button !== 0) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
container.value?.releasePointerCapture(event.pointerId)
|
container.value?.releasePointerCapture(event.pointerId)
|
||||||
|
|
||||||
|
if (!hasActiveSelection.value) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
// We only want to trigger click functions when in selection mode if
|
// We only want to trigger click functions when in selection mode if
|
||||||
// the user did not move the mouse.
|
// the user did not move the mouse.
|
||||||
if (!userSelectionActive.value && userSelectionRect.value && event.target === container.value) {
|
if (!userSelectionActive.value && userSelectionRect.value && event.target === container.value) {
|
||||||
|
|||||||
Reference in New Issue
Block a user