dsh-context 0.38.5 → 0.40.0

package/README.md

@@ -140,7 +140,7 @@ In **Settings → Plugins → Plugin configuration**, the **Context** card holds
 ## Good to know
 
 - **Estimates vs actuals** — category figures use dsh's own fixed-density heuristic (the same one as its built-in token meter); the pinned trend details and Token/Timing rings show provider-reported actuals next to them.
-- **Compatibility** — works on `@deepseek-ai/dsh` **0.1.0-rc7+**, **0.1.1-rc2+**, and **0.1.2-alpha1+**; multimodal rendering requires 0.1.1+.
+- **Compatibility** — works on `@deepseek-ai/dsh` **0.1.1-rc2+** and **0.1.2-alpha2+**.
 - **I18n** — UI in English and 简体中文.
 
 ## Like it?

package/lib/client.js

@@ -40,15 +40,17 @@ window.__ModuleLoader__.load({
 			"timing.lm": "模型调用",
 			"timing.tools": "工具执行",
 			"timing.other": "其他开销",
-			"timing.times": "{n}次",
+			"timing.lmTimes": "{n}次",
+			"timing.toolTimes": "{n}次",
 			"timing.empty": "暂无耗时数据 · 对话开始后这里会显示时长分布",
 			"tokens.title": "Token 统计",
 			"tokens.hint": "供应商上报的累计计费用量",
 			"tokens.cacheHit": "缓存命中",
-			"tokens.cacheRead": "缓存读取",
+			"tokens.cacheRead": "缓存输入",
 			"tokens.cacheWrite": "缓存写入",
-			"tokens.uncached": "未命中输入",
-			"tokens.output": "输出（含思考）",
+			"tokens.uncached": "未缓存输入",
+			"tokens.output": "输出",
+			"tokens.outputNote": "含思考",
 			"plugin.title": "插件信息",
 			"plugin.hint": "The best DSH context plugin ⭐",
 			"plugin.name": "插件",
@@ -60,9 +62,9 @@ window.__ModuleLoader__.load({
 			"gran.turn": "轮次",
 			"settings.title": "上下文",
 			"settings.desc": "dsh-context 插件中上下文面板的偏好设置",
-			"settings.gran": "趋势图默认粒度",
-			"settings.mode": "趋势图默认展示",
-			"settings.fileSort": "文件活动默认排序",
+			"settings.gran": "趋势图 · 默认粒度",
+			"settings.mode": "趋势图 · 默认展示方式",
+			"settings.fileSort": "文件活动 · 默认排序",
 			"settings.expand": "展开",
 			"settings.collapse": "收起",
 			"settings.readOnly": "当前环境的设置为只读",
@@ -222,6 +224,8 @@ window.__ModuleLoader__.load({
 			"browser.deltaHint": "对比上轮末步的变动",
 			"browser.noHeader": "此数据来自旧版插件：仅提供 token 估算，无实际内容",
 			"browser.noEpoch": "该步骤的头部内容（系统提示词 / 工具定义）不在保留范围内",
+			"browser.headerMetaOnly": "此环境不支持按需读取头部内容，仅显示 token 估算",
+			"browser.noSystem": "该请求头部未包含系统提示词",
 			"browser.noContent": "完整内容不在当前加载的消息窗口内（在聊天页加载更早历史后可查看）",
 			"browser.search.user": "按消息内容过滤…",
 			"browser.search.inject": "按注入内容过滤…",
@@ -311,15 +315,17 @@ window.__ModuleLoader__.load({
 			"timing.lm": "Model calls",
 			"timing.tools": "Tool runs",
 			"timing.other": "Overhead",
-			"timing.times": "× {n}",
+			"timing.lmTimes": "{n} calls",
+			"timing.toolTimes": "{n} runs",
 			"timing.empty": "No timing data yet — durations appear as the conversation runs",
 			"tokens.title": "Token Stats",
 			"tokens.hint": "Cumulative provider-reported usage",
-			"tokens.cacheHit": "Cache hit",
-			"tokens.cacheRead": "Cache read",
-			"tokens.cacheWrite": "Cache write",
-			"tokens.uncached": "Uncached input",
-			"tokens.output": "Output (incl. reasoning)",
+			"tokens.cacheHit": "Cache Hit",
+			"tokens.cacheRead": "Cached Input",
+			"tokens.cacheWrite": "Cache Write",
+			"tokens.uncached": "Uncached Input",
+			"tokens.output": "Output",
+			"tokens.outputNote": "incl. reasoning",
 			"plugin.title": "Plugin Info",
 			"plugin.hint": "The best DSH context plugin ⭐",
 			"plugin.name": "Plugin",
@@ -331,9 +337,9 @@ window.__ModuleLoader__.load({
 			"gran.turn": "Turn",
 			"settings.title": "Context",
 			"settings.desc": "Preferences for Context panel in dsh-context plugin",
-			"settings.gran": "Default trend granularity",
-			"settings.mode": "Default trend display",
-			"settings.fileSort": "File Activity default sort",
+			"settings.gran": "Trend Chart · Default granularity",
+			"settings.mode": "Trend Chart · Default display",
+			"settings.fileSort": "File Activity · Default sort",
 			"settings.expand": "Expand",
 			"settings.collapse": "Collapse",
 			"settings.readOnly": "Settings are read-only in this environment",
@@ -493,6 +499,8 @@ window.__ModuleLoader__.load({
 			"browser.deltaHint": "vs previous turn",
 			"browser.noHeader": "Served by an older plugin build: token estimates only, no content",
 			"browser.noEpoch": "The header content (System Prompt / Tool Schemas) of this step is outside retention",
+			"browser.headerMetaOnly": "This environment cannot fetch header content on demand; token estimates only",
+			"browser.noSystem": "This request header carried no system prompt",
 			"browser.noContent": "Full content is outside the loaded message window (load older history in Chat to view)",
 			"browser.search.user": "Filter by message text…",
 			"browser.search.inject": "Filter injected context…",
@@ -998,14 +1006,15 @@ window.__ModuleLoader__.load({
 		}
 		/**
 		* Narrow a delivered projection value to the plugin's `contextHeaders`
-		* (request-header content epochs). Absent key = an older Host half without
-		* the companion unit — the Context browser degrades its system/tools
-		* sections to tokens-only with a note.
+		* (request-header epoch METADATA — boundaries, token prices, attribution).
+		* Absent key = an older Host half without the companion unit — the Context
+		* browser degrades its system/tools sections to a metadata-only note.
 		*
 		* Entry-level shape is checked too: a malformed epoch (corrupt payload with
-		* a missing tools list or wrong-typed system prompt) would crash the
+		* a missing tools list or wrong-typed systemTokens) would crash the
 		* browser's tools/sections reads, so the WHOLE projection degrades to null
-		* and the card falls back to its tokens-only note.
+		* and the card falls back to its metadata-only note. The epoch CONTENT is
+		* not part of this value — the browser fetches it per epoch on demand.
 		*/
 		function headersOf(value) {
 			const headers = asRecord$1(value);
@@ -1014,7 +1023,7 @@ window.__ModuleLoader__.load({
 				if (h === null || typeof h !== "object") return null;
 				const entry = h;
 				if (!Array.isArray(entry.tools)) return null;
-				if (entry.system !== void 0 && typeof entry.system !== "string") return null;
+				if (entry.systemTokens !== void 0 && (typeof entry.systemTokens !== "number" || !Number.isFinite(entry.systemTokens))) return null;
 			}
 			return headers;
 		}
@@ -1217,6 +1226,37 @@ window.__ModuleLoader__.load({
 			return rows;
 		}
 		/**
+		* The session's history readers over whichever face the running harness
+		* serves — the 0.1.2+ gateway remotes (`remote.session.page`) first, the
+		* pre-0.1.2 api client verb (`connection.api.sessions.history`) beneath it.
+		* Both cut message-aligned pages, so the returned read covers `seq` whenever
+		* the durable log still holds it: the newer face pins the inclusive cut to
+		* the seq itself, the legacy reader uses the exclusive bound one past it.
+		* Undefined when no face exists (older hosts) — callers keep their static
+		* degradation.
+		*/
+		function pageReadersOf(ctx, sessionId) {
+			const pageFace = serviceOf(ctx, "remote.session");
+			const page = pageFace !== void 0 && typeof pageFace.page === "function" ? pageFace.page.bind(pageFace) : void 0;
+			const historyFace = serviceOf(ctx, "connection")?.api?.sessions;
+			const history = historyFace !== void 0 && typeof historyFace.history === "function" ? historyFace.history.bind(historyFace) : void 0;
+			if (page === void 0 && history === void 0) return void 0;
+			return (seq) => {
+				if (page !== void 0) return page({
+					address: {
+						kind: "session",
+						sessionId
+					},
+					throughSeq: seq,
+					beforeSeq: seq + 1
+				}, new AbortController().signal);
+				return history({
+					sessionId,
+					beforeSeq: seq + 1
+				});
+			};
+		}
+		/**
 		* Build the browser's per-session fetcher over whichever history face the
 		* running harness serves — the 0.1.2+ gateway remotes (`remote.session.page`)
 		* first, the pre-0.1.2 api client verb (`connection.api.sessions.history`)
@@ -1227,32 +1267,73 @@ window.__ModuleLoader__.load({
 		* nodes cache in the closure: one mount re-reading a row never re-fetches.
 		*/
 		function makeContentFetcher(ctx, sessionId) {
-			const pageFace = serviceOf(ctx, "remote.session");
-			const page = pageFace !== void 0 && typeof pageFace.page === "function" ? pageFace.page.bind(pageFace) : void 0;
-			const historyFace = serviceOf(ctx, "connection")?.api?.sessions;
-			const history = historyFace !== void 0 && typeof historyFace.history === "function" ? historyFace.history.bind(historyFace) : void 0;
-			if (page === void 0 && history === void 0) return void 0;
-			const pageRequest = (seq) => ({
-				address: {
-					kind: "session",
-					sessionId
-				},
-				throughSeq: seq,
-				beforeSeq: seq + 1
-			});
-			const historyCall = (seq) => history({
-				sessionId,
-				beforeSeq: seq + 1
-			});
+			const read = pageReadersOf(ctx, sessionId);
+			if (read === void 0) return void 0;
 			const cache = /* @__PURE__ */ new Map();
 			return async (seq) => {
 				const hit = cache.get(seq);
 				if (hit !== void 0) return hit;
-				const node = pageNodesOf(rowsOf(page !== void 0 ? await page(pageRequest(seq), new AbortController().signal) : await historyCall(seq))).get(seq) ?? null;
+				const node = pageNodesOf(rowsOf(await read(seq))).get(seq) ?? null;
 				if (node !== null) cache.set(seq, node);
 				return node;
 			};
 		}
+		/**
+		* Map one raw `request/header` event into the epoch content the browser
+		* renders — the full system prompt text plus each tool's producer
+		* description and raw schema, mirroring the host fold's per-entry guards
+		* (a null or primitive tool entry degrades to an unnamed row instead of
+		* throwing the read). Null when the envelope carries no usable header.
+		*/
+		function headerContentOf(data) {
+			const rawHeader = data.header !== null && typeof data.header === "object" ? data.header : null;
+			if (rawHeader === null) return null;
+			const toolsRaw = Array.isArray(rawHeader.tools) ? rawHeader.tools : [];
+			const tools = [];
+			for (const t of toolsRaw) {
+				const tool = t !== null && typeof t === "object" ? t : null;
+				tools.push({
+					name: tool !== null && typeof tool.name === "string" ? tool.name : "?",
+					...tool !== null && typeof tool.description === "string" && tool.description !== "" ? { description: tool.description } : {},
+					schema: t
+				});
+			}
+			return {
+				...typeof rawHeader.system === "string" && rawHeader.system !== "" ? { system: rawHeader.system } : {},
+				tools
+			};
+		}
+		/**
+		* The on-demand CONTENT fetch for `contextHeaders` epochs — the lazy
+		* counterpart of the node fetcher above. One seq-anchored history read off
+		* the epoch's `seq` returns the page holding that epoch's `request/header`
+		* event (non-message events ride the page verbatim); the raw header is
+		* mapped client-side into the renderable content. Epochs cache per session
+		* (history is immutable), and OLDER epochs sharing the page cache for free —
+		* stepping back through epochs walks the same pages. Undefined when no
+		* history face exists (older hosts) — the browser keeps a metadata-only
+		* degradation instead.
+		*/
+		function makeHeaderFetcher(ctx, sessionId) {
+			const read = pageReadersOf(ctx, sessionId);
+			if (read === void 0) return void 0;
+			const cache = /* @__PURE__ */ new Map();
+			return async (seq) => {
+				const hit = cache.get(seq);
+				if (hit !== void 0) return hit;
+				const rows = rowsOf(await read(seq));
+				let picked = null;
+				for (const entry of rows) {
+					const ev = eventOf(entry);
+					if (ev === null || ev.type !== "request/header") continue;
+					const content = headerContentOf(ev.data);
+					if (content === null) continue;
+					cache.set(ev.seq, content);
+					if (ev.seq === seq) picked = content;
+				}
+				return picked;
+			};
+		}
 		//#endregion
 		//#region src/client/assemble.ts
 		/** The header epoch in force at `seq` (last logged before it), or the newest. */
@@ -1898,7 +1979,7 @@ window.__ModuleLoader__.load({
 				}
 				return out;
 			}, [params]);
-			const schemaJson = React.useMemo(() => props.schema !== void 0 ? JSON.stringify(props.schema, null, 2) : "", [props.schema]);
+			const schemaJson = React.useMemo(() => jsonOpen ? JSON.stringify(props.schema, null, 2) : "", [props.schema, jsonOpen]);
 			return /* @__PURE__ */ React.createElement(React.Fragment, null, props.description !== void 0 ? /* @__PURE__ */ React.createElement(TextSection, {
 				label: props.labels.desc,
 				text: props.description,
@@ -1912,13 +1993,13 @@ window.__ModuleLoader__.load({
 				name: r.name,
 				schema: r.schema,
 				required: r.required
-			}))) : params !== null ? /* @__PURE__ */ React.createElement("div", { className: "lc-ts-params-empty" }, props.labels.empty) : null, schemaJson !== "" ? /* @__PURE__ */ React.createElement("div", { className: "lc-ts-json" }, /* @__PURE__ */ React.createElement("button", {
+			}))) : params !== null ? /* @__PURE__ */ React.createElement("div", { className: "lc-ts-params-empty" }, props.labels.empty) : null, /* @__PURE__ */ React.createElement("div", { className: "lc-ts-json" }, /* @__PURE__ */ React.createElement("button", {
 				type: "button",
 				className: "lc-ts-json-toggle",
 				onClick: () => {
 					setJsonOpen((o) => !o);
 				}
-			}, (jsonOpen ? "▾ " : "▸ ") + (jsonOpen ? props.labels.hide : props.labels.show)), jsonOpen ? /* @__PURE__ */ React.createElement("pre", { className: "lc-ts-desc-body lc-br-dim" }, schemaJson) : null) : null);
+			}, (jsonOpen ? "▾ " : "▸ ") + (jsonOpen ? props.labels.hide : props.labels.show)), jsonOpen ? /* @__PURE__ */ React.createElement("pre", { className: "lc-ts-desc-body lc-br-dim" }, schemaJson) : null));
 		}
 		/**
 		* Both block vocabularies normalize here — raw durable blocks (`type`: text/reasoning/tool-call/tool-result/image) and snapshot assistant
@@ -2139,7 +2220,7 @@ window.__ModuleLoader__.load({
 			return m;
 		}
 		function countOf(asm, byCat, c) {
-			if (c === "system") return asm.header !== null && asm.header.system !== void 0 ? 1 : 0;
+			if (c === "system") return asm.header !== null && asm.header.systemTokens !== void 0 ? 1 : 0;
 			if (c === "tools") return asm.header !== null ? asm.header.tools.length : 0;
 			return byCat[c]?.length ?? 0;
 		}
@@ -2237,6 +2318,48 @@ window.__ModuleLoader__.load({
 				const linked = req === null && props.onHoverKey !== void 0;
 				const linkKey = linked && props.hoverKey !== null && props.hoverKey !== "free" ? props.hoverKey : null;
 				const view = assemble(data, headers, seq);
+				const [headerContent, setHeaderContent] = React.useState(() => /* @__PURE__ */ new Map());
+				const [headerState, setHeaderState] = React.useState("idle");
+				const [headerRetry, setHeaderRetry] = React.useState(0);
+				const fetchHeader = props.fetchHeader;
+				const headerSeq = view.header !== null ? view.header.seq : null;
+				const headerNeeded = view.header !== null && headerSeq !== null && !headerContent.has(headerSeq) && (openCat === "system" || openCat === "tools");
+				React.useEffect(() => {
+					if (!headerNeeded || fetchHeader === void 0) return;
+					let live = true;
+					setHeaderState("loading");
+					fetchHeader(headerSeq).then((content) => {
+						if (!live) return;
+						if (content === null) {
+							setHeaderState("absent");
+							return;
+						}
+						setHeaderContent((prev) => {
+							const next = new Map(prev);
+							next.set(headerSeq, content);
+							return next;
+						});
+						setHeaderState("idle");
+					}, (error) => {
+						console.warn("dsh-context: header content fetch failed", error);
+						if (live) setHeaderState("failed");
+					});
+					return () => {
+						live = false;
+					};
+				}, [
+					headerNeeded,
+					headerSeq,
+					fetchHeader,
+					headerRetry
+				]);
+				const headerNote = fetchHeader === void 0 ? t("browser.headerMetaOnly") : headerState === "loading" || headerState === "idle" ? t("browser.loading") : headerState === "absent" ? t("browser.notInLog") : /* @__PURE__ */ React.createElement("button", {
+					type: "button",
+					className: "lc-br-retry",
+					onClick: () => {
+						setHeaderRetry((r) => r + 1);
+					}
+				}, t("browser.loadFailed"));
 				const breakdown = req !== null ? req : data.current;
 				const parts = partsOf(breakdown);
 				const total = breakdown.total;
@@ -2251,7 +2374,7 @@ window.__ModuleLoader__.load({
 				const byCat = byCatOf(view);
 				const toolCount = (c) => countOf(view, byCat, c);
 				const singleKeyOf = (c) => {
-					if (c === "system") return view.header?.system !== void 0 ? "sys" : null;
+					if (c === "system") return view.header?.systemTokens !== void 0 ? "sys" : null;
 					if (c === "tools") {
 						const tools = view.header?.tools;
 						return tools !== void 0 && tools.length === 1 ? "tool:" + tools[0].name : null;
@@ -2298,13 +2421,12 @@ window.__ModuleLoader__.load({
 				const catBody = (c) => {
 					if (c === "system") {
 						if (view.header === null) return /* @__PURE__ */ React.createElement("div", { className: "lc-br-note" }, t(headers === null ? "browser.noHeader" : "browser.noEpoch"));
-						const system = view.header.system;
-						/* v8 ignore next 1 -- the category opens only when its count > 0
-						(countOf ⟺ system defined); the undefined arm is defensive. */
-						if (system === void 0) return null;
-						return elemRow("sys", null, system.replace(/\s+/g, " ").trim().slice(0, 80), breakdown.system, void 0, /* @__PURE__ */ React.createElement(TextSection, {
+						const content = headerContent.get(view.header.seq);
+						if (content === void 0) return /* @__PURE__ */ React.createElement("div", { className: "lc-br-note" }, headerNote);
+						if (content.system === void 0) return /* @__PURE__ */ React.createElement("div", { className: "lc-br-note" }, t("browser.noSystem"));
+						return elemRow("sys", null, content.system.replace(/\s+/g, " ").trim().slice(0, 80), breakdown.system, void 0, /* @__PURE__ */ React.createElement(TextSection, {
 							label: catLabel("system"),
-							text: system,
+							text: content.system,
 							rich,
 							lines: lineLabel
 						}));
@@ -2318,8 +2440,17 @@ window.__ModuleLoader__.load({
 							show: t("tool.jsonToggle"),
 							hide: t("tool.jsonHide")
 						};
+						const content = headerContent.get(view.header.seq);
+						const contentByName = new Map(content?.tools.map((t) => [t.name, t]) ?? []);
 						const q = rowQuery.trim().toLowerCase();
-						const shown = view.header.tools.filter((tool) => q === "" || tool.name.toLowerCase().includes(q) || (tool.description ?? "").toLowerCase().includes(q) || (tool.plugin ?? "").toLowerCase().includes(q) || schemaTextOf(tool.schema).toLowerCase().includes(q)).sort((a, b) => toolSort === "size" ? b.tokens - a.tokens : a.name < b.name ? -1 : 1);
+						const shown = view.header.tools.filter((tool) => {
+							if (q === "") return true;
+							if (tool.name.toLowerCase().includes(q)) return true;
+							if ((tool.plugin ?? "").toLowerCase().includes(q)) return true;
+							const row = contentByName.get(tool.name);
+							if (row === void 0) return false;
+							return (row.description ?? "").toLowerCase().includes(q) || schemaTextOf(row.schema).toLowerCase().includes(q);
+						}).sort((a, b) => toolSort === "size" ? b.tokens - a.tokens : a.name < b.name ? -1 : 1);
 						const toolctl = /* @__PURE__ */ React.createElement(RowToolbar, {
 							value: rowQuery,
 							placeholder: t("tool.search"),
@@ -2334,18 +2465,23 @@ window.__ModuleLoader__.load({
 							}
 						}, t("tool.sort." + k))));
 						if (shown.length === 0) return /* @__PURE__ */ React.createElement("div", null, toolctl, /* @__PURE__ */ React.createElement("div", { className: "lc-br-note" }, t("tool.noMatch")));
+						const toolBody = (tool) => {
+							if (content === void 0) return /* @__PURE__ */ React.createElement("div", { className: "lc-br-note" }, headerNote);
+							const row = contentByName.get(tool.name);
+							return row === void 0 ? /* @__PURE__ */ React.createElement("div", { className: "lc-br-note" }, t("browser.notInLog")) : /* @__PURE__ */ React.createElement(ToolSchema, {
+								description: row.description,
+								schema: row.schema,
+								rich,
+								lines: lineLabel,
+								labels
+							});
+						};
 						return /* @__PURE__ */ React.createElement("div", null, toolctl, shown.map((tool) => {
 							const trailing = tool.plugin !== void 0 ? /* @__PURE__ */ React.createElement("span", {
 								className: "lc-br-tag lc-br-tool-plugin",
 								title: tool.plugin === "<unknown-plugin>" ? t("tool.unknownTitle") : t("tool.plugin")
 							}, tool.plugin === "<unknown-plugin>" ? t("tool.unknown") : tool.plugin) : null;
-							return elemRow("tool:" + tool.name, null, tool.name, tool.tokens, void 0, /* @__PURE__ */ React.createElement(ToolSchema, {
-								description: tool.description,
-								schema: tool.schema,
-								rich,
-								lines: lineLabel,
-								labels
-							}), false, trailing);
+							return elemRow("tool:" + tool.name, null, tool.name, tool.tokens, void 0, toolBody(tool), false, trailing);
 						}));
 					}
 					const rows = (byCat[c] ?? []).slice().reverse().map((n) => {
@@ -2653,6 +2789,7 @@ window.__ModuleLoader__.load({
 				const convNodes = conversationNodesOf(props);
 				const [hoverCat, setHoverCat] = React.useState(null);
 				const fetchContent = React.useMemo(() => sessionId !== "" ? makeContentFetcher(ctx, sessionId) : void 0, [ctx, sessionId]);
+				const fetchHeader = React.useMemo(() => sessionId !== "" ? makeHeaderFetcher(ctx, sessionId) : void 0, [ctx, sessionId]);
 				const close = React.useCallback(() => {
 					if (sessionId === "") return;
 					modalStoreOf(sessionId).set(false);
@@ -2702,6 +2839,7 @@ window.__ModuleLoader__.load({
 					headers,
 					convNodes,
 					fetchContent,
+					fetchHeader,
 					hoverKey: hoverCat,
 					onHoverKey: setHoverCat
 				}))));
@@ -4462,11 +4600,15 @@ window.__ModuleLoader__.load({
 					});
 					acc += pct;
 				}
+				const hovering = props.hoverKey !== null && props.hoverKey !== void 0 && arcs.some((a) => a.key === props.hoverKey);
 				return /* @__PURE__ */ React.createElement("div", {
-					className: "lc-donut",
+					className: "lc-donut" + (hovering ? " lc-donut-dim" : ""),
 					style: {
 						width: size,
 						height: size
+					},
+					onMouseLeave: () => {
+						if (props.onHoverKey !== void 0) props.onHoverKey(null);
 					}
 				}, /* @__PURE__ */ React.createElement("svg", {
 					viewBox: "0 0 42 42",
@@ -4482,6 +4624,7 @@ window.__ModuleLoader__.load({
 					strokeWidth: "4"
 				}) : arcs.map((a) => /* @__PURE__ */ React.createElement("circle", {
 					key: a.key,
+					className: "lc-donut-seg" + (props.hoverKey === a.key ? " lc-donut-seg-on" : ""),
 					cx: "21",
 					cy: "21",
 					r: "15.9155",
@@ -4489,7 +4632,10 @@ window.__ModuleLoader__.load({
 					stroke: a.color,
 					strokeWidth: "4",
 					strokeDasharray: `${a.pct} ${100 - a.pct}`,
-					strokeDashoffset: a.offset
+					strokeDashoffset: a.offset,
+					onMouseEnter: () => {
+						if (props.onHoverKey !== void 0) props.onHoverKey(a.key);
+					}
 				}))), /* @__PURE__ */ React.createElement("div", { className: "lc-donut-center" }, /* @__PURE__ */ React.createElement("b", { style: { fontSize: Math.max(11, Math.round(size * .13)) } }, props.centerTop), props.centerSub !== void 0 ? /* @__PURE__ */ React.createElement("span", { style: { fontSize: Math.max(9, Math.round(size * .105)) } }, props.centerSub) : null));
 			};
 		}
@@ -4833,7 +4979,7 @@ window.__ModuleLoader__.load({
 			return function PluginInfo() {
 				const [latest, setLatest] = React.useState(null);
 				React.useEffect(() => {
-					if ("0.38.5".includes("-dev")) return;
+					if ("0.40.0".includes("-dev")) return;
 					let on = true;
 					fetchLatestVersion().then((v) => {
 						if (on && v) setLatest(v);
@@ -4842,8 +4988,8 @@ window.__ModuleLoader__.load({
 						on = false;
 					};
 				}, []);
-				const update = latest !== null && isNewerVersion(latest, "0.38.5") ? latest : null;
-				const nameText = "dsh-context (v0.38.5)";
+				const update = latest !== null && isNewerVersion(latest, "0.40.0") ? latest : null;
+				const nameText = "dsh-context (v0.40.0)";
 				const nameValue = [nameText];
 				if (update) nameValue.push(/* @__PURE__ */ React.createElement("span", {
 					key: "update",
@@ -5215,16 +5361,27 @@ window.__ModuleLoader__.load({
 		//#region src/client/components/sliceList.tsx
 		function makeSliceList(kit) {
 			return function SliceList(props) {
-				return /* @__PURE__ */ React.createElement("div", { className: "lc-sl" }, props.rows.map((r) => /* @__PURE__ */ React.createElement("div", {
+				return /* @__PURE__ */ React.createElement("div", {
+					className: "lc-sl",
+					onMouseLeave: () => {
+						if (props.onHoverKey !== void 0) props.onHoverKey(null);
+					}
+				}, props.rows.map((r) => /* @__PURE__ */ React.createElement("div", {
 					key: r.key,
-					className: "lc-sl-row"
-				}, /* @__PURE__ */ React.createElement("i", {
+					className: "lc-sl-row" + (r.dim ? " lc-sl-row-dim" : "") + (props.hoverKey !== void 0 && props.hoverKey === r.key ? " lc-sl-row-on" : ""),
+					onMouseEnter: () => {
+						if (props.onHoverKey !== void 0) props.onHoverKey(r.key);
+					}
+				}, /* @__PURE__ */ React.createElement("div", { className: "lc-sl-main" }, /* @__PURE__ */ React.createElement("i", {
 					className: "lc-sl-dot",
 					style: { background: r.color }
-				}), /* @__PURE__ */ React.createElement("span", { className: "lc-sl-label" }, r.label), r.count !== "" ? /* @__PURE__ */ React.createElement("span", {
-					className: "lc-sl-count",
+				}), /* @__PURE__ */ React.createElement("span", {
+					className: "lc-sl-label",
+					title: r.label
+				}, r.label), /* @__PURE__ */ React.createElement("span", { className: "lc-sl-pct" }, r.pct)), r.count !== "" ? /* @__PURE__ */ React.createElement("div", {
+					className: "lc-sl-sub",
 					title: r.count
-				}, r.count) : null, /* @__PURE__ */ React.createElement("span", { className: "lc-sl-pct" }, r.pct))));
+				}, r.count) : null)));
 			};
 		}
 		//#endregion
@@ -5234,6 +5391,7 @@ window.__ModuleLoader__.load({
 			const SliceList = makeSliceList(kit);
 			return function StatsTiming(props) {
 				const lang = props.locale === "zh" ? "zh" : "en";
+				const [hoverKey, setHoverKey] = React.useState(null);
 				const timing = props.timing;
 				const wall = timing !== null && Number.isFinite(timing.wallMs) && timing.wallMs > 0 ? timing.wallMs : 0;
 				let segments = [];
@@ -5243,6 +5401,11 @@ window.__ModuleLoader__.load({
 					const toolRing = Math.max(0, Math.min(timing.toolsMs, wall - lm));
 					const other = Math.max(0, wall - lm - toolRing);
 					const share = (ms) => wall > 0 ? ms / wall : 0;
+					const countOf = (ms, times) => {
+						const dur = fmtDuration(ms, lang);
+						if (times === void 0) return dur;
+						return ms > 0 ? `${dur} · ${times}` : times;
+					};
 					segments = [
 						{
 							key: "lm",
@@ -5264,23 +5427,26 @@ window.__ModuleLoader__.load({
 						{
 							key: "lm",
 							color: "#3b82f6",
-							label: `${t("timing.lm")} ${t("timing.times", { n: fmt(timing.calls) })}`,
+							label: t("timing.lm"),
+							dim: timing.lmMs === 0,
 							pct: fmtShare(timing.lmMs, wall),
-							count: fmtDuration(timing.lmMs, lang)
+							count: countOf(timing.lmMs, t("timing.lmTimes", { n: fmt(timing.calls) }))
 						},
 						{
 							key: "tools",
 							color: "#14b8a6",
-							label: `${t("timing.tools")} ${t("timing.times", { n: fmt(timing.toolCalls) })}`,
+							label: t("timing.tools"),
+							dim: timing.toolsMs === 0,
 							pct: fmtShare(timing.toolsMs, wall),
-							count: fmtDuration(timing.toolsMs, lang)
+							count: countOf(timing.toolsMs, t("timing.toolTimes", { n: fmt(timing.toolCalls) }))
 						},
 						{
 							key: "other",
 							color: "#94a3b8",
 							label: t("timing.other"),
+							dim: other === 0,
 							pct: fmtShare(other, wall),
-							count: fmtDuration(other, lang)
+							count: countOf(other)
 						}
 					];
 				}
@@ -5288,8 +5454,14 @@ window.__ModuleLoader__.load({
 					segments,
 					size: 96,
 					centerTop: wall > 0 ? fmtDuration(wall, lang) : "—",
-					centerSub: t("timing.total")
-				}), /* @__PURE__ */ React.createElement(SliceList, { rows })));
+					centerSub: t("timing.total"),
+					hoverKey,
+					onHoverKey: setHoverKey
+				}), /* @__PURE__ */ React.createElement(SliceList, {
+					rows,
+					hoverKey,
+					onHoverKey: setHoverKey
+				})));
 			};
 		}
 		//#endregion
@@ -5298,6 +5470,7 @@ window.__ModuleLoader__.load({
 			const { t, fmt, fmtShare } = kit;
 			const SliceList = makeSliceList(kit);
 			return function StatsTokens(props) {
+				const [hoverKey, setHoverKey] = React.useState(null);
 				const reads = props.usage !== null ? numOf(props.usage.cacheReadTokens) : 0;
 				const writes = props.usage !== null ? numOf(props.usage.cacheWriteTokens) : 0;
 				const uncached = props.usage !== null ? numOf(props.usage.uncachedInputTokens) : 0;
@@ -5319,7 +5492,7 @@ window.__ModuleLoader__.load({
 					},
 					{
 						key: "uncached",
-						color: "#6366f1",
+						color: "#a855f7",
 						label: t("tokens.uncached"),
 						value: uncached
 					},
@@ -5327,6 +5500,7 @@ window.__ModuleLoader__.load({
 						key: "output",
 						color: "#3b82f6",
 						label: t("tokens.output"),
+						note: t("tokens.outputNote"),
 						value: output
 					}
 				];
@@ -5336,7 +5510,7 @@ window.__ModuleLoader__.load({
 					color: b.color,
 					label: b.label,
 					pct: fmtShare(b.value, billed),
-					count: fmt(b.value)
+					count: b.note === void 0 ? fmt(b.value) : `${fmt(b.value)} · ${b.note}`
 				}));
 				return /* @__PURE__ */ React.createElement("div", { className: "lc-card lc-col-stats lc-col-donut" }, /* @__PURE__ */ React.createElement("div", { className: "lc-card-title" }, /* @__PURE__ */ React.createElement("span", { className: "lc-card-title-text" }, t("tokens.title")), /* @__PURE__ */ React.createElement("span", { className: "lc-card-sub" }, t("tokens.hint"))), /* @__PURE__ */ React.createElement("div", { className: "lc-donut-row" }, /* @__PURE__ */ React.createElement(Donut, {
 					segments: shown.map((b) => ({
@@ -5346,8 +5520,14 @@ window.__ModuleLoader__.load({
 					})),
 					size: 96,
 					centerTop: hit === null ? "—" : `${hit}%`,
-					centerSub: t("tokens.cacheHit")
-				}), /* @__PURE__ */ React.createElement(SliceList, { rows })));
+					centerSub: t("tokens.cacheHit"),
+					hoverKey,
+					onHoverKey: setHoverKey
+				}), /* @__PURE__ */ React.createElement(SliceList, {
+					rows,
+					hoverKey,
+					onHoverKey: setHoverKey
+				})));
 			};
 		}
 		//#endregion
@@ -5822,6 +6002,7 @@ window.__ModuleLoader__.load({
 				}, []);
 				const loadImage = React.useMemo(() => imageLoaderOf(ctx, typeof sessionId === "string" ? sessionId : void 0), [ctx, sessionId]);
 				const fetchContent = React.useMemo(() => typeof sessionId === "string" && sessionId !== "" ? makeContentFetcher(ctx, sessionId) : void 0, [ctx, sessionId]);
+				const fetchHeader = React.useMemo(() => typeof sessionId === "string" && sessionId !== "" ? makeHeaderFetcher(ctx, sessionId) : void 0, [ctx, sessionId]);
 				const rootRef = React.useRef(null);
 				const scrollerRef = React.useRef(null);
 				const restoredRef = React.useRef(null);
@@ -6041,6 +6222,7 @@ window.__ModuleLoader__.load({
 					headers,
 					convNodes,
 					fetchContent,
+					fetchHeader,
 					previewSeq: hoveredSeq,
 					pinSeq: pinnedReq !== null ? pinnedReq.seq : null,
 					hoverKey: hoverCat,
@@ -6180,7 +6362,7 @@ window.__ModuleLoader__.load({
 		}
 		//#endregion
 		//#region \0dsh-global-css:/home/runner/work/dsh-context/dsh-context/src/client/styles/stats.css.mjs
-		const css$12 = ".lc-stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;display:grid}.lc-stat{background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l2);border-radius:8px;flex-direction:column;gap:2px;min-width:0;padding:6px;display:flex}.lc-stats .lc-stat{padding:6px 3px}.lc-stats .lc-stat-q{margin:0;position:absolute;top:3px;right:4px}.lc-stat-label{color:var(--dsw-alias-label-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:11px;font-weight:600;overflow:hidden}.lc-stat-value{color:var(--dsw-alias-label-primary);white-space:nowrap;text-overflow:ellipsis;text-align:center;font-size:14px;font-weight:600;overflow:hidden}.lc-stat-sub{color:var(--dsw-alias-label-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.lc-stat-tipped{position:relative}.lc-stat-q{text-align:center;width:11px;height:11px;color:var(--dsw-alias-label-secondary);background:var(--dsw-alias-bg-layer-1);border:1px solid var(--dsw-alias-border-l2);cursor:help;border-radius:50%;margin-left:4px;font-size:9px;font-style:normal;font-weight:700;line-height:11px;display:inline-block}.lc-stat-tipped:hover .lc-stat-q{color:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-label-primary)}.lc-stat-tip{max-width:280px;font-weight:400;line-height:1.5;top:calc(100% + 6px);left:0}.lc-stat-tipped:hover .lc-stat-tip{opacity:1}.lc-stat-tip-prices{border-top:1px dashed var(--dsw-alias-border-l1);margin-top:5px;padding-top:5px;display:block}.lc-stat-tip-head{font-weight:600;display:block}.lc-stat-tip-row{margin-top:2px;display:block}.lc-stat-tip-model{color:var(--dsw-alias-label-primary)}.lc-card-sub{color:var(--dsw-alias-label-secondary);margin-left:auto;font-size:12px;font-weight:400}.lc-overview-num{align-items:baseline;gap:6px;margin-bottom:8px;display:flex}.lc-overview-num>b{font-size:20px}.lc-overview-num span{color:var(--dsw-alias-label-secondary)}.lc-overview-pct{margin-left:auto;font-size:11px}.lc-overview-pct b{color:var(--dsw-alias-label-primary);margin-right:4px;font-size:20px}.lc-stat-head{color:var(--dsw-alias-label-secondary);margin:12px 0 8px;font-size:11px;font-weight:600}.lc-donut-row{justify-content:flex-start;align-items:center;gap:12px;min-width:0;display:flex}.lc-col-donut{flex-direction:column;display:flex}.lc-col-donut .lc-donut-row{flex:1}.lc-donut-row .lc-sl{flex:auto}.lc-donut{flex:none;position:relative}.lc-donut svg{display:block}.lc-donut-track{stroke:#8080802e}.lc-donut-center{pointer-events:none;text-align:center;box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;gap:1px;padding:0 7px;display:flex;position:absolute;inset:0}.lc-donut-center b{white-space:nowrap;text-overflow:ellipsis;max-width:100%;line-height:1.15;overflow:hidden}.lc-donut-center span{color:var(--dsw-alias-label-secondary);white-space:nowrap}.lc-sl{flex-direction:column;gap:5px;min-width:0;display:flex;overflow:hidden}.lc-sl-row{align-items:baseline;gap:6px;min-width:0;font-size:12px;display:flex}.lc-sl-dot{border-radius:2px;flex:none;align-self:flex-start;width:8px;height:8px;margin-top:2px}.lc-sl-label{flex:0 auto;min-width:80px;line-height:1.25;overflow:hidden}.lc-sl-count{text-align:right;color:var(--dsw-alias-label-secondary);font-variant-numeric:tabular-nums;white-space:nowrap;text-overflow:ellipsis;flex:auto;overflow:hidden}.lc-sl-pct{text-align:right;font-variant-numeric:tabular-nums;flex:none;min-width:30px;font-weight:700}.lc-pi-grid{grid-template-columns:1fr;gap:8px;display:grid}.lc-pi-row-btn{appearance:none;font:inherit;color:inherit;text-align:left;cursor:pointer;background:0 0;border:0;width:100%;padding:0}.lc-pi-row{min-width:0;color:inherit;flex-direction:row;justify-content:space-between;align-items:baseline;gap:12px;text-decoration:none;display:flex}.lc-pi-row:hover .lc-pi-value{text-decoration:underline}.lc-pi-hint{text-decoration:none}.lc-pi-hint:hover{text-decoration:underline}.lc-pi-update{color:var(--dsw-alias-state-warn-primary);white-space:nowrap;margin-left:6px;font-size:11px}.lc-pi-label{color:var(--dsw-alias-label-secondary);white-space:nowrap;text-overflow:ellipsis;flex:none;font-size:11px;font-weight:600;overflow:hidden}.lc-pi-value{min-width:0;color:var(--dsw-alias-label-primary);white-space:nowrap;text-overflow:ellipsis;text-align:right;font-size:13px;font-weight:600;overflow:hidden}.lc-pi-row-btn .lc-pi-value{font-weight:400}@container lc-head-card (width<=320px){.lc-donut-row{flex-wrap:wrap}.lc-donut{margin:0 auto}.lc-donut-row .lc-sl{flex-basis:100%}.lc-sl-label{min-width:40px}.lc-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}";
+		const css$12 = ".lc-stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;display:grid}.lc-stat{background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l2);border-radius:8px;flex-direction:column;gap:2px;min-width:0;padding:6px;display:flex}.lc-stats .lc-stat{padding:6px 3px}.lc-stats .lc-stat-q{margin:0;position:absolute;top:3px;right:4px}.lc-stat-label{color:var(--dsw-alias-label-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:11px;font-weight:600;overflow:hidden}.lc-stat-value{color:var(--dsw-alias-label-primary);white-space:nowrap;text-overflow:ellipsis;text-align:center;font-size:14px;font-weight:600;overflow:hidden}.lc-stat-sub{color:var(--dsw-alias-label-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.lc-stat-tipped{position:relative}.lc-stat-q{text-align:center;width:11px;height:11px;color:var(--dsw-alias-label-secondary);background:var(--dsw-alias-bg-layer-1);border:1px solid var(--dsw-alias-border-l2);cursor:help;border-radius:50%;margin-left:4px;font-size:9px;font-style:normal;font-weight:700;line-height:11px;display:inline-block}.lc-stat-tipped:hover .lc-stat-q{color:var(--dsw-alias-label-primary);border-color:var(--dsw-alias-label-primary)}.lc-stat-tip{max-width:280px;font-weight:400;line-height:1.5;top:calc(100% + 6px);left:0}.lc-stat-tipped:hover .lc-stat-tip{opacity:1}.lc-stat-tip-prices{border-top:1px dashed var(--dsw-alias-border-l1);margin-top:5px;padding-top:5px;display:block}.lc-stat-tip-head{font-weight:600;display:block}.lc-stat-tip-row{margin-top:2px;display:block}.lc-stat-tip-model{color:var(--dsw-alias-label-primary)}.lc-card-sub{color:var(--dsw-alias-label-secondary);margin-left:auto;font-size:12px;font-weight:400}.lc-overview-num{align-items:baseline;gap:6px;margin-bottom:8px;display:flex}.lc-overview-num>b{font-size:20px}.lc-overview-num span{color:var(--dsw-alias-label-secondary)}.lc-overview-pct{margin-left:auto;font-size:11px}.lc-overview-pct b{color:var(--dsw-alias-label-primary);margin-right:4px;font-size:20px}.lc-stat-head{color:var(--dsw-alias-label-secondary);margin:12px 0 8px;font-size:11px;font-weight:600}.lc-donut-row{justify-content:flex-start;align-items:center;gap:12px;min-width:0;display:flex}.lc-col-donut{flex-direction:column;display:flex}.lc-col-donut .lc-donut-row{flex:1}.lc-donut-row .lc-sl{flex:auto}.lc-donut{flex:none;position:relative}.lc-donut svg{display:block}.lc-donut-track{stroke:#8080802e}.lc-donut-seg{transition:opacity .12s}.lc-donut-dim .lc-donut-seg{opacity:.35}.lc-donut-dim .lc-donut-seg-on{opacity:1}.lc-donut-center{pointer-events:none;text-align:center;box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;gap:1px;padding:0 7px;display:flex;position:absolute;inset:0}.lc-donut-center b{white-space:nowrap;text-overflow:ellipsis;max-width:100%;line-height:1.15;overflow:hidden}.lc-donut-center span{color:var(--dsw-alias-label-secondary);white-space:nowrap}.lc-sl{flex-direction:column;gap:6px;min-width:0;display:flex;overflow:hidden}.lc-sl-row{border-radius:6px;flex-direction:column;gap:1px;min-width:0;margin:0 -6px;padding:1px 6px;font-size:12px;transition:background-color .12s;display:flex}.lc-sl-row-on{background:var(--dsw-alias-interactive-bg-hover)}.lc-sl-row-dim{opacity:.55}.lc-sl-main{align-items:center;gap:6px;min-width:0;display:flex}.lc-sl-dot{border-radius:2px;flex:none;width:8px;height:8px}.lc-sl-label{white-space:nowrap;text-overflow:ellipsis;flex:auto;min-width:0;font-weight:600;line-height:1.25;overflow:hidden}.lc-sl-pct{text-align:right;font-variant-numeric:tabular-nums;flex:none;min-width:34px;font-weight:700}.lc-sl-sub{color:var(--dsw-alias-label-secondary);font-variant-numeric:tabular-nums;white-space:nowrap;text-overflow:ellipsis;margin-left:14px;font-size:11px;line-height:1.3;overflow:hidden}.lc-pi-grid{grid-template-columns:1fr;gap:8px;display:grid}.lc-pi-row-btn{appearance:none;font:inherit;color:inherit;text-align:left;cursor:pointer;background:0 0;border:0;width:100%;padding:0}.lc-pi-row{min-width:0;color:inherit;flex-direction:row;justify-content:space-between;align-items:baseline;gap:12px;text-decoration:none;display:flex}.lc-pi-row:hover .lc-pi-value{text-decoration:underline}.lc-pi-hint{text-decoration:none}.lc-pi-hint:hover{text-decoration:underline}.lc-pi-update{color:var(--dsw-alias-state-warn-primary);white-space:nowrap;margin-left:6px;font-size:11px}.lc-pi-label{color:var(--dsw-alias-label-secondary);white-space:nowrap;text-overflow:ellipsis;flex:none;font-size:11px;font-weight:600;overflow:hidden}.lc-pi-value{min-width:0;color:var(--dsw-alias-label-primary);white-space:nowrap;text-overflow:ellipsis;text-align:right;font-size:13px;font-weight:600;overflow:hidden}.lc-pi-row-btn .lc-pi-value{font-weight:400}@container lc-head-card (width<=320px){.lc-donut-row{gap:8px}.lc-stats{grid-template-columns:repeat(4,minmax(0,1fr))}}@container lc-head-card (width<=240px){.lc-donut-row{flex-wrap:wrap}.lc-donut{margin:0 auto}.lc-donut-row .lc-sl{flex-basis:100%}.lc-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}";
 		const tagId$12 = "dsh-context/stats.css";
 		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId$12) + "]") === null) {
 			const tag = document.createElement("style");

package/lib/index.d.ts

@@ -30,8 +30,27 @@ declare const Config: z.ZodPreprocess<z.ZodObject<{
 }, z.core.$strict>>;
 //#endregion
 //#region src/host/headers.d.ts
+/**
+ * One stored tool: the v1 row shape carried the producer description and the
+ * raw schema; folds since the #37 slim-down append metadata-only entries.
+ */
+interface StoredHeaderTool {
+  name: string;
+  tokens: number;
+  description?: string;
+  plugin?: string;
+  schema?: unknown;
+}
+/** One stored epoch: v1 rows carried `system`; folds since carry `systemTokens`. */
+interface StoredHeaderRecord {
+  seq: number;
+  time: number;
+  system?: string;
+  systemTokens?: number;
+  tools: StoredHeaderTool[];
+}
 interface HeadersState {
-  headers: HeaderRecord[];
+  headers: StoredHeaderRecord[];
 }
 //#endregion
 //#region src/host/fold.d.ts
@@ -382,12 +401,10 @@ interface ContextEventRecord {
   turn?: number;
   step?: number;
 }
-/** One tool schema as assembled into a request header, with its display price. */
+/** One tool of a request-header epoch, with its display price. */
 interface HeaderTool {
   name: string;
   tokens: number;
-  /** Producer-declared description (may be long; the browser truncates). */
-  description?: string;
   /**
    * The registering plugin's label, when attribution is known: either a
    * `plugin` field carried by the raw header entry (harness-provided) or the
@@ -397,16 +414,21 @@ interface HeaderTool {
    * the browser shows no tag.
    */
   plugin?: string;
-  /** The raw JSON schema object the model received (plain JSON). */
-  schema?: unknown;
 }
 /**
- * One request-header epoch: the full system prompt and tool schemas in force from this event's seq until the next epoch.
+ * One request-header epoch's METADATA: the epoch boundaries and token prices
+ * in force from this event's seq until the next epoch. The epoch CONTENT
+ * (full system prompt text, tool descriptions/schemas) is not projected —
+ * every session.list row, control baseline, push frame, and projection-cache
+ * checkpoint would otherwise carry it per session × epoch. The client
+ * fetches one epoch's content on demand (a seq-anchored history read off
+ * `seq`) as a {@link HeaderEpochContent}.
  */
 interface HeaderRecord {
   seq: number;
   time: number;
-  system?: string;
+  /** The epoch's estimated system-prompt tokens; absent when it logged no system prompt. */
+  systemTokens?: number;
   tools: HeaderTool[];
 }
 /** The `contextHeaders` projection value: the bounded epoch list (newest last). */

package/lib/index.js

@@ -549,42 +549,72 @@ function isInjection(source) {
 //#endregion
 //#region src/host/headers.ts
 /**
-* The `contextHeaders` session projection unit — the request-header CONTENT
-* epochs behind the timeline's envelope figures.
+* The `contextHeaders` session projection unit — the request-header EPOCH
+* METADATA behind the timeline's envelope figures.
 *
 * The hot `contextTimeline` unit carries only token prices of the system
-* prompt and tool schemas; this companion unit keeps the CONTENT (full
-* system prompt text, full tool JSON schemas) so the Context browser card
-* can show what a picked step's request was actually assembled from. It is
-* a separate unit on purpose: the agent loop logs `request/header` only
-* when the header changes, so this state (and its pushes to the browser)
-* moves rarely — carrying full content costs nothing on the per-event hot
-* path.
+* prompt and tool schemas; this companion unit keeps the per-epoch METADATA
+* (epoch seq/time boundaries, per-tool token prices and plugin attribution)
+* so the Context browser can pick the header epoch in force at any step and
+* size its sections immediately. The epoch CONTENT (full system prompt text,
+* full tool JSON schemas) deliberately does NOT ride the projection VALUE:
+* session projections are served whole in every `session.list` row, control
+* baseline, push frame, and change notification, so carrying content here
+* multiplied it by sessions × epochs across every channel. The client
+* fetches one epoch's `request/header` event on demand — a seq-anchored
+* history read off the epoch's `seq`, the same targeted read the browser
+* already uses for message content — and caches it per session (history is
+* immutable).
+*
+* Read-compat over the persisted state (the pinned decision behind keeping
+* `stateVersion` at 1): the harness serves a cold session's projections from
+* its CACHED checkpoint rows and has no refresh channel for an idle session
+* — a version bump invalidates every row and orphans the key until the
+* session goes live again (the #37 regression). The state therefore still
+* ACCEPTS the v1 content-bearing record shape, current folds append
+* metadata-only records alongside any seeded legacy ones, and the view
+* normalizes BOTH to the metadata-only wire shape (pricing the legacy system
+* text at read time). Cached v1 rows keep working, new checkpoint writes
+* shrink as legacy epochs age out of the capped list, and the wire — the
+* part every delivery channel carries — is metadata-only from day one.
 *
 * Same projection contract as the timeline unit: pure init/apply/view,
 * `Object.is` reference stability for uninteresting events, plain-JSON
 * bounded state (epoch list capped — see HEADERS_MAX).
 */
-/** Retention cap on header epochs (changes are rare; 50 is generous). */
+/** Retention cap on header epochs (metadata only; changes are rare; 50 is generous). */
 const HEADERS_MAX = 50;
-const headerToolSchema = z.object({
+/**
+* The persisted-state schema: the SUPERSET of both record generations, so a
+* cached v1 row (content-bearing) seeds the fold instead of being discarded.
+*/
+const storedToolSchema = z.object({
 	name: z.string(),
 	tokens: z.number().int().nonnegative(),
 	description: z.string().optional(),
 	plugin: z.string().optional(),
 	schema: z.unknown().optional()
 }).strict();
-const contextHeadersSchema = z.object({ headers: z.array(z.object({
+const storedEpochSchema = z.object({
 	seq: z.number(),
 	time: z.number(),
 	system: z.string().optional(),
-	tools: z.array(headerToolSchema)
+	systemTokens: z.number().int().nonnegative().optional(),
+	tools: z.array(storedToolSchema)
+}).strict();
+const contextHeadersStateSchema = z.object({ headers: z.array(storedEpochSchema) }).strict();
+/** The wire schema: strict metadata — the shape every delivery channel carries. */
+const headerToolWireSchema = z.object({
+	name: z.string(),
+	tokens: z.number().int().nonnegative(),
+	plugin: z.string().optional()
+}).strict();
+const contextHeadersSchema = z.object({ headers: z.array(z.object({
+	seq: z.number(),
+	time: z.number(),
+	systemTokens: z.number().int().nonnegative().optional(),
+	tools: z.array(headerToolWireSchema)
 }).strict()) }).strict();
-/**
-* State and wire are the same shape (the view only shallow-copies each record), so one schema validates both under the dsh 0.1.1-rc.1+
-* `stateSchema`/`wire` contract.
-*/
-const contextHeadersStateSchema = contextHeadersSchema;
 function recordOf(event) {
 	if (event.type !== "request/header") return null;
 	const rawHeader = event.data.header;
@@ -598,40 +628,43 @@ function recordOf(event) {
 			const tool = t !== null && typeof t === "object" ? t : {};
 			const entry = {
 				name: typeof tool.name === "string" ? tool.name : "?",
-				tokens: estimateToolSchema(t),
-				schema: t
+				tokens: estimateToolSchema(t)
 			};
-			if (typeof tool.description === "string" && tool.description !== "") entry.description = tool.description;
 			if (typeof tool.plugin === "string" && tool.plugin !== "") entry.plugin = tool.plugin;
 			return entry;
 		})
 	};
-	if (typeof header.system === "string" && header.system.length > 0) record.system = header.system;
+	if (typeof header.system === "string" && header.system.length > 0) record.systemTokens = estimateSystem(header.system);
 	return record;
 }
 /**
 * The context-headers projection unit; registered alongside the timeline unit (host/index.ts); clients read it through
-* `useProjection('contextHeaders')` and degrade to tokens-only header sections when the key is absent. Dual-contract definition (see
-* compat.ts).
+* `useProjection('contextHeaders')` and fetch an epoch's full content on demand via the session history (historyPage.ts).
+* Contract mirror with a REQUIRED `wire` block (see compat.ts).
 * @param resolve - best-effort tool-to-plugin attribution (see toolSources.ts); fills a missing `plugin` at view time so
 * epochs folded without attribution still render a tag when the source is known.
 */
 function createContextHeadersDefinition(resolve) {
-	const view = (state) => ({ headers: state.headers.map((h) => ({
-		...h,
-		tools: h.tools.map((t) => {
-			if (resolve === void 0 || t.plugin !== void 0) return { ...t };
-			const plugin = resolve(t.name);
-			return plugin === void 0 ? { ...t } : {
-				...t,
-				plugin
-			};
-		})
-	})) });
+	const view = (state) => ({ headers: state.headers.map((h) => {
+		const record = {
+			seq: h.seq,
+			time: h.time,
+			tools: h.tools.map((t) => {
+				const entry = {
+					name: t.name,
+					tokens: t.tokens
+				};
+				const plugin = t.plugin ?? (resolve !== void 0 ? resolve(t.name) : void 0);
+				if (plugin !== void 0) entry.plugin = plugin;
+				return entry;
+			})
+		};
+		const systemTokens = h.systemTokens ?? (typeof h.system === "string" && h.system !== "" ? estimateSystem(h.system) : void 0);
+		if (systemTokens !== void 0) record.systemTokens = systemTokens;
+		return record;
+	}) });
 	return {
 		key: "contextHeaders",
-		schema: contextHeadersSchema,
-		view,
 		stateSchema: contextHeadersStateSchema,
 		wire: {
 			viewSchema: contextHeadersSchema,
@@ -1432,23 +1465,20 @@ const timelineStateSchema = z.object({
 * or fold semantics change (invalidation of cached rows); config-only
 * changes never require it (bounds tune retention, not state shape).
 *
-* The definition carries BOTH session-projection contracts (see compat.ts):
-* `schema`/`view` for dsh <= 0.1.0-rc.8, `stateSchema`/`wire` for
-* dsh >= 0.1.1-rc.1 — each registry reads its own fields off the same unit.
-* (The return type is the mirrored dual contract, not the installed dts
-* `ProjectionDefinition`: the 0.1.1+ registry's wired-register overload
-* demands `wire` PRESENT, which the dts's optional `wire?` fails.)
-* Without the `wire` block the 0.1.1-rc.1+ registry treats the unit as
-* host-only and never delivers `contextTimeline` to the browser (the Context
-* tab would stay on its loading screen forever).
+* The definition carries the session-projection contract served by every
+* supported harness (see compat.ts): `stateSchema` + a REQUIRED `wire` block.
+* (The return type is the mirrored contract, not the installed dts
+* `ProjectionDefinition`: the registry's wired-register overload demands
+* `wire` PRESENT, which the dts's optional `wire?` fails.) Without the
+* `wire` block the registry treats the unit as host-only and never delivers
+* `contextTimeline` to the browser (the Context tab would stay on its
+* loading screen forever).
 */
 function createContextTimelineDefinition(config) {
 	const bounds = resolveBounds(config);
 	const view = (state) => buildTimelineView(state, bounds);
 	return {
 		key: "contextTimeline",
-		schema: contextTimelineSchema,
-		view,
 		stateSchema: timelineStateSchema,
 		wire: {
 			viewSchema: contextTimelineSchema,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-context",
-  "version": "0.38.5",
+  "version": "0.40.0",
   "description": "A DeepSeek Harness plugin for context insight and management, with context dashboard and context command, for understanding how the context is made of, and how it evolves.",
   "author": "bowenliang123",
   "repository": {
@@ -38,7 +38,6 @@
     "register": "bash scripts/register.sh",
     "typecheck": "tsc --noEmit && tsc --noEmit -p tsconfig.tests.json",
     "test": "pnpm run typecheck && vitest run --coverage",
-    "test:bundle": "node scripts/bundle-smoke.mjs",
     "coverage": "vitest run --coverage",
     "release": "bash scripts/publish.sh",
     "hooks": "bash scripts/install-hooks.sh",
@@ -73,9 +72,9 @@
   },
   "peerDependencies": {
     "@deepseek-ai/cordis": "^4.0.1",
-    "@deepseek-ai/dsh-client-ui-primitives": ">=0.1.0-rc.7",
-    "@deepseek-ai/dsh-session": ">=0.1.0-rc.7",
-    "@deepseek-ai/dsh-settings": ">=0.1.0-rc.7",
+    "@deepseek-ai/dsh-client-ui-primitives": ">=0.1.1-rc.2",
+    "@deepseek-ai/dsh-session": ">=0.1.1-rc.2",
+    "@deepseek-ai/dsh-settings": ">=0.1.1-rc.2",
     "@deepseek-ai/schemastery": "^3.18.1",
     "react": "^18.3.1"
   },
@@ -89,12 +88,11 @@
   },
   "devDependencies": {
     "@deepseek-ai/cordis": "^4.0.1",
-    "@deepseek-ai/dsh-client-ui-primitives": "^0.1.1-rc.2",
-    "@deepseek-ai/dsh-session": "^0.1.1-rc.2",
-    "@deepseek-ai/dsh-session-projection": "^0.1.1-rc.2",
-    "@deepseek-ai/dsh-settings": "^0.1.1-rc.2",
+    "@deepseek-ai/dsh-client-ui-primitives": "0.1.2-alpha.2",
+    "@deepseek-ai/dsh-session": "0.1.2-alpha.2",
+    "@deepseek-ai/dsh-session-projection": "0.1.2-alpha.2",
+    "@deepseek-ai/dsh-settings": "0.1.2-alpha.2",
     "@deepseek-ai/schemastery": "^3.18.1",
-    "zod": "^4.4.3",
     "@stylistic/eslint-plugin": "^5.10.0",
     "@types/node": "^26.2.0",
     "@types/react": "^18.3.31",
@@ -110,7 +108,8 @@
     "react-dom": "^18.3.1",
     "tsdown": "^0.22.14",
     "typescript": "^7.0.2",
-    "vitest": "^4.1.11"
+    "vitest": "^4.1.11",
+    "zod": "^4.4.3"
   },
   "packageManager": "pnpm@11.9.0"
 }