Merge branch 'next' into refactor/infer-node-types

packages/react/src/container/ReactFlow/Wrapper.tsx

@@ -8,6 +8,8 @@ export function Wrapper({
   children,
   nodes,
   edges,
+  defaultNodes,
+  defaultEdges,
   width,
   height,
   fitView,
@@ -15,6 +17,8 @@ export function Wrapper({
   children: ReactNode;
   nodes?: Node[];
   edges?: Edge[];
+  defaultNodes?: Node[];
+  defaultEdges?: Edge[];
   width?: number;
   height?: number;
   fitView?: boolean;
@@ -31,6 +35,8 @@ export function Wrapper({
     <ReactFlowProvider
       initialNodes={nodes}
       initialEdges={edges}
+      defaultNodes={defaultNodes}
+      defaultEdges={defaultEdges}
       initialWidth={width}
       initialHeight={height}
       fitView={fitView}

packages/react/src/container/ReactFlow/index.tsx

@@ -1,14 +1,6 @@
 import { ForwardedRef, forwardRef, type CSSProperties } from 'react';
 import cc from 'classcat';
-import {
-  ConnectionLineType,
-  PanOnScrollMode,
-  SelectionMode,
-  infiniteExtent,
-  isMacOs,
-  type NodeOrigin,
-  type Viewport,
-} from '@xyflow/system';
+import { ConnectionLineType, PanOnScrollMode, SelectionMode, infiniteExtent, isMacOs } from '@xyflow/system';
 
 import { A11yDescriptions } from '../../components/A11yDescriptions';
 import { Attribution } from '../../components/Attribution';
@@ -17,10 +9,8 @@ import { StoreUpdater } from '../../components/StoreUpdater';
 import { useColorModeClass } from '../../hooks/useColorModeClass';
 import { GraphView } from '../GraphView';
 import { Wrapper } from './Wrapper';
-import type { ReactFlowProps, ReactFlowRefType, Node, Edge } from '../../types';
-
-export const initNodeOrigin: NodeOrigin = [0, 0];
-const initDefaultViewport: Viewport = { x: 0, y: 0, zoom: 1 };
+import type { Edge, Node, ReactFlowProps, ReactFlowRefType } from '../../types';
+import { defaultViewport as initViewport, defaultNodeOrigin } from './init-values';
 
 const wrapperStyle: CSSProperties = {
   width: '100%',
@@ -88,11 +78,11 @@ function ReactFlow<NodeType extends Node = Node, EdgeType extends Edge = Edge>(
     nodesDraggable,
     nodesConnectable,
     nodesFocusable,
-    nodeOrigin = initNodeOrigin,
+    nodeOrigin = defaultNodeOrigin,
     edgesFocusable,
     edgesUpdatable,
     elementsSelectable = true,
-    defaultViewport = initDefaultViewport,
+    defaultViewport = initViewport,
     minZoom = 0.5,
     maxZoom = 2,
     translateExtent = infiniteExtent,
@@ -230,7 +220,7 @@ function ReactFlow<NodeType extends Node = Node, EdgeType extends Edge = Edge>(
           viewport={viewport}
           onViewportChange={onViewportChange}
         />
-        <StoreUpdater
+        <StoreUpdater<NodeType, EdgeType>
           nodes={nodes}
           edges={edges}
           defaultNodes={defaultNodes}

packages/react/src/container/ReactFlow/init-values.ts

@@ -0,0 +1,4 @@
+import { type NodeOrigin, Viewport } from '@xyflow/system';
+
+export const defaultNodeOrigin: NodeOrigin = [0, 0];
+export const defaultViewport: Viewport = { x: 0, y: 0, zoom: 1 };