first commit

frontend/node_modules/antd/es/upload/UploadList/ListItem.d.ts

@@ -0,0 +1,28 @@
+import * as React from 'react';
+import type { ItemRender, UploadFile, UploadListProgressProps, UploadListType, UploadLocale } from '../interface';
+export interface ListItemProps {
+    prefixCls: string;
+    className?: string;
+    style?: React.CSSProperties;
+    locale: UploadLocale;
+    file: UploadFile;
+    items: UploadFile[];
+    listType?: UploadListType;
+    isImgUrl?: (file: UploadFile) => boolean;
+    showRemoveIcon?: boolean | ((file: UploadFile) => boolean);
+    showDownloadIcon?: boolean | ((file: UploadFile) => boolean);
+    showPreviewIcon?: boolean | ((file: UploadFile) => boolean);
+    removeIcon?: React.ReactNode | ((file: UploadFile) => React.ReactNode);
+    downloadIcon?: React.ReactNode | ((file: UploadFile) => React.ReactNode);
+    previewIcon?: React.ReactNode | ((file: UploadFile) => React.ReactNode);
+    extra?: React.ReactNode | ((file: UploadFile) => React.ReactNode);
+    iconRender: (file: UploadFile) => React.ReactNode;
+    actionIconRender: (customIcon: React.ReactNode, callback: () => void, prefixCls: string, title?: string, acceptUploadDisabled?: boolean) => React.ReactNode;
+    itemRender?: ItemRender;
+    onPreview: (file: UploadFile, e: React.SyntheticEvent<HTMLElement>) => void;
+    onClose: (file: UploadFile) => void;
+    onDownload: (file: UploadFile) => void;
+    progress?: UploadListProgressProps;
+}
+declare const ListItem: React.ForwardRefExoticComponent<ListItemProps & React.RefAttributes<HTMLDivElement>>;
+export default ListItem;

frontend/node_modules/antd/es/upload/UploadList/ListItem.js

@@ -0,0 +1,170 @@
+"use client";
+
+import * as React from 'react';
+import DeleteOutlined from "@ant-design/icons/es/icons/DeleteOutlined";
+import DownloadOutlined from "@ant-design/icons/es/icons/DownloadOutlined";
+import EyeOutlined from "@ant-design/icons/es/icons/EyeOutlined";
+import classNames from 'classnames';
+import CSSMotion from 'rc-motion';
+import { ConfigContext } from '../../config-provider';
+import Progress from '../../progress';
+import Tooltip from '../../tooltip';
+const ListItem = /*#__PURE__*/React.forwardRef(({
+  prefixCls,
+  className,
+  style,
+  locale,
+  listType,
+  file,
+  items,
+  progress: progressProps,
+  iconRender,
+  actionIconRender,
+  itemRender,
+  isImgUrl,
+  showPreviewIcon,
+  showRemoveIcon,
+  showDownloadIcon,
+  previewIcon: customPreviewIcon,
+  removeIcon: customRemoveIcon,
+  downloadIcon: customDownloadIcon,
+  extra: customExtra,
+  onPreview,
+  onDownload,
+  onClose
+}, ref) => {
+  var _a, _b;
+  // Status: which will ignore `removed` status
+  const {
+    status
+  } = file;
+  const [mergedStatus, setMergedStatus] = React.useState(status);
+  React.useEffect(() => {
+    if (status !== 'removed') {
+      setMergedStatus(status);
+    }
+  }, [status]);
+  // Delay to show the progress bar
+  const [showProgress, setShowProgress] = React.useState(false);
+  React.useEffect(() => {
+    const timer = setTimeout(() => {
+      setShowProgress(true);
+    }, 300);
+    return () => {
+      clearTimeout(timer);
+    };
+  }, []);
+  const iconNode = iconRender(file);
+  let icon = /*#__PURE__*/React.createElement("div", {
+    className: `${prefixCls}-icon`
+  }, iconNode);
+  if (listType === 'picture' || listType === 'picture-card' || listType === 'picture-circle') {
+    if (mergedStatus === 'uploading' || !file.thumbUrl && !file.url) {
+      const uploadingClassName = classNames(`${prefixCls}-list-item-thumbnail`, {
+        [`${prefixCls}-list-item-file`]: mergedStatus !== 'uploading'
+      });
+      icon = /*#__PURE__*/React.createElement("div", {
+        className: uploadingClassName
+      }, iconNode);
+    } else {
+      const thumbnail = (isImgUrl === null || isImgUrl === void 0 ? void 0 : isImgUrl(file)) ? (/*#__PURE__*/React.createElement("img", {
+        src: file.thumbUrl || file.url,
+        alt: file.name,
+        className: `${prefixCls}-list-item-image`,
+        crossOrigin: file.crossOrigin
+      })) : iconNode;
+      const aClassName = classNames(`${prefixCls}-list-item-thumbnail`, {
+        [`${prefixCls}-list-item-file`]: isImgUrl && !isImgUrl(file)
+      });
+      icon = /*#__PURE__*/React.createElement("a", {
+        className: aClassName,
+        onClick: e => onPreview(file, e),
+        href: file.url || file.thumbUrl,
+        target: "_blank",
+        rel: "noopener noreferrer"
+      }, thumbnail);
+    }
+  }
+  const listItemClassName = classNames(`${prefixCls}-list-item`, `${prefixCls}-list-item-${mergedStatus}`);
+  const linkProps = typeof file.linkProps === 'string' ? JSON.parse(file.linkProps) : file.linkProps;
+  const removeIcon = (typeof showRemoveIcon === 'function' ? showRemoveIcon(file) : showRemoveIcon) ? actionIconRender((typeof customRemoveIcon === 'function' ? customRemoveIcon(file) : customRemoveIcon) || (/*#__PURE__*/React.createElement(DeleteOutlined, null)), () => 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;
+  const downloadIcon = (typeof showDownloadIcon === 'function' ? showDownloadIcon(file) : showDownloadIcon) && mergedStatus === 'done' ? actionIconRender((typeof customDownloadIcon === 'function' ? customDownloadIcon(file) : customDownloadIcon) || /*#__PURE__*/React.createElement(DownloadOutlined, null), () => onDownload(file), prefixCls, locale.downloadFile) : null;
+  const downloadOrDelete = listType !== 'picture-card' && listType !== 'picture-circle' && (/*#__PURE__*/React.createElement("span", {
+    key: "download-delete",
+    className: classNames(`${prefixCls}-list-item-actions`, {
+      picture: listType === 'picture'
+    })
+  }, downloadIcon, removeIcon));
+  const extraContent = typeof customExtra === 'function' ? customExtra(file) : customExtra;
+  const extra = extraContent && (/*#__PURE__*/React.createElement("span", {
+    className: `${prefixCls}-list-item-extra`
+  }, extraContent));
+  const listItemNameClass = classNames(`${prefixCls}-list-item-name`);
+  const fileName = file.url ? (/*#__PURE__*/React.createElement("a", Object.assign({
+    key: "view",
+    target: "_blank",
+    rel: "noopener noreferrer",
+    className: listItemNameClass,
+    title: file.name
+  }, linkProps, {
+    href: file.url,
+    onClick: e => onPreview(file, e)
+  }), file.name, extra)) : (/*#__PURE__*/React.createElement("span", {
+    key: "view",
+    className: listItemNameClass,
+    onClick: e => onPreview(file, e),
+    title: file.name
+  }, file.name, extra));
+  const previewIcon = (typeof showPreviewIcon === 'function' ? showPreviewIcon(file) : showPreviewIcon) && (file.url || file.thumbUrl) ? (/*#__PURE__*/React.createElement("a", {
+    href: file.url || file.thumbUrl,
+    target: "_blank",
+    rel: "noopener noreferrer",
+    onClick: e => onPreview(file, e),
+    title: locale.previewFile
+  }, typeof customPreviewIcon === 'function' ? customPreviewIcon(file) : customPreviewIcon || /*#__PURE__*/React.createElement(EyeOutlined, null))) : null;
+  const pictureCardActions = (listType === 'picture-card' || listType === 'picture-circle') && mergedStatus !== 'uploading' && (/*#__PURE__*/React.createElement("span", {
+    className: `${prefixCls}-list-item-actions`
+  }, previewIcon, mergedStatus === 'done' && downloadIcon, removeIcon));
+  const {
+    getPrefixCls
+  } = React.useContext(ConfigContext);
+  const rootPrefixCls = getPrefixCls();
+  const dom = /*#__PURE__*/React.createElement("div", {
+    className: listItemClassName
+  }, icon, fileName, downloadOrDelete, pictureCardActions, showProgress && (/*#__PURE__*/React.createElement(CSSMotion, {
+    motionName: `${rootPrefixCls}-fade`,
+    visible: mergedStatus === 'uploading',
+    motionDeadline: 2000
+  }, ({
+    className: motionClassName
+  }) => {
+    // show loading icon if upload progress listener is disabled
+    const loadingProgress = 'percent' in file ? (/*#__PURE__*/React.createElement(Progress, Object.assign({
+      type: "line",
+      percent: file.percent,
+      "aria-label": file['aria-label'],
+      "aria-labelledby": file['aria-labelledby']
+    }, progressProps))) : null;
+    return /*#__PURE__*/React.createElement("div", {
+      className: classNames(`${prefixCls}-list-item-progress`, motionClassName)
+    }, loadingProgress);
+  })));
+  const message = file.response && typeof file.response === 'string' ? file.response : ((_a = file.error) === null || _a === void 0 ? void 0 : _a.statusText) || ((_b = file.error) === null || _b === void 0 ? void 0 : _b.message) || locale.uploadError;
+  const item = mergedStatus === 'error' ? (/*#__PURE__*/React.createElement(Tooltip, {
+    title: message,
+    getPopupContainer: node => node.parentNode
+  }, dom)) : dom;
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames(`${prefixCls}-list-item-container`, className),
+    style: style,
+    ref: ref
+  }, itemRender ? itemRender(item, file, items, {
+    download: onDownload.bind(null, file),
+    preview: onPreview.bind(null, file),
+    remove: onClose.bind(null, file)
+  }) : item);
+});
+export default ListItem;

frontend/node_modules/antd/es/upload/UploadList/index.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import type { UploadFile, UploadListProps } from '../interface';
+interface UploadListRef {
+    handlePreview: (file: UploadFile, e: React.SyntheticEvent<HTMLElement>) => void;
+    handleDownload: (file: UploadFile) => void;
+}
+declare const UploadList: React.ForwardRefExoticComponent<UploadListProps<any> & React.RefAttributes<UploadListRef>>;
+export default UploadList;

frontend/node_modules/antd/es/upload/UploadList/index.js

@@ -0,0 +1,195 @@
+"use client";
+
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import * as React from 'react';
+import FileTwoTone from "@ant-design/icons/es/icons/FileTwoTone";
+import LoadingOutlined from "@ant-design/icons/es/icons/LoadingOutlined";
+import PaperClipOutlined from "@ant-design/icons/es/icons/PaperClipOutlined";
+import PictureTwoTone from "@ant-design/icons/es/icons/PictureTwoTone";
+import classNames from 'classnames';
+import CSSMotion, { CSSMotionList } from 'rc-motion';
+import omit from "rc-util/es/omit";
+import { useForceUpdate } from '../../_util/hooks';
+import initCollapseMotion from '../../_util/motion';
+import { cloneElement } from '../../_util/reactNode';
+import Button from '../../button';
+import { ConfigContext } from '../../config-provider';
+import { isImageUrl, previewImage } from '../utils';
+import ListItem from './ListItem';
+const InternalUploadList = (props, ref) => {
+  const {
+    listType = 'text',
+    previewFile = previewImage,
+    onPreview,
+    onDownload,
+    onRemove,
+    locale,
+    iconRender,
+    isImageUrl: isImgUrl = isImageUrl,
+    prefixCls: customizePrefixCls,
+    items = [],
+    showPreviewIcon = true,
+    showRemoveIcon = true,
+    showDownloadIcon = false,
+    removeIcon,
+    previewIcon,
+    downloadIcon,
+    extra,
+    progress = {
+      size: [-1, 2],
+      showInfo: false
+    },
+    appendAction,
+    appendActionVisible = true,
+    itemRender,
+    disabled
+  } = props;
+  const [, forceUpdate] = useForceUpdate();
+  const [motionAppear, setMotionAppear] = React.useState(false);
+  const isPictureCardOrCirle = ['picture-card', 'picture-circle'].includes(listType);
+  // ============================= Effect =============================
+  React.useEffect(() => {
+    if (!listType.startsWith('picture')) {
+      return;
+    }
+    (items || []).forEach(file => {
+      if (!(file.originFileObj instanceof File || file.originFileObj instanceof Blob) || file.thumbUrl !== undefined) {
+        return;
+      }
+      file.thumbUrl = '';
+      previewFile === null || previewFile === void 0 ? void 0 : previewFile(file.originFileObj).then(previewDataUrl => {
+        // Need append '' to avoid dead loop
+        file.thumbUrl = previewDataUrl || '';
+        forceUpdate();
+      });
+    });
+  }, [listType, items, previewFile]);
+  React.useEffect(() => {
+    setMotionAppear(true);
+  }, []);
+  // ============================= Events =============================
+  const onInternalPreview = (file, e) => {
+    if (!onPreview) {
+      return;
+    }
+    e === null || e === void 0 ? void 0 : e.preventDefault();
+    return onPreview(file);
+  };
+  const onInternalDownload = file => {
+    if (typeof onDownload === 'function') {
+      onDownload(file);
+    } else if (file.url) {
+      window.open(file.url);
+    }
+  };
+  const onInternalClose = file => {
+    onRemove === null || onRemove === void 0 ? void 0 : onRemove(file);
+  };
+  const internalIconRender = file => {
+    if (iconRender) {
+      return iconRender(file, listType);
+    }
+    const isLoading = file.status === 'uploading';
+    if (listType.startsWith('picture')) {
+      const loadingIcon = listType === 'picture' ? /*#__PURE__*/React.createElement(LoadingOutlined, null) : locale.uploading;
+      const fileIcon = (isImgUrl === null || isImgUrl === void 0 ? void 0 : isImgUrl(file)) ? /*#__PURE__*/React.createElement(PictureTwoTone, null) : /*#__PURE__*/React.createElement(FileTwoTone, null);
+      return isLoading ? loadingIcon : fileIcon;
+    }
+    return isLoading ? /*#__PURE__*/React.createElement(LoadingOutlined, null) : /*#__PURE__*/React.createElement(PaperClipOutlined, null);
+  };
+  const actionIconRender = (customIcon, callback, prefixCls, title, acceptUploadDisabled) => {
+    const btnProps = {
+      type: 'text',
+      size: 'small',
+      title,
+      onClick: e => {
+        var _a, _b;
+        callback();
+        if (/*#__PURE__*/React.isValidElement(customIcon)) {
+          (_b = (_a = customIcon.props).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, e);
+        }
+      },
+      className: `${prefixCls}-list-item-action`,
+      disabled: acceptUploadDisabled ? disabled : false
+    };
+    return /*#__PURE__*/React.isValidElement(customIcon) ? (/*#__PURE__*/React.createElement(Button, Object.assign({}, btnProps, {
+      icon: cloneElement(customIcon, Object.assign(Object.assign({}, customIcon.props), {
+        onClick: () => {}
+      }))
+    }))) : (/*#__PURE__*/React.createElement(Button, Object.assign({}, btnProps), /*#__PURE__*/React.createElement("span", null, customIcon)));
+  };
+  // ============================== Ref ===============================
+  // Test needs
+  React.useImperativeHandle(ref, () => ({
+    handlePreview: onInternalPreview,
+    handleDownload: onInternalDownload
+  }));
+  const {
+    getPrefixCls
+  } = React.useContext(ConfigContext);
+  // ============================= Render =============================
+  const prefixCls = getPrefixCls('upload', customizePrefixCls);
+  const rootPrefixCls = getPrefixCls();
+  const listClassNames = classNames(`${prefixCls}-list`, `${prefixCls}-list-${listType}`);
+  const listItemMotion = React.useMemo(() => omit(initCollapseMotion(rootPrefixCls), ['onAppearEnd', 'onEnterEnd', 'onLeaveEnd']), [rootPrefixCls]);
+  const motionConfig = Object.assign(Object.assign({}, isPictureCardOrCirle ? {} : listItemMotion), {
+    motionDeadline: 2000,
+    motionName: `${prefixCls}-${isPictureCardOrCirle ? 'animate-inline' : 'animate'}`,
+    keys: _toConsumableArray(items.map(file => ({
+      key: file.uid,
+      file
+    }))),
+    motionAppear
+  });
+  return /*#__PURE__*/React.createElement("div", {
+    className: listClassNames
+  }, /*#__PURE__*/React.createElement(CSSMotionList, Object.assign({}, motionConfig, {
+    component: false
+  }), ({
+    key,
+    file,
+    className: motionClassName,
+    style: motionStyle
+  }) => (/*#__PURE__*/React.createElement(ListItem, {
+    key: key,
+    locale: locale,
+    prefixCls: prefixCls,
+    className: motionClassName,
+    style: motionStyle,
+    file: file,
+    items: items,
+    progress: progress,
+    listType: listType,
+    isImgUrl: isImgUrl,
+    showPreviewIcon: showPreviewIcon,
+    showRemoveIcon: showRemoveIcon,
+    showDownloadIcon: showDownloadIcon,
+    removeIcon: removeIcon,
+    previewIcon: previewIcon,
+    downloadIcon: downloadIcon,
+    extra: extra,
+    iconRender: internalIconRender,
+    actionIconRender: actionIconRender,
+    itemRender: itemRender,
+    onPreview: onInternalPreview,
+    onDownload: onInternalDownload,
+    onClose: onInternalClose
+  }))), appendAction && (/*#__PURE__*/React.createElement(CSSMotion, Object.assign({}, motionConfig, {
+    visible: appendActionVisible,
+    forceRender: true
+  }), ({
+    className: motionClassName,
+    style: motionStyle
+  }) => cloneElement(appendAction, oriProps => ({
+    className: classNames(oriProps.className, motionClassName),
+    style: Object.assign(Object.assign(Object.assign({}, motionStyle), {
+      // prevent the element has hover css pseudo-class that may cause animation to end prematurely.
+      pointerEvents: motionClassName ? 'none' : undefined
+    }), oriProps.style)
+  })))));
+};
+const UploadList = /*#__PURE__*/React.forwardRef(InternalUploadList);
+if (process.env.NODE_ENV !== 'production') {
+  UploadList.displayName = 'UploadList';
+}
+export default UploadList;