dtable-ui-component 6.0.109 → 6.0.110

package/lib/ImagePreviewerLightbox/index.css

@@ -4,18 +4,61 @@
 }
 
 .ril__outer .ril__toolbarItem {
-  height: 50px;
-  color: #fff;
-  display: inline-block;
-  font-size: 120%;
-  line-height: 50px;
   max-width: 100%;
-  overflow: hidden;
+  display: flex;
+  justify-content: center;
+  align-items: center;
   padding: 0;
+  color: #fff;
+  overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
 
+.ril__outer .ril__toolbarItem button {
+  background-size: 20px;
+  width: 100%;
+}
+
+.ril__builtinButton:hover,
+.ril__builtinButton:focus {
+  background-color: #666;
+  opacity: 1 !important;
+}
+
+.ril__viewOriginalButton {
+  height: 40px;
+  width: 178px!important;
+  -ms-flex-negative: 0;
+  background: #333;
+  border-radius: 8px;
+  color: #fff;
+  flex-shrink: 0;
+  font-size: 16px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: normal
+}
+
+.mobile-image-footer-choice .ril__builtinButton {
+  opacity: 1 !important;
+}
+
+.ril__builtinButton:hover,
+.ril__builtinButton:focus {
+  background-color: #666 !important;
+  opacity: 1 !important;
+}
+
+.ril__builtinButtonDisabled {
+  cursor: default;
+  opacity: 0.5 !important;
+}
+
+.ril__builtinButtonDisabled:hover {
+  opacity: 0.5 !important;
+}
+
 .ril-caption .ril__builtinButton {
   width: 24px;
 }

package/lib/ImagePreviewerLightbox/index.js

@@ -27,31 +27,44 @@ function ImagePreviewerLightbox(props) {
     onRotateImage
   } = props;
   const imageSrcList = imageItems.map(src => {
+    let name = '';
+    try {
+      name = src ? decodeURIComponent(src.slice(src.lastIndexOf('/') + 1)) : '';
+    } catch (error) {
+      // eslint-disable-next-line no-console
+      console.log(error);
+    }
     if (server && dtableUuid && (0, _url.isCustomAssetUrl)(src)) {
       const assetUuid = src.slice(src.lastIndexOf('/') + 1, src.lastIndexOf('.'));
-      return server + '/dtable/' + dtableUuid + '/custom-asset/' + assetUuid;
+      return {
+        name,
+        thumbnail: server + '/dtable/' + dtableUuid + '/custom-asset/' + assetUuid
+      };
     }
     if (server && dtableUuid && workspaceID && (0, _url.isDigitalSignsUrl)(src)) {
-      return (0, _url.generateCurrentBaseImageUrl)({
-        server,
-        workspaceID,
-        dtableUuid,
-        partUrl: src
-      });
+      return {
+        name,
+        thumbnail: (0, _url.generateCurrentBaseImageUrl)({
+          server,
+          workspaceID,
+          dtableUuid,
+          partUrl: src
+        })
+      };
     }
-    return src;
+    return {
+      name: name || '',
+      thumbnail: src
+    };
   });
   const imagesLength = imageSrcList.length;
-  const URL = imageSrcList[imageIndex];
-
-  // Handle URL has special symbol %$
-  let imageName = '';
-  try {
-    imageName = URL ? decodeURI(URL.slice(URL.lastIndexOf('/') + 1)) : '';
-  } catch (error) {
-    // eslint-disable-next-line no-console
-    console.log(error);
-  }
+  const [currentImageIndex, setCurrentImageIndex] = _react.default.useState(imageIndex || 0);
+  const imageItem = imageSrcList[currentImageIndex];
+  const URL = imageItem ? imageItem.thumbnail : '';
+  const imageName = imageItem ? imageItem.name : '';
+  _react.default.useEffect(() => {
+    setCurrentImageIndex(imageIndex);
+  }, [imageIndex]);
   const canRotateImage = onRotateImage && !readOnly && !['gif', 'heic', 'heif'].includes((0, _url.getFileSuffix)(URL)) && (0, _url.isInternalImg)(URL, server);
   let mainSrc = URL;
   if ((0, _url.needUseThumbnailImage)(URL)) {
@@ -66,18 +79,21 @@ function ImagePreviewerLightbox(props) {
     className: "d-flex",
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
       className: "text-truncate",
-      children: imageName
+      children: imageName || ''
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
       className: "flex-shrink-0 pl-1",
-      children: ["(", imageIndex + 1, "/", imagesLength, ")"]
+      children: ["(", currentImageIndex + 1, "/", imagesLength, ")"]
     })]
   });
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactImageLightbox.default, {
+    imageItems: imageSrcList,
+    currentIndex: currentImageIndex,
+    setImageIndex: index => setCurrentImageIndex(index),
     wrapperClassName: (0, _classnames.default)('dtable-ui-component', className),
     imageTitle: imageTitleDOM,
     mainSrc: mainSrc,
-    nextSrc: imageSrcList[(imageIndex + 1) % imagesLength],
-    prevSrc: imageSrcList[(imageIndex + imagesLength - 1) % imagesLength],
+    nextSrc: imageSrcList[(currentImageIndex + 1) % imagesLength] ? imageSrcList[(currentImageIndex + 1) % imagesLength].thumbnail : '',
+    prevSrc: imageSrcList[(currentImageIndex + imagesLength - 1) % imagesLength] ? imageSrcList[(currentImageIndex + imagesLength - 1) % imagesLength].thumbnail : '',
     imagePadding: 70,
     viewOriginalImageLabel: (0, _lang.getLocale)('View_original_image'),
     enableRotate: canRotateImage,
@@ -88,14 +104,19 @@ function ImagePreviewerLightbox(props) {
     onClickMoveDown: props.moveToNextRowImage,
     onViewOriginal: props.onViewOriginal,
     onRotateImage: canRotateImage ? deg => {
-      onRotateImage(imageIndex, deg);
+      onRotateImage(currentImageIndex, deg);
     } : null,
     onClickDelete: !readOnly && deleteImage ? () => {
-      deleteImage(imageIndex, 'previewer');
+      deleteImage(currentImageIndex, 'previewer');
     } : null,
     onClickDownload: downloadImage ? () => {
       downloadImage(URL);
-    } : null
+    } : null,
+    zoomInTip: (0, _lang.getLocale)('Zoom_in'),
+    zoomOutTip: (0, _lang.getLocale)('Zoom_out'),
+    rotateTip: (0, _lang.getLocale)('Rotate_image'),
+    deleteTip: (0, _lang.getLocale)('Delete_image'),
+    downloadImageTip: (0, _lang.getLocale)('Download_image')
   });
 }
 var _default = exports.default = ImagePreviewerLightbox;

package/lib/locales/de.json

@@ -9,6 +9,11 @@
   "Search_collaborator": "Mitarbeiter suchen",
   "No_collaborators_available": "Es sind keine Mitarbeiter verfügbar.",
   "Done": "Erledigt",
+  "Rotate_image": "Rotate image",
+  "Delete_image": "delete image",
+  "Download_image": "Download image",
+  "Zoom_in": "Zoom in",
+  "Zoom_out": "Zoom out",
   "Choose_a_collaborator": "Wählen Sie einen Mitarbeiter",
   "Please_select": "Auswählen",
   "Clear": "Leeren",

package/lib/locales/en.json

@@ -9,6 +9,11 @@
   "Search_collaborator": "Search collaborator",
   "No_collaborators_available": "No collaborators available.",
   "Done": "Done",
+  "Rotate_image": "Rotate image",
+  "Delete_image": "delete image",
+  "Download_image": "Download image",
+  "Zoom_in": "Zoom in",
+  "Zoom_out": "Zoom out",
   "Choose_a_collaborator": "Choose a collaborator",
   "Please_select": "Please select",
   "Clear": "Clear",

package/lib/locales/es.json

@@ -9,6 +9,11 @@
   "Search_collaborator": "Search collaborator",
   "No_collaborators_available": "No hay colaboradores disponibles.",
   "Done": "Hecho",
+  "Rotate_image": "Rotate image",
+  "Delete_image": "delete image",
+  "Download_image": "Download image",
+  "Zoom_in": "Zoom in",
+  "Zoom_out": "Zoom out",
   "Choose_a_collaborator": "Choose a collaborator",
   "Please_select": "Seleccione",
   "Clear": "Limpiar",

package/lib/locales/fr.json

@@ -9,6 +9,11 @@
   "Search_collaborator": "Rechercher des collaborateurs",
   "No_collaborators_available": "Aucun collaborateur n'est disponible.",
   "Done": "Fait",
+  "Rotate_image": "Rotate image",
+  "Delete_image": "delete image",
+  "Download_image": "Download image",
+  "Zoom_in": "Zoom in",
+  "Zoom_out": "Zoom out",
   "Choose_a_collaborator": "Choisissez un collaborateur",
   "Please_select": "Sélectionner",
   "Clear": "Effacer",

package/lib/locales/pt.json

@@ -9,6 +9,11 @@
   "Search_collaborator": "Encontre um colaborador",
   "No_collaborators_available": "Nenhum colaborador disponível.",
   "Done": "Feita",
+  "Rotate_image": "Rotate image",
+  "Delete_image": "delete image",
+  "Download_image": "Download image",
+  "Zoom_in": "Zoom in",
+  "Zoom_out": "Zoom out",
   "Choose_a_collaborator": "Choose a collaborator",
   "Please_select": "Por favor, selecione",
   "Clear": "Clara",

package/lib/locales/ru.json

@@ -9,6 +9,11 @@
   "Search_collaborator": "Поиск сотрудника",
   "No_collaborators_available": "Нет сотрудников.",
   "Done": "Выполнено",
+  "Rotate_image": "Rotate image",
+  "Delete_image": "delete image",
+  "Download_image": "Download image",
+  "Zoom_in": "Zoom in",
+  "Zoom_out": "Zoom out",
   "Choose_a_collaborator": "Choose a collaborator",
   "Please_select": "Please select",
   "Clear": "Очистить",

package/lib/locales/zh-CN.json

@@ -9,6 +9,11 @@
   "Search_collaborator": "搜索协作人",
   "No_collaborators_available": "没有找到协作人",
   "Done": "完成",
+  "Rotate_image": "旋转",
+  "Delete_image": "删除",
+  "Download_image": "下载",
+  "Zoom_in": "放大",
+  "Zoom_out": "缩小",
   "Choose_a_collaborator": "选择一个协作人",
   "Please_select": "请选择",
   "Clear": "清除",

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "dtable-ui-component",
-  "version": "6.0.109",
+  "version": "6.0.110",
   "main": "./lib/index.js",
   "dependencies": {
-    "@seafile/react-image-lightbox": "4.0.2",
+    "@seafile/react-image-lightbox": "^5.0.4",
     "@seafile/seafile-calendar": "^1.0.8",
-    "@seafile/seafile-editor": "~2.0.14",
+    "@seafile/seafile-editor": "^3.0.26",
     "classnames": "~2.5.*",
     "dayjs": "1.10.7",
     "dtable-utils": "~5.0.27",
@@ -82,7 +82,7 @@
     "@types/jest": "^29.5.10",
     "autoprefixer": "10.4.5",
     "babel-eslint": "10.0.1",
-    "babel-jest": "^27.4.2",
+    "babel-jest": "^30.3.0",
     "babel-loader": "^8.2.3",
     "babel-plugin-import": "^1.13.6",
     "babel-plugin-named-asset-import": "^0.3.6",
@@ -92,7 +92,7 @@
     "case-sensitive-paths-webpack-plugin": "^2.4.0",
     "circular-dependency-plugin": "^5.2.2",
     "css-loader": "^6.5.1",
-    "css-minimizer-webpack-plugin": "^3.2.0",
+    "css-minimizer-webpack-plugin": "^8.0.0",
     "dotenv": "^10.0.0",
     "dotenv-expand": "^5.1.0",
     "eslint": "^8.3.0",
@@ -103,19 +103,21 @@
     "fs-extra": "^10.0.0",
     "html-webpack-plugin": "^5.5.0",
     "identity-obj-proxy": "3.0.0",
-    "jest": "^27.4.3",
-    "jest-resolve": "^27.4.2",
-    "jest-watch-typeahead": "^1.0.0",
+    "jest": "^30.3.0",
+    "jest-cli": "^30.3.0",
+    "jest-environment-jsdom": "^30.3.0",
+    "jest-resolve": "^30.3.0",
+    "jest-watch-typeahead": "^3.0.1",
     "less": "^4.2.0",
     "less-loader": "^11.1.3",
     "mini-css-extract-plugin": "^2.4.5",
-    "node-polyfill-webpack-plugin": "2.0.1",
     "path-browserify": "^1.0.1",
     "postcss": "^8.5.3",
     "postcss-flexbugs-fixes": "^5.0.2",
     "postcss-loader": "^6.2.1",
     "postcss-normalize": "^10.0.1",
     "postcss-preset-env": "^7.0.1",
+    "process": "^0.11.10",
     "prompts": "^2.4.2",
     "prop-types": "15.8.1",
     "react": "18.3.1",
@@ -133,11 +135,8 @@
     "style-loader": "^3.3.1",
     "terser-webpack-plugin": "^5.2.5",
     "url-loader": "^4.1.1",
-    "web-vitals": "2.1.4",
-    "webpack": "^5.105.0",
-    "webpack-dev-server": "^5.2.2",
-    "webpack-manifest-plugin": "^4.0.2",
-    "workbox-webpack-plugin": "^6.4.1",
+    "webpack": "^5.105.4",
+    "webpack-dev-server": "^5.2.3",
     "worker-loader": "3.0.8"
   }
 }