pi-cc-extensions 0.9.2 → 0.9.4

package/README.en.md

@@ -1,26 +1,16 @@
-<p align="center">
-  <img src="./assets/readme/hero.en.svg" width="100%" alt="pi-cc-extensions: a productivity extension suite for Pi">
-</p>
-
-<p align="center">
-  <a href="https://pi.dev/packages?name=pi-cc-extensions"><img alt="Pi package catalog" src="https://img.shields.io/badge/Pi-package-58B7FF?style=flat-square"></a>
-  <a href="https://www.npmjs.com/package/pi-cc-extensions"><img alt="npm version" src="https://img.shields.io/npm/v/pi-cc-extensions?style=flat-square&color=66E3C4"></a>
-  <a href="#compatibility"><img alt="Node.js 22.19 or newer" src="https://img.shields.io/badge/Node.js-%E2%89%A522.19-66E3C4?style=flat-square"></a>
-</p>
-
-<p align="center">
-  Claude Code-style TUI output with some personal touches and handy utilities.
-</p>
-
 <p align="center">
   <a href="./README.md">简体中文</a> · <strong>English</strong>
 </p>
 
----
+# pi-cc-extensions
+
+> Claude Code-style TUI output with some personal touches and handy utilities.
 
 ## Preview
 
-https://github.com/user-attachments/assets/6c858000-fdad-43f9-957f-4d0278648498
+<a href="https://github.com/user-attachments/assets/6c858000-fdad-43f9-957f-4d0278648498"><img src="./assets/readme/preview.webp" alt="pi-cc-extensions UI preview" width="100%"></a>
+
+Click the cover to play the demo video
 
 ## Quick start
 
@@ -39,18 +29,20 @@ Run `/reload` after installation.
 | --------------------------- | ----------------------------------------------------------------------------------------- | ----------------------------------------------- |
 | Claude Code UI              | Tool summaries, expand/collapse, rich edit/write diffs, and `on` / `compact` / `off` modes | `/ccstyle`                                      |
 | Markdown enhancements       | Mermaid diagrams, admonitions, URL linking, and more                                      | Automatic                                       |
-| 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` |
+| Fullscreen mode             | Tool card/group expand and collapse, previews, hover highlight, and a back-to-bottom button | `TUIMODE=fullscreen` or `--tui-mode fullscreen` |
 | Settings panel              | `Style / Features / UI / Diff / Thinking / Footer` tabs                                   | `/ccstyle`                                      |
 | Context inspection          | Usage breakdown and previews for the system prompt, memory, skills, tools definition, and messages | `/context`                                      |
 | Session/Subagent references | Search and inject effective context from previous Sessions or existing SubAgents          | `@`                                             |
 | Status bar                  | Shows model, context, cache, cost, and git; also works with `@narumitw/pi-usage` for live quota. Git/cache Nerd Font icons can be turned off | `/ccstyle`                                      |
 | Theme                       | Bundled CC Dark and CC Light themes                                                       | `/theme`                                        |
 
+Renderer snapshots for `on` / `compact` modes: [default](./docs/tool-render-examples-default.md) · [compact](./docs/tool-render-examples-compact.md)
+
 ## Configuration
 
 `/ccstyle` behavior is configured through `~/.pi/agent/pi-cc-extensions.json`:
 
-```js
+```jsonc
 {
   // style
   "mode": "on",                            // on / compact / off
@@ -96,9 +88,11 @@ Run `/reload` after installation.
 }
 ```
 
+> [!TIP]
 > **Fullscreen**: click `click to show more` to expand tool cards, thinking, Skill, and compact summaries. When expanded Input/Output exceeds the line cap, the footer `… +N more lines • click to show more` opens a full preview. Double-click an expanded panel to collapse it.
->
-> **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.
+
+> [!NOTE]
+> **Mermaid rendering**: 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
 
@@ -126,3 +120,7 @@ npm run typecheck
 ## Credits
 
 - Rich diffs are adapted from [`MasuRii/pi-tool-display`](https://github.com/MasuRii/pi-tool-display) (MIT). See [`extensions/renderer/tool/diff/ATTRIBUTION.md`](./extensions/renderer/tool/diff/ATTRIBUTION.md).
+
+## License
+
+[MIT](./LICENSE) © minuque

package/README.md

@@ -1,26 +1,16 @@
-<p align="center">
-  <img src="./assets/readme/hero.svg" width="100%">
-</p>
-
-<p align="center">
-  <a href="https://pi.dev/packages?name=pi-cc-extensions"><img alt="Pi package catalog" src="https://img.shields.io/badge/Pi-package-58B7FF?style=flat-square"></a>
-  <a href="https://www.npmjs.com/package/pi-cc-extensions"><img alt="npm version" src="https://img.shields.io/npm/v/pi-cc-extensions?style=flat-square&color=66E3C4"></a>
-  <a href="#兼容性"><img alt="Node.js 22.19 or newer" src="https://img.shields.io/badge/Node.js-%E2%89%A522.19-66E3C4?style=flat-square"></a>
-</p>
-
-<p align="center">
-  类 Claude Code TUI 输出风格，并融入了一些个人喜好，和一些实用小功能。
-</p>
-
 <p align="center">
   <strong>简体中文</strong> · <a href="./README.en.md">English</a>
 </p>
 
----
+# pi-cc-extensions
+
+> 类 Claude Code TUI 输出风格，并融入了一些个人喜好，和一些实用小功能。
 
 ## 界面预览
 
-https://github.com/user-attachments/assets/6c858000-fdad-43f9-957f-4d0278648498
+<a href="https://github.com/user-attachments/assets/6c858000-fdad-43f9-957f-4d0278648498"><img src="./assets/readme/preview.webp" alt="pi-cc-extensions 界面预览" width="100%"></a>
+
+点击封面播放演示视频
 
 ## 快速开始
 
@@ -46,11 +36,13 @@ pi install git:github.com/minuque/pi-cc-extensions
 | 状态栏                | 显示：模型、上下文、缓存、费用、git并适配 @narumitw/pi-usage 实时显示额度；git/缓存图标可关 Nerd Font | `/ccstyle`                              |
 | 主题                  | 随包提供内置 CC Dark、CC Light 主题                                             | `/theme`                                        |
 
+`on` / `compact` 两种模式的渲染样例：[默认模式](./docs/tool-render-examples-default.md) · [紧凑模式](./docs/tool-render-examples-compact.md)
+
 ## 配置
 
 `/ccstyle` 的行为由 `~/.pi/agent/pi-cc-extensions.json` 配置：
 
-```js
+```jsonc
 {
   // style
   "mode": "on",                            // on / compact / off
@@ -96,9 +88,11 @@ pi install git:github.com/minuque/pi-cc-extensions
 }
 ```
 
-> **Fullscreen**：单击 `click to show more` 展开工具卡、思考、Skill 和 compact 摘要；展开后 Input/Output 超行时，末行 `… +N more lines • click to show more` 打开全量预览, 双击展开面板收起。
->
-> **建议**：`markdown.mermaid` 设为 `final`（`~/.pi/agent/settings.json` 或 `/settings` 面板的 Mermaid diagrams 选项）。默认 `streaming` 逐帧重绘，`final` 渲染最终版更稳定。
+> [!TIP]
+> **全屏模式**：单击 `click to show more` 展开工具卡、思考、Skill 和 compact 摘要；展开后 Input/Output 超行时，末行 `… +N more lines • click to show more` 打开全量预览，双击展开面板收起。
+
+> [!NOTE]
+> **Mermaid 渲染**：建议把 `markdown.mermaid` 设为 `final`（`~/.pi/agent/settings.json` 或 `/settings` 面板的 Mermaid diagrams 选项）。默认 `streaming` 逐帧重绘，`final` 渲染最终版更稳定。
 
 ## 本地开发
 
@@ -126,3 +120,7 @@ npm run typecheck
 ## 致谢
 
 - Rich diff 改编自 [`MasuRii/pi-tool-display`](https://github.com/MasuRii/pi-tool-display)（MIT）；详见 [`extensions/renderer/tool/diff/ATTRIBUTION.md`](./extensions/renderer/tool/diff/ATTRIBUTION.md)。
+
+## 许可证
+
+[MIT](./LICENSE) © minuque

package/extensions/config/config.ts

@@ -102,6 +102,7 @@ export const SCROLL_STEP_LINES_VALUES = ["1", "2", "3", "5", "10"];
 /** Tools commonly toggled in excludeRenderers via the settings panel. */
 export const EXCLUDE_RENDERER_CANDIDATES = [
 	"bash",
+	"powershell",
 	"read",
 	"edit",
 	"write",

package/extensions/renderer/default-mode.ts

@@ -241,12 +241,16 @@ function createCcstyleTool(
 			const isPending =
 				visualState === "pending" ||
 				(!visualState && (context?.isPartial || context?.executionStarted));
-			if (isPending && context?.executionStarted) scheduleAnimation(context);
-			const rawIcon = isPending ? pendingIcon(toolName) : settledIcon(toolName, visualState);
-			const icon =
+			const animating = isPending && Boolean(context?.executionStarted);
+			if (animating) scheduleAnimation(context, { light: true });
+			const settledRawIcon = isPending ? "" : settledIcon(toolName, visualState);
+			const settledIconStyled =
 				visualState === "success"
-					? `${BRIGHT_GREEN}${rawIcon}${ANSI_FG_RESET}`
-					: theme.fg(toolIconColor(context), rawIcon);
+					? `${BRIGHT_GREEN}${settledRawIcon}${ANSI_FG_RESET}`
+					: theme.fg(toolIconColor(context), settledRawIcon);
+			// 逐帧 spinner：帧在 render() 内取，动画定时器只需 requestRender，
+			// 不再每次 tick 走 updateDisplay 把整张卡重建一遍。
+			const pendingIconStyled = () => theme.fg(toolIconColor(context), pendingIcon(toolName));
 			const summary = toolCallSummary(toolName, args, {
 				title: label === toolName ? humanizeToolLabel(label) : label,
 				variant: "default",
@@ -270,10 +274,16 @@ function createCcstyleTool(
 			const extraStyled = writeStatsStyled || theme.fg("dim", summary.detail);
 			let cachedWidth: number | undefined;
 			let cachedLine: string | undefined;
+			let cachedIcon: string | undefined;
 			const expanded = Boolean(context?.expanded);
 			return {
 				render(width: number) {
-					if (cachedLine !== undefined && cachedWidth === width) return [cachedLine];
+					// 轻量 tick 只会 requestRender，靠这里续期，动画才能自维持。
+					if (animating) scheduleAnimation(context, { light: true });
+					const icon = isPending ? pendingIconStyled() : settledIconStyled;
+					if (cachedLine !== undefined && cachedWidth === width && cachedIcon === icon) {
+						return [cachedLine];
+					}
 					const viewportWidth = toolViewportWidth(width);
 					// 展开态贴左（外层 Box 已 pad 1）；折叠 self-shell 保留 1 格前导空格
 					const lead = expanded ? "" : " ";
@@ -283,11 +293,15 @@ function createCcstyleTool(
 					);
 					const mainWidth = Math.max(0, callWidth - visibleWidth(extraText));
 					cachedWidth = width;
+					cachedIcon = icon;
 					// 路径按最终可用宽度中间截断，避免整行二次截断隐藏文件名。
 					cachedLine = `${lead}${icon} ${theme.fg("toolTitle", fitToolCallSummary(summary, mainWidth))}${extraStyled}`;
 					return [truncateToWidth(cachedLine, viewportWidth, "")];
 				},
-				invalidate() {},
+				invalidate() {
+					cachedLine = undefined;
+					cachedIcon = undefined;
+				},
 			};
 		},
 		renderResult(result: any, options: any, theme: any, context: any) {

package/extensions/renderer/tool/grouping.ts

@@ -7,6 +7,7 @@ import {
 	type Component,
 } from "@earendil-works/pi-tui";
 import { TOOL_LOADING_INTERVAL_MS, toolLoadingIcon } from "../../utils/tool-loading-icon.ts";
+import { getToolMouseTui } from "../mouse/scroll.ts";
 import { isToolTuiFullscreen, showMoreHintText } from "./show-more-hint.ts";
 import { stripAnsi, stripBackgroundAnsi, stripLeadingStatusIcon } from "../../utils/ansi-text.ts";
 import { walkComponentTree } from "../../utils/component-tree.ts";
@@ -89,18 +90,38 @@ function scheduleGroupAnimation(patch: Patch): void {
 	patch.animationTimer = setTimeout(() => {
 		patch.animationTimer = null;
 		if (!patch.active) return;
+		let needsRender = false;
 		for (const group of patch.groups) {
 			if (
 				(group.children as any[]).some(
 					(tool) => tool?.executionStarted && status(tool) === "pending",
 				)
-			)
+			) {
 				group.invalidate();
+				// 分组卡不是 ToolExecutionComponent：它的 invalidate() 不会请求渲染，
+				// 不补这一步 spinner 只在别人渲染时才跳帧（并行工具下表现为卡顿/冻结）。
+				needsRender = true;
+			}
 		}
+		if (needsRender) requestAnimationRender(patch);
 	}, TOOL_LOADING_INTERVAL_MS);
 	patch.animationTimer.unref?.();
 }
 
+/** 借用子工具卡的 ui 请求一帧；子卡缺失时回退到扩展持有的 TUI 槽。 */
+function requestAnimationRender(patch: Patch): void {
+	for (const group of patch.groups) {
+		const ui = (group.children as any[]).find(
+			(tool) => typeof tool?.ui?.requestRender === "function",
+		)?.ui;
+		if (ui) {
+			ui.requestRender();
+			return;
+		}
+	}
+	getToolMouseTui()?.requestRender?.();
+}
+
 function visibleLines(lines: string[]): string[] {
 	return lines.filter((line) => stripAnsi(line).trim());
 }

package/extensions/renderer/tool/names.ts

@@ -7,11 +7,18 @@ function clip(value: unknown): string {
 	return oneLine(value, config.inputClip);
 }
 
+/** 品牌大小写固定写法；humanize 推导不出来的工具名写在这里。 */
+const TOOL_LABEL_OVERRIDES: Readonly<Record<string, string>> = {
+	powershell: "PowerShell",
+};
+
 /**
  * 工具名/标签人性化：与 default-mode 的 humanizeToolLabel、grouping 的 humanizeToolName
  * 逐字相同，收敛为一个共享实现。
  */
 export function humanizeToolLabel(label: string): string {
+	const brand = TOOL_LABEL_OVERRIDES[label.toLowerCase()];
+	if (brand) return brand;
 	return label
 		.replace(/([a-z0-9])([A-Z])/g, "$1 $2")
 		.replace(/[_-]+/g, " ")
@@ -134,11 +141,84 @@ function pathSummary(
 	};
 }
 
+/** 入参是 shell 命令的工具。 */
+const SHELL_TOOL_NAMES = new Set(["bash", "powershell", "pwsh", "sh", "zsh", "cmd"]);
+
+/** 内置检索工具：pattern 缺失（无效调用）时保留 "…" 占位。 */
+const SEARCH_TOOL_NAMES = new Set(["grep", "find"]);
+
+/**
+ * 通用摘要字段优先级：default 与 grouping 共用同一份取值链。
+ * 两处曾各自维护，grouping 因此漏掉 command（powershell）和数组型入参；
+ * 路径不在链上，由 pathSummary 兜底，以便按 cwd 相对化并中间截断。
+ */
+const GENERIC_SUMMARY_FIELDS = [
+	"agent_id",
+	"command",
+	"query",
+	"queries",
+	"claim",
+	"question",
+	"questions",
+	"url",
+	"urls",
+	"responseId",
+	"findText",
+	"name",
+	"tool_use_id",
+	"toolCallId",
+	"id",
+	"subject",
+	"taskId",
+	"task_id",
+	"message",
+	"description",
+	"prompt",
+] as const;
+
+/** 通用字段链取值：字符串直接用；数组取首个可展示项并标注剩余条数。 */
+type SummaryValue = { text: string; more: number };
+
+function arrayItemText(item: unknown): string | undefined {
+	if (typeof item === "string" && item) return item;
+	if (!item || typeof item !== "object") return undefined;
+	for (const key of ["query", "url", "question", "header", "name"] as const) {
+		const text = (item as Record<string, unknown>)[key];
+		if (typeof text === "string" && text) return text;
+	}
+	return undefined;
+}
+
+function summaryFieldValue(value: unknown): SummaryValue | undefined {
+	if (typeof value === "string" && value) return { text: value, more: 0 };
+	if (!Array.isArray(value)) return undefined;
+	let first: string | undefined;
+	let count = 0;
+	for (const item of value) {
+		const text = arrayItemText(item);
+		if (!text) continue;
+		count += 1;
+		first ??= text;
+	}
+	return first === undefined ? undefined : { text: first, more: count - 1 };
+}
+
+/** 通用字段链取值；无可用字段时返回 undefined，交给调用方继续降级。 */
+function genericSummary(title: string, args: any): ToolCallSummary | undefined {
+	for (const key of GENERIC_SUMMARY_FIELDS) {
+		const found = summaryFieldValue(args[key]);
+		if (!found) continue;
+		// (+N) 追加在截断之后，避免首个元素过长时把条数挤没
+		const more = found.more > 0 ? ` (+${found.more})` : "";
+		return { main: `${title} ${clip(found.text)}${more}`, detail: "" };
+	}
+	return undefined;
+}
+
 /**
  * 单工具调用摘要（{ main, detail }）。
  *
- * default-mode 与 grouping 共用；opts.variant 保留两处各自逐字一致的输出，
- * 不改动任何现有渲染字符串。
+ * 两个变体共用同一份取值链，只有 read/agent/skill/task 等具名分支存在必要差异。
  */
 export function toolCallSummary(
 	toolName: string,
@@ -216,58 +296,24 @@ export function toolCallSummary(
 			detail,
 		};
 	}
-	if (variant === "grouping") {
-		if (toolName === "bash") return { main: `Bash ${clip(args.command || "...")}`, detail: "" };
-		if (toolName === "grep") {
-			const pattern = clip(args.pattern || "...");
-			return {
-				main: `Grep ${JSON.stringify(pattern)}${args.path ? ` in ${clip(args.path)}` : ""}`,
-				detail: "",
-			};
-		}
-		if (toolName === "find") {
-			const pattern = clip(args.pattern || "...");
-			return {
-				main: `Find ${JSON.stringify(pattern)}${args.path ? ` in ${clip(args.path)}` : ""}`,
-				detail: "",
-			};
-		}
+	if (variant === "grouping" && SHELL_TOOL_NAMES.has(name)) {
+		// 分组行缺 command 时保留占位，避免与单工具卡一样只剩标题
+		return { main: value("...", "command"), detail: "" };
 	}
-	if (variant === "default") {
-		const preferredPath = args.path ?? args.file_path;
-		if (typeof preferredPath === "string" && preferredPath) {
-			return pathSummary(title, preferredPath, opts.cwd);
-		}
-		const preferred =
-			args.command ??
-			args.query ??
-			args.question ??
-			args.pattern ??
-			args.url ??
-			args.name ??
-			args.tool_use_id ??
-			args.toolCallId ??
-			args.id ??
-			args.message;
-		return {
-			main:
-				preferred !== undefined && preferred !== null && typeof preferred !== "object"
-					? `${title} ${clip(preferred)}`
-					: title,
-			detail: "",
-		};
+
+	// 检索类：pattern 是正文，path 只是范围；两个变体同格式
+	if (typeof args.pattern === "string" || SEARCH_TOOL_NAMES.has(name)) {
+		const pattern = clip(args.pattern || "...");
+		const scope = typeof args.path === "string" && args.path ? ` in ${clip(args.path)}` : "";
+		return { main: `${title} ${JSON.stringify(pattern)}${scope}`, detail: "" };
 	}
-	const preferred =
-		args.agent_id ??
-		args.path ??
-		args.file_path ??
-		args.url ??
-		args.description ??
-		args.query ??
-		args.name ??
-		args.prompt;
-	return {
-		main: `${title}${preferred === undefined ? "" : ` ${clip(preferred)}`}`,
-		detail: "",
-	};
+
+	const generic = genericSummary(title, args);
+	if (generic) return generic;
+
+	const preferredPath = args.path ?? args.file_path;
+	if (typeof preferredPath === "string" && preferredPath) {
+		return pathSummary(title, preferredPath, opts.cwd);
+	}
+	return { main: title, detail: "" };
 }

package/extensions/renderer/tool/result.ts

@@ -3,6 +3,7 @@ import { inspect } from "node:util";
 import { config } from "../../config/config.ts";
 import { showMoreHintText } from "./show-more-hint.ts";
 import { TOOL_LOADING_INTERVAL_MS, toolLoadingIcon } from "../../utils/tool-loading-icon.ts";
+import { getToolMouseTui } from "../mouse/scroll.ts";
 import { sanitizeToolResultText } from "../../utils/tool-result-sanitize.ts";
 
 const TOOL_VIEWPORT_WIDTH_RATIO = 0.8;
@@ -70,6 +71,7 @@ const activeAnimationContexts = new Set<any>();
 let sharedAnimationTimer: ReturnType<typeof setTimeout> | null = null;
 
 function clearAnimation(context: any) {
+	if (context?.state) context.state.ccstyleAnimationLight = false;
 	if (!context?.state?.ccstyleAnimationScheduled) return;
 	context.state.ccstyleAnimationScheduled = false;
 	activeAnimationContexts.delete(context);
@@ -82,6 +84,7 @@ function clearAnimation(context: any) {
 export function clearAllAnimations() {
 	for (const ctx of activeAnimationContexts) {
 		ctx.state.ccstyleAnimationScheduled = false;
+		ctx.state.ccstyleAnimationLight = false;
 	}
 	activeAnimationContexts.clear();
 	if (sharedAnimationTimer) {
@@ -90,8 +93,15 @@ export function clearAllAnimations() {
 	}
 }
 
-export function scheduleAnimation(context: any, intervalMs = TOOL_LOADING_INTERVAL_MS) {
+export function scheduleAnimation(
+	context: any,
+	options: { light?: boolean; intervalMs?: number } = {},
+) {
 	const state = (context.state ??= {});
+	// light：调用方自己在 render() 内重取 loading 帧，定时器只需请求重绘；
+	// 否则定时器走 context.invalidate()（compact 摘要等靠它重建）。
+	// 每次调用都按本次 options 写入，避免上次 light 残留后非 light 调用仍跳过 invalidate。
+	state.ccstyleAnimationLight = Boolean(options.light);
 	if (state.ccstyleAnimationScheduled) return;
 	state.ccstyleAnimationScheduled = true;
 	activeAnimationContexts.add(context);
@@ -100,11 +110,16 @@ export function scheduleAnimation(context: any, intervalMs = TOOL_LOADING_INTERV
 			sharedAnimationTimer = null;
 			const contexts = Array.from(activeAnimationContexts);
 			activeAnimationContexts.clear();
+			const tui = getToolMouseTui();
+			const canRequestRender = typeof tui?.requestRender === "function";
+			let lightFrames = false;
 			for (const ctx of contexts) {
 				ctx.state.ccstyleAnimationScheduled = false;
-				ctx.invalidate?.();
+				if (ctx.state.ccstyleAnimationLight && canRequestRender) lightFrames = true;
+				else ctx.invalidate?.();
 			}
-		}, intervalMs);
+			if (lightFrames) tui.requestRender();
+		}, options.intervalMs ?? TOOL_LOADING_INTERVAL_MS);
 	}
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "pi-cc-extensions",
-	"version": "0.9.2",
+	"version": "0.9.4",
 	"license": "MIT",
 	"description": "Claude Code-style TUI output with some personal touches and handy utilities.",
 	"type": "module",
@@ -21,7 +21,6 @@
 	"files": [
 		"extensions",
 		"assets/readme",
-		"assets/video",
 		"themes",
 		"README.md",
 		"README.en.md"
@@ -34,8 +33,8 @@
 			"./themes/cc-dark.json",
 			"./themes/cc-light.json"
 		],
-		"image": "https://raw.githubusercontent.com/minuque/pi-cc-extensions/main/assets/readme/preview.png",
-		"video": "https://github.com/user-attachments/assets/6c858000-fdad-43f9-957f-4d0278648498"
+		"image": "https://raw.githubusercontent.com/minuque/pi-cc-extensions/main/assets/readme/preview.webp",
+		"video": "https://github.com/minuque/pi-cc-extensions/releases/download/v0.9.4/demo.mp4"
 	},
 	"scripts": {
 		"test": "node --test tests/**/*.test.ts",

package/assets/readme/hero.en.svg

@@ -1,101 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="400" viewBox="0 0 1200 400" role="img" aria-labelledby="title desc">
-  <title id="title">pi-cc-extensions
-  </title>
-  <desc id="desc">The Claude and Pi brand marks together connect three extension capabilities: Claude Code-style output, context inspection, and historical Session references.
-  </desc>
-  <defs>
-    <linearGradient id="panel" x1="0" y1="0" x2="1" y2="1">
-      <stop offset="0" stop-color="#0D131B"/>
-      <stop offset="1" stop-color="#090D12"/>
-    </linearGradient>
-  </defs>
-  <rect width="1200" height="400" rx="28" fill="url(#panel)"/>
-  <rect x="1" y="1" width="1198" height="398" rx="27" fill="none" stroke="#263241" stroke-width="2"/>
-  <g id="title-block" transform="translate(64 58)" font-family="-apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', sans-serif">
-    <g font-family="ui-monospace, SFMono-Regular, Menlo, Consolas, monospace" font-size="16" font-weight="600" letter-spacing="1.4">
-      <text x="0" y="0" fill="#66E3C4">PI EXTENSION
-      </text>
-    </g>
-    <text x="0" y="82" fill="#F4F7FA" font-size="54" font-weight="750" letter-spacing="-1.5">pi-cc-extensions
-    </text>
-    <text x="0" y="130" fill="#B8C3CF" font-size="23">Make Pi work like Claude Code 🙃
-    </text>
-    <g transform="translate(0 180)" font-family="ui-monospace, SFMono-Regular, Menlo, Consolas, monospace" font-size="17">
-      <rect width="488" height="58" rx="12" fill="#111923" stroke="#2B3948"/>
-      <text x="20" y="36" fill="#66E3C4">›
-      </text>
-      <text x="44" y="36" fill="#F4F7FA">/ccstyle
-      </text>
-      <text x="155" y="36" fill="#536172">·
-      </text>
-      <text x="178" y="36" fill="#7CC7FF">/context
-      </text>
-      <text x="292" y="36" fill="#536172">·
-      </text>
-      <text x="315" y="36" fill="#F2C879">@session:
-      </text>
-      <rect x="411" y="22" width="9" height="20" rx="2" fill="#66E3C4"/>
-    </g>
-    <g transform="translate(0 282)" font-family="ui-monospace, SFMono-Regular, Menlo, Consolas, monospace" font-size="15">
-      <circle cx="6" cy="-5" r="6" fill="#66E3C4"/>
-      <text x="22" y="0" fill="#8B9AAD">3 EXTENSIONS
-      </text>
-      <text x="160" y="0" fill="#3B4857">•
-      </text>
-      <text x="183" y="0" fill="#8B9AAD">TYPESCRIPT
-      </text>
-      <text x="303" y="0" fill="#3B4857">•
-      </text>
-      <text x="326" y="0" fill="#8B9AAD">NODE ≥ 22.19
-      </text>
-    </g>
-  </g>
-  <g id="extension-map" transform="translate(662 48)" font-family="-apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', sans-serif">
-    <g id="claude-pi-mark" transform="translate(0 0)">
-      <!-- Official Claude starburst vector; source: Anthropic Claude brand mark. -->
-        <path transform="translate(2 2) scale(.34)" fill="#D97757" d="m19.6 66.5 19.7-11 .3-1-.3-.5h-1l-3.3-.2-11.2-.3L14 53l-9.5-.5-2.4-.5L0 49l.2-1.5 2-1.3 2.9.2 6.3.5 9.5.6 6.9.4L38 49.1h1.6l.2-.7-.5-.4-.4-.4L29 41l-10.6-7-5.6-4.1-3-2-1.5-2-.6-4.2 2.7-3 3.7.3.9.2 3.7 2.9 8 6.1L37 36l1.5 1.2.6-.4.1-.3-.7-1.1L33 25l-6-10.4-2.7-4.3-.7-2.6c-.3-1-.4-2-.4-3l3-4.2L28 0l4.2.6L33.8 2l2.6 6 4.1 9.3L47 29.9l2 3.8 1 3.4.3 1h.7v-.5l.5-7.2 1-8.7 1-11.2.3-3.2 1.6-3.8 3-2L61 2.6l2 2.9-.3 1.8-1.1 7.7L59 27.1l-1.5 8.2h.9l1-1.1 4.1-5.4 6.9-8.6 3-3.5L77 13l2.3-1.8h4.3l3.1 4.7-1.4 4.9-4.4 5.6-3.7 4.7-5.3 7.1-3.2 5.7.3.4h.7l12-2.6 6.4-1.1 7.6-1.3 3.5 1.6.4 1.6-1.4 3.4-8.2 2-9.6 2-14.3 3.3-.2.1.2.3 6.4.6 2.8.2h6.8l12.6 1 3.3 2 1.9 2.7-.3 2-5.1 2.6-6.8-1.6-16-3.8-5.4-1.3h-.8v.4l4.6 4.5 8.3 7.5L89 80.1l.5 2.4-1.3 2-1.4-.2-9.2-7-3.6-3-8-6.8h-.5v.7l1.8 2.7 9.8 14.7.5 4.5-.7 1.4-2.6 1-2.7-.6-5.8-8-6-9-4.7-8.2-.5.4-2.9 30.2-1.3 1.5-3 1.2-2.5-2-1.4-3 1.4-6.2 1.6-8 1.3-6.4 1.2-7.9.7-2.6v-.2H49L43 72l-9 12.3-7.2 7.6-1.7.7-3-1.5.3-2.8L24 86l10-12.8 6-7.9 4-4.6-.1-.5h-.3L17.2 77.4l-4.7.6-2-2 .2-3 1-1 8-5.5Z"/>
-        <path d="M50 3V35" stroke="#3A4857" stroke-width="2"/>
-        <!-- Official Pi logo vectors; source: https://pi.dev/logo-auto.svg -->
-          <g transform="translate(52 -5) scale(.06)" fill="#F4F7FA">
-            <path fill-rule="evenodd" d="M165.29 165.29H517.36V400H400V517.36H282.65V634.72H165.29ZM282.65 282.65V400H400V282.65Z"/>
-            <path d="M517.36 400H634.72V634.72H517.36Z"/>
-          </g>
-          <text x="104" y="15" fill="#F4F7FA" font-family="ui-monospace, SFMono-Regular, Menlo, Consolas, monospace" font-size="15" font-weight="700" letter-spacing=".8">CLAUDE CODE UX
-          </text>
-          <text x="104" y="34" fill="#7F8D9C" font-family="ui-monospace, SFMono-Regular, Menlo, Consolas, monospace" font-size="13" letter-spacing="1.2">FOR PI
-          </text>
-        </g>
-        <g transform="translate(0 52)">
-          <rect width="474" height="82" rx="14" fill="#101821" stroke="#2C3A48"/>
-          <rect width="5" height="82" rx="2.5" fill="#66E3C4"/>
-          <text x="26" y="32" fill="#F4F7FA" font-family="ui-monospace, SFMono-Regular, Menlo, Consolas, monospace" font-size="18" font-weight="700">/ccstyle
-          </text>
-          <text x="26" y="59" fill="#8B9AAD" font-size="16">Tool summaries · Diffs · Status bar
-          </text>
-          <circle cx="438" cy="29" r="9" fill="#66E3C4" opacity=".18"/>
-          <path d="M434 29l3 3 6-7" fill="none" stroke="#66E3C4" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-        </g>
-        <g transform="translate(0 144)">
-          <rect width="474" height="82" rx="14" fill="#101821" stroke="#2C3A48"/>
-          <rect width="5" height="82" rx="2.5" fill="#7CC7FF"/>
-          <text x="26" y="32" fill="#F4F7FA" font-family="ui-monospace, SFMono-Regular, Menlo, Consolas, monospace" font-size="18" font-weight="700">/context
-          </text>
-          <text x="26" y="59" fill="#8B9AAD" font-size="16">Usage breakdown · Injected content preview
-          </text>
-          <g transform="translate(416 23)">
-            <rect width="42" height="14" rx="7" fill="#1C2B38"/>
-            <rect width="27" height="14" rx="7" fill="#7CC7FF"/>
-          </g>
-        </g>
-        <g transform="translate(0 236)">
-          <rect width="474" height="82" rx="14" fill="#101821" stroke="#2C3A48"/>
-          <rect width="5" height="82" rx="2.5" fill="#F2C879"/>
-          <text x="26" y="32" fill="#F4F7FA" font-family="ui-monospace, SFMono-Regular, Menlo, Consolas, monospace" font-size="18" font-weight="700">@session:
-          </text>
-          <text x="26" y="59" fill="#8B9AAD" font-size="16">History completion · Cross-session references
-          </text>
-          <text x="431" y="40" fill="#F2C879" font-family="ui-monospace, SFMono-Regular, Menlo, Consolas, monospace" font-size="26">@
-          </text>
-        </g>
-      </g>
-    </svg>

package/assets/readme/hero.svg

@@ -1,101 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="400" viewBox="0 0 1200 400" role="img" aria-labelledby="title desc">
-  <title id="title">pi-cc-extensions
-  </title>
-  <desc id="desc">Claude 与 Pi 品牌图标组合连接三项扩展能力：Claude Code 风格界面、上下文洞察和历史 Session 引用。
-  </desc>
-  <defs>
-    <linearGradient id="panel" x1="0" y1="0" x2="1" y2="1">
-      <stop offset="0" stop-color="#0D131B"/>
-      <stop offset="1" stop-color="#090D12"/>
-    </linearGradient>
-  </defs>
-  <rect width="1200" height="400" rx="28" fill="url(#panel)"/>
-  <rect x="1" y="1" width="1198" height="398" rx="27" fill="none" stroke="#263241" stroke-width="2"/>
-  <g id="title-block" transform="translate(64 58)" font-family="-apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', sans-serif">
-    <g font-family="ui-monospace, SFMono-Regular, Menlo, Consolas, monospace" font-size="16" font-weight="600" letter-spacing="1.4">
-      <text x="0" y="0" fill="#66E3C4">PI EXTENSION
-      </text>
-    </g>
-    <text x="0" y="82" fill="#F4F7FA" font-size="54" font-weight="750" letter-spacing="-1.5">pi-cc-extensions
-    </text>
-    <text x="0" y="130" fill="#B8C3CF" font-size="23">让 Pi 工作时表现像 Claude code 🙃
-    </text>
-    <g transform="translate(0 180)" font-family="ui-monospace, SFMono-Regular, Menlo, Consolas, monospace" font-size="17">
-      <rect width="488" height="58" rx="12" fill="#111923" stroke="#2B3948"/>
-      <text x="20" y="36" fill="#66E3C4">›
-      </text>
-      <text x="44" y="36" fill="#F4F7FA">/ccstyle
-      </text>
-      <text x="155" y="36" fill="#536172">·
-      </text>
-      <text x="178" y="36" fill="#7CC7FF">/context
-      </text>
-      <text x="292" y="36" fill="#536172">·
-      </text>
-      <text x="315" y="36" fill="#F2C879">@session:
-      </text>
-      <rect x="411" y="22" width="9" height="20" rx="2" fill="#66E3C4"/>
-    </g>
-    <g transform="translate(0 282)" font-family="ui-monospace, SFMono-Regular, Menlo, Consolas, monospace" font-size="15">
-      <circle cx="6" cy="-5" r="6" fill="#66E3C4"/>
-      <text x="22" y="0" fill="#8B9AAD">3 EXTENSIONS
-      </text>
-      <text x="160" y="0" fill="#3B4857">•
-      </text>
-      <text x="183" y="0" fill="#8B9AAD">TYPESCRIPT
-      </text>
-      <text x="303" y="0" fill="#3B4857">•
-      </text>
-      <text x="326" y="0" fill="#8B9AAD">NODE ≥ 22.19
-      </text>
-    </g>
-  </g>
-  <g id="extension-map" transform="translate(662 48)" font-family="-apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', sans-serif">
-    <g id="claude-pi-mark" transform="translate(0 0)">
-      <!-- Official Claude starburst vector; source: Anthropic Claude brand mark. -->
-        <path transform="translate(2 2) scale(.34)" fill="#D97757" d="m19.6 66.5 19.7-11 .3-1-.3-.5h-1l-3.3-.2-11.2-.3L14 53l-9.5-.5-2.4-.5L0 49l.2-1.5 2-1.3 2.9.2 6.3.5 9.5.6 6.9.4L38 49.1h1.6l.2-.7-.5-.4-.4-.4L29 41l-10.6-7-5.6-4.1-3-2-1.5-2-.6-4.2 2.7-3 3.7.3.9.2 3.7 2.9 8 6.1L37 36l1.5 1.2.6-.4.1-.3-.7-1.1L33 25l-6-10.4-2.7-4.3-.7-2.6c-.3-1-.4-2-.4-3l3-4.2L28 0l4.2.6L33.8 2l2.6 6 4.1 9.3L47 29.9l2 3.8 1 3.4.3 1h.7v-.5l.5-7.2 1-8.7 1-11.2.3-3.2 1.6-3.8 3-2L61 2.6l2 2.9-.3 1.8-1.1 7.7L59 27.1l-1.5 8.2h.9l1-1.1 4.1-5.4 6.9-8.6 3-3.5L77 13l2.3-1.8h4.3l3.1 4.7-1.4 4.9-4.4 5.6-3.7 4.7-5.3 7.1-3.2 5.7.3.4h.7l12-2.6 6.4-1.1 7.6-1.3 3.5 1.6.4 1.6-1.4 3.4-8.2 2-9.6 2-14.3 3.3-.2.1.2.3 6.4.6 2.8.2h6.8l12.6 1 3.3 2 1.9 2.7-.3 2-5.1 2.6-6.8-1.6-16-3.8-5.4-1.3h-.8v.4l4.6 4.5 8.3 7.5L89 80.1l.5 2.4-1.3 2-1.4-.2-9.2-7-3.6-3-8-6.8h-.5v.7l1.8 2.7 9.8 14.7.5 4.5-.7 1.4-2.6 1-2.7-.6-5.8-8-6-9-4.7-8.2-.5.4-2.9 30.2-1.3 1.5-3 1.2-2.5-2-1.4-3 1.4-6.2 1.6-8 1.3-6.4 1.2-7.9.7-2.6v-.2H49L43 72l-9 12.3-7.2 7.6-1.7.7-3-1.5.3-2.8L24 86l10-12.8 6-7.9 4-4.6-.1-.5h-.3L17.2 77.4l-4.7.6-2-2 .2-3 1-1 8-5.5Z"/>
-        <path d="M50 3V35" stroke="#3A4857" stroke-width="2"/>
-        <!-- Official Pi logo vectors; source: https://pi.dev/logo-auto.svg -->
-          <g transform="translate(52 -5) scale(.06)" fill="#F4F7FA">
-            <path fill-rule="evenodd" d="M165.29 165.29H517.36V400H400V517.36H282.65V634.72H165.29ZM282.65 282.65V400H400V282.65Z"/>
-            <path d="M517.36 400H634.72V634.72H517.36Z"/>
-          </g>
-          <text x="104" y="15" fill="#F4F7FA" font-family="ui-monospace, SFMono-Regular, Menlo, Consolas, monospace" font-size="15" font-weight="700" letter-spacing=".8">CLAUDE CODE UX
-          </text>
-          <text x="104" y="34" fill="#7F8D9C" font-family="ui-monospace, SFMono-Regular, Menlo, Consolas, monospace" font-size="13" letter-spacing="1.2">FOR PI
-          </text>
-        </g>
-        <g transform="translate(0 52)">
-          <rect width="474" height="82" rx="14" fill="#101821" stroke="#2C3A48"/>
-          <rect width="5" height="82" rx="2.5" fill="#66E3C4"/>
-          <text x="26" y="32" fill="#F4F7FA" font-family="ui-monospace, SFMono-Regular, Menlo, Consolas, monospace" font-size="18" font-weight="700">/ccstyle
-          </text>
-          <text x="26" y="59" fill="#8B9AAD" font-size="16">工具摘要 · Diff · 状态栏
-          </text>
-          <circle cx="438" cy="29" r="9" fill="#66E3C4" opacity=".18"/>
-          <path d="M434 29l3 3 6-7" fill="none" stroke="#66E3C4" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-        </g>
-        <g transform="translate(0 144)">
-          <rect width="474" height="82" rx="14" fill="#101821" stroke="#2C3A48"/>
-          <rect width="5" height="82" rx="2.5" fill="#7CC7FF"/>
-          <text x="26" y="32" fill="#F4F7FA" font-family="ui-monospace, SFMono-Regular, Menlo, Consolas, monospace" font-size="18" font-weight="700">/context
-          </text>
-          <text x="26" y="59" fill="#8B9AAD" font-size="16">用量分布 · 注入内容预览
-          </text>
-          <g transform="translate(416 23)">
-            <rect width="42" height="14" rx="7" fill="#1C2B38"/>
-            <rect width="27" height="14" rx="7" fill="#7CC7FF"/>
-          </g>
-        </g>
-        <g transform="translate(0 236)">
-          <rect width="474" height="82" rx="14" fill="#101821" stroke="#2C3A48"/>
-          <rect width="5" height="82" rx="2.5" fill="#F2C879"/>
-          <text x="26" y="32" fill="#F4F7FA" font-family="ui-monospace, SFMono-Regular, Menlo, Consolas, monospace" font-size="18" font-weight="700">@session:
-          </text>
-          <text x="26" y="59" fill="#8B9AAD" font-size="16">历史补全 · 跨会话引用
-          </text>
-          <text x="431" y="40" fill="#F2C879" font-family="ui-monospace, SFMono-Regular, Menlo, Consolas, monospace" font-size="26">@
-          </text>
-        </g>
-      </g>
-    </svg>