@pi-kaush/pi-tool-call-markers 0.3.2 → 0.3.4

package/README.md

@@ -15,14 +15,16 @@ Restart Pi or run `/reload`.
 Collapsed tool rows use semantic theme colors with no gear, background fill, box padding, or filled blank rows:
 
 ```text
-  % Read
-    • src/a.ts                         42 lines
-    • src/b.ts                         18 lines
+  │ Read
+  │    src/a.ts                         42 lines
+  │    src/b.ts                         18 lines
+  │
+  │ Bash
+  │    $: npm test → done
 ```
 
 - **Two-column outer inset.** Tool markers and image output align with an inset conversation surface. Very narrow terminals reduce the decoration before useful content.
-- **`%` tool headings.** A singleton stays on one line when its summary and outcome fit. A multi-call group has one `%` heading per contiguous tool type.
-- **`•` grouped children.** Bullets appear only for members of a multi-call group.
+- **`│` tool-call rail.** Single calls use a rail beside the summary. Multi-call groups extend it through bold tool-name headings, indented call summaries, and separators between tool types.
 - **Semantic, low-contrast status.** Tool names are emphasized, summaries and settled metadata are muted, pending state is warning-colored, and failures remain error-colored. Ordinary tool states have no background.
 - **Width-safe outcome tails.** Long summaries truncate before useful tails such as `→ done`, `→ 42 lines`, `→ +2/-1`, or a `bash` duration.
 - **Stable running groups.** Adjacent calls group as they appear. Pending state and elapsed `bash` time settle into the final outcome without changing the row count.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pi-kaush/pi-tool-call-markers",
-  "version": "0.3.2",
+  "version": "0.3.4",
   "description": "Compact and group Pi tool calls, with a bundled extension for adjacent thinking blocks.",
   "license": "MIT",
   "author": "Kaushik Gopal",

package/src/index.ts

@@ -16,11 +16,11 @@ import {
 } from "./bash-block.ts";
 import { runChatContainerHooks } from "./container-hooks.ts";
 import { installInfoVisibility } from "./info-visibility.ts";
-import { fgCollapsed } from "./muted.ts";
+import { fgCollapsed, fgCollapsedRail } from "./muted.ts";
 
 const OUTER_INSET = 2;
-const GROUP_MARKER = "%";
 const SUBAGENT_MARKER = "↪";
+const GROUP_CALL_MARKER = "│";
 const PRESENTATION_PATCHED = Symbol.for("kg.pi.toolPresentation.v3");
 const LEGACY_PRESENTATION_PATCHED = Symbol.for("kg.pi.toolPresentation.v2");
 const GROUPING_PATCHED = Symbol.for("kg.pi.toolGrouping.v1");
@@ -932,11 +932,10 @@ function collapsedHeadline(
   // Failed rows render entirely in error so the row reads as the one that
   // failed, not just its outcome tail. Only the tool name is bold.
   const tone = rowHasFailed(row) ? "error" : "muted";
-  const marker = `${fgCollapsed(
-    theme,
-    tone,
-    row.toolName === "subagent" ? SUBAGENT_MARKER : GROUP_MARKER,
-  )} `;
+  const marker =
+    row.toolName === "subagent"
+      ? `${fgCollapsed(theme, tone, SUBAGENT_MARKER)} `
+      : `${fgCollapsedRail(theme, tone, GROUP_CALL_MARKER)} `;
   const budget = Math.max(1, width - visibleWidth(marker));
   const label = collapsedCallLabel(row, budget, theme, tone);
   const outcome = collapsedOutcome(row, budget, theme);
@@ -1293,14 +1292,20 @@ function renderGroupedCallLines(
     const lines: string[] = [];
     const toolName = row.toolName ?? "tool";
     if (toolName !== previousToolName) {
+      // Keep the rail unbroken across subgroup spacing and put each bold
+      // tool name beside it. The separator belongs to the new row so
+      // click-routing heights stay aligned with the rendered lines.
+      if (previousToolName !== undefined) {
+        lines.push(fgCollapsedRail(theme, "muted", GROUP_CALL_MARKER));
+      }
       lines.push(
-        `${fgCollapsed(theme, "muted", GROUP_MARKER)} ${fgCollapsed(theme, "toolTitle", toolName, true)}`,
+        `${fgCollapsedRail(theme, "muted", GROUP_CALL_MARKER)} ${fgCollapsed(theme, "toolTitle", toolName, true)}`,
       );
       previousToolName = toolName;
     }
 
     const color = rowHasFailed(row) ? "error" : "muted";
-    const prefix = `  ${fgCollapsed(theme, color, "•")} `;
+    const prefix = `${fgCollapsedRail(theme, color, GROUP_CALL_MARKER)}    `;
     const budget = Math.max(1, width - visibleWidth(prefix));
     const label = groupedChildLabel(row, budget, theme, color);
     const outcome = collapsedOutcome(row, budget, theme);

package/src/muted.ts

@@ -78,3 +78,17 @@ export function fgCollapsed(
   }
   return theme.fg(color, bold && theme.bold ? theme.bold(text) : text);
 }
+
+// Decoration rails recede further than collapsed text. No palette token is
+// guaranteed lighter than the collapsed color (e.g. catppuccin-latte's `dim`
+// resolves to the same overlay0 as syntaxComment), so apply the terminal's
+// faint attribute: it lightens toward the background on light themes and
+// darkens on dark ones. Error rails keep their full-strength semantic red.
+export function fgCollapsedRail(
+  theme: CollapsedTheme,
+  color: string,
+  text: string,
+): string {
+  const styled = fgCollapsed(theme, color, text);
+  return color === "error" ? styled : `\x1b[2m${styled}\x1b[22m`;
+}