@seafile/sdoc-editor 0.2.13 → 0.2.15

package/dist/api/seafile-api.js

@@ -110,6 +110,12 @@ var SeafileAPI = /*#__PURE__*/function () {
       var url = 'api/v2.1/seadoc/revision/base-version-content/' + docUuid + '/';
       return this.req.get(url);
     }
+  }, {
+    key: "getPublishedRevisionContent",
+    value: function getPublishedRevisionContent(docUuid) {
+      var url = 'api/v2.1/seadoc/revision/published-content/' + docUuid + '/';
+      return this.req.get(url);
+    }
 
     // local files
   }, {

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

@@ -48,6 +48,32 @@
   display: inline-block;
 }
 
+.sdoc-editor-container .article .sdoc-image-content {
+  display: flex;
+  flex-direction: column;
+  align-items: start;
+}
+
+.sdoc-editor-container .article .sdoc-image-content :first-child {
+  position: relative;
+}
+
+.sdoc-editor-container .article .sdoc-image-content .sdoc-image-caption-input-wrapper {
+  border: 0;
+  outline: none;
+  margin-top: 8px;
+  color: #8A8F8D;
+  background-color: transparent;
+  text-align: center;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.sdoc-editor-container .article .sdoc-image-content .sdoc-image-caption-input-wrapper::placeholder {
+  color: #bec0bf
+}
+
 .sdoc-editor-container .article .image-selected {
   box-shadow: 0 0 0 2px #007bff;
 }

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

@@ -2,9 +2,10 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import React, { useCallback, useMemo, useState } from 'react';
 import { withTranslation } from 'react-i18next';
-import { Dropdown, DropdownItem, DropdownMenu, DropdownToggle, UncontrolledTooltip } from 'reactstrap';
+import { Dropdown, DropdownItem, DropdownMenu, DropdownToggle } from 'reactstrap';
 import dayjs from 'dayjs';
 import CommentEditor from './comment-editor';
+import Tooltip from '../../../components/tooltip';
 var CommentItem = function CommentItem(_ref) {
   var isActive = _ref.isActive,
     container = _ref.container,
@@ -82,19 +83,13 @@ var CommentItem = function CommentItem(_ref) {
   }, dayjs(comment.updated_at).format('MM-DD HH:mm')))), isActive && /*#__PURE__*/React.createElement("div", {
     className: "d-flex"
   }, !comment.resolved && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    id: "tooltip_".concat(menuId),
     className: "comment-operation mr-2",
     onClick: markAsResolved
   }, /*#__PURE__*/React.createElement("i", {
-    id: "tooltip_".concat(menuId),
     className: "sdocfont sdoc-confirm"
-  })), /*#__PURE__*/React.createElement(UncontrolledTooltip, {
-    target: "tooltip_".concat(menuId),
-    delay: {
-      show: 0,
-      hide: 0
-    },
-    fade: false,
-    placement: "bottom"
+  })), /*#__PURE__*/React.createElement(Tooltip, {
+    target: "tooltip_".concat(menuId)
   }, t('Resolved_tip'))), /*#__PURE__*/React.createElement(Dropdown, {
     isOpen: isDropdownOpen,
     toggle: function toggle() {

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

@@ -103,25 +103,21 @@
   line-height: 16px;
 }
 
-.sdoc-comment-list-container .comment-header .comment-operation {
-  line-height: 20px;
-  font-size: 20px;
-  color: rgb(70, 77, 90);
-  width: 20px;
-  height: 20px;
-  cursor: pointer;
-}
-
 .sdoc-comment-list-container .comment-ui-container .comment-operation {
   width: 32px;
   height: 32px;
+  padding: 0 !important;
   display: flex;
   align-items: center;
   justify-content: center;
+  border-radius: 50%;
+  background-color: #fff;
+  color: rgb(70, 77, 90);
+  overflow: hidden;
 }
 
 .sdoc-comment-list-container .comment-ui-container.active .comment-operation:hover {
-  border-radius: 100%;
+  cursor: pointer;
   background-color: #f0f0f0;
 }
 

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

@@ -8,7 +8,7 @@ import { DEFAULT_COLORS, STANDARD_COLORS, DEFAULT_RECENT_USED_LIST } from '../..
 import { LocalStorage } from '../../../../utils';
 import { eventStopPropagation } from '../../../utils/mouse-event';
 import ColorItem from './color-item';
-import Tooltip from '../tooltip';
+import Tooltip from '../../../../components/tooltip';
 import './index.css';
 var ColorMenu = function ColorMenu(_ref) {
   var iconClass = _ref.iconClass,

package/dist/basic-sdk/extension/commons/menu/menu-item.js

@@ -1,6 +1,6 @@
 import React, { useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
-import Tooltip from '../tooltip';
+import Tooltip from '../../../../components/tooltip';
 import classnames from 'classnames';
 import { SDOC_LINK } from '../../constants';
 var MenuItem = function MenuItem(_ref) {

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

@@ -75,24 +75,6 @@
   background: #f2f2f2;
 }
 
-.sdoc-code-block-hover-menu-container .hover-menu-container .op-tooltip:hover::after {
-  position: absolute;
-  color: #212529;
-  content: attr(op-item-tooltip);
-  top: -40px;
-  left: -20px;
-  width: 70px;
-  height: 30px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  background-color: #fff;
-  border-radius: 3px;
-  border: 1px solid #e8e8e8;
-  font-size: 12px;
-  box-shadow: 0 0 5px #ccc;
-}
-
 .sdoc-code-block-hover-menu-container .icon-font {
   font-size: 12px;
   color: #444;

package/dist/basic-sdk/extension/plugins/code-block/hover-menu/index.js

@@ -2,6 +2,7 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import React, { useCallback, useEffect, useState } from 'react';
 import { Input } from 'reactstrap';
 import { withTranslation } from 'react-i18next';
+import Tooltip from '../../../../../components/tooltip';
 import { ElementPopover } from '../../../commons/';
 import { genCodeLangs } from '../prismjs';
 import { getSelectedLangOption } from '../helpers';
@@ -29,6 +30,10 @@ var CodeBlockHoverMenu = function CodeBlockHoverMenu(_ref) {
     _useState6 = _slicedToArray(_useState5, 2),
     langsData = _useState6[0],
     setLangsData = _useState6[1];
+  var _useState7 = useState(false),
+    _useState8 = _slicedToArray(_useState7, 2),
+    isShowTooltip = _useState8[0],
+    setIsShowTooltip = _useState8[1];
   var onHiddenLangsList = useCallback(function (e) {
     if (!e.target.parentNode.className.includes('sdoc-search-langs')) {
       setIsShowlangsList(false);
@@ -36,6 +41,7 @@ var CodeBlockHoverMenu = function CodeBlockHoverMenu(_ref) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   useEffect(function () {
+    setIsShowTooltip(true);
     window.addEventListener('click', onHiddenLangsList);
     return function () {
       window.removeEventListener('click', onHiddenLangsList);
@@ -103,37 +109,49 @@ var CodeBlockHoverMenu = function CodeBlockHoverMenu(_ref) {
   }))), /*#__PURE__*/React.createElement("div", {
     className: "sdoc-code-block-hover-operation-divider"
   }), /*#__PURE__*/React.createElement("div", {
+    id: "sdoc_code_block_auto_wrap",
     className: "sdoc-code-block-hover-operation-item"
   }, /*#__PURE__*/React.createElement("div", {
     role: "button",
-    className: "op-item ".concat(white_space === 'normal' ? 'active' : '', " op-tooltip"),
-    "op-item-tooltip": t('Auto_wrap'),
+    className: "op-item ".concat(white_space === 'normal' ? 'active' : ''),
     onClick: onAutoLineWrap
   }, /*#__PURE__*/React.createElement("i", {
     className: "sdocfont sdoc-auto-linefeed icon-font"
-  }))), /*#__PURE__*/React.createElement("div", {
+  })), isShowTooltip && /*#__PURE__*/React.createElement(Tooltip, {
+    target: "sdoc_code_block_auto_wrap",
+    placement: "top",
+    fade: true
+  }, t('Auto_wrap'))), /*#__PURE__*/React.createElement("div", {
     className: "sdoc-code-block-hover-operation-divider"
   }), /*#__PURE__*/React.createElement("div", {
+    id: "sdoc_code_block_copy",
     className: "sdoc-code-block-hover-operation-item"
   }, /*#__PURE__*/React.createElement("div", {
     role: "button",
-    className: "op-item op-tooltip",
-    "op-item-tooltip": t('Copy'),
+    className: "op-item",
     onClick: onCopyCodeBlock
   }, /*#__PURE__*/React.createElement("i", {
     className: "sdocfont sdoc-copy icon-font"
-  }))), /*#__PURE__*/React.createElement("div", {
+  })), isShowTooltip && /*#__PURE__*/React.createElement(Tooltip, {
+    target: "sdoc_code_block_copy",
+    placement: "top",
+    fade: true
+  }, t('Copy'))), /*#__PURE__*/React.createElement("div", {
     className: "sdoc-code-block-hover-operation-divider"
   }), /*#__PURE__*/React.createElement("div", {
+    id: "sdoc_code_block_delete",
     className: "sdoc-code-block-hover-operation-item"
   }, /*#__PURE__*/React.createElement("div", {
     role: "button",
-    className: "op-item op-tooltip",
-    "op-item-tooltip": t('Delete'),
+    className: "op-item",
     onClick: onDelete
   }, /*#__PURE__*/React.createElement("i", {
     className: "sdocfont sdoc-delete icon-font"
-  }))), isShowlangsList && /*#__PURE__*/React.createElement("div", {
+  })), isShowTooltip && /*#__PURE__*/React.createElement(Tooltip, {
+    target: "sdoc_code_block_delete",
+    placement: "top",
+    fade: true
+  }, t('Delete'))), isShowlangsList && /*#__PURE__*/React.createElement("div", {
     className: "sdoc-langs-list-container"
   }, /*#__PURE__*/React.createElement("div", {
     className: "sdoc-search-langs"

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

@@ -119,8 +119,9 @@ var CodeBlock = function CodeBlock(_ref) {
     };
   }, [onScroll, readOnly, scrollRef]);
   var onHiddenHoverMenu = useCallback(function () {
-    setShowHoverMenu(false);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    if (codeBlockRef.current) {
+      setShowHoverMenu(false);
+    }
   }, []);
   useEffect(function () {
     var eventBus = EventBus.getInstance();

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

@@ -6,7 +6,7 @@ import { useTranslation } from 'react-i18next';
 import classnames from 'classnames';
 import { isMenuDisabled, getFont, setFont } from '../../helpers';
 import { FONT, RECENT_USED_FONTS_KEY, DEFAULT_FONT } from '../../../../constants';
-import Tooltip from '../../../../commons/tooltip';
+import Tooltip from '../../../../../../components/tooltip';
 import LocalStorage from '../../../../../../utils/local-storage-utils';
 import context from '../../../../../../context';
 import FontItem from './font-item';

package/dist/basic-sdk/extension/plugins/font/menu/font-size/font-size-scale.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import classnames from 'classnames';
-import Tooltip from '../../../../commons/tooltip';
+import Tooltip from '../../../../../../components/tooltip';
 var FontSizeScale = function FontSizeScale(_ref) {
   var children = _ref.children,
     id = _ref.id,

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

@@ -5,7 +5,7 @@ import { useTranslation } from 'react-i18next';
 import classnames from 'classnames';
 import { isMenuDisabled, getFontSize, setFontSize } from '../../helpers';
 import { FONT_SIZE } from '../../../../constants';
-import Tooltip from '../../../../commons/tooltip';
+import Tooltip from '../../../../../../components/tooltip';
 import './index.css';
 var FontSize = function FontSize(_ref) {
   var isRichEditor = _ref.isRichEditor,

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

@@ -8,7 +8,7 @@ import { withTranslation } from 'react-i18next';
 import classnames from 'classnames';
 import { getHeaderType, isMenuDisabled, setHeaderType } from '../helpers';
 import { HEADERS, HEADER_TITLE_MAP, MAC_HOTKEYS, PARAGRAPH, SDOC_FONT_SIZE, SUBTITLE, TITLE, WIN_HOTKEYS } from '../../../constants';
-import Tooltip from '../../../commons/tooltip';
+import Tooltip from '../../../../../components/tooltip';
 import { focusEditor } from '../../../core';
 import './style.css';
 var HeaderMenu = /*#__PURE__*/function (_React$Component) {

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

@@ -6,7 +6,7 @@ import { ReactEditor } from '@seafile/slate-react';
 import { withTranslation } from 'react-i18next';
 import classnames from 'classnames';
 import { ElementPopover } from '../../../commons';
-import Tooltip from '../../../commons/tooltip';
+import Tooltip from '../../../../../components/tooltip';
 import ImagePreviewer from '../dialogs/image-previewer';
 import { getImageURL } from '../helpers';
 import { IMAGE_DISPLAY_TYPE, IMAGE_BORDER_TYPE } from '../constants';
@@ -17,6 +17,7 @@ var ImageHoverMenu = function ImageHoverMenu(_ref) {
     menuPosition = _ref.menuPosition,
     element = _ref.element,
     onHideImageHoverMenu = _ref.onHideImageHoverMenu,
+    onShowCaption = _ref.onShowCaption,
     t = _ref.t;
   var data = element.data,
     _element$display_type = element.display_type,
@@ -116,7 +117,22 @@ var ImageHoverMenu = function ImageHoverMenu(_ref) {
     target: "sdoc_image_border",
     placement: "top",
     fade: true
-  }, t('Image_border')))), /*#__PURE__*/React.createElement("span", {
+  }, t('Image_border'))), display_type === IMAGE_DISPLAY_TYPE[1] && /*#__PURE__*/React.createElement("span", {
+    id: "sdoc_image_caption",
+    role: "button",
+    className: classnames('op-item', 'ml-1', {
+      'active': (data === null || data === void 0 ? void 0 : data.caption.length) !== 0
+    }),
+    onClick: function onClick() {
+      onShowCaption();
+    }
+  }, /*#__PURE__*/React.createElement("i", {
+    className: "sdocfont sdoc-describe icon-font mr-1"
+  }), isShowTooltip && /*#__PURE__*/React.createElement(Tooltip, {
+    target: "sdoc_image_caption",
+    placement: "top",
+    fade: true
+  }, t('Insert_caption')))), /*#__PURE__*/React.createElement("span", {
     className: "op-group-item"
   }, /*#__PURE__*/React.createElement("span", {
     id: "sdoc_image_full_screen_mode",

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

@@ -1,7 +1,8 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import React, { useState, useCallback, useRef, useEffect } from 'react';
-import { useSelected, useReadOnly } from '@seafile/slate-react';
+import { ReactEditor, useSelected, useReadOnly } from '@seafile/slate-react';
+import { Transforms } from '@seafile/slate';
 import classNames from 'classnames';
 import { withTranslation } from 'react-i18next';
 import { getImageURL, updateImage } from './helpers';
@@ -27,9 +28,10 @@ var Image = function Image(_ref) {
     border_type = _element$border_type === void 0 ? IMAGE_BORDER_TYPE[0].type : _element$border_type;
   var imageWrapStyle = {
     display: display_type === 'Block' ? 'block' : 'inline-block',
+    paddingTop: display_type === 'Block' ? '8px' : '',
     textAlign: display_type === 'Block' ? align : ''
   };
-  var imageInnerStyle = {
+  var imageStyle = {
     border: IMAGE_BORDER_TYPE.find(function (item) {
       return item.type === border_type;
     }).value
@@ -58,6 +60,14 @@ var Image = function Image(_ref) {
     _useState10 = _slicedToArray(_useState9, 2),
     menuPosition = _useState10[0],
     setMenuPosition = _useState10[1];
+  var _useState11 = useState((data === null || data === void 0 ? void 0 : data.caption) || ''),
+    _useState12 = _slicedToArray(_useState11, 2),
+    caption = _useState12[0],
+    setCaption = _useState12[1];
+  var _useState13 = useState(false),
+    _useState14 = _slicedToArray(_useState13, 2),
+    isShowCaption = _useState14[0],
+    setIsShowCaption = _useState14[1];
   var registerEvent = useCallback(function (eventList) {
     eventList.forEach(function (element) {
       document.addEventListener(element.eventName, element.event);
@@ -92,12 +102,19 @@ var Image = function Image(_ref) {
       width: imageRef.current.width
     });
     updateImage(editor, newData);
-    setIsResizing(false);
+
+    // Reset hover menu position
+    setTimeout(function () {
+      setIsResizing(false);
+      setIsShowImageHoverMenu(true);
+      setPosition();
+    }, 100);
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [editor, element.data]);
+  }, [editor, element.data, imageRef.current]);
   var onResizeStart = useCallback(function (event) {
     event.preventDefault();
     event.stopPropagation();
+    setIsShowImageHoverMenu(false);
     setIsResizing(true);
     registerEvent([{
       'eventName': 'mousemove',
@@ -115,15 +132,16 @@ var Image = function Image(_ref) {
     };
   }, [element.data, movingWidth]);
   var onScroll = useCallback(function () {
-    setPosition(imageRef.current);
+    setPosition();
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   var onHideImageHoverMenu = useCallback(function (e) {
     var _imagePreviewer$;
+    if (isResizing) return;
     var imagePreviewer = document.getElementsByClassName('sf-editor-image-previewer');
     if (e.target === imageRef.current || ((_imagePreviewer$ = imagePreviewer[0]) === null || _imagePreviewer$ === void 0 ? void 0 : _imagePreviewer$.contains(e.target))) return;
     setIsShowImageHoverMenu(false);
-  }, []);
+  }, [isResizing]);
   useEffect(function () {
     var observerRefValue = null;
     if (isShowImageHoverMenu) {
@@ -151,23 +169,19 @@ var Image = function Image(_ref) {
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [isShowImageHoverMenu, onHideImageHoverMenu]);
-  var setPosition = useCallback(function (elem) {
-    if (elem) {
-      var _elem$getBoundingClie = elem.getBoundingClientRect(),
-        top = _elem$getBoundingClie.top,
-        left = _elem$getBoundingClie.left,
-        width = _elem$getBoundingClie.width;
-      var menuTop = top - 42;
-      var menuLeft = left - 222 / 2 + width / 2; // left = left distance - (menu width / 2) + (image with / 2)
+  var setPosition = useCallback(function () {
+    if (imageRef.current) {
+      var _imageRef$current$get = imageRef.current.getBoundingClientRect(),
+        top = _imageRef$current$get.top,
+        left = _imageRef$current$get.left;
       setMenuPosition({
-        top: menuTop,
-        left: menuLeft
+        top: top - 42,
+        left: left - 3
       });
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   var onClickImage = useCallback(function (e) {
-    setPosition(e.currentTarget);
+    setPosition();
     setIsShowImageHoverMenu(true);
   }, [setPosition]);
   var reloadImage = useCallback(function () {
@@ -184,6 +198,19 @@ var Image = function Image(_ref) {
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
+  var onSetCaption = useCallback(function (e) {
+    var path = ReactEditor.findPath(editor, element);
+    var newData = _objectSpread(_objectSpread({}, data), {}, {
+      caption: e.target.value.trim()
+    });
+    if (path) {
+      Transforms.setNodes(editor, {
+        data: newData
+      }, {
+        at: path
+      });
+    }
+  }, [data, editor, element]);
   return /*#__PURE__*/React.createElement(React.Fragment, null, isShowImagePlaceholder && /*#__PURE__*/React.createElement("span", Object.assign({
     className: classNames('sdoc-image-wrapper', className)
   }, attributes), /*#__PURE__*/React.createElement("img", {
@@ -197,13 +224,16 @@ var Image = function Image(_ref) {
   }, attributes, {
     style: imageWrapStyle
   }), /*#__PURE__*/React.createElement("span", {
-    className: "sdoc-image-inner",
-    onClick: onClickImage,
-    style: imageInnerStyle
+    className: "sdoc-image-inner"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "sdoc-image-content"
+  }, /*#__PURE__*/React.createElement("span", {
+    style: imageStyle
   }, /*#__PURE__*/React.createElement("img", {
     className: classNames({
       'image-selected': isSelected
     }),
+    onClick: onClickImage,
     ref: imageRef,
     src: getImageURL(data.src),
     style: getImageStyle(),
@@ -217,12 +247,29 @@ var Image = function Image(_ref) {
   }), isResizing && /*#__PURE__*/React.createElement("span", {
     className: "image-size",
     contentEditable: false
-  }, /*#__PURE__*/React.createElement("span", null, t('Width'), ':', parseInt(movingWidth || imageRef.current.clientWidth)), /*#__PURE__*/React.createElement("span", null, "\xA0\xA0"), /*#__PURE__*/React.createElement("span", null, t('Height'), ':', imageRef.current.clientHeight))), children), isShowImageHoverMenu && !readOnly && /*#__PURE__*/React.createElement(ImageHoverMenu, {
+  }, /*#__PURE__*/React.createElement("span", null, t('Width'), ':', parseInt(movingWidth || imageRef.current.clientWidth)), /*#__PURE__*/React.createElement("span", null, "\xA0\xA0"), /*#__PURE__*/React.createElement("span", null, t('Height'), ':', imageRef.current.clientHeight))), display_type === 'Block' && (isShowCaption || (data === null || data === void 0 ? void 0 : data.caption)) && /*#__PURE__*/React.createElement("input", {
+    className: "sdoc-image-caption-input-wrapper",
+    style: {
+      width: (data === null || data === void 0 ? void 0 : data.width) || '120px'
+    },
+    placeholder: t('Insert_caption'),
+    value: caption,
+    onBlur: onSetCaption,
+    onChange: function onChange(e) {
+      setCaption(e.target.value.trim());
+    },
+    onCompositionStart: function onCompositionStart(e) {
+      e.stopPropagation();
+    }
+  }))), children), isShowImageHoverMenu && !readOnly && /*#__PURE__*/React.createElement(ImageHoverMenu, {
     editor: editor,
     menuPosition: menuPosition,
     element: element,
     onHideImageHoverMenu: function onHideImageHoverMenu() {
       setIsShowImageHoverMenu(false);
+    },
+    onShowCaption: function onShowCaption() {
+      setIsShowCaption(true);
     }
   })));
 };

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

@@ -878,4 +878,64 @@ export var getRowHeight = function getRowHeight(element, rowIndex) {
     style = _element$style === void 0 ? {} : _element$style;
   var rowHeight = style[TABLE_ROW_STYLE.MIN_HEIGHT] || TABLE_ROW_MIN_HEIGHT;
   return rowIndex === 0 ? rowHeight + 1 : rowHeight;
+};
+var normalizeTableCell = function normalizeTableCell(cell) {
+  if (!cell) return generateTableCell();
+  var newCell = _objectSpread({
+    children: [{
+      text: '',
+      id: slugid.nice()
+    }]
+  }, cell);
+
+  // normalize cell children
+  var newCellChildren = [];
+  newCell.children.forEach(function (cellChild) {
+    var cellChildType = cellChild.type;
+    if (cellChildType === ELEMENT_TYPE.PARAGRAPH) {
+      newCellChildren.push.apply(newCellChildren, _toConsumableArray(cellChild.children));
+    } else {
+      newCellChildren.push(cellChild);
+    }
+  });
+  newCell.children = newCellChildren.map(function (item) {
+    if (item.BOLD) {
+      item.bold = item.BOLD;
+      delete item['BOLD'];
+    }
+    if (item.ITALIC) {
+      item.italic = item.ITALIC;
+      delete item['ITALIC'];
+    }
+    return item;
+  });
+
+  // normalize cell style
+  if (newCell.data) {
+    var cellStyle = _objectSpread({}, newCell.data);
+    delete newCell['data'];
+    Object.keys(cellStyle).forEach(function (cellStyleKey) {
+      if (cellStyleKey === 'align') {
+        cellStyle['text_align'] = cellStyle['align'];
+        delete cellStyle['align'];
+      }
+    });
+    newCell.style = cellStyle;
+  }
+  return newCell;
+};
+export var normalizeTableELement = function normalizeTableELement(editor, element) {
+  if (element.type !== ELEMENT_TYPE.TABLE) {
+    var size = [element.children.length, element.children[0].children.length];
+    return generateEmptyTable(editor, size);
+  }
+  var newElement = _objectSpread({}, element);
+  for (var i = 0; i < element.children.length; i++) {
+    var row = newElement.children[i];
+    for (var j = 0; j < row.children.length; j++) {
+      row.children[j] = normalizeTableCell(row.children[j]);
+    }
+    newElement.children[i] = row;
+  }
+  return newElement;
 };

package/dist/basic-sdk/index.js

@@ -1,5 +1,5 @@
 import SDocEditor from './editor/sdoc-editor';
-import { DiffViewer, SDocViewer } from './views';
+import { DiffViewer, SDocViewer, PublishedRevisionDiffViewer } from './views';
 import SDocOutline from './outline';
 import EventBus from './utils/event-bus';
-export { SDocEditor, SDocViewer, SDocOutline, EventBus, DiffViewer };
+export { SDocEditor, SDocViewer, SDocOutline, EventBus, DiffViewer, PublishedRevisionDiffViewer };

package/dist/basic-sdk/node-id/index.js

@@ -1,5 +1,5 @@
 import { decorateOperation, replacePastedDataId } from './helpers';
-import { getSlateFragmentAttribute } from '../utils/document-utils';
+import { getSlateFragmentAttribute, normalizeCopyNodes } from '../utils/document-utils';
 import { CLIPBOARD_FORMAT_KEY } from '../extension/constants';
 var withNodeId = function withNodeId(editor) {
   var apply = editor.apply;
@@ -16,7 +16,8 @@ var withNodeId = function withNodeId(editor) {
       var decoded = decodeURIComponent(window.atob(fragment));
       var parsed = JSON.parse(decoded);
       var newData = replacePastedDataId(parsed);
-      newEditor.insertFragment(newData);
+      var normalizeNewData = normalizeCopyNodes(newEditor, newData);
+      newEditor.insertFragment(normalizeNewData);
       return newEditor;
     }
   };

package/dist/basic-sdk/outline/index.js

@@ -1,10 +1,10 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import { withTranslation } from 'react-i18next';
-import { UncontrolledTooltip } from 'reactstrap';
 import { INTERNAL_EVENT } from '../constants';
 import EventBus from '../utils/event-bus';
 import OutlineItem from './outline-item';
+import Tooltip from '../../components/tooltip';
 import './style.css';
 export var getOutlineSetting = function getOutlineSetting() {
   var currentValue = localStorage.getItem('sdoc');
@@ -72,7 +72,7 @@ var SDocOutline = function SDocOutline(_ref) {
     id: "sdoc-outline-menu",
     className: "sdoc-outline-menu sdocfont sdoc-table-of-content",
     onClick: toggleShow
-  }), /*#__PURE__*/React.createElement(UncontrolledTooltip, {
+  }), /*#__PURE__*/React.createElement(Tooltip, {
     placement: "right",
     target: "sdoc-outline-menu"
   }, t('Outline'))));

package/dist/basic-sdk/utils/document-utils.js

@@ -2,7 +2,8 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import ObjectUtils from './object-utils';
 import context from '../../context';
 import { generateDefaultText } from '../../basic-sdk/extension/core/utils/index';
-import { CLIPBOARD_ORIGIN_SDOC_KEY } from '../extension/constants';
+import { CLIPBOARD_ORIGIN_SDOC_KEY, ELEMENT_TYPE } from '../extension/constants';
+import { normalizeTableELement } from '../extension/plugins/table/helpers';
 export var normalizeChildren = function normalizeChildren(children) {
   // text
   if (!Array.isArray(children)) return children;
@@ -19,6 +20,15 @@ export var normalizeChildren = function normalizeChildren(children) {
     return child;
   });
 };
+export var normalizeCopyNodes = function normalizeCopyNodes(editor, elements) {
+  if (!Array.isArray(elements) || elements.length === 0) return [];
+  return elements.map(function (element) {
+    if (element.type === ELEMENT_TYPE.TABLE) {
+      return normalizeTableELement(editor, element);
+    }
+    return element;
+  });
+};
 export var setOriginSdocKey = function setOriginSdocKey(event) {
   var docUuid = context.getSetting('docUuid');
   event.clipboardData.setData("text/".concat(CLIPBOARD_ORIGIN_SDOC_KEY), docUuid);