pi-cc-extensions 0.8.62 → 0.8.63

package/README.en.md

@@ -39,7 +39,7 @@ Run `/reload` after installation.
 | --------------------------- | ----------------------------------------------------------------------------------------- | ----------------------------------------------- |
 | Claude Code Output          | Tool summaries, expand/collapse, rich edit/write diffs, and`on` / `compact` / `off` modes | `/ccstyle`                                      |
 | Markdown enhancements      | Mermaid art, admonitions, URL linking, and more                                           | Automatic                                        |
-| Fullscreen mode             | Tool card/group click-to-toggle, previews, hover highlight, and a back-to-bottom button   | `TUIMODE=fullscreen` or `--tui-mode fullscreen` |
+| Fullscreen mode             | Tool card/group click to expand, double-click to collapse, previews, hover highlight, and a back-to-bottom button | `TUIMODE=fullscreen` or `--tui-mode fullscreen` |
 | Settings panel              | `Style / Diff / Thinking / Feature` tabs: startup header toggle and wheel step            | `/ccstyle`                                      |
 | Context inspection          | Usage breakdown and previews for the system prompt, tools, skills, and messages           | `/context`                                      |
 | Session/Subagent references | Search and inject effective context from previous Sessions or existing SubAgents          | `@`                                             |
@@ -68,6 +68,8 @@ Run `/reload` after installation.
 }
 ```
 
+> **Fullscreen clicks**: click `click to show more` to expand tool cards, thinking, Skill, and compact summaries. Click a truncated Input/Output header to open the full preview. Double-click an expanded panel to collapse it. Single clicks on an expanded card still select text and open links.
+>
 > **Tip**: set `markdown.mermaid` to `final` via `~/.pi/agent/settings.json` or the Mermaid diagrams option in `/settings`. Default `streaming` redraws per frame; `final` renders once at completion.
 
 ## Local development

package/README.md

@@ -39,7 +39,7 @@ pi install git:github.com/minuque/pi-cc-extensions
 | --------------------- | ------------------------------------------------------------------------------- | ----------------------------------------------- |
 | Claude Code UI        | 工具摘要、折叠展开、rich edit/write diff，以及`on` / `compact` / `off` 三种模式 | `/ccstyle`                                      |
 | Markdown 增强         | Mermaid 图、提示框、URL 链接化等                                                        | 自动生效                                        |
-| Fullscreen mode       | 工具卡/group 点击展开与收起、预览、hover 高亮、回到底部按钮                     | `TUIMODE=fullscreen` 或 `--tui-mode fullscreen` |
+| Fullscreen mode       | 工具卡/group 单击展开、双击收起、预览、hover 高亮、回到底部按钮                 | `TUIMODE=fullscreen` 或 `--tui-mode fullscreen` |
 | 配置面板              | `Style / Diff / Thinking / Feature` 四页签，含启动头开关与滚轮步进              | `/ccstyle`                                      |
 | 上下文检查            | 查看上下文占用，并预览 System prompt、Tools、Skills 和消息内容                  | `/context`                                      |
 | Session/Subagent 引用 | 搜索并注入历史 Session 或现有 SubAgent 的有效上下文                             | `@`                                             |
@@ -74,6 +74,8 @@ pi install git:github.com/minuque/pi-cc-extensions
 }
 ```
 
+> **Fullscreen 点击**：单击 `click to show more` 展开工具卡、思考、Skill 和 compact 摘要。单击截断的 Input/Output 打开全量预览。双击展开面板收起。展开卡上的单击仍可选择文本、打开链接。
+>
 > **建议**：`markdown.mermaid` 设为 `final`（`~/.pi/agent/settings.json` 或 `/settings` 面板的 Mermaid diagrams 选项）。默认 `streaming` 逐帧重绘，`final` 渲染最终版更稳定。
 
 ## 本地开发

package/extensions/feature/compact-thinking.ts

@@ -280,7 +280,7 @@ function hiddenPreviewHint(
 
 const expandedThinking = new Set<number>();
 
-/** 折叠预览 + 展开全文。fullscreen 点击 hint 展开、再点整块收起，对齐工具卡。 */
+/** 折叠预览 + 展开全文。fullscreen 点击 hint 展开、双击整块收起，对齐工具卡。 */
 export class ThinkingPreviewBlock implements Component {
 	private heading: string;
 	private text: string;

package/extensions/renderer/compact-mode.ts

@@ -322,70 +322,104 @@ function editWriteExpandedCard(theme: any): any {
 	);
 }
 
-/** compact 展开卡：外卡片保持 userMessageBg 原色；内部 tool call card（addToolChild）
+/** compact 展开卡：外卡片保持 userMessageBg 原色；内部 tool call card
  *  背景更深一层且只覆盖内容区（左右内缩、上下限首尾文本行），形成嵌套层次。
- *  逐行重建背景同时修复嵌套 Box 的右侧截断。 */
-function expandedToolCard(theme: any): any {
+ *  hits：非工具子卡（thinking）的行区间，供展开后点击 hint。 */
+function layoutExpandedToolCard(
+	theme: any,
+	children: any[],
+	width: number,
+): { lines: string[]; hits: Array<{ child: any; start: number; end: number }> } {
 	const slot = "userMessageBg";
 	const toolBgAnsi = darkenBgAnsi(theme, slot);
+	const innerWidth = Math.max(0, width - 2);
+	const lines: string[] = [];
+	const hits: Array<{ child: any; start: number; end: number }> = [];
+	const isThinkingPreview = (child: any) => typeof child?.setHintHovered === "function";
+	lines.push(paddedBackgroundRow(theme, slot, "", width));
+	// 展开不再显示摘要行：跳过第一个 child 的首行空白，避免白占一行
+	let skipLeadingBlank = true;
+	for (const child of children) {
+		const childLines = child.render(innerWidth);
+		// 展开的 thinking 与 tool 一样走嵌套深色卡，避免贴在外卡同色底上看不见。
+		const nest = child.__ccToolCard || (isThinkingPreview(child) && child.expanded === true);
+		if (!nest) {
+			let start = 0;
+			if (skipLeadingBlank) {
+				while (start < childLines.length && !hasVisibleText(childLines[start])) start++;
+				skipLeadingBlank = false;
+			}
+			const rangeStart = lines.length;
+			for (let i = start; i < childLines.length; i++) {
+				lines.push(paddedBackgroundRow(theme, slot, childLines[i], width));
+			}
+			if (lines.length > rangeStart) hits.push({ child, start: rangeStart, end: lines.length });
+			continue;
+		}
+		// 工具卡：前导 1 空行 + 首尾文本行之间的内容区（深色）；不保留尾随，
+		// 相邻工具卡之间正好 1 空行，底部由卡片 padding 收尾。
+		skipLeadingBlank = false;
+		let first = -1;
+		let last = -1;
+		for (let i = 0; i < childLines.length; i++) {
+			if (hasVisibleText(childLines[i])) {
+				if (first < 0) first = i;
+				last = i;
+			}
+		}
+		if (first < 0) {
+			for (const line of childLines) {
+				lines.push(paddedBackgroundRow(theme, slot, line, width));
+			}
+			continue;
+		}
+		lines.push(paddedBackgroundRow(theme, slot, "", width));
+		const rangeStart = lines.length;
+		// 子卡片内部上下各 1 行深色 padding
+		lines.push(toolCardBgRow(theme, slot, toolBgAnsi, "", width));
+		for (let i = first; i <= last; i++) {
+			lines.push(toolCardBgRow(theme, slot, toolBgAnsi, childLines[i], width));
+		}
+		lines.push(toolCardBgRow(theme, slot, toolBgAnsi, "", width));
+		if (isThinkingPreview(child)) hits.push({ child, start: rangeStart, end: lines.length });
+	}
+	lines.push(paddedBackgroundRow(theme, slot, "", width));
+	return { lines, hits };
+}
+
+function compactRoundCard(
+	cardItems: Array<{ child?: any; tool?: any }>,
+	toolRender: (tool: any, width: number) => string[],
+): any {
 	const children: any[] = [];
+	for (const item of cardItems) {
+		if (item.child) children.push(item.child);
+		else if (item.tool) {
+			const tool = item.tool;
+			children.push({
+				__ccToolCard: true,
+				render: (innerWidth: number) => toolRender(tool, innerWidth),
+				invalidate: () => tool.invalidate?.(),
+			});
+		}
+	}
 	return {
 		children,
-		addChild(child: any) {
-			children.push(child);
-		},
-		addToolChild(child: any) {
-			child.__ccToolCard = true;
-			children.push(child);
-		},
 		render(width: number): string[] {
-			const innerWidth = Math.max(0, width - 2);
-			const lines: string[] = [];
-			lines.push(paddedBackgroundRow(theme, slot, "", width));
-			// 展开不再显示摘要行：跳过第一个 child 的首行空白，避免白占一行
-			let skipLeadingBlank = true;
-			for (const child of children) {
-				const childLines = child.render(innerWidth);
-				if (!child.__ccToolCard) {
-					let start = 0;
-					if (skipLeadingBlank) {
-						while (start < childLines.length && !hasVisibleText(childLines[start])) start++;
-						skipLeadingBlank = false;
-					}
-					for (let i = start; i < childLines.length; i++) {
-						lines.push(paddedBackgroundRow(theme, slot, childLines[i], width));
-					}
-					continue;
-				}
-				// 工具卡：前导 1 空行 + 首尾文本行之间的内容区（深色）；不保留尾随，
-				// 相邻工具卡之间正好 1 空行，底部由卡片 padding 收尾。
-				skipLeadingBlank = false;
-				let first = -1;
-				let last = -1;
-				for (let i = 0; i < childLines.length; i++) {
-					if (hasVisibleText(childLines[i])) {
-						if (first < 0) first = i;
-						last = i;
-					}
-				}
-				if (first < 0) {
-					for (const line of childLines) {
-						lines.push(paddedBackgroundRow(theme, slot, line, width));
-					}
-					continue;
-				}
-				lines.push(paddedBackgroundRow(theme, slot, "", width));
-				// 子卡片内部上下各 1 行深色 padding
-				lines.push(toolCardBgRow(theme, slot, toolBgAnsi, "", width));
-				for (let i = first; i <= last; i++) {
-					lines.push(toolCardBgRow(theme, slot, toolBgAnsi, childLines[i], width));
-				}
-				lines.push(toolCardBgRow(theme, slot, toolBgAnsi, "", width));
+			return ["", ...layoutExpandedToolCard(themeOf(), children, width).lines];
+		},
+		childAtRow(localRow: number, width: number) {
+			if (localRow < 1) return null;
+			const row = localRow - 1;
+			const { hits } = layoutExpandedToolCard(themeOf(), children, width);
+			for (const hit of hits) {
+				if (row >= hit.start && row < hit.end) return hit.child;
 			}
-			lines.push(paddedBackgroundRow(theme, slot, "", width));
-			return lines;
+			return null;
+		},
+		invalidate() {
+			for (const child of children) child.invalidate?.();
 		},
-		invalidate() {},
 	};
 }
 
@@ -477,7 +511,7 @@ function compactEditWriteLine(
 	component: any,
 	width: number,
 	writeMetadata?: WriteExecutionMetadataStore,
-	options: { hint?: boolean } = {},
+	options: { hint?: boolean; flushLeft?: boolean } = {},
 ): string[] {
 	const theme = themeOf();
 	const name = String(component.toolName ?? "tool");
@@ -511,7 +545,8 @@ function compactEditWriteLine(
 			statsStyled = ` ${theme.fg("dim", "(")}${theme.fg("success", `+${stats.added}`)} ${theme.fg("error", `-${stats.removed}`)}${theme.fg("dim", ")")}`;
 		}
 	}
-	const iconPart = ` ${theme.fg(iconColor, icon)} `;
+	// 展开卡 Box(1,1) 已 pad；折叠行自己留 1 格前导空格
+	const iconPart = `${options.flushLeft ? "" : " "}${theme.fg(iconColor, icon)} `;
 	const namePart = theme.fg("toolTitle", name);
 	const hintText =
 		options.hint !== false && component.expanded !== true ? ` • ${showMoreHintText()}` : "";
@@ -603,6 +638,7 @@ function compactEditWriteLines(
 			state.ccstyleIoView,
 			component.args,
 			component,
+			true, // 外层 Box(1,1) 已 pad
 		);
 		component.resultRendererComponent = detail;
 	}
@@ -614,12 +650,16 @@ function compactEditWriteLines(
 	const box = editWriteExpandedCard(theme);
 	box.addChild({
 		render(innerWidth: number): string[] {
-			return compactEditWriteLine(component, innerWidth, writeMetadata, { hint: false }).slice(1);
+			return compactEditWriteLine(component, innerWidth, writeMetadata, {
+				hint: false,
+				flushLeft: true,
+			}).slice(1);
 		},
 		invalidate() {},
 	});
 	box.addChild(detail);
-	return box.render(width);
+	// 与原生 ToolExecutionComponent 一样：Spacer(1) + Box，否则贴上一条 tool 少 1 行间距
+	return ["", ...box.render(width)];
 }
 
 function compactAssistantLineComponent(
@@ -980,26 +1020,11 @@ export function installCompactMode(deps: CompactModeInstallDeps): CompactModeHoo
 					tool.updateDisplay?.();
 				}
 			}
-			round.anchor.contentContainer.addChild({
-				render(width: number): string[] {
-					const theme = themeOf();
-					const box = expandedToolCard(theme);
-					for (const item of cardItems) {
-						if (item.child) box.addChild(item.child);
-						else if (item.tool) {
-							const tool = item.tool;
-							box.addToolChild({
-								render: (innerWidth: number) => patch.toolOriginalRender.call(tool, innerWidth),
-								invalidate: () => tool.invalidate?.(),
-							});
-						}
-					}
-					return ["", ...box.render(width)];
-				},
-				invalidate() {
-					for (const item of cardItems) item.child?.invalidate?.();
-				},
-			});
+			round.anchor.contentContainer.addChild(
+				compactRoundCard(cardItems, (tool, innerWidth) =>
+					patch.toolOriginalRender.call(tool, innerWidth),
+				),
+			);
 			// 展开卡内工具会显示 error，外层仍挂 abort/length，避免只藏在折叠工具里。
 			appendStopStatus(round.anchor, stopStatus);
 			return;

package/extensions/renderer/mouse/interaction.ts

@@ -3,6 +3,7 @@ import { ThinkingPreviewBlock } from "../../feature/compact-thinking.ts";
 import { patchRegistry, TOOL_MOUSE_OWNER_KEY } from "../../utils/patch-keys.ts";
 import { ToolGroupComponent } from "../tool/grouping.ts";
 import { isCompactAssistantComponent, setHoveredCompactAssistant } from "../compact-mode.ts";
+import { isMessageDisplayComponent } from "../tool/message-display.ts";
 import { config } from "../../config/config.ts";
 import { isLazyProxyTui } from "../../utils/fullscreen-detect.ts";
 import { setToolTuiFullscreen } from "../tool/show-more-hint.ts";
@@ -153,6 +154,34 @@ function updateToolSummaryHover(tui: any, packet: SgrMousePacket): void {
 		tui.requestRender?.();
 }
 
+const EXPAND_PANEL_DOUBLE_CLICK_MS = 400;
+let lastExpandPanelClick: { card: any; at: number } | null = null;
+
+function isExpandPanelDoubleClick(card: any): boolean {
+	const now = Date.now();
+	const prev = lastExpandPanelClick;
+	lastExpandPanelClick = { card, at: now };
+	return Boolean(prev && prev.card === card && now - prev.at <= EXPAND_PANEL_DOUBLE_CLICK_MS);
+}
+
+function clearExpandPanelDoubleClick(): void {
+	lastExpandPanelClick = null;
+}
+
+function collapseExpandedCard(tui: any, card: any): boolean {
+	if (!isExpandPanelDoubleClick(card)) return false;
+	card.setExpanded(false);
+	setHoveredToolCallId(null);
+	setHoveredToolGroup(null);
+	setHoveredThinking(null);
+	setHoveredToolIo(null, null);
+	setHoveredCompactAssistant(null);
+	card.invalidate?.();
+	tui.requestRender?.();
+	clearExpandPanelDoubleClick();
+	return true;
+}
+
 function toggleToolAtMouseClick(tui: any, packet: SgrMousePacket): boolean {
 	const region = interactionRegionAt(packet);
 	if (!region) return false;
@@ -160,16 +189,9 @@ function toggleToolAtMouseClick(tui: any, packet: SgrMousePacket): boolean {
 	if (region.kind === "show-more") return tryOpenToolIoShowMore(region);
 	const component = region.component;
 	if (!component) return false;
-	if (region.kind === "expanded-card") {
-		component.setExpanded(false);
-		setHoveredToolCallId(null);
-		setHoveredToolGroup(null);
-		setHoveredToolIo(null, null);
-		component.invalidate?.();
-		tui.requestRender?.();
-		return true;
-	}
+	if (region.kind === "expanded-card") return collapseExpandedCard(tui, component);
 	component.setExpanded(true);
+	clearExpandPanelDoubleClick();
 	setHoveredToolCallId(null);
 	setHoveredToolGroup(null);
 	setHoveredToolIo(null, null);
@@ -242,10 +264,10 @@ const FULLSCREEN_VIEWPORT_PATCH = Symbol("ccstyle.fullscreen-viewport-patch");
 const FULLSCREEN_WHEEL_SCROLL_ORIGINAL = Symbol("ccstyle.fullscreen-wheel-scroll-original");
 
 /**
- * 官方 fullscreen 工具卡点击：collapsed hint 点击展开
- * （有且仅保持一个展开：展开前收起其他工具卡），expanded 整卡二次点击收起，
- * 截断头 show-more 打开全量预览；回到底部按钮 scrollToBottom。
- * 滚动条列、含 OSC8 链接行、非工具区域放行官方。
+ * 官方 fullscreen 工具卡点击：collapsed hint 单击展开
+ * （有且仅保持一个展开：展开前收起其他工具卡），expanded 整卡双击收起，
+ * 截断头 show-more 单击打开全量预览；回到底部按钮 scrollToBottom。
+ * 滚动条列、含 OSC8 链接行、非工具区域、展开卡单击放行官方。
  */
 function handleFullscreenToolClick(tui: any, packet: SgrMousePacket): boolean {
 	const layout = tui.currentLayout;
@@ -276,7 +298,8 @@ function handleFullscreenToolClick(tui: any, packet: SgrMousePacket): boolean {
 	const isGroup = component instanceof ToolGroupComponent;
 	const isAssistant = isCompactAssistantComponent(component);
 	const isThinking = component instanceof ThinkingPreviewBlock;
-	if (!isTool && !isGroup && !isAssistant && !isThinking) return false;
+	const isMessage = isMessageDisplayComponent(component);
+	if (!isTool && !isGroup && !isAssistant && !isThinking && !isMessage) return false;
 	if (!component.expanded) {
 		// collapsed 仅按钮文本可展开，不能把同一行正文/留白变成点击区。
 		const hint = collapsedHintHitbox(line);
@@ -286,11 +309,14 @@ function handleFullscreenToolClick(tui: any, packet: SgrMousePacket): boolean {
 		collectFullscreenToolCards(hit.box.component, others);
 		for (const other of others) {
 			if (other !== component && other.expanded) {
+				// 展开 round 内 thinking 时不要把外层 compact 卡收起。
+				if (isThinking && isCompactAssistantComponent(other)) continue;
 				other.setExpanded(false);
 				other.invalidate?.();
 			}
 		}
 		component.setExpanded(true);
+		clearExpandPanelDoubleClick();
 	} else {
 		// 普通工具截断头 show-more：打开全量预览（不收起）。
 		const view = isTool ? component.resultRendererComponent : null;
@@ -312,8 +338,8 @@ function handleFullscreenToolClick(tui: any, packet: SgrMousePacket): boolean {
 				}
 			}
 		}
-		// 整卡二次点击：内部工具仍归所属 group，保持整体展开/收起语义。
-		card.setExpanded(false);
+		// 双击收起：内部工具仍归所属 group。单击放行官方（选择/链接）。
+		return collapseExpandedCard(tui, card);
 	}
 	// 点击后清 hover 高亮。
 	setHoveredToolCallId(null);
@@ -389,6 +415,9 @@ function handleFullscreenToolHover(tui: any, packet: SgrMousePacket): void {
 			} else if (isCompactAssistantComponent(component)) {
 				// compact 摘要行：折叠时仅提示文字高亮，展开卡整体高亮。
 				if (component.expanded || overHint) target = { kind: "assistant", component };
+			} else if (isMessageDisplayComponent(component)) {
+				// skill/compaction/branch：折叠只点 hint；展开后双击收起。
+				if (component.expanded || overHint) target = { kind: "assistant", component };
 			}
 		}
 	}
@@ -787,6 +816,7 @@ export function teardownToolMouseInteraction(
 	setHoveredThinking(null);
 	setHoveredToolIo(null, null);
 	setHoveredCompactAssistant(null);
+	clearExpandPanelDoubleClick();
 	try {
 		if (isLazyProxyTui(getToolMouseTui())) releaseFullscreenToolMouseMotion(getToolMouseTui());
 		else getToolMouseTui()?.terminal?.write?.(TOOL_MOUSE_DISABLE);

package/extensions/renderer/mouse/layout.ts

@@ -2,6 +2,7 @@ import { visibleWidth } from "@earendil-works/pi-tui";
 import { ThinkingPreviewBlock } from "../../feature/compact-thinking.ts";
 import { isCompactAssistantComponent } from "../compact-mode.ts";
 import { ToolGroupComponent } from "../tool/grouping.ts";
+import { isMessageDisplayComponent } from "../tool/message-display.ts";
 import { isToolExecutionComponent, stripTerminalSequencesPreservingLayout } from "./packets.ts";
 import { getScrollButtonWidget } from "./scroll.ts";
 
@@ -77,6 +78,29 @@ export function isScrollbarColumnAt(layout: any, x: number): boolean {
 	return hit;
 }
 
+/** compact 展开卡用 childAtRow 映射 thinking；其余按 render 行数下钻。 */
+function nestedChildAtRow(node: any, localRow: number, width: number): any {
+	if (typeof node?.childAtRow === "function") {
+		return node.childAtRow(localRow, width);
+	}
+	if (!Array.isArray(node?.children)) return null;
+	let offset = 0;
+	for (const child of node.children) {
+		let count = 0;
+		try {
+			const rendered = child.render?.(width);
+			if (Array.isArray(rendered)) count = rendered.length;
+		} catch {
+			count = 0;
+		}
+		if (localRow < offset + count) {
+			return nestedChildAtRow(child, localRow - offset, width);
+		}
+		offset += count;
+	}
+	return null;
+}
+
 /**
  * 布局 leaf box 的组件通常是容器（documentContainer/dock 容器等），工具卡与
  * widget 在其 children 内。按局部行遍历组件树，定位实际命中的子组件。
@@ -95,12 +119,21 @@ export function componentAtLocalRow(
 		return { component, row: localRow };
 	}
 	if (isCompactAssistantComponent(component)) {
-		// compact 摘要行整体作为可展开卡片（折叠摘要 / 展开内容）。
+		// 折叠：整行摘要。展开：先命中内部 thinking hint，其余仍归外层卡片。
+		if (component.expanded === true) {
+			const inner = nestedChildAtRow(component, localRow, width);
+			if (inner instanceof ThinkingPreviewBlock) {
+				return { component: inner, row: localRow };
+			}
+		}
 		return { component, row: localRow };
 	}
 	if (component instanceof ThinkingPreviewBlock) {
 		return { component, row: localRow };
 	}
+	if (isMessageDisplayComponent(component)) {
+		return { component, row: localRow };
+	}
 	if (component === getScrollButtonWidget()) {
 		return { component, row: localRow };
 	}
@@ -139,7 +172,8 @@ export function collectFullscreenToolCards(
 		isToolExecutionComponent(component) ||
 		component instanceof ToolGroupComponent ||
 		isCompactAssistantComponent(component) ||
-		component instanceof ThinkingPreviewBlock
+		component instanceof ThinkingPreviewBlock ||
+		isMessageDisplayComponent(component)
 	) {
 		out.push(component);
 		return;

package/extensions/renderer/tool/message-display.ts

@@ -134,7 +134,7 @@ export function installMessageDisplayRendering(): () => void {
 }
 
 /** 三个消息组件共享的结构特征；CustomMessageComponent 用 rebuild 无 updateDisplay，不命中。 */
-function isMessageDisplayComponent(value: any): boolean {
+export function isMessageDisplayComponent(value: any): boolean {
 	return Boolean(
 		value &&
 			typeof value === "object" &&

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "pi-cc-extensions",
-	"version": "0.8.62",
+	"version": "0.8.63",
 	"license": "MIT",
 	"description": "A Pi productivity suite with Claude Code-style UI, context inspection, and agent/session references",
 	"type": "module",