dsh-code 0.5.0 → 0.6.0

package/src/kernel-panels.ts

@@ -7,7 +7,8 @@ import type { PluginRow } from './plugin-inventory.ts'
 import type { SessionDirectoryOptions, SessionRow } from './session-directory.ts'
 import { panelViewport, revealRow } from './render/inspector.ts'
 import { textLines } from './render/lines.ts'
-import { singleLineText, truncateColumns } from './render/text.ts'
+import { DEFAULT_STATUSLINE_ITEMS, STATUS_ITEMS, type StatusItemId } from './render/status.ts'
+import { displayText, singleLineText, truncateColumns } from './render/text.ts'
 import { TUI_RGB } from './theme.ts'
 
 function color(rgb: readonly [number, number, number]): string {
@@ -43,7 +44,7 @@ function ListFrame(props: ListFrameProps): ReactElement {
   const visible = stateRows.slice(offset, offset + bodyRows)
   return createElement(
     Box,
-    { borderStyle: 'round', borderColor: color(TUI_RGB.dim), flexDirection: 'column', paddingX: 1 },
+    { width: viewport.outerColumns, borderStyle: 'round', borderColor: color(TUI_RGB.dim), flexDirection: 'column', paddingX: 1 },
     createElement(Text, { color: color(TUI_RGB.brandBright), wrap: 'truncate-end' }, truncateColumns(props.title, viewport.contentColumns)),
     createElement(Text, { dimColor: true, wrap: 'truncate-end' }, truncateColumns(`search: ${props.query === '' ? 'type to filter' : props.query}`, viewport.contentColumns)),
     ...visible.map((row, index) => {
@@ -246,9 +247,173 @@ function DocumentPanel({ title, text, error, close }: {
       : lines.slice(scroll, scroll + viewport.bodyRows)
   return createElement(
     Box,
-    { borderStyle: 'round', borderColor: color(TUI_RGB.dim), flexDirection: 'column', paddingX: 1 },
+    { width: viewport.outerColumns, borderStyle: 'round', borderColor: color(TUI_RGB.dim), flexDirection: 'column', paddingX: 1 },
     createElement(Text, { color: color(TUI_RGB.brandBright), wrap: 'truncate-end' }, truncateColumns(title, viewport.contentColumns)),
     ...body.map((line, index) => createElement(Text, { key: `${scroll}-${index}`, wrap: 'truncate-end' }, truncateColumns(line, viewport.contentColumns))),
     createElement(Text, { dimColor: true, wrap: 'truncate-end' }, truncateColumns(`lines ${lines.length === 0 ? 0 : scroll + 1}-${Math.min(lines.length, scroll + viewport.bodyRows)}/${lines.length} · ↑↓/pg/g/G · t/esc close`, viewport.contentColumns)),
   )
 }
+
+/**
+ * The /history recall panel (Codex composer-history search, bounded): one
+ * query line over the newest-first recall space, filtered by substring, with
+ * arrow selection and enter to fill the composer. Editing the query restarts
+ * from the newest match; Esc closes without touching the draft.
+ */
+export function HistoryPanel({ entries, fill, close }: {
+  /** Newest-first recall entries (persistent + in-session, deduped). */
+  entries: readonly string[]
+  /** Accept one entry: its text plus its recall-space index (browsing resumes there). */
+  fill(text: string, index: number): void
+  close(): void
+}): ReactElement {
+  const [query, setQuery] = useState('')
+  const [cursor, setCursor] = useState(0)
+  const matches = query === ''
+    ? entries
+    : entries.filter(entry => entry.toLowerCase().includes(query.toLowerCase()))
+  useInput((input, key) => {
+    if (key.escape) return close()
+    if (key.return) {
+      const entry = matches[cursor]
+      if (entry !== undefined) fill(entry, entries.indexOf(entry))
+      return
+    }
+    if (key.upArrow) return setCursor(value => Math.max(0, value - 1))
+    if (key.downArrow) return setCursor(value => Math.min(matches.length - 1, value + 1))
+    if (input === 'g') return setCursor(0)
+    if (input === 'G') return setCursor(matches.length - 1)
+    if (key.backspace) {
+      setQuery(current => current.slice(0, -1))
+      setCursor(0)
+      return
+    }
+    if (input !== '' && !key.ctrl && !key.meta && !key.shift) {
+      setQuery(current => (current + input).slice(0, 120))
+      setCursor(0)
+    }
+  })
+  const stdout = useStdout().stdout
+  const viewport = panelViewport(stdout?.columns ?? 80, stdout?.rows ?? 30)
+  if (viewport.compact) {
+    return createElement(Text, { wrap: 'truncate-end' }, truncateColumns('/history · esc close', viewport.contentColumns))
+  }
+  if (viewport.maxHeight === 0) return createElement(Box, { display: 'none' })
+  const bodyRows = Math.max(1, viewport.bodyRows - 1)
+  const offset = revealRow(0, cursor, matches.length, bodyRows)
+  const visible = matches.slice(offset, offset + bodyRows)
+  const header = query === ''
+    ? `/history · ${entries.length} prompts · type to filter`
+    : `/history · ${matches.length} of ${entries.length} match '${truncateColumns(singleLineText(query), viewport.contentColumns - 30)}'`
+  return createElement(
+    Box,
+    { width: viewport.outerColumns, borderStyle: 'round', borderColor: color(TUI_RGB.dim), flexDirection: 'column', paddingX: 1 },
+    createElement(Text, { color: color(TUI_RGB.brandBright), wrap: 'truncate-end' }, truncateColumns(header, viewport.contentColumns)),
+    createElement(Text, { dimColor: true, wrap: 'truncate-end' }, truncateColumns(`  filter ${query === '' ? '· type to search prompts' : '· ' + singleLineText(query)}, enter fills the composer`, viewport.contentColumns)),
+    ...(visible.length === 0
+      ? [createElement(Text, { key: 'empty', dimColor: true, wrap: 'truncate-end' }, truncateColumns('  no matching prompts', viewport.contentColumns))]
+      : visible.map((entry, index) => {
+        const absolute = offset + index
+        const selected = absolute === cursor
+        return createElement(
+          Text,
+          {
+            key: `history-${absolute}`,
+            color: selected ? color(TUI_RGB.brandBright) : undefined,
+            wrap: 'truncate-end',
+          },
+          truncateColumns((selected ? '› ' : '  ') + displayText(entry), viewport.contentColumns),
+        )
+      })),
+    createElement(Text, { dimColor: true, wrap: 'truncate-end' }, truncateColumns('↑↓ move · g/G ends · enter fill · esc close', viewport.contentColumns)),
+  )
+}
+
+/**
+ * The /statusline picker (the Codex setup-view contract): one bounded list
+ * of every status item with its enabled mark, arrow reordering, and a
+ * live preview — the real status line under the composer updates as you
+ * edit, so the panel itself carries no duplicate preview row.
+ */
+export function StatuslinePanel({ enabled, change, close }: {
+  enabled: readonly StatusItemId[]
+  change(items: readonly StatusItemId[]): void
+  close(): void
+}): ReactElement {
+  // Working state: the full catalog in display order (enabled entries in
+  // their configured positions, disabled ones trailing canonically) plus
+  // the enabled set. Persisted shape is the enabled subsequence only.
+  const [order, setOrder] = useState<readonly StatusItemId[]>(() => {
+    const seen = new Set(enabled)
+    return [...enabled, ...DEFAULT_STATUSLINE_ITEMS.filter(id => !seen.has(id))]
+  })
+  const [on, setOn] = useState<ReadonlySet<StatusItemId>>(() => new Set(enabled))
+  const [cursor, setCursor] = useState(0)
+  const commit = (nextOrder: readonly StatusItemId[], nextOn: ReadonlySet<StatusItemId>): void => {
+    setOrder(nextOrder)
+    setOn(nextOn)
+    change(nextOrder.filter(id => nextOn.has(id)))
+  }
+  const move = (offset: number): void => {
+    const target = cursor + offset
+    if (target < 0 || target >= order.length) return
+    const next = [...order]
+    const [item] = next.splice(cursor, 1)
+    next.splice(target, 0, item!)
+    commit(next, on)
+    setCursor(target)
+  }
+  useInput((input, key) => {
+    if (key.escape || input === 'q' || key.return) return close()
+    if (key.upArrow) return setCursor(value => Math.max(0, value - 1))
+    if (key.downArrow) return setCursor(value => Math.min(order.length - 1, value + 1))
+    if (key.leftArrow) return move(-1)
+    if (key.rightArrow) return move(1)
+    if (input === 'g') return setCursor(0)
+    if (input === 'G') return setCursor(order.length - 1)
+    if (input === 'd') {
+      commit([...DEFAULT_STATUSLINE_ITEMS], new Set(DEFAULT_STATUSLINE_ITEMS))
+      setCursor(0)
+      return
+    }
+    if (input === ' ') {
+      const item = order[cursor]
+      if (item === undefined) return
+      const next = new Set(on)
+      if (next.has(item)) next.delete(item)
+      else next.add(item)
+      commit(order, next)
+    }
+  })
+  const stdout = useStdout().stdout
+  const viewport = panelViewport(stdout?.columns ?? 80, stdout?.rows ?? 30)
+  if (viewport.compact) {
+    return createElement(Text, { wrap: 'truncate-end' }, truncateColumns('/statusline · esc close', viewport.contentColumns))
+  }
+  if (viewport.maxHeight === 0) return createElement(Box, { display: 'none' })
+  const bodyRows = Math.max(1, viewport.bodyRows - 1)
+  const offset = revealRow(0, cursor, order.length, bodyRows)
+  const visible = order.slice(offset, offset + bodyRows)
+  const meta = new Map(STATUS_ITEMS.map(item => [item.id, item]))
+  return createElement(
+    Box,
+    { width: viewport.outerColumns, borderStyle: 'round', borderColor: color(TUI_RGB.dim), flexDirection: 'column', paddingX: 1 },
+    createElement(Text, { color: color(TUI_RGB.brandBright), wrap: 'truncate-end' }, truncateColumns('/statusline · items apply to the live status line below', viewport.contentColumns)),
+    ...visible.map((id, index) => {
+      const absolute = offset + index
+      const selected = absolute === cursor
+      const info = meta.get(id)
+      return createElement(
+        Text,
+        {
+          key: id,
+          color: selected ? color(TUI_RGB.brandBright) : undefined,
+          dimColor: !on.has(id) || undefined,
+          wrap: 'truncate-end',
+        },
+        truncateColumns((selected ? '› ' : '  ') + (on.has(id) ? '● ' : '○ ') + (info?.label ?? id) + (info === undefined ? '' : ' · ' + info.description + ' · ' + info.side), viewport.contentColumns),
+      )
+    }),
+    createElement(Text, { dimColor: true, wrap: 'truncate-end' }, truncateColumns('↑↓ move · space toggle · ←→ reorder · d default · esc close', viewport.contentColumns)),
+  )
+}

package/src/render/animations.ts

@@ -1,7 +1,8 @@
 /**
  * Terminal animation frame tables derived from the web design language:
  * the StateDot "ongoing" pixel chase (3×3 ring, 125ms flat-hold brightness
- * steps, 1s cycle) becomes the single-cell stepped pulse below, and the
+ * steps, 1s cycle) becomes the single-cell stepped pulse below and the
+ * full-ring clockwise braille chase in {@link BUSY_CHASE_FRAMES}, and the
  * streaming caret blink is the Claude-Code convention. Pure functions only —
  * the Ink layer owns timers and colors.
  *
@@ -16,6 +17,18 @@ export function pulseFrame(tick: number): string {
   return PULSE_FRAMES[tick % PULSE_FRAMES.length] ?? PULSE_FRAMES[0]
 }
 
+/**
+ * The web StateDot "ongoing" chase in terminal form: three cells of the 3×3
+ * ring trail clockwise around the eight outer positions, one braille glyph
+ * per step — 8 frames × 125ms = the web's 1s cycle.
+ */
+export const BUSY_CHASE_FRAMES = ['⣾', '⣽', '⣻', '⢿', '⡿', '⣟', '⣯', '⣷'] as const
+
+/** Chase frame for a monotonic tick (the busy composer/Deep-diving marker). */
+export function busyChaseFrame(tick: number): string {
+  return BUSY_CHASE_FRAMES[tick % BUSY_CHASE_FRAMES.length] ?? BUSY_CHASE_FRAMES[0]
+}
+
 /** Caret visibility: half the ticks on, half off (530ms blink). */
 export function caretVisible(tick: number): boolean {
   return tick % 2 === 0

package/src/render/export.ts

@@ -66,6 +66,10 @@ export function buildExportMarkdown(view: TranscriptView, sessionId: string): st
       case 'files':
         out.push(`> files changed: ${entry.paths.join(', ')}`, '')
         break
+      case 'pending':
+        // Codex PendingSteer: queued prompts export like ordinary user rows.
+        out.push('## user', '', entry.text, '')
+        break
       default:
         assertNever(entry, 'transcript entry kind')
     }

package/src/render/inspector.ts

@@ -10,12 +10,14 @@ export interface InspectorViewport {
   gapRows: 0 | 2
   /** Columns available inside the horizontal border and padding. */
   contentColumns: number
+  /** Safe outer width for a bordered dynamic panel; never writes column N. */
+  outerColumns: number
   /** Tiny terminals use a borderless one-line close hint. */
   compact: boolean
 }
 
-/** Composer/status chrome plus one optional, fixed-height local notice row. */
-const INSPECTOR_CHROME_ROWS = 5
+/** Composer (3) + two-row status chrome, plus one optional fixed-height local notice row. */
+const INSPECTOR_CHROME_ROWS = 6
 
 /** One transcript-to-composer gutter, collapsed on short terminals. */
 export function layoutGutterRows(rows: number): 0 | 1 {
@@ -39,11 +41,18 @@ export function panelViewport(columns: number, rows: number): InspectorViewport
   ))
   const compact = maxHeight < 5 || safeColumns < 8
   const gapRows = !compact && maxHeight >= 7 ? 2 : 0
+  // A terminal may autowrap a glyph written into its final column. Ink still
+  // accounts for that border as one logical row, so the next dynamic update
+  // erases too few physical rows and leaves stacked frames behind. Codex
+  // renders overlays within an inset surface; reserve the final column here
+  // so every Ink panel follows the same contract.
+  const outerColumns = compact ? safeColumns : Math.max(1, safeColumns - 1)
   return {
     maxHeight,
     bodyRows: compact ? 0 : maxHeight - 4 - gapRows,
     gapRows,
-    contentColumns: compact ? Math.max(1, safeColumns - 1) : Math.max(1, safeColumns - 4),
+    contentColumns: compact ? Math.max(1, safeColumns - 1) : Math.max(1, outerColumns - 4),
+    outerColumns,
     compact,
   }
 }

package/src/render/lines.ts

@@ -143,16 +143,27 @@ export function transcriptEntryLines(entry: TranscriptEntry, columns: number): r
         lineSegment(entry.notice ? '⤷ ' : '❯ ', entry.notice ? 'dim' : 'brand'),
         lineSegment(entry.text, entry.notice ? 'dim' : 'plain'),
       ], width)
-    case 'assistant':
-      return [
-        ...(entry.reasoning === ''
-          ? []
-          : styledLines([
-            lineSegment('  ✻ ', 'dimItalic'),
-            lineSegment(entry.reasoning, 'dimItalic'),
-          ], width)),
-        ...markdownLines(entry.text, width),
-      ]
+    case 'pending':
+      // Codex PendingSteer: a queued prompt renders exactly like an ordinary
+      // user row, so the durable user/message retires it without any flicker.
+      return styledLines([
+        lineSegment('❯ ', 'brand'),
+        lineSegment(entry.text, 'plain'),
+      ], width)
+    case 'assistant': {
+      const reasoning = entry.reasoning === ''
+        ? []
+        : styledLines([
+          lineSegment('  ✻ ', 'dimItalic'),
+          lineSegment(entry.reasoning, 'dimItalic'),
+        ], width)
+      // Every reply row carries the composer's two-column gutter, so reply
+      // text aligns with the input cursor (Codex LIVE_PREFIX alignment); the
+      // wrap budget shrinks by the same amount so no line double-wraps.
+      const body = markdownLines(entry.text, Math.max(10, width - 2))
+        .map(line => ({ segments: [{ text: '  ', style: 'plain' as const }, ...line.segments] }))
+      return [...reasoning, ...body]
+    }
     case 'tool': {
       const mark = entry.state === 'running' ? '●' : entry.state === 'error' ? '⨯' : '⏺'
       const markStyle: LineStyle = entry.state === 'running' ? 'brand' : entry.state === 'error' ? 'error' : 'success'

package/src/render/projection.ts

@@ -7,12 +7,13 @@
  * @module @deepseek-ai/dsh-tui/render/projection
  */
 
-import { boundContextSummary, type ContentBlock } from '@deepseek-ai/dsh-llm'
+import { boundContextSummary, type ContentBlock, type MessageId } from '@deepseek-ai/dsh-llm'
 import type { SessionEvent, TodoItem } from '@deepseek-ai/dsh-session'
 // Type-only imports merge the plugin-owned SessionEventMap variants
-// (command/*, compaction/*, goal/change, llm/retry*, plan/mode,
-// permission/preset, sandbox/mode, session/title) into the union this
-// reducer switches on.
+// (agent/inbox/spliced, command/*, compaction/*, goal/change, llm/retry*,
+// plan/mode, permission/preset, sandbox/mode, session/title) into the union
+// this reducer switches on.
+import type {} from '@deepseek-ai/dsh-agent'
 import type {} from '@deepseek-ai/dsh-commands'
 import type {} from '@deepseek-ai/dsh-compaction'
 import type {} from '@deepseek-ai/dsh-goal'
@@ -43,6 +44,17 @@ export interface UserEntry {
   notice: boolean
 }
 
+/** One user message waiting in the agent inbox (the web's queued-message row). */
+export interface PendingEntry {
+  kind: 'pending'
+  /** Stable message identity shared with the durable `user/message` that retires it. */
+  messageId: MessageId
+  /** Which inbox list holds the message: steering is consumed at the next step boundary. */
+  target: 'next-turn' | 'next-step'
+  /** Full message text — Codex PendingSteer renders queued prompts exactly like user rows. */
+  text: string
+}
+
 /** One assembled assistant reply. */
 export interface AssistantEntry {
   kind: 'assistant'
@@ -139,7 +151,7 @@ export interface FilesEntry {
 }
 
 /** Ordered transcript items the renderer draws. */
-export type TranscriptEntry = UserEntry | AssistantEntry | ToolEntry | CommandEntry | ErrorEntry | TurnMarkerEntry | CompactionEntry | RetryEntry | FilesEntry
+export type TranscriptEntry = UserEntry | PendingEntry | AssistantEntry | ToolEntry | CommandEntry | ErrorEntry | TurnMarkerEntry | CompactionEntry | RetryEntry | FilesEntry
 
 /** The live goal the status line badges, folded from `goal/change`. */
 export interface GoalFold {
@@ -223,6 +235,12 @@ export interface TranscriptView {
   sandbox: string
   /** Current long-running goal folded from the last `goal/change`, undefined when cleared. */
   goal: GoalFold | undefined
+  /**
+   * Ordered live message ids per inbox target, mirrored from
+   * `agent/inbox/spliced` exactly like the upstream Inbox projection — the
+   * coordinates later removals resolve against.
+   */
+  pending: { 'next-turn': readonly string[]; 'next-step': readonly string[] }
   /**
    * Fold-internal timing anchors, never rendered: open step and tool-call
    * start timestamps the next `assistant/message` / `tool/result` resolves
@@ -256,11 +274,17 @@ export function createTranscriptView(): TranscriptView {
     title: '',
     sandbox: '',
     goal: undefined,
+    pending: { 'next-turn': [], 'next-step': [] },
     stats: { turns: 0, steps: 0, llmMs: 0, toolMs: 0, usage: { inputTokens: 0, outputTokens: 0, cacheReadTokens: 0 }, lastPromptTokens: 0, contextWindow: 0, ttftMs: 0, ttftSteps: 0, decodeMs: 0, decodeTokens: 0 },
     anchors: { stepStart: new Map(), toolStart: new Map(), firstChunkAt: new Map(), compactionTokens: new Map(), lastPruneTokens: 0, turnFiles: new Map() },
   }
 }
 
+/** Full prompt text of a queued message (identical to the durable user row it retires into). */
+function pendingText(content: readonly ContentBlock[]): string {
+  return textOf(content)
+}
+
 /**
  * Fold one session event into an updated view (copy-on-write).
  * @param view - the view before the event.
@@ -270,17 +294,56 @@ export function createTranscriptView(): TranscriptView {
 export function projectEvent(view: TranscriptView, event: SessionEvent): TranscriptView {
   switch (event.type) {
     case 'user/message': {
+      // A queued row retires when its durable user message lands (the agent
+      // claims the inbox and logs the same message identity) — the transient
+      // steering/queued preview yields to the real transcript entry.
+      const message = event.data
+      let entries = view.entries
+      let pending = view.pending
+      for (const target of ['next-turn', 'next-step'] as const) {
+        const index = pending[target].indexOf(message.id)
+        if (index < 0) continue
+        pending = { ...pending, [target]: pending[target].filter((_, i) => i !== index) }
+        entries = entries.filter(entry => !(entry.kind === 'pending' && entry.messageId === message.id))
+      }
       // Injected context (plugin/model-continuation sources) stays collapsed
       // to a bounded notice row, exactly like collapsed transcript context
       // elsewhere in the product; only direct human prompts render in full.
-      const message = event.data
       if (message.source.kind === 'user') {
-        return { ...view, entries: [...view.entries, { kind: 'user', text: textOf(message.content), notice: false }] }
+        return { ...view, pending, entries: [...entries, { kind: 'user', text: textOf(message.content), notice: false }] }
       }
       const notice = message.source.kind === 'plugin' && message.source.form === 'notice'
         ? message.source.summary
         : message.source.kind
-      return { ...view, entries: [...view.entries, { kind: 'user', text: boundContextSummary(notice), notice: true }] }
+      return { ...view, pending, entries: [...entries, { kind: 'user', text: boundContextSummary(notice), notice: true }] }
+    }
+    case 'agent/inbox/spliced': {
+      // The durable inbox mutation (web queue-mirror contract, event-sourced):
+      // removals drop the projected rows at their inbox coordinates, inserted
+      // messages gain a pending row at their log position.
+      const { target, start, removedCount = 0, inserted } = event.data
+      const ids = view.pending[target]
+      const removed = ids.slice(start, start + removedCount)
+      const nextIds = [
+        ...ids.slice(0, start),
+        ...ids.slice(start + removedCount),
+        ...inserted.map(message => message.id),
+      ]
+      let entries = view.entries
+      if (removed.length > 0) {
+        const removedSet = new Set(removed)
+        entries = entries.filter(entry =>
+          !(entry.kind === 'pending' && entry.target === target && removedSet.has(entry.messageId)))
+      }
+      for (const message of inserted) {
+        entries = [...entries, {
+          kind: 'pending',
+          messageId: message.id,
+          target,
+          text: pendingText(message.content),
+        }]
+      }
+      return { ...view, entries, pending: { ...view.pending, [target]: nextIds } }
     }
     case 'assistant/chunk': {
       const chunk = event.data.chunk