@khorsheed/dsh-message-timeline 0.2.4 → 0.2.6

package/lib/types/client/TimelineRail.js

@@ -3,19 +3,30 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * Message timeline panel, browser half. One entry in the official
  * conversation.session.header.utilities seat anchors the plugin into the
  * session scope and renders, through a body portal, the flat floating
- * timeline over the left edge of the chat scrollport: one row per loaded
- * user message — a tick plus an ellipsized one-line preview, no frame and no
+ * timeline over the left edge of the chat scrollport: one row per user
+ * message — a tick plus an ellipsized one-line preview, no frame and no
  * visible scrollbar. At rest only the dimmed ticks show, the reading
  * position's tick in blue (the latest message until the tracker answers);
  * hovering or keyboard-focusing the panel reveals the row texts with the
  * blue row on top, and clicking a row jumps the transcript to that message.
  * The panel is always on while the chat view shows; the `enabled` config is
  * the off switch.
+ *
+ * The row list is whole-session from the moment the session opens: the host
+ * `turnOutline` projection names every started turn, and the loaded chat
+ * window overlays richer previews (plus steering rows and message-tools
+ * bubbles) for the turns it covers. A turn outside the window renders as a
+ * dimmed outline row; confirming it pages history back through the turn's
+ * `turn/start` seq (the session jump loader) and lands on the freshly loaded
+ * row. When the host serves no turnOutline value the panel degrades to the
+ * loaded window alone, paged by prefetch and panel-top scrolls.
  */
 import { memo, useEffect, useMemo, useRef, useState } from 'react';
 import { createPortal } from 'react-dom';
 import { PANEL_WIDTH_MIN } from './config.js';
 import { chatHookOf } from './chat-hook.js';
+import { outlineEntries } from './outline.js';
+import { mergeRows, firstVisibleKeyInTurn } from './rows.js';
 import { previewText } from './preview.js';
 import { foldHiddenSpans, isSeqHidden } from './hidden-spans.js';
 import { isTimelineRowKind, EDIT_KIND, RESTORED_KIND } from './timeline-kinds.js';
@@ -24,6 +35,35 @@ import css from './TimelineRail.module.css';
 function nodeContent(node) {
     return node.data.content ?? [];
 }
+/**
+ * One row's display text: the loaded row's joined text blocks, or the outline
+ * entry's bounded first-prompt preview. `null` means the message carries no
+ * text (an image/attachment-only input, or an automated turn with no human
+ * prompt) — the row renders the `rail.empty` label instead.
+ */
+function rowPreview(row) {
+    return row.kind === 'loaded'
+        ? previewText(nodeContent(row.node))
+        : (row.prompt !== '' ? row.prompt : null);
+}
+/**
+ * The row's display label: the text preview when there is one, else a
+ * kind-aware fallback — the turn number for an outline-only turn, and an
+ * image/attachment label for a loaded message with no text blocks.
+ */
+function rowLabel(row, t) {
+    const preview = rowPreview(row);
+    if (preview !== null)
+        return preview;
+    if (row.kind === 'outline')
+        return t('rail.turn', { turn: row.turn });
+    const types = new Set(nodeContent(row.node).map(block => block.type));
+    if (types.has('image'))
+        return t('rail.image');
+    if (types.has('file'))
+        return t('rail.attachment');
+    return t('rail.empty');
+}
 /**
  * Horizontal panel padding, matching `.panel`'s `padding: 4px 8px`: the text
  * band sits this far inside the box, so the width budget must give it back
@@ -34,12 +74,22 @@ const PANEL_PADDING_X = 8;
 const PANEL_GAP = 16;
 /** Degraded width cap (fraction of the scrollport) while the flow probe is unanswered. */
 const DEGRADED_WIDTH_RATIO = 0.4;
+/** Rest width of the narrow-layout tick strip (px) — fits the flow's left padding. */
+const PANEL_NARROW_REST_WIDTH = 24;
+/** Expanded width of the narrow-layout hover overlay (fraction of the scrollport). */
+const NARROW_WIDE_RATIO = 0.6;
+/**
+ * Frames an outline jump retries the DOM scroll after its row materializes in
+ * the chat store: the transcript renders the new page in the same commit or a
+ * near frame, and a half-second budget covers the skew without hanging.
+ */
+const JUMP_RETRY_FRAMES = 30;
 /**
  * The header-utilities entry: the portal timeline panel.
  * @param props - composed props (see {@link TimelineRailProps}).
  * @returns nothing visible in the seat; the floating panel while the chat view shows.
  */
-export function TimelineRail({ sessionId, includeSteering, panelWidth, initialPages, loadOlder, jumpTo, useRail, t, ...standard }) {
+export function TimelineRail({ sessionId, includeSteering, panelWidth, initialPages, loadOlder, loadThrough, jumpTo, useRail, t, ...standard }) {
     const rail = useRail(s => s);
     // Chat data lives in the `useChat` standard prop on 0.1.2 (the rc-line
     // session-snapshot seat is gone); the helper degrades to an empty slice
@@ -50,6 +100,13 @@ export function TimelineRail({ sessionId, includeSteering, panelWidth, initialPa
     const nodes = useChatSlice(c => c.nodes);
     const hasMore = useSession(s => s.hasMore);
     const loadingOlder = useSession(s => s.loadingOlder);
+    // The host projection seat exists on every supported host; the VALUE is
+    // present only where the assembly mounts the turn-outline unit. Both reads
+    // degrade to undefined, which keeps the window-paging list. The narrow is
+    // memoized on the projection's reference-stable value so unrelated renders
+    // do not churn the merged list (or re-run the jump effect).
+    const outlineValue = standard.useProjection?.('turnOutline');
+    const outline = useMemo(() => outlineEntries(outlineValue), [outlineValue]);
     const items = useMemo(() => {
         // The node store is an in-memory snapshot; take it once so the span fold
         // and the message-tools append read the same snapshot.
@@ -74,7 +131,7 @@ export function TimelineRail({ sessionId, includeSteering, panelWidth, initialPa
         // ordinary session carries no span node, so the fold is empty and every
         // order row still renders: this filter never alters the baseline.
         const hidden = (node) => isSeqHidden(spans, node.anchorSeq);
-        const result = [];
+        const loaded = [];
         const seen = new Set();
         for (const key of order) {
             const node = nodes.get(key);
@@ -84,7 +141,7 @@ export function TimelineRail({ sessionId, includeSteering, panelWidth, initialPa
                 continue;
             if (hidden(node))
                 continue;
-            result.push({ key, node });
+            loaded.push({ key, node });
             seen.add(key);
         }
         // After a message-tools in-place edit the replacement materializes as a
@@ -105,7 +162,7 @@ export function TimelineRail({ sessionId, includeSteering, panelWidth, initialPa
                 continue;
             if (hidden(node))
                 continue;
-            result.push({ key: node.key, node });
+            loaded.push({ key: node.key, node });
             seen.add(node.key);
         }
         // The order loop is seq-sorted, but the appended bubbles walked the store
@@ -116,38 +173,112 @@ export function TimelineRail({ sessionId, includeSteering, panelWidth, initialPa
         // ordinary session has no appended bubbles, so this never reorders the
         // baseline (which is already seq-sorted). Dropped rows are gone before the
         // sort, so a withdrawn original never resurfaces.
-        result.sort((left, right) => left.node.anchorSeq - right.node.anchorSeq);
-        return result;
-    }, [order, nodes, includeSteering]);
+        loaded.sort((left, right) => left.node.anchorSeq - right.node.anchorSeq);
+        return mergeRows(loaded, outline);
+    }, [order, nodes, includeSteering, outline]);
     // The lit row: the hover/arrow preselection while it moves, otherwise the
     // live reading position the tracker publishes, defaulting to the latest
     // message before the tracker answers. ArrowUp/Down or hovering moves a
-    // bold preselection; Enter or a click confirms it and jumps.
+    // bold preselection; Enter or a click confirms it and jumps. Loaded rows
+    // identify by their node key (the tracker's active marker speaks the same
+    // key); outline rows identify as `turn:<n>`.
     const [focusKey, setFocusKey] = useState(null);
-    const current = focusKey ?? rail.activeKey ?? items.at(-1)?.key ?? null;
+    const current = focusKey ?? rail.activeKey ?? items.at(-1)?.id ?? null;
     const panelRef = useRef(null);
+    const [pendingJump, setPendingJump] = useState(null);
+    // A jump never crosses sessions; the entry's session identity switches
+    // without a remount when the main view moves.
+    useEffect(() => { setPendingJump(null); }, [sessionId]);
+    // The window head: the first visible node's anchorSeq (ChatView's firstSeq
+    // derivation), the coverage line for the outline jump's re-request guard.
+    const firstSeq = useMemo(() => {
+        const firstKey = order[0];
+        if (firstKey === undefined)
+            return null;
+        return nodes.get(firstKey)?.anchorSeq ?? null;
+    }, [order, nodes]);
+    // The outline-jump state machine. Fire (click) only arms the jump; this
+    // effect owns every loadThrough request, the landing scroll, and the give-
+    // up fallback, re-running as the window, the paging flags, or the jump
+    // itself change. The loop converges because loadThrough pages until the
+    // window covers the target seq (or history runs out), and a settle that
+    // moved nothing falls through to the fallback instead of re-requesting.
+    useEffect(() => {
+        if (pendingJump === null || pendingJump.sessionId !== sessionId)
+            return;
+        // Scroll to a key once its transcript row renders (the same commit or a
+        // near frame); the returned cleanup cancels the retries.
+        const landOn = (key) => {
+            let cancelled = false;
+            let frames = 0;
+            const attempt = () => {
+                if (cancelled)
+                    return;
+                frames += 1;
+                if (jumpTo(key) || frames >= JUMP_RETRY_FRAMES) {
+                    setPendingJump(null);
+                    return;
+                }
+                (typeof requestAnimationFrame === 'function' ? requestAnimationFrame : setTimeout)(attempt);
+            };
+            attempt();
+            return () => { cancelled = true; };
+        };
+        const landed = items.find((row) => row.kind === 'loaded' && row.turn === pendingJump.turn);
+        if (landed !== undefined)
+            return landOn(landed.key);
+        // No user-kind row for the turn: an automated turn (a restart/scheduled
+        // trigger renders as `turn-trigger`, not a user row) or a withdraw-hidden
+        // prompt. Land on the turn's first visible loaded node of any kind — the
+        // official rail's `user ?? loaded[0]` anchor.
+        const end = outline?.find(entry => entry.turn > pendingJump.turn)?.seq ?? Number.POSITIVE_INFINITY;
+        const anyKey = firstVisibleKeyInTurn(order, nodes, pendingJump.seq, end);
+        if (anyKey !== null)
+            return landOn(anyKey);
+        if (pendingJump.awaiting || loadingOlder)
+            return;
+        // Settled (or freshly armed) without any visible row for the turn: page
+        // again while the window head still moves and history remains; a stalled
+        // head lands on the nearest loaded row at/after the turn instead.
+        const uncovered = firstSeq === null || firstSeq > pendingJump.seq;
+        if (uncovered && hasMore && (!pendingJump.requested || pendingJump.fromHead !== firstSeq)) {
+            const jump = pendingJump;
+            setPendingJump({ ...jump, requested: true, awaiting: true, fromHead: firstSeq });
+            void loadThrough(jump.seq).then(() => {
+                setPendingJump(current => current !== null && current.sessionId === jump.sessionId && current.turn === jump.turn
+                    ? { ...current, awaiting: false }
+                    : current);
+            });
+            return;
+        }
+        const fallback = items.find((row) => row.kind === 'loaded' && row.anchorSeq >= pendingJump.seq);
+        if (fallback !== undefined)
+            jumpTo(fallback.key);
+        setPendingJump(null);
+    }, [items, pendingJump, sessionId, loadingOlder, hasMore, firstSeq, jumpTo, loadThrough, order, nodes, outline]);
     // The panel is a chat-view affordance: hide it while the session shows
     // another tab (trajectory etc.), detected through ChatView's data-chat-flow
-    // marker. `active` splits from `visible` so history paging can bootstrap: a
-    // session whose loaded event window holds no user message yet (a huge
-    // assistant turn pushed it past the first page) renders no rows but must
-    // still pull pages until one materializes.
+    // marker. With the outline the list starts whole; without it a session
+    // whose loaded event window holds no user message yet (a huge assistant
+    // turn pushed it past the first page) renders no rows but must still pull
+    // pages until one materializes — hence `active` splits from `visible`.
     const active = rail.chatView && rail.ready && rail.sessionId === sessionId;
     const visible = active && items.length > 0;
-    // The panel must never cover the message flow: its width is the configured
-    // preferred width capped by the scrollport's left gutter — the message
-    // flow's left edge minus the panel's left edge, less the panel's right
-    // padding and the visible breathing gap. A gutter too small for the minimum
-    // usable width hides the panel entirely (the timeline is an overlay
-    // affordance; squeezed into nothing it only intercepts the transcript).
-    // When the flow probe is unanswered (official structure change), the width
-    // degrades to a fraction of the scrollport instead — never throws, never
-    // covers more than the fallback.
+    // The panel must never cover the message flow AT REST: its width is the
+    // configured preferred width capped by the scrollport's left gutter — the
+    // message flow's left edge minus the panel's left edge, less the panel's
+    // right padding and the visible breathing gap. A gutter too small for the
+    // minimum width no longer hides the panel: it degrades to a tick strip in
+    // the flow's left padding and expands over the flow on hover/focus with a
+    // solid background (right sidebars and narrow windows keep the rail
+    // usable). When the flow probe is unanswered (official structure change),
+    // the width degrades to a fraction of the scrollport instead.
     const gutter = rail.flowLeft === null ? null : rail.flowLeft - rail.left - PANEL_PADDING_X - PANEL_GAP;
+    const narrow = gutter !== null && gutter < PANEL_WIDTH_MIN;
     const width = gutter === null
         ? Math.min(panelWidth, Math.max(PANEL_WIDTH_MIN, rail.scrollportWidth * DEGRADED_WIDTH_RATIO))
-        : Math.min(panelWidth, Math.max(0, gutter));
-    const tooNarrow = gutter !== null && width < PANEL_WIDTH_MIN;
+        : narrow ? PANEL_NARROW_REST_WIDTH : Math.min(panelWidth, gutter);
+    const wideWidth = Math.min(panelWidth, Math.max(PANEL_WIDTH_MIN, rail.scrollportWidth * NARROW_WIDE_RATIO));
     // Keep the lit row in view: the panel follows the reading position (a new
     // message scrolls its row in), and mouse browsing is never yanked because
     // the hovered row is the current one and always visible under the pointer.
@@ -155,61 +286,92 @@ export function TimelineRail({ sessionId, includeSteering, panelWidth, initialPa
         panelRef.current?.querySelector(`[data-item-key=${JSON.stringify(current)}]`)
             ?.scrollIntoView({ block: 'nearest' });
     }, [current]);
-    // Prefetch history while the panel is on a chat view: keep pulling pages
-    // until the first user message materializes (bootstrap), then until
-    // initialPages pages arrived, so the list starts near-complete. Older
-    // pages load on demand when the panel scrolls to its top.
+    // Fallback mode (no outline) prefetches history while the panel is on a
+    // chat view: keep pulling pages until the first user message materializes
+    // (bootstrap), then until initialPages pages arrived, so the list starts
+    // near-complete. Older pages load on demand when the panel scrolls to its
+    // top. The outline mode skips this entirely — the projection already names
+    // every turn, so no page has to arrive for the list to be complete.
     const prefetchedPagesRef = useRef(0);
     useEffect(() => {
         if (!active) {
             prefetchedPagesRef.current = 0;
             return;
         }
+        if (outline !== undefined)
+            return;
         if (!hasMore || loadingOlder)
             return;
         if (items.length > 0 && prefetchedPagesRef.current >= initialPages)
             return;
         prefetchedPagesRef.current += 1;
         void loadOlder();
-    }, [active, hasMore, loadingOlder, items.length, initialPages, loadOlder]);
-    // Older history loads by scrolling the panel to its top; the official chat
-    // view owns the load-older button, so the panel stays chromeless.
+    }, [active, hasMore, loadingOlder, items.length, initialPages, loadOlder, outline]);
+    // Fallback mode loads older history by scrolling the panel to its top; the
+    // official chat view owns the load-older button, so the panel stays
+    // chromeless. The outline mode's list is already complete.
     const onPanelScroll = (event) => {
+        if (outline !== undefined)
+            return;
         if (!hasMore || loadingOlder)
             return;
         if (event.currentTarget.scrollTop <= 8)
             void loadOlder();
     };
-    const confirm = (key) => {
+    const confirm = (row) => {
         setFocusKey(null);
-        jumpTo(key);
+        if (row.kind === 'loaded') {
+            // A direct jump supersedes any armed outline jump (its landing would
+            // otherwise yank the transcript later).
+            setPendingJump(null);
+            jumpTo(row.key);
+            return;
+        }
+        // An outline row arms the jump; the effect above runs the paging and the
+        // landing scroll. Re-clicking another outline row retargets the jump.
+        setPendingJump({ sessionId, turn: row.turn, seq: row.seq, requested: false, awaiting: false, fromHead: null });
     };
-    if (!visible || tooNarrow)
+    if (!visible)
         return null;
-    return createPortal(_jsx("div", { ref: panelRef, className: css.panel, role: "navigation", "aria-label": t('rail.panel'), tabIndex: 0, "data-timeline-panel": "", style: { left: rail.left, top: rail.top, height: rail.height, width }, onScroll: onPanelScroll, onKeyDown: (event) => {
+    return createPortal(_jsx("div", { ref: panelRef, className: `${css.panel} ${narrow ? css.panelNarrow : ''}`, role: "navigation", "aria-label": t('rail.panel'), tabIndex: 0, "data-timeline-panel": "", style: {
+            // The box fits its rows (up to the rail height) and centers on the
+            // rail's midline, so the narrow-mode hover background wraps the list
+            // instead of painting the whole column; a longer list fills the rail
+            // and scrolls.
+            left: rail.left,
+            top: rail.top + rail.height / 2,
+            maxHeight: rail.height,
+            transform: 'translateY(-50%)',
+            width,
+            ...(narrow ? { '--panel-wide': `${wideWidth}px` } : {}),
+        }, onScroll: onPanelScroll, onKeyDown: (event) => {
             if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {
                 event.preventDefault();
-                const anchor = items.findIndex(item => item.key === current);
+                const anchor = items.findIndex(item => item.id === current);
                 const next = event.key === 'ArrowDown'
                     ? items[Math.min(anchor + 1, items.length - 1)]
                     : items[Math.max(anchor - 1, 0)];
                 /* v8 ignore next -- a non-empty item list keeps the clamped index inside bounds */
                 if (next !== undefined)
-                    setFocusKey(next.key);
+                    setFocusKey(next.id);
             }
             else if (event.key === 'Enter' || event.key === ' ') {
                 event.preventDefault();
-                /* v8 ignore next -- the panel only renders with at least one item, so a current key always exists */
-                if (current !== null)
-                    confirm(current);
+                const row = items.find(item => item.id === current);
+                if (row !== undefined)
+                    confirm(row);
             }
-        }, onBlur: () => { setFocusKey(null); }, children: items.map((item) => {
-            const isCurrent = item.key === current;
-            const isFocused = item.key === focusKey;
+        }, onBlur: () => { setFocusKey(null); }, children: items.map((row) => {
+            const isCurrent = row.id === current;
+            const isFocused = row.id === focusKey;
+            const isPending = row.kind === 'outline' && pendingJump !== null && pendingJump.turn === row.turn;
             const className = isFocused
                 ? `${css.item} ${css.itemFocused}`
                 : isCurrent ? `${css.item} ${css.itemCurrent}` : css.item;
-            return (_jsxs("button", { type: "button", "data-item-key": item.key, "aria-current": isCurrent || undefined, className: className, onClick: () => { confirm(item.key); }, onMouseEnter: () => { setFocusKey(item.key); }, onMouseLeave: () => { setFocusKey(key => key === item.key ? null : key); }, children: [_jsx("span", { className: isCurrent ? `${css.tick} ${css.tickCurrent}` : css.tick, "aria-hidden": "true" }), _jsx("span", { className: css.itemText, children: previewText(nodeContent(item.node)) ?? t('rail.empty') })] }, item.key));
+            // Outline rows share the plain styling; the pending pulse is the only
+            // transient cue that a row pages history in before landing.
+            const classNames = isPending ? `${className} ${css.itemPending}` : className;
+            return (_jsxs("button", { type: "button", "data-item-key": row.id, "aria-current": isCurrent || undefined, "aria-busy": isPending || undefined, className: classNames, onClick: () => { confirm(row); }, onMouseEnter: () => { setFocusKey(row.id); }, onMouseLeave: () => { setFocusKey(key => key === row.id ? null : key); }, children: [_jsx("span", { className: isCurrent ? `${css.tick} ${css.tickCurrent}` : css.tick, "aria-hidden": "true" }), _jsx("span", { className: css.itemText, children: rowLabel(row, t) })] }, row.id));
         }) }), document.body);
 }
 /** Memoized export for the slot machinery (stable component identity). */

package/lib/types/client/config.d.ts

@@ -20,8 +20,11 @@ export interface TimelineConfig {
      */
     panelWidth: number;
     /**
-     * History pages to prefetch when the rail opens (50 events each); older
-     * pages load on demand when the rail or the panel is scrolled to its top.
+     * History pages to prefetch when the rail opens (50 events each), in the
+     * window-paging fallback only: when the host serves the turnOutline
+     * projection the list starts whole and nothing prefetches. In the fallback,
+     * older pages load on demand when the rail or the panel is scrolled to its
+     * top.
      */
     initialPages: number;
 }

package/lib/types/client/index.d.ts

@@ -3,11 +3,15 @@
  * official `conversation.session.header.utilities` seat (a right-aligned
  * optional-utility slot) that anchors the plugin into the session scope; the
  * component itself renders only through a body portal: the flat floating
- * timeline panel over the chat scrollport's left edge — one row per loaded
- * user message, no frame, no visible scrollbar. The
- * panel reads the session chat snapshot through the framework `useSession`
- * hook, jumps through the official row anchor attributes, and degrades to a
- * hidden panel when those attributes change — no official code is modified.
+ * timeline panel over the chat scrollport's left edge — one row per user
+ * message of the whole session, no frame, no visible scrollbar. The row list
+ * merges the host `turnOutline` projection (every started turn, served whole)
+ * with the loaded chat window; confirming a not-yet-loaded row pages history
+ * through the session's jump loader (`loadThrough`) before scrolling. When
+ * the projection is absent the panel reads the loaded window alone, paged
+ * through the session conversation service, jumps through the official row
+ * anchor attributes, and degrades to a hidden panel when those attributes
+ * change — no official code is modified.
  * @module @khorsheed/dsh-message-timeline/client
  */
 import type { Context } from '@deepseek-ai/cordis';

package/lib/types/client/index.js

@@ -36,12 +36,16 @@ export function apply(ctx, config) {
             const conversation = actx.get('conversation');
             if (conversation === undefined)
                 throw new Error('message-timeline: conversation service unavailable');
+            const binding = ctx.sessions.binding(sessionId);
+            if (binding === undefined)
+                throw new Error('message-timeline: session resolved no binding');
             return {
                 includeSteering: options.includeSteering,
                 panelWidth: options.panelWidth,
                 initialPages: options.initialPages,
                 loadOlder: () => conversation.loadOlder(),
-                jumpTo: (key) => { tracker.jumpTo(key); },
+                loadThrough: seq => binding.session.loadThrough(seq),
+                jumpTo: (key) => tracker.jumpTo(key),
                 hooks: { rail: tracker.state },
             };
         },

package/lib/types/client/locales.d.ts

@@ -3,6 +3,9 @@
 export declare const zh: {
     'rail.panel': string;
     'rail.empty': string;
+    'rail.turn': string;
+    'rail.image': string;
+    'rail.attachment': string;
 };
 /** The message-timeline namespace key union. */
 export type TimelineKey = keyof typeof zh;
@@ -16,5 +19,8 @@ declare module '@deepseek-ai/dsh-client-ui-slots' {
 export declare const en: {
     'rail.panel': string;
     'rail.empty': string;
+    'rail.turn': string;
+    'rail.image': string;
+    'rail.attachment': string;
 };
 //# sourceMappingURL=locales.d.ts.map

package/lib/types/client/locales.js

@@ -2,10 +2,16 @@
 /** Simplified Chinese dictionary (the key-set source of truth). */
 export const zh = {
     'rail.panel': '消息导览',
-    'rail.empty': '暂无用户消息',
+    'rail.empty': '无文本预览',
+    'rail.turn': '第 {turn} 轮',
+    'rail.image': '图片消息',
+    'rail.attachment': '附件消息',
 };
 /** English dictionary, checked complete against the zh key set. */
 export const en = {
     'rail.panel': 'Message timeline',
-    'rail.empty': 'No user messages',
+    'rail.empty': 'No text preview',
+    'rail.turn': 'Turn {turn}',
+    'rail.image': 'Image message',
+    'rail.attachment': 'Attachment message',
 };

package/lib/types/client/outline.d.ts

@@ -0,0 +1,12 @@
+import type { TurnOutlineEntry } from '@deepseek-ai/dsh-session-turn-outline/client';
+export type { TurnOutlineEntry };
+/**
+ * Narrow one wire projection value to outline entries. `turn` and `seq` are
+ * load-bearing — a row cannot exist or jump without them — so damage there
+ * drops the entry; the previews are decorative and degrade to ''. A non-array
+ * value (absent unit included) narrows to undefined.
+ * @param value - the raw `useProjection('turnOutline')` read.
+ * @returns the surviving entries in wire order, or undefined when absent.
+ */
+export declare function outlineEntries(value: unknown): readonly TurnOutlineEntry[] | undefined;
+//# sourceMappingURL=outline.d.ts.map

package/lib/types/client/outline.js

@@ -0,0 +1,40 @@
+/**
+ * Narrow one wire projection value to outline entries. `turn` and `seq` are
+ * load-bearing — a row cannot exist or jump without them — so damage there
+ * drops the entry; the previews are decorative and degrade to ''. A non-array
+ * value (absent unit included) narrows to undefined.
+ * @param value - the raw `useProjection('turnOutline')` read.
+ * @returns the surviving entries in wire order, or undefined when absent.
+ */
+export function outlineEntries(value) {
+    if (!Array.isArray(value))
+        return undefined;
+    const entries = [];
+    for (const raw of value) {
+        const entry = outlineEntry(raw);
+        if (entry !== undefined)
+            entries.push(entry);
+    }
+    return entries;
+}
+/**
+ * Narrow one wire entry. `turn` and `seq` must be non-negative safe integers
+ * (seq additionally rejects -0); the previews default to '' when malformed.
+ * @param value - one raw wire entry.
+ * @returns the entry, or undefined when a load-bearing field is damaged.
+ */
+function outlineEntry(value) {
+    if (typeof value !== 'object' || value === null)
+        return undefined;
+    const entry = value;
+    if (typeof entry.turn !== 'number' || !Number.isSafeInteger(entry.turn) || entry.turn < 0)
+        return undefined;
+    if (typeof entry.seq !== 'number' || !Number.isSafeInteger(entry.seq) || entry.seq < 0 || Object.is(entry.seq, -0))
+        return undefined;
+    return {
+        turn: entry.turn,
+        seq: entry.seq,
+        prompt: typeof entry.prompt === 'string' ? entry.prompt : '',
+        response: typeof entry.response === 'string' ? entry.response : '',
+    };
+}

package/lib/types/client/rail-tracker.d.ts

@@ -25,7 +25,7 @@ import type { TimelineRailState } from './slots.ts';
  * whole `[data-composer-seat]` top: dock cards (goal/todo/queue) sit above
  * the input inside the seat, and counting them would push the timeline up off
  * the conversation. Falls back to the seat top, then the column bottom, when
- * the markers are absent.
+ * no laid-out card is rendered (see {@link laidOutCard}).
  * The scrollport's own width rides along for the width-cap fallback when the
  * message-flow probe is unanswered.
  * @param scrollport - the official conversation scrollport element.
@@ -78,8 +78,11 @@ export declare function jumpRow(scrollport: HTMLElement, key: string): boolean;
 export interface RailTracker {
     /** Live rail geometry and active marker for the current session. */
     readonly state: HostObservable<TimelineRailState>;
-    /** Scroll the transcript to the message addressed by `key` (no-op while unbound). */
-    jumpTo(key: string): void;
+    /**
+     * Scroll the transcript to the message addressed by `key`.
+     * @returns whether the row was found and scrolled (false while unbound).
+     */
+    jumpTo(key: string): boolean;
     /** Unbind every listener and observer. */
     dispose(): void;
 }

package/lib/types/client/rail-tracker.js

@@ -14,6 +14,26 @@ const IDLE = {
     sessionId: undefined, ready: false, left: 0, top: 0, height: 0, scrollportWidth: 0, flowLeft: null,
     activeKey: null, chatView: false,
 };
+/**
+ * The rect of the first laid-out chat input card in the scrollport. A
+ * business composer (the Room composer) takes the `conversation.composer`
+ * chain as an overlay: the official input bar stays mounted under a
+ * `display: none` fallback wrapper, so its card is still the first marker in
+ * the DOM but measures as a zero rect at y=0 — ending the box there collapses
+ * the panel to zero height. Unlaid-out cards are skipped, so such a layout
+ * falls through to the seat top.
+ * @param scrollport - the official conversation scrollport element.
+ * @returns the card's rect, or null when no laid-out card is rendered.
+ */
+function laidOutCard(scrollport) {
+    for (const card of scrollport.querySelectorAll('[data-composer-card]')) {
+        const rect = card.getBoundingClientRect();
+        if (rect.width === 0 && rect.height === 0)
+            continue;
+        return rect;
+    }
+    return null;
+}
 /**
  * Measure the panel's viewport box from one scrollport: its rect inset by the
  * panel padding, minus the chat input card at the bottom and the conversation
@@ -24,7 +44,7 @@ const IDLE = {
  * whole `[data-composer-seat]` top: dock cards (goal/todo/queue) sit above
  * the input inside the seat, and counting them would push the timeline up off
  * the conversation. Falls back to the seat top, then the column bottom, when
- * the markers are absent.
+ * no laid-out card is rendered (see {@link laidOutCard}).
  * The scrollport's own width rides along for the width-cap fallback when the
  * message-flow probe is unanswered.
  * @param scrollport - the official conversation scrollport element.
@@ -44,10 +64,10 @@ export function measureGeometry(scrollport) {
             break;
         }
     }
-    const card = scrollport.querySelector('[data-composer-card]');
+    const card = laidOutCard(scrollport);
     const seat = scrollport.querySelector('[data-composer-seat]');
     const bottom = card !== null
-        ? card.getBoundingClientRect().top - RAIL_VERTICAL_PADDING
+        ? card.top - RAIL_VERTICAL_PADDING
         : seat !== null
             ? seat.getBoundingClientRect().top - RAIL_VERTICAL_PADDING
             : rect.bottom - RAIL_VERTICAL_PADDING;
@@ -294,10 +314,7 @@ export function installRailTracker(ctx, includeSteering) {
                 return () => { listeners.delete(fn); };
             },
         },
-        jumpTo: (key) => {
-            if (scrollport !== null)
-                jumpRow(scrollport, key);
-        },
+        jumpTo: (key) => scrollport !== null && jumpRow(scrollport, key),
         dispose: () => {
             stopList();
             stopProvide?.();