@rexvane/piweb 0.3.24 → 0.3.26

package/src/components/SettingsPanel.tsx

@@ -39,16 +39,6 @@ import { useI18n } from "@/i18n";
 import { fmtTokens } from "@/lib/format";
 import { applyPebrelTheme, loadPebrelTheme, loadThemeMode, type PebrelTheme, type ThemeMode } from "@/lib/theme";
 import { applyFontChoice, CUSTOM_PREFIX, FONT_PRESETS, loadFontChoice } from "@/lib/font";
-import {
-	DEFAULT_STREAM_SETTINGS,
-	getStreamSettings,
-	setStreamSettings,
-	STREAM_SPEED_MAX,
-	STREAM_SPEED_MIN,
-	STREAM_STYLES,
-	type StreamSettings,
-	type StreamStyle,
-} from "@/lib/chat/stream-settings";
 import {
 	customModelGaps,
 	fillModelFields,
@@ -134,32 +124,26 @@ export function SettingsPanel({
 					boxShadow: "var(--dsw-elevation-prominent)",
 				}}
 			>
-				{/* 左导航（dsh trigger：h42 r12，active 填充） */}
-				<div className="settings-nav flex w-52 flex-none flex-col gap-0.5 py-4 pl-4 pr-3">
+				{/* 左导航（Iconsax .isx-menu-item：h42 r12，悬停/激活高对比反转 + 文字右移 + 右侧短竖条） */}
+				<div className="settings-nav flex w-52 flex-none flex-col gap-1 py-4 pl-4 pr-3">
 					<div className="settings-title px-2 pb-3" style={{ fontSize: 16, fontWeight: 500 }}>
 						{t.settings}
 					</div>
 					{navItems.map((n) => (
 						<button
 							key={n.id}
-							className="flex h-[42px] items-center gap-2 rounded-xl px-3 text-left transition-colors"
+							data-active={section === n.id ? "true" : undefined}
+							className="isx-menu-item flex h-[42px] items-center gap-2.5 rounded-xl px-3 text-left"
 							style={{
-								paddingLeft: 8,
-								paddingRight: 10,
+								paddingLeft: 10,
+								paddingRight: 14,
 								fontSize: 14,
-								background: section === n.id ? "var(--dsw-active)" : "transparent",
-								color: section === n.id ? "var(--dsw-label-primary)" : "var(--dsw-label-secondary)",
-							}}
-							onMouseEnter={(e) => {
-								if (section !== n.id) e.currentTarget.style.background = "var(--dsw-hover)";
-							}}
-							onMouseLeave={(e) => {
-								if (section !== n.id) e.currentTarget.style.background = "transparent";
+								color: section === n.id ? "var(--dsw-bg-base)" : "var(--dsw-label-secondary)",
 							}}
 							onClick={() => setSection(n.id)}
 						>
-							{section === n.id ? <span style={{ color: "var(--dsw-accent)" }}>{n.icon}</span> : n.icon}
-							{n.label}
+							<span className="isx-menu-icon" style={{ display: "inline-flex" }}>{n.icon}</span>
+							<span className="isx-menu-shift">{n.label}</span>
 						</button>
 					))}
 				</div>
@@ -203,15 +187,14 @@ function GeneralSection({
 	const [themeMode, setThemeMode] = useState<ThemeMode>("system");
 	const [fontSize, setFontSize] = useState(14);
 	const [chatFontSize, setChatFontSize] = useState(14);
-	const [stream, setStream] = useState<StreamSettings>(DEFAULT_STREAM_SETTINGS);
 	const [enterBehavior, setEnterBehavior] = useState<EnterBehavior>("steer");
-	const [piSettings, setPiSettings] = useState<{ compaction: { enabled: boolean; reserveTokens: number; keepRecentTokens: number }; retry: { enabled: boolean; maxRetries: number; baseDelayMs: number } } | null>(null);
+	const [piSettings, setPiSettings] = useState<{ compaction: { enabled: boolean; reserveTokens: number }; retry: { enabled: boolean; maxRetries: number } } | null>(null);
 	const [versions, setVersions] = useState<{ piWeb: string; piEngine: string } | null>(null);
 	const [webAuth, setWebAuth] = useState<{ enabled: boolean; authenticated: boolean } | null>(null);
 	const [settingsLoading, setSettingsLoading] = useState(true);
 	const [settingsSaving, setSettingsSaving] = useState(false);
 	const [settingsError, setSettingsError] = useState<"load" | "save" | null>(null);
-	const [numberDrafts, setNumberDrafts] = useState({ reserveTokens: "", keepRecentTokens: "", maxRetries: "", baseDelayMs: "" });
+	const [numberDrafts, setNumberDrafts] = useState({ reserveTokens: "", maxRetries: "" });
 
 	const loadRemoteSettings = async () => {
 		setSettingsLoading(true);
@@ -232,9 +215,7 @@ function GeneralSection({
 			setPiSettings(ps.value);
 			setNumberDrafts({
 				reserveTokens: String(ps.value.compaction.reserveTokens),
-				keepRecentTokens: String(ps.value.compaction.keepRecentTokens),
 				maxRetries: String(ps.value.retry.maxRetries),
-				baseDelayMs: String(ps.value.retry.baseDelayMs),
 			});
 		} else setPiSettings(null);
 		if (health.status === "fulfilled" && health.value?.piWeb) setVersions({ piWeb: health.value.piWeb, piEngine: health.value.piEngine });
@@ -252,8 +233,6 @@ function GeneralSection({
 		if (!Number.isNaN(fs)) setFontSize(fs);
 		const chatFs = parseInt(localStorage.getItem("piweb.chatFontSize") ?? "14", 10);
 		if (!Number.isNaN(chatFs)) setChatFontSize(chatFs);
-		// 流式输出偏好与主题/字体同源（localStorage），同样等挂载后再读，避免水合不一致
-		setStream(getStreamSettings());
 		setEnterBehavior(getEnterBehavior());
 		void loadRemoteSettings();
 	}, []);
@@ -286,9 +265,6 @@ function GeneralSection({
 		document.documentElement.style.setProperty("--piweb-chat-font-size", `${v}px`);
 	};
 
-	/** 流式输出：样式 / 速度 / 光标。改完即持久化，正在流出的回答下一帧就换（订阅在 MarkdownBlock 里） */
-	const pickStream = (patch: Partial<StreamSettings>) => setStream(setStreamSettings(patch));
-
 	const pickEnter = (v: EnterBehavior) => {
 		setEnterBehavior(v);
 		saveEnterBehavior(v);
@@ -316,7 +292,7 @@ function GeneralSection({
 		}
 	};
 
-	const commitNumber = async (section: "compaction" | "retry", field: "reserveTokens" | "keepRecentTokens" | "maxRetries" | "baseDelayMs") => {
+	const commitNumber = async (section: "compaction" | "retry", field: "reserveTokens" | "maxRetries") => {
 		if (!piSettings) return;
 		const raw = numberDrafts[field].trim();
 		const value = Number(raw);
@@ -327,7 +303,7 @@ function GeneralSection({
 		if (value === (piSettings[section] as unknown as Record<string, number>)[field]) return;
 		await patchPiSettings({ [section]: { [field]: value } });
 	};
-	const numberInput = (section: "compaction" | "retry", field: "reserveTokens" | "keepRecentTokens" | "maxRetries" | "baseDelayMs", title: string) => (
+	const numberInput = (section: "compaction" | "retry", field: "reserveTokens" | "maxRetries", title: string) => (
 		<input
 			type="number"
 			min={0}
@@ -343,7 +319,7 @@ function GeneralSection({
 	);
 
 	const themes: { id: PebrelTheme; label: string; light: string; dark: string; accent: string }[] = [
-		{ id: "dsh", label: t.themeDsh, light: "#F9FAFB", dark: "#151517", accent: "#4176E6" },
+		{ id: "dsh", label: t.themeDsh, light: "#FFFFFF", dark: "#040405", accent: "#02DEFC" },
 		{ id: "silver-steel", label: t.themeSilverSteel, light: "#F3F4F6", dark: "#1A1C24", accent: "#94A3B8" },
 		{ id: "limestone-coal", label: t.themeLimestoneCoal, light: "#F0EFEB", dark: "#171717", accent: "#CEB27E" },
 		{ id: "linen-moss", label: t.themeLinenMoss, light: "#F2F2EC", dark: "#1E211E", accent: "#A3B3A3" },
@@ -351,20 +327,6 @@ function GeneralSection({
 		{ id: "pebrel", label: t.themePebrel, light: "#F3F4F6", dark: "#0F111A", accent: "#52A8FF" },
 	];
 
-	const streamStyleText: Record<StreamStyle, { label: string; desc: string }> = {
-		smooth: { label: t.streamStyleSmooth, desc: t.streamStyleSmoothDesc },
-		typewriter: { label: t.streamStyleTypewriter, desc: t.streamStyleTypewriterDesc },
-		fade: { label: t.streamStyleFade, desc: t.streamStyleFadeDesc },
-		instant: { label: t.streamStyleInstant, desc: t.streamStyleInstantDesc },
-	};
-	const streamSpeedText: Record<number, string> = {
-		1: t.streamSpeed1,
-		2: t.streamSpeed2,
-		3: t.streamSpeed3,
-		4: t.streamSpeed4,
-		5: t.streamSpeed5,
-	};
-
 	return (
 		<div className="flex flex-col gap-6">
 			{(settingsLoading || settingsError) && (
@@ -388,13 +350,12 @@ function GeneralSection({
 					{themes.map((th) => (
 						<button
 							key={th.id}
-							className="flex flex-col items-center justify-center gap-1 transition-colors"
+							className="isx-card flex flex-col items-center justify-center gap-1"
 							style={{
 								flex: "1 1 150px",
 								padding: "20px 32px",
 								borderRadius: 20,
-								border: `0.5px solid ${theme === th.id ? "var(--dsw-border-strong)" : "var(--dsw-border-l4)"}`,
-								background: theme === th.id ? "var(--dsw-module-platform)" : "transparent",
+								background: theme === th.id ? "var(--dsw-module-platform)" : "var(--dsw-bg-elevated)",
 								color: "var(--dsw-label-primary)",
 								fontSize: 14,
 								lineHeight: "22px",
@@ -402,7 +363,7 @@ function GeneralSection({
 							aria-pressed={theme === th.id}
 							onClick={() => pickTheme(th.id)}
 						>
-							<span className="flex items-center overflow-hidden rounded-md" style={{ border: "0.5px solid var(--dsw-border-l3)", width: 42, height: 20 }}>
+							<span className="flex items-center overflow-hidden rounded-md" style={{ border: "1px solid var(--dsw-border-l3)", width: 42, height: 20 }}>
 								<span style={{ background: th.light, flex: 1, height: "100%" }} />
 								<span style={{ background: th.dark, flex: 1, height: "100%" }} />
 							</span>
@@ -423,13 +384,12 @@ function GeneralSection({
 					] as { id: ThemeMode; label: string }[]).map((mode) => (
 						<button
 							key={mode.id}
-							className="flex flex-col items-center justify-center gap-1 transition-colors"
+							className="isx-card flex flex-col items-center justify-center gap-1"
 							style={{
 								flex: "1 1 120px",
 								padding: "16px 24px",
 								borderRadius: 20,
-								border: `0.5px solid ${themeMode === mode.id ? "var(--dsw-border-strong)" : "var(--dsw-border-l4)"}`,
-								background: themeMode === mode.id ? "var(--dsw-module-platform)" : "transparent",
+								background: themeMode === mode.id ? "var(--dsw-module-platform)" : "var(--dsw-bg-elevated)",
 								color: "var(--dsw-label-primary)",
 								fontSize: 14,
 								lineHeight: "22px",
@@ -449,83 +409,7 @@ function GeneralSection({
 				<FontSizeStepper value={chatFontSize} onChange={pickChatFont} max={20} />
 			</Row>
 			<Row title={t.fontUiFamily} desc={t.fontUiFamilyDesc}>
-				<FontFamilyPicker scope="ui" />
-			</Row>
-			<Row title={t.fontMonoFamily} desc={t.fontMonoFamilyDesc}>
-				<FontFamilyPicker scope="mono" />
-			</Row>
-			<RowColumn title={t.streamStyleTitle} desc={t.streamStyleDesc}>
-				<div className="flex w-full flex-wrap gap-2">
-					{STREAM_STYLES.map((id) => {
-						const active = stream.style === id;
-						return (
-							<button
-								key={id}
-								type="button"
-								className="flex flex-col items-start gap-1 text-left transition-colors"
-								style={{
-									flex: "1 1 150px",
-									padding: "12px 16px",
-									borderRadius: 14,
-									border: `0.5px solid ${active ? "var(--dsw-border-strong)" : "var(--dsw-border-l4)"}`,
-									background: active ? "var(--dsw-module-platform)" : "transparent",
-									color: "var(--dsw-label-primary)",
-									lineHeight: "18px",
-								}}
-								aria-pressed={active}
-								onClick={() => pickStream({ style: id })}
-							>
-								<span className="flex items-center gap-1.5" style={{ fontSize: 14 }}>
-									{active ? <IconCheckOutline14 size={13} /> : null}
-									{streamStyleText[id].label}
-								</span>
-								<span style={{ fontSize: 11.5, color: "var(--dsw-label-caption)" }}>{streamStyleText[id].desc}</span>
-							</button>
-						);
-					})}
-				</div>
-			</RowColumn>
-			<RowColumn title={t.streamSpeedTitle} desc={t.streamSpeedDesc}>
-				<div className="flex w-full flex-wrap gap-2">
-					{Array.from({ length: STREAM_SPEED_MAX - STREAM_SPEED_MIN + 1 }, (_, i) => STREAM_SPEED_MIN + i).map((level) => {
-						const active = stream.speed === level;
-						return (
-							<button
-								key={level}
-								type="button"
-								className="transition-colors disabled:opacity-50"
-								// 即时样式不排队，速度对它没有意义：置灰，免得以为调了没反应
-								disabled={stream.style === "instant"}
-								style={{
-									flex: "1 1 84px",
-									padding: "10px 8px",
-									borderRadius: 12,
-									border: `0.5px solid ${active ? "var(--dsw-border-strong)" : "var(--dsw-border-l4)"}`,
-									background: active ? "var(--dsw-module-platform)" : "transparent",
-									color: active ? "var(--dsw-label-primary)" : "var(--dsw-label-secondary)",
-									fontSize: 13,
-								}}
-								aria-pressed={active}
-								onClick={() => pickStream({ speed: level })}
-							>
-								{streamSpeedText[level]}
-							</button>
-						);
-					})}
-				</div>
-			</RowColumn>
-			<Row title={t.streamCaretTitle} desc={t.streamCaretDesc}>
-				<button
-					type="button"
-					className="relative h-5 w-9 flex-none rounded-full transition-colors"
-					style={{ background: stream.caret ? "var(--dsw-accent)" : "var(--dsw-border-l3)" }}
-					role="switch"
-					aria-checked={stream.caret}
-					aria-label={t.streamCaretTitle}
-					onClick={() => pickStream({ caret: !stream.caret })}
-				>
-					<span className="absolute top-0.5 h-4 w-4 rounded-full bg-white transition-all" style={{ left: stream.caret ? 18 : 2 }} />
-				</button>
+				<FontFamilyPicker />
 			</Row>
 			<Row title={t.enterBehavior} desc={t.enterBehaviorDesc}>
 				<SelectOption
@@ -543,7 +427,6 @@ function GeneralSection({
 						<span className="absolute top-0.5 h-4 w-4 rounded-full bg-white transition-all" style={{ left: piSettings?.compaction.enabled ? 18 : 2 }} />
 					</button>
 					{numberInput("compaction", "reserveTokens", t.reserveTokens)}
-					{numberInput("compaction", "keepRecentTokens", t.keepRecentTokens)}
 				</div>
 			</Row>
 			<Row title={t.autoRetry} desc={t.autoRetryDesc}>
@@ -552,7 +435,6 @@ function GeneralSection({
 						<span className="absolute top-0.5 h-4 w-4 rounded-full bg-white transition-all" style={{ left: piSettings?.retry.enabled ? 18 : 2 }} />
 					</button>
 					{numberInput("retry", "maxRetries", t.maxRetries)}
-					{numberInput("retry", "baseDelayMs", t.baseDelayMs)}
 				</div>
 			</Row>
 			<Row title={t.versionPiweb} desc={t.versionPiwebDesc}>
@@ -662,7 +544,7 @@ function UpdateControl({ target }: { target: UpdateTarget }) {
 }
 
 /** 通用下选芯片：自定义深色圆角浮层，替代原生 select */
-function SelectOption({
+export function SelectOption({
 	value,
 	options,
 	onChange,
@@ -694,6 +576,18 @@ function SelectOption({
 		if (disabled) setOpen(false);
 	}, [disabled]);
 	const current = options.find((o) => o.value === value);
+	// 下方放不下（按每项约 37px 估高，封顶 280）且上方更宽裕时向上翻转，并把高度限制在可用空间内。
+	// 以前只把 top 钳到窗口底部上方 40px，靠近底部时只露出第一项，其余落到屏幕外
+	const placement = (() => {
+		if (!rect || typeof window === "undefined") return null;
+		const margin = 8;
+		const wanted = Math.min(280, options.length * 37 + 12);
+		const below = window.innerHeight - rect.top - margin;
+		const above = rect.bottom - margin;
+		return below < wanted && above > below
+			? { bottom: window.innerHeight - rect.bottom, maxHeight: Math.min(280, above) }
+			: { top: rect.top, maxHeight: Math.min(280, Math.max(below, 80)) };
+	})();
 	return (
 		<div className="relative">
 			<button ref={anchorRef} className="select-chip" data-open={open} disabled={disabled} onClick={() => setOpen((o) => !o)}>
@@ -702,12 +596,13 @@ function SelectOption({
 					<IconChevronDown14 size={14} />
 				</span>
 			</button>
-			{open && !disabled && rect && createPortal(
+			{open && !disabled && rect && placement && createPortal(
 				<div
 					ref={popRef}
 					className="popover fixed z-[130] p-1.5 shadow-xl"
-					// 下方空间不足时向上翻转；左右都对齐 chip 左缘
-					style={{ left: rect.left, top: Math.min(rect.top, window.innerHeight - 40), minWidth: width ?? 140, width: "max-content", maxHeight: 280, overflowY: "auto" }}
+					data-placement={"bottom" in placement ? "top" : "bottom"}
+					// 左右都对齐 chip 左缘
+					style={{ left: rect.left, ...placement, minWidth: width ?? 140, width: "max-content", overflowY: "auto" }}
 				>
 					{options.map((o) => {
 						const selected = o.value === value;
@@ -813,8 +708,9 @@ function FontSizeStepper({ value, onChange, max }: { value: number; onChange: (v
 	);
 }
 
-/** 字体族选择：预设下拉 + 「自定义」文本框。改动即生效并持久化。 */
-function FontFamilyPicker({ scope }: { scope: "ui" | "mono" }) {
+/** 界面字体族选择：预设下拉 + 「自定义」文本框。改动即生效并持久化。
+ *  代码字体已固定为系统等宽、不再可配（见 lib/font.ts）。 */
+function FontFamilyPicker() {
 	const { t, lang } = useI18n();
 	const [stored, setStored] = useState<string | null>(null);
 	const [custom, setCustom] = useState("");
@@ -823,18 +719,18 @@ function FontFamilyPicker({ scope }: { scope: "ui" | "mono" }) {
 	const [customMode, setCustomMode] = useState(false);
 
 	useEffect(() => {
-		const saved = loadFontChoice(scope);
+		const saved = loadFontChoice();
 		const savedCustom = saved?.startsWith(CUSTOM_PREFIX) ? saved.slice(CUSTOM_PREFIX.length) : null;
 		setStored(saved);
 		setCustomMode(savedCustom !== null);
 		setCustom(savedCustom ?? "");
-	}, [scope]);
+	}, []);
 
 	const applyCustom = (v: string) => {
 		setCustom(v);
 		const next = v.trim() ? CUSTOM_PREFIX + v.trim() : null;
 		setStored(next);
-		applyFontChoice(scope, next);
+		applyFontChoice(next);
 	};
 
 	const pick = (v: string) => {
@@ -846,10 +742,10 @@ function FontFamilyPicker({ scope }: { scope: "ui" | "mono" }) {
 		}
 		setCustomMode(false);
 		setStored(v);
-		applyFontChoice(scope, v);
+		applyFontChoice(v);
 	};
 
-	const selectValue = customMode ? CUSTOM_PREFIX : stored ?? FONT_PRESETS[scope][0].id;
+	const selectValue = customMode ? CUSTOM_PREFIX : stored ?? FONT_PRESETS[0].id;
 
 	return (
 		<div className="flex flex-col items-end gap-2">
@@ -857,7 +753,7 @@ function FontFamilyPicker({ scope }: { scope: "ui" | "mono" }) {
 				value={selectValue}
 				width={220}
 				options={[
-					...FONT_PRESETS[scope].map((p) => ({
+					...FONT_PRESETS.map((p) => ({
 						value: p.id,
 						label: lang === "zh" ? p.label.zh : p.label.en,
 					})),
@@ -2628,7 +2524,9 @@ export function PluginsSection({ cwd }: { cwd: string }) {
 																	role="menuitem"
 																	className="flex w-full items-center gap-2 px-3 py-1.5 text-left text-xs transition-colors hover:bg-[var(--dsw-hover)] cursor-pointer disabled:opacity-50"
 																	style={{ color: "var(--dsw-label-secondary)" }}
-																	disabled={busy}
+																	// 停用的包挪到了 PiWeb 私有的 disabledPackages，SDK 的 update 只认 packages，点了只会报「找不到包」
+																	disabled={busy || isDisabled}
+																	title={isDisabled ? t.updateNeedsEnable : undefined}
 																	onClick={() => {
 																		setMenuKey(null);
 																		void act(

package/src/components/TrajectoryAnalyzer.module.css

@@ -59,23 +59,30 @@
 }
 
 .toolbarButton:hover,
-.toolbarButton[aria-pressed="true"] { color: var(--dsw-label-primary); background: var(--dsw-hover); }
+.toolbarButton[aria-pressed="true"] {
+	color: var(--dsw-label-primary);
+	background: var(--dsw-hover);
+	transform: translateY(-0.5px);
+}
 
 .searchBox {
 	display: flex;
 	width: min(230px, 30vw);
-	height: 25px;
+	height: 26px;
 	align-items: center;
 	gap: 5px;
 	margin-left: auto;
-	padding: 0 7px;
-	border: 0.5px solid var(--dsw-border-l3);
-	border-radius: 5px;
-	color: var(--dsw-label-caption);
+	padding: 0 8px;
+	border: 1.5px solid var(--dsw-border-l2);
+	border-radius: 12px;
+	color: var(--dsw-label-secondary);
 	background: var(--dsw-layer-2);
+	transition: border-color 0.22s var(--isx-ease);
 }
 
-.searchBox:focus-within { border-color: var(--dsw-accent); }
+.searchBox:focus-within {
+	border-color: var(--dsw-label-primary);
+}
 .searchBox input { width: 100%; min-width: 0; font-size: 12px; }
 
 .timeline {
@@ -145,10 +152,17 @@
 	border-bottom: 0.5px solid var(--dsw-border-l1);
 	background: var(--dsw-bg-base);
 	text-align: left;
+	transition: background 0.2s var(--isx-ease), transform 0.2s var(--isx-ease);
 }
 
-.row:hover { background: var(--dsw-hover); }
-.row[data-selected="true"] { background: var(--dsw-hover); box-shadow: inset 3px 0 0 var(--dsw-accent); }
+.row:hover {
+	background: var(--dsw-hover);
+	transform: translateX(2px);
+}
+.row[data-selected="true"] {
+	background: var(--dsw-hover);
+	box-shadow: inset 3px 0 0 var(--dsw-label-primary);
+}
 .row[data-environment="true"] { background: var(--dsw-bg-elevated); }
 .row[data-environment="true"]:hover,
 .row[data-environment="true"][data-selected="true"] { background: var(--dsw-hover); }
@@ -161,9 +175,10 @@
 	max-width: 100%;
 	height: 22px;
 	align-items: center;
-	padding: 0 6px;
+	padding: 0 8px;
 	overflow: hidden;
-	border-radius: 5px;
+	border-radius: 999px;
+	border: 1px solid var(--dsw-border-l1);
 	color: var(--dsw-label-secondary);
 	background: var(--dsw-module-platform);
 	font-family: var(--font-mono);

package/src/components/TrajectoryView.tsx

@@ -236,12 +236,20 @@ export function TrajectoryView({ entries, selected, onSelect }: {
 	);
 }
 
-export function TrajInspector({ entry, onClose }: { entry: TrajEntry; onClose: () => void }) {
+/**
+ * context 条目的全文回退：轨迹里的 detail 只有头部（快照不再与 contextResources 双份带全文），
+ * inspector 展开时按路径回快照资源表里取。
+ */
+type ContextLookup = (path: string) => string | undefined;
+
+export function TrajInspector({ entry, onClose, contextLookup }: { entry: TrajEntry; onClose: () => void; contextLookup?: ContextLookup }) {
 	const { t } = useI18n();
 	const [tab, setTab] = useState<DetailTab>("summary");
 	const kind = entry.toolName || KIND_NAME[entry.kind];
 	const position = entry.kind === "system" ? t.trajSystem : entry.turn ? `${t.trajTurn} ${entry.turn}` : t.trajSession;
-	const preview = entry.detail || entry.preview || entry.thinking || "";
+	const fullText = entry.kind === "context" && entry.title ? contextLookup?.(entry.title) : undefined;
+	const body = fullText ?? entry.detail;
+	const preview = body || entry.preview || entry.thinking || "";
 	const tabs: Array<{ id: DetailTab; label: string }> = [
 		{ id: "summary", label: t.trajSummary },
 		{ id: "preview", label: t.trajPreview },
@@ -274,7 +282,7 @@ export function TrajInspector({ entry, onClose }: { entry: TrajEntry; onClose: (
 					</dl>
 					{preview && <InspectorPayload title={t.trajPreview} value={preview} />}
 				</>}
-				{tab === "preview" && <InspectorPayload title={entry.thinking ? t.trajThink : t.trajPreview} value={[entry.thinking, entry.detail || entry.preview].filter(Boolean).join("\n\n")} empty={t.trajNoContent} />}
+				{tab === "preview" && <InspectorPayload title={entry.thinking ? t.trajThink : t.trajPreview} value={[entry.thinking, body || entry.preview].filter(Boolean).join("\n\n")} empty={t.trajNoContent} />}
 				{tab === "raw" && <InspectorPayload title="JSON" value={JSON.stringify(entry, null, 2)} mono />}
 				{tab === "source" && <InspectorPayload title={t.trajSource} value={`${sourceOf(entry)}\n\nseq: ${entry.seq}\ntimestamp: ${new Date(entry.ts).toISOString()}`} mono />}
 			</div>

package/src/components/chat/markdown-actions.tsx

@@ -0,0 +1,23 @@
+"use client";
+
+/**
+ * 正文（Markdown）里可交互元素的接线。
+ *
+ * 用 context 而不是逐层传 props：MarkdownBlock 在对话正文、轨迹详情、提示词面板等处复用，
+ * 中间隔着好几层，逐层透传会把签名污染到与之无关的组件上。
+ * 没有 Provider 时（例如文件查看器里渲染 Markdown）这些交互自然不生效，正文照常显示。
+ */
+import { createContext, useContext } from "react";
+
+export interface MarkdownActions {
+	/** 用文件查看器打开项目内路径；没有工作区时不给（此时路径只作展示） */
+	openFile?: (path: string) => void;
+}
+
+const MarkdownActionsContext = createContext<MarkdownActions>({});
+
+export const MarkdownActionsProvider = MarkdownActionsContext.Provider;
+
+export function useMarkdownActions(): MarkdownActions {
+	return useContext(MarkdownActionsContext);
+}