dtable-ui-component 5.3.1-beta → 5.3.1

package/lib/FileEditor/addition-previewer/local-file-addition/index.js

@@ -1,252 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _reactstrap = require("reactstrap");
-var _UploadProgress = _interopRequireDefault(require("../../../UploadProgress"));
-var _url = require("../../../utils/url");
-var _FileUploader = _interopRequireDefault(require("../../../FileUploader"));
-var _lang = require("../../../lang");
-require("./index.css");
-class LocalFileAddition extends _react.default.Component {
-  constructor(props) {
-    super(props);
-    this.setFileTipShow = isFileTipShow => {
-      this.setState({
-        isFileTipShow: isFileTipShow
-      });
-    };
-    this.updateUploadFileList = fileListInfo => {
-      if (!fileListInfo) {
-        this.setState({
-          thumbnailSrcList: []
-        });
-        return;
-      }
-      this.setState({
-        thumbnailSrcList: fileListInfo
-      });
-    };
-    this.onFileUploadSuccess = fileMessage => {
-      this.hideDeleteIcon();
-      let {
-        thumbnailSrcList
-      } = this.state;
-      const findUploadFileIndex = this.findUploadFileIndex(fileMessage);
-      thumbnailSrcList.splice(findUploadFileIndex, 1, fileMessage);
-      if (thumbnailSrcList.every(fileItem => !fileItem.isUploading)) {
-        this.setState({
-          thumbnailSrcList: []
-        });
-      }
-      this.props.fileUploadCompleted(fileMessage);
-    };
-    this.onFileUploadProgress = fileMessage => {
-      let {
-        thumbnailSrcList
-      } = this.state;
-      const findUploadFileIndex = this.findUploadFileIndex(fileMessage);
-      thumbnailSrcList.splice(findUploadFileIndex, 1, fileMessage);
-      this.setState({
-        thumbnailSrcList
-      });
-    };
-    this.onFileUploadFailed = fileMessage => {
-      let {
-        thumbnailSrcList
-      } = this.state;
-      const findUploadFileIndex = this.findUploadFileIndex(fileMessage);
-      thumbnailSrcList.splice(findUploadFileIndex, 1, fileMessage);
-      this.setState({
-        thumbnailSrcList
-      });
-    };
-    this.findUploadFileIndex = uploadFileMessage => {
-      let {
-        thumbnailSrcList
-      } = this.state;
-      let uploadFileIndex = thumbnailSrcList.findIndex(item => item.name === uploadFileMessage.file.name);
-      return uploadFileIndex;
-    };
-    this.deleteFile = (event, index) => {
-      this.props.deleteFile(index, 'localFile');
-    };
-    this.showDeleteIcon = (event, index) => {
-      this.setState({
-        isShowDeleteIcon: true,
-        enterFileIndex: index
-      });
-    };
-    this.hideDeleteIcon = () => {
-      this.setState({
-        isShowDeleteIcon: false,
-        enterFileIndex: -1
-      });
-    };
-    this.fileUploadAgain = (event, fileMessage) => {
-      this.uploaderFileRef.reuploadFile(fileMessage);
-    };
-    this.tooltipToggle = () => {
-      if (this.state.tooltipOpen) {
-        this.setState({
-          isShowDeleteIcon: false,
-          enterFileIndex: -1
-        });
-      }
-      this.setState({
-        tooltipOpen: !this.state.tooltipOpen
-      });
-    };
-    this.renderMultipleFilesArr = () => {
-      let {
-        thumbnailSrcList
-      } = this.state;
-      let fileArr = [];
-      if (Array.isArray(this.props.uploadLocalFileValue)) {
-        let uploadedFileList = this.renderUploadedFile();
-        if (uploadedFileList) {
-          fileArr.push(...uploadedFileList);
-        }
-        if (Array.isArray(thumbnailSrcList) && thumbnailSrcList.length > 0) {
-          let thumbnailList = thumbnailSrcList.map((fileThumbnailItem, index) => {
-            let uploadFile = fileThumbnailItem.percent === 100 && !fileThumbnailItem.isErrorTip;
-            return /*#__PURE__*/_react.default.createElement(_react.Fragment, {
-              key: "dtable-ui-image-wrapper-circle".concat(index)
-            }, fileThumbnailItem.isUploading && /*#__PURE__*/_react.default.createElement("div", {
-              className: "dtable-ui-image-wrapper"
-            }, /*#__PURE__*/_react.default.createElement("div", {
-              className: "dtable-ui-image-upload-percent"
-            }, /*#__PURE__*/_react.default.createElement("img", {
-              src: fileThumbnailItem.fileIconUrl,
-              style: {
-                position: 'absolute',
-                zIndex: "".concat(uploadFile ? 3 : 1),
-                maxHeight: '100%'
-              },
-              alt: ""
-            }), fileThumbnailItem.percent < 100 && /*#__PURE__*/_react.default.createElement(_UploadProgress.default, {
-              uploadPercent: fileThumbnailItem.percent || 0
-            }), uploadFile && /*#__PURE__*/_react.default.createElement("div", {
-              className: "dtable-ui-image-upload-success"
-            }, /*#__PURE__*/_react.default.createElement("div", {
-              className: "dtable-ui-image-upload-success-scale"
-            }, /*#__PURE__*/_react.default.createElement("span", {
-              className: "dtable-ui-image-upload-success-tip"
-            }, (0, _lang.getLocale)('Indexing')))), /*#__PURE__*/_react.default.createElement("div", {
-              className: "dtable-ui-image-upload-mask"
-            }), fileThumbnailItem.isErrorTip && /*#__PURE__*/_react.default.createElement("div", {
-              className: "dtable-ui-image-upload-error-tip"
-            }, /*#__PURE__*/_react.default.createElement("span", null, (0, _lang.getLocale)('Network_Error')), /*#__PURE__*/_react.default.createElement("span", {
-              className: "dtable-ui-image-upload-again",
-              onClick: event => this.fileUploadAgain(event, fileThumbnailItem)
-            }, (0, _lang.getLocale)('Re_upload'))))));
-          });
-          fileArr.push(...thumbnailList);
-        }
-      }
-      return fileArr;
-    };
-    this.renderUploadedFile = () => {
-      const {
-        config,
-        uploadLocalFileValue
-      } = this.props;
-      let uploadedFileList = [];
-      uploadedFileList = uploadLocalFileValue.length > 0 && uploadLocalFileValue.map((fileItem, index) => {
-        let {
-          fileIconUrl
-        } = (0, _url.getFileThumbnailInfo)(fileItem, config);
-        return /*#__PURE__*/_react.default.createElement("div", {
-          key: 'dtable-ui-image-wrapper-' + index,
-          className: "dtable-ui-image-wrapper",
-          id: "file-content-tip-".concat(index),
-          onMouseEnter: event => this.showDeleteIcon(event, index),
-          onMouseLeave: this.hideDeleteIcon
-        }, /*#__PURE__*/_react.default.createElement("div", {
-          className: "dtable-ui-image-content"
-        }, /*#__PURE__*/_react.default.createElement("img", {
-          src: fileIconUrl,
-          alt: "",
-          style: {
-            maxHeight: '100%'
-          }
-        })), this.state.isShowDeleteIcon && this.state.enterFileIndex === index && /*#__PURE__*/_react.default.createElement("div", {
-          className: "dtable-delete-image-icon",
-          onClick: event => this.deleteFile(event, index)
-        }, /*#__PURE__*/_react.default.createElement("span", {
-          className: "image-delete-span"
-        }, "x")), this.state.isShowDeleteIcon && this.state.enterFileIndex === index && /*#__PURE__*/_react.default.createElement(_reactstrap.Tooltip, {
-          toggle: this.tooltipToggle,
-          delay: {
-            show: 0,
-            hide: 0
-          },
-          target: "file-content-tip-".concat(index),
-          placement: "bottom",
-          isOpen: this.state.tooltipOpen
-        }, fileItem.name));
-      });
-      return uploadedFileList;
-    };
-    this.renderUploadFileWrapper = fileArr => {
-      let {
-        isFileTipShow
-      } = this.state;
-      let editorContent = fileArr.length === 0 ? /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-        className: "dtable-ui-image-tip-addition ".concat(isFileTipShow ? 'dtable-ui-image-drop-active' : '')
-      }, /*#__PURE__*/_react.default.createElement("div", {
-        className: "dtable-ui-dtable-ui-image-add-icon"
-      }, /*#__PURE__*/_react.default.createElement("i", {
-        "aria-hidden": "true",
-        className: "dtable-font dtable-icon-add-files"
-      })), isFileTipShow ? /*#__PURE__*/_react.default.createElement("div", {
-        className: "dtable-ui-image-add-span"
-      }, (0, _lang.getLocale)('Drag_and_drop_to_add_a_file')) : /*#__PURE__*/_react.default.createElement("div", {
-        className: "dtable-ui-image-add-span"
-      }, (0, _lang.getLocale)('Drag_and_drop_files_or_click_here_to_add')))) : /*#__PURE__*/_react.default.createElement("div", {
-        className: "dtable-ui-image-add-box"
-      }, /*#__PURE__*/_react.default.createElement("div", {
-        className: "dtable-ui-image-add-button ".concat(isFileTipShow ? 'dtable-ui-image-wrapper-drop-active' : '')
-      }, /*#__PURE__*/_react.default.createElement("i", {
-        "aria-hidden": "true",
-        className: "dtable-font dtable-icon-add-table"
-      }), /*#__PURE__*/_react.default.createElement("span", {
-        className: "dtable-ui-image-add-span"
-      }, (0, _lang.getLocale)('Upload'))));
-      return /*#__PURE__*/_react.default.createElement(_FileUploader.default, {
-        uploadType: "file",
-        isSupportDragDrop: true,
-        className: fileArr.length === 0 ? (0, _classnames.default)('dtable-ui-image-upload-container', {
-          'dtable-ui-image-upload-container-active': isFileTipShow
-        }) : 'dtable-ui-image-wrapper',
-        updateParentTips: this.setFileTipShow,
-        onFileUploadSuccess: this.onFileUploadSuccess,
-        onFileUploadProgress: this.onFileUploadProgress,
-        updateUploadFileList: this.updateUploadFileList,
-        onFileUploadFailed: this.onFileUploadFailed,
-        ref: ref => this.uploaderFileRef = ref,
-        uploadFile: this.props.uploadFile
-      }, editorContent);
-    };
-    this.state = {
-      isFileTipShow: false,
-      isShowDeleteIcon: false,
-      enterFileIndex: -1,
-      tooltipOpen: false,
-      uploadMessageList: [],
-      thumbnailSrcList: [],
-      reUploadFile: null
-    };
-  }
-  render() {
-    let fileArr = this.renderMultipleFilesArr();
-    return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, fileArr, this.renderUploadFileWrapper(fileArr));
-  }
-}
-var _default = exports.default = LocalFileAddition;

package/lib/FileEditor/constants.js

@@ -1,7 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.FILES_FOLDER = void 0;
-const FILES_FOLDER = exports.FILES_FOLDER = 'files';

package/lib/FileEditor/files-previewer/file-previewer/dropdown-menu.js

@@ -1,74 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _reactstrap = require("reactstrap");
-var _lang = require("../../../lang");
-class FileDropdownMenu extends _react.default.Component {
-  constructor(props) {
-    super(props);
-    this.onDropdownToggleClick = e => {
-      e.preventDefault();
-      e.stopPropagation();
-      this.setState({
-        isItemMenuShow: !this.state.isItemMenuShow
-      }, () => {
-        if (this.state.isItemMenuShow) {
-          this.props.freezeItem();
-        } else {
-          this.props.unFreezeItem();
-          this.props.resetState();
-        }
-      });
-    };
-    this.onDeleteFile = event => {
-      this.props.resetState();
-      this.props.onDeleteFile(this.props.itemIndex);
-    };
-    this.onRenameFile = event => {
-      event.nativeEvent.stopImmediatePropagation();
-      this.props.onRenameFile();
-    };
-    this.state = {
-      isItemMenuShow: false,
-      isRenameDialogShow: false
-    };
-  }
-  render() {
-    const {
-      onRenameFile,
-      onDeleteFile
-    } = this.props;
-    return /*#__PURE__*/_react.default.createElement(_reactstrap.Dropdown, {
-      isOpen: this.state.isItemMenuShow,
-      toggle: this.onDropdownToggleClick,
-      className: "file-dropdown-menu"
-    }, /*#__PURE__*/_react.default.createElement(_reactstrap.DropdownToggle, {
-      tag: "span",
-      role: "button",
-      "data-toggle": "dropdown",
-      "aria-expanded": this.state.isItemMenuShow,
-      className: "file-dropdown-icon",
-      title: (0, _lang.getLocale)('More_operations'),
-      "aria-label": (0, _lang.getLocale)('More_operations')
-    }, /*#__PURE__*/_react.default.createElement("span", {
-      "aria-hidden": "true",
-      className: "dtable-font dtable-icon-more-vertical file-dropdown-more"
-    })), /*#__PURE__*/_react.default.createElement(_reactstrap.DropdownMenu, {
-      className: "dtable-dropdown-menu dropdown-menu"
-    }, onRenameFile && /*#__PURE__*/_react.default.createElement(_reactstrap.DropdownItem, {
-      onClick: this.onRenameFile
-    }, /*#__PURE__*/_react.default.createElement("i", {
-      className: "item-icon dtable-font dtable-icon-rename"
-    }), (0, _lang.getLocale)('Rename')), onDeleteFile && /*#__PURE__*/_react.default.createElement(_reactstrap.DropdownItem, {
-      onClick: this.onDeleteFile
-    }, /*#__PURE__*/_react.default.createElement("i", {
-      className: "item-icon dtable-font dtable-icon-delete"
-    }), (0, _lang.getLocale)('Delete'))));
-  }
-}
-var _default = exports.default = FileDropdownMenu;

package/lib/FileEditor/files-previewer/file-previewer/file-name-editor/index.css

@@ -1,5 +0,0 @@
-.dtable-ui-file-name-input {
-  height: 24px;
-  cursor: text;
-  padding: 0 6px;
-}

package/lib/FileEditor/files-previewer/file-previewer/file-name-editor/index.js

@@ -1,77 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _reactstrap = require("reactstrap");
-var _constants = require("../../../../constants");
-require("./index.css");
-class FileNameEditor extends _react.Component {
-  constructor(props) {
-    super(props);
-    this.onMouseDown = e => {
-      if (this.fileNameRef && !this.fileNameRef.contains(e.target)) {
-        this.onSave();
-      }
-    };
-    this.onChange = e => {
-      this.setState({
-        fileName: e.target.value
-      });
-    };
-    this.onKeyDown = e => {
-      e.stopPropagation();
-      if (e.keyCode === _constants.KeyCodes.Enter) {
-        e.preventDefault();
-        this.onSave();
-      }
-    };
-    this.onSave = () => {
-      const {
-        renameFile,
-        name,
-        closeRenameFile,
-        itemIndex
-      } = this.props;
-      let newName = this.state.fileName.trim();
-      if (newName === name || newName === '') {
-        closeRenameFile();
-        return;
-      }
-      this.unSaved = false;
-      renameFile(itemIndex, newName);
-      closeRenameFile();
-    };
-    this.state = {
-      fileName: props.name || ''
-    };
-    this.unSaved = true;
-  }
-  componentDidMount() {
-    document.addEventListener('mousedown', this.onMouseDown);
-  }
-  componentWillUnmount() {
-    if (this.unSaved) {
-      this.onSave();
-    }
-    document.removeEventListener('mousedown', this.onMouseDown);
-  }
-  render() {
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: "pt-1",
-      ref: ref => this.fileNameRef = ref
-    }, /*#__PURE__*/_react.default.createElement(_reactstrap.Input, {
-      className: "dtable-ui-file-name-input",
-      type: "text",
-      value: this.state.fileName,
-      onChange: this.onChange,
-      onKeyDown: this.onKeyDown,
-      onBlur: this.onSave,
-      autoFocus: true
-    }));
-  }
-}
-var _default = exports.default = FileNameEditor;

package/lib/FileEditor/files-previewer/file-previewer/index.css

@@ -1,88 +0,0 @@
-.dtable-ui-file-editor-previewer-box {
-  display: flex;
-  height: 48px;
-  width: 100%;
-  padding: 0px 16px;
-  justify-content: space-between;
-}
-
-.dtable-ui-file-editor-previewer-box.dtable-ui-file-editor-previewer-box-highlight {
-  background-color: #f5f5f5;
-}
-
-.dtable-ui-file-editor-previewer-box .dtable-ui-file-editor-previewer-item {
-  display: flex;
-  align-items: center;
-  width: calc(100% - 56px);
-}
-
-.dtable-ui-file-editor-previewer-box .dtable-ui-file-editor-previewer-item .dtable-ui-file-editor-previewer-icon {
-  height: 100%;
-  line-height: 48px;
-  margin-right: 5px;
-  flex-shrink: 0;
-}
-
-.dtable-ui-file-editor-previewer-box .dtable-ui-file-editor-previewer-item .dtable-ui-file-editor-previewer-icon img {
-  width: 36px;
-  height: 36px;
-}
-
-.dtable-ui-file-editor-previewer-box .dtable-ui-file-editor-previewer-item .dtable-ui-file-editor-previewer-info {
-  display: flex;
-  flex-direction: column;
-}
-
-.dtable-ui-file-editor-previewer-box .dtable-ui-file-editor-previewer-item .dtable-ui-file-editor-previewer-item-name {
-  max-width: 480px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.dtable-ui-file-editor-previewer-box .dtable-ui-file-editor-previewer-item .dtable-ui-file-editor-preview-item-detail {
-  color: #c0c0c0;
-}
-
-.dtable-ui-file-editor-previewer-box .dtable-ui-file-editor-preview-item-detail .file-upload-time {
-  white-space: pre-wrap;
-}
-
-.dtable-ui-file-editor-previewer-operation {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-
-.dtable-ui-file-editor-previewer-operation .file-dropdown-menu .file-dropdown-icon {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 24px;
-  width: 24px;
-}
-
-.file-dropdown-menu .file-dropdown-icon .dtable-icon-more-vertical {
-  font-size: 14px;
-  color: #999;
-}
-
-.dtable-ui-file-editor-previewer-operation .file-download-icon,
-.file-dropdown-menu .file-dropdown-icon .file-dropdown-more {
-  width: 24px;
-  height: 24px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  font-size: 14px;
-  color: #999;
-  cursor: pointer;
-}
-
-.file-dropdown-menu .file-dropdown-icon:hover .file-dropdown-more,
-.dtable-ui-file-editor-previewer-operation .file-download-icon:hover {
-  color: #000;
-  opacity: 0.75;
-}
-
-

package/lib/FileEditor/files-previewer/file-previewer/index.js

@@ -1,167 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _reactstrap = require("reactstrap");
-var _dropdownMenu = _interopRequireDefault(require("./dropdown-menu"));
-var _fileNameEditor = _interopRequireDefault(require("./file-name-editor"));
-var _utils = require("../../utils");
-var _url = require("../../../utils/url");
-require("./index.css");
-class FilePreviewer extends _react.default.Component {
-  constructor(props) {
-    super(props);
-    this.fileItemMouseEnter = () => {
-      if (!this.props.isItemFreezed) {
-        this.setState({
-          isShowOperation: true,
-          highlight: true
-        });
-      }
-    };
-    this.fileItemMouseLeave = () => {
-      if (!this.props.isItemFreezed) {
-        this.setState({
-          isShowOperation: false,
-          highlight: false
-        });
-      }
-    };
-    this.handleFileClick = () => {
-      let {
-        fileItem
-      } = this.props;
-      let openFileUrl = fileItem.url;
-      let assetFileIndex = openFileUrl.indexOf('/asset');
-      if (assetFileIndex > -1 && (0, _url.imageCheck)(fileItem.name)) {
-        this.props.showLargeImage(fileItem.url);
-        return;
-      }
-    };
-    this.downloadFile = e => {
-      e.stopPropagation();
-      let downloadUrl = this.props.fileItem.url;
-      this.props.downloadFile(downloadUrl);
-    };
-    this.onSelectFile = () => {
-      const {
-        fileItem
-      } = this.props;
-      this.props.onSelectFiles(fileItem.name);
-    };
-    this.closeRenameFile = () => {
-      if (this.state.isShowRename) {
-        this.setState({
-          isShowRename: false
-        });
-      }
-    };
-    this.openRenameFile = () => {
-      this.setState({
-        isShowRename: true
-      });
-    };
-    this.resetState = () => {
-      this.setState({
-        isShowOperation: false,
-        highlight: false
-      });
-      this.props.unFreezeItem();
-    };
-    this.state = {
-      isShowRename: false,
-      isShowOperation: false,
-      highlight: false,
-      errorMessage: ''
-    };
-  }
-  render() {
-    const {
-      fileItem,
-      isItemFreezed,
-      isSelectMultipleFiles,
-      isSelected,
-      config
-    } = this.props;
-    const {
-      isShowRename,
-      isShowOperation,
-      highlight
-    } = this.state;
-    const {
-      fileIconUrl
-    } = (0, _url.getFileThumbnailInfo)(fileItem, config);
-    const errorMessage = '';
-    const uploadTime = (0, _utils.getFileUploadTime)(fileItem);
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: "dtable-ui-file-editor-previewer-box ".concat(highlight ? 'dtable-ui-file-editor-previewer-box-highlight' : ''),
-      onMouseEnter: this.fileItemMouseEnter,
-      onMouseLeave: this.fileItemMouseLeave
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "dtable-ui-file-editor-previewer-item"
-    }, isSelectMultipleFiles && /*#__PURE__*/_react.default.createElement("input", {
-      onChange: this.onSelectFile,
-      checked: isSelected,
-      className: "mr-2",
-      type: "checkbox"
-    }), /*#__PURE__*/_react.default.createElement("div", {
-      className: "dtable-ui-file-editor-previewer-icon"
-    }, /*#__PURE__*/_react.default.createElement("img", {
-      alt: "",
-      src: fileIconUrl
-    })), /*#__PURE__*/_react.default.createElement("div", {
-      className: "dtable-ui-file-editor-previewer-info"
-    }, isShowRename ? /*#__PURE__*/_react.default.createElement(_fileNameEditor.default, {
-      itemIndex: this.props.itemIndex,
-      name: fileItem.name,
-      renameFile: this.props.renameFile,
-      closeRenameFile: this.closeRenameFile
-    }) : /*#__PURE__*/_react.default.createElement("div", {
-      className: "dtable-ui-file-editor-previewer-item-name ".concat(fileItem.type === 'dir' ? 'dtable-ui-file-editor-previewer-item-name-height' : ''),
-      ref: ref => this.renameRef = ref
-    }, /*#__PURE__*/_react.default.createElement("span", {
-      onClick: this.props.renameFile ? this.handleFileClick : () => {}
-    }, fileItem.name)), /*#__PURE__*/_react.default.createElement("div", {
-      className: "dtable-ui-file-editor-preview-item-detail d-flex"
-    }, uploadTime && /*#__PURE__*/_react.default.createElement("span", {
-      className: "file-upload-time"
-    }, "".concat(uploadTime, ", ")), fileItem.size > -1 && /*#__PURE__*/_react.default.createElement("span", null, (0, _utils.bytesToSize)(fileItem.size))))), !isShowRename && isItemFreezed && /*#__PURE__*/_react.default.createElement(_reactstrap.UncontrolledTooltip, {
-      delay: {
-        show: 0,
-        hide: 0
-      },
-      placement: "bottom",
-      target: this.renameRef
-    }, fileItem.name), isShowOperation && /*#__PURE__*/_react.default.createElement("div", {
-      className: "dtable-ui-file-editor-previewer-operation"
-    }, this.props.downloadFile && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, fileItem.type === 'file' && !errorMessage && /*#__PURE__*/_react.default.createElement("span", {
-      "aria-hidden": "true",
-      className: "dtable-font dtable-icon-download file-download-icon",
-      onClick: this.downloadFile
-    }), fileItem.type === 'file' && errorMessage && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", {
-      "aria-hidden": "true",
-      className: "dtable-font dtable-icon-download disable file-download-icon",
-      ref: ref => this.disabledDownloadRef = ref
-    }), /*#__PURE__*/_react.default.createElement(_reactstrap.UncontrolledTooltip, {
-      delay: {
-        show: 0,
-        hide: 0
-      },
-      placement: "bottom",
-      target: this.disabledDownloadRef
-    }, errorMessage))), (this.props.deleteFile || this.props.renameFile) && /*#__PURE__*/_react.default.createElement(_dropdownMenu.default, {
-      fileItem: fileItem,
-      freezeItem: this.props.freezeItem,
-      unFreezeItem: this.props.unFreezeItem,
-      resetState: this.resetState,
-      itemIndex: this.props.itemIndex,
-      onDeleteFile: this.props.deleteFile ? this.props.deleteFile : null,
-      onRenameFile: this.props.renameFile ? this.openRenameFile : null
-    })));
-  }
-}
-var _default = exports.default = FilePreviewer;