zidane-ui 9.0.4 → 9.1.3

package/src/chat/transcript/useStickToBottom.ts

@@ -1,600 +0,0 @@
-/**
- * The transcript's scroll contract, in one place:
- *
- *   - Pinned to the bottom, the view follows every growth (streaming text,
- *     rows settling, images, the window getting taller).
- *   - The USER decides when to leave: a wheel tick up, a drag up, PageUp /
- *     ArrowUp / Home unpin at once. Nothing else does. Scrolling back to the
- *     bottom pins again.
- *   - Unpinned, the row at the top of the view stays where it is through
- *     any relayout (window resize, rows above rendering to their real
- *     height, an older page prepended). The browser's own anchoring is
- *     turned off; this is the one correction. A short row whose top is out
- *     of sight holds nothing in view, so the row after it holds instead
- *     (`pick`): what folds shut up there is taken off above the view.
- *   - A disclosure the user toggles (anything `[aria-expanded]`: a fold, a
- *     step, a tool call, thinking) holds its place on screen while what it
- *     opens or closes settles, pinned or not: following the bottom would
- *     send the line just clicked up the screen as its content grows under
- *     it. Afterwards a pinned view stays pinned if it is still at the
- *     bottom; an unpinned one pins only if closing clamped it there.
- *   - Where the view is can be read and put back (`readPosition` /
- *     `restorePosition`), for a scroller that shows something else in
- *     between: the bottom, or the rows under the reader's line (rows carry
- *     their id as `data-row`) and how far down each starts. Putting it
- *     back holds the row there, as a toggled disclosure is held, while the
- *     rows around it mount; then the anchor takes over.
- *
- * Why not "pinned = within N px of the bottom" on scroll events: a
- * programmatic snap's scroll event lands after further growth and reads as
- * far from the bottom (unpinning by itself), and a user's first small wheel
- * tick still reads as within N px (so the next growth snaps back and the
- * user cannot leave). Pinning tracks intent, not distance.
- */
-import { animate } from 'motion';
-import { useCallback, useEffect, useLayoutEffect, useRef, useState, type RefObject } from 'react';
-
-import { currentMotionTransition } from '../../motion/springs';
-import { mountRowNow } from './LazyRow';
-
-/** Scrolling down to within this of the bottom re-pins. */
-const REPIN_PX = 48;
-/** Rows are the anchoring unit; the first one crossing this line under the top edge holds. */
-const ANCHOR_PROBE_PX = 24;
-/** A toggled disclosure holds its place until the layout has been still this long, */
-const HOLD_SETTLE_MS = 120;
-/** and no longer than its motion (a `settle` collapse, ~450ms with springs) needs: a streaming run keeps relaying out. */
-const HOLD_MAX_MS = 500;
-/** What carries a row's id, for a position to name it. */
-const ROW_ID = '[data-row]';
-
-/** A row of a {@link ScrollPosition}, and where it was on screen. */
-export interface RowPlace {
-  /** The row's `data-row` id. */
-  id: string;
-  /** How far below the scroller's top edge the row started (px); negative once its top is scrolled past. */
-  offset: number;
-}
-
-/**
- * Where a transcript's view is ({@link useStickToBottom}'s `readPosition`):
- * following the bottom, or the row under the reader's line and then each row
- * around it, out to the transcript's own.
- */
-export type ScrollPosition =
-  | {
-      /** Following the bottom. */
-      pinned: true;
-    }
-  | {
-      /** Left the bottom. */
-      pinned: false;
-      /** The row under the reader's line, then each row around it, out to the transcript's own. */
-      rows: readonly RowPlace[];
-    };
-
-const AT_BOTTOM: ScrollPosition = { pinned: true };
-
-interface Held {
-  el: HTMLElement;
-  /** Its top relative to the scroller's top when it was toggled. */
-  offset: number;
-  deadline: number;
-  timer: ReturnType<typeof setTimeout> | undefined;
-  /** Whether the view followed the bottom when it was toggled. */
-  wasPinned: boolean;
-  /** A row rendered outright while held (`content-visibility`), skipping offscreen again once let go. */
-  forced?: HTMLElement;
-}
-
-interface Anchor {
-  el: HTMLElement;
-  /** The row's top relative to the scroller's top, at the time of recording. */
-  offset: number;
-  /** The scroller's scrollTop at the time of recording, so a later scroll can be discounted. */
-  top: number;
-  /** The row under the reader's line: `el` itself, unless `el` is the row starting after it (`pick`). */
-  line: HTMLElement;
-  /** `line`'s top relative to the scroller's top, like `offset`. */
-  lineOffset: number;
-  /** The scroller's width at the time of recording: a change reflows every row, and `line` holds. */
-  width: number;
-}
-
-/**
- * The row crossing the horizontal line at `y`, by geometry. Not a hit test:
- * `elementFromPoint` skips rows that take no pointer events, which is every
- * row while the wheel scrolls (the desktop app's `useWheelHoverPause`), so
- * the view would lose its anchor exactly when rows above it resize. Rows are in vertical
- * order, so a binary search finds the spot; nested rows (an open fold's)
- * sit inside their parent's span, so the neighbours settle it.
- */
-function rowAt(scroller: HTMLElement, selector: string, y: number): HTMLElement | null {
-  const rows = scroller.querySelectorAll<HTMLElement>(selector);
-  let lo = 0;
-  let hi = rows.length - 1;
-  while (lo < hi) {
-    const mid = (lo + hi) >> 1;
-    if (rows[mid]!.getBoundingClientRect().bottom > y) hi = mid;
-    else lo = mid + 1;
-  }
-  // The innermost row crossing the line, among the neighbours of the spot.
-  let best: HTMLElement | null = null;
-  for (let i = Math.max(0, lo - 3); i <= Math.min(rows.length - 1, lo + 3); i++) {
-    const r = rows[i]!.getBoundingClientRect();
-    if (r.height > 0 && r.top <= y && r.bottom > y) best = rows[i]!;
-  }
-  return best;
-}
-
-/**
- * The first row starting at or below `from` and above `to`, by geometry: rows'
- * tops never decrease in document order (a nested row starts inside its
- * parent, the next row after it), so a binary search finds the spot.
- */
-function rowStartingIn(scroller: HTMLElement, selector: string, from: number, to: number): HTMLElement | null {
-  const rows = scroller.querySelectorAll<HTMLElement>(selector);
-  let lo = 0;
-  let hi = rows.length;
-  while (lo < hi) {
-    const mid = (lo + hi) >> 1;
-    if (rows[mid]!.getBoundingClientRect().top >= from) hi = mid;
-    else lo = mid + 1;
-  }
-  for (let i = lo; i < rows.length; i++) {
-    const r = rows[i]!.getBoundingClientRect();
-    if (r.top >= to) return null;
-    if (r.height > 0) return rows[i]!;
-  }
-  return null;
-}
-
-/**
- * The row under the reader's line: the one the view anchors on (without an
- * id, the nearest row around it with one); over something else (a collapsed
- * worker block's header), the id'd row there; above the first row (the top
- * padding), the first row.
- */
-function rowUnderLine(scroller: HTMLElement, line: number, anchored: HTMLElement | null): HTMLElement | null {
-  const own = anchored?.closest<HTMLElement>(ROW_ID);
-  if (own && scroller.contains(own)) return own;
-  const hit = rowAt(scroller, ROW_ID, line);
-  if (hit) return hit;
-  const first = scroller.querySelector<HTMLElement>(ROW_ID);
-  return first && first.getBoundingClientRect().top >= line ? first : null;
-}
-
-/** An unpinned view's position: the row under the reader's line, then each row around it, and how far below the top edge each starts. */
-function positionAt(scroller: HTMLElement, box: DOMRect, anchored: HTMLElement | null): ScrollPosition {
-  const rows: RowPlace[] = [];
-  let row = rowUnderLine(scroller, box.top + ANCHOR_PROBE_PX, anchored);
-  while (row && scroller.contains(row)) {
-    rows.push({ id: row.dataset.row!, offset: row.getBoundingClientRect().top - box.top });
-    row = row.parentElement?.closest<HTMLElement>(ROW_ID) ?? null;
-  }
-  return { pinned: false, rows };
-}
-
-/** The outermost row `el` sits in (itself included): the one that skips rendering offscreen, the rows inside it render with it. */
-function outermostRow(scroller: HTMLElement, el: HTMLElement, selector: string): HTMLElement | undefined {
-  let outer: HTMLElement | undefined;
-  let row = el.closest<HTMLElement>(selector);
-  while (row && scroller.contains(row)) {
-    outer = row;
-    row = row.parentElement?.closest<HTMLElement>(selector) ?? null;
-  }
-  return outer;
-}
-
-/** Options of {@link useStickToBottom}. */
-export interface StickToBottomOptions {
-  /** Holds every correction (a drag-select in progress). Default: false. */
-  paused?: boolean;
-  /** The rows the view anchors on. Default: the transcript's top-level rows, `.zg-cv-row`. */
-  rowSelector?: string;
-}
-
-/**
- * Keeps a transcript's scroller on the bottom while it grows, and its reader's line in place once they leave it (the contract above).
- *
- * @param scrollRef - The scroller. Its first element child is the content whose growth the view follows.
- * @param options - {@link StickToBottomOptions}.
- * @returns `pinned`, `snapToBottom` (go there now), `glideToBottom` (go there eased: a prompt sent), `setPinned`, and `readPosition` / `restorePosition` (where the view is, and back there after showing something else).
- */
-export function useStickToBottom(
-  scrollRef: RefObject<HTMLElement | null>,
-  { paused = false, rowSelector = '.zg-cv-row' }: StickToBottomOptions = {},
-) {
-  const [pinned, setPinned] = useState(true);
-  const pinnedRef = useRef(true);
-  const pausedRef = useRef(paused);
-  useLayoutEffect(() => {
-    pausedRef.current = paused;
-  });
-  // The scrollTop our own scrollTo asked for; a scroll event landing there is ours.
-  const expected = useRef<number | null>(null);
-  const lastTop = useRef(0);
-  const anchor = useRef<Anchor | null>(null);
-  const held = useRef<Held | null>(null);
-  // Where the view is as of its last settled frame (`readPosition`); null until one settled.
-  const position = useRef<ScrollPosition | null>(null);
-  // Puts a position's rows back (`restorePosition`), while the scroller is wired.
-  const restoreRows = useRef<(rows: readonly RowPlace[]) => boolean>(() => false);
-  // Lets go of a held row for the bottom, which needs no anchor (`snapToBottom`, `glideToBottom`).
-  const dropHold = useRef(() => {});
-
-  const setPin = useCallback(
-    (next: boolean) => {
-      // Pinned, the bottom is the position; unpinned, the next settled frame reads it.
-      if (next) position.current = AT_BOTTOM;
-      if (pinnedRef.current === next) return;
-      pinnedRef.current = next;
-      setPinned(next);
-      // Readable from tests and devtools.
-      if (scrollRef.current) scrollRef.current.dataset.pinned = String(next);
-    },
-    [scrollRef],
-  );
-
-  const scrollTo = useCallback((el: HTMLElement, top: number) => {
-    const max = Math.max(0, el.scrollHeight - el.clientHeight);
-    const target = Math.min(Math.max(0, top), max);
-    expected.current = target;
-    lastTop.current = target;
-    el.scrollTo({ top: target, behavior: 'instant' as ScrollBehavior });
-  }, []);
-
-  // An eased scroll to the bottom in flight (`glideToBottom`).
-  const glide = useRef({ running: false, cancel: () => {} });
-
-  /** Go to the bottom and stay there. */
-  const snapToBottom = useCallback(() => {
-    const el = scrollRef.current;
-    if (!el) return;
-    glide.current.cancel();
-    dropHold.current();
-    setPin(true);
-    scrollTo(el, el.scrollHeight);
-  }, [scrollRef, setPin, scrollTo]);
-
-  /*
-   * The same, eased: what sending a message does. Each frame retargets the
-   * live bottom, so a prompt row still rendering (or text arriving) never
-   * leaves the glide short. Pinned from the first frame, so growth during
-   * the glide is followed; a wheel or key up cancels it (the user leaves).
-   */
-  const glideToBottom = useCallback(() => {
-    const el = scrollRef.current;
-    if (!el) return;
-    glide.current.cancel();
-    // A held row would pull the view back up, and letting go would decide the pin mid-glide.
-    dropHold.current();
-    setPin(true);
-    const from = el.scrollTop;
-    const distance = el.scrollHeight - el.clientHeight - from;
-    if (document.documentElement.dataset.motion !== 'full' || distance <= 1) {
-      scrollTo(el, el.scrollHeight);
-      return;
-    }
-    // Long jumps take a little longer, never long enough to feel like waiting.
-    const visualDuration = Math.min(0.52, 0.24 + distance / 12_000);
-    // Progress 0 → 1 on the `slide` curve (spring or tween); the target is re-read per frame.
-    glide.current.running = true;
-    const controls = animate(0, 1, {
-      ...currentMotionTransition('slide', visualDuration),
-      onUpdate: (p) => {
-        const bottom = el.scrollHeight - el.clientHeight;
-        // A spring may overshoot 1: never scroll past the live bottom.
-        scrollTo(el, from + (bottom - from) * Math.min(1, p));
-      },
-      onComplete: () => {
-        glide.current.running = false;
-      },
-    });
-    glide.current.cancel = () => {
-      controls.stop();
-      glide.current.running = false;
-    };
-  }, [scrollRef, setPin, scrollTo]);
-
-  useEffect(() => {
-    const el = scrollRef.current;
-    if (!el) return undefined;
-    el.style.overflowAnchor = 'none';
-    el.dataset.pinned = String(pinnedRef.current);
-
-    /*
-     * The anchor is the painted position of the row under the top edge. It
-     * must never be re-taken after content changed and before that change is
-     * corrected: re-taking it then adopts the shift as the new normal and the
-     * view jumps. Content changes land between frames (rows mounting, long
-     * text revealing, code highlighting, rows leaving `content-visibility`
-     * skipping), so every point that takes the anchor corrects first
-     * (`settle`): in the frame after a scroll, and on every relayout the
-     * ResizeObserver reports. The anchor keeps the scrollTop it was taken at,
-     * so a scroll since then is discounted, never corrected.
-     *
-     * The row under the reader's line holds, except a short one whose top is
-     * out of sight: there, the row starting after it in the upper half of the
-     * view does. Holding a top nobody sees keeps nothing in view still: the
-     * run's steps settling to one line at the top edge would slide the reply
-     * up under the reader. A resize reflows every row, and the row under the
-     * line holds then (`settle`).
-     */
-    const pick = (box: DOMRect): Anchor | null => {
-      const line = box.top + ANCHOR_PROBE_PX;
-      const current = anchor.current;
-      let row: HTMLElement | null = null;
-      // Still under the line: keep it (no hit test on every frame of a scroll).
-      if (current && el.contains(current.line)) {
-        const r = current.line.getBoundingClientRect();
-        if (r.top <= line && r.bottom > line) row = current.line;
-      }
-      row ??= rowAt(el, rowSelector, line);
-      if (!row) return null;
-      const r = row.getBoundingClientRect();
-      const middle = box.top + box.height / 2;
-      let after: HTMLElement | null = null;
-      if (r.top < box.top && r.bottom < middle) {
-        // The row after it, while it still starts in the upper half: no search either.
-        if (current && current.line === row && current.el !== row && el.contains(current.el)) {
-          const top = current.el.getBoundingClientRect().top;
-          if (top >= r.bottom - 1 && top < middle) after = current.el;
-        }
-        after ??= rowStartingIn(el, rowSelector, r.bottom - 1, middle);
-      }
-      const held = after ?? row;
-      return {
-        el: held,
-        offset: held.getBoundingClientRect().top - box.top,
-        top: el.scrollTop,
-        line: row,
-        lineOffset: r.top - box.top,
-        width: el.clientWidth,
-      };
-    };
-
-    const settle = () => {
-      // A held row keeps its own place (`keepHeld`); letting go takes a fresh anchor.
-      if (held.current) return;
-      const a = anchor.current;
-      if (!pausedRef.current && !pinnedRef.current && a) {
-        // A resize reflows every row: the row under the reader's line holds (as when the row after it left).
-        const [row, recorded] =
-          (el.clientWidth !== a.width || !el.contains(a.el)) && el.contains(a.line)
-            ? [a.line, a.lineOffset]
-            : [a.el, a.offset];
-        if (el.contains(row)) {
-          const offset = row.getBoundingClientRect().top - el.getBoundingClientRect().top;
-          // Where the row would sit had only the scroll since the record moved it.
-          const delta = offset - (recorded - (el.scrollTop - a.top));
-          if (Math.abs(delta) >= 1) scrollTo(el, el.scrollTop + delta);
-        }
-      }
-      // Pinned, the bottom is the position: no anchor to keep, so no hit test per streamed frame.
-      // Leaving the bottom unpins in `onScroll`, and the next frame takes a fresh anchor.
-      if (pinnedRef.current) {
-        anchor.current = null;
-        position.current = AT_BOTTOM;
-        return;
-      }
-      const box = el.getBoundingClientRect();
-      anchor.current = pick(box);
-      position.current = positionAt(el, box, anchor.current?.line ?? null);
-    };
-
-    let anchorFrame = 0;
-    const scheduleAnchor = () => {
-      if (!anchorFrame)
-        anchorFrame = requestAnimationFrame(() => {
-          anchorFrame = 0;
-          settle();
-        });
-    };
-
-    /** A hold's timer stops, and the row it rendered outright skips offscreen again. */
-    const letGo = (h: Held) => {
-      clearTimeout(h.timer);
-      h.forced?.style.removeProperty('content-visibility');
-    };
-    dropHold.current = () => {
-      const h = held.current;
-      if (!h) return;
-      letGo(h);
-      held.current = null;
-      delete el.dataset.holding;
-    };
-    /** The toggled disclosure lets go, and the top row anchors again. */
-    const release = () => {
-      const h = held.current;
-      if (!h) return;
-      letGo(h);
-      held.current = null;
-      delete el.dataset.holding;
-      const dist = el.scrollHeight - el.clientHeight - el.scrollTop;
-      setPin(dist <= (h.wasPinned ? REPIN_PX : 1));
-      anchor.current = null;
-      scheduleAnchor();
-    };
-    const armRelease = (h: Held) => {
-      clearTimeout(h.timer);
-      h.timer = setTimeout(release, Math.max(0, Math.min(HOLD_SETTLE_MS, h.deadline - performance.now())));
-    };
-    const keepHeld = (h: Held) => {
-      if (!el.contains(h.el)) {
-        release();
-        return;
-      }
-      const delta = h.el.getBoundingClientRect().top - el.getBoundingClientRect().top - h.offset;
-      if (Math.abs(delta) >= 1) scrollTo(el, el.scrollTop + delta);
-      armRelease(h);
-    };
-    // Capture: measured before the toggle's own handler changes anything.
-    const onClick = (e: MouseEvent) => {
-      if (pausedRef.current) return;
-      const toggle = e.target instanceof Element ? e.target.closest('[aria-expanded]') : null;
-      if (!(toggle instanceof HTMLElement) || !el.contains(toggle)) return;
-      glide.current.cancel();
-      if (held.current) letGo(held.current);
-      const h: Held = {
-        el: toggle,
-        offset: toggle.getBoundingClientRect().top - el.getBoundingClientRect().top,
-        deadline: performance.now() + HOLD_MAX_MS,
-        timer: undefined,
-        wasPinned: pinnedRef.current,
-      };
-      held.current = h;
-      // Readable from tests and devtools, like `data-pinned`.
-      el.dataset.holding = '';
-      armRelease(h);
-    };
-
-    const onScroll = () => {
-      const top = el.scrollTop;
-      const ours = expected.current !== null && Math.abs(top - expected.current) <= 1;
-      expected.current = null;
-      const dist = el.scrollHeight - el.clientHeight - top;
-      // Someone else scrolled (the scrollbar, a jump to a row): the toggled line
-      // lets go. Not for a clamp, content shrinking under it at the bottom.
-      if (!ours && held.current && !(top < lastTop.current && dist <= 1)) release();
-      // While a disclosure holds its place, the pin is decided when it lets go.
-      if (!ours && !held.current) {
-        // Up and away from the bottom leaves; a clamp (content shrinking under a
-        // pinned view) moves up but stays at the bottom, so it does not.
-        if (top < lastTop.current - 1 && dist > 1) setPin(false);
-        else if (dist <= REPIN_PX) setPin(true);
-      }
-      lastTop.current = top;
-      scheduleAnchor();
-    };
-    // Intent, before any growth can snap the view back.
-    const onWheel = (e: WheelEvent) => {
-      // The user scrolls: the toggled line need not hold any more.
-      release();
-      if (e.deltaY < 0) {
-        glide.current.cancel();
-        setPin(false);
-      }
-    };
-    const onKey = (e: KeyboardEvent) => {
-      if (['PageUp', 'PageDown', 'ArrowUp', 'ArrowDown', 'Home', 'End'].includes(e.key)) release();
-      if (e.key === 'PageUp' || e.key === 'ArrowUp' || e.key === 'Home') {
-        glide.current.cancel();
-        setPin(false);
-      }
-      if (e.key === 'End') setPin(true);
-    };
-
-    const onLayout = () => {
-      if (pausedRef.current) return;
-      // A scroll whose event has not run yet (a drag to the bottom, the
-      // browser clamping): take it into account first, or a correction here
-      // would use a stale anchor and undo it.
-      if (Math.abs(el.scrollTop - lastTop.current) > 1) onScroll();
-      if (held.current) {
-        keepHeld(held.current);
-        return;
-      }
-      // A glide owns the position; it follows the live bottom itself.
-      if (glide.current.running) return;
-      if (pinnedRef.current) {
-        scrollTo(el, el.scrollHeight);
-        return;
-      }
-      settle();
-    };
-
-    /*
-     * A position's rows, back where they were: the innermost one still here,
-     * at its offset; failing that (what was inside reopened differently: a
-     * worker's block collapsed), the row around it, from its top. The
-     * transcript-level row mounts now if it is still lazy, and the row renders
-     * outright while held: skipped offscreen (`content-visibility`) it sits
-     * at its estimated height, and a place deep inside it would land below
-     * it. Then it is held there, like a toggled disclosure, while the rows
-     * around it mount.
-     */
-    restoreRows.current = (rows) => {
-      const find = (id: string) =>
-        el.querySelector<HTMLElement>(`[data-row="${id.replace(/["\\]/g, (c) => `\\${c}`)}"]`);
-      const outer = rows.length > 0 ? find(rows[rows.length - 1]!.id) : null;
-      if (outer) mountRowNow(outer);
-      for (const [i, place] of rows.entries()) {
-        const target = find(place.id);
-        if (!target) continue;
-        glide.current.cancel();
-        if (held.current) letGo(held.current);
-        setPin(false);
-        const forced = outermostRow(el, target, rowSelector);
-        forced?.style.setProperty('content-visibility', 'visible');
-        const offset = i === 0 ? place.offset : Math.max(0, place.offset);
-        scrollTo(el, el.scrollTop + target.getBoundingClientRect().top - el.getBoundingClientRect().top - offset);
-        anchor.current = null;
-        const h: Held = {
-          el: target,
-          offset,
-          deadline: performance.now() + HOLD_MAX_MS,
-          timer: undefined,
-          wasPinned: false,
-          forced,
-        };
-        held.current = h;
-        el.dataset.holding = '';
-        armRelease(h);
-        return true;
-      }
-      return false;
-    };
-
-    el.addEventListener('scroll', onScroll, { passive: true });
-    el.addEventListener('wheel', onWheel, { passive: true });
-    el.addEventListener('keydown', onKey);
-    el.addEventListener('click', onClick, true);
-    const ro = new ResizeObserver(onLayout);
-    ro.observe(el);
-    // The content the scroller wraps: only its box grows as rows stream in.
-    const content = el.firstElementChild;
-    if (content) ro.observe(content);
-    lastTop.current = el.scrollTop;
-
-    const glideState = glide.current;
-    return () => {
-      glideState.cancel();
-      cancelAnimationFrame(anchorFrame);
-      if (held.current) letGo(held.current);
-      held.current = null;
-      restoreRows.current = () => false;
-      dropHold.current = () => {};
-      el.removeEventListener('click', onClick, true);
-      el.removeEventListener('scroll', onScroll);
-      el.removeEventListener('wheel', onWheel);
-      el.removeEventListener('keydown', onKey);
-      ro.disconnect();
-    };
-  }, [scrollRef, rowSelector, setPin, scrollTo]);
-
-  /** Where the view is as of its last settled frame, so still right once the content was swapped under it; null before one settled. */
-  const readPosition = useCallback((): ScrollPosition | null => position.current, []);
-
-  /**
-   * Put the view back where `saved` was: at the bottom, or on its rows.
-   * False, moving nothing, when none of its rows is here any more (the
-   * transcript was loaded again). Call it outside React's render and effects
-   * (a frame callback): the row it lands in may mount synchronously.
-   */
-  const restorePosition = useCallback(
-    (saved: ScrollPosition): boolean => {
-      if (saved.pinned) {
-        snapToBottom();
-        return true;
-      }
-      if (!restoreRows.current(saved.rows)) return false;
-      // Read while held, before the layout settles and reads it again.
-      position.current = saved;
-      return true;
-    },
-    [snapToBottom],
-  );
-
-  return { pinned, snapToBottom, glideToBottom, setPinned: setPin, readPosition, restorePosition };
-}

package/src/chat/transcript/useTranscriptFind.ts

@@ -1,70 +0,0 @@
-/**
- * The find in the conversation's state: which session it is open on and the
- * query it opened with (empty from ⌘F, a palette match's text from a content
- * search). Bound to a session, so a palette run can switch session and open
- * find in one go; switching anywhere else closes it, since its matches are
- * the previous transcript's DOM. ⌘F is {@link useTranscriptFindKey}'s.
- */
-import { useCallback, useEffect, useMemo, useState } from 'react';
-
-import { useTranscriptFindKey } from './useTranscriptFindKey';
-
-/** Where the find is open, and with what. */
-export interface TranscriptFindTarget<K extends string = string> {
-  /** The session whose conversation it searches. */
-  sessionId: K;
-  /** The text it searches for (empty from ⌘F). */
-  query: string;
-}
-
-/** Options for {@link useTranscriptFind}. */
-export interface TranscriptFindOptions<K extends string = string> {
-  /** The session on show, or `null`. */
-  sessionId: K | null;
-  /** Whether something else owns input now (a modal is open): ⌘F does nothing. */
-  blocked?(): boolean;
-}
-
-/** What {@link useTranscriptFind} returns: hand `open`, `query` and `close` to your `TranscriptSearch`. */
-export interface TranscriptFind<K extends string = string> {
-  /** Open on the session on show. */
-  open: boolean;
-  /** The query it opened with. */
-  query: string | undefined;
-  /** Opens it on a session with a query (a palette match), even one being switched to. */
-  findIn(target: TranscriptFindTarget<K>): void;
-  /** Closes it. */
-  close(): void;
-}
-
-/**
- * The find in the conversation: ⌘F opens it on the session on show (keeping a query already there), a
- * switch to another session closes it.
- *
- * @param options - The session on show, and what blocks ⌘F.
- */
-export function useTranscriptFind<K extends string = string>({
-  sessionId,
-  blocked,
-}: TranscriptFindOptions<K>): TranscriptFind<K> {
-  const [target, setTarget] = useState<TranscriptFindTarget<K> | null>(null);
-  const onFind = useCallback(
-    (id: K) => setTarget((open) => (open?.sessionId === id ? open : { sessionId: id, query: '' })),
-    [],
-  );
-  useTranscriptFindKey({ sessionId, onFind, ...(blocked ? { blocked } : {}) });
-
-  /*
-   * A find opened FOR the session switched to (a palette match) stays; one whose switch did not happen
-   * (a session in another window) is dropped rather than left to open later.
-   */
-  useEffect(() => {
-    if (target && target.sessionId !== sessionId) setTarget(null);
-  }, [sessionId, target]);
-
-  const close = useCallback(() => setTarget(null), []);
-  const findIn = useCallback((next: TranscriptFindTarget<K>) => setTarget(next), []);
-  const open = target !== null && target.sessionId === sessionId;
-  const query = target?.query;
-  return useMemo(() => ({ open, query, findIn, close }), [open, query, findIn, close]);
-}