dsh-code 1.0.2 → 1.0.4

package/src/render/status.ts

@@ -126,37 +126,31 @@ export const STATUS_ITEM_SEPARATOR = ' · '
 export const STATUS_CYCLE_HINT = ' (shift+tab to cycle)'
 
 /**
- * Interior columns of the segmented context bar (content-type segments plus
- * the free tail whose right edge carries the usage readout). The layout
- * starts every bar at this width so the drop ladder can pre-measure the
- * group, then shrinks the bar inside a tighter budget before dropping it
- * (see CONTEXT_MIN_WIDTH) rather than asking the layout for more room.
+ * Interior columns of the context bar. The layout starts every bar at this
+ * width so the drop ladder can pre-measure the group, then degrades the
+ * readout and shrinks the bar inside a tighter budget before dropping the
+ * group (see CONTEXT_MIN_WIDTH) rather than asking the layout for more room.
  */
 export const CONTEXT_BAR_WIDTH = 24
 /** Occupancy at which the usage readout flips from brand blue to amber. */
 const CONTEXT_WARN_PERCENT = 90
-/** Free-tail floor in columns: wide enough for the bare percent readout, so
- * the warning stays visible even at 100%+ occupancy. */
-const CONTEXT_MIN_FREE = 5
 /**
- * Narrowest bar width the drop ladder tries before giving up on the context
- * group: the bar shrinks inside its own budget first (a few columns still
- * show the bare percent readout) and only then drops as a whole.
+ * Narrowest bar width the drop ladder keeps before dropping the whole
+ * context group: the bar shrinks to this floor first (the absolute readout
+ * survives), and only past it does the readout degrade and the group go.
  */
 const CONTEXT_MIN_WIDTH = 5
 
 /**
- * Render context occupancy as ONE stepless bar: a solid DeepSeek-blue fill
- * run, a dim dotted free track, and the usage readout riding the track's
- * right edge (`12.3K/1.0M 25%`, shrinking to the bare percent as the track
- * narrows). No per-content-type segmentation. Column split is deterministic:
- * the free share is `Math.round(free/window*width)` clamped to at least
- * CONTEXT_MIN_FREE columns and at most the full width; the fill takes every
- * remaining column, so a given occupancy always renders the identical bar.
- * The readout flips to amber once occupancy reaches the warning threshold.
- * @param usedTokens - reported used tokens (drives the readout and percent).
+ * Render context occupancy as ONE stepless proportional bar: a solid
+ * DeepSeek-blue fill run tracking the occupancy and a dim dotted free
+ * track for the rest. Nothing else lives inside the bar — the usage
+ * readout rides outside it (see contextGroupSpans) — so the geometry
+ * always reads as the true remaining share. A given occupancy always
+ * renders the identical bar.
+ * @param usedTokens - reported used tokens.
  * @param contextWindow - route capacity.
- * @param width - total bar interior columns.
+ * @param width - total bar columns.
  * @returns tone-split spans for the footer to paint.
  */
 export function contextBar(
@@ -166,27 +160,42 @@ export function contextBar(
 ): readonly StatusSpan[] {
   if (width <= 0 || contextWindow <= 0) return []
   const used = Math.max(0, usedTokens)
-  const percent = Math.round(used / contextWindow * 100)
-  const warning = percent >= CONTEXT_WARN_PERCENT
-  const readoutTone: StatusTone = warning ? 'warn' : 'value'
-
-  const freeShare = Math.round(Math.max(0, contextWindow - used) / contextWindow * width)
-  const freeColumns = Math.min(width, Math.max(freeShare, CONTEXT_MIN_FREE))
-  const usedColumns = Math.max(0, width - freeColumns)
+  const fill = Math.min(width, Math.max(0, Math.round(used / contextWindow * width)))
+  const spans: StatusSpan[] = []
+  if (fill > 0) spans.push({ text: '█'.repeat(fill), tone: 'ctxFill' })
+  const free = width - fill
+  if (free > 0) spans.push({ text: '░'.repeat(free), tone: 'label' })
+  return spans
+}
 
-  const total = `${formatTokens(used)}/${formatTokens(contextWindow)}`
-  const percentText = `${percent}%`
-  const readout = freeColumns >= visibleColumns(`${total} ${percentText}`)
-    ? `${total} ${percentText}`
-    : freeColumns >= visibleColumns(percentText)
-      ? percentText
-      : ''
+/** How much usage detail the context group's readout carries. */
+export type ContextReadoutMode = 'full' | 'percent' | 'none'
 
-  const spans: StatusSpan[] = []
-  if (usedColumns > 0) spans.push({ text: '█'.repeat(usedColumns), tone: 'ctxFill' })
-  const pad = freeColumns - visibleColumns(readout)
-  if (pad > 0) spans.push({ text: '░'.repeat(pad), tone: 'label' })
-  if (readout !== '') spans.push({ text: readout, tone: readoutTone })
+/**
+ * Compose the context group: the proportional bar plus the usage readout
+ * OUTSIDE the bar, so the dotted track keeps its proportional meaning no
+ * matter how wide the readout is. `full` reads `12.3K/1.0M 25%`; `percent`
+ * drops the absolute pair; `none` is the bare bar. The readout turns amber
+ * once occupancy reaches the warning threshold.
+ */
+export function contextGroupSpans(
+  usedTokens: number,
+  contextWindow: number,
+  barWidth: number,
+  readout: ContextReadoutMode,
+): readonly StatusSpan[] {
+  const spans: StatusSpan[] = [{ text: 'context ', tone: 'label' }]
+  spans.push(...contextBar(usedTokens, contextWindow, barWidth))
+  if (readout === 'none' || barWidth <= 0 || contextWindow <= 0) return spans
+  const used = Math.max(0, usedTokens)
+  const percent = Math.round(used / contextWindow * 100)
+  const text = readout === 'full'
+    ? `${formatTokens(used)}/${formatTokens(contextWindow)} ${percent}%`
+    : `${percent}%`
+  spans.push(
+    { text: ' ', tone: 'label' },
+    { text, tone: percent >= CONTEXT_WARN_PERCENT ? 'warn' : 'value' },
+  )
   return spans
 }
 
@@ -459,17 +468,13 @@ function buildCandidates(
       id: 'cache',
     })
   }
-  // Context occupancy as a segmented bar: per-content-type runs colored by
-  // their own blue shade with a right-aligned usage readout. The used total
-  // is the most recent reported prompt size against the advertised route
-  // capacity (the same figures the old bracket bar showed).
+  // Context occupancy as a purely proportional bar with the usage readout
+  // riding outside it: the used total is the most recent reported prompt
+  // size against the advertised route capacity.
   if (stats.contextWindow > 0 && stats.lastPromptTokens > 0 && enabled.has('context')) {
     left.push({
       group: {
-        spans: [
-          { text: 'context ', tone: 'label' },
-          ...contextBar(stats.lastPromptTokens, stats.contextWindow, contextWidth),
-        ],
+        spans: contextGroupSpans(stats.lastPromptTokens, stats.contextWindow, contextWidth, 'full'),
       },
       rank: RANK_CONTEXT,
       id: 'context',
@@ -569,19 +574,18 @@ export function layoutStatusBar(
   const leftKept = [...orderedLeft]
   const rightKept = [...orderedRight]
 
-  // Context shrink state: the bar starts at its full budget and is rebuilt at
-  // ever narrower widths before the drop ladder is allowed to discard it.
+  // Context degradation state: the readout drops its absolute pair first,
+  // then the bar shrinks inside its own budget, and only then is the whole
+  // group removed — the proportional meter outlives the auxiliary numbers.
   // Rebuilding replaces the group's spans in place so width() re-measures it.
+  let contextReadout: ContextReadoutMode = 'full'
   let contextWidth = maxContextWidth
   const rebuildContext = (): void => {
     const index = leftKept.findIndex(entry => entry.id === 'context')
     if (index < 0) return
     leftKept[index] = {
       group: {
-        spans: [
-          { text: 'context ', tone: 'label' },
-          ...contextBar(stats.lastPromptTokens, stats.contextWindow, contextWidth),
-        ],
+        spans: contextGroupSpans(stats.lastPromptTokens, stats.contextWindow, contextWidth, contextReadout),
       },
       rank: RANK_CONTEXT,
       id: 'context',
@@ -599,23 +603,24 @@ export function layoutStatusBar(
   }
 
   while (width() > budget) {
-    // Context is the lowest-priority visual group. Shrink or remove it before
-    // sacrificing the permission badge or its Shift+Tab affordance.
-    // Shrink the context bar instead of dropping it: reserve everything else
-    // and hand the deficit to the bar, clamped to CONTEXT_MIN_WIDTH. The
-    // fixed label ('context ') and the bar's own readout keep shrinking to
-    // the bare percent, so a tight terminal keeps context visible longer.
-    if (leftKept.some(entry => entry.id === 'context') && contextWidth > CONTEXT_MIN_WIDTH) {
-      const overflow = width() - budget
-      contextWidth = Math.max(CONTEXT_MIN_WIDTH, contextWidth - overflow)
-      rebuildContext()
-      continue
-    }
-    const contextIndex = leftKept.findIndex(entry => entry.id === 'context')
-    if (contextIndex >= 0) {
-      // Once the meter reaches its minimum useful width, remove the whole
-      // group before touching the permission badge or its keyboard hint.
-      leftKept.splice(contextIndex, 1)
+    // Context is the lowest-priority visual group: the bar shrinks inside
+    // its own budget first (the absolute readout survives), then the
+    // readout degrades to the bare percent, and only then does the whole
+    // group go — before the permission badge or its Shift+Tab affordance
+    // is touched.
+    if (leftKept.some(entry => entry.id === 'context')) {
+      if (contextWidth > CONTEXT_MIN_WIDTH) {
+        const overflow = width() - budget
+        contextWidth = Math.max(CONTEXT_MIN_WIDTH, contextWidth - overflow)
+        rebuildContext()
+        continue
+      }
+      if (contextReadout === 'full') {
+        contextReadout = 'percent'
+        rebuildContext()
+        continue
+      }
+      leftKept.splice(leftKept.findIndex(entry => entry.id === 'context'), 1)
       continue
     }
     if (hint && rightKept.length > 0 && leftKept.length > 0) {

package/src/render/text.ts

@@ -1,150 +1,158 @@
-/**
- * Display-boundary sanitization for externally sourced text (model output,
- * tool payloads, skill descriptions). Control characters — including ANSI
- * CSI/OSC escape sequences — would otherwise pass through Ink into the
- * terminal, letting output rewrite the screen or inject prompts. Newlines
- * survive; everything else in C0/C1 plus DEL becomes a visible `\xNN`
- * escape, and bidi overrides / invisible format controls / Unicode line and
- * paragraph separators become a visible `\uXXXX` escape (terminal emulators
- * that render bidirectional text would otherwise reorder the displayed
- * glyphs and let a command read as something it is not).
- *
- * @module @deepseek-ai/dsh-code/render/text
- */
-
-/** C0 controls except tab (0x09) and newline (0x0a), plus DEL and C1. */
-const CONTROL_ESCAPE = /[\u0000-\u0008\u000b-\u001f\u007f-\u009f]/gu
-
-/**
- * Bidi overrides and isolates (U+202A-202E, U+2066-2069), the Arabic Letter
- * Mark (U+061C), directional and zero-width format characters (U+200B,
- * U+200E/200F, U+2060-2064, U+FEFF), and Unicode line/paragraph separators
- * (U+2028/2029). Terminal emulators with bidi support (Windows Terminal,
- * iTerm2, kitty, WezTerm) reorder or hide these, so they must never reach
- * the terminal raw.
- */
-const INVISIBLE_ESCAPE = /[\u061c\u200b\u200e\u200f\u2028\u2029\u202a-\u202e\u2060-\u2064\u2066-\u206f\ufeff]/gu
-
-/**
- * Escape control and deceptive characters so externally sourced text cannot
- * drive the terminal. C0/C1/DEL render as a literal `\xNN` escape; bidi,
- * invisible-format, and separator controls render as a literal `\uXXXX`
- * escape. Newlines and tabs survive (budgeted callers normalize tabs).
- * @param text - raw text from a session event, tool payload, or catalog.
- * @returns display-safe text with every injectable character made visible.
- */
-export function displayText(text: string): string {
-  return text
-    .replace(CONTROL_ESCAPE, char => `\\x${char.charCodeAt(0).toString(16).padStart(2, '0')}`)
-    .replace(INVISIBLE_ESCAPE, char => `\\u${char.charCodeAt(0).toString(16).padStart(4, '0')}`)
-}
-
-/** Collapse external text to one terminal-safe logical row. */
-export function singleLineText(text: string): string {
-  return displayText(text).replace(/\r?\n/gu, ' ↵ ').replace(/\t/gu, '  ')
-}
-
-/** Terminal-cell width matching the TUI's existing CJK-aware wrapping rule. */
-function cellWidth(text: string): number {
-  let columns = 0
-  for (const char of text) {
-    columns += (char.codePointAt(0) ?? 0) > 0x2e7f ? 2 : 1
-  }
-  return columns
-}
-
-/**
- * Truncate one display-safe row without ever exceeding its physical-column
- * budget. The ellipsis is included inside the budget, matching Codex's popup
- * truncation contract; the previous app-local helper appended it after the
- * row was already full and could force an extra terminal wrap.
- */
-export function truncateColumns(text: string, columns: number): string {
-  const limit = Math.max(0, Math.floor(columns))
-  if (limit === 0) return ''
-  if (cellWidth(text) <= limit) return text
-
-  const contentLimit = limit - 1
-  let used = 0
-  let result = ''
-  for (const char of text) {
-    const width = cellWidth(char)
-    if (used + width > contentLimit) break
-    result += char
-    used += width
-  }
-  return `${result}…`
-}
-
-/** A display-safe suffix bounded by terminal rows and columns. */
-export interface DisplayTail {
-  /** Sanitized suffix suitable for direct terminal rendering. */
-  text: string
-  /** Whether content before the returned suffix was omitted. */
-  truncated: boolean
-}
-
-/** Read one Unicode character immediately before `end`. */
-function previousCharacter(text: string, end: number): { char: string; start: number } {
-  const last = text.charCodeAt(end - 1)
-  if (last >= 0xdc00 && last <= 0xdfff && end >= 2) {
-    const first = text.charCodeAt(end - 2)
-    if (first >= 0xd800 && first <= 0xdbff) {
-      return { char: text.slice(end - 2, end), start: end - 2 }
-    }
-  }
-  return { char: text.slice(end - 1, end), start: end - 1 }
-}
-
-/**
- * Keep only the newest display-safe text that fits a terminal rectangle.
- * The scan walks backward and stops as soon as the suffix is full, so a long
- * reasoning stream does not rescan its entire accumulated prefix per chunk.
- * Explicit newlines and terminal wrapping both consume rows; tabs expand to
- * two spaces so terminal tab stops (which render at contextual column 8
- * boundaries, not at the budgeted cell count) cannot inflate the physical
- * row count of the live region.
- * @param text - raw externally sourced text.
- * @param columns - available terminal columns.
- * @param rows - available terminal rows.
- * @returns a sanitized bounded suffix and whether an earlier prefix was cut.
- */
-export function displayTail(text: string, columns: number, rows: number): DisplayTail {
-  const columnLimit = Math.max(1, Math.floor(columns))
-  const rowLimit = Math.max(1, Math.floor(rows))
-  const reversed: string[] = []
-  let row = 1
-  let used = 0
-  let end = text.length
-
-  while (end > 0) {
-    const previous = previousCharacter(text, end)
-    if (previous.char === '\n') {
-      if (row >= rowLimit) break
-      reversed.push('\n')
-      row += 1
-      used = 0
-      end = previous.start
-      continue
-    }
-
-    const safe = previous.char === '\t' ? '  ' : displayText(previous.char)
-    const width = cellWidth(safe)
-    if (used > 0 && used + width > columnLimit) {
-      if (row >= rowLimit) break
-      // Materialize the soft wrap. Ink otherwise reflows at word boundaries
-      // and can turn a cell-counted two-row suffix into three rendered rows.
-      reversed.push('\n')
-      row += 1
-      used = 0
-    }
-    const extraRows = Math.floor(Math.max(0, width - 1) / columnLimit)
-    if (row + extraRows > rowLimit) break
-    row += extraRows
-    reversed.push(safe)
-    used = extraRows === 0 ? used + width : width - extraRows * columnLimit
-    end = previous.start
-  }
-
-  return { text: reversed.reverse().join(''), truncated: end > 0 }
-}
+/**
+ * Display-boundary sanitization for externally sourced text (model output,
+ * tool payloads, skill descriptions). Control characters — including ANSI
+ * CSI/OSC escape sequences — would otherwise pass through Ink into the
+ * terminal, letting output rewrite the screen or inject prompts. Newlines
+ * survive; everything else in C0/C1 plus DEL becomes a visible `\xNN`
+ * escape, and bidi overrides / invisible format controls / Unicode line and
+ * paragraph separators become a visible `\uXXXX` escape (terminal emulators
+ * that render bidirectional text would otherwise reorder the displayed
+ * glyphs and let a command read as something it is not).
+ *
+ * @module @deepseek-ai/dsh-code/render/text
+ */
+
+import { graphemeWidth, splitGraphemes, stringWidth } from './width.ts'
+
+/** C0 controls except tab (0x09) and newline (0x0a), plus DEL and C1. */
+const CONTROL_ESCAPE = /[\u0000-\u0008\u000b-\u001f\u007f-\u009f]/gu
+
+/**
+ * Bidi overrides and isolates (U+202A-202E, U+2066-2069), the Arabic Letter
+ * Mark (U+061C), directional and zero-width format characters (U+200B,
+ * U+200E/200F, U+2060-2064, U+FEFF), and Unicode line/paragraph separators
+ * (U+2028/2029). Terminal emulators with bidi support (Windows Terminal,
+ * iTerm2, kitty, WezTerm) reorder or hide these, so they must never reach
+ * the terminal raw.
+ */
+const INVISIBLE_ESCAPE = /[\u061c\u200b\u200e\u200f\u2028\u2029\u202a-\u202e\u2060-\u2064\u2066-\u206f\ufeff]/gu
+
+/**
+ * Escape control and deceptive characters so externally sourced text cannot
+ * drive the terminal. C0/C1/DEL render as a literal `\xNN` escape; bidi,
+ * invisible-format, and separator controls render as a literal `\uXXXX`
+ * escape. Newlines and tabs survive (budgeted callers normalize tabs).
+ * @param text - raw text from a session event, tool payload, or catalog.
+ * @returns display-safe text with every injectable character made visible.
+ */
+export function displayText(text: string): string {
+  return text
+    .replace(CONTROL_ESCAPE, char => `\\x${char.charCodeAt(0).toString(16).padStart(2, '0')}`)
+    .replace(INVISIBLE_ESCAPE, char => `\\u${char.charCodeAt(0).toString(16).padStart(4, '0')}`)
+}
+
+/** Collapse external text to one terminal-safe logical row. */
+export function singleLineText(text: string): string {
+  return displayText(text).replace(/\r?\n/gu, ' ↵ ').replace(/\t/gu, '  ')
+}
+
+/**
+ * Truncate one display-safe row without ever exceeding its physical-column
+ * budget. The ellipsis is included inside the budget, matching Codex's popup
+ * truncation contract; the cut walks grapheme clusters so emoji and
+ * combining sequences never split mid-cluster.
+ */
+export function truncateColumns(text: string, columns: number): string {
+  const limit = Math.max(0, Math.floor(columns))
+  if (limit === 0) return ''
+  if (stringWidth(text) <= limit) return text
+
+  const contentLimit = limit - 1
+  let used = 0
+  let result = ''
+  for (const cluster of splitGraphemes(text)) {
+    const width = graphemeWidth(cluster)
+    if (used + width > contentLimit) break
+    result += cluster
+    used += width
+  }
+  return `${result}…`
+}
+
+/** A display-safe suffix bounded by terminal rows and columns. */
+export interface DisplayTail {
+  /** Sanitized suffix suitable for direct terminal rendering. */
+  text: string
+  /** Whether content before the returned suffix was omitted. */
+  truncated: boolean
+}
+
+/** Punctuation that must never START a physical row (CJK kinsoku tail set). */
+const ROW_START_FORBIDDEN = '，。、；：！？）】」』〉》…‥'
+
+/** Punctuation that must never END a physical row (CJK kinsoku head set). */
+const ROW_END_FORBIDDEN = '（【「『〈《'
+
+/**
+ * Keep the newest display-safe text that fits a terminal rectangle, wrapping
+ * FORWARD from the start of the text and slicing the tail rows.
+ *
+ * Forward wrapping is what keeps a streaming tail calm: rows already produced
+ * never re-wrap as tokens append (a backward scan recomputes every wrap point
+ * per chunk and the whole visible block jumps), and the wrap rules match the
+ * settled text's renderer so the flush at turn end does not reflow the block
+ * a second time. CJK kinsoku applies at both edges: closing punctuation
+ * overhangs up to two cells onto the filled row instead of starting the next
+ * one (within the caret column the caller reserves), and opening punctuation
+ * moves down instead of dangling at a row end. Tabs expand to two spaces so
+ * terminal tab stops cannot inflate the physical row count; clusters carry
+ * emoji presentation and combining marks whole.
+ * @param text - raw externally sourced text.
+ * @param columns - available terminal columns.
+ * @param rows - available terminal rows.
+ * @returns a sanitized bounded suffix and whether an earlier prefix was cut.
+ */
+export function displayTail(text: string, columns: number, rows: number): DisplayTail {
+  const columnLimit = Math.max(1, Math.floor(columns))
+  const rowLimit = Math.max(1, Math.floor(rows))
+  const wrapped: string[] = []
+  let current = ''
+  let used = 0
+  let lastCluster = ''
+  const flush = (): void => {
+    wrapped.push(current)
+    current = ''
+    used = 0
+    lastCluster = ''
+  }
+
+  for (const cluster of splitGraphemes(text)) {
+    if (cluster === '\n') {
+      flush()
+      continue
+    }
+    const safe = cluster === '\t' ? '  ' : displayText(cluster)
+    // safe can be a multi-character escape literal (\xNN / \uXXXX); only
+    // stringWidth budgets the whole visible escape, never its first byte.
+    const width = stringWidth(safe)
+    if (used > 0 && used + width > columnLimit) {
+      const overhang = width <= 2 && ROW_START_FORBIDDEN.includes(cluster)
+      if (!overhang) {
+        // Kinsoku head: an opening mark at the row edge moves down with the
+        // incoming cluster instead of dangling at the end of the filled row.
+        if (lastCluster !== '' && ROW_END_FORBIDDEN.includes(lastCluster)) {
+          const carried = lastCluster
+          current = current.slice(0, current.length - carried.length)
+          flush()
+          current = carried
+          used = stringWidth(carried)
+        } else {
+          flush()
+        }
+      }
+    }
+    current += safe
+    used += width
+    lastCluster = cluster
+  }
+  // A trailing newline means one deliberate empty caret row, but that row
+  // must never evict real content or fake a truncation marker: flush the
+  // content first, decide truncation on content alone, then append the blank
+  // row only when the whole tail still fits the budget.
+  const trailingBlank = current === '' && wrapped.length > 0 && text.endsWith('\n')
+  if (current !== '') flush()
+  const truncated = wrapped.length > rowLimit
+  const kept = truncated ? wrapped.slice(-rowLimit) : wrapped
+  const keptRows = trailingBlank && kept.length < rowLimit ? [...kept, ''] : kept
+  return { text: keptRows.join('\n'), truncated }
+}