feat(props): add connectionDragThreshold

packages/svelte/src/lib/components/EdgeReconnectAnchor/EdgeReconnectAnchor.svelte

@@ -5,6 +5,7 @@
   import { getContext } from 'svelte';
   import { EdgeLabel } from '../EdgeLabel';
   import type { EdgeReconnectAnchorProps } from './types';
+  import drag from '$lib/actions/drag';
 
   let {
     type,
@@ -97,7 +98,8 @@
       },
       updateConnection,
       getTransform: () => [store.viewport.x, store.viewport.y, store.viewport.zoom],
-      getFromHandle: () => store.connection.fromHandle
+      getFromHandle: () => store.connection.fromHandle,
+      dragThreshold: store.connectionDragThreshold
     });
   };
 </script>

packages/svelte/src/lib/components/Handle/Handle.svelte

@@ -139,7 +139,8 @@
           store.onconnectend?.(event, connectionState);
         },
         getTransform: () => [store.viewport.x, store.viewport.y, store.viewport.zoom],
-        getFromHandle: () => store.connection.fromHandle
+        getFromHandle: () => store.connection.fromHandle,
+        dragThreshold: store.connectionDragThreshold
       });
     }
   }

packages/svelte/src/lib/container/SvelteFlow/types.ts

@@ -170,6 +170,12 @@ export type SvelteFlowProps<
      * @default 0
      */
     nodeClickDistance?: number;
+    /**
+     * The threshold in pixels that the mouse must move before a connection line starts to drag.
+     * This is useful to prevent accidental connections when clicking on a handle.
+     * @default 1
+     */
+    connectionDragThreshold?: number;
     /** Minimum zoom level
      * @default 0.5
      */

packages/svelte/src/lib/store/initial-store.svelte.ts

@@ -286,6 +286,7 @@ export function getInitialStore<NodeType extends Node = Node, EdgeType extends E
     autoPanOnNodeDrag: boolean = $derived(signals.props.autoPanOnNodeDrag ?? true);
     autoPanOnConnect: boolean = $derived(signals.props.autoPanOnConnect ?? true);
     autoPanOnNodeFocus: boolean = $derived(signals.props.autoPanOnNodeFocus ?? true);
+    connectionDragThreshold: number = $derived(signals.props.connectionDragThreshold ?? 1);
 
     fitViewQueued: boolean = signals.props.fitView ?? false;
     fitViewOptions: FitViewOptions | undefined = signals.props.fitViewOptions;