@bian-womp/spark-workbench 0.2.36 → 0.2.37

package/lib/cjs/index.cjs

@@ -343,7 +343,12 @@ class AbstractGraphRunner {
     setInput(nodeId, handle, value) {
         if (!this.stagedInputs[nodeId])
             this.stagedInputs[nodeId] = {};
-        this.stagedInputs[nodeId][handle] = value;
+        if (value === undefined) {
+            delete this.stagedInputs[nodeId][handle];
+        }
+        else {
+            this.stagedInputs[nodeId][handle] = value;
+        }
         if (this.engine) {
             this.engine.setInput(nodeId, handle, value);
         }
@@ -361,7 +366,14 @@ class AbstractGraphRunner {
             return;
         if (!this.stagedInputs[nodeId])
             this.stagedInputs[nodeId] = {};
-        Object.assign(this.stagedInputs[nodeId], inputs);
+        for (const [handle, value] of Object.entries(inputs)) {
+            if (value === undefined) {
+                delete this.stagedInputs[nodeId][handle];
+            }
+            else {
+                this.stagedInputs[nodeId][handle] = value;
+            }
+        }
         if (this.engine) {
             // Running: set all inputs
             this.engine.setInputs(nodeId, inputs);
@@ -1738,14 +1750,19 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
     const clearEvents = React.useCallback(() => setEvents([]), []);
     const [systemErrors, setSystemErrors] = React.useState([]);
     const [registryErrors, setRegistryErrors] = React.useState([]);
+    const [inputValidationErrors, setInputValidationErrors] = React.useState([]);
     const clearSystemErrors = React.useCallback(() => setSystemErrors([]), []);
     const clearRegistryErrors = React.useCallback(() => setRegistryErrors([]), []);
+    const clearInputValidationErrors = React.useCallback(() => setInputValidationErrors([]), []);
     const removeSystemError = React.useCallback((index) => {
         setSystemErrors((prev) => prev.filter((_, idx) => idx !== index));
     }, []);
     const removeRegistryError = React.useCallback((index) => {
         setRegistryErrors((prev) => prev.filter((_, idx) => idx !== index));
     }, []);
+    const removeInputValidationError = React.useCallback((index) => {
+        setInputValidationErrors((prev) => prev.filter((_, idx) => idx !== index));
+    }, []);
     // Fallback progress animation: drive progress to 100% over ~2 minutes
     const FALLBACK_TOTAL_MS = 2 * 60 * 1000;
     const [fallbackStarts, setFallbackStarts] = React.useState({});
@@ -1801,7 +1818,8 @@ 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 def.nodes) {
-            const outputsDecl = registry.nodes.get(n.typeId)?.outputs ?? {};
+            const effectiveHandles = computeEffectiveHandles(n, registry);
+            const outputsDecl = effectiveHandles.outputs;
             const handles = Object.keys(outputsDecl);
             const cur = {};
             for (const h of handles) {
@@ -1962,10 +1980,13 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
         const offRunnerValue = runner.on("value", (e) => {
             if (e?.io === "input") {
                 const nodeId = e?.nodeId;
+                const handle = e?.handle;
                 setNodeStatus((s) => ({
                     ...s,
                     [nodeId]: { ...s[nodeId], invalidated: true },
                 }));
+                // Clear validation errors for this input when a valid value is set
+                setInputValidationErrors((prev) => prev.filter((err) => !(err.nodeId === nodeId && err.handle === handle)));
             }
             return add("runner", "value")(e);
         });
@@ -1974,6 +1995,7 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
             const nodeError = e;
             const registryError = e;
             const systemError = e;
+            const inputValidationError = e;
             if (edgeError.kind === "edge-convert") {
                 const edgeId = edgeError.edgeId;
                 setEdgeStatus((s) => ({
@@ -2009,6 +2031,18 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
                     return [...prev, registryError];
                 });
             }
+            else if (inputValidationError.kind === "input-validation") {
+                // Track input validation errors for UI display
+                setInputValidationErrors((prev) => {
+                    // Avoid duplicates by checking nodeId, handle, and typeId
+                    if (prev.some((err) => err.nodeId === inputValidationError.nodeId &&
+                        err.handle === inputValidationError.handle &&
+                        err.typeId === inputValidationError.typeId)) {
+                        return prev;
+                    }
+                    return [...prev, inputValidationError];
+                });
+            }
             else if (systemError.kind === "system") {
                 // Track custom errors for UI display
                 setSystemErrors((prev) => {
@@ -2132,7 +2166,14 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
             }
             return add("runner", "stats")(s);
         });
-        const offWbGraphChanged = wb.on("graphChanged", add("workbench", "graphChanged"));
+        const offWbGraphChanged = wb.on("graphChanged", (event) => {
+            // Clear validation errors for removed nodes
+            if (event.change?.type === "removeNode") {
+                const removedNodeId = event.change.nodeId;
+                setInputValidationErrors((prev) => prev.filter((err) => err.nodeId !== removedNodeId));
+            }
+            return add("workbench", "graphChanged")(event);
+        });
         const offWbGraphUiChanged = wb.on("graphUiChanged", add("workbench", "graphUiChanged"));
         const offWbValidationChanged = wb.on("validationChanged", add("workbench", "validationChanged"));
         // Ensure newly added nodes start as invalidated until first evaluation
@@ -2302,10 +2343,13 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
         clearEvents,
         systemErrors,
         registryErrors,
+        inputValidationErrors,
         clearSystemErrors,
         clearRegistryErrors,
+        clearInputValidationErrors,
         removeSystemError,
         removeRegistryError,
+        removeInputValidationError,
         isRunning,
         engineKind,
         start,
@@ -2330,10 +2374,13 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
         valuesTick,
         systemErrors,
         registryErrors,
+        inputValidationErrors,
         clearSystemErrors,
         clearRegistryErrors,
+        clearInputValidationErrors,
         removeSystemError,
         removeRegistryError,
+        removeInputValidationError,
         inputsMap,
         inputDefaultsMap,
         outputsMap,
@@ -2421,7 +2468,7 @@ function Inspector({ debug, autoScroll, hideWorkbench, onAutoScrollChange, onHid
             return String(value ?? "");
         }
     };
-    const { registry, def, selectedNodeId, selectedEdgeId, inputsMap, inputDefaultsMap, outputsMap, outputTypesMap, nodeStatus, edgeStatus, validationByNode, validationByEdge, validationGlobal, valuesTick, updateEdgeType, systemErrors, registryErrors, clearSystemErrors, clearRegistryErrors, removeSystemError, removeRegistryError, } = useWorkbenchContext();
+    const { registry, def, 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;
@@ -2532,7 +2579,7 @@ function Inspector({ debug, autoScroll, hideWorkbench, onAutoScrollChange, onHid
         }
         catch { }
     };
-    return (jsxRuntime.jsxs("div", { className: `${widthClass} border-l border-gray-300 p-3 flex flex-col h-full min-h-0 overflow-auto`, children: [jsxRuntime.jsxs("div", { className: "flex-1 overflow-auto", children: [contextPanel && jsxRuntime.jsx("div", { className: "mb-2", children: contextPanel }), systemErrors.length > 0 && (jsxRuntime.jsxs("div", { className: "mb-2 space-y-1", children: [systemErrors.map((err, i) => (jsxRuntime.jsxs("div", { className: "text-xs text-red-700 bg-red-50 border border-red-200 rounded px-2 py-1 flex items-start justify-between gap-2", children: [jsxRuntime.jsxs("div", { className: "flex-1", children: [jsxRuntime.jsx("div", { className: "font-semibold", children: err.code ? `Error ${err.code}` : "Error" }), jsxRuntime.jsx("div", { className: "break-words", children: err.message })] }), jsxRuntime.jsx("button", { className: "text-red-500 hover:text-red-700 text-[10px] px-1", onClick: () => removeSystemError(i), title: "Dismiss", children: jsxRuntime.jsx(react$1.XIcon, { size: 10 }) })] }, i))), systemErrors.length > 1 && (jsxRuntime.jsx("button", { className: "text-xs text-red-600 hover:text-red-800 underline", onClick: clearSystemErrors, children: "Clear all" }))] })), registryErrors.length > 0 && (jsxRuntime.jsxs("div", { className: "mb-2 space-y-1", children: [registryErrors.map((err, i) => (jsxRuntime.jsxs("div", { className: "text-xs text-amber-700 bg-amber-50 border border-amber-200 rounded px-2 py-1 flex items-start justify-between gap-2", children: [jsxRuntime.jsxs("div", { className: "flex-1", children: [jsxRuntime.jsx("div", { className: "font-semibold", children: "Registry Error" }), jsxRuntime.jsx("div", { className: "break-words", children: err.message }), err.attempt && err.maxAttempts && (jsxRuntime.jsxs("div", { className: "text-[10px] text-amber-600 mt-1", children: ["Attempt ", err.attempt, " of ", err.maxAttempts] }))] }), jsxRuntime.jsx("button", { className: "text-amber-500 hover:text-amber-700 text-[10px] px-1", onClick: () => removeRegistryError(i), title: "Dismiss", children: jsxRuntime.jsx(react$1.XIcon, { size: 10 }) })] }, i))), registryErrors.length > 1 && (jsxRuntime.jsx("button", { className: "text-xs text-amber-600 hover:text-amber-800 underline", onClick: clearRegistryErrors, children: "Clear all" }))] })), jsxRuntime.jsx("div", { className: "font-semibold mb-2", children: "Inspector" }), jsxRuntime.jsxs("div", { className: "text-xs text-gray-500 mb-2", children: ["valuesTick: ", valuesTick] }), jsxRuntime.jsx("div", { className: "flex-1", children: !selectedNode && !selectedEdge ? (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx("div", { className: "text-gray-500", children: "Select a node or edge." }), globalValidationIssues && globalValidationIssues.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: globalValidationIssues.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}` }), !!m.data?.edgeId && (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) => {
+    return (jsxRuntime.jsxs("div", { className: `${widthClass} border-l border-gray-300 p-3 flex flex-col h-full min-h-0 overflow-auto`, children: [jsxRuntime.jsxs("div", { className: "flex-1 overflow-auto", children: [contextPanel && jsxRuntime.jsx("div", { className: "mb-2", children: contextPanel }), inputValidationErrors.length > 0 && (jsxRuntime.jsxs("div", { className: "mb-2 space-y-1", children: [inputValidationErrors.map((err, i) => (jsxRuntime.jsxs("div", { className: "text-xs text-red-700 bg-red-50 border border-red-200 rounded px-2 py-1 flex items-start justify-between gap-2", children: [jsxRuntime.jsxs("div", { className: "flex-1", children: [jsxRuntime.jsx("div", { className: "font-semibold", children: "Input Validation Error" }), jsxRuntime.jsx("div", { className: "break-words", children: err.message }), jsxRuntime.jsxs("div", { className: "text-[10px] text-red-600 mt-1", children: [err.nodeId, ".", err.handle, " (type: ", err.typeId, ")"] })] }), jsxRuntime.jsx("button", { className: "text-red-500 hover:text-red-700 text-[10px] px-1", onClick: () => removeInputValidationError(i), title: "Dismiss", children: jsxRuntime.jsx(react$1.XIcon, { size: 10 }) })] }, i))), inputValidationErrors.length > 1 && (jsxRuntime.jsx("button", { className: "text-xs text-red-600 hover:text-red-800 underline", onClick: clearInputValidationErrors, children: "Clear all" }))] })), systemErrors.length > 0 && (jsxRuntime.jsxs("div", { className: "mb-2 space-y-1", children: [systemErrors.map((err, i) => (jsxRuntime.jsxs("div", { className: "text-xs text-red-700 bg-red-50 border border-red-200 rounded px-2 py-1 flex items-start justify-between gap-2", children: [jsxRuntime.jsxs("div", { className: "flex-1", children: [jsxRuntime.jsx("div", { className: "font-semibold", children: err.code ? `Error ${err.code}` : "Error" }), jsxRuntime.jsx("div", { className: "break-words", children: err.message })] }), jsxRuntime.jsx("button", { className: "text-red-500 hover:text-red-700 text-[10px] px-1", onClick: () => removeSystemError(i), title: "Dismiss", children: jsxRuntime.jsx(react$1.XIcon, { size: 10 }) })] }, i))), systemErrors.length > 1 && (jsxRuntime.jsx("button", { className: "text-xs text-red-600 hover:text-red-800 underline", onClick: clearSystemErrors, children: "Clear all" }))] })), registryErrors.length > 0 && (jsxRuntime.jsxs("div", { className: "mb-2 space-y-1", children: [registryErrors.map((err, i) => (jsxRuntime.jsxs("div", { className: "text-xs text-amber-700 bg-amber-50 border border-amber-200 rounded px-2 py-1 flex items-start justify-between gap-2", children: [jsxRuntime.jsxs("div", { className: "flex-1", children: [jsxRuntime.jsx("div", { className: "font-semibold", children: "Registry Error" }), jsxRuntime.jsx("div", { className: "break-words", children: err.message }), err.attempt && err.maxAttempts && (jsxRuntime.jsxs("div", { className: "text-[10px] text-amber-600 mt-1", children: ["Attempt ", err.attempt, " of ", err.maxAttempts] }))] }), jsxRuntime.jsx("button", { className: "text-amber-500 hover:text-amber-700 text-[10px] px-1", onClick: () => removeRegistryError(i), title: "Dismiss", children: jsxRuntime.jsx(react$1.XIcon, { size: 10 }) })] }, i))), registryErrors.length > 1 && (jsxRuntime.jsx("button", { className: "text-xs text-amber-600 hover:text-amber-800 underline", onClick: clearRegistryErrors, children: "Clear all" }))] })), jsxRuntime.jsx("div", { className: "font-semibold mb-2", children: "Inspector" }), jsxRuntime.jsxs("div", { className: "text-xs text-gray-500 mb-2", children: ["valuesTick: ", valuesTick] }), jsxRuntime.jsx("div", { className: "flex-1", children: !selectedNode && !selectedEdge ? (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx("div", { className: "text-gray-500", children: "Select a node or edge." }), globalValidationIssues && globalValidationIssues.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: globalValidationIssues.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}` }), !!m.data?.edgeId && (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(m.data?.edgeId);
                                                         }, title: "Delete referenced edge", children: "Delete edge" }))] }, i))) })] }))] })) : selectedEdge ? (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsxs("div", { className: "mb-2", children: [jsxRuntime.jsxs("div", { children: ["Edge: ", selectedEdge.id] }), jsxRuntime.jsxs("div", { children: [selectedEdge.source.nodeId, ".", selectedEdge.source.handle, " \u2192", " ", selectedEdge.target.nodeId, ".", selectedEdge.target.handle] }), (() => {
@@ -2570,13 +2617,20 @@ function Inspector({ debug, autoScroll, hideWorkbench, onAutoScrollChange, onHid
                                             const current = nodeInputs[h];
                                             const hasValue = current !== undefined && current !== null;
                                             const value = drafts[h] ?? safeToString(typeId, current);
-                                            const displayValue = hasValue ? value : "";
+                                            const displayValue = value;
                                             const placeholder = hasDefault ? defaultStr : undefined;
                                             const onChangeText = (text) => setDrafts((d) => ({ ...d, [h]: text }));
                                             const commit = () => {
                                                 const draft = drafts[h];
                                                 if (draft === undefined)
                                                     return;
+                                                // Only commit if draft differs from current value
+                                                const currentDisplay = safeToString(typeId, current);
+                                                if (draft === currentDisplay) {
+                                                    // No change, just sync originals without calling setInput
+                                                    setOriginals((o) => ({ ...o, [h]: draft }));
+                                                    return;
+                                                }
                                                 setInput(h, draft);
                                                 setOriginals((o) => ({ ...o, [h]: draft }));
                                             };
@@ -3394,9 +3448,12 @@ function WorkbenchStudioCanvas({ setRegistry, autoScroll, onAutoScrollChange, ex
         state: "local",
     });
     const selectedNode = def.nodes.find((n) => n.nodeId === selectedNodeId);
-    const selectedDesc = selectedNode
+    selectedNode
         ? registry.nodes.get(selectedNode.typeId)
         : undefined;
+    const effectiveHandles = selectedNode
+        ? computeEffectiveHandles(selectedNode, registry)
+        : { inputs: {}, outputs: {}, inputDefaults: {} };
     const [exampleState, setExampleState] = React.useState(example ?? "");
     const defaultExamples = React.useMemo(() => [
         {
@@ -3684,7 +3741,7 @@ function WorkbenchStudioCanvas({ setRegistry, autoScroll, onAutoScrollChange, ex
         const isLinked = def.edges.some((e) => e.target.nodeId === selectedNodeId && e.target.handle === handle);
         if (isLinked)
             return;
-        const typeId = selectedDesc?.inputs?.[handle];
+        const typeId = effectiveHandles.inputs[handle];
         let value = raw;
         const parseArray = (s, map) => {
             const str = String(s).trim();
@@ -3761,7 +3818,7 @@ function WorkbenchStudioCanvas({ setRegistry, autoScroll, onAutoScrollChange, ex
             }
         }
         runner.setInput(selectedNodeId, handle, value);
-    }, [selectedNodeId, def.edges, selectedDesc, runner]);
+    }, [selectedNodeId, def.edges, effectiveHandles, runner]);
     const setInput = React.useMemo(() => {
         if (overrides?.setInput) {
             return overrides.setInput(baseSetInput, {