@caupulican/pi-adaptative 0.81.42 → 0.81.43

package/dist/modes/interactive/components/tree-selector.js

@@ -1,33 +1,32 @@
 import { Container, getKeybindings, Input, Spacer, Text, TruncatedText, truncateToWidth, } from "@caupulican/pi-tui";
+import { buildActivePathIds, buildTreePrefix, extractTextContent, flattenSessionTree, formatTreeToolCall, hasTextContent, recalculateVisibleTreeLayout, } from "../../../core/export-html/session-tree-foundations.mjs";
 import { theme } from "../theme/theme.js";
 import { DynamicBorder } from "./dynamic-border.js";
 import { keyHint, keyText } from "./keybinding-hints.js";
 import { renderTitleBadge } from "./tool-title.js";
+function shortenTreePath(path) {
+    const home = process.env.HOME || process.env.USERPROFILE || "";
+    return home && path.startsWith(home) ? `~${path.slice(home.length)}` : path;
+}
 class TreeList {
-    flatNodes = [];
-    filteredNodes = [];
-    selectedIndex = 0;
-    currentLeafId;
-    maxVisibleLines;
-    filterMode = "default";
-    searchQuery = "";
-    toolCallMap = new Map();
-    multipleRoots = false;
-    showLabelTimestamps = false;
-    activePathIds = new Set();
-    visibleParentMap = new Map();
-    visibleChildrenMap = new Map();
-    lastSelectedId = null;
-    foldedNodes = new Set();
-    onSelect;
-    onCancel;
-    onLabelEdit;
     constructor(tree, currentLeafId, maxVisibleLines, initialSelectedId, initialFilterMode) {
+        this.flatNodes = [];
+        this.filteredNodes = [];
+        this.selectedIndex = 0;
+        this.filterMode = "default";
+        this.searchQuery = "";
+        this.toolCallMap = new Map();
+        this.showLabelTimestamps = false;
+        this.activePathIds = new Set();
+        this.visibleParentMap = new Map();
+        this.visibleChildrenMap = new Map();
+        this.lastSelectedId = null;
+        this.foldedNodes = new Set();
         this.currentLeafId = currentLeafId;
         this.maxVisibleLines = maxVisibleLines;
         this.filterMode = initialFilterMode ?? "default";
-        this.multipleRoots = tree.length > 1;
-        this.flatNodes = this.flattenTree(tree);
+        this.flatNodes = flattenSessionTree(tree, currentLeafId ? new Set([currentLeafId]) : new Set());
+        this.indexToolCalls();
         this.buildActivePath();
         this.applyFilter();
         // Start with initialSelectedId if provided, otherwise current leaf
@@ -65,68 +64,16 @@ class TreeList {
     }
     /** Build the set of entry IDs on the path from root to current leaf */
     buildActivePath() {
-        this.activePathIds.clear();
-        if (!this.currentLeafId)
-            return;
-        // Build a map of id -> entry for parent lookup
-        const entryMap = new Map();
+        const entryById = new Map();
         for (const flatNode of this.flatNodes) {
-            entryMap.set(flatNode.node.entry.id, flatNode);
-        }
-        // Walk from leaf to root
-        let currentId = this.currentLeafId;
-        while (currentId) {
-            this.activePathIds.add(currentId);
-            const node = entryMap.get(currentId);
-            if (!node)
-                break;
-            currentId = node.node.entry.parentId ?? null;
+            entryById.set(flatNode.node.entry.id, flatNode.node.entry);
         }
+        this.activePathIds = this.currentLeafId ? buildActivePathIds(entryById, this.currentLeafId) : new Set();
     }
-    flattenTree(roots) {
-        const result = [];
+    indexToolCalls() {
         this.toolCallMap.clear();
-        const stack = [];
-        // Determine which subtrees contain the active leaf (to sort current branch first)
-        // Use iterative post-order traversal to avoid stack overflow
-        const containsActive = new Map();
-        const leafId = this.currentLeafId;
-        {
-            // Build list in pre-order, then process in reverse for post-order effect
-            const allNodes = [];
-            const preOrderStack = [...roots];
-            while (preOrderStack.length > 0) {
-                const node = preOrderStack.pop();
-                allNodes.push(node);
-                // Push children in reverse so they're processed left-to-right
-                for (let i = node.children.length - 1; i >= 0; i--) {
-                    preOrderStack.push(node.children[i]);
-                }
-            }
-            // Process in reverse (post-order): children before parents
-            for (let i = allNodes.length - 1; i >= 0; i--) {
-                const node = allNodes[i];
-                let has = leafId !== null && node.entry.id === leafId;
-                for (const child of node.children) {
-                    if (containsActive.get(child)) {
-                        has = true;
-                    }
-                }
-                containsActive.set(node, has);
-            }
-        }
-        // Add roots in reverse order, prioritizing the one containing the active leaf
-        // If multiple roots, treat them as children of a virtual root that branches
-        const multipleRoots = roots.length > 1;
-        const orderedRoots = [...roots].sort((a, b) => Number(containsActive.get(b)) - Number(containsActive.get(a)));
-        for (let i = orderedRoots.length - 1; i >= 0; i--) {
-            const isLast = i === orderedRoots.length - 1;
-            stack.push([orderedRoots[i], multipleRoots ? 1 : 0, multipleRoots, multipleRoots, isLast, [], multipleRoots]);
-        }
-        while (stack.length > 0) {
-            const [node, indent, justBranched, showConnector, isLast, gutters, isVirtualRootChild] = stack.pop();
-            // Extract tool calls from assistant messages for later lookup
-            const entry = node.entry;
+        for (const flatNode of this.flatNodes) {
+            const entry = flatNode.node.entry;
             if (entry.type === "message" && entry.message.role === "assistant") {
                 const content = entry.message.content;
                 if (Array.isArray(content)) {
@@ -138,63 +85,7 @@ class TreeList {
                     }
                 }
             }
-            result.push({ node, indent, showConnector, isLast, gutters, isVirtualRootChild });
-            const children = node.children;
-            const multipleChildren = children.length > 1;
-            // Order children so the branch containing the active leaf comes first
-            const orderedChildren = (() => {
-                const prioritized = [];
-                const rest = [];
-                for (const child of children) {
-                    if (containsActive.get(child)) {
-                        prioritized.push(child);
-                    }
-                    else {
-                        rest.push(child);
-                    }
-                }
-                return [...prioritized, ...rest];
-            })();
-            // Calculate child indent
-            let childIndent;
-            if (multipleChildren) {
-                // Parent branches: children get +1
-                childIndent = indent + 1;
-            }
-            else if (justBranched && indent > 0) {
-                // First generation after a branch: +1 for visual grouping
-                childIndent = indent + 1;
-            }
-            else {
-                // Single-child chain: stay flat
-                childIndent = indent;
-            }
-            // Build gutters for children
-            // If this node showed a connector, add a gutter entry for descendants
-            // Only add gutter if connector is actually displayed (not suppressed for virtual root children)
-            const connectorDisplayed = showConnector && !isVirtualRootChild;
-            // When connector is displayed, add a gutter entry at the connector's position
-            // Connector is at position (displayIndent - 1), so gutter should be there too
-            const currentDisplayIndent = this.multipleRoots ? Math.max(0, indent - 1) : indent;
-            const connectorPosition = Math.max(0, currentDisplayIndent - 1);
-            const childGutters = connectorDisplayed
-                ? [...gutters, { position: connectorPosition, show: !isLast }]
-                : gutters;
-            // Add children in reverse order
-            for (let i = orderedChildren.length - 1; i >= 0; i--) {
-                const childIsLast = i === orderedChildren.length - 1;
-                stack.push([
-                    orderedChildren[i],
-                    childIndent,
-                    multipleChildren,
-                    multipleChildren,
-                    childIsLast,
-                    childGutters,
-                    false,
-                ]);
-            }
         }
-        return result;
     }
     applyFilter() {
         // Update lastSelectedId only when we have a valid selection (non-empty list)
@@ -210,7 +101,7 @@ class TreeList {
             // Always show current leaf so active position is visible
             if (entry.type === "message" && entry.message.role === "assistant" && !isCurrentLeaf) {
                 const msg = entry.message;
-                const hasText = this.hasTextContent(msg.content);
+                const hasText = hasTextContent(msg.content);
                 const isErrorOrAborted = msg.stopReason && msg.stopReason !== "stop" && msg.stopReason !== "toolUse";
                 // Only hide if no text AND not an error/aborted message
                 if (!hasText && !isErrorOrAborted) {
@@ -268,7 +159,9 @@ class TreeList {
             this.filteredNodes = this.filteredNodes.filter((flatNode) => !skipSet.has(flatNode.node.entry.id));
         }
         // Recalculate visual structure (indent, connectors, gutters) based on visible tree
-        this.recalculateVisualStructure();
+        const layout = recalculateVisibleTreeLayout(this.filteredNodes, this.flatNodes);
+        this.visibleParentMap = layout.visibleParent;
+        this.visibleChildrenMap = layout.visibleChildren;
         // Try to preserve cursor on the same node, or find nearest visible ancestor
         if (this.lastSelectedId) {
             this.selectedIndex = this.findNearestVisibleIndex(this.lastSelectedId);
@@ -282,119 +175,6 @@ class TreeList {
             this.lastSelectedId = this.filteredNodes[this.selectedIndex]?.node.entry.id ?? this.lastSelectedId;
         }
     }
-    /**
-     * Recompute indentation/connectors for the filtered view
-     *
-     * Filtering can hide intermediate entries; descendants attach to the nearest visible ancestor.
-     * Keep indentation semantics aligned with flattenTree() so single-child chains don't drift right.
-     */
-    recalculateVisualStructure() {
-        if (this.filteredNodes.length === 0)
-            return;
-        const visibleIds = new Set(this.filteredNodes.map((n) => n.node.entry.id));
-        // Build entry map for efficient parent lookup (using full tree)
-        const entryMap = new Map();
-        for (const flatNode of this.flatNodes) {
-            entryMap.set(flatNode.node.entry.id, flatNode);
-        }
-        // Find nearest visible ancestor for a node
-        const findVisibleAncestor = (nodeId) => {
-            let currentId = entryMap.get(nodeId)?.node.entry.parentId ?? null;
-            while (currentId !== null) {
-                if (visibleIds.has(currentId)) {
-                    return currentId;
-                }
-                currentId = entryMap.get(currentId)?.node.entry.parentId ?? null;
-            }
-            return null;
-        };
-        // Build visible tree structure:
-        // - visibleParent: nodeId → nearest visible ancestor (or null for roots)
-        // - visibleChildren: parentId → list of visible children (in filteredNodes order)
-        const visibleParent = new Map();
-        const visibleChildren = new Map();
-        visibleChildren.set(null, []); // root-level nodes
-        for (const flatNode of this.filteredNodes) {
-            const nodeId = flatNode.node.entry.id;
-            const ancestorId = findVisibleAncestor(nodeId);
-            visibleParent.set(nodeId, ancestorId);
-            if (!visibleChildren.has(ancestorId)) {
-                visibleChildren.set(ancestorId, []);
-            }
-            visibleChildren.get(ancestorId).push(nodeId);
-        }
-        // Update multipleRoots based on visible roots
-        const visibleRootIds = visibleChildren.get(null);
-        this.multipleRoots = visibleRootIds.length > 1;
-        // Build a map for quick lookup: nodeId → FlatNode
-        const filteredNodeMap = new Map();
-        for (const flatNode of this.filteredNodes) {
-            filteredNodeMap.set(flatNode.node.entry.id, flatNode);
-        }
-        const stack = [];
-        // Add visible roots in reverse order (to process in forward order via stack)
-        for (let i = visibleRootIds.length - 1; i >= 0; i--) {
-            const isLast = i === visibleRootIds.length - 1;
-            stack.push([
-                visibleRootIds[i],
-                this.multipleRoots ? 1 : 0,
-                this.multipleRoots,
-                this.multipleRoots,
-                isLast,
-                [],
-                this.multipleRoots,
-            ]);
-        }
-        while (stack.length > 0) {
-            const [nodeId, indent, justBranched, showConnector, isLast, gutters, isVirtualRootChild] = stack.pop();
-            const flatNode = filteredNodeMap.get(nodeId);
-            if (!flatNode)
-                continue;
-            // Update this node's visual properties
-            flatNode.indent = indent;
-            flatNode.showConnector = showConnector;
-            flatNode.isLast = isLast;
-            flatNode.gutters = gutters;
-            flatNode.isVirtualRootChild = isVirtualRootChild;
-            // Get visible children of this node
-            const children = visibleChildren.get(nodeId) || [];
-            const multipleChildren = children.length > 1;
-            // Child indent follows flattenTree(): branch points (and first generation after a branch) shift +1
-            let childIndent;
-            if (multipleChildren) {
-                childIndent = indent + 1;
-            }
-            else if (justBranched && indent > 0) {
-                childIndent = indent + 1;
-            }
-            else {
-                childIndent = indent;
-            }
-            // Child gutters follow flattenTree() connector/gutter rules
-            const connectorDisplayed = showConnector && !isVirtualRootChild;
-            const currentDisplayIndent = this.multipleRoots ? Math.max(0, indent - 1) : indent;
-            const connectorPosition = Math.max(0, currentDisplayIndent - 1);
-            const childGutters = connectorDisplayed
-                ? [...gutters, { position: connectorPosition, show: !isLast }]
-                : gutters;
-            // Add children in reverse order (to process in forward order via stack)
-            for (let i = children.length - 1; i >= 0; i--) {
-                const childIsLast = i === children.length - 1;
-                stack.push([
-                    children[i],
-                    childIndent,
-                    multipleChildren,
-                    multipleChildren,
-                    childIsLast,
-                    childGutters,
-                    false,
-                ]);
-            }
-        }
-        // Store visible tree maps for ancestor/descendant lookups in navigation
-        this.visibleParentMap = visibleParent;
-        this.visibleChildrenMap = visibleChildren;
-    }
     /** Get searchable text content from a node */
     getSearchableText(node) {
         const entry = node.entry;
@@ -407,7 +187,7 @@ class TreeList {
                 const msg = entry.message;
                 parts.push(msg.role);
                 if ("content" in msg && msg.content) {
-                    parts.push(this.extractContent(msg.content));
+                    parts.push(extractTextContent(msg.content, 200));
                 }
                 if (msg.role === "bashExecution") {
                     const bashMsg = msg;
@@ -422,7 +202,7 @@ class TreeList {
                     parts.push(entry.content);
                 }
                 else {
-                    parts.push(this.extractContent(entry.content));
+                    parts.push(extractTextContent(entry.content, 200));
                 }
                 break;
             }
@@ -504,47 +284,9 @@ class TreeList {
             const isSelected = i === this.selectedIndex;
             // Build line: cursor + prefix + path marker + label + content
             const cursor = isSelected ? theme.fg("accent", "› ") : "  ";
-            // If multiple roots, shift display (roots at 0, not 1)
-            const displayIndent = this.multipleRoots ? Math.max(0, flatNode.indent - 1) : flatNode.indent;
-            // Build prefix with gutters at their correct positions
-            // Each gutter has a position (displayIndent where its connector was shown)
-            const connector = flatNode.showConnector && !flatNode.isVirtualRootChild ? (flatNode.isLast ? "└─ " : "├─ ") : "";
-            const connectorPosition = connector ? displayIndent - 1 : -1;
-            // Build prefix char by char, placing gutters and connector at their positions
-            const totalChars = displayIndent * 3;
-            const prefixChars = [];
             const isFolded = this.foldedNodes.has(entry.id);
-            for (let i = 0; i < totalChars; i++) {
-                const level = Math.floor(i / 3);
-                const posInLevel = i % 3;
-                // Check if there's a gutter at this level
-                const gutter = flatNode.gutters.find((g) => g.position === level);
-                if (gutter) {
-                    if (posInLevel === 0) {
-                        prefixChars.push(gutter.show ? "│" : " ");
-                    }
-                    else {
-                        prefixChars.push(" ");
-                    }
-                }
-                else if (connector && level === connectorPosition) {
-                    // Connector at this level, with fold indicator
-                    if (posInLevel === 0) {
-                        prefixChars.push(flatNode.isLast ? "└" : "├");
-                    }
-                    else if (posInLevel === 1) {
-                        const foldable = this.isFoldable(entry.id);
-                        prefixChars.push(isFolded ? "⊞" : foldable ? "⊟" : "─");
-                    }
-                    else {
-                        prefixChars.push(" ");
-                    }
-                }
-                else {
-                    prefixChars.push(" ");
-                }
-            }
-            const prefix = prefixChars.join("");
+            const branchMiddle = isFolded ? "⊞" : this.isFoldable(entry.id) ? "⊟" : "─";
+            const prefix = buildTreePrefix(flatNode, branchMiddle);
             // Fold marker for nodes without connectors (roots)
             const showsFoldInConnector = flatNode.showConnector && !flatNode.isVirtualRootChild;
             const foldMarker = isFolded && !showsFoldInConnector ? theme.fg("accent", "⊞ ") : "";
@@ -575,12 +317,12 @@ class TreeList {
                 const role = msg.role;
                 if (role === "user") {
                     const msgWithContent = msg;
-                    const content = normalize(this.extractContent(msgWithContent.content));
+                    const content = normalize(extractTextContent(msgWithContent.content, 200));
                     result = theme.fg("accent", "user: ") + content;
                 }
                 else if (role === "assistant") {
                     const msgWithContent = msg;
-                    const textContent = normalize(this.extractContent(msgWithContent.content));
+                    const textContent = normalize(extractTextContent(msgWithContent.content, 200));
                     if (textContent) {
                         result = theme.fg("success", "assistant: ") + textContent;
                     }
@@ -599,7 +341,7 @@ class TreeList {
                     const toolMsg = msg;
                     const toolCall = toolMsg.toolCallId ? this.toolCallMap.get(toolMsg.toolCallId) : undefined;
                     if (toolCall) {
-                        result = theme.fg("muted", this.formatToolCall(toolCall.name, toolCall.arguments));
+                        result = theme.fg("muted", formatTreeToolCall(toolCall.name, toolCall.arguments, shortenTreePath));
                     }
                     else {
                         result = renderTitleBadge(theme, { label: toolMsg.toolName ?? "tool", badgeColor: "muted" });
@@ -615,12 +357,7 @@ class TreeList {
                 break;
             }
             case "custom_message": {
-                const content = typeof entry.content === "string"
-                    ? entry.content
-                    : entry.content
-                        .filter((c) => c.type === "text")
-                        .map((c) => c.text)
-                        .join("");
+                const content = extractTextContent(entry.content, 200);
                 result = `${renderTitleBadge(theme, { label: entry.customType })}: ${normalize(content)}`;
                 break;
             }
@@ -695,94 +432,6 @@ class TreeList {
         const year = date.getFullYear().toString().slice(-2);
         return `${year}/${month}/${day} ${time}`;
     }
-    extractContent(content) {
-        const maxLen = 200;
-        if (typeof content === "string")
-            return content.slice(0, maxLen);
-        if (Array.isArray(content)) {
-            let result = "";
-            for (const c of content) {
-                if (typeof c === "object" && c !== null && "type" in c && c.type === "text") {
-                    result += c.text;
-                    if (result.length >= maxLen)
-                        return result.slice(0, maxLen);
-                }
-            }
-            return result;
-        }
-        return "";
-    }
-    hasTextContent(content) {
-        if (typeof content === "string")
-            return content.trim().length > 0;
-        if (Array.isArray(content)) {
-            for (const c of content) {
-                if (typeof c === "object" && c !== null && "type" in c && c.type === "text") {
-                    const text = c.text;
-                    if (text && text.trim().length > 0)
-                        return true;
-                }
-            }
-        }
-        return false;
-    }
-    formatToolCall(name, args) {
-        const shortenPath = (p) => {
-            const home = process.env.HOME || process.env.USERPROFILE || "";
-            if (home && p.startsWith(home))
-                return `~${p.slice(home.length)}`;
-            return p;
-        };
-        switch (name) {
-            case "read": {
-                const path = shortenPath(String(args.path || args.file_path || ""));
-                const offset = args.offset;
-                const limit = args.limit;
-                let display = path;
-                if (offset !== undefined || limit !== undefined) {
-                    const start = offset ?? 1;
-                    const end = limit !== undefined ? start + limit - 1 : "";
-                    display += `:${start}${end ? `-${end}` : ""}`;
-                }
-                return `[read: ${display}]`;
-            }
-            case "write": {
-                const path = shortenPath(String(args.path || args.file_path || ""));
-                return `[write: ${path}]`;
-            }
-            case "edit": {
-                const path = shortenPath(String(args.path || args.file_path || ""));
-                return `[edit: ${path}]`;
-            }
-            case "bash": {
-                const rawCmd = String(args.command || "");
-                const cmd = rawCmd
-                    .replace(/[\n\t]/g, " ")
-                    .trim()
-                    .slice(0, 50);
-                return `[bash: ${cmd}${rawCmd.length > 50 ? "..." : ""}]`;
-            }
-            case "grep": {
-                const pattern = String(args.pattern || "");
-                const path = shortenPath(String(args.path || "."));
-                return `[grep: /${pattern}/ in ${path}]`;
-            }
-            case "find": {
-                const pattern = String(args.pattern || "");
-                const path = shortenPath(String(args.path || "."));
-                return `[find: ${pattern} in ${path}]`;
-            }
-            case "ls": {
-                const path = shortenPath(String(args.path || "."));
-                return `[ls: ${path}]`;
-            }
-            default: {
-                // Custom tool - show name and truncated JSON args
-                const argsStr = JSON.stringify(args).slice(0, 40);
-                return `[${name}: ${argsStr}${JSON.stringify(args).length > 40 ? "..." : ""}]`;
-            }
-        }
-    }
     handleInput(keyData) {
         const kb = getKeybindings();
         if (kb.matches(keyData, "tui.select.up")) {
@@ -965,7 +614,6 @@ class TreeList {
 }
 /** Component that displays the current search query */
 class SearchLine {
-    treeList;
     constructor(treeList) {
         this.treeList = treeList;
     }
@@ -981,12 +629,6 @@ class SearchLine {
 }
 /** Label input component shown when editing a label */
 class LabelInput {
-    input;
-    entryId;
-    onSubmit;
-    onCancel;
-    // Focusable implementation - propagate to input for IME cursor positioning
-    _focused = false;
     get focused() {
         return this._focused;
     }
@@ -995,6 +637,8 @@ class LabelInput {
         this.input.focused = value;
     }
     constructor(entryId, currentLabel) {
+        // Focusable implementation - propagate to input for IME cursor positioning
+        this._focused = false;
         this.entryId = entryId;
         this.input = new Input();
         if (currentLabel) {
@@ -1029,13 +673,6 @@ class LabelInput {
  * Component that renders a session tree selector for navigation
  */
 export class TreeSelectorComponent extends Container {
-    treeList;
-    labelInput = null;
-    labelInputContainer;
-    treeContainer;
-    onLabelChangeCallback;
-    // Focusable implementation - propagate to labelInput when active for IME cursor positioning
-    _focused = false;
     get focused() {
         return this._focused;
     }
@@ -1048,6 +685,9 @@ export class TreeSelectorComponent extends Container {
     }
     constructor(tree, currentLeafId, terminalHeight, onSelect, onCancel, onLabelChange, initialSelectedId, initialFilterMode) {
         super();
+        this.labelInput = null;
+        // Focusable implementation - propagate to labelInput when active for IME cursor positioning
+        this._focused = false;
         this.onLabelChangeCallback = onLabelChange;
         const maxVisibleLines = Math.max(5, Math.floor(terminalHeight / 2));
         this.treeList = new TreeList(tree, currentLeafId, maxVisibleLines, initialSelectedId, initialFilterMode);