dsh-context 0.46.1 → 0.47.0

package/README.md

@@ -10,6 +10,7 @@
 
 [`dsh-context`](https://www.npmjs.com/package/dsh-context) provides full context lifecycle management features.
 - **Context tab** — an UI context dashboard for DeepSeek Harness's context stats, composition, trend, events, and messages.
+- **Context panel** — the same dashboard as a right-sidebar tab (dsh 0.1.5+): pick **Context** on the sidebar's guide page and the panel opens beside the chat.
 - **`/context` command** — the slash command shows the context model for current context composition and recent context evolution.
 
 ## Install / Update
@@ -140,7 +141,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.2-rc1+**. The per-release matrix and how it is verified: [docs/compatibility.md](docs/compatibility.md).
+- **Compatibility** — works on `@deepseek-ai/dsh` **0.1.2-rc1+**, across the V0 (0.1.2-rc.x), V2 (0.1.3-alpha.x), and V3 (0.1.5-alpha.x+) session-log generations. The per-release matrix and how it is verified: [docs/compatibility.md](docs/compatibility.md).
 - **I18n** — UI in English and 简体中文.
 
 ## Like it?

package/lib/client.js

@@ -10,6 +10,7 @@ window.__ModuleLoader__.load({
 		//#region src/client/i18n.ts
 		const DICT_ZH = {
 			"tab": "上下文",
+			"sidebar.guideDescription": "查看这个会话的上下文构成、每步变化与消息列表。",
 			"cat.system": "系统提示词",
 			"cat.tools": "工具定义",
 			"cat.user": "用户消息",
@@ -296,6 +297,7 @@ window.__ModuleLoader__.load({
 		};
 		const DICT_EN = {
 			"tab": "Context",
+			"sidebar.guideDescription": "Inspect this session's context composition, per-step history, and messages.",
 			"cat.system": "System Prompt",
 			"cat.tools": "Tool Schemas",
 			"cat.user": "User Messages",
@@ -954,7 +956,7 @@ window.__ModuleLoader__.load({
 				"assistant",
 				"tool",
 				"total"
-			].every((k) => typeof current[k] === "number") && recordsOnly(data.requests) && recordsOnly(data.events) && recordsOnly(data.nodes) && recordsOnly(data.archive) && timingFastOk(data.timing)) return data;
+			].every((k) => typeof current[k] === "number") && recordsOnly(data.requests) && recordsOnly(data.events) && recordsOnly(data.nodes) && recordsOnly(data.archive) && systemsFastOk(data.systems) && timingFastOk(data.timing)) return data;
 			const safeCurrent = current !== null && typeof current === "object" ? current : {};
 			const cost = typeof data.cost === "object" && data.cost !== null && !Array.isArray(data.cost) ? data.cost : void 0;
 			const timing = timingOf(data.timing);
@@ -988,6 +990,7 @@ window.__ModuleLoader__.load({
 				...typeof data.detailRev === "number" && Number.isFinite(data.detailRev) ? { detailRev: data.detailRev } : {},
 				...cost !== void 0 ? { cost } : {},
 				...timing !== null ? { timing } : {},
+				...data.systems !== void 0 ? { systems: systemsOf(data.systems) } : {},
 				...typeof data.surfaceFloor === "number" ? { surfaceFloor: data.surfaceFloor } : {},
 				...typeof data.archiveFloor === "number" ? { archiveFloor: data.archiveFloor } : {},
 				...data.fileOps !== void 0 ? { fileOps: objectsOf(data.fileOps) } : {},
@@ -995,6 +998,45 @@ window.__ModuleLoader__.load({
 			};
 		}
 		/**
+		* The live system-prompt nodes, re-proved per entry and sorted by seq: an
+		* entry missing a finite seq/time/tokens drops out (the browser then falls
+		* back to the header epoch), so a hostile collection can never produce a NaN
+		* prompt figure or an unfetchable seq. Absent or empty stays absent.
+		*/
+		function systemsOf(value) {
+			const list = objectsOf(value);
+			const out = [];
+			for (const entry of list) {
+				const { seq, time, tokens } = entry;
+				if (typeof seq !== "number" || !Number.isFinite(seq)) continue;
+				if (typeof time !== "number" || !Number.isFinite(time)) continue;
+				if (typeof tokens !== "number" || !Number.isFinite(tokens)) continue;
+				out.push({
+					seq,
+					time,
+					tokens
+				});
+			}
+			return out.sort((a, b) => a.seq - b.seq);
+		}
+		/**
+		* The fast path's check for the live system-prompt nodes: every entry must
+		* carry the three finite numbers the browser reads — `seq` for the per-step
+		* resolution, `time` for the DNA band, `tokens` for its width. A primitive
+		* entry, or one whose fields are not numbers, sends the payload down the
+		* sanitizing slow path (`systemsOf` drops it) instead of leaking `undefined`
+		* into the bar math. An absent list is fine.
+		*/
+		function systemsFastOk(value) {
+			if (value === void 0) return true;
+			if (!Array.isArray(value)) return false;
+			return value.every((entry) => {
+				if (entry === null || typeof entry !== "object") return false;
+				const { seq, time, tokens } = entry;
+				return typeof seq === "number" && Number.isFinite(seq) && typeof time === "number" && Number.isFinite(time) && typeof tokens === "number" && Number.isFinite(tokens);
+			});
+		}
+		/**
 		* The split head's count figures, re-proved field by field: a present-but-
 		* partial record zeroes its unreadable fields (the stats board's no-NaN
 		* guarantee), an absent or non-record value stays absent (legacy generation
@@ -1323,6 +1365,25 @@ window.__ModuleLoader__.load({
 			return out.trim() === "" ? null : out;
 		}
 		/**
+		* The system prompt's exact rendered text — every text block joined with NO
+		* normalization: a whitespace-only prompt is still the prompt the model
+		* received (the host prices it as text), so it must render rather than read
+		* as absent. Null when the content carries no text block at all.
+		*/
+		function systemTextOf(blocks) {
+			if (!Array.isArray(blocks)) return null;
+			let out = "";
+			let seen = false;
+			for (const b of blocks) {
+				const text = b !== null && typeof b === "object" ? b.text : void 0;
+				if (typeof text === "string") {
+					out += text;
+					seen = true;
+				}
+			}
+			return seen ? out : null;
+		}
+		/**
 		* One assistant content block → the snapshot block vocabulary the browser
 		* already renders (`kind`: text/reasoning/image/tool-call); unmappable
 		* blocks pass through raw and degrade to the generic JSON section.
@@ -1548,13 +1609,23 @@ window.__ModuleLoader__.load({
 			};
 		}
 		/**
-		* 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.
+		* Map one raw durable event into the epoch content the browser renders. A
+		* `request/header` yields the full system prompt text (V0/V2 envelope) plus
+		* each tool's producer description and raw schema; a V3 `system/message`
+		* yields the prompt text alone (its tools live in the request header). Both
+		* mirror 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 neither.
 		*/
-		function headerContentOf(data) {
+		function headerContentOf(event) {
+			const { type, data } = event;
+			if (type === "system/message") {
+				const system = systemTextOf((data.message !== null && typeof data.message === "object" ? data.message : null)?.content);
+				return system === null ? null : {
+					system,
+					tools: []
+				};
+			}
 			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 : [];
@@ -1573,15 +1644,15 @@ window.__ModuleLoader__.load({
 			};
 		}
 		/**
-		* 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 — the browser keeps a metadata-only degradation
-		* instead.
+		* The on-demand CONTENT fetch for the browser's System and Tools sections —
+		* the lazy counterpart of the node fetcher above. One seq-anchored history
+		* read off the requested seq returns the page holding that event (non-message
+		* events ride the page verbatim); a `request/header` maps to the epoch's
+		* tools (and its V0/V2 system text), a `system/message` to a V3 prompt's
+		* text. Landed content caches per seq (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 — the browser keeps a
+		* metadata-only degradation instead.
 		*/
 		function makeHeaderFetcher(sessionId) {
 			const read = pageReaderOf(sessionId);
@@ -1594,8 +1665,8 @@ window.__ModuleLoader__.load({
 				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 (ev === null || ev.type !== "request/header" && ev.type !== "system/message") continue;
+					const content = headerContentOf(ev);
 					if (content === null) continue;
 					cache.set(ev.seq, content);
 					if (ev.seq === seq) picked = content;
@@ -1872,6 +1943,30 @@ window.__ModuleLoader__.load({
 			for (let i = headers.headers.length - 1; i >= 0; i--) if (headers.headers[i].seq < seq) return headers.headers[i];
 			return null;
 		}
+		/**
+		* The system prompt in force at `seq` (null = none) — the LAST live system
+		* node at or before it carrying tokens, which is exactly the host fold's
+		* "last nonempty surviving system" rule and therefore agrees with the
+		* per-step `system` figure the fold recorded. Rows folded before `systems`
+		* existed carry none; the header epoch's envelope figure stands in for them
+		* (the pre-V3 wire shape).
+		*/
+		function systemAt(data, header, seq) {
+			const systems = data.systems;
+			if (systems !== void 0 && systems.length > 0) {
+				for (let i = systems.length - 1; i >= 0; i--) {
+					const node = systems[i];
+					if (node.tokens <= 0) continue;
+					if (seq === null || node.seq < seq) return node;
+				}
+				return null;
+			}
+			return header !== null && header.systemTokens !== void 0 ? {
+				seq: header.seq,
+				time: header.time,
+				tokens: header.systemTokens
+			} : null;
+		}
 		function assemble(data, headers, seq) {
 			const live = seq === null;
 			let nodes;
@@ -1888,9 +1983,11 @@ window.__ModuleLoader__.load({
 				if (live || data.surfaceFloor !== void 0 && seq > data.surfaceFloor) missingLive = data.droppedNodes;
 			}
 			const approximate = !live && data.archiveFloor !== void 0 && seq < data.archiveFloor;
+			const header = headerAt(headers, seq);
 			return {
 				live,
-				header: headerAt(headers, seq),
+				header,
+				system: systemAt(data, header, seq),
 				nodes,
 				missingLive,
 				approximate
@@ -1900,19 +1997,17 @@ window.__ModuleLoader__.load({
 		//#region src/client/dna.ts
 		function dnaOf(view) {
 			const items = [];
-			if (view.header !== null) {
-				if (view.header.systemTokens !== void 0) items.push({
-					key: "sys",
-					cat: "system",
-					tokens: view.header.systemTokens,
-					time: view.header.time
-				});
-				for (const tool of view.header.tools) items.push({
-					key: "tool:" + tool.name,
-					cat: "tools",
-					tokens: tool.tokens
-				});
-			}
+			if (view.system !== null) items.push({
+				key: "sys",
+				cat: "system",
+				tokens: view.system.tokens,
+				time: view.system.time
+			});
+			if (view.header !== null) for (const tool of view.header.tools) items.push({
+				key: "tool:" + tool.name,
+				cat: "tools",
+				tokens: tool.tokens
+			});
 			for (const n of view.nodes) items.push({
 				key: "n" + String(n.seq),
 				cat: n.cat,
@@ -3217,7 +3312,7 @@ window.__ModuleLoader__.load({
 			return m;
 		}
 		function countOf(asm, byCat, c) {
-			if (c === "system") return asm.header !== null && asm.header.systemTokens !== void 0 ? 1 : 0;
+			if (c === "system") return asm.system !== null ? 1 : 0;
 			if (c === "tools") return asm.header !== null ? asm.header.tools.length : 0;
 			return byCat[c]?.length ?? 0;
 		}
@@ -3302,7 +3397,8 @@ window.__ModuleLoader__.load({
 				const view = assemble(data, headers, seq);
 				const fetchHeader = props.fetchHeader;
 				const headerSeq = view.header !== null ? view.header.seq : null;
-				const epoch = useFetchOnMiss(headerSeq !== null && (openCat === "system" || openCat === "tools") ? headerSeq : null, fetchHeader, "dsh-context: header content fetch failed");
+				const systemSeq = view.system !== null ? view.system.seq : null;
+				const epoch = useFetchOnMiss(openCat === "system" ? systemSeq : openCat === "tools" ? headerSeq : null, fetchHeader, "dsh-context: header content fetch failed");
 				const headerContent = epoch.values;
 				const headerNote = fetchMissNote(t, fetchHeader, epoch.state, epoch.retry, "browser.headerMetaOnly");
 				const breakdown = req !== null ? req : data.current;
@@ -3348,7 +3444,7 @@ window.__ModuleLoader__.load({
 				};
 				const toolCount = (c) => countOf(view, byCat, c);
 				const singleKeyOf = (c) => {
-					if (c === "system") return view.header?.systemTokens !== void 0 ? "sys" : null;
+					if (c === "system") return view.system !== null ? "sys" : null;
 					if (c === "tools") {
 						const tools = view.header?.tools;
 						return tools !== void 0 && tools.length === 1 ? "tool:" + tools[0].name : null;
@@ -3418,11 +3514,12 @@ window.__ModuleLoader__.load({
 				};
 				const catBody = (c) => {
 					if (c === "system") {
-						if (view.header === null) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						const sys = view.system;
+						if (sys === null) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 							className: "lc-br-note",
 							children: t(headers === null ? "browser.noHeader" : "browser.noEpoch")
 						});
-						const content = headerContent.get(view.header.seq);
+						const content = headerContent.get(sys.seq);
 						if (content === void 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 							className: "lc-br-note",
 							children: headerNote
@@ -6482,7 +6579,7 @@ window.__ModuleLoader__.load({
 			return function PluginInfo() {
 				const [latest, setLatest] = (0, react.useState)(null);
 				(0, react.useEffect)(() => {
-					if ("0.46.1".includes("-dev")) return;
+					if ("0.47.0".includes("-dev")) return;
 					let on = true;
 					fetchLatestVersion().then((v) => {
 						if (on && v) setLatest(v);
@@ -6491,8 +6588,8 @@ window.__ModuleLoader__.load({
 						on = false;
 					};
 				}, []);
-				const update = latest !== null && isNewerVersion(latest, "0.46.1") ? latest : null;
-				const nameText = "dsh-context (v0.46.1)";
+				const update = latest !== null && isNewerVersion(latest, "0.47.0") ? latest : null;
+				const nameText = "dsh-context (v0.47.0)";
 				const nameValue = [nameText];
 				if (update) nameValue.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 					className: "lc-pi-update",
@@ -8067,6 +8164,7 @@ window.__ModuleLoader__.load({
 			const ErrorBoundary = makeErrorBoundary(t);
 			function ContextViewBody(props) {
 				const sessionId = props.sessionId;
+				const inSidebar = props.host === "sidebar";
 				const source = useTimelineSource(ctx, props);
 				const data = source.data;
 				const pressure = projectionOf(props, "contextPressure", contextPressureOf);
@@ -8261,6 +8359,132 @@ window.__ModuleLoader__.load({
 				const activeLocale = localeSvc !== void 0 && typeof localeSvc.getLocale === "function" ? localeSvc.getLocale().active : "en";
 				const subtitle = (data.model ?? "") + (data.provider ? " · " + data.provider : "");
 				const gate = unsupportedOf(data.unsupported);
+				const compositionCard = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CurrentComposition, {
+					head,
+					subtitle,
+					hoverKey: hoverCat,
+					onHoverKey: setHoverCat
+				});
+				const trendCard = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "lc-card",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "lc-card-title",
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: "lc-card-title-text",
+								children: t("trend.title")
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: "lc-gran lc-trend-adaptive",
+								role: "group",
+								title: t("trend.adaptiveHint"),
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+									type: "button",
+									className: "lc-gran-btn" + (adaptive ? " lc-gran-on" : ""),
+									onClick: () => {
+										setAdaptive((on) => !on);
+									},
+									children: t("trend.adaptive")
+								})
+							}),
+							focusCat !== null ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: "lc-card-sub",
+								children: t("trend.focus", { cat: kit.catLabel(focusCat) })
+							}) : null,
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: "lc-trend-ctl",
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: "lc-gran",
+									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+										className: "lc-gran-btn" + (granularity === "step" ? " lc-gran-on" : ""),
+										onClick: () => {
+											setGranularity("step");
+										},
+										children: t("gran.step")
+									}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+										className: "lc-gran-btn" + (granularity === "turn" ? " lc-gran-on" : ""),
+										onClick: () => {
+											setGranularity("turn");
+										},
+										children: t("gran.turn")
+									})]
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: "lc-gran",
+									title: t("gran.modeHint"),
+									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+										className: "lc-gran-btn" + (trendMode === "total" ? " lc-gran-on" : ""),
+										onClick: () => {
+											setTrendMode("total");
+										},
+										children: t("gran.total")
+									}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+										className: "lc-gran-btn" + (trendMode === "delta" ? " lc-gran-on" : ""),
+										onClick: () => {
+											setTrendMode("delta");
+										},
+										children: t("gran.delta")
+									})]
+								})]
+							})
+						]
+					}), displayRequests.length === 0 ? detailReady ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "lc-empty",
+						children: t("trend.empty")
+					}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DetailNote, {
+						state: source.detailState === "failed" ? "failed" : "loading",
+						onRetry: source.retryDetail
+					}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TrendChart, {
+						requests: displayRequests,
+						markers,
+						selectedSeq: pinnedReq ? pinnedReq.seq : null,
+						hoveredSeq,
+						activeTurn,
+						granularity,
+						mode: trendMode,
+						focusTurn,
+						hoverCat: trendHoverCat,
+						focusCat,
+						adaptive,
+						onSelect: setSelectedSeq,
+						onHover: setHoveredSeq,
+						onHoverTurn: setHoverTurn,
+						onPickTurn: (turn) => {
+							setGranularity("turn");
+							setFocusTurn(turn);
+						},
+						onFocusTurnHandled: () => {
+							setFocusTurn(null);
+						}
+					}, sessionId), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RequestDetail, {
+						request: activeReq,
+						prev: trendMode === "delta" && activeIdx >= 0 ? activeIdx > 0 ? displayRequests[activeIdx - 1] : null : void 0,
+						/* v8 ignore next 1 -- RequestDetail renders only when
+						displayRequests.length > 0, which forces activeReq
+						non-null via the activeIdx fallback above. */
+						marker: activeReq !== null ? markerOf(activeReq) : void 0,
+						brief,
+						convOf,
+						onLocate: locateNode,
+						hoverKey: trendHoverCat
+					})] })]
+				});
+				const browserCard = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContextBrowser, {
+					data,
+					headers,
+					convNodes,
+					fetchContent,
+					fetchHeader,
+					previewSeq: hoveredSeq,
+					pinSeq: pinnedReq !== null ? pinnedReq.seq : null,
+					hoverKey: hoverCat,
+					onHoverKey: setHoverCat,
+					onOpenCat: setFocusCat,
+					nodeFocus,
+					onNodeFocusHandled: clearNodeFocus,
+					loadImage,
+					detailState: source.detailState,
+					onDetailRetry: source.retryDetail
+				});
 				return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 					className: "lc-root",
 					ref: rootRef,
@@ -8268,7 +8492,7 @@ window.__ModuleLoader__.load({
 						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 							className: "lc-cols lc-head",
 							children: [
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(StatsContext, {
+								inSidebar ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StatsContext, {
 									counts: data.counts ?? countsOfRecords(requests, events),
 									toolCalls: data.toolCalls,
 									images: data.images,
@@ -8280,141 +8504,31 @@ window.__ModuleLoader__.load({
 									timing: data.timing ?? null,
 									locale: activeLocale
 								}),
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(PluginInfo, {})
+								inSidebar ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PluginInfo, {})
 							]
 						}),
-						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-							className: "lc-cols",
-							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: "lc-cols lc-cols-main",
+							children: inSidebar ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+									className: "lc-col",
+									children: compositionCard
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+									className: "lc-col lc-col-browser",
+									children: browserCard
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+									className: "lc-col",
+									children: trendCard
+								})
+							] }) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 								className: "lc-col",
-								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(CurrentComposition, {
-									head,
-									subtitle,
-									hoverKey: hoverCat,
-									onHoverKey: setHoverCat
-								}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-									className: "lc-card",
-									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-										className: "lc-card-title",
-										children: [
-											/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-												className: "lc-card-title-text",
-												children: t("trend.title")
-											}),
-											/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-												className: "lc-gran lc-trend-adaptive",
-												role: "group",
-												title: t("trend.adaptiveHint"),
-												children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-													type: "button",
-													className: "lc-gran-btn" + (adaptive ? " lc-gran-on" : ""),
-													onClick: () => {
-														setAdaptive((on) => !on);
-													},
-													children: t("trend.adaptive")
-												})
-											}),
-											focusCat !== null ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-												className: "lc-card-sub",
-												children: t("trend.focus", { cat: kit.catLabel(focusCat) })
-											}) : null,
-											/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-												className: "lc-trend-ctl",
-												children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-													className: "lc-gran",
-													children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-														className: "lc-gran-btn" + (granularity === "step" ? " lc-gran-on" : ""),
-														onClick: () => {
-															setGranularity("step");
-														},
-														children: t("gran.step")
-													}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-														className: "lc-gran-btn" + (granularity === "turn" ? " lc-gran-on" : ""),
-														onClick: () => {
-															setGranularity("turn");
-														},
-														children: t("gran.turn")
-													})]
-												}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-													className: "lc-gran",
-													title: t("gran.modeHint"),
-													children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-														className: "lc-gran-btn" + (trendMode === "total" ? " lc-gran-on" : ""),
-														onClick: () => {
-															setTrendMode("total");
-														},
-														children: t("gran.total")
-													}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-														className: "lc-gran-btn" + (trendMode === "delta" ? " lc-gran-on" : ""),
-														onClick: () => {
-															setTrendMode("delta");
-														},
-														children: t("gran.delta")
-													})]
-												})]
-											})
-										]
-									}), displayRequests.length === 0 ? detailReady ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-										className: "lc-empty",
-										children: t("trend.empty")
-									}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DetailNote, {
-										state: source.detailState === "failed" ? "failed" : "loading",
-										onRetry: source.retryDetail
-									}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TrendChart, {
-										requests: displayRequests,
-										markers,
-										selectedSeq: pinnedReq ? pinnedReq.seq : null,
-										hoveredSeq,
-										activeTurn,
-										granularity,
-										mode: trendMode,
-										focusTurn,
-										hoverCat: trendHoverCat,
-										focusCat,
-										adaptive,
-										onSelect: setSelectedSeq,
-										onHover: setHoveredSeq,
-										onHoverTurn: setHoverTurn,
-										onPickTurn: (turn) => {
-											setGranularity("turn");
-											setFocusTurn(turn);
-										},
-										onFocusTurnHandled: () => {
-											setFocusTurn(null);
-										}
-									}, sessionId), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RequestDetail, {
-										request: activeReq,
-										prev: trendMode === "delta" && activeIdx >= 0 ? activeIdx > 0 ? displayRequests[activeIdx - 1] : null : void 0,
-										/* v8 ignore next 1 -- RequestDetail renders only when
-										displayRequests.length > 0, which forces activeReq
-										non-null via the activeIdx fallback above. */
-										marker: activeReq !== null ? markerOf(activeReq) : void 0,
-										brief,
-										convOf,
-										onLocate: locateNode,
-										hoverKey: trendHoverCat
-									})] })]
-								})]
+								children: [compositionCard, trendCard]
 							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 								className: "lc-col lc-col-browser",
-								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContextBrowser, {
-									data,
-									headers,
-									convNodes,
-									fetchContent,
-									fetchHeader,
-									previewSeq: hoveredSeq,
-									pinSeq: pinnedReq !== null ? pinnedReq.seq : null,
-									hoverKey: hoverCat,
-									onHoverKey: setHoverCat,
-									onOpenCat: setFocusCat,
-									nodeFocus,
-									onNodeFocusHandled: clearNodeFocus,
-									loadImage,
-									detailState: source.detailState,
-									onDetailRetry: source.retryDetail
-								})
-							})]
+								children: browserCard
+							})] })
 						}),
 						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 							className: "lc-cols",
@@ -8560,6 +8674,99 @@ window.__ModuleLoader__.load({
 			};
 		}
 		//#endregion
+		//#region src/client/sidebar.ts
+		/**
+		* The right Sidebar's Context tab (dsh 0.1.5-alpha.1+).
+		*
+		* The tab reuses the Context conversation-view component VERBATIM: the
+		* `sidebar.right.pane.tab` seat is session-scoped and delivers the same
+		* framework standard kit (`sessionId`, `useProjection`, `useChat`, the locale
+		* `t` seat) the `conversation.view` seat does, so the panel and the tab are
+		* one component with one data path. The tab type contributes a guide entry, so
+		* the sidebar's guide page offers "Context" and picking it opens the panel —
+		* the product's own path, exactly as the shipped Files type does.
+		*
+		* OPTIONAL BY CONTRACT. `ctx.sidebarRightTabs` and the seat exist only from
+		* dsh 0.1.5-alpha.1; the registration therefore rides a DEFERRED inject (the
+		* plugin's hard injects stay `slots` + `locale`), so on every older supported
+		* line the callback never fires, the plugin fiber never pends, and nothing is
+		* registered. The registry is re-proved structurally and the whole
+		* registration is guarded: a foreign or hostile registry (a throwing
+		* `register`, a taken id/kind) leaves the sidebar without the tab instead of
+		* taking the browser down.
+		*
+		* @module dsh-context/client/sidebar
+		*/
+		/** The tab type's identity in the sidebar's tab system (also its body-seat key). */
+		const SIDEBAR_CONTEXT_ID = "dsh-context";
+		/**
+		* The kind `openTab` names. Namespaced rather than the bare `context`: the
+		* registry THROWS when a kind collides with another registration in a
+		* non-coexisting band, and a foreign plugin may well own `context`.
+		*/
+		const SIDEBAR_CONTEXT_KIND = "dsh-context";
+		/** The guide box's position: after the shipped Files entry (order 10). */
+		const GUIDE_ORDER = 20;
+		/**
+		* The guide box's glyph, read defensively: the icon is OPTIONAL in the entry,
+		* and a primitives module that does not serve it — or whose namespace THROWS
+		* on the read (an interop/mock shape does exactly that) — must cost the glyph,
+		* never the whole tab.
+		* @returns the icon component, or undefined to register the tab without one.
+		*/
+		function guideIcon() {
+			try {
+				return _deepseek_ai_dsh_client_ui_primitives.IconContextInjectionOutline16;
+			} catch {
+				return;
+			}
+		}
+		/**
+		* Register the Context tab type and its body on the right Sidebar, if — and
+		* only if — this harness serves the sidebar tab registry.
+		* @param ctx - client root context carrying `slots` and the locale service.
+		* @param view - the Context view component factory result (the same one the
+		*   conversation tab mounts).
+		* @param t - the plugin-namespace translate; the label thunks read the active
+		*   locale at call time, so a language switch relabels the guide entry.
+		* @param ns - the plugin's locale namespace, put on the body registration so
+		*   the framework synthesizes the `t` seat for the panel too.
+		*/
+		function watchSidebarContextTab(ctx, view, t, ns) {
+			ctx.inject(["sidebarRightTabs"], (raw) => {
+				const injected = raw;
+				try {
+					const tabs = injected.sidebarRightTabs;
+					if (tabs === void 0 || typeof tabs.register !== "function") return;
+					const disposeType = tabs.register({
+						id: SIDEBAR_CONTEXT_ID,
+						kind: SIDEBAR_CONTEXT_KIND,
+						title: () => t("tab"),
+						guide: [{
+							order: GUIDE_ORDER,
+							title: () => t("tab"),
+							description: () => t("sidebar.guideDescription"),
+							icon: guideIcon()
+						}]
+					});
+					const disposeBody = injected.slots.inject("sidebar.right.pane.tab", () => injected.slots.register({
+						name: "sidebar.right.pane.tab",
+						key: SIDEBAR_CONTEXT_ID,
+						locale: ns
+					}, (props) => view({
+						...props,
+						host: "sidebar"
+					})));
+					return () => {
+						disposeType();
+						if (typeof disposeBody === "function") disposeBody();
+					};
+				} catch {
+					return;
+				}
+			});
+		}
+		//#endregion
 		//#region src/client/viewkit.ts
 		function makeViewKit(t) {
 			const { eventLabel, eventAt } = makeEventText(t);
@@ -8576,7 +8783,7 @@ window.__ModuleLoader__.load({
 		}
 		//#endregion
 		//#region \0dsh-global-css:/home/runner/work/dsh-context/dsh-context/src/client/styles/base.css.mjs
-		const css$13 = ".lc-root{box-sizing:border-box;height:100%;color:var(--dsw-alias-label-primary);padding:16px 20px 32px;font-size:13px;overflow-y:auto}.lc-card{background:var(--dsw-alias-bg-layer-1);border:1px solid var(--dsw-alias-border-l2);border-radius:10px;margin-bottom:14px;padding:14px 16px}.lc-root .lc-card{margin-bottom:7px;padding:7px 8px;container:lc-card/inline-size}.lc-root .lc-cols{gap:7px;margin-bottom:7px}.lc-card-title{flex-wrap:wrap;align-items:baseline;gap:8px;margin-bottom:10px;font-weight:600;display:flex}.lc-card-title-text{white-space:nowrap;flex:none}.lc-gran,.lc-kinds{background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l2);border-radius:6px;gap:2px;margin-left:auto;padding:1px;display:flex}.lc-trend-ctl{align-items:center;gap:6px;margin-left:auto;display:flex}.lc-trend-ctl .lc-gran{margin-left:0}.lc-trend-adaptive{flex:none;margin-left:0}.lc-gran-btn{color:var(--dsw-alias-label-secondary);cursor:pointer;transition:color var(--ds-transition-duration,.2s) var(--ds-ease-in-out,ease-in-out);background:0 0;border:0;border-radius:5px;padding:3px 8px;font-family:inherit;font-size:11px;line-height:1}.lc-gran-btn:hover{color:var(--dsw-alias-label-primary)}.lc-gran-on,.lc-gran-on:hover{background:var(--dsw-alias-button-primary-fill);color:var(--dsw-alias-label-primary-foreground)}.lc-tip{z-index:6;background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l1);width:max-content;color:var(--dsw-alias-label-primary);box-shadow:var(--dsw-shadow-lv3,0 2px 8px #0000002e);pointer-events:none;opacity:0;transition:opacity var(--ds-transition-duration,.2s) var(--ds-ease-in-out,ease-in-out);border-radius:6px;padding:6px 10px;font-size:12px;position:absolute}.lc-events,.lc-fa-list{flex-direction:column;gap:2px;height:320px;display:flex;overflow-y:auto}.lc-cols{flex-wrap:wrap;gap:14px;margin-bottom:14px;display:flex}.lc-col{flex:1;min-width:min(280px,100%)}.lc-cols>.lc-card,.lc-col>.lc-card:last-child{margin-bottom:0}.lc-col-browser{flex-direction:column;display:flex}.lc-col-browser>.lc-card{flex:1}.lc-head{container:lc-head-row/inline-size}.lc-head>.lc-card{flex:1 1 0;min-width:0}@container lc-head-row (width<=1045px){.lc-head>.lc-card{flex-basis:40%}}@container lc-head-row (width<=480px){.lc-head>.lc-card{flex-basis:100%}}.lc-head>.lc-card:first-child{flex-direction:column;display:flex}.lc-head>.lc-card:first-child .lc-stats{flex:1;align-content:stretch}.lc-head>.lc-card:first-child .lc-stat{justify-content:center}.lc-empty{color:var(--dsw-alias-label-secondary);text-align:center;padding:18px 0}.lc-error{flex-direction:column;align-items:center;gap:8px;padding:40px 16px;display:flex}.lc-error-msg{font-family:var(--ds-font-family-code,ui-monospace, SFMono-Regular, Menlo, monospace);color:var(--dsw-alias-state-error-primary);background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l1);overflow-wrap:anywhere;border-radius:6px;max-width:100%;padding:4px 8px;font-size:12px}.lc-error-retry{border:1px solid var(--dsw-alias-border-l2);background:var(--dsw-alias-bg-layer-2);color:var(--dsw-alias-label-primary);font:inherit;cursor:pointer;transition:border-color var(--ds-transition-duration,.2s) var(--ds-ease-in-out,ease-in-out);border-radius:6px;padding:4px 14px;font-size:12px}.lc-error-retry:hover{border-color:var(--dsw-alias-label-primary)}.lc-foot{color:var(--dsw-alias-label-secondary);margin-top:4px;font-size:12px}[data-conversation-scroll]:has(.lc-root)>[data-composer-seat]:not(:has([data-approval-key],[data-question-key],[data-plan-review-key])),[data-conversation-scroll]:has(.lc-root,.lc-modal-backdrop)~[data-width-handle]{display:none}";
+		const css$13 = ".lc-root{box-sizing:border-box;height:100%;color:var(--dsw-alias-label-primary);padding:16px 20px 32px;font-size:13px;overflow-y:auto}[data-sidebar-right-open] .lc-root,[data-sidebar-right-float-host] .lc-root{height:auto;padding:0;overflow:visible}.lc-card{background:var(--dsw-alias-bg-layer-1);border:1px solid var(--dsw-alias-border-l2);border-radius:10px;margin-bottom:14px;padding:14px 16px}.lc-root .lc-card{margin-bottom:7px;padding:7px 8px;container:lc-card/inline-size}.lc-root .lc-cols{gap:7px;margin-bottom:7px}.lc-card-title{flex-wrap:wrap;align-items:baseline;gap:8px;margin-bottom:10px;font-weight:600;display:flex}.lc-card-title-text{white-space:nowrap;flex:none}.lc-gran,.lc-kinds{background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l2);border-radius:6px;gap:2px;margin-left:auto;padding:1px;display:flex}.lc-trend-ctl{align-items:center;gap:6px;margin-left:auto;display:flex}.lc-trend-ctl .lc-gran{margin-left:0}.lc-trend-adaptive{flex:none;margin-left:0}.lc-gran-btn{color:var(--dsw-alias-label-secondary);cursor:pointer;transition:color var(--ds-transition-duration,.2s) var(--ds-ease-in-out,ease-in-out);background:0 0;border:0;border-radius:5px;padding:3px 8px;font-family:inherit;font-size:11px;line-height:1}.lc-gran-btn:hover{color:var(--dsw-alias-label-primary)}.lc-gran-on,.lc-gran-on:hover{background:var(--dsw-alias-button-primary-fill);color:var(--dsw-alias-label-primary-foreground)}.lc-tip{z-index:6;background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l1);width:max-content;color:var(--dsw-alias-label-primary);box-shadow:var(--dsw-shadow-lv3,0 2px 8px #0000002e);pointer-events:none;opacity:0;transition:opacity var(--ds-transition-duration,.2s) var(--ds-ease-in-out,ease-in-out);border-radius:6px;padding:6px 10px;font-size:12px;position:absolute}.lc-events,.lc-fa-list{flex-direction:column;gap:2px;height:320px;display:flex;overflow-y:auto}.lc-cols{flex-wrap:wrap;gap:14px;margin-bottom:14px;display:flex}.lc-col{flex:1;min-width:min(360px,100%)}.lc-cols>.lc-card,.lc-col>.lc-card:last-child{margin-bottom:0}.lc-col-browser{flex-direction:column;display:flex}.lc-col-browser>.lc-card{flex:1}.lc-head{container:lc-head-row/inline-size}.lc-head>.lc-card{flex:1 1 0;min-width:0}@container lc-head-row (width<=1045px){.lc-head>.lc-card{flex-basis:40%}}@container lc-head-row (width<=480px){.lc-head>.lc-card{flex-basis:100%}}.lc-head>.lc-card:first-child{flex-direction:column;display:flex}.lc-head>.lc-card:first-child .lc-stats{flex:1;align-content:stretch}.lc-head>.lc-card:first-child .lc-stat{justify-content:center}.lc-empty{color:var(--dsw-alias-label-secondary);text-align:center;padding:18px 0}.lc-error{flex-direction:column;align-items:center;gap:8px;padding:40px 16px;display:flex}.lc-error-msg{font-family:var(--ds-font-family-code,ui-monospace, SFMono-Regular, Menlo, monospace);color:var(--dsw-alias-state-error-primary);background:var(--dsw-alias-bg-layer-2);border:1px solid var(--dsw-alias-border-l1);overflow-wrap:anywhere;border-radius:6px;max-width:100%;padding:4px 8px;font-size:12px}.lc-error-retry{border:1px solid var(--dsw-alias-border-l2);background:var(--dsw-alias-bg-layer-2);color:var(--dsw-alias-label-primary);font:inherit;cursor:pointer;transition:border-color var(--ds-transition-duration,.2s) var(--ds-ease-in-out,ease-in-out);border-radius:6px;padding:4px 14px;font-size:12px}.lc-error-retry:hover{border-color:var(--dsw-alias-label-primary)}.lc-foot{color:var(--dsw-alias-label-secondary);margin-top:4px;font-size:12px}[data-conversation-scroll]:has(.lc-root)>[data-composer-seat]:not(:has([data-approval-key],[data-question-key],[data-plan-review-key])),[data-conversation-scroll]:has(.lc-root,.lc-modal-backdrop)~[data-width-handle]{display:none}";
 		const tagId$13 = "dsh-context/base.css";
 		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId$13) + "]") === null) {
 			const tag = document.createElement("style");
@@ -8775,6 +8982,7 @@ window.__ModuleLoader__.load({
 					label: () => t("tab")
 				}, (props) => (0, react.createElement)(ContextView, props));
 			});
+			watchSidebarContextTab(ctx, ContextView, t, NS);
 			const ContextJump = makeContextJumpButton(kit);
 			ctx.slots.inject("conversation.chat.assistant-actions", () => {
 				return ctx.slots.register({

package/lib/index.d.ts

@@ -72,6 +72,27 @@ interface TimelineState {
   surface: SurfaceNode[];
   sums: Record<Category, number>;
   systemTokens: number;
+  /**
+   * The live system-prompt nodes, oldest first — a V3 log's `system/message`
+   * surface nodes, or the single entry a V0/V2 `request/header.header.system`
+   * envelope defines. `systemTokens` is the LAST entry with tokens > 0 (the
+   * harness's own "last nonempty surviving system" rule), so an empty dormant
+   * node keeps its position without clearing the prompt. Bounded by
+   * SYSTEM_NODES_MAX. ABSENT on rows folded before this field existed — the
+   * wire then serves no `systems` and the client falls back to the header
+   * epoch's own envelope figure.
+   */
+  systems?: SystemPromptNode[];
+  /**
+   * Whether `systems` was built from the V0/V2 request ENVELOPE
+   * (`header.system`) rather than from V3 `system/message` events. Only then
+   * may a system-less header CLEAR the list: its canonical V0 meaning is
+   * "this request has no system prompt", while a V3 header never carries one
+   * (its prompt lives in the message history). Absent = log-sourced, and
+   * never materialized as an `undefined`-valued property (plain-JSON
+   * precondition — see the note above `model`).
+   */
+  systemsFromHeader?: true;
   toolsTokens: number;
   /**
    * The projection-cache precondition is plain JSON: a property whose value
@@ -221,6 +242,19 @@ declare module '@deepseek-ai/dsh-session-projection/types' {
   }
 }
 type Category = 'user' | 'inject' | 'assistant' | 'tool';
+/**
+ * One live system-prompt node (Snapshot.systems) — the harness models the
+ * system prompt as a surface node, so its TEXT is fetched on demand from the
+ * event at `seq`: a V3 `system/message` event, or the V0/V2 `request/header`
+ * whose envelope carried `header.system`. `tokens` is the node's heuristic
+ * price (0 for a dormant empty node, which the harness reads as "no system
+ * prompt"); the effective figure is the LAST node with `tokens > 0`.
+ */
+interface SystemPromptNode {
+  seq: number;
+  time: number;
+  tokens: number;
+}
 /**
  * The stats board's count figures, precomputed host-side over the RETAINED
  * request/event records (the same set the detail payload serves). Carried by
@@ -316,6 +350,13 @@ interface Snapshot {
    * one — clients treat absence as an empty timing card).
    */
   timing?: TimingTotals;
+  /**
+   * The live system-prompt nodes, oldest first — the browser's per-step source
+   * for the System section. Absent when the log carried no system prompt, and
+   * on older plugin builds (the client then falls back to the header epoch's
+   * own `systemTokens`, the pre-V3 shape).
+   */
+  systems?: SystemPromptNode[];
   /**
    * The served live surface: the newest `maxNodes` tail PLUS every live inject node older than the tail (injections land first and are
    * few,
@@ -450,9 +491,13 @@ interface ToolTimingTotals {
 }
 /**
  * Whole-session timing totals, host-folded from the durable `step/start` /
- `step/end` / `assistant/chunk` / `tool/call` / `tool/result` lifecycle
- * (running totals over the COMPLETE session log — the same never-trimmed
- * framing as `cost`). Durations are wall-clock milliseconds: `wallMs` sums
+ * `step/end` / `tool/call` / `tool/result` lifecycle plus the model call's
+ * first token (running totals over the COMPLETE session log — the same
+ * never-trimmed framing as `cost`). The first token comes from a V0
+ * `assistant/chunk` delta or from the call's own embedded stream
+ * (`assistant/message.data.stream` / `assistant/attempt.data.stream`, the
+ * V2+ settlement) — whichever the log carries, matching the harness's own
+ * session-stats fold. Durations are wall-clock milliseconds: `wallMs` sums
  * whole steps, `ttftMs` the step-start → first-token slice (the model wait)
  * and `genMs` the first-token → assistant-message slice (the generation) —
  * both only over calls whose stream carried a token delta, `toolsMs` the sum

package/lib/index.js

@@ -308,6 +308,30 @@ function estimateSystemTokens(text) {
 	if (typeof text !== "string" || text.length === 0) return 0;
 	return Math.ceil(text.length / CHARS_PER_TOKEN$1) + ROLE_OVERHEAD$1;
 }
+/**
+* Price a `system/message` payload's content exactly like the harness's
+* token-meter (`estimateSystemMessage`): text density over EVERY text block
+* plus role framing, with no per-block overhead — an adapter serializes the
+* prompt as plain text, so a text block costs its characters alone. Any other
+* block (or a hostile element) falls back to its JSON length. 0 for empty
+* content, which the harness reads as "no system prompt".
+*/
+function estimateSystemContent(blocks) {
+	if (!Array.isArray(blocks) || blocks.length === 0) return 0;
+	let characters = 0;
+	for (const block of blocks) {
+		const text = block !== null && typeof block === "object" && block.type === "text" ? block.text : void 0;
+		if (typeof text === "string") {
+			characters += text.length;
+			continue;
+		}
+		try {
+			const json = JSON.stringify(block);
+			if (typeof json === "string") characters += json.length;
+		} catch {}
+	}
+	return Math.ceil(characters / CHARS_PER_TOKEN$1) + ROLE_OVERHEAD$1;
+}
 //#endregion
 //#region src/shared/imageTokens.ts
 /**
@@ -565,6 +589,111 @@ function isInjection(source) {
 	return source !== null && source !== void 0 && (typeof source.kind === "string" && source.kind !== "" && source.kind !== "user" || typeof source.form === "string");
 }
 //#endregion
+//#region src/host/logShapes.ts
+/**
+* Shape-driven readers over the durable session-event vocabulary — the ONE
+* place the plugin reconciles the two supported log generations:
+*
+*   - V0 (dsh 0.1.2-rc.1): `request/header.header.system`, `assistant/chunk`
+*     stream events, `SurfaceOp { start, end }`, `tool/code-dispatch`.
+*   - V3 (dsh 0.1.5-alpha.1+): `system/message` surface nodes,
+*     `assistant/message.data.stream` / `assistant/attempt.data.stream`,
+*     `SurfaceOp { startSeq, endSeq }`, `tool/ptc-dispatch`.
+*
+* The fold reads SHAPES, never a detected harness version: a session log is
+* written by exactly one generation, the two spellings are mutually
+* exclusive within it, and a deployment's version probe can be wrong (a
+* healed profile mirror may name a different release than the running
+* harness). Every reader is total over untrusted input — a malformed record
+* yields "nothing here", never a throw (the projection registry drives the
+* fold without an error boundary; one throw stalls the unit's push feed and
+* the browser waits on "loading" forever).
+*
+* @module dsh-context/host/log-shapes
+*/
+/**
+* Whether one raw stream chunk carries a token delta — the first-token marker
+* both generations share. Mirrors dsh-llm's `isTokenDelta` (a non-empty text
+* or reasoning fragment, or any Tool-call delta carrying arguments or a name);
+* a malformed chunk is simply not a token.
+*/
+function isTokenChunk(chunk) {
+	if (chunk === null || typeof chunk !== "object") return false;
+	const c = chunk;
+	switch (c.type) {
+		case "text-delta":
+		case "reasoning-delta": return typeof c.text === "string" && c.text !== "";
+		case "tool-call-delta": return typeof c.argumentsDelta === "string" && c.argumentsDelta !== "" || c.name !== void 0;
+		default: return false;
+	}
+}
+/**
+* The first token's instant inside one PACKED delta run (`text-chunks` /
+* `reasoning-chunks` / `tool-call-chunks`): the run's base time plus the
+* accumulated inter-member deltas, taken at the first qualifying member —
+* a name-bearing Tool-call run starts at its first member. Mirrors dsh-llm's
+* `runFirstTokenTime`; a non-finite base or delta yields undefined rather
+* than a NaN instant.
+*/
+function runFirstTokenTime(record) {
+	const time0 = record.time0;
+	if (typeof time0 !== "number" || !Number.isFinite(time0)) return void 0;
+	if (record.type === "tool-call-chunks" && record.name !== void 0) return time0;
+	const fragments = record.type === "tool-call-chunks" ? record.args : record.texts;
+	if (!Array.isArray(fragments)) return void 0;
+	const dt = Array.isArray(record.dt) ? record.dt : [];
+	let time = time0;
+	for (const [index, fragment] of fragments.entries()) {
+		if (index > 0) {
+			const step = dt[index - 1];
+			if (typeof step !== "number" || !Number.isFinite(step)) return void 0;
+			time += step;
+		}
+		if (typeof fragment === "string" && fragment !== "") return time;
+	}
+}
+/**
+* The first token's instant inside an embedded assistant stream
+* (`assistant/message.data.stream`, `assistant/attempt.data.stream` — the V2+
+* settlement that replaced the V0 `assistant/chunk` events), or undefined
+* when the stream carries no token. Mirrors dsh-llm's
+* `assistantStreamFirstTokenTime` over the compact record union.
+*/
+function firstTokenTimeOfStream(stream) {
+	if (!Array.isArray(stream)) return void 0;
+	for (const record of stream) {
+		if (record === null || typeof record !== "object") continue;
+		const r = record;
+		if (r.type === "chunk") {
+			const time = r.time;
+			if (typeof time === "number" && Number.isFinite(time) && isTokenChunk(r.chunk)) return time;
+			continue;
+		}
+		const time = runFirstTokenTime(r);
+		if (time !== void 0) return time;
+	}
+}
+/**
+* The inclusive surface range a replacement op covers, or null for `append`
+* and for any unrecognized/hostile op (which the fold treats as an append).
+* Reads BOTH endpoint spellings: V3's `startSeq`/`endSeq` first, then V0's
+* `start`/`end` — each accepted only as a finite number, so a hostile op
+* with one good and one malformed endpoint degrades to append.
+*/
+function replaceRangeOf(surfaceOp) {
+	if (surfaceOp === null || typeof surfaceOp !== "object") return null;
+	const op = surfaceOp;
+	if (op.op !== "replace") return null;
+	const start = typeof op.startSeq === "number" ? op.startSeq : op.start;
+	const end = typeof op.endSeq === "number" ? op.endSeq : op.end;
+	if (typeof start !== "number" || !Number.isFinite(start)) return null;
+	if (typeof end !== "number" || !Number.isFinite(end)) return null;
+	return {
+		start,
+		end
+	};
+}
+//#endregion
 //#region src/shared/fileOps.ts
 /** Parse a call's raw JSON arguments; non-string/malformed/non-record inputs yield null. */
 function parseCallArgs(raw) {
@@ -873,6 +1002,24 @@ function bumpDetailRev(st) {
 	st.detailRev = (st.detailRev ?? 0) + 1;
 }
 /**
+* Bound on the live system-prompt nodes (TimelineState.systems). The
+* effective figure is the LAST nonempty node, so dropping the oldest can only
+* under-report a pathological log whose newest SYSTEM_NODES_MAX nodes are all
+* empty while an older one still carried text.
+*/
+const SYSTEM_NODES_MAX = 8;
+/** The effective system-prompt price: the last nonempty node, else 0 (the harness's own rule). */
+function systemTokensOf(systems) {
+	for (let i = systems.length - 1; i >= 0; i--) if (systems[i].tokens > 0) return systems[i].tokens;
+	return 0;
+}
+/** Append one system-prompt node, bounding the list (see SYSTEM_NODES_MAX). */
+function pushSystem(st, node) {
+	const systems = [...st.systems ?? [], node];
+	st.systems = systems.length > SYSTEM_NODES_MAX ? systems.slice(-8) : systems;
+	st.systemTokens = systemTokensOf(st.systems);
+}
+/**
 * Bound on the buffered nested Code-Mode ops (TimelineState.pendingCodeOps)
 * — a hostile log that dispatches without settling the parent run_code
 * cannot grow the persisted state past this.
@@ -919,6 +1066,35 @@ function archiveRemoved(st, removed, goneSeq) {
 	});
 }
 /**
+* Remove every live surface node whose seq the replacement claims, keeping the
+* per-category sums equal to the surviving nodes and archiving the removals.
+* Removal follows the SEQ list, not the declared range: pruned replacement
+* nodes keep their own seqs beyond the range end, so a range-based removal
+* would leave them behind and overcount. Returns the removed nodes.
+*/
+function removeSurfaceSeqs(st, claimed, goneSeq) {
+	if (claimed.size === 0) return [];
+	const kept = [];
+	const removed = [];
+	for (const n of st.surface) if (claimed.has(n.seq)) {
+		st.sums[n.cat] -= n.tokens;
+		removed.push(n);
+	} else kept.push(n);
+	archiveRemoved(st, removed, goneSeq);
+	st.surface = kept;
+	return removed;
+}
+/**
+* The message nested under an event payload's `message` field
+* (`system/message`, `assistant/message`, `tool/result`) — read structurally
+* rather than through `deriveEventMessage`, whose 0.1.2-rc.1 generation knows
+* nothing of the V3 `system/message` variant. A malformed payload reads null.
+*/
+function messageOf(data) {
+	const message = data?.message;
+	return message !== null && typeof message === "object" ? message : null;
+}
+/**
 * The first full text block, recursing through nested content blocks (a tool
 * result wraps its text in a `tool-result` block). Unlike `firstText` this
 * must NOT truncate/normalize: the skill name is matched off the raw
@@ -1002,18 +1178,10 @@ function applySurface(st, ev, type, data, message) {
 	const shadowEventSeq = st.pendingShadowEventSeq;
 	delete st.pendingShadowedSeqs;
 	delete st.pendingShadowEventSeq;
-	const op = ev.surfaceOp;
-	if (op !== null && typeof op === "object" && op.op === "replace") {
+	const op = replaceRangeOf(ev.surfaceOp);
+	if (op !== null) {
 		if (Array.isArray(shadowedSeqs) && shadowedSeqs.length > 0) {
-			const shadowed = new Set(shadowedSeqs);
-			const kept = [];
-			const removed = [];
-			for (const n of st.surface) if (shadowed.has(n.seq)) {
-				st.sums[n.cat] -= n.tokens;
-				removed.push(n);
-			} else kept.push(n);
-			archiveRemoved(st, removed, ev.seq);
-			st.surface = kept;
+			const removed = removeSurfaceSeqs(st, new Set(shadowedSeqs), ev.seq);
 			st.sums[cat] += node.tokens;
 			st.surface.push(node);
 			if (shadowEventSeq !== void 0) {
@@ -1138,21 +1306,6 @@ function durOf(from, to) {
 	return Math.max(0, to - from);
 }
 /**
-* Whether a stream chunk carries a non-empty token delta — the first-token
-* marker the TTFT fold waits for (the same rule as the harness's own
-* session-stats fold). Shape-guarded: a malformed chunk is just not a token.
-*/
-function isTokenDelta(chunk) {
-	if (chunk === null || typeof chunk !== "object") return false;
-	const c = chunk;
-	switch (c.type) {
-		case "text-delta":
-		case "reasoning-delta": return typeof c.text === "string" && c.text !== "";
-		case "tool-call-delta": return typeof c.argumentsDelta === "string" && c.argumentsDelta !== "" || c.name !== void 0;
-		default: return false;
-	}
-}
-/**
 * The fold's private timing accumulator: created on first use, and CLONED on
 * every later ensure() (see `applyTimeline`) — the object left in the
 * persisted previous state is never written into in place.
@@ -1225,7 +1378,20 @@ function applyTimeline(state, event, bounds) {
 				const tools = Array.isArray(header.tools) ? header.tools : [];
 				const s = ensure();
 				s.toolsTokens = estimateToolsTotal(tools);
-				s.systemTokens = estimateSystemTokens(header.system);
+				const systemText = header.system;
+				if (typeof systemText === "string" && systemText !== "") {
+					s.systems = [{
+						seq: event.seq,
+						time: event.time,
+						tokens: estimateSystemTokens(systemText)
+					}];
+					s.systemsFromHeader = true;
+					s.systemTokens = systemTokensOf(s.systems);
+				} else if (s.systemsFromHeader === true) {
+					s.systems = [];
+					delete s.systemsFromHeader;
+					s.systemTokens = 0;
+				}
 				if (header.config && typeof header.config.model === "string") s.model = header.config.model;
 				if (header.config && typeof header.config.provider === "string") s.provider = header.config.provider;
 				if ((data?.reason === "change" || data?.reason === "resume") && s.model && s.lastModel && s.model !== s.lastModel) {
@@ -1241,6 +1407,25 @@ function applyTimeline(state, event, bounds) {
 				if (s.model) s.lastModel = s.model;
 				break;
 			}
+			case "system/message": {
+				const s = ensure();
+				delete s.pendingShadowedSeqs;
+				delete s.pendingShadowEventSeq;
+				const op = replaceRangeOf(event.surfaceOp);
+				if (op !== null) {
+					s.systems = (s.systems ?? []).filter((n) => n.seq < op.start || n.seq > op.end);
+					const claimed = /* @__PURE__ */ new Set();
+					for (const n of s.surface) if (n.seq >= op.start && n.seq <= op.end) claimed.add(n.seq);
+					if (removeSurfaceSeqs(s, claimed, event.seq).length > 0) bumpDetailRev(s);
+				}
+				delete s.systemsFromHeader;
+				pushSystem(s, {
+					seq: event.seq,
+					time: event.time,
+					tokens: estimateSystemContent(messageOf(data)?.content)
+				});
+				break;
+			}
 			case "request/context": {
 				const s = ensure();
 				if (data && typeof data.contextWindow === "number") s.contextWindow = data.contextWindow;
@@ -1259,7 +1444,8 @@ function applyTimeline(state, event, bounds) {
 					};
 				}
 				break;
-			case "tool/code-dispatch": {
+			case "tool/code-dispatch":
+			case "tool/ptc-dispatch": {
 				const rootCallId = data?.rootCallId;
 				const name = data?.name;
 				if (typeof rootCallId === "string" && typeof name === "string") {
@@ -1277,7 +1463,7 @@ function applyTimeline(state, event, bounds) {
 			case "assistant/chunk": {
 				const start = state.stepStart;
 				if (start === void 0 || start.firstToken !== void 0) return state;
-				if (!isTokenDelta(data?.chunk)) return state;
+				if (!isTokenChunk(data?.chunk)) return state;
 				const s = ensure();
 				s.stepStart = {
 					time: start.time,
@@ -1285,6 +1471,18 @@ function applyTimeline(state, event, bounds) {
 				};
 				break;
 			}
+			case "assistant/attempt": {
+				const start = state.stepStart;
+				if (start === void 0 || start.firstToken !== void 0) return state;
+				const first = firstTokenTimeOfStream(data?.stream);
+				if (first === void 0) return state;
+				const s = ensure();
+				s.stepStart = {
+					time: start.time,
+					firstToken: first
+				};
+				break;
+			}
 			case "step/start": {
 				const s = ensure();
 				s.stepStart = { time: event.time };
@@ -1410,9 +1608,12 @@ function applyTimeline(state, event, bounds) {
 				const timing = ensureTiming(s);
 				timing.calls += 1;
 				const stepStart = state.stepStart;
-				if (stepStart !== void 0 && stepStart.firstToken !== void 0) {
-					timing.ttftMs += durOf(stepStart.time, stepStart.firstToken);
-					timing.genMs += durOf(stepStart.firstToken, event.time);
+				if (stepStart !== void 0) {
+					const firstToken = stepStart.firstToken ?? firstTokenTimeOfStream(data?.stream);
+					if (firstToken !== void 0) {
+						timing.ttftMs += durOf(stepStart.time, firstToken);
+						timing.genMs += durOf(firstToken, event.time);
+					}
 				}
 				const asstMsg = deriveEventMessage(event);
 				applySurface(s, event, event.type, data, asstMsg);
@@ -1514,6 +1715,7 @@ function headFieldsOf(state) {
 			tools
 		};
 	}
+	if (state.systems !== void 0 && state.systems.length > 0) result.systems = state.systems.map((n) => ({ ...n }));
 	return result;
 }
 /**
@@ -1951,6 +2153,12 @@ const surfaceNodeSchema = z.object({
 	skill: z.string().optional(),
 	calls: z.array(z.string()).optional()
 }).strict();
+/** One live system-prompt node (shared/types.ts SystemPromptNode). */
+const systemPromptNodeSchema = z.object({
+	seq: z.number().int().nonnegative(),
+	time: z.number(),
+	tokens: z.number().int().nonnegative()
+}).strict();
 const requestRecordSchema = z.object({
 	turn: z.number().optional(),
 	step: z.number().optional(),
@@ -2097,6 +2305,7 @@ const contextTimelineSchema = z.object({
 		pro: costFamilySchema.optional()
 	}).strict().optional(),
 	timing: timingTotalsSchema.optional(),
+	systems: z.array(systemPromptNodeSchema).optional(),
 	nodes: z.array(surfaceNodeSchema).optional(),
 	droppedNodes: z.number().int().nonnegative().optional(),
 	archive: z.array(surfaceNodeSchema).optional(),
@@ -2120,6 +2329,8 @@ const timelineStateSchema = z.object({
 		tool: z.number().int().nonnegative()
 	}).strict(),
 	systemTokens: z.number().int().nonnegative(),
+	systems: z.array(systemPromptNodeSchema).optional(),
+	systemsFromHeader: z.literal(true).optional(),
 	toolsTokens: z.number().int().nonnegative(),
 	model: z.string().optional(),
 	provider: z.string().optional(),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-context",
-  "version": "0.46.1",
+  "version": "0.47.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": {
@@ -57,13 +57,16 @@
         "@deepseek-ai/dsh-client-connection",
         "@deepseek-ai/dsh-client-locale",
         "@deepseek-ai/dsh-client-ui-conversation",
-        "@deepseek-ai/dsh-client-ui-settings"
+        "@deepseek-ai/dsh-client-ui-settings",
+        "@deepseek-ai/dsh-client-ui-sidebar-right"
       ],
       "platform": "web"
     },
     "compatibility": {
       "dshReleases": {
-        "0.1.2-rc.1": "compatible"
+        "0.1.2-rc.1": "compatible",
+        "0.1.3-alpha.2": "compatible",
+        "0.1.5-alpha.1": "compatible"
       }
     }
   },