@bian-womp/spark-workbench 0.2.64 → 0.2.66

package/lib/cjs/index.cjs

@@ -307,6 +307,22 @@ class InMemoryWorkbench extends AbstractWorkbench {
             edges: [...this.selection.edges],
         };
     }
+    /**
+     * Delete all selected nodes and edges.
+     */
+    deleteSelection() {
+        const selection = this.getSelection();
+        // Delete all selected nodes (this will also remove connected edges)
+        for (const nodeId of selection.nodes) {
+            this.removeNode(nodeId);
+        }
+        // Delete remaining selected edges (edges not connected to deleted nodes)
+        for (const edgeId of selection.edges) {
+            this.disconnect(edgeId);
+        }
+        // Clear selection
+        this.setSelection({ nodes: [], edges: [] });
+    }
     setViewport(viewport, opts) {
         this.viewport = { ...viewport };
         this.emit("graphUiChanged", {
@@ -367,6 +383,142 @@ class InMemoryWorkbench extends AbstractWorkbench {
             for (const h of Array.from(set))
                 h(payload);
     }
+    /**
+     * Copy selected nodes and their internal edges.
+     * Returns data in a format suitable for pasting.
+     * Positions are normalized relative to the selection bounds center.
+     * Uses the same logic as duplicate: copies inputs without bindings and supports copyOutputsFrom.
+     */
+    copySelection(runner, getNodeSize) {
+        const selection = this.getSelection();
+        if (selection.nodes.length === 0)
+            return null;
+        const def = this.export();
+        const positions = this.getPositions();
+        const selectedNodeSet = new Set(selection.nodes);
+        // Collect nodes to copy
+        const nodesToCopy = def.nodes.filter((n) => selectedNodeSet.has(n.nodeId));
+        if (nodesToCopy.length === 0)
+            return null;
+        // Calculate bounds
+        let minX = Infinity;
+        let minY = Infinity;
+        let maxX = -Infinity;
+        let maxY = -Infinity;
+        nodesToCopy.forEach((node) => {
+            const pos = positions[node.nodeId] || { x: 0, y: 0 };
+            const size = getNodeSize?.(node.nodeId, node.typeId) || {
+                width: 200,
+                height: 100,
+            };
+            minX = Math.min(minX, pos.x);
+            minY = Math.min(minY, pos.y);
+            maxX = Math.max(maxX, pos.x + size.width);
+            maxY = Math.max(maxY, pos.y + size.height);
+        });
+        const bounds = { minX, minY, maxX, maxY };
+        const centerX = (bounds.minX + bounds.maxX) / 2;
+        const centerY = (bounds.minY + bounds.maxY) / 2;
+        // Get inputs for each node
+        // Include values from inbound edges if those edges are selected
+        const allInputs = runner.getInputs(def);
+        const selectedEdgeSet = new Set(selection.edges);
+        const copiedNodes = nodesToCopy.map((node) => {
+            const pos = positions[node.nodeId] || { x: 0, y: 0 };
+            // Get all inbound edges for this node
+            const inboundEdges = def.edges.filter((e) => e.target.nodeId === node.nodeId);
+            // Build set of handles that have inbound edges
+            // But only exclude handles whose edges are NOT selected
+            const inboundHandlesToExclude = new Set(inboundEdges
+                .filter((e) => !selectedEdgeSet.has(e.id)) // Only exclude if edge is not selected
+                .map((e) => e.target.handle));
+            const allNodeInputs = allInputs[node.nodeId] || {};
+            // Include inputs that either:
+            // 1. Don't have inbound edges (literal values)
+            // 2. Have inbound edges that ARE selected (preserve the value from the edge)
+            const inputsToCopy = Object.fromEntries(Object.entries(allNodeInputs).filter(([handle]) => !inboundHandlesToExclude.has(handle)));
+            return {
+                typeId: node.typeId,
+                params: node.params,
+                resolvedHandles: node.resolvedHandles,
+                position: {
+                    x: pos.x - centerX,
+                    y: pos.y - centerY,
+                },
+                inputs: inputsToCopy,
+                originalNodeId: node.nodeId,
+            };
+        });
+        // Collect edges between copied nodes
+        const copiedEdges = def.edges
+            .filter((edge) => {
+            return (selectedNodeSet.has(edge.source.nodeId) &&
+                selectedNodeSet.has(edge.target.nodeId));
+        })
+            .map((edge) => ({
+            sourceNodeId: edge.source.nodeId,
+            sourceHandle: edge.source.handle,
+            targetNodeId: edge.target.nodeId,
+            targetHandle: edge.target.handle,
+            typeId: edge.typeId,
+        }));
+        return {
+            nodes: copiedNodes,
+            edges: copiedEdges,
+            bounds,
+        };
+    }
+    /**
+     * Paste copied graph data at the specified center position.
+     * Returns the mapping from original node IDs to new node IDs.
+     * Uses copyOutputsFrom to copy outputs from original nodes (like duplicate does).
+     */
+    pasteCopiedData(data, center) {
+        const nodeIdMap = new Map();
+        const edgeIds = [];
+        // Add nodes
+        for (const nodeData of data.nodes) {
+            const newNodeId = this.addNode({
+                typeId: nodeData.typeId,
+                params: nodeData.params,
+                resolvedHandles: nodeData.resolvedHandles,
+                position: {
+                    x: nodeData.position.x + center.x,
+                    y: nodeData.position.y + center.y,
+                },
+            }, {
+                inputs: nodeData.inputs,
+                copyOutputsFrom: nodeData.originalNodeId,
+                dry: true,
+            });
+            nodeIdMap.set(nodeData.originalNodeId, newNodeId);
+        }
+        // Add edges
+        for (const edgeData of data.edges) {
+            const newSourceNodeId = nodeIdMap.get(edgeData.sourceNodeId);
+            const newTargetNodeId = nodeIdMap.get(edgeData.targetNodeId);
+            if (newSourceNodeId && newTargetNodeId) {
+                const edgeId = this.connect({
+                    source: {
+                        nodeId: newSourceNodeId,
+                        handle: edgeData.sourceHandle,
+                    },
+                    target: {
+                        nodeId: newTargetNodeId,
+                        handle: edgeData.targetHandle,
+                    },
+                    typeId: edgeData.typeId,
+                }, { dry: true });
+                edgeIds.push(edgeId);
+            }
+        }
+        // Select the newly pasted nodes
+        this.setSelection({
+            nodes: Array.from(nodeIdMap.values()),
+            edges: edgeIds,
+        });
+        return { nodeIdMap, edgeIds };
+    }
 }
 
 class CLIWorkbench {
@@ -2913,6 +3065,7 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
         updateEdgeType,
         triggerExternal,
         uiVersion,
+        overrides,
     }), [
         wb,
         runner,
@@ -2952,10 +3105,272 @@ function WorkbenchProvider({ wb, runner, registry, setRegistry, overrides, uiVer
         wb,
         runner,
         uiVersion,
+        overrides,
     ]);
     return (jsxRuntime.jsx(WorkbenchContext.Provider, { value: value, children: children }));
 }
 
+function createNodeContextMenuHandlers(nodeId, wb, runner, registry, outputsMap, outputTypesMap, onClose, getDefaultNodeSize, onCopyResult) {
+    const doBake = async (handleId) => {
+        try {
+            const typeId = outputTypesMap?.[nodeId]?.[handleId];
+            const raw = outputsMap?.[nodeId]?.[handleId];
+            if (!typeId || raw === undefined)
+                return;
+            const unwrap = (v) => sparkGraph.isTypedOutput(v) ? sparkGraph.getTypedOutputValue(v) : v;
+            const coerceIfNeeded = async (fromType, toType, value) => {
+                if (!toType || toType === fromType || !runner?.coerce)
+                    return value;
+                try {
+                    return await runner.coerce(fromType, toType, value);
+                }
+                catch {
+                    return value;
+                }
+            };
+            const pos = wb.getPositions()[nodeId] || { x: 0, y: 0 };
+            const isArray = typeId.endsWith("[]");
+            const baseTypeId = isArray ? typeId.slice(0, -2) : typeId;
+            const tArr = isArray ? registry.types.get(typeId) : undefined;
+            const tElem = registry.types.get(baseTypeId);
+            const singleTarget = !isArray ? tElem?.bakeTarget : undefined;
+            const arrTarget = isArray ? tArr?.bakeTarget : undefined;
+            const elemTarget = isArray ? tElem?.bakeTarget : undefined;
+            if (singleTarget) {
+                const nodeDesc = registry.nodes.get(singleTarget.nodeTypeId);
+                const inType = sparkGraph.getInputTypeId(nodeDesc?.inputs, singleTarget.inputHandle);
+                const coerced = await coerceIfNeeded(typeId, inType, unwrap(raw));
+                wb.addNode({
+                    typeId: singleTarget.nodeTypeId,
+                    position: { x: pos.x + 180, y: pos.y },
+                }, { inputs: { [singleTarget.inputHandle]: coerced } });
+                return;
+            }
+            if (isArray && arrTarget) {
+                const nodeDesc = registry.nodes.get(arrTarget.nodeTypeId);
+                const inType = sparkGraph.getInputTypeId(nodeDesc?.inputs, arrTarget.inputHandle);
+                const coerced = await coerceIfNeeded(typeId, inType, unwrap(raw));
+                wb.addNode({
+                    typeId: arrTarget.nodeTypeId,
+                    position: { x: pos.x + 180, y: pos.y },
+                }, { inputs: { [arrTarget.inputHandle]: coerced } });
+                return;
+            }
+            if (isArray && elemTarget) {
+                const nodeDesc = registry.nodes.get(elemTarget.nodeTypeId);
+                const inType = sparkGraph.getInputTypeId(nodeDesc?.inputs, elemTarget.inputHandle);
+                const src = unwrap(raw);
+                const items = Array.isArray(src) ? src : [src];
+                const coercedItems = await Promise.all(items.map((v) => coerceIfNeeded(baseTypeId, inType, v)));
+                const COLS = 4;
+                const DX = 180;
+                const DY = 160;
+                for (let idx = 0; idx < coercedItems.length; idx++) {
+                    const col = idx % COLS;
+                    const row = Math.floor(idx / COLS);
+                    wb.addNode({
+                        typeId: elemTarget.nodeTypeId,
+                        position: { x: pos.x + (col + 1) * DX, y: pos.y + row * DY },
+                    }, { inputs: { [elemTarget.inputHandle]: coercedItems[idx] } });
+                }
+                return;
+            }
+        }
+        catch { }
+    };
+    return {
+        onDelete: () => {
+            wb.removeNode(nodeId);
+            onClose();
+        },
+        onDuplicate: async () => {
+            const def = wb.export();
+            const n = def.nodes.find((n) => n.nodeId === nodeId);
+            if (!n)
+                return onClose();
+            const pos = wb.getPositions()[nodeId] || { x: 0, y: 0 };
+            const inboundHandles = new Set(def.edges
+                .filter((e) => e.target.nodeId === nodeId)
+                .map((e) => e.target.handle));
+            const allInputs = runner.getInputs(def)[nodeId] || {};
+            const inputsWithoutBindings = Object.fromEntries(Object.entries(allInputs).filter(([handle]) => !inboundHandles.has(handle)));
+            const newNodeId = wb.addNode({
+                typeId: n.typeId,
+                params: n.params,
+                position: { x: pos.x + 24, y: pos.y + 24 },
+                resolvedHandles: n.resolvedHandles,
+            }, {
+                inputs: inputsWithoutBindings,
+                copyOutputsFrom: nodeId,
+                dry: true,
+            });
+            // Select the newly duplicated node
+            wb.setSelection({
+                nodes: [newNodeId],
+                edges: [],
+            });
+            onClose();
+        },
+        onDuplicateWithEdges: async () => {
+            const def = wb.export();
+            const n = def.nodes.find((n) => n.nodeId === nodeId);
+            if (!n)
+                return onClose();
+            const pos = wb.getPositions()[nodeId] || { x: 0, y: 0 };
+            // Get inputs without bindings (literal values only)
+            const inputs = runner.getInputs(def)[nodeId] || {};
+            // Add the duplicated node
+            const newNodeId = wb.addNode({
+                typeId: n.typeId,
+                params: n.params,
+                position: { x: pos.x + 24, y: pos.y + 24 },
+                resolvedHandles: n.resolvedHandles,
+            }, {
+                inputs,
+                copyOutputsFrom: nodeId,
+                dry: true,
+            });
+            // Find all incoming edges (edges where target is the original node)
+            const incomingEdges = def.edges.filter((e) => e.target.nodeId === nodeId);
+            // Duplicate each incoming edge to point to the new node
+            for (const edge of incomingEdges) {
+                wb.connect({
+                    source: edge.source, // Keep the same source
+                    target: { nodeId: newNodeId, handle: edge.target.handle }, // Point to new node
+                    typeId: edge.typeId,
+                }, { dry: true });
+            }
+            // Select the newly duplicated node and edges
+            wb.setSelection({
+                nodes: [newNodeId],
+                edges: [],
+            });
+            onClose();
+        },
+        onRunPull: async () => {
+            try {
+                await runner.computeNode(nodeId);
+            }
+            catch { }
+            onClose();
+        },
+        onBake: async (handleId) => {
+            await doBake(handleId);
+            onClose();
+        },
+        onCopy: () => {
+            const copyHandler = createNodeCopyHandler(wb, runner, nodeId, getDefaultNodeSize, onCopyResult);
+            copyHandler();
+            onClose();
+        },
+        onCopyId: async () => {
+            try {
+                await navigator.clipboard.writeText(nodeId);
+            }
+            catch { }
+            onClose();
+        },
+        onClose,
+    };
+}
+/**
+ * Creates a copy handler that copies the current selection and optionally stores the result.
+ */
+function createCopyHandler(wb, runner, getDefaultNodeSize, onCopyResult) {
+    return () => {
+        const getNodeSize = getDefaultNodeSize
+            ? (nodeId, typeId) => getDefaultNodeSize(typeId)
+            : undefined;
+        const data = wb.copySelection(runner, getNodeSize);
+        if (onCopyResult) {
+            onCopyResult(data);
+        }
+    };
+}
+/**
+ * Creates a copy handler for a single node (temporarily selects it, copies, then restores selection).
+ */
+function createNodeCopyHandler(wb, runner, nodeId, getDefaultNodeSize, onCopyResult) {
+    return () => {
+        // Select the node first, then copy
+        const currentSelection = wb.getSelection();
+        wb.setSelection({ nodes: [nodeId], edges: [] });
+        const getNodeSize = getDefaultNodeSize
+            ? (nodeId, typeId) => getDefaultNodeSize(typeId)
+            : undefined;
+        const data = wb.copySelection(runner, getNodeSize);
+        // Restore original selection
+        wb.setSelection(currentSelection);
+        if (onCopyResult) {
+            onCopyResult(data);
+        }
+    };
+}
+/**
+ * Creates base selection context menu handlers.
+ */
+function createSelectionContextMenuHandlers(wb, onClose, getDefaultNodeSize, onCopyResult, runner) {
+    return {
+        onCopy: runner
+            ? createCopyHandler(wb, runner, getDefaultNodeSize, onCopyResult)
+            : () => {
+                // No-op if runner not available
+                onClose();
+            },
+        onDelete: () => {
+            wb.deleteSelection();
+            onClose();
+        },
+        onClose,
+    };
+}
+/**
+ * Creates base default context menu handlers.
+ */
+function createDefaultContextMenuHandlers(onAddNode, onClose, onPaste) {
+    return {
+        onAddNode,
+        onPaste,
+        onClose,
+    };
+}
+function getBakeableOutputs(nodeId, wb, registry, outputTypesMap) {
+    try {
+        const def = wb.export();
+        const node = def.nodes.find((n) => n.nodeId === nodeId);
+        if (!node)
+            return [];
+        const desc = registry.nodes.get(node.typeId);
+        const handles = Object.keys(desc?.outputs || {});
+        const out = [];
+        for (const h of handles) {
+            const tId = outputTypesMap?.[nodeId]?.[h];
+            if (!tId)
+                continue;
+            if (tId.endsWith("[]")) {
+                const base = tId.slice(0, -2);
+                const tArr = registry.types.get(tId);
+                const tElem = registry.types.get(base);
+                const arrT = tArr?.bakeTarget;
+                const elemT = tElem?.bakeTarget;
+                if ((arrT && registry.nodes.has(arrT.nodeTypeId)) ||
+                    (elemT && registry.nodes.has(elemT.nodeTypeId)))
+                    out.push(h);
+            }
+            else {
+                const t = registry.types.get(tId);
+                const bt = t?.bakeTarget;
+                if (bt && registry.nodes.has(bt.nodeTypeId))
+                    out.push(h);
+            }
+        }
+        return out;
+    }
+    catch {
+        return [];
+    }
+}
+
 function IssueBadge({ level, title, size = 12, className, }) {
     const colorClass = level === "error" ? "text-red-600" : "text-amber-600";
     return (jsxRuntime.jsx("button", { type: "button", className: `inline-flex items-center justify-center shrink-0 ${colorClass} ${className ?? ""}`, title: title, style: { width: size, height: size }, children: level === "error" ? (jsxRuntime.jsx(react$1.XCircleIcon, { size: size, weight: "fill" })) : (jsxRuntime.jsx(react$1.WarningCircleIcon, { size: size, weight: "fill" })) }));
@@ -3168,7 +3583,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 }), 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) => {
+    return (jsxRuntime.jsxs("div", { className: `${widthClass} border-l border-gray-300 p-3 flex flex-col h-full min-h-0 overflow-auto select-none`, 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] }), renderEdgeStatus(), jsxRuntime.jsx("div", { className: "mt-1", children: jsxRuntime.jsx("button", { className: "text-xs px-2 py-1 border border-red-300 rounded text-red-700 hover:bg-red-50", onClick: (e) => {
@@ -3236,7 +3651,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: 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("div", { className: "flex items-center gap-1 flex-1", children: [jsxRuntime.jsxs("select", { className: "border border-gray-300 rounded px-2 py-1 focus:outline-none focus:ring-2 focus:ring-blue-500 flex-1", 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("div", { className: "flex items-center gap-1 flex-1", children: [jsxRuntime.jsxs("select", { className: "border border-gray-300 rounded px-2 py-1 focus:outline-none focus:ring-2 focus:ring-blue-500 flex-1 select-text", value: current !== undefined && current !== null
                                                                     ? String(current)
                                                                     : "", onChange: (e) => {
                                                                     const val = e.target.value;
@@ -3250,7 +3665,7 @@ function Inspector({ debug, autoScroll, hideWorkbench, onAutoScrollChange, onHid
                                                                             ? `Default: ${placeholder}`
                                                                             : "(select)" }), 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", placeholder: placeholder
+                                                                        ?.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}`
                                                                     : undefined, value: displayValue, onChange: (e) => onChangeText(e.target.value), onBlur: commit, onKeyDown: (e) => {
                                                                     if (e.key === "Enter")
@@ -3503,6 +3918,13 @@ function DefaultContextMenu({ open, clientPos, handlers, registry, nodeIds, }) {
         handlers.onAddNode(typeId, { position: p });
         handlers.onClose();
     };
+    const handlePaste = () => {
+        if (!handlers.onPaste)
+            return;
+        const p = rf.screenToFlowPosition({ x: clientPos.x, y: clientPos.y });
+        handlers.onPaste(p);
+        handlers.onClose();
+    };
     const renderTree = (tree, path = []) => {
         const entries = Object.entries(tree?.__children ?? {}).sort((a, b) => a[0].localeCompare(b[0]));
         return (jsxRuntime.jsx("div", { children: entries.map(([key, child]) => {
@@ -3517,10 +3939,10 @@ function DefaultContextMenu({ open, clientPos, handlers, registry, nodeIds, }) {
                 return (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx("div", { className: "px-2 py-1 text-[11px] uppercase tracking-wide text-gray-400", children: label }), child.__self && (jsxRuntime.jsx("button", { onClick: () => handleClick(child.__self), className: "block w-full text-left px-3 py-1 hover:bg-gray-100 cursor-pointer", title: child.__self, children: label })), jsxRuntime.jsx("div", { className: "pl-2 border-l border-gray-200 ml-2", children: renderTree(child, [...path, key]) })] }, idKey));
             }) }));
     };
-    return (jsxRuntime.jsxs("div", { ref: ref, tabIndex: -1, className: "fixed z-[1000] bg-white border border-gray-300 rounded-none shadow-lg p-1 min-w-[180px] text-sm text-gray-700", style: { left: x, top: y }, onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), onWheel: (e) => e.stopPropagation(), onContextMenu: (e) => {
+    return (jsxRuntime.jsxs("div", { ref: ref, tabIndex: -1, className: "fixed z-[1000] bg-white border border-gray-300 rounded-lg shadow-lg p-1 min-w-[180px] text-sm text-gray-700 select-none", style: { left: x, top: y }, onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), onWheel: (e) => e.stopPropagation(), onContextMenu: (e) => {
             e.preventDefault();
             e.stopPropagation();
-        }, children: [jsxRuntime.jsxs("div", { className: "px-2 py-1 font-semibold text-gray-700", children: ["Add Node", " ", jsxRuntime.jsxs("span", { className: "text-gray-500 font-normal", children: ["(", totalCount, ")"] })] }), jsxRuntime.jsx("div", { className: "px-2 pb-1", children: jsxRuntime.jsx("input", { ref: inputRef, type: "text", value: query, onChange: (e) => setQuery(e.target.value), placeholder: "Filter nodes...", className: "w-full border border-gray-300 px-2 py-1 text-sm outline-none focus:border-gray-400", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), onWheel: (e) => e.stopPropagation() }) }), jsxRuntime.jsx("div", { className: "max-h-60 overflow-auto", children: totalCount > 0 ? (renderTree(root)) : (jsxRuntime.jsx("div", { className: "px-3 py-2 text-gray-400", children: "No matches" })) })] }));
+        }, children: [handlers.onPaste && (jsxRuntime.jsx("button", { className: "block w-full text-left px-2 py-1 hover:bg-gray-100 disabled:opacity-50 disabled:cursor-not-allowed", onClick: handlePaste, children: "Paste" })), handlers.onPaste && jsxRuntime.jsx("div", { className: "h-px bg-gray-200 my-1" }), jsxRuntime.jsxs("div", { className: "px-2 py-1 font-semibold text-gray-700", children: ["Add Node", " ", jsxRuntime.jsxs("span", { className: "text-gray-500 font-normal", children: ["(", totalCount, ")"] })] }), jsxRuntime.jsx("div", { className: "px-2 pb-1", children: jsxRuntime.jsx("input", { ref: inputRef, type: "text", value: query, onChange: (e) => setQuery(e.target.value), placeholder: "Filter nodes...", className: "w-full border border-gray-300 px-2 py-1 text-sm outline-none focus:border-gray-400 select-text", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), onWheel: (e) => e.stopPropagation() }) }), jsxRuntime.jsx("div", { className: "max-h-60 overflow-auto", children: totalCount > 0 ? (renderTree(root)) : (jsxRuntime.jsx("div", { className: "px-3 py-2 text-gray-400", children: "No matches" })) })] }));
 }
 
 function NodeContextMenu({ open, clientPos, nodeId, handlers, canRunPull, bakeableOutputs, }) {
@@ -3558,199 +3980,55 @@ function NodeContextMenu({ open, clientPos, nodeId, handlers, canRunPull, bakeab
     const x = Math.min(clientPos.x, (typeof window !== "undefined" ? window.innerWidth : 0) -
         (MENU_MIN_WIDTH + PADDING));
     const y = Math.min(clientPos.y, (typeof window !== "undefined" ? window.innerHeight : 0) - 240);
-    return (jsxRuntime.jsxs("div", { ref: ref, tabIndex: -1, className: "fixed z-[1000] bg-white border border-gray-300 rounded-lg shadow-lg p-1 min-w-[180px] text-sm text-gray-700", style: { left: x, top: y }, onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), onWheel: (e) => e.stopPropagation(), onContextMenu: (e) => {
+    return (jsxRuntime.jsxs("div", { ref: ref, tabIndex: -1, className: "fixed z-[1000] bg-white border border-gray-300 rounded-lg shadow-lg p-1 min-w-[180px] text-sm text-gray-700 select-none", style: { left: x, top: y }, onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), onWheel: (e) => e.stopPropagation(), onContextMenu: (e) => {
             e.preventDefault();
             e.stopPropagation();
-        }, children: [jsxRuntime.jsxs("div", { className: "px-2 py-1 font-semibold text-gray-700", children: ["Node (", nodeId, ")"] }), jsxRuntime.jsx("button", { className: "block w-full text-left px-2 py-1 hover:bg-gray-100", onClick: handlers.onDelete, children: "Delete" }), jsxRuntime.jsx("button", { className: "block w-full text-left px-2 py-1 hover:bg-gray-100", onClick: handlers.onDuplicate, children: "Duplicate" }), jsxRuntime.jsx("button", { className: "block w-full text-left px-2 py-1 hover:bg-gray-100", onClick: handlers.onDuplicateWithEdges, children: "Duplicate with edges" }), canRunPull && (jsxRuntime.jsx("button", { className: "block w-full text-left px-2 py-1 hover:bg-gray-100", onClick: handlers.onRunPull, children: "Run (pull)" })), jsxRuntime.jsx("div", { className: "h-px bg-gray-200 my-1" }), bakeableOutputs.length > 0 && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: "px-2 py-1 font-semibold text-gray-700", children: "Bake" }), bakeableOutputs.map((h) => (jsxRuntime.jsxs("button", { className: "block w-full text-left px-2 py-1 hover:bg-gray-100", onClick: () => handlers.onBake(h), children: ["Bake: ", h] }, h))), jsxRuntime.jsx("div", { className: "h-px bg-gray-200 my-1" })] })), jsxRuntime.jsx("button", { className: "block w-full text-left px-2 py-1 hover:bg-gray-100", onClick: handlers.onCopyId, children: "Copy Node ID" })] }));
+        }, children: [jsxRuntime.jsxs("div", { className: "px-2 py-1 font-semibold text-gray-700", children: ["Node (", nodeId, ")"] }), jsxRuntime.jsx("button", { className: "block w-full text-left px-2 py-1 hover:bg-gray-100", onClick: handlers.onDelete, children: "Delete" }), jsxRuntime.jsx("button", { className: "block w-full text-left px-2 py-1 hover:bg-gray-100", onClick: handlers.onDuplicate, children: "Duplicate" }), jsxRuntime.jsx("button", { className: "block w-full text-left px-2 py-1 hover:bg-gray-100", onClick: handlers.onDuplicateWithEdges, children: "Duplicate with edges" }), canRunPull && (jsxRuntime.jsx("button", { className: "block w-full text-left px-2 py-1 hover:bg-gray-100", onClick: handlers.onRunPull, children: "Run (pull)" })), jsxRuntime.jsx("div", { className: "h-px bg-gray-200 my-1" }), jsxRuntime.jsx("button", { className: "block w-full text-left px-2 py-1 hover:bg-gray-100", onClick: handlers.onCopy, children: "Copy" }), jsxRuntime.jsx("button", { className: "block w-full text-left px-2 py-1 hover:bg-gray-100", onClick: handlers.onCopyId, children: "Copy Node ID" }), bakeableOutputs.length > 0 && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: "h-px bg-gray-200 my-1" }), jsxRuntime.jsx("div", { className: "px-2 py-1 font-semibold text-gray-700", children: "Bake" }), bakeableOutputs.map((h) => (jsxRuntime.jsxs("button", { className: "block w-full text-left px-2 py-1 hover:bg-gray-100", onClick: () => handlers.onBake(h), children: ["Bake: ", h] }, h)))] }))] }));
 }
 
-function createNodeContextMenuHandlers(nodeId, wb, runner, registry, outputsMap, outputTypesMap, onClose) {
-    const doBake = async (handleId) => {
-        try {
-            const typeId = outputTypesMap?.[nodeId]?.[handleId];
-            const raw = outputsMap?.[nodeId]?.[handleId];
-            if (!typeId || raw === undefined)
-                return;
-            const unwrap = (v) => sparkGraph.isTypedOutput(v) ? sparkGraph.getTypedOutputValue(v) : v;
-            const coerceIfNeeded = async (fromType, toType, value) => {
-                if (!toType || toType === fromType || !runner?.coerce)
-                    return value;
-                try {
-                    return await runner.coerce(fromType, toType, value);
-                }
-                catch {
-                    return value;
-                }
-            };
-            const pos = wb.getPositions?.()[nodeId] || { x: 0, y: 0 };
-            const isArray = typeId.endsWith("[]");
-            const baseTypeId = isArray ? typeId.slice(0, -2) : typeId;
-            const tArr = isArray ? registry.types.get(typeId) : undefined;
-            const tElem = registry.types.get(baseTypeId);
-            const singleTarget = !isArray ? tElem?.bakeTarget : undefined;
-            const arrTarget = isArray ? tArr?.bakeTarget : undefined;
-            const elemTarget = isArray ? tElem?.bakeTarget : undefined;
-            if (singleTarget) {
-                const nodeDesc = registry.nodes.get(singleTarget.nodeTypeId);
-                const inType = sparkGraph.getInputTypeId(nodeDesc?.inputs, singleTarget.inputHandle);
-                const coerced = await coerceIfNeeded(typeId, inType, unwrap(raw));
-                wb.addNode({
-                    typeId: singleTarget.nodeTypeId,
-                    position: { x: pos.x + 180, y: pos.y },
-                }, { inputs: { [singleTarget.inputHandle]: coerced } });
-                return;
-            }
-            if (isArray && arrTarget) {
-                const nodeDesc = registry.nodes.get(arrTarget.nodeTypeId);
-                const inType = sparkGraph.getInputTypeId(nodeDesc?.inputs, arrTarget.inputHandle);
-                const coerced = await coerceIfNeeded(typeId, inType, unwrap(raw));
-                wb.addNode({
-                    typeId: arrTarget.nodeTypeId,
-                    position: { x: pos.x + 180, y: pos.y },
-                }, { inputs: { [arrTarget.inputHandle]: coerced } });
-                return;
-            }
-            if (isArray && elemTarget) {
-                const nodeDesc = registry.nodes.get(elemTarget.nodeTypeId);
-                const inType = sparkGraph.getInputTypeId(nodeDesc?.inputs, elemTarget.inputHandle);
-                const src = unwrap(raw);
-                const items = Array.isArray(src) ? src : [src];
-                const coercedItems = await Promise.all(items.map((v) => coerceIfNeeded(baseTypeId, inType, v)));
-                const COLS = 4;
-                const DX = 180;
-                const DY = 160;
-                for (let idx = 0; idx < coercedItems.length; idx++) {
-                    const col = idx % COLS;
-                    const row = Math.floor(idx / COLS);
-                    wb.addNode({
-                        typeId: elemTarget.nodeTypeId,
-                        position: { x: pos.x + (col + 1) * DX, y: pos.y + row * DY },
-                    }, { inputs: { [elemTarget.inputHandle]: coercedItems[idx] } });
-                }
+function SelectionContextMenu({ open, clientPos, handlers, }) {
+    const ref = React.useRef(null);
+    // Close on outside click and on ESC
+    React.useEffect(() => {
+        if (!open)
+            return;
+        const onDown = (e) => {
+            if (!ref.current)
                 return;
-            }
-        }
-        catch { }
-    };
-    return {
-        onDelete: () => {
-            wb.removeNode(nodeId);
-            onClose();
-        },
-        onDuplicate: async () => {
-            const def = wb.export();
-            const n = def.nodes.find((n) => n.nodeId === nodeId);
-            if (!n)
-                return onClose();
-            const pos = wb.getPositions?.()[nodeId] || { x: 0, y: 0 };
-            const inboundHandles = new Set(def.edges
-                .filter((e) => e.target.nodeId === nodeId)
-                .map((e) => e.target.handle));
-            const allInputs = runner.getInputs(def)[nodeId] || {};
-            const inputsWithoutBindings = Object.fromEntries(Object.entries(allInputs).filter(([handle]) => !inboundHandles.has(handle)));
-            wb.addNode({
-                typeId: n.typeId,
-                params: n.params,
-                position: { x: pos.x + 24, y: pos.y + 24 },
-                resolvedHandles: n.resolvedHandles,
-            }, {
-                inputs: inputsWithoutBindings,
-                copyOutputsFrom: nodeId,
-                dry: true,
-            });
-            onClose();
-        },
-        onDuplicateWithEdges: async () => {
-            const def = wb.export();
-            const n = def.nodes.find((n) => n.nodeId === nodeId);
-            if (!n)
-                return onClose();
-            const pos = wb.getPositions?.()[nodeId] || { x: 0, y: 0 };
-            // Get inputs without bindings (literal values only)
-            const inputs = runner.getInputs(def)[nodeId] || {};
-            // Add the duplicated node
-            const newNodeId = wb.addNode({
-                typeId: n.typeId,
-                params: n.params,
-                position: { x: pos.x + 24, y: pos.y + 24 },
-                resolvedHandles: n.resolvedHandles,
-            }, {
-                inputs,
-                copyOutputsFrom: nodeId,
-                dry: true,
-            });
-            // Find all incoming edges (edges where target is the original node)
-            const incomingEdges = def.edges.filter((e) => e.target.nodeId === nodeId);
-            // Duplicate each incoming edge to point to the new node
-            for (const edge of incomingEdges) {
-                wb.connect({
-                    source: edge.source, // Keep the same source
-                    target: { nodeId: newNodeId, handle: edge.target.handle }, // Point to new node
-                    typeId: edge.typeId,
-                }, { dry: true });
-            }
-            onClose();
-        },
-        onRunPull: async () => {
-            try {
-                await runner.computeNode(nodeId);
-            }
-            catch { }
-            onClose();
-        },
-        onBake: async (handleId) => {
-            await doBake(handleId);
-            onClose();
-        },
-        onCopyId: async () => {
-            try {
-                await navigator.clipboard.writeText(nodeId);
-            }
-            catch { }
-            onClose();
-        },
-        onClose,
-    };
-}
-function getBakeableOutputs(nodeId, wb, registry, outputTypesMap) {
-    try {
-        const def = wb.export();
-        const node = def.nodes.find((n) => n.nodeId === nodeId);
-        if (!node)
-            return [];
-        const desc = registry.nodes.get(node.typeId);
-        const handles = Object.keys(desc?.outputs || {});
-        const out = [];
-        for (const h of handles) {
-            const tId = outputTypesMap?.[nodeId]?.[h];
-            if (!tId)
-                continue;
-            if (tId.endsWith("[]")) {
-                const base = tId.slice(0, -2);
-                const tArr = registry.types.get(tId);
-                const tElem = registry.types.get(base);
-                const arrT = tArr?.bakeTarget;
-                const elemT = tElem?.bakeTarget;
-                if ((arrT && registry.nodes.has(arrT.nodeTypeId)) ||
-                    (elemT && registry.nodes.has(elemT.nodeTypeId)))
-                    out.push(h);
-            }
-            else {
-                const t = registry.types.get(tId);
-                const bt = t?.bakeTarget;
-                if (bt && registry.nodes.has(bt.nodeTypeId))
-                    out.push(h);
-            }
-        }
-        return out;
-    }
-    catch {
-        return [];
-    }
+            if (!ref.current.contains(e.target))
+                handlers.onClose();
+        };
+        const onKey = (e) => {
+            if (e.key === "Escape")
+                handlers.onClose();
+        };
+        window.addEventListener("mousedown", onDown, true);
+        window.addEventListener("keydown", onKey);
+        return () => {
+            window.removeEventListener("mousedown", onDown, true);
+            window.removeEventListener("keydown", onKey);
+        };
+    }, [open, handlers]);
+    React.useEffect(() => {
+        if (open)
+            ref.current?.focus();
+    }, [open]);
+    if (!open || !clientPos)
+        return null;
+    // Clamp menu position to viewport
+    const MENU_MIN_WIDTH = 180;
+    const PADDING = 16;
+    const x = Math.min(clientPos.x, (typeof window !== "undefined" ? window.innerWidth : 0) -
+        (MENU_MIN_WIDTH + PADDING));
+    const y = Math.min(clientPos.y, (typeof window !== "undefined" ? window.innerHeight : 0) - 100);
+    return (jsxRuntime.jsxs("div", { ref: ref, tabIndex: -1, className: "fixed z-[1000] bg-white border border-gray-300 rounded-lg shadow-lg p-1 min-w-[180px] text-sm text-gray-700 select-none", style: { left: x, top: y }, onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), onWheel: (e) => e.stopPropagation(), onContextMenu: (e) => {
+            e.preventDefault();
+            e.stopPropagation();
+        }, children: [jsxRuntime.jsx("div", { className: "px-2 py-1 font-semibold text-gray-700", children: "Selection" }), jsxRuntime.jsx("button", { className: "block w-full text-left px-2 py-1 hover:bg-gray-100", onClick: handlers.onCopy, children: "Copy" }), jsxRuntime.jsx("button", { className: "block w-full text-left px-2 py-1 hover:bg-gray-100", onClick: handlers.onDelete, children: "Delete" })] }));
 }
 
 const WorkbenchCanvas = React.forwardRef(({ showValues, toString, toElement, getDefaultNodeSize }, ref) => {
-    const { wb, registry, inputsMap, inputDefaultsMap, outputsMap, outputTypesMap, valuesTick, nodeStatus, edgeStatus, validationByNode, validationByEdge, uiVersion, runner, engineKind, } = useWorkbenchContext();
+    const { wb, registry, inputsMap, inputDefaultsMap, outputsMap, outputTypesMap, valuesTick, nodeStatus, edgeStatus, validationByNode, validationByEdge, uiVersion, runner, engineKind, overrides, } = useWorkbenchContext();
     const nodeValidation = validationByNode;
     const edgeValidation = validationByEdge.errors;
     const [registryVersion, setRegistryVersion] = React.useState(0);
@@ -3989,23 +4267,100 @@ const WorkbenchCanvas = React.forwardRef(({ showValues, toString, toElement, get
     const [nodeMenuOpen, setNodeMenuOpen] = React.useState(false);
     const [nodeMenuPos, setNodeMenuPos] = React.useState(null);
     const [nodeAtMenu, setNodeAtMenu] = React.useState(null);
+    const [selectionMenuPos, setSelectionMenuPos] = React.useState(null);
+    const [selectionMenuOpen, setSelectionMenuOpen] = React.useState(false);
+    // Compute the rectangular screen-space bounds of the current selection
+    const getSelectionScreenBounds = () => {
+        if (typeof document === "undefined")
+            return null;
+        const selection = wb.getSelection();
+        if (!selection.nodes.length)
+            return null;
+        let bounds = null;
+        for (const nodeId of selection.nodes) {
+            const el = document.querySelector(`.react-flow__node[data-id="${nodeId}"]`);
+            if (!el)
+                continue;
+            const rect = el.getBoundingClientRect();
+            if (!bounds) {
+                bounds = {
+                    left: rect.left,
+                    top: rect.top,
+                    right: rect.right,
+                    bottom: rect.bottom,
+                };
+            }
+            else {
+                bounds.left = Math.min(bounds.left, rect.left);
+                bounds.top = Math.min(bounds.top, rect.top);
+                bounds.right = Math.max(bounds.right, rect.right);
+                bounds.bottom = Math.max(bounds.bottom, rect.bottom);
+            }
+        }
+        return bounds;
+    };
     const onContextMenu = (e) => {
         e.preventDefault();
-        // Determine if right-clicked over a node by hit-testing selection
+        // First, check if the cursor is inside the rectangular bounds of the current selection
+        const selectionBounds = getSelectionScreenBounds();
+        if (selectionBounds) {
+            const { left, top, right, bottom } = selectionBounds;
+            if (e.clientX >= left &&
+                e.clientX <= right &&
+                e.clientY >= top &&
+                e.clientY <= bottom) {
+                setSelectionMenuPos({ x: e.clientX, y: e.clientY });
+                setSelectionMenuOpen(true);
+                setMenuOpen(false);
+                setNodeMenuOpen(false);
+                return;
+            }
+        }
+        // Determine if right-clicked over a node by hit-testing
         const target = e.target?.closest(".react-flow__node");
         if (target) {
             // Resolve node id from data-id attribute React Flow sets
             const nodeId = target.getAttribute("data-id");
-            setNodeAtMenu(nodeId);
-            setNodeMenuPos({ x: e.clientX, y: e.clientY });
-            setNodeMenuOpen(true);
-            setMenuOpen(false);
+            const selection = wb.getSelection();
+            const isSelected = nodeId && selection.nodes.includes(nodeId);
+            if (isSelected) {
+                // Right-clicked on a selected node - show selection menu
+                setSelectionMenuPos({ x: e.clientX, y: e.clientY });
+                setSelectionMenuOpen(true);
+                setMenuOpen(false);
+                setNodeMenuOpen(false);
+                return;
+            }
+            else {
+                // Right-clicked on a non-selected node - show node menu
+                setNodeAtMenu(nodeId);
+                setNodeMenuPos({ x: e.clientX, y: e.clientY });
+                setNodeMenuOpen(true);
+                setMenuOpen(false);
+                setSelectionMenuOpen(false);
+                return;
+            }
         }
-        else {
-            setMenuPos({ x: e.clientX, y: e.clientY });
-            setMenuOpen(true);
-            setNodeMenuOpen(false);
+        // Check if right-clicked on a selected edge
+        const edgeTarget = e.target?.closest(".react-flow__edge");
+        if (edgeTarget) {
+            const edgeId = edgeTarget.getAttribute("data-id");
+            const selection = wb.getSelection();
+            const isSelected = edgeId && selection.edges.includes(edgeId);
+            if (isSelected) {
+                // Right-clicked on a selected edge - show selection menu
+                setSelectionMenuPos({ x: e.clientX, y: e.clientY });
+                setSelectionMenuOpen(true);
+                setMenuOpen(false);
+                setNodeMenuOpen(false);
+                return;
+            }
         }
+        // Right-clicked on empty space - show default menu
+        setMenuPos({ x: e.clientX, y: e.clientY });
+        setMenuOpen(true);
+        setNodeMenuOpen(false);
+        setSelectionMenuOpen(false);
     };
     const addNodeAt = React.useCallback(async (typeId, opts) => wb.addNode({ typeId, position: opts.position }, { inputs: opts.inputs }), [wb]);
     const onCloseMenu = React.useCallback(() => {
@@ -4014,6 +4369,9 @@ const WorkbenchCanvas = React.forwardRef(({ showValues, toString, toElement, get
     const onCloseNodeMenu = React.useCallback(() => {
         setNodeMenuOpen(false);
     }, []);
+    const onCloseSelectionMenu = React.useCallback(() => {
+        setSelectionMenuOpen(false);
+    }, []);
     React.useEffect(() => {
         const off = runner.on("registry", () => {
             setRegistryVersion((v) => v + 1);
@@ -4021,14 +4379,32 @@ const WorkbenchCanvas = React.forwardRef(({ showValues, toString, toElement, get
         return () => off();
     }, [runner]);
     const nodeIds = React.useMemo(() => Array.from(registry.nodes.keys()), [registry, registryVersion]);
-    const defaultContextMenuHandlers = React.useMemo(() => ({
-        onAddNode: addNodeAt,
-        onClose: onCloseMenu,
-    }), [addNodeAt, onCloseMenu]);
+    const defaultContextMenuHandlers = React.useMemo(() => {
+        const baseHandlers = createDefaultContextMenuHandlers(addNodeAt, onCloseMenu);
+        if (overrides?.getDefaultContextMenuHandlers) {
+            return overrides.getDefaultContextMenuHandlers(wb, baseHandlers);
+        }
+        return baseHandlers;
+    }, [addNodeAt, onCloseMenu, overrides, wb]);
+    const selectionContextMenuHandlers = React.useMemo(() => {
+        const baseHandlers = createSelectionContextMenuHandlers(wb, onCloseSelectionMenu, overrides?.getDefaultNodeSize, undefined, // onCopyResult - will be provided by overrides
+        runner);
+        if (overrides?.getSelectionContextMenuHandlers) {
+            const selection = wb.getSelection();
+            return overrides.getSelectionContextMenuHandlers(wb, selection, baseHandlers, {
+                getDefaultNodeSize: overrides.getDefaultNodeSize,
+            });
+        }
+        return baseHandlers;
+    }, [wb, runner, overrides, onCloseSelectionMenu]);
     const nodeContextMenuHandlers = React.useMemo(() => {
         if (!nodeAtMenu)
             return null;
-        return createNodeContextMenuHandlers(nodeAtMenu, wb, runner, registry, outputsMap, outputTypesMap, onCloseNodeMenu);
+        const baseHandlers = createNodeContextMenuHandlers(nodeAtMenu, wb, runner, registry, outputsMap, outputTypesMap, onCloseNodeMenu, overrides?.getDefaultNodeSize);
+        if (overrides?.getNodeContextMenuHandlers) {
+            return overrides.getNodeContextMenuHandlers(wb, nodeAtMenu, baseHandlers);
+        }
+        return baseHandlers;
     }, [
         nodeAtMenu,
         wb,
@@ -4037,6 +4413,8 @@ const WorkbenchCanvas = React.forwardRef(({ showValues, toString, toElement, get
         outputsMap,
         outputTypesMap,
         onCloseNodeMenu,
+        overrides?.getDefaultNodeSize,
+        overrides?.getNodeContextMenuHandlers,
     ]);
     const canRunPull = React.useMemo(() => engineKind()?.toString() === "pull", [engineKind]);
     const bakeableOutputs = React.useMemo(() => {
@@ -4092,7 +4470,7 @@ const WorkbenchCanvas = React.forwardRef(({ showValues, toString, toElement, get
                     }
                 }, 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", fitView: true, 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 })) : (jsxRuntime.jsx(DefaultContextMenu, { open: menuOpen, clientPos: menuPos, handlers: defaultContextMenuHandlers, registry: registry, nodeIds: nodeIds })), !!nodeAtMenu &&
                         nodeContextMenuHandlers &&
-                        (NodeContextMenuRenderer ? (jsxRuntime.jsx(NodeContextMenuRenderer, { open: nodeMenuOpen, clientPos: nodeMenuPos, nodeId: nodeAtMenu, handlers: nodeContextMenuHandlers, canRunPull: canRunPull, bakeableOutputs: bakeableOutputs })) : (jsxRuntime.jsx(NodeContextMenu, { open: nodeMenuOpen, clientPos: nodeMenuPos, nodeId: nodeAtMenu, handlers: nodeContextMenuHandlers, canRunPull: canRunPull, bakeableOutputs: bakeableOutputs })))] }) }) }));
+                        (NodeContextMenuRenderer ? (jsxRuntime.jsx(NodeContextMenuRenderer, { open: nodeMenuOpen, clientPos: nodeMenuPos, nodeId: nodeAtMenu, handlers: nodeContextMenuHandlers, canRunPull: canRunPull, bakeableOutputs: bakeableOutputs })) : (jsxRuntime.jsx(NodeContextMenu, { open: nodeMenuOpen, clientPos: nodeMenuPos, nodeId: nodeAtMenu, handlers: nodeContextMenuHandlers, canRunPull: canRunPull, bakeableOutputs: bakeableOutputs }))), selectionMenuOpen && selectionMenuPos && (jsxRuntime.jsx(SelectionContextMenu, { open: selectionMenuOpen, clientPos: selectionMenuPos, handlers: selectionContextMenuHandlers }))] }) }) }));
 });
 
 function WorkbenchStudioCanvas({ setRegistry, autoScroll, onAutoScrollChange, example, onExampleChange, engine, onEngineChange, backendKind, onBackendKindChange, httpBaseUrl, onHttpBaseUrlChange, wsUrl, onWsUrlChange, debug, onDebugChange, showValues, onShowValuesChange, hideWorkbench, onHideWorkbenchChange, overrides, onInit, onChange, }) {
@@ -4646,12 +5024,18 @@ exports.WorkbenchProvider = WorkbenchProvider;
 exports.WorkbenchStudio = WorkbenchStudio;
 exports.computeEffectiveHandles = computeEffectiveHandles;
 exports.countVisibleHandles = countVisibleHandles;
+exports.createCopyHandler = createCopyHandler;
+exports.createDefaultContextMenuHandlers = createDefaultContextMenuHandlers;
 exports.createHandleBounds = createHandleBounds;
 exports.createHandleLayout = createHandleLayout;
+exports.createNodeContextMenuHandlers = createNodeContextMenuHandlers;
+exports.createNodeCopyHandler = createNodeCopyHandler;
+exports.createSelectionContextMenuHandlers = createSelectionContextMenuHandlers;
 exports.download = download;
 exports.estimateNodeSize = estimateNodeSize;
 exports.formatDataUrlAsLabel = formatDataUrlAsLabel;
 exports.formatDeclaredTypeSignature = formatDeclaredTypeSignature;
+exports.getBakeableOutputs = getBakeableOutputs;
 exports.getHandleBoundsX = getHandleBoundsX;
 exports.getHandleBoundsY = getHandleBoundsY;
 exports.getHandleClassName = getHandleClassName;