pi-cc-extensions 0.8.65 → 0.8.67

package/README.en.md

@@ -40,8 +40,8 @@ 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 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`                                      |
+| Settings panel              | `Style / Diff / Thinking / UI / Feature` 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          | `@`                                             |
 | Theme                       | Bundled CC Dark and CC Light themes                                                       | `/theme`                                        |
 
@@ -62,11 +62,13 @@ Run `/reload` after installation.
   "writeDiffCollapsedLines": 0,            // write collapse lines; 0 = creation summary only
   "diffWordWrap": true,                    // wrap long diff lines
   "expandedPreviewMaxLines": 40,           // max lines for expanded bodies
+  "toolInputNameLength": 100,             // tool summary path/command clip length
 
   // thinking
   "useSummaryTitlesAsThinkingTitle": true, // use latest summary as thinking title
   "previewLines": 3,                       // preview lines; 0 hides
   "animationIntervalMs": 90,               // title animation interval (ms)
+  "dimThinkingText": false,               // dim thinking body text
 
   // ui
   "showStartupHeader": true,               // startup header (logo + tips) toggle

package/README.md

@@ -40,8 +40,8 @@ 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` |
-| 配置面板              | `Style / Diff / Thinking / Feature` 四页签，含启动头开关与滚轮步进              | `/ccstyle`                                      |
-| 上下文检查            | 查看上下文占用，并预览 System prompt、Tools、Skills 和消息内容                  | `/context`                                      |
+| 配置面板              | `Style / Diff / Thinking / UI / Feature` 五页签                                 | `/ccstyle`                                      |
+| 上下文检查            | 查看上下文占用，并预览 System prompt、Memory、Skills、Tools definition 和消息内容 | `/context`                                      |
 | Session/Subagent 引用 | 搜索并注入历史 Session 或现有 SubAgent 的有效上下文                             | `@`                                             |
 | 主题                  | 随包提供内置 CC Dark、CC Light 主题                                             | `/theme`                                        |
 
@@ -62,11 +62,13 @@ pi install git:github.com/minuque/pi-cc-extensions
   "writeDiffCollapsedLines": 0,            // write 折叠行数，0 仅显示创建摘要
   "diffWordWrap": true,                    // 长 diff 行换行
   "expandedPreviewMaxLines": 40,           // 展开正文最大行数
+  "toolInputNameLength": 100,             // 工具摘要 path/command 折叠字符数
 
   // thinking
   "useSummaryTitlesAsThinkingTitle": true, // 用最新摘要作思考标题
   "previewLines": 3,                       // 预览行数，0 隐藏
   "animationIntervalMs": 90,               // 标题动画间隔（毫秒）
+  "dimThinkingText": false,               // thinking 正文用 dim 色
 
   // ui
   "showStartupHeader": true,               // 启动头（logo + tips）开关

package/extensions/config/config.ts

@@ -52,9 +52,11 @@ export type Config = {
 	writeDiffCollapsedLines: number;
 	diffWordWrap: boolean;
 	expandedPreviewMaxLines: number;
+	toolInputNameLength: number;
 	useSummaryTitlesAsThinkingTitle: boolean;
 	previewLines: number;
 	animationIntervalMs: number;
+	dimThinkingText: boolean;
 	showStartupHeader: boolean;
 	scrollStepLines: number;
 	enableSessionReference: boolean;
@@ -76,6 +78,8 @@ export const DIFF_COLLAPSED_LINES_VALUES = ["12", "24", "36", "48", "80", "120"]
 export const WRITE_DIFF_COLLAPSED_LINES_VALUES = ["0", "4", "8", "12", "24", "36"];
 /** Presets for expanded body height — keep low options first so cycling stays TUI-friendly. */
 export const EXPANDED_PREVIEW_MAX_LINES_VALUES = ["40", "60", "80", "120", "200", "500", "2000"];
+/** 工具摘要里 path/command 等输入的折叠字符数。 */
+export const TOOL_INPUT_NAME_LENGTH_VALUES = ["40", "60", "80", "100", "120", "160"];
 export const THINKING_PREVIEW_LINES_VALUES = ["0", "1", "3", "5", "10"];
 export const THINKING_ANIMATION_INTERVAL_VALUES = ["40", "60", "90", "120", "180"];
 /** fullscreen 滚轮步进行数预设。 */
@@ -103,9 +107,11 @@ export const DEFAULT_CONFIG: Config = {
 	writeDiffCollapsedLines: DEFAULT_TOOL_DISPLAY_CONFIG.writeDiffCollapsedLines,
 	diffWordWrap: DEFAULT_TOOL_DISPLAY_CONFIG.diffWordWrap,
 	expandedPreviewMaxLines: DEFAULT_TOOL_DISPLAY_CONFIG.expandedPreviewMaxLines,
+	toolInputNameLength: 100,
 	useSummaryTitlesAsThinkingTitle: true,
 	previewLines: 3,
 	animationIntervalMs: 90,
+	dimThinkingText: false,
 	showStartupHeader: true,
 	scrollStepLines: 3,
 	enableSessionReference: true,
@@ -188,6 +194,12 @@ export function normalizeConfig(input: unknown): Config {
 			10,
 			50_000,
 		),
+		toolInputNameLength: pickPositiveInt(
+			source.toolInputNameLength,
+			DEFAULT_CONFIG.toolInputNameLength,
+			8,
+			500,
+		),
 		useSummaryTitlesAsThinkingTitle: source.useSummaryTitlesAsThinkingTitle !== false,
 		previewLines: pickPositiveInt(
 			source.previewLines,
@@ -199,6 +211,7 @@ export function normalizeConfig(input: unknown): Config {
 			source.animationIntervalMs,
 			DEFAULT_CONFIG.animationIntervalMs,
 		),
+		dimThinkingText: source.dimThinkingText === true,
 		showStartupHeader: source.showStartupHeader !== false,
 		scrollStepLines: pickPositiveInt(source.scrollStepLines, DEFAULT_CONFIG.scrollStepLines, 1, 50),
 		enableSessionReference: source.enableSessionReference !== false,
@@ -245,9 +258,11 @@ export function formatConfigStatus(source: Config = config): string {
 		`writeCollapsed=${source.writeDiffCollapsedLines}`,
 		`diffWordWrap=${source.diffWordWrap ? "on" : "off"}`,
 		`expandedMax=${source.expandedPreviewMaxLines}`,
+		`toolInputName=${source.toolInputNameLength}`,
 		`thinkingTitle=${source.useSummaryTitlesAsThinkingTitle ? "summary" : "default"}`,
 		`thinkingPreview=${source.previewLines}`,
 		`thinkingAnimation=${source.animationIntervalMs}ms`,
+		`thinkingDim=${source.dimThinkingText ? "on" : "off"}`,
 		`startupHeader=${source.showStartupHeader ? "on" : "off"}`,
 		`scrollStep=${source.scrollStepLines}`,
 		`sessionRef=${source.enableSessionReference ? "on" : "off"}`,

package/extensions/config/panel.ts

@@ -25,6 +25,7 @@ import {
 	SCROLL_STEP_LINES_VALUES,
 	THINKING_ANIMATION_INTERVAL_VALUES,
 	THINKING_PREVIEW_LINES_VALUES,
+	TOOL_INPUT_NAME_LENGTH_VALUES,
 	WRITE_DIFF_COLLAPSED_LINES_VALUES,
 	updateConfig,
 	type CompactStyleMode,
@@ -182,7 +183,7 @@ function buildNumberInputSubmenu(
 
 /** Section tabs for /ccstyle — matches Zentui-style "A / B / C" headers. */
 type CcstyleSection = {
-	id: "style" | "editor" | "diff" | "thinking" | "feature";
+	id: "style" | "diff" | "thinking" | "ui" | "feature";
 	label: string;
 	items: any[];
 };
@@ -263,6 +264,16 @@ export async function showCcstylePanel(
 				);
 			},
 		};
+		const toolInputNameSetting = {
+			id: "toolInputNameLength",
+			label: "Input clip",
+			description:
+				"Max characters for path/command/name in single and grouped tool summaries. Enter to type a custom value.",
+			currentValue: String(config.toolInputNameLength),
+			values: [...TOOL_INPUT_NAME_LENGTH_VALUES],
+			submenu: (_current: string, closeSubmenu: (selected?: string) => void) =>
+				buildNumberInputSubmenu(theme, toolInputNameSetting, closeSubmenu),
+		};
 		const diffViewSetting = {
 			id: "diffViewMode",
 			label: "Diff layout",
@@ -351,6 +362,15 @@ export async function showCcstylePanel(
 			submenu: (_current: string, closeSubmenu: (selected?: string) => void) =>
 				buildNumberInputSubmenu(theme, thinkingAnimationSetting, closeSubmenu),
 		};
+		const thinkingDimSetting = {
+			id: "dimThinkingText",
+			label: "Dim thinking text",
+			description: config.dimThinkingText
+				? "Thinking text uses the theme's dim color."
+				: "Keep the default thinking text color.",
+			currentValue: config.dimThinkingText ? "on" : "off",
+			values: ["on", "off"],
+		};
 		const startupHeaderSetting = {
 			id: "showStartupHeader",
 			label: "Startup header",
@@ -432,6 +452,12 @@ export async function showCcstylePanel(
 				return;
 			}
 			switch (id) {
+				case "toolInputNameLength":
+					updateConfig({
+						toolInputNameLength: pickPositiveInt(value, DEFAULT_CONFIG.toolInputNameLength, 8, 500),
+					});
+					toolInputNameSetting.currentValue = String(config.toolInputNameLength);
+					break;
 				case "mode": {
 					// 选项值带 Experimental 标记，选择后还原为真实 mode 值。
 					const mode: CompactStyleMode =
@@ -510,6 +536,12 @@ export async function showCcstylePanel(
 					});
 					thinkingAnimationSetting.currentValue = String(config.animationIntervalMs);
 					break;
+				case "dimThinkingText":
+					updateConfig({ dimThinkingText: value === "on" });
+					thinkingDimSetting.description = config.dimThinkingText
+						? "Thinking text uses the theme's dim color."
+						: "Keep the default thinking text color.";
+					break;
 				case "showStartupHeader":
 					updateConfig({ showStartupHeader: value === "on" });
 					startupHeaderSetting.description = config.showStartupHeader
@@ -549,19 +581,28 @@ export async function showCcstylePanel(
 					writeDiffCollapsedSetting,
 					diffWordWrapSetting,
 					expandedMaxSetting,
+					toolInputNameSetting,
 				],
 			},
 			{
 				id: "thinking",
 				label: "Thinking",
-				items: [thinkingTitleSetting, thinkingPreviewSetting, thinkingAnimationSetting],
+				items: [
+					thinkingTitleSetting,
+					thinkingPreviewSetting,
+					thinkingAnimationSetting,
+					thinkingDimSetting,
+				],
+			},
+			{
+				id: "ui",
+				label: "UI",
+				items: [startupHeaderSetting, scrollStepSetting],
 			},
 			{
 				id: "feature",
 				label: "Feature",
 				items: [
-					startupHeaderSetting,
-					scrollStepSetting,
 					sessionReferenceToggle.setting,
 					subagentAutocompleteToggle.setting,
 					contextCommandToggle.setting,

package/extensions/feature/context.ts

@@ -4,6 +4,7 @@ import {
 	type ExtensionCommandContext,
 	type ToolInfo,
 	estimateTokens,
+	formatSkillsForPrompt,
 	getMarkdownTheme,
 } from "@earendil-works/pi-coding-agent";
 import { Key, Markdown, matchesKey, visibleWidth } from "@earendil-works/pi-tui";
@@ -16,7 +17,13 @@ export type ContextPart = {
 	color: "accent" | "success" | "warning" | "customMessageLabel" | "muted" | "dim" | "error";
 };
 
-type PreviewKey = "systemPrompt" | "memoryFiles" | "tools" | "toolResults" | "contextFiles";
+type PreviewKey =
+	| "systemPrompt"
+	| "memoryFiles"
+	| "skills"
+	| "tools"
+	| "toolResults"
+	| "contextFiles";
 
 type ContextPreview = {
 	key: PreviewKey;
@@ -265,6 +272,12 @@ const tokenEstimate = (value: unknown): number => {
 	return Math.max(0, Math.ceil(text.length / 4));
 };
 
+/** 只统计确实嵌进 system prompt 的片段，避免源文件预览把占用加两遍。 */
+function embeddedTokens(prompt: string, chunk: string): number {
+	if (!chunk || !prompt.includes(chunk)) return 0;
+	return tokenEstimate(chunk);
+}
+
 export function capParts(parts: ContextPart[], target: number, fixedPrefix = 0): ContextPart[] {
 	const fixed = parts.slice(0, fixedPrefix);
 	const variable = parts.slice(fixedPrefix);
@@ -346,10 +359,13 @@ export function collectContextBreakdown(
 	const memoryPreview: string[] = [];
 	let memoryTokens = 0;
 	for (const file of options.contextFiles ?? []) {
-		memoryTokens += tokenEstimate(file.content);
+		memoryTokens += embeddedTokens(systemPrompt, file.content);
 		memoryPreview.push(`## ${file.path}\n\n${previewValue(file.content)}`);
 	}
 
+	const skillsText = formatSkillsForPrompt(options.skills ?? []).trim();
+	const skillsTokens = embeddedTokens(systemPrompt, skillsText);
+
 	for (const tool of allTools) {
 		if (!selectedTools.has(tool.name)) continue;
 		const definition = {
@@ -407,17 +423,20 @@ export function collectContextBreakdown(
 		}
 	}
 
+	const systemTokens = Math.max(0, tokenEstimate(systemPrompt) - memoryTokens - skillsTokens);
 	return {
 		parts: [
-			{ label: "System prompt", tokens: tokenEstimate(systemPrompt), color: "accent" },
+			{ label: "System prompt", tokens: systemTokens, color: "accent" },
 			{ label: "Memory", tokens: memoryTokens, color: "error" },
-			{ label: "Tools", tokens: toolDefinitionTokens, color: "success" },
+			{ label: "Skills", tokens: skillsTokens, color: "warning" },
+			{ label: "Tools definition", tokens: toolDefinitionTokens, color: "success" },
 			{ label: "Tool results", tokens: toolResultTokens, color: "customMessageLabel" },
 			{ label: "Context", tokens: contextTokens, color: "warning" },
 		] satisfies ContextPart[],
 		previews: {
 			systemPrompt: systemPrompt || "No system prompt.",
 			memoryFiles: memoryPreview.join("\n\n") || "No memory files in context.",
+			skills: skillsText || "No skills in context.",
 			tools: toolDefinitionPreview.join("\n\n") || "No active tool definitions.",
 			toolResults: toolResultPreview.join("\n\n") || "No tool results in the current context.",
 			contextFiles: contextPreview.join("\n\n") || "No conversation context.",
@@ -434,10 +453,10 @@ export default function contextUsageExtension(pi: ExtensionAPI) {
 			const tools = pi.getAllTools();
 			const breakdown = collectContextBreakdown(ctx, tools);
 			const estimated = breakdown.parts.reduce((sum, part) => sum + part.tokens, 0);
-			// System prompt、Memory、Tools 为固定项，capParts 时保持原值不压缩。
-			const fixedTokens = breakdown.parts.slice(0, 3).reduce((sum, part) => sum + part.tokens, 0);
+			// System / Memory / Skills / Tools definition 为固定项，capParts 时保持原值不压缩。
+			const fixedTokens = breakdown.parts.slice(0, 4).reduce((sum, part) => sum + part.tokens, 0);
 			const used = Math.max(resolveUsedTokens(usage, estimated, contextWindow), fixedTokens);
-			const parts = capParts(breakdown.parts, used, 3);
+			const parts = capParts(breakdown.parts, used, 4);
 			const attributed = parts.reduce((sum, part) => sum + part.tokens, 0);
 			const other = Math.max(0, used - attributed);
 			const free = Math.max(0, contextWindow - used);
@@ -466,10 +485,16 @@ export default function contextUsageExtension(pi: ExtensionAPI) {
 					title: "Memory Files",
 					content: breakdown.previews.memoryFiles,
 				},
+				{
+					key: "skills",
+					label: "Skills",
+					title: "Skills",
+					content: breakdown.previews.skills,
+				},
 				{
 					key: "tools",
-					label: "Tools",
-					title: "Tools",
+					label: "Tools definition",
+					title: "Tools definition",
 					content: breakdown.previews.tools,
 				},
 				{

package/extensions/renderer/compact-mode.ts

@@ -72,7 +72,8 @@ export function styleCompactThinkingText(
 	bold = false,
 ): string {
 	if (!theme) return text;
-	const colored = typeof theme.fg === "function" ? theme.fg("thinkingText", text) : text;
+	const color = config.dimThinkingText ? "dim" : "thinkingText";
+	const colored = typeof theme.fg === "function" ? theme.fg(color, text) : text;
 	const weighted = bold && typeof theme.bold === "function" ? theme.bold(colored) : colored;
 	return typeof theme.italic === "function" ? theme.italic(weighted) : weighted;
 }
@@ -1177,7 +1178,8 @@ export function installCompactMode(deps: CompactModeInstallDeps): CompactModeHoo
 		}
 		const name = String(this.toolName ?? "");
 		if (EDIT_WRITE_TOOLS.has(name)) {
-			if (!this.result || this.isPartial === true) scheduleAnimation(this);
+			if (this.executionStarted && (!this.result || this.isPartial === true))
+				scheduleAnimation(this);
 			return compactEditWriteLines(this, width, deps.writeMetadata);
 		}
 		// Agent/Task 等同普通工具：折叠不外置（live 面板走独立 widget）。

package/extensions/renderer/default-mode.ts

@@ -233,7 +233,7 @@ function createCcstyleTool(
 			const isPending =
 				visualState === "pending" ||
 				(!visualState && (context?.isPartial || context?.executionStarted));
-			if (isPending) scheduleAnimation(context);
+			if (isPending && context?.executionStarted) scheduleAnimation(context);
 			const rawIcon = isPending ? pendingIcon(toolName) : settledIcon(toolName, visualState);
 			const icon =
 				visualState === "success"

package/extensions/renderer/tool/grouping.ts

@@ -85,7 +85,12 @@ function scheduleGroupAnimation(patch: Patch): void {
 		patch.animationTimer = null;
 		if (!patch.active) return;
 		for (const group of patch.groups) {
-			if (group.children.some((tool) => status(tool) === "pending")) group.invalidate();
+			if (
+				(group.children as any[]).some(
+					(tool) => tool?.executionStarted && status(tool) === "pending",
+				)
+			)
+				group.invalidate();
 		}
 	}, TOOL_LOADING_INTERVAL_MS);
 	patch.animationTimer.unref?.();
@@ -300,7 +305,10 @@ export class ToolGroupComponent extends Container {
 		const label =
 			names.size === 1 ? humanizeToolLabel(toolName(this.children[0])) : "Multiple Tools";
 		const overall: ToolStatus = counts.error ? "error" : counts.pending ? "pending" : "success";
-		if (overall === "pending") scheduleGroupAnimation(this.patch);
+		if (
+			(this.children as any[]).some((tool) => tool?.executionStarted && status(tool) === "pending")
+		)
+			scheduleGroupAnimation(this.patch);
 		const overallColor = overall === "pending" ? "accent" : overall;
 		const nameList = names.size > 1 ? ` ${fg("dim", `• ${toolNameList(this.children)}`)}` : "";
 		// 圆点保持 dim；hover 只高亮可点击文字。

package/extensions/renderer/tool/names.ts

@@ -1,5 +1,10 @@
+import { config } from "../../config/config.ts";
 import { oneLine } from "../../utils/format.ts";
 
+function clip(value: unknown): string {
+	return oneLine(value, config.toolInputNameLength);
+}
+
 /**
  * 工具名/标签人性化：与 default-mode 的 humanizeToolLabel、grouping 的 humanizeToolName
  * 逐字相同，收敛为一个共享实现。
@@ -45,12 +50,11 @@ export function toolCallSummary(
 	const name = toolName.toLowerCase();
 	const value = (fallback: string, ...keys: string[]) => {
 		const found = keys.map((key) => args[key]).find((item) => typeof item === "string" && item);
-		// 两处对齐：从头截断，上限 96 字符（oneLine 默认值）。
-		return `${title} ${oneLine(found || fallback, 96)}`;
+		return `${title} ${clip(found || fallback)}`;
 	};
 
 	if (variant === "default" && AGENT_FAMILY_TOOL_NAMES.has(toolName) && args.agent_id) {
-		return { main: `${title} ${oneLine(args.agent_id, 96)}`, detail: "" };
+		return { main: `${title} ${clip(args.agent_id)}`, detail: "" };
 	}
 	if (variant === "grouping" && (name === "agent" || name === "agents")) {
 		const displayName = args.subagent_type ?? args.agent_type ?? args.agent;
@@ -104,28 +108,28 @@ export function toolCallSummary(
 		].filter(Boolean);
 		if (variant === "grouping") {
 			return {
-				main: `Read ${oneLine(args.path || "...")}`,
+				main: `Read ${clip(args.path || "...")}`,
 				detail: details.length ? ` (${details.join(", ")})` : "",
 			};
 		}
 		return {
-			main: `${title}${args.path ? ` ${oneLine(args.path, 96)}` : ""}`,
+			main: `${title}${args.path ? ` ${clip(args.path)}` : ""}`,
 			detail: details.length ? ` (${details.join(", ")})` : "",
 		};
 	}
 	if (variant === "grouping") {
-		if (toolName === "bash") return { main: `Bash ${oneLine(args.command || "...")}`, detail: "" };
+		if (toolName === "bash") return { main: `Bash ${clip(args.command || "...")}`, detail: "" };
 		if (toolName === "grep") {
-			const pattern = oneLine(args.pattern || "...");
+			const pattern = clip(args.pattern || "...");
 			return {
-				main: `Grep ${JSON.stringify(pattern)}${args.path ? ` in ${oneLine(args.path)}` : ""}`,
+				main: `Grep ${JSON.stringify(pattern)}${args.path ? ` in ${clip(args.path)}` : ""}`,
 				detail: "",
 			};
 		}
 		if (toolName === "find") {
-			const pattern = oneLine(args.pattern || "...");
+			const pattern = clip(args.pattern || "...");
 			return {
-				main: `Find ${JSON.stringify(pattern)}${args.path ? ` in ${oneLine(args.path)}` : ""}`,
+				main: `Find ${JSON.stringify(pattern)}${args.path ? ` in ${clip(args.path)}` : ""}`,
 				detail: "",
 			};
 		}
@@ -147,7 +151,7 @@ export function toolCallSummary(
 		return {
 			main:
 				preferred !== undefined && preferred !== null && typeof preferred !== "object"
-					? `${title} ${oneLine(preferred, 96)}`
+					? `${title} ${clip(preferred)}`
 					: title,
 			detail: "",
 		};
@@ -162,7 +166,7 @@ export function toolCallSummary(
 		args.name ??
 		args.prompt;
 	return {
-		main: `${title}${preferred === undefined ? "" : ` ${oneLine(preferred)}`}`,
+		main: `${title}${preferred === undefined ? "" : ` ${clip(preferred)}`}`,
 		detail: "",
 	};
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "pi-cc-extensions",
-	"version": "0.8.65",
+	"version": "0.8.67",
 	"license": "MIT",
 	"description": "A Pi productivity suite with Claude Code-style UI, context inspection, and agent/session references",
 	"type": "module",
@@ -34,7 +34,7 @@
 			"./themes/cc-dark.json",
 			"./themes/cc-light.json"
 		],
-		"image": "https://raw.githubusercontent.com/minuque/pi-cc-extensions/main/assets/readme/welcome.webp",
+		"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"
 	},
 	"scripts": {