@seafile/sdoc-editor 3.0.184 → 3.0.186

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (50) hide show
  1. package/dist/assets/css/dropdown-menu.css +6 -8
  2. package/dist/assets/css/popover.css +3 -0
  3. package/dist/assets/css/sdoc-editor-plugins.css +1 -1
  4. package/dist/comment/components/global-comment/index.css +6 -2
  5. package/dist/extension/commons/color-menu/index.css +6 -5
  6. package/dist/extension/commons/color-menu/index.js +6 -4
  7. package/dist/extension/commons/more-dropdown/index.js +2 -1
  8. package/dist/extension/plugins/ai/ai-module/adjust-sub-menu.js +5 -3
  9. package/dist/extension/plugins/ai/ai-module/lang-sub-menu.js +5 -3
  10. package/dist/extension/plugins/ai/ai-module/style.css +4 -13
  11. package/dist/extension/plugins/callout/render-elem/callout-hover-menu/style.css +4 -3
  12. package/dist/extension/plugins/code-block/hover-menu/index.css +42 -27
  13. package/dist/extension/plugins/embed-link/hover-menu/index.css +5 -4
  14. package/dist/extension/plugins/file-link/hover-menu/index.css +5 -5
  15. package/dist/extension/plugins/font/menu/font-family/index.js +10 -10
  16. package/dist/extension/plugins/font/menu/font-size/index.css +2 -2
  17. package/dist/extension/plugins/font/menu/font-size/index.js +3 -2
  18. package/dist/extension/plugins/formula/hover-menu/index.css +5 -5
  19. package/dist/extension/plugins/header/menu/index.js +1 -3
  20. package/dist/extension/plugins/header/menu/style.css +4 -5
  21. package/dist/extension/plugins/image/hover-menu/index.css +17 -15
  22. package/dist/extension/plugins/image/hover-menu/index.js +2 -6
  23. package/dist/extension/plugins/image/menu/index.js +3 -2
  24. package/dist/extension/plugins/link/hover/index.css +5 -5
  25. package/dist/extension/plugins/sdoc-link/hover-menu/index.css +5 -5
  26. package/dist/extension/plugins/table/menu/color-selector-popover/index.js +1 -1
  27. package/dist/extension/plugins/table/menu/horizontal-align-popover/index.js +2 -3
  28. package/dist/extension/plugins/table/menu/vertical-align-popover/index.js +2 -3
  29. package/dist/extension/plugins/table/menu/vertical-align-popover/style.css +1 -5
  30. package/dist/extension/plugins/table/popover/table-size-popover/index.css +24 -35
  31. package/dist/extension/plugins/table/popover/table-size-popover/index.js +3 -3
  32. package/dist/extension/plugins/table/popover/table-template/index.js +2 -2
  33. package/dist/extension/plugins/text-align/menu/index.css +3 -2
  34. package/dist/extension/plugins/text-align/menu/index.js +3 -2
  35. package/dist/extension/plugins/video/hover-menu/index.css +5 -5
  36. package/dist/extension/plugins/video/menu/index.js +3 -2
  37. package/dist/extension/plugins/whiteboard/hover-menu/index.css +5 -4
  38. package/dist/extension/plugins/whiteboard/menu/index.js +3 -2
  39. package/dist/extension/toolbar/header-toolbar/insert-toolbar/index.js +5 -3
  40. package/dist/extension/toolbar/insert-element-toolbar/index.js +7 -4
  41. package/dist/extension/toolbar/insert-element-toolbar/style.css +1 -0
  42. package/dist/extension/toolbar/linked-repo-popover/index.js +2 -1
  43. package/dist/extension/toolbar/linked-repo-popover/link-repo-list.js +1 -1
  44. package/dist/extension/toolbar/side-toolbar/insert-below-menu.js +3 -2
  45. package/dist/extension/toolbar/side-toolbar/insert-block-menu.js +3 -2
  46. package/dist/extension/toolbar/side-toolbar/side-menu.css +26 -7
  47. package/dist/extension/toolbar/side-toolbar/side-menu.js +7 -4
  48. package/dist/extension/toolbar/side-toolbar/transform-menus.js +3 -2
  49. package/dist/layout/editor-container.js +1 -0
  50. package/package.json +3 -3
@@ -192,8 +192,6 @@ var ImageHoverMenu = function ImageHoverMenu(_ref) {
192
192
  className: "sdocfont sdoc-arrow-down"
193
193
  }), popoverState.displayPopover && /*#__PURE__*/_react["default"].createElement("div", {
194
194
  className: "sdoc-image-popover sdoc-dropdown-menu"
195
- }, /*#__PURE__*/_react["default"].createElement("div", {
196
- className: "sdoc-dropdown-menu-container"
197
195
  }, _constants2.IMAGE_DISPLAY_TYPE.map(function (item) {
198
196
  return /*#__PURE__*/_react["default"].createElement("div", {
199
197
  key: item.value,
@@ -208,7 +206,7 @@ var ImageHoverMenu = function ImageHoverMenu(_ref) {
208
206
  }, /*#__PURE__*/_react["default"].createElement("span", null, t(item.text)), type === item.value && /*#__PURE__*/_react["default"].createElement("i", {
209
207
  className: "sdocfont sdoc-check-mark sdoc-dropdown-item-right-icon"
210
208
  }));
211
- }))))), !readonly && /*#__PURE__*/_react["default"].createElement("span", {
209
+ })))), !readonly && /*#__PURE__*/_react["default"].createElement("span", {
212
210
  className: "op-group-item"
213
211
  }, type === _constants.IMAGE_BLOCK && /*#__PURE__*/_react["default"].createElement("span", {
214
212
  role: "button",
@@ -224,8 +222,6 @@ var ImageHoverMenu = function ImageHoverMenu(_ref) {
224
222
  className: "sdocfont sdoc-arrow-down"
225
223
  }), popoverState.alignPopover && /*#__PURE__*/_react["default"].createElement("div", {
226
224
  className: "sdoc-image-popover align-popover sdoc-dropdown-menu"
227
- }, /*#__PURE__*/_react["default"].createElement("div", {
228
- className: "sdoc-dropdown-menu-container"
229
225
  }, _constants.MENUS_CONFIG_MAP[_constants.TEXT_ALIGN].map(function (item) {
230
226
  return /*#__PURE__*/_react["default"].createElement("div", {
231
227
  key: item.id,
@@ -242,7 +238,7 @@ var ImageHoverMenu = function ImageHoverMenu(_ref) {
242
238
  }), align === item.type && /*#__PURE__*/_react["default"].createElement("i", {
243
239
  className: "sdocfont sdoc-check-mark"
244
240
  }));
245
- })))), /*#__PURE__*/_react["default"].createElement("span", {
241
+ }))), /*#__PURE__*/_react["default"].createElement("span", {
246
242
  id: "sdoc_image_border",
247
243
  role: "button",
248
244
  className: (0, _classnames["default"])('op-item', {
@@ -56,12 +56,13 @@ var ImageMenu = function ImageMenu(_ref) {
56
56
  })), !disabled && /*#__PURE__*/_react["default"].createElement(_reactstrap.UncontrolledPopover, {
57
57
  target: menuConfig.id,
58
58
  trigger: "hover",
59
- className: "sdoc-menu-popover sdoc-dropdown-menu sdoc-sub-dropdown-menu sdoc-insert-image-menu-popover",
59
+ className: "sdoc-sub-dropdown-menu sdoc-insert-image-menu-popover",
60
+ popperClassName: "sdoc-popover-box-shadow",
60
61
  placement: "right-start",
61
62
  hideArrow: true,
62
63
  fade: false
63
64
  }, /*#__PURE__*/_react["default"].createElement("div", {
64
- className: "sdoc-insert-image-menu-popover-container sdoc-dropdown-menu-container"
65
+ className: "sdoc-insert-image-menu-popover-container sdoc-dropdown-menu"
65
66
  }, /*#__PURE__*/_react["default"].createElement("div", {
66
67
  className: "sdoc-dropdown-menu-item",
67
68
  onClick: openInsertLocalImage
@@ -1,12 +1,12 @@
1
1
  .link-op-menu {
2
- height: 36px;
3
- padding: 7px 8px;
2
+ height: 40px;
3
+ padding: 8px;
4
4
  display: flex;
5
5
  position: absolute;
6
6
  background-color: #fff;
7
- border: 1px solid #e5e5e5;
8
- border-radius: 3px;
9
- box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
7
+ border: 1px solid #eee;
8
+ border-radius: 8px;
9
+ box-shadow: 0 6px 14px 0 rgba(0, 0, 0, 0.1);
10
10
  z-index: 101;
11
11
  }
12
12
 
@@ -6,15 +6,15 @@
6
6
  }
7
7
 
8
8
  .sdoc-link-hover-menu-container .hover-menu-container {
9
- height: 36px;
10
- padding: 7px 8px;
9
+ height: 40px;
10
+ padding: 8px;
11
11
  background-color: #fff;
12
12
  display: flex;
13
13
  justify-content: flex-start;
14
14
  align-items: center;
15
- border-radius: 3px;
16
- box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
17
- border: 1px solid #e8e8e8;
15
+ border: 1px solid #eee;
16
+ border-radius: 8px;
17
+ box-shadow: 0 6px 14px 0 rgba(0, 0, 0, 0.10);
18
18
  }
19
19
 
20
20
  .sdoc-link-hover-menu-container .hover-menu-container>span:not(:last-of-type) {
@@ -108,7 +108,7 @@ var ColorSelectorPopover = function ColorSelectorPopover(_ref) {
108
108
  }, /*#__PURE__*/_react["default"].createElement("div", {
109
109
  className: "sdoc-dropdown-menu sdoc-color-dropdown-menu"
110
110
  }, /*#__PURE__*/_react["default"].createElement("div", {
111
- className: "p-3 d-flex flex-column"
111
+ className: "py-3 d-flex flex-column"
112
112
  }, /*#__PURE__*/_react["default"].createElement("div", {
113
113
  className: "sdoc-color-no-color-container"
114
114
  }, /*#__PURE__*/_react["default"].createElement("div", {
@@ -37,13 +37,12 @@ var HorizontalAlignPopover = function HorizontalAlignPopover(_ref) {
37
37
  target: target.current,
38
38
  trigger: "hover",
39
39
  placement: "right-start",
40
+ popperClassName: "sdoc-popover-box-shadow",
40
41
  hideArrow: true,
41
42
  fade: false,
42
43
  offset: [0, 8]
43
44
  }, /*#__PURE__*/_react["default"].createElement("div", {
44
45
  className: "sdoc-dropdown-menu sdoc-table-alignment-menu"
45
- }, /*#__PURE__*/_react["default"].createElement("div", {
46
- className: "sdoc-dropdown-menu-container"
47
46
  }, /*#__PURE__*/_react["default"].createElement("div", {
48
47
  className: "sdoc-dropdown-menu-item",
49
48
  onMouseDown: function onMouseDown() {
@@ -73,6 +72,6 @@ var HorizontalAlignPopover = function HorizontalAlignPopover(_ref) {
73
72
  className: (0, _classnames["default"])('sdocfont sdoc-check-mark', {
74
73
  active: horizontalAlign === 'right'
75
74
  })
76
- }), /*#__PURE__*/_react["default"].createElement("span", null, t('Right'))))));
75
+ }), /*#__PURE__*/_react["default"].createElement("span", null, t('Right')))));
77
76
  };
78
77
  var _default = exports["default"] = HorizontalAlignPopover;
@@ -39,13 +39,12 @@ var VerticalAlignPopover = function VerticalAlignPopover(_ref) {
39
39
  target: target.current,
40
40
  trigger: "hover",
41
41
  placement: "right-start",
42
+ popperClassName: "sdoc-popover-box-shadow",
42
43
  hideArrow: true,
43
44
  fade: false,
44
45
  offset: [0, 8]
45
46
  }, /*#__PURE__*/_react["default"].createElement("div", {
46
47
  className: "sdoc-dropdown-menu sdoc-table-alignment-menu"
47
- }, /*#__PURE__*/_react["default"].createElement("div", {
48
- className: "sdoc-dropdown-menu-container"
49
48
  }, /*#__PURE__*/_react["default"].createElement("div", {
50
49
  className: "sdoc-dropdown-menu-item",
51
50
  onMouseDown: function onMouseDown() {
@@ -75,6 +74,6 @@ var VerticalAlignPopover = function VerticalAlignPopover(_ref) {
75
74
  className: (0, _classnames["default"])('sdocfont sdoc-check-mark', {
76
75
  active: verticalAlign === 'flex-end'
77
76
  })
78
- }), /*#__PURE__*/_react["default"].createElement("span", null, t('Bottom_align'))))));
77
+ }), /*#__PURE__*/_react["default"].createElement("span", null, t('Bottom_align')))));
79
78
  };
80
79
  var _default = exports["default"] = VerticalAlignPopover;
@@ -4,11 +4,7 @@
4
4
  }
5
5
 
6
6
  .sdoc-table-alignment-menu {
7
- min-width: 80px !important;
8
- }
9
-
10
- .sdoc-table-alignment-menu .sdoc-dropdown-menu-container {
11
- min-width: 80px !important;
7
+ min-width: 96px !important;
12
8
  }
13
9
 
14
10
  .sdoc-table-alignment-menu .sdoc-dropdown-menu-item {
@@ -1,20 +1,29 @@
1
- .sdoc-selected-table-size-popover .popover {
2
- background-color: #fff;
3
- min-width: 100px;
4
- min-height: 100px;
5
- max-width: 222px;
6
- border-radius: 8px;
1
+ .sdoc-selected-table-size-container .sdoc-selected-table-tools-container {
2
+ padding-bottom: 8px;
3
+ margin-bottom: 8px;
4
+ border-bottom: 1px solid #eee;
7
5
  }
8
6
 
9
- .sdoc-selected-table-size-popover .sdoc-selected-table-size-tip {
10
- text-align: center;
11
- height: 35px;
7
+ .sdoc-selected-table-size-popover .sdoc-selected-table-size-custom {
8
+ display: flex;
9
+ justify-content: space-between;
10
+ align-items: center;
11
+ padding: 0 12px;
12
+ min-height: 32px;
13
+ }
14
+
15
+ .sdoc-selected-table-size-popover .sdoc-selected-table-size-custom:hover {
16
+ cursor: pointer;
17
+ background: #f5f5f5;
18
+ border-radius: 4px;
19
+ }
20
+
21
+ .sdoc-selected-table-size-popover .sdoc-selected-table-size-custom .sdocfont {
12
22
  font-size: 14px;
13
- padding: 5px 10px 10px;
14
23
  }
15
24
 
16
25
  .sdoc-selected-table-size-popover .sdoc-table-size-select {
17
- padding: 0 10px;
26
+ padding: 0 12px;
18
27
  }
19
28
 
20
29
  .sdoc-selected-table-size-popover .sdoc-table-size-row {
@@ -41,29 +50,9 @@
41
50
  background-color: #ffa94d;
42
51
  }
43
52
 
44
- .sdoc-selected-table-size-popover .sdoc-table-size-select {
45
- margin-top: 5px;
46
- }
47
-
48
- .sdoc-selected-table-size-container .sdoc-selected-table-tools-container {
49
- padding: 10px 0;
50
- margin-bottom: 10px;
51
- border-bottom: 1px solid #eee;
52
- }
53
-
54
- .sdoc-selected-table-size-popover .sdoc-selected-table-size-custom {
55
- display: flex;
56
- justify-content: space-between;
57
- align-items: center;
58
- padding: 0 10px;
59
- min-height: 32px;
60
- }
61
-
62
- .sdoc-selected-table-size-popover .sdoc-selected-table-size-custom:hover {
63
- cursor: pointer;
64
- background: #f5f5f5;
65
- }
66
-
67
- .sdoc-selected-table-size-popover .sdoc-selected-table-size-custom .sdocfont {
53
+ .sdoc-selected-table-size-popover .sdoc-selected-table-size-tip {
54
+ text-align: center;
55
+ height: 35px;
68
56
  font-size: 14px;
57
+ padding: 8px 12px 8px;
69
58
  }
@@ -225,16 +225,16 @@ var TableSizePopover = function TableSizePopover(_ref) {
225
225
  }, [displaySize, selectedSize]);
226
226
  return /*#__PURE__*/_react["default"].createElement(_reactstrap.UncontrolledPopover, {
227
227
  target: target,
228
- className: "sdoc-selected-table-size-popover sdoc-sub-dropdown-menu sdoc-dropdown-menu",
228
+ className: "sdoc-selected-table-size-popover sdoc-sub-dropdown-menu",
229
229
  trigger: trigger,
230
230
  placement: placement,
231
231
  hideArrow: true,
232
232
  fade: false,
233
233
  ref: ref,
234
- popperClassName: popperClassName,
234
+ popperClassName: "".concat(popperClassName, " sdoc-popover-box-shadow"),
235
235
  offset: offset
236
236
  }, /*#__PURE__*/_react["default"].createElement("div", {
237
- className: "sdoc-selected-table-size-container w-100 h-100 d-flex flex-column"
237
+ className: "sdoc-dropdown-menu sdoc-selected-table-size-container w-100 h-100 d-flex flex-column"
238
238
  }, /*#__PURE__*/_react["default"].createElement("div", {
239
239
  className: "sdoc-selected-table-tools-container"
240
240
  }, /*#__PURE__*/_react["default"].createElement(MenuItem, {
@@ -118,9 +118,9 @@ var TableTemplate = function TableTemplate(_ref) {
118
118
  fade: false,
119
119
  className: "sdoc-sub-dropdown-menu sdoc-table-template-popover",
120
120
  innerClassName: "sdoc-table-template-inner-popover",
121
- popperClassName: "sdoc-table-template-popover-wrapper",
121
+ popperClassName: "sdoc-table-template-popover-wrapper sdoc-popover-box-shadow",
122
122
  ref: ref,
123
- offset: [0, 0]
123
+ offset: [0, 8]
124
124
  }, tableTemplatePreviewList.map(function (alternateColor, index) {
125
125
  return /*#__PURE__*/_react["default"].createElement(_sampleTable["default"], {
126
126
  key: alternateColor + index,
@@ -1,5 +1,5 @@
1
- .sdoc-text-align-dropdown .sdoc-dropdown-menu-container {
2
- min-width: 80px !important;
1
+ .sdoc-text-align-dropdown .sdoc-dropdown-menu {
2
+ min-width: 96px !important;
3
3
  }
4
4
 
5
5
  .sdoc-text-align-dropdown .sdocfont.sdoc-check-mark {
@@ -11,4 +11,5 @@
11
11
  .sdoc-text-align-dropdown .sdoc-dropdown-menu-item {
12
12
  font-size: 14px;
13
13
  padding: 4px 12px 4px 38px;
14
+ position: relative;
14
15
  }
@@ -78,7 +78,8 @@ var TextAlignMenu = function TextAlignMenu(_ref) {
78
78
  target: buttonId
79
79
  }, t('Alignment_type')), !disabled && /*#__PURE__*/_react["default"].createElement(_reactstrap.UncontrolledPopover, {
80
80
  target: buttonId,
81
- className: "sdoc-menu-popover sdoc-dropdown-menu sdoc-text-align-dropdown",
81
+ className: "sdoc-text-align-dropdown",
82
+ popperClassName: "sdoc-popover-box-shadow",
82
83
  trigger: "legacy",
83
84
  placement: "bottom-start",
84
85
  hideArrow: true,
@@ -86,7 +87,7 @@ var TextAlignMenu = function TextAlignMenu(_ref) {
86
87
  fade: false,
87
88
  ref: popoverRef
88
89
  }, /*#__PURE__*/_react["default"].createElement("div", {
89
- className: "sdoc-dropdown-menu-container pt-2 pb-2"
90
+ className: "sdoc-dropdown-menu pt-2 pb-2"
90
91
  }, _constants.MENUS_CONFIG_MAP[_constants.TEXT_ALIGN].map(function (item, index) {
91
92
  var isSelected = curType === item.id;
92
93
  return /*#__PURE__*/_react["default"].createElement("div", {
@@ -6,15 +6,15 @@
6
6
  }
7
7
 
8
8
  .video-hover-menu-container .hover-menu-container {
9
- height: 36px;
10
- padding: 7px 8px;
9
+ height: 40px;
10
+ padding: 8px;
11
11
  background-color: #fff;
12
12
  display: flex;
13
13
  justify-content: flex-start;
14
14
  align-items: center;
15
- border-radius: 3px;
16
- box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
17
- border: 1px solid #e8e8e8;
15
+ border: 1px solid #eee;
16
+ border-radius: 8px;
17
+ box-shadow: 0 6px 14px 0 rgba(0, 0, 0, 0.10);
18
18
  }
19
19
 
20
20
  .video-hover-menu-container .hover-menu-container>span:not(:last-of-type) {
@@ -53,12 +53,13 @@ var VideoMenu = function VideoMenu(_ref) {
53
53
  })), !disabled && /*#__PURE__*/_react["default"].createElement(_reactstrap.UncontrolledPopover, {
54
54
  target: menuConfig.id,
55
55
  trigger: "hover",
56
- className: "sdoc-menu-popover sdoc-dropdown-menu sdoc-sub-dropdown-menu sdoc-insert-video-menu-popover",
56
+ className: "sdoc-sub-dropdown-menu sdoc-insert-video-menu-popover",
57
+ popperClassName: "sdoc-popover-box-shadow",
57
58
  placement: "right-start",
58
59
  hideArrow: true,
59
60
  fade: false
60
61
  }, /*#__PURE__*/_react["default"].createElement("div", {
61
- className: "sdoc-insert-video-menu-popover-container sdoc-dropdown-menu-container"
62
+ className: "sdoc-insert-video-menu-popover-container sdoc-dropdown-menu"
62
63
  }, /*#__PURE__*/_react["default"].createElement("div", {
63
64
  className: "sdoc-dropdown-menu-item",
64
65
  onClick: openLocalVideoDialog
@@ -6,14 +6,15 @@
6
6
  }
7
7
 
8
8
  .sdoc-whiteboard-hover-menu-container .hover-menu-container {
9
- height: 36px;
9
+ height: 40px;
10
+ padding: 8px;
10
11
  background-color: #fff;
11
12
  display: flex;
12
13
  justify-content: flex-start;
13
14
  align-items: center;
14
- border-radius: 3px;
15
- box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
16
- border: 1px solid #e8e8e8;
15
+ border: 1px solid #eee;
16
+ border-radius: 8px;
17
+ box-shadow: 0 6px 14px 0 rgba(0, 0, 0, 0.10);
17
18
  }
18
19
 
19
20
  .sdoc-whiteboard-hover-menu-container .hover-menu-container>span {
@@ -42,12 +42,13 @@ var WhiteboardMenu = function WhiteboardMenu(_ref) {
42
42
  })), !disabled && /*#__PURE__*/_react["default"].createElement(_reactstrap.UncontrolledPopover, {
43
43
  target: menuConfig.id,
44
44
  trigger: "hover",
45
- className: "sdoc-menu-popover sdoc-dropdown-menu sdoc-sub-dropdown-menu sdoc-insert-whiteboard-menu-popover",
45
+ className: "sdoc-sub-dropdown-menu sdoc-insert-whiteboard-menu-popover",
46
+ popperClassName: "sdoc-popover-box-shadow",
46
47
  placement: "right-start",
47
48
  hideArrow: true,
48
49
  fade: false
49
50
  }, /*#__PURE__*/_react["default"].createElement("div", {
50
- className: "sdoc-insert-whiteboard-menu-popover-container sdoc-dropdown-menu-container"
51
+ className: "sdoc-insert-whiteboard-menu-popover-container sdoc-dropdown-menu"
51
52
  }, /*#__PURE__*/_react["default"].createElement("div", {
52
53
  className: "sdoc-dropdown-menu-item",
53
54
  onClick: openSelectWhiteboardFileDialog
@@ -92,15 +92,17 @@ var InsertToolbar = function InsertToolbar(_ref) {
92
92
  target: insertToolbarId
93
93
  }, t('Insert')), !disabled && /*#__PURE__*/_react["default"].createElement(_reactstrap.UncontrolledPopover, {
94
94
  target: insertToolbarId,
95
- className: "sdoc-menu-popover sdoc-dropdown-menu sdoc-insert-menu-popover",
95
+ className: "sdoc-insert-menu-popover",
96
+ popperClassName: "sdoc-popover-box-shadow",
96
97
  trigger: "legacy",
97
98
  placement: "bottom-start",
98
99
  hideArrow: true,
99
100
  toggle: toggle,
100
101
  fade: false,
101
- ref: popoverRef
102
+ ref: popoverRef,
103
+ offset: [-9, 8]
102
104
  }, /*#__PURE__*/_react["default"].createElement("div", {
103
- className: "sdoc-insert-menu-container sdoc-dropdown-menu-container",
105
+ className: "sdoc-insert-menu-container sdoc-dropdown-menu",
104
106
  style: {
105
107
  maxHeight: window.innerHeight - bottom - 100
106
108
  }
@@ -391,13 +391,14 @@ var QuickInsertBlockMenu = function QuickInsertBlockMenu(_ref) {
391
391
  }), /*#__PURE__*/_react["default"].createElement(_reactstrap.UncontrolledPopover, {
392
392
  target: "sdoc-side-menu-item-video",
393
393
  trigger: "hover",
394
- className: "sdoc-menu-popover sdoc-dropdown-menu sdoc-sub-dropdown-menu sdoc-insert-video-menu-popover",
394
+ className: "sdoc-dropdown-menu sdoc-sub-dropdown-menu sdoc-insert-video-menu-popover",
395
+ popperClassName: "sdoc-popover-box-shadow",
395
396
  placement: "right-start",
396
397
  hideArrow: true,
397
398
  fade: false,
398
399
  offset: [0, 6]
399
400
  }, /*#__PURE__*/_react["default"].createElement("div", {
400
- className: "sdoc-insert-video-menu-popover-container sdoc-dropdown-menu-container"
401
+ className: "sdoc-insert-video-menu-popover-container"
401
402
  }, /*#__PURE__*/_react["default"].createElement("div", {
402
403
  className: "sdoc-dropdown-menu-item",
403
404
  onClick: onInsertVideoToggle
@@ -619,7 +620,7 @@ var QuickInsertBlockMenu = function QuickInsertBlockMenu(_ref) {
619
620
  onChange(e);
620
621
  }, [onChange]);
621
622
  return /*#__PURE__*/_react["default"].createElement("div", {
622
- className: "sdoc-dropdown-menu-container sdoc-insert-element-toolbar"
623
+ className: "sdoc-insert-element-toolbar"
623
624
  }, /*#__PURE__*/_react["default"].createElement("div", {
624
625
  className: "sdoc-side-menu-search-wrapper"
625
626
  }, /*#__PURE__*/_react["default"].createElement(_reactstrap.Input, {
@@ -631,10 +632,12 @@ var QuickInsertBlockMenu = function QuickInsertBlockMenu(_ref) {
631
632
  })), /*#__PURE__*/_react["default"].createElement("div", {
632
633
  className: "sdoc-insert-element-content-wrapper",
633
634
  ref: downDownWrapperRef
635
+ }, /*#__PURE__*/_react["default"].createElement("div", {
636
+ className: "sdoc-side-menu-inner-container"
634
637
  }, Object.keys(dropDownItems).map(function (key) {
635
638
  return dropDownItems[key];
636
639
  }), Object.keys(quickInsertMenuSearchMap).length === 0 && /*#__PURE__*/_react["default"].createElement("div", {
637
640
  className: "sdoc-dropdown-menu-item-no-results"
638
- }, t('No_results'))));
641
+ }, t('No_results')))));
639
642
  };
640
643
  var _default = exports["default"] = (0, _reactI18next.withTranslation)('sdoc-editor')(QuickInsertBlockMenu);
@@ -5,4 +5,5 @@
5
5
  .sdoc-insert-element-toolbar .sdoc-insert-element-content-wrapper {
6
6
  max-height: 278px;
7
7
  overflow-y: auto;
8
+ padding: 0 8px 8px;
8
9
  }
@@ -26,7 +26,8 @@ function LinkRepoPopover(_ref) {
26
26
  return /*#__PURE__*/_react["default"].createElement(_reactstrap.UncontrolledPopover, {
27
27
  target: "sdoc-side-menu-item-file-view",
28
28
  trigger: "hover",
29
- className: "sdoc-menu-popover sdoc-dropdown-menu sdoc-sub-dropdown-menu sdoc-insert-menu-file-view-popover",
29
+ className: "sdoc-sub-dropdown-menu sdoc-insert-menu-file-view-popover",
30
+ popperClassName: "sdoc-popover-box-shadow",
30
31
  placement: placement,
31
32
  hideArrow: true,
32
33
  fade: false
@@ -27,7 +27,7 @@ var LinkedRepoList = function LinkedRepoList(_ref) {
27
27
  }, []);
28
28
  return /*#__PURE__*/_react["default"].createElement("div", {
29
29
  ref: repoRef,
30
- className: "sdoc-dropdown-menu-container sdoc-linked-repo-list-wrapper"
30
+ className: "sdoc-dropdown-menu sdoc-linked-repo-list-wrapper"
31
31
  }, /*#__PURE__*/_react["default"].createElement("div", {
32
32
  className: "sdoc-linked-repo-list-tip"
33
33
  }, t('Show_files_from_a_linked_library')), /*#__PURE__*/_react["default"].createElement("div", {
@@ -15,14 +15,15 @@ var InsertBelowMenu = function InsertBelowMenu(_ref) {
15
15
  return /*#__PURE__*/_react["default"].createElement(_reactstrap.UncontrolledPopover, {
16
16
  boundariesElement: "viewport",
17
17
  target: target,
18
- className: "sdoc-side-menu-insert-below-popover sdoc-sub-dropdown-menu sdoc-dropdown-menu",
18
+ className: "sdoc-side-menu-insert-below-popover sdoc-sub-dropdown-menu",
19
+ popperClassName: "sdoc-popover-box-shadow",
19
20
  trigger: "hover",
20
21
  placement: "right-start",
21
22
  hideArrow: true,
22
23
  fade: false,
23
24
  offset: [0, 6]
24
25
  }, /*#__PURE__*/_react["default"].createElement("div", {
25
- className: "sdoc-dropdown-menu-container"
26
+ className: "sdoc-dropdown-menu"
26
27
  }, /*#__PURE__*/_react["default"].createElement(_insertBlockMenu["default"], {
27
28
  insertPosition: _constants.INSERT_POSITION.AFTER,
28
29
  slateNode: slateNode
@@ -224,13 +224,14 @@ var InsertBlockMenu = function InsertBlockMenu(_ref) {
224
224
  }), /*#__PURE__*/_react["default"].createElement(_reactstrap.UncontrolledPopover, {
225
225
  target: "sdoc-side-menu-item-video",
226
226
  trigger: "hover",
227
- className: "sdoc-menu-popover sdoc-dropdown-menu sdoc-sub-dropdown-menu sdoc-insert-video-menu-popover",
227
+ className: "sdoc-sub-dropdown-menu sdoc-insert-video-menu-popover",
228
+ popperClassName: "sdoc-popover-box-shadow",
228
229
  placement: "right-start",
229
230
  hideArrow: true,
230
231
  fade: false,
231
232
  offset: [0, 6]
232
233
  }, /*#__PURE__*/_react["default"].createElement("div", {
233
- className: "sdoc-insert-video-menu-popover-container sdoc-dropdown-menu-container"
234
+ className: "sdoc-insert-video-menu-popover-container sdoc-dropdown-menu"
234
235
  }, /*#__PURE__*/_react["default"].createElement("div", {
235
236
  className: "sdoc-dropdown-menu-item",
236
237
  onClick: onInsertVideoToggle
@@ -3,26 +3,45 @@
3
3
  }
4
4
 
5
5
  .sdoc-side-menu {
6
+ padding: 0;
6
7
  position: absolute;
7
- width: 200px;
8
8
  background-color: #fff;
9
- border: 1px solid rgba(0, 0, 0, .12);
10
- border-radius: 4px;
9
+ border: 1px solid #eee;
10
+ border-radius: 8px;
11
+ box-shadow: 0 6px 14px 0px rgba(0, 0, 0, .1);
11
12
  transform: translateX(-200px);
12
- box-shadow: 0 2px 12px 2px rgba(68, 73, 77, .16);
13
13
  z-index: 999;
14
14
  }
15
15
 
16
16
  .sdoc-side-menu .sdoc-side-menu-search-wrapper {
17
- padding: 12px;
17
+ padding: 8px 16px 8px;
18
18
  }
19
19
 
20
20
  .sdoc-side-menu .sdoc-side-menu-search-wrapper input {
21
- max-height: 30px;
21
+ max-height: 32px;
22
+ font-size: 14px;
23
+ }
24
+
25
+ .sdoc-side-menu .sdoc-side-menu-search-wrapper input {
26
+ max-height: 32px;
27
+ font-size: 14px;
28
+ border-radius: 4px;
29
+ border: 1px solid rgba(0, 0, 0, 0.12);
30
+ }
31
+
32
+ .sdoc-side-menu .sdoc-side-menu-search-wrapper input:focus {
33
+ border: 1px solid #3E84F7;
34
+ box-shadow: none;
35
+ }
36
+
37
+
38
+ .sdoc-side-menu .sdoc-side-menu-search-wrapper input::placeholder {
39
+ color: #868e96;
22
40
  font-size: 14px;
23
41
  }
24
42
 
25
43
  .sdoc-side-menu .sdoc-side-menu-insert-wrapper {
44
+ padding: 0 8px 8px;
26
45
  max-height: 278px;
27
46
  overflow-y: auto;
28
47
  }
@@ -34,6 +53,6 @@
34
53
  cursor: pointer;
35
54
  }
36
55
 
37
- .sdoc-side-menu-insert-below-popover .sdoc-dropdown-menu-container {
56
+ .sdoc-side-menu-insert-below-popover .sdoc-dropdown-menu {
38
57
  overflow: auto;
39
58
  }
@@ -160,8 +160,6 @@ var SideMenu = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
160
160
  }, /*#__PURE__*/_react["default"].createElement("div", {
161
161
  className: "sdoc-side-menu sdoc-dropdown-menu",
162
162
  ref: sideMenuRef
163
- }, /*#__PURE__*/_react["default"].createElement("div", {
164
- className: "sdoc-dropdown-menu-container"
165
163
  }, /*#__PURE__*/_react["default"].createElement("div", {
166
164
  className: "sdoc-side-menu-search-wrapper"
167
165
  }, /*#__PURE__*/_react["default"].createElement(_reactstrap.Input, {
@@ -173,11 +171,16 @@ var SideMenu = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
173
171
  })), isNodeEmpty && /*#__PURE__*/_react["default"].createElement("div", {
174
172
  id: "sdoc-side-menu-insert-wrapper",
175
173
  className: "sdoc-side-menu-insert-wrapper"
174
+ }, /*#__PURE__*/_react["default"].createElement("div", {
175
+ className: "sdoc-side-menu-inner-container"
176
176
  }, /*#__PURE__*/_react["default"].createElement(_insertBlockMenu["default"], {
177
177
  isNodeEmpty: isNodeEmpty,
178
178
  slateNode: slateNode,
179
179
  insertMenuSearchMap: insertMenuSearchMap
180
- })), !isNodeEmpty && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, transformMenuSearchMap['searching'] && isDisplayCategoryTitle(transformMenuSearchMap, insertBelowMenuSearchMap) && /*#__PURE__*/_react["default"].createElement(_dropdownMenuItem["default"], {
180
+ }))), !isNodeEmpty && /*#__PURE__*/_react["default"].createElement("div", {
181
+ id: "sdoc-side-menu-insert-wrapper",
182
+ className: "sdoc-side-menu-insert-wrapper"
183
+ }, transformMenuSearchMap['searching'] && isDisplayCategoryTitle(transformMenuSearchMap, insertBelowMenuSearchMap) && /*#__PURE__*/_react["default"].createElement(_dropdownMenuItem["default"], {
181
184
  menuConfig: {
182
185
  text: 'Transform_to'
183
186
  },
@@ -263,6 +266,6 @@ var SideMenu = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
263
266
  isHidden: !otherOperatonsMenuSearchMap['DELETE']
264
267
  }), transformMenuSearchMap['searching'] && Object.keys((0, _objectSpread2["default"])((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, transformMenuSearchMap), insertBelowMenuSearchMap), otherOperatonsMenuSearchMap)).length === 1 && /*#__PURE__*/_react["default"].createElement("div", {
265
268
  className: "sdoc-dropdown-menu-item-no-results"
266
- }, t('No_results'))))));
269
+ }, t('No_results')))));
267
270
  });
268
271
  var _default = exports["default"] = SideMenu;
@@ -18,14 +18,15 @@ var TransformMenus = function TransformMenus(_ref) {
18
18
  return /*#__PURE__*/_react["default"].createElement(_reactstrap.UncontrolledPopover, {
19
19
  boundariesElement: "viewport",
20
20
  target: target,
21
- className: "sdoc-side-operation-translate-popover sdoc-sub-dropdown-menu sdoc-dropdown-menu",
21
+ className: "sdoc-side-operation-translate-popover sdoc-sub-dropdown-menu",
22
+ popperClassName: "sdoc-popover-box-shadow",
22
23
  trigger: "hover",
23
24
  placement: "right-start",
24
25
  hideArrow: true,
25
26
  fade: false,
26
27
  offset: [0, 6]
27
28
  }, /*#__PURE__*/_react["default"].createElement("div", {
28
- className: "sdoc-dropdown-menu-container"
29
+ className: "sdoc-dropdown-menu"
29
30
  }, (0, _helpers.getTransformMenusConfig)(editor, slateNode).map(function (item) {
30
31
  return /*#__PURE__*/_react["default"].createElement(_dropdownMenuItem["default"], {
31
32
  key: item.id,
@@ -14,6 +14,7 @@ require("../assets/css/sdoc-editor-article.css");
14
14
  require("../assets/css/sdoc-editor-plugins.css");
15
15
  require("../assets/css/sdoc-comment-editor-plugin.css");
16
16
  require("../assets/css/dropdown-menu.css");
17
+ require("../assets/css/popover.css");
17
18
  var EditorContainer = function EditorContainer(_ref) {
18
19
  var children = _ref.children,
19
20
  readonly = _ref.readonly,