@flyingrobots/bijou 1.1.0 → 1.3.0

package/dist/core/components/dag.js

@@ -1,657 +1,13 @@
 import { resolveCtx } from '../resolve-ctx.js';
 import { isDagSource, isSlicedDagSource, arraySource, materialize, sliceSource } from './dag-source.js';
-import { graphemeWidth, segmentGraphemes } from '../text/grapheme.js';
-// ── Helpers ────────────────────────────────────────────────────────
-/**
- * Compute the visible display width of a string in terminal columns.
- * Delegates to `graphemeWidth` which handles ANSI escapes and wide characters.
- *
- * @param str - The string to measure.
- * @returns The visible column width.
- */
-function visibleLength(str) {
-    return graphemeWidth(str);
-}
-/**
- * Truncate a label to fit within a maximum visible width.
- * Strips ANSI escapes before measuring, truncates by grapheme cluster,
- * and appends an ellipsis character when truncation occurs.
- *
- * @param text - The label text to truncate.
- * @param maxLen - Maximum visible width in terminal columns.
- * @returns The possibly truncated label string.
- */
-function truncateLabel(text, maxLen) {
-    if (maxLen <= 0)
-        return '';
-    if (visibleLength(text) <= maxLen)
-        return text;
-    // Truncate by grapheme clusters, not code units
-    const clean = text.replace(/\x1b\[[0-9;]*m/g, '');
-    const graphemes = segmentGraphemes(clean);
-    let width = 0;
-    let result = '';
-    for (const g of graphemes) {
-        const gw = graphemeWidth(g);
-        if (width + gw > maxLen - 1)
-            break;
-        result += g;
-        width += gw;
-    }
-    return result + '\u2026';
-}
-// ── Layout: Layer Assignment ───────────────────────────────────────
-/**
- * Assign each node to a layer using longest-path layer assignment.
- *
- * Performs Kahn's topological sort to detect cycles, then assigns each
- * node to the layer one past its deepest parent. Root nodes (in-degree 0)
- * are placed on layer 0.
- *
- * @param nodes - The graph nodes to lay out.
- * @returns Map from node ID to its zero-based layer index.
- * @throws If the graph contains a cycle.
- */
-function assignLayers(nodes) {
-    const children = new Map();
-    const parents = new Map();
-    const inDegree = new Map();
-    const nodeIds = new Set(nodes.map(n => n.id));
-    for (const n of nodes) {
-        // Filter edges to only include targets that exist in the graph
-        children.set(n.id, (n.edges ?? []).filter(e => nodeIds.has(e)));
-        inDegree.set(n.id, 0);
-        if (!parents.has(n.id))
-            parents.set(n.id, []);
-    }
-    for (const n of nodes) {
-        for (const childId of children.get(n.id) ?? []) {
-            if (!parents.has(childId))
-                parents.set(childId, []);
-            parents.get(childId).push(n.id);
-            inDegree.set(childId, (inDegree.get(childId) ?? 0) + 1);
-        }
-    }
-    // Kahn's topological sort
-    const queue = [];
-    for (const [id, deg] of inDegree) {
-        if (deg === 0)
-            queue.push(id);
-    }
-    const topoOrder = [];
-    const visited = new Set();
-    while (queue.length > 0) {
-        const id = queue.shift();
-        if (visited.has(id))
-            continue;
-        visited.add(id);
-        topoOrder.push(id);
-        for (const childId of children.get(id) ?? []) {
-            const newDeg = (inDegree.get(childId) ?? 1) - 1;
-            inDegree.set(childId, newDeg);
-            if (newDeg === 0)
-                queue.push(childId);
-        }
-    }
-    if (topoOrder.length !== nodes.length) {
-        throw new Error('[bijou] dag(): cycle detected in graph');
-    }
-    // Longest-path layer assignment
-    const layerMap = new Map();
-    for (const id of topoOrder) {
-        const pars = parents.get(id) ?? [];
-        if (pars.length === 0) {
-            layerMap.set(id, 0);
-        }
-        else {
-            let maxParent = 0;
-            for (const p of pars) {
-                maxParent = Math.max(maxParent, layerMap.get(p) ?? 0);
-            }
-            layerMap.set(id, maxParent + 1);
-        }
-    }
-    return layerMap;
-}
-// ── Layout: Column Ordering ────────────────────────────────────────
-/**
- * Group node IDs into layer arrays indexed by layer number.
- *
- * @param nodes - All graph nodes.
- * @param layerMap - Map from node ID to layer index (from `assignLayers`).
- * @returns Array of layers, where each layer is an array of node IDs.
- */
-function buildLayerArrays(nodes, layerMap) {
-    let maxLayer = 0;
-    for (const v of layerMap.values()) {
-        if (v > maxLayer)
-            maxLayer = v;
-    }
-    const layers = Array.from({ length: maxLayer + 1 }, () => []);
-    for (const n of nodes) {
-        const l = layerMap.get(n.id);
-        if (l !== undefined)
-            layers[l].push(n.id);
-    }
-    return layers;
-}
-/**
- * Reorder nodes within each layer to minimize edge crossings.
- *
- * Uses the barycenter heuristic with one top-down pass followed by
- * one bottom-up pass. Mutates the `layers` arrays in place.
- *
- * @param layers - Layer arrays from `buildLayerArrays`, mutated in place.
- * @param nodes - All graph nodes (used to build adjacency maps).
- */
-function orderColumns(layers, nodes) {
-    const childrenMap = new Map();
-    const parentsMap = new Map();
-    for (const n of nodes) {
-        childrenMap.set(n.id, n.edges ?? []);
-        if (!parentsMap.has(n.id))
-            parentsMap.set(n.id, []);
-    }
-    for (const n of nodes) {
-        for (const c of n.edges ?? []) {
-            if (!parentsMap.has(c))
-                parentsMap.set(c, []);
-            parentsMap.get(c).push(n.id);
-        }
-    }
-    // Top-down pass
-    for (let l = 1; l < layers.length; l++) {
-        const prevLayer = layers[l - 1];
-        const curLayer = layers[l];
-        const prevIndex = new Map();
-        for (let i = 0; i < prevLayer.length; i++) {
-            prevIndex.set(prevLayer[i], i);
-        }
-        const bary = new Map();
-        for (const id of curLayer) {
-            const pars = (parentsMap.get(id) ?? []).filter(p => prevIndex.has(p));
-            if (pars.length === 0) {
-                bary.set(id, Infinity);
-            }
-            else {
-                const avg = pars.reduce((s, p) => s + (prevIndex.get(p) ?? 0), 0) / pars.length;
-                bary.set(id, avg);
-            }
-        }
-        curLayer.sort((a, b) => (bary.get(a) ?? Infinity) - (bary.get(b) ?? Infinity));
-    }
-    // Bottom-up pass
-    for (let l = layers.length - 2; l >= 0; l--) {
-        const nextLayer = layers[l + 1];
-        const curLayer = layers[l];
-        const nextIndex = new Map();
-        for (let i = 0; i < nextLayer.length; i++) {
-            nextIndex.set(nextLayer[i], i);
-        }
-        const bary = new Map();
-        for (const id of curLayer) {
-            const chlds = (childrenMap.get(id) ?? []).filter(c => nextIndex.has(c));
-            if (chlds.length === 0) {
-                bary.set(id, Infinity);
-            }
-            else {
-                const avg = chlds.reduce((s, c) => s + (nextIndex.get(c) ?? 0), 0) / chlds.length;
-                bary.set(id, avg);
-            }
-        }
-        curLayer.sort((a, b) => (bary.get(a) ?? Infinity) - (bary.get(b) ?? Infinity));
-    }
-}
-/**
- * Lookup table mapping sorted direction-set keys to Unicode box-drawing characters.
- * For example, `'DR'` maps to `\u250c` (top-left corner).
- */
-const JUNCTION = {
-    'D': '\u2502', 'U': '\u2502', 'DU': '\u2502',
-    'L': '\u2500', 'R': '\u2500', 'LR': '\u2500',
-    'DR': '\u250c', 'DL': '\u2510', 'RU': '\u2514', 'LU': '\u2518',
-    'DRU': '\u251c', 'DLU': '\u2524', 'DLR': '\u252c', 'LRU': '\u2534',
-    'DLRU': '\u253c',
-};
-/**
- * Select the Unicode box-drawing character for a cell based on its edge directions.
- *
- * @param dirs - Set of cardinal directions passing through this cell.
- * @returns The appropriate box-drawing character, or `\u253c` (cross) as fallback.
- */
-function junctionChar(dirs) {
-    const key = [...dirs].sort().join('');
-    return JUNCTION[key] ?? '\u253c';
-}
-/**
- * Allocate an empty edge-routing grid.
- *
- * @param rows - Number of rows in the grid.
- * @param cols - Number of columns in the grid.
- * @returns A fresh `GridState` with empty direction sets for every cell.
- */
-function createGrid(rows, cols) {
-    const dirs = [];
-    for (let r = 0; r < rows; r++) {
-        const row = [];
-        for (let c = 0; c < cols; c++) {
-            row.push(new Set());
-        }
-        dirs.push(row);
-    }
-    return { dirs, arrows: new Set(), rows, cols };
-}
-/**
- * Add direction markers to a single grid cell. Bounds-checked.
- *
- * @param g - The grid state to mutate.
- * @param r - Row index.
- * @param c - Column index.
- * @param ds - One or more directions to mark in this cell.
- */
-function markDir(g, r, c, ...ds) {
-    if (r >= 0 && r < g.rows && c >= 0 && c < g.cols) {
-        const cell = g.dirs[r][c];
-        for (const d of ds)
-            cell.add(d);
-    }
-}
-/**
- * Route a single edge through the grid between two node positions.
- *
- * Draws a vertical segment from the source, an optional horizontal jog
- * if the columns differ, then a vertical segment down to the target.
- * Records an arrowhead position just above the destination node.
- *
- * @param g - The grid state to mutate.
- * @param fromCol - Column index of the source node.
- * @param fromLayer - Layer index of the source node.
- * @param toCol - Column index of the destination node.
- * @param toLayer - Layer index of the destination node.
- * @param RS - Row stride (number of grid rows per layer).
- * @param colCenter - Function mapping a column index to its center grid column.
- */
-function markEdge(g, fromCol, fromLayer, toCol, toLayer, RS, colCenter) {
-    const srcC = colCenter(fromCol);
-    const dstC = colCenter(toCol);
-    const sRow = fromLayer * RS + 3;
-    const dRow = toLayer * RS - 1; // one row above dest box
-    const mid = sRow + 1;
-    if (srcC === dstC) {
-        for (let r = sRow; r < dRow; r++)
-            markDir(g, r, srcC, 'D', 'U');
-    }
-    else {
-        markDir(g, sRow, srcC, 'D', 'U');
-        markDir(g, mid, srcC, srcC < dstC ? 'R' : 'L', 'U');
-        const minC = Math.min(srcC, dstC);
-        const maxC = Math.max(srcC, dstC);
-        for (let c = minC + 1; c < maxC; c++)
-            markDir(g, mid, c, 'L', 'R');
-        markDir(g, mid, dstC, srcC < dstC ? 'L' : 'R', 'D');
-        for (let r = mid + 1; r < dRow; r++)
-            markDir(g, r, dstC, 'D', 'U');
-    }
-    g.arrows.add(dRow * 10000 + dstC);
-}
-/**
- * Render a single node as a three-line Unicode box.
- *
- * Ghost nodes use dashed borders. The label is truncated to fit and a
- * badge (if present) is right-aligned within the box.
- *
- * @param label - The node label text.
- * @param badgeText - Optional badge text displayed to the right of the label.
- * @param width - Total character width of the box (including borders).
- * @param ghost - Whether to render with dashed (ghost) border characters.
- * @returns The rendered box lines and per-character type map.
- */
-function renderNodeBox(label, badgeText, width, ghost) {
-    const h = ghost ? '\u254c' : '\u2500';
-    const v = ghost ? '\u254e' : '\u2502';
-    const innerW = width - 2;
-    const contentW = innerW - 2;
-    let content;
-    let midTypes;
-    if (badgeText) {
-        const maxLabelW = contentW - visibleLength(badgeText) - 1;
-        const tLabel = truncateLabel(label, maxLabelW);
-        const gap = Math.max(1, contentW - visibleLength(tLabel) - visibleLength(badgeText));
-        content = tLabel + ' '.repeat(gap) + badgeText;
-        // Build char-type map for mid line: border + pad + label + gap + badge + pad + border
-        // Use segmentGraphemes for correct grapheme cluster counting.
-        midTypes = ['border']; // v
-        midTypes.push('pad'); // space
-        for (let i = 0; i < segmentGraphemes(tLabel).length; i++)
-            midTypes.push('label');
-        for (let i = 0; i < gap; i++)
-            midTypes.push('pad');
-        for (let i = 0; i < segmentGraphemes(badgeText).length; i++)
-            midTypes.push('badge');
-    }
-    else {
-        content = truncateLabel(label, contentW);
-        // Build char-type map for mid line: border + pad + label + pad + border
-        midTypes = ['border']; // v
-        midTypes.push('pad'); // space
-        for (let i = 0; i < segmentGraphemes(content).length; i++)
-            midTypes.push('label');
-    }
-    const padRight = Math.max(0, contentW - visibleLength(content));
-    for (let i = 0; i < padRight; i++)
-        midTypes.push('pad');
-    midTypes.push('pad'); // trailing space
-    midTypes.push('border'); // v
-    const top = '\u256d' + h.repeat(innerW) + '\u256e';
-    const mid = v + ' ' + content + ' '.repeat(padRight) + ' ' + v;
-    const bot = '\u2570' + h.repeat(innerW) + '\u256f';
-    const borderLine = Array.from({ length: width }, () => 'border');
-    return {
-        lines: [top, mid, bot],
-        charTypes: [borderLine, midTypes, borderLine],
-    };
-}
-// ── Interactive Renderer ───────────────────────────────────────────
-/**
- * Render the full interactive (styled) DAG layout.
- *
- * Performs the complete layout pipeline: layer assignment, column ordering,
- * edge routing, node box rendering, highlight/selection styling, and ANSI
- * serialization into a final string.
- *
- * @param nodes - The graph nodes to render.
- * @param options - Rendering options (tokens, selection, sizing).
- * @param ctx - The resolved bijou context.
- * @returns The rendered output string, node position map, and grid dimensions.
- */
-function renderInteractiveLayout(nodes, options, ctx) {
-    if (nodes.length === 0)
-        return { output: '', nodes: new Map(), width: 0, height: 0 };
-    const nodeMap = new Map();
-    for (const n of nodes)
-        nodeMap.set(n.id, n);
-    const layerMap = assignLayers(nodes);
-    const layers = buildLayerArrays(nodes, layerMap);
-    orderColumns(layers, nodes);
-    const colIndex = new Map();
-    for (const layer of layers) {
-        for (let i = 0; i < layer.length; i++) {
-            colIndex.set(layer[i], i);
-        }
-    }
-    let maxNodesPerLayer = 1;
-    for (const layer of layers) {
-        if (layer.length > maxNodesPerLayer)
-            maxNodesPerLayer = layer.length;
-    }
-    const maxWidth = options.maxWidth ?? ctx.runtime.columns;
-    let nodeWidth = options.nodeWidth ?? Math.max(...nodes.map(n => visibleLength(n.label) + (n.badge ? visibleLength(n.badge) + 2 : 0) + 4), 16);
-    let gap = 4;
-    let colStride = nodeWidth + gap;
-    let totalWidth = maxNodesPerLayer * colStride;
-    if (totalWidth > maxWidth && !options.nodeWidth) {
-        gap = 2;
-        colStride = nodeWidth + gap;
-        totalWidth = maxNodesPerLayer * colStride;
-    }
-    if (totalWidth > maxWidth && !options.nodeWidth) {
-        nodeWidth = Math.max(16, Math.floor((maxWidth - gap) / maxNodesPerLayer) - gap);
-        colStride = nodeWidth + gap;
-        totalWidth = maxNodesPerLayer * colStride;
-    }
-    const RS = 6;
-    const gridRows = layers.length * RS;
-    const gridCols = totalWidth;
-    const colCenter = (c) => c * colStride + Math.floor(nodeWidth / 2);
-    const g = createGrid(gridRows, gridCols);
-    // Mark edges
-    for (const n of nodes) {
-        const fLayer = layerMap.get(n.id);
-        const fCol = colIndex.get(n.id);
-        if (fLayer === undefined || fCol === undefined)
-            continue;
-        for (const childId of n.edges ?? []) {
-            const tLayer = layerMap.get(childId);
-            const tCol = colIndex.get(childId);
-            if (tLayer === undefined || tCol === undefined)
-                continue;
-            markEdge(g, fCol, fLayer, tCol, tLayer, RS, colCenter);
-        }
-    }
-    // Build output grids
-    const charGrid = [];
-    const tokenGrid = [];
-    for (let r = 0; r < gridRows; r++) {
-        const charRow = [];
-        const tokenRow = [];
-        for (let c = 0; c < gridCols; c++) {
-            charRow.push(' ');
-            tokenRow.push(null);
-        }
-        charGrid.push(charRow);
-        tokenGrid.push(tokenRow);
-    }
-    // Write edge characters
-    const edgeToken = options.edgeToken ?? ctx.theme.theme.border.muted;
-    for (let r = 0; r < gridRows; r++) {
-        for (let c = 0; c < gridCols; c++) {
-            const cell = g.dirs[r][c];
-            if (cell.size > 0) {
-                charGrid[r][c] = junctionChar(cell);
-                tokenGrid[r][c] = edgeToken;
-            }
-        }
-    }
-    // Write arrowheads
-    for (const encoded of g.arrows) {
-        const r = Math.floor(encoded / 10000);
-        const c = encoded % 10000;
-        if (r >= 0 && r < gridRows && c >= 0 && c < gridCols) {
-            charGrid[r][c] = '\u25bc';
-            tokenGrid[r][c] = edgeToken;
-        }
-    }
-    // Highlight edges
-    const highlightSet = new Set(options.highlightPath ?? []);
-    if (options.highlightPath && options.highlightToken) {
-        const hlToken = options.highlightToken;
-        const path = options.highlightPath;
-        for (let i = 0; i < path.length - 1; i++) {
-            const fromId = path[i];
-            const toId = path[i + 1];
-            const fLayer = layerMap.get(fromId);
-            const tLayer = layerMap.get(toId);
-            const fCol = colIndex.get(fromId);
-            const tCol = colIndex.get(toId);
-            if (fLayer === undefined || tLayer === undefined || fCol === undefined || tCol === undefined)
-                continue;
-            const srcC = colCenter(fCol);
-            const dstC = colCenter(tCol);
-            const sRow = fLayer * RS + 3;
-            const dRow = tLayer * RS - 1;
-            const midRow = sRow + 1;
-            if (srcC === dstC) {
-                for (let r = sRow; r <= dRow && r < gridRows; r++) {
-                    if (srcC < gridCols)
-                        tokenGrid[r][srcC] = hlToken;
-                }
-            }
-            else {
-                if (sRow < gridRows && srcC < gridCols)
-                    tokenGrid[sRow][srcC] = hlToken;
-                const minC = Math.min(srcC, dstC);
-                const maxC2 = Math.max(srcC, dstC);
-                if (midRow < gridRows) {
-                    for (let c = minC; c <= maxC2 && c < gridCols; c++) {
-                        tokenGrid[midRow][c] = hlToken;
-                    }
-                }
-                for (let r = midRow; r <= dRow && r < gridRows; r++) {
-                    if (dstC < gridCols)
-                        tokenGrid[r][dstC] = hlToken;
-                }
-            }
-        }
-    }
-    // Write node boxes
-    const positions = new Map();
-    for (const n of nodes) {
-        const layer = layerMap.get(n.id);
-        const col = colIndex.get(n.id);
-        if (layer === undefined || col === undefined)
-            continue;
-        const startCol = col * colStride;
-        const startRow = layer * RS;
-        positions.set(n.id, { row: startRow, col: startCol, width: nodeWidth, height: 3 });
-        const box = renderNodeBox(n.label, n.badge, nodeWidth, n._ghost === true);
-        let nToken;
-        if (options.selectedId === n.id) {
-            nToken = options.selectedToken ?? ctx.theme.theme.ui.cursor;
-        }
-        else if (highlightSet.has(n.id) && options.highlightToken) {
-            nToken = options.highlightToken;
-        }
-        else if (n.token) {
-            nToken = n.token;
-        }
-        else {
-            nToken = options.nodeToken ?? ctx.theme.theme.border.primary;
-        }
-        for (let lineIdx = 0; lineIdx < box.lines.length; lineIdx++) {
-            const row = startRow + lineIdx;
-            if (row >= gridRows)
-                continue;
-            const line = box.lines[lineIdx];
-            const types = box.charTypes[lineIdx];
-            const chars = segmentGraphemes(line);
-            for (let ci = 0; ci < chars.length; ci++) {
-                const gc = startCol + ci;
-                if (gc < gridCols) {
-                    charGrid[row][gc] = chars[ci];
-                    const charType = types[ci];
-                    if (charType === 'label' && n.labelToken) {
-                        tokenGrid[row][gc] = n.labelToken;
-                    }
-                    else if (charType === 'badge' && n.badgeToken) {
-                        tokenGrid[row][gc] = n.badgeToken;
-                    }
-                    else {
-                        tokenGrid[row][gc] = nToken;
-                    }
-                }
-            }
-        }
-    }
-    // Serialize
-    const lines = [];
-    for (let r = 0; r < gridRows; r++) {
-        let line = '';
-        let prevToken = null;
-        let run = '';
-        for (let c = 0; c < gridCols; c++) {
-            const ch = charGrid[r][c];
-            const tk = tokenGrid[r][c];
-            if (tk === prevToken || (tk === null && prevToken === null)) {
-                run += ch;
-            }
-            else {
-                if (run) {
-                    line += prevToken ? ctx.style.styled(prevToken, run) : run;
-                }
-                run = ch;
-                prevToken = tk;
-            }
-        }
-        if (run) {
-            line += prevToken ? ctx.style.styled(prevToken, run) : run;
-        }
-        lines.push(line.replace(/\s+$/, ''));
-    }
-    while (lines.length > 0 && lines[lines.length - 1].trim() === '') {
-        lines.pop();
-    }
-    return { output: lines.join('\n'), nodes: positions, width: gridCols, height: gridRows };
-}
-// ── Pipe Renderer ──────────────────────────────────────────────────
-/**
- * Render the graph as plain text for piped (non-TTY) output.
- *
- * Produces one line per node in the format `Label -> Target1, Target2`
- * with no ANSI styling or box-drawing characters.
- *
- * @param nodes - The graph nodes to render.
- * @returns Plain text representation of the graph.
- */
-function renderPipe(nodes) {
-    if (nodes.length === 0)
-        return '';
-    const lines = [];
-    for (const n of nodes) {
-        const edges = n.edges ?? [];
-        const badgePart = n.badge ? ` (${n.badge})` : '';
-        if (edges.length > 0) {
-            const targets = edges
-                .map(id => {
-                const target = nodes.find(t => t.id === id);
-                return target ? target.label : id;
-            })
-                .join(', ');
-            lines.push(`${n.label}${badgePart} -> ${targets}`);
-        }
-        else {
-            lines.push(`${n.label}${badgePart}`);
-        }
-    }
-    return lines.join('\n');
-}
-// ── Accessible Renderer ────────────────────────────────────────────
-/**
- * Render the graph as structured accessible text.
- *
- * Produces a summary header ("Graph: N nodes, M edges") followed by
- * layer-grouped node listings with edge descriptions.
- *
- * @param nodes - The graph nodes to render.
- * @param layerMap - Map from node ID to layer index.
- * @returns Accessible text representation of the graph.
- */
-function renderAccessible(nodes, layerMap) {
-    if (nodes.length === 0)
-        return 'Graph: 0 nodes, 0 edges';
-    const totalEdges = nodes.reduce((s, n) => s + (n.edges?.length ?? 0), 0);
-    const lines = [`Graph: ${nodes.length} nodes, ${totalEdges} edges`, ''];
-    const layers = buildLayerArrays(nodes, layerMap);
-    const nodeMap = new Map();
-    for (const n of nodes)
-        nodeMap.set(n.id, n);
-    for (let l = 0; l < layers.length; l++) {
-        lines.push(`Layer ${l + 1}:`);
-        for (const id of layers[l]) {
-            const n = nodeMap.get(id);
-            if (!n)
-                continue;
-            const badgePart = n.badge ? ` (${n.badge})` : '';
-            const edges = (n.edges ?? []).filter(e => nodeMap.has(e));
-            if (edges.length > 0) {
-                const targets = edges.map(e => nodeMap.get(e)?.label ?? e).join(', ');
-                lines.push(`  ${n.label}${badgePart} -> ${targets}`);
-            }
-            else {
-                lines.push(`  ${n.label}${badgePart} (end)`);
-            }
-        }
-        lines.push('');
-    }
-    while (lines.length > 0 && lines[lines.length - 1] === '')
-        lines.pop();
-    return lines.join('\n');
-}
+import { assignLayers } from './dag-layout.js';
+import { renderInteractiveLayout, renderPipe, renderAccessible } from './dag-render.js';
 export function dagSlice(input, focus, opts) {
     if (isDagSource(input)) {
         return sliceSource(input, focus, opts);
     }
     // Array path: wrap, slice, materialize back for backward compat
-    const source = arraySource(input);
+    const source = arraySource([...input]);
     return materialize(sliceSource(source, focus, opts));
 }
 export function dagLayout(input, options = {}) {
@@ -659,11 +15,10 @@ export function dagLayout(input, options = {}) {
         throw new Error('[bijou] dagLayout(): received an unbounded DagSource. Use dagSlice() to produce a SlicedDagSource first.');
     }
     const ctx = resolveCtx(options.ctx);
-    const nodes = isSlicedDagSource(input) ? materialize(input) : input;
+    const nodes = isSlicedDagSource(input) ? materialize(input) : [...input];
     if (nodes.length === 0)
         return { output: '', nodes: new Map(), width: 0, height: 0 };
-    const result = renderInteractiveLayout(nodes, options, ctx);
-    return { output: result.output, nodes: result.nodes, width: result.width, height: result.height };
+    return renderInteractiveLayout(nodes, options, ctx);
 }
 export function dag(input, options = {}) {
     if (isDagSource(input) && !isSlicedDagSource(input)) {
@@ -671,7 +26,7 @@ export function dag(input, options = {}) {
     }
     const ctx = resolveCtx(options.ctx);
     const mode = ctx.mode;
-    const nodes = isSlicedDagSource(input) ? materialize(input) : input;
+    const nodes = isSlicedDagSource(input) ? materialize(input) : [...input];
     if (nodes.length === 0)
         return '';
     if (mode === 'pipe') {