@seafile/sdoc-editor 3.0.184 → 3.0.185

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

@@ -1,14 +1,10 @@
-.sdoc-dropdown-menu,
-.sdoc-dropdown-menu .sdoc-dropdown-menu-container {
+.sdoc-dropdown-menu {
   width: fit-content;
   min-width: 200px;
-  max-width: 240px;
+  max-width: 480px;
   max-height: 600px;
-  overflow: visible;
-}
-
-.sdoc-dropdown-menu .sdoc-dropdown-menu-container {
   padding: 8px;
+  overflow: visible;
 }
 
 .sdoc-dropdown-menu .sdoc-dropdown-menu-divider {
@@ -80,6 +76,7 @@
   align-items: center;
   flex: 1;
   font-size: 14px;
+  white-space: nowrap;
 }
 
 .sdoc-dropdown-menu .sdoc-dropdown-item-content .sdoc-dropdown-item-content-icon {
@@ -89,7 +86,8 @@
 .sdoc-dropdown-menu .sdoc-arrow-right {
   color: #666;
   font-size: 12px !important;
-  line-height: 12px !important;
+  height: 21px;
+  line-height: 21px !important;
 }
 
 .sdoc-dropdown-menu .sdoc-dropdown-item-with-left-icon {

package/dist/assets/css/popover.css

@@ -0,0 +1,3 @@
+.sdoc-popover-box-shadow {
+  box-shadow: 0 6px 14px 0 rgba(0, 0, 0, .1);
+}

package/dist/assets/css/sdoc-editor-plugins.css

@@ -230,7 +230,7 @@
 
 .sdoc-insert-whiteboard-menu-popover-container,
 .sdoc-insert-video-menu-popover-container {
-  padding: 8px 0;
+  padding: 8px;
 }
 
 /* caret */

package/dist/comment/components/global-comment/index.css

@@ -70,7 +70,7 @@
 
 .comments-panel-header-right .sdoc-file-checked {
   position: absolute;
-  left: 7px;
+  left: 12px;
   color: #798d99;
   font-size: 12px;
   font-weight: 400;
@@ -309,7 +309,11 @@
 }
 
 .comments-panel-body__header .sdoc-comment-filter-dropdown.sdoc-dropdown-menu {
-  border: 1px solid #dee3eb;
+  border: 1px solid #eee;
+}
+
+.sdoc-comment-drawer .sdoc-comment-filter-dropdown .sdoc-dropdown-menu-item {
+  padding: 0 12px 0 38px;
 }
 
 /* global detail */

package/dist/extension/commons/color-menu/index.css

@@ -9,6 +9,7 @@
   flex-direction: column;
   justify-content: center;
   align-items: center;
+  background: #fff;
 }
 
 .menu-group .sdoc-color-menu .last-used-color-container.disabled {
@@ -59,7 +60,6 @@
 
 .sdoc-color-menu-popover .sdoc-color-dropdown-menu {
   width: 251px;
-  padding: 0 0 12px 0;
 }
 
 .sdoc-color-menu-popover .sdoc-color-no-color-container {
@@ -134,15 +134,15 @@
   width: 100%;
   height: 1px;
   border-bottom: 1px solid rgba(0, 0, 0, 0.08);
-  margin: 0px 0 8px 0;
+  margin: 8px 0;
 }
 
 .sdoc-color-menu-popover .sdoc-more-colors {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  height: 30px;
-  font-size: 12px;
+  height: 32px;
+  font-size: 14px;
   padding: 0 12px;
 }
 
@@ -153,7 +153,8 @@
 
 .sdoc-color-menu-popover .sdoc-more-colors.show-pick {
   cursor: pointer;
-  background-color: rgba(51, 77, 102, .06);
+  background-color: rgba(0, 0, 0, .04);
+  border-radius: 4px;
 }
 
 .sdoc-more-colors-popover .popover {

package/dist/extension/commons/color-menu/index.js

@@ -40,7 +40,7 @@ var ColorMenu = function ColorMenu(_ref) {
     ariaLabel = _ref.ariaLabel,
     iconClass = _ref.iconClass,
     id = _ref.id,
-    popoverClassName = _ref.popoverClassName,
+    popperClassName = _ref.popperClassName,
     disabled = _ref.disabled,
     t = _ref.t,
     setColor = _ref.setColor,
@@ -149,7 +149,8 @@ var ColorMenu = function ColorMenu(_ref) {
     target: buttonId
   }, t(text)), !disabled && /*#__PURE__*/_react["default"].createElement(_reactstrap.UncontrolledPopover, {
     target: id,
-    className: (0, _classnames["default"])('sdoc-color-menu-popover', popoverClassName),
+    className: (0, _classnames["default"])('sdoc-color-menu-popover', popperClassName),
+    popperClassName: "sdoc-popover-box-shadow",
     trigger: "legacy",
     placement: "bottom-start",
     hideArrow: true,
@@ -159,7 +160,7 @@ var ColorMenu = function ColorMenu(_ref) {
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-dropdown-menu sdoc-color-dropdown-menu"
   }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "p-3 d-flex flex-column"
+    className: "py-3 d-flex flex-column"
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-color-no-color-container"
   }, /*#__PURE__*/_react["default"].createElement("div", {
@@ -222,7 +223,8 @@ var ColorMenu = function ColorMenu(_ref) {
     hideArrow: true,
     fade: false,
     toggle: moreColorsPopoverToggle,
-    ref: moreColorsPopoverRef
+    ref: moreColorsPopoverRef,
+    offset: [0, 0]
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-more-colors-container",
     onClick: onClick

package/dist/extension/commons/more-dropdown/index.js

@@ -32,7 +32,8 @@ var MoreDropdown = function MoreDropdown(_ref) {
     className: "sdocfont sdoc-more"
   })), /*#__PURE__*/_react["default"].createElement(_reactstrap.UncontrolledPopover, {
     target: buttonId,
-    className: "sdoc-menu-popover sdoc-dropdown-menu",
+    className: "sdoc-dropdown-menu",
+    popperClassName: "sdoc-popover-box-shadow",
     trigger: "legacy",
     placement: "bottom-end",
     hideArrow: true,

package/dist/extension/plugins/ai/ai-module/adjust-sub-menu.js

@@ -18,13 +18,15 @@ var AdjustSubMenu = function AdjustSubMenu(_ref) {
   return /*#__PURE__*/_react["default"].createElement(_reactstrap.UncontrolledPopover, {
     boundariesElement: "viewport",
     target: target,
-    className: "ai-adjust-sub-menu sdoc-sub-dropdown-menu sdoc-dropdown-menu",
+    className: "ai-adjust-sub-menu sdoc-sub-dropdown-menu",
+    popperClassName: "sdoc-popover-box-shadow",
     trigger: "hover",
     placement: "right-start",
     hideArrow: true,
-    fade: false
+    fade: false,
+    offset: [0, 8]
   }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdoc-dropdown-menu-container"
+    className: "sdoc-dropdown-menu"
   }, /*#__PURE__*/_react["default"].createElement(_dropdownMenuItem["default"], {
     menuConfig: _constants.OPERATION_MENUS_CONFIG.MORE_FLUENT,
     onClick: onMoreFluentClick

package/dist/extension/plugins/ai/ai-module/lang-sub-menu.js

@@ -31,13 +31,15 @@ var LangSubMenu = function LangSubMenu(_ref) {
   return /*#__PURE__*/_react["default"].createElement(_reactstrap.UncontrolledPopover, {
     boundariesElement: "viewport",
     target: target,
-    className: "ai-lang-sub-menu sdoc-sub-dropdown-menu sdoc-dropdown-menu",
+    className: "ai-lang-sub-menu sdoc-sub-dropdown-menu",
+    popperClassName: "sdoc-popover-box-shadow",
     trigger: "hover",
     placement: "right-start",
     hideArrow: true,
-    fade: false
+    fade: false,
+    offset: [0, 8]
   }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdoc-dropdown-menu-container"
+    className: "sdoc-dropdown-menu"
   }, /*#__PURE__*/_react["default"].createElement(_dropdownMenuItem["default"], {
     menuConfig: _constants.LANG_MENU_CONFIG.ZH_CN,
     onClick: onZhcnClick

package/dist/extension/plugins/ai/ai-module/style.css

@@ -58,10 +58,10 @@
 .sdoc-ai-module-container .sdoc-ai-operations {
   width: 200px;
   margin-top: 8px;
-  padding: 8px 0;
-  border: 1px solid #e5e6e8;
-  border-radius: 2px;
-  box-shadow: 0 0 10px #ccc;
+  padding: 8px;
+  border: 1px solid #eee;
+  border-radius: 8px;
+  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.1);
   background-color: #fff;
   pointer-events: all;
   overflow: hidden;
@@ -111,15 +111,6 @@
   color: #666;
 }
 
-.ai-lang-sub-menu .popover,
-.ai-adjust-sub-menu .popover {
-  padding: 8px 0;
-  border: 1px solid #e5e6e8;
-  border-radius: 2px;
-  box-shadow: 0 0 10px #ccc;
-  background-color: #fff;
-}
-
 .md-rendered-html table {
   border-collapse: collapse;
   border: 1px solid #ccc;

package/dist/extension/plugins/code-block/hover-menu/index.css

@@ -7,16 +7,16 @@
 }
 
 .sdoc-code-block-hover-menu-container .hover-menu-container {
-  height: 36px;
+  height: 40px;
   width: 100%;
-  padding: 7px 8px;
-  background-color: #fff;
+  padding: 8px;
   display: flex;
   justify-content: space-around;
   align-items: center;
-  border-radius: 3px;
-  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
-  border: 1px solid #e8e8e8;
+  background-color: #fff;
+  border: 1px solid #eee;
+  border-radius: 8px;
+  box-shadow: 0 6px 14px 0 rgba(0, 0, 0, 0.10);
   color: #212529;
 }
 
@@ -35,25 +35,26 @@
   height: 100%;
   width: 100%;
   font-size: 12px;
-  border-radius: 2px;
+  border-radius: 4px;
   text-align: center;
-  line-height: 20px;
+  line-height: 24px;
 }
 
 .sdoc-code-block-hover-menu-container .sdoc-code-block-hover-operation-item.sdoc-code-block-hover-operation-lang .op-item {
-  padding: 0 5px;
+  padding-left: 8px;
 }
 
 .sdoc-code-block-hover-menu-container .hover-menu-container .sdoc-code-block-hover-operation-lang .sdocfont {
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  margin-left: 8px;
+  margin-left: 3px;
+  margin-right: 3px;
 }
 
 .sdoc-code-block-hover-menu-container .sdoc-code-block-hover-operation-item {
-  height: 20px;
-  width: 20px;
+  height: 24px;
+  width: 24px;
   text-align: center;
   justify-content: center;
 }
@@ -80,22 +81,35 @@
 
 .sdoc-langs-list-container {
   position: absolute;
-  top: 38px;
-  left: 8px;
+  top: 40px;
+  left: 0px;
   width: 200px;
   overflow-y: hidden;
   background-color: #fff;
-  border-radius: 4px;
-  box-shadow: 0 0 5px #ccc;
-  border: 1px solid #dedede;
+  border: 1px solid #eee;
+  border-radius: 8px;
+  box-shadow: 0 6px 14px 0 #eee;
 }
 
 .sdoc-langs-list-container .sdoc-search-langs {
-  padding: 10px 10px 0;
+  padding: 8px 16px;
 }
 
 .sdoc-langs-list-container .sdoc-search-langs input {
-  max-height: 30px;
+  max-height: 32px;
+  font-size: 14px;
+  border-radius: 4px;
+  border: 1px solid rgba(0, 0, 0, 0.12);
+}
+
+.sdoc-langs-list-container .sdoc-search-langs input:focus {
+  border: 1px solid #3E84F7;
+  box-shadow: none;
+}
+
+
+.sdoc-langs-list-container .sdoc-search-langs input::placeholder {
+  color: #868e96;
   font-size: 14px;
 }
 
@@ -113,29 +127,30 @@
   overflow-y: auto;
   max-height: 280px;
   min-height: 100px;
-  padding: 10px 0;
+  padding: 0px 8px 8px;
+  margin-bottom: 0;
 }
 
 .sdoc-langs-list-container .langs-list-ul .langs-list-li {
   position: relative;
   white-space: nowrap;
   cursor: pointer;
-  line-height: 30px;
-  height: 30px;
-  font-size: 13px;
-  padding-left: 22px;
-  padding-right: 10px;
+  line-height: 32px;
+  height: 32px;
+  font-size: 14px;
+  padding-left: 12px;
+  padding-right: 12px;
   display: flex;
   justify-content: space-between;
 }
 
 .sdoc-langs-list-container .langs-list-ul .langs-list-li:hover {
-  background-color: #f5f5f5;
+  background-color: rgba(0, 0, 0, 0.04);
+  border-radius: 4px;
 }
 
 .sdoc-langs-list-container .langs-list-ul .langs-list-li .li-check-mark {
   opacity: 0;
-  padding: 0 10px;
 }
 
 .sdoc-langs-list-container .langs-list-ul .langs-list-li .li-checked {

package/dist/extension/plugins/embed-link/hover-menu/index.css

@@ -6,14 +6,15 @@
 }
 
 .sdoc-embed-link-hover-menu-container .hover-menu-container {
-  height: 36px;
+  height: 40px;
+  padding: 8px;
   background-color: #fff;
   display: flex;
   justify-content: flex-start;
   align-items: center;
-  border-radius: 3px;
-  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
-  border: 1px solid #e8e8e8;
+  border: 1px solid #eee;
+  border-radius: 8px;
+  box-shadow: 0 6px 14px 0 rgba(0, 0, 0, 0.10);
 }
 
 .sdoc-embed-link-hover-menu-container .hover-menu-container>span {

package/dist/extension/plugins/file-link/hover-menu/index.css

@@ -6,15 +6,15 @@
 }
 
 .sdoc-file-link-hover-menu-container .hover-menu-container {
-  height: 36px;
-  padding: 7px 8px;
+  height: 40px;
+  padding: 8px;
   background-color: #fff;
   display: flex;
   justify-content: flex-start;
   align-items: center;
-  border-radius: 3px;
-  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
-  border: 1px solid #e8e8e8;
+  border: 1px solid #eee;
+  border-radius: 8px;
+  box-shadow: 0 6px 14px 0 rgba(0, 0, 0, 0.1);
 }
 
 .sdoc-file-link-hover-menu-container .hover-menu-container>span:not(:last-of-type) {

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

@@ -119,7 +119,8 @@ var FontFamily = function FontFamily(_ref) {
     target: fontSizeButtonId
   }, t('Font')), !disabled && /*#__PURE__*/_react["default"].createElement(_reactstrap.UncontrolledPopover, {
     target: fontSizeButtonId,
-    className: "sdoc-menu-popover sdoc-dropdown-menu sdoc-font-size-menu-popover sdoc-font-family-menu-popover",
+    className: "sdoc-font-size-menu-popover sdoc-font-family-menu-popover",
+    popperClassName: "sdoc-popover-box-shadow",
     trigger: "legacy",
     placement: "bottom-start",
     hideArrow: true,
@@ -127,13 +128,15 @@ var FontFamily = function FontFamily(_ref) {
     fade: false,
     ref: popoverRef
   }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdoc-dropdown-menu-container sdoc-font-size-menu-container",
+    className: "sdoc-dropdown-menu sdoc-font-size-menu-container",
     style: {
       maxHeight: window.innerHeight - bottom - 100
     }
   }, Array.isArray(recentUsedFonts) && recentUsedFonts.length > 0 && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-dropdown-menu-title-name"
-  }, t('Recently_used')), recentUsedFonts.map(function (item, index) {
+  }, t('Recently_used')), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "sdoc-dropdown-menu-divider my-1"
+  }), recentUsedFonts.map(function (item, index) {
     var fontObject = _constants.FONT.find(function (font) {
       return font.name === item;
     });
@@ -144,15 +147,12 @@ var FontFamily = function FontFamily(_ref) {
       setFont: updateFont
     });
   }), /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdoc-dropdown-menu-divider"
+    className: "h-3"
   })), /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-dropdown-menu-title-name"
-  }, t('All_fonts')), fontList.map(function (item, index) {
-    if (item.type === 'divide') {
-      return /*#__PURE__*/_react["default"].createElement("div", {
-        className: "sdoc-dropdown-menu-divider"
-      });
-    }
+  }, t('All_fonts')), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "sdoc-dropdown-menu-divider my-1"
+  }), fontList.map(function (item, index) {
     return /*#__PURE__*/_react["default"].createElement(_fontItem["default"], {
       key: "".concat(index, "-all-font"),
       fontObject: item,

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

@@ -31,9 +31,9 @@
 
 .sdoc-font-size-menu-popover .sdoc-font-size-menu-container {
   height: fit-content;
-  overflow-y: scroll;
+  overflow-y: auto;
   overflow-x: hidden;
-  min-width: 80px;
+  min-width: 96px;
 }
 
 .sdoc-font-size-menu-popover .sdoc-dropdown-menu-item {

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

@@ -77,7 +77,8 @@ var FontSize = function FontSize(_ref) {
     target: fontSizeButtonId
   }, t('Font_size')), !disabled && /*#__PURE__*/_react["default"].createElement(_reactstrap.UncontrolledPopover, {
     target: fontSizeButtonId,
-    className: "sdoc-menu-popover sdoc-dropdown-menu sdoc-font-size-menu-popover",
+    className: "sdoc-font-size-menu-popover",
+    popperClassName: "sdoc-popover-box-shadow",
     trigger: "legacy",
     placement: "bottom-start",
     hideArrow: true,
@@ -85,7 +86,7 @@ var FontSize = function FontSize(_ref) {
     fade: false,
     ref: popoverRef
   }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdoc-dropdown-menu-container sdoc-font-size-menu-container",
+    className: "sdoc-dropdown-menu sdoc-font-size-menu-container",
     style: {
       maxHeight: window.innerHeight - bottom - 100
     }

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

@@ -7,16 +7,16 @@
 }
 
 .sdoc-formula-hover-menu-container .hover-menu-container {
-  height: 36px;
+  height: 40px;
   width: 100%;
-  padding: 7px 8px;
+  padding: 8px;
   background-color: #fff;
   display: flex;
   justify-content: space-around;
   align-items: center;
-  border-radius: 3px;
-  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
-  border: 1px solid #e8e8e8;
+  border: 1px solid #eee;
+  border-radius: 8px;
+  box-shadow: 0 6px 14px 0 rgba(0, 0, 0, 0.10);
   color: #212529;
 }
 

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

@@ -125,8 +125,6 @@ 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", {
@@ -154,7 +152,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

@@ -53,12 +53,10 @@
 .header-menu .header-popover {
   position: absolute;
   top: 42px;
-  left: 8px;
-  width: 180px;
+  left: -1px;
   background-color: #fff;
-  border: 1px solid #e5e6e8;
-  border-radius: 2px;
-  box-shadow: 0 0 10px #ccc;
+  border: 1px solid #eee;
+  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.1);
   border-radius: 8px;
   display: flex;
   flex-direction: column;

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

@@ -6,14 +6,14 @@
 }
 
 .sdoc-image-hover-menu-container .hover-menu-container {
-  height: 36px;
-  background-color: #fff;
+  height: 40px;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   border-radius: 3px;
-  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
-  border: 1px solid #e8e8e8;
+  background-color: #fff;
+  border: 1px solid #eee;
+  box-shadow: 0 6px 14px 0 rgba(0, 0, 0, 0.1);
 }
 
 .sdoc-image-hover-menu-container .hover-menu-container>span {
@@ -61,9 +61,9 @@
   top: 32px;
   left: 0px;
   background-color: #fff;
-  border: 1px solid #e5e6e8;
+  border: 1px solid #eee;
+  box-shadow: 0 6px 14px 0 rgba(0, 0, 0, 0.1);
   border-radius: 8px;
-  box-shadow: 0 0 10px #ccc;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -71,22 +71,18 @@
   white-space: nowrap;
 }
 
-.sdoc-image-hover-menu-container .sdoc-image-popover .sdoc-dropdown-menu-container .sdoc-dropdown-menu-item {
+.sdoc-image-hover-menu-container .sdoc-image-popover .sdoc-dropdown-menu-item {
   padding: 4px 12px 4px 38px;
 }
 
-.sdoc-image-hover-menu-container .sdoc-image-popover .sdoc-dropdown-menu-container .sdoc-check-mark {
+.sdoc-image-hover-menu-container .sdoc-image-popover .sdoc-check-mark {
   position: absolute;
   left: 12px;
   color: #666;
 }
 
 .sdoc-image-hover-menu-container .align-popover {
-  min-width: 80px;
-}
-
-.sdoc-image-hover-menu-container .align-popover .sdoc-dropdown-menu-container {
-  min-width: 80px;
+  min-width: 96px;
 }
 
 .sdoc-image-hover-menu-container .border-popover {
@@ -96,10 +92,16 @@
   padding: 0 8px;
 }
 
-.sdoc-image-hover-menu-container .border-popover .sdoc-dropdown-menu-item .sdoc-dropdown-item-content .sdoc-check-mark {
-  transform: translateX(-24px);
+.sdoc-image-hover-menu-container .border-popover .sdoc-dropdown-menu-item {
+  padding: 0 12px;
 }
 
 .sdoc-image-hover-menu-container .border-popover .sdoc-dropdown-menu-item:hover {
   background-color: transparent;
 }
+
+.sdoc-image-hover-menu-container .border-popover .sdoc-dropdown-menu-item .sdoc-dropdown-item-content .sdoc-check-mark {
+  position: relative;
+  left: auto;
+  transform: translateX(-24px);
+}

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

@@ -192,8 +192,6 @@ 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,
@@ -208,7 +206,7 @@ var ImageHoverMenu = function ImageHoverMenu(_ref) {
     }, /*#__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,8 +222,6 @@ 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,
@@ -242,7 +238,7 @@ var ImageHoverMenu = function ImageHoverMenu(_ref) {
     }), 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', {