@axiom-lattice/react-sdk 2.0.3 → 2.0.4

package/dist/index.mjs

@@ -71,9 +71,22 @@ function useChat(threadId, options = {}) {
   }, [options.initialMessages]);
   const handleStreamEvent = useCallback((chunk) => {
     chunkMessageMerger.current.push(chunk);
+    let todos;
+    if (chunk.type === "tool" && chunk.data && typeof chunk.data.content === "string" && chunk.data.content.startsWith("```todo_list")) {
+      try {
+        const content = chunk.data.content;
+        const match = content.match(/```todo_list\s*([\s\S]*?)\s*```/);
+        if (match && match[1]) {
+          todos = JSON.parse(match[1]);
+        }
+      } catch (e) {
+        console.error("Failed to parse todo list from chunk", e);
+      }
+    }
     const updatedMessages = chunkMessageMerger.current.getMessages();
     setState((prev) => ({
       ...prev,
+      todos: todos || prev.todos,
       messages: updatedMessages,
       isLoading: true,
       streamingMessage: null
@@ -204,14 +217,14 @@ function useChat(threadId, options = {}) {
       }
       setState((prev) => ({ ...prev, isLoading: true, error: null }));
       try {
-        const fetchedMessages = await client.getMessages({
-          threadId,
-          limit
-        });
+        const agentState = await client.getAgentState(threadId);
+        const fetchedMessages = await client.getMessages({ threadId });
         chunkMessageMerger.current.reset();
         chunkMessageMerger.current.initialMessages(fetchedMessages);
         setState((prev) => ({
           ...prev,
+          agentState,
+          todos: agentState?.values?.todos,
           messages: chunkMessageMerger.current.getMessages(),
           isLoading: false
         }));
@@ -1527,7 +1540,9 @@ var IFrameCard = ({ src }) => {
 // src/components/Chat/Chating.tsx
 import {
   CloudUploadOutlined,
-  PaperClipOutlined
+  PaperClipOutlined,
+  FileTextOutlined as FileTextOutlined2,
+  CheckSquareOutlined
 } from "@ant-design/icons";
 import {
   Attachments,
@@ -1543,28 +1558,221 @@ import {
   Button as Button3,
   Flex as Flex3,
   Space as Space6,
-  message
+  message,
+  Modal,
+  Tooltip,
+  Popover
 } from "antd";
 import ErrorBoundary from "antd/es/alert/ErrorBoundary";
-import React2, {
+import React3, {
   memo,
   useCallback as useCallback5,
-  useEffect as useEffect5,
-  useMemo as useMemo3,
+  useEffect as useEffect6,
+  useMemo as useMemo4,
   useRef as useRef5,
-  useState as useState8
+  useState as useState9
 } from "react";
 import { useTranslation } from "react-i18next";
-import { Fragment, jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
+
+// src/components/FileExplorer.tsx
+import { useState as useState8, useEffect as useEffect5, useMemo as useMemo3 } from "react";
+import { Tabs, Empty } from "antd";
+import {
+  FileOutlined,
+  FileTextOutlined,
+  FileMarkdownOutlined,
+  FileImageOutlined,
+  CodeOutlined as CodeOutlined2,
+  Html5Outlined,
+  FileUnknownOutlined
+} from "@ant-design/icons";
+import { createStyles as createStyles5 } from "antd-style";
+import { jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
+var useStyles2 = createStyles5(({ token, css }) => ({
+  container: css`
+    height: 100%;
+    background: ${token.colorBgContainer};
+    border: 1px solid ${token.colorBorder};
+    border-radius: ${token.borderRadiusLG}px;
+    overflow: hidden;
+    display: flex;
+    flex-direction: column;
+  `,
+  tabs: css`
+    height: 100%;
+
+    .ant-tabs-nav {
+      margin-bottom: 0 !important;
+      padding: 0 16px;
+      border-bottom: 1px solid ${token.colorBorderSecondary};
+    }
+
+    .ant-tabs-content-holder {
+      height: 100%;
+      overflow: hidden;
+    }
+
+    .ant-tabs-content {
+      height: 100%;
+    }
+
+    .ant-tabs-tabpane {
+      height: 100%;
+      outline: none;
+    }
+  `,
+  contentBody: css`
+    padding: 24px;
+    height: 100%;
+    overflow-y: auto;
+
+    pre {
+      margin: 0 !important;
+      border-radius: ${token.borderRadius}px !important;
+    }
+  `,
+  emptyState: css`
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+    color: ${token.colorTextQuaternary};
+  `
+}));
+var getFileIcon = (filename) => {
+  const ext = filename.split(".").pop()?.toLowerCase();
+  switch (ext) {
+    case "ts":
+    case "tsx":
+    case "js":
+    case "jsx":
+      return /* @__PURE__ */ jsx10(CodeOutlined2, {});
+    case "html":
+      return /* @__PURE__ */ jsx10(Html5Outlined, {});
+    case "css":
+    case "less":
+    case "scss":
+      return /* @__PURE__ */ jsx10(FileUnknownOutlined, {});
+    // Or a style icon if available
+    case "md":
+      return /* @__PURE__ */ jsx10(FileMarkdownOutlined, {});
+    case "json":
+      return /* @__PURE__ */ jsx10(FileTextOutlined, {});
+    case "png":
+    case "jpg":
+    case "jpeg":
+    case "gif":
+    case "svg":
+      return /* @__PURE__ */ jsx10(FileImageOutlined, {});
+    default:
+      return /* @__PURE__ */ jsx10(FileOutlined, {});
+  }
+};
+function getLanguageFromFileName(filename) {
+  const ext = filename.split(".").pop()?.toLowerCase();
+  switch (ext) {
+    case "ts":
+    case "tsx":
+      return "typescript";
+    case "js":
+    case "jsx":
+      return "javascript";
+    case "py":
+      return "python";
+    case "md":
+      return "markdown";
+    case "json":
+      return "json";
+    case "html":
+      return "html";
+    case "css":
+      return "css";
+    case "java":
+      return "java";
+    case "go":
+      return "go";
+    case "rs":
+      return "rust";
+    case "c":
+      return "c";
+    case "cpp":
+      return "cpp";
+    case "yaml":
+    case "yml":
+      return "yaml";
+    case "sql":
+      return "sql";
+    case "sh":
+    case "bash":
+      return "bash";
+    default:
+      return "text";
+  }
+}
+var FileExplorer = ({
+  files = [],
+  className,
+  style,
+  title = "EXPLORER"
+}) => {
+  const { styles, cx } = useStyles2();
+  const [fileList, setFileList] = useState8([]);
+  useEffect5(() => {
+    if (Array.isArray(files)) {
+      setFileList(files);
+    } else {
+      const list = Object.keys(files).map((key) => ({
+        name: key,
+        content: files[key]
+      }));
+      setFileList(list);
+    }
+  }, [files]);
+  const items = useMemo3(() => {
+    return fileList.map((file) => {
+      const language = file.language || getLanguageFromFileName(file.name);
+      const content = `\`\`\`${language}
+${file.content}
+\`\`\``;
+      return {
+        key: file.name,
+        label: /* @__PURE__ */ jsxs6("span", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
+          getFileIcon(file.name),
+          file.name
+        ] }),
+        children: /* @__PURE__ */ jsx10("div", { className: styles.contentBody, children: /* @__PURE__ */ jsx10(MDResponse, { content }) })
+      };
+    });
+  }, [fileList, styles]);
+  return /* @__PURE__ */ jsx10("div", { className: cx(styles.container, className), style, children: fileList.length > 0 ? /* @__PURE__ */ jsx10(
+    Tabs,
+    {
+      defaultActiveKey: fileList[0]?.name,
+      items,
+      className: styles.tabs,
+      tabBarStyle: { margin: 0 }
+    }
+  ) : /* @__PURE__ */ jsx10("div", { className: styles.emptyState, children: /* @__PURE__ */ jsx10(
+    Empty,
+    {
+      description: "No file selected",
+      image: Empty.PRESENTED_IMAGE_SIMPLE
+    }
+  ) }) });
+};
+
+// src/components/Chat/Chating.tsx
+import { Fragment, jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
 var LazyBubble = ({
   message: message2,
   renderContent,
   autoLoadRightPanel
 }) => {
   const ref = useRef5(null);
-  const [isVisible, setIsVisible] = useState8(false);
-  const [wasEverVisible, setWasEverVisible] = useState8(false);
-  useEffect5(() => {
+  const [isVisible, setIsVisible] = useState9(false);
+  const [wasEverVisible, setWasEverVisible] = useState9(false);
+  useEffect6(() => {
     const observer = new IntersectionObserver(
       ([entry]) => {
         const visible = entry.isIntersecting;
@@ -1584,21 +1792,21 @@ var LazyBubble = ({
       }
     };
   }, [wasEverVisible]);
-  useEffect5(() => {
+  useEffect6(() => {
     autoLoadRightPanel?.();
   }, []);
   const getPlaceholder = () => {
     const estimatedHeight = message2.content ? Math.min(100, message2.content.length / 5) : 100;
-    return /* @__PURE__ */ jsx10("div", { style: { height: `${estimatedHeight}px`, minHeight: "50px" } });
+    return /* @__PURE__ */ jsx11("div", { style: { height: `${estimatedHeight}px`, minHeight: "50px" } });
   };
-  return /* @__PURE__ */ jsx10(ErrorBoundary, { children: /* @__PURE__ */ jsx10("div", { ref, style: { width: "100%" }, children: isVisible || wasEverVisible ? renderContent(message2) : getPlaceholder() }) });
+  return /* @__PURE__ */ jsx11(ErrorBoundary, { children: /* @__PURE__ */ jsx11("div", { ref, style: { width: "100%" }, children: isVisible || wasEverVisible ? renderContent(message2) : getPlaceholder() }) });
 };
 var MemoizedBubbleList = memo(
   ({
     items,
     roles,
     className
-  }) => /* @__PURE__ */ jsx10(
+  }) => /* @__PURE__ */ jsx11(
     Bubble.List,
     {
       autoScroll: true,
@@ -1631,15 +1839,18 @@ var Chating = ({
   extra,
   attachment_placeholder,
   extraMeta = [],
-  uploadAction = "/api/file_storage/upload?path=temp"
+  uploadAction = "/api/file_storage/upload?path=temp",
+  files,
+  todos
 }) => {
   const { t } = useTranslation();
-  const [content, setContent] = useState8("");
-  const [attachedFiles, setAttachedFiles] = useState8([]);
-  const [headerOpen, setHeaderOpen] = useState8(false);
+  const [content, setContent] = useState9("");
+  const [attachedFiles, setAttachedFiles] = useState9([]);
+  const [headerOpen, setHeaderOpen] = useState9(false);
+  const [fileExplorerVisible, setFileExplorerVisible] = useState9(false);
   const attachmentsRef = useRef5(null);
-  const senderRef = React2.useRef(null);
-  useEffect5(() => {
+  const senderRef = React3.useRef(null);
+  useEffect6(() => {
     regsiterElement("action_show_attachments_uploader", {
       card_view: () => null,
       action: (data) => {
@@ -1649,18 +1860,18 @@ var Chating = ({
     });
   }, []);
   const messageLengthRef = useRef5(messages?.length ?? 0);
-  useEffect5(() => {
+  useEffect6(() => {
     if (messages?.length) {
       messageLengthRef.current = messages?.length;
     }
   }, [messages?.length]);
   const renderContent = useCallback5(
     (message2) => {
-      const { content: content2, files, id } = message2;
+      const { content: content2, files: files2, id } = message2;
       try {
         const json = JSON.parse(content2);
         if (json.action && json.message) {
-          return /* @__PURE__ */ jsx10(
+          return /* @__PURE__ */ jsx11(
             MDResponse,
             {
               content: json.message,
@@ -1676,7 +1887,7 @@ ${JSON.stringify(tool_call)}
 \`\`\``;
       }) || [];
       const content_md = [content2, ...tool_calls_md].join("\n");
-      return /* @__PURE__ */ jsx10(Space6, { direction: "vertical", style: { width: "100%" }, children: /* @__PURE__ */ jsx10(
+      return /* @__PURE__ */ jsx11(Space6, { direction: "vertical", style: { width: "100%" }, children: /* @__PURE__ */ jsx11(
         MDResponse,
         {
           content: content_md,
@@ -1686,12 +1897,12 @@ ${JSON.stringify(tool_call)}
     },
     [handleMDResponseEvent]
   );
-  const items = useMemo3(
+  const items = useMemo4(
     () => messages.map((message2, index) => ({
       key: message2.id,
       role: message2.role,
       typing: false,
-      content: /* @__PURE__ */ jsx10(
+      content: /* @__PURE__ */ jsx11(
         LazyBubble,
         {
           message: message2,
@@ -1747,7 +1958,7 @@ ${JSON.stringify(tool_call)}
     if (!nextContent && attachedFiles.length > 0) {
       nextContent = default_submit_message || "\u8BB0\u8D26";
     }
-    const files = attachedFiles.map(
+    const files2 = attachedFiles.map(
       (file) => isArchiveFile(file) ? {
         name: file.response.zipFileName || file.response.rarFileName,
         id: file.response.zipFileId || file.response.rarFileId,
@@ -1765,14 +1976,14 @@ ${JSON.stringify(tool_call)}
         id: file.response.id
       }
     );
-    const files_md = files.length > 0 ? [
+    const files_md = files2.length > 0 ? [
       "",
       "\u6211\u5DF2\u7ECF\u63D0\u4EA4\u4E86\u4EE5\u4E0B\u6587\u4EF6\uFF1A",
       "```attachments",
-      JSON.stringify(files),
+      JSON.stringify(files2),
       "```"
     ].join("\n") : "";
-    sendMessage({ input: { message: nextContent + files_md, files } });
+    sendMessage({ input: { message: nextContent + files_md, files: files2 } });
     setContent("");
     setAttachedFiles([]);
     setHeaderOpen(false);
@@ -1804,15 +2015,15 @@ ${JSON.stringify(tool_call)}
     }
     return true;
   };
-  const attachmentsNode = /* @__PURE__ */ jsx10(Badge, { dot: attachedFiles.length > 0 && !headerOpen, children: /* @__PURE__ */ jsx10(
+  const attachmentsNode = /* @__PURE__ */ jsx11(Badge, { dot: attachedFiles.length > 0 && !headerOpen, children: /* @__PURE__ */ jsx11(
     Button3,
     {
       type: "text",
-      icon: /* @__PURE__ */ jsx10(PaperClipOutlined, {}),
+      icon: /* @__PURE__ */ jsx11(PaperClipOutlined, {}),
       onClick: () => setHeaderOpen(!headerOpen)
     }
   ) });
-  const senderHeader = /* @__PURE__ */ jsx10(
+  const senderHeader = /* @__PURE__ */ jsx11(
     Sender.Header,
     {
       title: "Attachments",
@@ -1824,7 +2035,7 @@ ${JSON.stringify(tool_call)}
         }
       },
       forceRender: true,
-      children: /* @__PURE__ */ jsx10(
+      children: /* @__PURE__ */ jsx11(
         Attachments,
         {
           ref: attachmentsRef,
@@ -1846,7 +2057,7 @@ ${JSON.stringify(tool_call)}
           multiple: true,
           maxCount: 10,
           placeholder: (type) => ({
-            icon: /* @__PURE__ */ jsx10(CloudUploadOutlined, {}),
+            icon: /* @__PURE__ */ jsx11(CloudUploadOutlined, {}),
             title: "\u4E0A\u4F20\u6587\u4EF6",
             description: attachment_placeholder
           })
@@ -1878,7 +2089,7 @@ ${JSON.stringify(tool_call)}
       }
     }
   };
-  const extraMetaComponents = useMemo3(() => {
+  const extraMetaComponents = useMemo4(() => {
     if (extraMeta?.length > 0) {
       return extraMeta.map((meta) => {
         const Element = getElement(meta.id)?.card_view;
@@ -1887,7 +2098,7 @@ ${JSON.stringify(tool_call)}
           try {
           } catch (error2) {
           }
-          return /* @__PURE__ */ jsx10(
+          return /* @__PURE__ */ jsx11(
             Element,
             {
               component_key: meta.id,
@@ -1903,20 +2114,63 @@ ${JSON.stringify(tool_call)}
     }
     return void 0;
   }, [extraMeta]);
-  return /* @__PURE__ */ jsxs6(Fragment, { children: [
-    /* @__PURE__ */ jsxs6("div", { children: [
-      /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsxs7(Fragment, { children: [
+    /* @__PURE__ */ jsxs7("div", { children: [
+      /* @__PURE__ */ jsx11(
         Welcome,
         {
           style: { padding: 8 },
           variant: "borderless",
           description,
-          icon: /* @__PURE__ */ jsx10(Avatar, { src: avatar || "/images/avatar.jpeg", size: 48 }),
+          icon: /* @__PURE__ */ jsx11(Avatar, { src: avatar || "/images/avatar.jpeg", size: 48 }),
           title: name || "Fina",
-          extra: extra || extraMetaComponents && /* @__PURE__ */ jsx10(Space6, { align: "center", style: { marginRight: 16 }, children: extraMetaComponents })
+          extra: /* @__PURE__ */ jsxs7(Space6, { children: [
+            extra,
+            todos && todos.length > 0 && /* @__PURE__ */ jsx11(
+              Popover,
+              {
+                content: /* @__PURE__ */ jsx11("div", { style: { width: 400 }, children: /* @__PURE__ */ jsx11(
+                  Todo,
+                  {
+                    data: todos,
+                    component_key: "header_todos",
+                    eventHandler: handleMDResponseEvent
+                  }
+                ) }),
+                title: "Todos",
+                trigger: "click",
+                placement: "bottomRight",
+                children: /* @__PURE__ */ jsx11(Tooltip, { title: "Todos", children: /* @__PURE__ */ jsx11(
+                  Badge,
+                  {
+                    count: todos.filter((item) => item.status !== "completed").length,
+                    size: "small",
+                    children: /* @__PURE__ */ jsx11(Button3, { icon: /* @__PURE__ */ jsx11(CheckSquareOutlined, {}), type: "text" })
+                  }
+                ) })
+              }
+            ),
+            files && Object.keys(files).length > 0 && /* @__PURE__ */ jsx11(Tooltip, { title: "File Explorer", children: /* @__PURE__ */ jsx11(
+              Badge,
+              {
+                count: Object.keys(files).length,
+                size: "small",
+                color: "blue",
+                children: /* @__PURE__ */ jsx11(
+                  Button3,
+                  {
+                    type: "text",
+                    icon: /* @__PURE__ */ jsx11(FileTextOutlined2, {}),
+                    onClick: () => setFileExplorerVisible(true)
+                  }
+                )
+              }
+            ) }),
+            extraMetaComponents && /* @__PURE__ */ jsx11(Space6, { align: "center", style: { marginRight: 16 }, children: extraMetaComponents })
+          ] })
         }
       ),
-      /* @__PURE__ */ jsx10(
+      /* @__PURE__ */ jsx11(
         "div",
         {
           style: {
@@ -1925,16 +2179,35 @@ ${JSON.stringify(tool_call)}
         }
       )
     ] }),
-    items.length > 0 ? /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11(
+      Modal,
+      {
+        title: "File Explorer",
+        open: fileExplorerVisible,
+        onCancel: () => setFileExplorerVisible(false),
+        footer: null,
+        width: 1e3,
+        destroyOnClose: true,
+        styles: { body: { height: "70vh", padding: 0 } },
+        children: /* @__PURE__ */ jsx11(
+          FileExplorer,
+          {
+            files,
+            style: { height: "100%", border: "none" }
+          }
+        )
+      }
+    ),
+    items.length > 0 ? /* @__PURE__ */ jsx11(
       MemoizedBubbleList,
       {
         items,
         roles,
         className: styles.messages
       }
-    ) : /* @__PURE__ */ jsx10("div", { style: { flex: 1 } }),
-    isLoading ? /* @__PURE__ */ jsx10("div", { children: /* @__PURE__ */ jsx10(Bubble, { loading: isLoading, variant: "borderless" }) }) : /* @__PURE__ */ jsx10(Prompts, { items: senderPromptsItems, onItemClick: onPromptsItemClick }),
-    error && /* @__PURE__ */ jsx10("div", { style: { padding: "0 16px 8px" }, children: /* @__PURE__ */ jsx10(
+    ) : /* @__PURE__ */ jsx11("div", { style: { flex: 1 } }),
+    isLoading ? /* @__PURE__ */ jsx11("div", { children: /* @__PURE__ */ jsx11(Bubble, { loading: isLoading, variant: "borderless" }) }) : /* @__PURE__ */ jsx11(Prompts, { items: senderPromptsItems, onItemClick: onPromptsItemClick }),
+    error && /* @__PURE__ */ jsx11("div", { style: { padding: "0 16px 8px" }, children: /* @__PURE__ */ jsx11(
       Alert2,
       {
         type: "error",
@@ -1944,7 +2217,7 @@ ${JSON.stringify(tool_call)}
         message: `${error.message}`
       }
     ) }),
-    /* @__PURE__ */ jsx10(
+    /* @__PURE__ */ jsx11(
       Sender,
       {
         allowSpeech: true,
@@ -1959,7 +2232,7 @@ ${JSON.stringify(tool_call)}
         className: styles.sender,
         actions: (ori, { components }) => {
           const { SendButton, LoadingButton } = components;
-          return /* @__PURE__ */ jsx10(Flex3, { justify: "space-between", align: "center", children: isLoading ? /* @__PURE__ */ jsx10(LoadingButton, { type: "default" }) : /* @__PURE__ */ jsx10(
+          return /* @__PURE__ */ jsx11(Flex3, { justify: "space-between", align: "center", children: isLoading ? /* @__PURE__ */ jsx11(LoadingButton, { type: "default" }) : /* @__PURE__ */ jsx11(
             SendButton,
             {
               type: "primary",
@@ -1968,8 +2241,8 @@ ${JSON.stringify(tool_call)}
             }
           ) });
         },
-        onPasteFile: (_, files) => {
-          Array.from(files).forEach((file) => {
+        onPasteFile: (_, files2) => {
+          Array.from(files2).forEach((file) => {
             attachmentsRef.current?.upload(file);
           });
           setHeaderOpen(true);
@@ -1988,17 +2261,17 @@ import {
 import {
   ThoughtChain
 } from "@ant-design/x";
-import { jsx as jsx11 } from "react/jsx-runtime";
+import { jsx as jsx12 } from "react/jsx-runtime";
 function getStatusIcon2(status) {
   switch (status) {
     case "success":
-      return /* @__PURE__ */ jsx11(CheckCircleOutlined3, {});
+      return /* @__PURE__ */ jsx12(CheckCircleOutlined3, {});
     case "error":
-      return /* @__PURE__ */ jsx11(InfoCircleOutlined2, {});
+      return /* @__PURE__ */ jsx12(InfoCircleOutlined2, {});
     case "pending":
-      return /* @__PURE__ */ jsx11(LoadingOutlined3, {});
+      return /* @__PURE__ */ jsx12(LoadingOutlined3, {});
     default:
-      return /* @__PURE__ */ jsx11(CheckCircleOutlined3, {});
+      return /* @__PURE__ */ jsx12(CheckCircleOutlined3, {});
   }
 }
 var ThinkingChain = ({ message: message2 }) => {
@@ -2007,12 +2280,12 @@ var ThinkingChain = ({ message: message2 }) => {
     {
       key: message2.id,
       title,
-      content: /* @__PURE__ */ jsx11(MDResponse, { content: message2.content }),
+      content: /* @__PURE__ */ jsx12(MDResponse, { content: message2.content }),
       status: message2.status,
       icon: getStatusIcon2(message2.status)
     }
   ];
-  return /* @__PURE__ */ jsx11(
+  return /* @__PURE__ */ jsx12(
     ThoughtChain,
     {
       items,
@@ -2026,11 +2299,11 @@ var ThinkingChainGroup = ({ message: message2 }) => {
   const children = message2.items?.map((item) => ({
     key: item.id,
     title: item.name || item.content.split("\n")[0],
-    content: /* @__PURE__ */ jsx11(MDResponse, { content: item.content }),
+    content: /* @__PURE__ */ jsx12(MDResponse, { content: item.content }),
     status: item.status,
     icon: getStatusIcon2(item.status)
   }));
-  return /* @__PURE__ */ jsx11(ThoughtChain, { items: children, collapsible: true, size: "small" });
+  return /* @__PURE__ */ jsx12(ThoughtChain, { items: children, collapsible: true, size: "small" });
 };
 
 // src/components/Chat/SideAppViewBrowser.tsx
@@ -2040,11 +2313,11 @@ import {
   ExpandOutlined,
   FullscreenOutlined
 } from "@ant-design/icons";
-import { Button as Button4, Tabs } from "antd";
-import { createStyles as createStyles5 } from "antd-style";
-import { useEffect as useEffect6, useState as useState9 } from "react";
-import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
-var useStyle4 = createStyles5(({ token, css }) => {
+import { Button as Button4, Tabs as Tabs2 } from "antd";
+import { createStyles as createStyles6 } from "antd-style";
+import { useEffect as useEffect7, useState as useState10 } from "react";
+import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
+var useStyle4 = createStyles6(({ token, css }) => {
   return {
     tabContainer: css`
       .ant-tabs-content-holder {
@@ -2063,9 +2336,9 @@ var useStyle4 = createStyles5(({ token, css }) => {
   };
 });
 var EmptySideAppView = ({ component_key, data }) => {
-  return /* @__PURE__ */ jsxs7("div", { children: [
-    /* @__PURE__ */ jsx12("p", { children: "\u672A\u627E\u5230\u5BF9\u5E94\u7684\u7EC4\u4EF6\u89C6\u56FE" }),
-    /* @__PURE__ */ jsx12("pre", { children: JSON.stringify({ component_key, data }, null, 2) })
+  return /* @__PURE__ */ jsxs8("div", { children: [
+    /* @__PURE__ */ jsx13("p", { children: "\u672A\u627E\u5230\u5BF9\u5E94\u7684\u7EC4\u4EF6\u89C6\u56FE" }),
+    /* @__PURE__ */ jsx13("pre", { children: JSON.stringify({ component_key, data }, null, 2) })
   ] });
 };
 var SideAppViewBrowser = ({
@@ -2075,9 +2348,9 @@ var SideAppViewBrowser = ({
   onChangeSize
 }) => {
   const { styles } = useStyle4();
-  const [activeKey, setActiveKey] = useState9(JSON.stringify(open_uri));
-  const [currentSize, setCurrentSize] = useState9(open_uri.size || "large");
-  const [items, setItems] = useState9([]);
+  const [activeKey, setActiveKey] = useState10(JSON.stringify(open_uri));
+  const [currentSize, setCurrentSize] = useState10(open_uri.size || "large");
+  const [items, setItems] = useState10([]);
   const add = (key, label, children) => {
     const newActiveKey = key;
     const newPanes = [...items];
@@ -2113,7 +2386,7 @@ var SideAppViewBrowser = ({
       remove(targetKey);
     }
   };
-  useEffect6(() => {
+  useEffect7(() => {
     const SideAppView = getElement(open_uri.component_key).side_app_view || EmptySideAppView;
     const key = JSON.stringify(open_uri);
     if (items.find((item) => item.key === key)) {
@@ -2123,7 +2396,7 @@ var SideAppViewBrowser = ({
     add(
       key,
       open_uri.message || open_uri.data.message || "\u672A\u547D\u540D",
-      /* @__PURE__ */ jsx12(
+      /* @__PURE__ */ jsx13(
         SideAppView,
         {
           component_key: open_uri.component_key,
@@ -2133,7 +2406,7 @@ var SideAppViewBrowser = ({
       )
     );
   }, [open_uri]);
-  useEffect6(() => {
+  useEffect7(() => {
     if (open_uri.size && open_uri.size !== currentSize) {
       setCurrentSize(open_uri.size);
     }
@@ -2171,25 +2444,25 @@ var SideAppViewBrowser = ({
   const getSizeIcon = (size) => {
     switch (size) {
       case "middle":
-        return /* @__PURE__ */ jsx12(CompressOutlined, {});
+        return /* @__PURE__ */ jsx13(CompressOutlined, {});
       case "large":
-        return /* @__PURE__ */ jsx12(ExpandOutlined, {});
+        return /* @__PURE__ */ jsx13(ExpandOutlined, {});
       case "full":
-        return /* @__PURE__ */ jsx12(FullscreenOutlined, {});
+        return /* @__PURE__ */ jsx13(FullscreenOutlined, {});
       default:
-        return /* @__PURE__ */ jsx12(ExpandOutlined, {});
+        return /* @__PURE__ */ jsx13(ExpandOutlined, {});
     }
   };
-  return /* @__PURE__ */ jsx12(
-    Tabs,
+  return /* @__PURE__ */ jsx13(
+    Tabs2,
     {
       className: styles.tabContainer,
       type: "editable-card",
       style: { height: "100%" },
       hideAdd: true,
       tabBarExtraContent: {
-        right: /* @__PURE__ */ jsxs7("div", { style: { display: "flex", gap: "4px" }, children: [
-          /* @__PURE__ */ jsx12(
+        right: /* @__PURE__ */ jsxs8("div", { style: { display: "flex", gap: "4px" }, children: [
+          /* @__PURE__ */ jsx13(
             Button4,
             {
               style: { margin: "8px 0" },
@@ -2200,13 +2473,13 @@ var SideAppViewBrowser = ({
               title: `\u5F53\u524D\u5C3A\u5BF8: ${getSizeLabel(currentSize)}, \u70B9\u51FB\u5207\u6362`
             }
           ),
-          /* @__PURE__ */ jsx12(
+          /* @__PURE__ */ jsx13(
             Button4,
             {
               style: { margin: "8px 0" },
               size: "large",
               type: "text",
-              icon: /* @__PURE__ */ jsx12(CloseOutlined, {}),
+              icon: /* @__PURE__ */ jsx13(CloseOutlined, {}),
               onClick: () => {
                 onClose();
               }
@@ -2231,6 +2504,7 @@ var chatContext = createContext2({
 export {
   AxiomLatticeProvider,
   Chating,
+  FileExplorer,
   MDMermaid,
   MDResponse,
   MDViewFormItem,