Merge branch xyflow into svelte-flow-fit-view-options

examples/react/src/examples/Overview/index.tsx

@@ -14,6 +14,7 @@ import {
   Controls,
   Background,
   MiniMap,
+  ConnectionMode,
 } from '@xyflow/react';
 
 const onNodeDragStart = (_: ReactMouseEvent, node: Node, nodes: Node[]) => console.log('drag start', node, nodes);
@@ -193,6 +194,7 @@ const OverviewFlow = () => {
     <ReactFlow
       nodes={nodes}
       edges={edges}
+      connectionMode={ConnectionMode.Strict}
       onNodesChange={onNodesChange}
       onEdgesChange={onEdgesChange}
       onNodeClick={onNodeClick}

examples/svelte/src/routes/overview/+page.svelte

@@ -11,7 +11,8 @@
 		type NodeTypes,
 		type EdgeTypes,
 		type Node,
-		type Edge
+		type Edge,
+		ConnectionMode
 	} from '@xyflow/svelte';
 
 	import CustomNode from './CustomNode.svelte';
@@ -167,8 +168,14 @@
 		event.detail.event.preventDefault();
 		console.log('on node contextmenu', event);
 	}}
+	on:edgecontextmenu={({ detail: { event, edge } }) => {
+		event.preventDefault();
+		console.log('on edge contextmenu', edge);
+	}}
 	autoPanOnConnect
 	autoPanOnNodeDrag
+	connectionMode={ConnectionMode.Strict}
+	attributionPosition={'top-center'}
 >
 	<Controls />
 	<Background variant={BackgroundVariant.Dots} />