@lament_z/dsh-client-ui-chat-timeline 0.1.0 → 0.1.1

package/lib/client.js

@@ -7,87 +7,12 @@ window.__ModuleLoader__.load({
 		let react = require("react");
 		let react_dom = require("react-dom");
 		let react_jsx_runtime = require("react/jsx-runtime");
-		/** Human node kinds that anchor a tick. */
-		const HUMAN_KINDS = /* @__PURE__ */ new Set(["user", "steering"]);
-		/** Extract concatenated text from a ContentBlock-like list.
-		*  dsh-llm content blocks switch on `type`; assistant blocks use `kind` — accept both. */
-		function blocksText(blocks) {
-			if (!Array.isArray(blocks)) return "";
-			const parts = [];
-			for (const block of blocks) if (block !== null && typeof block === "object") {
-				const record = block;
-				if (record.kind === "text" || record.type === "text") {
-					if (typeof record.text === "string" && record.text.length > 0) parts.push(record.text);
-				}
-			}
-			return parts.join("\n\n");
-		}
-		/** Collapse each paragraph's whitespace and drop empties (ZCode u5e parity). */
-		function collapseParagraphs(text, maxParagraphs) {
-			return text.trim().split(/\n\s*\n/u).map((paragraph) => paragraph.replace(/\s+/gu, " ").trim()).filter(Boolean).slice(0, Math.max(1, maxParagraphs));
-		}
-		/** Truncate to the budget with an ellipsis, never below the floor (ZCode d5e parity). */
-		function truncatePreview(text, maxChars, floor = 8) {
-			const budget = Math.max(floor, maxChars);
-			if (text.length <= budget) return text;
-			return `${text.slice(0, budget - 3).trimEnd()}...`;
-		}
-		/** Build one preview string from raw texts under the shared budget. */
-		function buildPreview(texts, fallback) {
-			const paragraphs = collapseParagraphs(texts.join("\n\n"), 2);
-			if (paragraphs.length === 0) return fallback;
-			return truncatePreview(paragraphs.join("\n"), 220);
-		}
-		/**
-		* Derive the tick directory from the snapshot's ordered node list.
-		* @param nodes - conversation snapshot nodes in seq order.
-		* @param running - whether the session currently has a running turn.
-		* @param labels - localized preview fallbacks.
-		* @returns one item per human input, in order.
-		*/
-		function buildTimelineItems(nodes, running, labels) {
-			const drafts = [];
-			for (const node of nodes) {
-				if (HUMAN_KINDS.has(node.kind)) {
-					const text = blocksText(node.content);
-					drafts.push({
-						key: `n${node.seq}`,
-						seq: node.seq,
-						time: typeof node.time === "number" ? node.time : 0,
-						userTexts: text === "" ? [] : [text],
-						hasUserText: text !== "",
-						assistantTexts: []
-					});
-					continue;
-				}
-				if (node.kind !== "assistant" || drafts.length === 0) continue;
-				const text = blocksText(node.blocks);
-				if (text !== "") drafts[drafts.length - 1].assistantTexts.push(text);
-			}
-			const last = drafts.length - 1;
-			return drafts.map((draft, index) => {
-				const isLive = running && index === last;
-				const assistantTexts = draft.assistantTexts;
-				const assistantKind = assistantTexts.length > 0 ? "text" : isLive ? "running" : "empty";
-				return {
-					key: draft.key,
-					seq: draft.seq,
-					time: draft.time,
-					userPreview: buildPreview(draft.userTexts, labels.userFallback),
-					userFallback: !draft.hasUserText,
-					assistantPreview: buildPreview(assistantTexts, isLive ? labels.assistantRunning : labels.assistantEmpty),
-					assistantKind,
-					running: isLive
-				};
-			});
-		}
-		//#endregion
 		//#region src/client/dom.ts
 		/**
 		* Find the chat scroll container with a candidate chain.
 		* 1. the explicit stable hook `[data-conversation-scroll]`;
 		* 2. the closest scrollable ancestor of the flow column `[data-chat-flow]`;
-		* 3. the largest scrollable element that contains human rows.
+		* 3. the largest scrollable element that contains keyed flow items.
 		*/
 		function findChatContainer(doc) {
 			const direct = doc.querySelector("[data-conversation-scroll]");
@@ -99,7 +24,7 @@ window.__ModuleLoader__.load({
 			let bestHeight = 0;
 			for (const element of Array.from(doc.querySelectorAll("*"))) {
 				if (!isScrollable(element)) continue;
-				if (element.querySelector("[data-chat-flow-kind=\"user\"]") === null) continue;
+				if (element.querySelector("[data-chat-turn]") === null) continue;
 				const height = element.clientHeight;
 				if (height > bestHeight) {
 					best = element;
@@ -122,70 +47,117 @@ window.__ModuleLoader__.load({
 			}
 			return null;
 		}
-		/** Human-turn rows inside the container (falling back to a document-wide query). */
-		function findUserRows(container) {
-			const scope = container ?? document;
-			return Array.from(scope.querySelectorAll("[data-chat-flow-kind=\"user\"]"));
+		/**
+		* The rendered row of `turn` (native anchor attribute `data-chat-turn`),
+		* skipping hidden rows like the native `anchorElement`. Scoped to the chat
+		* container when it is already located (native scopes to its own list), so a
+		* stray second mount cannot hijack the anchor. Null when the turn's events
+		* are not in the loaded window yet.
+		*/
+		function findTurnRow(doc, turn) {
+			if (turn === void 0 || !Number.isSafeInteger(turn) || turn < 0) return null;
+			return (findChatContainer(doc) ?? doc).querySelector(`[data-chat-turn="${turn}"]:not([hidden])`);
+		}
+		/** Native `scrollerOf`: the conversation scrollport owning the row. */
+		function scrollerOfRow(doc, row) {
+			return row.closest("[data-conversation-scroll]") ?? findChatContainer(doc);
+		}
+		/** Row position in scrollport coordinates (native `flowTop`). */
+		function flowTop(row, scroller) {
+			return row.getBoundingClientRect().top - scroller.getBoundingClientRect().top;
 		}
 		/**
-		* The active index: the last human row whose top edge sits above the
-		* container's reading line (40px below the top edge), matching the ZCode
-		* "unit at viewport top" rule; clamps to the last row at scroll bottom.
+		* Native `landOnRow`: instant scroll so the row's top sits 24px below the
+		* scrollport top. Returns false when the scrollport cannot be resolved.
 		*/
-		function computeActiveIndex(container, rows) {
-			if (rows.length === 0) return -1;
-			const top = container.getBoundingClientRect().top + 40;
-			let active = 0;
-			for (let index = 0; index < rows.length; index += 1) if (rows[index].getBoundingClientRect().top <= top) active = index;
-			else break;
-			if (container.scrollHeight - container.scrollTop - container.clientHeight <= 4) return rows.length - 1;
-			return active;
+		function landOnRow(doc, row) {
+			const el = scrollerOfRow(doc, row);
+			if (el === null) return false;
+			el.scrollTop += flowTop(row, el) - 24;
+			return true;
 		}
 		/**
-		* Scroll the given human turn into view. Tries a smooth scroll first; DSH's
-		* windowed conversation list programs scrollTop on scroll events, which can
-		* cancel a smooth animation on the first frame — when nothing has moved after
-		* a short grace period the jump falls back to an instant scroll.
-		* @returns false when the container or row is unavailable.
+		* Native `turnAtLine`: the turn owning the row at a scrollport line.
+		* Hit-tests the line first (elementsFromPoint at the container's horizontal
+		* center) and falls back to one row scan when layout cannot answer (jsdom,
+		* pre-paint). Returns null when no loaded row covers the line.
 		*/
-		function jumpTo(index, behavior) {
-			const container = findChatContainer(document);
-			if (container === null) return false;
-			const row = findUserRows(container)[index];
-			if (row === void 0) return false;
-			const delta = row.getBoundingClientRect().top - container.getBoundingClientRect().top - 12;
-			const target = container.scrollTop + delta;
-			if (behavior === "auto") {
-				container.scrollTo({
-					top: target,
-					behavior: "auto"
-				});
-				return true;
+		function turnAtLine(doc, container, line) {
+			const content = container.getBoundingClientRect();
+			if (typeof doc.elementsFromPoint === "function" && content.width > 0) for (const element of doc.elementsFromPoint(content.left + content.width / 2, line)) {
+				const row = element instanceof HTMLElement ? element.closest("[data-chat-turn]") : null;
+				const turn = Number(row?.dataset.chatTurn);
+				if (row !== null && container.contains(row) && Number.isSafeInteger(turn)) return turn;
 			}
-			const startedAt = container.scrollTop;
-			container.scrollTo({
-				top: target,
-				behavior: "smooth"
-			});
-			window.setTimeout(() => {
-				if (Math.abs(container.scrollTop - startedAt) < 4) container.scrollTo({
-					top: target,
-					behavior: "auto"
-				});
-			}, 700);
-			return true;
+			let found = null;
+			for (const row of Array.from(container.querySelectorAll("[data-chat-turn]"))) {
+				if (row.getBoundingClientRect().top > line) break;
+				const turn = Number(row.dataset.chatTurn);
+				if (Number.isSafeInteger(turn)) found = turn;
+			}
+			return found;
+		}
+		/**
+		* The active index (native `syncActiveTurn`): within 25px of the scroll
+		* bottom the last tick wins; otherwise the reading line sits at
+		* `top + min(96, height * 0.2)` and the active tick is the last one whose
+		* turn does not exceed the turn read at that line. When the line covers no
+		* loaded row, earlier ticks outside the window count as above the viewport
+		* (the window head's predecessor is active, matching 0.1.1 parity).
+		*/
+		function computeActiveIndex(container, doc, turns) {
+			if (turns.length === 0) return -1;
+			if (container.scrollHeight - container.scrollTop - container.clientHeight <= 25) return turns.length - 1;
+			const firstDefined = turns.findIndex((turn) => turn !== void 0);
+			if (firstDefined === -1) return -1;
+			const readTurn = turnAtLine(doc, container, container.getBoundingClientRect().top + Math.min(96, container.clientHeight * .2));
+			let active = -1;
+			if (readTurn !== null) for (let index = 0; index < turns.length; index += 1) {
+				const turn = turns[index];
+				if (turn === void 0 || turn > readTurn) continue;
+				active = index;
+			}
+			if (active !== -1) return active;
+			return firstDefined > 0 ? firstDefined - 1 : 0;
+		}
+		const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
+		/** Landing poll budget after `loadThrough` (native settles via its effects; 5s here). */
+		const LAND_POLL_ATTEMPTS = 20;
+		const LAND_POLL_INTERVAL_MS = 250;
+		/**
+		* 跳到第 index 个刻度的完整落点流程（原生 navigateToTurn 的插件侧等价物）：
+		* 1. 按 `data-chat-turn` 找行并原生落位（瞬时、行顶距视口顶 24px）；
+		* 2. 行未挂载时先 `loadThrough(turn/start 的 seq)` 把事件窗口翻页到位；
+		* 3. 轮询等行渲染后落位。任何一步成功即返回 true。
+		*/
+		async function jumpToTurn(doc, index, turns, seqs, loadThrough) {
+			const turn = turns[index];
+			if (turn === void 0) return false;
+			if (landOnRowByTurn(doc, turn)) return true;
+			const seq = seqs[index];
+			if (seq !== void 0 && loadThrough !== void 0) try {
+				await loadThrough(seq);
+			} catch {}
+			for (let attempt = 0; attempt < LAND_POLL_ATTEMPTS; attempt += 1) {
+				await sleep(LAND_POLL_INTERVAL_MS);
+				if (landOnRowByTurn(doc, turn)) return true;
+			}
+			return false;
+		}
+		function landOnRowByTurn(doc, turn) {
+			const row = findTurnRow(doc, turn);
+			if (row === null) return false;
+			return landOnRow(doc, row);
 		}
 		/** Create the probe against a document (injectable for tests). */
 		function probeChatDom(doc) {
 			return {
 				getContainer: () => findChatContainer(doc),
-				getUserRows: () => findUserRows(findChatContainer(doc)),
-				activeIndex: () => {
+				activeIndex: (turns) => {
 					const container = findChatContainer(doc);
 					if (container === null) return -1;
-					return computeActiveIndex(container, findUserRows(container));
-				},
-				jumpTo: (index, behavior) => jumpTo(index, behavior)
+					return computeActiveIndex(container, doc, turns);
+				}
 			};
 		}
 		//#endregion
@@ -213,7 +185,9 @@ window.__ModuleLoader__.load({
 .dsh-tl-scroll {
   position: absolute;
   left: 12px;
-  top: 50%;
+  /* 原生 TurnNavigator 定位（eGxaPq_frame）：中心 = 内容顶 + (视口高 − 输入框高)/2，
+     即 --turn-rail-band 的中点；centerY 由 rail 按同一公式写入。 */
+  top: var(--dsh-tl-center-y, 50%);
   transform: translateY(-50%);
   width: 36px;
   max-height: calc(100% - 96px);
@@ -272,9 +246,11 @@ window.__ModuleLoader__.load({
   max-width: calc(100vw - 2rem);
   padding: 12px;
   border-radius: 10px;
-  background: Canvas;
-  color: CanvasText;
-  border: 1px solid color-mix(in srgb, CanvasText 15%, transparent);
+  /* 原生 tooltip 配对（dsh-web-frontend _bubble_）：灰底 + 静态白字，
+     主题切换由别名变量跟随；灰底与页面背景天然分层。 */
+  background: var(--dsw-alias-tooltip-bg, #43454a);
+  color: var(--dsw-static-neutral-bluish-00, #fff);
+  border: none;
   box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
   pointer-events: none;
 }
@@ -298,11 +274,18 @@ window.__ModuleLoader__.load({
   white-space: pre-line;
   font-size: 13px;
   line-height: 20px;
-  opacity: 0.8;
+  color: var(--dsw-static-neutral-bluish-300, rgba(255, 255, 255, 0.8));
 }
 .dsh-tl-tip-assistant[data-kind="running"],
 .dsh-tl-tip-assistant[data-kind="empty"] {
-  opacity: 0.55;
+  color: var(--dsw-static-neutral-bluish-400, rgba(255, 255, 255, 0.55));
+}
+/* 插件完全接管原生右侧 Turn 导航条：本样式表只随插件存在，插件卸载时
+   removeStyles 移除标签，原生导航条立即恢复。aria-label 跟随宿主语言
+   （英文 Turn navigation / 中文 轮次导航），两个都要盖住。 */
+nav[aria-label='Turn navigation'],
+nav[aria-label='轮次导航'] {
+  display: none !important;
 }
 `;
 		/** Inject the stylesheet once per document. */
@@ -315,6 +298,10 @@ window.__ModuleLoader__.load({
 			tag.textContent = TIMELINE_STYLES;
 			doc.head.appendChild(tag);
 		}
+		/** Remove the stylesheet (plugin teardown): restores the native turn navigator. */
+		function removeStyles(doc) {
+			doc.querySelector("style[data-plugin-css=\"chat-timeline\"]")?.remove();
+		}
 		//#endregion
 		//#region src/client/rail.tsx
 		/**
@@ -327,13 +314,11 @@ window.__ModuleLoader__.load({
 		*/
 		/** Slot height per tick (10px pitch, ZCode parity). */
 		const ITEM_PITCH = 10;
-		/** Container width below which the rail hides. ZCode uses 864px, but DSH's
-		*  three-pane layout leaves the conversation narrower — the rail overlays the
-		*  left edge without taking layout space, so only truly cramped panes hide. */
-		const MIN_CONTAINER_WIDTH = 560;
 		/** Preview-card hover delays (ms). */
 		const TIP_OPEN_DELAY = 120;
 		const TIP_CLOSE_DELAY = 80;
+		/** Default composer height when the host variable is absent (native fallback). */
+		const COMPOSER_HEIGHT_FALLBACK = 152;
 		/** Ripple visual per distance from the hovered tick (ZCode _5e parity).
 		*  The ripple is interaction-only: at rest every tick is idle (scaleX 1),
 		*  and the current position is signalled by color/opacity, not length. */
@@ -364,18 +349,6 @@ window.__ModuleLoader__.load({
 		*  through system colors). */
 		const TICK_COLOR_FOREGROUND = "CanvasText";
 		const TICK_COLOR_SUBTLE = "color-mix(in srgb, CanvasText 42%, transparent)";
-		function useReducedMotion() {
-			const [reduced, setReduced] = (0, react.useState)(false);
-			(0, react.useEffect)(() => {
-				if (typeof window === "undefined" || typeof window.matchMedia !== "function") return;
-				const query = window.matchMedia("(prefers-reduced-motion: reduce)");
-				const update = () => setReduced(query.matches);
-				update();
-				query.addEventListener("change", update);
-				return () => query.removeEventListener("change", update);
-			}, []);
-			return reduced;
-		}
 		/**
 		* Render the question navigator rail.
 		* @param props - composed slot props.
@@ -383,7 +356,6 @@ window.__ModuleLoader__.load({
 		*/
 		function TimelineRail({ source, t }) {
 			const state = (0, react.useSyncExternalStore)(source.subscribe, source.getSnapshot);
-			const reducedMotion = useReducedMotion();
 			const probe = (0, react.useMemo)(() => typeof document === "undefined" ? null : probeChatDom(document), []);
 			const [containerVersion, setContainerVersion] = (0, react.useState)(0);
 			const [rect, setRect] = (0, react.useState)(null);
@@ -395,16 +367,22 @@ window.__ModuleLoader__.load({
 				close: void 0
 			});
 			const frame = (0, react.useRef)(0);
-			const labels = (0, react.useMemo)(() => ({
-				userFallback: t("preview.userFallback"),
-				assistantEmpty: t("preview.assistantEmpty"),
-				assistantRunning: t("preview.assistantRunning")
-			}), [t]);
 			const snapshot = state.snapshot;
-			const items = (0, react.useMemo)(() => snapshot === null ? [] : buildTimelineItems(snapshot.nodes, snapshot.running, labels), [snapshot, labels]);
+			const items = (0, react.useMemo)(() => snapshot === null ? [] : snapshot.items, [snapshot]);
+			const sourceRef = (0, react.useRef)(source);
+			sourceRef.current = source;
+			const itemsRef = (0, react.useRef)([]);
+			itemsRef.current = items;
+			const seqs = (0, react.useMemo)(() => items.map((item) => item.seq), [items]);
+			const seqsRef = (0, react.useRef)([]);
+			seqsRef.current = seqs;
+			const turns = (0, react.useMemo)(() => items.map((item) => item.turn), [items]);
+			const turnsRef = (0, react.useRef)([]);
+			turnsRef.current = turns;
 			(0, react.useEffect)(() => {
 				if (typeof document === "undefined") return;
 				ensureStyles(document);
+				return () => removeStyles(document);
 			}, []);
 			(0, react.useEffect)(() => {
 				if (probe === null) return;
@@ -435,13 +413,20 @@ window.__ModuleLoader__.load({
 					frame.current = requestAnimationFrame(() => {
 						frame.current = 0;
 						const box = container.getBoundingClientRect();
+						const style = getComputedStyle(container);
+						const composerHeight = Number.parseFloat(style.getPropertyValue("--dsh-composer-height")) || COMPOSER_HEIGHT_FALLBACK;
+						const viewportHeight = Number.parseFloat(style.getPropertyValue("--dsh-conversation-viewport-height")) || window.innerHeight;
+						const slot = document.querySelector("nav[aria-label=\"Turn navigation\"]")?.parentElement;
+						const slotTop = slot !== null && slot !== void 0 ? slot.getBoundingClientRect().top : box.top;
+						const bandCenter = (viewportHeight - composerHeight) / 2;
 						setRect({
 							left: box.left,
 							top: box.top,
 							height: box.height,
-							width: box.width
+							width: box.width,
+							centerY: Math.max(0, slotTop - box.top + bandCenter)
 						});
-						setActiveIndex(probe.activeIndex());
+						setActiveIndex(probe.activeIndex(turnsRef.current));
 					});
 				};
 				sync();
@@ -457,7 +442,16 @@ window.__ModuleLoader__.load({
 					frame.current = 0;
 				};
 			}, [probe, containerVersion]);
-			const visible = snapshot !== null && items.length >= 2 && rect !== null && rect.width >= MIN_CONTAINER_WIDTH;
+			(0, react.useEffect)(() => {
+				if (probe === null || containerVersion === 0 || rect === null) return;
+				setActiveIndex(probe.activeIndex(turns));
+			}, [
+				probe,
+				containerVersion,
+				rect,
+				turns
+			]);
+			const visible = snapshot !== null && rect !== null;
 			const focusIndex = hoverIndex;
 			const scheduleTip = (0, react.useCallback)((index) => {
 				if (timers.current.open !== void 0) window.clearTimeout(timers.current.open);
@@ -473,8 +467,8 @@ window.__ModuleLoader__.load({
 				if (timers.current.close !== void 0) window.clearTimeout(timers.current.close);
 			}, []);
 			const jump = (0, react.useCallback)((index) => {
-				probe?.jumpTo(index, reducedMotion ? "auto" : "smooth");
-			}, [probe, reducedMotion]);
+				jumpToTurn(document, index, turnsRef.current, seqsRef.current, (seq) => sourceRef.current?.jumpThrough(seq) ?? Promise.resolve());
+			}, []);
 			if (!visible || probe === null || rect === null) return null;
 			const trackHeight = items.length * ITEM_PITCH;
 			const tip = tipIndex !== void 0 ? items[tipIndex] : void 0;
@@ -487,7 +481,8 @@ window.__ModuleLoader__.load({
 				style: {
 					left: rect.left,
 					top: rect.top,
-					height: rect.height
+					height: rect.height,
+					"--dsh-tl-center-y": `${rect.centerY}px`
 				},
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 					className: "dsh-tl-scroll",
@@ -574,11 +569,11 @@ window.__ModuleLoader__.load({
 				role: "tooltip",
 				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
 					className: "dsh-tl-tip-user",
-					children: item.userPreview
+					children: item.userFallback ? t("preview.userFallback") : item.userPreview
 				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
 					className: "dsh-tl-tip-assistant",
 					"data-kind": item.assistantKind,
-					children: item.assistantPreview
+					children: item.assistantKind === "running" ? t("preview.assistantRunning") : item.assistantKind === "empty" ? t("preview.assistantEmpty") : item.assistantPreview
 				})]
 			});
 		}
@@ -588,20 +583,44 @@ window.__ModuleLoader__.load({
 			sessionId: void 0,
 			snapshot: null
 		};
+		/** Project one outline entry onto a tick (previews are host-bounded already). */
+		function itemFromOutline(entry, isLive, labels) {
+			const prompt = typeof entry.prompt === "string" ? entry.prompt : "";
+			const response = typeof entry.response === "string" ? entry.response : "";
+			const assistantKind = response ? "text" : isLive ? "running" : "empty";
+			return {
+				key: `t${entry.turn}`,
+				seq: entry.seq,
+				time: 0,
+				turn: entry.turn,
+				userPreview: prompt || labels.userFallback,
+				userFallback: !prompt,
+				assistantPreview: response || (isLive ? labels.assistantRunning : labels.assistantEmpty),
+				assistantKind,
+				running: isLive
+			};
+		}
+		/** Build the tick list from the outline plus the live running flag. */
+		function itemsFromOutline(outline, running, labels) {
+			const last = outline.length - 1;
+			return outline.map((entry, index) => itemFromOutline(entry, running && index === last, labels));
+		}
 		/**
 		* Create the source. Subscribes to the sessions list, rebinds to the current
-		* session's snapshot feed on selection change, and republishes a stable state
-		* object whenever the underlying snapshot changes.
+		* session's outline projection on selection change (polling while no session
+		* is selected — the list store need not notify on pure selection switches),
+		* and republishes a stable state whenever the outline or running flag moves.
 		* @param sessions - the sessions service face (pass ctx.sessions).
 		* @returns the source face.
 		*/
 		function createTimelineSource(sessions) {
 			let state = EMPTY_STATE;
 			const listeners = /* @__PURE__ */ new Set();
+			let subscribed = false;
 			let unbindSession = null;
-			let boundSessionId;
 			let retryTimer;
 			let retryAttempts = 0;
+			let noSessionPolls = 0;
 			const emit = () => {
 				for (const listener of listeners) listener();
 			};
@@ -616,22 +635,33 @@ window.__ModuleLoader__.load({
 				} catch {
 					current = void 0;
 				}
-				if (current === boundSessionId && retryAttempts === 0) return;
-				boundSessionId = current;
-				unbindSession?.();
-				unbindSession = null;
 				if (current === void 0) {
 					state = EMPTY_STATE;
 					emit();
+					if (subscribed && noSessionPolls < 60) {
+						noSessionPolls += 1;
+						retryTimer = setTimeout(rebind, 1e3);
+					}
 					return;
 				}
-				let session;
+				noSessionPolls = 0;
+				unbindSession?.();
+				unbindSession = null;
+				let bound;
 				try {
-					session = sessions.binding(current)?.session;
+					bound = sessions.binding(current);
 				} catch {
-					session = void 0;
+					bound = void 0;
 				}
-				if (!session) {
+				const session = bound?.session;
+				const outlineFace = (() => {
+					try {
+						return session?.projections?.faceOf?.("turnOutline");
+					} catch {
+						return;
+					}
+				})();
+				if (!session || !outlineFace) {
 					state = {
 						sessionId: current,
 						snapshot: null
@@ -646,13 +676,18 @@ window.__ModuleLoader__.load({
 				retryAttempts = 0;
 				const push = () => {
 					try {
-						const snap = session.getSnapshot();
+						const outline = outlineFace.getSnapshot();
+						const running = Boolean(session.getSnapshot()?.running);
 						state = {
 							sessionId: current,
 							snapshot: {
 								sessionId: current,
-								nodes: Array.isArray(snap?.nodes) ? snap.nodes : [],
-								running: Boolean(snap?.running)
+								items: Array.isArray(outline) ? itemsFromOutline(outline, running, {
+									userFallback: "（无文本）",
+									assistantRunning: "（运行中）",
+									assistantEmpty: "（空）"
+								}) : [],
+								running
 							}
 						};
 					} catch {
@@ -665,6 +700,7 @@ window.__ModuleLoader__.load({
 				};
 				push();
 				try {
+					outlineFace.subscribe(push);
 					session.subscribe(push);
 					unbindSession = () => {};
 				} catch {
@@ -676,6 +712,7 @@ window.__ModuleLoader__.load({
 					const first = listeners.size === 0;
 					listeners.add(listener);
 					if (first) {
+						subscribed = true;
 						try {
 							sessions.list.subscribe(rebind);
 						} catch {}
@@ -687,6 +724,17 @@ window.__ModuleLoader__.load({
 				},
 				getSnapshot() {
 					return state;
+				},
+				jumpThrough(seq) {
+					let current;
+					try {
+						current = sessions.list.getSnapshot()?.current;
+					} catch {
+						current = void 0;
+					}
+					const session = current === void 0 ? void 0 : sessions.binding(current)?.session;
+					if (typeof session?.loadThrough !== "function") return Promise.resolve();
+					return session.loadThrough(seq).catch(() => {});
 				}
 			};
 		}
@@ -752,7 +800,8 @@ window.__ModuleLoader__.load({
 						locale: NS,
 						inject: () => ({ source: timelineSourceFromContext(ctx) })
 					}, TimelineRail);
-				} catch {
+				} catch (err) {
+					console.error("chat-timeline: shell.overlay register failed:", err);
 					return () => {};
 				}
 			});