@seafile/sdoc-editor 1.0.175 → 1.0.176-beta

package/dist/basic-sdk/extension/toolbar/insert-element-toolbar/index.js

@@ -25,8 +25,8 @@ var _helper = require("../../plugins/callout/helper");
 var _keyCodes = _interopRequireDefault(require("../../../../constants/key-codes"));
 var _const = require("./const");
 var _core = require("../../core");
-var _helpers5 = require("../../plugins/blockquote/helpers");
 var _helper2 = require("../../plugins/multi-column/helper");
+var _utils = require("../../utils");
 require("./style.css");
 const QuickInsertBlockMenu = _ref => {
   let {
@@ -34,12 +34,15 @@ const QuickInsertBlockMenu = _ref => {
     slateNode,
     callback,
     isEmptyNode,
+    handleClosePopover,
     t
   } = _ref;
   const editor = (0, _slateReact.useSlateStatic)();
+  const tableSizeRef = (0, _react.useRef)(null);
+  const inputWrapperRef = (0, _react.useRef)(null);
   const downDownWrapperRef = (0, _react.useRef)(null);
-  const [currentSelectIndex, setCurrentSelectIndex] = (0, _react.useState)(0);
-  const [quickInsertMenuSearchMap, setQuickInsertMenuSearchMap] = (0, _react.useState)(_constants.SIDE_INSERT_MENUS_SEARCH_MAP);
+  const [currentSelectIndex, setCurrentSelectIndex] = (0, _react.useState)(-1); // -1 is input focus position
+  const [quickInsertMenuSearchMap, setQuickInsertMenuSearchMap] = (0, _react.useState)(_constants.SIDE_QUICK_INSERT_MENUS_SEARCH_MAP);
   const onInsertImageToggle = (0, _react.useCallback)(() => {
     callback && callback();
     const eventBus = _eventBus.default.getInstance();
@@ -135,10 +138,6 @@ const QuickInsertBlockMenu = _ref => {
     });
     return !!callout;
   }, [editor]);
-  const onInsertBlockQuote = (0, _react.useCallback)(() => {
-    callback && callback();
-    (0, _helpers5.insertBlockQuote)(editor, false);
-  }, [callback, editor]);
   const createMultiColumn = (0, _react.useCallback)(type => {
     callback && callback();
     const newInsertPosition = slateNode.type === _constants.ELEMENT_TYPE.LIST_ITEM ? _constants.INSERT_POSITION.AFTER : insertPosition;
@@ -146,49 +145,6 @@ const QuickInsertBlockMenu = _ref => {
   }, [callback, editor, insertPosition, slateNode]);
   const dropDownItems = (0, _react.useMemo)(() => {
     let items = {
-      [_constants.PARAGRAPH]: /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
-        isHidden: !quickInsertMenuSearchMap[_constants.PARAGRAPH],
-        disabled: isEmptyNode,
-        key: "sdoc-insert-menu-paragraph",
-        menuConfig: {
-          ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.PARAGRAPH]
-        },
-        onClick: () => onInsert(_constants.ELEMENT_TYPE.PARAGRAPH)
-      }),
-      [_constants.ELEMENT_TYPE.HEADER]: _constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.HEADER].map(item => /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
-        isHidden: !quickInsertMenuSearchMap[item.type],
-        key: item.id,
-        menuConfig: item,
-        onClick: () => onInsert(item.type)
-      })),
-      [_constants.UNORDERED_LIST]: /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
-        isHidden: !quickInsertMenuSearchMap[_constants.UNORDERED_LIST],
-        key: "sdoc-insert-menu-unorder-list",
-        menuConfig: {
-          ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.UNORDERED_LIST]
-        },
-        onClick: () => {
-          onInsertList(_constants.ELEMENT_TYPE.UNORDERED_LIST);
-        }
-      }),
-      [_constants.ORDERED_LIST]: /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
-        isHidden: !quickInsertMenuSearchMap[_constants.ORDERED_LIST],
-        key: "sdoc-insert-menu-order-list",
-        menuConfig: {
-          ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.ORDERED_LIST]
-        },
-        onClick: () => {
-          onInsertList(_constants.ELEMENT_TYPE.ORDERED_LIST);
-        }
-      }),
-      [_constants.CHECK_LIST_ITEM]: /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
-        isHidden: !quickInsertMenuSearchMap[_constants.CHECK_LIST_ITEM],
-        key: "sdoc-insert-menu-check-list",
-        menuConfig: {
-          ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.CHECK_LIST_ITEM]
-        },
-        onClick: onInsertCheckList
-      }),
       [_constants.IMAGE]: /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
         isHidden: !quickInsertMenuSearchMap[_constants.IMAGE],
         disabled: isDisableImage,
@@ -220,12 +176,15 @@ const QuickInsertBlockMenu = _ref => {
       }, /*#__PURE__*/_react.default.createElement("i", {
         className: "sdocfont sdoc-right-slide sdoc-dropdown-item-right-icon"
       }), /*#__PURE__*/_react.default.createElement(_tableSizePopover.default, {
+        tableSizeRef: tableSizeRef,
         editor: editor,
         target: "sdoc-side-menu-item-table",
         trigger: "hover",
         placement: "left-start",
         popperClassName: "sdoc-side-menu-table-size sdoc-insert-element-table-size-wrapper",
-        createTable: createTable
+        createTable: createTable,
+        callback: callback,
+        handleClosePopover: handleClosePopover
       })),
       [_constants.LINK]: /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
         isHidden: !quickInsertMenuSearchMap[_constants.LINK],
@@ -235,14 +194,6 @@ const QuickInsertBlockMenu = _ref => {
         },
         onClick: openLinkDialog
       }),
-      [_constants.BLOCKQUOTE]: /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
-        isHidden: !quickInsertMenuSearchMap[_constants.BLOCKQUOTE],
-        key: "sdoc-insert-menu-blockquote",
-        menuConfig: {
-          ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.BLOCKQUOTE]
-        },
-        onClick: onInsertBlockQuote
-      }),
       [_constants.CODE_BLOCK]: /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
         isHidden: !quickInsertMenuSearchMap[_constants.CODE_BLOCK],
         key: "sdoc-insert-menu-code-block",
@@ -259,8 +210,53 @@ const QuickInsertBlockMenu = _ref => {
           ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.CALL_OUT]
         },
         onClick: () => onInsertCallout(_constants.PARAGRAPH)
+      }),
+      [_constants.UNORDERED_LIST]: /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
+        isHidden: !quickInsertMenuSearchMap[_constants.UNORDERED_LIST],
+        key: "sdoc-insert-menu-unorder-list",
+        menuConfig: {
+          ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.UNORDERED_LIST]
+        },
+        onClick: () => {
+          onInsertList(_constants.ELEMENT_TYPE.UNORDERED_LIST);
+        }
+      }),
+      [_constants.ORDERED_LIST]: /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
+        isHidden: !quickInsertMenuSearchMap[_constants.ORDERED_LIST],
+        key: "sdoc-insert-menu-order-list",
+        menuConfig: {
+          ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.ORDERED_LIST]
+        },
+        onClick: () => {
+          onInsertList(_constants.ELEMENT_TYPE.ORDERED_LIST);
+        }
+      }),
+      [_constants.CHECK_LIST_ITEM]: /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
+        isHidden: !quickInsertMenuSearchMap[_constants.CHECK_LIST_ITEM],
+        key: "sdoc-insert-menu-check-list",
+        menuConfig: {
+          ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.CHECK_LIST_ITEM]
+        },
+        onClick: onInsertCheckList
+      }),
+      [_constants.PARAGRAPH]: /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
+        isHidden: !quickInsertMenuSearchMap[_constants.PARAGRAPH],
+        disabled: isEmptyNode,
+        key: "sdoc-insert-menu-paragraph",
+        menuConfig: {
+          ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.PARAGRAPH]
+        },
+        onClick: () => onInsert(_constants.ELEMENT_TYPE.PARAGRAPH)
       })
     };
+    _constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.HEADER].forEach(item => {
+      items[item.id.toLowerCase()] = /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
+        isHidden: !quickInsertMenuSearchMap[item.type],
+        key: item.id,
+        menuConfig: item,
+        onClick: () => onInsert(item.type)
+      });
+    });
     _constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.MULTI_COLUMN].forEach(item => {
       items[item.id.toLowerCase()] = /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
         isHidden: !quickInsertMenuSearchMap[item.type],
@@ -274,19 +270,33 @@ const QuickInsertBlockMenu = _ref => {
       delete items[_constants.VIDEO];
     }
     return items;
-  }, [isDisableImage, onInsertImageToggle, isDisableVideo, onInsertVideoToggle, editor, createTable, openLinkDialog, onInsertBlockQuote, onInsertCodeBlock, isDisableCallout, onInsertCheckList, isEmptyNode, onInsertCallout, onInsertList, onInsert, createMultiColumn, quickInsertMenuSearchMap]);
+  }, [quickInsertMenuSearchMap, isDisableImage, onInsertImageToggle, isDisableVideo, onInsertVideoToggle, editor, createTable, callback, handleClosePopover, openLinkDialog, onInsertCodeBlock, isDisableCallout, onInsertCheckList, isEmptyNode, onInsertCallout, onInsertList, onInsert, createMultiColumn]);
   const getSelectItemDom = selectIndex => {
     const dropDownItemWrapper = downDownWrapperRef.current;
-    const currentSelectItem = dropDownItemWrapper.children[selectIndex];
+    const searchedDropDownItemWrapper = [];
+    Array.from(dropDownItemWrapper.children).forEach(item => {
+      if (!Array.from(item.classList).includes('sdoc-dropdown-menu-item-hidden')) {
+        searchedDropDownItemWrapper.push(item);
+      }
+    });
+    const currentSelectItem = searchedDropDownItemWrapper[selectIndex];
     return currentSelectItem;
   };
   const handleKeyDown = (0, _react.useCallback)(e => {
+    if (document.getElementsByClassName('sdoc-selected-table-size-popover')[0]) {
+      tableSizeRef.current.handleTableSizeKeyDown(e);
+      return;
+    }
     const {
       UpArrow,
       DownArrow,
-      Enter
+      Enter,
+      Esc
     } = _keyCodes.default;
-    const renderItems = Reflect.ownKeys(dropDownItems);
+    const renderItems = [];
+    Reflect.ownKeys(dropDownItems).forEach(key => {
+      if (quickInsertMenuSearchMap[key]) renderItems.push(key);
+    });
     const {
       keyCode
     } = e;
@@ -294,52 +304,71 @@ const QuickInsertBlockMenu = _ref => {
       e.preventDefault();
       const currentSelectItem = getSelectItemDom(currentSelectIndex);
       if (currentSelectItem) currentSelectItem.classList.remove(_const.SELECTED_ITEM_CLASS_NAME);
-      if (currentSelectIndex > 0) {
+      if (currentSelectIndex > -1) {
         setCurrentSelectIndex(currentSelectIndex - 1);
-      } else {
-        setCurrentSelectIndex(renderItems.length - 1);
       }
     }
     if (keyCode === DownArrow) {
       e.preventDefault();
+      if (currentSelectIndex === renderItems.length - 1) return;
       const currentSelectItem = getSelectItemDom(currentSelectIndex);
       if (currentSelectItem) currentSelectItem.classList.remove(_const.SELECTED_ITEM_CLASS_NAME);
       if (currentSelectIndex < renderItems.length - 1) {
         setCurrentSelectIndex(currentSelectIndex + 1);
-      } else {
-        setCurrentSelectIndex(0);
       }
     }
     if (keyCode === Enter) {
       e.preventDefault();
       const item = renderItems[currentSelectIndex];
+      if (item === _constants.TABLE) {
+        tableSizeRef.current.uncontrolledPopoverRef.current.toggle();
+        return;
+      }
       const {
         disabled,
         onClick
       } = dropDownItems[item].props;
       !disabled && onClick();
     }
-  }, [currentSelectIndex, dropDownItems]);
+    if (keyCode === Esc) {
+      e.preventDefault();
+      handleClosePopover();
+    }
+  }, [currentSelectIndex, dropDownItems, handleClosePopover, quickInsertMenuSearchMap]);
   (0, _react.useEffect)(() => {
     document.addEventListener('keydown', handleKeyDown);
     return () => {
       document.removeEventListener('keydown', handleKeyDown);
     };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [handleKeyDown]);
   const clearSelectStyle = (0, _react.useCallback)(() => {
     const domList = Array.from(downDownWrapperRef.current.children);
     domList.forEach(dom => dom.classList.remove(_const.SELECTED_ITEM_CLASS_NAME));
   }, []);
+  const onHandleInputFocus = (0, _react.useCallback)(isFocus => {
+    if (inputWrapperRef.current) {
+      queueMicrotask(() => {
+        isFocus ? inputWrapperRef.current.focus() : inputWrapperRef.current.blur();
+      });
+    }
+  }, []);
   (0, _react.useEffect)(() => {
-    clearSelectStyle();
-    const currentSelectItem = getSelectItemDom(currentSelectIndex);
-    if (currentSelectItem) {
-      currentSelectItem.classList.add(_const.SELECTED_ITEM_CLASS_NAME);
+    if (currentSelectIndex === -1) {
+      onHandleInputFocus(true);
+    } else {
+      onHandleInputFocus(false);
+      clearSelectStyle();
+      const currentSelectItem = getSelectItemDom(currentSelectIndex);
+      if (currentSelectItem) {
+        (0, _utils.onHandleOverflowScroll)(currentSelectItem, downDownWrapperRef);
+        currentSelectItem.classList.add(_const.SELECTED_ITEM_CLASS_NAME);
+      }
     }
-  }, [clearSelectStyle, currentSelectIndex, dropDownItems]);
+  }, [clearSelectStyle, currentSelectIndex, downDownWrapperRef, onHandleInputFocus]);
   const onChange = (0, _react.useCallback)(e => {
     if (!downDownWrapperRef.current.isInputtingChinese) {
-      const newMenuSearchMap = (0, _helpers.getSearchedOperations)(_constants.SIDE_INSERT_MENUS_SEARCH_MAP, true, e, t, editor);
+      const newMenuSearchMap = (0, _helpers.getSearchedOperations)(_constants.SIDE_QUICK_INSERT_MENUS_SEARCH_MAP, true, e, t, editor);
       setQuickInsertMenuSearchMap(newMenuSearchMap);
     }
   }, [editor, t]);
@@ -351,17 +380,18 @@ const QuickInsertBlockMenu = _ref => {
     onChange(e);
   }, [onChange]);
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "sdoc-insert-element-toolbar",
-    ref: downDownWrapperRef
+    className: "sdoc-insert-element-toolbar"
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "sdoc-side-menu-search-wrapper"
   }, /*#__PURE__*/_react.default.createElement(_reactstrap.Input, {
+    innerRef: inputWrapperRef,
     placeholder: t('Search_action'),
     onChange: onChange,
     onCompositionStart: onCompositionStart,
     onCompositionEnd: onCompositionEnd
   })), /*#__PURE__*/_react.default.createElement("div", {
-    className: "sdoc-insert-element-content-wrapper"
+    className: "sdoc-insert-element-content-wrapper",
+    ref: downDownWrapperRef
   }, Object.keys(dropDownItems).map(key => {
     return dropDownItems[key];
   }), Object.keys(quickInsertMenuSearchMap).length === 0 && /*#__PURE__*/_react.default.createElement("div", {

package/dist/basic-sdk/extension/toolbar/side-toolbar/insert-block-menu.js

@@ -106,7 +106,37 @@ const InsertBlockMenu = _ref => {
     const newInsertPosition = slateNode.type === _constants.ELEMENT_TYPE.LIST_ITEM ? _constants.INSERT_POSITION.AFTER : insertPosition;
     (0, _helper2.insertMultiColumn)(editor, editor.selection, newInsertPosition, type);
   }, [editor, insertPosition, slateNode]);
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, [_constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.PARAGRAPH], ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.HEADER]].map(item => {
+    return /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
+      isHidden: !insertMenuSearchMap[item.type],
+      disabled: isNodeEmpty && item.type === _constants.PARAGRAPH,
+      key: item.id,
+      menuConfig: item,
+      onClick: () => onInsert(item.type)
+    });
+  }), /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
+    isHidden: !insertMenuSearchMap[_constants.ELEMENT_TYPE.UNORDERED_LIST],
+    menuConfig: {
+      ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.UNORDERED_LIST]
+    },
+    onClick: () => {
+      onInsertList(_constants.ELEMENT_TYPE.UNORDERED_LIST);
+    }
+  }), /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
+    isHidden: !insertMenuSearchMap[_constants.ELEMENT_TYPE.ORDERED_LIST],
+    menuConfig: {
+      ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.ORDERED_LIST]
+    },
+    onClick: () => {
+      onInsertList(_constants.ELEMENT_TYPE.ORDERED_LIST);
+    }
+  }), /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
+    isHidden: !insertMenuSearchMap[_constants.ELEMENT_TYPE.CHECK_LIST_ITEM],
+    menuConfig: {
+      ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.CHECK_LIST_ITEM]
+    },
+    onClick: onInsertCheckList
+  }), /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
     isHidden: !insertMenuSearchMap[_constants.ELEMENT_TYPE.IMAGE],
     menuConfig: {
       ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.IMAGE]
@@ -151,36 +181,6 @@ const InsertBlockMenu = _ref => {
       ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.CALL_OUT]
     },
     onClick: () => onInsertCallout(_constants.PARAGRAPH)
-  }), /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
-    isHidden: !insertMenuSearchMap[_constants.ELEMENT_TYPE.UNORDERED_LIST],
-    menuConfig: {
-      ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.UNORDERED_LIST]
-    },
-    onClick: () => {
-      onInsertList(_constants.ELEMENT_TYPE.UNORDERED_LIST);
-    }
-  }), /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
-    isHidden: !insertMenuSearchMap[_constants.ELEMENT_TYPE.ORDERED_LIST],
-    menuConfig: {
-      ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.ORDERED_LIST]
-    },
-    onClick: () => {
-      onInsertList(_constants.ELEMENT_TYPE.ORDERED_LIST);
-    }
-  }), /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
-    isHidden: !insertMenuSearchMap[_constants.ELEMENT_TYPE.CHECK_LIST_ITEM],
-    menuConfig: {
-      ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.CHECK_LIST_ITEM]
-    },
-    onClick: onInsertCheckList
-  }), [_constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.PARAGRAPH], ..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.HEADER]].map(item => {
-    return /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
-      isHidden: !insertMenuSearchMap[item.type],
-      disabled: isNodeEmpty && item.type === _constants.PARAGRAPH,
-      key: item.id,
-      menuConfig: item,
-      onClick: () => onInsert(item.type)
-    });
   }), _constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.MULTI_COLUMN].map(item => {
     return /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
       isHidden: !insertMenuSearchMap[item.type],

package/dist/basic-sdk/extension/utils/index.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.isSameDomain = exports.isOverflowPortByDirection = exports.isImage = exports.IMAGE_TYPES = void 0;
+exports.onHandleOverflowScroll = exports.isSameDomain = exports.isOverflowPortByDirection = exports.isImage = exports.IMAGE_TYPES = void 0;
 var _isUrl = _interopRequireDefault(require("is-url"));
 const IMAGE_TYPES = exports.IMAGE_TYPES = ['png', 'jpg', 'gif'];
 const isImage = url => {
@@ -41,4 +41,31 @@ const isOverflowPortByDirection = (element, direction) => {
     return right >= viewWidth;
   }
 };
-exports.isOverflowPortByDirection = isOverflowPortByDirection;
+exports.isOverflowPortByDirection = isOverflowPortByDirection;
+const onHandleOverflowScroll = (currentSelectItem, downDownWrapperRef) => {
+  const {
+    bottom: curBottom,
+    top: curTop
+  } = currentSelectItem.getBoundingClientRect();
+  const {
+    bottom: containerBottom
+  } = downDownWrapperRef.current.parentNode.getBoundingClientRect();
+  const {
+    top: containerTop
+  } = downDownWrapperRef.current.getBoundingClientRect();
+  if (curBottom > containerBottom) {
+    const scrollTop = downDownWrapperRef.current.scrollTop + 100;
+    downDownWrapperRef.current.scrollTo({
+      top: scrollTop,
+      behavior: 'smooth'
+    });
+  }
+  if (curTop < containerTop) {
+    const scrollTop = downDownWrapperRef.current.scrollTop - 100;
+    downDownWrapperRef.current.scrollTo({
+      top: scrollTop,
+      behavior: 'smooth'
+    });
+  }
+};
+exports.onHandleOverflowScroll = onHandleOverflowScroll;

package/dist/components/doc-operations/revision-operations/more-revision-operations/index.js

@@ -11,11 +11,14 @@ var _reactI18next = require("react-i18next");
 var _reactstrap = require("reactstrap");
 var _context = _interopRequireDefault(require("../../../../context"));
 var _toast = _interopRequireDefault(require("../../../toast"));
+var _basicSdk = require("../../../../basic-sdk");
+var _constants = require("../../../../constants");
 require("./index.css");
 const MoreRevisionOperations = _ref => {
   let {
     t
   } = _ref;
+  const eventBus = _basicSdk.EventBus.getInstance();
   const [isDropdownOpen, setIsDropdownOpen] = (0, _react.useState)(false);
   const toggleDropdown = (0, _react.useCallback)(isDropdownOpen => {
     setIsDropdownOpen(!isDropdownOpen);
@@ -26,6 +29,7 @@ const MoreRevisionOperations = _ref => {
       const siteRoot = _context.default.getSetting('siteRoot');
       const revisionURL = `${siteRoot}lib/${repoID}/revisions/${res.data.revision_id}/`;
       window.open(revisionURL, '_blank');
+      eventBus.dispatch(_constants.EXTERNAL_EVENT.NEW_REVISION);
     }).catch(error => {
       _toast.default.danger(t('Error'));
     });

package/dist/components/doc-operations/revision-operations/revisions/index.js

@@ -12,13 +12,19 @@ var _context = _interopRequireDefault(require("../../../../context"));
 var _revisionsDialog = _interopRequireDefault(require("./revisions-dialog"));
 var _utils = require("../../../../utils");
 var _toast = _interopRequireDefault(require("../../../toast"));
+var _basicSdk = require("../../../../basic-sdk");
+var _constants = require("../../../../constants");
 require("./index.css");
 const Revisions = () => {
+  const eventBus = _basicSdk.EventBus.getInstance();
   const {
     t
   } = (0, _reactI18next.useTranslation)();
   const [revisionsCount, setRevisionsCount] = (0, _react.useState)(0);
   const [isShowRevisions, setShowRevisions] = (0, _react.useState)(false);
+  const autoIncrementRevisionsCount = (0, _react.useCallback)(() => {
+    setShowRevisions(revisionsCount + 1);
+  }, [revisionsCount]);
 
   // did mount
   (0, _react.useEffect)(() => {
@@ -32,6 +38,13 @@ const Revisions = () => {
 
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
+  (0, _react.useEffect)(() => {
+    const autoIncrementRevisionSubscribe = eventBus.subscribe(_constants.EXTERNAL_EVENT.NEW_REVISION, autoIncrementRevisionsCount);
+    return () => {
+      autoIncrementRevisionSubscribe();
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [autoIncrementRevisionsCount]);
   const showRevisions = (0, _react.useCallback)(() => {
     setShowRevisions(true);
   }, []);

package/dist/constants/index.js

@@ -40,7 +40,9 @@ const EXTERNAL_EVENT = exports.EXTERNAL_EVENT = {
   INSERT_LINK: 'insert_link',
   // document
   COLLABORATORS_UPDATED: 'collaborators_updated',
-  IMAGE_COLUMN_TOGGLE: 'Image_column_toggle'
+  IMAGE_COLUMN_TOGGLE: 'Image_column_toggle',
+  // revise
+  NEW_REVISION: 'new_revision'
 };
 const TIP_TYPE = exports.TIP_TYPE = {
   DELETE_NO_CHANGES_REVISION: 'delete_no_changes_revision',

package/dist/utils/index.js

@@ -25,7 +25,7 @@ Object.defineProperty(exports, "getEventTransfer", {
     return _getEventTransfer.default;
   }
 });
-exports.resetWebTitle = exports.isMobile = exports.isMac = exports.isEnglish = exports.getSelectionCoords = exports.getMaximumCapacity = exports.getImageFileNameWithTimestamp = void 0;
+exports.resetWebTitle = exports.isMobile = exports.isMac = exports.isEnglish = exports.getSelectionCoords = exports.getMaximumCapacity = exports.getLocalStorageFiles = exports.getImageFileNameWithTimestamp = void 0;
 var _dateUtils = _interopRequireDefault(require("./date-utils"));
 var _localStorageUtils = _interopRequireDefault(require("./local-storage-utils"));
 var _context = _interopRequireDefault(require("../context"));
@@ -170,4 +170,15 @@ const getMaximumCapacity = files => {
   });
   return newFiles;
 };
-exports.getMaximumCapacity = getMaximumCapacity;
+exports.getMaximumCapacity = getMaximumCapacity;
+const getLocalStorageFiles = files => {
+  const wikiRepoId = window.wiki.config.wikiId;
+  const newFiles = [];
+  files.forEach(item => {
+    if ((item === null || item === void 0 ? void 0 : item.wikiRepoId) === wikiRepoId) {
+      newFiles.push(item);
+    }
+  });
+  return newFiles;
+};
+exports.getLocalStorageFiles = getLocalStorageFiles;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seafile/sdoc-editor",
-  "version": "1.0.175",
+  "version": "1.0.176beta",
   "private": false,
   "description": "This is a sdoc editor",
   "main": "dist/index.js",