@chaoswise/ui 3.0.22 → 3.1.0

package/lib/Antd5/typography/style/mixins.js

@@ -16,7 +16,6 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 import { gold } from '@ant-design/colors';
 import { unit } from '@ant-design/cssinjs';
 import { operationUnit } from '../../style';
-// eslint-disable-next-line import/prefer-default-export
 var getTitleStyle = function getTitleStyle(fontSize, lineHeight, color, token) {
   var titleMarginBottom = token.titleMarginBottom,
     fontWeightStrong = token.fontWeightStrong;
@@ -28,7 +27,6 @@ var getTitleStyle = function getTitleStyle(fontSize, lineHeight, color, token) {
     lineHeight: lineHeight
   };
 };
-// eslint-disable-next-line import/prefer-default-export
 export var getTitleStyles = function getTitleStyles(token) {
   var headings = [1, 2, 3, 4, 5];
   var styles = {};
@@ -41,10 +39,7 @@ export var getLinkStyles = function getLinkStyles(token) {
   var componentCls = token.componentCls;
   return {
     'a&, a': _objectSpread(_objectSpread({}, operationUnit(token)), {}, _defineProperty({
-      textDecoration: token.linkDecoration,
-      '&:active, &:hover': {
-        textDecoration: token.linkHoverDecoration
-      }
+      userSelect: 'text'
     }, "&[disabled], &".concat(componentCls, "-disabled"), {
       color: token.colorTextDisabled,
       cursor: 'not-allowed',
@@ -185,12 +180,11 @@ export var getCopyableStyles = function getCopyableStyles(token) {
   });
 };
 export var getEllipsisStyles = function getEllipsisStyles() {
-  return _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "\n  a&-ellipsis,\n  span&-ellipsis\n  ", {
+  return _defineProperty(_defineProperty(_defineProperty({}, "\n  a&-ellipsis,\n  span&-ellipsis\n  ", {
     display: 'inline-block',
     maxWidth: '100%'
-  }), '&-single-line', {
-    whiteSpace: 'nowrap'
   }), '&-ellipsis-single-line', {
+    whiteSpace: 'nowrap',
     overflow: 'hidden',
     textOverflow: 'ellipsis',
     // https://blog.csdn.net/iefreer/article/details/50421025

package/lib/Antd5/upload/Upload.js

@@ -18,42 +18,20 @@ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length)
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from "react";
-import { flushSync } from "react-dom";
-import classNames from "classnames";
-import RcUpload from "rc-upload";
-import useMergedState from "rc-util/lib/hooks/useMergedState";
-import { devUseWarning } from "../_util/warning";
-import { ConfigContext } from "../config-provider";
-import DisabledContext from "../config-provider/DisabledContext";
-import { useLocale } from "../locale";
-import defaultLocale from "../locale/en_US";
-import useStyle from "./style";
-import UploadList from "./UploadList";
-import { file2Obj, getFileItem, removeFileItem, updateFileList } from "./utils";
-import { CloudUploadOutlined } from "@ant-design/icons";
-// @ts-ignore
-import { useIntl } from "../../locales";
+import * as React from 'react';
+import { flushSync } from 'react-dom';
+import classNames from 'classnames';
+import RcUpload from 'rc-upload';
+import useMergedState from 'rc-util/lib/hooks/useMergedState';
+import { devUseWarning } from '../_util/warning';
+import { ConfigContext } from '../config-provider';
+import DisabledContext from '../config-provider/DisabledContext';
+import { useLocale } from '../locale';
+import defaultLocale from '../locale/en_US';
+import useStyle from './style';
+import UploadList from './UploadList';
+import { file2Obj, getFileItem, removeFileItem, updateFileList } from './utils';
 export var LIST_IGNORE = "__LIST_IGNORE_".concat(Date.now(), "__");
-var DefaultChildren = function DefaultChildren(props) {
-  var title = props.title,
-    description = props.description,
-    prefixCls = props.prefixCls;
-  var intl = useIntl();
-  return _jsxs("div", {
-    className: "".concat(prefixCls, "-drag-wrapper"),
-    children: [_jsx("p", {
-      className: "".concat(prefixCls, "-drag-icon-wrapper"),
-      children: _jsx(CloudUploadOutlined, {})
-    }), _jsx("div", {
-      className: "".concat(prefixCls, "-drag-text"),
-      children: title !== null && title !== void 0 ? title : intl.get("dda16720-d447-4d73-9e71-b5af7b5bbcfd").d("单击或拖动文件到此区域")
-    }), description && _jsx("div", {
-      className: "".concat(prefixCls, "-drag-desc"),
-      children: description
-    })]
-  });
-};
 var InternalUpload = function InternalUpload(props, ref) {
   var fileList = props.fileList,
     defaultFileList = props.defaultFileList,
@@ -61,7 +39,7 @@ var InternalUpload = function InternalUpload(props, ref) {
     _props$showUploadList = props.showUploadList,
     showUploadList = _props$showUploadList === void 0 ? true : _props$showUploadList,
     _props$listType = props.listType,
-    listType = _props$listType === void 0 ? "text" : _props$listType,
+    listType = _props$listType === void 0 ? 'text' : _props$listType,
     onPreview = props.onPreview,
     onDownload = props.onDownload,
     onChange = props.onChange,
@@ -75,7 +53,7 @@ var InternalUpload = function InternalUpload(props, ref) {
     customizePrefixCls = props.prefixCls,
     className = props.className,
     _props$type = props.type,
-    type = _props$type === void 0 ? "select" : _props$type,
+    type = _props$type === void 0 ? 'select' : _props$type,
     children = props.children,
     style = props.style,
     itemRender = props.itemRender,
@@ -87,15 +65,12 @@ var InternalUpload = function InternalUpload(props, ref) {
     _props$hasControlInsi = props.hasControlInside,
     hasControlInside = _props$hasControlInsi === void 0 ? true : _props$hasControlInsi,
     _props$action = props.action,
-    action = _props$action === void 0 ? "" : _props$action,
+    action = _props$action === void 0 ? '' : _props$action,
     _props$accept = props.accept,
-    accept = _props$accept === void 0 ? "" : _props$accept,
+    accept = _props$accept === void 0 ? '' : _props$accept,
     _props$supportServerR = props.supportServerRender,
     supportServerRender = _props$supportServerR === void 0 ? true : _props$supportServerR,
-    rootClassName = props.rootClassName,
-    title = props.title,
-    description = props.description,
-    dropSingleFileUpload = props.dropSingleFileUpload;
+    rootClassName = props.rootClassName;
   // ===================== Disabled =====================
   var disabled = React.useContext(DisabledContext);
   var mergedDisabled = customDisabled !== null && customDisabled !== void 0 ? customDisabled : disabled;
@@ -108,16 +83,16 @@ var InternalUpload = function InternalUpload(props, ref) {
     _useMergedState2 = _slicedToArray(_useMergedState, 2),
     mergedFileList = _useMergedState2[0],
     setMergedFileList = _useMergedState2[1];
-  var _React$useState = React.useState("drop"),
+  var _React$useState = React.useState('drop'),
     _React$useState2 = _slicedToArray(_React$useState, 2),
     dragState = _React$useState2[0],
     setDragState = _React$useState2[1];
   var upload = React.useRef(null);
   var wrapRef = React.useRef(null);
-  if (process.env.NODE_ENV !== "production") {
-    var warning = devUseWarning("Upload");
-    warning("fileList" in props || !("value" in props), "usage", "`value` is not a valid prop, do you mean `fileList`?");
-    warning.deprecated(!("transformFile" in props), "transformFile", "beforeUpload");
+  if (process.env.NODE_ENV !== 'production') {
+    var warning = devUseWarning('Upload');
+    warning('fileList' in props || !('value' in props), 'usage', '`value` is not a valid prop, do you mean `fileList`?');
+    warning.deprecated(!('transformFile' in props), 'transformFile', 'beforeUpload');
   }
   // Control mode will auto fill file uid if not provided
   React.useMemo(function () {
@@ -132,7 +107,7 @@ var InternalUpload = function InternalUpload(props, ref) {
     var cloneList = _toConsumableArray(changedFileList);
     var exceedMaxCount = false;
     // Cut to match count
-    if (maxCount === 1 || dropSingleFileUpload) {
+    if (maxCount === 1) {
       cloneList = cloneList.slice(-1);
     } else if (maxCount) {
       exceedMaxCount = cloneList.length > maxCount;
@@ -150,7 +125,7 @@ var InternalUpload = function InternalUpload(props, ref) {
     if (event) {
       changeInfo.event = event;
     }
-    if (!exceedMaxCount || file.status === "removed" ||
+    if (!exceedMaxCount || file.status === 'removed' ||
     // We should ignore event if current file is exceed `maxCount`
     cloneList.some(function (f) {
       return f.uid === file.uid;
@@ -194,7 +169,7 @@ var InternalUpload = function InternalUpload(props, ref) {
             });
             return _context.abrupt("return", false);
           case 12:
-            if (_typeof(result) === "object" && result) {
+            if (_typeof(result) === 'object' && result) {
               parsedFile = result;
             }
           case 13:
@@ -247,7 +222,7 @@ var InternalUpload = function InternalUpload(props, ref) {
           clone = new File([originFileObj], originFileObj.name, {
             type: originFileObj.type
           });
-        } catch (e) {
+        } catch (_unused) {
           clone = new Blob([originFileObj], {
             type: originFileObj.type
           });
@@ -259,17 +234,18 @@ var InternalUpload = function InternalUpload(props, ref) {
         triggerFileObj = clone;
       } else {
         // Inject `uploading` status
-        fileObj.status = "uploading";
+        fileObj.status = 'uploading';
       }
       onInternalChange(triggerFileObj, newFileList);
     });
   };
   var onSuccess = function onSuccess(response, file, xhr) {
     try {
-      if (typeof response === "string") {
+      if (typeof response === 'string') {
+        // biome-ignore lint/style/noParameterAssign: we need to modify response
         response = JSON.parse(response);
       }
-    } catch (e) {
+    } catch (_unused2) {
       /* do nothing */
     }
     // removed
@@ -277,7 +253,7 @@ var InternalUpload = function InternalUpload(props, ref) {
       return;
     }
     var targetItem = file2Obj(file);
-    targetItem.status = "done";
+    targetItem.status = 'done';
     targetItem.percent = 100;
     targetItem.response = response;
     targetItem.xhr = xhr;
@@ -290,7 +266,7 @@ var InternalUpload = function InternalUpload(props, ref) {
       return;
     }
     var targetItem = file2Obj(file);
-    targetItem.status = "uploading";
+    targetItem.status = 'uploading';
     targetItem.percent = e.percent;
     var nextFileList = updateFileList(targetItem, mergedFileList);
     onInternalChange(targetItem, nextFileList, e);
@@ -303,13 +279,13 @@ var InternalUpload = function InternalUpload(props, ref) {
     var targetItem = file2Obj(file);
     targetItem.error = error;
     targetItem.response = response;
-    targetItem.status = "error";
+    targetItem.status = 'error';
     var nextFileList = updateFileList(targetItem, mergedFileList);
     onInternalChange(targetItem, nextFileList);
   };
   var handleRemove = function handleRemove(file) {
     var currentFile;
-    Promise.resolve(typeof onRemove === "function" ? onRemove(file) : onRemove).then(function (ret) {
+    Promise.resolve(typeof onRemove === 'function' ? onRemove(file) : onRemove).then(function (ret) {
       // Prevent removing file
       if (ret === false) {
         return;
@@ -318,12 +294,12 @@ var InternalUpload = function InternalUpload(props, ref) {
       if (removedFileList) {
         var _upload$current;
         currentFile = _objectSpread(_objectSpread({}, file), {}, {
-          status: "removed"
+          status: 'removed'
         });
         mergedFileList === null || mergedFileList === void 0 || mergedFileList.forEach(function (item) {
-          var matchKey = currentFile.uid !== undefined ? "uid" : "name";
+          var matchKey = currentFile.uid !== undefined ? 'uid' : 'name';
           if (item[matchKey] === currentFile[matchKey] && !Object.isFrozen(item)) {
-            item.status = "removed";
+            item.status = 'removed';
           }
         });
         (_upload$current = upload.current) === null || _upload$current === void 0 || _upload$current.abort(currentFile);
@@ -333,7 +309,7 @@ var InternalUpload = function InternalUpload(props, ref) {
   };
   var onFileDrop = function onFileDrop(e) {
     setDragState(e.type);
-    if (e.type === "drop") {
+    if (e.type === 'drop') {
       onDrop === null || onDrop === void 0 || onDrop(e);
     }
   };
@@ -353,7 +329,7 @@ var InternalUpload = function InternalUpload(props, ref) {
     getPrefixCls = _React$useContext.getPrefixCls,
     direction = _React$useContext.direction,
     ctxUpload = _React$useContext.upload;
-  var prefixCls = getPrefixCls("upload", customizePrefixCls);
+  var prefixCls = getPrefixCls('upload', customizePrefixCls);
   var rcUploadProps = _objectSpread(_objectSpread({
     onBatchStart: onBatchStart,
     onError: onError,
@@ -373,8 +349,6 @@ var InternalUpload = function InternalUpload(props, ref) {
   });
   delete rcUploadProps.className;
   delete rcUploadProps.style;
-  rcUploadProps === null || rcUploadProps === void 0 || delete rcUploadProps.title;
-  rcUploadProps === null || rcUploadProps === void 0 || delete rcUploadProps.description;
   // Remove id to avoid open by label when trigger is hidden
   // !children: https://github.com/ant-design/ant-design/issues/14298
   // disabled: https://github.com/ant-design/ant-design/issues/16478
@@ -388,18 +362,19 @@ var InternalUpload = function InternalUpload(props, ref) {
     wrapCSSVar = _useStyle2[0],
     hashId = _useStyle2[1],
     cssVarCls = _useStyle2[2];
-  var _useLocale = useLocale("Upload", defaultLocale.Upload),
+  var _useLocale = useLocale('Upload', defaultLocale.Upload),
     _useLocale2 = _slicedToArray(_useLocale, 1),
     contextLocale = _useLocale2[0];
-  var _ref2 = typeof showUploadList === "boolean" ? {} : showUploadList,
+  var _ref2 = typeof showUploadList === 'boolean' ? {} : showUploadList,
     showRemoveIcon = _ref2.showRemoveIcon,
     showPreviewIcon = _ref2.showPreviewIcon,
     showDownloadIcon = _ref2.showDownloadIcon,
     removeIcon = _ref2.removeIcon,
     previewIcon = _ref2.previewIcon,
-    downloadIcon = _ref2.downloadIcon;
+    downloadIcon = _ref2.downloadIcon,
+    extra = _ref2.extra;
   // use showRemoveIcon if it is specified explicitly
-  var realShowRemoveIcon = typeof showRemoveIcon === "undefined" ? !mergedDisabled : !!showRemoveIcon;
+  var realShowRemoveIcon = typeof showRemoveIcon === 'undefined' ? !mergedDisabled : showRemoveIcon;
   var renderUploadList = function renderUploadList(button, buttonVisible) {
     if (!showUploadList) {
       return button;
@@ -419,6 +394,7 @@ var InternalUpload = function InternalUpload(props, ref) {
       previewIcon: previewIcon,
       downloadIcon: downloadIcon,
       iconRender: iconRender,
+      extra: extra,
       locale: _objectSpread(_objectSpread({}, contextLocale), propLocale),
       isImageUrl: isImageUrl,
       progress: progress,
@@ -428,13 +404,13 @@ var InternalUpload = function InternalUpload(props, ref) {
       disabled: mergedDisabled
     });
   };
-  var mergedCls = classNames(wrapperCls, className, rootClassName, hashId, cssVarCls, ctxUpload === null || ctxUpload === void 0 ? void 0 : ctxUpload.className, _defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-rtl"), direction === "rtl"), "".concat(prefixCls, "-picture-card-wrapper"), listType === "picture-card"), "".concat(prefixCls, "-picture-circle-wrapper"), listType === "picture-circle"));
+  var mergedCls = classNames(wrapperCls, className, rootClassName, hashId, cssVarCls, ctxUpload === null || ctxUpload === void 0 ? void 0 : ctxUpload.className, _defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-rtl"), direction === 'rtl'), "".concat(prefixCls, "-picture-card-wrapper"), listType === 'picture-card'), "".concat(prefixCls, "-picture-circle-wrapper"), listType === 'picture-circle'));
   var mergedStyle = _objectSpread(_objectSpread({}, ctxUpload === null || ctxUpload === void 0 ? void 0 : ctxUpload.style), style);
   // ======================== Render ========================
-  if (type === "drag") {
+  if (type === 'drag') {
     var dragCls = classNames(hashId, prefixCls, "".concat(prefixCls, "-drag"), _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-drag-uploading"), mergedFileList.some(function (file) {
-      return file.status === "uploading";
-    })), "".concat(prefixCls, "-drag-hover"), dragState === "dragover"), "".concat(prefixCls, "-disabled"), mergedDisabled), "".concat(prefixCls, "-rtl"), direction === "rtl"));
+      return file.status === 'uploading';
+    })), "".concat(prefixCls, "-drag-hover"), dragState === 'dragover'), "".concat(prefixCls, "-disabled"), mergedDisabled), "".concat(prefixCls, "-rtl"), direction === 'rtl'));
     return wrapCSSVar(_jsxs("span", {
       className: mergedCls,
       ref: wrapRef,
@@ -449,11 +425,7 @@ var InternalUpload = function InternalUpload(props, ref) {
           className: "".concat(prefixCls, "-btn"),
           children: _jsx("div", {
             className: "".concat(prefixCls, "-drag-container"),
-            children: children ? children : _jsx(DefaultChildren, {
-              title: title,
-              description: description,
-              prefixCls: prefixCls
-            })
+            children: children
           })
         }))
       }), renderUploadList()]
@@ -463,13 +435,13 @@ var InternalUpload = function InternalUpload(props, ref) {
   var uploadButton = _jsx("div", {
     className: uploadButtonCls,
     style: children ? undefined : {
-      display: "none"
+      display: 'none'
     },
     children: _jsx(RcUpload, _objectSpread(_objectSpread({}, rcUploadProps), {}, {
       ref: upload
     }))
   });
-  if (listType === "picture-card" || listType === "picture-circle") {
+  if (listType === 'picture-card' || listType === 'picture-circle') {
     return wrapCSSVar(_jsx("span", {
       className: mergedCls,
       ref: wrapRef,
@@ -483,7 +455,7 @@ var InternalUpload = function InternalUpload(props, ref) {
   }));
 };
 var Upload = /*#__PURE__*/React.forwardRef(InternalUpload);
-if (process.env.NODE_ENV !== "production") {
-  Upload.displayName = "Upload";
+if (process.env.NODE_ENV !== 'production') {
+  Upload.displayName = 'Upload';
 }
 export default Upload;

package/lib/Antd5/upload/UploadList/ListItem.js

@@ -40,6 +40,7 @@ var ListItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     customPreviewIcon = _ref.previewIcon,
     customRemoveIcon = _ref.removeIcon,
     customDownloadIcon = _ref.downloadIcon,
+    customExtra = _ref.extra,
     onPreview = _ref.onPreview,
     onDownload = _ref.onDownload,
     onClose = _ref.onClose;
@@ -101,13 +102,13 @@ var ListItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   }
   var listItemClassName = classNames("".concat(prefixCls, "-list-item"), "".concat(prefixCls, "-list-item-").concat(mergedStatus));
   var linkProps = typeof file.linkProps === 'string' ? JSON.parse(file.linkProps) : file.linkProps;
-  var removeIcon = showRemoveIcon ? actionIconRender((typeof customRemoveIcon === 'function' ? customRemoveIcon(file) : customRemoveIcon) || _jsx(DeleteOutlined, {}), function () {
+  var removeIcon = (typeof showRemoveIcon === 'function' ? showRemoveIcon(file) : showRemoveIcon) ? actionIconRender((typeof customRemoveIcon === 'function' ? customRemoveIcon(file) : customRemoveIcon) || _jsx(DeleteOutlined, {}), function () {
     return onClose(file);
   }, prefixCls, locale.removeFile,
   // acceptUploadDisabled is true, only remove icon will follow Upload disabled prop
   // https://github.com/ant-design/ant-design/issues/46171
   true) : null;
-  var downloadIcon = showDownloadIcon && mergedStatus === 'done' ? actionIconRender((typeof customDownloadIcon === 'function' ? customDownloadIcon(file) : customDownloadIcon) || _jsx(DownloadOutlined, {}), function () {
+  var downloadIcon = (typeof showDownloadIcon === 'function' ? showDownloadIcon(file) : showDownloadIcon) && mergedStatus === 'done' ? actionIconRender((typeof customDownloadIcon === 'function' ? customDownloadIcon(file) : customDownloadIcon) || _jsx(DownloadOutlined, {}), function () {
     return onDownload(file);
   }, prefixCls, locale.downloadFile) : null;
   var downloadOrDelete = listType !== 'picture-card' && listType !== 'picture-circle' && _jsxs("span", {
@@ -116,8 +117,13 @@ var ListItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     }),
     children: [downloadIcon, removeIcon]
   }, "download-delete");
+  var extraContent = typeof customExtra === 'function' ? customExtra(file) : customExtra;
+  var extra = extraContent && _jsx("span", {
+    className: "".concat(prefixCls, "-list-item-extra"),
+    children: extraContent
+  });
   var listItemNameClass = classNames("".concat(prefixCls, "-list-item-name"));
-  var fileName = file.url ? [_jsx("a", _objectSpread(_objectSpread({
+  var fileName = file.url ? _jsxs("a", _objectSpread(_objectSpread({
     target: "_blank",
     rel: "noopener noreferrer",
     className: listItemNameClass,
@@ -127,16 +133,16 @@ var ListItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     onClick: function onClick(e) {
       return onPreview(file, e);
     },
-    children: file.name
-  }), "view"), downloadOrDelete] : [_jsx("span", {
+    children: [file.name, extra]
+  }), "view") : _jsxs("span", {
     className: listItemNameClass,
     onClick: function onClick(e) {
       return onPreview(file, e);
     },
     title: file.name,
-    children: file.name
-  }, "view"), downloadOrDelete];
-  var previewIcon = showPreviewIcon && (file.url || file.thumbUrl) ? _jsx("a", {
+    children: [file.name, extra]
+  }, "view");
+  var previewIcon = (typeof showPreviewIcon === 'function' ? showPreviewIcon(file) : showPreviewIcon) && (file.url || file.thumbUrl) ? _jsx("a", {
     href: file.url || file.thumbUrl,
     target: "_blank",
     rel: "noopener noreferrer",
@@ -155,7 +161,7 @@ var ListItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var rootPrefixCls = getPrefixCls();
   var dom = _jsxs("div", {
     className: listItemClassName,
-    children: [icon, fileName, pictureCardActions, showProgress && _jsx(CSSMotion, {
+    children: [icon, fileName, downloadOrDelete, pictureCardActions, showProgress && _jsx(CSSMotion, {
       motionName: "".concat(rootPrefixCls, "-fade"),
       visible: mergedStatus === 'uploading',
       motionDeadline: 2000,

package/lib/Antd5/upload/UploadList/index.js

@@ -22,6 +22,7 @@ import PaperClipOutlined from '@ant-design/icons/PaperClipOutlined';
 import PictureTwoTone from '@ant-design/icons/PictureTwoTone';
 import classNames from 'classnames';
 import CSSMotion, { CSSMotionList } from 'rc-motion';
+import omit from 'rc-util/lib/omit';
 import useForceUpdate from '../../_util/hooks/useForceUpdate';
 import initCollapseMotion from '../../_util/motion';
 import { cloneElement } from '../../_util/reactNode';
@@ -53,6 +54,7 @@ var InternalUploadList = function InternalUploadList(props, ref) {
     removeIcon = props.removeIcon,
     previewIcon = props.previewIcon,
     downloadIcon = props.downloadIcon,
+    extra = props.extra,
     _props$progress = props.progress,
     progress = _props$progress === void 0 ? {
       size: [-1, 2],
@@ -68,22 +70,22 @@ var InternalUploadList = function InternalUploadList(props, ref) {
     _React$useState2 = _slicedToArray(_React$useState, 2),
     motionAppear = _React$useState2[0],
     setMotionAppear = _React$useState2[1];
+  var isPictureCardOrCirle = ['picture-card', 'picture-circle'].includes(listType);
   // ============================= Effect =============================
   React.useEffect(function () {
-    if (listType !== 'picture' && listType !== 'picture-card' && listType !== 'picture-circle') {
+    if (!listType.startsWith('picture')) {
       return;
     }
     (items || []).forEach(function (file) {
-      if (typeof document === 'undefined' || typeof window === 'undefined' || !window.FileReader || !window.File || !(file.originFileObj instanceof File || file.originFileObj) || file.thumbUrl !== undefined) {
+      if (!(file.originFileObj instanceof File || file.originFileObj instanceof Blob) || file.thumbUrl !== undefined) {
         return;
       }
-      if (previewFile) {
-        previewFile(file.originFileObj).then(function (previewDataUrl) {
-          // Need append '' to avoid dead loop
-          file.thumbUrl = previewDataUrl || '';
-          forceUpdate();
-        });
-      }
+      file.thumbUrl = '';
+      previewFile === null || previewFile === void 0 || previewFile(file.originFileObj).then(function (previewDataUrl) {
+        // Need append '' to avoid dead loop
+        file.thumbUrl = previewDataUrl || '';
+        forceUpdate();
+      });
     });
   }, [listType, items, previewFile]);
   React.useEffect(function () {
@@ -112,14 +114,12 @@ var InternalUploadList = function InternalUploadList(props, ref) {
       return iconRender(file, listType);
     }
     var isLoading = file.status === 'uploading';
-    var fileIcon = isImgUrl && isImgUrl(file) ? _jsx(PictureTwoTone, {}) : _jsx(FileTwoTone, {});
-    var icon = isLoading ? _jsx(LoadingOutlined, {}) : _jsx(PaperClipOutlined, {});
-    if (listType === 'picture') {
-      icon = isLoading ? _jsx(LoadingOutlined, {}) : fileIcon;
-    } else if (listType === 'picture-card' || listType === 'picture-circle') {
-      icon = isLoading ? locale.uploading : fileIcon;
+    if (listType.startsWith('picture')) {
+      var loadingIcon = listType === 'picture' ? _jsx(LoadingOutlined, {}) : locale.uploading;
+      var fileIcon = isImgUrl !== null && isImgUrl !== void 0 && isImgUrl(file) ? _jsx(PictureTwoTone, {}) : _jsx(FileTwoTone, {});
+      return isLoading ? loadingIcon : fileIcon;
     }
-    return icon;
+    return isLoading ? _jsx(LoadingOutlined, {}) : _jsx(PaperClipOutlined, {});
   };
   var actionIconRender = function actionIconRender(customIcon, callback, prefixCls, title, acceptUploadDisabled) {
     var btnProps = {
@@ -138,15 +138,11 @@ var InternalUploadList = function InternalUploadList(props, ref) {
     if (acceptUploadDisabled) {
       btnProps.disabled = disabled;
     }
-    if (/*#__PURE__*/React.isValidElement(customIcon)) {
-      var btnIcon = cloneElement(customIcon, _objectSpread(_objectSpread({}, customIcon.props), {}, {
+    return /*#__PURE__*/React.isValidElement(customIcon) ? _jsx(Button, _objectSpread(_objectSpread({}, btnProps), {}, {
+      icon: cloneElement(customIcon, _objectSpread(_objectSpread({}, customIcon.props), {}, {
         onClick: function onClick() {}
-      }));
-      return _jsx(Button, _objectSpread(_objectSpread({}, btnProps), {}, {
-        icon: btnIcon
-      }));
-    }
-    return _jsx(Button, _objectSpread(_objectSpread({}, btnProps), {}, {
+      }))
+    })) : _jsx(Button, _objectSpread(_objectSpread({}, btnProps), {}, {
       children: _jsx("span", {
         children: customIcon
       })
@@ -166,31 +162,20 @@ var InternalUploadList = function InternalUploadList(props, ref) {
   var prefixCls = getPrefixCls('upload', customizePrefixCls);
   var rootPrefixCls = getPrefixCls();
   var listClassNames = classNames("".concat(prefixCls, "-list"), "".concat(prefixCls, "-list-").concat(listType));
-  // >>> Motion config
-  var motionKeyList = _toConsumableArray(items.map(function (file) {
-    return {
-      key: file.uid,
-      file: file
-    };
-  }));
-  var animationDirection = listType === 'picture-card' || listType === 'picture-circle' ? 'animate-inline' : 'animate';
-  // const transitionName = list.length === 0 ? '' : `${prefixCls}-${animationDirection}`;
-  var motionConfig = {
-    motionDeadline: 2000,
-    motionName: "".concat(prefixCls, "-").concat(animationDirection),
-    keys: motionKeyList,
-    motionAppear: motionAppear
-  };
   var listItemMotion = React.useMemo(function () {
-    var motion = _objectSpread({}, initCollapseMotion(rootPrefixCls));
-    delete motion.onAppearEnd;
-    delete motion.onEnterEnd;
-    delete motion.onLeaveEnd;
-    return motion;
+    return omit(initCollapseMotion(rootPrefixCls), ['onAppearEnd', 'onEnterEnd', 'onLeaveEnd']);
   }, [rootPrefixCls]);
-  if (listType !== 'picture-card' && listType !== 'picture-circle') {
-    motionConfig = _objectSpread(_objectSpread({}, listItemMotion), motionConfig);
-  }
+  var motionConfig = _objectSpread(_objectSpread({}, isPictureCardOrCirle ? {} : listItemMotion), {}, {
+    motionDeadline: 2000,
+    motionName: "".concat(prefixCls, "-").concat(isPictureCardOrCirle ? 'animate-inline' : 'animate'),
+    keys: _toConsumableArray(items.map(function (file) {
+      return {
+        key: file.uid,
+        file: file
+      };
+    })),
+    motionAppear: motionAppear
+  });
   return _jsxs("div", {
     className: listClassNames,
     children: [_jsx(CSSMotionList, _objectSpread(_objectSpread({}, motionConfig), {}, {
@@ -216,6 +201,7 @@ var InternalUploadList = function InternalUploadList(props, ref) {
           removeIcon: removeIcon,
           previewIcon: previewIcon,
           downloadIcon: downloadIcon,
+          extra: extra,
           iconRender: internalIconRender,
           actionIconRender: actionIconRender,
           itemRender: itemRender,

package/lib/Antd5/upload/style/dragger.js

@@ -17,7 +17,7 @@ var genDraggerStyle = function genDraggerStyle(token) {
     cursor: 'pointer',
     transition: "border-color ".concat(token.motionDurationSlow)
   }, componentCls, {
-    // padding: token.padding, // 删除符合UI规范
+    padding: token.padding
   }), "".concat(componentCls, "-btn"), {
     display: 'table',
     width: '100%',
@@ -27,23 +27,10 @@ var genDraggerStyle = function genDraggerStyle(token) {
     '&:focus-visible': {
       outline: "".concat(unit(token.lineWidthFocus), " solid ").concat(token.colorPrimaryBorder)
     }
-  }), "".concat(componentCls, "-drag-container"), _defineProperty({
+  }), "".concat(componentCls, "-drag-container"), {
     display: 'table-cell',
     verticalAlign: 'middle'
-  }, "".concat(componentCls, "-drag-wrapper"), _defineProperty(_defineProperty(_defineProperty({
-    padding: "39px 0"
-  }, "".concat(componentCls, "-drag-icon-wrapper"), _defineProperty({
-    marginBottom: "8px"
-  }, iconCls, {
-    color: token.colorPrimaryHover,
-    fontSize: "48px"
-  })), "".concat(componentCls, "-drag-text"), {
-    lineHeight: "20px"
-  }), "".concat(componentCls, "-drag-desc"), {
-    color: token.colorTextTertiary,
-    marginTop: "8px",
-    lineHeight: "20px"
-  }))), "\n          &:not(".concat(componentCls, "-disabled):hover,\n          &-hover:not(").concat(componentCls, "-disabled)\n        "), {
+  }), "\n          &:not(".concat(componentCls, "-disabled):hover,\n          &-hover:not(").concat(componentCls, "-disabled)\n        "), {
     borderColor: token.colorPrimaryHover
   }), "p".concat(componentCls, "-drag-icon"), _defineProperty({
     marginBottom: token.margin
@@ -57,16 +44,8 @@ var genDraggerStyle = function genDraggerStyle(token) {
   }), "p".concat(componentCls, "-hint"), {
     color: token.colorTextDescription,
     fontSize: token.fontSize
-  }), "&".concat(componentCls, "-disabled"), _defineProperty(_defineProperty({
-    background: token.colorBgContainerDisabled
-  }, "p".concat(componentCls, "-drag-icon ").concat(iconCls, ",\n            p").concat(componentCls, "-text,\n            p").concat(componentCls, "-hint,\n          "), {
-    color: token.colorTextDisabled
-  }), "".concat(componentCls, "-drag-wrapper"), _defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls, "-drag-icon-wrapper"), _defineProperty({}, iconCls, {
-    color: token.colorTextDisabled
-  })), "".concat(componentCls, "-drag-text"), {
-    color: token.colorTextDisabled
-  }), "".concat(componentCls, "-drag-desc"), {
+  }), "&".concat(componentCls, "-disabled"), _defineProperty({}, "p".concat(componentCls, "-drag-icon ").concat(iconCls, ",\n            p").concat(componentCls, "-text,\n            p").concat(componentCls, "-hint\n          "), {
     color: token.colorTextDisabled
-  })))));
+  }))));
 };
 export default genDraggerStyle;