dtable-ui-component 6.0.107 → 6.0.108

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

@@ -42,7 +42,11 @@ function ImagePreviewerLightbox(props) {
     return src;
   });
   const imagesLength = imageSrcList.length;
-  const URL = imageSrcList[imageIndex];
+  const [currentImageIndex, setCurrentImageIndex] = _react.default.useState(imageIndex || 0);
+  const URL = imageSrcList[currentImageIndex];
+  _react.default.useEffect(() => {
+    setCurrentImageIndex(imageIndex);
+  }, [imageIndex]);
 
   // Handle URL has special symbol %$
   let imageName = '';
@@ -69,15 +73,18 @@ function ImagePreviewerLightbox(props) {
       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],
+    prevSrc: imageSrcList[(currentImageIndex + imagesLength - 1) % imagesLength],
     imagePadding: 70,
     viewOriginalImageLabel: (0, _lang.getLocale)('View_original_image'),
     enableRotate: canRotateImage,
@@ -88,14 +95,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

@@ -23,6 +23,11 @@
   "Specific_departments": "Bestimmte Bereiche",
   "Deleted_department": "Gelöschter Bereich",
   "View_original_image": "View original image",
+  "Rotate_image": "Rotate image",
+  "Delete_image": "delete image",
+  "Download_image": "Download image",
+  "Zoom_in": "Zoom in",
+  "Zoom_out": "Zoom out",
   "Add_filter": "Filter hinzufügen",
   "And": "Und",
   "Or": "Oder",

package/lib/locales/en.json

@@ -23,6 +23,12 @@
   "Specific_departments": "Specific departments",
   "Deleted_department": "Deleted department",
   "View_original_image": "View original image",
+  
+  "Rotate_image": "Rotate image",
+  "Delete_image": "delete image",
+  "Download_image": "Download image",
+  "Zoom_in": "Zoom in",
+  "Zoom_out": "Zoom out",
   "Add_filter": "Add filter",
   "And": "And",
   "Or": "Or",

package/lib/locales/es.json

@@ -23,6 +23,11 @@
   "Specific_departments": "Specific departments",
   "Deleted_department": "Deleted department",
   "View_original_image": "View original image",
+  "Rotate_image": "Rotate image",
+  "Delete_image": "delete image",
+  "Download_image": "Download image",
+  "Zoom_in": "Zoom in",
+  "Zoom_out": "Zoom out",
   "Add_filter": "Añadir filtro",
   "And": "Y",
   "Or": "O",

package/lib/locales/fr.json

@@ -23,6 +23,11 @@
   "Specific_departments": "Départements spécifiques",
   "Deleted_department": "Département supprimé",
   "View_original_image": "View original image",
+  "Rotate_image": "Rotate image",
+  "Delete_image": "delete image",
+  "Download_image": "Download image",
+  "Zoom_in": "Zoom in",
+  "Zoom_out": "Zoom out",
   "Add_filter": "Ajouter un filtre",
   "And": "Et",
   "Or": "Ou",

package/lib/locales/pt.json

@@ -23,6 +23,11 @@
   "Specific_departments": "Specific departments",
   "Deleted_department": "Deleted department",
   "View_original_image": "View original image",
+  "Rotate_image": "Rotate image",
+  "Delete_image": "delete image",
+  "Download_image": "Download image",
+  "Zoom_in": "Zoom in",
+  "Zoom_out": "Zoom out",
   "Add_filter": "Adicione o filtro",
   "And": "E",
   "Or": "Ou",

package/lib/locales/ru.json

@@ -23,6 +23,11 @@
   "Specific_departments": "Указанные отделы",
   "Deleted_department": "Удаленный отдел",
   "View_original_image": "View original image",
+  "Rotate_image": "Rotate image",
+  "Delete_image": "delete image",
+  "Download_image": "Download image",
+  "Zoom_in": "Zoom in",
+  "Zoom_out": "Zoom out",
   "Add_filter": "Добавить фильтр",
   "And": "И",
   "Or": "Или",

package/lib/locales/zh-CN.json

@@ -23,6 +23,11 @@
   "Specific_departments": "具体部门",
   "Deleted_department": "已删除部门",
   "View_original_image": "View original image",
+  "Rotate_image": "旋转",
+  "Delete_image": "删除",
+  "Download_image": "下载",
+  "Zoom_in": "放大",
+  "Zoom_out": "缩小",
   "Add_filter": "增加过滤条件",
   "And": "并且",
   "Or": "或者",

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "dtable-ui-component",
-  "version": "6.0.107",
+  "version": "6.0.108",
   "main": "./lib/index.js",
   "dependencies": {
-    "@seafile/react-image-lightbox": "4.0.2",
+    "@seafile/react-image-lightbox": "^5.0.4",
     "@seafile/seafile-calendar": "~0.0.32",
     "@seafile/seafile-editor": "~2.0.14",
     "classnames": "~2.5.*",