dtable-ui-component 5.3.9 → 5.3.10-beta

package/lib/DTableColorPicker/index.css

@@ -5,7 +5,7 @@
   border-radius: 3px;
   z-index: 100;
   padding: 0.75rem;
-  line-height: normal;
+  line-height: 16px;
   position: absolute;
   box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 2px, rgba(0, 0, 0, 0.3) 0px 4px 4px;
 }

package/lib/RowExpandEditor/RowExpandCollaboratorEditor/index.js

@@ -48,7 +48,7 @@ class RowExpandCollaboratorEditor extends _react.default.Component {
       }
     };
     this.hideSelect = event => {
-      if (!this.state.showCollaboratorSelect || !event.target || event.target.tagName.toUpperCase() === 'INPUT') {
+      if (!this.state.showCollaboratorSelect || !event.target) {
         return;
       }
       const editor = document.querySelector('.dtable-ui-collaborator-editor-container');

package/lib/RowExpandEditor/RowExpandDepartmentEditor/index.js

@@ -11,9 +11,7 @@ var _classnames = _interopRequireDefault(require("classnames"));
 var _hooks = require("../../hooks");
 var _DepartmentSingleSelectFormatter = _interopRequireDefault(require("../../DepartmentSingleSelectFormatter"));
 var _constants = require("../../constants");
-var _lang = require("../../lang");
 var _departmentSingleSelect = _interopRequireDefault(require("../../Department-editor/department-single-select"));
-var _constants2 = require("../../Department-editor/constants");
 function RowExpandDepartmentEditor(props) {
   const {
     row,
@@ -45,7 +43,7 @@ function RowExpandDepartmentEditor(props) {
     // eslint-disable-next-line
   }, [row]);
   function hideDropDownMenu(event) {
-    if (!event.target || event.target.tagName.toUpperCase() === 'INPUT') return;
+    if (!event.target) return;
     toggleDepartmentSelect(false);
   }
   function onKeyDown(e) {

package/lib/RowExpandEditor/RowExpandGeolocationEditor/index.js

@@ -23,7 +23,7 @@ class RowExpandGeolocationEditor extends _react.default.Component {
       }
     };
     this.hideEditor = event => {
-      if (!this.state.isShowEditor || !event.target || event.target.tagName.toUpperCase() === 'INPUT' || this.editorContainer.contains(event.target)) return;
+      if (!this.state.isShowEditor || !event.target || this.editorContainer.contains(event.target)) return;
       if (this.state.isShowEditor && this.geoEditor.getLargeEditorState()) return;
       this.setState({
         isShowEditor: false

package/lib/RowExpandEditor/RowExpandMultipleSelectEditor/index.js

@@ -39,7 +39,7 @@ class RowExpandMultipleSelectEditor extends _react.default.Component {
       });
     };
     this.hideDropDownMenu = event => {
-      if (!event.target || event.target.tagName.toUpperCase() === 'INPUT') return;
+      if (!event.target) return;
       if (!this.ref.contains(event.target) && this.state.showSelectPopover) {
         const singleSelectEditor = document.getElementsByClassName('dtable-ui-select-editor-container')[0];
         if (singleSelectEditor && singleSelectEditor.contains(event.target)) return;

package/lib/RowExpandEditor/RowExpandSingleSelectorEditor/index.js

@@ -62,7 +62,7 @@ class RowExpandSingleSelectEditor extends _react.default.Component {
       this.toggleSingleSelect(false);
     };
     this.hideDropDownMenu = event => {
-      if (!event.target || event.target.tagName.toUpperCase() === 'INPUT') return;
+      if (!event.target) return;
       if (!this.singleSelectContainer.contains(event.target) && this.state.showSelectPopover) {
         const singleSelectEditor = document.getElementsByClassName('dtable-ui-select-editor-container')[0];
         if (singleSelectEditor && singleSelectEditor.contains(event.target)) return;

package/lib/toaster/toast.js

@@ -12,19 +12,22 @@ const ANIMATION_DURATION = 240;
 class Toast extends _react.default.PureComponent {
   constructor() {
     super(...arguments);
+    this._isMounted = false;
     this.state = {
-      isShown: true,
-      height: 0
+      isShown: true
     };
+    this.containerRef = /*#__PURE__*/_react.default.createRef();
     this.close = event => {
       if (event) {
         event.nativeEvent.stopImmediatePropagation();
         event.stopPropagation();
       }
       this.clearCloseTimer();
-      this.setState({
-        isShown: false
-      });
+      if (this._isMounted) {
+        this.setState({
+          isShown: false
+        });
+      }
     };
     this.startCloseTimer = () => {
       if (this.props.duration) {
@@ -47,12 +50,12 @@ class Toast extends _react.default.PureComponent {
     };
     this.onRef = ref => {
       if (ref === null) return;
-      const {
-        height
-      } = ref.getBoundingClientRect();
-      this.setState({
-        height
-      });
+      setTimeout(() => {
+        const {
+          height
+        } = ref.getBoundingClientRect();
+        this.containerRef.current.style.height = height + 'px';
+      }, 1);
     };
   }
   componentDidUpdate(prevProps) {
@@ -64,9 +67,11 @@ class Toast extends _react.default.PureComponent {
     }
   }
   componentDidMount() {
+    this._isMounted = true;
     this.startCloseTimer();
   }
   componentWillUnmount() {
+    this._isMounted = false;
     this.clearCloseTimer();
   }
   render() {
@@ -82,10 +87,9 @@ class Toast extends _react.default.PureComponent {
       onMouseEnter: this.handleMouseEnter,
       onMouseLeave: this.handleMouseLeave,
       style: {
-        height: this.state.height,
-        zIndex: this.props.zIndex,
-        marginBottom: this.state.isShown ? 0 : -this.state.height
-      }
+        zIndex: this.props.zIndex
+      },
+      ref: this.containerRef
     }, /*#__PURE__*/_react.default.createElement("div", {
       ref: this.onRef,
       style: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dtable-ui-component",
-  "version": "5.3.9",
+  "version": "5.3.10beta",
   "main": "./lib/index.js",
   "dependencies": {
     "@seafile/react-image-lightbox": "3.0.1",