@ant-design/agentic-ui 2.0.10 → 2.0.12

package/dist/Workspace/File/PreviewComponent.js

@@ -33,8 +33,8 @@ import {
 } from "antd";
 import classNames from "classnames";
 import React, { useContext, useEffect, useRef, useState } from "react";
-import { ActionIconBox } from "../../components/ActionIconBox";
-import { I18nContext } from "../../i18n";
+import { ActionIconBox } from "../../Components/ActionIconBox";
+import { I18nContext } from "../../I18n";
 import {
   MarkdownEditor
 } from "../../MarkdownEditor";
@@ -47,6 +47,27 @@ import {
 import { fileTypeProcessor } from "./FileTypeProcessor";
 import { useFileStyle } from "./style";
 import { getFileTypeIcon } from "./utils";
+var HTML_MIME_TYPE = "text/html";
+var HTML_EXTENSIONS = [".html", ".htm"];
+var EDITOR_PADDING = "0 12px";
+var isHtmlFile = (fileName, mimeType) => {
+  const name = (fileName == null ? void 0 : fileName.toLowerCase()) || "";
+  const byExtension = HTML_EXTENSIONS.some((ext) => name.endsWith(ext));
+  const byMimeType = mimeType === HTML_MIME_TYPE;
+  return byExtension || byMimeType;
+};
+var getContentStatus = (state) => {
+  if ("error" in state)
+    return "error";
+  return state.status === "loading" ? "loading" : "done";
+};
+var buildMarkdownContent = (raw, category, fileName) => {
+  if (category === "code") {
+    const language = getLanguageFromFilename(fileName);
+    return wrapContentInCodeBlock(raw, language);
+  }
+  return raw;
+};
 var PlaceholderContent = ({
   children,
   showFileInfo,
@@ -131,29 +152,21 @@ var PreviewComponent = ({
     }
   }, [file, customContent]);
   useEffect(() => {
-    if (customContent)
-      return;
-    if (!processResult)
+    if (customContent || !processResult)
       return;
     const { typeInference, dataSource } = processResult;
-    if (typeInference.category !== "text" && typeInference.category !== "code")
+    const isTextOrCode = typeInference.category === "text" || typeInference.category === "code";
+    if (!isTextOrCode)
       return;
-    const buildMd = (raw) => {
-      if (typeInference.category === "code") {
-        const language = getLanguageFromFilename(file.name);
-        return wrapContentInCodeBlock(raw, language);
-      }
-      return raw;
-    };
-    const setReady = (raw) => {
+    const setReadyContent = (raw) => {
       setContentState({
         status: "ready",
-        mdContent: buildMd(raw),
+        mdContent: buildMarkdownContent(raw, typeInference.category, file.name),
         rawContent: raw
       });
     };
     if (dataSource.content) {
-      setReady(dataSource.content);
+      setReadyContent(dataSource.content);
       return;
     }
     if (dataSource.previewUrl) {
@@ -163,7 +176,7 @@ var PreviewComponent = ({
           throw new Error(`HTTP ${response.status}: ${response.statusText}`);
         }
         return response.text();
-      }).then((raw) => setReady(raw)).catch((err) => {
+      }).then(setReadyContent).catch((err) => {
         const errorMessage = err instanceof Error ? err.message : "加载文本内容失败";
         setContentState({ status: "error", error: errorMessage });
         console.error("加载文本内容失败:", err);
@@ -188,13 +201,10 @@ var PreviewComponent = ({
   useEffect(() => {
     setHtmlViewMode("preview");
   }, [file.name]);
-  const isHtmlFile = () => {
-    var _a2;
-    const name = ((_a2 = file.name) == null ? void 0 : _a2.toLowerCase()) || "";
-    const byExt = name.endsWith(".html") || name.endsWith(".htm");
-    const byMime = (processResult == null ? void 0 : processResult.dataSource.mimeType) === "text/html";
-    return Boolean(byExt || byMime);
-  };
+  const isCurrentFileHtml = isHtmlFile(
+    file.name,
+    processResult == null ? void 0 : processResult.dataSource.mimeType
+  );
   const renderPreviewContent = () => {
     if (file.loading) {
       return /* @__PURE__ */ React.createElement("div", { className: classNames(`${prefixCls}-content-loading `, hashId) }, /* @__PURE__ */ React.createElement(
@@ -342,68 +352,58 @@ var PreviewComponent = ({
         "下载"
       )));
     }
-    switch (typeInference.category) {
-      case "text":
-      case "code": {
-        if (isHtmlFile()) {
-          const toHtmlStatus = (s) => {
-            if ("error" in s)
-              return "error";
-            return s.status === "loading" ? "loading" : "done";
-          };
-          const htmlStatus = toHtmlStatus(contentState);
-          return /* @__PURE__ */ React.createElement("div", { className: classNames(`${prefixCls}-text`, hashId) }, /* @__PURE__ */ React.createElement(
-            HtmlPreview,
-            {
-              html: contentState.rawContent || "",
-              status: htmlStatus,
-              viewMode: htmlViewMode,
-              onViewModeChange: setHtmlViewMode,
-              iframeProps: { sandbox: "allow-scripts" },
-              showSegmented: false
-            }
-          ));
-        }
-        if (contentState.status === "loading") {
-          return /* @__PURE__ */ React.createElement(PlaceholderContent, { prefixCls, hashId }, /* @__PURE__ */ React.createElement(Spin, { size: "large", tip: "正在加载文件内容..." }));
-        }
+    const renderTextOrCode = () => {
+      if (isCurrentFileHtml) {
+        const htmlStatus = getContentStatus(contentState);
         return /* @__PURE__ */ React.createElement("div", { className: classNames(`${prefixCls}-text`, hashId) }, /* @__PURE__ */ React.createElement(
-          MarkdownEditor,
-          __spreadValues(__spreadValues({
-            editorRef
-          }, {
-            initValue: "",
-            readonly: true,
-            contentStyle: { padding: "0 12px" }
-          }), markdownEditorProps)
+          HtmlPreview,
+          {
+            html: contentState.rawContent || "",
+            status: htmlStatus,
+            viewMode: htmlViewMode,
+            onViewModeChange: setHtmlViewMode,
+            iframeProps: { sandbox: "allow-scripts" },
+            showSegmented: false
+          }
         ));
       }
-      case "image":
-        if (!dataSource.previewUrl) {
-          return /* @__PURE__ */ React.createElement(
-            PlaceholderContent,
-            {
-              locale,
-              prefixCls,
-              hashId
-            },
-            /* @__PURE__ */ React.createElement("p", null, (locale == null ? void 0 : locale["workspace.file.cannotGetImagePreview"]) || "无法获取图片预览")
-          );
-        }
-        return /* @__PURE__ */ React.createElement("div", { className: classNames(`${prefixCls}-image`, hashId) }, /* @__PURE__ */ React.createElement(Image, { src: dataSource.previewUrl, alt: file.name }));
-      case "video":
-        if (!dataSource.previewUrl) {
-          return /* @__PURE__ */ React.createElement(
-            PlaceholderContent,
-            {
-              locale,
-              prefixCls,
-              hashId
-            },
-            /* @__PURE__ */ React.createElement("p", null, (locale == null ? void 0 : locale["workspace.file.cannotGetVideoPreview"]) || "无法获取视频预览")
-          );
-        }
+      if (contentState.status === "loading") {
+        return /* @__PURE__ */ React.createElement(PlaceholderContent, { prefixCls, hashId }, /* @__PURE__ */ React.createElement(Spin, { size: "large", tip: "正在加载文件内容..." }));
+      }
+      return /* @__PURE__ */ React.createElement("div", { className: classNames(`${prefixCls}-text`, hashId) }, /* @__PURE__ */ React.createElement(
+        MarkdownEditor,
+        __spreadValues({
+          editorRef,
+          initValue: "",
+          readonly: true,
+          contentStyle: { padding: EDITOR_PADDING }
+        }, markdownEditorProps)
+      ));
+    };
+    const getPreviewErrorMessage = (category) => {
+      const messages = {
+        image: (locale == null ? void 0 : locale["workspace.file.cannotGetImagePreview"]) || "无法获取图片预览",
+        video: (locale == null ? void 0 : locale["workspace.file.cannotGetVideoPreview"]) || "无法获取视频预览",
+        audio: (locale == null ? void 0 : locale["workspace.file.cannotGetAudioPreview"]) || "无法获取音频预览",
+        pdf: (locale == null ? void 0 : locale["workspace.file.cannotGetPdfPreview"]) || "无法获取PDF预览"
+      };
+      return messages[category] || `无法获取${category}预览`;
+    };
+    const renderMediaPreview = (category) => {
+      if (!dataSource.previewUrl) {
         return /* @__PURE__ */ React.createElement(
+          PlaceholderContent,
+          {
+            locale,
+            prefixCls,
+            hashId
+          },
+          /* @__PURE__ */ React.createElement("p", null, getPreviewErrorMessage(category))
+        );
+      }
+      const mediaElements = {
+        image: /* @__PURE__ */ React.createElement("div", { className: classNames(`${prefixCls}-image`, hashId) }, /* @__PURE__ */ React.createElement(Image, { src: dataSource.previewUrl, alt: file.name })),
+        video: /* @__PURE__ */ React.createElement(
           "video",
           {
             className: classNames(`${prefixCls}-video`, hashId),
@@ -414,20 +414,8 @@ var PreviewComponent = ({
           },
           /* @__PURE__ */ React.createElement("track", { kind: "captions" }),
           "您的浏览器不支持视频播放"
-        );
-      case "audio":
-        if (!dataSource.previewUrl) {
-          return /* @__PURE__ */ React.createElement(
-            PlaceholderContent,
-            {
-              locale,
-              prefixCls,
-              hashId
-            },
-            /* @__PURE__ */ React.createElement("p", null, (locale == null ? void 0 : locale["workspace.file.cannotGetAudioPreview"]) || "无法获取音频预览")
-          );
-        }
-        return /* @__PURE__ */ React.createElement(
+        ),
+        audio: /* @__PURE__ */ React.createElement(
           "audio",
           {
             className: classNames(`${prefixCls}-audio`, hashId),
@@ -437,20 +425,8 @@ var PreviewComponent = ({
             preload: "metadata"
           },
           "您的浏览器不支持音频播放"
-        );
-      case "pdf":
-        if (!dataSource.previewUrl) {
-          return /* @__PURE__ */ React.createElement(
-            PlaceholderContent,
-            {
-              locale,
-              prefixCls,
-              hashId
-            },
-            /* @__PURE__ */ React.createElement("p", null, (locale == null ? void 0 : locale["workspace.file.cannotGetPdfPreview"]) || "无法获取PDF预览")
-          );
-        }
-        return /* @__PURE__ */ React.createElement(
+        ),
+        pdf: /* @__PURE__ */ React.createElement(
           "embed",
           {
             className: classNames(`${prefixCls}-pdf`, hashId),
@@ -459,7 +435,19 @@ var PreviewComponent = ({
             width: "100%",
             height: "100%"
           }
-        );
+        )
+      };
+      return mediaElements[category];
+    };
+    switch (typeInference.category) {
+      case "text":
+      case "code":
+        return renderTextOrCode();
+      case "image":
+      case "video":
+      case "audio":
+      case "pdf":
+        return renderMediaPreview(typeInference.category);
       default:
         return /* @__PURE__ */ React.createElement(
           PlaceholderContent,
@@ -513,7 +501,7 @@ var PreviewComponent = ({
       ));
     })()), ((_a = headerFileOverride == null ? void 0 : headerFileOverride.lastModified) != null ? _a : file.lastModified) && /* @__PURE__ */ React.createElement("div", { className: classNames(`${prefixCls}-generate-time`, hashId) }, (locale == null ? void 0 : locale["workspace.file.generationTime"]) || "生成时间：", formatLastModified(
       (_b = headerFileOverride == null ? void 0 : headerFileOverride.lastModified) != null ? _b : file.lastModified
-    ))), /* @__PURE__ */ React.createElement("div", { className: classNames(`${prefixCls}-actions`, hashId) }, !customContent && isHtmlFile() && /* @__PURE__ */ React.createElement(
+    ))), /* @__PURE__ */ React.createElement("div", { className: classNames(`${prefixCls}-actions`, hashId) }, !customContent && isCurrentFileHtml && /* @__PURE__ */ React.createElement(
       Segmented,
       {
         size: "small",

package/dist/Workspace/File/style.js

@@ -19,7 +19,7 @@ var __spreadValues = (a, b) => {
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 
 // src/Workspace/File/style.ts
-import { useEditorStyleRegister } from "../../hooks/useStyle";
+import { useEditorStyleRegister } from "../../Hooks/useStyle";
 var genStyle = (token) => {
   return {
     // 文件组件样式

package/dist/Workspace/HtmlPreview/index.js

@@ -23,7 +23,7 @@ import { ConfigProvider, Empty, Segmented, Spin } from "antd";
 import classNames from "classnames";
 import DOMPurify from "dompurify";
 import React, { useContext, useMemo, useState } from "react";
-import { I18nContext } from "../../i18n";
+import { I18nContext } from "../../I18n";
 import { MarkdownEditor } from "../../MarkdownEditor";
 import { useHtmlPreviewStyle } from "./style";
 var HtmlPreview = (props) => {

package/dist/Workspace/HtmlPreview/style.js

@@ -19,7 +19,7 @@ var __spreadValues = (a, b) => {
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 
 // src/Workspace/HtmlPreview/style.ts
-import { useEditorStyleRegister } from "../../hooks/useStyle";
+import { useEditorStyleRegister } from "../../Hooks/useStyle";
 var genStyle = (token) => {
   return {
     [`${token.componentCls}`]: {

package/dist/Workspace/RealtimeFollow/index.d.ts

@@ -21,7 +21,6 @@ export interface RealtimeFollowData {
     emptyRender?: React.ReactNode | (() => React.ReactNode);
     status?: 'loading' | 'done' | 'error';
     onBack?: () => void;
-    /** 自定义渲染内容，传入后将直接渲染该内容，忽略其他渲染逻辑 */
     customContent?: React.ReactNode | (() => React.ReactNode);
     viewMode?: 'preview' | 'code';
     defaultViewMode?: 'preview' | 'code';
@@ -38,9 +37,14 @@ export interface RealtimeFollowData {
     segmentedExtra?: React.ReactNode;
 }
 /**
- * 实时跟随组件 - 支持 HTML、Markdown、Shell 等类型，或自定义内容
+ * RealtimeFollow 组件
+ *
+ * 实时跟随显示，支持 HTML、Markdown、Shell 等类型
+ *
  * @example
- * <RealtimeFollow data={{ type: 'shell', customContent: <div>自定义内容</div> }} />
+ * ```tsx
+ * <RealtimeFollow data={{ type: 'shell', content: '$ ls' }} />
+ * ```
  */
 export declare const RealtimeFollow: React.FC<{
     data: RealtimeFollowData;
@@ -49,7 +53,9 @@ export declare const RealtimeFollow: React.FC<{
     hashId?: string;
 }>;
 /**
- * 实时跟随列表组件 - RealtimeFollow 的包装组件，管理视图模式状态
+ * RealtimeFollowList 组件
+ *
+ * RealtimeFollow 的包装组件，管理视图模式状态
  */
 export declare const RealtimeFollowList: React.FC<{
     data: RealtimeFollowData;