@yinan_chen/pi-claude-code-ui 0.7.0 → 0.8.1

package/README.md

@@ -4,9 +4,9 @@
 
 ### 演示
 
-![demo](assets/demo.mp4)
+![demo](https://github.com/user-attachments/assets/d264935a-79fc-434e-be97-05c8210144fe)
 
-> 若上方未内嵌播放，直接下载观看：[assets/demo.mp4](assets/demo.mp4)
+动图预览（不渲染视频的平台，如 npm）： ![gif](assets/demo.gif)
 
 > 原名 lean-tidy —— Claude Code 风格的 Pi 界面增强扩展：Claude 式对话转录视图、富文本 diff 渲染、子代理面板与工作状态提示。
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@yinan_chen/pi-claude-code-ui",
-	"version": "0.7.0",
+	"version": "0.8.1",
 	"description": "Claude Code-style UI for Pi: transcript view, rich diffs, subagent panels and working-message status.",
 	"type": "module",
 	"license": "MIT",

package/src/generic-card.ts

@@ -28,10 +28,34 @@ function labelOf(customType: string): string {
 	return tail.charAt(0).toUpperCase() + tail.slice(1);
 }
 
-/** 内容来源：message.content / entry.data（对象优先取 name/description，否则 JSON）。 */
+/** JSON 内容的智能首行：query/title 等字段优先，数组给条数，否则紧凑化。 */
+function jsonPreview(text: string): string | undefined {
+	const trimmed = text.trim();
+	if (!trimmed.startsWith("{") && !trimmed.startsWith("[")) return undefined;
+	try {
+		const parsed = JSON.parse(trimmed);
+		if (Array.isArray(parsed)) return `${parsed.length} item${parsed.length === 1 ? "" : "s"}`;
+		if (parsed && typeof parsed === "object") {
+			for (const key of ["query", "q", "title", "summary", "text", "message"]) {
+				const value = (parsed as Record<string, unknown>)[key];
+				if (typeof value === "string" && value.trim()) return value;
+			}
+			const firstString = Object.values(parsed).find((v) => typeof v === "string" && String(v).trim());
+			if (firstString !== undefined) return String(firstString);
+			return trimmed.replace(/\s+/g, " ").slice(0, 200);
+		}
+	} catch { /* 非 JSON 或超长，回退原文 */ }
+	return undefined;
+}
+
+/** 内容来源：message.content / entry.data（对象优先取 name/description，JSON 字符串智能摘要）。 */
 function bodyOf(payload: any): string {
 	const source = typeof payload?.content === "string" ? payload.content : payload?.data;
-	if (typeof source === "string") return source;
+	if (typeof source === "string") {
+		const preview = jsonPreview(source);
+		if (preview !== undefined) return preview;
+		return source;
+	}
 	if (source && typeof source === "object") {
 		const name = typeof source.name === "string" ? source.name : "";
 		const desc = typeof source.description === "string" ? source.description : "";

package/src/subagent-panel.ts

@@ -95,8 +95,9 @@ function panelLines(d: any, expanded: boolean, theme: any, width: number): strin
 			out.push(...prefixed(fg(theme, "dim", `transcript: ${d.outputFile}`), width, first, BRANCH_REST()));
 		}
 	} else if (typeof d?.resultPreview === "string" && d.resultPreview.trim()) {
-		// 折叠态不显示正文，但保留可展开提示（有正文才提示）
-		out.push(...prefixed(expandHint(theme), width, first, BRANCH_REST()));
+		// 折叠态不显示正文，但保留可展开提示（有正文才提示）；格式与工具块 `… +N lines (ctrl+o to expand)` 一致。
+		const hidden = linesOf(d.resultPreview).length;
+		out.push(...prefixed(fg(theme, "dim", `… +${hidden} line${hidden === 1 ? "" : "s"}`) + expandHint(theme), width, first, BRANCH_REST()));
 	}
 	return out;
 }

package/src/vendor/diff/diff-component.ts

@@ -17,6 +17,8 @@ export interface DiffRenderOptions {
 	previousContent?: string;
 	fileExistedBeforeWrite?: boolean;
 	headerLabel?: string;
+	/** 折叠态隐藏的正文行数（write 折叠提示 `… +N lines` 用）。 */
+	collapsedHiddenLines?: number;
 	/** Live hover state for the collapsed hint row (muted → text on hover). */
 	isHovered?: () => boolean;
 	invalidate?: () => void;

package/src/vendor/diff/diff-write-render.ts

@@ -1,6 +1,6 @@
 import { Text, truncateToWidth, visibleWidth, type Component } from "@earendil-works/pi-tui";
 import { sanitizeToolResultText } from "../tool-result-sanitize.ts";
-import { showMoreHintText } from "../show-more-hint.ts";
+import { expandShortcutText } from "../show-more-hint.ts";
 import { splitWriteContentLines } from "./diff-text.ts";
 import {
 	collectDiffStats,
@@ -291,21 +291,26 @@ function renderWriteOverwriteGuardRows(
 	return renderSingleDiffRow(buildWriteOverwriteGuardText(guard, width), "warning", width, theme);
 }
 
-/** Folded write with `writeDiffCollapsedLines: 0`: `↳ created • click to show more`. */
+/** Folded write with `writeDiffCollapsedLines: 0`: `… +N lines (ctrl+o to expand)`（与工具块/subagent 折叠提示同款；无行数时退化为裸快捷键提示）。 */
 function renderWriteCollapsedHintLine(
 	wasOverwrite: boolean,
 	width: number,
 	theme: DiffTheme,
 	hovered: boolean,
 	headerLabel?: string,
+	hiddenCount?: number,
 ): string[] {
 	const safeWidth = normalizeDiffRenderWidth(width);
 	if (safeWidth === 0) {
 		return [""];
 	}
-	const actionLabel = headerLabel?.trim() || (wasOverwrite ? "overwritten" : "created");
-	const clickLabel = showMoreHintText();
-	const candidates = [`↳ ${actionLabel} • ${clickLabel}`, `↳ ${actionLabel}`, actionLabel, "…"];
+	void wasOverwrite; void headerLabel;
+	const clickLabel = `(${expandShortcutText()} to expand)`;
+	const counted =
+		typeof hiddenCount === "number" && hiddenCount > 0
+			? `… +${hiddenCount} line${hiddenCount === 1 ? "" : "s"} ${clickLabel}`
+			: "";
+	const candidates = [counted, clickLabel.slice(1, -1), "…"].filter((candidate) => candidate !== "");
 	let text = candidates[candidates.length - 1] ?? "…";
 	for (const candidate of candidates) {
 		if (visibleWidth(candidate) <= safeWidth) {
@@ -446,6 +451,7 @@ export function renderWriteDiffResult(
 					theme,
 					hovered,
 					options.headerLabel,
+					options.collapsedHiddenLines,
 				);
 				return cache.set(
 					safeWidth,

package/src/vendor/diff/index.ts

@@ -67,13 +67,15 @@ export function renderRichToolResult(
 	if (metadata.diffUnavailableReason) {
 		return unavailableComponent(metadata.diffUnavailableReason, theme);
 	}
+	const writeContent = typeof context?.args?.content === "string" ? context.args.content : undefined;
 	return renderWriteDiffResult(
-		typeof context?.args?.content === "string" ? context.args.content : undefined,
+		writeContent,
 		{
 			expanded,
 			filePath,
 			previousContent: metadata.previousContent,
 			fileExistedBeforeWrite: metadata.fileExistedBeforeWrite,
+			collapsedHiddenLines: writeContent !== undefined ? writeContent.replace(/\r?\n$/, "").split(/\r?\n/).length : undefined,
 			isHovered: options?.isHovered,
 			invalidate: () => context?.invalidate?.(),
 		},