@sia.soul/sia-react-ui 0.1.35 → 0.1.37

package/dist/core.cjs

@@ -983,6 +983,17 @@ var coreIconPaths = {
     /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("circle", { cx: "10.8", cy: "10.8", r: "6.8" }),
     /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "m15.8 15.8 5.2 5.2M7.8 10.8h6" })
   ] }),
+  // 图片变换工具使用独立图标，便于在预览及其他编辑界面复用。
+  "flip-horizontal": /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_jsx_runtime5.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M12 3v18M3 6h5v12H3zM16 6h5v12h-5z" }) }),
+  "flip-vertical": /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_jsx_runtime5.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M3 12h18M6 3h12v5H6zM6 16h12v5H6z" }) }),
+  "rotate-left": /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M4 9a8 8 0 1 1 0 6M4 3v6h6" }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("rect", { x: "9", y: "9", width: "6", height: "6", rx: "1" })
+  ] }),
+  "rotate-right": /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M20 9a8 8 0 1 0 0 6M20 3v6h-6" }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("rect", { x: "9", y: "9", width: "6", height: "6", rx: "1" })
+  ] }),
   download: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_jsx_runtime5.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M12 3v12M7 10l5 5 5-5M4 20h16" }) }),
   upload: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_jsx_runtime5.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("path", { d: "M12 16V4M7 9l5-5 5 5M4 20h16" }) }),
   refresh: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
@@ -2523,11 +2534,98 @@ function Collapse({ items, activeKey, defaultActiveKey = [], accordion = false,
 }
 function ImagePreview({ open, src, alt = "", onOpenChange }) {
   const previewRef = (0, import_react15.useRef)(null);
+  const stageRef = (0, import_react15.useRef)(null);
+  const [natural, setNatural] = (0, import_react15.useState)({ src: "", width: 0, height: 0 });
+  const [area, setArea] = (0, import_react15.useState)({ width: 0, height: 0 });
+  const [zoom, setZoom] = (0, import_react15.useState)(1);
+  const [rotation, setRotation] = (0, import_react15.useState)(0);
+  const [flip, setFlip] = (0, import_react15.useState)({ x: 1, y: 1 });
+  const [pan, setPan] = (0, import_react15.useState)({ x: 0, y: 0 });
+  const [failed, setFailed] = (0, import_react15.useState)(false);
+  const drag = (0, import_react15.useRef)();
   useOverlayLifecycle(open, previewRef, () => onOpenChange(false));
+  const reset = () => {
+    setZoom(1);
+    setRotation(0);
+    setFlip({ x: 1, y: 1 });
+    setPan({ x: 0, y: 0 });
+    drag.current = void 0;
+  };
+  (0, import_react15.useEffect)(() => {
+    reset();
+    setFailed(false);
+  }, [open, src]);
+  (0, import_react15.useEffect)(() => {
+    const stage = stageRef.current;
+    if (!open || !stage) return;
+    const measure = () => {
+      setArea({ width: stage.clientWidth, height: stage.clientHeight });
+      setPan({ x: 0, y: 0 });
+    };
+    measure();
+    const observer = new ResizeObserver(measure);
+    observer.observe(stage);
+    return () => observer.disconnect();
+  }, [open, src]);
+  const ready = natural.src === src && natural.width > 0 && area.width > 0 && area.height > 0 && !failed;
+  const sideways = Math.abs(rotation % 180) === 90;
+  const fit = ready ? Math.min(1, area.width / (sideways ? natural.height : natural.width), area.height / (sideways ? natural.width : natural.height)) : 0;
+  const changeZoom = (factor) => setZoom((value) => Math.max(0.25, Math.min(8, value * factor)));
   if (!open || !src || typeof document === "undefined") return null;
   return (0, import_react_dom5.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { ref: previewRef, className: "sia-image-preview", role: "dialog", "aria-modal": "true", "aria-label": "\u56FE\u7247\u9884\u89C8", tabIndex: -1, onClick: () => onOpenChange(false), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("button", { type: "button", "aria-label": "\u5173\u95ED\u9884\u89C8", onClick: () => onOpenChange(false), children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Icon, { name: "close" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("img", { src, alt, onClick: (event) => event.stopPropagation() })
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Button, { variant: "text", className: "sia-image-preview__close", "aria-label": "\u5173\u95ED\u9884\u89C8", onClick: (event) => {
+      event.stopPropagation();
+      onOpenChange(false);
+    }, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Icon, { name: "close" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { ref: stageRef, className: "sia-image-preview__stage", children: failed ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "sia-image-preview__error", children: "\u56FE\u7247\u52A0\u8F7D\u5931\u8D25" }) : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+      "img",
+      {
+        src,
+        alt,
+        draggable: false,
+        style: { width: natural.width * fit, height: natural.height * fit, visibility: ready ? "visible" : "hidden", transform: `translate(${pan.x}px, ${pan.y}px) rotate(${rotation}deg) scale(${zoom * flip.x}, ${zoom * flip.y})` },
+        onLoad: (event) => setNatural({ src, width: event.currentTarget.naturalWidth, height: event.currentTarget.naturalHeight }),
+        onError: () => setFailed(true),
+        onClick: (event) => event.stopPropagation(),
+        onPointerDown: (event) => {
+          if (event.button !== 0) return;
+          event.preventDefault();
+          event.stopPropagation();
+          event.currentTarget.setPointerCapture(event.pointerId);
+          drag.current = { id: event.pointerId, x: event.clientX, y: event.clientY, left: pan.x, top: pan.y };
+        },
+        onPointerMove: (event) => {
+          const start = drag.current;
+          if (start?.id === event.pointerId) setPan({ x: start.left + event.clientX - start.x, y: start.top + event.clientY - start.y });
+        },
+        onPointerUp: () => {
+          drag.current = void 0;
+        },
+        onPointerCancel: () => {
+          drag.current = void 0;
+        },
+        onLostPointerCapture: () => {
+          drag.current = void 0;
+        }
+      },
+      src
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "sia-image-preview__toolbar", role: "toolbar", "aria-label": "\u56FE\u7247\u64CD\u4F5C", onClick: (event) => event.stopPropagation(), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Button, { variant: "text", title: "\u6C34\u5E73\u7FFB\u8F6C", "aria-label": "\u6C34\u5E73\u7FFB\u8F6C", disabled: !ready, onClick: () => setFlip((value) => ({ ...value, x: -value.x })), children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Icon, { name: "flip-horizontal", size: 20 }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Button, { variant: "text", title: "\u5782\u76F4\u7FFB\u8F6C", "aria-label": "\u5782\u76F4\u7FFB\u8F6C", disabled: !ready, onClick: () => setFlip((value) => ({ ...value, y: -value.y })), children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Icon, { name: "flip-vertical", size: 20 }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Button, { variant: "text", title: "\u5411\u5DE6\u65CB\u8F6C", "aria-label": "\u5411\u5DE6\u65CB\u8F6C", disabled: !ready, onClick: () => {
+        setRotation((value) => value - 90);
+        setPan({ x: 0, y: 0 });
+      }, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Icon, { name: "rotate-left", size: 20 }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Button, { variant: "text", title: "\u5411\u53F3\u65CB\u8F6C", "aria-label": "\u5411\u53F3\u65CB\u8F6C", disabled: !ready, onClick: () => {
+        setRotation((value) => value + 90);
+        setPan({ x: 0, y: 0 });
+      }, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Icon, { name: "rotate-right", size: 20 }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Button, { variant: "text", title: "\u7F29\u5C0F", "aria-label": "\u7F29\u5C0F", disabled: !ready || zoom <= 0.25, onClick: () => changeZoom(1 / 1.25), children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Icon, { name: "zoom-out", size: 20 }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("output", { className: "sia-image-preview__scale", "aria-label": "\u5F53\u524D\u7F29\u653E\u6BD4\u4F8B", "aria-live": "polite", children: ready ? `${Math.round(fit * zoom * 100)}%` : "\u2014" }),
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Button, { variant: "text", title: "\u653E\u5927", "aria-label": "\u653E\u5927", disabled: !ready || zoom >= 8, onClick: () => changeZoom(1.25), children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Icon, { name: "zoom-in", size: 20 }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Button, { variant: "text", title: "\u9002\u5E94\u7A97\u53E3", "aria-label": "\u9002\u5E94\u7A97\u53E3", disabled: !ready, onClick: reset, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Icon, { name: "refresh", size: 20 }) })
+    ] })
   ] }), document.body);
 }
 
@@ -4058,10 +4156,158 @@ function sendUploadRequest(config, options) {
   return { abort };
 }
 
-// src/components/Upload.tsx
+// src/components/uploadDownload.ts
+async function downloadUploadFile(file, request) {
+  let blob;
+  if (request) blob = await request(file);
+  else if (file.url) {
+    const response = await fetch(file.url);
+    if (!response.ok) throw new Error(`\u4E0B\u8F7D\u5931\u8D25\uFF08HTTP ${response.status}\uFF09`);
+    blob = await response.blob();
+  } else if (file.originFileObj) blob = file.originFileObj;
+  else throw new Error("\u6587\u4EF6\u7F3A\u5C11\u4E0B\u8F7D\u5730\u5740\u6216\u539F\u59CB\u5185\u5BB9");
+  if (!(blob instanceof Blob)) throw new Error("\u4E0B\u8F7D\u8BF7\u6C42\u5FC5\u987B\u8FD4\u56DE Blob \u6587\u4EF6\u5185\u5BB9");
+  const url = URL.createObjectURL(blob);
+  const anchor = document.createElement("a");
+  anchor.href = url;
+  anchor.download = file.name;
+  anchor.hidden = true;
+  document.body.append(anchor);
+  try {
+    anchor.click();
+  } finally {
+    anchor.remove();
+    window.setTimeout(() => URL.revokeObjectURL(url), 6e4);
+  }
+}
+
+// src/components/uploadImage.ts
+var imageExtension = /\.(png|jpe?g|gif|webp|avif|svg|bmp|ico|apng)$/i;
+function isUploadImage(file, accept) {
+  if (!file) return false;
+  if (file.thumbUrl) return true;
+  const type = (file.type || file.originFileObj?.type || "").toLowerCase();
+  if (type && type !== "application/octet-stream") return type.startsWith("image/");
+  if (/^data:image\//i.test(file.url || "")) return true;
+  let pathname = "";
+  try {
+    pathname = new URL(file.url || "", "https://upload.invalid").pathname;
+  } catch {
+  }
+  if (imageExtension.test(file.name) || imageExtension.test(pathname)) return true;
+  const rules = (accept || "").split(",").map((rule) => rule.trim().toLowerCase()).filter(Boolean);
+  return Boolean(file.url) && rules.length > 0 && rules.every((rule) => rule.startsWith("image/") || imageExtension.test(rule));
+}
+
+// src/components/Message.tsx
+var import_client4 = require("react-dom/client");
 var import_jsx_runtime22 = require("react/jsx-runtime");
+var messageSeed = 0;
+var messageRoot = null;
+var messageContainer = null;
+var messageItems = [];
+var defaultDuration = 3;
+var maxCount = 5;
+var messageTimers = /* @__PURE__ */ new Map();
+var messageIcons = {
+  info: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon, { name: "info", size: 18 }),
+  success: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon, { name: "circle-check", size: 18 }),
+  warning: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon, { name: "warning", size: 18 }),
+  error: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon, { name: "circle-close", size: 18 }),
+  loading: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon, { name: "loader", size: 18, spin: true })
+};
+function ensureMessageRoot() {
+  if (typeof document === "undefined") return false;
+  if (!messageContainer) {
+    messageContainer = document.createElement("div");
+    messageContainer.className = "sia-message-root";
+    document.body.appendChild(messageContainer);
+    messageRoot = (0, import_client4.createRoot)(messageContainer);
+  }
+  return true;
+}
+function renderMessages() {
+  if (!ensureMessageRoot()) return;
+  messageRoot.render(/* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "sia-message-list", "aria-live": "polite", children: messageItems.map((item) => /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: `sia-message sia-message--${item.type}`, role: item.type === "loading" ? "status" : "alert", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "sia-message__icon", "aria-hidden": "true", children: messageIcons[item.type] }),
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "sia-message__content", children: item.content }),
+    item.closable ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { type: "button", className: "sia-message__close", "aria-label": "\u5173\u95ED\u63D0\u793A", onClick: () => closeMessage(item.key), children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon, { name: "close", size: 14 }) }) : null
+  ] }, item.key)) }));
+}
+function closeMessage(key) {
+  const item = messageItems.find((candidate) => candidate.key === key);
+  const timer = messageTimers.get(key);
+  if (timer !== void 0) window.clearTimeout(timer);
+  messageTimers.delete(key);
+  messageItems = messageItems.filter((candidate) => candidate.key !== key);
+  item?.onClose?.();
+  renderMessages();
+}
+function scheduleMessage(item) {
+  const existingTimer = messageTimers.get(item.key);
+  if (existingTimer !== void 0) window.clearTimeout(existingTimer);
+  const duration = item.duration ?? (item.type === "loading" ? 0 : defaultDuration);
+  if (duration > 0) {
+    messageTimers.set(item.key, window.setTimeout(() => closeMessage(item.key), duration * 1e3));
+  }
+}
+function openMessage(input) {
+  const config = typeof input === "object" && input !== null && "content" in input ? input : { content: input };
+  const key = config.key ?? `sia-message-${++messageSeed}`;
+  const item = { ...config, key, type: config.type ?? "info" };
+  const existingIndex = messageItems.findIndex((candidate) => candidate.key === key);
+  if (existingIndex >= 0) messageItems = messageItems.map((candidate, index) => index === existingIndex ? item : candidate);
+  else messageItems = [...messageItems, item];
+  while (messageItems.length > maxCount) closeMessage(messageItems[0].key);
+  renderMessages();
+  scheduleMessage(item);
+  return {
+    close: () => closeMessage(key),
+    update(next) {
+      const current = messageItems.find((candidate) => candidate.key === key);
+      if (!current) return;
+      const updated = { ...current, ...next, key, type: next.type ?? current.type };
+      messageItems = messageItems.map((candidate) => candidate.key === key ? updated : candidate);
+      renderMessages();
+      scheduleMessage(updated);
+    }
+  };
+}
+function shortcut(type) {
+  return (content, duration) => openMessage({ content, duration, type });
+}
+var message = {
+  /** 直接打开实例，返回可用于更新或关闭的操作句柄。 */
+  open: openMessage,
+  /** 显示普通信息提示。 */
+  info: shortcut("info"),
+  /** 显示成功提示。 */
+  success: shortcut("success"),
+  /** 显示警告提示。 */
+  warning: shortcut("warning"),
+  /** 显示错误提示。 */
+  error: shortcut("error"),
+  /** 显示持续加载提示。 */
+  loading: shortcut("loading"),
+  /** 关闭指定实例；未指定标识时关闭所有实例。 */
+  destroy(key) {
+    if (key !== void 0) {
+      closeMessage(key);
+      return;
+    }
+    [...messageItems].forEach((item) => closeMessage(item.key));
+  },
+  /** 配置消息默认持续时间和最大同时显示数量。 */
+  config(config) {
+    if (config.duration !== void 0) defaultDuration = config.duration;
+    if (config.maxCount !== void 0) maxCount = Math.max(1, config.maxCount);
+  }
+};
+
+// src/components/Upload.tsx
+var import_jsx_runtime23 = require("react/jsx-runtime");
 var LIST_IGNORE = /* @__PURE__ */ Symbol("SIA_UPLOAD_LIST_IGNORE");
-function useThumbnail(file) {
+function useThumbnail(file, accept) {
   const [local, setLocal] = (0, import_react23.useState)();
   (0, import_react23.useEffect)(() => {
     if (!file?.thumbUrl && file?.originFileObj?.type.startsWith("image/")) {
@@ -4071,27 +4317,48 @@ function useThumbnail(file) {
     }
     setLocal(void 0);
   }, [file?.originFileObj, file?.thumbUrl]);
-  return file?.thumbUrl || local || (file?.type?.startsWith("image/") || /\.(png|jpe?g|gif|webp|avif|svg)(\?|$)/i.test(file?.url ?? "") ? file?.url : void 0);
+  return file?.thumbUrl || local || (isUploadImage(file, accept) ? file?.url : void 0);
 }
 function UploadItem({ file, files, props, actions }) {
-  const source = useThumbnail(file);
+  const source = useThumbnail(file, props.accept);
   const [failed, setFailed] = (0, import_react23.useState)(false);
+  const [downloading, setDownloading] = (0, import_react23.useState)(false);
+  const downloadingRef = (0, import_react23.useRef)(false);
+  const canPreview = !!(source || file.url || file.originFileObj || props.onPreview);
+  const canDownload = !!(file.url || file.originFileObj || props.downloadRequest);
+  async function download() {
+    if (downloadingRef.current) return;
+    downloadingRef.current = true;
+    setDownloading(true);
+    try {
+      await actions.download();
+    } catch {
+      message.error("\u4E0B\u8F7D\u5931\u8D25\uFF0C\u8BF7\u68C0\u67E5\u6587\u4EF6\u5730\u5740\u3001\u8BBF\u95EE\u6743\u9650\u6216\u8DE8\u57DF\u914D\u7F6E");
+    } finally {
+      downloadingRef.current = false;
+      setDownloading(false);
+    }
+  }
   (0, import_react23.useEffect)(() => setFailed(false), [source]);
-  const node = /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: `sia-upload__item sia-upload__item--${file.status ?? "ready"}`, children: [
-    props.listType !== "text" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Button, { variant: "text", className: "sia-upload__thumbnail", "aria-label": `\u9884\u89C8 ${file.name}`, onClick: actions.preview, disabled: !source && !props.onPreview, children: source && !failed ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("img", { src: source, alt: file.name, onError: () => setFailed(true) }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon, { name: file.type?.startsWith("image/") ? "image" : "file", size: 28 }) }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon, { name: file.status === "done" ? "circle-check" : "file", size: 16 }),
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "sia-upload__name", ...withTitleTooltip({ title: file.relativePath || file.name }), children: file.url ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("a", { href: file.url, target: "_blank", rel: "noreferrer", children: file.name }) : file.name }),
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Button, { variant: "text", className: "sia-upload__remove", disabled: props.disabled, "aria-label": `\u79FB\u9664 ${file.name}`, onClick: () => void actions.remove(), children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon, { name: "close", size: 14 }) }),
-    file.status === "uploading" && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "sia-upload__uploading", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("span", { children: [
+  const node = /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: `sia-upload__item sia-upload__item--${file.status ?? "ready"}`, children: [
+    props.listType !== "text" ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Button, { variant: "text", className: "sia-upload__thumbnail", "aria-label": `\u9884\u89C8\u7F29\u7565\u56FE ${file.name}`, onClick: actions.preview, disabled: !canPreview, children: source && !failed ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("img", { src: source, alt: file.name, onError: () => setFailed(true) }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Icon, { name: file.type?.startsWith("image/") ? "image" : "file", size: 28 }) }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Icon, { name: file.status === "done" ? "circle-check" : "file", size: 16 }),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "sia-upload__name", ...withTitleTooltip({ title: file.relativePath || file.name }), children: file.url ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("a", { href: file.url, target: "_blank", rel: "noreferrer", children: file.name }) : file.name }),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("span", { className: "sia-upload__actions", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Button, { variant: "text", title: "\u9884\u89C8", "aria-label": `\u9884\u89C8 ${file.name}`, disabled: !canPreview, onClick: actions.preview, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Icon, { name: "eye", size: 14 }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Button, { variant: "text", title: "\u4E0B\u8F7D", "aria-label": `\u4E0B\u8F7D ${file.name}`, disabled: !canDownload, loading: downloading, onClick: () => void download(), children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Icon, { name: "download", size: 14 }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Button, { variant: "text", title: "\u79FB\u9664", className: "sia-upload__remove", disabled: props.disabled, "aria-label": `\u79FB\u9664 ${file.name}`, onClick: () => void actions.remove(), children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Icon, { name: "close", size: 14 }) })
+    ] }),
+    file.status === "uploading" && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "sia-upload__uploading", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("span", { children: [
         "\u4E0A\u4F20\u4E2D ",
         Math.round(file.percent ?? 0),
         "%"
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "sia-upload__progress", role: "progressbar", "aria-label": `${file.name} \u4E0A\u4F20\u8FDB\u5EA6`, "aria-valuemin": 0, "aria-valuemax": 100, "aria-valuenow": file.percent ?? 0, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { style: { width: `${file.percent ?? 0}%` } }) })
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "sia-upload__progress", role: "progressbar", "aria-label": `${file.name} \u4E0A\u4F20\u8FDB\u5EA6`, "aria-valuemin": 0, "aria-valuemax": 100, "aria-valuenow": file.percent ?? 0, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { style: { width: `${file.percent ?? 0}%` } }) })
     ] }),
-    file.status === "error" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "sia-upload__error", children: "\u4E0A\u4F20\u5931\u8D25" })
+    file.status === "error" && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "sia-upload__error", children: "\u4E0A\u4F20\u5931\u8D25" })
   ] });
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_jsx_runtime22.Fragment, { children: props.itemRender ? props.itemRender(node, file, files, actions) : node });
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_jsx_runtime23.Fragment, { children: props.itemRender ? props.itemRender(node, file, files, actions) : node });
 }
 var UploadRoot = (0, import_react23.forwardRef)(function UploadRoot2({
   accept,
@@ -4105,6 +4372,7 @@ var UploadRoot = (0, import_react23.forwardRef)(function UploadRoot2({
   fileList,
   defaultFileList = [],
   listType = "text",
+  cardSize,
   showUploadList = true,
   beforeUpload,
   request,
@@ -4114,9 +4382,11 @@ var UploadRoot = (0, import_react23.forwardRef)(function UploadRoot2({
   onReject,
   onReadError,
   onPreview,
+  downloadRequest,
   itemRender,
   children,
   className = "",
+  style,
   onDragOver,
   onDragLeave,
   onDrop,
@@ -4124,6 +4394,10 @@ var UploadRoot = (0, import_react23.forwardRef)(function UploadRoot2({
   tabIndex,
   ...props
 }, ref) {
+  const cardDimension = (value) => value !== void 0 && Number.isFinite(value) ? Math.max(48, value) : 112;
+  const cardWidth = cardDimension(typeof cardSize === "number" ? cardSize : cardSize?.width);
+  const cardHeight = cardDimension(typeof cardSize === "number" ? cardSize : cardSize?.height);
+  const compactCard = listType === "picture-card" && (cardWidth < 88 || cardHeight < 88);
   const inputRef = (0, import_react23.useRef)(null);
   const [internalFiles, setInternalFiles] = (0, import_react23.useState)(defaultFileList);
   const files = fileList ?? internalFiles;
@@ -4133,7 +4407,7 @@ var UploadRoot = (0, import_react23.forwardRef)(function UploadRoot2({
   const mounted = (0, import_react23.useRef)(true);
   const [dragging, setDragging] = (0, import_react23.useState)(false);
   const [preview, setPreview] = (0, import_react23.useState)();
-  const previewSource = useThumbnail(preview);
+  const previewSource = useThumbnail(preview, accept);
   const limit = maxCount2 === void 0 || !Number.isFinite(maxCount2) ? Infinity : Math.max(0, Math.floor(maxCount2));
   const full = files.length >= limit;
   const current = (0, import_react23.useRef)({ disabled, directory, recursive });
@@ -4313,18 +4587,19 @@ var UploadRoot = (0, import_react23.forwardRef)(function UploadRoot2({
     event.preventDefault();
     ingest(selected.map((file) => ({ file, path: file.name })));
   }
-  const trigger = !(listType === "picture-card" && full) && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "sia-upload__trigger", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Button, { className: "sia-upload__choose", disabled: disabled || full, onClick: () => inputRef.current?.click(), children: children ?? (listType === "picture-card" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon, { name: "plus", size: 24 }),
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: "\u4E0A\u4F20\u56FE\u7247" })
-  ] }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon, { name: "upload", size: 16 }),
+  const trigger = !(listType === "picture-card" && full) && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "sia-upload__trigger", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Button, { className: "sia-upload__choose", "aria-label": compactCard ? directory ? "\u9009\u62E9\u6587\u4EF6\u5939" : "\u9009\u62E9\u6587\u4EF6" : void 0, disabled: disabled || full, onClick: () => inputRef.current?.click(), children: children ?? (listType === "picture-card" ? /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Icon, { name: "plus", size: 24 }),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { children: "\u4E0A\u4F20\u56FE\u7247" })
+  ] }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Icon, { name: "upload", size: 16 }),
     directory ? "\u9009\u62E9\u6587\u4EF6\u5939" : "\u9009\u62E9\u6587\u4EF6"
   ] })) }) });
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
     "div",
     {
       ...withTitleTooltip(props),
-      className: `sia-upload sia-upload--${listType}${dragging ? " is-dragging" : ""}${disabled ? " is-disabled" : ""} ${className}`.trim(),
+      className: `sia-upload sia-upload--${listType}${compactCard ? " sia-upload--compact-card" : ""}${dragging ? " is-dragging" : ""}${disabled ? " is-disabled" : ""} ${className}`.trim(),
+      style: listType === "picture-card" ? { "--sia-upload-card-width": `${cardWidth}px`, "--sia-upload-card-height": `${cardHeight}px`, ...style } : style,
       tabIndex: tabIndex ?? (pastable && !disabled ? 0 : void 0),
       onPaste: handlePaste,
       onDragOver: (event) => {
@@ -4340,7 +4615,7 @@ var UploadRoot = (0, import_react23.forwardRef)(function UploadRoot2({
       },
       onDrop: (event) => void handleDrop(event),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           "input",
           {
             ref: inputRef,
@@ -4357,19 +4632,25 @@ var UploadRoot = (0, import_react23.forwardRef)(function UploadRoot2({
           }
         ),
         listType !== "picture-card" && trigger,
-        /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "sia-upload__list", children: [
-          showUploadList && files.map((file) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(UploadItem, { file, files, props: { listType, disabled, itemRender, onPreview }, actions: {
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "sia-upload__list", children: [
+          showUploadList && files.map((file) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(UploadItem, { file, files, props: { listType, disabled, itemRender, onPreview, downloadRequest, accept }, actions: {
             upload: () => start(file),
             abort: () => abort(file.uid),
             remove: () => remove(file.uid),
+            download: () => downloadUploadFile(file, downloadRequest),
             preview: () => {
               if (onPreview) onPreview(file);
-              else setPreview(file);
+              else if (isUploadImage(file, accept)) setPreview(file);
+              else if (file.url || file.originFileObj) {
+                const url = file.url || URL.createObjectURL(file.originFileObj);
+                window.open(url, "_blank", "noopener,noreferrer");
+                if (!file.url) window.setTimeout(() => URL.revokeObjectURL(url), 6e4);
+              } else if (file.thumbUrl) setPreview(file);
             }
           } }, file.uid)),
           listType === "picture-card" && trigger
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ImagePreview, { open: !!preview && !!(preview.url || previewSource), src: preview?.url || previewSource, alt: preview?.name, onOpenChange: (open) => {
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ImagePreview, { open: !!preview && !!(preview.url || previewSource), src: preview?.url || previewSource, alt: preview?.name, onOpenChange: (open) => {
           if (!open) setPreview(void 0);
         } })
       ]
@@ -4377,15 +4658,15 @@ var UploadRoot = (0, import_react23.forwardRef)(function UploadRoot2({
   );
 });
 var UploadDragger = (0, import_react23.forwardRef)(function UploadDragger2({ hint = "\u652F\u6301\u5355\u4E2A\u6216\u6279\u91CF\u4E0A\u4F20", children, className = "", ...props }, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(UploadRoot, { ...props, ref, className: `sia-upload-dragger ${className}`.trim(), children: children ?? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("span", { className: "sia-upload-dragger__content", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon, { name: "upload", size: 32 }),
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("strong", { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(UploadRoot, { ...props, ref, className: `sia-upload-dragger ${className}`.trim(), children: children ?? /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("span", { className: "sia-upload-dragger__content", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Icon, { name: "upload", size: 32 }),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("strong", { children: [
       "\u70B9\u51FB\u6216\u62D6\u62FD",
       props.directory ? "\u6587\u4EF6\u5939" : "\u6587\u4EF6",
       "\u5230\u6B64\u533A\u57DF\u4E0A\u4F20"
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: hint }),
-    props.pastable && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: "\u805A\u7126\u6B64\u533A\u57DF\u540E\u6309 Ctrl / \u2318 + V \u7C98\u8D34\u6587\u4EF6\u6216\u622A\u56FE" })
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { children: hint }),
+    props.pastable && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { children: "\u805A\u7126\u6B64\u533A\u57DF\u540E\u6309 Ctrl / \u2318 + V \u7C98\u8D34\u6587\u4EF6\u6216\u622A\u56FE" })
   ] }) });
 });
 var Upload = Object.assign(UploadRoot, {
@@ -4395,111 +4676,6 @@ var Upload = Object.assign(UploadRoot, {
   LIST_IGNORE
 });
 
-// src/components/Message.tsx
-var import_client4 = require("react-dom/client");
-var import_jsx_runtime23 = require("react/jsx-runtime");
-var messageSeed = 0;
-var messageRoot = null;
-var messageContainer = null;
-var messageItems = [];
-var defaultDuration = 3;
-var maxCount = 5;
-var messageTimers = /* @__PURE__ */ new Map();
-var messageIcons = {
-  info: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Icon, { name: "info", size: 18 }),
-  success: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Icon, { name: "circle-check", size: 18 }),
-  warning: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Icon, { name: "warning", size: 18 }),
-  error: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Icon, { name: "circle-close", size: 18 }),
-  loading: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Icon, { name: "loader", size: 18, spin: true })
-};
-function ensureMessageRoot() {
-  if (typeof document === "undefined") return false;
-  if (!messageContainer) {
-    messageContainer = document.createElement("div");
-    messageContainer.className = "sia-message-root";
-    document.body.appendChild(messageContainer);
-    messageRoot = (0, import_client4.createRoot)(messageContainer);
-  }
-  return true;
-}
-function renderMessages() {
-  if (!ensureMessageRoot()) return;
-  messageRoot.render(/* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "sia-message-list", "aria-live": "polite", children: messageItems.map((item) => /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: `sia-message sia-message--${item.type}`, role: item.type === "loading" ? "status" : "alert", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "sia-message__icon", "aria-hidden": "true", children: messageIcons[item.type] }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "sia-message__content", children: item.content }),
-    item.closable ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("button", { type: "button", className: "sia-message__close", "aria-label": "\u5173\u95ED\u63D0\u793A", onClick: () => closeMessage(item.key), children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Icon, { name: "close", size: 14 }) }) : null
-  ] }, item.key)) }));
-}
-function closeMessage(key) {
-  const item = messageItems.find((candidate) => candidate.key === key);
-  const timer = messageTimers.get(key);
-  if (timer !== void 0) window.clearTimeout(timer);
-  messageTimers.delete(key);
-  messageItems = messageItems.filter((candidate) => candidate.key !== key);
-  item?.onClose?.();
-  renderMessages();
-}
-function scheduleMessage(item) {
-  const existingTimer = messageTimers.get(item.key);
-  if (existingTimer !== void 0) window.clearTimeout(existingTimer);
-  const duration = item.duration ?? (item.type === "loading" ? 0 : defaultDuration);
-  if (duration > 0) {
-    messageTimers.set(item.key, window.setTimeout(() => closeMessage(item.key), duration * 1e3));
-  }
-}
-function openMessage(input) {
-  const config = typeof input === "object" && input !== null && "content" in input ? input : { content: input };
-  const key = config.key ?? `sia-message-${++messageSeed}`;
-  const item = { ...config, key, type: config.type ?? "info" };
-  const existingIndex = messageItems.findIndex((candidate) => candidate.key === key);
-  if (existingIndex >= 0) messageItems = messageItems.map((candidate, index) => index === existingIndex ? item : candidate);
-  else messageItems = [...messageItems, item];
-  while (messageItems.length > maxCount) closeMessage(messageItems[0].key);
-  renderMessages();
-  scheduleMessage(item);
-  return {
-    close: () => closeMessage(key),
-    update(next) {
-      const current = messageItems.find((candidate) => candidate.key === key);
-      if (!current) return;
-      const updated = { ...current, ...next, key, type: next.type ?? current.type };
-      messageItems = messageItems.map((candidate) => candidate.key === key ? updated : candidate);
-      renderMessages();
-      scheduleMessage(updated);
-    }
-  };
-}
-function shortcut(type) {
-  return (content, duration) => openMessage({ content, duration, type });
-}
-var message = {
-  /** 直接打开实例，返回可用于更新或关闭的操作句柄。 */
-  open: openMessage,
-  /** 显示普通信息提示。 */
-  info: shortcut("info"),
-  /** 显示成功提示。 */
-  success: shortcut("success"),
-  /** 显示警告提示。 */
-  warning: shortcut("warning"),
-  /** 显示错误提示。 */
-  error: shortcut("error"),
-  /** 显示持续加载提示。 */
-  loading: shortcut("loading"),
-  /** 关闭指定实例；未指定标识时关闭所有实例。 */
-  destroy(key) {
-    if (key !== void 0) {
-      closeMessage(key);
-      return;
-    }
-    [...messageItems].forEach((item) => closeMessage(item.key));
-  },
-  /** 配置消息默认持续时间和最大同时显示数量。 */
-  config(config) {
-    if (config.duration !== void 0) defaultDuration = config.duration;
-    if (config.maxCount !== void 0) maxCount = Math.max(1, config.maxCount);
-  }
-};
-
 // src/components/Breadcrumb.tsx
 var import_jsx_runtime24 = require("react/jsx-runtime");
 function Breadcrumb({ items, separator = "/", itemRender, className = "", ...props }) {