@bian-womp/spark-workbench 0.3.25 → 0.3.27

package/lib/cjs/index.cjs

@@ -2846,6 +2846,10 @@ function toReactFlow(def, positions, sizes, registry, opts) {
         }));
         const handleLayout = geom.handleLayout;
         const handles = geom.handles;
+        const handleMetadata = {};
+        for (const handleId of Object.keys(inputSource)) {
+            handleMetadata[handleId] = sparkGraph.getInputHandleMetadata(inputSource, handleId);
+        }
         const baseData = {
             typeId: n.typeId,
             params: n.params,
@@ -2864,6 +2868,7 @@ function toReactFlow(def, positions, sizes, registry, opts) {
             inputValues: opts.inputs?.[n.nodeId],
             inputDefaults: opts.inputDefaults?.[n.nodeId],
             outputValues: opts.outputs?.[n.nodeId],
+            handleMetadata,
             status: opts.nodeStatus?.[n.nodeId],
             validation: {
                 inputs: opts.nodeValidation?.inputs?.[n.nodeId] ?? [],
@@ -6118,7 +6123,6 @@ const WorkbenchCanvasComponent = React.forwardRef((props, ref) => {
         wb,
         uiVersion,
     ]);
-    const throttled = useThrottledValue(rfData, 100);
     const [menuState, setMenuState] = React.useState(null);
     // Compute the rectangular screen-space bounds of the current selection
     const getSelectionScreenBounds = () => {
@@ -6521,7 +6525,7 @@ const WorkbenchCanvasComponent = React.forwardRef((props, ref) => {
         return () => off();
     }, [wb]);
     const { onInit: userOnInit, ...restReactFlowProps } = reactFlowProps || {};
-    return (jsxRuntime.jsxs("div", { className: "w-full h-full relative overflow-hidden", onContextMenu: onContextMenu, children: [jsxRuntime.jsxs(react.ReactFlowProvider, { children: [jsxRuntime.jsxs(react.ReactFlow, { ...restReactFlowProps, nodes: throttled.nodes, edges: throttled.edges, nodeTypes: nodeTypes, edgeTypes: edgeTypes, connectionLineComponent: connectionLineRenderer, selectionOnDrag: true, onInit: (inst) => {
+    return (jsxRuntime.jsxs("div", { className: "w-full h-full relative overflow-hidden", onContextMenu: onContextMenu, children: [jsxRuntime.jsxs(react.ReactFlowProvider, { children: [jsxRuntime.jsxs(react.ReactFlow, { ...restReactFlowProps, nodes: rfData.nodes, edges: rfData.edges, nodeTypes: nodeTypes, edgeTypes: edgeTypes, connectionLineComponent: connectionLineRenderer, selectionOnDrag: true, onInit: (inst) => {
                             rfInstanceRef.current = inst;
                             const savedViewport = wb.getViewport();
                             if (savedViewport) {
@@ -6543,7 +6547,7 @@ const WorkbenchCanvasComponent = React.forwardRef((props, ref) => {
 const WorkbenchCanvas = WorkbenchCanvasComponent;
 
 function WorkbenchStudioCanvas({ autoScroll, onAutoScrollChange, example, onExampleChange, backendKind, onBackendKindChange, httpBaseUrl, onHttpBaseUrlChange, wsUrl, onWsUrlChange, debug, onDebugChange, showValues, onShowValuesChange, hideWorkbench, onHideWorkbenchChange, overrides, onInit, onChange, }) {
-    const { wb, runner, selectedNodeId, runAutoLayout, runMode, setRunMode, isRunning, } = useWorkbenchContext();
+    const { wb, registryVersion, runner, selectedNodeId, runAutoLayout, runMode, setRunMode, isRunning, } = useWorkbenchContext();
     const [transportStatus, setTransportStatus] = React.useState({
         state: "local",
     });
@@ -6859,7 +6863,14 @@ function WorkbenchStudioCanvas({ autoScroll, onAutoScrollChange, example, onExam
             });
         }
         return baseSetInput;
-    }, [overrides, baseSetInput, runner, selectedNodeId, wb.registry]);
+    }, [
+        overrides,
+        baseSetInput,
+        runner,
+        selectedNodeId,
+        wb.registry,
+        registryVersion,
+    ]);
     const baseToString = React.useCallback((typeId, value) => {
         if (value === undefined || value === null)
             return "";
@@ -6913,7 +6924,7 @@ function WorkbenchStudioCanvas({ autoScroll, onAutoScrollChange, example, onExam
             return String(rounded);
         }
         return String(value);
-    }, [wb.registry]);
+    }, [wb.registry, registryVersion]);
     const baseToElement = React.useCallback((typeId, value) => {
         return (jsxRuntime.jsx("span", { className: "ml-1 opacity-60", children: baseToString(typeId, value) }));
     }, [baseToString]);
@@ -6921,14 +6932,14 @@ function WorkbenchStudioCanvas({ autoScroll, onAutoScrollChange, example, onExam
         if (overrides?.toString)
             return overrides.toString(baseToString, { registry: wb.registry });
         return baseToString;
-    }, [overrides, baseToString, wb.registry]);
+    }, [overrides, baseToString, wb.registry, registryVersion]);
     // 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: wb.registry });
         return baseToElement;
-    }, [overrides, baseToElement, wb.registry]);
+    }, [overrides, baseToElement, wb.registry, registryVersion]);
     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: ", runMode === "manual" ? "Manual" : "Auto"] })) : (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: runMode, onChange: async (e) => {
                             const mode = e.target.value;
                             if (mode !== runMode) {