@zhongqian97-code/ecode 0.2.2 → 0.2.4

package/dist/index.js

@@ -95,8 +95,8 @@ function loadConfig() {
 }
 
 // src/ui/App.tsx
-import { useState as useState3, useCallback, useRef as useRef2, useEffect as useEffect3 } from "react";
-import { Box as Box5, useInput as useInput2 } from "ink";
+import { useState as useState3, useCallback, useRef as useRef2, useEffect as useEffect3, useMemo } from "react";
+import { Box as Box5, useInput as useInput2, useStdout } from "ink";
 
 // src/llm.ts
 import OpenAI from "openai";
@@ -472,162 +472,123 @@ function StatusBar({
 
 // src/ui/ConversationHistory.tsx
 import { Box as Box2, Text as Text2 } from "ink";
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+
+// src/ui/messageLines.ts
 var TOOL_RESULT_MAX_LINES = 3;
-function truncateLines(text, maxLines) {
-  const lines = text.split("\n");
-  if (lines.length <= maxLines) return text;
-  return lines.slice(0, maxLines).join("\n") + "\n\u2026";
-}
-function UserMessage({
-  content
-}) {
-  return (
-    // marginBottom={0} 避免 Ink 默认添加的底部间距，使历史区域更紧凑
-    /* @__PURE__ */ jsx2(Box2, { flexDirection: "row", marginBottom: 0, children: /* @__PURE__ */ jsxs2(Text2, { color: "white", children: [
-      "> ",
-      content
-    ] }) })
-  );
-}
-function AssistantMessage({
-  content,
-  tool_calls,
-  reasoning_content,
-  expandTools
-}) {
-  return /* @__PURE__ */ jsxs2(Box2, { flexDirection: "column", marginBottom: 0, children: [
-    reasoning_content && reasoning_content.length > 0 && (expandTools ? (
-      // 展开：显示 <thinking> 标题和完整推理内容
-      /* @__PURE__ */ jsxs2(Box2, { flexDirection: "column", children: [
-        /* @__PURE__ */ jsx2(Text2, { color: "gray", children: "<thinking>" }),
-        /* @__PURE__ */ jsx2(Text2, { dimColor: true, children: reasoning_content })
-      ] })
-    ) : (
-      // 折叠：一行简短占位符，告知用户有隐藏的思考内容
-      /* @__PURE__ */ jsx2(Text2, { color: "gray", children: "[+ thinking]" })
-    )),
-    content && content.trim().length > 0 && /* @__PURE__ */ jsx2(Text2, { color: "cyan", children: content }),
-    tool_calls && tool_calls.length > 0 && (expandTools ? (
-      // 展开：逐条渲染每个工具调用
-      tool_calls.map((tc, idx) => {
-        let argsDisplay = tc.function.arguments;
-        try {
-          const parsed = JSON.parse(tc.function.arguments);
-          if (typeof parsed === "object" && parsed !== null) {
-            argsDisplay = Object.values(parsed).map(String).join(", ");
-          }
-        } catch {
-        }
-        return (
-          // 黄色 ⚙ 图标 + 工具名 + 格式化参数
-          /* @__PURE__ */ jsxs2(Text2, { color: "yellow", children: [
-            "\u2699 \u8C03\u7528\u5DE5\u5177: ",
-            tc.function.name,
-            "(",
-            argsDisplay,
-            ")"
-          ] }, idx)
-        );
-      })
-    ) : (
-      // 折叠：用计数占位符替代，避免占用多行
-      /* @__PURE__ */ jsxs2(Text2, { color: "gray", children: [
-        "[+ ",
-        tool_calls.length,
-        " \u4E2A\u5DE5\u5177\u8C03\u7528]"
-      ] })
-    ))
-  ] });
-}
-function ToolMessage({
-  content,
-  expandTools
-}) {
-  if (!expandTools) {
-    return /* @__PURE__ */ jsx2(Box2, { flexDirection: "row", marginBottom: 0, children: /* @__PURE__ */ jsx2(Text2, { color: "gray", children: "[+ \u5DE5\u5177\u7ED3\u679C]" }) });
+function wrapText(text, terminalWidth) {
+  const logicalLines = text.split("\n");
+  if (terminalWidth <= 0) return logicalLines;
+  const result = [];
+  for (const line of logicalLines) {
+    if (line.length === 0) {
+      result.push("");
+      continue;
+    }
+    for (let i = 0; i < line.length; i += terminalWidth) {
+      result.push(line.slice(i, i + terminalWidth));
+    }
   }
-  const truncated = truncateLines(content, TOOL_RESULT_MAX_LINES);
-  return /* @__PURE__ */ jsx2(Box2, { flexDirection: "row", marginBottom: 0, children: /* @__PURE__ */ jsxs2(Text2, { color: "gray", children: [
-    "[\u5DE5\u5177\u7ED3\u679C] ",
-    truncated
-  ] }) });
+  return result;
 }
-function estimateLines(msg, expandTools) {
+function messageToLines(msg, expandTools, terminalWidth) {
   if (msg.role === "user") {
-    return Math.max(1, msg.content.split("\n").length);
+    return wrapText(`> ${msg.content}`, terminalWidth).map((text) => ({
+      text,
+      color: "white"
+    }));
   }
   if (msg.role === "assistant") {
-    const contentLines = msg.content ? msg.content.split("\n").length : 0;
-    const assistantMsg = msg;
-    let reasoningLines = 0;
-    if (assistantMsg.reasoning_content && assistantMsg.reasoning_content.length > 0) {
+    const lines = [];
+    const aMsg = msg;
+    if (aMsg.reasoning_content && aMsg.reasoning_content.length > 0) {
       if (expandTools) {
-        reasoningLines = 1 + assistantMsg.reasoning_content.split("\n").length;
+        lines.push({ text: "<thinking>", color: "gray" });
+        for (const t of wrapText(aMsg.reasoning_content, terminalWidth)) {
+          lines.push({ text: t, dimColor: true });
+        }
       } else {
-        reasoningLines = 1;
+        lines.push({ text: "[+ thinking]", color: "gray" });
       }
     }
-    let toolLines = 0;
-    if (assistantMsg.tool_calls && assistantMsg.tool_calls.length > 0) {
+    if (aMsg.content && aMsg.content.trim().length > 0) {
+      for (const t of wrapText(aMsg.content, terminalWidth)) {
+        lines.push({ text: t, color: "cyan" });
+      }
+    }
+    if (aMsg.tool_calls && aMsg.tool_calls.length > 0) {
       if (expandTools) {
-        toolLines = assistantMsg.tool_calls.length;
+        for (const tc of aMsg.tool_calls) {
+          let argsDisplay = tc.function.arguments;
+          try {
+            const parsed = JSON.parse(tc.function.arguments);
+            if (typeof parsed === "object" && parsed !== null) {
+              argsDisplay = Object.values(parsed).map(String).join(", ");
+            }
+          } catch {
+          }
+          const lineText = `\u2699 \u8C03\u7528\u5DE5\u5177: ${tc.function.name}(${argsDisplay})`;
+          for (const t of wrapText(lineText, terminalWidth)) {
+            lines.push({ text: t, color: "yellow" });
+          }
+        }
       } else {
-        toolLines = 1;
+        lines.push({
+          text: `[+ ${aMsg.tool_calls.length} \u4E2A\u5DE5\u5177\u8C03\u7528]`,
+          color: "gray"
+        });
       }
     }
-    return Math.max(1, contentLines + reasoningLines + toolLines);
+    return lines.length > 0 ? lines : [{ text: "" }];
   }
   if (msg.role === "tool") {
     if (!expandTools) {
-      return 1;
+      return [{ text: "[+ \u5DE5\u5177\u7ED3\u679C]", color: "gray" }];
     }
-    return Math.min(TOOL_RESULT_MAX_LINES, msg.content.split("\n").length) + 1;
+    const rawLines = msg.content.split("\n");
+    const truncated = rawLines.length > TOOL_RESULT_MAX_LINES ? rawLines.slice(0, TOOL_RESULT_MAX_LINES - 1).join("\n") + "\n\u2026" : msg.content;
+    return [
+      { text: "[\u5DE5\u5177\u7ED3\u679C]", color: "gray" },
+      ...wrapText(truncated, terminalWidth).map((text) => ({
+        text,
+        color: "gray"
+      }))
+    ];
   }
-  return 1;
+  return [];
 }
+
+// src/ui/ConversationHistory.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 function ConversationHistory({
   messages,
   maxHeight = 20,
-  expandTools = false
+  expandTools = false,
+  terminalWidth = 0,
+  scrollOffset = 0
 }) {
   const visible = messages.filter(
     (m) => m.role !== "system"
   );
-  let totalLines = 0;
-  let startIdx = visible.length;
-  for (let i = visible.length - 1; i >= 0; i--) {
-    const lines = estimateLines(visible[i], expandTools);
-    if (totalLines + lines > maxHeight) break;
-    totalLines += lines;
-    startIdx = i;
-  }
-  const displayMessages = visible.slice(startIdx);
-  return (
-    // 纵向堆叠所有消息
-    /* @__PURE__ */ jsx2(Box2, { flexDirection: "column", children: displayMessages.map((msg, idx) => {
-      if (msg.role === "user") {
-        return /* @__PURE__ */ jsx2(UserMessage, { content: msg.content }, idx);
-      }
-      if (msg.role === "assistant") {
-        const assistantMsg = msg;
-        return /* @__PURE__ */ jsx2(
-          AssistantMessage,
-          {
-            content: assistantMsg.content,
-            tool_calls: assistantMsg.tool_calls,
-            reasoning_content: assistantMsg.reasoning_content,
-            expandTools
-          },
-          idx
-        );
-      }
-      if (msg.role === "tool") {
-        return /* @__PURE__ */ jsx2(ToolMessage, { content: msg.content, expandTools }, idx);
-      }
-      return null;
-    }) })
+  const allLines = visible.flatMap(
+    (msg) => messageToLines(msg, expandTools, terminalWidth)
   );
+  const totalLines = allLines.length;
+  const end = Math.max(0, Math.min(totalLines, totalLines - scrollOffset));
+  let start = Math.max(0, end - maxHeight);
+  let linesAbove = start;
+  if (linesAbove > 0 && maxHeight > 1) {
+    start = Math.max(0, end - (maxHeight - 1));
+    linesAbove = start;
+  }
+  const visibleLines = allLines.slice(start, end);
+  return /* @__PURE__ */ jsxs2(Box2, { flexDirection: "column", children: [
+    linesAbove > 0 && /* @__PURE__ */ jsxs2(Text2, { color: "gray", dimColor: true, children: [
+      "\u2191 ",
+      linesAbove,
+      " \u884C \xB7 PageUp/Down \u6EDA\u52A8"
+    ] }),
+    visibleLines.map((line, idx) => /* @__PURE__ */ jsx2(Text2, { color: line.color, dimColor: line.dimColor, children: line.text }, idx))
+  ] });
 }
 
 // src/ui/Input.tsx
@@ -788,7 +749,9 @@ function dismiss(state) {
 
 // src/ui/App.tsx
 import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
-function App({ config: config2, version: version2, autoMode: autoMode2 = false, registry: registry2 }) {
+function App({ config: config2, version: version2, autoMode: autoMode2 = false, registry: registry2, llmClient }) {
+  const { stdout } = useStdout();
+  const historyMaxHeight = Math.max(5, (stdout?.rows ?? 24) - 4);
   const [messages, setMessages] = useState3([]);
   const [status, setStatus] = useState3("idle");
   const contextLimit = getContextLimit(config2.model, config2.contextLimit);
@@ -800,8 +763,16 @@ function App({ config: config2, version: version2, autoMode: autoMode2 = false,
   const [toolName, setToolName] = useState3(void 0);
   const [confirmPrompt, setConfirmPrompt] = useState3(void 0);
   const [expandTools, setExpandTools] = useState3(false);
+  const [scrollOffset, setScrollOffset] = useState3(0);
+  const totalLines = useMemo(() => {
+    const visible = messages.filter((m) => m.role !== "system");
+    return visible.reduce(
+      (acc, msg) => acc + messageToLines(msg, expandTools, stdout?.columns ?? 0).length,
+      0
+    );
+  }, [messages, expandTools, stdout?.columns]);
   const pendingConfirmRef = useRef2(null);
-  const llmRef = useRef2(createLLMClient(config2));
+  const llmRef = useRef2(llmClient ?? createLLMClient(config2));
   const inputRef = useRef2(null);
   const [acState, setAcState] = useState3(getInitialState());
   const loggerRef = useRef2(null);
@@ -855,6 +826,16 @@ function App({ config: config2, version: version2, autoMode: autoMode2 = false,
     }
     if (key.tab) {
       setExpandTools((prev) => !prev);
+      return;
+    }
+    const scrollStep = Math.max(1, Math.floor(historyMaxHeight / 2));
+    if (key.pageUp) {
+      setScrollOffset((prev) => Math.min(prev + scrollStep, Math.max(0, totalLines - 1)));
+      return;
+    }
+    if (key.pageDown) {
+      setScrollOffset((prev) => Math.max(0, prev - scrollStep));
+      return;
     }
   });
   const confirm = useCallback((prompt) => {
@@ -999,6 +980,7 @@ function App({ config: config2, version: version2, autoMode: autoMode2 = false,
         return;
       }
       if (!trimmed) return;
+      setScrollOffset(0);
       if (registry2) {
         const skillResult = handleSkillInput(trimmed, registry2);
         if (skillResult.type === "error") {
@@ -1046,7 +1028,16 @@ function App({ config: config2, version: version2, autoMode: autoMode2 = false,
   const skillSuggestions = registry2 ? computeSuggestions(registry2.list(), acState) : [];
   const acOpen = isOpen(acState, skillSuggestions);
   return /* @__PURE__ */ jsxs5(Box5, { flexDirection: "column", height: "100%", children: [
-    /* @__PURE__ */ jsx5(ConversationHistory, { messages, expandTools }),
+    /* @__PURE__ */ jsx5(
+      ConversationHistory,
+      {
+        messages,
+        expandTools,
+        maxHeight: historyMaxHeight,
+        terminalWidth: stdout?.columns,
+        scrollOffset
+      }
+    ),
     /* @__PURE__ */ jsx5(
       StatusBar,
       {
@@ -1205,4 +1196,21 @@ for (const dir of [builtinSkillsDir, userSkillsDir, projectSkillsDir]) {
   const skills = await loadSkillsFromDir(dir);
   for (const skill of skills) registry.register(skill);
 }
+if (process.stdout.isTTY) {
+  process.stdout.write("\x1B[?1049h");
+  const exitAltScreen = () => process.stdout.write("\x1B[?1049l");
+  process.on("exit", exitAltScreen);
+  process.on("SIGINT", () => {
+    exitAltScreen();
+    process.exit(0);
+  });
+  process.on("SIGTERM", () => {
+    exitAltScreen();
+    process.exit(0);
+  });
+  process.on("SIGHUP", () => {
+    exitAltScreen();
+    process.exit(0);
+  });
+}
 render(React4.createElement(App, { config: finalConfig, version: VERSION, autoMode, registry }));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zhongqian97-code/ecode",
-  "version": "0.2.2",
+  "version": "0.2.4",
   "description": "A minimal Claude Code clone with REPL interface and bash tool calling",
   "type": "module",
   "author": "zhongqian97-code",