@golba98/codexa 1.0.3 → 1.0.5

package/src/ui/{ReasoningPicker.tsx → panels/ReasoningPicker.tsx}

@@ -1,7 +1,7 @@
 import React from "react";
-import { type ReasoningEffortCapability } from "../core/models/codexModelCapabilities.js";
-import { formatReasoningLabel } from "../config/settings.js";
-import { FOCUS_IDS } from "./focus.js";
+import { type ReasoningEffortCapability } from "../../core/models/codexModelCapabilities.js";
+import { formatReasoningLabel } from "../../config/settings.js";
+import { FOCUS_IDS } from "../input/focus.js";
 import { SelectionPanel } from "./SelectionPanel.js";
 
 interface ReasoningPickerProps {

package/src/ui/{SelectionPanel.tsx → panels/SelectionPanel.tsx}

@@ -1,7 +1,7 @@
 import React from "react";
 import { Box, Text, useFocus, useInput } from "ink";
 import SelectInput from "ink-select-input";
-import { useTheme } from "./theme.js";
+import { useTheme } from "../theme.js";
 
 interface SelectionPanelProps {
   focusId: string;
@@ -53,6 +53,7 @@ export function SelectionPanel({
         paddingY={1}
         marginTop={1}
         width="100%"
+        flexDirection="column"
       >
         <SelectInput
           items={items}
@@ -61,6 +62,9 @@ export function SelectionPanel({
           onSelect={(item) => onSelect(item.value)}
           onHighlight={(item) => onHighlight?.(item.value)}
         />
+        <Box marginTop={1}>
+          <Text color={theme.textDim}>Esc to close · Enter to confirm</Text>
+        </Box>
       </Box>
     </Box>
   );

package/src/ui/{SettingsPanel.tsx → panels/SettingsPanel.tsx}

@@ -1,8 +1,8 @@
 import React, { useMemo, useState } from "react";
 import { Box, Text, useFocus, useInput } from "ink";
-import type { SettingDefinition } from "../config/settings.js";
-import type { FocusTargetId } from "./focus.js";
-import { useTheme } from "./theme.js";
+import type { SettingDefinition } from "../../config/settings.js";
+import type { FocusTargetId } from "../input/focus.js";
+import { useTheme } from "../theme.js";
 
 export interface SettingsPanelProps<TKey extends string> {
   focusId: FocusTargetId;
@@ -39,7 +39,7 @@ export function SettingsPanel<TKey extends string>({
 
   const activeSetting = settings[selectedIndex] ?? settings[0];
   const subtitle = useMemo(() => {
-    const instructions = "↑↓ setting  ←→ option  Enter save  Esc cancel";
+    const instructions = "↑↓ setting  ←→ option  Esc to close · Enter to confirm";
     if (!activeSetting?.description) {
       return instructions;
     }

package/src/ui/{TextEntryPanel.tsx → panels/TextEntryPanel.tsx}

@@ -1,8 +1,8 @@
 import React, { useMemo, useState } from "react";
 import { Box, Text, useFocus, useInput } from "ink";
-import type { FocusTargetId } from "./focus.js";
-import { useTheme } from "./theme.js";
-import { stripMouseEscapes } from "./inputBuffer.js";
+import type { FocusTargetId } from "../input/focus.js";
+import { useTheme } from "../theme.js";
+import { stripMouseEscapes } from "../input/inputBuffer.js";
 
 interface TextEntryPanelProps {
   focusId: FocusTargetId;
@@ -27,7 +27,7 @@ export function TextEntryPanel({
   placeholder = "",
   initialValue = "",
   inputLabel = "Input",
-  footerHint = "Enter submit  Esc cancel  Backspace delete",
+  footerHint = "Esc to close · Enter to confirm",
   onSubmit,
   onCancel,
 }: TextEntryPanelProps) {

package/src/ui/{ThemePicker.tsx → panels/ThemePicker.tsx}

@@ -1,6 +1,6 @@
 import React from "react";
-import { AVAILABLE_THEMES, formatThemeLabel } from "../config/settings.js";
-import { FOCUS_IDS } from "./focus.js";
+import { AVAILABLE_THEMES, formatThemeLabel } from "../../config/settings.js";
+import { FOCUS_IDS } from "../input/focus.js";
 import { SelectionPanel } from "./SelectionPanel.js";
 
 interface ThemePickerProps {

package/src/ui/{UpdatePromptPanel.tsx → panels/UpdatePromptPanel.tsx}

@@ -1,8 +1,8 @@
 import React, { useEffect, useRef, useState } from "react";
 import { Box, Text, useFocus, useInput } from "ink";
 import { spawn } from "child_process";
-import { useTheme } from "./theme.js";
-import { CODEXA_NPM_PACKAGE, CODEXA_UPDATE_COMMAND } from "../core/updateCheck.js";
+import { useTheme } from "../theme.js";
+import { CODEXA_NPM_PACKAGE, CODEXA_UPDATE_COMMAND, formatVersionLabel } from "../../core/version/updateCheck.js";
 
 type Phase = "menu" | "running" | "done" | "error";
 
@@ -38,6 +38,10 @@ export function UpdatePromptPanel({
   const spawnStartedRef = useRef(false);
 
   useInput((input, key) => {
+    if (key.escape) {
+      onSkip();
+      return;
+    }
     if (phase === "menu") {
       if (key.upArrow || input === "k") {
         setSelectedIndex((i) => Math.max(0, i - 1));
@@ -57,12 +61,8 @@ export function UpdatePromptPanel({
         }
         return;
       }
-      if (key.escape) {
-        onSkip();
-        return;
-      }
     } else if (phase === "done" || phase === "error") {
-      if (key.return || key.escape) {
+      if (key.return) {
         onSkip();
       }
     }
@@ -107,9 +107,9 @@ export function UpdatePromptPanel({
     };
   }, [phase]);
 
-  const hintText = phase === "menu"
-    ? "↑↓/jk select  Enter confirm  Esc skip"
-    : "Press Enter to close";
+  const footerText = phase === "menu"
+    ? "Esc to close · Enter to confirm"
+    : "Esc to close";
 
   return (
     <Box flexDirection="column" width="100%" marginTop={1}>
@@ -122,11 +122,10 @@ export function UpdatePromptPanel({
         flexDirection="column"
       >
         <Box>
-          <Text color={theme.accent} bold>Update available  </Text>
-          <Text color={theme.textMuted}>{hintText}</Text>
+          <Text color={theme.accent} bold>{`Update available: Codexa ${formatVersionLabel(latestVersion)}`}</Text>
         </Box>
         <Box marginTop={1}>
-          <Text color={theme.text}>{`✨ ${currentVersion} -> ${latestVersion}`}</Text>
+          <Text color={theme.text}>{`${formatVersionLabel(currentVersion)} -> ${formatVersionLabel(latestVersion)}`}</Text>
         </Box>
         <Box>
           <Text color={theme.textMuted}>{`Package: ${CODEXA_NPM_PACKAGE}`}</Text>
@@ -138,7 +137,7 @@ export function UpdatePromptPanel({
 
       <Box
         borderStyle="round"
-        borderColor={theme.borderFocused}
+        borderColor={phase === "menu" ? theme.borderFocused : theme.border}
         paddingX={2}
         paddingY={1}
         marginTop={1}
@@ -160,9 +159,6 @@ export function UpdatePromptPanel({
                 </Text>
               </Box>
             ))}
-            <Box marginTop={1}>
-              <Text color={theme.textDim}>Press enter to continue</Text>
-            </Box>
           </>
         )}
 
@@ -179,9 +175,6 @@ export function UpdatePromptPanel({
           <>
             <Text color={theme.success}>{"Codexa was updated successfully."}</Text>
             <Text color={theme.textMuted}>{"Restart Codexa to use the new version."}</Text>
-            <Box marginTop={1}>
-              <Text color={theme.textDim}>Press Enter to close</Text>
-            </Box>
           </>
         )}
 
@@ -192,11 +185,12 @@ export function UpdatePromptPanel({
             {outputLines.slice(-5).map((line, i) => (
               <Text key={i} color={theme.textDim}>{line}</Text>
             ))}
-            <Box marginTop={1}>
-              <Text color={theme.textDim}>Press Enter to close</Text>
-            </Box>
           </>
         )}
+
+        <Box marginTop={1}>
+          <Text color={theme.textDim}>{footerText}</Text>
+        </Box>
       </Box>
     </Box>
   );

package/src/ui/{Markdown.tsx → render/Markdown.tsx}

@@ -1,7 +1,7 @@
 import React from "react";
 import { Box, Text } from "ink";
-import { useTheme } from "./theme.js";
-import { Panel } from "./Panel.js";
+import { useTheme } from "../theme.js";
+import { Panel } from "../panels/Panel.js";
 import { maybeRenderDiff, type DiffRenderLineType } from "./diffRenderer.js";
 import { formatLocalPathForTerminal, formatTerminalAnswerInline } from "./terminalAnswerFormat.js";
 

package/src/ui/{diffRenderer.ts → render/diffRenderer.ts}

@@ -1,4 +1,4 @@
-import { sanitizeTerminalOutput } from "../core/terminal/terminalSanitize.js";
+import { sanitizeTerminalOutput } from "../../core/terminal/terminalSanitize.js";
 
 export type DiffRenderLineType = "file" | "hunk" | "add" | "remove" | "context" | "meta";
 

package/src/ui/{logoVariants.ts → render/logoVariants.ts}

@@ -10,8 +10,8 @@ import { getTextWidth } from "./textLayout.js";
 // The companion `wrap="truncate"` rule keeps each row on exactly one terminal
 // line regardless of the surrounding Ink flex layout.
 
-// Canonical Codexa brand wordmark — the ██ block art is the authoritative logo.
-// Always shown on any normal-width terminal (≥ LOGO_LARGE_MIN_COLS cols).
+// Canonical Codexa brand wordmark — the ██ block art is the authoritative
+// large logo for wide/max layouts.
 export const CODEXA_WORDMARK = [
   " ██████╗ ██████╗ ██████╗ ███████╗██╗  ██╗ █████╗ ",
   "██╔════╝██╔═══██╗██╔══██╗██╔════╝╚██╗██╔╝██╔══██╗",
@@ -48,16 +48,13 @@ export const LOGO_COMPACT_MIN_COLS = 48;
 // Minimum terminal rows each variant needs to render without crowding out the
 // metadata + composer. A wide-but-short terminal (e.g. VS Code's bottom panel)
 // must step DOWN to a smaller logo instead of dropping straight to text-only.
-export const LOGO_LARGE_MIN_ROWS = 24;
+export const LOGO_LARGE_MIN_ROWS = 35;
 export const LOGO_MEDIUM_MIN_ROWS = 16;
 export const LOGO_COMPACT_MIN_ROWS = 12;
 
-// LOGO_MEDIUM is kept as an exported constant but intentionally omitted from
-// LOGO_VARIANTS. At 72+ cols, LOGO_LARGE_MIN_COLS = LOGO_MEDIUM_MIN_COLS = 72,
-// so LOGO_LARGE always wins. Below 72 cols the viewport is too narrow for the
-// thin ASCII art to add value over the compact single-line fallback.
 const LOGO_VARIANTS: readonly { logo: readonly string[]; minCols: number; minRows: number }[] = [
   { logo: LOGO_LARGE, minCols: LOGO_LARGE_MIN_COLS, minRows: LOGO_LARGE_MIN_ROWS },
+  { logo: LOGO_MEDIUM, minCols: LOGO_MEDIUM_MIN_COLS, minRows: LOGO_MEDIUM_MIN_ROWS },
   { logo: LOGO_COMPACT, minCols: LOGO_COMPACT_MIN_COLS, minRows: LOGO_COMPACT_MIN_ROWS },
 ];
 
@@ -92,7 +89,6 @@ export function selectLogoVariantForViewport(cols: number, rows: number): readon
   if (process.env["CODEXA_COMPACT_LOGO"] === "1") {
     return rows >= LOGO_COMPACT_MIN_ROWS ? LOGO_COMPACT : [];
   }
-  if (cols >= LOGO_LARGE_MIN_COLS) return LOGO_LARGE;
   for (const variant of LOGO_VARIANTS) {
     if (cols >= variant.minCols && rows >= variant.minRows) {
       return variant.logo;

package/src/ui/{modeDisplay.ts → render/modeDisplay.ts}

@@ -1,5 +1,5 @@
-import { formatModeLabel } from "../config/settings.js";
-import type { Theme } from "./theme.js";
+import { formatModeLabel } from "../../config/settings.js";
+import type { Theme } from "../theme.js";
 
 export interface ModeDisplaySpec {
   label: string;

package/src/ui/{outputPipeline.ts → render/outputPipeline.ts}

@@ -1,5 +1,5 @@
-import { isNoiseLine } from "../core/providers/codexTranscript.js";
-import { sanitizeTerminalOutput } from "../core/terminal/terminalSanitize.js";
+import { isNoiseLine } from "../../core/providers/codexTranscript.js";
+import { sanitizeTerminalOutput } from "../../core/terminal/terminalSanitize.js";
 import { parseMarkdown, type Segment } from "./Markdown.js";
 
 /**

package/src/ui/{runtimeDisplay.ts → render/runtimeDisplay.ts}

@@ -1,10 +1,11 @@
-import { formatModeLabel, formatReasoningLabel } from "../config/settings.js";
-import type { RuntimeSummary } from "../config/runtimeConfig.js";
-import type { CodexModelCapability } from "../core/models/codexModelCapabilities.js";
-import type { ModelSpec } from "../core/models/modelSpecs.js";
-import type { ModelContextMetadata } from "../core/providerRuntime/contextMetadata.js";
-import { contextMetadataToModelSpec, formatContextCompact } from "../core/providerRuntime/contextMetadata.js";
-import type { ActiveProviderRoute } from "../core/providerRuntime/types.js";
+import { formatModeLabel, formatReasoningLabel } from "../../config/settings.js";
+import type { RuntimeSummary } from "../../config/runtimeConfig.js";
+import type { CodexModelCapability } from "../../core/models/codexModelCapabilities.js";
+import type { ModelSpec } from "../../core/models/modelSpecs.js";
+import type { ModelContextMetadata } from "../../core/providerRuntime/contextMetadata.js";
+import { contextMetadataToModelSpec, formatContextCompact } from "../../core/providerRuntime/contextMetadata.js";
+import type { ActiveProviderRoute } from "../../core/providerRuntime/types.js";
+import { getAntigravityModelLabel } from "../../core/providerRuntime/antigravity.js";
 
 export interface ActiveRuntimeDisplayInput {
   route: ActiveProviderRoute;
@@ -28,7 +29,9 @@ const PROVIDER_DISPLAY: Record<string, string> = {
   openai: "OpenAI Codex CLI",
   anthropic: "Claude Code CLI",
   google: "Gemini CLI",
+  mistral: "Mistral Vibe CLI",
   local: "Local",
+  antigravity: "Antigravity CLI",
 };
 
 function formatContextLimit(value: number): string {
@@ -53,6 +56,9 @@ function getModelLabel(route: ActiveProviderRoute, capability?: CodexModelCapabi
   if (route.providerId === "anthropic") {
     return capability?.label ?? route.modelId;
   }
+  if (route.providerId === "antigravity") {
+    return getAntigravityModelLabel(route.modelId);
+  }
   return route.modelId;
 }
 
@@ -65,7 +71,10 @@ export function buildActiveRuntimeDisplay({
   contextMetadata = null,
 }: ActiveRuntimeDisplayInput): ActiveRuntimeDisplay {
   const providerLabel = PROVIDER_DISPLAY[route.providerId] ?? route.providerId;
-  const reasoning = formatReasoningLabel(route.reasoning ?? reasoningLevel);
+  const rawReasoning = route.providerId === "antigravity"
+    ? route.reasoning
+    : route.reasoning ?? reasoningLevel;
+  const reasoning = rawReasoning ? formatReasoningLabel(rawReasoning) : null;
   const modelLabel = getModelLabel(route, modelCapability);
   const validContextMetadata = isContextForRoute(contextMetadata, route) ? contextMetadata : null;
   const contextDisplay = validContextMetadata?.contextLength != null
@@ -82,8 +91,12 @@ export function buildActiveRuntimeDisplay({
 
   return {
     providerLabel,
-    modelDisplay: `${providerLabel} / ${modelLabel} / reasoning: ${reasoning}`,
-    footerModelDisplay: `${providerLabel} / ${modelLabel} (${reasoning})`,
+    modelDisplay: reasoning
+      ? `${providerLabel} / ${modelLabel} / reasoning: ${reasoning}`
+      : `${providerLabel} / ${modelLabel}`,
+    footerModelDisplay: reasoning
+      ? `${providerLabel} / ${modelLabel} (${reasoning})`
+      : `${providerLabel} / ${modelLabel}`,
     contextDisplay,
     modeLabel: formatModeLabel(mode),
     modelSpec,

package/src/ui/{textLayout.ts → render/textLayout.ts}

@@ -198,9 +198,14 @@ export function splitTextAtColumn(text: string, column: number): { before: strin
 
 // ─── Text wrapping ────────────────────────────────────────────────────────────
 
-export function wrapTextRows(text: string, maxWidth: number): WrappedTextRow[] {
+export function wrapTextRows(
+  text: string,
+  maxWidth: number,
+  firstLineWidth: number = maxWidth,
+): WrappedTextRow[] {
   const normalized = normalizeLineBreaks(text);
   const safeWidth = Math.max(1, maxWidth);
+  const safeFirstWidth = Math.max(1, firstLineWidth);
   const rows: WrappedTextRow[] = [];
   let rowStart = 0;
   let rowText = "";
@@ -220,7 +225,9 @@ export function wrapTextRows(text: string, maxWidth: number): WrappedTextRow[] {
       continue;
     }
 
-    if (rowText.length > 0 && rowWidth + unit.width > safeWidth) {
+    // Only the first emitted row honors firstLineWidth; later rows use maxWidth.
+    const limit = rows.length === 0 ? safeFirstWidth : safeWidth;
+    if (rowText.length > 0 && rowWidth + unit.width > limit) {
       rows.push({
         text: rowText,
         start: rowStart,
@@ -252,8 +259,12 @@ export function wrapTextRows(text: string, maxWidth: number): WrappedTextRow[] {
   }];
 }
 
-export function wrapPlainText(text: string, maxWidth: number): string[] {
-  return wrapTextRows(text, maxWidth).map((row) => row.text);
+export function wrapPlainText(
+  text: string,
+  maxWidth: number,
+  firstLineWidth: number = maxWidth,
+): string[] {
+  return wrapTextRows(text, maxWidth, firstLineWidth).map((row) => row.text);
 }
 
 export function wrapCommandText(text: string, maxWidth: number): string[] {

package/src/ui/{ActionRequiredBlock.tsx → timeline/ActionRequiredBlock.tsx}

@@ -1,8 +1,8 @@
 import React from "react";
 import { Box, Text } from "ink";
-import { getUsableShellWidth } from "./layout.js";
-import { wrapPlainText } from "./textLayout.js";
-import { useTheme } from "./theme.js";
+import { getUsableShellWidth } from "../layout.js";
+import { wrapPlainText } from "../render/textLayout.js";
+import { useTheme } from "../theme.js";
 
 interface ActionRequiredBlockProps {
   cols: number;

package/src/ui/{AgentBlock.tsx → timeline/AgentBlock.tsx}

@@ -1,21 +1,21 @@
 import React, { memo, useDeferredValue, useMemo } from "react";
 import { Box, Text } from "ink";
-import type { AssistantEvent, RunEvent } from "../session/types.js";
-import { getAssistantContent } from "../session/types.js";
-import { MemoizedRenderMessage } from "./Markdown.js";
-import { getUsableShellWidth } from "./layout.js";
-import { useTheme } from "./theme.js";
-import { wrapPlainText } from "./textLayout.js";
-import { RUN_OUTPUT_TRUNCATION_NOTICE } from "../session/chatLifecycle.js";
-import { sanitizeTerminalOutput } from "../core/terminal/terminalSanitize.js";
+import type { AssistantEvent, RunEvent } from "../../session/types.js";
+import { getAssistantContent } from "../../session/types.js";
+import { MemoizedRenderMessage } from "../render/Markdown.js";
+import { getUsableShellWidth } from "../layout.js";
+import { useTheme } from "../theme.js";
+import { wrapPlainText } from "../render/textLayout.js";
+import { RUN_OUTPUT_TRUNCATION_NOTICE } from "../../session/chatLifecycle.js";
+import { sanitizeTerminalOutput } from "../../core/terminal/terminalSanitize.js";
 import {
   sanitizeOutput,
   sanitizeStreamChunk,
   normalizeOutput,
   classifyOutput,
   formatForBox,
-} from "./outputPipeline.js";
-import { DashCard } from "./DashCard.js";
+} from "../render/outputPipeline.js";
+import { DashCard } from "../chrome/DashCard.js";
 
 
 function formatDuration(ms: number): string {

package/src/ui/{StaticIntroItem.tsx → timeline/StaticIntroItem.tsx}

@@ -1,7 +1,7 @@
 import React from "react";
 import { Box } from "ink";
-import type { CodexAuthState } from "../core/auth/codexAuth.js";
-import { getShellWidth, type Layout, type StartupHeaderMode } from "./layout.js";
+import type { CodexAuthState } from "../../core/auth/codexAuth.js";
+import { getShellWidth, type Layout, type StartupHeaderMode } from "../layout.js";
 import { buildIntroRenderItem, TimelineRowView } from "./Timeline.js";
 import type { TimelineRow } from "./timelineMeasure.js";
 import { buildTimelineSnapshot } from "./timelineMeasure.js";

package/src/ui/{ThinkingBlock.tsx → timeline/ThinkingBlock.tsx}

@@ -1,9 +1,9 @@
 import React from "react";
 import { Box, Text } from "ink";
-import type { RunEvent } from "../session/types.js";
-import { clampVisualText, getUsableShellWidth } from "./layout.js";
-import { useTheme } from "./theme.js";
-import { DashCard } from "./DashCard.js";
+import type { RunEvent } from "../../session/types.js";
+import { clampVisualText, getUsableShellWidth } from "../layout.js";
+import { useTheme } from "../theme.js";
+import { DashCard } from "../chrome/DashCard.js";
 import {
   formatProgressBlockBodyLines,
   getProgressUpdateCount,