@seafile/sdoc-editor 3.0.177 → 3.0.178

package/dist/assets/css/dropdown-menu.css

@@ -1,7 +1,14 @@
 .sdoc-dropdown-menu,
 .sdoc-dropdown-menu .sdoc-dropdown-menu-container {
-  min-width: 12rem;
-  padding: 8px 0;
+  width: fit-content;
+  min-width: 200px;
+  max-width: 240px;
+  max-height: 600px;
+  overflow: visible;
+}
+
+.sdoc-dropdown-menu .sdoc-dropdown-menu-container {
+  padding: 8px;
 }
 
 .sdoc-dropdown-menu .sdoc-dropdown-menu-divider {
@@ -9,13 +16,13 @@
   height: 0;
   margin: 0.5rem 0;
   overflow: hidden;
-  border-top: 1px solid #e9ecef;
+  border-top: 1px solid #eee;
 }
 
 .sdoc-dropdown-menu .sdoc-dropdown-menu-item {
-  height: 30px;
+  height: 32px;
   width: 100%;
-  padding: 4px 24px;
+  padding: 0px 12px;
   user-select: none;
   display: flex;
   align-items: center;
@@ -51,7 +58,8 @@
 }
 
 .sdoc-dropdown-menu .sdoc-dropdown-menu-item:hover {
-  background-color: #F5F5F5;
+  background-color: rgba(0, 0, 0, 0.04);
+  border-radius: 4px;
   cursor: pointer;
 }
 
@@ -75,17 +83,18 @@
 }
 
 .sdoc-dropdown-menu .sdoc-dropdown-item-content .sdoc-dropdown-item-content-icon {
-  margin-right: 10px;
+  margin-right: 12px;
 }
 
 .sdoc-dropdown-menu .sdoc-arrow-right {
   color: #666;
   font-size: 12px !important;
+  line-height: 12px !important;
 }
 
 .sdoc-dropdown-menu .sdoc-dropdown-item-with-left-icon {
   min-height: 32px;
-  padding: 3px 12px;
+  padding: 0 12px;
 }
 
 .sdoc-dropdown-menu .sdoc-check-mark {
@@ -94,7 +103,7 @@
 
 /* sub menu */
 .sdoc-sub-dropdown-menu .popover {
-  left: -8px !important;
+  left: 0px !important;
 }
 
 .sdoc-sub-dropdown-menu .bs-popover-auto[x-placement^="left"] {

package/dist/extension/plugins/font/menu/font-family/index.css

@@ -33,8 +33,10 @@
 
 /* sdoc-font-family-menu-popover */
 .sdoc-font-family-menu-popover .sdoc-dropdown-menu-title-name {
-  padding: 8px 10px;
-  color: gray;
+  height: 24px;
+  line-height: 24px;
+  padding-left: 8px;
+  color: #666;
   cursor: default;
   font-size: 14px;
 }

package/dist/extension/plugins/font/menu/font-family/index.js

@@ -127,7 +127,7 @@ var FontFamily = function FontFamily(_ref) {
     fade: false,
     ref: popoverRef
   }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdoc-font-size-menu-container",
+    className: "sdoc-dropdown-menu-container sdoc-font-size-menu-container",
     style: {
       maxHeight: window.innerHeight - bottom - 100
     }

package/dist/extension/plugins/font/menu/font-size/index.css

@@ -25,18 +25,17 @@
 
 .sdoc-font-size-menu-popover .sdoc-dropdown-menu-item .sdoc-check-mark {
   position: absolute;
-  left: 5px;
+  left: 12px;
   color: #666;
 }
 
 .sdoc-font-size-menu-popover .sdoc-font-size-menu-container {
   height: fit-content;
-  padding: 8px 0;
   overflow-y: scroll;
   overflow-x: hidden;
 }
 
 .sdoc-font-size-menu-popover .sdoc-dropdown-menu-item {
   font-size: 14px;
-  padding: 4px 16px 4px 24px;
+  padding: 4px 12px 4px 38px;
 }

package/dist/extension/plugins/font/menu/font-size/index.js

@@ -85,7 +85,7 @@ var FontSize = function FontSize(_ref) {
     fade: false,
     ref: popoverRef
   }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdoc-font-size-menu-container",
+    className: "sdoc-dropdown-menu-container sdoc-font-size-menu-container",
     style: {
       maxHeight: window.innerHeight - bottom - 100
     }

package/dist/extension/plugins/header/menu/index.js

@@ -125,6 +125,8 @@ var HeaderMenu = /*#__PURE__*/function (_React$Component) {
         className: (0, _classnames["default"])('header-popover sdoc-dropdown-menu', {
           'sdoc-dropdown-menu-mobile': _commonUtils.isMobile
         })
+      }, /*#__PURE__*/_react["default"].createElement("div", {
+        className: "sdoc-dropdown-menu-container"
       }, itemList.map(function (item, index) {
         if (item === 'divider') {
           return /*#__PURE__*/_react["default"].createElement("div", {
@@ -152,7 +154,7 @@ var HeaderMenu = /*#__PURE__*/function (_React$Component) {
           target: id,
           placement: "right"
         }, _this2.getToolTip(item)));
-      })));
+      }))));
     }
   }]);
 }(_react["default"].Component);

package/dist/extension/plugins/header/menu/style.css

@@ -54,12 +54,12 @@
   position: absolute;
   top: 42px;
   left: 8px;
-  padding: 8px 0;
   width: 180px;
   background-color: #fff;
   border: 1px solid #e5e6e8;
   border-radius: 2px;
   box-shadow: 0 0 10px #ccc;
+  border-radius: 8px;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -74,12 +74,12 @@
 .header-menu .header-popover .sdoc-dropdown-menu-item {
   font-size: 14px;
   height: auto;
-  padding: 9px 16px 9px 24px;
+  padding: 9px 12px 9px 38px;
   line-height: 1;
 }
 
 .header-menu .header-popover .sdoc-dropdown-menu-item .sdoc-check-mark {
   position: absolute;
-  left: 5px;
+  left: 12px;
   color: #666;
 }

package/dist/extension/plugins/image/hover-menu/index.css

@@ -62,7 +62,7 @@
   left: 0px;
   background-color: #fff;
   border: 1px solid #e5e6e8;
-  border-radius: 2px;
+  border-radius: 8px;
   box-shadow: 0 0 10px #ccc;
   display: flex;
   flex-direction: column;
@@ -71,8 +71,22 @@
   white-space: nowrap;
 }
 
+.sdoc-image-hover-menu-container .sdoc-image-popover .sdoc-dropdown-menu-container .sdoc-dropdown-menu-item {
+  padding: 4px 12px 4px 38px;
+}
+
+.sdoc-image-hover-menu-container .sdoc-image-popover .sdoc-dropdown-menu-container .sdoc-check-mark {
+  position: absolute;
+  left: 12px;
+  color: #666;
+}
+
 .sdoc-image-hover-menu-container .align-popover {
-  min-width: 6rem;
+  min-width: 80px;
+}
+
+.sdoc-image-hover-menu-container .align-popover .sdoc-dropdown-menu-container {
+  min-width: 80px;
 }
 
 .sdoc-image-hover-menu-container .border-popover {

package/dist/extension/plugins/image/hover-menu/index.js

@@ -192,23 +192,23 @@ var ImageHoverMenu = function ImageHoverMenu(_ref) {
     className: "sdocfont sdoc-arrow-down"
   }), popoverState.displayPopover && /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-image-popover sdoc-dropdown-menu"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "sdoc-dropdown-menu-container"
   }, _constants2.IMAGE_DISPLAY_TYPE.map(function (item) {
     return /*#__PURE__*/_react["default"].createElement("div", {
       key: item.value,
-      className: "sdoc-dropdown-menu-item sdoc-dropdown-item-with-left-icon pr-2",
+      className: (0, _classnames["default"])('sdoc-dropdown-menu-item', {
+        'position-relative': type === item.value
+      }),
       onClick: function onClick(event) {
         return onSelect(event, {
           'display_type': item.value
         });
       }
-    }, /*#__PURE__*/_react["default"].createElement("div", {
-      className: "sdoc-dropdown-item-content"
-    }, /*#__PURE__*/_react["default"].createElement("i", {
-      className: "sdoc-dropdown-item-content-icon"
-    }), /*#__PURE__*/_react["default"].createElement("span", null, t(item.text))), type === item.value && /*#__PURE__*/_react["default"].createElement("i", {
+    }, /*#__PURE__*/_react["default"].createElement("span", null, t(item.text)), type === item.value && /*#__PURE__*/_react["default"].createElement("i", {
       className: "sdocfont sdoc-check-mark sdoc-dropdown-item-right-icon"
     }));
-  })))), !readonly && /*#__PURE__*/_react["default"].createElement("span", {
+  }))))), !readonly && /*#__PURE__*/_react["default"].createElement("span", {
     className: "op-group-item"
   }, type === _constants.IMAGE_BLOCK && /*#__PURE__*/_react["default"].createElement("span", {
     role: "button",
@@ -224,23 +224,25 @@ var ImageHoverMenu = function ImageHoverMenu(_ref) {
     className: "sdocfont sdoc-arrow-down"
   }), popoverState.alignPopover && /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-image-popover align-popover sdoc-dropdown-menu"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "sdoc-dropdown-menu-container"
   }, _constants.MENUS_CONFIG_MAP[_constants.TEXT_ALIGN].map(function (item) {
     return /*#__PURE__*/_react["default"].createElement("div", {
       key: item.id,
-      className: "sdoc-dropdown-menu-item sdoc-dropdown-item-with-left-icon pr-2",
+      className: (0, _classnames["default"])('sdoc-dropdown-menu-item', {
+        'position-relative': align === item.type
+      }),
       onClick: function onClick(event) {
         return onSelect(event, {
           align: item.type
         });
       }
-    }, /*#__PURE__*/_react["default"].createElement("div", {
-      className: "sdoc-dropdown-item-content"
     }, /*#__PURE__*/_react["default"].createElement("i", {
       className: (0, _classnames["default"])(item.iconClass)
-    })), align === item.type && /*#__PURE__*/_react["default"].createElement("i", {
-      className: "sdocfont sdoc-check-mark sdoc-dropdown-item-right-icon"
+    }), align === item.type && /*#__PURE__*/_react["default"].createElement("i", {
+      className: "sdocfont sdoc-check-mark"
     }));
-  }))), /*#__PURE__*/_react["default"].createElement("span", {
+  })))), /*#__PURE__*/_react["default"].createElement("span", {
     id: "sdoc_image_border",
     role: "button",
     className: (0, _classnames["default"])('op-item', {

package/dist/extension/plugins/table/menu/color-selector-popover/index.js

@@ -104,7 +104,7 @@ var ColorSelectorPopover = function ColorSelectorPopover(_ref) {
     className: "sdoc-color-menu-popover sdoc-table-cell-bg-colors-popover",
     toggle: toggle,
     ref: popoverRef,
-    offset: [0, 0]
+    offset: [0, 8]
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-dropdown-menu sdoc-color-dropdown-menu"
   }, /*#__PURE__*/_react["default"].createElement("div", {

package/dist/extension/plugins/table/menu/horizontal-align-popover/index.js

@@ -39,44 +39,40 @@ var HorizontalAlignPopover = function HorizontalAlignPopover(_ref) {
     placement: "right-start",
     hideArrow: true,
     fade: false,
-    offset: [0, 0]
+    offset: [0, 8]
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-dropdown-menu sdoc-table-alignment-menu"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "sdoc-dropdown-menu-container"
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-dropdown-menu-item",
     onMouseDown: function onMouseDown() {
       return setTextAlignStyle('left');
     }
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdoc-checked"
   }, /*#__PURE__*/_react["default"].createElement("i", {
     className: (0, _classnames["default"])('sdocfont sdoc-check-mark', {
       active: !horizontalAlign || horizontalAlign === 'left'
     })
-  })), /*#__PURE__*/_react["default"].createElement("span", {
+  }), /*#__PURE__*/_react["default"].createElement("span", {
     className: "active"
   }, t('Left'))), /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-dropdown-menu-item",
     onMouseDown: function onMouseDown() {
       return setTextAlignStyle('center');
     }
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdoc-checked"
   }, /*#__PURE__*/_react["default"].createElement("i", {
     className: (0, _classnames["default"])('sdocfont sdoc-check-mark', {
       active: horizontalAlign === 'center'
     })
-  })), /*#__PURE__*/_react["default"].createElement("span", null, t('Center'))), /*#__PURE__*/_react["default"].createElement("div", {
+  }), /*#__PURE__*/_react["default"].createElement("span", null, t('Center'))), /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-dropdown-menu-item",
     onMouseDown: function onMouseDown() {
       return setTextAlignStyle('right');
     }
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdoc-checked"
   }, /*#__PURE__*/_react["default"].createElement("i", {
     className: (0, _classnames["default"])('sdocfont sdoc-check-mark', {
       active: horizontalAlign === 'right'
     })
-  })), /*#__PURE__*/_react["default"].createElement("span", null, t('Right')))));
+  }), /*#__PURE__*/_react["default"].createElement("span", null, t('Right'))))));
 };
 var _default = exports["default"] = HorizontalAlignPopover;

package/dist/extension/plugins/table/menu/table-context-menu/index.css

@@ -1,6 +1,7 @@
 .sdoc-context-menu .sdoc-table-context-menu {
   display: block;
   font-size: 0.875rem;
+  max-width: 480px !important;
 }
 
 .sdoc-table-context-menu .insert-number {
@@ -17,12 +18,6 @@
   transition: none;
 }
 
-.sdoc-table-context-menu .dropdown-item:hover .insert-number-input {
-  background-color: transparent;
-  border: 1px solid #fff;
-  color: #fff;
-}
-
 .sdoc-table-context-menu .dropdown-item:disabled .insert-number-input {
   color: #adb5bd;
 }
@@ -38,7 +33,3 @@
   color: #666;
   font-size: 12px;
 }
-
-.side-extendable:hover .sdoc-arrow-right {
-  color: #fff;
-}

package/dist/extension/plugins/table/menu/vertical-align-popover/index.js

@@ -41,44 +41,40 @@ var VerticalAlignPopover = function VerticalAlignPopover(_ref) {
     placement: "right-start",
     hideArrow: true,
     fade: false,
-    offset: [0, 0]
+    offset: [0, 8]
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-dropdown-menu sdoc-table-alignment-menu"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "sdoc-dropdown-menu-container"
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-dropdown-menu-item",
     onMouseDown: function onMouseDown() {
       return setVerticalAlignStyle('flex-start');
     }
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdoc-checked"
   }, /*#__PURE__*/_react["default"].createElement("i", {
     className: (0, _classnames["default"])('sdocfont sdoc-check-mark', {
       active: !verticalAlign || verticalAlign === 'flex-start'
     })
-  })), /*#__PURE__*/_react["default"].createElement("span", {
+  }), /*#__PURE__*/_react["default"].createElement("span", {
     className: "active"
   }, t('Top_align'))), /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-dropdown-menu-item",
     onMouseDown: function onMouseDown() {
       return setVerticalAlignStyle('center');
     }
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdoc-checked"
   }, /*#__PURE__*/_react["default"].createElement("i", {
     className: (0, _classnames["default"])('sdocfont sdoc-check-mark', {
       active: verticalAlign === 'center'
     })
-  })), /*#__PURE__*/_react["default"].createElement("span", null, t('Center_align'))), /*#__PURE__*/_react["default"].createElement("div", {
+  }), /*#__PURE__*/_react["default"].createElement("span", null, t('Center_align'))), /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-dropdown-menu-item",
     onMouseDown: function onMouseDown() {
       return setVerticalAlignStyle('flex-end');
     }
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdoc-checked"
   }, /*#__PURE__*/_react["default"].createElement("i", {
     className: (0, _classnames["default"])('sdocfont sdoc-check-mark', {
       active: verticalAlign === 'flex-end'
     })
-  })), /*#__PURE__*/_react["default"].createElement("span", null, t('Bottom_align')))));
+  }), /*#__PURE__*/_react["default"].createElement("span", null, t('Bottom_align'))))));
 };
 var _default = exports["default"] = VerticalAlignPopover;

package/dist/extension/plugins/table/menu/vertical-align-popover/style.css

@@ -3,20 +3,23 @@
     flex-direction: column;
 }
 
-.sdoc-table-alignment-menu .sdoc-dropdown-menu-item {
-    padding: 4px 10px !important;
+.sdoc-table-alignment-menu {
+    min-width: 80px !important;
+}
+
+.sdoc-table-alignment-menu .sdoc-dropdown-menu-container {
+    min-width: 80px !important;
 }
 
-.sdoc-table-alignment-menu .sdoc-dropdown-menu-item .sdoc-checked {
-    margin-right: 6px;
-    height: 21px;
-    line-height: 21px;
-    width: 12px;
+.sdoc-table-alignment-menu .sdoc-dropdown-menu-item {
+    padding: 4px 12px 4px 38px !important;
 }
 
 .sdoc-table-alignment-menu .sdoc-dropdown-menu-item .sdoc-check-mark {
+    position: absolute;
+    left: 20px;
+    font-size: 14px !important;
     display: none;
-    font-size: 12px !important;
 }
 
 .sdoc-table-alignment-menu .sdoc-dropdown-menu-item .sdoc-check-mark.active {

package/dist/extension/plugins/table/popover/table-size-popover/index.css

@@ -3,7 +3,7 @@
   min-width: 100px;
   min-height: 100px;
   max-width: 222px;
-  border-radius: 2px;
+  border-radius: 8px;
 }
 
 .sdoc-selected-table-size-popover .sdoc-selected-table-size-tip {
@@ -48,7 +48,7 @@
 .sdoc-selected-table-size-container .sdoc-selected-table-tools-container {
   padding: 10px 0;
   margin-bottom: 10px;
-  border-bottom: 1px solid #dedede;
+  border-bottom: 1px solid #eee;
 }
 
 .sdoc-selected-table-size-popover .sdoc-selected-table-size-custom {

package/dist/extension/plugins/table/popover/table-size-popover/index.js

@@ -25,7 +25,9 @@ var TableSizePopover = function TableSizePopover(_ref) {
     createTable = _ref.createTable,
     tableSizeRef = _ref.tableSizeRef,
     handleClosePopover = _ref.handleClosePopover,
-    callback = _ref.callback;
+    callback = _ref.callback,
+    _ref$offset = _ref.offset,
+    offset = _ref$offset === void 0 ? [0, 8] : _ref$offset;
   var minSize = [5, 10];
   var maxSize = [10, 10];
   var _useState = (0, _react.useState)([5, 10]),
@@ -229,7 +231,8 @@ var TableSizePopover = function TableSizePopover(_ref) {
     hideArrow: true,
     fade: false,
     ref: ref,
-    popperClassName: popperClassName
+    popperClassName: popperClassName,
+    offset: offset
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-selected-table-size-container w-100 h-100 d-flex flex-column"
   }, /*#__PURE__*/_react["default"].createElement("div", {

package/dist/extension/plugins/table/popover/table-template/index.css

@@ -2,6 +2,12 @@
   min-width: 312px;
 }
 
+.sdoc-table-template-popover .popover {
+  background-color: #fff;
+  border-radius: 8px;
+  overflow: hidden;
+}
+
 .sdoc-table-template-inner-popover {
   display: flex;
   flex-wrap: wrap;

package/dist/extension/plugins/table/popover/table-template/index.js

@@ -119,7 +119,8 @@ var TableTemplate = function TableTemplate(_ref) {
     className: "sdoc-sub-dropdown-menu sdoc-table-template-popover",
     innerClassName: "sdoc-table-template-inner-popover",
     popperClassName: "sdoc-table-template-popover-wrapper",
-    ref: ref
+    ref: ref,
+    offset: [0, 0]
   }, tableTemplatePreviewList.map(function (alternateColor, index) {
     return /*#__PURE__*/_react["default"].createElement(_sampleTable["default"], {
       key: alternateColor + index,

package/dist/extension/plugins/text-align/menu/index.css

@@ -1,10 +1,14 @@
+.sdoc-text-align-dropdown .sdoc-dropdown-menu-container {
+    min-width: 80px !important;
+}
+
 .sdoc-text-align-dropdown .sdocfont.sdoc-check-mark {
     position: absolute;
-    left: 5px;
+    left: 12px;
     color: #666;
 }
 
 .sdoc-text-align-dropdown .sdoc-dropdown-menu-item {
     font-size: 14px;
-    padding: 4px 16px 4px 24px;
+    padding: 4px 12px 4px 38px;
 }

package/dist/extension/plugins/text-align/menu/index.js

@@ -86,7 +86,7 @@ var TextAlignMenu = function TextAlignMenu(_ref) {
     fade: false,
     ref: popoverRef
   }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "pt-2 pb-2"
+    className: "sdoc-dropdown-menu-container pt-2 pb-2"
   }, _constants.MENUS_CONFIG_MAP[_constants.TEXT_ALIGN].map(function (item, index) {
     var isSelected = curType === item.id;
     return /*#__PURE__*/_react["default"].createElement("div", {

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

@@ -394,7 +394,8 @@ var QuickInsertBlockMenu = function QuickInsertBlockMenu(_ref) {
       className: "sdoc-menu-popover sdoc-dropdown-menu sdoc-sub-dropdown-menu sdoc-insert-video-menu-popover",
       placement: "right-start",
       hideArrow: true,
-      fade: false
+      fade: false,
+      offset: [0, 6]
     }, /*#__PURE__*/_react["default"].createElement("div", {
       className: "sdoc-insert-video-menu-popover-container sdoc-dropdown-menu-container"
     }, /*#__PURE__*/_react["default"].createElement("div", {
@@ -423,6 +424,7 @@ var QuickInsertBlockMenu = function QuickInsertBlockMenu(_ref) {
       target: "sdoc-side-menu-item-table",
       trigger: "hover",
       placement: "right-start",
+      offset: [0, 6],
       popperClassName: "sdoc-side-menu-table-size sdoc-insert-element-table-size-wrapper",
       createTable: createTable,
       callback: callback,
@@ -617,7 +619,7 @@ var QuickInsertBlockMenu = function QuickInsertBlockMenu(_ref) {
     onChange(e);
   }, [onChange]);
   return /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdoc-insert-element-toolbar"
+    className: "sdoc-dropdown-menu-container sdoc-insert-element-toolbar"
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-side-menu-search-wrapper"
   }, /*#__PURE__*/_react["default"].createElement(_reactstrap.Input, {

package/dist/extension/toolbar/side-toolbar/insert-below-menu.js

@@ -19,7 +19,8 @@ var InsertBelowMenu = function InsertBelowMenu(_ref) {
     trigger: "hover",
     placement: "right-start",
     hideArrow: true,
-    fade: false
+    fade: false,
+    offset: [0, 6]
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-dropdown-menu-container"
   }, /*#__PURE__*/_react["default"].createElement(_insertBlockMenu["default"], {

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

@@ -227,7 +227,8 @@ var InsertBlockMenu = function InsertBlockMenu(_ref) {
     className: "sdoc-menu-popover sdoc-dropdown-menu sdoc-sub-dropdown-menu sdoc-insert-video-menu-popover",
     placement: "right-start",
     hideArrow: true,
-    fade: false
+    fade: false,
+    offset: [0, 6]
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-insert-video-menu-popover-container sdoc-dropdown-menu-container"
   }, /*#__PURE__*/_react["default"].createElement("div", {
@@ -251,6 +252,7 @@ var InsertBlockMenu = function InsertBlockMenu(_ref) {
     target: "sdoc-side-menu-item-table",
     trigger: "hover",
     placement: "right-start",
+    offset: [0, 6],
     popperClassName: "sdoc-side-menu-table-size sdoc-insert-element-table-size-wrapper",
     createTable: createTable
   })), /*#__PURE__*/_react["default"].createElement(_dropdownMenuItem["default"], {

package/dist/extension/toolbar/side-toolbar/side-menu.css

@@ -9,7 +9,6 @@
   border: 1px solid rgba(0, 0, 0, .12);
   border-radius: 4px;
   transform: translateX(-200px);
-  padding: 8px 0px;
   box-shadow: 0 2px 12px 2px rgba(68, 73, 77, .16);
   z-index: 999;
 }
@@ -31,6 +30,6 @@
 .sdoc-side-menu-insert-below-popover .popover {
   background-color: #fff;
   min-width: 150px;
-  border-radius: 2px;
+  border-radius: 8px;
   cursor: pointer;
 }

package/dist/extension/toolbar/side-toolbar/side-menu.js

@@ -160,6 +160,8 @@ var SideMenu = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-side-menu sdoc-dropdown-menu",
     ref: sideMenuRef
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "sdoc-dropdown-menu-container"
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-side-menu-search-wrapper"
   }, /*#__PURE__*/_react["default"].createElement(_reactstrap.Input, {
@@ -261,6 +263,6 @@ var SideMenu = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     isHidden: !otherOperatonsMenuSearchMap['DELETE']
   }), transformMenuSearchMap['searching'] && Object.keys((0, _objectSpread2["default"])((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, transformMenuSearchMap), insertBelowMenuSearchMap), otherOperatonsMenuSearchMap)).length === 1 && /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-dropdown-menu-item-no-results"
-  }, t('No_results')))));
+  }, t('No_results'))))));
 });
 var _default = exports["default"] = SideMenu;

package/dist/extension/toolbar/side-toolbar/transform-menus.js

@@ -22,7 +22,8 @@ var TransformMenus = function TransformMenus(_ref) {
     trigger: "hover",
     placement: "right-start",
     hideArrow: true,
-    fade: false
+    fade: false,
+    offset: [0, 6]
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-dropdown-menu-container"
   }, (0, _helpers.getTransformMenusConfig)(editor, slateNode).map(function (item) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seafile/sdoc-editor",
-  "version": "3.0.177",
+  "version": "3.0.178",
   "main": "dist/index.js",
   "scripts": {
     "test": "jest",
@@ -17,7 +17,7 @@
   "license": "ISC",
   "description": "",
   "dependencies": {
-    "@seafile/comment-editor": "1.0.26",
+    "@seafile/comment-editor": "1.0.27",
     "@seafile/print-js": "1.6.6",
     "@seafile/react-image-lightbox": "^5.0.6",
     "@seafile/sdoc-file-view": "0.0.62",
@@ -72,5 +72,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "99bb066db2faa823c701ccc2ea3a6d915b0e2ab6"
+  "gitHead": "e11bc2e67473c9c375e20beda8d5a47f38fb7e10"
 }