registry is a flow prop now.

apps/graph-editor/package.json

@@ -8,6 +8,7 @@
   },
   "dependencies": {
     "@behave-graph/core": "*",
+    "@behave-graph/scene": "*",
     "@behave-graph/flow": "*",
     "three": "0.152.2",
     "three-stdlib": "^2.22.4"

apps/graph-editor/src/components/MyFlow.tsx

@@ -0,0 +1,28 @@
+import React from 'react';
+import Branch from '../../../../graphs/core/flow/Branch.json';
+import HelloWorld from '../../../../graphs/core/HelloWorld.json';
+import Polynomial from '../../../../graphs/core/logic/Polynomial.json';
+import Delay from '../../../../graphs/core/time/Delay.json';
+import SetGet from '../../../../graphs/core/variables/SetGet.json';
+import rawGraph from '../graph.json';
+import { GraphJSON } from '@behave-graph/core';
+import { Examples, Flow } from '@behave-graph/flow';
+import { useRegistry } from '../hooks/useRegistry.js';
+
+const graph = rawGraph as unknown as GraphJSON;
+
+// TODO remove when json types fixed in behave-graph
+const examples: Examples = {
+  branch: Branch as unknown as GraphJSON,
+  delay: Delay as unknown as GraphJSON,
+  helloWorld: HelloWorld as unknown as GraphJSON,
+  polynomial: Polynomial as unknown as GraphJSON,
+  setGet: SetGet as unknown as GraphJSON
+} as Record<string, GraphJSON>;
+
+const MyFlow: React.FC = () => {
+  const registry = useRegistry();
+  return <Flow registry={registry} initialGraph={graph} examples={examples} />;
+};
+
+export default MyFlow;

apps/graph-editor/src/index.tsx

@@ -1,35 +1,16 @@
 import 'reactflow/dist/style.css';
 import './styles.css';
 
-import { GraphJSON } from '@behave-graph/core';
-import { Examples, Flow } from '@behave-graph/flow';
 import React from 'react';
 import ReactDOM from 'react-dom/client';
-
-import Branch from '../../../graphs/core/flow/Branch.json';
-import HelloWorld from '../../../graphs/core/HelloWorld.json';
-import Polynomial from '../../../graphs/core/logic/Polynomial.json';
-import Delay from '../../../graphs/core/time/Delay.json';
-import SetGet from '../../../graphs/core/variables/SetGet.json';
-import rawGraph from './graph.json';
-
-const graph = rawGraph as unknown as GraphJSON;
+import MyFlow from './components/MyFlow.js';
 
 const root = ReactDOM.createRoot(
   document.getElementById('root') as HTMLElement
 );
 
-// TODO remove when json types fixed in behave-graph
-const examples: Examples = {
-  branch: Branch as unknown as GraphJSON,
-  delay: Delay as unknown as GraphJSON,
-  helloWorld: HelloWorld as unknown as GraphJSON,
-  polynomial: Polynomial as unknown as GraphJSON,
-  setGet: SetGet as unknown as GraphJSON
-} as Record<string, GraphJSON>;
-
 root.render(
   <React.StrictMode>
-    <Flow initialGraph={graph} examples={examples} />
+    <MyFlow />
   </React.StrictMode>
 );