dtable-ui-component 6.0.98 → 6.0.100

package/lib/ClickOutside/index.js

@@ -59,15 +59,18 @@ class ClickOutside extends _react.default.Component {
   constructor() {
     super(...arguments);
     this.isClickedInside = false;
+    this.setClickedInsideStatus = status => {
+      this.isClickedInside = status || false;
+    };
     this.handleDocumentClick = e => {
       if (this.isClickedInside) {
-        this.isClickedInside = false;
+        this.setClickedInsideStatus(false);
         return;
       }
       this.props.onClickOutside(e);
     };
     this.handleMouseDown = () => {
-      this.isClickedInside = true;
+      this.setClickedInsideStatus(true);
     };
   }
   componentDidMount() {

package/lib/FileUploader/index.js

@@ -143,29 +143,35 @@ class FileUploader extends _react.default.Component {
           });
         }
         try {
-          let fileReader = new FileReader();
-          fileReader.readAsDataURL(file);
-          fileReader.addEventListener('load', function (event) {
-            let isImage = /image/i.test(file.type);
-            if (uploadType === 'file' || isImage) {
-              let uploadFileItem = {
-                name: file.name,
-                fileIconUrl: isImage ? event.target.result : (0, _url.getFileIconUrl)(file.name, file.type),
-                isUploading: true,
-                isErrorTip: false,
-                file: file,
-                size: file.size,
-                url: '',
-                type: uploadType === 'file' ? 'file' : '',
-                percent: 0
-              };
+          let isImage = /image/i.test(uploadFile.type);
+          let uploadFileItem = {
+            name: uploadFile.name,
+            fileIconUrl: (0, _url.getFileIconUrl)(uploadFile.name),
+            isUploading: true,
+            isErrorTip: false,
+            uploadFile: uploadFile,
+            size: uploadFile.size,
+            url: '',
+            type: uploadType === 'file' ? 'file' : '',
+            percent: 0
+          };
+
+          // Provide preview when the image size is less than 100MB
+          if (isImage && uploadFile.size < 100 * 1024 * 1024) {
+            let fileReader = new FileReader();
+            fileReader.readAsDataURL(uploadFile);
+            fileReader.onload = function (event) {
+              uploadFileItem.fileIconUrl = event.target.result;
               uploadFileList.push(uploadFileItem);
-            }
-            checkLoadFinish();
-          }, false);
-          fileReader.addEventListener('error', function (e) {
+              checkLoadFinish();
+            };
+            fileReader.onerror = function () {
+              checkLoadFinish();
+            };
+          } else {
+            uploadFileList.push(uploadFileItem);
             checkLoadFinish();
-          }, false);
+          }
         } catch (event) {
           checkLoadFinish();
         }

package/lib/SelectOptionGroup/index.js

@@ -26,12 +26,16 @@ class SelectOptionGroup extends _react.Component {
       } = this.props;
       const {
         top,
-        height
+        height,
+        width
       } = this.optionGroupRef.getBoundingClientRect();
       if (isInModal) {
         if (position.y + position.height + height > window.innerHeight) {
           this.optionGroupRef.style.top = position.y - height + 'px';
         }
+        if (position && position.x + width > window.innerWidth) {
+          this.optionGroupRef.style.left = window.innerWidth - width - 10 + 'px';
+        }
         this.optionGroupRef.style.opacity = 1;
         this.searchInputRef.current && this.searchInputRef.current.inputRef.focus();
       } else {
@@ -85,6 +89,10 @@ class SelectOptionGroup extends _react.Component {
       if (isInModal) {
         e.stopPropagation();
         e.nativeEvent.stopImmediatePropagation();
+
+        // ClickOutside set isClickedInside to true via mouse down capture first
+        // Set isClickedInside to false after mouse down
+        this.clickOutsideRef && this.clickOutsideRef.setClickedInsideStatus(false);
       }
     };
     this.scrollContent = () => {
@@ -213,6 +221,7 @@ class SelectOptionGroup extends _react.Component {
       };
     }
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ClickOutside.default, {
+      ref: ref => this.clickOutsideRef = ref,
       onClickOutside: this.props.onClickOutside,
       children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         className: (0, _classnames.default)('option-group', className ? 'option-group-' + className : '', {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dtable-ui-component",
-  "version": "6.0.98",
+  "version": "6.0.100",
   "main": "./lib/index.js",
   "dependencies": {
     "@seafile/react-image-lightbox": "4.0.2",