diff --git a/packages/system/src/constants.ts b/packages/system/src/constants.ts index 44fda8b7..74938c66 100644 --- a/packages/system/src/constants.ts +++ b/packages/system/src/constants.ts @@ -1,4 +1,4 @@ -import { HandleType } from './types'; +import { CoordinateExtent, HandleType } from './types'; // @todo: update URLs to xyflow export const errorMessages = { @@ -24,3 +24,8 @@ export const errorMessages = { }; export const internalsSymbol = Symbol.for('internals'); + +export const infiniteExtent: CoordinateExtent = [ + [Number.NEGATIVE_INFINITY, Number.NEGATIVE_INFINITY], + [Number.POSITIVE_INFINITY, Number.POSITIVE_INFINITY], +]; diff --git a/packages/system/src/utils/graph.ts b/packages/system/src/utils/graph.ts index 6fd345af..4fe5e118 100644 --- a/packages/system/src/utils/graph.ts +++ b/packages/system/src/utils/graph.ts @@ -9,6 +9,7 @@ import { isNumeric, rectToBox, nodeToRect, + getEventPosition, } from './utils'; import { type Connection, @@ -334,8 +335,7 @@ export function getPointerPosition( event: MouseEvent | TouchEvent, { snapGrid = [0, 0], snapToGrid = false, transform }: GetPointerPositionParams ): XYPosition & { xSnapped: number; ySnapped: number } { - const x = 'touches' in event ? event.touches[0].clientX : event.clientX; - const y = 'touches' in event ? event.touches[0].clientY : event.clientY; + const { x, y } = getEventPosition(event); const pointerPos = { x: (x - transform[0]) / transform[2], diff --git a/packages/system/src/utils/utils.ts b/packages/system/src/utils/utils.ts index f0d639c3..dc7281f0 100644 --- a/packages/system/src/utils/utils.ts +++ b/packages/system/src/utils/utils.ts @@ -128,9 +128,9 @@ export function isInputDOMNode(event: KeyboardEvent): boolean { export const isMouseEvent = (event: MouseEvent | TouchEvent): event is MouseEvent => 'clientX' in event; export const getEventPosition = (event: MouseEvent | TouchEvent, bounds?: DOMRect) => { - const isMouseTriggered = isMouseEvent(event); - const evtX = isMouseTriggered ? event.clientX : event.touches?.[0].clientX; - const evtY = isMouseTriggered ? event.clientY : event.touches?.[0].clientY; + const isMouse = isMouseEvent(event); + const evtX = isMouse ? event.clientX : event.touches?.[0].clientX; + const evtY = isMouse ? event.clientY : event.touches?.[0].clientY; return { x: evtX - (bounds?.left ?? 0), @@ -138,11 +138,6 @@ export const getEventPosition = (event: MouseEvent | TouchEvent, bounds?: DOMRec }; }; -export const infiniteExtent: CoordinateExtent = [ - [Number.NEGATIVE_INFINITY, Number.NEGATIVE_INFINITY], - [Number.POSITIVE_INFINITY, Number.POSITIVE_INFINITY], -]; - // helper function to get arrays of nodes and edges that can be deleted // you can pass in a list of nodes and edges that should be deleted // and the function only returns elements that are deletable and also handles connected nodes and child nodes