@bian-womp/spark-workbench 0.2.27 → 0.2.28

package/lib/cjs/index.cjs

@@ -524,7 +524,16 @@ class LocalGraphRunner extends AbstractGraphRunner {
             const runtimeInputs = this.runtime
                 ? this.runtime.getNodeData?.(n.nodeId)?.inputs ?? {}
                 : {};
-            const merged = { ...runtimeInputs, ...staged };
+            // Build inbound handle set for this node from current def
+            const inbound = new Set(def.edges
+                .filter((e) => e.target.nodeId === n.nodeId)
+                .map((e) => e.target.handle));
+            // Merge staged only for non-inbound handles so UI reflects runtime values for wired inputs
+            const merged = { ...runtimeInputs };
+            for (const [h, v] of Object.entries(staged)) {
+                if (!inbound.has(h))
+                    merged[h] = v;
+            }
             if (Object.keys(merged).length > 0)
                 out[n.nodeId] = merged;
         }
@@ -795,12 +804,21 @@ class RemoteGraphRunner extends AbstractGraphRunner {
             const desc = this.registry.nodes.get(n.typeId);
             const handles = Object.keys(resolved ?? desc?.inputs ?? {});
             const cur = {};
+            // Build inbound handle set for this node to honor wiring precedence
+            const inbound = new Set(def.edges
+                .filter((e) => e.target.nodeId === n.nodeId)
+                .map((e) => e.target.handle));
             for (const h of handles) {
                 const rec = cache.get(`${n.nodeId}.${h}`);
                 if (rec && rec.io === "input")
                     cur[h] = rec.value;
             }
-            const merged = { ...cur, ...staged };
+            // Merge staged only for non-inbound handles so UI doesn't override runtime values
+            const merged = { ...cur };
+            for (const [h, v] of Object.entries(staged)) {
+                if (!inbound.has(h))
+                    merged[h] = v;
+            }
             if (Object.keys(merged).length > 0)
                 out[n.nodeId] = merged;
         }
@@ -1264,6 +1282,23 @@ function formatDeclaredTypeSignature(declared) {
         return declared.join(" | ");
     return declared ?? "";
 }
+/**
+ * Formats a handle ID for display in the UI.
+ * For handles with format "prefix:middle:suffix:extra" (4 parts), displays only the middle part.
+ * Otherwise returns the handle ID as-is.
+ */
+function prettyHandle(id) {
+    try {
+        const parts = String(id).split(":");
+        // If there are exactly 3 colons (4 parts), display only the second part
+        if (parts.length === 4)
+            return parts[1] || id;
+        return id;
+    }
+    catch {
+        return id;
+    }
+}
 // Pre-format common structures for display; return undefined to defer to caller
 function preformatValueForDisplay(typeId, value, registry) {
     if (value === undefined || value === null)
@@ -2230,6 +2265,7 @@ function IssueBadge({ level, title, size = 12, className, }) {
 function DebugEvents({ autoScroll, onAutoScrollChange, hideWorkbench, onHideWorkbenchChange, }) {
     const { events, clearEvents } = useWorkbenchContext();
     const scrollRef = React.useRef(null);
+    const [copied, setCopied] = React.useState(false);
     const rows = React.useMemo(() => {
         const filtered = hideWorkbench
             ? events.filter((e) => e.source !== "workbench")
@@ -2253,7 +2289,25 @@ function DebugEvents({ autoScroll, onAutoScrollChange, hideWorkbench, onHideWork
             return String(v);
         }
     };
-    return (jsxRuntime.jsxs("div", { className: "flex flex-col h-full min-h-0", children: [jsxRuntime.jsxs("div", { className: "flex items-center justify-between mb-1", children: [jsxRuntime.jsx("div", { className: "font-semibold", children: "Events" }), jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [jsxRuntime.jsxs("label", { className: "flex items-center gap-1 text-xs text-gray-700", children: [jsxRuntime.jsx("input", { type: "checkbox", checked: hideWorkbench, onChange: (e) => onHideWorkbenchChange?.(e.target.checked) }), jsxRuntime.jsx("span", { children: "Hide workbench" })] }), jsxRuntime.jsxs("label", { className: "flex items-center gap-1 text-xs text-gray-700", children: [jsxRuntime.jsx("input", { type: "checkbox", checked: autoScroll, onChange: (e) => onAutoScrollChange?.(e.target.checked) }), jsxRuntime.jsx("span", { children: "Auto scroll" })] }), jsxRuntime.jsx("button", { onClick: clearEvents, className: "text-xs px-2 py-0.5 border border-gray-300 rounded", children: "Clear" })] })] }), jsxRuntime.jsx("div", { ref: scrollRef, className: "flex-1 overflow-auto text-[11px] leading-4 divide-y divide-gray-200", children: rows.map((ev) => (jsxRuntime.jsxs("div", { className: "opacity-85 odd:bg-gray-50 px-2 py-1", children: [jsxRuntime.jsxs("div", { className: "flex items-baseline gap-2", children: [jsxRuntime.jsx("span", { className: "w-12 shrink-0 text-right text-gray-500 select-none", children: ev.no }), jsxRuntime.jsxs("span", { className: "text-gray-500", children: [new Date(ev.at).toLocaleTimeString(), " \u00B7 ", ev.source, ":", ev.type] })] }), jsxRuntime.jsx("pre", { className: "m-0 whitespace-pre-wrap ml-12", children: renderPayload(ev.payload) })] }, `${ev.at}:${ev.no}`))) })] }));
+    const handleCopyLogs = async () => {
+        try {
+            const formattedEvents = rows.map((ev) => ({
+                no: ev.no,
+                at: ev.at,
+                source: ev.source,
+                type: ev.type,
+                payload: summarizeDeep(ev.payload),
+            }));
+            const jsonString = JSON.stringify(formattedEvents, null, 2);
+            await navigator.clipboard.writeText(jsonString);
+            setCopied(true);
+            setTimeout(() => setCopied(false), 2000);
+        }
+        catch (err) {
+            console.error("Failed to copy logs:", err);
+        }
+    };
+    return (jsxRuntime.jsxs("div", { className: "flex flex-col h-full min-h-0", children: [jsxRuntime.jsxs("div", { className: "flex items-center justify-between mb-1", children: [jsxRuntime.jsx("div", { className: "font-semibold", children: "Events" }), jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [jsxRuntime.jsxs("label", { className: "flex items-center gap-1 text-xs text-gray-700", children: [jsxRuntime.jsx("input", { type: "checkbox", checked: hideWorkbench, onChange: (e) => onHideWorkbenchChange?.(e.target.checked) }), jsxRuntime.jsx("span", { children: "Hide workbench" })] }), jsxRuntime.jsxs("label", { className: "flex items-center gap-1 text-xs text-gray-700", children: [jsxRuntime.jsx("input", { type: "checkbox", checked: autoScroll, onChange: (e) => onAutoScrollChange?.(e.target.checked) }), jsxRuntime.jsx("span", { children: "Auto scroll" })] }), jsxRuntime.jsx("button", { onClick: handleCopyLogs, className: "p-2 border border-gray-300 rounded flex items-center justify-center", title: copied ? "Copied!" : "Copy logs as formatted JSON", children: jsxRuntime.jsx(react$1.CopyIcon, { size: 14 }) }), jsxRuntime.jsx("button", { onClick: clearEvents, className: "p-2 border border-gray-300 rounded flex items-center justify-center", title: "Clear all events", children: jsxRuntime.jsx(react$1.TrashIcon, { size: 14 }) })] })] }), jsxRuntime.jsx("div", { ref: scrollRef, className: "flex-1 overflow-auto text-[11px] leading-4 divide-y divide-gray-200", children: rows.map((ev) => (jsxRuntime.jsxs("div", { className: "opacity-85 odd:bg-gray-50 px-2 py-1", children: [jsxRuntime.jsxs("div", { className: "flex items-baseline gap-2", children: [jsxRuntime.jsx("span", { className: "w-12 shrink-0 text-right text-gray-500 select-none", children: ev.no }), jsxRuntime.jsxs("span", { className: "text-gray-500", children: [new Date(ev.at).toLocaleTimeString(), " \u00B7 ", ev.source, ":", ev.type] })] }), jsxRuntime.jsx("pre", { className: "m-0 whitespace-pre-wrap ml-12", children: renderPayload(ev.payload) })] }, `${ev.at}:${ev.no}`))) })] }));
 }
 
 function Inspector({ debug, autoScroll, hideWorkbench, onAutoScrollChange, onHideWorkbenchChange, toString, toElement, contextPanel, setInput, }) {
@@ -2275,13 +2329,17 @@ function Inspector({ debug, autoScroll, hideWorkbench, onAutoScrollChange, onHid
     const globalValidationIssues = validationGlobal;
     const selectedNode = def.nodes.find((n) => n.nodeId === selectedNodeId);
     const selectedEdge = def.edges.find((e) => e.id === selectedEdgeId);
-    const selectedDesc = selectedNode
+    selectedNode
         ? registry.nodes.get(selectedNode.typeId)
         : undefined;
-    const inputHandles = Object.entries(selectedDesc?.inputs ?? {})
-        .filter(([k]) => !sparkGraph.isInputPrivate(selectedDesc?.inputs, k))
+    // Use computeEffectiveHandles to merge registry defaults with dynamically resolved handles
+    const effectiveHandles = selectedNode
+        ? computeEffectiveHandles(selectedNode, registry)
+        : { inputs: {}, outputs: {}};
+    const inputHandles = Object.entries(effectiveHandles.inputs)
+        .filter(([k]) => !sparkGraph.isInputPrivate(effectiveHandles.inputs, k))
         .map(([k]) => k);
-    const outputHandles = Object.keys(selectedDesc?.outputs ?? {});
+    const outputHandles = Object.keys(effectiveHandles.outputs);
     const nodeInputs = selectedNodeId ? inputsMap[selectedNodeId] ?? {} : {};
     const nodeOutputs = selectedNodeId ? outputsMap[selectedNodeId] ?? {} : {};
     const selectedNodeStatus = selectedNodeId
@@ -2322,12 +2380,11 @@ function Inspector({ debug, autoScroll, hideWorkbench, onAutoScrollChange, onHid
             }
             return;
         }
-        const desc = selectedDesc;
-        const handles = Object.keys(desc?.inputs ?? {});
+        const handles = Object.keys(effectiveHandles.inputs);
         const nextDrafts = { ...drafts };
         const nextOriginals = { ...originals };
         for (const h of handles) {
-            const typeId = sparkGraph.getInputTypeId(desc?.inputs, h);
+            const typeId = sparkGraph.getInputTypeId(effectiveHandles.inputs, h);
             const current = nodeInputs[h];
             const display = safeToString(typeId, current);
             const wasOriginal = originals[h];
@@ -2343,7 +2400,7 @@ function Inspector({ debug, autoScroll, hideWorkbench, onAutoScrollChange, onHid
             setDrafts(nextDrafts);
         if (!shallowEqual(originals, nextOriginals))
             setOriginals(nextOriginals);
-    }, [selectedNodeId, selectedDesc, valuesTick]);
+    }, [selectedNodeId, selectedNode, registry, valuesTick]);
     const widthClass = debug ? "w-[480px]" : "w-[320px]";
     const { wb } = useWorkbenchContext();
     const deleteEdgeById = (edgeId) => {
@@ -2369,7 +2426,7 @@ function Inspector({ debug, autoScroll, hideWorkbench, onAutoScrollChange, onHid
                                                     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?.lastError && (jsxRuntime.jsx("div", { className: "mt-2 text-sm text-red-700 bg-red-50 border border-red-200 rounded px-2 py-1 break-words", children: String(selectedNodeStatus.lastError?.message ??
                                         selectedNodeStatus.lastError) }))] })), jsxRuntime.jsxs("div", { className: "mb-2", children: [jsxRuntime.jsx("div", { className: "font-semibold mb-1", children: "Inputs" }), inputHandles.length === 0 ? (jsxRuntime.jsx("div", { className: "text-gray-500", children: "No inputs" })) : (inputHandles.map((h) => {
-                                    const typeId = sparkGraph.getInputTypeId(selectedDesc?.inputs, h);
+                                    const typeId = sparkGraph.getInputTypeId(effectiveHandles.inputs, h);
                                     const isLinked = def.edges.some((e) => e.target.nodeId === selectedNodeId &&
                                         e.target.handle === h);
                                     const commonProps = {
@@ -2397,7 +2454,7 @@ function Inspector({ debug, autoScroll, hideWorkbench, onAutoScrollChange, onHid
                                     const title = inIssues
                                         .map((v) => `${v.code}: ${v.message}`)
                                         .join("; ");
-                                    return (jsxRuntime.jsxs("div", { className: "flex items-center gap-2 mb-1", children: [jsxRuntime.jsxs("label", { className: "w-32 flex flex-col", children: [jsxRuntime.jsx("span", { children: h }), jsxRuntime.jsx("span", { className: "text-gray-500 text-[11px]", children: typeId })] }), hasValidation && (jsxRuntime.jsx(IssueBadge, { level: hasErr ? "error" : "warning", size: 24, className: "ml-1 w-6 h-6", title: title })), isEnum ? (jsxRuntime.jsxs("select", { className: "border border-gray-300 rounded px-2 py-1 focus:outline-none focus:ring-2 focus:ring-blue-500 w-full", value: current !== undefined && current !== null
+                                    return (jsxRuntime.jsxs("div", { className: "flex items-center gap-2 mb-1", children: [jsxRuntime.jsxs("label", { className: "w-32 flex flex-col", children: [jsxRuntime.jsx("span", { children: prettyHandle(h) }), jsxRuntime.jsx("span", { className: "text-gray-500 text-[11px]", children: typeId })] }), hasValidation && (jsxRuntime.jsx(IssueBadge, { level: hasErr ? "error" : "warning", size: 24, className: "ml-1 w-6 h-6", title: title })), isEnum ? (jsxRuntime.jsxs("select", { className: "border border-gray-300 rounded px-2 py-1 focus:outline-none focus:ring-2 focus:ring-blue-500 w-full", value: current !== undefined && current !== null
                                                     ? String(current)
                                                     : "", onChange: (e) => {
                                                     const val = e.target.value;
@@ -2413,8 +2470,8 @@ function Inspector({ debug, autoScroll, hideWorkbench, onAutoScrollChange, onHid
                                                     if (e.key === "Escape")
                                                         revert();
                                                 }, ...commonProps }))] }, h));
-                                }))] }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx("div", { className: "font-semibold mb-1", children: "Outputs" }), outputHandles.length === 0 ? (jsxRuntime.jsx("div", { className: "text-gray-500", children: "No outputs" })) : (outputHandles.map((h) => (jsxRuntime.jsxs("div", { className: "flex items-center gap-2 mb-1", children: [jsxRuntime.jsxs("label", { className: "w-20 flex flex-col", children: [jsxRuntime.jsx("span", { children: h }), jsxRuntime.jsx("span", { className: "text-gray-500 text-[11px]", children: outputTypesMap[selectedNodeId]?.[h] ?? "" })] }), jsxRuntime.jsx("div", { className: "flex-1", children: (() => {
-                                                const { typeId, value } = resolveOutputDisplay(nodeOutputs[h], selectedDesc?.outputs?.[h]);
+                                }))] }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx("div", { className: "font-semibold mb-1", children: "Outputs" }), outputHandles.length === 0 ? (jsxRuntime.jsx("div", { className: "text-gray-500", children: "No outputs" })) : (outputHandles.map((h) => (jsxRuntime.jsxs("div", { className: "flex items-center gap-2 mb-1", children: [jsxRuntime.jsxs("label", { className: "w-20 flex flex-col", children: [jsxRuntime.jsx("span", { children: prettyHandle(h) }), jsxRuntime.jsx("span", { className: "text-gray-500 text-[11px]", children: outputTypesMap[selectedNodeId]?.[h] ?? "" })] }), jsxRuntime.jsx("div", { className: "flex-1", children: (() => {
+                                                const { typeId, value } = resolveOutputDisplay(nodeOutputs[h], effectiveHandles.outputs[h]);
                                                 return toElement(typeId, value);
                                             })() }), (() => {
                                             const outIssues = selectedNodeHandleValidation.outputs.filter((m) => m.handle === h);
@@ -2558,18 +2615,6 @@ function DefaultNodeHeader({ id, title, validation, right, showId, onInvalidate,
 }
 function DefaultNodeContent({ data, isConnectable, }) {
     const { showValues, inputValues, outputValues, toString } = data;
-    const prettyHandle = React.useCallback((id) => {
-        try {
-            const parts = String(id).split(":");
-            // If there are exactly 3 colons (4 parts), display only the second part
-            if (parts.length === 4)
-                return parts[1] || id;
-            return id;
-        }
-        catch {
-            return id;
-        }
-    }, []);
     const inputEntries = data.inputHandles ?? [];
     const outputEntries = data.outputHandles ?? [];
     const status = data.status ?? { activeRuns: 0 };
@@ -3741,6 +3786,7 @@ exports.formatDataUrlAsLabel = formatDataUrlAsLabel;
 exports.formatDeclaredTypeSignature = formatDeclaredTypeSignature;
 exports.getNodeBorderClassNames = getNodeBorderClassNames;
 exports.preformatValueForDisplay = preformatValueForDisplay;
+exports.prettyHandle = prettyHandle;
 exports.resolveOutputDisplay = resolveOutputDisplay;
 exports.summarizeDeep = summarizeDeep;
 exports.toReactFlow = toReactFlow;