@danypops/pi-papyrus 0.43.4 → 0.43.5

package/extension/src/tool-rendering/artifact-card.ts

@@ -59,10 +59,6 @@ export function emptyState(noun: string): string {
 	return `No ${noun}.`;
 }
 
-export function treeConnector(last: boolean): string {
-	return last ? "└─" : "├─";
-}
-
 export function expandHint(): string {
 	return "expand for details";
 }

package/extension/src/tool-rendering/artifact-list.ts

@@ -1,7 +1,8 @@
 import { TOOL_COLLAPSED_ROW_LIMIT } from "@danypops/papyrus";
 import type { Theme } from "@earendil-works/pi-coding-agent";
 import { type Component, truncateToWidth } from "@earendil-works/pi-tui";
-import { countSummary, expandHint, kindGlyph, statusGlyph, treeConnector } from "./artifact-card.ts";
+import { type TreeNode, TreeView } from "malevich-tui-components";
+import { countSummary, expandHint, kindGlyph, statusGlyph } from "./artifact-card.ts";
 import type { ArtifactListToolDetails, GraphToolDetails, ToolArtifactSummary } from "./render-model.ts";
 
 function pluralKind(rows: readonly ToolArtifactSummary[]): string {
@@ -85,44 +86,79 @@ export class ArtifactListCard implements Component {
 	}
 }
 
-interface HierarchyRow {
-	node: ToolArtifactSummary;
-	prefix: string;
-	connector: string;
+/** A fixed-text Component embedding one already-styled, width-truncated
+ * line -- used for the dependency-edge annotation Malevich's TreeView
+ * renders indented beneath a node. */
+function textLine(text: string): Component {
+	return {
+		render: (width: number) => text.split("\n").map((line) => truncateToWidth(line, width)),
+		invalidate: () => {},
+	};
 }
 
-function hierarchyRows(details: GraphToolDetails): HierarchyRow[] {
+/** Projects GraphToolDetails' containment edges (`relation === "contains"`)
+ * into Malevich TreeNodes, rendered via the real, shared TreeView instead
+ * of hand-rolled connector math. Any non-containment edge (depends_on,
+ * references, blocks, ...) naming a node as its `to` -- previously
+ * silently dropped entirely -- surfaces as a "depends on: ..." annotation
+ * embedded under that node, matching DagView's own edge-annotation wording. */
+function toTreeNodes(details: GraphToolDetails, theme: Theme, expanded: boolean): TreeNode[] {
 	const byId = new Map(details.nodes.map((node) => [node.id, node]));
 	const childIds = new Map<string, string[]>();
 	const contained = new Set<string>();
+	const dependencySources = new Map<string, string[]>();
 	for (const edge of details.edges) {
-		if (edge.relation !== "contains" || !byId.has(edge.from) || !byId.has(edge.to)) continue;
-		const children = childIds.get(edge.from) ?? [];
-		children.push(edge.to);
-		childIds.set(edge.from, children);
-		contained.add(edge.to);
+		if (edge.relation === "contains") {
+			if (!byId.has(edge.from) || !byId.has(edge.to)) continue;
+			const children = childIds.get(edge.from) ?? [];
+			children.push(edge.to);
+			childIds.set(edge.from, children);
+			contained.add(edge.to);
+		} else if (byId.has(edge.to)) {
+			const sources = dependencySources.get(edge.to) ?? [];
+			sources.push(edge.from);
+			dependencySources.set(edge.to, sources);
+		}
 	}
-	const roots = details.nodes.filter((node) => !contained.has(node.id));
-	const rows: HierarchyRow[] = [];
+
 	const visited = new Set<string>();
-	const visit = (node: ToolArtifactSummary, prefix: string, connector: string): void => {
-		if (visited.has(node.id)) return;
+	const buildNode = (node: ToolArtifactSummary): TreeNode => {
 		visited.add(node.id);
-		rows.push({ node, prefix, connector });
-		const children = (childIds.get(node.id) ?? [])
-			.map((id) => byId.get(id))
-			.filter((child): child is ToolArtifactSummary => child !== undefined);
-		children.forEach((child, index) => {
-			const last = index === children.length - 1;
-			visit(child, `${prefix}${connector ? (connector === "└─" ? "  " : "│ ") : ""}`, treeConnector(last));
-		});
+		const identity = expanded ? `${node.id}  ` : "";
+		const label = `${theme.fg("accent", kindGlyph(node.kind))} ${theme.fg("muted", statusGlyph(node.status))} ${theme.fg("accent", identity)}${theme.fg("text", node.title)}`;
+		const children: TreeNode[] = [];
+		for (const id of childIds.get(node.id) ?? []) {
+			if (visited.has(id)) continue;
+			const child = byId.get(id);
+			if (child) children.push(buildNode(child));
+		}
+		const metadata = expanded ? rowMetadata(node) : "";
+		const sources = dependencySources.get(node.id);
+		const annotations = [
+			...(metadata ? [theme.fg("dim", metadata)] : []),
+			...(sources && sources.length > 0
+				? [theme.fg("dim", `depends on: ${sources.map((id) => byId.get(id)?.title ?? id).join(", ")}`)]
+				: []),
+		];
+		return {
+			label,
+			children: children.length > 0 ? children : undefined,
+			component: annotations.length > 0 ? textLine(annotations.join("\n")) : undefined,
+		};
 	};
-	for (const root of roots) visit(root, "", "");
-	for (const node of details.nodes) visit(node, "", "");
-	return rows;
+
+	const tree: TreeNode[] = [];
+	for (const root of details.nodes.filter((node) => !contained.has(node.id))) {
+		if (!visited.has(root.id)) tree.push(buildNode(root));
+	}
+	for (const node of details.nodes) {
+		if (!visited.has(node.id)) tree.push(buildNode(node));
+	}
+	return tree;
 }
 
-/** Bounded task containment preview; dependency graphs use the dedicated graph renderer. */
+/** Bounded task containment preview; dependency edges surface as an
+ * annotation under the node they target (see toTreeNodes). */
 export class TaskHierarchyPreview implements Component {
 	private details: GraphToolDetails;
 	private theme: Theme;
@@ -146,26 +182,12 @@ export class TaskHierarchyPreview implements Component {
 	render(width: number): string[] {
 		const safeWidth = Math.max(1, width);
 		if (this.cachedLines && this.cachedWidth === safeWidth) return this.cachedLines;
-		const rows = hierarchyRows(this.details);
-		const lines = [
-			truncateToWidth(
-				this.theme.fg("toolTitle", this.theme.bold(`${this.details.nodes.length} tasks · ${this.details.edges.length} edges`)),
-				safeWidth,
-			),
-		];
-		for (const row of rows) {
-			const identity = this.expanded ? `${row.node.id}  ` : "";
-			lines.push(
-				truncateToWidth(
-					`${row.prefix}${row.connector}${row.connector ? " " : ""}${this.theme.fg("accent", kindGlyph(row.node.kind))} ${this.theme.fg("muted", statusGlyph(row.node.status))} ${this.theme.fg("accent", identity)}${this.theme.fg("text", row.node.title)}`,
-					safeWidth,
-				),
-			);
-			if (this.expanded) {
-				const metadata = rowMetadata(row.node);
-				if (metadata) lines.push(truncateToWidth(this.theme.fg("dim", `${row.prefix}   ${metadata}`), safeWidth));
-			}
-		}
+		const header = truncateToWidth(
+			this.theme.fg("toolTitle", this.theme.bold(`${this.details.nodes.length} tasks · ${this.details.edges.length} edges`)),
+			safeWidth,
+		);
+		const tree = new TreeView({ nodes: toTreeNodes(this.details, this.theme, this.expanded) });
+		const lines = [header, ...tree.render(safeWidth)];
 		this.cachedWidth = safeWidth;
 		this.cachedLines = lines;
 		return lines;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@danypops/pi-papyrus",
-  "version": "0.43.4",
+  "version": "0.43.5",
   "description": "Pi host extension for Papyrus: native tools, TUI panels, and context injection over the daemon-backed graph store",
   "type": "module",
   "keywords": ["pi-package"],
@@ -24,7 +24,7 @@
     "@danypops/vehicle-core": "^0.3.0",
     "@danypops/vehicle-server": "^0.4.1",
     "beautiful-mermaid": "1.1.3",
-    "malevich-tui-components": "^0.16.1"
+    "malevich-tui-components": "^0.20.2"
   },
   "devDependencies": {
     "@earendil-works/pi-coding-agent": "^0.80.10",