ethagent 1.1.1 → 2.0.0

package/src/ui/TextInput.tsx

@@ -1,7 +1,14 @@
-import React, { useState } from 'react'
-import { Box, Text } from 'ink'
+import React, { useState, useRef, useEffect } from 'react'
+import { Box, Text, useStdout } from 'ink'
 import { theme } from './theme.js'
 import { useAppInput } from '../app/input/AppInputProvider.js'
+import { moveVerticalVisual } from '../chat/chatInputState.js'
+import {
+  getVisualLineIndex,
+  getVisualLines,
+} from '../chat/textCursor.js'
+
+const DEFAULT_CHROME_WIDTH = 10
 
 type TextInputProps = {
   label?: string
@@ -9,10 +16,19 @@ type TextInputProps = {
   isSecret?: boolean
   initialValue?: string
   allowEmpty?: boolean
+  multiline?: boolean
+  chromeWidth?: number
   maxLength?: number
   validate?: (value: string) => string | null
   onSubmit: (value: string) => void
   onCancel?: () => void
+  onNavigateLeft?: () => void
+  onNavigateRight?: (value: string) => void
+}
+
+type RenderedTextInputLine = {
+  visualLineIndex: number
+  node: React.ReactNode
 }
 
 export function TextInput({
@@ -21,50 +37,126 @@ export function TextInput({
   isSecret,
   initialValue = '',
   allowEmpty = false,
+  multiline = false,
+  chromeWidth = DEFAULT_CHROME_WIDTH,
   maxLength = 4096,
   validate,
   onSubmit,
   onCancel,
+  onNavigateLeft,
+  onNavigateRight,
 }: TextInputProps) {
+  const { stdout } = useStdout()
   const [value, setValue] = useState(initialValue)
+  const [cursor, setCursor] = useState(initialValue.length)
+  const [preferredColumn, setPreferredColumn] = useState<number | null>(null)
   const [error, setError] = useState<string | null>(null)
 
+  const [columns, setColumns] = useState<number>(() => Math.floor(stdout?.columns ?? 80))
+  useEffect(() => {
+    if (!stdout) return
+    const handleResize = () => setColumns(Math.floor(stdout.columns ?? 80))
+    stdout.on('resize', handleResize)
+    return () => { stdout.off('resize', handleResize) }
+  }, [stdout])
+
+  const wrapWidth = textInputWrapWidth(columns, chromeWidth)
+
+  const stateRef = useRef({ value, cursor, preferredColumn, wrapWidth })
+  stateRef.current = { value, cursor, preferredColumn, wrapWidth }
+
   useAppInput((input, key) => {
-    if (key.return) {
-      if (!allowEmpty && value.trim().length === 0) {
+    const { value: val, cursor: cur, preferredColumn: prefCol, wrapWidth: ww } = stateRef.current
+
+    const submitValue = (submit: (value: string) => void) => {
+      if (!allowEmpty && val.trim().length === 0) {
         setError('value cannot be empty')
-        return
+        return false
       }
-      const validationError = validate?.(value) ?? null
+      const validationError = validate?.(val) ?? null
       if (validationError) {
         setError(validationError)
-        return
+        return false
       }
       setError(null)
-      onSubmit(value)
+      submit(val)
+      return true
+    }
+
+    if (multiline && isTextInputSoftBreak(key)) {
+      const next = insertTextInputText(val, cur, '\n', maxLength)
+      setValue(next.value)
+      setCursor(next.cursor)
+      setPreferredColumn(null)
+      if (error) setError(null)
+      return
+    }
+    if (key.return) {
+      submitValue(onSubmit)
       return
     }
-    if (key.escape) {
+    if (key.escape || (key.ctrl && input === 'c')) {
       onCancel?.()
       return
     }
+    if (key.leftArrow) {
+      if (onNavigateLeft && cur === 0) {
+        onNavigateLeft()
+        return
+      }
+      setCursor(Math.max(0, cur - 1))
+      setPreferredColumn(null)
+      return
+    }
+    if (key.rightArrow) {
+      if (onNavigateRight && cur === val.length) {
+        submitValue(onNavigateRight)
+        return
+      }
+      setCursor(Math.min(val.length, cur + 1))
+      setPreferredColumn(null)
+      return
+    }
+    if (multiline && (key.upArrow || key.downArrow)) {
+      const result = moveVerticalVisual(val, cur, key.upArrow ? -1 : 1, ww, prefCol)
+      if (result.kind === 'moved') setCursor(result.cursor)
+      setPreferredColumn(result.preferredColumn)
+      return
+    }
     if (key.backspace || key.delete) {
-      setValue(v => v.slice(0, -1))
+      if (cur === 0) return
+      setValue(val.slice(0, cur - 1) + val.slice(cur))
+      setCursor(cur - 1)
+      setPreferredColumn(null)
       if (error) setError(null)
       return
     }
     if (key.ctrl && input === 'u') {
-      setValue('')
+      const lineStart = val.lastIndexOf('\n', cur - 1) + 1
+      if (lineStart === cur) {
+        if (!multiline || cur === 0) return
+        setValue(val.slice(0, cur - 1) + val.slice(cur))
+        setCursor(cur - 1)
+      } else {
+        setValue(val.slice(0, lineStart) + val.slice(cur))
+        setCursor(lineStart)
+      }
+      setPreferredColumn(null)
       if (error) setError(null)
       return
     }
-    if (key.ctrl || key.meta || key.leftArrow || key.rightArrow || key.upArrow || key.downArrow || key.tab) {
+    if (key.ctrl || key.meta || key.upArrow || key.downArrow || key.tab) {
       return
     }
     if (input) {
-      const clean = input.replace(/[\r\n]/g, '')
+      const clean = multiline
+        ? input.replace(/\r\n/g, '\n').replace(/\r/g, '\n')
+        : input.replace(/[\r\n]/g, '')
       if (clean) {
-        setValue(v => (v + clean).slice(0, maxLength))
+        const next = insertTextInputText(val, cur, clean, maxLength)
+        setValue(next.value)
+        setCursor(next.cursor)
+        setPreferredColumn(null)
         if (error) setError(null)
       }
     }
@@ -72,26 +164,96 @@ export function TextInput({
 
   const display = isSecret ? '*'.repeat(value.length) : value
   const showPlaceholder = value.length === 0 && placeholder
+  const renderedLines = multiline
+    ? renderTextInputLines(display, cursor, true, wrapWidth)
+    : []
 
   return (
     <Box flexDirection="column">
       {label ? <Text color={theme.dim}>{label}</Text> : null}
-      <Box flexDirection="row">
-        <Text color={theme.accentPrimary}>{'> '}</Text>
-        {showPlaceholder ? (
-          <>
-            <Text color={theme.accentPrimary}>|</Text>
-            <Text color={theme.dim}>{placeholder}</Text>
-          </>
-        ) : (
-          <>
-            <Text color={theme.text}>{display}</Text>
-            <Text color={theme.accentPrimary}>|</Text>
-          </>
-        )}
-      </Box>
-      {error ? <Text color="#e87070">{error}</Text> : null}
+      {multiline && !showPlaceholder ? (
+        <Box flexDirection="column">
+          {renderedLines.map(line => (
+            <Box key={line.visualLineIndex} flexDirection="row">
+              <Text color={line.visualLineIndex === 0 ? theme.accentPeriwinkle : theme.dim}>
+                {line.visualLineIndex === 0 ? '> ' : '  '}
+              </Text>
+              <Box width={wrapWidth}>{line.node}</Box>
+            </Box>
+          ))}
+        </Box>
+      ) : (
+        <Box flexDirection="row">
+          <Text color={theme.accentPeriwinkle}>{'> '}</Text>
+          <Box width={wrapWidth}>
+            {showPlaceholder ? (
+              <Text wrap={multiline ? 'wrap' : 'truncate-end'}>
+                <Text backgroundColor={theme.accentPeriwinkle} color="#0c0c1f">{' '}</Text>
+                <Text color={theme.dim}>{placeholder}</Text>
+              </Text>
+            ) : (
+              <Text color={theme.text} wrap="truncate-end">
+                {display.slice(0, cursor)}
+                <Text backgroundColor={theme.accentPeriwinkle} color="#0c0c1f">{display[cursor] ?? ' '}</Text>
+                {display.slice(cursor + 1)}
+              </Text>
+            )}
+          </Box>
+        </Box>
+      )}
+      {error ? <Text color={theme.accentError}>{error}</Text> : null}
     </Box>
   )
 }
 
+export function textInputWrapWidth(columns: number, chromeWidth = DEFAULT_CHROME_WIDTH): number {
+  return Math.max(1, Math.floor(columns) - Math.max(0, Math.floor(chromeWidth)))
+}
+
+export function insertTextInputText(value: string, cursor: number, input: string, maxLength = 4096): { value: string; cursor: number } {
+  const cleanCursor = Math.max(0, Math.min(cursor, value.length))
+  const next = (value.slice(0, cleanCursor) + input + value.slice(cleanCursor)).slice(0, maxLength)
+  return {
+    value: next,
+    cursor: Math.min(cleanCursor + input.length, next.length),
+  }
+}
+
+export function isTextInputSoftBreak(key: { return: boolean; shift?: boolean; meta?: boolean }): boolean {
+  return key.return && Boolean(key.shift || key.meta)
+}
+
+export function renderTextInputLines(
+  value: string,
+  cursor: number,
+  showCursor: boolean,
+  wrapWidth: number,
+): RenderedTextInputLine[] {
+  const lines = getVisualLines(value, wrapWidth)
+  const cursorLine = getVisualLineIndex(lines, cursor)
+
+  return lines.map((line, visualLineIndex) => {
+    const text = value.slice(line.start, line.end)
+    if (!showCursor || visualLineIndex !== cursorLine) {
+      return {
+        visualLineIndex,
+        node: <Text color={theme.text} wrap="wrap">{text || ' '}</Text>,
+      }
+    }
+
+    const column = Math.max(0, Math.min(cursor - line.start, text.length))
+    const before = text.slice(0, column)
+    const atChar = text[column] ?? ' '
+    const after = text.slice(column + 1)
+    return {
+      visualLineIndex,
+      node: (
+        <Text color={theme.text} wrap="wrap">
+          {before}
+          <Text backgroundColor={theme.accentPeriwinkle} color="#0c0c1f">{atChar}</Text>
+          {after}
+        </Text>
+      ),
+    }
+  })
+}

package/src/ui/theme.ts

@@ -1,29 +1,16 @@
 export const palette: Array<[number, number, number]> = [
   [0xff, 0xff, 0xff],
-  [0xf2, 0xf9, 0xf4],
-  [0xe7, 0xf4, 0xec],
-  [0xd4, 0xee, 0xdd],
-  [0xe7, 0xf4, 0xec],
+  [0xd8, 0xdc, 0xfa],
+  [0xe8, 0xee, 0xfd],
+  [0xd8, 0xdc, 0xfa],
   [0xff, 0xff, 0xff],
 ]
 
-export const eyePalette: Array<[number, number, number]> = [
-  [0xf5, 0xd8, 0xd8],
-  [0xf5, 0xe7, 0xcf],
-  [0xf5, 0xf0, 0xd4],
-  [0xd4, 0xee, 0xdd],
-  [0xd4, 0xe6, 0xf5],
-] as const
-
 export const theme = {
-  accentPrimary: '#d4eedd',
-  accentWarm: '#d8cda8',
-  accentNeutral: '#e4e3b5',
-  accentSecondary: '#c0e3cb',
-  accentMint: '#e7f4ec',
-  accentPeach: '#e7cdb7',
-  accentLavender: '#d9cae8',
-  accentInfo: '#90b8e8',
+  accentPeriwinkle: '#d8dcfa',
+  accentBlue: '#e8eefd',
+  accentWhite: '#f5f8ff',
+  accentError: '#d99898',
   border: '#555555',
   dim: '#777777',
   text: '#f1f1f1',
@@ -43,17 +30,3 @@ export function gradientColor(t: number): string {
   const b = Math.round(b1 + (b2 - b1) * f)
   return `#${r.toString(16).padStart(2, '0')}${g.toString(16).padStart(2, '0')}${b.toString(16).padStart(2, '0')}`
 }
-
-export function eyeGradientColor(t: number): string {
-  const s = Math.max(0, Math.min(1, t)) * (eyePalette.length - 1)
-  const i = Math.min(Math.floor(s), eyePalette.length - 2)
-  const f = s - i
-  const lo = eyePalette[i] ?? eyePalette[0]!
-  const hi = eyePalette[i + 1] ?? eyePalette[eyePalette.length - 1]!
-  const [r1, g1, b1] = lo
-  const [r2, g2, b2] = hi
-  const r = Math.round(r1 + (r2 - r1) * f)
-  const g = Math.round(g1 + (g2 - g1) * f)
-  const b = Math.round(b1 + (b2 - b1) * f)
-  return `#${r.toString(16).padStart(2, '0')}${g.toString(16).padStart(2, '0')}${b.toString(16).padStart(2, '0')}`
-}

package/src/utils/openExternal.ts

@@ -0,0 +1,21 @@
+import { spawn } from 'node:child_process'
+
+export function openExternalUrl(url: string): void {
+  const target = url.trim()
+  if (!target) return
+  const command = process.platform === 'win32'
+    ? 'cmd'
+    : process.platform === 'darwin'
+      ? 'open'
+      : 'xdg-open'
+  const args = process.platform === 'win32'
+    ? ['/c', 'start', '', target]
+    : [target]
+  const child = spawn(command, args, {
+    detached: true,
+    stdio: 'ignore',
+    windowsHide: true,
+  })
+  child.on('error', () => {})
+  child.unref()
+}

package/src/utils/withRetry.ts

@@ -6,6 +6,12 @@ export type RetryClassification = {
   code?: string
 }
 
+export type RetryBodyHint = {
+  retryAfterMs?: number
+  fatal?: boolean
+  reason?: string
+}
+
 export type RetryPolicy = {
   maxRetries: number
   baseDelayMs: number
@@ -179,6 +185,7 @@ export type FetchWithRetryOptions = {
   retryAfterCapMs?: number
   jitterRatio?: number
   rateLimitResetProvider?: RateLimitResetProvider
+  parseRetryHintFromBody?: (body: string) => RetryBodyHint | undefined
   signal?: AbortSignal
   fetchImpl?: typeof fetch
   sleep?: (ms: number, signal?: AbortSignal) => Promise<void>
@@ -205,10 +212,36 @@ export async function fetchWithRetry(
       const response = await fetchImpl(input, { ...init, signal: options.signal })
       if (response.ok) return response
 
-      const classification = classifyRetryableProviderResponse(response, now(), options.rateLimitResetProvider)
-      if (!classification.retryable || attempt > policy.maxRetries) return response
+      let classification = classifyRetryableProviderResponse(response, now(), options.rateLimitResetProvider)
+      let bufferedResponse: Response | undefined
+      if (
+        classification.retryable
+        && response.status === 429
+        && options.parseRetryHintFromBody
+      ) {
+        let bodyText = ''
+        try { bodyText = await response.text() } catch { /* ignore */ }
+        bufferedResponse = new Response(bodyText, {
+          status: response.status,
+          statusText: response.statusText,
+          headers: response.headers,
+        })
+        const hint = bodyText ? safeParseRetryHint(bodyText, options.parseRetryHintFromBody) : undefined
+        if (hint?.fatal) {
+          return bufferedResponse
+        }
+        if (hint?.retryAfterMs !== undefined) {
+          classification = { ...classification, retryAfterMs: hint.retryAfterMs }
+        }
+        if (hint?.reason) {
+          classification = { ...classification, reason: `${classification.reason} ${hint.reason}` }
+        }
+      }
+      if (!classification.retryable || attempt > policy.maxRetries) return bufferedResponse ?? response
 
-      try { await response.body?.cancel() } catch { /* ignore */ }
+      if (!bufferedResponse) {
+        try { await response.body?.cancel() } catch { /* ignore */ }
+      }
       const delayMs = computeBackoffMs(
         attempt,
         classification.retryAfterMs,
@@ -243,6 +276,17 @@ export async function fetchWithRetry(
   throw lastError ?? new Error('fetchWithRetry exhausted')
 }
 
+function safeParseRetryHint(
+  body: string,
+  parser: (body: string) => RetryBodyHint | undefined,
+): RetryBodyHint | undefined {
+  try {
+    return parser(body)
+  } catch {
+    return undefined
+  }
+}
+
 function retryEvent(
   attempt: number,
   maxRetries: number,