@mindlogic-ai/logician-ui 3.1.0 → 3.2.0-alpha.1

package/dist/components/Workflow/canvas/Canvas/Canvas.mjs

@@ -0,0 +1,529 @@
+"use client";
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useRef, useState, useCallback, useEffect } from 'react';
+import { Box } from '@chakra-ui/react';
+import { ReactFlowProvider, useReactFlow, applyNodeChanges, applyEdgeChanges, ReactFlow, ConnectionLineType, Background, MiniMap } from '@xyflow/react';
+import '@xyflow/react/dist/style.css';
+import { isValidConnection, soleEdgeToHandle, existingEdgeFromHandle } from '../../connectionRules.mjs';
+import { genId } from '../../createNode.mjs';
+import { estimateLabelOverhang, autoLayout } from '../../layout/autoLayout.mjs';
+import { useWorkflowKeyboard } from '../../useWorkflowKeyboard.mjs';
+import { resolveDefaultConfig } from '../../Workflow.types.mjs';
+import { useWorkflow, useWorkflowTranslate } from '../../WorkflowContext/WorkflowContext.mjs';
+import { GenericNode } from '../GenericNode/GenericNode.mjs';
+import { GraphErrorBanner } from '../GraphErrorBanner/GraphErrorBanner.mjs';
+import { NodePalette } from '../NodePalette/NodePalette.mjs';
+import { DRAG_MIME } from '../NodePalette/NodePalette.styles.mjs';
+import { NodePaletteToggle } from '../NodePalette/NodePaletteToggle.mjs';
+import { canvasSelectionCss, defaultEdgeOptions } from './Canvas.styles.mjs';
+import { CanvasControls } from './CanvasControls.mjs';
+import { LabeledEdge } from './LabeledEdge.mjs';
+
+// React Flow's `nodeTypes` prop — distinct from our domain "node type registry".
+// We use a unique key here ('workflow') rather than 'default' to avoid React
+// Flow's built-in default-node CSS (.react-flow__node-default: padding +
+// border + 150px width) rendering as a black box behind our NodeShell.
+const rfNodeTypes = { workflow: GenericNode };
+// React Flow edge type registry — `labeled` swaps the SVG `labelStyle`
+// path for a Chakra `Subtext` so the label inherits semantic typography.
+const rfEdgeTypes = { labeled: LabeledEdge };
+// Cap zoom so a tiny graph doesn't balloon, and pad so nodes don't touch the
+// edges. Shared between the initial `fitView` prop, the read-only re-fit, and
+// the post-auto-arrange re-fit so every framing settles the same way.
+const FIT_VIEW_OPTIONS = { maxZoom: 1.2, padding: 0.15 };
+// User-triggered re-fits (the fit-view button, the post-arrange reframe) glide
+// instead of teleporting, matching the error-banner jump's duration. The
+// initial mount and the read-only layout-settling re-fits stay instant — there
+// the viewport has no meaningful prior position to animate from.
+const ANIMATED_FIT_VIEW_OPTIONS = { ...FIT_VIEW_OPTIONS, duration: 400 };
+function graphToReactFlow(graph, isPinned, readOnly, selection) {
+    return {
+        nodes: graph.nodes.map((n) => ({
+            id: n.id,
+            type: 'workflow',
+            position: n.position,
+            data: { nodeId: n.id },
+            selected: n.id === selection.nodeId,
+            deletable: !readOnly && !isPinned(n.kind),
+        })),
+        edges: graph.edges.map((e) => ({
+            id: e.id,
+            source: e.source,
+            target: e.target,
+            sourceHandle: e.sourceHandle,
+            targetHandle: e.targetHandle,
+            label: e.label,
+            animated: false,
+            selected: e.id === selection.edgeId,
+            deletable: !readOnly,
+        })),
+    };
+}
+function CanvasInner({ showPalette, onNodeClick: onNodeClickHost, onEdgeClick: onEdgeClickHost, children, }) {
+    const { graph, dispatch, editor: { selectedNodeId, selectedEdgeId, runStates, drawerTarget }, setSelectedNodeId, setSelectedEdgeId, setDrawerTarget, revealInspector, getNodeType, onArrange, readOnly, issues, hostBridge, } = useWorkflow();
+    const wrapperRef = useRef(null);
+    // When a drag starts from an already-connected entry (input) handle, we grab
+    // that edge and re-route its source instead of laying down a duplicate. The
+    // ref carries the grabbed edge id from `onConnectStart` to `onConnect`.
+    const grabbedEntryEdgeRef = useRef(null);
+    const { screenToFlowPosition, getNodes, fitView } = useReactFlow();
+    // The palette is open by default; the floating `+` toggle (top-left) reopens
+    // it after the author collapses it via its header.
+    const [isPaletteOpen, setIsPaletteOpen] = useState(true);
+    const translate = useWorkflowTranslate();
+    // Tear off only the string lookup so `localizeDefaults` doesn't depend
+    // on the React-fragment interpolation path.
+    const t = useCallback((key, params) => translate(key, params), [translate]);
+    useWorkflowKeyboard();
+    const isPinned = useCallback((kind) => Boolean(getNodeType(kind)?.placement?.pinned), [getNodeType]);
+    // Local mirror of nodes/edges so React Flow can hold transient state —
+    // drag positions and selection — without our graph -> elements derivation
+    // snapping them back. We reseed when the graph reference changes.
+    const [displayNodes, setDisplayNodes] = useState(() => graphToReactFlow(graph, isPinned, readOnly, {
+        nodeId: selectedNodeId,
+        edgeId: selectedEdgeId,
+    }).nodes);
+    const [displayEdges, setDisplayEdges] = useState(() => graphToReactFlow(graph, isPinned, readOnly, {
+        nodeId: selectedNodeId,
+        edgeId: selectedEdgeId,
+    }).edges);
+    const lastSyncedGraphRef = useRef(graph);
+    useEffect(() => {
+        if (graph === lastSyncedGraphRef.current)
+            return;
+        lastSyncedGraphRef.current = graph;
+        const next = graphToReactFlow(graph, isPinned, readOnly, {
+            nodeId: selectedNodeId,
+            edgeId: selectedEdgeId,
+        });
+        setDisplayNodes(next.nodes);
+        setDisplayEdges(next.edges);
+    }, [graph, isPinned, readOnly, selectedNodeId, selectedEdgeId]);
+    // Mirror context selection (driven by node/edge clicks AND the edges sidebar)
+    // into React Flow's display state so a selection made outside the canvas —
+    // e.g. clicking an edge in the sidebar — highlights on the canvas too. Each
+    // updater is a no-op (returns `prev`) when nothing needs to change, so this
+    // can't loop with the `select` changes that flow back through onNodesChange.
+    useEffect(() => {
+        setDisplayNodes((prev) => prev.some((n) => Boolean(n.selected) !== (n.id === selectedNodeId))
+            ? prev.map((n) => Boolean(n.selected) === (n.id === selectedNodeId)
+                ? n
+                : { ...n, selected: n.id === selectedNodeId })
+            : prev);
+    }, [selectedNodeId]);
+    useEffect(() => {
+        setDisplayEdges((prev) => prev.some((e) => Boolean(e.selected) !== (e.id === selectedEdgeId))
+            ? prev.map((e) => Boolean(e.selected) === (e.id === selectedEdgeId)
+                ? e
+                : { ...e, selected: e.id === selectedEdgeId })
+            : prev);
+    }, [selectedEdgeId]);
+    // Animate the edges along the active path during a test run: an edge flows
+    // once its source node has produced output (`done`) and its target is engaged
+    // (`running`/`done`). Mirrors run state into the local edge state — which is
+    // only reseeded on graph changes — without disturbing positions or selection.
+    useEffect(() => {
+        setDisplayEdges((prev) => {
+            let changed = false;
+            const next = prev.map((e) => {
+                const active = runStates[e.source] === 'done' &&
+                    (runStates[e.target] === 'running' || runStates[e.target] === 'done');
+                if (Boolean(e.animated) === active)
+                    return e;
+                changed = true;
+                return { ...e, animated: active };
+            });
+            return changed ? next : prev;
+        });
+    }, [runStates]);
+    // React Flow's one-shot `fitView` prop only fits on first mount. In the
+    // read-only preview the container settles its size late (panel layout) and
+    // the graph can change underneath us — either one leaves the graph
+    // off-centre. Re-fit (deferred a frame so the new size is measured) on graph
+    // change and on container resize. Skipped while editing: it would fight the
+    // author's own panning and zooming.
+    useEffect(() => {
+        if (!readOnly)
+            return;
+        const raf = requestAnimationFrame(() => fitView(FIT_VIEW_OPTIONS));
+        return () => cancelAnimationFrame(raf);
+    }, [readOnly, fitView, displayNodes]);
+    useEffect(() => {
+        if (!readOnly)
+            return;
+        const el = wrapperRef.current;
+        if (!el)
+            return;
+        let raf = 0;
+        const observer = new ResizeObserver(() => {
+            cancelAnimationFrame(raf);
+            raf = requestAnimationFrame(() => fitView(FIT_VIEW_OPTIONS));
+        });
+        observer.observe(el);
+        return () => {
+            cancelAnimationFrame(raf);
+            observer.disconnect();
+        };
+    }, [readOnly, fitView]);
+    const onNodesChange = useCallback((changes) => {
+        // Keep React Flow's transient state (positions during drag, selection) local.
+        setDisplayNodes((prev) => applyNodeChanges(changes, prev));
+        for (const change of changes) {
+            // Only persist position on drag end — avoids 60fps validator churn.
+            if (change.type === 'position' && change.position && !change.dragging) {
+                dispatch({
+                    type: 'updateNodePosition',
+                    id: change.id,
+                    position: change.position,
+                });
+            }
+            if (change.type === 'remove') {
+                // Pinned nodes are not deletable in React Flow, but defense-in-depth:
+                // if a remove change for a pinned node ever leaks through, skip it
+                // AND skip the edge-removes for its endpoints to avoid orphaning.
+                const node = graph.nodes.find((n) => n.id === change.id);
+                const def = node ? getNodeType(node.kind) : undefined;
+                if (def?.placement?.pinned)
+                    continue;
+                dispatch({ type: 'deleteNode', id: change.id });
+            }
+            if (change.type === 'select') {
+                if (change.selected) {
+                    // Selecting a node clears any edge selection (single active target).
+                    setSelectedNodeId(change.id);
+                    setSelectedEdgeId(null);
+                    // Drag-select is the one selection path that doesn't go through a
+                    // click handler: keep an already-open inspector following the
+                    // selection (same invariant clicks maintain) instead of leaving it
+                    // on a now-deselected element. A closed drawer stays closed.
+                    if (drawerTarget &&
+                        (drawerTarget.type !== 'node' || drawerTarget.id !== change.id)) {
+                        setDrawerTarget({ type: 'node', id: change.id });
+                    }
+                }
+                else {
+                    setSelectedNodeId(null);
+                }
+            }
+        }
+    }, [
+        graph.nodes,
+        dispatch,
+        getNodeType,
+        setSelectedNodeId,
+        setSelectedEdgeId,
+        drawerTarget,
+        setDrawerTarget,
+    ]);
+    const onEdgesChange = useCallback((changes) => {
+        // Apply every change locally — crucially `select`, so an edge can enter
+        // the selected state that the Delete key binding acts on. Persist removals.
+        setDisplayEdges((prev) => applyEdgeChanges(changes, prev));
+        for (const change of changes) {
+            if (change.type === 'remove') {
+                dispatch({ type: 'deleteEdge', id: change.id });
+            }
+            if (change.type === 'select') {
+                if (change.selected) {
+                    // Selecting an edge clears node selection + opens it in the drawer.
+                    setSelectedEdgeId(change.id);
+                    setSelectedNodeId(null);
+                    setDrawerTarget({ type: 'edge', id: change.id });
+                }
+                else {
+                    setSelectedEdgeId(null);
+                }
+            }
+        }
+    }, [dispatch, setSelectedEdgeId, setSelectedNodeId, setDrawerTarget]);
+    const isValidConnection$1 = useCallback(
+    // React Flow may hand either a `Connection` or an existing `Edge`; both
+    // expose the same source/target/handle fields the validator reads.
+    (connection) => isValidConnection({
+        source: connection.source,
+        target: connection.target,
+        sourceHandle: connection.sourceHandle ?? null,
+        targetHandle: connection.targetHandle ?? null,
+    }, graph, getNodeType), [graph, getNodeType]);
+    // Dragging from a handle that already has an edge should move that edge, not
+    // stack a new one. React Flow grabs the *edge endpoint* this way already, but
+    // a drag from the handle port itself starts a fresh connection. For entries
+    // (which permit fan-in) we bridge that gap: if the drag begins on an input
+    // handle that holds exactly one edge, remember it so `onConnect` re-routes its
+    // source rather than adding a parallel edge. With zero or 2+ edges there's no
+    // single edge to grab, so we leave it to the normal add path.
+    const onConnectStart = useCallback((_event, { nodeId, handleId, handleType }) => {
+        grabbedEntryEdgeRef.current =
+            handleType === 'target' && nodeId
+                ? (soleEdgeToHandle(graph, getNodeType, nodeId, handleId ?? undefined)
+                    ?.id ?? null)
+                : null;
+    }, [graph, getNodeType]);
+    const onConnectEnd = useCallback(() => {
+        grabbedEntryEdgeRef.current = null;
+    }, []);
+    const onConnect = useCallback((connection) => {
+        if (!connection.source || !connection.target)
+            return;
+        // Defense-in-depth: enforce node-type rules even though React Flow also
+        // gates drags through `isValidConnection`.
+        if (!isValidConnection(connection, graph, getNodeType))
+            return;
+        const sourceHandle = connection.sourceHandle ?? undefined;
+        const targetHandle = connection.targetHandle ?? undefined;
+        // Drag started on an occupied entry: re-route that edge's source endpoint
+        // to the newly chosen source instead of adding a parallel edge. Apply the
+        // same single-edge-per-exit guard as a reconnect — if the new source exit
+        // already holds a different edge, bail so React Flow snaps back.
+        const grabbedId = grabbedEntryEdgeRef.current;
+        if (grabbedId) {
+            const occupant = existingEdgeFromHandle(graph, getNodeType, connection.source, sourceHandle);
+            if (!occupant || occupant.id === grabbedId) {
+                dispatch({
+                    type: 'reconnectEdge',
+                    id: grabbedId,
+                    source: connection.source,
+                    target: connection.target,
+                    sourceHandle,
+                    targetHandle,
+                });
+            }
+            return;
+        }
+        // An exit point holds at most one edge. Dragging a fresh connection from
+        // an exit that already has one MOVES that edge to the new target (keeping
+        // its id + label) rather than creating a second edge from the same point.
+        const existing = existingEdgeFromHandle(graph, getNodeType, connection.source, sourceHandle);
+        if (existing) {
+            dispatch({
+                type: 'reconnectEdge',
+                id: existing.id,
+                source: connection.source,
+                target: connection.target,
+                sourceHandle,
+                targetHandle,
+            });
+            return;
+        }
+        dispatch({
+            type: 'addEdge',
+            edge: {
+                id: genId('e'),
+                source: connection.source,
+                target: connection.target,
+                sourceHandle,
+                targetHandle,
+            },
+        });
+    }, [dispatch, graph, getNodeType]);
+    // React Flow reconnect lifecycle. `onReconnect` only mutates the edge on a
+    // valid commit; an invalid or empty drop is a no-op, so React Flow snaps the
+    // dragged endpoint back to its original handle and the edge stays intact.
+    // There's no success ref to track because we never tear down and recreate the
+    // edge — an unmutated edge needs nothing restored.
+    const onReconnect = useCallback((oldEdge, connection) => {
+        if (!connection.source || !connection.target)
+            return;
+        // Validate the new endpoints with the same rules as manual connect; an
+        // invalid drop is ignored so the original edge snaps back. `connection`
+        // here is React Flow's `Connection`, so narrow to the validator's shape.
+        const proposed = {
+            source: connection.source,
+            target: connection.target,
+            sourceHandle: connection.sourceHandle ?? null,
+            targetHandle: connection.targetHandle ?? null,
+        };
+        if (!isValidConnection(proposed, graph, getNodeType))
+            return;
+        // Keep the single-edge-per-exit invariant (same as `onConnect`): if the
+        // dragged source endpoint lands on an exit that already holds a different
+        // edge, reject so React Flow snaps back rather than stacking two edges on
+        // one handle. The edge being moved is excluded (a target-endpoint drag
+        // keeps the same source handle and would otherwise match itself).
+        const occupant = existingEdgeFromHandle(graph, getNodeType, connection.source, connection.sourceHandle ?? undefined);
+        if (occupant && occupant.id !== oldEdge.id)
+            return;
+        dispatch({
+            type: 'reconnectEdge',
+            id: oldEdge.id,
+            source: connection.source,
+            target: connection.target,
+            sourceHandle: connection.sourceHandle ?? undefined,
+            targetHandle: connection.targetHandle ?? undefined,
+        });
+    }, [dispatch, graph, getNodeType]);
+    // Single click selects the node AND opens its inspector drawer (no
+    // double-click needed). React Flow's own `select` change still fires and
+    // syncs `selectedNodeId`, but we set it here too so selection + drawer open
+    // atomically on the very first click.
+    const onNodeClick = useCallback((_, node) => {
+        setSelectedNodeId(node.id);
+        setSelectedEdgeId(null);
+        // revealInspector sets the drawer target (read by a mounted
+        // <NodeInspector>, and surfaced to the host via onSelectionChange).
+        revealInspector({ type: 'node', id: node.id });
+        // Convenience click hook for hosts driving UI outside the canvas.
+        const graphNode = graph.nodes.find((n) => n.id === node.id);
+        if (graphNode)
+            onNodeClickHost?.(graphNode);
+    }, [
+        setSelectedNodeId,
+        setSelectedEdgeId,
+        revealInspector,
+        graph,
+        onNodeClickHost,
+    ]);
+    // Single click selects the edge AND targets the inspector at it — the same
+    // surface nodes use — replacing the old left-sidebar edge list.
+    const onEdgeClick = useCallback((_, edge) => {
+        setSelectedEdgeId(edge.id);
+        setSelectedNodeId(null);
+        revealInspector({ type: 'edge', id: edge.id });
+        const graphEdge = graph.edges.find((e) => e.id === edge.id);
+        if (graphEdge)
+            onEdgeClickHost?.(graphEdge);
+    }, [
+        setSelectedEdgeId,
+        setSelectedNodeId,
+        revealInspector,
+        graph,
+        onEdgeClickHost,
+    ]);
+    const onPaneClick = useCallback(() => {
+        setSelectedNodeId(null);
+        setSelectedEdgeId(null);
+        setDrawerTarget(null);
+    }, [setSelectedNodeId, setSelectedEdgeId, setDrawerTarget]);
+    // One-click tidy: lay the graph out left-to-right and dispatch the new
+    // positions as a single (undoable) reposition. We feed dagre the REAL
+    // rendered node sizes from React Flow so variable-height cards pack tightly,
+    // falling back to card defaults for any node not yet measured — plus the
+    // trailing room a node's exit labels (e.g. Classify categories) need, since
+    // those overflow the measured card and would otherwise sit under the next
+    // rank's edges.
+    const onAutoArrange = useCallback(() => {
+        const nodesById = new Map(graph.nodes.map((n) => [n.id, n]));
+        const dimensions = {};
+        for (const n of getNodes()) {
+            const { width, height } = n.measured ?? {};
+            if (!width || !height)
+                continue;
+            const node = nodesById.get(n.id);
+            const def = node ? getNodeType(node.kind) : undefined;
+            const outputs = node && def ? def.handles(node.config).outputs : [];
+            const labels = outputs
+                .map((o) => o.label)
+                .filter((label) => Boolean(label));
+            dimensions[n.id] = {
+                width,
+                height,
+                trailing: estimateLabelOverhang(labels),
+            };
+        }
+        // The order each node paints its exits, so the layout can lay a fan-out's
+        // children out in exit order rather than wiring order (see `outputOrder`).
+        const outputOrder = {};
+        for (const node of graph.nodes) {
+            const def = getNodeType(node.kind);
+            if (!def)
+                continue;
+            outputOrder[node.id] = def.handles(node.config).outputs.map((o) => o.id);
+        }
+        const arranged = autoLayout(graph, dimensions, { outputOrder });
+        const positions = {};
+        let moved = false;
+        for (const n of arranged.nodes) {
+            positions[n.id] = n.position;
+            const current = nodesById.get(n.id)?.position;
+            if (current?.x !== n.position.x || current?.y !== n.position.y) {
+                moved = true;
+            }
+        }
+        // Already tidy — skip the dispatch AND the forced save so re-clicking a
+        // settled layout doesn't issue a redundant PUT or flip the draft to dirty.
+        if (!moved)
+            return;
+        dispatch({ type: 'arrangeNodes', positions });
+        // A pure reposition wouldn't autosave on its own; let the host persist the
+        // tidied layout so it survives a reload (see WorkflowProps.onArrange).
+        onArrange?.(arranged);
+        // Reframe once the moved nodes have painted.
+        window.requestAnimationFrame(() => fitView(ANIMATED_FIT_VIEW_OPTIONS));
+    }, [getNodes, graph, getNodeType, dispatch, onArrange, fitView]);
+    const onDragOver = useCallback((e) => {
+        if (!e.dataTransfer.types.includes(DRAG_MIME))
+            return;
+        e.preventDefault();
+        e.dataTransfer.dropEffect = 'move';
+    }, []);
+    const onDrop = useCallback((e) => {
+        e.preventDefault();
+        const kind = e.dataTransfer.getData(DRAG_MIME);
+        if (!kind)
+            return;
+        const def = getNodeType(kind);
+        if (!def)
+            return;
+        const position = screenToFlowPosition({ x: e.clientX, y: e.clientY });
+        const base = resolveDefaultConfig(def);
+        const overlay = def.localizeDefaults?.(t);
+        // Host-data overlay (e.g. a starting LLM picked from the tenant's live
+        // model list) — applied last so it wins over any static placeholder in
+        // `defaultConfig`. Keyed on the opaque `hostBridge`; the node type narrows
+        // it. Absent on a generic host, leaving the static defaults in place.
+        const bridged = def.hostDefaults?.(hostBridge);
+        const node = {
+            id: genId(kind),
+            kind,
+            position,
+            config: { ...base, ...overlay, ...bridged },
+        };
+        // Dropped nodes land unconnected — authors wire edges explicitly by
+        // dragging from an exit point.
+        dispatch({ type: 'addNode', node });
+    }, [dispatch, getNodeType, screenToFlowPosition, t, hostBridge]);
+    // Does the canvas top-left corner actually hold overlay chrome the zoom
+    // controls should tuck under? The palette toggle docks there when the palette
+    // is collapsed, and the error banner when the (editable) graph has issues. If
+    // neither is present the controls sit at the corner rather than floating below
+    // an empty gap. Read-only preview shows no chrome, so it's always corner-tight.
+    const topLeftChromePresent = !readOnly && ((showPalette && !isPaletteOpen) || issues.length > 0);
+    return (jsxs(Box, { display: "flex", flex: "1", minHeight: 0, height: "100%", 
+        // Tint the whole canvas region — not just the React Flow column — so the
+        // floating palette (left) and inspector (right) read as cards over a tinted
+        // surface instead of white sidebars. Read-only (version preview) drops to a
+        // neutral gray so the mode reads as "not your live workspace".
+        // Dark mode uses bg.canvas for both: primary.lightest's _dark is blue.900
+        // (#04102A), a saturated navy that overpowers the desaturated dark palette
+        // as a full-canvas fill, and slate.100's _dark sits ABOVE bg.surface, which
+        // would invert the node cards' lift. bg.canvas keeps the cards lifted in
+        // both modes; read-only is still cued by the absent editor chrome.
+        bgColor: {
+            base: readOnly ? 'slate.100' : 'primary.lightest',
+            _dark: 'bg.canvas',
+        }, children: [showPalette && isPaletteOpen ? (jsx(NodePalette, { onClose: () => setIsPaletteOpen(false) })) : null, jsxs(Box, { flex: "1", minWidth: 0, position: "relative", ref: wrapperRef, onDragOver: onDragOver, onDrop: onDrop, css: canvasSelectionCss, children: [jsxs(ReactFlow, { nodes: displayNodes, edges: displayEdges, nodeTypes: rfNodeTypes, edgeTypes: rfEdgeTypes, defaultEdgeOptions: defaultEdgeOptions, onNodesChange: onNodesChange, onEdgesChange: onEdgesChange, 
+                        // Match the live connection preview to the committed edge shape:
+                        // both render as angled (smooth-step) paths so releasing a drag
+                        // doesn't snap a curved preview into an angled edge.
+                        connectionLineType: ConnectionLineType.SmoothStep, onConnect: onConnect, onConnectStart: readOnly ? undefined : onConnectStart, onConnectEnd: readOnly ? undefined : onConnectEnd, onReconnect: readOnly ? undefined : onReconnect, onNodeClick: onNodeClick, onEdgeClick: onEdgeClick, onPaneClick: onPaneClick, isValidConnection: isValidConnection$1, nodesDraggable: !readOnly, nodesConnectable: !readOnly, elementsSelectable: true, 
+                        // The editor's selection model is a single node/edge (see
+                        // selectedNodeId / selectedEdgeId): disable React Flow's marquee and
+                        // modifier-click multi-select, which would visually select a group
+                        // only for the sync effects above to collapse it to one element.
+                        selectionKeyCode: null, multiSelectionKeyCode: null, edgesFocusable: !readOnly, 
+                        // Belt-and-suspenders on top of per-node `deletable: false`: also
+                        // disable the delete keyboard binding entirely in read-only mode.
+                        deleteKeyCode: readOnly ? null : ['Backspace', 'Delete'], 
+                        // Pan on scroll/trackpad (Figma-style) in addition to click-and-drag;
+                        // ⌘/Ctrl+scroll zooms. Enabled in read-only too: scroll is a viewing
+                        // action, and drag-to-pan is already allowed there — this just makes
+                        // the scroll gesture pan instead of zoom (whether the canvas captures
+                        // scroll at all is governed separately by `preventScrolling`).
+                        panOnScroll: true, fitView: true, fitViewOptions: FIT_VIEW_OPTIONS, proOptions: { hideAttribution: true }, children: [jsx(Background, {}), jsx(CanvasControls, { readOnly: readOnly, onAutoArrange: onAutoArrange, fitViewOptions: ANIMATED_FIT_VIEW_OPTIONS, topLeftChromePresent: topLeftChromePresent }), jsx(MiniMap, { pannable: true, zoomable: true, bgColor: "var(--chakra-colors-bg-surface)", nodeColor: "var(--chakra-colors-slate-200)", maskColor: "color-mix(in srgb, var(--chakra-colors-slate-100) 60%, transparent)" })] }), showPalette && !isPaletteOpen ? (jsx(NodePaletteToggle, { onOpen: () => setIsPaletteOpen(true) })) : null, jsx(GraphErrorBanner, { paletteToggleVisible: showPalette && !isPaletteOpen })] }), children] }));
+}
+function Canvas({ showPalette = true, onNodeClick, onEdgeClick, children, }) {
+    return (jsx(ReactFlowProvider, { children: jsx(CanvasInner, { showPalette: showPalette, onNodeClick: onNodeClick, onEdgeClick: onEdgeClick, children: children }) }));
+}
+
+export { Canvas };
+//# sourceMappingURL=Canvas.mjs.map

package/dist/components/Workflow/canvas/Canvas/Canvas.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Canvas.mjs","sources":["../../../../../src/components/Workflow/canvas/Canvas/Canvas.tsx"],"sourcesContent":[null],"names":["isValidConnection","isValidWorkflowConnection","_jsxs","_jsx"],"mappings":"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"}

package/dist/components/Workflow/canvas/Canvas/Canvas.styles.d.ts

@@ -0,0 +1,53 @@
+import { type DefaultEdgeOptions } from '@xyflow/react';
+/**
+ * Edge defaults. Stroke comes from a theme token (slate.700) via CSS var
+ * since React Flow takes SVG-style props, not Chakra ones. The label
+ * itself is rendered through the `labeled` custom edge so its
+ * typography uses the design system's semantic `Subtext` primitive —
+ * see `LabeledEdge.tsx`. The arrowhead makes each edge's direction
+ * self-describing rather than implied by left→right placement alone.
+ */
+export declare const defaultEdgeOptions: DefaultEdgeOptions;
+/**
+ * Selection outline for edges. React Flow toggles `.selected` on the
+ * edge group; we layer an outline on the path so the user gets visual
+ * feedback before pressing Delete. Scoped via the Canvas wrapper's
+ * `css` prop rather than a global stylesheet.
+ */
+export declare const canvasSelectionCss: {
+    '& .react-flow__handle::after': {
+        content: string;
+        position: string;
+        inset: string;
+    };
+    '& .react-flow__edge:hover .react-flow__edge-path': {
+        stroke: string;
+        strokeWidth: number;
+    };
+    '& .react-flow__edge.selected .react-flow__edge-path': {
+        stroke: string;
+        strokeWidth: number;
+        filter: string;
+    };
+    '& .react-flow__edge.selected .react-flow__edge-interaction': {
+        stroke: string;
+    };
+    '& .react-flow__controls': {
+        '--xy-controls-button-background-color': string;
+        '--xy-controls-button-background-color-hover': string;
+        '--xy-controls-button-color': string;
+        '--xy-controls-button-color-hover': string;
+        '--xy-controls-button-border-color': string;
+        '--xy-controls-box-shadow': string;
+        borderRadius: string;
+        border: string;
+        overflow: string;
+    };
+    '& .react-flow__controls-button svg': {
+        fill: string;
+    };
+    '& .react-flow__controls-button:disabled svg': {
+        opacity: number;
+    };
+};
+//# sourceMappingURL=Canvas.styles.d.ts.map

package/dist/components/Workflow/canvas/Canvas/Canvas.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Canvas.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Workflow/canvas/Canvas/Canvas.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,kBAAkB,EAAc,MAAM,eAAe,CAAC;AAEpE;;;;;;;GAOG;AACH,eAAO,MAAM,kBAAkB,EAAE,kBAYhC,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4D9B,CAAC"}