sy-form-components 0.2.14 → 0.2.15

package/dist/index.mjs

@@ -1,5 +1,5 @@
 // src/core/FormProvider.tsx
-import React34, { useCallback as useCallback5, useRef as useRef6, useState as useState16, useMemo as useMemo9 } from "react";
+import React36, { useCallback as useCallback5, useRef as useRef6, useState as useState16, useMemo as useMemo9 } from "react";
 
 // src/core/FormContext.ts
 import { createContext, useContext } from "react";
@@ -1356,6 +1356,7 @@ function CascadeDateField(props) {
 import { useEffect as useEffect10 } from "react";
 
 // src/fields/AttachmentField/AttachmentFieldPC.tsx
+import React14 from "react";
 import { Upload, Button } from "antd";
 
 // src/fields/shared/fieldFormat.ts
@@ -1462,6 +1463,31 @@ function normalizeAttachmentItem(item, fallback) {
     extension: item?.extension || fallback?.extension || getFileExtension(name)
   };
 }
+function getAttachmentItemIdentity(item) {
+  return String(item?.uid || item?.id || item?.objectName || item?.url || item?.name || "");
+}
+function dedupeAttachmentItems(items) {
+  const result = [];
+  const indexes = /* @__PURE__ */ new Map();
+  for (const item of items) {
+    const key = getAttachmentItemIdentity(item);
+    if (!key) {
+      result.push(item);
+      continue;
+    }
+    const existingIndex = indexes.get(key);
+    if (existingIndex === void 0) {
+      indexes.set(key, result.length);
+      result.push(item);
+      continue;
+    }
+    result[existingIndex] = {
+      ...result[existingIndex],
+      ...item
+    };
+  }
+  return result;
+}
 
 // src/fields/AttachmentField/AttachmentFieldPC.tsx
 import { jsx as jsx38, jsxs as jsxs5 } from "react/jsx-runtime";
@@ -1516,38 +1542,47 @@ function AttachmentFieldPC({
   onChange
 }) {
   const { formData, setFieldValue, api } = useFormContext();
-  const value = formData[fieldId] ?? [];
+  const value = React14.useMemo(
+    () => dedupeAttachmentItems(
+      Array.isArray(formData[fieldId]) ? formData[fieldId] : []
+    ),
+    [fieldId, formData]
+  );
+  const valueRef = React14.useRef(value);
   const disabled = behavior === "DISABLED";
+  React14.useEffect(() => {
+    valueRef.current = value;
+  }, [value]);
   const setValue = (items) => {
-    setFieldValue(fieldId, items);
-    onChange?.(items);
-  };
-  const handleChange = (info) => {
-    const fileList2 = info.fileList ?? [];
-    const items = fileList2.map((f) => {
-      if (f.uid === void 0 && f.name === void 0 && f.url === void 0 && !f.response) {
-        return { url: "", name: "", id: "" };
-      }
-      return normalizeAttachmentItem({
-        url: f.url ?? f.response?.url ?? "",
-        name: f.name,
-        id: f.uid ?? f.response?.id,
-        uid: f.uid ?? f.response?.uid,
-        status: f.status,
-        percent: f.percent,
-        objectName: f.objectName ?? f.response?.objectName,
-        bucketName: f.bucketName ?? f.response?.bucketName,
-        size: f.size ?? f.response?.size,
-        contentType: f.type ?? f.response?.contentType,
-        downloadUrl: f.downloadUrl ?? f.response?.downloadUrl,
-        previewUrl: f.previewUrl ?? f.response?.previewUrl
-      });
+    const nextItems = dedupeAttachmentItems(items).slice(0, maxCount ?? Infinity);
+    valueRef.current = nextItems;
+    setFieldValue(fieldId, nextItems);
+    onChange?.(nextItems);
+  };
+  const replaceItem = (target, nextItem) => {
+    const targetKeys = new Set(
+      [target.id, target.uid, target.objectName, getAttachmentItemIdentity(target)].filter(Boolean)
+    );
+    let replaced = false;
+    const nextItems = valueRef.current.map((item) => {
+      const currentKeys = [item.id, item.uid, item.objectName, getAttachmentItemIdentity(item)];
+      if (currentKeys.some((key) => key && targetKeys.has(key))) {
+        replaced = true;
+        return nextItem;
+      }
+      return item;
     });
-    setValue(items);
+    if (!replaced) nextItems.push(nextItem);
+    setValue(nextItems);
   };
   const handleRemove = (file) => {
-    const removed = value.find((item) => item.id === file.uid || item.uid === file.uid);
-    const newValue = value.filter((item) => item.id !== file.uid && item.uid !== file.uid);
+    const fileKey = String(file.uid || file.id || file.objectName || "");
+    const removed = valueRef.current.find(
+      (item) => item.id === fileKey || item.uid === fileKey || item.objectName === fileKey
+    );
+    const newValue = valueRef.current.filter(
+      (item) => item.id !== fileKey && item.uid !== fileKey && item.objectName !== fileKey
+    );
     setValue(newValue);
     if (removed?.objectName) {
       api.deleteFile(removed.objectName, removed.bucketName || bucketName).catch(() => void 0);
@@ -1588,7 +1623,9 @@ function AttachmentFieldPC({
     return url;
   };
   const handlePreview = async (file) => {
-    const item = value.find((current) => current.id === file.uid || current.uid === file.uid);
+    const item = valueRef.current.find(
+      (current) => current.id === file.uid || current.uid === file.uid || current.objectName === file.uid
+    );
     const url = item ? await resolvePreviewUrl(item) : file.url;
     if (url) window.open(url, "_blank", "noopener,noreferrer");
   };
@@ -1596,14 +1633,10 @@ function AttachmentFieldPC({
     const url = await resolveDownloadUrl(item);
     if (url) window.open(url, "_blank", "noopener,noreferrer");
   };
-  const fileList = value.map((item) => ({
-    uid: item.id,
-    name: item.name,
-    url: item.url,
-    status: item.status ?? "done",
-    percent: item.percent
-  }));
   const beforeUpload = (file) => {
+    if (maxCount && valueRef.current.length >= maxCount) {
+      return false;
+    }
     if (maxSize && file.size / 1024 / 1024 > maxSize) {
       return false;
     }
@@ -1616,27 +1649,26 @@ function AttachmentFieldPC({
   const customRequest = async ({ file, onProgress, onSuccess, onError }) => {
     const currentFile = file;
     const localItem = createLocalItem(currentFile);
-    const nextValue = multiple ? [...value, localItem].slice(0, maxCount ?? Infinity) : [localItem];
+    const currentValue = valueRef.current.filter(
+      (item) => item.id !== localItem.id && item.uid !== localItem.uid
+    );
+    const nextValue = multiple ? [...currentValue, localItem] : [localItem];
     setValue(nextValue);
     try {
       const uploaded = await api.uploadFile(currentFile, bucketName, (percent) => {
         onProgress?.({ percent });
-        setValue(
-          nextValue.map(
-            (item) => item.id === localItem.id ? { ...item, percent, status: "uploading" } : item
-          )
-        );
-      });
-      const completed = normalizeAttachmentItem({
-        ...uploaded,
-        id: uploaded.id || localItem.id,
-        uid: uploaded.uid || localItem.uid,
-        url: uploaded.url || localItem.url,
-        status: "done",
-        percent: 100,
-        extension: uploaded.extension || getFileExtension(uploaded.name || localItem.name)
+        replaceItem(localItem, { ...localItem, percent, status: "uploading" });
       });
-      setValue(nextValue.map((item) => item.id === localItem.id ? completed : item));
+      const completed = normalizeAttachmentItem(
+        {
+          ...uploaded,
+          status: "done",
+          percent: 100,
+          extension: uploaded.extension || getFileExtension(uploaded.name || localItem.name)
+        },
+        localItem
+      );
+      replaceItem(localItem, completed);
       onSuccess?.(completed);
     } catch (error) {
       const failed = {
@@ -1644,7 +1676,7 @@ function AttachmentFieldPC({
         status: "error",
         error: error?.message || "\u4E0A\u4F20\u5931\u8D25"
       };
-      setValue(nextValue.map((item) => item.id === localItem.id ? failed : item));
+      replaceItem(localItem, failed);
       onError?.(error);
     }
   };
@@ -1653,61 +1685,71 @@ function AttachmentFieldPC({
       Upload,
       {
         "data-testid": `attachmentfield-input-${fieldId}`,
-        fileList,
+        fileList: [],
         customRequest,
         accept,
         maxCount,
         multiple,
         disabled,
-        onChange: handleChange,
+        showUploadList: false,
         onRemove: handleRemove,
         onPreview: handlePreview,
         beforeUpload,
         children: /* @__PURE__ */ jsx38(Button, { disabled, "data-testid": `attachmentfield-upload-btn-${fieldId}`, children: "\u4E0A\u4F20\u6587\u4EF6" })
       }
     ),
-    value.length > 0 && /* @__PURE__ */ jsx38("div", { className: "sy-file-list", "data-testid": `attachmentfield-rich-list-${fieldId}`, children: value.map((item) => {
+    value.length > 0 && /* @__PURE__ */ jsx38("div", { className: "sy-file-list", "data-testid": `attachmentfield-rich-list-${fieldId}`, children: value.map((item, index) => {
       const category = getFileCategory(item.name, item.contentType);
       const extension = getFileExtension(item.name);
-      return /* @__PURE__ */ jsxs5("div", { className: "sy-file-item", children: [
-        /* @__PURE__ */ jsx38("span", { className: `sy-file-icon sy-file-icon-${category}`, "aria-hidden": "true", children: category === "image" ? "IMG" : extension || "FILE" }),
-        /* @__PURE__ */ jsxs5("div", { className: "sy-file-meta", children: [
-          /* @__PURE__ */ jsx38("span", { className: "sy-file-name", title: item.name, children: item.name }),
-          /* @__PURE__ */ jsx38("span", { className: "sy-file-sub", children: item.status === "uploading" ? `\u4E0A\u4F20\u4E2D ${Math.round(item.percent ?? 0)}%` : item.status === "error" ? item.error || "\u4E0A\u4F20\u5931\u8D25" : [
-            showFileTypeBadge && extension ? extension.toUpperCase() : "",
-            showFileSize ? formatFileSize(item.size) : ""
-          ].filter(Boolean).join(" \xB7 ") || "\u5DF2\u4E0A\u4F20" })
-        ] }),
-        /* @__PURE__ */ jsxs5("div", { className: "sy-file-actions", children: [
-          showPreview && canPreview(item) && /* @__PURE__ */ jsx38(
-            "button",
-            {
-              type: "button",
-              disabled: item.status !== "done",
-              onClick: () => handlePreview({ uid: item.uid || item.id, url: item.url }),
-              children: "\u9884\u89C8"
-            }
-          ),
-          showDownload && /* @__PURE__ */ jsx38(
-            "button",
-            {
-              type: "button",
-              disabled: item.status !== "done",
-              onClick: () => handleDownload(item),
-              children: "\u4E0B\u8F7D"
-            }
-          ),
-          /* @__PURE__ */ jsx38(
-            "button",
-            {
-              type: "button",
-              disabled,
-              onClick: () => handleRemove({ uid: item.uid || item.id }),
-              children: "\u5220\u9664"
-            }
-          )
-        ] })
-      ] }, item.id || item.uid || item.name);
+      const itemKey = getAttachmentItemIdentity(item) || `${fieldId}-attachment-${String(index)}`;
+      return /* @__PURE__ */ jsxs5(
+        "div",
+        {
+          className: "sy-file-item",
+          "data-testid": `attachmentfield-item-${itemKey}`,
+          children: [
+            /* @__PURE__ */ jsx38("span", { className: `sy-file-icon sy-file-icon-${category}`, "aria-hidden": "true", children: category === "image" ? "IMG" : extension || "FILE" }),
+            /* @__PURE__ */ jsxs5("div", { className: "sy-file-meta", children: [
+              /* @__PURE__ */ jsx38("span", { className: "sy-file-name", title: item.name, children: item.name }),
+              /* @__PURE__ */ jsx38("span", { className: "sy-file-sub", children: item.status === "uploading" ? `\u4E0A\u4F20\u4E2D ${Math.round(item.percent ?? 0)}%` : item.status === "error" ? item.error || "\u4E0A\u4F20\u5931\u8D25" : [
+                showFileTypeBadge && extension ? extension.toUpperCase() : "",
+                showFileSize ? formatFileSize(item.size) : ""
+              ].filter(Boolean).join(" \xB7 ") || "\u5DF2\u4E0A\u4F20" })
+            ] }),
+            /* @__PURE__ */ jsxs5("div", { className: "sy-file-actions", children: [
+              showPreview && canPreview(item) && /* @__PURE__ */ jsx38(
+                "button",
+                {
+                  type: "button",
+                  disabled: item.status !== "done",
+                  onClick: () => handlePreview({ uid: item.uid || item.id, url: item.url }),
+                  children: "\u9884\u89C8"
+                }
+              ),
+              showDownload && /* @__PURE__ */ jsx38(
+                "button",
+                {
+                  type: "button",
+                  disabled: item.status !== "done",
+                  onClick: () => handleDownload(item),
+                  children: "\u4E0B\u8F7D"
+                }
+              ),
+              /* @__PURE__ */ jsx38(
+                "button",
+                {
+                  type: "button",
+                  disabled,
+                  onClick: () => handleRemove({ uid: item.uid || item.id }),
+                  "data-testid": `attachmentfield-remove-${itemKey}`,
+                  children: "\u5220\u9664"
+                }
+              )
+            ] })
+          ]
+        },
+        `${itemKey}-${index}`
+      );
     }) })
   ] });
 }
@@ -1888,8 +1930,9 @@ function AttachmentField(props) {
 import { useEffect as useEffect11 } from "react";
 
 // src/fields/ImageField/ImageFieldPC.tsx
+import React16 from "react";
 import { Upload as Upload2 } from "antd";
-import { jsx as jsx42, jsxs as jsxs7 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx42, jsxs as jsxs7 } from "react/jsx-runtime";
 var createLocalItem2 = (file) => {
   const uid = file.uid || createUid("image");
   return {
@@ -1905,6 +1948,23 @@ var createLocalItem2 = (file) => {
     extension: getFileExtension(file.name)
   };
 };
+function ImageThumbContent({ item }) {
+  const [imageFailed, setImageFailed] = React16.useState(false);
+  const src = item.previewUrl || item.url;
+  React16.useEffect(() => {
+    setImageFailed(false);
+  }, [src]);
+  if (src && !imageFailed) {
+    return /* @__PURE__ */ jsxs7(Fragment, { children: [
+      /* @__PURE__ */ jsx42("img", { src, alt: item.name, onError: () => setImageFailed(true) }),
+      item.status === "uploading" && /* @__PURE__ */ jsxs7("span", { className: "sy-image-state", children: [
+        Math.round(item.percent ?? 0),
+        "%"
+      ] })
+    ] });
+  }
+  return /* @__PURE__ */ jsx42("span", { className: "sy-image-state", children: item.status === "uploading" ? `${Math.round(item.percent ?? 0)}%` : item.status === "error" ? item.error || "\u4E0A\u4F20\u5931\u8D25" : item.name || "\u56FE\u7247" });
+}
 function ImageFieldPC({
   fieldId,
   behavior,
@@ -1920,44 +1980,56 @@ function ImageFieldPC({
   onChange
 }) {
   const { formData, setFieldValue, api } = useFormContext();
-  const value = formData[fieldId] ?? [];
+  const value = React16.useMemo(
+    () => dedupeAttachmentItems(
+      Array.isArray(formData[fieldId]) ? formData[fieldId] : []
+    ),
+    [fieldId, formData]
+  );
+  const valueRef = React16.useRef(value);
   const disabled = behavior === "DISABLED";
+  React16.useEffect(() => {
+    valueRef.current = value;
+  }, [value]);
   const setValue = (items) => {
-    setFieldValue(fieldId, items);
-    onChange?.(items);
-  };
-  const handleChange = (info) => {
-    const fileList2 = info.fileList ?? [];
-    const items = fileList2.map((f) => {
-      if (f.uid === void 0 && f.name === void 0 && f.url === void 0 && f.thumbUrl === void 0 && !f.response) {
-        return { url: "", name: "", id: "" };
-      }
-      return normalizeAttachmentItem({
-        url: f.url ?? f.thumbUrl ?? f.response?.url ?? "",
-        previewUrl: f.previewUrl ?? f.thumbUrl ?? f.response?.previewUrl,
-        name: f.name,
-        id: f.uid ?? f.response?.id,
-        uid: f.uid ?? f.response?.uid,
-        status: f.status,
-        percent: f.percent,
-        objectName: f.objectName ?? f.response?.objectName,
-        bucketName: f.bucketName ?? f.response?.bucketName,
-        size: f.size ?? f.response?.size,
-        contentType: f.type ?? f.response?.contentType
-      });
+    const nextItems = dedupeAttachmentItems(items).slice(0, maxCount ?? Infinity);
+    valueRef.current = nextItems;
+    setFieldValue(fieldId, nextItems);
+    onChange?.(nextItems);
+  };
+  const replaceItem = (target, nextItem) => {
+    const targetKeys = new Set(
+      [target.id, target.uid, target.objectName, getAttachmentItemIdentity(target)].filter(Boolean)
+    );
+    let replaced = false;
+    const nextItems = valueRef.current.map((item) => {
+      const currentKeys = [item.id, item.uid, item.objectName, getAttachmentItemIdentity(item)];
+      if (currentKeys.some((key) => key && targetKeys.has(key))) {
+        replaced = true;
+        return nextItem;
+      }
+      return item;
     });
-    setValue(items);
+    if (!replaced) nextItems.push(nextItem);
+    setValue(nextItems);
   };
   const handleRemove = (file) => {
-    const removed = value.find((item) => item.id === file.uid || item.uid === file.uid);
-    const newValue = value.filter((item) => item.id !== file.uid && item.uid !== file.uid);
+    const fileKey = String(file.uid || file.id || file.objectName || "");
+    const removed = valueRef.current.find(
+      (item) => item.id === fileKey || item.uid === fileKey || item.objectName === fileKey
+    );
+    const newValue = valueRef.current.filter(
+      (item) => item.id !== fileKey && item.uid !== fileKey && item.objectName !== fileKey
+    );
     setValue(newValue);
     if (removed?.objectName) {
       api.deleteFile(removed.objectName, removed.bucketName || bucketName).catch(() => void 0);
     }
   };
   const handlePreview = async (file) => {
-    const item = value.find((current) => current.id === file.uid || current.uid === file.uid);
+    const item = valueRef.current.find(
+      (current) => current.id === file.uid || current.uid === file.uid || current.objectName === file.uid
+    );
     let url = item?.previewUrl || item?.url || file.url || file.thumbUrl;
     if (item?.objectName) {
       const ticket = await api.createFileAccessTicket(
@@ -1970,15 +2042,22 @@ function ImageFieldPC({
     }
     if (url) window.open(url, "_blank", "noopener,noreferrer");
   };
-  const fileList = value.map((item) => ({
-    uid: item.id,
-    name: item.name,
-    url: item.url,
-    thumbUrl: item.url,
-    status: item.status ?? "done",
-    percent: item.percent
-  }));
+  const handleDownload = async (item) => {
+    let url = item.downloadUrl || item.url;
+    if (item.objectName) {
+      const ticket = await api.createDownloadTicket(
+        item.bucketName || bucketName,
+        item.objectName,
+        item.name
+      );
+      url = typeof ticket === "string" ? ticket : ticket?.downloadUrl || ticket?.relayUrl || ticket?.url || url;
+    }
+    if (url) window.open(url, "_blank", "noopener,noreferrer");
+  };
   const beforeUpload = (file) => {
+    if (maxCount && valueRef.current.length >= maxCount) {
+      return false;
+    }
     if (!String(file.type || "").startsWith("image/") && !/\.(png|jpe?g|gif|bmp|svg|webp)$/i.test(file.name)) {
       return false;
     }
@@ -1990,26 +2069,27 @@ function ImageFieldPC({
   const customRequest = async ({ file, onProgress, onSuccess, onError }) => {
     const currentFile = file;
     const localItem = createLocalItem2(currentFile);
-    const nextValue = multiple ? [...value, localItem].slice(0, maxCount ?? Infinity) : [localItem];
+    const currentValue = valueRef.current.filter(
+      (item) => item.id !== localItem.id && item.uid !== localItem.uid
+    );
+    const nextValue = multiple ? [...currentValue, localItem] : [localItem];
     setValue(nextValue);
     try {
       const uploaded = await api.uploadFile(currentFile, bucketName, (percent) => {
         onProgress?.({ percent });
-        setValue(
-          nextValue.map(
-            (item) => item.id === localItem.id ? { ...item, percent, status: "uploading" } : item
-          )
-        );
-      });
-      const completed = normalizeAttachmentItem({
-        ...uploaded,
-        id: uploaded.id || localItem.id,
-        uid: uploaded.uid || localItem.uid,
-        url: uploaded.previewUrl || uploaded.url || localItem.url,
-        status: "done",
-        percent: 100
+        replaceItem(localItem, { ...localItem, percent, status: "uploading" });
       });
-      setValue(nextValue.map((item) => item.id === localItem.id ? completed : item));
+      const completed = normalizeAttachmentItem(
+        {
+          ...uploaded,
+          url: uploaded.previewUrl || uploaded.url || localItem.url,
+          previewUrl: uploaded.previewUrl || uploaded.url || localItem.url,
+          status: "done",
+          percent: 100
+        },
+        localItem
+      );
+      replaceItem(localItem, completed);
       onSuccess?.(completed);
     } catch (error) {
       const failed = {
@@ -2017,7 +2097,7 @@ function ImageFieldPC({
         status: "error",
         error: error?.message || "\u4E0A\u4F20\u5931\u8D25"
       };
-      setValue(nextValue.map((item) => item.id === localItem.id ? failed : item));
+      replaceItem(localItem, failed);
       onError?.(error);
     }
   };
@@ -2027,42 +2107,74 @@ function ImageFieldPC({
       {
         "data-testid": `imagefield-input-${fieldId}`,
         listType,
-        fileList,
+        fileList: [],
         customRequest,
         accept: accept ?? "image/*",
         maxCount,
         multiple,
         disabled,
-        showUploadList: {
-          showPreviewIcon,
-          showRemoveIcon,
-          showDownloadIcon
-        },
-        onChange: handleChange,
+        showUploadList: false,
         onRemove: handleRemove,
         onPreview: handlePreview,
         beforeUpload,
         children: (!maxCount || value.length < maxCount) && /* @__PURE__ */ jsx42("div", { "data-testid": `imagefield-upload-btn-${fieldId}`, children: "+ \u4E0A\u4F20\u56FE\u7247" })
       }
     ),
-    value.length > 0 && /* @__PURE__ */ jsx42("div", { className: "sy-image-grid", "data-testid": `imagefield-rich-grid-${fieldId}`, children: value.map((item) => /* @__PURE__ */ jsx42(
-      "button",
-      {
-        type: "button",
-        className: "sy-image-thumb",
-        disabled: item.status !== "done",
-        onClick: () => handlePreview({
-          uid: item.uid || item.id,
-          url: item.url,
-          thumbUrl: item.previewUrl
-        }),
-        children: item.url || item.previewUrl ? /* @__PURE__ */ jsx42("img", { src: item.previewUrl || item.url, alt: item.name }) : /* @__PURE__ */ jsxs7("span", { children: [
-          Math.round(item.percent ?? 0),
-          "%"
-        ] })
-      },
-      item.id || item.uid || item.name
-    )) })
+    value.length > 0 && /* @__PURE__ */ jsx42("div", { className: "sy-image-grid", "data-testid": `imagefield-rich-grid-${fieldId}`, children: value.map((item, index) => {
+      const itemKey = getAttachmentItemIdentity(item) || `${fieldId}-image-${String(index)}`;
+      const canAct = item.status === "done";
+      return /* @__PURE__ */ jsxs7(
+        "div",
+        {
+          className: "sy-image-thumb",
+          "data-testid": `imagefield-thumb-${itemKey}`,
+          children: [
+            /* @__PURE__ */ jsx42(
+              "button",
+              {
+                type: "button",
+                className: "sy-image-preview",
+                disabled: !canAct && !(item.previewUrl || item.url),
+                onClick: () => handlePreview({
+                  uid: item.uid || item.id,
+                  url: item.url,
+                  thumbUrl: item.previewUrl
+                }),
+                children: /* @__PURE__ */ jsx42(ImageThumbContent, { item })
+              }
+            ),
+            /* @__PURE__ */ jsxs7("div", { className: "sy-image-actions", children: [
+              showPreviewIcon && /* @__PURE__ */ jsx42(
+                "button",
+                {
+                  type: "button",
+                  disabled: !canAct,
+                  onClick: () => handlePreview({
+                    uid: item.uid || item.id,
+                    url: item.url,
+                    thumbUrl: item.previewUrl
+                  }),
+                  children: "\u9884\u89C8"
+                }
+              ),
+              showDownloadIcon && /* @__PURE__ */ jsx42("button", { type: "button", disabled: !canAct, onClick: () => handleDownload(item), children: "\u4E0B\u8F7D" }),
+              showRemoveIcon && /* @__PURE__ */ jsx42(
+                "button",
+                {
+                  type: "button",
+                  disabled,
+                  onClick: () => handleRemove({ uid: item.uid || item.id }),
+                  "data-testid": `remove-btn-${itemKey}`,
+                  children: "\u5220\u9664"
+                }
+              )
+            ] }),
+            canAct && item.size ? /* @__PURE__ */ jsx42("span", { className: "sy-image-meta", children: formatFileSize(item.size) }) : null
+          ]
+        },
+        `${itemKey}-${index}`
+      );
+    }) })
   ] });
 }
 
@@ -6346,15 +6458,15 @@ function FormProvider({
     ]
   );
   const registryComponents = components ?? defaultComponentRegistry;
-  return React34.createElement(
+  return React36.createElement(
     FormContext.Provider,
     { value: contextValue },
-    React34.createElement(ComponentRegistryProvider, { components: registryComponents, children })
+    React36.createElement(ComponentRegistryProvider, { components: registryComponents, children })
   );
 }
 
 // src/core/FormRenderer.tsx
-import React35 from "react";
+import React37 from "react";
 import { jsx as jsx69 } from "react/jsx-runtime";
 var columnsClassMap = {
   1: "sy-grid-cols-1",
@@ -6378,7 +6490,7 @@ function FieldRenderer({ field, fieldClassName }) {
     return null;
   }
   const { fieldId, componentName: _, ...fieldProps } = field;
-  return React35.createElement(Component, {
+  return React37.createElement(Component, {
     ...fieldProps,
     fieldId,
     className: fieldClassName ?? fieldProps.className
@@ -7178,7 +7290,7 @@ function FormTabs({ items, defaultActiveKey, className, tabClassName }) {
 }
 
 // src/layout/FormSteps/index.tsx
-import React39, { useState as useState20 } from "react";
+import React41, { useState as useState20 } from "react";
 import { jsx as jsx75, jsxs as jsxs27 } from "react/jsx-runtime";
 function FormSteps({ items, className, onStepChange }) {
   const [currentStep, setCurrentStep] = useState20(0);
@@ -7197,7 +7309,7 @@ function FormSteps({ items, className, onStepChange }) {
     }
   };
   return /* @__PURE__ */ jsxs27("div", { className: className ?? "w-full", "data-testid": "form-steps", children: [
-    /* @__PURE__ */ jsx75("div", { className: "flex items-center mb-6", "data-testid": "form-steps-indicator", children: items.map((item, index) => /* @__PURE__ */ jsxs27(React39.Fragment, { children: [
+    /* @__PURE__ */ jsx75("div", { className: "flex items-center mb-6", "data-testid": "form-steps-indicator", children: items.map((item, index) => /* @__PURE__ */ jsxs27(React41.Fragment, { children: [
       /* @__PURE__ */ jsxs27("div", { className: "flex items-center", children: [
         /* @__PURE__ */ jsx75(
           "div",
@@ -8654,7 +8766,7 @@ function defineFormSchema(schema) {
 }
 
 // src/modules/FormSummaryCard.tsx
-import { Fragment, jsx as jsx77, jsxs as jsxs29 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx77, jsxs as jsxs29 } from "react/jsx-runtime";
 var toneClasses = {
   brand: "bg-blue-50 text-blue-600",
   success: "bg-green-50 text-green-600",
@@ -8707,11 +8819,11 @@ var FormSummaryCard = ({
     creator && /* @__PURE__ */ jsxs29("div", { className: "flex items-center gap-2 mt-4 text-sm text-gray-600", children: [
       renderAvatar(),
       /* @__PURE__ */ jsx77("span", { className: "font-medium", children: creator.name }),
-      creator.department && /* @__PURE__ */ jsxs29(Fragment, { children: [
+      creator.department && /* @__PURE__ */ jsxs29(Fragment2, { children: [
         /* @__PURE__ */ jsx77("span", { className: "text-gray-300", children: "\xB7" }),
         /* @__PURE__ */ jsx77("span", { children: creator.department })
       ] }),
-      createdAt && /* @__PURE__ */ jsxs29(Fragment, { children: [
+      createdAt && /* @__PURE__ */ jsxs29(Fragment2, { children: [
         /* @__PURE__ */ jsx77("span", { className: "text-gray-300", children: "\xB7" }),
         /* @__PURE__ */ jsx77("span", { className: "text-gray-400", children: createdAt })
       ] })
@@ -9202,7 +9314,7 @@ var ApprovalTimeline = ({
 };
 
 // src/modules/ApprovalActionBar.tsx
-import React43, { useMemo as useMemo16, useState as useState32 } from "react";
+import React45, { useMemo as useMemo16, useState as useState32 } from "react";
 import { Form, Input as Input10, Modal as Modal5, Select as Select5 } from "antd";
 import {
   CheckOutlined,
@@ -9231,7 +9343,7 @@ var confirmAction = (title, content) => {
 };
 
 // src/modules/StickyActionBar.tsx
-import { Fragment as Fragment2, jsx as jsx81, jsxs as jsxs33 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx81, jsxs as jsxs33 } from "react/jsx-runtime";
 var getActionPriority = (action) => {
   const maybePriority = action.priority;
   if (typeof maybePriority === "number") return maybePriority;
@@ -9293,7 +9405,7 @@ var StickyActionBar = ({
         {
           className: `mx-auto flex w-full items-center gap-3 ${layoutMode === "approval" && !isMobile ? "justify-center" : "justify-end"}`,
           style: { maxWidth: maxWidthStyle },
-          children: isMobile ? /* @__PURE__ */ jsxs33(Fragment2, { children: [
+          children: isMobile ? /* @__PURE__ */ jsxs33(Fragment3, { children: [
             /* @__PURE__ */ jsx81("div", { className: "flex flex-1 gap-2", children: primaryMobile.map((action) => renderButton(action, true)) }),
             moreMobile.length > 0 && /* @__PURE__ */ jsx81(
               Dropdown,
@@ -9321,7 +9433,7 @@ var StickyActionBar = ({
 };
 
 // src/modules/ApprovalActionBar.tsx
-import { Fragment as Fragment3, jsx as jsx82, jsxs as jsxs34 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx82, jsxs as jsxs34 } from "react/jsx-runtime";
 var actionPriority = {
   agree: 10,
   approved: 10,
@@ -9371,14 +9483,14 @@ function DefaultTransferSelector({
   value,
   onChange
 }) {
-  const formContext = React43.useContext(FormContext);
+  const formContext = React45.useContext(FormContext);
   const [open, setOpen] = useState32(false);
   const [selectedUsers, setSelectedUsers] = useState32([]);
   if (!formContext) {
     return /* @__PURE__ */ jsx82(Input10, { value, onChange: (event) => onChange(event.target.value) });
   }
   const selectedLabel = selectedUsers[0] ? getUserName(selectedUsers[0]) : value;
-  return /* @__PURE__ */ jsxs34(Fragment3, { children: [
+  return /* @__PURE__ */ jsxs34(Fragment4, { children: [
     /* @__PURE__ */ jsx82(
       Input10,
       {
@@ -9519,7 +9631,7 @@ var ApprovalActionBar = ({
     };
   });
   const requiredComment = activeAction?.remark?.required || modalAction === "rejected" || modalAction === "withdraw";
-  return /* @__PURE__ */ jsxs34(Fragment3, { children: [
+  return /* @__PURE__ */ jsxs34(Fragment4, { children: [
     /* @__PURE__ */ jsx82(
       StickyActionBar,
       {
@@ -9565,7 +9677,7 @@ var ApprovalActionBar = ({
               )
             }
           ),
-          modalAction === "return" && /* @__PURE__ */ jsxs34(Fragment3, { children: [
+          modalAction === "return" && /* @__PURE__ */ jsxs34(Fragment4, { children: [
             formatReturnPolicy(returnPolicy) && /* @__PURE__ */ jsxs34("div", { className: "mb-3 text-sm text-gray-500", children: [
               "\u9000\u56DE\u540E\u5BA1\u6279\u903B\u8F91\uFF1A",
               formatReturnPolicy(returnPolicy)
@@ -9610,7 +9722,7 @@ var ApprovalActionBar = ({
 import { useMemo as useMemo17, useState as useState33 } from "react";
 import { Button as Button11, Dropdown as Dropdown2, Form as Form2, Input as Input11, Modal as Modal6 } from "antd";
 import { MoreOutlined as MoreOutlined2 } from "@ant-design/icons";
-import { Fragment as Fragment4, jsx as jsx83, jsxs as jsxs35 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx83, jsxs as jsxs35 } from "react/jsx-runtime";
 var priority = {
   agree: 10,
   approved: 10,
@@ -9724,7 +9836,7 @@ var ApprovalActions = ({
     },
     action.action
   );
-  return /* @__PURE__ */ jsxs35(Fragment4, { children: [
+  return /* @__PURE__ */ jsxs35(Fragment5, { children: [
     /* @__PURE__ */ jsxs35(
       "div",
       {
@@ -9788,7 +9900,7 @@ var ApprovalActions = ({
 // src/modules/FormActionBar.tsx
 import { useState as useState34 } from "react";
 import { Button as Button12 } from "antd";
-import { Fragment as Fragment5, jsx as jsx84, jsxs as jsxs36 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx84, jsxs as jsxs36 } from "react/jsx-runtime";
 var FormActionBar = ({
   actions,
   position = "bottom-fixed",
@@ -9849,7 +9961,7 @@ var FormActionBar = ({
     }
   );
   if (isFixed) {
-    return /* @__PURE__ */ jsxs36(Fragment5, { children: [
+    return /* @__PURE__ */ jsxs36(Fragment6, { children: [
       bar,
       /* @__PURE__ */ jsx84("div", { className: "h-16" })
     ] });
@@ -9859,7 +9971,7 @@ var FormActionBar = ({
 
 // src/modules/RuntimePageShell.tsx
 import { Alert, Empty as Empty4, Spin as Spin5 } from "antd";
-import { Fragment as Fragment6, jsx as jsx85, jsxs as jsxs37 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx85, jsxs as jsxs37 } from "react/jsx-runtime";
 var RuntimePageShell = ({
   children,
   actions,
@@ -9885,7 +9997,7 @@ var RuntimePageShell = ({
       return /* @__PURE__ */ jsx85(Alert, { type: "error", showIcon: true, message: "\u9875\u9762\u52A0\u8F7D\u5931\u8D25", description: error });
     }
     if (empty) {
-      return /* @__PURE__ */ jsx85(Fragment6, { children: empty });
+      return /* @__PURE__ */ jsx85(Fragment7, { children: empty });
     }
     return children;
   };
@@ -11483,7 +11595,7 @@ var DataManagementList = ({
 import { useState as useState36, useCallback as useCallback18 } from "react";
 import { Button as Button16, Select as Select7 } from "antd";
 import { CheckCircleFilled as CheckCircleFilled2 } from "@ant-design/icons";
-import { Fragment as Fragment7, jsx as jsx90, jsxs as jsxs42 } from "react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx90, jsxs as jsxs42 } from "react/jsx-runtime";
 var pickFormInstanceId = (value) => {
   if (!value) return void 0;
   if (typeof value === "string") return value;
@@ -11500,7 +11612,7 @@ var SubmitSuccessCard = ({
   renderSuccess
 }) => {
   if (renderSuccess) {
-    return /* @__PURE__ */ jsx90(Fragment7, { children: renderSuccess(info) });
+    return /* @__PURE__ */ jsx90(Fragment8, { children: renderSuccess(info) });
   }
   return /* @__PURE__ */ jsx90("div", { className: "bg-white rounded-xl shadow-sm border border-gray-100 p-6", children: /* @__PURE__ */ jsxs42("div", { className: "flex flex-col items-center py-16 animate-[fadeIn_0.3s_ease-out,scaleIn_0.3s_ease-out]", children: [
     /* @__PURE__ */ jsx90("div", { className: "w-12 h-12 rounded-full bg-green-100 flex items-center justify-center mb-4", children: /* @__PURE__ */ jsx90(CheckCircleFilled2, { className: "text-2xl text-green-500" }) }),