@huyooo/ai-chat-frontend-react 0.1.2

package/dist/index.js

@@ -0,0 +1,1421 @@
+// src/adapter.ts
+function createNullAdapter() {
+  return {
+    async getSessions() {
+      return [];
+    },
+    async createSession(options) {
+      return {
+        id: Date.now().toString(),
+        title: options.title,
+        model: options.model,
+        mode: options.mode,
+        createdAt: /* @__PURE__ */ new Date(),
+        updatedAt: /* @__PURE__ */ new Date()
+      };
+    },
+    async updateSession() {
+    },
+    async deleteSession() {
+    },
+    async getMessages() {
+      return [];
+    },
+    async saveMessage(options) {
+      return {
+        id: Date.now().toString(),
+        sessionId: options.sessionId,
+        role: options.role,
+        content: options.content,
+        thinking: options.thinking,
+        toolCalls: options.toolCalls,
+        searchResults: options.searchResults,
+        timestamp: /* @__PURE__ */ new Date()
+      };
+    },
+    async *sendMessage() {
+      yield { type: "text", data: "\u65E0\u53EF\u7528\u7684 Adapter" };
+      yield { type: "done", data: "" };
+    },
+    cancel() {
+    }
+  };
+}
+
+// src/hooks/useChat.ts
+import { useState, useCallback, useRef } from "react";
+function generateId() {
+  return Date.now().toString(36) + Math.random().toString(36).substr(2);
+}
+function convertToMessage(record) {
+  return {
+    id: record.id,
+    role: record.role,
+    content: record.content,
+    thinking: record.thinking || void 0,
+    thinkingComplete: true,
+    toolCalls: record.toolCalls ? JSON.parse(record.toolCalls) : void 0,
+    searchResults: record.searchResults ? JSON.parse(record.searchResults) : void 0,
+    searching: false,
+    timestamp: record.timestamp
+  };
+}
+function useChat(options = {}) {
+  const {
+    adapter = createNullAdapter(),
+    defaultModel = "anthropic/claude-opus-4.5",
+    defaultMode = "agent"
+  } = options;
+  const [sessions, setSessions] = useState([]);
+  const [currentSessionId, setCurrentSessionId] = useState(null);
+  const [messages, setMessages] = useState([]);
+  const [mode, setModeState] = useState(defaultMode);
+  const [model, setModelState] = useState(defaultModel);
+  const [webSearch, setWebSearchState] = useState(true);
+  const [thinking, setThinkingState] = useState(true);
+  const [isLoading, setIsLoading] = useState(false);
+  const abortControllerRef = useRef(null);
+  const sessionsRef = useRef(sessions);
+  const messagesRef = useRef(messages);
+  const currentSessionIdRef = useRef(currentSessionId);
+  const modeRef = useRef(mode);
+  const modelRef = useRef(model);
+  const webSearchRef = useRef(webSearch);
+  const thinkingRef = useRef(thinking);
+  sessionsRef.current = sessions;
+  messagesRef.current = messages;
+  currentSessionIdRef.current = currentSessionId;
+  modeRef.current = mode;
+  modelRef.current = model;
+  webSearchRef.current = webSearch;
+  thinkingRef.current = thinking;
+  const loadSessions = useCallback(async () => {
+    try {
+      const list = await adapter.getSessions();
+      setSessions(list);
+      if (list.length > 0 && !currentSessionIdRef.current) {
+        const firstSession = list[0];
+        setCurrentSessionId(firstSession.id);
+        const savedMessages = await adapter.getMessages(firstSession.id);
+        setMessages(savedMessages.map(convertToMessage));
+        setModeState(firstSession.mode);
+        setModelState(firstSession.model);
+      }
+    } catch (error) {
+      console.error("\u52A0\u8F7D\u4F1A\u8BDD\u5931\u8D25:", error);
+    }
+  }, [adapter]);
+  const switchSession = useCallback(async (sessionId) => {
+    if (currentSessionIdRef.current === sessionId) return;
+    setCurrentSessionId(sessionId);
+    try {
+      const savedMessages = await adapter.getMessages(sessionId);
+      setMessages(savedMessages.map(convertToMessage));
+      const session = sessionsRef.current.find((s) => s.id === sessionId);
+      if (session) {
+        setModeState(session.mode);
+        setModelState(session.model);
+      }
+    } catch (error) {
+      console.error("\u52A0\u8F7D\u6D88\u606F\u5931\u8D25:", error);
+      setMessages([]);
+    }
+  }, [adapter]);
+  const createNewSession = useCallback(async () => {
+    try {
+      const session = await adapter.createSession({
+        title: "\u65B0\u5BF9\u8BDD",
+        model: modelRef.current,
+        mode: modeRef.current
+      });
+      setSessions((prev) => [session, ...prev]);
+      setCurrentSessionId(session.id);
+      setMessages([]);
+    } catch (error) {
+      console.error("\u521B\u5EFA\u4F1A\u8BDD\u5931\u8D25:", error);
+    }
+  }, [adapter]);
+  const deleteSession = useCallback(async (sessionId) => {
+    try {
+      await adapter.deleteSession(sessionId);
+      setSessions((prev) => prev.filter((s) => s.id !== sessionId));
+      if (currentSessionIdRef.current === sessionId) {
+        const remaining = sessionsRef.current.filter((s) => s.id !== sessionId);
+        if (remaining.length > 0) {
+          await switchSession(remaining[0].id);
+        } else {
+          setCurrentSessionId(null);
+          setMessages([]);
+        }
+      }
+    } catch (error) {
+      console.error("\u5220\u9664\u4F1A\u8BDD\u5931\u8D25:", error);
+    }
+  }, [adapter, switchSession]);
+  const deleteCurrentSession = useCallback(async () => {
+    if (currentSessionIdRef.current) {
+      await deleteSession(currentSessionIdRef.current);
+    }
+  }, [deleteSession]);
+  const updateMessage = useCallback((index, progress) => {
+    setMessages((prev) => {
+      const newMessages = [...prev];
+      const msg = { ...newMessages[index] };
+      if (!msg) return prev;
+      switch (progress.type) {
+        case "thinking": {
+          const thinkingData = progress.data;
+          if (thinkingData.content) {
+            msg.thinking = (msg.thinking || "") + thinkingData.content;
+          }
+          msg.thinkingComplete = thinkingData.isComplete;
+          break;
+        }
+        case "search_start":
+          msg.searching = true;
+          break;
+        case "search_result": {
+          msg.searching = false;
+          const searchData = progress.data;
+          msg.searchResults = searchData.results || [];
+          break;
+        }
+        case "tool_call": {
+          const toolData = progress.data;
+          if (!msg.toolCalls) msg.toolCalls = [];
+          msg.toolCalls = [...msg.toolCalls, {
+            name: toolData.name,
+            args: toolData.args,
+            status: "running"
+          }];
+          break;
+        }
+        case "tool_result": {
+          const resultData = progress.data;
+          if (msg.toolCalls) {
+            msg.toolCalls = msg.toolCalls.map((t) => {
+              if (t.name === resultData.name && t.status === "running") {
+                return { ...t, result: resultData.result, status: "success" };
+              }
+              return t;
+            });
+          }
+          break;
+        }
+        case "text_delta":
+          msg.content = (msg.content || "") + progress.data;
+          break;
+        case "text":
+          if (!msg.content) {
+            msg.content = progress.data;
+          }
+          break;
+        case "error":
+          msg.content = (msg.content || "") + `
+
+\u274C \u9519\u8BEF: ${progress.data}`;
+          break;
+      }
+      newMessages[index] = msg;
+      return newMessages;
+    });
+  }, []);
+  const sendMessage = useCallback(async (text, images) => {
+    if (!text.trim() || isLoading) return;
+    let sessionId = currentSessionIdRef.current;
+    if (!sessionId) {
+      try {
+        const session = await adapter.createSession({
+          title: "\u65B0\u5BF9\u8BDD",
+          model: modelRef.current,
+          mode: modeRef.current
+        });
+        setSessions((prev) => [session, ...prev]);
+        setCurrentSessionId(session.id);
+        sessionId = session.id;
+      } catch (error) {
+        console.error("\u521B\u5EFA\u4F1A\u8BDD\u5931\u8D25:", error);
+        return;
+      }
+    }
+    const userMsg = {
+      id: generateId(),
+      role: "user",
+      content: text,
+      images,
+      timestamp: /* @__PURE__ */ new Date()
+    };
+    const currentMessages = messagesRef.current;
+    setMessages([...currentMessages, userMsg]);
+    try {
+      await adapter.saveMessage({
+        sessionId,
+        role: "user",
+        content: text
+      });
+      if (currentMessages.length === 0) {
+        const title = text.slice(0, 20) + (text.length > 20 ? "..." : "");
+        await adapter.updateSession(sessionId, { title });
+        setSessions((prev) => prev.map(
+          (s) => s.id === sessionId ? { ...s, title } : s
+        ));
+      }
+    } catch (error) {
+      console.error("\u4FDD\u5B58\u6D88\u606F\u5931\u8D25:", error);
+    }
+    const assistantMsgIndex = currentMessages.length + 1;
+    const assistantMsg = {
+      id: generateId(),
+      role: "assistant",
+      content: "",
+      toolCalls: [],
+      thinkingComplete: false,
+      searching: false,
+      loading: true,
+      timestamp: /* @__PURE__ */ new Date()
+    };
+    setMessages((prev) => [...prev, assistantMsg]);
+    setIsLoading(true);
+    abortControllerRef.current = new AbortController();
+    try {
+      for await (const progress of adapter.sendMessage(
+        text,
+        {
+          mode: modeRef.current,
+          model: modelRef.current,
+          enableWebSearch: webSearchRef.current,
+          thinkingMode: thinkingRef.current ? "enabled" : "disabled"
+        },
+        images
+      )) {
+        if (abortControllerRef.current?.signal.aborted) break;
+        updateMessage(assistantMsgIndex, progress);
+        if (progress.type === "done" || progress.type === "error") {
+          break;
+        }
+      }
+    } catch (error) {
+      console.error("\u53D1\u9001\u6D88\u606F\u5931\u8D25:", error);
+      updateMessage(assistantMsgIndex, {
+        type: "error",
+        data: error instanceof Error ? error.message : String(error)
+      });
+    } finally {
+      setIsLoading(false);
+      setMessages((prev) => {
+        const newMessages = [...prev];
+        const finalMsg = newMessages[assistantMsgIndex];
+        if (finalMsg) {
+          newMessages[assistantMsgIndex] = { ...finalMsg, loading: false };
+          if (sessionId) {
+            adapter.saveMessage({
+              sessionId,
+              role: "assistant",
+              content: finalMsg.content,
+              thinking: finalMsg.thinking,
+              toolCalls: finalMsg.toolCalls ? JSON.stringify(finalMsg.toolCalls) : void 0,
+              searchResults: finalMsg.searchResults ? JSON.stringify(finalMsg.searchResults) : void 0
+            }).catch((e) => console.error("\u4FDD\u5B58\u52A9\u624B\u6D88\u606F\u5931\u8D25:", e));
+          }
+        }
+        return newMessages;
+      });
+      abortControllerRef.current = null;
+    }
+  }, [adapter, isLoading, updateMessage]);
+  const cancelRequest = useCallback(() => {
+    adapter.cancel();
+    abortControllerRef.current?.abort();
+    setIsLoading(false);
+  }, [adapter]);
+  const copyMessage = useCallback(async (messageId) => {
+    const msg = messagesRef.current.find((m) => m.id === messageId);
+    if (!msg) return;
+    try {
+      await navigator.clipboard.writeText(msg.content);
+      setMessages((prev) => prev.map(
+        (m) => m.id === messageId ? { ...m, copied: true } : m
+      ));
+      setTimeout(() => {
+        setMessages((prev) => prev.map(
+          (m) => m.id === messageId ? { ...m, copied: false } : m
+        ));
+      }, 2e3);
+    } catch (err) {
+      console.error("\u590D\u5236\u5931\u8D25:", err);
+    }
+  }, []);
+  const regenerateMessage = useCallback((messageIndex) => {
+    const currentMsgs = messagesRef.current;
+    if (messageIndex > 0 && currentMsgs[messageIndex - 1]?.role === "user") {
+      const userMsg = currentMsgs[messageIndex - 1];
+      setMessages((prev) => prev.slice(0, messageIndex - 1));
+      sendMessage(userMsg.content, userMsg.images);
+    }
+  }, [sendMessage]);
+  const setWorkingDirectory = useCallback((dir) => {
+    if (adapter.setWorkingDir) {
+      adapter.setWorkingDir(dir);
+    }
+  }, [adapter]);
+  const setMode = useCallback((value) => setModeState(value), []);
+  const setModel = useCallback((value) => setModelState(value), []);
+  const setWebSearch = useCallback((value) => setWebSearchState(value), []);
+  const setThinking = useCallback((value) => setThinkingState(value), []);
+  return {
+    // 状态
+    sessions,
+    currentSessionId,
+    messages,
+    isLoading,
+    mode,
+    model,
+    webSearch,
+    thinking,
+    // 会话方法
+    loadSessions,
+    switchSession,
+    createNewSession,
+    deleteSession,
+    deleteCurrentSession,
+    // 消息方法
+    sendMessage,
+    cancelRequest,
+    copyMessage,
+    regenerateMessage,
+    // 配置方法
+    setMode,
+    setModel,
+    setWebSearch,
+    setThinking,
+    // 工具方法
+    setWorkingDirectory
+  };
+}
+
+// src/components/ChatPanel.tsx
+import { useEffect as useEffect3, useRef as useRef4, useCallback as useCallback4 } from "react";
+
+// src/types/index.ts
+var DEFAULT_MODELS = [
+  {
+    provider: "openrouter",
+    model: "anthropic/claude-opus-4.5",
+    displayName: "Claude Opus 4.5",
+    supportsTools: true,
+    supportsWebSearch: true,
+    supportedThinkingModes: ["enabled", "disabled"]
+  },
+  {
+    provider: "doubao",
+    model: "doubao-seed-1-6-251015",
+    displayName: "Doubao Seed",
+    supportsTools: true,
+    supportsWebSearch: true,
+    supportedThinkingModes: ["enabled", "disabled"]
+  },
+  {
+    provider: "deepseek",
+    model: "deepseek-v3-1-terminus",
+    displayName: "DeepSeek V3",
+    supportsTools: true,
+    supportsWebSearch: true,
+    supportedThinkingModes: ["enabled", "disabled"]
+  },
+  {
+    provider: "qwen",
+    model: "qwen3-max-preview",
+    displayName: "Qwen Max",
+    supportsTools: true,
+    supportsWebSearch: true,
+    supportedThinkingModes: ["enabled", "disabled"]
+  },
+  {
+    provider: "gemini",
+    model: "gemini-3-pro-preview",
+    displayName: "Gemini 3 Pro",
+    supportsTools: true,
+    supportsWebSearch: true,
+    supportedThinkingModes: ["enabled", "disabled"]
+  }
+];
+var FileType = /* @__PURE__ */ ((FileType2) => {
+  FileType2["FOLDER"] = "folder";
+  FileType2["IMAGE"] = "image";
+  FileType2["VIDEO"] = "video";
+  FileType2["AUDIO"] = "audio";
+  FileType2["TEXT"] = "text";
+  FileType2["PDF"] = "pdf";
+  FileType2["CODE"] = "code";
+  FileType2["ARCHIVE"] = "archive";
+  FileType2["OTHER"] = "other";
+  return FileType2;
+})(FileType || {});
+
+// src/components/chat/ui/ChatHeader.tsx
+import { useState as useState2, useRef as useRef2, useEffect, useCallback as useCallback2 } from "react";
+import { Plus, Clock, MoreHorizontal, X, MessageSquare, Pencil, Trash2 } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function formatTime(date) {
+  if (!date) return "";
+  const d = new Date(date);
+  const now = /* @__PURE__ */ new Date();
+  const diff = now.getTime() - d.getTime();
+  const days = Math.floor(diff / (1e3 * 60 * 60 * 24));
+  if (days === 0) {
+    return d.toLocaleTimeString("zh-CN", { hour: "2-digit", minute: "2-digit" });
+  } else if (days === 1) {
+    return "\u6628\u5929";
+  } else if (days < 7) {
+    return `${days}\u5929\u524D`;
+  } else {
+    return d.toLocaleDateString("zh-CN", { month: "short", day: "numeric" });
+  }
+}
+var ChatHeader = ({
+  sessions,
+  currentSessionId,
+  showClose = false,
+  onNewSession,
+  onSwitchSession,
+  onDeleteSession,
+  onClose,
+  onClearAll,
+  onCloseOthers,
+  onExport,
+  onCopyId,
+  onFeedback,
+  onSettings
+}) => {
+  const [historyOpen, setHistoryOpen] = useState2(false);
+  const [moreMenuOpen, setMoreMenuOpen] = useState2(false);
+  const [hiddenTabs, setHiddenTabs] = useState2(/* @__PURE__ */ new Set());
+  const historyRef = useRef2(null);
+  const moreMenuRef = useRef2(null);
+  const visibleSessions = sessions.filter((s) => !hiddenTabs.has(s.id));
+  useEffect(() => {
+    const handleClickOutside = (event) => {
+      const target = event.target;
+      if (historyRef.current && !historyRef.current.contains(target)) {
+        setHistoryOpen(false);
+      }
+      if (moreMenuRef.current && !moreMenuRef.current.contains(target)) {
+        setMoreMenuOpen(false);
+      }
+    };
+    document.addEventListener("click", handleClickOutside);
+    return () => document.removeEventListener("click", handleClickOutside);
+  }, []);
+  const handleSwitchSession = useCallback2(
+    (sessionId) => {
+      onSwitchSession?.(sessionId);
+      setHistoryOpen(false);
+    },
+    [onSwitchSession]
+  );
+  const handleHideTab = useCallback2(
+    (sessionId, e) => {
+      e.stopPropagation();
+      setHiddenTabs((prev) => /* @__PURE__ */ new Set([...prev, sessionId]));
+      if (sessionId === currentSessionId) {
+        const remaining = sessions.filter((s) => s.id !== sessionId && !hiddenTabs.has(s.id));
+        if (remaining.length > 0) {
+          onSwitchSession?.(remaining[0].id);
+        }
+      }
+    },
+    [currentSessionId, sessions, hiddenTabs, onSwitchSession]
+  );
+  const handleDeleteSession = (sessionId, e) => {
+    e.stopPropagation();
+    if (window.confirm("\u786E\u5B9A\u8981\u5220\u9664\u8FD9\u4E2A\u5BF9\u8BDD\u5417\uFF1F")) {
+      onDeleteSession?.(sessionId);
+    }
+  };
+  const handleMenuClick = (callback) => {
+    callback?.();
+    setMoreMenuOpen(false);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "chat-header", children: [
+    /* @__PURE__ */ jsx("div", { className: "chat-tabs", children: visibleSessions.length === 0 ? /* @__PURE__ */ jsx("span", { className: "chat-tab active", children: /* @__PURE__ */ jsx("span", { className: "chat-tab-title", children: "New Chat" }) }) : visibleSessions.map((session) => {
+      const title = session.title === "\u65B0\u5BF9\u8BDD" ? "New Chat" : session.title;
+      const isActive = session.id === currentSessionId;
+      return /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: `chat-tab${isActive ? " active" : ""}`,
+          onClick: () => handleSwitchSession(session.id),
+          title: session.title,
+          children: [
+            /* @__PURE__ */ jsx("span", { className: "chat-tab-title", children: title }),
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: "chat-tab-close",
+                onClick: (e) => handleHideTab(session.id, e),
+                title: "\u5173\u95ED\u6807\u7B7E",
+                children: /* @__PURE__ */ jsx(X, { size: 12 })
+              }
+            )
+          ]
+        },
+        session.id
+      );
+    }) }),
+    /* @__PURE__ */ jsxs("div", { className: "chat-header-actions", children: [
+      /* @__PURE__ */ jsx("button", { className: "header-btn", onClick: onNewSession, title: "\u65B0\u5EFA\u5BF9\u8BDD", children: /* @__PURE__ */ jsx(Plus, { size: 14 }) }),
+      /* @__PURE__ */ jsxs("div", { ref: historyRef, style: { position: "relative" }, children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            className: `header-btn${historyOpen ? " active" : ""}`,
+            onClick: (e) => {
+              e.stopPropagation();
+              setHistoryOpen(!historyOpen);
+              setMoreMenuOpen(false);
+            },
+            title: "\u5386\u53F2\u8BB0\u5F55",
+            children: /* @__PURE__ */ jsx(Clock, { size: 14 })
+          }
+        ),
+        historyOpen && /* @__PURE__ */ jsx("div", { className: "history-panel", children: sessions.length === 0 ? /* @__PURE__ */ jsx("div", { className: "history-empty", children: "\u6682\u65E0\u5386\u53F2\u5BF9\u8BDD" }) : sessions.map((session) => {
+          const isCurrent = session.id === currentSessionId;
+          return /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: `history-item${isCurrent ? " active" : ""}`,
+              children: [
+                /* @__PURE__ */ jsxs(
+                  "button",
+                  {
+                    className: "history-item-content",
+                    onClick: () => handleSwitchSession(session.id),
+                    children: [
+                      /* @__PURE__ */ jsx(MessageSquare, { size: 12 }),
+                      /* @__PURE__ */ jsx("span", { className: "history-item-title", children: session.title === "\u65B0\u5BF9\u8BDD" ? "New Chat" : session.title }),
+                      /* @__PURE__ */ jsx("span", { className: "history-item-time", children: isCurrent ? "Current" : formatTime(session.updatedAt) })
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsxs("div", { className: "history-item-actions", children: [
+                  /* @__PURE__ */ jsx("button", { className: "history-action-btn", title: "\u7F16\u8F91", children: /* @__PURE__ */ jsx(Pencil, { size: 10 }) }),
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      className: "history-action-btn delete",
+                      title: "\u5220\u9664",
+                      onClick: (e) => handleDeleteSession(session.id, e),
+                      children: /* @__PURE__ */ jsx(Trash2, { size: 10 })
+                    }
+                  )
+                ] })
+              ]
+            },
+            session.id
+          );
+        }) })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { ref: moreMenuRef, style: { position: "relative" }, children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            className: `header-btn${moreMenuOpen ? " active" : ""}`,
+            onClick: (e) => {
+              e.stopPropagation();
+              setMoreMenuOpen(!moreMenuOpen);
+              setHistoryOpen(false);
+            },
+            title: "\u66F4\u591A\u9009\u9879",
+            children: /* @__PURE__ */ jsx(MoreHorizontal, { size: 14 })
+          }
+        ),
+        moreMenuOpen && /* @__PURE__ */ jsxs("div", { className: "more-menu", children: [
+          showClose && /* @__PURE__ */ jsxs("button", { className: "menu-item", onClick: () => handleMenuClick(onClose), children: [
+            /* @__PURE__ */ jsx("span", { children: "\u5173\u95ED\u5BF9\u8BDD" }),
+            /* @__PURE__ */ jsx("span", { className: "menu-shortcut", children: "\u2318 W" })
+          ] }),
+          onClearAll && /* @__PURE__ */ jsx("button", { className: "menu-item", onClick: () => handleMenuClick(onClearAll), children: "\u6E05\u7A7A\u6240\u6709\u5BF9\u8BDD" }),
+          onCloseOthers && /* @__PURE__ */ jsx("button", { className: "menu-item", onClick: () => handleMenuClick(onCloseOthers), children: "\u5173\u95ED\u5176\u4ED6\u5BF9\u8BDD" }),
+          (showClose || onClearAll || onCloseOthers) && /* @__PURE__ */ jsx("div", { className: "menu-divider" }),
+          onExport && /* @__PURE__ */ jsx("button", { className: "menu-item", onClick: () => handleMenuClick(onExport), children: "\u5BFC\u51FA\u5BF9\u8BDD" }),
+          onCopyId && /* @__PURE__ */ jsx("button", { className: "menu-item", onClick: () => handleMenuClick(onCopyId), children: "\u590D\u5236\u8BF7\u6C42 ID" }),
+          onFeedback && /* @__PURE__ */ jsx("button", { className: "menu-item", onClick: () => handleMenuClick(onFeedback), children: "\u53CD\u9988" }),
+          (onExport || onCopyId || onFeedback) && onSettings && /* @__PURE__ */ jsx("div", { className: "menu-divider" }),
+          onSettings && /* @__PURE__ */ jsx("button", { className: "menu-item", onClick: () => handleMenuClick(onSettings), children: "Agent \u8BBE\u7F6E" })
+        ] })
+      ] })
+    ] })
+  ] });
+};
+
+// src/components/chat/ui/WelcomeMessage.tsx
+import { Wand2, ImageIcon, Video, Terminal } from "lucide-react";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var QUICK_ACTIONS = [
+  {
+    id: "txt2img",
+    Icon: Wand2,
+    label: "\u6587\u751F\u56FE",
+    desc: "AI \u7ED8\u5236\u521B\u610F\u56FE\u50CF",
+    prompt: "\u5E2E\u6211\u751F\u6210\u4E00\u5F20\u56FE\u7247\uFF1A",
+    gradient: "purple",
+    iconColor: "purple",
+    featured: true
+  },
+  {
+    id: "img2img",
+    Icon: ImageIcon,
+    label: "\u56FE\u751F\u56FE",
+    desc: "\u98CE\u683C\u8FC1\u79FB",
+    prompt: "\u57FA\u4E8E\u8FD9\u5F20\u56FE\u7247\u8FDB\u884C\u98CE\u683C\u8F6C\u6362",
+    gradient: "blue",
+    iconColor: "blue",
+    featured: false
+  },
+  {
+    id: "img2vid",
+    Icon: Video,
+    label: "\u56FE\u751F\u89C6\u9891",
+    desc: "\u52A8\u6001\u5316",
+    prompt: "\u5C06\u8FD9\u5F20\u56FE\u7247\u8F6C\u6362\u6210\u89C6\u9891",
+    gradient: "emerald",
+    iconColor: "emerald",
+    featured: false
+  },
+  {
+    id: "cmd",
+    Icon: Terminal,
+    label: "\u6267\u884C\u547D\u4EE4",
+    desc: "\u7CFB\u7EDF\u7BA1\u7406",
+    prompt: "\u6267\u884C\u547D\u4EE4\uFF1A",
+    gradient: "orange",
+    iconColor: "orange",
+    featured: true
+  }
+];
+var WelcomeMessage = ({ onQuickAction }) => {
+  return /* @__PURE__ */ jsxs2("div", { className: "welcome-message", children: [
+    /* @__PURE__ */ jsx2("div", { className: "welcome-glow purple" }),
+    /* @__PURE__ */ jsx2("div", { className: "welcome-glow blue" }),
+    /* @__PURE__ */ jsxs2("div", { className: "welcome-title-area", children: [
+      /* @__PURE__ */ jsxs2("h1", { className: "welcome-title", children: [
+        "Create",
+        /* @__PURE__ */ jsx2("br", {}),
+        /* @__PURE__ */ jsx2("span", { className: "welcome-title-accent", children: "Everything" })
+      ] }),
+      /* @__PURE__ */ jsx2("p", { className: "welcome-subtitle", children: "\u91CA\u653E AI \u7684\u65E0\u9650\u521B\u9020\u529B" })
+    ] }),
+    /* @__PURE__ */ jsx2("div", { className: "quick-actions", children: QUICK_ACTIONS.map((action) => /* @__PURE__ */ jsxs2(
+      "button",
+      {
+        className: `quick-action-btn${action.featured ? " featured" : ""}`,
+        onClick: () => onQuickAction(action.prompt),
+        children: [
+          /* @__PURE__ */ jsx2("div", { className: `quick-action-gradient ${action.gradient}` }),
+          /* @__PURE__ */ jsx2(action.Icon, { className: `quick-action-icon ${action.iconColor}` }),
+          /* @__PURE__ */ jsxs2("div", { className: "quick-action-text", children: [
+            /* @__PURE__ */ jsx2("span", { className: "quick-action-label", children: action.label }),
+            /* @__PURE__ */ jsx2("span", { className: "quick-action-desc", children: action.desc })
+          ] }),
+          /* @__PURE__ */ jsx2("div", { className: "quick-action-glow" })
+        ]
+      },
+      action.id
+    )) }),
+    /* @__PURE__ */ jsx2("div", { className: "welcome-footer", children: /* @__PURE__ */ jsx2("div", { className: "welcome-footer-line" }) })
+  ] });
+};
+
+// src/components/chat/messages/MessageBubble.tsx
+import { Copy, Check as Check2, RefreshCw } from "lucide-react";
+
+// src/components/chat/messages/ExecutionSteps.tsx
+import { useState as useState3 } from "react";
+import {
+  ChevronDown,
+  ChevronUp,
+  Sparkles,
+  Globe,
+  FileText,
+  FileEdit,
+  Terminal as Terminal2,
+  Search,
+  Folder,
+  FolderPlus,
+  Trash2 as Trash22,
+  Image,
+  Video as Video2,
+  Wrench,
+  ExternalLink
+} from "lucide-react";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var StepItem = ({
+  icon,
+  title,
+  status,
+  extra,
+  detail,
+  defaultExpanded = false
+}) => {
+  const [expanded, setExpanded] = useState3(defaultExpanded);
+  const isRunning = status === "running";
+  const hasDetail = !!detail;
+  return /* @__PURE__ */ jsxs3("div", { className: "step-item", children: [
+    /* @__PURE__ */ jsxs3(
+      "button",
+      {
+        className: `step-header${isRunning ? " running" : ""}`,
+        onClick: () => hasDetail && setExpanded(!expanded),
+        disabled: !hasDetail,
+        style: { cursor: hasDetail ? "pointer" : "default" },
+        children: [
+          /* @__PURE__ */ jsx3("span", { className: `step-icon${isRunning ? " pulse" : ""}`, children: icon }),
+          /* @__PURE__ */ jsx3("span", { className: "step-title", children: title }),
+          hasDetail && (expanded ? /* @__PURE__ */ jsx3(ChevronUp, { className: "step-chevron", size: 12 }) : /* @__PURE__ */ jsx3(ChevronDown, { className: "step-chevron", size: 12 })),
+          extra && /* @__PURE__ */ jsx3("span", { className: "step-extra", children: extra })
+        ]
+      }
+    ),
+    expanded && detail && /* @__PURE__ */ jsx3("div", { className: "step-detail", children: typeof detail === "string" ? /* @__PURE__ */ jsx3("pre", { children: detail }) : detail })
+  ] });
+};
+function getToolDisplayName(name) {
+  const nameMap = {
+    read_file: "\u8BFB\u53D6\u6587\u4EF6",
+    write_file: "\u5199\u5165\u6587\u4EF6",
+    execute_command: "\u6267\u884C\u547D\u4EE4",
+    search_files: "\u641C\u7D22\u6587\u4EF6",
+    list_directory: "\u5217\u51FA\u76EE\u5F55",
+    create_directory: "\u521B\u5EFA\u76EE\u5F55",
+    delete_file: "\u5220\u9664\u6587\u4EF6",
+    web_search: "\u7F51\u9875\u641C\u7D22",
+    generate_image: "\u751F\u6210\u56FE\u7247",
+    image_to_video: "\u56FE\u7247\u8F6C\u89C6\u9891"
+  };
+  return nameMap[name] || name;
+}
+function getToolIcon(name) {
+  switch (name) {
+    case "read_file":
+      return /* @__PURE__ */ jsx3(FileText, { size: 14 });
+    case "write_file":
+      return /* @__PURE__ */ jsx3(FileEdit, { size: 14 });
+    case "execute_command":
+      return /* @__PURE__ */ jsx3(Terminal2, { size: 14 });
+    case "search_files":
+      return /* @__PURE__ */ jsx3(Search, { size: 14 });
+    case "list_directory":
+      return /* @__PURE__ */ jsx3(Folder, { size: 14 });
+    case "create_directory":
+      return /* @__PURE__ */ jsx3(FolderPlus, { size: 14 });
+    case "delete_file":
+      return /* @__PURE__ */ jsx3(Trash22, { size: 14 });
+    case "web_search":
+      return /* @__PURE__ */ jsx3(Globe, { size: 14 });
+    case "generate_image":
+      return /* @__PURE__ */ jsx3(Image, { size: 14 });
+    case "image_to_video":
+      return /* @__PURE__ */ jsx3(Video2, { size: 14 });
+    default:
+      return /* @__PURE__ */ jsx3(Wrench, { size: 14 });
+  }
+}
+function formatToolArgs(args) {
+  if (!args) return "";
+  return Object.entries(args).map(([key, value]) => `${key}: ${JSON.stringify(value)}`).join("\n");
+}
+var ExecutionSteps = ({
+  loading,
+  hasContent,
+  thinking,
+  thinkingComplete = true,
+  thinkingDuration,
+  searching,
+  searchResults,
+  toolCalls
+}) => {
+  const hasSteps = thinking || searching || searchResults && searchResults.length > 0 || toolCalls && toolCalls.length > 0 || loading && !hasContent;
+  if (!hasSteps) return null;
+  return /* @__PURE__ */ jsxs3("div", { className: "execution-steps", children: [
+    loading && !hasContent && !thinking && !searching && (!toolCalls || toolCalls.length === 0) && /* @__PURE__ */ jsx3(
+      StepItem,
+      {
+        icon: /* @__PURE__ */ jsx3(Sparkles, { size: 14 }),
+        title: "\u6B63\u5728\u89C4\u5212\u4E0B\u4E00\u6B65...",
+        status: "running"
+      }
+    ),
+    thinking && /* @__PURE__ */ jsx3(
+      StepItem,
+      {
+        icon: /* @__PURE__ */ jsx3(Sparkles, { size: 14 }),
+        title: thinkingComplete ? "\u601D\u8003\u5B8C\u6210" : "\u601D\u8003\u4E2D...",
+        status: thinkingComplete ? "completed" : "running",
+        extra: thinkingDuration ? `${thinkingDuration}s` : void 0,
+        detail: thinking
+      }
+    ),
+    (searching || searchResults && searchResults.length > 0) && /* @__PURE__ */ jsx3(
+      StepItem,
+      {
+        icon: /* @__PURE__ */ jsx3(Globe, { size: 14 }),
+        title: searching ? "\u641C\u7D22\u4E2D..." : `\u641C\u7D22\u5B8C\u6210 ${searchResults?.length || 0} \u6761\u7ED3\u679C`,
+        status: searching ? "running" : "completed",
+        detail: searchResults && searchResults.length > 0 ? /* @__PURE__ */ jsx3("div", { children: searchResults.map((result, i) => /* @__PURE__ */ jsxs3(
+          "a",
+          {
+            href: result.url,
+            target: "_blank",
+            rel: "noopener noreferrer",
+            className: "search-result-item",
+            children: [
+              /* @__PURE__ */ jsxs3("div", { className: "search-result-title", children: [
+                /* @__PURE__ */ jsx3("span", { children: result.title }),
+                /* @__PURE__ */ jsx3(ExternalLink, { size: 12, style: { opacity: 0.5 } })
+              ] }),
+              /* @__PURE__ */ jsx3("div", { className: "search-result-snippet", children: result.snippet })
+            ]
+          },
+          i
+        )) }) : void 0
+      }
+    ),
+    toolCalls && toolCalls.map((call, index) => /* @__PURE__ */ jsx3(
+      StepItem,
+      {
+        icon: getToolIcon(call.name),
+        title: `${getToolDisplayName(call.name)}${call.status === "running" ? "..." : ""}`,
+        status: call.status === "running" ? "running" : call.status === "error" ? "error" : "completed",
+        detail: /* @__PURE__ */ jsxs3("div", { children: [
+          call.args && /* @__PURE__ */ jsxs3("div", { style: { marginBottom: call.result ? 8 : 0 }, children: [
+            /* @__PURE__ */ jsx3("div", { style: { fontSize: 10, color: "var(--chat-text-muted)", marginBottom: 4 }, children: "\u53C2\u6570" }),
+            /* @__PURE__ */ jsx3("pre", { style: { margin: 0 }, children: formatToolArgs(call.args) })
+          ] }),
+          call.result && /* @__PURE__ */ jsxs3("div", { children: [
+            /* @__PURE__ */ jsx3("div", { style: { fontSize: 10, color: "var(--chat-text-muted)", marginBottom: 4 }, children: "\u7ED3\u679C" }),
+            /* @__PURE__ */ jsx3("pre", { style: { margin: 0, maxHeight: 160, overflow: "auto" }, children: call.result })
+          ] })
+        ] })
+      },
+      `tool-${index}`
+    ))
+  ] });
+};
+
+// src/components/ChatInput.tsx
+import { useState as useState4, useRef as useRef3, useCallback as useCallback3, useEffect as useEffect2 } from "react";
+import {
+  X as X2,
+  ChevronDown as ChevronDown2,
+  Check,
+  Globe as Globe2,
+  Sparkles as Sparkles2,
+  ImageIcon as ImageIcon2,
+  Square,
+  ArrowUp,
+  Zap,
+  MessageCircle,
+  AtSign,
+  Mic
+} from "lucide-react";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+var MODES = [
+  { value: "agent", label: "Agent", Icon: Zap },
+  { value: "ask", label: "Ask", Icon: MessageCircle }
+];
+var ChatInput = ({
+  variant = "input",
+  value = "",
+  selectedImages = [],
+  isLoading = false,
+  mode = "agent",
+  model = "",
+  models = DEFAULT_MODELS,
+  webSearchEnabled = false,
+  thinkingEnabled = false,
+  onSend,
+  onRemoveImage,
+  onCancel,
+  onUploadImage,
+  onAtContext,
+  onModeChange,
+  onModelChange,
+  onWebSearchChange,
+  onThinkingChange
+}) => {
+  const isMessageVariant = variant === "message";
+  const [inputText, setInputText] = useState4(value);
+  const [isFocused, setIsFocused] = useState4(false);
+  const [modeMenuOpen, setModeMenuOpen] = useState4(false);
+  const [modelMenuOpen, setModelMenuOpen] = useState4(false);
+  const inputRef = useRef3(null);
+  const containerRef = useRef3(null);
+  useEffect2(() => {
+    setInputText(value);
+  }, [value]);
+  const currentMode = MODES.find((m) => m.value === mode) || MODES[0];
+  const currentModel = models.find((m) => m.model === model);
+  const showToolbar = !isMessageVariant || isFocused;
+  const selectedPreview = selectedImages.slice(0, 3);
+  const placeholder = selectedImages.length > 0 ? "\u63CF\u8FF0\u4F60\u60F3\u8981\u7684\u6548\u679C..." : mode === "ask" ? "\u6709\u4EC0\u4E48\u95EE\u9898\u60F3\u95EE\u6211\uFF1F" : "\u63CF\u8FF0\u4EFB\u52A1\uFF0C@ \u6DFB\u52A0\u4E0A\u4E0B\u6587";
+  const adjustTextareaHeight = useCallback3(() => {
+    if (inputRef.current) {
+      inputRef.current.style.height = "auto";
+      const scrollHeight = inputRef.current.scrollHeight;
+      inputRef.current.style.height = `${Math.min(scrollHeight, 150)}px`;
+    }
+  }, []);
+  const handleSendOrCancel = useCallback3(() => {
+    if (isLoading) {
+      onCancel?.();
+      return;
+    }
+    const text = inputText.trim();
+    if (!text) return;
+    onSend?.(text);
+    if (!isMessageVariant) {
+      setInputText("");
+      if (inputRef.current) {
+        inputRef.current.style.height = "auto";
+      }
+      inputRef.current?.focus();
+    } else {
+      setIsFocused(false);
+    }
+  }, [isLoading, inputText, onSend, onCancel, isMessageVariant]);
+  const handleKeydown = useCallback3(
+    (event) => {
+      if (event.key === "Enter" && !event.shiftKey) {
+        event.preventDefault();
+        handleSendOrCancel();
+      } else {
+        setTimeout(adjustTextareaHeight, 0);
+      }
+    },
+    [handleSendOrCancel, adjustTextareaHeight]
+  );
+  const selectMode = useCallback3(
+    (value2) => {
+      onModeChange?.(value2);
+      setModeMenuOpen(false);
+    },
+    [onModeChange]
+  );
+  const selectModel = useCallback3(
+    (m) => {
+      onModelChange?.(m.model);
+      setModelMenuOpen(false);
+    },
+    [onModelChange]
+  );
+  const getImageUrl = (path) => {
+    if (path.startsWith("app://") || path.startsWith("file://") || path.startsWith("data:") || path.startsWith("http")) {
+      return path;
+    }
+    if (path.match(/^[A-Z]:\\/i)) {
+      return `app://file${encodeURIComponent(path.replace(/\\/g, "/"))}`;
+    }
+    return `app://file${encodeURIComponent(path)}`;
+  };
+  useEffect2(() => {
+    const handleClickOutside = (event) => {
+      const target = event.target;
+      if (!target.closest(".selector")) {
+        setModeMenuOpen(false);
+        setModelMenuOpen(false);
+      }
+      if (isMessageVariant && containerRef.current && !containerRef.current.contains(target)) {
+        setIsFocused(false);
+      }
+    };
+    document.addEventListener("click", handleClickOutside);
+    return () => document.removeEventListener("click", handleClickOutside);
+  }, [isMessageVariant]);
+  const CurrentModeIcon = currentMode.Icon;
+  return /* @__PURE__ */ jsx4("div", { className: `chat-input${isMessageVariant ? " message-variant" : ""}`, children: /* @__PURE__ */ jsxs4(
+    "div",
+    {
+      ref: containerRef,
+      className: `input-container${isFocused ? " focused" : ""}`,
+      children: [
+        selectedImages.length > 0 && /* @__PURE__ */ jsx4("div", { className: "attachment-preview", children: /* @__PURE__ */ jsxs4("div", { className: "preview-images", children: [
+          selectedPreview.map((img, index) => /* @__PURE__ */ jsxs4("div", { className: "preview-item", children: [
+            /* @__PURE__ */ jsx4(
+              "img",
+              {
+                src: getImageUrl(img),
+                className: "preview-thumb",
+                alt: `\u9644\u4EF6 ${index + 1}`,
+                onError: (e) => {
+                  e.target.style.display = "none";
+                }
+              }
+            ),
+            !isMessageVariant && /* @__PURE__ */ jsx4(
+              "button",
+              {
+                className: "remove-btn",
+                title: `\u79FB\u9664\u56FE\u7247 ${index + 1}`,
+                onClick: () => onRemoveImage?.(index),
+                children: /* @__PURE__ */ jsx4(X2, { size: 10 })
+              }
+            )
+          ] }, `${img}-${index}`)),
+          selectedImages.length > 3 && /* @__PURE__ */ jsxs4("div", { className: "preview-more", children: [
+            "+",
+            selectedImages.length - 3
+          ] })
+        ] }) }),
+        /* @__PURE__ */ jsx4("div", { className: "input-field-wrapper", children: /* @__PURE__ */ jsx4(
+          "textarea",
+          {
+            ref: inputRef,
+            value: inputText,
+            onChange: (e) => setInputText(e.target.value),
+            onKeyDown: handleKeydown,
+            onInput: adjustTextareaHeight,
+            onFocus: () => setIsFocused(true),
+            placeholder,
+            rows: 1,
+            className: "input-field"
+          }
+        ) }),
+        showToolbar && /* @__PURE__ */ jsxs4("div", { className: "input-controls", children: [
+          /* @__PURE__ */ jsxs4("div", { className: "input-left", children: [
+            /* @__PURE__ */ jsxs4(
+              "div",
+              {
+                className: "selector mode-selector",
+                onClick: (e) => {
+                  e.stopPropagation();
+                  setModeMenuOpen(!modeMenuOpen);
+                  setModelMenuOpen(false);
+                },
+                children: [
+                  /* @__PURE__ */ jsx4(CurrentModeIcon, { size: 12 }),
+                  /* @__PURE__ */ jsx4("span", { children: currentMode.label }),
+                  /* @__PURE__ */ jsx4(ChevronDown2, { size: 10, className: "chevron" }),
+                  modeMenuOpen && /* @__PURE__ */ jsx4("div", { className: "dropdown-menu", onClick: (e) => e.stopPropagation(), children: MODES.map((m) => /* @__PURE__ */ jsxs4(
+                    "button",
+                    {
+                      className: `dropdown-item${mode === m.value ? " active" : ""}`,
+                      onClick: () => selectMode(m.value),
+                      children: [
+                        /* @__PURE__ */ jsx4(m.Icon, { size: 14 }),
+                        /* @__PURE__ */ jsx4("span", { children: m.label }),
+                        mode === m.value && /* @__PURE__ */ jsx4(Check, { size: 14, className: "check-icon" })
+                      ]
+                    },
+                    m.value
+                  )) })
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs4(
+              "div",
+              {
+                className: "selector model-selector",
+                onClick: (e) => {
+                  e.stopPropagation();
+                  setModelMenuOpen(!modelMenuOpen);
+                  setModeMenuOpen(false);
+                },
+                children: [
+                  /* @__PURE__ */ jsx4("span", { children: currentModel?.displayName || "Auto" }),
+                  /* @__PURE__ */ jsx4(ChevronDown2, { size: 10, className: "chevron" }),
+                  modelMenuOpen && /* @__PURE__ */ jsx4("div", { className: "dropdown-menu", onClick: (e) => e.stopPropagation(), children: models.map((m) => /* @__PURE__ */ jsxs4(
+                    "button",
+                    {
+                      className: `dropdown-item${model === m.model ? " active" : ""}`,
+                      onClick: () => selectModel(m),
+                      children: [
+                        /* @__PURE__ */ jsx4("span", { children: m.displayName }),
+                        model === m.model && /* @__PURE__ */ jsx4(Check, { size: 14, className: "check-icon" })
+                      ]
+                    },
+                    m.model
+                  )) })
+                ]
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs4("div", { className: "input-right", children: [
+            /* @__PURE__ */ jsx4("button", { className: "icon-btn", title: "\u63D0\u53CA\u4E0A\u4E0B\u6587 (@)", onClick: onAtContext, children: /* @__PURE__ */ jsx4(AtSign, { size: 14 }) }),
+            /* @__PURE__ */ jsx4(
+              "button",
+              {
+                className: `toggle-btn${thinkingEnabled ? " active" : ""}`,
+                title: "\u6DF1\u5EA6\u601D\u8003",
+                onClick: () => onThinkingChange?.(!thinkingEnabled),
+                children: /* @__PURE__ */ jsx4(Sparkles2, { size: 14 })
+              }
+            ),
+            /* @__PURE__ */ jsx4(
+              "button",
+              {
+                className: `toggle-btn${webSearchEnabled ? " active" : ""}`,
+                title: "\u8054\u7F51\u641C\u7D22",
+                onClick: () => onWebSearchChange?.(!webSearchEnabled),
+                children: /* @__PURE__ */ jsx4(Globe2, { size: 14 })
+              }
+            ),
+            /* @__PURE__ */ jsx4("button", { className: "icon-btn", title: "\u4E0A\u4F20\u56FE\u7247", onClick: onUploadImage, children: /* @__PURE__ */ jsx4(ImageIcon2, { size: 14 }) }),
+            inputText.trim() || isLoading ? /* @__PURE__ */ jsx4(
+              "button",
+              {
+                className: `send-btn${isLoading ? " loading" : ""}`,
+                title: isLoading ? "\u505C\u6B62" : isMessageVariant ? "\u91CD\u65B0\u53D1\u9001" : "\u53D1\u9001",
+                onClick: handleSendOrCancel,
+                children: isLoading ? /* @__PURE__ */ jsx4(Square, { size: 14 }) : /* @__PURE__ */ jsx4(ArrowUp, { size: 14 })
+              }
+            ) : /* @__PURE__ */ jsx4("button", { className: "icon-btn", title: "\u8BED\u97F3\u8F93\u5165", children: /* @__PURE__ */ jsx4(Mic, { size: 14 }) })
+          ] })
+        ] })
+      ]
+    }
+  ) });
+};
+
+// src/components/chat/messages/MessageBubble.tsx
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+function defaultRenderMarkdown(content) {
+  const parts = content.split(/(```[\s\S]*?```)/g);
+  return parts.map((part, i) => {
+    if (part.startsWith("```") && part.endsWith("```")) {
+      const code = part.slice(3, -3);
+      const firstLine = code.indexOf("\n");
+      const lang = firstLine > 0 ? code.slice(0, firstLine).trim() : "";
+      const codeContent = firstLine > 0 ? code.slice(firstLine + 1) : code;
+      return /* @__PURE__ */ jsx5("pre", { children: /* @__PURE__ */ jsx5("code", { children: codeContent }) }, i);
+    }
+    const inlineParts = part.split(/(`[^`]+`)/g);
+    return /* @__PURE__ */ jsx5("span", { children: inlineParts.map((p, j) => {
+      if (p.startsWith("`") && p.endsWith("`")) {
+        return /* @__PURE__ */ jsx5("code", { children: p.slice(1, -1) }, j);
+      }
+      return p;
+    }) }, i);
+  });
+}
+var MessageBubble = ({
+  role,
+  content,
+  images,
+  thinking,
+  thinkingComplete = true,
+  thinkingDuration,
+  searchResults,
+  searching,
+  toolCalls,
+  copied,
+  loading,
+  onCopy,
+  onRegenerate,
+  onSend,
+  renderMarkdown = defaultRenderMarkdown
+}) => {
+  const isUser = role === "user";
+  return /* @__PURE__ */ jsx5("div", { className: "message-bubble", children: isUser ? /* @__PURE__ */ jsx5(
+    ChatInput,
+    {
+      variant: "message",
+      value: content,
+      selectedImages: images,
+      onSend
+    }
+  ) : (
+    /* AI 消息 */
+    /* @__PURE__ */ jsxs5("div", { className: "assistant-message", children: [
+      /* @__PURE__ */ jsx5(
+        ExecutionSteps,
+        {
+          loading,
+          hasContent: !!content,
+          thinking,
+          thinkingComplete,
+          thinkingDuration,
+          searching,
+          searchResults,
+          toolCalls
+        }
+      ),
+      content && /* @__PURE__ */ jsx5("div", { className: "message-content", children: renderMarkdown(content) }),
+      content && !loading && /* @__PURE__ */ jsxs5("div", { className: "message-actions", children: [
+        /* @__PURE__ */ jsx5("button", { className: `action-btn${copied ? " copied" : ""}`, onClick: onCopy, title: "\u590D\u5236", children: copied ? /* @__PURE__ */ jsx5(Check2, { size: 14 }) : /* @__PURE__ */ jsx5(Copy, { size: 14 }) }),
+        /* @__PURE__ */ jsx5("button", { className: "action-btn", onClick: onRegenerate, title: "\u91CD\u65B0\u751F\u6210", children: /* @__PURE__ */ jsx5(RefreshCw, { size: 14 }) })
+      ] })
+    ] })
+  ) });
+};
+
+// src/components/ChatPanel.tsx
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+var ChatPanel = ({
+  adapter,
+  workingDir,
+  defaultModel = "anthropic/claude-opus-4.5",
+  defaultMode = "agent",
+  models = DEFAULT_MODELS,
+  hideHeader = false,
+  onClose,
+  className = "",
+  renderMarkdown
+}) => {
+  const messagesRef = useRef4(null);
+  const {
+    sessions,
+    currentSessionId,
+    messages,
+    isLoading,
+    mode,
+    model,
+    webSearch,
+    thinking,
+    loadSessions,
+    switchSession,
+    createNewSession,
+    deleteSession,
+    sendMessage,
+    cancelRequest,
+    copyMessage,
+    regenerateMessage,
+    setMode,
+    setModel,
+    setWebSearch,
+    setThinking,
+    setWorkingDirectory
+  } = useChat({
+    adapter,
+    defaultModel,
+    defaultMode
+  });
+  useEffect3(() => {
+    loadSessions();
+  }, [loadSessions]);
+  useEffect3(() => {
+    if (workingDir) {
+      setWorkingDirectory(workingDir);
+    }
+  }, [workingDir, setWorkingDirectory]);
+  const scrollToBottom = useCallback4(() => {
+    if (messagesRef.current) {
+      messagesRef.current.scrollTop = messagesRef.current.scrollHeight;
+    }
+  }, []);
+  useEffect3(() => {
+    scrollToBottom();
+  }, [messages, scrollToBottom]);
+  const handleSend = useCallback4(
+    (text) => {
+      sendMessage(text);
+    },
+    [sendMessage]
+  );
+  const handleQuickAction = useCallback4(
+    (text) => {
+      sendMessage(text);
+    },
+    [sendMessage]
+  );
+  const handleResend = useCallback4(
+    (index, text) => {
+      sendMessage(text);
+    },
+    [sendMessage]
+  );
+  const handleClose = useCallback4(() => {
+    onClose?.();
+  }, [onClose]);
+  const handleClearAll = useCallback4(() => {
+    console.log("\u6E05\u7A7A\u6240\u6709\u5BF9\u8BDD");
+  }, []);
+  const handleCloseOthers = useCallback4(() => {
+    console.log("\u5173\u95ED\u5176\u4ED6\u5BF9\u8BDD");
+  }, []);
+  const handleExport = useCallback4(() => {
+    console.log("\u5BFC\u51FA\u5BF9\u8BDD");
+  }, []);
+  const handleCopyId = useCallback4(() => {
+    if (currentSessionId) {
+      navigator.clipboard.writeText(currentSessionId);
+      console.log("\u5DF2\u590D\u5236\u8BF7\u6C42 ID:", currentSessionId);
+    }
+  }, [currentSessionId]);
+  const handleFeedback = useCallback4(() => {
+    console.log("\u53CD\u9988");
+  }, []);
+  const handleSettings = useCallback4(() => {
+    console.log("Agent \u8BBE\u7F6E");
+  }, []);
+  return /* @__PURE__ */ jsxs6("div", { className: `chat-panel ${className}`.trim(), children: [
+    !hideHeader && /* @__PURE__ */ jsx6(
+      ChatHeader,
+      {
+        sessions,
+        currentSessionId,
+        showClose: !!onClose,
+        onNewSession: createNewSession,
+        onSwitchSession: switchSession,
+        onDeleteSession: deleteSession,
+        onClose: handleClose,
+        onClearAll: handleClearAll,
+        onCloseOthers: handleCloseOthers,
+        onExport: handleExport,
+        onCopyId: handleCopyId,
+        onFeedback: handleFeedback,
+        onSettings: handleSettings
+      }
+    ),
+    /* @__PURE__ */ jsx6("div", { ref: messagesRef, className: "messages-container", children: messages.length === 0 ? /* @__PURE__ */ jsx6(WelcomeMessage, { onQuickAction: handleQuickAction }) : messages.map((msg, index) => /* @__PURE__ */ jsx6(
+      MessageBubble,
+      {
+        role: msg.role,
+        content: msg.content,
+        images: msg.images,
+        thinking: msg.thinking,
+        thinkingComplete: msg.thinkingComplete,
+        searchResults: msg.searchResults,
+        searching: msg.searching,
+        toolCalls: msg.toolCalls,
+        copied: msg.copied,
+        loading: msg.loading,
+        onCopy: () => copyMessage(msg.id),
+        onRegenerate: () => regenerateMessage(index),
+        onSend: (text) => handleResend(index, text),
+        renderMarkdown
+      },
+      msg.id
+    )) }),
+    /* @__PURE__ */ jsx6(
+      ChatInput,
+      {
+        selectedImages: [],
+        isLoading,
+        mode,
+        model,
+        models,
+        webSearchEnabled: webSearch,
+        thinkingEnabled: thinking,
+        onSend: handleSend,
+        onCancel: cancelRequest,
+        onModeChange: setMode,
+        onModelChange: setModel,
+        onWebSearchChange: setWebSearch,
+        onThinkingChange: setThinking
+      }
+    )
+  ] });
+};
+export {
+  ChatHeader,
+  ChatInput,
+  ChatPanel,
+  DEFAULT_MODELS,
+  ExecutionSteps,
+  FileType,
+  MessageBubble,
+  WelcomeMessage,
+  createNullAdapter,
+  useChat
+};
+//# sourceMappingURL=index.js.map