dsh-mega-chat-nav 0.1.1

package/lib/client/components/deepseek/DeepseekRail.js

@@ -0,0 +1,264 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { memo, useEffect, useRef, useState } from 'react';
+import { useMarkerData, usePinning, useReadingSpy, useFailureNotice, useLoadingNotice, useFavorites, useMobileMode, useMobileSearchButton, useNavSettings, clockText } from "../rail/useRail.js";
+import { Hint } from "../rail/hint.js";
+import { fetchHits } from "../rail/search.js";
+import { QuickSettings } from "../rail/quick-settings.js";
+import { BAND_HEIGHT_PX } from "../../settings.js";
+/** deepseek 消息行高（px）：行高 30px = 行距几何（文字 14px） */
+const DS_ROW_HEIGHT = 30;
+/** 消息行：行首横线（hover 变收藏按钮）+ 用户消息单行预览 */
+const DsRow = memo(function DsRow(props) {
+    const { marker, current, jumping, hovered, favorited, label, onHover, onLeave, onToggleFavorite, onJump } = props;
+    const cls = ['mgcn-dsRow'];
+    if (current)
+        cls.push('mgcn-dsCurrent');
+    if (jumping)
+        cls.push('mgcn-dsJump');
+    if (hovered)
+        cls.push('mgcn-dsRowHover');
+    return (_jsxs("div", { className: cls.join(' '), "data-mega-chat-nav-key": marker.key, onMouseEnter: onHover, onMouseLeave: onLeave, children: [hovered ? (_jsx("button", { type: "button", className: favorited ? 'mgcn-dsFav mgcn-dsFavOn' : 'mgcn-dsFav', "aria-label": favorited ? 'unfavorite' : 'favorite', onClick: (e) => { e.stopPropagation(); onToggleFavorite(); }, children: _jsx("svg", { viewBox: "0 0 16 16", width: "11", height: "11", "aria-hidden": "true", children: _jsx("path", { d: "M8 2.2l1.76 3.56 3.93.57-2.84 2.77.67 3.91L8 11.4l-3.52 1.85.67-3.91-2.84-2.77 3.93-.57z", fill: favorited ? 'currentColor' : 'none', stroke: "currentColor", strokeWidth: "1.4", strokeLinejoin: "round" }) }) })) : (_jsx("i", { className: "mgcn-dsMark", "aria-hidden": "true" })), _jsx("button", { type: "button", className: "mgcn-dsText", "aria-label": label, onClick: onJump, children: _jsx("span", { className: "mgcn-dsTextInner", children: marker.texts[0] ?? '' }) })] }));
+});
+/** 就地搜索结果行（点击跳转） */
+function SearchHitRow(props) {
+    const { hit, onJump } = props;
+    const roleTag = hit.role === 'assistant' ? '助手' : hit.role === 'tool' ? '工具' : '用户';
+    return (_jsxs("button", { type: "button", className: "mgcn-dsHit", onClick: onJump, children: [_jsx("i", { className: "mgcn-dsMark", "aria-hidden": "true" }), _jsxs("span", { className: "mgcn-dsHitBody", children: [_jsxs("span", { className: "mgcn-dsHitMeta", children: [hit.turn > 0 ? _jsxs("span", { children: ["\u7B2C ", hit.turn, " \u8F6E"] }) : null, _jsx("span", { className: 'mgcn-dsHitTag mgcn-dsHitTag--' + hit.role, children: roleTag })] }), _jsx("span", { className: "mgcn-dsHitText", children: hit.hitStart >= 0 && hit.hitLen > 0 ? (_jsxs(_Fragment, { children: [hit.snippet.slice(0, hit.hitStart), _jsx("mark", { className: "mgcn-search-mark", children: hit.snippet.slice(hit.hitStart, hit.hitStart + hit.hitLen) }), hit.snippet.slice(hit.hitStart + hit.hitLen)] })) : hit.snippet })] })] }));
+}
+/** 阅读位置跟随：正文滚动时面板内当前行平滑居中。
+ *  resetKey：外部事件计数（退出搜索 searchOpen / 鼠标离开 rail followTick），
+ *  变化时强制重新居中到当前行——即使 currentKey/markers 未变也执行一次跟随。 */
+function useFollowCurrent(listRef, currentKey, markers, resetKey) {
+    useEffect(() => {
+        const list = listRef.current;
+        if (list === null || currentKey === null)
+            return;
+        const index = markers.findIndex((d) => d.key === currentKey);
+        if (index < 0)
+            return;
+        const slotTop = index * DS_ROW_HEIGHT;
+        const contentHeight = markers.length * DS_ROW_HEIGHT + 12;
+        const maxScroll = Math.max(0, contentHeight - list.clientHeight);
+        const target = Math.max(0, Math.min(slotTop - list.clientHeight / 2 + DS_ROW_HEIGHT / 2, maxScroll));
+        if (Math.abs(target - list.scrollTop) < 2)
+            return;
+        list.scrollTo({ top: target, behavior: 'smooth' });
+    }, [currentKey, markers, resetKey]);
+}
+export function DeepseekRail(props) {
+    const { injected, useSessions, t } = props;
+    const panelRef = useRef(null);
+    const listRef = useRef(null);
+    const searchInputRef = useRef(null);
+    const [open, setOpen] = useState(false); // JS hover 展开态（不用 CSS :hover）
+    const [jumpingKey, setJumpingKey] = useState(null);
+    const [searchOpen, setSearchOpen] = useState(false);
+    const [configOpen, setConfigOpen] = useState(false);
+    const [favFilter, setFavFilter] = useState(false);
+    const [hoverKey, setHoverKey] = useState(null);
+    const [drawerOpen, setDrawerOpen] = useState(false);
+    const closeTimer = useRef(null);
+    const [query, setQuery] = useState('');
+    const [results, setResults] = useState([]);
+    const [searching, setSearching] = useState(false); // 检索进行中（列表 loading 态）
+    // 鼠标离开导航区域触发一次跟随：并入 resetKey 使跟随 effect 重跑（几何复用，无新增计算）
+    const [followTick, setFollowTick] = useState(0);
+    const abortRef = useRef(null);
+    const debounceRef = useRef(null);
+    const mobile = useMobileMode();
+    const { sessionId, visible, markers } = useMarkerData(injected, useSessions);
+    const { favorites, toggle: toggleFavorite } = useFavorites(sessionId);
+    const settings = useNavSettings(injected);
+    const { align, bandHeight } = settings;
+    useMobileSearchButton(() => setDrawerOpen(true), mobile && markers.length > 0, align, t('search.placeholder'));
+    const effectiveFilter = favFilter && favorites.size > 0;
+    const displayMarkers = effectiveFilter
+        ? markers.filter((m) => m.members.some((k) => favorites.has(k)))
+        : markers;
+    usePinning(panelRef, visible, align, settings.railOffset, sessionId);
+    const [currentKey, forceKey] = useReadingSpy(visible, displayMarkers);
+    const hint = useFailureNotice(t);
+    const loading = useLoadingNotice(t);
+    useFollowCurrent(listRef, currentKey, displayMarkers, String(searchOpen) + ':' + followTick);
+    // 一键复位：收起面板并关闭全部就地模式（搜索/设置/收藏筛选），列表还原
+    const collapseToIdle = () => {
+        cancelClose();
+        setOpen(false);
+        setHoverKey(null);
+        setSearchOpen(false);
+        setQuery('');
+        setResults([]);
+        setSearching(false);
+        if (debounceRef.current !== null) {
+            window.clearTimeout(debounceRef.current);
+            debounceRef.current = null;
+        }
+        abortRef.current?.abort();
+        setConfigOpen(false);
+        setFavFilter(false);
+    };
+    // 展开/收起 JS 状态：进入即开，离开延迟 260ms 收。
+    // 就地模式（搜索/设置）开启时移出**不收起**——只有点击外部才关闭。
+    const cancelClose = () => {
+        if (closeTimer.current !== null) {
+            window.clearTimeout(closeTimer.current);
+            closeTimer.current = null;
+        }
+    };
+    const scheduleClose = () => {
+        cancelClose();
+        if (searchOpen || configOpen || effectiveFilter)
+            return;
+        closeTimer.current = window.setTimeout(() => {
+            closeTimer.current = null;
+            collapseToIdle();
+        }, 260);
+    };
+    // 复位函数经 ref 提供给稳定的全局监听（点击外部）
+    const collapseToIdleRef = useRef(collapseToIdle);
+    collapseToIdleRef.current = collapseToIdle;
+    // 点击外部（rail 及就地浮层之外）：收起面板并复位全部就地状态
+    useEffect(() => {
+        const onDocPointerDown = (e) => {
+            const panel = panelRef.current;
+            if (panel === null)
+                return;
+            const t = e.target;
+            if (t instanceof Node && panel.contains(t))
+                return;
+            collapseToIdleRef.current?.();
+        };
+        document.addEventListener('pointerdown', onDocPointerDown, true);
+        return () => document.removeEventListener('pointerdown', onDocPointerDown, true);
+    }, []);
+    // 卸载清理
+    useEffect(() => () => {
+        if (closeTimer.current !== null)
+            window.clearTimeout(closeTimer.current);
+        if (debounceRef.current !== null)
+            window.clearTimeout(debounceRef.current);
+        abortRef.current?.abort();
+    }, []);
+    // 搜索：就地输入防抖 → host 检索（进行中列表进入 loading 态）
+    const runSearch = (raw) => {
+        abortRef.current?.abort();
+        const ac = new AbortController();
+        abortRef.current = ac;
+        const q = raw.trim();
+        if (q.length < 1) {
+            setResults([]);
+            setSearching(false);
+            return;
+        }
+        setSearching(true);
+        fetchHits(sessionId, q, settings.searchScopes, ac.signal)
+            .then((hits) => {
+            if (abortRef.current !== ac)
+                return;
+            setResults(hits);
+            setSearching(false);
+        })
+            .catch(() => { if (abortRef.current === ac)
+            setSearching(false); });
+    };
+    const onSearchInput = (value) => {
+        setQuery(value);
+        if (debounceRef.current !== null)
+            window.clearTimeout(debounceRef.current);
+        if (value.trim() === '') {
+            // 清空：取消在途检索并还原列表（不再等防抖）
+            debounceRef.current = null;
+            abortRef.current?.abort();
+            setResults([]);
+            setSearching(false);
+            return;
+        }
+        setSearching(true); // 输入即 loading（含防抖窗口），结果到达后熄灭
+        // 250ms 防抖：连续输入只触发一次检索
+        debounceRef.current = window.setTimeout(() => {
+            debounceRef.current = null;
+            runSearch(value);
+        }, 250);
+    };
+    const openSearch = () => {
+        cancelClose();
+        setConfigOpen(false);
+        setFavFilter(false); // 搜索替代收藏筛选：全量历史检索
+        setSearchOpen(true);
+        setOpen(true); // 搜索就地态要求面板保持展开（移出不收）
+        window.setTimeout(() => searchInputRef.current?.focus(), 30);
+    };
+    // 收藏行切换：筛选态下取消「最后一个收藏」→ 自动退出收藏模式
+    // （再点行收藏只 +1 收藏，不再自动进入筛选；需点操作栏 ⭐ 才重新进入）
+    const onToggleRowFavorite = (key) => {
+        const removingLast = effectiveFilter && favorites.size === 1 && favorites.has(key);
+        toggleFavorite(key);
+        if (removingLast)
+            setFavFilter(false);
+    };
+    const closeSearch = () => {
+        cancelClose();
+        setSearchOpen(false);
+        setQuery('');
+        setResults([]);
+        setSearching(false);
+        if (debounceRef.current !== null) {
+            window.clearTimeout(debounceRef.current);
+            debounceRef.current = null;
+        }
+        abortRef.current?.abort();
+        // 还原时指针已不在 rail 上 → 一并收起；仍在 rail 上则保持展开
+        if (panelRef.current !== null && !panelRef.current.matches(':hover')) {
+            setOpen(false);
+            setHoverKey(null);
+        }
+    };
+    // ⚙：消息面板收起（还原未 hover 的窄轨）+ 弹出通用设置浮层（rail 对话侧）
+    const toggleConfig = () => {
+        cancelClose();
+        if (configOpen) {
+            setConfigOpen(false);
+            setHoverKey(null);
+            // 点击浮层 ✕/外部后若指针已离开 rail 区域则整体收起
+            if (panelRef.current !== null && !panelRef.current.matches(':hover')) {
+                setOpen(false);
+            }
+            return;
+        }
+        closeSearch();
+        setOpen(false);
+        setHoverKey(null);
+        setConfigOpen(true);
+    };
+    if (!visible || injected === undefined || markers.length === 0)
+        return null;
+    const onJump = (row) => {
+        if (sessionId === undefined)
+            return;
+        setJumpingKey(row.key);
+        forceKey(row.key);
+        const currentMarker = currentKey === null ? undefined : displayMarkers.find((m) => m.key === currentKey);
+        injected.jump(sessionId, row.key, row.seq, currentMarker?.seq);
+        window.setTimeout(() => setJumpingKey((k) => (k === row.key ? null : k)), 600);
+    };
+    const onJumpHit = (hit) => {
+        if (sessionId === undefined)
+            return;
+        setJumpingKey(hit.key);
+        forceKey(hit.key);
+        injected.jump(sessionId, hit.key, hit.seq);
+        window.setTimeout(() => setJumpingKey((k) => (k === hit.key ? null : k)), 600);
+    };
+    if (mobile) {
+        return (_jsx(_Fragment, { children: drawerOpen ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "mgcn-drawerMask", onClick: () => setDrawerOpen(false) }), _jsxs("div", { className: "mgcn-searchDrawer", role: "dialog", "aria-label": t('search.placeholder'), children: [_jsx("div", { className: "mgcn-drawerInput", children: _jsx("input", { className: "mgcn-search-input", value: query, placeholder: t('search.placeholder'), autoFocus: true, onChange: (e) => onSearchInput(e.target.value), onKeyDown: (e) => { if (e.key === 'Escape')
+                                        setDrawerOpen(false); } }) }), query.trim() === '' ? (_jsx("div", { className: "mgcn-drawerList", children: [...markers].reverse().slice(0, 20).map((m) => (_jsxs("button", { type: "button", className: "mgcn-drawerItem", onClick: () => { setDrawerOpen(false); onJump(m); }, children: [_jsxs("span", { className: "mgcn-drawerItemTitle", children: [_jsx("span", { className: "mgcn-drawerItemTurn", children: m.turn !== null ? 'Turn ' + m.turn : '' }), _jsx("span", { className: "mgcn-drawerItemTime", children: clockText(m.time, Date.now()) })] }), _jsx("span", { className: "mgcn-drawerItemText", children: m.texts[0] ?? '' })] }, m.key))) })) : searching ? (_jsx("div", { className: "mgcn-drawerList", children: _jsxs("div", { className: "mgcn-dsLoadingRow", role: "status", children: [_jsxs("span", { className: "mgcn-dsLoadingDots", "aria-hidden": "true", children: [_jsx("i", {}), _jsx("i", {}), _jsx("i", {})] }), _jsx("span", { children: t('search.loading') })] }) })) : (_jsxs("div", { className: "mgcn-drawerList", children: [results.map((hit) => (_jsx(SearchHitRow, { hit: hit, onJump: () => { setDrawerOpen(false); onJumpHit(hit); } }, hit.key + ':' + hit.seq))), results.length === 0 ? _jsx("div", { className: "mgcn-dsNoHit", children: t('search.empty') }) : null] }))] })] })) : null }));
+    }
+    const messagesBody = (scrollable) => (_jsx("div", { ref: scrollable ? listRef : undefined, className: "mgcn-dsList", children: displayMarkers.map((row) => (_jsx(DsRow, { marker: row, current: currentKey === row.key, jumping: jumpingKey === row.key, hovered: hoverKey === row.key, favorited: favorites.has(row.key), label: row.texts[0] ?? '', onHover: () => setHoverKey(row.key), onLeave: () => setHoverKey((k) => (k === row.key ? null : k)), onToggleFavorite: () => onToggleRowFavorite(row.key), onJump: () => onJump(row) }, row.key))) }));
+    return (_jsxs("div", { ref: panelRef, className: (align === 'right' ? 'mgcn-rail mgcn-dsRail mgcn-railRight' : 'mgcn-rail mgcn-dsRail')
+            + (open ? ' mgcn-dsOpen' : '')
+            + (configOpen ? ' mgcn-dsSnap' : '') // 设置浮层开启：rail 收起窄轨（无过渡、层级抬升）
+        , "data-mega-chat-nav": "rail", onMouseEnter: () => { cancelClose(); if (!configOpen)
+            setOpen(true); }, onMouseLeave: () => { setFollowTick((n) => n + 1); scheduleClose(); }, children: [_jsx("div", { className: "mgcn-queue", children: displayMarkers.length === 0 ? (_jsx("div", { className: "mgcn-empty", children: t('strip.empty') })) : (_jsxs("div", { className: "mgcn-list", style: { '--mgcn-band-height': BAND_HEIGHT_PX.deepseek[bandHeight] + 'px' }, children: [_jsxs("div", { role: "menu", className: "mgcn-dsPanel", children: [_jsxs("div", { className: "mgcn-dsHead", children: [settings.showSearch !== 'hide' ? (searchOpen ? (_jsxs(_Fragment, { children: [_jsx("button", { type: "button", className: "mgcn-config-gear mgcn-dsModeOn", "aria-label": t('search.placeholder'), onClick: closeSearch, children: _jsxs("svg", { className: "mgcn-btn-icon", viewBox: "0 0 16 16", width: "13", height: "13", "aria-hidden": "true", children: [_jsx("circle", { cx: "7", cy: "7", r: "4.5", fill: "none", stroke: "currentColor", strokeWidth: "1.6" }), _jsx("line", { x1: "10.4", y1: "10.4", x2: "14", y2: "14", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round" })] }) }), _jsx("input", { ref: searchInputRef, className: "mgcn-dsSearchInput", value: query, placeholder: t('search.placeholder'), onChange: (e) => onSearchInput(e.target.value), onKeyDown: (e) => { if (e.key === 'Escape')
+                                                        closeSearch(); } })] })) : (_jsx("button", { type: "button", className: "mgcn-config-gear", "aria-label": t('search.placeholder'), onClick: openSearch, children: _jsxs("svg", { className: "mgcn-btn-icon", viewBox: "0 0 16 16", width: "13", height: "13", "aria-hidden": "true", children: [_jsx("circle", { cx: "7", cy: "7", r: "4.5", fill: "none", stroke: "currentColor", strokeWidth: "1.6" }), _jsx("line", { x1: "10.4", y1: "10.4", x2: "14", y2: "14", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round" })] }) }))) : null, !searchOpen && settings.showQuickSettings !== 'hide' ? (_jsx("button", { type: "button", className: configOpen ? 'mgcn-config-gear mgcn-dsModeOn' : 'mgcn-config-gear', "aria-label": t('config.title'), onClick: toggleConfig, children: _jsxs("svg", { className: "mgcn-btn-icon", viewBox: "0 0 24 24", width: "13", height: "13", "aria-hidden": "true", children: [_jsx("circle", { cx: "12", cy: "12", r: "3", fill: "none", stroke: "currentColor", strokeWidth: "1.7" }), _jsx("path", { d: "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinejoin: "round" })] }) })) : null, !searchOpen && settings.showFavorites !== 'hide' ? (_jsx("button", { type: "button", className: effectiveFilter ? 'mgcn-config-gear mgcn-favFilterOn' : 'mgcn-config-gear', "aria-label": t('fav.filter'), onClick: () => { if (favorites.size > 0)
+                                                setFavFilter((v) => !v); }, children: _jsx("svg", { className: "mgcn-btn-icon", viewBox: "0 0 16 16", width: "13", height: "13", "aria-hidden": "true", children: _jsx("path", { d: "M8 2.2l1.76 3.56 3.93.57-2.84 2.77.67 3.91L8 11.4l-3.52 1.85.67-3.91-2.84-2.77 3.93-.57z", fill: favFilter ? 'currentColor' : 'none', stroke: "currentColor", strokeWidth: "1.3", strokeLinejoin: "round" }) }) })) : null, !searchOpen && settings.showCount !== 'hide' ? (_jsx("span", { className: "mgcn-count", children: displayMarkers.length })) : null] }), searchOpen ? (_jsx("div", { className: "mgcn-dsMode", children: query.trim() === '' ? (messagesBody(false)) : searching ? (_jsxs("div", { className: "mgcn-dsLoadingRow", role: "status", children: [_jsxs("span", { className: "mgcn-dsLoadingDots", "aria-hidden": "true", children: [_jsx("i", {}), _jsx("i", {}), _jsx("i", {})] }), _jsx("span", { children: t('search.loading') })] })) : (_jsxs("div", { className: "mgcn-dsList", children: [results.map((hit) => (_jsx(SearchHitRow, { hit: hit, onJump: () => onJumpHit(hit) }, hit.key + ':' + hit.seq))), results.length === 0 ? _jsx("div", { className: "mgcn-dsNoHit", children: t('search.empty') }) : null] })) })) : (messagesBody(true))] }), configOpen ? (_jsx("span", { className: 'mgcn-gear-wrap mgcn-gear-wrap--' + align + ' mgcn-dsFloat', children: _jsx(QuickSettings, { injected: injected, t: t, onClose: () => { cancelClose(); setConfigOpen(false); setHoverKey(null); } }) })) : null] })) }), loading !== null ? _jsx(Hint, { text: loading, align: align, position: "bottom", loading: true }) : hint !== null ? _jsx(Hint, { text: hint, align: align }) : null] }));
+}

package/lib/client/components/minimal/MinimalRail.js

@@ -0,0 +1,135 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from 'react';
+import { useMarkerData, usePinning, useReadingSpy, useBandPaging, useCardPreview, useFailureNotice, useLoadingNotice, useFavorites, useMobileMode, useMobileSearchButton, useNavSettings, clockText, markerScale, markerTier, ROW_HEIGHT, usePeekState, useClosePopoversOnOutside } from "../rail/useRail.js";
+import { Dot } from "./dot.js";
+import { Cards } from "../rail/cards.js";
+import { PagingButton } from "../rail/paging.js";
+import { Hint } from "../rail/hint.js";
+import { SearchBox } from "../rail/search.js";
+import { QuickSettings } from "../rail/quick-settings.js";
+import { STYLE_CAPABILITIES, BAND_HEIGHT_PX } from "../../settings.js";
+export function MinimalRail(props) {
+    const { injected, useSessions, t } = props;
+    const panelRef = useRef(null);
+    const listRef = useRef(null);
+    const [jumpingKey, setJumpingKey] = useState(null);
+    const [configOpen, setConfigOpen] = useState(false);
+    const [searchOpen, setSearchOpen] = useState(false);
+    const [favFilter, setFavFilter] = useState(false);
+    const [drawerOpen, setDrawerOpen] = useState(false);
+    // 鼠标离开导航区域触发一次跟随：仅作 effect 重跑计数（跟随几何复用下方 effect）
+    const [followTick, setFollowTick] = useState(0);
+    const { showPeek, hidePeek, peekCls } = usePeekState();
+    // 上次 hover 命中的圆点 key（同一圆点内 mouseover 高频触发不重复开卡）
+    const lastHoverKey = useRef(null);
+    // 手机模式（<1024px）：仅搜索图标 + 底部半宽搜索抽屉
+    const mobile = useMobileMode();
+    // 数据与设置
+    const { sessionId, visible, markers } = useMarkerData(injected, useSessions);
+    const { favorites, toggle: toggleFavorite } = useFavorites(sessionId);
+    const settings = useNavSettings(injected);
+    const { style, align, bandHeight, cardCount, cardItems, showPaging } = settings;
+    useMobileSearchButton(() => setDrawerOpen(true), mobile && markers.length > 0, align, t('search.placeholder'));
+    // 收藏过滤：派生状态——无收藏数据时自动视为未过滤
+    // （取消最后一个收藏立即恢复全部列表，不会困在空过滤态）
+    const effectiveFilter = favFilter && favorites.size > 0;
+    const displayMarkers = effectiveFilter
+        ? markers.filter((m) => m.members.some((k) => favorites.has(k)))
+        : markers;
+    // 布局钉位（含导航栏偏移；sessionId 变化 → 校准循环重启，覆盖会话/工作区切换重建）
+    usePinning(panelRef, visible, align, settings.railOffset, sessionId);
+    const [currentKey, forceKey] = useReadingSpy(visible, displayMarkers);
+    const { scrollable, revealed, syncScroll, pageBy, canPageUp, canPageDown } = useBandPaging(listRef, displayMarkers);
+    // 悬浮卡片（风格能力）
+    const caps = STYLE_CAPABILITIES[style];
+    const focusRadius = Math.floor((cardCount - 1) / 2);
+    const { focus, openCards, cancelClear, scheduleClear } = useCardPreview(displayMarkers, align, focusRadius, caps.hoverCards);
+    // 跳转失败提示 / 加载较早记录提示
+    const hint = useFailureNotice(t);
+    const loading = useLoadingNotice(t);
+    useClosePopoversOnOutside(configOpen, searchOpen, () => {
+        setConfigOpen(false);
+        setSearchOpen(false);
+    });
+    // 激活节点跟随：正文滚动时导航列表平滑居中（点击跳转后不冻结）
+    useEffect(() => {
+        const list = listRef.current;
+        if (list === null || currentKey === null)
+            return;
+        const index = displayMarkers.findIndex((d) => d.key === currentKey);
+        if (index < 0)
+            return;
+        const step = ROW_HEIGHT; // 行距 14px（8px 节点 + 6px 间距，与 rail 层几何一致）
+        const dotTop = 8 + index * step; // 列表上内边距 8px + 节点位置
+        const contentHeight = 16 + displayMarkers.length * step - 6;
+        const maxScroll = Math.max(0, contentHeight - list.clientHeight);
+        const target = Math.max(0, Math.min(dotTop - list.clientHeight / 2 + step / 2, maxScroll));
+        if (Math.abs(target - list.scrollTop) < 2)
+            return;
+        list.scrollTo({ top: target, behavior: 'smooth' });
+    }, [currentKey, markers, followTick]); // followTick：鼠标离开 rail 时重跑一次跟随
+    if (!visible || injected === undefined || markers.length === 0)
+        return null;
+    const onJump = (dot) => {
+        if (sessionId === undefined)
+            return;
+        setJumpingKey(dot.key);
+        forceKey(dot.key); // 点击瞬间强制激活目标（正文滚动稳定后由采样判据接管）
+        const currentMarker = currentKey === null ? undefined : displayMarkers.find((m) => m.key === currentKey);
+        injected.jump(sessionId, dot.key, dot.seq, currentMarker?.seq);
+        window.setTimeout(() => setJumpingKey((k) => (k === dot.key ? null : k)), 600);
+    };
+    // 事件委托（圆点是 memo 纯展示）：hover 开悬浮卡 / 点击跳转。
+    // 用 onMouseOver（真实冒泡，圆点间移动每次触发）而非 onMouseEnter
+    // （容器级 mouseenter 只在从外部进入时触发一次——圆点间移动不会换卡）。
+    const onDotsOver = (e) => {
+        const el = e.target;
+        const hit = el.closest('[data-mega-chat-nav-key]');
+        if (hit === null)
+            return;
+        const key = hit.dataset.megaChatNavKey;
+        if (key === undefined || key === lastHoverKey.current)
+            return;
+        const dot = displayMarkers.find((d) => d.key === key);
+        if (dot === undefined)
+            return;
+        lastHoverKey.current = key;
+        cancelClear();
+        openCards(dot, hit);
+    };
+    const onDotsClick = (e) => {
+        const el = e.target;
+        const hit = el.closest('[data-mega-chat-nav-key]');
+        if (hit === null)
+            return;
+        const key = hit.dataset.megaChatNavKey;
+        const dot = displayMarkers.find((d) => d.key === key);
+        if (dot !== undefined)
+            onJump(dot);
+    };
+    if (mobile) {
+        return (_jsx(_Fragment, { children: drawerOpen ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "mgcn-drawerMask", onClick: () => setDrawerOpen(false) }), _jsx("div", { className: "mgcn-searchDrawer", role: "dialog", "aria-label": t('search.placeholder'), children: _jsx(SearchBox, { sessionId: sessionId, scopes: settings.searchScopes, t: t, onJump: (key, seq) => {
+                                setDrawerOpen(false);
+                                onJump({ key, seq: seq ?? 0, turn: null, time: Date.now(), texts: [], members: [key] });
+                            }, onClose: () => setDrawerOpen(false), emptyContent: _jsx("div", { className: "mgcn-drawerList", children: [...markers].reverse().slice(0, 20).map((m) => (_jsxs("button", { type: "button", className: "mgcn-drawerItem", onClick: () => { setDrawerOpen(false); onJump(m); }, children: [_jsxs("span", { className: "mgcn-drawerItemTitle", children: [_jsx("span", { className: "mgcn-drawerItemTurn", children: m.turn !== null ? 'Turn ' + m.turn : '' }), _jsx("span", { className: "mgcn-drawerItemTime", children: clockText(m.time, Date.now()) })] }), _jsx("span", { className: "mgcn-drawerItemText", children: m.texts[0] ?? '' })] }, m.key))) }) }) })] })) : null }));
+    }
+    const selectedIndex = focus === null ? -1 : displayMarkers.findIndex((d) => d.key === focus?.key);
+    return (_jsxs("div", { ref: panelRef, className: align === 'right' ? 'mgcn-rail mgcn-railRight' : 'mgcn-rail', "data-mega-chat-nav": "rail", onMouseEnter: showPeek, onMouseLeave: () => { hidePeek(); setFollowTick((n) => n + 1); }, children: [_jsx("div", { className: "mgcn-queue", children: displayMarkers.length === 0 ? (_jsx("div", { className: "mgcn-empty", children: t('strip.empty') })) : (_jsxs("div", { className: "mgcn-list", style: { '--mgcn-band-height': BAND_HEIGHT_PX.minimal[bandHeight] + 'px' }, children: [_jsxs("div", { className: "mgcn-actions", children: [settings.showQuickSettings !== 'hide' ? (_jsxs("span", { className: 'mgcn-gear-wrap mgcn-gear-wrap--' + align + peekCls(settings.showQuickSettings, configOpen), children: [_jsx("button", { type: "button", className: "mgcn-config-gear", "aria-label": t('config.title'), onClick: () => { setConfigOpen((v) => !v); setSearchOpen(false); }, children: _jsxs("svg", { className: "mgcn-btn-icon", viewBox: "0 0 24 24", width: "12", height: "12", "aria-hidden": "true", children: [_jsx("circle", { cx: "12", cy: "12", r: "3", fill: "none", stroke: "currentColor", strokeWidth: "1.7" }), _jsx("path", { d: "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinejoin: "round" })] }) }), configOpen ? (_jsx(QuickSettings, { injected: injected, t: t, onClose: () => setConfigOpen(false) })) : null] })) : null, settings.showFavorites !== 'hide' ? (_jsx("span", { className: 'mgcn-gear-wrap mgcn-gear-wrap--' + align + peekCls(settings.showFavorites, false), children: _jsx("button", { type: "button", className: effectiveFilter ? 'mgcn-config-gear mgcn-favFilterOn' : 'mgcn-config-gear', "aria-label": t('fav.filter'), onClick: () => { if (favorites.size > 0)
+                                            setFavFilter((v) => !v); }, children: _jsx("svg", { className: "mgcn-btn-icon", viewBox: "0 0 16 16", width: "12", height: "12", "aria-hidden": "true", children: _jsx("path", { d: "M8 2.2l1.76 3.56 3.93.57-2.84 2.77.67 3.91L8 11.4l-3.52 1.85.67-3.91-2.84-2.77 3.93-.57z", fill: favFilter ? 'currentColor' : 'none', stroke: "currentColor", strokeWidth: "1.3", strokeLinejoin: "round" }) }) }) })) : null, settings.showSearch !== 'hide' ? (_jsxs("span", { className: 'mgcn-gear-wrap mgcn-gear-wrap--' + align + peekCls(settings.showSearch, searchOpen), children: [_jsx("button", { type: "button", className: "mgcn-config-gear", "aria-label": t('search.placeholder'), onClick: () => { setSearchOpen((v) => !v); setConfigOpen(false); }, children: _jsxs("svg", { className: "mgcn-btn-icon", viewBox: "0 0 16 16", width: "12", height: "12", "aria-hidden": "true", children: [_jsx("circle", { cx: "7", cy: "7", r: "4.5", fill: "none", stroke: "currentColor", strokeWidth: "1.6" }), _jsx("line", { x1: "10.4", y1: "10.4", x2: "14", y2: "14", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round" })] }) }), searchOpen ? (_jsx(SearchBox, { sessionId: sessionId, scopes: settings.searchScopes, t: t, onJump: (key, seq) => onJump({ key, seq: seq ?? 0, turn: null, time: Date.now(), texts: [], members: [key] }), onClose: () => setSearchOpen(false) })) : null] })) : null, settings.showCount !== 'hide' ? (_jsx("span", { className: 'mgcn-count' + peekCls(settings.showCount, false), children: displayMarkers.length })) : null] }), scrollable && showPaging !== 'hide' ? (_jsx("div", { className: 'mgcn-pageUp' + peekCls(showPaging, false), children: _jsx(PagingButton, { dir: -1, visible: canPageUp, label: t('strip.up'), onEnter: cancelClear, onLeave: scheduleClear, onClick: () => pageBy(-1) }) })) : null, _jsx("div", { ref: listRef, className: "mgcn-dots", onScroll: syncScroll, onMouseLeave: () => { lastHoverKey.current = null; scheduleClear(); }, onMouseOver: onDotsOver, onClick: onDotsClick, children: displayMarkers.map((dot, index) => {
+                                const isFocused = focus !== null && focus.key === dot.key;
+                                const tier = selectedIndex < 0 ? null : markerTier(index - selectedIndex);
+                                const scale = jumpingKey === dot.key ? 1.6 : tier !== null ? markerScale(tier) : 1;
+                                const reveal = revealed?.get(dot.key);
+                                const cls = ['mgcn-dot'];
+                                if (isFocused)
+                                    cls.push('mgcn-focused');
+                                if (jumpingKey === dot.key)
+                                    cls.push('mgcn-active');
+                                if (currentKey === dot.key)
+                                    cls.push('mgcn-current');
+                                if (reveal !== undefined) {
+                                    cls.push(reveal.dir === 1 ? 'mgcn-dotEnterFromBottom' : 'mgcn-dotEnterFromTop');
+                                }
+                                return (_jsx(Dot, { keyName: dot.key, index: index, className: cls.join(' '), scale: scale, label: dot.texts[0] ?? '', focused: isFocused, revealed: reveal }, dot.key));
+                            }) }), scrollable && showPaging !== 'hide' ? (_jsx("div", { className: 'mgcn-pageDown' + peekCls(showPaging, false), children: _jsx(PagingButton, { dir: 1, visible: canPageDown, label: t('strip.down'), onEnter: cancelClear, onLeave: scheduleClear, onClick: () => pageBy(1) }) })) : null] })) }), loading !== null ? _jsx(Hint, { text: loading, align: align, position: "bottom", loading: true }) : hint !== null ? _jsx(Hint, { text: hint, align: align }) : null, focus !== null ? (_jsx(Cards, { focus: focus, align: align, cardItems: cardItems, favorites: favorites, onToggleFavorite: toggleFavorite, onJump: onJump, onEnter: cancelClear, onLeave: scheduleClear })) : null] }));
+}

package/lib/client/components/minimal/cards.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { createPortal } from 'react-dom';
+import { cardMetrics, metricsLine, clockText } from "./useRail.js";
+function favoriteButton(favorited, onClick) {
+    return (_jsx("button", { type: "button", className: favorited ? 'mgs-cardFav mgs-cardFavOn' : 'mgs-cardFav', "aria-label": favorited ? 'unfavorite' : 'favorite', onClick: (e) => { e.stopPropagation(); onClick(); }, children: _jsx("svg", { viewBox: "0 0 16 16", width: "11", height: "11", "aria-hidden": "true", children: _jsx("path", { d: "M8 2.2l1.76 3.56 3.93.57-2.84 2.77.67 3.91L8 11.4l-3.52 1.85.67-3.91-2.84-2.77 3.93-.57z", fill: favorited ? 'currentColor' : 'none', stroke: "currentColor", strokeWidth: "1.3", strokeLinejoin: "round" }) }) }));
+}
+export function Cards(props) {
+    const { focus, align, cardItems, favorites, onToggleFavorite, onJump, onEnter, onLeave } = props;
+    const showTurn = cardItems.includes('turn');
+    const showDuration = cardItems.includes('duration');
+    const showFavorite = cardItems.includes('favorite');
+    return createPortal(_jsx("div", { className: align === 'right' ? 'mgs-cascade mgs-cascadeRight' : 'mgs-cascade', style: {
+            ...(focus.left !== undefined ? { left: focus.left } : {}),
+            ...(focus.right !== undefined ? { right: focus.right } : {}),
+            top: focus.centerY,
+            transform: 'translateY(-50%)',
+        }, onMouseEnter: onEnter, onMouseLeave: onLeave, children: focus.items.map((item) => {
+            const metrics = cardMetrics(item.distance);
+            if (metrics === null)
+                return null;
+            const isSelected = item.distance === 0;
+            const dot = item.dot;
+            const text = dot.texts.join(' · ');
+            const cls = isSelected
+                ? 'mgs-card mgs-cardSelected' + (align === 'right' ? ' mgs-cardSelectedRight' : '')
+                : 'mgs-card';
+            const favorited = favorites.has(dot.key);
+            return (_jsxs("div", { className: cls, role: "button", tabIndex: -1, style: { width: metrics.widthPx }, onClick: () => onJump(dot), children: [_jsxs("div", { className: "mgs-cardHead", children: [showFavorite ? favoriteButton(favorited, () => onToggleFavorite(dot.key)) : null, showTurn && isSelected && dot.turn !== null ? (_jsxs("div", { className: "mgs-cardTitle", children: ["Turn ", dot.turn] })) : null, _jsx("div", { className: "mgs-cardTime", children: clockText(dot.time, Date.now()) })] }), showDuration && dot.metrics !== undefined && isSelected ? (_jsx("div", { className: "mgs-cardMetrics", children: metricsLine(dot.metrics) })) : null, _jsx("div", { className: isSelected ? 'mgs-cardBody' : 'mgs-cardClamp', style: isSelected
+                            ? undefined
+                            : { WebkitLineClamp: metrics.maxLines, fontSize: metrics.fontSize }, children: text })] }, dot.key));
+        }) }), document.body);
+}

package/lib/client/components/minimal/dot.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+// 圆点按钮：纯展示（缩放/跳转/翻页弹出状态由父级 memo 前算好）——
+// memo 化后长会话 hover 不再整列重渲；事件由列表容器委托
+import { memo } from 'react';
+export const Dot = memo(function Dot(props) {
+    const { scale, className, label, index, keyName, focused, revealed } = props;
+    return (_jsx("button", { type: "button", className: className, style: {
+            transform: 'scale(' + scale + ')',
+            ...(revealed !== undefined ? { animationDelay: revealed.order * 35 + 'ms' } : {}),
+        }, "data-mega-chat-nav-focused": focused ? 'true' : undefined, "data-mega-chat-nav-index": index, "data-mega-chat-nav-key": keyName, "aria-label": label }));
+});

package/lib/client/components/minimal/hint.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// 跳转失败 / 加载提示（portal 到 body）：
+//  - 失败提示：贴 rail 侧顶部（rail 左右对齐）
+//  - 加载提示：对话输入框上方细条，水平对齐相对**对话区域**左右边缘（跟随 rail 侧）
+import { useEffect, useState } from 'react';
+import { createPortal } from 'react-dom';
+/** 对话区域左/右边缘到视口的距离（fixed 定位用） */
+function conversationEdge(align) {
+    const root = document.querySelector('[data-slot="conversation"] > div[data-phase]');
+    if (root === null)
+        return null;
+    const r = root.getBoundingClientRect();
+    return align === 'right' ? window.innerWidth - r.right : r.left;
+}
+export function Hint({ text, align, position = 'rail', loading = false }) {
+    const [edge, setEdge] = useState(() => conversationEdge(align));
+    useEffect(() => {
+        const measure = () => setEdge(conversationEdge(align));
+        measure();
+        window.addEventListener('resize', measure);
+        return () => window.removeEventListener('resize', measure);
+    }, [align]);
+    const cls = position === 'bottom' ? 'mgs-hint mgs-hint--bottom' : 'mgs-hint';
+    const style = position === 'bottom'
+        ? align === 'right'
+            ? { right: (edge ?? 0) + 20, bottom: 150 }
+            : { left: (edge ?? 0) + 20, bottom: 150 }
+        : align === 'right' ? { right: 52, top: 12 } : { left: 52, top: 12 };
+    return createPortal(_jsxs("div", { className: cls, style: style, children: [loading ? (_jsxs("span", { className: "mgs-hint-dots", "aria-hidden": "true", children: [_jsx("i", {}), _jsx("i", {}), _jsx("i", {})] })) : null, _jsx("span", { children: text })] }), document.body);
+}

package/lib/client/components/minimal/paging.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export function PagingButton(props) {
+    const cls = props.dir === -1 ? 'mgs-navBtn mgs-navUp' : 'mgs-navBtn mgs-navDown';
+    return (_jsx("button", { type: "button", className: cls, "aria-label": props.label, style: { visibility: props.visible ? 'visible' : 'hidden' }, onMouseEnter: props.onEnter, onMouseLeave: props.onLeave, onClick: props.onClick }));
+}

package/lib/client/components/minimal/quick-settings.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// 快捷设置面板：对齐/条带高度/卡片数（能力感知）+ 显示模式
+import { useEffect, useState } from 'react';
+import { ALIGN_OPTIONS, BAND_OPTIONS, CARD_OPTIONS, SHOW_OPTIONS, STYLE_CAPABILITIES } from "../../settings.js";
+function Seg(props) {
+    return (_jsx("div", { className: "mgs-segmented", role: "radiogroup", children: props.options.map((o) => (_jsx("button", { type: "button", role: "radio", "aria-checked": props.value === o, className: props.value === o ? 'mgs-segment mgs-segmentActive' : 'mgs-segment', onClick: () => props.onPick(o), children: props.labels[String(o)] ?? String(o) }, o))) }));
+}
+function ModeSeg({ value, onChange, t }) {
+    return (_jsx(Seg, { options: SHOW_OPTIONS, value: value, labels: {
+            show: t('config.showMode.show'),
+            peek: t('config.showMode.peek'),
+            hide: t('config.showMode.hide'),
+        }, onPick: (v) => onChange(v) }));
+}
+function useSettingsTick(subscribe) {
+    const [, bump] = useState(0);
+    useEffect(() => subscribe(() => bump((n) => n + 1)), [subscribe]);
+}
+export function QuickSettings(props) {
+    const { injected, t, onClose } = props;
+    useSettingsTick(injected.subscribeSettings);
+    const caps = STYLE_CAPABILITIES[injected.style()];
+    return (_jsxs("div", { className: "mgs-config-panel", role: "dialog", "aria-label": t('config.title'), children: [_jsxs("div", { className: "mgs-config-head", children: [_jsxs("span", { className: "mgs-config-title", children: [t('config.style.' + injected.style()), " \u00B7 ", t('config.settings')] }), _jsx("button", { type: "button", className: "mgs-config-close", "aria-label": t('config.close'), onClick: onClose, children: "\u2715" })] }), _jsxs("div", { className: "mgs-config-row", children: [_jsx("span", { className: "mgs-config-label", children: t('config.align') }), _jsx(Seg, { options: ALIGN_OPTIONS, value: injected.align(), labels: { left: t('settings.align.left'), right: t('settings.align.right') }, onPick: (v) => injected.setAlign(v) })] }), _jsxs("div", { className: "mgs-config-row", children: [_jsx("span", { className: "mgs-config-label", children: t('config.bandHeight') }), _jsx(Seg, { options: BAND_OPTIONS, value: injected.bandHeight(), labels: {
+                            compact: t('config.bandHeight.compact'),
+                            standard: t('config.bandHeight.standard'),
+                            tall: t('config.bandHeight.tall'),
+                        }, onPick: (v) => injected.setBandHeight(v) })] }), caps.hoverCards ? (_jsxs("div", { className: "mgs-config-row", children: [_jsx("span", { className: "mgs-config-label", children: t('config.cardCount') }), _jsx(Seg, { options: CARD_OPTIONS, value: injected.cardCount(), labels: { 1: '1', 3: '3', 5: '5' }, onPick: (v) => injected.setCardCount(v) })] })) : null, _jsx("div", { className: "mgs-config-sep" }), _jsxs("div", { className: "mgs-config-row", children: [_jsx("span", { className: "mgs-config-label", children: t('config.showQuickSettings') }), _jsx(ModeSeg, { value: injected.showQuickSettings(), onChange: (v) => injected.setShowQuickSettings(v), t: t })] }), _jsxs("div", { className: "mgs-config-row", children: [_jsx("span", { className: "mgs-config-label", children: t('config.showSearch') }), _jsx(ModeSeg, { value: injected.showSearch(), onChange: (v) => injected.setShowSearch(v), t: t })] }), _jsxs("div", { className: "mgs-config-row", children: [_jsx("span", { className: "mgs-config-label", children: t('config.showFavorites') }), _jsx(ModeSeg, { value: injected.showFavorites(), onChange: (v) => injected.setShowFavorites(v), t: t })] }), _jsxs("div", { className: "mgs-config-row", children: [_jsx("span", { className: "mgs-config-label", children: t('config.showCount') }), _jsx(ModeSeg, { value: injected.showCount(), onChange: (v) => injected.setShowCount(v), t: t })] })] }));
+}

package/lib/client/components/minimal/search.js

@@ -0,0 +1,67 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+// 搜索浮层：输入防抖 → host 检索 → 结果（tag 用户/AI + 轮次标题 + 两行预览 + 历史提示）
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { clockText } from "./useRail.js";
+/** 检索：携带 AbortController 的 host 请求（scopes 过滤由 host 执行） */
+function fetchHits(sessionId, query, scopes, signal) {
+    const url = '/mega-chat-nav/search?session=' + encodeURIComponent(sessionId ?? '')
+        + '&q=' + encodeURIComponent(query) + '&limit=20'
+        + '&scopes=' + encodeURIComponent(scopes.join(','));
+    return fetch(url, { signal })
+        .then((resp) => resp.json())
+        .then((data) => (data.ok === true ? (data.hits ?? []) : []));
+}
+/** 角色 → 标签文本（用户/助手/工具；steering 归用户侧） */
+function roleTag(role, t) {
+    if (role === 'assistant')
+        return t('search.tag.assistant');
+    if (role === 'tool')
+        return t('search.tag.tool');
+    return t('search.tag.user');
+}
+export function SearchBox(props) {
+    const [query, setQuery] = useState('');
+    const [results, setResults] = useState([]);
+    const [busy, setBusy] = useState(false);
+    const abortRef = useRef(null);
+    const debounceRef = useRef(null);
+    const inputRef = useRef(null);
+    const run = useCallback((raw) => {
+        abortRef.current?.abort();
+        const ac = new AbortController();
+        abortRef.current = ac;
+        const q = raw.trim();
+        if (q.length < 1) {
+            setResults([]);
+            setBusy(false);
+            return;
+        }
+        setBusy(true);
+        fetchHits(props.sessionId, q, props.scopes, ac.signal)
+            .then((hits) => {
+            setResults(hits);
+        })
+            .catch((e) => {
+            if (e.name !== 'AbortError')
+                setResults([]);
+        })
+            .finally(() => setBusy(false));
+    }, [props.sessionId, props.scopes]);
+    const onType = (value) => {
+        setQuery(value);
+        if (debounceRef.current !== null)
+            window.clearTimeout(debounceRef.current);
+        debounceRef.current = window.setTimeout(() => run(value), 200);
+    };
+    useEffect(() => {
+        inputRef.current?.focus();
+        return () => {
+            if (debounceRef.current !== null)
+                window.clearTimeout(debounceRef.current);
+            abortRef.current?.abort();
+        };
+    }, []);
+    const historicCount = results.filter((hit) => hit.historic).length;
+    return (_jsxs("div", { className: "mgs-search", role: "dialog", "aria-label": props.t('search.placeholder'), children: [_jsx("input", { ref: inputRef, className: "mgs-search-input", value: query, placeholder: props.t('search.placeholder'), onChange: (e) => onType(e.target.value), onKeyDown: (e) => { if (e.key === 'Escape')
+                    props.onClose(); } }), busy ? _jsx("div", { className: "mgs-search-busy", children: "\u2026" }) : null, !busy && query.trim() === '' && props.emptyContent !== undefined ? props.emptyContent : null, !busy && results.length > 0 && historicCount > 0 ? (_jsx("div", { className: "mgs-search-historic", children: props.t('search.historic', { n: historicCount }) })) : null, results.length > 0 ? (_jsx("div", { className: "mgs-search-results", children: results.map((hit) => (_jsxs("button", { type: "button", className: "mgs-search-hit", onClick: () => props.onJump(hit.key, hit.seq), children: [_jsxs("span", { className: "mgs-search-title", children: [_jsxs("span", { className: "mgs-search-titleLeft", children: [hit.turn > 0 ? _jsx("span", { className: "mgs-search-turn", children: props.t('search.turnTitle', { turn: hit.turn }) }) : null, _jsx("span", { className: 'mgs-search-tag mgs-search-tag--' + hit.role, children: roleTag(hit.role, props.t) })] }), _jsx("span", { className: "mgs-search-titleTime", children: clockText(hit.time, Date.now()) })] }), _jsx("span", { className: "mgs-search-body", children: _jsx("span", { className: "mgs-search-text", children: hit.hitStart >= 0 && hit.hitLen > 0 ? (_jsxs(_Fragment, { children: [hit.snippet.slice(0, hit.hitStart), _jsx("mark", { className: "mgs-search-mark", children: hit.snippet.slice(hit.hitStart, hit.hitStart + hit.hitLen) }), hit.snippet.slice(hit.hitStart + hit.hitLen)] })) : hit.snippet }) })] }, hit.key + ':' + hit.seq))) })) : null] }));
+}