@bian-womp/spark-workbench 0.2.93 → 0.2.94

package/lib/cjs/index.cjs

@@ -135,8 +135,8 @@ class AbstractWorkbench {
 }
 
 class InMemoryWorkbench extends AbstractWorkbench {
-    constructor() {
-        super(...arguments);
+    constructor(args) {
+        super(args);
         this._def = { nodes: [], edges: [] };
         this.listeners = new Map();
         this.positions = {};
@@ -150,12 +150,17 @@ class InMemoryWorkbench extends AbstractWorkbench {
         this.viewport = null;
         this.historyState = undefined;
         this.copiedData = null;
+        this._registry = sparkGraph.createSimpleGraphRegistry();
     }
     get def() {
         return this._def;
     }
+    get registry() {
+        return this._registry;
+    }
     setRegistry(registry) {
-        this.registry = registry;
+        this._registry = registry;
+        this.emit("registryChanged", { registry });
     }
     async load(def) {
         this._def = { nodes: [...def.nodes], edges: [...def.edges] };
@@ -3649,7 +3654,7 @@ function computeInvalidatedFromMetadata(metadata) {
     const maxInputTime = Math.max(...Object.values(lastInputAt));
     return maxInputTime > (lastSuccessAt ?? lastRunAt ?? 0);
 }
-function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVersion, children, }) {
+function WorkbenchProvider({ wb, runner, overrides, uiVersion, children, }) {
     const [nodeStatus, setNodeStatus] = React.useState({});
     const [edgeStatus, setEdgeStatus] = React.useState({});
     const [events, setEvents] = React.useState([]);
@@ -3724,7 +3729,7 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
         const out = {};
         // Local: runtimeTypeId is not stored; derive from typed wrapper in outputsMap
         for (const n of wb.def.nodes) {
-            const effectiveHandles = computeEffectiveHandles(n, registry);
+            const effectiveHandles = computeEffectiveHandles(n, wb.registry);
             const outputsDecl = effectiveHandles.outputs;
             const handles = Object.keys(outputsDecl);
             const cur = {};
@@ -3738,7 +3743,7 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
                 out[n.nodeId] = cur;
         }
         return out;
-    }, [wb, wb.def, outputsMap, registry]);
+    }, [wb, wb.def, outputsMap, wb.registry, registryVersion]);
     // Initialize nodes and derive invalidated status from persisted metadata
     React.useEffect(() => {
         const workbenchRuntimeState = wb.getRuntimeState() ?? { nodes: {} };
@@ -3816,7 +3821,7 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
                 const overrideSize = overrides?.getDefaultNodeSize?.(node.typeId) ?? undefined;
                 const size = estimateNodeSize({
                     node,
-                    registry,
+                    registry: wb.registry,
                     showValues: true,
                     overrides: overrideSize,
                 });
@@ -3834,7 +3839,7 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
             curX += maxWidth + H_GAP;
         }
         wb.setPositions(pos, { commit: true, reason: "auto-layout" });
-    }, [wb, wb.def, registry, overrides?.getDefaultNodeSize]);
+    }, [wb, wb.def, wb.registry, registryVersion, overrides?.getDefaultNodeSize]);
     const updateEdgeType = React.useCallback((edgeId, typeId) => wb.updateEdgeType(edgeId, typeId), [wb]);
     const triggerExternal = React.useCallback((nodeId, event) => runner.triggerExternal(nodeId, event), [runner]);
     const getNodeDisplayName = React.useCallback((nodeId) => {
@@ -3844,9 +3849,9 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
         const node = wb.def.nodes.find((n) => n.nodeId === nodeId);
         if (!node)
             return nodeId;
-        const desc = registry.nodes.get(node.typeId);
+        const desc = wb.registry.nodes.get(node.typeId);
         return desc?.displayName || node.typeId;
-    }, [wb, registry]);
+    }, [wb, wb.registry, registryVersion]);
     const setNodeName = React.useCallback((nodeId, name) => {
         wb.setNodeName(nodeId, name, { commit: true, reason: "rename-node" });
     }, [wb]);
@@ -4162,6 +4167,9 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
             }
             return add("runner", "stats")(s);
         });
+        const offWbRegistryChanged = wb.on("registryChanged", (evt) => {
+            setRegistryVersion((v) => v + 1);
+        });
         const offWbGraphChanged = wb.on("graphChanged", (event) => {
             // Clear validation errors for removed nodes
             if (event.change?.type === "removeNode") {
@@ -4318,10 +4326,8 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
         // Registry updates: swap registry and refresh graph validation/UI
         const offRunnerRegistry = runner.on("registry", async (newReg) => {
             try {
-                setRegistry(newReg);
                 wb.setRegistry(newReg);
                 // Increment registry version to trigger UI updates
-                setRegistryVersion((v) => v + 1);
                 // Trigger a graph update so the UI revalidates with new types/enums/nodes
                 try {
                     await runner.update(wb.def);
@@ -4392,6 +4398,7 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
             offRunnerError();
             offRunnerInvalidate();
             offRunnerStats();
+            offWbRegistryChanged();
             offWbGraphChanged();
             offWbGraphUiChangedForLog();
             offWbGraphUiChanged();
@@ -4405,7 +4412,7 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
             offFlowViewport();
             offWbRuntimeMetadataChanged();
         };
-    }, [runner, wb, setRegistry]);
+    }, [runner, wb]);
     const isRunning = React.useCallback(() => runner.isRunning(), [runner]);
     const engineKind = React.useCallback(() => runner.getRunningEngine(), [runner]);
     const start = React.useCallback((engine) => {
@@ -4483,8 +4490,6 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
     const value = React.useMemo(() => ({
         wb,
         runner,
-        registry,
-        setRegistry,
         selectedNodeId,
         selectedEdgeId,
         setSelection,
@@ -4526,8 +4531,6 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
     }), [
         wb,
         runner,
-        registry,
-        setRegistry,
         selectedNodeId,
         selectedEdgeId,
         setSelection,
@@ -4589,7 +4592,7 @@ function DefaultNodeHeader({ id, typeId, validation, right, showId, onInvalidate
         const node = ctx.wb.def.nodes.find((n) => n.nodeId === id);
         if (!node)
             return id;
-        const desc = ctx.registry.nodes.get(node.typeId);
+        const desc = ctx.wb.registry.nodes.get(node.typeId);
         return desc?.displayName || node.typeId;
     }, [ctx, id, typeId]);
     const handleInvalidate = React.useCallback(() => {
@@ -5048,7 +5051,7 @@ function Inspector({ debug, autoScroll, hideWorkbench, onAutoScrollChange, onHid
             return String(value ?? "");
         }
     };
-    const { wb, registry, selectedNodeId, selectedEdgeId, inputsMap, inputDefaultsMap, outputsMap, outputTypesMap, nodeStatus, edgeStatus, validationByNode, validationByEdge, validationGlobal, valuesTick, updateEdgeType, systemErrors, registryErrors, inputValidationErrors, clearSystemErrors, clearRegistryErrors, clearInputValidationErrors, removeSystemError, removeRegistryError, removeInputValidationError, } = useWorkbenchContext();
+    const { wb, registryVersion, selectedNodeId, selectedEdgeId, inputsMap, inputDefaultsMap, outputsMap, outputTypesMap, nodeStatus, edgeStatus, validationByNode, validationByEdge, validationGlobal, valuesTick, updateEdgeType, systemErrors, registryErrors, inputValidationErrors, clearSystemErrors, clearRegistryErrors, clearInputValidationErrors, removeSystemError, removeRegistryError, removeInputValidationError, } = useWorkbenchContext();
     const nodeValidationIssues = validationByNode.issues;
     const edgeValidationIssues = validationByEdge.issues;
     const nodeValidationHandles = validationByNode;
@@ -5057,7 +5060,7 @@ function Inspector({ debug, autoScroll, hideWorkbench, onAutoScrollChange, onHid
     const selectedEdge = wb.def.edges.find((e) => e.id === selectedEdgeId);
     // Use computeEffectiveHandles to merge registry defaults with dynamically resolved handles
     const effectiveHandles = selectedNode
-        ? computeEffectiveHandles(selectedNode, registry)
+        ? computeEffectiveHandles(selectedNode, wb.registry)
         : { inputs: {}, outputs: {}};
     const inputHandles = Object.entries(effectiveHandles.inputs)
         .filter(([k]) => !sparkGraph.isInputPrivate(effectiveHandles.inputs, k))
@@ -5184,7 +5187,7 @@ function Inspector({ debug, autoScroll, hideWorkbench, onAutoScrollChange, onHid
             setDrafts(nextDrafts);
         if (!shallowEqual(originals, nextOriginals))
             setOriginals(nextOriginals);
-    }, [selectedNodeId, selectedNode, registry, valuesTick]);
+    }, [selectedNodeId, selectedNode, wb.registry, registryVersion, valuesTick]);
     const widthClass = debug ? "w-[480px]" : "w-[320px]";
     const deleteEdgeById = (edgeId) => {
         if (!edgeId)
@@ -5204,7 +5207,7 @@ function Inspector({ debug, autoScroll, hideWorkbench, onAutoScrollChange, onHid
                                                         const v = e.target.value;
                                                         const next = v === "" ? undefined : v;
                                                         updateEdgeType(selectedEdge.id, next);
-                                                    }, children: [jsxRuntime.jsx("option", { value: "", children: "(infer from source)" }), Array.from(registry.types.keys()).map((tid) => (jsxRuntime.jsx("option", { value: tid, children: tid }, tid)))] })] })] }), selectedEdgeValidation.length > 0 && (jsxRuntime.jsxs("div", { className: "mt-2 text-xs bg-red-50 border border-red-200 rounded px-2 py-1", children: [jsxRuntime.jsx("div", { className: "font-semibold mb-1", children: "Validation" }), jsxRuntime.jsx("ul", { className: "list-disc ml-4", children: selectedEdgeValidation.map((m, i) => (jsxRuntime.jsxs("li", { className: "flex items-center gap-1", children: [jsxRuntime.jsx(IssueBadge, { level: m.level, size: 24, className: "w-6 h-6" }), jsxRuntime.jsx("span", { children: `${m.code}: ${m.message}` }), jsxRuntime.jsx("button", { className: "ml-2 text-[10px] px-1 py-[2px] border border-red-300 rounded text-red-700 hover:bg-red-50", onClick: (e) => {
+                                                    }, children: [jsxRuntime.jsx("option", { value: "", children: "(infer from source)" }), Array.from(wb.registry.types.keys()).map((tid) => (jsxRuntime.jsx("option", { value: tid, children: tid }, tid)))] })] })] }), selectedEdgeValidation.length > 0 && (jsxRuntime.jsxs("div", { className: "mt-2 text-xs bg-red-50 border border-red-200 rounded px-2 py-1", children: [jsxRuntime.jsx("div", { className: "font-semibold mb-1", children: "Validation" }), jsxRuntime.jsx("ul", { className: "list-disc ml-4", children: selectedEdgeValidation.map((m, i) => (jsxRuntime.jsxs("li", { className: "flex items-center gap-1", children: [jsxRuntime.jsx(IssueBadge, { level: m.level, size: 24, className: "w-6 h-6" }), jsxRuntime.jsx("span", { children: `${m.code}: ${m.message}` }), jsxRuntime.jsx("button", { className: "ml-2 text-[10px] px-1 py-[2px] border border-red-300 rounded text-red-700 hover:bg-red-50", onClick: (e) => {
                                                             e.stopPropagation();
                                                             deleteEdgeById(selectedEdge.id);
                                                         }, title: "Delete this edge", children: "Delete edge" })] }, i))) })] }))] })) : (jsxRuntime.jsxs("div", { children: [selectedNode && (jsxRuntime.jsxs("div", { className: "mb-2", children: [jsxRuntime.jsxs("div", { children: ["Node: ", selectedNode.nodeId] }), jsxRuntime.jsxs("div", { children: ["Type: ", selectedNode.typeId] }), !!selectedNodeStatus?.activeRuns &&
@@ -5274,7 +5277,7 @@ function Inspector({ debug, autoScroll, hideWorkbench, onAutoScrollChange, onHid
                                                                     setOriginals((o) => ({ ...o, [h]: display }));
                                                                 }, ...commonProps, children: [jsxRuntime.jsx("option", { value: "", children: placeholder
                                                                             ? `Default: ${placeholder}`
-                                                                            : "(select)" }), registry.enums
+                                                                            : "(select)" }), wb.registry.enums
                                                                         .get(typeId)
                                                                         ?.options.map((opt) => (jsxRuntime.jsx("option", { value: String(opt.value), children: opt.label }, opt.value)))] }), hasValue && !isLinked && (jsxRuntime.jsx("button", { className: "flex-shrink-0 p-1 hover:bg-gray-100 rounded text-gray-500 hover:text-gray-700", onClick: clearInput, title: "Clear input value", children: jsxRuntime.jsx(react$1.XCircleIcon, { size: 16 }) }))] })) : isLinked ? (jsxRuntime.jsx("div", { className: "flex items-center gap-1 flex-1", children: jsxRuntime.jsx("div", { className: "flex-1 min-w-0", children: renderLinkedInputDisplay(typeId, current) }) })) : (jsxRuntime.jsxs("div", { className: "flex items-center gap-1 flex-1", children: [jsxRuntime.jsx("input", { className: "border border-gray-300 rounded px-2 py-1 focus:outline-none focus:ring-2 focus:ring-blue-500 flex-1 select-text", placeholder: placeholder
                                                                     ? `Default: ${placeholder}`
@@ -5543,7 +5546,7 @@ function useKeyboardShortcutToast() {
 }
 
 const WorkbenchCanvas = React.forwardRef(({ showValues, toString, toElement, getDefaultNodeSize }, ref) => {
-    const { wb, registry, inputsMap, inputDefaultsMap, outputsMap, outputTypesMap, valuesTick, nodeStatus, edgeStatus, validationByNode, validationByEdge, uiVersion, registryVersion, runner, engineKind, overrides, } = useWorkbenchContext();
+    const { wb, inputsMap, inputDefaultsMap, outputsMap, outputTypesMap, valuesTick, nodeStatus, edgeStatus, validationByNode, validationByEdge, uiVersion, registryVersion, runner, engineKind, overrides, } = useWorkbenchContext();
     const nodeValidation = validationByNode;
     const edgeValidation = validationByEdge.errors;
     const [historyState, setHistoryState] = React.useState(wb.getHistory());
@@ -5621,7 +5624,7 @@ const WorkbenchCanvas = React.forwardRef(({ showValues, toString, toElement, get
         // Build nodeTypes map using UI extension registry
         const custom = new Map(); // Include all types present in registry AND current graph to avoid timing issues
         const ids = new Set([
-            ...Array.from(registry.nodes.keys()),
+            ...Array.from(wb.registry.nodes.keys()),
             ...wb.def.nodes.map((n) => n.typeId),
         ]);
         for (const typeId of ids) {
@@ -5640,7 +5643,7 @@ const WorkbenchCanvas = React.forwardRef(({ showValues, toString, toElement, get
         return { nodeTypes: types, resolveNodeType: resolver };
         // Include uiVersion to recompute when custom renderers are registered
         // Include registryVersion to recompute when registry enums/types change
-    }, [wb, registry, uiVersion, ui]);
+    }, [wb, wb.registry, registryVersion, uiVersion, ui]);
     const edgeTypes = React.useMemo(() => {
         // Use default edge renderer override if registered, otherwise use DefaultEdge
         const customEdgeRenderer = ui.getEdgeRenderer();
@@ -5666,7 +5669,7 @@ const WorkbenchCanvas = React.forwardRef(({ showValues, toString, toElement, get
                 inputsWithDefaults[n.nodeId] = merged;
             }
         }
-        const out = toReactFlow(wb.def, wb.getPositions(), wb.getSizes(), registry, {
+        const out = toReactFlow(wb.def, wb.getPositions(), wb.getSizes(), wb.registry, {
             showValues,
             inputs: inputsWithDefaults,
             inputDefaults: inputDefaultsMap,
@@ -5933,7 +5936,7 @@ const WorkbenchCanvas = React.forwardRef(({ showValues, toString, toElement, get
         });
         return () => off();
     }, [wb]);
-    const nodeIds = React.useMemo(() => Array.from(registry.nodes.keys()), [registry, registryVersion]);
+    const nodeIds = React.useMemo(() => Array.from(wb.registry.nodes.keys()), [wb.registry, registryVersion]);
     const defaultContextMenuHandlers = React.useMemo(() => {
         // Get storage from override or use workbench's internal storage
         const storage = overrides?.getCopiedDataStorage
@@ -5981,7 +5984,7 @@ const WorkbenchCanvas = React.forwardRef(({ showValues, toString, toElement, get
                 get: () => wb.getCopiedData(),
                 set: (data) => wb.setCopiedData(data),
             };
-        const baseHandlers = createNodeContextMenuHandlers(nodeAtMenu, wb, runner, registry, outputsMap, outputTypesMap, onCloseNodeMenu, overrides?.getDefaultNodeSize, (data) => {
+        const baseHandlers = createNodeContextMenuHandlers(nodeAtMenu, wb, runner, wb.registry, outputsMap, outputTypesMap, onCloseNodeMenu, overrides?.getDefaultNodeSize, (data) => {
             storage.set(data);
         });
         if (overrides?.getNodeContextMenuHandlers) {
@@ -5992,7 +5995,8 @@ const WorkbenchCanvas = React.forwardRef(({ showValues, toString, toElement, get
         nodeAtMenu,
         wb,
         runner,
-        registry,
+        wb.registry,
+        registryVersion,
         outputsMap,
         outputTypesMap,
         onCloseNodeMenu,
@@ -6004,8 +6008,8 @@ const WorkbenchCanvas = React.forwardRef(({ showValues, toString, toElement, get
     const bakeableOutputs = React.useMemo(() => {
         if (!nodeAtMenu)
             return [];
-        return getBakeableOutputs(nodeAtMenu, wb, registry, outputTypesMap);
-    }, [nodeAtMenu, wb, registry, outputTypesMap]);
+        return getBakeableOutputs(nodeAtMenu, wb, wb.registry, outputTypesMap);
+    }, [nodeAtMenu, wb, wb.registry, registryVersion, outputTypesMap]);
     // Keyboard shortcuts configuration
     const enableKeyboardShortcuts = overrides?.enableKeyboardShortcuts !== false; // Default to true
     const keyboardShortcuts = overrides?.keyboardShortcuts || {
@@ -6201,9 +6205,9 @@ const WorkbenchCanvas = React.forwardRef(({ showValues, toString, toElement, get
                         if (savedViewport) {
                             inst.setViewport(lod.clone(savedViewport));
                         }
-                    }, onConnect: onConnect, onEdgesChange: onEdgesChange, onEdgesDelete: onEdgesDelete, onNodesDelete: onNodesDelete, onNodesChange: onNodesChange, onMoveEnd: onMoveEnd, deleteKeyCode: ["Backspace", "Delete"], proOptions: { hideAttribution: true }, noDragClassName: "wb-nodrag", noWheelClassName: "wb-nowheel", noPanClassName: "wb-nopan", children: [BackgroundRenderer ? (jsxRuntime.jsx(BackgroundRenderer, {})) : (jsxRuntime.jsx(react.Background, { id: "workbench-canvas-background", variant: react.BackgroundVariant.Dots, gap: 12, size: 1 })), MinimapRenderer ? jsxRuntime.jsx(MinimapRenderer, {}) : jsxRuntime.jsx(react.MiniMap, {}), ControlsRenderer ? jsxRuntime.jsx(ControlsRenderer, {}) : jsxRuntime.jsx(react.Controls, {}), DefaultContextMenuRenderer ? (jsxRuntime.jsx(DefaultContextMenuRenderer, { open: menuOpen, clientPos: menuPos, handlers: defaultContextMenuHandlers, registry: registry, nodeIds: nodeIds, ...(enableKeyboardShortcuts !== false
+                    }, onConnect: onConnect, onEdgesChange: onEdgesChange, onEdgesDelete: onEdgesDelete, onNodesDelete: onNodesDelete, onNodesChange: onNodesChange, onMoveEnd: onMoveEnd, deleteKeyCode: ["Backspace", "Delete"], proOptions: { hideAttribution: true }, noDragClassName: "wb-nodrag", noWheelClassName: "wb-nowheel", noPanClassName: "wb-nopan", children: [BackgroundRenderer ? (jsxRuntime.jsx(BackgroundRenderer, {})) : (jsxRuntime.jsx(react.Background, { id: "workbench-canvas-background", variant: react.BackgroundVariant.Dots, gap: 12, size: 1 })), MinimapRenderer ? jsxRuntime.jsx(MinimapRenderer, {}) : jsxRuntime.jsx(react.MiniMap, {}), ControlsRenderer ? jsxRuntime.jsx(ControlsRenderer, {}) : jsxRuntime.jsx(react.Controls, {}), DefaultContextMenuRenderer ? (jsxRuntime.jsx(DefaultContextMenuRenderer, { open: menuOpen, clientPos: menuPos, handlers: defaultContextMenuHandlers, registry: wb.registry, nodeIds: nodeIds, ...(enableKeyboardShortcuts !== false
                                 ? { enableKeyboardShortcuts, keyboardShortcuts }
-                                : {}) })) : (jsxRuntime.jsx(DefaultContextMenu, { open: menuOpen, clientPos: menuPos, handlers: defaultContextMenuHandlers, registry: registry, nodeIds: nodeIds, enableKeyboardShortcuts: enableKeyboardShortcuts, keyboardShortcuts: keyboardShortcuts })), !!nodeAtMenu &&
+                                : {}) })) : (jsxRuntime.jsx(DefaultContextMenu, { open: menuOpen, clientPos: menuPos, handlers: defaultContextMenuHandlers, registry: wb.registry, nodeIds: nodeIds, enableKeyboardShortcuts: enableKeyboardShortcuts, keyboardShortcuts: keyboardShortcuts })), !!nodeAtMenu &&
                             nodeContextMenuHandlers &&
                             (NodeContextMenuRenderer ? (jsxRuntime.jsx(NodeContextMenuRenderer, { open: nodeMenuOpen, clientPos: nodeMenuPos, nodeId: nodeAtMenu, handlers: nodeContextMenuHandlers, canRunPull: canRunPull, bakeableOutputs: bakeableOutputs, ...(enableKeyboardShortcuts !== false
                                     ? { enableKeyboardShortcuts, keyboardShortcuts }
@@ -6212,14 +6216,14 @@ const WorkbenchCanvas = React.forwardRef(({ showValues, toString, toElement, get
                             (SelectionContextMenuRenderer ? (jsxRuntime.jsx(SelectionContextMenuRenderer, { open: selectionMenuOpen, clientPos: selectionMenuPos, handlers: selectionContextMenuHandlers, enableKeyboardShortcuts: enableKeyboardShortcuts, keyboardShortcuts: keyboardShortcuts })) : (jsxRuntime.jsx(SelectionContextMenu, { open: selectionMenuOpen, clientPos: selectionMenuPos, handlers: selectionContextMenuHandlers, enableKeyboardShortcuts: enableKeyboardShortcuts, keyboardShortcuts: keyboardShortcuts })))] }) }), toast && (jsxRuntime.jsx(KeyboardShortcutToast, { message: toast.message, onClose: hideToast }, toast.id))] }));
 });
 
-function WorkbenchStudioCanvas({ setRegistry, autoScroll, onAutoScrollChange, example, onExampleChange, engine, onEngineChange, backendKind, onBackendKindChange, httpBaseUrl, onHttpBaseUrlChange, wsUrl, onWsUrlChange, debug, onDebugChange, showValues, onShowValuesChange, hideWorkbench, onHideWorkbenchChange, overrides, onInit, onChange, }) {
-    const { wb, runner, registry, selectedNodeId, runAutoLayout } = useWorkbenchContext();
+function WorkbenchStudioCanvas({ autoScroll, onAutoScrollChange, example, onExampleChange, engine, onEngineChange, backendKind, onBackendKindChange, httpBaseUrl, onHttpBaseUrlChange, wsUrl, onWsUrlChange, debug, onDebugChange, showValues, onShowValuesChange, hideWorkbench, onHideWorkbenchChange, overrides, onInit, onChange, }) {
+    const { wb, runner, selectedNodeId, runAutoLayout } = useWorkbenchContext();
     const [transportStatus, setTransportStatus] = React.useState({
         state: "local",
     });
     const selectedNode = wb.def.nodes.find((n) => n.nodeId === selectedNodeId);
     const effectiveHandles = selectedNode
-        ? computeEffectiveHandles(selectedNode, registry)
+        ? computeEffectiveHandles(selectedNode, wb.registry)
         : { inputs: {}, outputs: {}, inputDefaults: {} };
     const [exampleState, setExampleState] = React.useState(example ?? "");
     const isGraphRunning = runner.isRunning();
@@ -6366,7 +6370,6 @@ function WorkbenchStudioCanvas({ setRegistry, autoScroll, onAutoScrollChange, ex
         // - For remote backend, registry is automatically managed by RemoteGraphRunner
         if (backendKind === "local") {
             if (r) {
-                setRegistry(r);
                 wb.setRegistry(r);
             }
         }
@@ -6382,15 +6385,7 @@ function WorkbenchStudioCanvas({ setRegistry, autoScroll, onAutoScrollChange, ex
         runAutoLayout();
         setExampleState(key);
         onExampleChange?.(key);
-    }, [
-        runner,
-        wb,
-        onExampleChange,
-        runAutoLayout,
-        examples,
-        setRegistry,
-        backendKind,
-    ]);
+    }, [runner, wb, onExampleChange, runAutoLayout, examples, backendKind]);
     const download$1 = React.useCallback(async () => {
         try {
             await download(wb, runner);
@@ -6561,11 +6556,11 @@ function WorkbenchStudioCanvas({ setRegistry, autoScroll, onAutoScrollChange, ex
             return overrides.setInput(baseSetInput, {
                 runner,
                 selectedNodeId,
-                registry,
+                registry: wb.registry,
             });
         }
         return baseSetInput;
-    }, [overrides, baseSetInput, runner, selectedNodeId, registry]);
+    }, [overrides, baseSetInput, runner, selectedNodeId, wb.registry]);
     const baseToString = React.useCallback((typeId, value) => {
         if (value === undefined || value === null)
             return "";
@@ -6573,7 +6568,7 @@ function WorkbenchStudioCanvas({ setRegistry, autoScroll, onAutoScrollChange, ex
         if (sparkGraph.isTypedOutput(value)) {
             return baseToString(sparkGraph.getTypedOutputTypeId(value), sparkGraph.getTypedOutputValue(value));
         }
-        const pre = preformatValueForDisplay(typeId, value, registry);
+        const pre = preformatValueForDisplay(typeId, value, wb.registry);
         if (pre !== undefined)
             return pre;
         if (typeof value === "object" &&
@@ -6589,7 +6584,7 @@ function WorkbenchStudioCanvas({ setRegistry, autoScroll, onAutoScrollChange, ex
         }
         if (typeId && typeId.startsWith("enum:")) {
             const n = Number(value);
-            const label = registry.enums.get(typeId)?.valueToLabel.get(n);
+            const label = wb.registry.enums.get(typeId)?.valueToLabel.get(n);
             return label ?? String(n);
         }
         const round4 = (n) => Math.round(Number(n) * 10000) / 10000;
@@ -6619,22 +6614,22 @@ function WorkbenchStudioCanvas({ setRegistry, autoScroll, onAutoScrollChange, ex
             return String(rounded);
         }
         return String(value);
-    }, [registry]);
+    }, [wb.registry]);
     const baseToElement = React.useCallback((typeId, value) => {
         return (jsxRuntime.jsx("span", { className: "ml-1 opacity-60", children: baseToString(typeId, value) }));
     }, [baseToString]);
     const toString = React.useMemo(() => {
         if (overrides?.toString)
-            return overrides.toString(baseToString, { registry });
+            return overrides.toString(baseToString, { registry: wb.registry });
         return baseToString;
-    }, [overrides, baseToString, registry]);
+    }, [overrides, baseToString, wb.registry]);
     // Optional: toElement (not currently consumed by core UI)
     // Consumers can access it by passing through their own node renderers.
     const toElement = React.useMemo(() => {
         if (overrides?.toElement)
-            return overrides.toElement(baseToElement, { registry });
+            return overrides.toElement(baseToElement, { registry: wb.registry });
         return baseToElement;
-    }, [overrides, baseToElement, registry]);
+    }, [overrides, baseToElement, wb.registry]);
     return (jsxRuntime.jsxs("div", { className: "w-full h-screen flex flex-col", children: [jsxRuntime.jsxs("div", { className: "p-2 border-b border-gray-300 flex gap-2 items-center", children: [isGraphRunning ? (jsxRuntime.jsxs("span", { className: "ml-2 text-sm text-green-700", children: ["Running: ", engineKind] })) : (jsxRuntime.jsx("span", { className: "ml-2 text-sm text-gray-500", children: "Stopped" })), jsxRuntime.jsxs("span", { className: "ml-2 flex items-center gap-1 text-xs", title: transportStatus.kind || undefined, children: [transportStatus.state === "local" && (jsxRuntime.jsx(react$1.PlugsConnectedIcon, { size: 14, className: "text-gray-500" })), transportStatus.state === "connecting" && (jsxRuntime.jsx(react$1.ClockClockwiseIcon, { size: 14, className: "text-amber-600 animate-pulse" })), transportStatus.state === "connected" && (jsxRuntime.jsx(react$1.WifiHighIcon, { size: 14, className: "text-green-600" })), transportStatus.state === "disconnected" && (jsxRuntime.jsx(react$1.WifiSlashIcon, { size: 14, className: "text-red-600" })), transportStatus.state === "retrying" && (jsxRuntime.jsx(react$1.ClockClockwiseIcon, { size: 14, className: "text-amber-700 animate-pulse" }))] }), jsxRuntime.jsxs("select", { className: "border border-gray-300 rounded px-2 py-1", value: exampleState, onChange: (e) => applyExample(e.target.value), disabled: isGraphRunning, title: isGraphRunning ? "Stop engine before switching example" : undefined, children: [jsxRuntime.jsx("option", { value: "", children: "Select Example\u2026" }), examples.map((ex) => (jsxRuntime.jsx("option", { value: ex.id, children: ex.label }, ex.id)))] }), jsxRuntime.jsxs("select", { className: "border border-gray-300 rounded px-2 py-1", value: backendKind, onChange: (e) => onBackendKindChange(e.target.value), disabled: isGraphRunning, title: isGraphRunning ? "Stop engine before switching backend" : undefined, children: [jsxRuntime.jsx("option", { value: "local", children: "Local" }), jsxRuntime.jsx("option", { value: "remote-http", children: "Remote (HTTP)" }), jsxRuntime.jsx("option", { value: "remote-ws", children: "Remote (WebSocket)" })] }), backendKind === "remote-http" && !!onHttpBaseUrlChange && (jsxRuntime.jsx("input", { className: "border border-gray-300 rounded px-2 py-1 w-72", placeholder: "http://127.0.0.1:18080", value: httpBaseUrl, onChange: (e) => onHttpBaseUrlChange(e.target.value) })), backendKind === "remote-ws" && !!onWsUrlChange && (jsxRuntime.jsx("input", { className: "border border-gray-300 rounded px-2 py-1 w-72", placeholder: "ws://127.0.0.1:18081", value: wsUrl, onChange: (e) => onWsUrlChange(e.target.value) })), jsxRuntime.jsxs("select", { className: "border border-gray-300 rounded px-2 py-1", value: engineKind ?? engine ?? "", onChange: async (e) => {
                             const kind = e.target.value || undefined;
                             const currentEngine = runner.getRunningEngine();
@@ -6736,7 +6731,7 @@ function WorkbenchStudio({ engine, onEngineChange, example, onExampleChange, bac
             runner.dispose();
         onBackendKindChange(v);
     }, [isGraphRunning]);
-    return (jsxRuntime.jsx(WorkbenchProvider, { wb: wb, runner: runner, registry: registry, setRegistry: setRegistry, overrides: overrides, uiVersion: uiVersion, children: jsxRuntime.jsx(WorkbenchStudioCanvas, { setRegistry: setRegistry, autoScroll: autoScroll, onAutoScrollChange: onAutoScrollChange, example: example, onExampleChange: onExampleChange, engine: engine, onEngineChange: onEngineChange, backendKind: backendKind, onBackendKindChange: onBackendKindChangeWithDispose, httpBaseUrl: httpBaseUrl, onHttpBaseUrlChange: onHttpBaseUrlChange, wsUrl: wsUrl, onWsUrlChange: onWsUrlChange, debug: debug, onDebugChange: onDebugChange, showValues: showValues, onShowValuesChange: onShowValuesChange, hideWorkbench: hideWorkbench, onHideWorkbenchChange: onHideWorkbenchChange, overrides: overrides, onInit: onInit, onChange: onChange }) }));
+    return (jsxRuntime.jsx(WorkbenchProvider, { wb: wb, runner: runner, overrides: overrides, uiVersion: uiVersion, children: jsxRuntime.jsx(WorkbenchStudioCanvas, { setRegistry: setRegistry, autoScroll: autoScroll, onAutoScrollChange: onAutoScrollChange, example: example, onExampleChange: onExampleChange, engine: engine, onEngineChange: onEngineChange, backendKind: backendKind, onBackendKindChange: onBackendKindChangeWithDispose, httpBaseUrl: httpBaseUrl, onHttpBaseUrlChange: onHttpBaseUrlChange, wsUrl: wsUrl, onWsUrlChange: onWsUrlChange, debug: debug, onDebugChange: onDebugChange, showValues: showValues, onShowValuesChange: onShowValuesChange, hideWorkbench: hideWorkbench, onHideWorkbenchChange: onHideWorkbenchChange, overrides: overrides, onInit: onInit, onChange: onChange }) }));
 }
 
 exports.AbstractWorkbench = AbstractWorkbench;