tdesign-react
Version:
TDesign Component for React
522 lines (514 loc) • 27.1 kB
JavaScript
/**
* tdesign v1.16.6
* (c) 2026 tdesign
* @license MIT
*/
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var toConsumableArray = require('../../_chunks/dep-33be2db8.js');
var defineProperty = require('../../_chunks/dep-1f6c39e3.js');
var slicedToArray = require('../../_chunks/dep-3281986a.js');
var React = require('react');
var classNames = require('classnames');
var tdesignIconsReact = require('tdesign-icons-react');
var utils = require('../../_chunks/dep-7af43b33.js');
var hooks_useGlobalIcon = require('../../hooks/useGlobalIcon.js');
var imageViewer_index = require('../../image-viewer/index.js');
var button_index = require('../../button/index.js');
var upload_hooks_useDrag = require('../hooks/useDrag.js');
var loading_index = require('../../loading/index.js');
var link_index = require('../../link/index.js');
var _util_parseTNode = require('../../_util/parseTNode.js');
var image_index = require('../../image/index.js');
var isFunction = require('../../_chunks/dep-8c9795f9.js');
var isObject = require('../../_chunks/dep-723e29d6.js');
require('../../_chunks/dep-ef5bfcf1.js');
require('../../_chunks/dep-989c8b4a.js');
require('../../_chunks/dep-90a93885.js');
require('../../_chunks/dep-54373955.js');
require('../../_chunks/dep-ed99b2c6.js');
require('../../hooks/useConfig.js');
require('../../config-provider/ConfigContext.js');
require('../../_chunks/dep-875a5344.js');
require('../../_chunks/dep-20f09a63.js');
require('dayjs');
require('../../_chunks/dep-e691746e.js');
require('../../_chunks/dep-9d3b1a05.js');
require('../../_chunks/dep-1f8c969d.js');
require('../../_chunks/dep-615c149d.js');
require('../../_chunks/dep-0173c82c.js');
require('../../_chunks/dep-a8d5081a.js');
require('../../_chunks/dep-403f5edf.js');
require('../../_chunks/dep-d24b94bc.js');
require('../../_chunks/dep-6478e7e3.js');
require('../../_chunks/dep-c9025587.js');
require('../../_chunks/dep-8663a5c9.js');
require('../../_chunks/dep-50349518.js');
require('../../_chunks/dep-0bd8b970.js');
require('../../_chunks/dep-73ef2133.js');
require('../../_chunks/dep-cae1e5aa.js');
require('../../_chunks/dep-0b97e212.js');
require('../../_chunks/dep-0652d2a6.js');
require('../../_chunks/dep-1a7ce20e.js');
require('../../_chunks/dep-116af952.js');
require('../../_chunks/dep-f6a777ad.js');
require('../../_chunks/dep-ff301423.js');
require('../../image-viewer/ImageViewer.js');
require('react-dom');
require('../../_chunks/dep-da6326e7.js');
require('../../_chunks/dep-05097eca.js');
require('../../_chunks/dep-202d6c73.js');
require('../../_chunks/dep-ceca7b69.js');
require('../../_chunks/dep-4c4d8eee.js');
require('../../hooks/useImagePreviewUrl.js');
require('../../locale/LocalReceiver.js');
require('../../config-provider/ConfigProvider.js');
require('../../_chunks/dep-400d026f.js');
require('../../_chunks/dep-081faea2.js');
require('../../_chunks/dep-91b467dd.js');
require('../../_chunks/dep-18ca5cd9.js');
require('../../_chunks/dep-3facd669.js');
require('../../tooltip/index.js');
require('../../tooltip/Tooltip.js');
require('../../_chunks/dep-79129c54.js');
require('../../popup/index.js');
require('../../popup/Popup.js');
require('react-transition-group');
require('../../_chunks/dep-2bbded38.js');
require('../../common/Portal.js');
require('../../hooks/useLayoutEffect.js');
require('../../hooks/useAnimation.js');
require('../../hooks/useAttach.js');
require('../../hooks/useControlled.js');
require('../../_util/noop.js');
require('../../_chunks/dep-825f3fca.js');
require('../../_chunks/dep-0cf6dbad.js');
require('../../_chunks/dep-cb9114ad.js');
require('../../_chunks/dep-d7d7df54.js');
require('../../_chunks/dep-4748ebeb.js');
require('../../hooks/useDefaultProps.js');
require('../../hooks/useMutationObserver.js');
require('../../hooks/useLatest.js');
require('../../_chunks/dep-a96a03f6.js');
require('../../_chunks/dep-e0d43c80.js');
require('../../_chunks/dep-18c47660.js');
require('../../_chunks/dep-63bb9ba0.js');
require('../../_chunks/dep-4cbff404.js');
require('../../hooks/usePopper.js');
require('react-fast-compare');
require('@popperjs/core');
require('../../hooks/useWindowSize.js');
require('../../popup/defaultProps.js');
require('../../popup/hooks/useTrigger.js');
require('../../_util/listener.js');
require('../../_util/ref.js');
require('react-is');
require('../../_util/isFragment.js');
require('../../popup/utils/transition.js');
require('../../popup/PopupPlugin.js');
require('../../_util/react-render.js');
require('../../common/PluginContainer.js');
require('../../tooltip/defaultProps.js');
require('../../tooltip/TooltipLite.js');
require('../../hooks/useSwitch.js');
require('../../hooks/usePersistFn.js');
require('../../_chunks/dep-06e0a796.js');
require('../../dialog/index.js');
require('../../dialog/Dialog.js');
require('../../_chunks/dep-d7a3225b.js');
require('../../hooks/useDeepEffect.js');
require('../../hooks/useSetState.js');
require('../../dialog/defaultProps.js');
require('../../dialog/DialogCard.js');
require('../../button/Button.js');
require('../../hooks/useDomRefCallback.js');
require('../../hooks/useRipple.js');
require('../../_chunks/dep-4cca69f7.js');
require('../../button/defaultProps.js');
require('../../loading/Loading.js');
require('../../loading/defaultProps.js');
require('../../loading/gradient.js');
require('../../loading/plugin.js');
require('../../dialog/hooks/useDialogDrag.js');
require('../../hooks/useMouseEvent.js');
require('../../dialog/hooks/useDialogEsc.js');
require('../../dialog/hooks/useDialogPosition.js');
require('../../dialog/hooks/useLockStyle.js');
require('../../_chunks/dep-d24b5269.js');
require('../../_chunks/dep-8e51ca2b.js');
require('../../dialog/plugin.js');
require('../../image-viewer/hooks/useIconMap.js');
require('../../image-viewer/hooks/useIndex.js');
require('../../image-viewer/hooks/useMirror.js');
require('../../image-viewer/hooks/usePosition.js');
require('../../image-viewer/hooks/useRotate.js');
require('../../image-viewer/hooks/useScale.js');
require('../../image-viewer/defaultProps.js');
require('../../image-viewer/hooks/useImageScale.js');
require('../../image-viewer/hooks/useViewerScale.js');
require('../../image-viewer/defaultTrigger.js');
require('../../image/Image.js');
require('../../_chunks/dep-39086a95.js');
require('../../image/defaultProps.js');
require('../../space/index.js');
require('../../space/Space.js');
require('../../space/defaultProps.js');
require('../../link/Link.js');
require('../../link/defaultProps.js');
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { defineProperty._defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var ImageFlowList = function ImageFlowList(props) {
var _props$draggable = props.draggable,
draggable = _props$draggable === void 0 ? true : _props$draggable,
accept = props.accept,
showThumbnail = props.showThumbnail,
cancelUploadButton = props.cancelUploadButton,
uploadButton = props.uploadButton,
onPreview = props.onPreview;
var locale = props.locale,
uploading = props.uploading,
disabled = props.disabled,
displayFiles = props.displayFiles,
classPrefix = props.classPrefix;
var uploadPrefix = "".concat(classPrefix, "-upload");
var _useState = React.useState([]),
_useState2 = slicedToArray._slicedToArray(_useState, 2),
currentPreviewFile = _useState2[0],
setCurrentPreviewFile = _useState2[1];
var _useState3 = React.useState(0),
_useState4 = slicedToArray._slicedToArray(_useState3, 2),
previewIndex = _useState4[0],
setPreviewIndex = _useState4[1];
var _useGlobalIcon = hooks_useGlobalIcon["default"]({
BrowseIcon: tdesignIconsReact.BrowseIcon,
DeleteIcon: tdesignIconsReact.DeleteIcon,
CheckCircleFilledIcon: tdesignIconsReact.CheckCircleFilledIcon,
ErrorCircleFilledIcon: tdesignIconsReact.ErrorCircleFilledIcon,
TimeFilledIcon: tdesignIconsReact.TimeFilledIcon,
FileExcelIcon: tdesignIconsReact.FileExcelIcon,
FilePdfIcon: tdesignIconsReact.FilePdfIcon,
FileWordIcon: tdesignIconsReact.FileWordIcon,
FilePowerpointIcon: tdesignIconsReact.FilePowerpointIcon,
FileIcon: tdesignIconsReact.FileIcon,
VideoIcon: tdesignIconsReact.VideoIcon
}),
BrowseIcon = _useGlobalIcon.BrowseIcon,
DeleteIcon = _useGlobalIcon.DeleteIcon,
CheckCircleFilledIcon = _useGlobalIcon.CheckCircleFilledIcon,
ErrorCircleFilledIcon = _useGlobalIcon.ErrorCircleFilledIcon,
TimeFilledIcon = _useGlobalIcon.TimeFilledIcon,
FileExcelIcon = _useGlobalIcon.FileExcelIcon,
FilePdfIcon = _useGlobalIcon.FilePdfIcon,
FileWordIcon = _useGlobalIcon.FileWordIcon,
FilePowerpointIcon = _useGlobalIcon.FilePowerpointIcon,
FileIcon = _useGlobalIcon.FileIcon,
VideoIcon = _useGlobalIcon.VideoIcon;
var drag = upload_hooks_useDrag["default"](_objectSpread(_objectSpread({}, props.dragEvents), {}, {
accept: accept
}));
var uploadText = React.useMemo(function () {
if (uploading) return "".concat(locale.progress.uploadingText);
return locale.triggerUploadText.normal;
}, [locale, uploading]);
var innerDragEvents = draggable ? {
onDrop: drag.handleDrop,
onDragEnter: drag.handleDragenter,
onDragOver: drag.handleDragover,
onDragLeave: drag.handleDragleave
} : {};
var browseIconClick = function browseIconClick(_ref) {
var e = _ref.e,
index = _ref.index,
file = _ref.file,
viewFiles = _ref.viewFiles;
setPreviewIndex(index);
setCurrentPreviewFile(viewFiles);
onPreview === null || onPreview === void 0 || onPreview({
file: file,
index: index,
e: e
});
};
var previewIndexChange = function previewIndexChange(index) {
setPreviewIndex(index);
};
var closePreview = function closePreview() {
setCurrentPreviewFile([]);
};
var getStatusMap = function getStatusMap() {
var _locale$progress, _locale$progress2, _locale$progress3, _locale$progress4;
var iconMap = {
success: /* @__PURE__ */React__default["default"].createElement(CheckCircleFilledIcon, null),
fail: /* @__PURE__ */React__default["default"].createElement(ErrorCircleFilledIcon, null),
progress: /* @__PURE__ */React__default["default"].createElement(loading_index.Loading, null),
waiting: /* @__PURE__ */React__default["default"].createElement(TimeFilledIcon, null)
};
var textMap = {
success: (_locale$progress = locale.progress) === null || _locale$progress === void 0 ? void 0 : _locale$progress.successText,
fail: (_locale$progress2 = locale.progress) === null || _locale$progress2 === void 0 ? void 0 : _locale$progress2.failText,
progress: (_locale$progress3 = locale.progress) === null || _locale$progress3 === void 0 ? void 0 : _locale$progress3.uploadingText,
waiting: (_locale$progress4 = locale.progress) === null || _locale$progress4 === void 0 ? void 0 : _locale$progress4.waitingText
};
return {
iconMap: iconMap,
textMap: textMap
};
};
var renderEmpty = function renderEmpty() {
return /* @__PURE__ */React__default["default"].createElement("div", {
className: "".concat(uploadPrefix, "__flow-empty")
}, drag.dragActive ? locale.dragger.dragDropText : locale.dragger.clickAndDragText);
};
var renderImgItem = function renderImgItem(file, index) {
var _file$response;
var _getStatusMap = getStatusMap(),
iconMap = _getStatusMap.iconMap,
textMap = _getStatusMap.textMap;
var fileName = props.abridgeName && file.name ? utils.abridgeName.apply(void 0, [file.name].concat(toConsumableArray._toConsumableArray(props.abridgeName))) : file.name;
return /* @__PURE__ */React__default["default"].createElement("li", {
className: "".concat(uploadPrefix, "__card-item"),
key: file.name + index + file.percent + file.status
}, /* @__PURE__ */React__default["default"].createElement("div", {
className: classNames__default["default"](["".concat(uploadPrefix, "__card-content"), defineProperty._defineProperty({}, "".concat(classPrefix, "-is-bordered"), file.status !== "waiting")])
}, file.status === "progress" && /* @__PURE__ */React__default["default"].createElement("div", {
className: "".concat(uploadPrefix, "__card-status-wrap ").concat(uploadPrefix, "__").concat(props.theme, "-progress")
}, iconMap[file.status], /* @__PURE__ */React__default["default"].createElement("p", null, textMap[file.status], props.showUploadProgress && " ".concat(file.percent, "%"))), file.status === "fail" && /* @__PURE__ */React__default["default"].createElement("div", {
className: "".concat(uploadPrefix, "__card-status-wrap ").concat(uploadPrefix, "__").concat(props.theme, "-fail")
}, iconMap[file.status], /* @__PURE__ */React__default["default"].createElement("p", null, ((_file$response = file.response) === null || _file$response === void 0 ? void 0 : _file$response.error) || textMap[file.status])), (["waiting", "success"].includes(file.status) || !file.status && file.url) && /* @__PURE__ */React__default["default"].createElement(image_index.Image, {
className: "".concat(uploadPrefix, "__card-image"),
fit: "contain",
src: file.url || file.raw,
error: "",
loading: ""
}), /* @__PURE__ */React__default["default"].createElement("div", {
className: "".concat(uploadPrefix, "__card-mask")
}, (file.url || file.raw) && !["progress", "fail"].includes(file.status) && /* @__PURE__ */React__default["default"].createElement("span", {
className: "".concat(uploadPrefix, "__card-mask-item")
}, /* @__PURE__ */React__default["default"].createElement(BrowseIcon, {
onClick: function onClick(event) {
var e = event.type ? event : event.e;
browseIconClick({
e: e,
index: index,
file: file,
viewFiles: displayFiles
});
}
}), /* @__PURE__ */React__default["default"].createElement("span", {
className: "".concat(uploadPrefix, "__card-mask-item-divider")
})), !disabled && /* @__PURE__ */React__default["default"].createElement("span", {
className: "".concat(uploadPrefix, "__card-mask-item ").concat(uploadPrefix, "__delete"),
onClick: function onClick(e) {
return props.onRemove({
e: e,
index: index,
file: file
});
}
}, /* @__PURE__ */React__default["default"].createElement(DeleteIcon, null)))), props.showImageFileName && /* @__PURE__ */React__default["default"].createElement("p", {
className: classNames__default["default"](["".concat(uploadPrefix, "__card-name"), "".concat(uploadPrefix, "__flow-status")])
}, ["success", "waiting"].includes(file.status) && iconMap[file.status], fileName));
};
var renderStatus = function renderStatus(file) {
var _file$response2;
var _getStatusMap2 = getStatusMap(),
iconMap = _getStatusMap2.iconMap,
textMap = _getStatusMap2.textMap;
return /* @__PURE__ */React__default["default"].createElement("div", {
className: "".concat(uploadPrefix, "__flow-status")
}, iconMap[file.status], /* @__PURE__ */React__default["default"].createElement("span", {
className: "".concat(uploadPrefix, "__").concat(props.theme, "-").concat(file.status)
}, (_file$response2 = file.response) !== null && _file$response2 !== void 0 && _file$response2.error ? file.response.error || textMap[file.status] : textMap[file.status], props.showUploadProgress && file.status === "progress" ? " ".concat(file.percent || 0, "%") : ""));
};
var renderNormalActionCol = function renderNormalActionCol(file, index) {
var _locale$triggerUpload;
return /* @__PURE__ */React__default["default"].createElement("td", null, /* @__PURE__ */React__default["default"].createElement(link_index.Link, {
theme: "primary",
hover: "color",
className: "".concat(uploadPrefix, "__delete"),
onClick: function onClick(e) {
return props.onRemove({
e: e,
index: index,
file: file
});
}
}, locale === null || locale === void 0 || (_locale$triggerUpload = locale.triggerUploadText) === null || _locale$triggerUpload === void 0 ? void 0 : _locale$triggerUpload["delete"]));
};
function getFileThumbnailIcon(fileType) {
if (utils.FILE_PDF_REGEXP.test(fileType)) {
return /* @__PURE__ */React__default["default"].createElement(FilePdfIcon, null);
}
if (utils.FILE_EXCEL_REGEXP.test(fileType)) {
return /* @__PURE__ */React__default["default"].createElement(FileExcelIcon, null);
}
if (utils.FILE_WORD_REGEXP.test(fileType)) {
return /* @__PURE__ */React__default["default"].createElement(FileWordIcon, null);
}
if (utils.FILE_PPT_REGEXP.test(fileType)) {
return /* @__PURE__ */React__default["default"].createElement(FilePowerpointIcon, null);
}
if (utils.VIDEO_REGEXP.test(fileType)) {
return /* @__PURE__ */React__default["default"].createElement(VideoIcon, null);
}
return /* @__PURE__ */React__default["default"].createElement(FileIcon, null);
}
function renderFileThumbnail(file) {
if (!file || !file.raw && file.url) return null;
var fileType = file.raw.type;
var className = "".concat(uploadPrefix, "__file-thumbnail");
if (utils.IMAGE_REGEXP.test(fileType) && (file.url || file.raw)) {
return /* @__PURE__ */React__default["default"].createElement(image_index.Image, {
className: className,
src: file.url || file.raw,
fit: "scale-down",
error: "",
loading: "",
onClick: function onClick(e) {
e.preventDefault();
browseIconClick({
e: e,
index: 0,
file: file,
viewFiles: [file]
});
}
});
}
return /* @__PURE__ */React__default["default"].createElement("div", {
className: className
}, getFileThumbnailIcon(fileType));
}
var renderBatchActionCol = function renderBatchActionCol(index) {
var _locale$triggerUpload2;
return index === 0 ? /* @__PURE__ */React__default["default"].createElement("td", {
rowSpan: displayFiles.length,
className: "".concat(uploadPrefix, "__flow-table__batch-row")
}, /* @__PURE__ */React__default["default"].createElement(link_index.Link, {
theme: "primary",
hover: "color",
className: "".concat(uploadPrefix, "__delete"),
onClick: function onClick(e) {
return props.onRemove({
e: e,
index: -1,
file: void 0
});
}
}, locale === null || locale === void 0 || (_locale$triggerUpload2 = locale.triggerUploadText) === null || _locale$triggerUpload2 === void 0 ? void 0 : _locale$triggerUpload2["delete"])) : null;
};
var renderFileList = function renderFileList() {
var _locale$file, _locale$file2, _locale$file3, _locale$file4;
if (props.fileListDisplay === null) return null;
if (props.fileListDisplay) {
return _util_parseTNode["default"](props.fileListDisplay, {
cancelUpload: props.cancelUpload,
uploadFiles: props.uploadFiles,
onPreview: props.onPreview,
onRemove: props.onRemove,
toUploadFiles: props.toUploadFiles,
sizeOverLimitMessage: props.sizeOverLimitMessage,
locale: props.locale,
files: displayFiles,
dragEvents: innerDragEvents
});
}
return /* @__PURE__ */React__default["default"].createElement("table", _objectSpread({
className: "".concat(uploadPrefix, "__flow-table")
}, innerDragEvents), /* @__PURE__ */React__default["default"].createElement("thead", null, /* @__PURE__ */React__default["default"].createElement("tr", null, /* @__PURE__ */React__default["default"].createElement("th", null, (_locale$file = locale.file) === null || _locale$file === void 0 ? void 0 : _locale$file.fileNameText), /* @__PURE__ */React__default["default"].createElement("th", null, (_locale$file2 = locale.file) === null || _locale$file2 === void 0 ? void 0 : _locale$file2.fileSizeText), /* @__PURE__ */React__default["default"].createElement("th", null, (_locale$file3 = locale.file) === null || _locale$file3 === void 0 ? void 0 : _locale$file3.fileStatusText), disabled ? null : /* @__PURE__ */React__default["default"].createElement("th", null, (_locale$file4 = locale.file) === null || _locale$file4 === void 0 ? void 0 : _locale$file4.fileOperationText))), /* @__PURE__ */React__default["default"].createElement("tbody", null, !displayFiles.length && /* @__PURE__ */React__default["default"].createElement("tr", null, /* @__PURE__ */React__default["default"].createElement("td", {
colSpan: 4
}, renderEmpty())), displayFiles.map(function (file, index) {
var _props$abridgeName;
var showBatchUploadAction = props.isBatchUpload;
var deleteNode = showBatchUploadAction && displayFiles.every(function (item) {
return item.status === "success" || !item.status;
}) ? renderBatchActionCol(index) : renderNormalActionCol(file, index);
var fileName = (_props$abridgeName = props.abridgeName) !== null && _props$abridgeName !== void 0 && _props$abridgeName.length ? utils.abridgeName.apply(void 0, [file.name].concat(toConsumableArray._toConsumableArray(props.abridgeName))) : file.name;
var thumbnailNode = showThumbnail ? /* @__PURE__ */React__default["default"].createElement("div", {
className: "".concat(uploadPrefix, "__file-info")
}, renderFileThumbnail(file), fileName) : fileName;
var fileNameNode = file.url ? /* @__PURE__ */React__default["default"].createElement(link_index.Link, {
href: file.url,
target: "_blank",
hover: "color"
}, thumbnailNode) : thumbnailNode;
return /* @__PURE__ */React__default["default"].createElement("tr", {
key: file.name + index
}, /* @__PURE__ */React__default["default"].createElement("td", {
className: "".concat(uploadPrefix, "__file-name")
}, fileNameNode), /* @__PURE__ */React__default["default"].createElement("td", null, utils.returnFileSize(file.size)), /* @__PURE__ */React__default["default"].createElement("td", null, renderStatus(file)), disabled ? null : deleteNode);
})));
};
var renderImageList = function renderImageList() {
if (props.fileListDisplay) {
return _util_parseTNode["default"](props.fileListDisplay, _objectSpread(_objectSpread({}, props), {}, {
files: displayFiles,
dragEvents: innerDragEvents
}));
}
return /* @__PURE__ */React__default["default"].createElement("ul", {
className: "".concat(uploadPrefix, "__card clearfix")
}, displayFiles.map(function (file, index) {
return renderImgItem(file, index);
}));
};
var renderCancelUploadButton = function renderCancelUploadButton() {
if (cancelUploadButton === null) return null;
if (isFunction.isFunction(cancelUploadButton)) return _util_parseTNode["default"](cancelUploadButton);
var cancelButtonProps = isObject.isObject(cancelUploadButton) ? cancelUploadButton : void 0;
return /* @__PURE__ */React__default["default"].createElement(button_index.Button, _objectSpread({
theme: "default",
disabled: disabled || !uploading,
className: "".concat(uploadPrefix, "__cancel"),
onClick: function onClick(e) {
var _props$cancelUpload;
return (_props$cancelUpload = props.cancelUpload) === null || _props$cancelUpload === void 0 ? void 0 : _props$cancelUpload.call(props, {
e: e
});
}
}, cancelButtonProps), locale === null || locale === void 0 ? void 0 : locale.cancelUploadText);
};
var renderUploadButton = function renderUploadButton() {
if (uploadButton === null) return null;
if (isFunction.isFunction(uploadButton)) return _util_parseTNode["default"](uploadButton);
var uploadButtonProps = isObject.isObject(uploadButton) ? uploadButton : void 0;
return /* @__PURE__ */React__default["default"].createElement(button_index.Button, _objectSpread({
disabled: disabled || uploading || !displayFiles.length,
theme: "primary",
loading: uploading,
className: "".concat(uploadPrefix, "__continue"),
onClick: function onClick() {
var _props$uploadFiles;
return (_props$uploadFiles = props.uploadFiles) === null || _props$uploadFiles === void 0 ? void 0 : _props$uploadFiles.call(props);
}
}, uploadButtonProps), uploadText);
};
var cardClassName = "".concat(uploadPrefix, "__flow-card-area");
return /* @__PURE__ */React__default["default"].createElement("div", {
className: "".concat(uploadPrefix, "__flow ").concat(uploadPrefix, "__flow-").concat(props.theme)
}, /* @__PURE__ */React__default["default"].createElement("div", {
className: "".concat(uploadPrefix, "__flow-op")
}, props.children, props.placeholder && /* @__PURE__ */React__default["default"].createElement("small", {
className: "".concat(uploadPrefix, "__flow-placeholder ").concat(uploadPrefix, "__placeholder")
}, props.placeholder)), props.theme === "image-flow" && /* @__PURE__ */React__default["default"].createElement("div", _objectSpread({
className: cardClassName
}, innerDragEvents), displayFiles.length ? renderImageList() : renderEmpty()), props.theme === "file-flow" && (displayFiles.length ? renderFileList() : /* @__PURE__ */React__default["default"].createElement("div", _objectSpread({
className: cardClassName
}, innerDragEvents), renderEmpty())), !props.autoUpload && /* @__PURE__ */React__default["default"].createElement("div", {
className: "".concat(uploadPrefix, "__flow-bottom")
}, renderCancelUploadButton(), renderUploadButton()), /* @__PURE__ */React__default["default"].createElement(imageViewer_index.ImageViewer, _objectSpread({
images: currentPreviewFile.map(function (t) {
return t.url || t.raw;
}),
visible: !!currentPreviewFile.length,
onClose: closePreview,
index: previewIndex,
onIndexChange: previewIndexChange
}, props.imageViewerProps)));
};
ImageFlowList.displayName = "ImageFlowList";
exports["default"] = ImageFlowList;
//# sourceMappingURL=MultipleFlowList.js.map