@within-7/minto 0.2.0 → 0.3.0

package/dist/components/Onboarding.js

@@ -15,6 +15,7 @@ import { getTheme } from "../utils/theme.js";
 import { clearTerminal } from "../utils/terminal.js";
 import { PressEnterToContinue } from "./PressEnterToContinue.js";
 import { ModelSelector } from "./ModelSelector/index.js";
+import { SEMANTIC_COLORS } from "../constants/colors.js";
 function Onboarding({ onDone }) {
   const [currentStepIndex, setCurrentStepIndex] = useState(0);
   const [showModelSelector, setShowModelSelector] = useState(false);
@@ -64,7 +65,7 @@ function Onboarding({ onDone }) {
     },
     { isActive: !showModelSelector }
   );
-  const themeStep = /* @__PURE__ */ React.createElement(Box, { flexDirection: "column", gap: 1, paddingLeft: 1 }, /* @__PURE__ */ React.createElement(Text, null, "Let's get started."), /* @__PURE__ */ React.createElement(Box, { flexDirection: "column" }, /* @__PURE__ */ React.createElement(Text, { bold: true }, "Choose the option that looks best when you select it:"), /* @__PURE__ */ React.createElement(Text, { dimColor: true }, "To change this later, run /config")), /* @__PURE__ */ React.createElement(
+  const themeStep = /* @__PURE__ */ React.createElement(Box, { flexDirection: "column", gap: 1, paddingLeft: 1 }, /* @__PURE__ */ React.createElement(Text, null, "Let's get started."), /* @__PURE__ */ React.createElement(Box, { flexDirection: "column" }, /* @__PURE__ */ React.createElement(Text, { bold: true }, "Choose the option that looks best when you select it:"), /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, "To change this later, run /config")), /* @__PURE__ */ React.createElement(
     Select,
     {
       options: [
@@ -88,7 +89,7 @@ function Onboarding({ onDone }) {
       paddingLeft: 1,
       marginRight: 1,
       borderStyle: "round",
-      borderColor: "gray",
+      borderColor: SEMANTIC_COLORS.dim,
       flexDirection: "column"
     },
     /* @__PURE__ */ React.createElement(

package/dist/components/Onboarding.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/Onboarding.tsx"],
-  "sourcesContent": ["import React, { useState } from 'react'\nimport { PRODUCT_NAME } from '@constants/product'\nimport { Box, Newline, Text, useInput } from 'ink'\nimport {\n  getGlobalConfig,\n  saveGlobalConfig,\n  DEFAULT_GLOBAL_CONFIG,\n  ProviderType,\n} from '@utils/config'\nimport { OrderedList } from '@inkjs/ui'\nimport { useExitOnCtrlCD } from '@hooks/useExitOnCtrlCD'\nimport { MIN_LOGO_WIDTH } from './Logo'\nimport { Select } from './CustomSelect/select'\nimport { StructuredDiff } from './StructuredDiff'\nimport { getTheme, type ThemeNames } from '@utils/theme'\nimport { clearTerminal } from '@utils/terminal'\nimport { PressEnterToContinue } from './PressEnterToContinue'\nimport { ModelSelector } from './ModelSelector'\ntype StepId = 'theme' | 'usage' | 'providers' | 'model'\n\ninterface OnboardingStep {\n  id: StepId\n  component: React.ReactNode\n}\n\ntype Props = {\n  onDone(): void\n}\n\nexport function Onboarding({ onDone }: Props): React.ReactNode {\n  const [currentStepIndex, setCurrentStepIndex] = useState(0)\n  const [showModelSelector, setShowModelSelector] = useState(false)\n  const config = getGlobalConfig()\n\n  const [selectedTheme, setSelectedTheme] = useState(\n    DEFAULT_GLOBAL_CONFIG.theme,\n  )\n  const theme = getTheme()\n  function goToNextStep() {\n    if (currentStepIndex < steps.length - 1) {\n      const nextIndex = currentStepIndex + 1\n      setCurrentStepIndex(nextIndex)\n    }\n  }\n\n  function handleThemeSelection(newTheme: string) {\n    saveGlobalConfig({\n      ...config,\n      theme: newTheme as ThemeNames,\n    })\n    goToNextStep()\n  }\n\n  function handleThemePreview(newTheme: string) {\n    setSelectedTheme(newTheme as ThemeNames)\n  }\n\n  function handleProviderSelectionDone() {\n    // After model selection is done, go to the next step\n    goToNextStep()\n  }\n\n  function handleModelSelectionDone() {\n    // After final model selection is done, complete onboarding\n    onDone()\n  }\n\n  // Disable exit handler when showing ModelSelector to prevent listener accumulation\n  const exitState = useExitOnCtrlCD(() => process.exit(0), {\n    isActive: !showModelSelector,\n  })\n\n  // Only listen when not showing ModelSelector\n  useInput(\n    async (_, key) => {\n      const currentStep = steps[currentStepIndex]\n      if (\n        key.return &&\n        currentStep &&\n        ['usage', 'providers', 'model'].includes(currentStep.id)\n      ) {\n        if (currentStep.id === 'model') {\n          // Navigate to ModelSelector component\n          setShowModelSelector(true)\n        } else if (currentStepIndex === steps.length - 1) {\n          onDone()\n        } else {\n          // HACK: for some reason there's now a jump here otherwise :(\n          await clearTerminal()\n          goToNextStep()\n        }\n      }\n    },\n    { isActive: !showModelSelector },\n  )\n\n  // Define all onboarding steps\n  const themeStep = (\n    <Box flexDirection=\"column\" gap={1} paddingLeft={1}>\n      <Text>Let&apos;s get started.</Text>\n      <Box flexDirection=\"column\">\n        <Text bold>Choose the option that looks best when you select it:</Text>\n        <Text dimColor>To change this later, run /config</Text>\n      </Box>\n      <Select\n        options={[\n          { label: 'Light text', value: 'dark' },\n          { label: 'Dark text', value: 'light' },\n          {\n            label: 'Light text (colorblind-friendly)',\n            value: 'dark-daltonized',\n          },\n          {\n            label: 'Dark text (colorblind-friendly)',\n            value: 'light-daltonized',\n          },\n        ]}\n        onFocus={handleThemePreview}\n        onChange={handleThemeSelection}\n      />\n      <Box flexDirection=\"column\">\n        <Box\n          paddingLeft={1}\n          marginRight={1}\n          borderStyle=\"round\"\n          borderColor=\"gray\"\n          flexDirection=\"column\"\n        >\n          <StructuredDiff\n            patch={{\n              oldStart: 1,\n              newStart: 1,\n              oldLines: 3,\n              newLines: 3,\n              lines: [\n                'function greet() {',\n                '-  console.log(\"Hello, World!\");',\n                '+  console.log(\"Hello, anon!\");',\n                '}',\n              ],\n            }}\n            dim={false}\n            width={40}\n            overrideTheme={selectedTheme}\n          />\n        </Box>\n      </Box>\n    </Box>\n  )\n\n  const providersStep = (\n    <Box flexDirection=\"column\" gap={1} paddingLeft={1}>\n      <Box flexDirection=\"column\" width={70}>\n        <Text color={theme.secondaryText}>\n          Next, let's select your preferred AI provider and model.\n        </Text>\n      </Box>\n      <ModelSelector\n        onDone={handleProviderSelectionDone}\n        skipModelType={true}\n        isOnboarding={true}\n      />\n    </Box>\n  )\n\n  const usageStep = (\n    <Box flexDirection=\"column\" gap={1} paddingLeft={1}>\n      <Text bold>Using {PRODUCT_NAME} effectively:</Text>\n      <Box flexDirection=\"column\" width={70}>\n        <OrderedList children={[]}>\n          <OrderedList.Item children={[]}>\n            <Text>\n              Start in your project directory\n              <Newline />\n              <Text color={theme.secondaryText}>\n                Files are automatically added to context when needed.\n              </Text>\n              <Newline />\n            </Text>\n          </OrderedList.Item>\n          <OrderedList.Item children={[]}>\n            <Text>\n              Use {PRODUCT_NAME} as a development partner\n              <Newline />\n              <Text color={theme.secondaryText}>\n                Get help with file analysis, editing, bash commands,\n                <Newline />\n                and git history.\n                <Newline />\n              </Text>\n            </Text>\n          </OrderedList.Item>\n          <OrderedList.Item children={[]}>\n            <Text>\n              Provide clear context\n              <Newline />\n              <Text color={theme.secondaryText}>\n                Be as specific as you would with another engineer. <Newline />\n                The better the context, the better the results. <Newline />\n              </Text>\n            </Text>\n          </OrderedList.Item>\n        </OrderedList>\n      </Box>\n      <PressEnterToContinue />\n    </Box>\n  )\n\n  const modelStep = (\n    <Box flexDirection=\"column\" gap={1} paddingLeft={1}>\n      <Text bold>Configure your models:</Text>\n      <Box flexDirection=\"column\" width={70}>\n        <Text>\n          You can customize which models {PRODUCT_NAME} uses for different\n          tasks.\n          <Newline />\n          <Text color={theme.secondaryText}>\n            Let's set up your preferred models for large and small tasks.\n          </Text>\n        </Text>\n        <Box marginTop={1}>\n          <Text>\n            Press <Text color={theme.suggestion}>Enter</Text> to continue to the\n            model selection screen.\n          </Text>\n        </Box>\n      </Box>\n      <PressEnterToContinue />\n    </Box>\n  )\n\n  const steps: OnboardingStep[] = []\n  steps.push({ id: 'theme', component: themeStep })\n  steps.push({ id: 'usage', component: usageStep })\n\n  steps.push({ id: 'model', component: modelStep })\n\n  // If we're showing the model selector screen, render it directly\n  if (showModelSelector) {\n    return (\n      <ModelSelector\n        onDone={handleModelSelectionDone}\n        skipModelType={true}\n        isOnboarding={true}\n      />\n    )\n  }\n\n  return (\n    <Box flexDirection=\"column\" gap={1}>\n      <>\n        <Box flexDirection=\"column\" gap={1}>\n          <Text bold>\n            {PRODUCT_NAME}{' '}\n            {exitState.pending\n              ? `(press ${exitState.keyName} again to exit)`\n              : ''}\n          </Text>\n          {steps[currentStepIndex]?.component}\n        </Box>\n      </>\n    </Box>\n  )\n}\n\nexport function WelcomeBox(): React.ReactNode {\n  const theme = getTheme()\n  return (\n    <Box\n      borderColor={theme.minto}\n      borderStyle=\"round\"\n      paddingX={1}\n      width={MIN_LOGO_WIDTH}\n    >\n      <Text>\n        <Text color={theme.minto}>\u273B</Text> Welcome to{' '}\n        <Text bold>{PRODUCT_NAME}</Text> research preview!\n      </Text>\n    </Box>\n  )\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import React, { useState } from 'react'\nimport { PRODUCT_NAME } from '@constants/product'\nimport { Box, Newline, Text, useInput } from 'ink'\nimport {\n  getGlobalConfig,\n  saveGlobalConfig,\n  DEFAULT_GLOBAL_CONFIG,\n  ProviderType,\n} from '@utils/config'\nimport { OrderedList } from '@inkjs/ui'\nimport { useExitOnCtrlCD } from '@hooks/useExitOnCtrlCD'\nimport { MIN_LOGO_WIDTH } from './Logo'\nimport { Select } from './CustomSelect/select'\nimport { StructuredDiff } from './StructuredDiff'\nimport { getTheme, type ThemeNames } from '@utils/theme'\nimport { clearTerminal } from '@utils/terminal'\nimport { PressEnterToContinue } from './PressEnterToContinue'\nimport { ModelSelector } from './ModelSelector'\nimport { SEMANTIC_COLORS } from '@constants/colors'\ntype StepId = 'theme' | 'usage' | 'providers' | 'model'\n\ninterface OnboardingStep {\n  id: StepId\n  component: React.ReactNode\n}\n\ntype Props = {\n  onDone(): void\n}\n\nexport function Onboarding({ onDone }: Props): React.ReactNode {\n  const [currentStepIndex, setCurrentStepIndex] = useState(0)\n  const [showModelSelector, setShowModelSelector] = useState(false)\n  const config = getGlobalConfig()\n\n  const [selectedTheme, setSelectedTheme] = useState(\n    DEFAULT_GLOBAL_CONFIG.theme,\n  )\n  const theme = getTheme()\n  function goToNextStep() {\n    if (currentStepIndex < steps.length - 1) {\n      const nextIndex = currentStepIndex + 1\n      setCurrentStepIndex(nextIndex)\n    }\n  }\n\n  function handleThemeSelection(newTheme: string) {\n    saveGlobalConfig({\n      ...config,\n      theme: newTheme as ThemeNames,\n    })\n    goToNextStep()\n  }\n\n  function handleThemePreview(newTheme: string) {\n    setSelectedTheme(newTheme as ThemeNames)\n  }\n\n  function handleProviderSelectionDone() {\n    // After model selection is done, go to the next step\n    goToNextStep()\n  }\n\n  function handleModelSelectionDone() {\n    // After final model selection is done, complete onboarding\n    onDone()\n  }\n\n  // Disable exit handler when showing ModelSelector to prevent listener accumulation\n  const exitState = useExitOnCtrlCD(() => process.exit(0), {\n    isActive: !showModelSelector,\n  })\n\n  // Only listen when not showing ModelSelector\n  useInput(\n    async (_, key) => {\n      const currentStep = steps[currentStepIndex]\n      if (\n        key.return &&\n        currentStep &&\n        ['usage', 'providers', 'model'].includes(currentStep.id)\n      ) {\n        if (currentStep.id === 'model') {\n          // Navigate to ModelSelector component\n          setShowModelSelector(true)\n        } else if (currentStepIndex === steps.length - 1) {\n          onDone()\n        } else {\n          // HACK: for some reason there's now a jump here otherwise :(\n          await clearTerminal()\n          goToNextStep()\n        }\n      }\n    },\n    { isActive: !showModelSelector },\n  )\n\n  // Define all onboarding steps\n  const themeStep = (\n    <Box flexDirection=\"column\" gap={1} paddingLeft={1}>\n      <Text>Let&apos;s get started.</Text>\n      <Box flexDirection=\"column\">\n        <Text bold>Choose the option that looks best when you select it:</Text>\n        <Text color={SEMANTIC_COLORS.dim}>\n          To change this later, run /config\n        </Text>\n      </Box>\n      <Select\n        options={[\n          { label: 'Light text', value: 'dark' },\n          { label: 'Dark text', value: 'light' },\n          {\n            label: 'Light text (colorblind-friendly)',\n            value: 'dark-daltonized',\n          },\n          {\n            label: 'Dark text (colorblind-friendly)',\n            value: 'light-daltonized',\n          },\n        ]}\n        onFocus={handleThemePreview}\n        onChange={handleThemeSelection}\n      />\n      <Box flexDirection=\"column\">\n        <Box\n          paddingLeft={1}\n          marginRight={1}\n          borderStyle=\"round\"\n          borderColor={SEMANTIC_COLORS.dim}\n          flexDirection=\"column\"\n        >\n          <StructuredDiff\n            patch={{\n              oldStart: 1,\n              newStart: 1,\n              oldLines: 3,\n              newLines: 3,\n              lines: [\n                'function greet() {',\n                '-  console.log(\"Hello, World!\");',\n                '+  console.log(\"Hello, anon!\");',\n                '}',\n              ],\n            }}\n            dim={false}\n            width={40}\n            overrideTheme={selectedTheme}\n          />\n        </Box>\n      </Box>\n    </Box>\n  )\n\n  const providersStep = (\n    <Box flexDirection=\"column\" gap={1} paddingLeft={1}>\n      <Box flexDirection=\"column\" width={70}>\n        <Text color={theme.secondaryText}>\n          Next, let's select your preferred AI provider and model.\n        </Text>\n      </Box>\n      <ModelSelector\n        onDone={handleProviderSelectionDone}\n        skipModelType={true}\n        isOnboarding={true}\n      />\n    </Box>\n  )\n\n  const usageStep = (\n    <Box flexDirection=\"column\" gap={1} paddingLeft={1}>\n      <Text bold>Using {PRODUCT_NAME} effectively:</Text>\n      <Box flexDirection=\"column\" width={70}>\n        <OrderedList children={[]}>\n          <OrderedList.Item children={[]}>\n            <Text>\n              Start in your project directory\n              <Newline />\n              <Text color={theme.secondaryText}>\n                Files are automatically added to context when needed.\n              </Text>\n              <Newline />\n            </Text>\n          </OrderedList.Item>\n          <OrderedList.Item children={[]}>\n            <Text>\n              Use {PRODUCT_NAME} as a development partner\n              <Newline />\n              <Text color={theme.secondaryText}>\n                Get help with file analysis, editing, bash commands,\n                <Newline />\n                and git history.\n                <Newline />\n              </Text>\n            </Text>\n          </OrderedList.Item>\n          <OrderedList.Item children={[]}>\n            <Text>\n              Provide clear context\n              <Newline />\n              <Text color={theme.secondaryText}>\n                Be as specific as you would with another engineer. <Newline />\n                The better the context, the better the results. <Newline />\n              </Text>\n            </Text>\n          </OrderedList.Item>\n        </OrderedList>\n      </Box>\n      <PressEnterToContinue />\n    </Box>\n  )\n\n  const modelStep = (\n    <Box flexDirection=\"column\" gap={1} paddingLeft={1}>\n      <Text bold>Configure your models:</Text>\n      <Box flexDirection=\"column\" width={70}>\n        <Text>\n          You can customize which models {PRODUCT_NAME} uses for different\n          tasks.\n          <Newline />\n          <Text color={theme.secondaryText}>\n            Let's set up your preferred models for large and small tasks.\n          </Text>\n        </Text>\n        <Box marginTop={1}>\n          <Text>\n            Press <Text color={theme.suggestion}>Enter</Text> to continue to the\n            model selection screen.\n          </Text>\n        </Box>\n      </Box>\n      <PressEnterToContinue />\n    </Box>\n  )\n\n  const steps: OnboardingStep[] = []\n  steps.push({ id: 'theme', component: themeStep })\n  steps.push({ id: 'usage', component: usageStep })\n\n  steps.push({ id: 'model', component: modelStep })\n\n  // If we're showing the model selector screen, render it directly\n  if (showModelSelector) {\n    return (\n      <ModelSelector\n        onDone={handleModelSelectionDone}\n        skipModelType={true}\n        isOnboarding={true}\n      />\n    )\n  }\n\n  return (\n    <Box flexDirection=\"column\" gap={1}>\n      <>\n        <Box flexDirection=\"column\" gap={1}>\n          <Text bold>\n            {PRODUCT_NAME}{' '}\n            {exitState.pending\n              ? `(press ${exitState.keyName} again to exit)`\n              : ''}\n          </Text>\n          {steps[currentStepIndex]?.component}\n        </Box>\n      </>\n    </Box>\n  )\n}\n\nexport function WelcomeBox(): React.ReactNode {\n  const theme = getTheme()\n  return (\n    <Box\n      borderColor={theme.minto}\n      borderStyle=\"round\"\n      paddingX={1}\n      width={MIN_LOGO_WIDTH}\n    >\n      <Text>\n        <Text color={theme.minto}>\u273B</Text> Welcome to{' '}\n        <Text bold>{PRODUCT_NAME}</Text> research preview!\n      </Text>\n    </Box>\n  )\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/components/OperationSummary.js

@@ -0,0 +1,130 @@
+import React, { memo } from "react";
+import { Box, Text } from "ink";
+import { SEMANTIC_COLORS } from "../constants/colors.js";
+const Section = memo(function Section2({
+  icon,
+  title,
+  count,
+  hint,
+  children
+}) {
+  if (count === 0) return null;
+  return /* @__PURE__ */ React.createElement(Box, { flexDirection: "column" }, /* @__PURE__ */ React.createElement(Box, { flexDirection: "row" }, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, icon, " "), /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, title), /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.brand }, " ", count), hint && /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.muted }, " (", hint, ")")), children);
+});
+const FileList = memo(function FileList2({ files, maxToShow }) {
+  const displayFiles = files.slice(0, maxToShow);
+  const remaining = files.length - maxToShow;
+  return /* @__PURE__ */ React.createElement(Box, { flexDirection: "column", paddingLeft: 2 }, displayFiles.map((file, idx) => /* @__PURE__ */ React.createElement(React.Fragment, { key: `${file}-${idx}` }, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, formatFilePath(file)))), remaining > 0 && /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.muted }, "...and ", remaining, " more"));
+});
+const ModifiedFileList = memo(function ModifiedFileList2({
+  files,
+  maxToShow
+}) {
+  const displayFiles = files.slice(0, maxToShow);
+  const remaining = files.length - maxToShow;
+  return /* @__PURE__ */ React.createElement(Box, { flexDirection: "column", paddingLeft: 2 }, displayFiles.map((file, idx) => /* @__PURE__ */ React.createElement(Box, { key: `${file.path}-${idx}`, flexDirection: "row" }, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, formatFilePath(file.path), " "), (file.added > 0 || file.removed > 0) && /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.muted }, "(", file.added > 0 && /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.success }, "+", file.added), file.added > 0 && file.removed > 0 && /* @__PURE__ */ React.createElement(Text, null, "/"), file.removed > 0 && /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.error }, "-", file.removed), ")"))), remaining > 0 && /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.muted }, "...and ", remaining, " more"));
+});
+const CommandList = memo(function CommandList2({
+  commands,
+  maxToShow
+}) {
+  const displayCommands = commands.slice(0, maxToShow);
+  const remaining = commands.length - maxToShow;
+  return /* @__PURE__ */ React.createElement(Box, { flexDirection: "column", paddingLeft: 2 }, displayCommands.map((cmd, idx) => /* @__PURE__ */ React.createElement(React.Fragment, { key: `cmd-${idx}` }, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, truncateCommand(cmd, 60)))), remaining > 0 && /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.muted }, "...and ", remaining, " more"));
+});
+function formatFilePath(filePath) {
+  const parts = filePath.split("/");
+  if (parts.length <= 2) return filePath;
+  return ".../" + parts.slice(-2).join("/");
+}
+function truncateCommand(command, maxLength) {
+  const normalized = command.replace(/\s+/g, " ").trim();
+  if (normalized.length <= maxLength) return normalized;
+  return normalized.slice(0, maxLength - 1) + "...";
+}
+function hasSummaryContent(summary) {
+  return summary.filesRead.length > 0 || summary.filesModified.length > 0 || summary.filesCreated.length > 0 || summary.commandsRun.length > 0 || summary.tasksCompleted > 0 || summary.webSearches > 0;
+}
+const OperationSummary = memo(function OperationSummary2({
+  summary,
+  showUndo = false,
+  maxFilesToShow = 3,
+  maxCommandsToShow = 5
+}) {
+  if (!hasSummaryContent(summary)) {
+    return null;
+  }
+  const totalModifiedStats = summary.filesModified.reduce(
+    (acc, file) => ({
+      added: acc.added + file.added,
+      removed: acc.removed + file.removed
+    }),
+    { added: 0, removed: 0 }
+  );
+  return /* @__PURE__ */ React.createElement(Box, { flexDirection: "column", marginTop: 1 }, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.brand, bold: true }, "Session Summary"), /* @__PURE__ */ React.createElement(Box, { flexDirection: "column", marginTop: 1 }, summary.filesRead.length > 0 && /* @__PURE__ */ React.createElement(
+    Section,
+    {
+      icon: "[read]",
+      title: "Files read:",
+      count: summary.filesRead.length
+    },
+    /* @__PURE__ */ React.createElement(FileList, { files: summary.filesRead, maxToShow: maxFilesToShow })
+  ), summary.filesModified.length > 0 && /* @__PURE__ */ React.createElement(
+    Section,
+    {
+      icon: "[edit]",
+      title: "Files modified:",
+      count: summary.filesModified.length,
+      hint: showUndo ? `/undo to revert${totalModifiedStats.added > 0 || totalModifiedStats.removed > 0 ? ` | +${totalModifiedStats.added}/-${totalModifiedStats.removed}` : ""}` : totalModifiedStats.added > 0 || totalModifiedStats.removed > 0 ? `+${totalModifiedStats.added}/-${totalModifiedStats.removed}` : void 0
+    },
+    /* @__PURE__ */ React.createElement(
+      ModifiedFileList,
+      {
+        files: summary.filesModified,
+        maxToShow: maxFilesToShow
+      }
+    )
+  ), summary.filesCreated.length > 0 && /* @__PURE__ */ React.createElement(
+    Section,
+    {
+      icon: "[new]",
+      title: "Files created:",
+      count: summary.filesCreated.length
+    },
+    /* @__PURE__ */ React.createElement(FileList, { files: summary.filesCreated, maxToShow: maxFilesToShow })
+  ), summary.commandsRun.length > 0 && /* @__PURE__ */ React.createElement(
+    Section,
+    {
+      icon: "[cmd]",
+      title: "Commands run:",
+      count: summary.commandsRun.length
+    },
+    /* @__PURE__ */ React.createElement(
+      CommandList,
+      {
+        commands: summary.commandsRun,
+        maxToShow: maxCommandsToShow
+      }
+    )
+  ), summary.tasksCompleted > 0 && /* @__PURE__ */ React.createElement(
+    Section,
+    {
+      icon: "[task]",
+      title: "Tasks completed:",
+      count: summary.tasksCompleted
+    }
+  ), summary.webSearches > 0 && /* @__PURE__ */ React.createElement(
+    Section,
+    {
+      icon: "[web]",
+      title: "Web searches:",
+      count: summary.webSearches
+    }
+  )));
+});
+var OperationSummary_default = OperationSummary;
+export {
+  OperationSummary,
+  OperationSummary_default as default
+};
+//# sourceMappingURL=OperationSummary.js.map

package/dist/components/OperationSummary.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/OperationSummary.tsx"],
+  "sourcesContent": ["/**\n * Operation Summary Component\n *\n * Displays a summary of operations performed during a session.\n * Shows files read, modified, created, and commands run in a compact format.\n *\n * Usage:\n * ```tsx\n * import { OperationSummary } from '@components/OperationSummary'\n * import { getOperationSummary } from '@core/operationTracker'\n *\n * const summary = getOperationSummary()\n * <OperationSummary summary={summary} showUndo={true} />\n * ```\n */\n\nimport React, { memo } from 'react'\nimport { Box, Text } from 'ink'\nimport { SEMANTIC_COLORS } from '@constants/colors'\nimport type { OperationSummary as OperationSummaryType } from '@core/operationTracker'\n\n// ============================================================================\n// Types\n// ============================================================================\n\ninterface OperationSummaryProps {\n  /** Aggregated summary of operations */\n  summary: OperationSummaryType\n\n  /** Show /undo hint when true (for file modifications) */\n  showUndo?: boolean\n\n  /** Maximum number of files to show in each category */\n  maxFilesToShow?: number\n\n  /** Maximum number of commands to show */\n  maxCommandsToShow?: number\n}\n\n// ============================================================================\n// Helper Components\n// ============================================================================\n\ninterface SectionProps {\n  icon: string\n  title: string\n  count: number\n  hint?: string\n  children?: React.ReactNode\n}\n\n/**\n * Section header with icon, title, count, and optional hint\n */\nconst Section = memo(function Section({\n  icon,\n  title,\n  count,\n  hint,\n  children,\n}: SectionProps) {\n  if (count === 0) return null\n\n  return (\n    <Box flexDirection=\"column\">\n      <Box flexDirection=\"row\">\n        <Text color={SEMANTIC_COLORS.secondary}>{icon} </Text>\n        <Text color={SEMANTIC_COLORS.secondary}>{title}</Text>\n        <Text color={SEMANTIC_COLORS.brand}> {count}</Text>\n        {hint && <Text color={SEMANTIC_COLORS.muted}> ({hint})</Text>}\n      </Box>\n      {children}\n    </Box>\n  )\n})\n\ninterface FileListProps {\n  files: string[]\n  maxToShow: number\n}\n\n/**\n * List of file paths with truncation\n */\nconst FileList = memo(function FileList({ files, maxToShow }: FileListProps) {\n  const displayFiles = files.slice(0, maxToShow)\n  const remaining = files.length - maxToShow\n\n  return (\n    <Box flexDirection=\"column\" paddingLeft={2}>\n      {displayFiles.map((file, idx) => (\n        <React.Fragment key={`${file}-${idx}`}>\n          <Text color={SEMANTIC_COLORS.dim}>{formatFilePath(file)}</Text>\n        </React.Fragment>\n      ))}\n      {remaining > 0 && (\n        <Text color={SEMANTIC_COLORS.muted}>...and {remaining} more</Text>\n      )}\n    </Box>\n  )\n})\n\ninterface ModifiedFileListProps {\n  files: { path: string; added: number; removed: number }[]\n  maxToShow: number\n}\n\n/**\n * List of modified files with +added/-removed stats\n */\nconst ModifiedFileList = memo(function ModifiedFileList({\n  files,\n  maxToShow,\n}: ModifiedFileListProps) {\n  const displayFiles = files.slice(0, maxToShow)\n  const remaining = files.length - maxToShow\n\n  return (\n    <Box flexDirection=\"column\" paddingLeft={2}>\n      {displayFiles.map((file, idx) => (\n        <Box key={`${file.path}-${idx}`} flexDirection=\"row\">\n          <Text color={SEMANTIC_COLORS.dim}>{formatFilePath(file.path)} </Text>\n          {(file.added > 0 || file.removed > 0) && (\n            <Text color={SEMANTIC_COLORS.muted}>\n              (\n              {file.added > 0 && (\n                <Text color={SEMANTIC_COLORS.success}>+{file.added}</Text>\n              )}\n              {file.added > 0 && file.removed > 0 && <Text>/</Text>}\n              {file.removed > 0 && (\n                <Text color={SEMANTIC_COLORS.error}>-{file.removed}</Text>\n              )}\n              )\n            </Text>\n          )}\n        </Box>\n      ))}\n      {remaining > 0 && (\n        <Text color={SEMANTIC_COLORS.muted}>...and {remaining} more</Text>\n      )}\n    </Box>\n  )\n})\n\ninterface CommandListProps {\n  commands: string[]\n  maxToShow: number\n}\n\n/**\n * List of commands with truncation\n */\nconst CommandList = memo(function CommandList({\n  commands,\n  maxToShow,\n}: CommandListProps) {\n  const displayCommands = commands.slice(0, maxToShow)\n  const remaining = commands.length - maxToShow\n\n  return (\n    <Box flexDirection=\"column\" paddingLeft={2}>\n      {displayCommands.map((cmd, idx) => (\n        <React.Fragment key={`cmd-${idx}`}>\n          <Text color={SEMANTIC_COLORS.dim}>{truncateCommand(cmd, 60)}</Text>\n        </React.Fragment>\n      ))}\n      {remaining > 0 && (\n        <Text color={SEMANTIC_COLORS.muted}>...and {remaining} more</Text>\n      )}\n    </Box>\n  )\n})\n\n// ============================================================================\n// Utility Functions\n// ============================================================================\n\n/**\n * Format a file path for display\n * Shows only the last 2 path components for brevity\n */\nfunction formatFilePath(filePath: string): string {\n  const parts = filePath.split('/')\n  if (parts.length <= 2) return filePath\n  return '.../' + parts.slice(-2).join('/')\n}\n\n/**\n * Truncate a command string for display\n */\nfunction truncateCommand(command: string, maxLength: number): string {\n  // Remove newlines and normalize whitespace\n  const normalized = command.replace(/\\s+/g, ' ').trim()\n  if (normalized.length <= maxLength) return normalized\n  return normalized.slice(0, maxLength - 1) + '...'\n}\n\n/**\n * Check if summary has any operations\n */\nfunction hasSummaryContent(summary: OperationSummaryType): boolean {\n  return (\n    summary.filesRead.length > 0 ||\n    summary.filesModified.length > 0 ||\n    summary.filesCreated.length > 0 ||\n    summary.commandsRun.length > 0 ||\n    summary.tasksCompleted > 0 ||\n    summary.webSearches > 0\n  )\n}\n\n// ============================================================================\n// Main Component\n// ============================================================================\n\n/**\n * Operation Summary Component\n *\n * Displays a compact summary of all operations performed during a session.\n */\nexport const OperationSummary = memo(function OperationSummary({\n  summary,\n  showUndo = false,\n  maxFilesToShow = 3,\n  maxCommandsToShow = 5,\n}: OperationSummaryProps) {\n  // Don't render if no operations\n  if (!hasSummaryContent(summary)) {\n    return null\n  }\n\n  const totalModifiedStats = summary.filesModified.reduce(\n    (acc, file) => ({\n      added: acc.added + file.added,\n      removed: acc.removed + file.removed,\n    }),\n    { added: 0, removed: 0 },\n  )\n\n  return (\n    <Box flexDirection=\"column\" marginTop={1}>\n      {/* Header */}\n      <Text color={SEMANTIC_COLORS.brand} bold>\n        Session Summary\n      </Text>\n\n      <Box flexDirection=\"column\" marginTop={1}>\n        {/* Files Read */}\n        {summary.filesRead.length > 0 && (\n          <Section\n            icon=\"[read]\"\n            title=\"Files read:\"\n            count={summary.filesRead.length}\n          >\n            <FileList files={summary.filesRead} maxToShow={maxFilesToShow} />\n          </Section>\n        )}\n\n        {/* Files Modified */}\n        {summary.filesModified.length > 0 && (\n          <Section\n            icon=\"[edit]\"\n            title=\"Files modified:\"\n            count={summary.filesModified.length}\n            hint={\n              showUndo\n                ? `/undo to revert${totalModifiedStats.added > 0 || totalModifiedStats.removed > 0 ? ` | +${totalModifiedStats.added}/-${totalModifiedStats.removed}` : ''}`\n                : totalModifiedStats.added > 0 || totalModifiedStats.removed > 0\n                  ? `+${totalModifiedStats.added}/-${totalModifiedStats.removed}`\n                  : undefined\n            }\n          >\n            <ModifiedFileList\n              files={summary.filesModified}\n              maxToShow={maxFilesToShow}\n            />\n          </Section>\n        )}\n\n        {/* Files Created */}\n        {summary.filesCreated.length > 0 && (\n          <Section\n            icon=\"[new]\"\n            title=\"Files created:\"\n            count={summary.filesCreated.length}\n          >\n            <FileList files={summary.filesCreated} maxToShow={maxFilesToShow} />\n          </Section>\n        )}\n\n        {/* Commands Run */}\n        {summary.commandsRun.length > 0 && (\n          <Section\n            icon=\"[cmd]\"\n            title=\"Commands run:\"\n            count={summary.commandsRun.length}\n          >\n            <CommandList\n              commands={summary.commandsRun}\n              maxToShow={maxCommandsToShow}\n            />\n          </Section>\n        )}\n\n        {/* Tasks Completed */}\n        {summary.tasksCompleted > 0 && (\n          <Section\n            icon=\"[task]\"\n            title=\"Tasks completed:\"\n            count={summary.tasksCompleted}\n          />\n        )}\n\n        {/* Web Searches */}\n        {summary.webSearches > 0 && (\n          <Section\n            icon=\"[web]\"\n            title=\"Web searches:\"\n            count={summary.webSearches}\n          />\n        )}\n      </Box>\n    </Box>\n  )\n})\n\nexport default OperationSummary\n"],
+  "mappings": "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",
+  "names": ["Section", "FileList", "ModifiedFileList", "CommandList", "OperationSummary"]
+}

package/dist/components/PromptInput.js

@@ -17,6 +17,7 @@ import { SentryErrorBoundary } from "./SentryErrorBoundary.js";
 import { TokenWarning, WARNING_THRESHOLD } from "./TokenWarning.js";
 import { useTerminalSize } from "../hooks/useTerminalSize.js";
 import { getTheme } from "../utils/theme.js";
+import { BRAND_GRADIENT, SEMANTIC_COLORS } from "../constants/colors.js";
 import { getModelManager } from "../utils/model.js";
 import {
   getGlobalConfig,
@@ -117,6 +118,7 @@ function PromptInput({
   const [ctrlDTimer, setCtrlDTimer] = useState(null);
   const [escCount, setEscCount] = useState(0);
   const [escTimer, setEscTimer] = useState(null);
+  const ESC_DOUBLE_TAP_WINDOW = 500;
   const [hotkeyMessage, setHotkeyMessage] = useState({ show: false });
   useEffect(() => {
     if (verboseToggleMessage) {
@@ -176,10 +178,10 @@ function PromptInput({
     if (suggestions.length === 0) return null;
     const hasMoreAbove = visibleSuggestions.length > 0 && visibleSuggestions[0].globalIndex > 0;
     const hasMoreBelow = visibleSuggestions.length > 0 && visibleSuggestions[visibleSuggestions.length - 1].globalIndex < suggestions.length - 1;
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, hasMoreAbove && /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Text, { dimColor: true }, " ", "\u2191 ", visibleSuggestions[0].globalIndex, " more above...")), visibleSuggestions.map((suggestion) => {
+    return /* @__PURE__ */ React.createElement(React.Fragment, null, hasMoreAbove && /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, " ", "\u2191 ", visibleSuggestions[0].globalIndex, " more above...")), visibleSuggestions.map((suggestion) => {
       const isSelected = suggestion.globalIndex === selectedIndex;
       const isAgent = suggestion.type === "agent";
-      const displayColor = isSelected ? theme.suggestion : isAgent && suggestion.metadata?.color ? suggestion.metadata.color : void 0;
+      const displayColor = isSelected ? BRAND_GRADIENT.START : isAgent && suggestion.metadata?.color ? suggestion.metadata.color : void 0;
       return /* @__PURE__ */ React.createElement(
         Box,
         {
@@ -189,14 +191,13 @@ function PromptInput({
         /* @__PURE__ */ React.createElement(
           Text,
           {
-            color: displayColor,
-            dimColor: !isSelected && !displayColor
+            color: displayColor || (!isSelected ? SEMANTIC_COLORS.dim : void 0)
           },
           isSelected ? "\u25C6 " : "  ",
           suggestion.displayValue
         )
       );
-    }), hasMoreBelow && /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Text, { dimColor: true }, " ", "\u2193", " ", suggestions.length - visibleSuggestions[visibleSuggestions.length - 1].globalIndex - 1, " ", "more below...")));
+    }), hasMoreBelow && /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, " ", "\u2193", " ", suggestions.length - visibleSuggestions[visibleSuggestions.length - 1].globalIndex - 1, " ", "more below...")));
   }, [suggestions, selectedIndex, visibleSuggestions, theme.suggestion]);
   const onChange = useCallback(
     (value) => {
@@ -649,37 +650,6 @@ function PromptInput({
       if (inputChar === "" && (key.escape || key.backspace || key.delete)) {
         onModeChange("prompt");
       }
-      if (key.escape && !input && !isLoading && messages.length > 0 && onRollbackConversation) {
-        setEscCount((prev) => prev + 1);
-        if (escTimer) clearTimeout(escTimer);
-        const timer = setTimeout(() => setEscCount(0), 1e3);
-        setEscTimer(timer);
-        if (escCount >= 1) {
-          const success = onRollbackConversation();
-          if (success) {
-            setMessage({
-              show: true,
-              text: "Conversation rolled back (Esc Esc)"
-            });
-            setTimeout(() => setMessage({ show: false }), 2e3);
-          } else {
-            setMessage({ show: true, text: "No history to rollback" });
-            setTimeout(() => setMessage({ show: false }), 2e3);
-          }
-          setEscCount(0);
-          return true;
-        } else {
-          setMessage({
-            show: true,
-            text: "Press Esc again to rollback conversation"
-          });
-          setTimeout(() => setMessage({ show: false }), 2e3);
-          return true;
-        }
-      }
-      if (key.escape && messages.length > 0 && !input && !isLoading) {
-        onShowMessageSelector();
-      }
       if (key.tab && !key.shift && !completionActive) {
         const config = getGlobalConfig();
         const newThinking = !config.thinking;
@@ -709,18 +679,40 @@ function PromptInput({
         return true;
       }
       if (key.escape) {
-        if (input.length > 0) {
-          onInputChange("");
-          setHotkeyMessage({ show: true, text: "Input cleared (Esc)" });
-          setTimeout(() => setHotkeyMessage({ show: false }), 1e3);
-          return true;
-        } else if (isLoading && onInterrupt) {
-          onInterrupt();
-          setHotkeyMessage({
-            show: true,
-            text: "Interrupted by user (Esc)"
-          });
-          setTimeout(() => setHotkeyMessage({ show: false }), 2e3);
+        const newEscCount = escCount + 1;
+        setEscCount(newEscCount);
+        if (escTimer) clearTimeout(escTimer);
+        const timer = setTimeout(() => setEscCount(0), ESC_DOUBLE_TAP_WINDOW);
+        setEscTimer(timer);
+        if (newEscCount >= 2) {
+          setEscCount(0);
+          if (input.length > 0) {
+            onInputChange("");
+            setHotkeyMessage({ show: true, text: "Input cleared (Esc Esc)" });
+            setTimeout(() => setHotkeyMessage({ show: false }), 1e3);
+            return true;
+          } else if (isLoading && onInterrupt) {
+            onInterrupt();
+            setHotkeyMessage({
+              show: true,
+              text: "Interrupted by user (Esc Esc)"
+            });
+            setTimeout(() => setHotkeyMessage({ show: false }), 2e3);
+            return true;
+          }
+        } else {
+          if (input.length > 0) {
+            setHotkeyMessage({
+              show: true,
+              text: "Press Esc again to clear input"
+            });
+          } else if (isLoading) {
+            setHotkeyMessage({
+              show: true,
+              text: "Press Esc again to interrupt"
+            });
+          }
+          setTimeout(() => setHotkeyMessage({ show: false }), 1500);
           return true;
         }
       }
@@ -731,7 +723,9 @@ function PromptInput({
       isLoading,
       input.length,
       onInputChange,
-      onInterrupt
+      onInterrupt,
+      escCount,
+      escTimer
     ]
   );
   const tokenUsage = useMemo(() => countTokens(messages), [messages]);
@@ -754,7 +748,7 @@ function PromptInput({
       currentTokens: tokenUsage
     };
   }, [tokenUsage, modelSwitchMessage.show, submitCount, currentModelId]);
-  return /* @__PURE__ */ React.createElement(Box, { flexDirection: "column" }, fallbackMode && /* @__PURE__ */ React.createElement(Box, { marginBottom: 1 }, /* @__PURE__ */ React.createElement(Text, { color: "yellow" }, "\u26A0\uFE0F Limited input mode"), /* @__PURE__ */ React.createElement(Text, { dimColor: true }, " ", "(Advanced keyboard shortcuts unavailable - raw mode not supported)")), showHotkeyHelp && /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React.createElement(Box, { flexDirection: "column" }, fallbackMode && /* @__PURE__ */ React.createElement(Box, { marginBottom: 1 }, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.running }, "\u26A0\uFE0F Limited input mode"), /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, " ", "(Advanced keyboard shortcuts unavailable - raw mode not supported)")), showHotkeyHelp && /* @__PURE__ */ React.createElement(
     HotkeyHelpPanel,
     {
       isVisible: showHotkeyHelp,
@@ -767,7 +761,7 @@ function PromptInput({
       results: historySearch.filteredResults,
       selectedIndex: historySearch.selectedIndex
     }
-  ), modelInfo && /* @__PURE__ */ React.createElement(Box, { justifyContent: "flex-end", marginBottom: 1 }, /* @__PURE__ */ React.createElement(Text, { dimColor: true }, "[", modelInfo.provider, "] ", modelInfo.name, ":", " ", Math.round(modelInfo.currentTokens / 1e3), "k /", " ", Math.round(modelInfo.contextLength / 1e3), "k")), queuedPrompts.length > 0 && /* @__PURE__ */ React.createElement(Box, { flexDirection: "column", marginTop: 1 }, /* @__PURE__ */ React.createElement(Box, { paddingLeft: 2 }, /* @__PURE__ */ React.createElement(Text, { dimColor: true }, "\u2500\u2500 Queued (", queuedPrompts.length, ") \xB7 will run after current task \xB7 \u2191 to edit last \u2500\u2500")), queuedPrompts.map((prompt, index) => /* @__PURE__ */ React.createElement(Box, { key: index, paddingLeft: 2 }, /* @__PURE__ */ React.createElement(Text, { dimColor: true }, "\u276F "), /* @__PURE__ */ React.createElement(Text, { dimColor: true }, prompt.length > 60 ? prompt.slice(0, 60) + "..." : prompt)))), /* @__PURE__ */ React.createElement(
+  ), modelInfo && /* @__PURE__ */ React.createElement(Box, { justifyContent: "flex-end", marginBottom: 1 }, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, /* @__PURE__ */ React.createElement(Text, { color: BRAND_GRADIENT.START }, "\u25C6"), " ", /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, modelInfo.name), /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, " ", "\xB7 ", Math.round(modelInfo.currentTokens / 1e3), "k /", " ", Math.round(modelInfo.contextLength / 1e3), "k"))), queuedPrompts.length > 0 && /* @__PURE__ */ React.createElement(Box, { flexDirection: "column", marginTop: 1 }, /* @__PURE__ */ React.createElement(Box, { paddingLeft: 2 }, /* @__PURE__ */ React.createElement(Text, { color: BRAND_GRADIENT.MIDDLE }, "\u2500\u2500 Queued (", queuedPrompts.length, ")"), /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, " ", "\xB7 will run after current task \xB7", " ", /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, "\u2191"), " to edit \u2500\u2500")), queuedPrompts.map((prompt, index) => /* @__PURE__ */ React.createElement(Box, { key: index, paddingLeft: 2 }, /* @__PURE__ */ React.createElement(Text, { color: BRAND_GRADIENT.START }, "\u25C7 "), /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, prompt.length > 60 ? prompt.slice(0, 60) + "..." : prompt)))), /* @__PURE__ */ React.createElement(
     Box,
     {
       alignItems: "flex-start",
@@ -776,7 +770,7 @@ function PromptInput({
       borderBottom: true,
       borderLeft: false,
       borderRight: false,
-      borderColor: mode === "bash" ? theme.bashBorder : mode === "koding" ? theme.noting : theme.secondaryBorder,
+      borderColor: mode === "bash" ? SEMANTIC_COLORS.running : mode === "koding" ? SEMANTIC_COLORS.info : BRAND_GRADIENT.START,
       borderDimColor: false,
       borderStyle: "single",
       marginTop: queuedPrompts.length > 0 ? 0 : 1,
@@ -791,7 +785,14 @@ function PromptInput({
         justifyContent: "flex-start",
         width: 3
       },
-      mode === "bash" ? /* @__PURE__ */ React.createElement(Text, { color: theme.bashBorder }, "\xA0!\xA0") : mode === "koding" ? /* @__PURE__ */ React.createElement(Text, { color: theme.noting }, "\xA0#\xA0") : /* @__PURE__ */ React.createElement(Text, { color: isLoading ? theme.secondaryText : void 0, bold: true }, "\xA0\u276F\xA0")
+      mode === "bash" ? /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.running }, "\xA0!\xA0") : mode === "koding" ? /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.info }, "\xA0#\xA0") : /* @__PURE__ */ React.createElement(
+        Text,
+        {
+          color: isLoading ? SEMANTIC_COLORS.dim : BRAND_GRADIENT.START,
+          bold: true
+        },
+        "\xA0\u276F\xA0"
+      )
     ),
     /* @__PURE__ */ React.createElement(Box, { paddingRight: 1 }, /* @__PURE__ */ React.createElement(
       TextInput,
@@ -826,56 +827,69 @@ function PromptInput({
       paddingX: 2,
       paddingY: 0
     },
-    /* @__PURE__ */ React.createElement(Box, { justifyContent: "flex-start", gap: 1 }, exitMessage.show ? /* @__PURE__ */ React.createElement(Text, { dimColor: true }, "Press ", exitMessage.key, " again to exit") : message.show ? /* @__PURE__ */ React.createElement(Text, { dimColor: true }, message.text) : hotkeyMessage.show ? /* @__PURE__ */ React.createElement(Text, { color: theme.success }, hotkeyMessage.text) : modelSwitchMessage.show ? /* @__PURE__ */ React.createElement(Text, { color: theme.success }, modelSwitchMessage.text) : verbose ? (
-      // Verbose mode: full static hints
+    /* @__PURE__ */ React.createElement(Box, { justifyContent: "flex-start", gap: 1 }, exitMessage.show ? /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, "Press", " ", /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, exitMessage.key), " ", "again to exit") : message.show ? /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, message.text) : hotkeyMessage.show ? /* @__PURE__ */ React.createElement(Text, { color: BRAND_GRADIENT.START }, hotkeyMessage.text) : modelSwitchMessage.show ? /* @__PURE__ */ React.createElement(Text, { color: BRAND_GRADIENT.START }, modelSwitchMessage.text) : verbose ? (
+      // Verbose mode: full static hints (商务用户友好) - 使用品牌配色
       /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
         Text,
         {
-          color: mode === "bash" ? theme.bashBorder : void 0,
-          dimColor: mode !== "bash"
+          color: mode === "bash" ? BRAND_GRADIENT.MIDDLE : SEMANTIC_COLORS.dim
         },
-        "! for bash mode"
+        /* @__PURE__ */ React.createElement(
+          Text,
+          {
+            color: mode === "bash" ? BRAND_GRADIENT.MIDDLE : SEMANTIC_COLORS.secondary
+          },
+          "!"
+        ),
+        " ",
+        "\u6267\u884C\u547D\u4EE4"
       ), /* @__PURE__ */ React.createElement(
         Text,
         {
-          color: mode === "koding" ? theme.noting : void 0,
-          dimColor: mode !== "koding"
+          color: mode === "koding" ? SEMANTIC_COLORS.info : SEMANTIC_COLORS.dim
         },
-        "\xB7 # for ",
-        PROJECT_FILE
-      ), /* @__PURE__ */ React.createElement(Text, { dimColor: true }, "\xB7 / for commands \xB7 ctrl+? help"), backgroundShellCount > 0 && /* @__PURE__ */ React.createElement(
+        "\xB7",
+        " ",
+        /* @__PURE__ */ React.createElement(
+          Text,
+          {
+            color: mode === "koding" ? SEMANTIC_COLORS.info : SEMANTIC_COLORS.secondary
+          },
+          "#"
+        ),
+        " ",
+        "\u8BB0\u5F55\u7B14\u8BB0"
+      ), /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, "\xB7 ", /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, "/"), " \u529F\u80FD\u83DC\u5355 \xB7", " ", /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, "ctrl+?"), " \u5E2E\u52A9"), backgroundShellCount > 0 && /* @__PURE__ */ React.createElement(
         Text,
         {
-          color: backgroundIndicatorFocused ? theme.primary : theme.success,
-          backgroundColor: backgroundIndicatorFocused ? theme.success : void 0,
-          dimColor: !backgroundIndicatorFocused
+          color: backgroundIndicatorFocused ? BRAND_GRADIENT.START : BRAND_GRADIENT.MIDDLE,
+          backgroundColor: backgroundIndicatorFocused ? BRAND_GRADIENT.START : void 0
         },
         "\xB7 ",
         backgroundIndicatorFocused ? "\u25BA " : "",
         backgroundShellCount,
         " background task",
         backgroundShellCount > 1 ? "s" : ""
-      ), queuedPrompts.length > 0 && /* @__PURE__ */ React.createElement(Text, { color: "yellow" }, "\xB7 \u{1F4CB} ", queuedPrompts.length, " queued"))
+      ), queuedPrompts.length > 0 && /* @__PURE__ */ React.createElement(Text, { color: BRAND_GRADIENT.MIDDLE }, "\xB7 \u{1F4CB} ", queuedPrompts.length, " queued"))
     ) : (
       // Normal mode: context-aware hints with 0.1.7 style
       /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(ContextAwareHints, { context: inputContext, compact: true }), backgroundShellCount > 0 && /* @__PURE__ */ React.createElement(
         Text,
         {
-          color: backgroundIndicatorFocused ? theme.primary : theme.success,
-          backgroundColor: backgroundIndicatorFocused ? theme.success : void 0,
-          dimColor: !backgroundIndicatorFocused
+          color: backgroundIndicatorFocused ? BRAND_GRADIENT.START : BRAND_GRADIENT.MIDDLE,
+          backgroundColor: backgroundIndicatorFocused ? BRAND_GRADIENT.START : void 0
         },
         "\u2502 ",
         backgroundIndicatorFocused ? "\u25BA " : "",
         backgroundShellCount,
         " task",
         backgroundShellCount > 1 ? "s" : ""
-      ), queuedPrompts.length > 0 && /* @__PURE__ */ React.createElement(Text, { color: "yellow" }, "\u2502 \u{1F4CB} ", queuedPrompts.length, " queued"), isLoading && onQueuePrompt && queuedPrompts.length === 0 && /* @__PURE__ */ React.createElement(Text, { dimColor: true }, "\u2502 Type to queue next prompt"))
+      ), queuedPrompts.length > 0 && /* @__PURE__ */ React.createElement(Text, { color: BRAND_GRADIENT.MIDDLE }, "\u2502 \u{1F4CB} ", queuedPrompts.length, " queued"), isLoading && onQueuePrompt && queuedPrompts.length === 0 && /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, "\u2502 Type to queue next prompt"))
     )),
     /* @__PURE__ */ React.createElement(
       SentryErrorBoundary,
       {
-        children: /* @__PURE__ */ React.createElement(Box, { justifyContent: "flex-end", gap: 1 }, !debug && tokenUsage < WARNING_THRESHOLD && /* @__PURE__ */ React.createElement(Text, { dimColor: true }, terminalSetup.isEnabled && isShiftEnterKeyBindingInstalled() ? "shift + \u23CE for newline" : "\\\u23CE for newline"), /* @__PURE__ */ React.createElement(TokenWarning, { tokenUsage }))
+        children: /* @__PURE__ */ React.createElement(Box, { justifyContent: "flex-end", gap: 1 }, !debug && tokenUsage < WARNING_THRESHOLD && /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, terminalSetup.isEnabled && isShiftEnterKeyBindingInstalled() ? "shift + \u23CE" : "\\\u23CE"), " ", "for newline"), /* @__PURE__ */ React.createElement(TokenWarning, { tokenUsage }))
       }
     )
   ), suggestions.length > 0 && /* @__PURE__ */ React.createElement(
@@ -892,13 +906,12 @@ function PromptInput({
         marginTop: 1,
         paddingX: 3,
         borderStyle: "round",
-        borderColor: "gray"
+        borderColor: BRAND_GRADIENT.START
       },
       /* @__PURE__ */ React.createElement(
         Text,
         {
-          dimColor: !emptyDirMessage,
-          color: emptyDirMessage ? "yellow" : void 0
+          color: emptyDirMessage ? BRAND_GRADIENT.END : SEMANTIC_COLORS.dim
         },
         emptyDirMessage || (() => {
           const selected = suggestions[selectedIndex];