@mobius-os/mobius 0.3.27 → 0.3.34

package/src/components/primitives.tsx

@@ -6,15 +6,118 @@ import React, { useEffect, useRef, useState } from 'react'
 import { Box, Text, useInput, useStdout, useStdin, type Key } from 'ink'
 import { useDeleteKeyCapture, applyDeleteIntent } from '../lib/delete-keys.js'
 
-type InputHandler = (input: string, key: Key) => void
+/** Return false when a mounted listener deliberately did not consume the input. */
+type InputHandler = (input: string, key: Key) => void | false
+
+type StableInputOptions = {
+  isActive?: boolean
+  /** Passive listeners (App raw-mode keepalive, Chat paging) must not claim or receive replayed input. */
+  interactive?: boolean
+}
+
+type ReplayInput = { input: string; key: Key; signature: string; claimed: boolean }
+
+const pendingRootInputs: ReplayInput[] = []
+const replayQueue: ReplayInput[] = []
+const interactiveHandlers = new Set<InputHandler>()
+const earlyClaimCredits = new Map<string, number>()
+let earlyClaimCleanupScheduled = false
+let replayingInput = false
+
+function inputSignature(input: string, key: Key): string {
+  const flags = Object.keys(key)
+    .filter(name => Boolean((key as unknown as Record<string, unknown>)[name]))
+    .sort()
+    .join(',')
+  return `${input}\u0000${flags}`
+}
+
+function markRootInputClaimed(input: string, key: Key): void {
+  const signature = inputSignature(input, key)
+  const pending = pendingRootInputs.find(event => !event.claimed && event.signature === signature)
+  if (pending) {
+    pending.claimed = true
+    return
+  }
+
+  // React/Ink may register a child's listener before the App listener. Keep a
+  // one-microtask credit so the root callback later in the same emitter pass
+  // recognizes that this exact input was already handled.
+  earlyClaimCredits.set(signature, (earlyClaimCredits.get(signature) ?? 0) + 1)
+  if (!earlyClaimCleanupScheduled) {
+    earlyClaimCleanupScheduled = true
+    queueMicrotask(() => {
+      earlyClaimCredits.clear()
+      earlyClaimCleanupScheduled = false
+    })
+  }
+}
+
+function deliverOrQueue(event: ReplayInput): void {
+  for (const handler of Array.from(interactiveHandlers).reverse()) {
+    replayingInput = true
+    try {
+      if (handler(event.input, event.key) !== false) return
+    } finally {
+      replayingInput = false
+    }
+  }
+  replayQueue.push(event)
+  if (replayQueue.length > 8) replayQueue.shift()
+}
+
+/**
+ * App-level input safety net. It stays mounted across async route changes and
+ * only buffers a key when no interactive Ink listener claimed that emitter
+ * pass. The next Select/TextInput/Composer receives the key after it mounts.
+ */
+export function bufferUnclaimedInput(input: string, key: Key): void {
+  if (isMouseInput(input)) return
+  const signature = inputSignature(input, key)
+  const credits = earlyClaimCredits.get(signature) ?? 0
+  if (credits > 0) {
+    if (credits === 1) earlyClaimCredits.delete(signature)
+    else earlyClaimCredits.set(signature, credits - 1)
+    return
+  }
+
+  const event: ReplayInput = { input, key: { ...key }, signature, claimed: false }
+  pendingRootInputs.push(event)
+  setTimeout(() => {
+    const index = pendingRootInputs.indexOf(event)
+    if (index >= 0) pendingRootInputs.splice(index, 1)
+    if (!event.claimed) deliverOrQueue(event)
+  }, 0)
+}
 
 /** Keep one Ink listener while a component rerenders; read the latest handler through a ref. */
-export function useStableInput(handler: InputHandler, options?: { isActive?: boolean }): void {
+export function useStableInput(handler: InputHandler, options?: StableInputOptions): void {
   const handlerRef = useRef(handler)
   handlerRef.current = handler
   const stableRef = useRef<InputHandler | null>(null)
-  if (!stableRef.current) stableRef.current = (input, key) => handlerRef.current(input, key)
-  useInput(stableRef.current, options)
+  const interactive = options?.interactive !== false
+  if (!stableRef.current) {
+    stableRef.current = (input, key) => {
+      const handled = handlerRef.current(input, key)
+      if (interactive && !replayingInput && handled !== false) markRootInputClaimed(input, key)
+      return handled
+    }
+  }
+  useInput(stableRef.current, { isActive: options?.isActive })
+
+  useEffect(() => {
+    if (!interactive || options?.isActive === false || !stableRef.current) return
+    const stable = stableRef.current
+    interactiveHandlers.add(stable)
+    const queued = replayQueue.splice(0)
+    replayingInput = true
+    try {
+      for (const event of queued) stable(event.input, event.key)
+    } finally {
+      replayingInput = false
+    }
+    return () => { interactiveHandlers.delete(stable) }
+  }, [interactive, options?.isActive])
 }
 
 /** Windows Terminal/ConPTY may expose Esc as a named key, a raw byte, or Ctrl+[. */
@@ -89,6 +192,26 @@ export function parseMouseEvents(input: string): MouseEventInfo[] {
   return out
 }
 
+/** Collapse each contiguous wheel burst into one delta without reordering clicks. */
+export function coalesceMouseEvents(events: MouseEventInfo[]): MouseEventInfo[] {
+  const out: MouseEventInfo[] = []
+  let wheelDelta = 0
+  const flushWheel = () => {
+    if (wheelDelta !== 0) out.push({ kind: 'wheel', delta: wheelDelta })
+    wheelDelta = 0
+  }
+  for (const event of events) {
+    if (event.kind === 'wheel') {
+      wheelDelta += event.delta
+    } else {
+      flushWheel()
+      out.push(event)
+    }
+  }
+  flushWheel()
+  return out
+}
+
 /**
  * Enables terminal mouse tracking for the lifetime of the calling component and
  * forwards mouse events (wheel + left-button press/motion/release) to the given
@@ -125,7 +248,7 @@ export function useMouseEvents(handlers: {
       // A single read() chunk may carry several events and a sequence may be
       // split across chunks, so accumulate and re-scan.
       buf += String(chunk)
-      for (const e of parseMouseEvents(buf)) {
+      for (const e of coalesceMouseEvents(parseMouseEvents(buf))) {
         if (e.kind === 'wheel') refs.current.onWheel?.(e.delta)
         else if (e.kind === 'press') refs.current.onPress?.(e.row, e.col)
         else if (e.kind === 'motion') refs.current.onMotion?.(e.row, e.col)
@@ -309,11 +432,12 @@ export interface SelectProps {
   focused?: boolean
   title?: string
   maxVisible?: number // cap rendered rows so long lists never overflow the terminal
+  initialActive?: number // initial keyboard focus; useful when a create action occupies row 0
 }
 
 export function Select(props: SelectProps) {
   const mode = props.mode ?? 'single'
-  const [active, setActive] = useState(0)
+  const [active, setActive] = useState(() => Math.max(0, props.initialActive ?? 0))
   const items = props.items
   const selectedSet = new Set<string>(mode === 'multi' ? (props.selected as string[]) ?? [] : [])
   const { stdout } = useStdout()
@@ -326,7 +450,10 @@ export function Select(props: SelectProps) {
     if (key.upArrow) { setActive(a => (a - 1 + items.length) % items.length); return }
     if (key.downArrow) { setActive(a => (a + 1) % items.length); return }
     if (mode === 'single') {
-      if (key.return) { props.onSelect?.(items[active].value); return }
+      if (key.return) {
+        props.onSelect?.(items[active].value)
+        return
+      }
     } else {
       if (key.return) { props.onConfirm?.(Array.from(selectedSet)); return }
       if (input === ' ') { props.onToggle?.(items[active].value); return }

package/src/lib/entry-view.ts

@@ -638,18 +638,18 @@ export function toolLabel(name: string): string {
 // agent 输出, 则视为同一次输入的重复入口 → 丢弃, 避免 TUI 把同一条提问显示多次.
 export function userTextOf(e: AnyEntry): string {
   if (e?.type === 'event_msg' && e?.payload?.type === 'user_message') {
-    return String(e?.payload?.message || '').trim()
+    return canonicalUserText(String(e?.payload?.message || ''))
   }
   if (e?.type === 'response_item' && e?.payload?.type === 'message' && e?.payload?.role === 'user') {
     const c = e?.payload?.content
-    if (typeof c === 'string') return c.trim()
-    if (Array.isArray(c)) return c.map((b: any) => b?.text || b?.input_text || '').filter(Boolean).join('\n').trim()
+    if (typeof c === 'string') return canonicalUserText(c)
+    if (Array.isArray(c)) return canonicalUserText(c.map((b: any) => b?.text || b?.input_text || '').filter(Boolean).join('\n'))
     return ''
   }
   if (e?.type === 'user') {
     const c = e?.message?.content
-    if (typeof c === 'string') return c.trim()
-    if (Array.isArray(c)) return c.filter((b: any) => b?.type === 'text').map((b: any) => b?.text || '').join('\n').trim()
+    if (typeof c === 'string') return canonicalUserText(c)
+    if (Array.isArray(c)) return canonicalUserText(c.filter((b: any) => b?.type === 'text').map((b: any) => b?.text || '').join('\n'))
     return ''
   }
   return ''
@@ -669,6 +669,11 @@ export function stripUserFraming(text: string): string {
   return after || text
 }
 
+/** Canonical user text for duplicate event identities (framed vs plain). */
+function canonicalUserText(text: string): string {
+  return stripUserFraming(text).replace(/\s+/g, ' ').trim()
+}
+
 export function isAssistantOutput(e: AnyEntry): boolean {
   if (e?.type === 'assistant') return true
   if (e?.type === 'event_msg' && e?.payload?.type === 'agent_message') return true

package/src/lib/screen-text.ts

@@ -13,7 +13,6 @@
 import wrapAnsi from 'wrap-ansi'
 import { renderMarkdownLines } from '../markdown.js'
 import { toolLabel, viewsForEntry, type EntryView } from './entry-view.js'
-import type { AnyEntry } from '../types.js'
 
 // ── shared text helpers (mirrored from Chat.tsx, kept here to avoid a cycle) ─
 export function displayWidth(str: string): number {
@@ -103,8 +102,29 @@ export function headTailLines(text: string, width: number, maxLines: number): st
 export interface ScreenRows {
   /** Whether this view renders with a leading blank row (its Box has marginTop). */
   marginTop: boolean
-  /** Full screen lines: prefix included, wrapped/truncated, plain text (no ANSI). */
-  rows: string[]
+  /** Full screen rows: a plain layout/copy projection plus its styled ANSI text. */
+  rows: ScreenRow[]
+}
+
+export type ScreenRowTone =
+  | 'normal'
+  | 'user'
+  | 'tool'
+  | 'tool_result'
+  | 'tool_error'
+  | 'edit_header'
+  | 'edit_old'
+  | 'edit_new'
+  | 'reasoning'
+  | 'system'
+  | 'error'
+
+export interface ScreenRow {
+  /** Visible text used for geometry, hit-testing, and clipboard extraction. */
+  plain: string
+  /** Same row with Markdown/syntax ANSI styling preserved for terminal output. */
+  styled: string
+  tone: ScreenRowTone
 }
 
 const textWidth = (columns: number) => Math.max(8, columns - 4)
@@ -114,67 +134,87 @@ const fullWidth = (columns: number) => Math.max(1, columns - 2) // root paddingX
 export function viewScreenRows(view: EntryView, columns: number): ScreenRows {
   const width = textWidth(columns)
   const full = fullWidth(columns)
-  const fit = (rows: string[]): string[] => rows.map((r) => truncateText(r, full))
+  const row = (styled: string, tone: ScreenRowTone = 'normal'): ScreenRow => ({
+    plain: stripAnsi(styled),
+    styled,
+    tone,
+  })
+  // Keep the original styled string and let Ink perform its ANSI-aware
+  // truncate-end rendering. The plain projection mirrors the visible row.
+  const fit = (rows: string[], tone: ScreenRowTone = 'normal'): ScreenRow[] => rows.map((styled) => ({
+    plain: truncateText(stripAnsi(styled), full),
+    styled,
+    tone,
+  }))
+  const wrap = (styled: string, tone: ScreenRowTone = 'normal'): ScreenRow[] => (
+    wrapAnsi(styled, full, { trim: false, hard: true }).split('\n').map(text => row(text, tone))
+  )
   switch (view.kind) {
     case 'skip':
       return { marginTop: false, rows: [] }
     case 'user': {
       const rows = view.text.split('\n').map((l, i) => (i === 0 ? `› ${l}` : `  ${l}`))
-      return { marginTop: true, rows: fit(rows) }
+      return { marginTop: true, rows: fit(rows, 'user') }
     }
     case 'assistant': {
       const md = renderMarkdownLines(view.text)
-      const rows: string[] = []
+      const rows: ScreenRow[] = []
       md.forEach((line, i) => {
         const prefix = i === 0 ? '• ' : '  '
-        const fullLine = prefix + stripAnsi(line.text || ' ')
-        if (line.code) rows.push(truncateText(fullLine, full))
-        else rows.push(...wrapText(fullLine, full))
+        const fullLine = prefix + (line.text || ' ')
+        if (line.code) rows.push(...fit([fullLine]))
+        else rows.push(...wrap(fullLine))
       })
       return { marginTop: true, rows }
     }
     case 'tool_call': {
       const head = clampLines(`${toolLabel(view.toolName)} ${view.summary}`.trim(), width - 2, 1)[0]
-      const rows = [`• ${head}`]
-      if (view.result) rows.push(`  └ ${clampLines(view.result.text, width - 4, 1)[0] || '(无输出)'}`)
-      return { marginTop: true, rows: fit(rows) }
+      const rows = fit([`• ${head}`], 'tool')
+      if (view.result) rows.push(...fit(
+        [`  └ ${clampLines(view.result.text, width - 4, 1)[0] || '(无输出)'}`],
+        view.result.isError ? 'tool_error' : 'tool_result',
+      ))
+      return { marginTop: true, rows }
     }
     case 'tool_result': {
       const lines = headTailLines(view.text, width - 4, 5)
-      return { marginTop: false, rows: fit(lines.map((l, i) => `${i === 0 ? '  └ ' : '    '}${l}`)) }
+      return { marginTop: false, rows: fit(
+        lines.map((l, i) => `${i === 0 ? '  └ ' : '    '}${l}`),
+        view.isError ? 'tool_error' : 'tool_result',
+      ) }
     }
     case 'code_edit': {
-      const rows = [`✎ 编辑 ${view.filePath || '(未指定文件)'}`]
-      if (view.oldString) rows.push(...view.oldString.split('\n').map((l) => `  − ${l}`))
-      if (view.newString) rows.push(...view.newString.split('\n').map((l) => `  + ${l}`))
-      return { marginTop: true, rows: fit(rows) }
+      const rows = fit([`✎ 编辑 ${view.filePath || '(未指定文件)'}`], 'edit_header')
+      if (view.oldString) rows.push(...fit(view.oldString.split('\n').map((l) => `  − ${l}`), 'edit_old'))
+      if (view.newString) rows.push(...fit(view.newString.split('\n').map((l) => `  + ${l}`), 'edit_new'))
+      return { marginTop: true, rows }
     }
     case 'write_file': {
-      const rows = [`✎ 写入 ${view.filePath || '(未指定文件)'}`]
-      rows.push(...view.content.split('\n').map((l) => `  + ${l}`))
-      return { marginTop: true, rows: fit(rows) }
+      const rows = fit([`✎ 写入 ${view.filePath || '(未指定文件)'}`], 'edit_header')
+      rows.push(...fit(view.content.split('\n').map((l) => `  + ${l}`), 'edit_new'))
+      return { marginTop: true, rows }
     }
     case 'reasoning': {
       const lines = clampLines(view.text, width - 4, 2)
-      return { marginTop: true, rows: fit(lines.map((l, i) => `${i === 0 ? '  ◇ ' : '    '}${l}`)) }
+      return { marginTop: true, rows: fit(lines.map((l, i) => `${i === 0 ? '  ◇ ' : '    '}${l}`), 'reasoning') }
     }
     case 'system':
-      return { marginTop: false, rows: fit([`  ${clampLines(view.text, width - 2, 2)[0]}`]) }
+      return { marginTop: false, rows: fit([`  ${clampLines(view.text, width - 2, 2)[0]}`], 'system') }
     case 'error': {
       const rows = view.text.split('\n').map((l, i) => `${i === 0 ? '⚠ ' : '  '}${l}`)
-      return { marginTop: true, rows: fit(rows) }
+      return { marginTop: true, rows: fit(rows, 'error') }
     }
     default:
       return { marginTop: false, rows: [] }
   }
 }
 
-/** Flatten a whole entry (all its views) into screen lines, margins as ''. */
-export function entryScreenLines(views: EntryView[], columns: number): string[] {
-  const lines: string[] = []
+/** Flatten a whole entry into stable rows, with margins represented explicitly. */
+export function entryScreenRows(views: EntryView[], columns: number): ScreenRow[] {
+  const lines: ScreenRow[] = []
   for (const v of views) {
     const { marginTop, rows } = viewScreenRows(v, columns)
-    if (marginTop) lines.push('')
+    if (marginTop) lines.push({ plain: '', styled: '', tone: 'normal' })
     lines.push(...rows)
   }
   return lines
@@ -194,30 +234,6 @@ export interface TranscriptGeometry {
  * (`flexShrink=0`); the middle column holds header + hint + transcript (flexGrow)
  * + tip + help. Margins that render as extra rows are counted explicitly.
  */
-export function computeTranscriptGeometry(opts: {
-  viewportRows: number
-  composerRows: number
-  statusRows: number
-  activityRows: number
-  helpRows: number
-  showWelcome: boolean
-  welcomeRows: number
-  olderHintShown: boolean
-  tipShown: boolean
-}): TranscriptGeometry {
-  // The composer's reported height already includes its marginTop; the status
-  // area and working indicator rows are already folded into statusRows and
-  // activityRows. No extra +1 here — calibrated against the rendered frame.
-  const bottomH = opts.activityRows + opts.composerRows + opts.statusRows
-  const midH = opts.viewportRows - bottomH
-  const headerH = opts.showWelcome ? opts.welcomeRows : 1
-  const hintH = opts.olderHintShown ? 1 : 0
-  const tipH = opts.tipShown ? 2 : 0 // marginTop 1 + content 1
-  const helpH = opts.helpRows > 0 ? opts.helpRows + 1 : 0 // +1 marginTop
-  const boxTop = headerH + hintH + tipH + helpH
-  return { boxTop, boxH: Math.max(0, midH - boxTop) }
-}
-
 // ── selection mapping ────────────────────────────────────────────────────────
 export interface SelPoint {
   entry: number // index into the fitted entries
@@ -230,11 +246,6 @@ export interface TranscriptModel {
   totalRows: number
 }
 
-export function buildTranscriptModel(fittedEntries: AnyEntry[], columns: number): TranscriptModel {
-  const entries = fittedEntries.map((e) => entryScreenLines(viewsForEntry(e), columns))
-  return { entries, totalRows: entries.reduce((sum, l) => sum + l.length, 0) }
-}
-
 /** Convert a screen (row, col) into a SelPoint, or null if outside the transcript. */
 export function screenToSelPoint(
   screenRow: number,
@@ -269,7 +280,7 @@ function charAtDisplayWidth(line: string, col: number): number {
     const w = displayWidth(ch)
     if (col < acc + w) return i
     acc += w
-    i++
+    i += ch.length
   }
   return i
 }

package/src/lib/transcript-viewport.ts

@@ -0,0 +1,162 @@
+/**
+ * Pure row-level transcript viewport.
+ *
+ * Entries are materialized lazily through RowAccess.rowsAt(). Navigation keeps
+ * an entry/row anchor, so moving by N rows is exact even when one entry is much
+ * taller than the terminal. No React or Ink dependency belongs in this file.
+ */
+
+export interface RowAnchor {
+  entryId: string
+  entryIndex: number
+  rowIndex: number
+}
+
+export interface ViewportRow<T> {
+  entryId: string
+  entryIndex: number
+  rowIndex: number
+  row: T
+}
+
+export interface RowAccess<T> {
+  length: number
+  idAt: (index: number) => string
+  indexOf: (entryId: string) => number
+  rowsAt: (index: number) => readonly T[]
+}
+
+export interface ViewportSlice<T> {
+  anchor: RowAnchor | null
+  rows: ViewportRow<T>[]
+  hasOlder: boolean
+  hasNewer: boolean
+}
+
+export function createRowAccess<E, T>(
+  entries: readonly E[],
+  getId: (entry: E, index: number) => string,
+  getRows: (entry: E, index: number) => readonly T[],
+): RowAccess<T> {
+  const ids = entries.map(getId)
+  const indexById = new Map(ids.map((id, index) => [id, index]))
+  return {
+    length: entries.length,
+    idAt: (index) => ids[index] ?? '',
+    indexOf: (entryId) => indexById.get(entryId) ?? -1,
+    rowsAt: (index) => index >= 0 && index < entries.length ? getRows(entries[index], index) : [],
+  }
+}
+
+function previousNonEmpty<T>(access: RowAccess<T>, from: number): number {
+  for (let index = from; index >= 0; index--) {
+    if (access.rowsAt(index).length > 0) return index
+  }
+  return -1
+}
+
+function nextNonEmpty<T>(access: RowAccess<T>, from: number): number {
+  for (let index = from; index < access.length; index++) {
+    if (access.rowsAt(index).length > 0) return index
+  }
+  return -1
+}
+
+function resolveAnchor<T>(access: RowAccess<T>, anchor: RowAnchor | null): RowAnchor | null {
+  if (!anchor || access.length === 0) return null
+  let entryIndex = access.indexOf(anchor.entryId)
+  if (entryIndex < 0) entryIndex = Math.max(0, Math.min(access.length - 1, anchor.entryIndex))
+
+  let rows = access.rowsAt(entryIndex)
+  if (rows.length === 0) {
+    const next = nextNonEmpty(access, entryIndex + 1)
+    const previous = previousNonEmpty(access, entryIndex - 1)
+    entryIndex = next >= 0 ? next : previous
+    if (entryIndex < 0) return null
+    rows = access.rowsAt(entryIndex)
+  }
+
+  return {
+    entryId: access.idAt(entryIndex),
+    entryIndex,
+    rowIndex: Math.max(0, Math.min(rows.length - 1, anchor.rowIndex)),
+  }
+}
+
+export function tailAnchor<T>(access: RowAccess<T>, viewportRows: number): RowAnchor | null {
+  let remaining = Math.max(1, Math.floor(viewportRows))
+  let first: RowAnchor | null = null
+  for (let entryIndex = access.length - 1; entryIndex >= 0; entryIndex--) {
+    const rows = access.rowsAt(entryIndex)
+    if (rows.length === 0) continue
+    first = { entryId: access.idAt(entryIndex), entryIndex, rowIndex: 0 }
+    if (rows.length >= remaining) {
+      return { entryId: access.idAt(entryIndex), entryIndex, rowIndex: rows.length - remaining }
+    }
+    remaining -= rows.length
+  }
+  return first
+}
+
+/** Move the top-row anchor by an exact signed row delta. Positive means newer. */
+export function moveAnchorByRows<T>(access: RowAccess<T>, anchor: RowAnchor | null, deltaRows: number): RowAnchor | null {
+  const resolved = resolveAnchor(access, anchor)
+  if (!resolved || deltaRows === 0) return resolved
+
+  let entryIndex = resolved.entryIndex
+  let rowIndex = resolved.rowIndex
+  let remaining = Math.abs(Math.trunc(deltaRows))
+
+  if (deltaRows > 0) {
+    while (remaining > 0) {
+      const rows = access.rowsAt(entryIndex)
+      const within = rows.length - 1 - rowIndex
+      if (remaining <= within) { rowIndex += remaining; remaining = 0; break }
+      remaining -= within
+      const next = nextNonEmpty(access, entryIndex + 1)
+      if (next < 0) { rowIndex = rows.length - 1; break }
+      entryIndex = next
+      rowIndex = 0
+      remaining -= 1
+    }
+  } else {
+    while (remaining > 0) {
+      if (remaining <= rowIndex) { rowIndex -= remaining; remaining = 0; break }
+      remaining -= rowIndex
+      const previous = previousNonEmpty(access, entryIndex - 1)
+      if (previous < 0) { rowIndex = 0; break }
+      entryIndex = previous
+      rowIndex = access.rowsAt(entryIndex).length - 1
+      remaining -= 1
+    }
+  }
+
+  return { entryId: access.idAt(entryIndex), entryIndex, rowIndex }
+}
+
+export function sliceViewport<T>(access: RowAccess<T>, anchor: RowAnchor | null, viewportRows: number): ViewportSlice<T> {
+  const resolved = resolveAnchor(access, anchor)
+  const limit = Math.max(0, Math.floor(viewportRows))
+  if (!resolved || limit === 0) return { anchor: resolved, rows: [], hasOlder: false, hasNewer: false }
+
+  const visible: ViewportRow<T>[] = []
+  let entryIndex = resolved.entryIndex
+  let rowIndex = resolved.rowIndex
+  while (entryIndex < access.length && visible.length < limit) {
+    const rows = access.rowsAt(entryIndex)
+    for (; rowIndex < rows.length && visible.length < limit; rowIndex++) {
+      visible.push({ entryId: access.idAt(entryIndex), entryIndex, rowIndex, row: rows[rowIndex] })
+    }
+    entryIndex = nextNonEmpty(access, entryIndex + 1)
+    rowIndex = 0
+    if (entryIndex < 0) break
+  }
+
+  const hasOlder = resolved.rowIndex > 0 || previousNonEmpty(access, resolved.entryIndex - 1) >= 0
+  const last = visible.at(-1)
+  const hasNewer = !!last && (
+    last.rowIndex < access.rowsAt(last.entryIndex).length - 1 ||
+    nextNonEmpty(access, last.entryIndex + 1) >= 0
+  )
+  return { anchor: resolved, rows: visible, hasOlder, hasNewer }
+}