dtable-ui-component 6.0.26 → 6.0.28

package/lib/DateEditor/mb-date-editor-popover/index.js

@@ -6,12 +6,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _datePicker = _interopRequireDefault(require("antd-mobile/lib/date-picker"));
 var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _dayjs = _interopRequireDefault(require("dayjs"));
 var _seafileCalendar = _interopRequireDefault(require("@seafile/seafile-calendar"));
 var SeaDatePicker = _interopRequireWildcard(require("@seafile/seafile-calendar/lib/Picker"));
-var _DatePicker = _interopRequireDefault(require("../../DatePicker"));
 var _lang = require("../../lang");
 var _editorUtils = require("../../utils/editor-utils");
 var _MBEditorHeader = _interopRequireDefault(require("../../MBEditorHeader"));
@@ -197,7 +197,7 @@ class DateEditorPopover extends _react.default.PureComponent {
       className: "mb-date-editor-input"
     }, /*#__PURE__*/_react.default.createElement("div", {
       className: "date-input"
-    }, /*#__PURE__*/_react.default.createElement(_DatePicker.default, {
+    }, /*#__PURE__*/_react.default.createElement(_datePicker.default, {
       mode: "date",
       locale: (0, _editorUtils.initDateEditorLanguage)(lang),
       value: this.state.value,
@@ -206,7 +206,7 @@ class DateEditorPopover extends _react.default.PureComponent {
       className: "date-input-day"
     }, datePickerValue && datePickerValue.format(leftFormat)))), showHourAndMinute && /*#__PURE__*/_react.default.createElement("div", {
       className: "date-input"
-    }, /*#__PURE__*/_react.default.createElement(_DatePicker.default, {
+    }, /*#__PURE__*/_react.default.createElement(_datePicker.default, {
       mode: "time",
       locale: (0, _editorUtils.initDateEditorLanguage)(lang),
       value: this.state.value,

package/lib/Department-editor/department-multiple-select/index.css

@@ -42,7 +42,6 @@
 .departments-container.dtable-ui .expand {
   color: #b5b5b5;
   font-size: 12px;
-  transform: scale(0.8);
   cursor: pointer;
   margin-left: 0px !important;
 }
@@ -65,6 +64,10 @@
   align-items: center;
 }
 
+.departments-container.dtable-ui .department-item .department-item-fold-btn {
+  margin-right: 2px;
+}
+
 .departments-container.dtable-ui .department-item:hover {
   background: #f5f5f5;
   color: #212529;

package/lib/Department-editor/department-multiple-select/index.js

@@ -100,10 +100,13 @@ function DepartmentMultipleSelect(props) {
       checked: inputChecked,
       style: inputStyle,
       onChange: () => {}
-    }), hasChild && !searchVal && /*#__PURE__*/_react.default.createElement("span", {
-      className: "dtable-font expand dtable-icon-".concat(isExpanded ? 'drop-down' : 'right-slide', " pr-1"),
-      onClick: event => onExpand(event, id, isExpanded)
-    }), /*#__PURE__*/_react.default.createElement("span", {
+    }), hasChild && !searchVal && /*#__PURE__*/_react.default.createElement("div", {
+      onClick: event => onExpand(event, id, isExpanded),
+      role: "button",
+      className: "department-item-fold-btn"
+    }, /*#__PURE__*/_react.default.createElement("span", {
+      className: "dtable-font expand dtable-icon-down3 ".concat(isExpanded ? '' : 'rotate-270')
+    })), /*#__PURE__*/_react.default.createElement("span", {
       style: searchVal ? {} : nameStyle,
       title: name,
       className: "text-truncate"

package/lib/Department-editor/department-single-select.js

@@ -151,10 +151,13 @@ class DepartmentSingleSelect extends _react.Component {
         style: itemStyle
       }, /*#__PURE__*/_react.default.createElement("div", {
         className: "department-item-left-content d-flex align-items-center"
-      }, hasChild && /*#__PURE__*/_react.default.createElement("span", {
-        className: "dtable-font expand dtable-icon-".concat(isExpanded ? 'drop-down' : 'right-slide', " pr-1"),
-        onClick: event => this.onExpand(event, id, isExpanded)
-      }), /*#__PURE__*/_react.default.createElement("span", {
+      }, hasChild && /*#__PURE__*/_react.default.createElement("div", {
+        onClick: event => this.onExpand(event, id, isExpanded),
+        role: "button",
+        className: "department-item-fold-btn"
+      }, /*#__PURE__*/_react.default.createElement("span", {
+        className: "dtable-font expand dtable-icon-down3 ".concat(isExpanded ? '' : 'rotate-270')
+      })), /*#__PURE__*/_react.default.createElement("span", {
         style: nameStyle,
         title: name,
         className: "text-truncate department-name"

package/lib/Department-editor/index.css

@@ -38,6 +38,10 @@
   margin-left: 4px;
 }
 
+.dtable-ui.department-editor-list .department-item-left-content .department-item-fold-btn {
+  margin-right: 2px;
+}
+
 .dtable-ui.department-editor-list .department-check-icon .dtable-icon-check-mark {
   font-size: 12px;
   color: #798d99;

package/lib/FileFormatter/index.js

@@ -9,47 +9,107 @@ exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _FileItemFormatter = _interopRequireDefault(require("../FileItemFormatter"));
+var _ImagePreviewerLightbox = _interopRequireDefault(require("../ImagePreviewerLightbox"));
+var _url = require("../utils/url");
 require("./index.css");
-class FileFormatter extends _react.default.PureComponent {
-  render() {
-    let {
-      isSample,
-      value,
-      containerClassName,
-      renderItem
-    } = this.props;
-    if (!Array.isArray(value) || value.length === 0) {
-      return null;
+const FileFormatter = _ref => {
+  let {
+    isSample = false,
+    value = [],
+    containerClassName = '',
+    renderItem,
+    isSupportOpenFile = false,
+    server,
+    workspaceID,
+    dtableUuid
+  } = _ref;
+  const [largeImageIndex, setLargeImageIndex] = (0, _react.useState)(-1);
+  const [fileImageUrlList, setFileImageUrlList] = (0, _react.useState)([]);
+  const getFileItemImageUrlList = (0, _react.useCallback)(value => {
+    let newFileImageUrlList = [];
+    value.forEach(fileItem => {
+      const {
+        url,
+        name
+      } = fileItem;
+      let assetFileIndex = typeof url === 'string' ? url.indexOf('/asset') : -1;
+      if (assetFileIndex > -1) {
+        const isImage = (0, _url.imageCheck)(name);
+        if (isImage) {
+          newFileImageUrlList.push(url);
+        }
+      }
+    });
+    setFileImageUrlList(newFileImageUrlList);
+  }, []);
+  (0, _react.useEffect)(() => {
+    if (!isSupportOpenFile) return;
+    getFileItemImageUrlList(value);
+  }, [value, getFileItemImageUrlList, isSupportOpenFile]);
+  const showLargeImage = (0, _react.useCallback)(imageIndex => {
+    setLargeImageIndex(imageIndex);
+  }, []);
+  const openFile = (0, _react.useCallback)(fileItem => {
+    if (!isSupportOpenFile) return;
+    let openFileUrl = fileItem.url;
+    const imageIndex = fileImageUrlList.indexOf(openFileUrl);
+    if (imageIndex > -1) {
+      showLargeImage(imageIndex);
+      return;
     }
-    let className = (0, _classnames.default)('dtable-ui cell-formatter-container file-formatter', containerClassName);
-    if (isSample) {
-      let item = value[0];
-      return /*#__PURE__*/_react.default.createElement("div", {
-        className: className
-      }, /*#__PURE__*/_react.default.createElement(_FileItemFormatter.default, {
-        file: item
-      }), value.length !== 1 && /*#__PURE__*/_react.default.createElement("span", {
-        className: "file-item-count"
-      }, "+".concat(value.length)));
+    let previewerUrl;
+    let assetFileIndex = openFileUrl.indexOf('/asset');
+    if (assetFileIndex > -1) {
+      previewerUrl = openFileUrl.replace('/asset', '/asset-preview');
+      window.open(previewerUrl, '_blank');
     }
+  }, [fileImageUrlList, isSupportOpenFile, showLargeImage]);
+  const moveNext = (0, _react.useCallback)(() => {
+    setLargeImageIndex(prevIndex => (prevIndex + 1) % fileImageUrlList.length);
+  }, [fileImageUrlList]);
+  const movePrev = (0, _react.useCallback)(() => {
+    setLargeImageIndex(prevIndex => (prevIndex + fileImageUrlList.length - 1) % fileImageUrlList.length);
+  }, [fileImageUrlList]);
+  const hideLargeImage = (0, _react.useCallback)(() => {
+    setLargeImageIndex(-1);
+  }, []);
+  const className = (0, _classnames.default)('dtable-ui cell-formatter-container file-formatter', containerClassName);
+  if (!Array.isArray(value) || value.length === 0) {
+    return null;
+  }
+  if (isSample) {
+    const item = value[0];
     return /*#__PURE__*/_react.default.createElement("div", {
       className: className
-    }, value.map((item, index) => {
-      const dom = /*#__PURE__*/_react.default.createElement(_FileItemFormatter.default, {
-        file: item
-      });
-      if (renderItem) return /*#__PURE__*/_react.default.createElement(_react.Fragment, {
-        key: index
-      }, renderItem(dom));
-      return /*#__PURE__*/_react.default.createElement(_react.Fragment, {
-        key: index
-      }, dom);
-    }));
+    }, /*#__PURE__*/_react.default.createElement(_FileItemFormatter.default, {
+      file: item
+    }), value.length !== 1 && /*#__PURE__*/_react.default.createElement("span", {
+      className: "file-item-count"
+    }, "+".concat(value.length)));
   }
-}
-exports.default = FileFormatter;
-FileFormatter.defaultProps = {
-  isSample: false,
-  value: [],
-  containerClassName: ''
-};
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: className
+  }, value.map((item, index) => {
+    const dom = /*#__PURE__*/_react.default.createElement(_FileItemFormatter.default, {
+      openFile: openFile,
+      file: item
+    });
+    if (renderItem) return /*#__PURE__*/_react.default.createElement(_react.Fragment, {
+      key: index
+    }, renderItem(dom));
+    return /*#__PURE__*/_react.default.createElement(_react.Fragment, {
+      key: index
+    }, dom);
+  }), largeImageIndex > -1 && /*#__PURE__*/_react.default.createElement(_ImagePreviewerLightbox.default, {
+    server: server,
+    workspaceID: workspaceID,
+    dtableUuid: dtableUuid,
+    readOnly: true,
+    imageItems: fileImageUrlList,
+    imageIndex: largeImageIndex,
+    closeImagePopup: hideLargeImage,
+    moveToPrevImage: movePrev,
+    moveToNextImage: moveNext
+  }));
+};
+var _default = exports.default = FileFormatter;

package/lib/FileItemFormatter/index.js

@@ -10,13 +10,15 @@ var _url = require("../utils/url");
 const FileItemFormatter = _ref => {
   let {
     file,
-    config
+    config,
+    openFile
   } = _ref;
   const {
     fileIconUrl,
     isImage
   } = (0, _url.getFileThumbnailInfo)(file, config);
   return /*#__PURE__*/_react.default.createElement("img", {
+    onClick: () => openFile && openFile(file),
     className: "file-item-icon ".concat(isImage ? 'img' : ''),
     src: fileIconUrl,
     alt: (file === null || file === void 0 ? void 0 : file.name) || ''

package/lib/constants/file.js

@@ -47,6 +47,7 @@ const FILEEXT_ICON_MAP = exports.FILEEXT_ICON_MAP = {
   gif: 'pic',
   bmp: 'pic',
   ico: 'pic',
+  webp: 'pic',
   // folder dir
   folder: 'folder',
   // default

package/lib/index.js

@@ -4,18 +4,6 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "ActionSheet", {
-  enumerable: true,
-  get: function () {
-    return _ActionSheet.default;
-  }
-});
-Object.defineProperty(exports, "ActivityIndicator", {
-  enumerable: true,
-  get: function () {
-    return _ActivityIndicator.default;
-  }
-});
 Object.defineProperty(exports, "AutoNumberFormatter", {
   enumerable: true,
   get: function () {
@@ -190,12 +178,6 @@ Object.defineProperty(exports, "DateFormatter", {
     return _DateFormatter.default;
   }
 });
-Object.defineProperty(exports, "DatePicker", {
-  enumerable: true,
-  get: function () {
-    return _DatePicker.default;
-  }
-});
 Object.defineProperty(exports, "DepartmentEditor", {
   enumerable: true,
   get: function () {
@@ -226,12 +208,6 @@ Object.defineProperty(exports, "DigitalSignFormatter", {
     return _DigitalSignFormatter.default;
   }
 });
-Object.defineProperty(exports, "Drawer", {
-  enumerable: true,
-  get: function () {
-    return _Drawer.default;
-  }
-});
 Object.defineProperty(exports, "DurationEditor", {
   enumerable: true,
   get: function () {
@@ -298,12 +274,6 @@ Object.defineProperty(exports, "GeolocationFormatter", {
     return _GeolocationFormatter.default;
   }
 });
-Object.defineProperty(exports, "Icon", {
-  enumerable: true,
-  get: function () {
-    return _Icon.default;
-  }
-});
 Object.defineProperty(exports, "IconButton", {
   enumerable: true,
   get: function () {
@@ -328,12 +298,6 @@ Object.defineProperty(exports, "ImagePreviewerLightbox", {
     return _ImagePreviewerLightbox.default;
   }
 });
-Object.defineProperty(exports, "InputItem", {
-  enumerable: true,
-  get: function () {
-    return _InputItem.default;
-  }
-});
 Object.defineProperty(exports, "LastModifierFormatter", {
   enumerable: true,
   get: function () {
@@ -352,12 +316,6 @@ Object.defineProperty(exports, "LinkFormatter", {
     return _LinkFormatter.default;
   }
 });
-Object.defineProperty(exports, "List", {
-  enumerable: true,
-  get: function () {
-    return _List.default;
-  }
-});
 Object.defineProperty(exports, "Loading", {
   enumerable: true,
   get: function () {
@@ -376,12 +334,6 @@ Object.defineProperty(exports, "MTimeFormatter", {
     return _MTimeFormatter.default;
   }
 });
-Object.defineProperty(exports, "Modal", {
-  enumerable: true,
-  get: function () {
-    return _Modal.default;
-  }
-});
 Object.defineProperty(exports, "ModalPortal", {
   enumerable: true,
   get: function () {
@@ -418,30 +370,6 @@ Object.defineProperty(exports, "NumberFormatter", {
     return _NumberFormatter.default;
   }
 });
-Object.defineProperty(exports, "Picker", {
-  enumerable: true,
-  get: function () {
-    return _Picker.default;
-  }
-});
-Object.defineProperty(exports, "Popover", {
-  enumerable: true,
-  get: function () {
-    return _Popover.default;
-  }
-});
-Object.defineProperty(exports, "Progress", {
-  enumerable: true,
-  get: function () {
-    return _Progress.default;
-  }
-});
-Object.defineProperty(exports, "Radio", {
-  enumerable: true,
-  get: function () {
-    return _Radio.default;
-  }
-});
 Object.defineProperty(exports, "RateFormatter", {
   enumerable: true,
   get: function () {
@@ -502,12 +430,6 @@ Object.defineProperty(exports, "SvgIcon", {
     return _SvgIcon.default;
   }
 });
-Object.defineProperty(exports, "TabBar", {
-  enumerable: true,
-  get: function () {
-    return _TabBar.default;
-  }
-});
 Object.defineProperty(exports, "TextEditor", {
   enumerable: true,
   get: function () {
@@ -520,18 +442,6 @@ Object.defineProperty(exports, "TextFormatter", {
     return _TextFormatter.default;
   }
 });
-Object.defineProperty(exports, "TextareaItem", {
-  enumerable: true,
-  get: function () {
-    return _TextareaItem.default;
-  }
-});
-Object.defineProperty(exports, "Toast", {
-  enumerable: true,
-  get: function () {
-    return _Toast.default;
-  }
-});
 Object.defineProperty(exports, "UploadProgress", {
   enumerable: true,
   get: function () {
@@ -639,19 +549,4 @@ var _DTableRadioGroup = _interopRequireDefault(require("./DTableRadioGroup"));
 var _DTableEmptyTip = _interopRequireDefault(require("./DTableEmptyTip"));
 var _IconButton = _interopRequireDefault(require("./IconButton"));
 var _UploadProgress = _interopRequireDefault(require("./UploadProgress"));
-var _SvgIcon = _interopRequireDefault(require("./SvgIcon"));
-var _ActionSheet = _interopRequireDefault(require("./ActionSheet"));
-var _ActivityIndicator = _interopRequireDefault(require("./ActivityIndicator"));
-var _DatePicker = _interopRequireDefault(require("./DatePicker"));
-var _Drawer = _interopRequireDefault(require("./Drawer"));
-var _Icon = _interopRequireDefault(require("./Icon"));
-var _InputItem = _interopRequireDefault(require("./InputItem"));
-var _List = _interopRequireDefault(require("./List"));
-var _Modal = _interopRequireDefault(require("./Modal"));
-var _Picker = _interopRequireDefault(require("./Picker"));
-var _Popover = _interopRequireDefault(require("./Popover"));
-var _Progress = _interopRequireDefault(require("./Progress"));
-var _Radio = _interopRequireDefault(require("./Radio"));
-var _TabBar = _interopRequireDefault(require("./TabBar"));
-var _TextareaItem = _interopRequireDefault(require("./TextareaItem"));
-var _Toast = _interopRequireDefault(require("./Toast"));
+var _SvgIcon = _interopRequireDefault(require("./SvgIcon"));

package/lib/locales/zh-CN.json

@@ -92,7 +92,7 @@
   "Select_department": "选择部门",
   "Default": "默认",
   "Custom": "自定义",
-  "Recently_used": "Recently used",
+  "Recently_used": "最近使用",
   "Digital_signature": "数字签名",
   "Please_sign_on_this_panel": "请在此面板上签名",
   "Re-sign": "重新签名",

package/package.json

@@ -1,31 +1,22 @@
 {
   "name": "dtable-ui-component",
-  "version": "6.0.26",
+  "version": "6.0.28",
   "main": "./lib/index.js",
   "dependencies": {
     "@seafile/react-image-lightbox": "4.0.2",
     "@seafile/seafile-calendar": "0.0.24",
     "@seafile/seafile-editor": "~2.0.6",
+    "antd-mobile": "2.3.1",
     "classnames": "2.3.2",
     "dayjs": "1.10.7",
     "dtable-utils": "~5.0.19",
     "is-hotkey": "0.2.0",
-    "rc-checkbox": "3.5.0",
     "react-color": "2.19.3",
     "react-responsive": "10.0.0",
     "react-select": "5.10.0",
     "react-sweet-progress": "^1.1.2",
     "react-transition-group": "4.4.5",
-    "reactstrap": "9.2.3",
-    "rmc-cascader": "5.0.3",
-    "rmc-date-picker": "6.0.10",
-    "rmc-dialog": "1.1.1",
-    "rmc-drawer": "0.4.11",
-    "rmc-feedback": "2.0.0",
-    "rmc-notification": "1.0.0",
-    "rmc-picker": "5.0.10",
-    "rmc-tabs": "1.2.29",
-    "rmc-tooltip": "1.0.1"
+    "reactstrap": "9.2.3"
   },
   "scripts": {
     "lint": "./node_modules/.bin/eslint ./src/ --fix",