dsh-milestone 0.5.0 → 0.6.0

package/README.md

@@ -44,6 +44,10 @@
 - **turn 分组折叠** —— 圆点按轮次分组，一眼看清对话章节；长轮次可折叠成一条，减少干扰。
 - **复制与 fork** —— 悬停一键复制该条提问全文，或「从此处 fork」开一个分支会话。
 - **中英双语** —— 跟随 harness 界面语言自动切换中英文。
+- **聚焦模式** —— 一键淡化 AI 的思考(thinking)区块，对话正文更清爽；悬停或展开时自动恢复。
+- **全部提问列表** —— 顶部展开面板，一次看全所有提问（序号 + 轮次 + 预览），点击即跳，长对话不再靠圆点一个个数。
+- **深链接** —— 跳转时 URL 带上 `#msg=` 锚点，刷新或分享链接后直接回到同一条消息。
+- **跨会话搜索** —— 一键搜索**所有会话**的消息内容（harness 原生索引），点击结果直接打开对应会话。
 - **零侵入** —— 官方 slot 机制挂载，不修改 harness 源码，装完即用。
 
 ## 悬停能看到什么
@@ -100,6 +104,9 @@ shell.overlay (root scope)
 - 书签按**会话**隔离（不跨会话共享）。
 - 模型 / token 用量依赖该轮 assistant 节点的元数据，部分场景下缺失则自动隐藏该行。
 - fork 从选中消息所在轮次开始分支，不会自动打开子会话（需在会话列表手动打开）。
+- 深链接的目标消息若早于已加载窗口，会先自动加载更早历史再定位（受加载上限约束，极端深的历史可能定位失败）。
+- 跨会话搜索依赖 harness 的消息内容索引（`session.search`），仅返回片段（≤240 字符）、最多 20 条结果；命中过多时请细化关键词。
+- 聚焦模式作用于当前会话视图的思考区块，不会影响其他插件或工具的展示。
 - 尚无全局快捷键聚焦里程碑条（需 Tab 键切换到）。
 
 ## License

package/lib/client.js

@@ -149,6 +149,59 @@ window.__ModuleLoader__.load({
 			}
 		}
 		//#endregion
+		//#region src/client/deep-link-logic.ts
+		/**
+		* Pure deep-link helpers for the milestone rail: parse the `#msg=<key>` URL
+		* hash and rebuild it.
+		*
+		* The conversation anchor key is treated as an OPAQUE string — it is a
+		* length-prefixed node key like `13:input-message<messageId>` or
+		* `14:assistant-step3:2` (the length prefix makes naive splitting ambiguous),
+		* so the parser never inspects or splits the key itself. Callers match the
+		* returned key against the session's marks, which is the real validity check.
+		*
+		* Percent-encoding: the URL fragment parser percent-encodes `"` `<` `>` `` ` ``
+		* and lone `%`, so a hash built with a RAW `<`-containing key would read back
+		* from `location.hash` percent-encoded (`13:user%3Cdl-2%3E`) and never match
+		* a mark after a refresh. `buildMessageHash` therefore percent-encodes those
+		* characters itself (a byte-exact URL), and `parseDeepLinkHash` decodes them
+		* back — the key round-trips through the URL untouched.
+		*/
+		/** The URL hash fragment prefix that carries a message anchor key. */
+		const MSG_HASH_PREFIX = "msg=";
+		/**
+		* Characters the WHATWG URL fragment parser cannot round-trip raw (they are
+		* percent-encoded on parse): `"` (0x22), `<` (0x3C), `>` (0x3E), backtick
+		* (0x60), and `%` (0x25, so a literal `%` never reads as an escape start).
+		*/
+		const FRAGMENT_UNSAFE = /["<>\u0060%]/g;
+		/**
+		* Parse a `location.hash` fragment into the message anchor key it references.
+		* @param hash - the raw `location.hash` value: `''` or a fragment starting
+		*   with `#` (e.g. `#msg=13:input-messageabc`).
+		* @returns the anchor key (percent-escapes decoded), or null when the
+		*   fragment is not a message deep link: empty hash, `#msg=` with an empty
+		*   value, a `#msg` prefix without the `=`, any other hash shape, a hash
+		*   missing the leading `#`, or a malformed percent escape.
+		*/
+		function parseDeepLinkHash(hash) {
+			if (!hash.startsWith(`#${MSG_HASH_PREFIX}`)) return null;
+			const encoded = hash.slice(5);
+			if (encoded === "") return null;
+			try {
+				return decodeURIComponent(encoded);
+			} catch {
+				return null;
+			}
+		}
+		/**
+		* Build the URL hash fragment that deep-links to a message anchor key.
+		* @param key - the conversation node key (opaque, never parsed here).
+		*/
+		function buildMessageHash(key) {
+			return `#${MSG_HASH_PREFIX}${key.replace(FRAGMENT_UNSAFE, (c) => `%${c.charCodeAt(0).toString(16).toUpperCase()}`)}`;
+		}
+		//#endregion
 		//#region src/client/label-logic.ts
 		const MINUTE_MS = 6e4;
 		const HOUR_MS = 36e5;
@@ -452,7 +505,7 @@ window.__ModuleLoader__.load({
 		//#endregion
 		//#region src/client/MilestoneRailSearch.tsx
 		/** Dot diameter (px) — matches the rail's DOT_HIT so the toggle aligns. */
-		const DOT_HIT$1 = 22;
+		const DOT_HIT$1 = 28;
 		/**
 		* @param props - the search state slice plus the rail's event handlers.
 		*/
@@ -477,8 +530,8 @@ window.__ModuleLoader__.load({
 					color: panelOpen ? "#9db8ff" : "#8b96ab"
 				},
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
-					width: "13",
-					height: "13",
+					width: "16",
+					height: "16",
 					viewBox: "0 0 24 24",
 					fill: "none",
 					stroke: "currentColor",
@@ -496,7 +549,7 @@ window.__ModuleLoader__.load({
 					position: "fixed",
 					top: panelTop,
 					right: panelRight,
-					width: 220,
+					width: "min(220px, calc(100vw - 48px))",
 					padding: "10px 12px",
 					background: "rgba(20, 24, 32, 0.97)",
 					color: "#e6e8ee",
@@ -521,8 +574,9 @@ window.__ModuleLoader__.load({
 						style: {
 							flex: 1,
 							minWidth: 0,
-							padding: "5px 8px",
-							fontSize: 12,
+							padding: "6px 10px",
+							fontSize: 14,
+							lineHeight: 1.4,
 							color: "#e6e8ee",
 							background: "rgba(255, 255, 255, 0.08)",
 							border: "1px solid rgba(255, 255, 255, 0.16)",
@@ -548,8 +602,8 @@ window.__ModuleLoader__.load({
 							color: "#8b96ab"
 						},
 						children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
-							width: "10",
-							height: "10",
+							width: "12",
+							height: "12",
 							viewBox: "0 0 24 24",
 							fill: "none",
 							stroke: "currentColor",
@@ -563,7 +617,7 @@ window.__ModuleLoader__.load({
 					"data-match-count": true,
 					style: {
 						marginTop: 6,
-						fontSize: 11,
+						fontSize: 13,
 						color: "#8b96ab"
 					},
 					children: [
@@ -575,6 +629,101 @@ window.__ModuleLoader__.load({
 			})] });
 		}
 		//#endregion
+		//#region src/client/MilestoneListPanel.tsx
+		/**
+		* @param props - the panel anchor, the full marks array, and the rail's jump handler.
+		*/
+		function MilestoneListPanel({ panelTop, panelRight, marks, onJump, t }) {
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				"data-milestone-list": true,
+				style: {
+					position: "fixed",
+					top: panelTop,
+					right: panelRight,
+					width: "min(280px, calc(100vw - 48px))",
+					padding: "10px 12px",
+					background: "rgba(20, 24, 32, 0.97)",
+					color: "#e6e8ee",
+					borderRadius: 8,
+					boxShadow: "0 6px 20px rgba(0, 0, 0, 0.4)",
+					zIndex: 103
+				},
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("style", { children: `[data-list-item]:hover { background: rgba(77, 124, 254, 0.18); }` }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						style: {
+							display: "flex",
+							alignItems: "center",
+							gap: 6,
+							marginBottom: 6
+						},
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							style: {
+								fontSize: 13,
+								fontWeight: 600,
+								color: "#e6e8ee"
+							},
+							children: t("list.label")
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							style: {
+								fontSize: 12,
+								color: "#8b96ab"
+							},
+							children: marks.length
+						})]
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						style: {
+							maxHeight: 300,
+							overflowY: "auto",
+							display: "flex",
+							flexDirection: "column",
+							gap: 2
+						},
+						children: marks.map((mark, i) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+							type: "button",
+							"data-list-item": true,
+							"data-jump-key": mark.key,
+							onClick: () => onJump(mark.key),
+							title: mark.preview,
+							style: {
+								display: "block",
+								width: "100%",
+								minWidth: 0,
+								padding: "6px 8px",
+								background: "transparent",
+								border: "none",
+								borderRadius: 6,
+								cursor: "pointer",
+								color: "#e6e8ee",
+								textAlign: "left"
+							},
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								style: {
+									fontSize: 12,
+									color: "#8b96ab",
+									whiteSpace: "nowrap"
+								},
+								children: [t("pos.of", {
+									n: i + 1,
+									m: marks.length
+								}), mark.turn !== void 0 ? ` · ${t("turn.label", { n: mark.turn })}` : null]
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								style: {
+									fontSize: 13,
+									lineHeight: 1.4,
+									overflow: "hidden",
+									textOverflow: "ellipsis",
+									whiteSpace: "nowrap"
+								},
+								children: mark.preview || t("no.text")
+							})]
+						}, mark.key))
+					})
+				]
+			});
+		}
+		//#endregion
 		//#region src/client/MilestoneRailTooltip.tsx
 		/**
 		* @param props - the hovered mark + bookmark wiring (see {@link MilestoneRailTooltipProps}).
@@ -591,14 +740,14 @@ window.__ModuleLoader__.load({
 					right: panelRight,
 					top: hover.top,
 					transform: "translateY(-50%)",
-					maxWidth: 300,
+					maxWidth: "min(300px, calc(100vw - 120px))",
 					minWidth: 180,
 					padding: "8px 12px",
 					background: "rgba(20, 24, 32, 0.96)",
 					color: "#e6e8ee",
 					borderRadius: 8,
-					fontSize: 12,
-					lineHeight: 1.6,
+					fontSize: "var(--dsw-font-s-14, 14px)",
+					lineHeight: 1.5,
 					whiteSpace: "pre-wrap",
 					wordBreak: "break-word",
 					boxShadow: "0 6px 20px rgba(0, 0, 0, 0.4)",
@@ -613,7 +762,8 @@ window.__ModuleLoader__.load({
 							flexWrap: "wrap",
 							gap: 8,
 							color: "#9aa4b8",
-							fontSize: 11,
+							fontSize: 13,
+							lineHeight: 1.4,
 							marginBottom: 4
 						},
 						children: [
@@ -647,8 +797,8 @@ window.__ModuleLoader__.load({
 									color: bookmarked ? "#ffd166" : "#8b96ab"
 								},
 								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
-									width: "13",
-									height: "13",
+									width: "14",
+									height: "14",
 									viewBox: "0 0 24 24",
 									fill: bookmarked ? "currentColor" : "none",
 									stroke: "currentColor",
@@ -673,7 +823,7 @@ window.__ModuleLoader__.load({
 									justifyContent: "center",
 									background: "transparent",
 									border: "none",
-									padding: "2px 6px",
+									padding: "3px 8px",
 									cursor: "pointer",
 									whiteSpace: "nowrap",
 									color: copied ? "#7ee2a8" : "#8b96ab"
@@ -695,7 +845,7 @@ window.__ModuleLoader__.load({
 									justifyContent: "center",
 									background: "transparent",
 									border: "none",
-									padding: "2px 6px",
+									padding: "3px 8px",
 									cursor: "pointer",
 									whiteSpace: "nowrap",
 									color: forked ? "#7ee2a8" : "#8b96ab"
@@ -718,7 +868,7 @@ window.__ModuleLoader__.load({
 									justifyContent: "center",
 									background: "transparent",
 									border: "none",
-									padding: "2px 6px",
+									padding: "3px 8px",
 									cursor: "pointer",
 									whiteSpace: "nowrap",
 									color: turnCollapsed ? "#7ee2a8" : "#8b96ab"
@@ -737,7 +887,8 @@ window.__ModuleLoader__.load({
 							flexWrap: "wrap",
 							gap: 8,
 							color: "#8b96ab",
-							fontSize: 11,
+							fontSize: 13,
+							lineHeight: 1.4,
 							marginTop: 4
 						},
 						children: [
@@ -754,7 +905,8 @@ window.__ModuleLoader__.load({
 							flexWrap: "wrap",
 							gap: 8,
 							color: "#8b96ab",
-							fontSize: 11,
+							fontSize: 13,
+							lineHeight: 1.4,
 							marginTop: 4
 						},
 						children: [
@@ -776,6 +928,185 @@ window.__ModuleLoader__.load({
 			});
 		}
 		//#endregion
+		//#region src/client/MilestoneSessionSearch.tsx
+		/**
+		* MilestoneSessionSearch: the cross-session search panel (P3) — the fixed
+		* chrome pinned to the rail's top that searches EVERY session's message
+		* content through the injected `searchSessions` action (the harness
+		* `session.search` RPC), lists ranked hits (display title + snippet), and
+		* opens the clicked session via `openSession` (the same selection path the
+		* sidebar uses).
+		*
+		* Owns its search lifecycle — debounce + AbortController + status — unlike
+		* the rail's in-session search (RailSearchUi), which is a pure presentation
+		* slice of MilestoneRail's own state. Mirrors MilestoneListPanel's
+		* fixed-panel styling. Renders one DOM contract
+		* (`data-session-search` root / `data-session-search-input` /
+		* `data-session-search-result` rows / `data-session-search-error` /
+		* `data-session-search-more`).
+		*/
+		/** Debounce window for the cross-session query (ms). */
+		const SEARCH_DEBOUNCE_MS = 250;
+		/**
+		* @param props - the panel anchor, the close/open/search actions, and the locale interpreter.
+		*/
+		function MilestoneSessionSearch({ panelTop, panelRight, onClose, searchSessions, openSession, t }) {
+			const [query, setQuery] = (0, react.useState)("");
+			const [status, setStatus] = (0, react.useState)("idle");
+			const [hits, setHits] = (0, react.useState)([]);
+			const [hasMore, setHasMore] = (0, react.useState)(false);
+			(0, react.useEffect)(() => {
+				const trimmed = query.trim();
+				if (trimmed === "") {
+					setStatus("idle");
+					return;
+				}
+				const controller = new AbortController();
+				setStatus("loading");
+				const timer = window.setTimeout(() => {
+					searchSessions(trimmed, controller.signal).then((result) => {
+						if (controller.signal.aborted) return;
+						setHits(result.items);
+						setHasMore(result.hasMore);
+						setStatus(result.items.length > 0 ? "results" : "empty");
+					}, () => {
+						if (controller.signal.aborted) return;
+						setStatus("error");
+					});
+				}, SEARCH_DEBOUNCE_MS);
+				return () => {
+					window.clearTimeout(timer);
+					controller.abort();
+				};
+			}, [query, searchSessions]);
+			const onInputKeyDown = (e) => {
+				if (e.key === "Escape") onClose();
+			};
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				"data-session-search": true,
+				style: {
+					position: "fixed",
+					top: panelTop,
+					right: panelRight,
+					width: "min(280px, calc(100vw - 48px))",
+					padding: "10px 12px",
+					background: "rgba(20, 24, 32, 0.97)",
+					color: "#e6e8ee",
+					borderRadius: 8,
+					boxShadow: "0 6px 20px rgba(0, 0, 0, 0.4)",
+					zIndex: 103
+				},
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("style", { children: `[data-session-search-result]:hover { background: rgba(77, 124, 254, 0.18); }` }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						style: {
+							display: "flex",
+							alignItems: "center",
+							gap: 6,
+							marginBottom: 6
+						},
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							style: {
+								fontSize: 13,
+								fontWeight: 600,
+								color: "#e6e8ee"
+							},
+							children: t("search.cross")
+						})
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+						"data-session-search-input": true,
+						"aria-label": t("search.cross"),
+						placeholder: t("search.cross"),
+						value: query,
+						onChange: (e) => setQuery(e.target.value),
+						onKeyDown: onInputKeyDown,
+						autoFocus: true,
+						style: {
+							boxSizing: "border-box",
+							width: "100%",
+							padding: "6px 10px",
+							fontSize: 14,
+							lineHeight: 1.4,
+							color: "#e6e8ee",
+							background: "rgba(255, 255, 255, 0.08)",
+							border: "1px solid rgba(255, 255, 255, 0.16)",
+							borderRadius: 6,
+							outline: "none"
+						}
+					}),
+					status === "error" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						"data-session-search-error": true,
+						style: {
+							marginTop: 8,
+							fontSize: 13,
+							color: "#f07c7c"
+						},
+						children: t("search.error")
+					}),
+					status === "results" && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						style: {
+							maxHeight: 300,
+							overflowY: "auto",
+							display: "flex",
+							flexDirection: "column",
+							gap: 2,
+							marginTop: 8
+						},
+						children: hits.map((hit) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+							type: "button",
+							"data-session-search-result": true,
+							onClick: () => {
+								openSession(hit.sessionId);
+								onClose();
+							},
+							title: hit.snippet,
+							style: {
+								display: "block",
+								width: "100%",
+								minWidth: 0,
+								padding: "6px 8px",
+								background: "transparent",
+								border: "none",
+								borderRadius: 6,
+								cursor: "pointer",
+								color: "#e6e8ee",
+								textAlign: "left"
+							},
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								style: {
+									fontSize: 12,
+									color: "#9db8ff",
+									whiteSpace: "nowrap",
+									overflow: "hidden",
+									textOverflow: "ellipsis"
+								},
+								children: hit.title ?? t("search.untitled")
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								style: {
+									fontSize: 13,
+									lineHeight: 1.4,
+									color: "#c6ccd8",
+									overflow: "hidden",
+									textOverflow: "ellipsis",
+									whiteSpace: "nowrap"
+								},
+								children: hit.snippet
+							})]
+						}, hit.sessionId))
+					}), hasMore && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						"data-session-search-more": true,
+						style: {
+							marginTop: 6,
+							fontSize: 12,
+							color: "#8b96ab"
+						},
+						children: t("search.more")
+					})] })
+				]
+			});
+		}
+		//#endregion
 		//#region src/client/useCurrentAnchor.ts
 		/**
 		* useCurrentAnchor: tracks which user-message row sits at/just above the
@@ -890,15 +1221,38 @@ window.__ModuleLoader__.load({
   70% { box-shadow: 0 0 0 5px transparent; opacity: 0.35 }
   100% { box-shadow: 0 0 0 0 transparent; opacity: 0.85 }
 }`;
+		/**
+		* P3 focus mode: dims the harness's AI thinking/scratchpad blocks so the
+		* conversation reads cleaner. The rule targets the stable, un-hashed
+		* `data-variant="think"` attribute on the thinking-block ROOT (the harness
+		* renders it as `data-variant="think"` with `data-state="running|ok"`), so an
+		* overlay plugin can dim it with plain CSS. Hovering a dimmed block (or
+		* opening it, `[data-open]`) restores full opacity. Kept in an inline
+		* <style> so the plugin stays zero-asset — same pattern as BADGE_PULSE_CSS.
+		*/
+		const FOCUS_CSS = `[data-variant="think"] { opacity: 0.4; transition: opacity 0.2s; }
+[data-variant="think"]:hover, [data-variant="think"] [data-open] { opacity: 1; }`;
 		/** Visual dot diameter (px). */
-		const DOT_SIZE = 12;
+		const DOT_SIZE = 14;
 		/** Hit area per dot (px) — larger than the dot for comfortable clicking. */
-		const DOT_HIT = 22;
+		const DOT_HIT = 28;
 		/** Vertical gap between dot hit areas (px) — fixed pitch, never scaled. */
-		const DOT_GAP = 12;
+		const DOT_GAP = 14;
 		/** Inward offset from the scrollport right edge so the rail clears the scrollbar. */
 		const RAIL_INSET = 14;
 		/**
+		* P3 deep links (`#msg=<anchor-key>`): initial delay before the first
+		* deep-link attempt — the harness scrolls the conversation to the bottom on
+		* load, so the deep link must land AFTER the view mounts.
+		*/
+		const DEEP_LINK_INITIAL_DELAY = 100;
+		/** P3: interval between DOM-row polls while waiting for the target to render. */
+		const DEEP_LINK_POLL_DELAY = 150;
+		/** P3: polls before falling back to a single `loadOlder` fetch. */
+		const DEEP_LINK_MAX_POLLS = 5;
+		/** P3: bounded polls after `loadOlder`, then the deep link gives up silently. */
+		const DEEP_LINK_MAX_RETRY_POLLS = 5;
+		/**
 		* Find a chat row by its node key, avoiding CSS.escape pitfalls on keys that
 		* contain `<`/`>`/`:` (the node key is `13:input-message<messageId>`).
 		*/
@@ -930,7 +1284,10 @@ window.__ModuleLoader__.load({
 		* `locale: 'dsh-milestone'`; defaults to a key-pass fallback for renders
 		* outside the slot machinery).
 		*/
-		function MilestoneRail({ useSession, loadOlder, forkAt, useStore, actions, t = (key) => key }) {
+		function MilestoneRail({ useSession, loadOlder, forkAt, useStore, actions, searchSessions = async () => ({
+			items: [],
+			hasMore: false
+		}), openSession = () => {}, t = (key) => key }) {
 			const order = useSession((s) => s.chat.order);
 			const nodes = useSession((s) => s.chat.nodes);
 			const locations = useSession((s) => s.chat.locations);
@@ -981,12 +1338,33 @@ window.__ModuleLoader__.load({
 				panelOpen: false
 			});
 			const [bookmarksOnly, setBookmarksOnly] = (0, react.useState)(false);
+			const [focusActive, setFocusActive] = (0, react.useState)(false);
+			const [listOpen, setListOpen] = (0, react.useState)(false);
+			const [crossOpen, setCrossOpen] = (0, react.useState)(false);
 			const [copiedKey, setCopiedKey] = (0, react.useState)(null);
 			const [forkedKey, setForkedKey] = (0, react.useState)(null);
 			const [collapsedTurns, setCollapsedTurns] = (0, react.useState)(/* @__PURE__ */ new Set());
 			const [focusIndex, setFocusIndex] = (0, react.useState)(0);
 			const listRef = (0, react.useRef)(null);
 			const currentKey = useCurrentAnchor(order);
+			/**
+			* P3: jump to the chat row with the given node key — smooth-scroll it into
+			* view and write the position back into the URL hash (`#msg=<key>`) so
+			* refresh and share preserve it. `history.replaceState` (not a
+			* `location.hash` assignment) keeps the history stack clean, and it never
+			* fires `hashchange`, so the deep-link listeners below never echo the
+			* rail's own updates. No-op when the row is not (yet) rendered — the
+			* deep-link mount retry and the load-older flow cover that case.
+			*/
+			const jump = (key) => {
+				const row = findRow(key);
+				if (row === null) return;
+				row.scrollIntoView({
+					behavior: "smooth",
+					block: "start"
+				});
+				history.replaceState(null, "", buildMessageHash(key));
+			};
 			const displayMarks = (0, react.useMemo)(() => {
 				if (!bookmarksOnly) return marks;
 				return filterByBookmarks(marks, bookmarkedKeys).visible.map((i) => marks[i]);
@@ -1041,13 +1419,59 @@ window.__ModuleLoader__.load({
 			(0, react.useLayoutEffect)(() => {
 				setFocusIndex((f) => clampIndex(f, render.items.length));
 			}, [render.items.length]);
+			(0, react.useEffect)(() => {
+				if (!listOpen && !crossOpen) return;
+				const onKey = (e) => {
+					if (e.key !== "Escape") return;
+					setListOpen(false);
+					setCrossOpen(false);
+				};
+				window.addEventListener("keydown", onKey);
+				return () => window.removeEventListener("keydown", onKey);
+			}, [listOpen, crossOpen]);
+			const marksRef = (0, react.useRef)(marks);
+			(0, react.useEffect)(() => {
+				marksRef.current = marks;
+			});
+			(0, react.useEffect)(() => {
+				const key = parseDeepLinkHash(window.location.hash);
+				if (key === null) return;
+				let cancelled = false;
+				let timer;
+				const attempt = (pollsLeft, canLoadOlder) => {
+					if (cancelled) return;
+					if (findRow(key) !== null) {
+						jump(key);
+						return;
+					}
+					if (marksRef.current.length > 0 && !marksRef.current.some((m) => m.key === key)) return;
+					if (pollsLeft > 0) {
+						timer = window.setTimeout(() => attempt(pollsLeft - 1, canLoadOlder), DEEP_LINK_POLL_DELAY);
+						return;
+					}
+					if (canLoadOlder) {
+						loadOlder().then(() => {
+							timer = window.setTimeout(() => attempt(DEEP_LINK_MAX_RETRY_POLLS, false), DEEP_LINK_POLL_DELAY);
+						}, () => {});
+						return;
+					}
+				};
+				timer = window.setTimeout(() => attempt(DEEP_LINK_MAX_POLLS, true), DEEP_LINK_INITIAL_DELAY);
+				return () => {
+					cancelled = true;
+					if (timer !== void 0) window.clearTimeout(timer);
+				};
+			}, []);
+			(0, react.useEffect)(() => {
+				const onHashChange = () => {
+					const key = parseDeepLinkHash(window.location.hash);
+					if (key === null) return;
+					if (marksRef.current.some((m) => m.key === key)) jump(key);
+				};
+				window.addEventListener("hashchange", onHashChange);
+				return () => window.removeEventListener("hashchange", onHashChange);
+			}, []);
 			if (railBox === null || marks.length < MIN_MARKS) return null;
-			const jump = (key) => {
-				findRow(key)?.scrollIntoView({
-					behavior: "smooth",
-					block: "start"
-				});
-			};
 			const updateQuery = (query) => {
 				setSearch({
 					query,
@@ -1208,11 +1632,15 @@ window.__ModuleLoader__.load({
 					pointerEvents: "auto",
 					zIndex: 100,
 					display: "flex",
-					flexDirection: "column"
+					flexDirection: "column",
+					gap: 6,
+					paddingTop: 6
 				},
 				"aria-label": t("rail.label"),
+				"data-focus-active": focusActive ? "true" : void 0,
 				children: [
 					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("style", { children: BADGE_PULSE_CSS }),
+					focusActive && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("style", { children: FOCUS_CSS }),
 					showLoadOlder && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 						type: "button",
 						"data-load-older": true,
@@ -1235,7 +1663,7 @@ window.__ModuleLoader__.load({
 							padding: 0,
 							cursor: loadingOlder ? "default" : "pointer",
 							color: loadingOlder ? "#5a6375" : "#8b96ab",
-							fontSize: 11,
+							fontSize: 13,
 							lineHeight: 1,
 							letterSpacing: 1
 						},
@@ -1262,8 +1690,8 @@ window.__ModuleLoader__.load({
 							color: bookmarksOnly ? "#9db8ff" : "#8b96ab"
 						},
 						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
-							width: "13",
-							height: "13",
+							width: "16",
+							height: "16",
 							viewBox: "0 0 24 24",
 							fill: bookmarksOnly ? "currentColor" : "none",
 							stroke: "currentColor",
@@ -1273,6 +1701,122 @@ window.__ModuleLoader__.load({
 							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "m12 2 3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z" })
 						})
 					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						"data-focus-toggle": true,
+						"aria-label": focusActive ? t("focus.off") : t("focus.on"),
+						title: focusActive ? t("focus.off") : t("focus.on"),
+						"aria-pressed": focusActive,
+						onClick: () => setFocusActive((v) => !v),
+						style: {
+							width: DOT_HIT,
+							height: DOT_HIT,
+							flexShrink: 0,
+							display: "flex",
+							alignItems: "center",
+							justifyContent: "center",
+							background: focusActive ? "rgba(126, 226, 168, 0.14)" : "transparent",
+							border: "none",
+							padding: 0,
+							cursor: "pointer",
+							color: focusActive ? "#7ee2a8" : "#8b96ab"
+						},
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+							width: "16",
+							height: "16",
+							viewBox: "0 0 24 24",
+							fill: "none",
+							stroke: "currentColor",
+							strokeWidth: "2",
+							strokeLinecap: "round",
+							strokeLinejoin: "round",
+							"aria-hidden": "true",
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7z" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+								cx: "12",
+								cy: "12",
+								r: "3"
+							})]
+						})
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						"data-list-toggle": true,
+						"aria-label": listOpen ? t("list.close") : t("list.open"),
+						title: listOpen ? t("list.close") : t("list.open"),
+						"aria-pressed": listOpen,
+						onClick: () => setListOpen((v) => !v),
+						style: {
+							width: DOT_HIT,
+							height: DOT_HIT,
+							flexShrink: 0,
+							display: "flex",
+							alignItems: "center",
+							justifyContent: "center",
+							background: listOpen ? "rgba(77, 124, 254, 0.18)" : "transparent",
+							border: "none",
+							padding: 0,
+							cursor: "pointer",
+							color: listOpen ? "#9db8ff" : "#8b96ab"
+						},
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+							width: "16",
+							height: "16",
+							viewBox: "0 0 24 24",
+							fill: "none",
+							stroke: "currentColor",
+							strokeWidth: "2.5",
+							strokeLinecap: "round",
+							"aria-hidden": "true",
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M3 6h18" }),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M3 12h18" }),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M3 18h18" })
+							]
+						})
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						"data-session-search-toggle": true,
+						"aria-label": crossOpen ? t("search.cross.close") : t("search.cross.open"),
+						title: crossOpen ? t("search.cross.close") : t("search.cross.open"),
+						"aria-pressed": crossOpen,
+						onClick: () => setCrossOpen((v) => !v),
+						style: {
+							width: DOT_HIT,
+							height: DOT_HIT,
+							flexShrink: 0,
+							display: "flex",
+							alignItems: "center",
+							justifyContent: "center",
+							background: crossOpen ? "rgba(77, 124, 254, 0.18)" : "transparent",
+							border: "none",
+							padding: 0,
+							cursor: "pointer",
+							color: crossOpen ? "#9db8ff" : "#8b96ab"
+						},
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+							width: "16",
+							height: "16",
+							viewBox: "0 0 24 24",
+							fill: "none",
+							stroke: "currentColor",
+							strokeWidth: "2",
+							strokeLinecap: "round",
+							strokeLinejoin: "round",
+							"aria-hidden": "true",
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M3 6h9" }),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M3 12h9" }),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M3 18h9" }),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+									cx: "17",
+									cy: "7",
+									r: "3.5"
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "m19.5 9.5 2.5 2.5" })
+							]
+						})
+					}),
 					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(RailSearchUi, {
 						panelTop: railBox.top,
 						panelRight: railBox.right + DOT_HIT + 8,
@@ -1289,6 +1833,21 @@ window.__ModuleLoader__.load({
 						onClear: clearSearch,
 						t
 					}),
+					listOpen && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MilestoneListPanel, {
+						panelTop: railBox.top,
+						panelRight: railBox.right + DOT_HIT + 8,
+						marks,
+						onJump: jump,
+						t
+					}),
+					crossOpen && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MilestoneSessionSearch, {
+						panelTop: railBox.top,
+						panelRight: railBox.right + DOT_HIT + 8,
+						onClose: () => setCrossOpen(false),
+						searchSessions,
+						openSession,
+						t
+					}),
 					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 						ref: listRef,
 						"data-rail-list": true,
@@ -1421,7 +1980,7 @@ window.__ModuleLoader__.load({
 							right: "100%",
 							marginRight: 8,
 							whiteSpace: "nowrap",
-							fontSize: 10,
+							fontSize: 12,
 							lineHeight: 1,
 							color: "rgba(139, 150, 171, 0.9)",
 							pointerEvents: "none",
@@ -1465,6 +2024,46 @@ window.__ModuleLoader__.load({
 		//#endregion
 		//#region src/client/railInject.ts
 		/**
+		* Wrap the `session.search` RPC into a safe cross-session search action.
+		*
+		* - `ok: true` unwraps the value and joins each hit's human display title
+		*   from the session list snapshot (a session outside the list keeps no
+		*   title — the caller falls back to `search.untitled`).
+		* - `ok: false` throws `new Error(error.message)` so the caller can surface
+		*   the business/transport error as the `search.error` state.
+		* - A rejected RPC propagates unchanged.
+		*
+		* The list read happens inside the returned closure (never at factory time),
+		* so the title join always reflects the current list snapshot.
+		*
+		* @param sessions - the injected sessions service (`ctx.sessions`).
+		* @returns an action that searches all sessions' message content.
+		*/
+		function createSessionSearch(sessions) {
+			return async (query, signal) => {
+				const result = await sessions.search(query, signal);
+				if (!result.ok) throw new Error(result.error.message);
+				const byId = sessions.list.getSnapshot().byId;
+				return {
+					items: result.value.items.map((item) => ({
+						...item,
+						title: byId[item.sessionId]?.displayTitle
+					})),
+					hasMore: result.value.hasMore
+				};
+			};
+		}
+		/**
+		* Wrap a session `open` call into a safe action that selects a listed session
+		* as current — the exact selection path the sidebar uses on click.
+		*
+		* @param sessions - the injected sessions service (`ctx.sessions`).
+		* @returns an action that opens the given session.
+		*/
+		function createOpenSession(sessions) {
+			return (id) => sessions.open(id);
+		}
+		/**
 		* Wrap a session-bound `loadOlder` call into a safe action closure.
 		*
 		* - Missing binding: resolves (never throws on an unlisted/unscoped session).
@@ -1530,6 +2129,10 @@ window.__ModuleLoader__.load({
 			"search.label": "搜索消息",
 			/** aria-label on the bookmarks-only filter toggle. */
 			"bookmark.filter": "只看收藏",
+			/** aria-label + title on the focus-mode toggle when focus is OFF (arm it). */
+			"focus.on": "聚焦模式",
+			/** aria-label + title on the focus-mode toggle when focus is ON (disarm it). */
+			"focus.off": "退出聚焦",
 			/** aria-label on the hover tooltip star toggle. */
 			"bookmark.star": "收藏此消息",
 			/** aria-label on the search clear button. */
@@ -1573,7 +2176,25 @@ window.__ModuleLoader__.load({
 			/** Collapse-turn tooltip action. */
 			"collapse.turn": "折叠此轮",
 			/** Expand-turn tooltip action. */
-			"expand.turn": "展开此轮"
+			"expand.turn": "展开此轮",
+			/** aria-label + title on the milestone-list toggle when the panel is CLOSED. */
+			"list.open": "打开列表",
+			/** aria-label + title on the milestone-list toggle when the panel is OPEN. */
+			"list.close": "收起列表",
+			/** Header title of the all-prompts list panel. */
+			"list.label": "全部提问",
+			/** Header title + input placeholder of the cross-session search panel. */
+			"search.cross": "跨会话搜索",
+			/** aria-label + title on the cross-session search toggle when the panel is CLOSED. */
+			"search.cross.open": "打开跨会话搜索",
+			/** aria-label + title on the cross-session search toggle when the panel is OPEN. */
+			"search.cross.close": "收起跨会话搜索",
+			/** Cross-session result row title fallback for sessions with no display title. */
+			"search.untitled": "（无标题）",
+			/** Cross-session search failure notice. */
+			"search.error": "搜索失败，请重试",
+			/** Cross-session search footer hint when the harness capped the result list. */
+			"search.more": "结果已截断，请细化关键词"
 		};
 		const en = {
 			"jump.to": "Jump to message {n}",
@@ -1583,6 +2204,8 @@ window.__ModuleLoader__.load({
 			"search.placeholder": "Search message content",
 			"search.label": "Search messages",
 			"bookmark.filter": "Bookmarks only",
+			"focus.on": "Focus mode",
+			"focus.off": "Exit focus",
 			"bookmark.star": "Bookmark this message",
 			"search.clear": "Clear search",
 			"load.older": "Load older messages",
@@ -1604,7 +2227,16 @@ window.__ModuleLoader__.load({
 			"copy.message": "Copy message",
 			"fork.here": "Fork from here",
 			"collapse.turn": "Collapse turn",
-			"expand.turn": "Expand turn"
+			"expand.turn": "Expand turn",
+			"list.open": "Open list",
+			"list.close": "Close list",
+			"list.label": "All prompts",
+			"search.cross": "Cross-session search",
+			"search.cross.open": "Open cross-session search",
+			"search.cross.close": "Close cross-session search",
+			"search.untitled": "(untitled)",
+			"search.error": "Search failed, retry",
+			"search.more": "Results truncated — refine your query"
 		};
 		//#endregion
 		//#region src/client/index.ts
@@ -1641,7 +2273,9 @@ window.__ModuleLoader__.load({
 				locale: "dsh-milestone",
 				inject: (sessionId) => ({
 					loadOlder: createLoadOlder(ctx.sessions, sessionId),
-					forkAt: createForkAt(ctx.sessions, sessionId)
+					forkAt: createForkAt(ctx.sessions, sessionId),
+					searchSessions: createSessionSearch(ctx.sessions),
+					openSession: createOpenSession(ctx.sessions)
 				})
 			}, MilestoneRail));
 		}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-milestone",
-  "version": "0.5.0",
+  "version": "0.6.0",
   "description": "Git-style milestone timeline for DeepSeek Harness: hover for metadata, click to jump to any message. 会话里程碑导航条：圆点时间线，定位并跳转到每条提问。",
   "type": "module",
   "main": "lib/index.js",