diff --git a/examples/svelte/src/routes/examples/overview/Flow.svelte b/examples/svelte/src/routes/examples/overview/Flow.svelte index 2e1138f9..a811fb80 100644 --- a/examples/svelte/src/routes/examples/overview/Flow.svelte +++ b/examples/svelte/src/routes/examples/overview/Flow.svelte @@ -172,11 +172,11 @@ snapGrid={[25, 25]} oninit={() => console.log('on init')} onnodeclick={(event) => console.log('on node click', event)} - onnodemouseenter={(event) => console.log('on node enter', event)} - onnodemouseleave={(event) => console.log('on node leave', event)} + onnodepointerenter={(event) => console.log('on node enter', event)} + onnodepointerleave={(event) => console.log('on node leave', event)} onedgeclick={(event) => console.log('edge click', event)} - onedgemouseenter={(event) => console.log('edge enter', event)} - onedgemouseleave={(event) => console.log('edge leave', event)} + onedgepointerenter={(event) => console.log('edge enter', event)} + onedgepointerleave={(event) => console.log('edge leave', event)} onconnectstart={(event) => console.log('on connect start', event)} onconnect={(event) => console.log('on connect', event)} onconnectend={(event) => console.log('on connect end', event)} diff --git a/packages/svelte/src/lib/components/EdgeWrapper/EdgeWrapper.svelte b/packages/svelte/src/lib/components/EdgeWrapper/EdgeWrapper.svelte index 4500496e..0514a9c4 100644 --- a/packages/svelte/src/lib/components/EdgeWrapper/EdgeWrapper.svelte +++ b/packages/svelte/src/lib/components/EdgeWrapper/EdgeWrapper.svelte @@ -14,8 +14,8 @@ store, onedgeclick, onedgecontextmenu, - onedgemouseenter, - onedgemouseleave + onedgepointerenter, + onedgepointerleave }: { store: SvelteFlowStore; edge: EdgeLayouted } & EdgeEvents = $props(); let { @@ -60,7 +60,7 @@ markerEnd ? `url('#${getMarkerId(markerEnd, store.flowId)}')` : undefined ); - function onclick(event: MouseEvent | TouchEvent) { + function onclick(event: MouseEvent) { const edge = store.edgeLookup.get(id); if (edge) { @@ -69,9 +69,9 @@ } } - function onMouseEvent( - event: MouseEvent, - callback: ({ edge, event }: { edge: Edge; event: MouseEvent }) => void + function onMouseEvent( + event: T, + callback: ({ edge, event }: { edge: Edge; event: T }) => void ) { const edge = store.edgeLookup.get(id); @@ -97,14 +97,14 @@ onMouseEvent(e, onedgecontextmenu); } : undefined} - onmouseenter={onedgemouseenter + onpointerenter={onedgepointerenter ? (e) => { - onMouseEvent(e, onedgemouseenter); + onMouseEvent(e, onedgepointerenter); } : undefined} - onmouseleave={onedgemouseleave + onpointerleave={onedgepointerleave ? (e) => { - onMouseEvent(e, onedgemouseleave); + onMouseEvent(e, onedgepointerleave); } : undefined} aria-label={ariaLabel === null diff --git a/packages/svelte/src/lib/components/NodeSelection/NodeSelection.svelte b/packages/svelte/src/lib/components/NodeSelection/NodeSelection.svelte index aa85087e..037a4504 100644 --- a/packages/svelte/src/lib/components/NodeSelection/NodeSelection.svelte +++ b/packages/svelte/src/lib/components/NodeSelection/NodeSelection.svelte @@ -24,12 +24,12 @@ return null; }); - function oncontextmenu(event: MouseEvent | TouchEvent) { + function oncontextmenu(event: MouseEvent) { const selectedNodes = store.nodes.filter((n) => n.selected); onselectioncontextmenu?.({ nodes: selectedNodes, event }); } - function onclick(event: MouseEvent | TouchEvent) { + function onclick(event: MouseEvent) { const selectedNodes = store.nodes.filter((n) => n.selected); onselectionclick?.({ nodes: selectedNodes, event }); } diff --git a/packages/svelte/src/lib/components/NodeWrapper/NodeWrapper.svelte b/packages/svelte/src/lib/components/NodeWrapper/NodeWrapper.svelte index 61563c9d..7392c58b 100644 --- a/packages/svelte/src/lib/components/NodeWrapper/NodeWrapper.svelte +++ b/packages/svelte/src/lib/components/NodeWrapper/NodeWrapper.svelte @@ -19,9 +19,9 @@ onnodedrag, onnodedragstart, onnodedragstop, - onnodemouseenter, - onnodemouseleave, - onnodemousemove, + onnodepointerenter, + onnodepointerleave, + onnodepointermove, onnodecontextmenu }: NodeWrapperProps & NodeEvents = $props(); @@ -200,9 +200,9 @@ style:visibility={initialized ? 'visible' : 'hidden'} style="{style ?? ''};{inlineStyleDimensions.width}{inlineStyleDimensions.height}" onclick={onSelectNodeHandler} - onpointerenter={onnodemouseenter ? (event) => onnodemouseenter({ node, event }) : undefined} - onpointerleave={onnodemouseleave ? (event) => onnodemouseleave({ node, event }) : undefined} - onpointermove={onnodemousemove ? (event) => onnodemousemove({ node, event }) : undefined} + onpointerenter={onnodepointerenter ? (event) => onnodepointerenter({ node, event }) : undefined} + onpointerleave={onnodepointerleave ? (event) => onnodepointerleave({ node, event }) : undefined} + onpointermove={onnodepointermove ? (event) => onnodepointermove({ node, event }) : undefined} oncontextmenu={onnodecontextmenu ? (event) => onnodecontextmenu({ node, event }) : undefined} > @@ -25,8 +25,8 @@ {edge} {onedgeclick} {onedgecontextmenu} - {onedgemouseenter} - {onedgemouseleave} + {onedgepointerenter} + {onedgepointerleave} /> {/each} diff --git a/packages/svelte/src/lib/container/NodeRenderer/NodeRenderer.svelte b/packages/svelte/src/lib/container/NodeRenderer/NodeRenderer.svelte index a4d346ab..9473389c 100644 --- a/packages/svelte/src/lib/container/NodeRenderer/NodeRenderer.svelte +++ b/packages/svelte/src/lib/container/NodeRenderer/NodeRenderer.svelte @@ -11,9 +11,9 @@ nodeClickDistance, onnodeclick, onnodecontextmenu, - onnodemouseenter, - onnodemousemove, - onnodemouseleave, + onnodepointerenter, + onnodepointermove, + onnodepointerleave, onnodedrag, onnodedragstart, onnodedragstop @@ -51,9 +51,9 @@ {resizeObserver} {nodeClickDistance} {onnodeclick} - {onnodemouseenter} - {onnodemousemove} - {onnodemouseleave} + {onnodepointerenter} + {onnodepointermove} + {onnodepointerleave} {onnodedrag} {onnodedragstart} {onnodedragstop} diff --git a/packages/svelte/src/lib/container/Pane/Pane.svelte b/packages/svelte/src/lib/container/Pane/Pane.svelte index 4d18b1a1..0f72f7c7 100644 --- a/packages/svelte/src/lib/container/Pane/Pane.svelte +++ b/packages/svelte/src/lib/container/Pane/Pane.svelte @@ -73,7 +73,7 @@ // Used to prevent click events when the user lets go of the selectionKey during a selection let selectionInProgress = false; - function onClick(event: MouseEvent | TouchEvent) { + function onClick(event: MouseEvent) { // We prevent click events when the user let go of the selectionKey during a selection if (selectionInProgress) { selectionInProgress = false; diff --git a/packages/svelte/src/lib/container/SvelteFlow/SvelteFlow.svelte b/packages/svelte/src/lib/container/SvelteFlow/SvelteFlow.svelte index 9d53b489..562c16a1 100644 --- a/packages/svelte/src/lib/container/SvelteFlow/SvelteFlow.svelte +++ b/packages/svelte/src/lib/container/SvelteFlow/SvelteFlow.svelte @@ -38,15 +38,15 @@ onnodedrag, onnodedragstart, onnodedragstop, - onnodemouseenter, - onnodemousemove, - onnodemouseleave, + onnodepointerenter, + onnodepointermove, + onnodepointerleave, onselectionclick, onselectioncontextmenu, onedgeclick, onedgecontextmenu, - onedgemouseenter, - onedgemouseleave, + onedgepointerenter, + onedgepointerleave, onpaneclick, onpanecontextmenu, panOnScrollMode = PanOnScrollMode.Free, @@ -163,8 +163,8 @@ {store} {onedgeclick} {onedgecontextmenu} - {onedgemouseenter} - {onedgemouseleave} + {onedgepointerenter} + {onedgepointerleave} /> ; onnodedragstart?: NodeTargetEventWithPointer; onnodedragstop?: NodeTargetEventWithPointer; - onnodemouseenter?: NodeEventWithPointer; - onnodemouseleave?: NodeEventWithPointer; - onnodemousemove?: NodeEventWithPointer; + onnodepointerenter?: NodeEventWithPointer; + onnodepointerleave?: NodeEventWithPointer; + onnodepointermove?: NodeEventWithPointer; }; export type NodeSelectionEvents = { - onselectioncontextmenu?: NodesEventWithPointer; - onselectionclick?: NodesEventWithPointer; + onselectioncontextmenu?: NodesEventWithPointer; + onselectionclick?: NodesEventWithPointer; }; export type PaneEvents = { - onpaneclick?: ({ event }: { event: PointerEvent }) => void; + onpaneclick?: ({ event }: { event: MouseEvent }) => void; onpanecontextmenu?: ({ event }: { event: MouseEvent }) => void; }; export type EdgeEvents = { - onedgeclick?: ({ edge, event }: { edge: Edge; event: PointerEvent }) => void; - onedgecontextmenu?: ({ edge, event }: { edge: Edge; event: PointerEvent }) => void; - onedgemouseenter?: ({ edge, event }: { edge: Edge; event: PointerEvent }) => void; - onedgemouseleave?: ({ edge, event }: { edge: Edge; event: PointerEvent }) => void; + onedgeclick?: ({ edge, event }: { edge: Edge; event: MouseEvent }) => void; + onedgecontextmenu?: ({ edge, event }: { edge: Edge; event: MouseEvent }) => void; + onedgepointerenter?: ({ edge, event }: { edge: Edge; event: PointerEvent }) => void; + onedgepointerleave?: ({ edge, event }: { edge: Edge; event: PointerEvent }) => void; };