@seafile/sdoc-editor 0.1.80 → 0.1.81-test

package/dist/api/seafile-api.js

@@ -62,6 +62,12 @@ var SeafileAPI = /*#__PURE__*/function () {
       form.append('file_uuid', fileUuid);
       return this._sendPostRequest(url, form);
     }
+  }, {
+    key: "getSeadocRevisionDownloadLinks",
+    value: function getSeadocRevisionDownloadLinks(docUuid) {
+      var url = '/api/v2.1/seadoc/revision/download-links/' + docUuid + '/';
+      return this.req.get(url);
+    }
   }]);
   return SeafileAPI;
 }();

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

@@ -0,0 +1,23 @@
+.sdoc-dropdown-menu {
+  padding: 8px 0;
+}
+
+.sdoc-dropdown-menu .sdoc-dropdown-menu-divider {
+  width: 100%;
+  height: 0;
+  margin: 0.5rem 0;
+  overflow: hidden;
+  border-top: 1px solid #e9ecef;
+}
+
+.sdoc-dropdown-menu .sdoc-dropdown-menu-item {
+  cursor: pointer;
+  height: 28px;
+  width: 100%;
+  padding: 4px 24px;
+  user-select: none;
+}
+
+.sdoc-dropdown-menu .sdoc-dropdown-menu-item:hover {
+  background-color: rgb(245, 245, 245);
+}

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

@@ -57,10 +57,12 @@
 .sdoc-editor-container .article .image-size {
   display: inline-block;
   padding: 5px;
+  white-space: nowrap;
   height: 22px;
   position: absolute;
   bottom: -25px;
   left: 100%;
+  z-index: 1;
   transform: translateX(5px);
   border-radius: 3px;
   line-height: 12px;

package/dist/basic-sdk/comment/comment-item.js

@@ -79,9 +79,7 @@ var CommentItem = function CommentItem(_ref) {
     placement: "bottom-end",
     hideArrow: true
   }, /*#__PURE__*/React.createElement(PopoverBody, {
-    style: {
-      padding: '5px'
-    }
+    className: "sdoc-comment-menu"
   }, /*#__PURE__*/React.createElement("div", {
     className: "sdoc-popover-menu"
   }, /*#__PURE__*/React.createElement("div", {

package/dist/basic-sdk/comment/style.css

@@ -100,25 +100,32 @@
   cursor: pointer;
 }
 
+.sdoc-comment-menu {
+  padding: 0;
+  border-radius: 2px;
+}
+
 .sdoc-popover-menu {
   background: rgb(255, 255, 255);
   width: 130px;
+  padding: 8px 0;
   height: auto;
 }
 
 .sdoc-popover-menu__item {
-  padding: 0 10px;
-  height: 32px;
-  line-height: 32px;
+  padding: 4px 24px;
+  height: 28px;
+  vertical-align: middle;
   font-size: 14px;
-  border-radius: 5px;
-  color: #0f141a;
   background-color: transparent;
   cursor: default;
+  color: #202428;
+  background-color: #fff;
 }
 
 .sdoc-popover-menu__item:hover {
-  background-color: rgba(6, 15, 26, 0.05);
+  background-color: #20a0ff;
+  color: #fff;
 }
 
 .sdoc-comment-container .comment-list-container .comment-editor-wrapper {

package/dist/basic-sdk/editor.js

@@ -9,7 +9,7 @@ import SDocOutline from './outline';
 import EventProxy from './utils/event-handler';
 import { useCursors } from './cursor/use-cursors';
 import EventBus from './utils/event-bus';
-import { EXTERNAL_EVENT } from '../constants';
+import { EXTERNAL_EVENT, PAGE_EDIT_AREA_WIDTH } from '../constants';
 import { isAllInTable } from './extension/plugins/table/helpers';
 import { SetNodeToDecorations } from './highlight-decorate/setNodeToDecorations';
 import { ScrollContext } from './hooks/use-scroll-context';
@@ -19,6 +19,7 @@ import { usePipDecorate } from './decorates';
 import { getCursorPosition, getDomHeight, getDomMarginTop } from './utils/dom-utils';
 import './assets/css/layout.css';
 import './assets/css/sdoc-editor-plugins.css';
+import './assets/css/dropdown-menu.css';
 var SDocEditor = function SDocEditor(_ref) {
   var document = _ref.document,
     config = _ref.config;
@@ -30,6 +31,7 @@ var SDocEditor = function SDocEditor(_ref) {
     }));
     var cursors = document.cursors;
     newEditor.cursors = cursors || {};
+    newEditor.width = PAGE_EDIT_AREA_WIDTH; // default width
     return newEditor;
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
@@ -61,7 +63,6 @@ var SDocEditor = function SDocEditor(_ref) {
   // useMount: init socket connection
   useEffect(function () {
     editor.openConnection();
-    editor.width = articleRef.current.children[0].clientWidth;
     return function () {
       editor.closeConnection();
     };
@@ -71,6 +72,8 @@ var SDocEditor = function SDocEditor(_ref) {
   // useMount: focus editor
   useEffect(function () {
     var timer = setTimeout(function () {
+      // real width
+      editor.width = articleRef.current.children[0].clientWidth;
       focusEditor(editor);
     }, 300);
     return function () {

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

@@ -120,4 +120,6 @@ export var ADDED_STYLE = {
   computed_bg_color: '#e6ffed',
   color: 'rgb(137, 181, 66)'
 };
+export var HEADER_TYPE_ARRAY = ['header1', 'header2', 'header3', 'header4', 'header5', 'header6'];
+export var LIST_TYPE_ARRAY = ['unordered_list', 'ordered_list'];
 export { BLOCKQUOTE, HEADER, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, PARAGRAPH, BOLD, ITALIC, UNDERLINE, STRIKETHROUGH, SUPERSCRIPT, SUBSCRIPT, ORDERED_LIST, UNORDERED_LIST, LIST_ITEM, LIST_LIC, CHECK_LIST, CHECK_LIST_ITEM, LINK, HTML, CODE_BLOCK, CODE_LINE, IMAGE, TABLE, TABLE_CELL, TABLE_ROW, FORMULA, COLUMN, TEXT_STYLE, TEXT_STYLE_MORE, BOLD_ITALIC, TEXT_ALIGN, ALIGN_LEFT, ALIGN_RIGHT, ALIGN_CENTER, ELEMENT_TYPE, KEYBOARD };

package/dist/basic-sdk/extension/core/queries/index.js

@@ -84,16 +84,28 @@ export var getSelectedNodeByType = function getSelectedNodeByType(editor, type)
     nodeEntry = _Editor$nodes2[0];
   return nodeEntry ? nodeEntry[0] : null;
 };
-export var getSelectedNodeEntryByType = function getSelectedNodeEntryByType(editor, type) {
+export var getSelectedNodeByTypes = function getSelectedNodeByTypes(editor, types) {
   var match = function match(n) {
-    return getNodeType(n) === type;
+    return types.includes(getNodeType(n));
   };
   var _Editor$nodes3 = Editor.nodes(editor, {
       match: match,
-      universal: false
+      universal: true
     }),
     _Editor$nodes4 = _slicedToArray(_Editor$nodes3, 1),
     nodeEntry = _Editor$nodes4[0];
+  return nodeEntry ? nodeEntry[0] : null;
+};
+export var getSelectedNodeEntryByType = function getSelectedNodeEntryByType(editor, type) {
+  var match = function match(n) {
+    return getNodeType(n) === type;
+  };
+  var _Editor$nodes5 = Editor.nodes(editor, {
+      match: match,
+      universal: false
+    }),
+    _Editor$nodes6 = _slicedToArray(_Editor$nodes5, 1),
+    nodeEntry = _Editor$nodes6[0];
   return nodeEntry ? nodeEntry : null;
 };
 export var getNodeEntries = function getNodeEntries(editor, options) {

package/dist/basic-sdk/extension/plugins/blockquote/helpers.js

@@ -1,6 +1,7 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import { Editor, Transforms } from '@seafile/slate';
-import { BLOCKQUOTE } from '../../constants';
+import { Editor, Transforms, Element } from '@seafile/slate';
+import slugid from 'slugid';
+import { BLOCKQUOTE, CHECK_LIST_ITEM, IMAGE, ORDERED_LIST, UNORDERED_LIST } from '../../constants';
 import { focusEditor, getNodeType } from '../../core';
 export var isMenuDisabled = function isMenuDisabled(editor) {
   if (editor.selection == null) return true;
@@ -11,6 +12,11 @@ export var isMenuDisabled = function isMenuDisabled(editor) {
         // Only available for p and blockquote
         if (type === 'paragraph') return true;
         if (type === 'blockquote') return true;
+        if (type === UNORDERED_LIST) return true;
+        if (type === ORDERED_LIST) return true;
+        if (type === CHECK_LIST_ITEM) return true;
+        if (type && type.startWith && type.startWith('header')) return true;
+        if (type === IMAGE) return true;
         return false;
       },
       universal: true,
@@ -40,11 +46,25 @@ export var getBlockQuoteType = function getBlockQuoteType(editor) {
     n = _match[0];
   return getNodeType(n);
 };
-export var setBlockQuoteType = function setBlockQuoteType(editor, type) {
-  Transforms.setNodes(editor, {
-    type: type
-  }, {
-    mode: 'highest'
-  });
+export var setBlockQuoteType = function setBlockQuoteType(editor, active) {
+  if (!active) {
+    var blockquoteNode = {
+      id: slugid.nice(),
+      type: BLOCKQUOTE
+    };
+    Transforms.wrapNodes(editor, blockquoteNode, {
+      mode: 'highest',
+      match: function match(n) {
+        return Element.isElement(n) && Editor.isBlock(editor, n);
+      }
+    });
+  } else {
+    Transforms.unwrapNodes(editor, {
+      mode: 'highest',
+      match: function match(n) {
+        return Element.isElement(n) && Editor.isBlock(editor, n);
+      }
+    });
+  }
   focusEditor(editor);
 };

package/dist/basic-sdk/extension/plugins/blockquote/menu/index.js

@@ -4,7 +4,7 @@ import _createClass from "@babel/runtime/helpers/esm/createClass";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
 import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React from 'react';
-import { BLOCKQUOTE, MENUS_CONFIG_MAP, PARAGRAPH } from '../../../constants';
+import { BLOCKQUOTE, MENUS_CONFIG_MAP } from '../../../constants';
 import { MenuItem } from '../../../menu';
 import { getBlockQuoteType, isMenuDisabled, setBlockQuoteType } from '../helpers';
 var QuoteMenu = /*#__PURE__*/function (_React$Component) {
@@ -28,8 +28,7 @@ var QuoteMenu = /*#__PURE__*/function (_React$Component) {
     _this.onMouseDown = function (e) {
       var editor = _this.props.editor;
       var active = _this.isActive(editor);
-      var newType = active ? PARAGRAPH : BLOCKQUOTE;
-      setBlockQuoteType(editor, newType);
+      setBlockQuoteType(editor, active);
     };
     return _this;
   }

package/dist/basic-sdk/extension/plugins/header/menu/index.js

@@ -16,12 +16,15 @@ var HeaderMenu = /*#__PURE__*/function (_React$Component) {
     _classCallCheck(this, HeaderMenu);
     _this = _super.call(this, props);
     _this.registerEventHandler = function () {
-      document.addEventListener('click', _this.onHideHeaderMenu);
+      document.addEventListener('click', _this.onHideHeaderMenu, true);
     };
     _this.unregisterEventHandler = function () {
-      document.removeEventListener('click', _this.onHideHeaderMenu);
+      document.removeEventListener('click', _this.onHideHeaderMenu, true);
     };
-    _this.onHideHeaderMenu = function () {
+    _this.onHideHeaderMenu = function (e) {
+      var menu = _this.menu;
+      var clickIsInMenu = menu && menu.contains(e.target) && menu !== e.target;
+      if (clickIsInMenu) return;
       _this.setState({
         isShowHeaderPopover: false
       }, function () {
@@ -65,8 +68,16 @@ var HeaderMenu = /*#__PURE__*/function (_React$Component) {
 
         // 执行命令
         setHeaderType(editor, newType);
+        _this.setState({
+          isShowHeaderPopover: false
+        }, function () {
+          _this.unregisterEventHandler();
+        });
       };
     };
+    _this.setMenuRef = function (ref) {
+      _this.menu = ref;
+    };
     _this.state = {
       isShowHeaderPopover: false
     };
@@ -92,29 +103,30 @@ var HeaderMenu = /*#__PURE__*/function (_React$Component) {
       }, t(HEADER_TITLE_MAP[headerType])), !disabled && /*#__PURE__*/React.createElement("span", {
         className: headerIconClass
       })), isShowHeaderPopover && /*#__PURE__*/React.createElement("div", {
-        className: "header-popover"
+        ref: this.setMenuRef,
+        className: "header-popover sdoc-dropdown-menu"
       }, /*#__PURE__*/React.createElement("div", {
-        className: "header-menu-item",
+        className: "sdoc-dropdown-menu-item",
         onClick: this.onMouseDown(PARAGRAPH)
       }, t(HEADER_TITLE_MAP.paragraph)), /*#__PURE__*/React.createElement("div", {
-        className: "header-divider"
+        className: "sdoc-dropdown-menu-divider"
       }), /*#__PURE__*/React.createElement("div", {
-        className: "header-menu-item",
+        className: "sdoc-dropdown-menu-item",
         onClick: this.onMouseDown(HEADER1)
       }, t(HEADER_TITLE_MAP.header1)), /*#__PURE__*/React.createElement("div", {
-        className: "header-menu-item",
+        className: "sdoc-dropdown-menu-item",
         onClick: this.onMouseDown(HEADER2)
       }, t(HEADER_TITLE_MAP.header2)), /*#__PURE__*/React.createElement("div", {
-        className: "header-menu-item",
+        className: "sdoc-dropdown-menu-item",
         onClick: this.onMouseDown(HEADER3)
       }, t(HEADER_TITLE_MAP.header3)), /*#__PURE__*/React.createElement("div", {
-        className: "header-menu-item",
+        className: "sdoc-dropdown-menu-item",
         onClick: this.onMouseDown(HEADER4)
       }, t(HEADER_TITLE_MAP.header4)), /*#__PURE__*/React.createElement("div", {
-        className: "header-menu-item",
+        className: "sdoc-dropdown-menu-item",
         onClick: this.onMouseDown(HEADER5)
       }, t(HEADER_TITLE_MAP.header5)), /*#__PURE__*/React.createElement("div", {
-        className: "header-menu-item",
+        className: "sdoc-dropdown-menu-item",
         onClick: this.onMouseDown(HEADER6)
       }, t(HEADER_TITLE_MAP.header6))));
     }

package/dist/basic-sdk/extension/plugins/header/menu/style.css

@@ -50,20 +50,3 @@
   align-items: flex-start;
   z-index: 10;
 }
-
-.header-menu .header-popover .header-divider {
-  width: 100%;
-  border-top: 1px solid #e5e5e5;
-}
-
-.header-menu .header-popover .header-menu-item {
-  cursor: pointer;
-  height: 30px;
-  width: 100%;
-  padding: 4px 24px;
-  user-select: none;
-}
-
-.header-menu .header-popover .header-menu-item:hover {
-  background-color: rgb(245, 245, 245);
-}

package/dist/basic-sdk/extension/plugins/header/plugin.js

@@ -1,7 +1,7 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import { Editor, Element, Transforms } from '@seafile/slate';
-import { PARAGRAPH } from '../../constants';
-import { generateEmptyElement } from '../../core';
+import { Editor, Element, Transforms, Node } from '@seafile/slate';
+import { PARAGRAPH, HEADER_TYPE_ARRAY, LIST_TYPE_ARRAY } from '../../constants';
+import { generateEmptyElement, getSelectedNodeByTypes } from '../../core';
 var isSelectionAtLineEnd = function isSelectionAtLineEnd(editor, path) {
   var selection = editor.selection;
   if (!selection) return false;
@@ -9,7 +9,9 @@ var isSelectionAtLineEnd = function isSelectionAtLineEnd(editor, path) {
   return isAtLineEnd;
 };
 var withHeader = function withHeader(editor) {
-  var insertBreak = editor.insertBreak;
+  var insertBreak = editor.insertBreak,
+    insertFragment = editor.insertFragment,
+    insertText = editor.insertText;
   var newEditor = editor;
 
   // Rewrite insertBreak - insert paragraph when carriage return at the end of header
@@ -51,6 +53,20 @@ var withHeader = function withHeader(editor) {
       insertBreak();
     }
   };
+  newEditor.insertFragment = function (data) {
+    var headerNode = getSelectedNodeByTypes(editor, HEADER_TYPE_ARRAY);
+    var headerText = Node.string(headerNode || {
+      children: []
+    });
+    var isSingleListItem = data.length === 1 && data[0].children.length === 1 && LIST_TYPE_ARRAY.includes(data[0].type);
+    // Insert a list item when the header is empty, insert only the text
+    if (headerNode && headerText.length === 0 && isSingleListItem) {
+      var text = Node.string(data[0]);
+      insertText(text);
+      return;
+    }
+    return insertFragment(data);
+  };
   return newEditor;
 };
 export default withHeader;

package/dist/basic-sdk/extension/plugins/image/helpers.js

@@ -2,7 +2,7 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import urlJoin from 'url-join';
 import { Editor, Range, Transforms } from '@seafile/slate';
-import { BLOCKQUOTE, CODE_BLOCK, IMAGE, ORDERED_LIST, UNORDERED_LIST, ELEMENT_TYPE } from '../../constants';
+import { CODE_BLOCK, IMAGE, ORDERED_LIST, UNORDERED_LIST } from '../../constants';
 import { generateEmptyElement, getNodeType, isTextNode, getParentNode } from '../../core';
 import context from '../../../../context';
 export var isInsertImageMenuDisabled = function isInsertImageMenuDisabled(editor) {
@@ -16,14 +16,10 @@ export var isInsertImageMenuDisabled = function isInsertImageMenuDisabled(editor
           var parentNode = getParentNode(editor.children, n.id);
           type = getNodeType(parentNode);
         }
-        if (type === ELEMENT_TYPE.TABLE) return true;
-        if (type === ELEMENT_TYPE.TABLE_ROW) return true;
-        if (type === ELEMENT_TYPE.TABLE_CELL) return true;
         if (type === CODE_BLOCK) return true;
         if (type === ORDERED_LIST) return true;
         if (type === UNORDERED_LIST) return true;
         if (type.startsWith('header')) return true;
-        if (type === BLOCKQUOTE) return true;
         if (Editor.isVoid(editor, n)) return true;
         return false;
       },

package/dist/basic-sdk/extension/plugins/image/render-elem.js

@@ -26,7 +26,7 @@ var Image = /*#__PURE__*/function (_React$Component) {
     };
     _this.onResizeStart = function (event) {
       event.preventDefault();
-      // event.stopPropagation();
+      event.stopPropagation();
       _this.setState({
         isResizing: true
       }, function () {

package/dist/basic-sdk/extension/plugins/table/helpers.js

@@ -464,4 +464,15 @@ export var getFirstTableCell = function getFirstTableCell(element) {
     tableCellElement = tableCellElement.parentNode;
   }
   return tableCellElement;
+};
+export var rowElementHasImage = function rowElementHasImage(element) {
+  if (!element) return false;
+  if (!Array.isArray(element.children) || element.children.length === 0) return false;
+  return element.children.some(function (child) {
+    if (child.type === ELEMENT_TYPE.IMAGE) return true;
+    if (ObjectUtils.hasProperty(child, 'children')) {
+      return rowElementHasImage(child);
+    }
+    return false;
+  });
 };

package/dist/basic-sdk/extension/plugins/table/menu/active-table-menu/common-menu.js

@@ -21,9 +21,6 @@ var CommonMenu = /*#__PURE__*/function (_Component) {
       itemClass = "rich-icon-btn d-flex ".concat(disabled ? 'rich-icon-btn-disabled' : 'rich-icon-btn-hover');
       return itemClass + ' ' + className;
     };
-    _this.hidePopover = function () {
-      _this.ref && _this.ref.toggle && _this.ref.toggle();
-    };
     _this.setRef = function (ref) {
       _this.ref = ref;
       if (!_this.ref) return;
@@ -65,7 +62,7 @@ var CommonMenu = /*#__PURE__*/function (_Component) {
         hideArrow: true,
         ref: this.setRef
       }, /*#__PURE__*/React.createElement("div", {
-        className: "sdoc-common-menu-popover-container"
+        className: "sdoc-dropdown-menu"
       }, children)));
     }
   }]);

package/dist/basic-sdk/extension/plugins/table/menu/active-table-menu/index.css

@@ -1,7 +1,3 @@
-.sdoc-common-menu-popover .sdoc-common-menu-popover-container {
-  padding: 8px 0;
-}
-
 .sdoc-table-menu-group .sdoc-drop-down,
 .sdoc-table-menu-group .sdoc-caret-up {
   transform: scale(.8);

package/dist/basic-sdk/extension/plugins/table/menu/active-table-menu/index.js

@@ -59,18 +59,18 @@ var ActiveTableMenu = /*#__PURE__*/function (_Component) {
         ref: function ref(_ref) {
           return _this.textAlignRef = _ref;
         }
-      }, /*#__PURE__*/React.createElement("button", {
-        className: "dropdown-item",
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "sdoc-dropdown-menu-item",
         onClick: _this.setTextAlignStyle.bind(_assertThisInitialized(_this), 'left')
       }, /*#__PURE__*/React.createElement("i", {
         className: "sdocfont sdoc-align-left mr-2"
-      }), t('Left')), /*#__PURE__*/React.createElement("button", {
-        className: "dropdown-item",
+      }), t('Left')), /*#__PURE__*/React.createElement("div", {
+        className: "sdoc-dropdown-menu-item",
         onClick: _this.setTextAlignStyle.bind(_assertThisInitialized(_this), 'center')
       }, /*#__PURE__*/React.createElement("i", {
         className: "sdocfont sdoc-align-center mr-2"
-      }), t('Center')), /*#__PURE__*/React.createElement("button", {
-        className: "dropdown-item",
+      }), t('Center')), /*#__PURE__*/React.createElement("div", {
+        className: "sdoc-dropdown-menu-item",
         onClick: _this.setTextAlignStyle.bind(_assertThisInitialized(_this), 'right')
       }, /*#__PURE__*/React.createElement("i", {
         className: "sdocfont sdoc-align-right mr-2"
@@ -84,11 +84,11 @@ var ActiveTableMenu = /*#__PURE__*/function (_Component) {
         ref: function ref(_ref2) {
           return _this.tableColumnRef = _ref2;
         }
-      }, /*#__PURE__*/React.createElement("button", {
-        className: "dropdown-item",
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "sdoc-dropdown-menu-item",
         onClick: _this.insertTableElement.bind(_assertThisInitialized(_this), TABLE_ELEMENT.COLUMN)
-      }, t('Insert_column')), /*#__PURE__*/React.createElement("button", {
-        className: "dropdown-item",
+      }, t('Insert_column')), /*#__PURE__*/React.createElement("div", {
+        className: "sdoc-dropdown-menu-item",
         onClick: _this.removeTableElement.bind(_assertThisInitialized(_this), TABLE_ELEMENT.COLUMN)
       }, t('Remove_column')));
     };
@@ -100,11 +100,11 @@ var ActiveTableMenu = /*#__PURE__*/function (_Component) {
         ref: function ref(_ref3) {
           return _this.tableRowRef = _ref3;
         }
-      }, /*#__PURE__*/React.createElement("button", {
-        className: "dropdown-item",
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "sdoc-dropdown-menu-item",
         onClick: _this.insertTableElement.bind(_assertThisInitialized(_this), TABLE_ELEMENT.ROW)
-      }, t('Insert_row')), /*#__PURE__*/React.createElement("button", {
-        className: "dropdown-item",
+      }, t('Insert_row')), /*#__PURE__*/React.createElement("div", {
+        className: "sdoc-dropdown-menu-item",
         onClick: _this.removeTableElement.bind(_assertThisInitialized(_this), TABLE_ELEMENT.ROW)
       }, t('Remove_row')));
     };

package/dist/basic-sdk/extension/plugins/table/render/table-header/rows-header/row-header.js

@@ -8,6 +8,7 @@ import { useResizeHandlersContext, useTableSelectedRangeContext } from '../../ho
 import { useScrollContext } from '../../../../../../hooks/use-scroll-context';
 import { ELEMENT_TYPE } from '../../../../../constants';
 import { findPath, getSelectedNodeByType } from '../../../../../core';
+import { rowElementHasImage } from '../../../helpers';
 var RowHeader = function RowHeader(_ref) {
   var _row$style;
   var row = _ref.row,
@@ -30,6 +31,18 @@ var RowHeader = function RowHeader(_ref) {
   var currentCellPath = currentCell ? findPath(editor, currentCell, [-1, -1]) : [-1, -1];
   var pathLength = currentCellPath.length;
   useEffect(function () {
+    if (rowElementHasImage(row)) {
+      var time = setTimeout(function () {
+        // There is a delay in image loading
+        var rowDom = ReactEditor.toDOMNode(editor, row);
+        if (!rowDom) return;
+        if (rowHeight === rowDom.clientHeight) return;
+        setRowHeight(rowDom.clientHeight);
+      }, 300);
+      return function () {
+        clearTimeout(time);
+      };
+    }
     var rowDom = ReactEditor.toDOMNode(editor, row);
     if (!rowDom) return;
     if (rowHeight === rowDom.clientHeight) return;

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

@@ -16,12 +16,15 @@ var TextAlignMenu = /*#__PURE__*/function (_React$Component) {
     _classCallCheck(this, TextAlignMenu);
     _this = _super.call(this, props);
     _this.registerEventHandler = function () {
-      document.addEventListener('click', _this.onHideTextAlignMenu);
+      document.addEventListener('click', _this.onHideTextAlignMenu, true);
     };
     _this.unregisterEventHandler = function () {
-      document.removeEventListener('click', _this.onHideTextAlignMenu);
+      document.removeEventListener('click', _this.onHideTextAlignMenu, true);
     };
-    _this.onHideTextAlignMenu = function () {
+    _this.onHideTextAlignMenu = function (e) {
+      var menu = _this.menu;
+      var clickIsInMenu = menu && menu.contains(e.target) && menu !== e.target;
+      if (clickIsInMenu) return;
       _this.setState({
         isDropdownMenuOpen: false
       }, function () {
@@ -60,6 +63,14 @@ var TextAlignMenu = /*#__PURE__*/function (_React$Component) {
     _this.setType = function (type) {
       var editor = _this.props.editor;
       setAlignType(editor, type);
+      _this.setState({
+        isDropdownMenuOpen: false
+      }, function () {
+        _this.unregisterEventHandler();
+      });
+    };
+    _this.setMenuRef = function (ref) {
+      _this.menu = ref;
     };
     _this.state = {
       isDropdownMenuOpen: false
@@ -89,11 +100,12 @@ var TextAlignMenu = /*#__PURE__*/function (_React$Component) {
       }), !disabled && /*#__PURE__*/React.createElement("span", {
         className: caretIconClass
       })), isDropdownMenuOpen && /*#__PURE__*/React.createElement("div", {
-        className: "align-popover"
+        ref: this.setMenuRef,
+        className: "align-popover sdoc-dropdown-menu"
       }, MENUS_CONFIG_MAP[TEXT_ALIGN].map(function (item, index) {
         return /*#__PURE__*/React.createElement("span", {
           key: index,
-          className: "align-menu-item ".concat(item.iconClass),
+          className: "sdoc-dropdown-menu-item ".concat(item.iconClass),
           onClick: _this2.setType.bind(_this2, item.type)
         });
       })));

package/dist/basic-sdk/extension/plugins/text-align/menu/style.css

@@ -51,15 +51,3 @@
   align-items: flex-start;
   z-index: 10;
 }
-
-.align-menu .align-popover .align-menu-item {
-  cursor: pointer;
-  height: 30px;
-  width: 100%;
-  padding: 4px 24px;
-  user-select: none;
-}
-
-.align-menu .align-popover .align-menu-item:hover {
-  background-color: rgb(245, 245, 245);
-}

package/dist/basic-sdk/socket/socket-manager.js

@@ -210,4 +210,7 @@ SocketManager.getInstance = function (editor, document, socketConfig) {
   SocketManager.instance = new SocketManager(editor, document, socketConfig);
   return SocketManager.instance;
 };
+SocketManager.destroy = function () {
+  SocketManager.instance = null;
+};
 export default SocketManager;

package/dist/basic-sdk/socket/with-socket-io.js

@@ -1,4 +1,3 @@
-var _this = this;
 import { generateCursorData } from '../cursor/helper';
 import EventBus from '../utils/event-bus';
 import SocketManager from './socket-manager';
@@ -16,7 +15,8 @@ var withSocketIO = function withSocketIO(editor, options) {
     socketManager = SocketManager.getInstance(newEditor, document, config);
   };
   newEditor.closeConnection = function () {
-    socketManager && _this.socketManager.closeConnection();
+    socketManager && socketManager.closeSocketConnect();
+    SocketManager.destroy();
   };
   newEditor.onChange = function () {
     var operations = newEditor.operations;