@ai-group/chat-sdk 3.5.5 → 3.5.7

package/dist/cjs/components/FileGallery/index.js

@@ -0,0 +1,324 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/FileGallery/index.tsx
+var FileGallery_exports = {};
+__export(FileGallery_exports, {
+  default: () => FileGallery_default
+});
+module.exports = __toCommonJS(FileGallery_exports);
+var import_react = require("react");
+var import_antd = require("antd");
+var import_icons = require("@ant-design/icons");
+var import_styles = require("./styles");
+var import_jsx_runtime = require("react/jsx-runtime");
+var getFileName = (file) => {
+  return file.displayName || file.name || "";
+};
+var getFileSize = (file) => {
+  return file.size || 0;
+};
+var getMimeType = (file) => {
+  return file.mimeType || file.type || "";
+};
+var getFileUrl = (file) => {
+  var _a, _b;
+  return file.fileUri || ((_a = file.response) == null ? void 0 : _a.fileUrl) || ((_b = file.response) == null ? void 0 : _b.tempUrl) || file.tempUrl || "";
+};
+var getFileId = (file) => {
+  return file.id || file.uid || "";
+};
+var isImageFile = (file) => {
+  const mimeType = getMimeType(file);
+  if (mimeType && mimeType.startsWith("image/"))
+    return true;
+  const fileName = getFileName(file);
+  if (fileName && fileName.match(/\.(jpg|jpeg|png|gif|webp|bmp|svg)$/i))
+    return true;
+  const url = getFileUrl(file);
+  if (url && url.match(/\.(jpg|jpeg|png|gif|webp|bmp|svg)(\?.*)?$/i))
+    return true;
+  return false;
+};
+var isAudioFile = (file) => {
+  const mimeType = getMimeType(file);
+  if (mimeType && mimeType.startsWith("audio/"))
+    return true;
+  const fileName = getFileName(file);
+  return !!(fileName == null ? void 0 : fileName.match(/\.(mp3|wav|m4a|aac|ogg|flac)$/i));
+};
+var isVideoFile = (file) => {
+  const mimeType = getMimeType(file);
+  if (mimeType && mimeType.startsWith("video/"))
+    return true;
+  const fileName = getFileName(file);
+  return !!(fileName == null ? void 0 : fileName.match(/\.(mp4|mov|webm|mkv|avi)$/i));
+};
+var isZipFile = (file) => {
+  const fileName = getFileName(file);
+  return !!(fileName == null ? void 0 : fileName.match(/\.(zip|rar|7z|tar|gz|bz2|xz|tgz)$/i));
+};
+var isMarkdownFile = (file) => {
+  const fileName = getFileName(file);
+  return !!(fileName == null ? void 0 : fileName.match(/\.(md|markdown)$/i));
+};
+var getFileExtension = (filename) => {
+  const ext = filename.split(".").pop();
+  return ext ? ext.toLowerCase() : "";
+};
+var getFileIcon = (file) => {
+  const ext = getFileExtension(getFileName(file));
+  if (ext === "pdf") {
+    return { icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.FilePdfOutlined, {}), color: "#ff4d4f" };
+  }
+  if (["doc", "docx"].includes(ext)) {
+    return { icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.FileWordOutlined, {}), color: "#1677ff" };
+  }
+  if (["xls", "xlsx", "csv"].includes(ext)) {
+    return { icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.FileExcelOutlined, {}), color: "#22b35e" };
+  }
+  if (["ppt", "pptx"].includes(ext)) {
+    return { icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.FilePptOutlined, {}), color: "#ff6e31" };
+  }
+  if (["mp3", "wav", "m4a", "aac", "ogg", "flac"].includes(ext)) {
+    return { icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.AudioOutlined, {}), color: "#722ed1" };
+  }
+  if (["mp4", "mov", "webm", "mkv", "avi"].includes(ext)) {
+    return { icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.VideoCameraOutlined, {}), color: "#fa8c16" };
+  }
+  if (["zip", "rar", "7z", "tar", "gz", "bz2", "xz", "tgz"].includes(ext)) {
+    return { icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.FileZipOutlined, {}), color: "#eb2f96" };
+  }
+  if (["md", "markdown"].includes(ext)) {
+    return { icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.FileMarkdownOutlined, {}), color: "#13c2c2" };
+  }
+  if (isImageFile(file)) {
+    return { icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.FileImageOutlined, {}), color: "#8c8c8c" };
+  }
+  return { icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.FileOutlined, {}), color: "#8c8c8c" };
+};
+var formatFileSize = (bytes) => {
+  if (bytes < 1024)
+    return bytes + " B";
+  if (bytes < 1024 * 1024)
+    return (bytes / 1024).toFixed(1) + " KB";
+  return (bytes / (1024 * 1024)).toFixed(1) + " MB";
+};
+var styles = (0, import_styles.useStyles)();
+var FileGallery = ({
+  file,
+  align = "left",
+  removable = false,
+  onRemove = () => {
+  },
+  className,
+  style,
+  onClick
+}) => {
+  const [objectUrl, setObjectUrl] = (0, import_react.useState)("");
+  (0, import_react.useEffect)(() => {
+    if (!(file == null ? void 0 : file.file))
+      return;
+    const url2 = URL.createObjectURL(file.file);
+    setObjectUrl(url2);
+    return () => URL.revokeObjectURL(url2);
+  }, [file == null ? void 0 : file.file]);
+  if (!file)
+    return null;
+  const isImage = isImageFile(file);
+  const isAudio = isAudioFile(file);
+  const isVideo = isVideoFile(file);
+  const isZip = isZipFile(file);
+  const isMarkdown = isMarkdownFile(file);
+  const fileName = getFileName(file);
+  const fileSize = getFileSize(file);
+  const fileId = getFileId(file);
+  const url = getFileUrl(file) || objectUrl;
+  if (isImage) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      "div",
+      {
+        className: `${styles.fileCard} ${align === "right" ? "align-right" : ""} ${className || ""}`,
+        style: { ...style, cursor: onClick ? "pointer" : void 0 },
+        onClick: () => onClick == null ? void 0 : onClick(file),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.imageThumbnail, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              import_antd.Image,
+              {
+                src: url,
+                alt: fileName,
+                fallback: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mN8/5+hHgAHggJ/PchI7wAAAABJRU5ErkJggg==",
+                preview: onClick ? false : { src: url }
+              }
+            ),
+            file.status === "uploading" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.imageOverlay, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              import_antd.Progress,
+              {
+                type: "circle",
+                percent: file.progress,
+                size: 30,
+                strokeColor: "#1677ff"
+              }
+            ) })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.fileInfo, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd.Tooltip, { title: fileName, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.fileName, children: fileName.length > 15 ? `${fileName.substring(0, 15)}...` : fileName }) }),
+            Number(file == null ? void 0 : file.size) > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.fileSize, children: formatFileSize(fileSize) })
+          ] }),
+          removable && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "button",
+            {
+              className: styles.fileRemoveBtn,
+              onClick: () => onRemove(fileId),
+              disabled: file.status === "uploading",
+              "aria-label": "删除文件",
+              children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.CloseOutlined, {})
+            }
+          )
+        ]
+      }
+    );
+  }
+  if (isAudio) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      "div",
+      {
+        className: `${styles.fileCard} ${align === "right" ? "align-right" : ""} ${className || ""}`,
+        style,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.fileIcon, style: { color: "#722ed1" }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.AudioOutlined, {}) }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.fileInfo, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd.Tooltip, { title: fileName, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.fileName, children: fileName }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "audio",
+              {
+                src: url,
+                controls: true,
+                className: styles.mediaWrapper,
+                style: { width: "100%", height: 28 }
+              }
+            )
+          ] }),
+          removable && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "button",
+            {
+              className: styles.fileRemoveBtn,
+              onClick: () => onRemove(fileId),
+              disabled: file.status === "uploading",
+              "aria-label": "删除文件",
+              children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.CloseOutlined, {})
+            }
+          )
+        ]
+      }
+    );
+  }
+  if (isVideo) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      "div",
+      {
+        className: `${styles.fileCard} ${align === "right" ? "align-right" : ""} ${className || ""}`,
+        style,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.fileIcon, style: { color: "#fa8c16" }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.VideoCameraOutlined, {}) }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.fileInfo, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd.Tooltip, { title: fileName, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.fileName, children: fileName }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "video",
+              {
+                src: url,
+                controls: true,
+                className: styles.mediaWrapper,
+                style: { width: "100%", height: 40 }
+              }
+            )
+          ] }),
+          removable && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "button",
+            {
+              className: styles.fileRemoveBtn,
+              onClick: () => onRemove(fileId),
+              disabled: file.status === "uploading",
+              "aria-label": "删除文件",
+              children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.CloseOutlined, {})
+            }
+          )
+        ]
+      }
+    );
+  }
+  const { icon, color } = getFileIcon(file);
+  const isExternalUrl = url && url.startsWith("http");
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "div",
+    {
+      className: `${styles.fileCard} ${align === "right" ? "align-right" : ""} ${className || ""}`,
+      style: { ...style, cursor: onClick ? "pointer" : void 0 },
+      onClick: () => onClick == null ? void 0 : onClick(file),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.fileIcon, style: { color }, children: icon }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.fileInfo, children: [
+          isExternalUrl && !onClick ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "a",
+            {
+              href: url,
+              target: "_blank",
+              rel: "noopener noreferrer",
+              className: styles.fileLink,
+              children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd.Tooltip, { title: fileName, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.fileName, children: fileName.length > 15 ? `${fileName.substring(0, 15)}...` : fileName }) })
+            }
+          ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_antd.Tooltip, { title: fileName, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.fileName, children: fileName.length > 15 ? `${fileName.substring(0, 15)}...` : fileName }) }),
+          file.status === "uploading" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            import_antd.Progress,
+            {
+              percent: file.progress,
+              size: "small",
+              showInfo: false,
+              strokeColor: "#1677ff",
+              className: styles.progress
+            }
+          ) : fileSize > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.fileSize, children: formatFileSize(fileSize) }),
+          file.status === "error" && file.errorMessage && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "div",
+            {
+              style: {
+                fontSize: "11px",
+                color: "#ff4d4f",
+                marginTop: "2px"
+              },
+              children: file.errorMessage
+            }
+          )
+        ] }),
+        removable && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "button",
+          {
+            className: styles.fileRemoveBtn,
+            onClick: () => onRemove(fileId),
+            disabled: file.status === "uploading",
+            "aria-label": "删除文件",
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.CloseOutlined, {})
+          }
+        )
+      ]
+    }
+  );
+};
+var FileGallery_default = FileGallery;
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/FileGallery/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/FileGallery/index.tsx"],
+  "sourcesContent": ["import React, { useState, useEffect } from \"react\";\nimport { Image, Tooltip, Progress } from \"antd\";\nimport {\n  FileOutlined,\n  FilePdfOutlined,\n  FileWordOutlined,\n  FileExcelOutlined,\n  FilePptOutlined,\n  FileImageOutlined,\n  CloseOutlined,\n  AudioOutlined,\n  FileZipOutlined,\n  VideoCameraOutlined,\n  FileMarkdownOutlined,\n} from \"@ant-design/icons\";\nimport { FileItem, FileGalleryProps } from \"@/types\";\nimport { useStyles } from \"./styles\";\n\n// ==================== 工具函数 ====================\n\n/**\n * 获取文件名\n */\nconst getFileName = (file: FileItem): string => {\n  return file.displayName || file.name || \"\";\n};\n\n/**\n * 获取文件大小\n */\nconst getFileSize = (file: FileItem): number => {\n  return file.size || 0;\n};\n\n/**\n * 获取文件 MIME 类型\n */\nconst getMimeType = (file: FileItem): string => {\n  return file.mimeType || file.type || \"\";\n};\n\n/**\n * 获取文件 URL\n */\nconst getFileUrl = (file: FileItem): string => {\n  return (\n    file.fileUri ||\n    file.response?.fileUrl ||\n    file.response?.tempUrl ||\n    file.tempUrl ||\n    \"\"\n  );\n};\n\n/**\n * 获取文件唯一标识\n */\nconst getFileId = (file: FileItem): string => {\n  return file.id || file.uid || \"\";\n};\n\n/**\n * 判断是否是图片文件\n */\nconst isImageFile = (file: FileItem): boolean => {\n  const mimeType = getMimeType(file);\n  if (mimeType && mimeType.startsWith(\"image/\")) return true;\n\n  const fileName = getFileName(file);\n  if (fileName && fileName.match(/\\.(jpg|jpeg|png|gif|webp|bmp|svg)$/i))\n    return true;\n\n  const url = getFileUrl(file);\n  if (url && url.match(/\\.(jpg|jpeg|png|gif|webp|bmp|svg)(\\?.*)?$/i))\n    return true;\n\n  return false;\n};\n\n/**\n * 判断是否是音频文件\n */\nconst isAudioFile = (file: FileItem): boolean => {\n  const mimeType = getMimeType(file);\n  if (mimeType && mimeType.startsWith(\"audio/\")) return true;\n\n  const fileName = getFileName(file);\n  return !!fileName?.match(/\\.(mp3|wav|m4a|aac|ogg|flac)$/i);\n};\n\n/**\n * 判断是否是视频文件\n */\nconst isVideoFile = (file: FileItem): boolean => {\n  const mimeType = getMimeType(file);\n  if (mimeType && mimeType.startsWith(\"video/\")) return true;\n\n  const fileName = getFileName(file);\n  return !!fileName?.match(/\\.(mp4|mov|webm|mkv|avi)$/i);\n};\n\n/**\n * 判断是否是压缩包文件\n */\nconst isZipFile = (file: FileItem): boolean => {\n  const fileName = getFileName(file);\n  return !!fileName?.match(/\\.(zip|rar|7z|tar|gz|bz2|xz|tgz)$/i);\n};\n\n/**\n * 判断是否是 Markdown 文件\n */\nconst isMarkdownFile = (file: FileItem): boolean => {\n  const fileName = getFileName(file);\n  return !!fileName?.match(/\\.(md|markdown)$/i);\n};\n\n/**\n * 获取文件扩展名\n */\nconst getFileExtension = (filename: string): string => {\n  const ext = filename.split(\".\").pop();\n  return ext ? ext.toLowerCase() : \"\";\n};\n\n/**\n * 获取文件图标和颜色\n */\nconst getFileIcon = (\n  file: FileItem,\n): { icon: React.ReactNode; color: string } => {\n  const ext = getFileExtension(getFileName(file));\n\n  // PDF\n  if (ext === \"pdf\") {\n    return { icon: <FilePdfOutlined />, color: \"#ff4d4f\" };\n  }\n\n  // Word\n  if ([\"doc\", \"docx\"].includes(ext)) {\n    return { icon: <FileWordOutlined />, color: \"#1677ff\" };\n  }\n\n  // Excel\n  if ([\"xls\", \"xlsx\", \"csv\"].includes(ext)) {\n    return { icon: <FileExcelOutlined />, color: \"#22b35e\" };\n  }\n\n  // PPT\n  if ([\"ppt\", \"pptx\"].includes(ext)) {\n    return { icon: <FilePptOutlined />, color: \"#ff6e31\" };\n  }\n\n  // Audio\n  if ([\"mp3\", \"wav\", \"m4a\", \"aac\", \"ogg\", \"flac\"].includes(ext)) {\n    return { icon: <AudioOutlined />, color: \"#722ed1\" };\n  }\n\n  // Video\n  if ([\"mp4\", \"mov\", \"webm\", \"mkv\", \"avi\"].includes(ext)) {\n    return { icon: <VideoCameraOutlined />, color: \"#fa8c16\" };\n  }\n\n  // 压缩包\n  if ([\"zip\", \"rar\", \"7z\", \"tar\", \"gz\", \"bz2\", \"xz\", \"tgz\"].includes(ext)) {\n    return { icon: <FileZipOutlined />, color: \"#eb2f96\" };\n  }\n\n  // Markdown\n  if ([\"md\", \"markdown\"].includes(ext)) {\n    return { icon: <FileMarkdownOutlined />, color: \"#13c2c2\" };\n  }\n\n  // 图片\n  if (isImageFile(file)) {\n    return { icon: <FileImageOutlined />, color: \"#8c8c8c\" };\n  }\n\n  // 默认\n  return { icon: <FileOutlined />, color: \"#8c8c8c\" };\n};\n\n/**\n * 格式化文件大小\n */\nconst formatFileSize = (bytes: number): string => {\n  if (bytes < 1024) return bytes + \" B\";\n  if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(1) + \" KB\";\n  return (bytes / (1024 * 1024)).toFixed(1) + \" MB\";\n};\n\nconst styles = useStyles();\n\n/**\n * FileGallery - 单文件展示组件\n *\n * 功能特性:\n * - 📁 支持多种文件类型展示 (图片、音频、视频、文档等)\n * - 🖼️ 图片支持预览和缩略图\n * - 🎵 音频文件支持内联播放\n * - 🎬 视频文件支持内联播放\n * - 📊 显示文件大小、类型图标\n * - 🗑️ 支持删除操作\n * - 📤 支持上传进度显示\n * - 🎨 支持卡片内部布局控制（align：图标和信息的排列方式）\n *\n * @example\n * // XAdkSender 场景 - 可删除的本地文件\n * {files.map(file => (\n *   <FileGallery\n *     key={file.id}\n *     file={file}\n *     removable\n *     onRemove={handleRemove}\n *   />\n * ))}\n *\n * @example\n * // XadkChatbot 场景 - 只读的远程文件\n * {files.map(file => (\n *   <FileGallery key={file.id} file={file} />\n * ))}\n */\nconst FileGallery: React.FC<FileGalleryProps> = ({\n  file,\n  align = \"left\",\n  removable = false,\n  onRemove = () => {},\n  className,\n  style,\n  onClick,\n}) => {\n  const [objectUrl, setObjectUrl] = useState(\"\");\n\n  useEffect(() => {\n    if (!file?.file) return;\n\n    const url = URL.createObjectURL(file.file);\n    setObjectUrl(url);\n\n    return () => URL.revokeObjectURL(url);\n  }, [file?.file]);\n\n  if (!file) return null;\n\n  const isImage = isImageFile(file);\n  const isAudio = isAudioFile(file);\n  const isVideo = isVideoFile(file);\n  const isZip = isZipFile(file);\n  const isMarkdown = isMarkdownFile(file);\n  const fileName = getFileName(file);\n  const fileSize = getFileSize(file);\n  const fileId = getFileId(file);\n  const url = getFileUrl(file) || objectUrl;\n\n  // 图片文件\n  if (isImage) {\n    return (\n      <div\n        className={`${styles.fileCard} ${align === \"right\" ? \"align-right\" : \"\"} ${className || \"\"}`}\n        style={{ ...style, cursor: onClick ? \"pointer\" : undefined }}\n        onClick={() => onClick?.(file)}\n      >\n        {/* 图片缩略图 */}\n        <div className={styles.imageThumbnail}>\n          <Image\n            src={url}\n            alt={fileName}\n            fallback=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mN8/5+hHgAHggJ/PchI7wAAAABJRU5ErkJggg==\"\n            preview={onClick ? false : { src: url }}\n          />\n\n          {/* 上传进度遮罩 */}\n          {file.status === \"uploading\" && (\n            <div className={styles.imageOverlay}>\n              <Progress\n                type=\"circle\"\n                percent={file.progress}\n                size={30}\n                strokeColor=\"#1677ff\"\n              />\n            </div>\n          )}\n        </div>\n\n        {/* 文件信息 */}\n        <div className={styles.fileInfo}>\n          <Tooltip title={fileName}>\n            <div className={styles.fileName}>\n              {fileName.length > 15\n                ? `${fileName.substring(0, 15)}...`\n                : fileName}\n            </div>\n          </Tooltip>\n          {Number(file?.size) > 0 && (\n            <div className={styles.fileSize}>{formatFileSize(fileSize)}</div>\n          )}\n        </div>\n\n        {/* 删除按钮 */}\n        {removable && (\n          <button\n            className={styles.fileRemoveBtn}\n            onClick={() => onRemove(fileId)}\n            disabled={file.status === \"uploading\"}\n            aria-label=\"删除文件\"\n          >\n            <CloseOutlined />\n          </button>\n        )}\n      </div>\n    );\n  }\n\n  // 音频文件\n  if (isAudio) {\n    return (\n      <div\n        className={`${styles.fileCard} ${align === \"right\" ? \"align-right\" : \"\"} ${className || \"\"}`}\n        style={style}\n      >\n        <div className={styles.fileIcon} style={{ color: \"#722ed1\" }}>\n          <AudioOutlined />\n        </div>\n\n        <div className={styles.fileInfo}>\n          <Tooltip title={fileName}>\n            <div className={styles.fileName}>{fileName}</div>\n          </Tooltip>\n\n          <audio\n            src={url}\n            controls\n            className={styles.mediaWrapper}\n            style={{ width: \"100%\", height: 28 }}\n          />\n        </div>\n\n        {removable && (\n          <button\n            className={styles.fileRemoveBtn}\n            onClick={() => onRemove(fileId)}\n            disabled={file.status === \"uploading\"}\n            aria-label=\"删除文件\"\n          >\n            <CloseOutlined />\n          </button>\n        )}\n      </div>\n    );\n  }\n\n  // 视频文件\n  if (isVideo) {\n    return (\n      <div\n        className={`${styles.fileCard} ${align === \"right\" ? \"align-right\" : \"\"} ${className || \"\"}`}\n        style={style}\n      >\n        <div className={styles.fileIcon} style={{ color: \"#fa8c16\" }}>\n          <VideoCameraOutlined />\n        </div>\n\n        <div className={styles.fileInfo}>\n          <Tooltip title={fileName}>\n            <div className={styles.fileName}>{fileName}</div>\n          </Tooltip>\n\n          <video\n            src={url}\n            controls\n            className={styles.mediaWrapper}\n            style={{ width: \"100%\", height: 40 }}\n          />\n        </div>\n\n        {removable && (\n          <button\n            className={styles.fileRemoveBtn}\n            onClick={() => onRemove(fileId)}\n            disabled={file.status === \"uploading\"}\n            aria-label=\"删除文件\"\n          >\n            <CloseOutlined />\n          </button>\n        )}\n      </div>\n    );\n  }\n\n  // 其他文件\n  const { icon, color } = getFileIcon(file);\n  const isExternalUrl = url && url.startsWith(\"http\");\n\n  return (\n    <div\n      className={`${styles.fileCard} ${align === \"right\" ? \"align-right\" : \"\"} ${className || \"\"}`}\n      style={{ ...style, cursor: onClick ? \"pointer\" : undefined }}\n      onClick={() => onClick?.(file)}\n    >\n      <div className={styles.fileIcon} style={{ color }}>\n        {icon}\n      </div>\n\n      <div className={styles.fileInfo}>\n        {isExternalUrl && !onClick ? (\n          <a\n            href={url}\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            className={styles.fileLink}\n          >\n            <Tooltip title={fileName}>\n              <div className={styles.fileName}>\n                {fileName.length > 15\n                  ? `${fileName.substring(0, 15)}...`\n                  : fileName}\n              </div>\n            </Tooltip>\n          </a>\n        ) : (\n          <Tooltip title={fileName}>\n            <div className={styles.fileName}>\n              {fileName.length > 15\n                ? `${fileName.substring(0, 15)}...`\n                : fileName}\n            </div>\n          </Tooltip>\n        )}\n\n        {file.status === \"uploading\" ? (\n          <Progress\n            percent={file.progress}\n            size=\"small\"\n            showInfo={false}\n            strokeColor=\"#1677ff\"\n            className={styles.progress}\n          />\n        ) : (\n          fileSize > 0 && (\n            <div className={styles.fileSize}>{formatFileSize(fileSize)}</div>\n          )\n        )}\n\n        {file.status === \"error\" && file.errorMessage && (\n          <div\n            style={{\n              fontSize: \"11px\",\n              color: \"#ff4d4f\",\n              marginTop: \"2px\",\n            }}\n          >\n            {file.errorMessage}\n          </div>\n        )}\n      </div>\n\n      {removable && (\n        <button\n          className={styles.fileRemoveBtn}\n          onClick={() => onRemove(fileId)}\n          disabled={file.status === \"uploading\"}\n          aria-label=\"删除文件\"\n        >\n          <CloseOutlined />\n        </button>\n      )}\n    </div>\n  );\n};\n\nexport default FileGallery;\n"],
+  "mappings": "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",
+  "names": ["url"]
+}

package/dist/cjs/components/FileGallery/styles.d.ts

@@ -0,0 +1,49 @@
+export declare const useStyles: () => {
+    container: string;
+    fileList: string;
+    fileCard: string;
+    imageThumbnail: string;
+    imageOverlay: string;
+    fileIcon: string;
+    fileInfo: string;
+    fileName: string;
+    fileSize: string;
+    progress: string;
+    fileRemoveBtn: string;
+    fileLink: string;
+    mediaWrapper: string;
+} & {
+    w: (width: string | number) => string;
+    h: (height: string | number) => string;
+    p: (padding: string) => string;
+    pb: (padding: string | number) => string;
+    pt: (padding: string | number) => string;
+    pl: (padding: string | number) => string;
+    pr: (padding: string | number) => string;
+    m: (margin: string) => string;
+    mb: (margin: string | number) => string;
+    mt: (margin: string | number) => string;
+    ml: (margin: string | number) => string;
+    mr: (margin: string | number) => string;
+    text: (size: string | number) => string;
+    weight: (size: number) => string;
+    textColor: (c: string) => string;
+    bg: (c: string) => string;
+    rs: (radius: string | number) => string;
+    gap: (g: string | number) => string;
+    flex: string;
+    flexCenter: string;
+    flexBetween: string;
+    flexColumn: string;
+    flex1: string;
+    cursor: (type: string) => string;
+    border: (color: string, width?: string) => string;
+    boxShadow: (shadow: string) => string;
+    transition: (property?: string, duration?: string) => string;
+    overflow: (type: string) => string;
+    position: (type: string) => string;
+    zIndex: (index: number) => string;
+    flexCenterGap2: string;
+    flexCenterGap4: string;
+};
+export default useStyles;

package/dist/cjs/components/FileGallery/styles.js

@@ -0,0 +1,194 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/FileGallery/styles.tsx
+var styles_exports = {};
+__export(styles_exports, {
+  default: () => styles_default,
+  useStyles: () => useStyles
+});
+module.exports = __toCommonJS(styles_exports);
+var import_css = require("@emotion/css");
+var import_common = require("../../styles/common");
+var useStyles = (0, import_common.withBasicStyles)(() => ({
+  container: import_css.css`
+    padding: 12px 0;
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+
+    &.align-right {
+      align-items: flex-end;
+    }
+  `,
+  fileList: import_css.css`
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+  `,
+  fileCard: import_css.css`
+    position: relative;
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    padding: 6px 12px;
+    margin: 8px 0;
+    background: #fafafa;
+    border: 1px solid #f0f0f0;
+    border-radius: 8px;
+    min-width: 260px;
+    max-width: 280px;
+    min-height: 64px;
+    transition: all 0.2s ease;
+
+    &:hover {
+      background: #f5f5f5;
+      border-color: #e0e0e0;
+    }
+
+    /* align=right 时图标在右侧 */
+    &.align-right {
+      flex-direction: row-reverse;
+    }
+  `,
+  imageThumbnail: import_css.css`
+    position: relative;
+    width: 44px;
+    height: 44px;
+    flex-shrink: 0;
+    border-radius: 4px;
+    overflow: hidden;
+    background-color: #f5f5f5;
+    border: 1px solid rgba(0, 0, 0, 0.06);
+
+    .ant-image {
+      width: 100% !important;
+      height: 100% !important;
+      display: flex !important;
+      justify-content: center;
+      align-items: center;
+    }
+
+    img {
+      width: 100% !important;
+      height: 100% !important;
+      object-fit: cover !important;
+      display: block !important;
+    }
+  `,
+  imageOverlay: import_css.css`
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: rgba(0, 0, 0, 0.05);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: 10;
+  `,
+  fileIcon: import_css.css`
+    font-size: 24px;
+    flex-shrink: 0;
+    width: 36px;
+    height: 36px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  `,
+  fileInfo: import_css.css`
+    flex: 1;
+    min-width: 0;
+    overflow: hidden;
+  `,
+  fileName: import_css.css`
+    font-size: 13px;
+    font-weight: 500;
+    color: #262626;
+    margin-bottom: 4px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  `,
+  fileSize: import_css.css`
+    font-size: 11px;
+    color: #8c8c8c;
+  `,
+  progress: import_css.css`
+    margin-top: 4px;
+
+    .ant-progress-inner {
+      height: 4px !important;
+    }
+
+    .ant-progress-bg {
+      height: 4px !important;
+    }
+  `,
+  fileRemoveBtn: import_css.css`
+    position: absolute;
+    top: -6px;
+    right: -6px;
+    width: 18px;
+    height: 18px;
+    border-radius: 50%;
+    background: rgba(0, 0, 0, 0.75);
+    color: #fff;
+    border: none;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    cursor: pointer;
+    z-index: 1;
+    padding: 0;
+    font-size: 10px;
+    transition: all 0.2s ease;
+
+    &:hover {
+      background: rgba(0, 0, 0, 0.9);
+      transform: scale(1.1);
+    }
+
+    &:disabled {
+      opacity: 0.5;
+      cursor: not-allowed;
+    }
+  `,
+  fileLink: import_css.css`
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    color: rgba(0, 0, 0, 0.85);
+    text-decoration: none;
+    font-size: 13px;
+
+    &:hover {
+      color: #1677ff;
+    }
+  `,
+  mediaWrapper: import_css.css`
+    margin-top: 6px;
+  `
+}));
+var styles_default = useStyles;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useStyles
+});
+//# sourceMappingURL=styles.js.map

package/dist/cjs/components/FileGallery/styles.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/FileGallery/styles.tsx"],
+  "sourcesContent": ["import { css } from \"@emotion/css\";\nimport { withBasicStyles } from \"@/styles/common\";\n\nexport const useStyles = withBasicStyles(() => ({\n  container: css`\n    padding: 12px 0;\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n\n    &.align-right {\n      align-items: flex-end;\n    }\n  `,\n\n  fileList: css`\n    display: flex;\n    flex-wrap: wrap;\n    gap: 8px;\n  `,\n\n  fileCard: css`\n    position: relative;\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 6px 12px;\n    margin: 8px 0;\n    background: #fafafa;\n    border: 1px solid #f0f0f0;\n    border-radius: 8px;\n    min-width: 260px;\n    max-width: 280px;\n    min-height: 64px;\n    transition: all 0.2s ease;\n\n    &:hover {\n      background: #f5f5f5;\n      border-color: #e0e0e0;\n    }\n\n    /* align=right 时图标在右侧 */\n    &.align-right {\n      flex-direction: row-reverse;\n    }\n  `,\n\n  imageThumbnail: css`\n    position: relative;\n    width: 44px;\n    height: 44px;\n    flex-shrink: 0;\n    border-radius: 4px;\n    overflow: hidden;\n    background-color: #f5f5f5;\n    border: 1px solid rgba(0, 0, 0, 0.06);\n\n    .ant-image {\n      width: 100% !important;\n      height: 100% !important;\n      display: flex !important;\n      justify-content: center;\n      align-items: center;\n    }\n\n    img {\n      width: 100% !important;\n      height: 100% !important;\n      object-fit: cover !important;\n      display: block !important;\n    }\n  `,\n\n  imageOverlay: css`\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background: rgba(0, 0, 0, 0.05);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 10;\n  `,\n\n  fileIcon: css`\n    font-size: 24px;\n    flex-shrink: 0;\n    width: 36px;\n    height: 36px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  `,\n\n  fileInfo: css`\n    flex: 1;\n    min-width: 0;\n    overflow: hidden;\n  `,\n\n  fileName: css`\n    font-size: 13px;\n    font-weight: 500;\n    color: #262626;\n    margin-bottom: 4px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  `,\n\n  fileSize: css`\n    font-size: 11px;\n    color: #8c8c8c;\n  `,\n\n  progress: css`\n    margin-top: 4px;\n\n    .ant-progress-inner {\n      height: 4px !important;\n    }\n\n    .ant-progress-bg {\n      height: 4px !important;\n    }\n  `,\n\n  fileRemoveBtn: css`\n    position: absolute;\n    top: -6px;\n    right: -6px;\n    width: 18px;\n    height: 18px;\n    border-radius: 50%;\n    background: rgba(0, 0, 0, 0.75);\n    color: #fff;\n    border: none;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n    z-index: 1;\n    padding: 0;\n    font-size: 10px;\n    transition: all 0.2s ease;\n\n    &:hover {\n      background: rgba(0, 0, 0, 0.9);\n      transform: scale(1.1);\n    }\n\n    &:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n  `,\n\n  fileLink: css`\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    color: rgba(0, 0, 0, 0.85);\n    text-decoration: none;\n    font-size: 13px;\n\n    &:hover {\n      color: #1677ff;\n    }\n  `,\n\n  mediaWrapper: css`\n    margin-top: 6px;\n  `,\n}));\n\nexport default useStyles;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAAoB;AACpB,oBAAgC;AAEzB,IAAM,gBAAY,+BAAgB,OAAO;AAAA,EAC9C,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWX,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,EAMV,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA0BV,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA0BhB,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAad,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUV,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,EAMV,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUV,UAAU;AAAA;AAAA;AAAA;AAAA,EAKV,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYV,eAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA8Bf,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAaV,cAAc;AAAA;AAAA;AAGhB,EAAE;AAEF,IAAO,iBAAQ;",
+  "names": []
+}

package/dist/cjs/components/FolderTree/DirectoryTree.d.ts

@@ -0,0 +1,34 @@
+import React from "react";
+import type { TreeProps } from "antd";
+import type { FolderTreeData, FolderTreeProps, EditNodeInfo, CreateNodeContext } from "./types";
+export interface DirectoryTreeComponentProps {
+    treeData: FolderTreeData[];
+    directoryIcons?: FolderTreeProps["directoryIcons"];
+    selectedKeys?: string[];
+    expandedKeys?: string[];
+    onSelect?: TreeProps["onSelect"];
+    onExpand?: TreeProps["onExpand"];
+    showLine?: FolderTreeProps["showLine"];
+    switcherIcon?: FolderTreeProps["switcherIcon"];
+    defaultExpandAll?: boolean;
+    className?: string;
+    directoryTitle?: FolderTreeProps["directoryTitle"];
+    moreActions?: FolderTreeProps["moreActions"];
+    width?: number | string;
+    draggable?: FolderTreeProps["draggable"];
+    onDrop?: FolderTreeProps["onDrop"];
+    /** 当前编辑节点信息 */
+    editNode?: EditNodeInfo | null;
+    /** 编辑值变化回调 */
+    onEditValueChange?: (value: string) => void;
+    /** 编辑确认回调 */
+    onEditConfirm?: () => void;
+    /** 编辑取消回调 */
+    onEditCancel?: () => void;
+    /** 新建上下文 */
+    createInfo?: CreateNodeContext | null;
+    /** 开始重命名回调（由父组件注入） */
+    onStartRename?: (fullPath: string, node: FolderTreeData) => void;
+}
+declare const DirectoryTreeComponent: React.FC<DirectoryTreeComponentProps>;
+export default DirectoryTreeComponent;