@kortix/ui 0.0.0-stage → 0.14.4

package/dist/session/turn/status-elapsed.js

@@ -0,0 +1,14 @@
+export function statusElapsedFrame(previous, input) {
+    if (!previous || previous.status !== input.status || previous.working !== input.working) {
+        return {
+            status: input.status,
+            working: input.working,
+            startedAtMs: input.nowMs,
+            elapsedMs: 0,
+        };
+    }
+    return {
+        ...previous,
+        elapsedMs: input.working ? Math.max(0, input.nowMs - previous.startedAtMs) : 0,
+    };
+}

package/dist/session/turn/streaming-cadence.d.ts

@@ -0,0 +1,69 @@
+/** Slowest reveal while text is waiting, so a small backlog never trickles letter by letter. */
+export declare const STREAM_MIN_CPS = 30;
+/**
+ * Minimum gap between two renders of the streaming message (~30 a second).
+ * Each render re-splits the message into blocks and re-parses the tail block;
+ * at 60 a second that is the main-thread cost of a stream, and the per-word
+ * fade already hides the step between two renders.
+ */
+export declare const STREAM_COMMIT_MS = 32;
+/**
+ * The per-word fade (`.kx-stream-word` in styles/components.css, 300 ms) plus the
+ * widest stagger delay (`STREAM_STAGGER_WINDOW_MS`). The message stays in
+ * its streaming render this long after the last word lands, so that word
+ * finishes its fade instead of snapping to full opacity.
+ */
+export declare const STREAM_FADE_MS: number;
+/**
+ * Text that has waited longer than this since it arrived shows at once. A
+ * stalled main thread or a long gap between frames never leaves the reveal
+ * trailing the network.
+ */
+export declare const STREAM_MAX_LAG_MS = 500;
+/**
+ * The end of the reveal for a char `budget` past `from`, on a word boundary.
+ *
+ * The cut extends to the end of the word it lands in, so a word never shows
+ * half-written. While the stream is live the trailing word may still be
+ * arriving: the cut stops before it (`final: false`). A syntax-only word
+ * pulls the next word in with it (see `SYNTAX_ONLY`).
+ */
+export declare function revealCut(text: string, from: number, budget: number, final: boolean): number;
+export interface PacerClock {
+    now: () => number;
+    requestFrame: (fn: () => void) => unknown;
+    cancelFrame: (id: never) => void;
+    /** A hidden tab runs no frames: the pacer shows the text at once there. */
+    hidden: () => boolean;
+}
+/**
+ * Framework-free so the schedule is unit-tested with a manual clock.
+ * `show(text, streaming)` receives every render; `streaming: false` is the
+ * one final call once the text is complete and its last word has faded in.
+ *
+ * - `initial` shows at once, as streaming when `initialStreaming`.
+ * - `push(text, true)` sets a new target. Text that does not extend the shown
+ *   text (an edit, a revert) shows at once.
+ * - `push(text, false)` ends the stream. The rest shows in the same frame,
+ *   its words fade in, and the message settles after the fade. A value that
+ *   was never streamed shows at once.
+ */
+export declare function createStreamPacer(show: (text: string, streaming: boolean) => void, initial: string, clock?: PacerClock, initialStreaming?: boolean): {
+    push(text: string, isActive: boolean): void;
+    dispose: () => void;
+};
+/**
+ * `value`, revealed at a steady pace while `active`, and whether the message
+ * must still render as streaming. That stays true after `active` turns false
+ * while the last words fade in (a few hundred ms), so the switch to the
+ * settled render changes nothing visible.
+ *
+ * Text the client already holds when the segment mounts shows at full length:
+ * only text that arrives after mount is paced. The one exception is a remount
+ * within `RESUME_WINDOW_MS` of the last reveal under the same `revealKey`
+ * (`message_id:block_id`), which resumes from the length already shown.
+ */
+export declare function useStreamingCadence(rawValue: string, active: boolean, revealKey?: string, clock?: PacerClock): {
+    text: string;
+    streaming: boolean;
+};

package/dist/session/turn/streaming-cadence.js

@@ -0,0 +1,304 @@
+'use client';
+import { useEffect, useRef, useState } from 'react';
+/**
+ * Streamed text reaches the client in network chunks of any size and at any
+ * spacing: one token every 16 ms, or a paragraph after a 300 ms stall.
+ * Painting each chunk as it lands is what made a reply arrive in lumps.
+ *
+ * The pacer reveals the received text word by word at the speed the text is
+ * ARRIVING (measured over the last `ARRIVAL_WINDOW_MS`), and keeps a small
+ * reserve in hand so the reveal does not stall in the gap between two chunks.
+ * The reserve is sized from the largest recent gap. The result is one
+ * steady velocity that follows the model's real speed — the reveal does not
+ * surge after each chunk and then crawl while the reserve empties.
+ */
+/** Window over which the arrival speed and the chunk gaps are measured. */
+const ARRIVAL_WINDOW_MS = 1200;
+/** Bounds of the reserve, as time at the arrival speed. */
+const MIN_RESERVE_MS = 90;
+const MAX_RESERVE_MS = 250;
+/** How hard the speed corrects toward the reserve: the error closes by ~63% in this time. */
+const CORRECTION_MS = 350;
+/** How fast the reveal speed follows its target. Without it a big chunk is a visible jump. */
+const RATE_SMOOTHING_MS = 150;
+/** Slowest reveal while text is waiting, so a small backlog never trickles letter by letter. */
+export const STREAM_MIN_CPS = 30;
+/**
+ * Minimum gap between two renders of the streaming message (~30 a second).
+ * Each render re-splits the message into blocks and re-parses the tail block;
+ * at 60 a second that is the main-thread cost of a stream, and the per-word
+ * fade already hides the step between two renders.
+ */
+export const STREAM_COMMIT_MS = 32;
+/**
+ * The per-word fade (`.kx-stream-word` in styles/components.css, 300 ms) plus the
+ * widest stagger delay (`STREAM_STAGGER_WINDOW_MS`). The message stays in
+ * its streaming render this long after the last word lands, so that word
+ * finishes its fade instead of snapping to full opacity.
+ */
+export const STREAM_FADE_MS = 300 + 40; // the fade + its widest stagger delay
+/**
+ * Text that has waited longer than this since it arrived shows at once. A
+ * stalled main thread or a long gap between frames never leaves the reveal
+ * trailing the network.
+ */
+export const STREAM_MAX_LAG_MS = 500;
+/** Unspent budget carries over at most this much frame time (see `tick`). */
+const BUDGET_FRAME_MS = 100;
+/**
+ * A segment that remounts within this long of its last reveal resumes from
+ * the length the reader had seen (see `useStreamingCadence`). Later, it
+ * mounts at its full length.
+ */
+const RESUME_WINDOW_MS = 500;
+/**
+ * A "word" that is only markdown syntax (`##`, `-`, `1.`, `>`, `|`, a fence)
+ * renders as an empty block until its first real word arrives. Revealing it
+ * together with that word keeps an empty heading or bullet from flashing in.
+ */
+const SYNTAX_ONLY = /^(?:[#>*+\-|`~=_:]+|\d+[.)])$/;
+const isSpace = (ch) => ch === ' ' || ch === '\n' || ch === '\t' || ch === '\r';
+/**
+ * The end of the reveal for a char `budget` past `from`, on a word boundary.
+ *
+ * The cut extends to the end of the word it lands in, so a word never shows
+ * half-written. While the stream is live the trailing word may still be
+ * arriving: the cut stops before it (`final: false`). A syntax-only word
+ * pulls the next word in with it (see `SYNTAX_ONLY`).
+ */
+export function revealCut(text, from, budget, final) {
+    const len = text.length;
+    let cut = Math.min(len, from + Math.max(0, Math.floor(budget)));
+    for (;;) {
+        while (cut < len && !isSpace(text[cut]))
+            cut++;
+        if (cut === len && !final) {
+            // A link destination still arriving (`[label](https://…`) renders as its
+            // label or its setup card, never as half a word: reveal it as it arrives.
+            let wordStart = cut;
+            while (wordStart > from && !isSpace(text[wordStart - 1]))
+                wordStart--;
+            if (text.lastIndexOf('](', len) >= wordStart)
+                return len;
+            // The trailing word may be incomplete: back off to the space before it,
+            // and past any syntax-only word that would then end the text.
+            cut = wordStart;
+            for (;;) {
+                let end = cut;
+                while (end > from && isSpace(text[end - 1]))
+                    end--;
+                let start = end;
+                while (start > from && !isSpace(text[start - 1]))
+                    start--;
+                if (start === end || !SYNTAX_ONLY.test(text.slice(start, end)))
+                    return cut;
+                cut = start;
+            }
+        }
+        if (cut >= len)
+            return len;
+        let wordStart = cut;
+        while (wordStart > from && !isSpace(text[wordStart - 1]))
+            wordStart--;
+        if (!SYNTAX_ONLY.test(text.slice(wordStart, cut)))
+            return cut;
+        while (cut < len && isSpace(text[cut]))
+            cut++;
+    }
+}
+const defaultClock = {
+    now: () => performance.now(),
+    requestFrame: (fn) => requestAnimationFrame(fn),
+    cancelFrame: (id) => cancelAnimationFrame(id),
+    hidden: () => typeof document !== 'undefined' && document.hidden,
+};
+/**
+ * Framework-free so the schedule is unit-tested with a manual clock.
+ * `show(text, streaming)` receives every render; `streaming: false` is the
+ * one final call once the text is complete and its last word has faded in.
+ *
+ * - `initial` shows at once, as streaming when `initialStreaming`.
+ * - `push(text, true)` sets a new target. Text that does not extend the shown
+ *   text (an edit, a revert) shows at once.
+ * - `push(text, false)` ends the stream. The rest shows in the same frame,
+ *   its words fade in, and the message settles after the fade. A value that
+ *   was never streamed shows at once.
+ */
+export function createStreamPacer(show, initial, clock = defaultClock, initialStreaming = false) {
+    let target = initial;
+    let shown = initial;
+    let active = false;
+    let streamed = false;
+    // A message that mounts mid-stream is already in its streaming render, so
+    // the end of the stream must settle it even when no new text arrives.
+    let settled = !initialStreaming;
+    let rate = 0;
+    let budget = 0;
+    let lastFrameAt = 0;
+    let lastCommitAt = -Infinity;
+    let drainedAt = 0;
+    let frame = null;
+    /** (time, received length) per growth, oldest first, inside `ARRIVAL_WINDOW_MS`. */
+    const arrivals = [];
+    const emit = (text, streaming) => {
+        shown = text;
+        settled = !streaming;
+        show(text, streaming);
+    };
+    const stop = () => {
+        if (frame !== null)
+            clock.cancelFrame(frame);
+        frame = null;
+    };
+    /** Nothing more to reveal right now: the rest is a word still arriving. */
+    const parked = () => active && revealCut(target, shown.length, Infinity, false) <= shown.length;
+    /** Arrival speed (chars/s) and the largest gap between two chunks (ms). */
+    const arrivalStats = (now) => {
+        while (arrivals.length > 0 && now - arrivals[0].at > ARRIVAL_WINDOW_MS)
+            arrivals.shift();
+        if (arrivals.length < 2)
+            return { cps: 0, maxGap: MIN_RESERVE_MS };
+        const first = arrivals[0];
+        let maxGap = now - arrivals[arrivals.length - 1].at;
+        for (let i = 1; i < arrivals.length; i++)
+            maxGap = Math.max(maxGap, arrivals[i].at - arrivals[i - 1].at);
+        const cps = ((target.length - first.len) * 1000) / Math.max(now - first.at, 1);
+        return { cps, maxGap };
+    };
+    const tick = () => {
+        frame = null;
+        const now = clock.now();
+        const dt = now - lastFrameAt;
+        lastFrameAt = now;
+        if (shown === target) {
+            if (active || settled)
+                return;
+            // The last word is still fading in: settle once it has.
+            if (now - drainedAt >= STREAM_FADE_MS)
+                return emit(target, false);
+            frame = clock.requestFrame(tick);
+            return;
+        }
+        // Only a live stream has a backlog here: its end shows the rest at once (`push`).
+        const backlog = target.length - shown.length;
+        const { cps, maxGap } = arrivalStats(now);
+        const reserve = (cps * Math.min(MAX_RESERVE_MS, Math.max(MIN_RESERVE_MS, maxGap * 1.2))) / 1000;
+        const desired = Math.max(STREAM_MIN_CPS, cps + ((backlog - reserve) * 1000) / CORRECTION_MS);
+        rate += (desired - rate) * Math.min(1, dt / RATE_SMOOTHING_MS);
+        // A long frame spends its whole elapsed time, so the reveal speed does not
+        // drop with the frame rate. Unspent budget carries over at most
+        // `BUDGET_FRAME_MS`, so a wait for a word to finish arriving does not bank
+        // a burst for afterwards.
+        budget = Math.min(budget + (rate * dt) / 1000, (rate * Math.max(dt, BUDGET_FRAME_MS)) / 1000);
+        // Text that has waited too long since it arrived shows now.
+        const oldest = arrivals.find((a) => a.len > shown.length);
+        if (!oldest || now - oldest.at > STREAM_MAX_LAG_MS)
+            budget = Infinity;
+        if (now - lastCommitAt >= STREAM_COMMIT_MS) {
+            const cut = revealCut(target, shown.length, budget, !active);
+            if (cut > shown.length) {
+                budget -= cut - shown.length;
+                lastCommitAt = now;
+                emit(target.slice(0, cut), true);
+                if (shown === target)
+                    drainedAt = now;
+            }
+        }
+        if (!parked())
+            frame = clock.requestFrame(tick);
+    };
+    const schedule = () => {
+        if (frame !== null)
+            return;
+        // A restart from rest begins with an empty budget and a fresh frame clock.
+        lastFrameAt = clock.now();
+        budget = 0;
+        frame = clock.requestFrame(tick);
+    };
+    return {
+        push(text, isActive) {
+            const grew = text.length > target.length;
+            target = text;
+            active = isActive;
+            if (isActive)
+                streamed = true;
+            if (isActive && grew)
+                arrivals.push({ at: clock.now(), len: text.length });
+            if (!text.startsWith(shown) || !streamed || clock.hidden()) {
+                stop();
+                if (text !== shown || settled === isActive)
+                    emit(text, isActive);
+                return;
+            }
+            if (!isActive) {
+                // The stream ended: the rest shows now, then the message settles once
+                // its last words have faded in.
+                if (text !== shown) {
+                    stop();
+                    emit(text, true);
+                    drainedAt = clock.now();
+                }
+                else if (frame === null) {
+                    drainedAt = clock.now();
+                }
+                if (!settled)
+                    schedule();
+                return;
+            }
+            if (text === shown)
+                return;
+            if (!parked())
+                schedule();
+        },
+        dispose: stop,
+    };
+}
+/**
+ * How much of each streaming segment the reader has seen, by `revealKey`, so a
+ * remount mid-stream (a session switch, a runtime id hand-off) resumes where
+ * the reveal was instead of jumping ahead or typing again from the start.
+ */
+const revealed = new Map();
+/** ponytail: insertion-order LRU; only the few live segments need an entry. */
+const MAX_REVEALED = 64;
+function rememberReveal(key, len, at) {
+    revealed.delete(key);
+    revealed.set(key, { len, at });
+    if (revealed.size > MAX_REVEALED)
+        revealed.delete(revealed.keys().next().value);
+}
+/**
+ * `value`, revealed at a steady pace while `active`, and whether the message
+ * must still render as streaming. That stays true after `active` turns false
+ * while the last words fade in (a few hundred ms), so the switch to the
+ * settled render changes nothing visible.
+ *
+ * Text the client already holds when the segment mounts shows at full length:
+ * only text that arrives after mount is paced. The one exception is a remount
+ * within `RESUME_WINDOW_MS` of the last reveal under the same `revealKey`
+ * (`message_id:block_id`), which resumes from the length already shown.
+ */
+export function useStreamingCadence(rawValue, active, revealKey, clock = defaultClock) {
+    // A part's text is typed as a string but arrives from the wire; anything
+    // else renders as its string form instead of throwing in `startsWith`.
+    const value = typeof rawValue === 'string' ? rawValue : String(rawValue ?? '');
+    const [state, setState] = useState(() => {
+        const kept = active && revealKey ? revealed.get(revealKey) : undefined;
+        const resume = kept && clock.now() - kept.at < RESUME_WINDOW_MS && kept.len < value.length;
+        return { text: resume ? value.slice(0, kept.len) : value, streaming: active };
+    });
+    const pacerRef = useRef(null);
+    if (pacerRef.current === null) {
+        pacerRef.current = createStreamPacer((text, streaming) => setState({ text, streaming }), state.text, clock, state.streaming);
+    }
+    useEffect(() => {
+        pacerRef.current?.push(value, active);
+    }, [value, active]);
+    useEffect(() => () => pacerRef.current?.dispose(), []);
+    useEffect(() => {
+        if (revealKey && state.streaming)
+            rememberReveal(revealKey, state.text.length, clock.now());
+    }, [revealKey, state, clock]);
+    const text = value.startsWith(state.text) ? state.text : value;
+    return { text, streaming: active || state.streaming || text !== value };
+}

package/dist/session/turn/thought-chain-step.d.ts

@@ -0,0 +1,58 @@
+/**
+ * The model's reasoning, as a row that says so.
+ *
+ * The text used to render inline and unlabelled — a paragraph hanging in the
+ * chain under a clock glyph, always open, with nothing naming it. That made
+ * reasoning the loudest thing in a list of work, and it is the least of it: the
+ * reader came to see what the agent DID.
+ *
+ * So it becomes a row like every other row — `Thinking`, a caret, and the text
+ * behind it. This is also what retired Show more / Show less: a block that opens
+ * needs no second control for opening further.
+ *
+ * It opens itself while the model is still thinking, because live reasoning is
+ * the one time the text is worth more than the label, and closes when the run
+ * settles — unless the reader has taken control, in which case their choice wins
+ * permanently. Same rule, same shape, as the burst around it.
+ *
+ * `running` is THIS thought's own state, never the burst's. A trailing burst
+ * reports running for the whole working turn on purpose — that is what stops
+ * the disclosure blinking shut in the gaps between SSE tool calls — so a
+ * burst-wide flag here made every thought in the turn shimmer at once and
+ * unfurl reasoning that closed twenty steps ago. `mergeBurstSteps` decides.
+ *
+ * The label carries the clock. `Thinking` alone answered "the model is doing
+ * something" and nothing else — no sense of whether that was two seconds or
+ * ninety, which is the one question a reader waiting on a thought actually
+ * has. So it counts up live (`Thinking for 12s`, measured from when this row
+ * went live, not from a provider timestamp that a reload would turn into
+ * nonsense) and settles on the run's real total (`Thought for 12s`, first
+ * fragment's start to the last one's end).
+ *
+ * Sub-second thoughts stay plain `Thinking`: `formatDuration` returns '' under
+ * 1000ms on purpose, and a row that says "0s" is worse than one that says
+ * nothing. Same fallback covers a provider that sends no timing at all.
+ *
+ * `bare` — this thought IS the whole burst — drops the glyph for the reason
+ * every bare row does: the icon is the rail's anchor, and one row has no rail.
+ */
+declare function ThoughtChainStepImpl({ texts, running, durationMs, bare, autoOpen, }: {
+    texts: ReadonlyArray<string>;
+    running: boolean;
+    /** The settled run's total, from `mergeBurstSteps`. */
+    durationMs?: number;
+    /**
+     * This thought IS the whole burst. It drops the glyph for the reason every
+     * bare row does: the icon is the rail's anchor, and one row has no rail.
+     */
+    bare?: boolean;
+    /**
+     * Whether live reasoning may unfurl its paragraph on its own. `false` under
+     * minimal density: the row still shimmers `Thinking`, but the streaming
+     * text stays behind the caret until the reader asks for it. Their click
+     * still wins permanently, exactly as under normal density.
+     */
+    autoOpen?: boolean;
+}): import("react").JSX.Element;
+export declare const ThoughtChainStep: import("react").MemoExoticComponent<typeof ThoughtChainStepImpl>;
+export {};

package/dist/session/turn/thought-chain-step.js

@@ -0,0 +1,161 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { ChainOfThoughtStep } from '../../primitives/chain-of-thought.js';
+import { DisclosureContent } from '../../primitives/disclosure.js';
+import { FadedScrollArea } from '../../primitives/faded-scroll-area.js';
+import { TextShimmer } from '../../primitives/text-shimmer.js';
+import { cn } from '../../lib/utils.js';
+import { formatDuration } from '../../internal/session-types/index.js';
+import { CircleDashedIcon } from '@phosphor-icons/react';
+import { memo, useEffect, useRef, useState } from 'react';
+import { ChainStepTrigger } from './chain-step-trigger.js';
+import { flattenThought } from '@kortix/sdk';
+import { samePartsList } from './same-parts.js';
+const THOUGHT_MAX_H = 'max-h-54';
+/**
+ * Thought body: the model's reasoning, capped and faded.
+ *
+ * There is no Show more / Show less. The cap is not a collapse — it is a
+ * BOUND, and a bound needs no control: the reader opened a burst to see what
+ * the agent did, not to negotiate with a paragraph. The pair of buttons cost a
+ * whole overflow-measurement rig (`canExpand`, a `ResizeObserver`, a resize
+ * listener, a second render branch) and bought a row of chrome under a block
+ * that already fades to say "there is more" and already scrolls to reach it.
+ *
+ * While the model is still thinking the newest words are pinned into view.
+ * Without it the reader is held at the top of a paragraph that keeps growing
+ * underneath the fade — the one moment the cap would actively hide the part
+ * worth reading.
+ */
+function ThoughtStepBody({ texts, running }) {
+    const text = flattenThought(texts);
+    const scrollRef = useRef(null);
+    const pinRaf = useRef(null);
+    // One rAF per frame, not one forced-synchronous layout per SSE token.
+    //
+    // `el.scrollHeight` is a layout read — answering it while the model is
+    // still streaming means flushing whatever layout work React's commit has
+    // pending RIGHT NOW, synchronously, once per text delta. A `useLayoutEffect`
+    // that reads it runs inside React's commit phase, ahead of the browser's own
+    // paint, which is exactly the moment nothing else has forced that flush yet.
+    // Scheduling the read+write inside `requestAnimationFrame` instead moves it
+    // to the point the browser is already about to compute layout for that
+    // frame's paint — the same information, at the point it was free.
+    //
+    // Multiple text deltas can land in the same frame (several SSE messages,
+    // one React commit each) — cancelling any not-yet-run rAF before scheduling
+    // a new one collapses them to the single measurement the frame actually
+    // paints, rather than measuring and writing `scrollTop` once per delta.
+    useEffect(() => {
+        if (!running)
+            return;
+        if (pinRaf.current !== null)
+            cancelAnimationFrame(pinRaf.current);
+        pinRaf.current = requestAnimationFrame(() => {
+            pinRaf.current = null;
+            const el = scrollRef.current;
+            if (el)
+                el.scrollTop = el.scrollHeight;
+        });
+        return () => {
+            if (pinRaf.current !== null) {
+                cancelAnimationFrame(pinRaf.current);
+                pinRaf.current = null;
+            }
+        };
+    }, [running, text]);
+    return (_jsx("div", { className: "min-w-0 flex-1", children: _jsx(FadedScrollArea, { ref: scrollRef, fadeColor: "from-background", rootClassName: cn('h-auto', THOUGHT_MAX_H), className: THOUGHT_MAX_H, children: _jsx("p", { className: "text-foreground/60 text-sm leading-[1.5] text-pretty", children: text }) }) }));
+}
+/**
+ * Whole seconds since this row went live, or 0 when it is not.
+ *
+ * Measured from the client, deliberately, rather than from the part's
+ * `time.start`: a transcript restored hours later carries a start timestamp
+ * from the original run, and subtracting it from `Date.now()` would render
+ * "Thinking for 4h". The settled label uses the provider's timestamps, where
+ * the arithmetic is between two values that belong to the same run.
+ *
+ * One second is the resolution the label shows, so that is the tick rate.
+ */
+function useLiveElapsedMs(running) {
+    const [elapsed, setElapsed] = useState(0);
+    useEffect(() => {
+        if (!running)
+            return;
+        const startedAt = Date.now();
+        const id = setInterval(() => setElapsed(Date.now() - startedAt), 1000);
+        // Reset on the way OUT, not on the way in: a synchronous `setElapsed(0)`
+        // in the effect body is a cascading render, and clearing here means a row
+        // that goes live a second time starts from zero rather than showing the
+        // previous run's count until its first tick.
+        return () => {
+            clearInterval(id);
+            setElapsed(0);
+        };
+    }, [running]);
+    return running ? elapsed : 0;
+}
+/**
+ * The model's reasoning, as a row that says so.
+ *
+ * The text used to render inline and unlabelled — a paragraph hanging in the
+ * chain under a clock glyph, always open, with nothing naming it. That made
+ * reasoning the loudest thing in a list of work, and it is the least of it: the
+ * reader came to see what the agent DID.
+ *
+ * So it becomes a row like every other row — `Thinking`, a caret, and the text
+ * behind it. This is also what retired Show more / Show less: a block that opens
+ * needs no second control for opening further.
+ *
+ * It opens itself while the model is still thinking, because live reasoning is
+ * the one time the text is worth more than the label, and closes when the run
+ * settles — unless the reader has taken control, in which case their choice wins
+ * permanently. Same rule, same shape, as the burst around it.
+ *
+ * `running` is THIS thought's own state, never the burst's. A trailing burst
+ * reports running for the whole working turn on purpose — that is what stops
+ * the disclosure blinking shut in the gaps between SSE tool calls — so a
+ * burst-wide flag here made every thought in the turn shimmer at once and
+ * unfurl reasoning that closed twenty steps ago. `mergeBurstSteps` decides.
+ *
+ * The label carries the clock. `Thinking` alone answered "the model is doing
+ * something" and nothing else — no sense of whether that was two seconds or
+ * ninety, which is the one question a reader waiting on a thought actually
+ * has. So it counts up live (`Thinking for 12s`, measured from when this row
+ * went live, not from a provider timestamp that a reload would turn into
+ * nonsense) and settles on the run's real total (`Thought for 12s`, first
+ * fragment's start to the last one's end).
+ *
+ * Sub-second thoughts stay plain `Thinking`: `formatDuration` returns '' under
+ * 1000ms on purpose, and a row that says "0s" is worse than one that says
+ * nothing. Same fallback covers a provider that sends no timing at all.
+ *
+ * `bare` — this thought IS the whole burst — drops the glyph for the reason
+ * every bare row does: the icon is the rail's anchor, and one row has no rail.
+ */
+function ThoughtChainStepImpl({ texts, running, durationMs, bare, autoOpen = true, }) {
+    const [open, setOpen] = useState(autoOpen && running);
+    const userToggled = useRef(false);
+    const liveElapsed = useLiveElapsedMs(running);
+    const elapsed = formatDuration(running ? liveElapsed : (durationMs ?? 0));
+    const label = elapsed
+        ? running
+            ? `Thinking for ${elapsed}`
+            : `Thought for ${elapsed}`
+        : 'Thinking';
+    useEffect(() => {
+        if (userToggled.current)
+            return;
+        setOpen(autoOpen && running);
+    }, [running, autoOpen]);
+    return (_jsx(ChainOfThoughtStep, { open: open, onOpenChange: (next) => {
+            userToggled.current = true;
+            setOpen(next);
+        }, children: _jsxs(_Fragment, { children: [_jsx(ChainStepTrigger, { icon: !bare && _jsx(CircleDashedIcon, { className: "text-muted-foreground size-4 flex-none" }), label: running ? (_jsx(TextShimmer, { className: "leading-[1.5] font-medium tabular-nums", children: label })) : (_jsx("span", { className: "font-medium tabular-nums", children: label })) }), _jsx(DisclosureContent, { children: _jsx("div", { className: "mt-3 pl-7", children: _jsx(ThoughtStepBody, { texts: texts, running: running }) }) })] }) }));
+}
+export const ThoughtChainStep = memo(ThoughtChainStepImpl, (a, b) => a.running === b.running &&
+    a.durationMs === b.durationMs &&
+    a.bare === b.bare &&
+    a.autoOpen === b.autoOpen &&
+    samePartsList(a.texts, b.texts));
+ThoughtChainStep.displayName = 'ThoughtChainStep';

package/dist/session/turn/throttled-markdown.d.ts

@@ -0,0 +1,38 @@
+/**
+ * A fence opener still being written (`` ```openu ``) would render as an empty code card labelled
+ * with half a language for a tick or two. While streaming, hold back a last line that opens a
+ * fence until its newline arrives. A line that closes a fence is never held.
+ */
+export declare function holdBackFenceOpener(text: string): string;
+/**
+ * Closes an unterminated code fence so the rest of the stream renders as markdown. An open
+ * generative UI fence stays open: `UnifiedMarkdown` reads it as the block still streaming and
+ * closes it itself.
+ */
+export declare function closeUnterminatedCodeFence(text: string): string;
+/**
+ * A table is plain text until its separator row (`|---|`) arrives: a header
+ * row on its own renders as a paragraph of pipes, then jumps into a table.
+ * While streaming, a trailing header row (and a half-written separator) is
+ * held back until the separator is complete, so the table appears as a table.
+ */
+export declare function holdBackTableHeader(text: string): string;
+declare function ThrottledMarkdownImpl({ content, isStreaming, revealKey, response, }: {
+    content: string;
+    isStreaming: boolean;
+    /** `message_id:block_id` of a streaming segment, so a remount resumes its reveal (see `useStreamingCadence`). */
+    revealKey?: string;
+    /**
+     * The turn's answer text. Settled, it renders as `SandboxUrlDetector` does (system tags stripped,
+     * no table-row trim), so the transcript keeps this one component across the turn's end and the
+     * generative UI blocks in it do not remount.
+     */
+    response?: boolean;
+}): import("react").JSX.Element | null;
+/**
+ * Every prop is a primitive, so this memo bites immediately: a settled
+ * segment never re-renders while another one streams. The streaming segment
+ * is paced by `useStreamingCadence` above.
+ */
+export declare const ThrottledMarkdown: import("react").MemoExoticComponent<typeof ThrottledMarkdownImpl>;
+export {};