@kortix/ui 0.0.0-stage → 0.14.4

package/dist/session/thread/session-context-sub-sessions.js

@@ -0,0 +1,142 @@
+'use client';
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { Button } from '../../primitives/button.js';
+import { useTranslations } from '../../i18n/index.js';
+import { formatUsdAsCredits } from '../../_vendor/kortix-shared.js';
+import { Label } from '../../primitives/label.js';
+import { cn } from '../../lib/utils.js';
+import { useSessionLogRecord, useSessionLogThread, useSessionSync } from '@kortix/sdk/react';
+import { CaretDownIcon, CaretRightIcon } from '@phosphor-icons/react';
+import { allDescendantIds, childMapByParent, sessionLogThreadMetrics } from '@kortix/sdk';
+// ============================================================================
+// Thread metrics
+// ============================================================================
+export const NO_METRICS = {
+    cost: 0,
+    messages: { all: 0, user: 0, assistant: 0 },
+    tokens: { input: 0, output: 0, reasoning: 0, cacheRead: 0, cacheWrite: 0 },
+    context: null,
+};
+/** The SDK's metrics of a thread the store may not hold yet. */
+export function threadMetrics(thread, pricingLookup) {
+    return thread ? sessionLogThreadMetrics(thread, { pricing: pricingLookup }) : NO_METRICS;
+}
+export function sumMetrics(all) {
+    const sum = { ...NO_METRICS, messages: { ...NO_METRICS.messages }, tokens: { ...NO_METRICS.tokens } };
+    for (const m of all) {
+        sum.cost += m.cost;
+        for (const k of ['all', 'user', 'assistant'])
+            sum.messages[k] += m.messages[k];
+        for (const k of Object.keys(sum.tokens))
+            sum.tokens[k] += m.tokens[k];
+    }
+    return sum;
+}
+/**
+ * Reads the thread of every id in `ids` through `useSessionLogThread`, one
+ * component per id (a hook per thread, no loop), and renders `children` with
+ * the metrics of all of them. A pure derivation: no state, no effect, so the
+ * totals never depend on which rows are expanded.
+ */
+function WithThreadMetrics({ source, ids, pricingLookup, acc = {}, children, }) {
+    if (ids.length === 0)
+        return _jsx(_Fragment, { children: children(acc) });
+    return (_jsx(WithOneThread, { source: source, id: ids[0], rest: ids.slice(1), pricingLookup: pricingLookup, acc: acc, children: children }));
+}
+function WithOneThread({ source, id, rest, pricingLookup, acc, children, }) {
+    const thread = useSessionLogThread(source, id);
+    const metrics = useMemo(() => (thread ? threadMetrics(thread, pricingLookup) : null), [thread, pricingLookup]);
+    const next = useMemo(() => ({ ...acc, [id]: metrics }), [acc, id, metrics]);
+    return (_jsx(WithThreadMetrics, { source: source, ids: rest, pricingLookup: pricingLookup, acc: next, children: children }));
+}
+/**
+ * Loads a sub-agent's thread into the store, as the sub-agent's own view does (`useSessionSync`
+ * with `savedChild`): its saved window, then the runtime's. The section mounts one per requested
+ * id (a row that scrolled into view, or "Load all"), outside the tree, so collapsing a row
+ * does not unload its children. Reports whether its last runtime read failed.
+ */
+function LoadSubAgentThread({ id, scope, onFailed }) {
+    const { freshness } = useSessionSync(id, { kortixSessionScope: scope, savedChild: true, subscribeMessages: false });
+    // Latched: a retry after a failure reads `stale`/`loading` until it lands, so only an error or
+    // a fresh read changes the row.
+    useEffect(() => {
+        if (freshness === 'error' || freshness === 'fresh')
+            onFailed(id, freshness === 'error');
+    }, [id, freshness, onFailed]);
+    return null;
+}
+/** One sub-agent's row: its thread's metrics, and its own children under it. */
+function SubSessionTreeNode({ id, depth = 0, childMap, allSessions, metrics, messagesSuffix, loadFailed, requested, failed, onSeen, }) {
+    const tCredits = useTranslations('settings.credits');
+    const [expanded, setExpanded] = useState(depth < 1);
+    const rowRef = useRef(null);
+    const isRequested = requested.has(id);
+    useEffect(() => {
+        const row = rowRef.current;
+        if (isRequested || !row)
+            return;
+        if (typeof IntersectionObserver === 'undefined') {
+            onSeen(id);
+            return;
+        }
+        const observer = new IntersectionObserver((entries) => {
+            if (entries.some((e) => e.isIntersecting))
+                onSeen(id);
+        });
+        observer.observe(row);
+        return () => observer.disconnect();
+    }, [id, isRequested, onSeen]);
+    const own = metrics[id] ?? null;
+    const title = allSessions.find((s) => s.id === id)?.title ?? id.slice(0, 12);
+    const children = childMap.get(id) ?? [];
+    const hasChildren = children.length > 0;
+    return (_jsxs("div", { className: cn('flex flex-col', depth > 0 && 'border-border/30 ml-4 border-l pl-3'), children: [_jsxs("button", { ref: rowRef, onClick: () => hasChildren && setExpanded(!expanded), className: cn('flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-left text-xs', hasChildren && 'hover:bg-muted/40 cursor-pointer', !hasChildren && 'cursor-default'), children: [hasChildren ? (expanded ? (_jsx(CaretDownIcon, { className: "text-muted-foreground size-3 shrink-0" })) : (_jsx(CaretRightIcon, { className: "text-muted-foreground size-3 shrink-0" }))) : (_jsx("div", { className: "size-3 shrink-0" })), _jsx("span", { className: "text-foreground min-w-0 truncate font-medium", children: title }), own ? (_jsxs(_Fragment, { children: [_jsxs("span", { className: "text-muted-foreground ml-auto shrink-0 text-xs tabular-nums", children: [own.messages.all, " ", messagesSuffix] }), _jsx("span", { className: "text-muted-foreground shrink-0 tabular-nums", children: tCredits('creditCount', { count: own.cost * 100, formatted: formatUsdAsCredits(own.cost) }) })] })) : (
+                    // No thread yet: loading, not requested, or its read failed. Never a false "0 messages".
+                    _jsx("span", { className: "text-muted-foreground ml-auto shrink-0 text-xs", children: failed.has(id) ? loadFailed : '—' }))] }), expanded && hasChildren && (_jsx("div", { className: "flex flex-col", children: children.map((childId) => (_jsx(SubSessionTreeNode, { id: childId, depth: depth + 1, childMap: childMap, allSessions: allSessions, metrics: metrics, messagesSuffix: messagesSuffix, loadFailed: loadFailed, requested: requested, failed: failed, onSeen: onSeen }, childId))) }))] }));
+}
+export function SubSessionSection({ source, session, allSessions, pricingLookup, fmt }) {
+    const t = useTranslations('hardcodedUi.componentsSessionSessionContextModal');
+    const tCredits = useTranslations('settings.credits');
+    const childMap = useMemo(() => (allSessions ? childMapByParent(allSessions) : new Map()), [allSessions]);
+    const descendantIds = useMemo(() => (session ? allDescendantIds(childMap, session.id) : []), [childMap, session]);
+    // The root's own metrics, plus every descendant's (the whole tree, whatever
+    // is expanded): the combined totals read the same records the rows do.
+    const root = useSessionLogThread(source);
+    // On v2 (the store holds the session's log) each row's `useSessionLogThread` reads the
+    // sub-agent's thread from the log: no saved copy, nothing to load here.
+    const onLog = useSessionLogRecord(source) !== null;
+    const scope = source.projectId && source.sessionId ? `${source.projectId}/${source.sessionId}` : undefined;
+    const rootMetrics = useMemo(() => threadMetrics(root, pricingLookup), [root, pricingLookup]);
+    // A row's thread loads once the row has been in view, or on "Load all"; kept while the modal is open.
+    const [requested, setRequested] = useState(() => new Set());
+    const onSeen = useCallback((id) => setRequested((prev) => (prev.has(id) ? prev : new Set(prev).add(id))), []);
+    const loadAll = useCallback(() => setRequested(new Set(descendantIds)), [descendantIds]);
+    const [failed, setFailed] = useState(() => new Set());
+    const onFailed = useCallback((id, now) => setFailed((prev) => {
+        if (prev.has(id) === now)
+            return prev;
+        const next = new Set(prev);
+        if (now)
+            next.add(id);
+        else
+            next.delete(id);
+        return next;
+    }), []);
+    const allRequested = descendantIds.every((id) => requested.has(id));
+    if (!session || !allSessions || descendantIds.length === 0)
+        return null;
+    return (_jsx(WithThreadMetrics, { source: source, ids: descendantIds, pricingLookup: pricingLookup, children: (metrics) => {
+            // Loaded = the store holds the sub-agent's thread, not "its read was asked for".
+            const loaded = descendantIds.filter((id) => metrics[id]).length;
+            const totals = sumMetrics([rootMetrics, ...descendantIds.map((id) => metrics[id] ?? NO_METRICS)]);
+            return (_jsxs("section", { className: "space-y-3", children: [!onLog &&
+                        [...requested].map((id) => _jsx(LoadSubAgentThread, { id: id, scope: scope, onFailed: onFailed }, id)), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { children: t.raw('subAgentsLabel') }), _jsx("p", { className: "text-muted-foreground text-xs", children: t.raw('subAgentsNote') }), loaded < descendantIds.length && (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("p", { className: "text-muted-foreground text-xs tabular-nums", children: t('subAgentsLoaded', { loaded, total: descendantIds.length }) }), !allRequested && (_jsx(Button, { variant: "outline", size: "xs", onClick: loadAll, children: t('loadAll') }))] }))] }), _jsxs("div", { className: "bg-popover rounded-md border", children: [_jsxs("div", { className: "grid grid-cols-2 gap-4 px-4 py-4 lg:grid-cols-4", children: [_jsx(Stat, { label: t.raw('combinedCost'), value: tCredits('creditCount', {
+                                            count: totals.cost * 100,
+                                            formatted: formatUsdAsCredits(totals.cost),
+                                        }) }), _jsx(Stat, { label: t.raw('combinedMessages'), value: totals.messages.all.toLocaleString() }), _jsx(Stat, { label: t.raw('tokensIn'), value: fmt.number(totals.tokens.input) }), _jsx(Stat, { label: t.raw('tokensOut'), value: fmt.number(totals.tokens.output) })] }), _jsx("div", { className: "border-t px-2 py-2", children: (childMap.get(session.id) ?? []).map((childId) => (_jsx(SubSessionTreeNode, { id: childId, childMap: childMap, allSessions: allSessions, metrics: metrics, messagesSuffix: t.raw('treeMessages'), loadFailed: t.raw('subAgentLoadFailed'), requested: requested, failed: failed, onSeen: onSeen }, childId))) })] })] }));
+        } }));
+}
+function Stat({ label, value }) {
+    return (_jsxs("div", { className: "flex min-w-0 flex-col gap-1", children: [_jsx("div", { className: "text-muted-foreground text-xs", children: label }), _jsx("div", { className: "text-foreground truncate text-xs font-medium tabular-nums", children: value })] }));
+}

package/dist/session/thread/session-history-scroll.d.ts

@@ -0,0 +1,55 @@
+/**
+ * History-prepend scroll restoration.
+ *
+ * A prior version stored the anchor's VIEWPORT-relative top
+ * (`getBoundingClientRect().top`) and restored it by forcing the viewport
+ * back to that exact offset. That is correct only if the reader never
+ * touches the scroll position between capture and restore — but the whole
+ * point of the older-history sentinel is that it fires 400px before the top
+ * *while the reader is actively scrolling*, during the `await loadOlder()`
+ * network round trip. Any scrolling the reader did in that window got
+ * silently erased by the viewport-absolute restore (teleport), and could
+ * double up with the browser's own native `overflow-anchor` compensation.
+ *
+ * Fix: measure and restore in CONTENT space, not viewport space. Content-space
+ * top (`rect.top - containerRect.top + container.scrollTop`) is invariant
+ * under the reader's own scrolling — scrolling changes `rect.top` and
+ * `scrollTop` by equal and opposite amounts, so they cancel — and changes
+ * only by the height actually inserted above the anchor. Restoring by
+ * re-adding that delta (`scrollTop += newContentTop - capturedContentTop`)
+ * therefore compensates for the prepend alone: zero inserted height means
+ * zero adjustment, and whatever the reader did with the scrollbar in between
+ * is left untouched.
+ *
+ * WHEN to correct is the other half. A one-shot restore one animation frame
+ * after `await loadOlder()` assumed the page had rendered by then. During a
+ * live reply it has not: the transcript is paced (`usePacedStoreValue`, 50ms),
+ * the stream keeps the pacer's window open, so the older page is delivered on
+ * the trailing edge — after the restore measured a zero delta. The page then
+ * rendered above the reader uncorrected: the view jumped by its height. The
+ * "Loading older messages" row moves the reader too: it mounts above every
+ * turn after the capture, and comes down 600ms after the page lands.
+ *
+ * So the anchor is HELD (`holdTurnScrollAnchor`) from the capture until the
+ * caller releases it: every layout pass that changes the transcript's height
+ * re-applies the correction in a ResizeObserver callback, which the browser
+ * runs after layout and before paint. No frame is painted with the jump,
+ * whenever the content lands.
+ */
+export interface TurnScrollAnchor {
+    element: HTMLElement;
+    /** The anchor's position in content space at capture time. */
+    contentTop: number;
+}
+export declare function captureTurnScrollAnchor(container: HTMLElement): TurnScrollAnchor | null;
+/**
+ * Keep `anchor` where the reader sees it until the returned `release` runs.
+ *
+ * Every resize of `content` re-measures the anchor in content space and moves
+ * `scrollTop` by exactly the height that appeared or disappeared above it; a
+ * change inside or below the anchor measures zero and writes nothing. `release`
+ * applies the last change first — call it in the commit that makes that change
+ * (a layout effect runs before the ResizeObserver would) — then stops. It is
+ * idempotent. An anchor that left the DOM is never written.
+ */
+export declare function holdTurnScrollAnchor(container: HTMLElement, content: HTMLElement, anchor: TurnScrollAnchor | null): () => void;

package/dist/session/thread/session-history-scroll.js

@@ -0,0 +1,88 @@
+/**
+ * History-prepend scroll restoration.
+ *
+ * A prior version stored the anchor's VIEWPORT-relative top
+ * (`getBoundingClientRect().top`) and restored it by forcing the viewport
+ * back to that exact offset. That is correct only if the reader never
+ * touches the scroll position between capture and restore — but the whole
+ * point of the older-history sentinel is that it fires 400px before the top
+ * *while the reader is actively scrolling*, during the `await loadOlder()`
+ * network round trip. Any scrolling the reader did in that window got
+ * silently erased by the viewport-absolute restore (teleport), and could
+ * double up with the browser's own native `overflow-anchor` compensation.
+ *
+ * Fix: measure and restore in CONTENT space, not viewport space. Content-space
+ * top (`rect.top - containerRect.top + container.scrollTop`) is invariant
+ * under the reader's own scrolling — scrolling changes `rect.top` and
+ * `scrollTop` by equal and opposite amounts, so they cancel — and changes
+ * only by the height actually inserted above the anchor. Restoring by
+ * re-adding that delta (`scrollTop += newContentTop - capturedContentTop`)
+ * therefore compensates for the prepend alone: zero inserted height means
+ * zero adjustment, and whatever the reader did with the scrollbar in between
+ * is left untouched.
+ *
+ * WHEN to correct is the other half. A one-shot restore one animation frame
+ * after `await loadOlder()` assumed the page had rendered by then. During a
+ * live reply it has not: the transcript is paced (`usePacedStoreValue`, 50ms),
+ * the stream keeps the pacer's window open, so the older page is delivered on
+ * the trailing edge — after the restore measured a zero delta. The page then
+ * rendered above the reader uncorrected: the view jumped by its height. The
+ * "Loading older messages" row moves the reader too: it mounts above every
+ * turn after the capture, and comes down 600ms after the page lands.
+ *
+ * So the anchor is HELD (`holdTurnScrollAnchor`) from the capture until the
+ * caller releases it: every layout pass that changes the transcript's height
+ * re-applies the correction in a ResizeObserver callback, which the browser
+ * runs after layout and before paint. No frame is painted with the jump,
+ * whenever the content lands.
+ */
+function contentSpaceTop(container, element) {
+    const containerRect = container.getBoundingClientRect();
+    const elementRect = element.getBoundingClientRect();
+    return elementRect.top - containerRect.top + container.scrollTop;
+}
+export function captureTurnScrollAnchor(container) {
+    const containerTop = container.getBoundingClientRect().top;
+    const turns = container.querySelectorAll('[data-turn-id]');
+    const element = Array.from(turns).find((turn) => turn.getBoundingClientRect().bottom >= containerTop) ??
+        turns.item(turns.length - 1);
+    if (!element)
+        return null;
+    return {
+        element,
+        contentTop: contentSpaceTop(container, element),
+    };
+}
+/**
+ * Keep `anchor` where the reader sees it until the returned `release` runs.
+ *
+ * Every resize of `content` re-measures the anchor in content space and moves
+ * `scrollTop` by exactly the height that appeared or disappeared above it; a
+ * change inside or below the anchor measures zero and writes nothing. `release`
+ * applies the last change first — call it in the commit that makes that change
+ * (a layout effect runs before the ResizeObserver would) — then stops. It is
+ * idempotent. An anchor that left the DOM is never written.
+ */
+export function holdTurnScrollAnchor(container, content, anchor) {
+    if (!anchor)
+        return () => { };
+    let heldTop = anchor.contentTop;
+    const apply = () => {
+        if (heldTop === null || !anchor.element.isConnected || !container.contains(anchor.element))
+            return;
+        const top = contentSpaceTop(container, anchor.element);
+        const inserted = top - heldTop;
+        heldTop = top;
+        if (inserted !== 0)
+            container.scrollTop += inserted;
+    };
+    const observer = new ResizeObserver(apply);
+    observer.observe(content);
+    return () => {
+        if (heldTop === null)
+            return;
+        apply();
+        heldTop = null;
+        observer.disconnect();
+    };
+}

package/dist/session/thread/session-history.d.ts

@@ -0,0 +1,22 @@
+import { type SessionLogMessage, type SessionLogReferencedText, type SessionLogRestoreNotice, type SessionLogTurn } from '@kortix/sdk';
+export declare const harnessName: (id: string) => string;
+/** A text length in kB (or MB from 1 MB on), rounded up, in the viewer's locale. */
+export declare function formatTextSize(bytes: number, locale: string): string;
+/** The thread holds a message the model does not see that the hide toggle would remove. */
+export declare const hasOutOfContext: (messages: readonly SessionLogMessage[] | undefined) => boolean;
+export declare function RestoreNotice({ notice, onDismiss }: {
+    notice: SessionLogRestoreNotice;
+    onDismiss: () => void;
+}): import("react").JSX.Element;
+export declare function RestoreNoteMarker(): import("react").JSX.Element;
+export declare function HarnessSwitchMarker({ harness }: {
+    harness: string;
+}): import("react").JSX.Element;
+export type FullTextState = 'idle' | 'loading' | 'error';
+export declare function referencedTextsOf(turn: SessionLogTurn): SessionLogReferencedText[];
+/** The full-text control of one turn, or nothing when the turn shows no preview. */
+export declare function TurnFullText({ turn, state, onLoad, }: {
+    turn: SessionLogTurn;
+    state: FullTextState;
+    onLoad: (turnId: string, refs: readonly SessionLogReferencedText[]) => void;
+}): import("react").JSX.Element | null;

package/dist/session/thread/session-history.js

@@ -0,0 +1,90 @@
+'use client';
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+/**
+ * A session's history in the transcript (P5.6), drawn from the session log through the SDK
+ * (`sessionLogRestoreNotice`, `isSessionLogRestoreNote`, `sessionLogHarnessSwitches`,
+ * `sessionLogReferencedTexts`):
+ * - `RestoreNotice`: what a partial restore could not bring back, at the top of the transcript,
+ *   dismissible per restore.
+ * - `TranscriptMarker`: one line in the transcript, rule, pill, rule (the compaction marker's
+ *   grammar), for the restore note and for a harness switch.
+ * - `FullTextControl`: a turn that shows a 16 kB preview of a long text loads the whole text
+ *   on request, never on its own: inline up to 1 MB in all; above it the large texts download
+ *   as files and the small ones still show inline (`sessionLogFullTextAction`,
+ *   `sessionLogFullTextPlan`).
+ */
+import { ArrowsLeftRightIcon, ClockCounterClockwiseIcon, XIcon } from '@phosphor-icons/react';
+import { sessionLogFullTextAction, sessionLogReferencedTexts, } from '@kortix/sdk';
+import { Button } from '../../primitives/button.js';
+import { InfoBanner } from '../../primitives/info-banner.js';
+import { useLocale, useTranslations } from '../../i18n/index.js';
+/** A harness id as a person reads it. An id this list does not know shows as it is. */
+const HARNESS_NAMES = { opencode: 'OpenCode', pi: 'pi' };
+export const harnessName = (id) => HARNESS_NAMES[id] ?? id;
+/** A text length in kB (or MB from 1 MB on), rounded up, in the viewer's locale. */
+export function formatTextSize(bytes, locale) {
+    const mb = bytes >= 1024 * 1024;
+    const value = mb ? Math.ceil((bytes / (1024 * 1024)) * 10) / 10 : Math.ceil(bytes / 1024);
+    return new Intl.NumberFormat(locale, { style: 'unit', unit: mb ? 'megabyte' : 'kilobyte', maximumFractionDigits: 1 }).format(value);
+}
+/** The thread holds a message the model does not see that the hide toggle would remove. */
+export const hasOutOfContext = (messages) => !!messages?.some((m) => !m.in_context && m.status !== 'streaming');
+/** One literal `t()` call per kind, so the i18n audit resolves every key. */
+function missingLabel(t, kind, count) {
+    switch (kind) {
+        case 'message':
+            return t('missingMessage', { count });
+        case 'attachment':
+            return t('missingAttachment', { count });
+        case 'text':
+            return t('missingText', { count });
+        case 'tool_input':
+            return t('missingToolInput', { count });
+        case 'tool_result':
+            return t('missingToolResult', { count });
+        case 'cut_point':
+            return t('missingCutPoint', { count });
+        default:
+            return t('missingOther', { count });
+    }
+}
+export function RestoreNotice({ notice, onDismiss }) {
+    const t = useTranslations('sessionUi.history');
+    const locale = useLocale();
+    const items = new Intl.ListFormat(locale, { style: 'narrow', type: 'unit' }).format(notice.missing.map((m) => missingLabel(t, m.kind, m.count)));
+    return (
+    // `info`: the neutral tone keeps `Alert`'s default fill under a hairline (two boundaries).
+    _jsxs(InfoBanner, { tone: "info", role: "status", "data-restore-notice": "", className: "mb-6 rounded-md", icon: ClockCounterClockwiseIcon, title: t('restoreTitle'), action: _jsx(Button, { variant: "ghost", size: "icon-sm", onClick: onDismiss, "aria-label": t('restoreDismiss'), className: "text-muted-foreground", children: _jsx(XIcon, { className: "size-4" }) }), children: [notice.missing.length > 0 && _jsxs("span", { children: [t('restoreMissing', { items }), " "] }), t('restoreAgent')] }));
+}
+function TranscriptMarker({ icon: Icon, label, kind }) {
+    return (_jsxs("div", { role: "note", "data-transcript-marker": kind, className: "flex items-center gap-2 py-2", children: [_jsx("div", { className: "bg-border h-px flex-1" }), _jsxs("div", { className: "bg-muted flex shrink-0 items-center gap-2 rounded-md px-3 py-1.5", children: [_jsx(Icon, { className: "text-muted-foreground size-3.5 shrink-0" }), _jsx("span", { className: "text-muted-foreground text-xs", children: label })] }), _jsx("div", { className: "bg-border h-px flex-1" })] }));
+}
+export function RestoreNoteMarker() {
+    const t = useTranslations('sessionUi.history');
+    return _jsx(TranscriptMarker, { kind: "restore", icon: ClockCounterClockwiseIcon, label: t('restoreNote') });
+}
+export function HarnessSwitchMarker({ harness }) {
+    const t = useTranslations('sessionUi.history');
+    return _jsx(TranscriptMarker, { kind: "harness", icon: ArrowsLeftRightIcon, label: t('harnessSwitch', { harness: harnessName(harness) }) });
+}
+/** The texts a turn shows as a 16 kB preview (`sessionLogReferencedTexts`), once per turn object. */
+const turnReferencedTexts = new WeakMap();
+export function referencedTextsOf(turn) {
+    let refs = turnReferencedTexts.get(turn);
+    if (!refs)
+        turnReferencedTexts.set(turn, (refs = sessionLogReferencedTexts([turn.user, ...turn.assistant])));
+    return refs;
+}
+/** The full-text control of one turn, or nothing when the turn shows no preview. */
+export function TurnFullText({ turn, state, onLoad, }) {
+    const refs = referencedTextsOf(turn);
+    if (refs.length === 0)
+        return null;
+    return (_jsx(FullTextControl, { count: refs.length, bytes: refs.reduce((n, r) => n + r.bytes, 0), download: sessionLogFullTextAction(refs) === 'download', state: state, onLoad: () => onLoad(turn.id, refs) }));
+}
+function FullTextControl({ count, bytes, download, state, onLoad }) {
+    const t = useTranslations('sessionUi.history');
+    const locale = useLocale();
+    const loading = state === 'loading';
+    return (_jsxs("div", { "data-full-text-control": state, className: "text-muted-foreground mt-2.5 flex flex-wrap items-center gap-2 text-xs", children: [_jsx("span", { children: state === 'error' ? t('fullTextError') : t('fullTextPreview', { count }) }), _jsx(Button, { type: "button", variant: "outline-ghost", size: "sm", disabled: loading, "aria-busy": loading || undefined, onClick: onLoad, children: state === 'error' ? t('fullTextRetry') : t(download ? 'fullTextDownload' : 'fullTextShow', { size: formatTextSize(bytes, locale) }) })] }));
+}

package/dist/session/thread/session-older-autoload.d.ts

@@ -0,0 +1,82 @@
+/** State the top-of-transcript sentinel decides on. */
+export interface OlderHistoryAutoloadState {
+    /** The sentinel is within `rootMargin` of the transcript scroll root. */
+    isIntersecting: boolean;
+    /** The sync engine still holds a cursor for older messages. */
+    hasOlder: boolean;
+    /** A pull is already in flight. */
+    isLoadingOlder: boolean;
+    /** The last pull rejected. Re-arming on failure would spin. */
+    lastPullFailed: boolean;
+    /** Pages this session has already pulled AUTOMATICALLY. Absent counts as
+     *  none — a fresh session, not an exhausted one. */
+    autoLoadedPages?: number;
+    /**
+     * The reader has scrolled the transcript UP at least once.
+     *
+     * Without this the sentinel fired on mount: with the first page smaller than
+     * the viewport its top edge is inside the 400px margin before anyone
+     * touches anything, so a session open cost three reads instead of one
+     * (`message?limit=20` + two `before=` pages, measured on a real session).
+     * History is pulled when a reader reaches for it, not because the page is
+     * short. Absent counts as "not yet".
+     */
+    readerScrolledUp?: boolean;
+    /**
+     * The sentinel's re-arm latch. A pull disarms it; the sentinel leaving the
+     * `rootMargin` zone re-arms it (see `nextOlderAutoloadArm`).
+     *
+     * Without it, a pull that prepends 50 short turns without pushing the
+     * sentinel out of the 400px margin leaves it intersecting, so the observer
+     * re-fires immediately and CHAINS pulls in one paint — the "keeps fetching
+     * more and more" report. `undefined` counts as armed, so callers that do not
+     * track the latch keep the old behaviour.
+     */
+    armed?: boolean;
+}
+/**
+ * How many pages the sentinel may pull on its own before a reader has to ask.
+ *
+ * A transcript never sheds what it pulls: the turns stay in the DOM, their parts
+ * stay in the sync store, and every image keeps a decoded bitmap alive — a
+ * session page unmounts nothing. Uncapped, idle scrolling walks a long thread's
+ * entire history into memory, which is the retention behind a tab the browser
+ * discards and reloads by itself.
+ *
+ * Four pages on top of the first is 250 messages — past any conversation a
+ * reader scrolls through without meaning to, and far short of the sizes where
+ * the page starts to hurt. Reading further back is still one click away; it
+ * just stops being something a scroll does by accident.
+ */
+export declare const OLDER_AUTOLOAD_MAX_PAGES = 4;
+/** The sentinel has spent its budget and the reader must ask for more. Drives
+ *  the manual control; never blocks an explicit pull. */
+export declare function olderAutoloadExhausted(state: {
+    hasOlder: boolean;
+    autoLoadedPages?: number;
+}): boolean;
+/** Decides whether the top sentinel coming into view should pull the previous
+ *  page of history — the transcript equivalent of
+ *  `shouldFetchNextMarketplacePage`, extracted for the same reason: the paging
+ *  decision is then unit-testable without a real `IntersectionObserver`.
+ *
+ *  `lastPullFailed` is the one condition the old manual button gave us for
+ *  free. An observer re-arms whenever its dependencies change, so a cursor the
+ *  runtime keeps rejecting would otherwise become an unbounded retry loop;
+ *  after a failure the transcript falls back to an explicit retry affordance. */
+export declare function shouldLoadOlderHistory(state: OlderHistoryAutoloadState): boolean;
+/**
+ * The next re-arm state for the top sentinel, after an observer callback.
+ *
+ * A pull DISARMS the sentinel; it re-arms only once it has left the
+ * `rootMargin` zone (`isIntersecting === false`). So a prepend that lands short
+ * turns without pushing the sentinel out of view cannot chain a second pull —
+ * the reader has to scroll up again (moving the sentinel out and back into the
+ * zone) for the next automatic page. Pure, so the debounce is a test rather
+ * than a convention.
+ */
+export declare function nextOlderAutoloadArm(input: {
+    armed: boolean;
+    isIntersecting: boolean;
+    didPull: boolean;
+}): boolean;

package/dist/session/thread/session-older-autoload.js

@@ -0,0 +1,55 @@
+/**
+ * How many pages the sentinel may pull on its own before a reader has to ask.
+ *
+ * A transcript never sheds what it pulls: the turns stay in the DOM, their parts
+ * stay in the sync store, and every image keeps a decoded bitmap alive — a
+ * session page unmounts nothing. Uncapped, idle scrolling walks a long thread's
+ * entire history into memory, which is the retention behind a tab the browser
+ * discards and reloads by itself.
+ *
+ * Four pages on top of the first is 250 messages — past any conversation a
+ * reader scrolls through without meaning to, and far short of the sizes where
+ * the page starts to hurt. Reading further back is still one click away; it
+ * just stops being something a scroll does by accident.
+ */
+export const OLDER_AUTOLOAD_MAX_PAGES = 4;
+/** The sentinel has spent its budget and the reader must ask for more. Drives
+ *  the manual control; never blocks an explicit pull. */
+export function olderAutoloadExhausted(state) {
+    return state.hasOlder && (state.autoLoadedPages ?? 0) >= OLDER_AUTOLOAD_MAX_PAGES;
+}
+/** Decides whether the top sentinel coming into view should pull the previous
+ *  page of history — the transcript equivalent of
+ *  `shouldFetchNextMarketplacePage`, extracted for the same reason: the paging
+ *  decision is then unit-testable without a real `IntersectionObserver`.
+ *
+ *  `lastPullFailed` is the one condition the old manual button gave us for
+ *  free. An observer re-arms whenever its dependencies change, so a cursor the
+ *  runtime keeps rejecting would otherwise become an unbounded retry loop;
+ *  after a failure the transcript falls back to an explicit retry affordance. */
+export function shouldLoadOlderHistory(state) {
+    return (state.armed !== false &&
+        state.readerScrolledUp === true &&
+        state.isIntersecting &&
+        state.hasOlder &&
+        !state.isLoadingOlder &&
+        !state.lastPullFailed &&
+        !olderAutoloadExhausted(state));
+}
+/**
+ * The next re-arm state for the top sentinel, after an observer callback.
+ *
+ * A pull DISARMS the sentinel; it re-arms only once it has left the
+ * `rootMargin` zone (`isIntersecting === false`). So a prepend that lands short
+ * turns without pushing the sentinel out of view cannot chain a second pull —
+ * the reader has to scroll up again (moving the sentinel out and back into the
+ * zone) for the next automatic page. Pure, so the debounce is a test rather
+ * than a convention.
+ */
+export function nextOlderAutoloadArm(input) {
+    if (input.didPull)
+        return false;
+    if (!input.isIntersecting)
+        return true;
+    return input.armed;
+}

package/dist/session/thread/session-older-loading.d.ts

@@ -0,0 +1,41 @@
+/**
+ * How long the "loading older messages" row stays on screen after the pull
+ * that raised it has landed.
+ *
+ * An older-history pull against a warm session is a single request and often
+ * lands inside 150ms. Rendered raw, the row is a flash — one frame of text
+ * that is gone before it can be read, which is worse than no indicator at all:
+ * the transcript still grows upward, and nothing ever explained why. Held, it
+ * is a sentence the reader has time to finish, and the prepended turns arrive
+ * underneath it.
+ *
+ * 600ms also outlasts a 2Hz observer, so "a loading state was shown" is
+ * something the E2E harness can actually catch rather than race.
+ */
+export declare const OLDER_LOADING_MIN_MS = 600;
+/** What the older-history row should do this commit. */
+export type OlderLoadingPhase = 'show' | 'hold' | 'hide';
+/**
+ * Pure: the row's phase, from the live flag and whether the row is already up.
+ *
+ * - `show` — a pull is in flight; the row is up now, in this commit.
+ * - `hold` — the pull landed while the row was up: keep it for
+ *   `OLDER_LOADING_MIN_MS`, then take it down.
+ * - `hide` — nothing to say.
+ *
+ * Separated from the timer so the anti-flash rule is a test rather than a
+ * reading of `useEffect`.
+ */
+export declare function olderLoadingPhase(input: {
+    isLoadingOlder: boolean;
+    visible: boolean;
+}): OlderLoadingPhase;
+/**
+ * The live flag, kept up for `OLDER_LOADING_MIN_MS` after the pull ends.
+ *
+ * The row is raised by the adjust-state-during-render pattern, not by an
+ * effect: it must be up in the SAME commit the pull starts, and an effect that
+ * raises it is both a frame late and a cascading render. The one effect here
+ * does what only a timer can — take the row back down.
+ */
+export declare function useHeldOlderLoading(isLoadingOlder: boolean, minMs?: number): boolean;

package/dist/session/thread/session-older-loading.js

@@ -0,0 +1,57 @@
+'use client';
+import { useEffect, useState } from 'react';
+/**
+ * How long the "loading older messages" row stays on screen after the pull
+ * that raised it has landed.
+ *
+ * An older-history pull against a warm session is a single request and often
+ * lands inside 150ms. Rendered raw, the row is a flash — one frame of text
+ * that is gone before it can be read, which is worse than no indicator at all:
+ * the transcript still grows upward, and nothing ever explained why. Held, it
+ * is a sentence the reader has time to finish, and the prepended turns arrive
+ * underneath it.
+ *
+ * 600ms also outlasts a 2Hz observer, so "a loading state was shown" is
+ * something the E2E harness can actually catch rather than race.
+ */
+export const OLDER_LOADING_MIN_MS = 600;
+/**
+ * Pure: the row's phase, from the live flag and whether the row is already up.
+ *
+ * - `show` — a pull is in flight; the row is up now, in this commit.
+ * - `hold` — the pull landed while the row was up: keep it for
+ *   `OLDER_LOADING_MIN_MS`, then take it down.
+ * - `hide` — nothing to say.
+ *
+ * Separated from the timer so the anti-flash rule is a test rather than a
+ * reading of `useEffect`.
+ */
+export function olderLoadingPhase(input) {
+    if (input.isLoadingOlder)
+        return 'show';
+    return input.visible ? 'hold' : 'hide';
+}
+/**
+ * The live flag, kept up for `OLDER_LOADING_MIN_MS` after the pull ends.
+ *
+ * The row is raised by the adjust-state-during-render pattern, not by an
+ * effect: it must be up in the SAME commit the pull starts, and an effect that
+ * raises it is both a frame late and a cascading render. The one effect here
+ * does what only a timer can — take the row back down.
+ */
+export function useHeldOlderLoading(isLoadingOlder, minMs = OLDER_LOADING_MIN_MS) {
+    const [wasLoading, setWasLoading] = useState(isLoadingOlder);
+    const [visible, setVisible] = useState(isLoadingOlder);
+    if (wasLoading !== isLoadingOlder) {
+        setWasLoading(isLoadingOlder);
+        if (isLoadingOlder)
+            setVisible(true);
+    }
+    useEffect(() => {
+        if (olderLoadingPhase({ isLoadingOlder, visible }) !== 'hold')
+            return;
+        const timer = setTimeout(() => setVisible(false), minMs);
+        return () => clearTimeout(timer);
+    }, [isLoadingOlder, visible, minMs]);
+    return visible;
+}