@seafile/sdoc-editor 0.4.0 → 0.4.2-1

package/dist/basic-sdk/assets/css/sdoc-md-viewer.css

@@ -0,0 +1,29 @@
+.sdoc-editor-container {
+  flex: 1;
+  display: flex;
+  min-height: 0;
+}
+
+.sdoc-md-scroll-container {
+  display: flex;
+  overflow: auto;
+}
+
+.sdoc-md-scroll-container .sdoc-article-container {
+  width: 100%;
+  margin: 0 340px 0 40px !important;
+}
+
+.sdoc-md-scroll-container .sdoc-article-container .article .sdoc-header-2 {
+  border-bottom: 1px solid #ccc;
+}
+
+.sdoc-md-outline-container {
+  height: 80%;
+  overflow-y: auto;
+  padding-right: 1rem;
+  position: fixed;
+  right: 0;
+  top: 97px;
+  width: 300px;
+}

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

@@ -29,9 +29,9 @@ export const MODIFY_TYPE = {
 export const REBASE_TYPE = {
   MODIFY_MODIFY: 'modify_modify',
   DELETE_MODIFY: 'delete_modify',
-  MODIFY_DELETE: 'modify_delete',
-  CHILDREN_MODIFY: 'children_modify'
+  MODIFY_DELETE: 'modify_delete'
 };
+export const REBASE_TYPES = [REBASE_TYPE.MODIFY_DELETE, REBASE_TYPE.DELETE_MODIFY, REBASE_TYPE.MODIFY_MODIFY];
 export const REBASE_MARK_KEY = {
   ORIGIN: 'origin',
   REBASE_TYPE: 'rebase_type',

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

@@ -1,14 +1,10 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import { Editor, Element, Point, Transforms, Node, Range } from '@seafile/slate';
-import { ReactEditor } from '@seafile/slate-react';
-import { generateEmptyElement, getSelectedNodeByType, isSelectionAtBlockStart } from '../../core';
+import { Editor, Element, Transforms, Node } from '@seafile/slate';
+import { focusEditor, generateDefaultText, getSelectedNodeByType, isSelectionAtBlockStart } from '../../core';
 import { BLOCKQUOTE, PARAGRAPH, CODE_BLOCK, TABLE } from '../../constants';
 import { setBlockQuoteType, getFormattedElements, getFormattedRestElements } from './helpers';
-import { getCalloutEntry, insertElementAtNewLineInCallout } from '../callout/helper';
 const withBlockquote = editor => {
   const {
     insertBreak,
-    insertText,
     deleteBackward,
     insertFragment
   } = editor;
@@ -18,40 +14,38 @@ const withBlockquote = editor => {
       selection
     } = editor;
     if (selection == null) return insertBreak();
-    const [nodeEntry] = Editor.nodes(editor, {
+    const [quoteBlockEntry] = Editor.nodes(editor, {
       match: n => Element.isElement(n) && n.type === BLOCKQUOTE,
       universal: true
     });
-    if (!nodeEntry) return insertBreak();
-    const quoteElem = nodeEntry[0];
-    const quotePath = ReactEditor.findPath(editor, quoteElem);
-    const quoteEndLocation = Editor.end(editor, quotePath);
-    if (Point.equals(quoteEndLocation, selection.focus)) {
-      // Cursor is at the end of blockquote
-      const str = Node.string(quoteElem);
-      // The last of the blockquote text is \n;
-      if (str && str.slice(-1) === '\n') {
-        const calloutEntry = getCalloutEntry(editor);
-        if (calloutEntry) {
-          // If the cursor is at the end of the callout, insert a paragraph inside the callout
-          // Remove the last \n
-          editor.deleteBackward('character');
-          insertElementAtNewLineInCallout(editor, PARAGRAPH, quotePath);
-          return;
-        }
-        // Step 1: Remove the last \n
-        editor.deleteBackward('character');
-        // Step 2: Insert a paragraph
-        const p = generateEmptyElement(PARAGRAPH);
-        Transforms.insertNodes(newEditor, p, {
-          mode: 'highest'
+    if (!quoteBlockEntry) return insertBreak();
+    const [currentLineEntry] = Editor.nodes(newEditor, {
+      match: n => Element.isElement(n) && n.type === PARAGRAPH,
+      mode: 'lowest'
+    });
+    // Exit blockquote when current line is empty
+    const isAtEnd = currentLineEntry[1].slice(-1)[0] === quoteBlockEntry[0].children.length - 1;
+    if (isAtEnd) {
+      const isEmptyLine = !(currentLineEntry && Editor.string(newEditor, currentLineEntry[1]).length);
+      const movePath = quoteBlockEntry[1];
+      movePath.push(movePath.pop() + 1);
+      if (isEmptyLine) {
+        Transforms.moveNodes(newEditor, {
+          at: currentLineEntry[1],
+          to: movePath
         });
         return;
       }
     }
 
-    // In other cases, insert a newline
-    insertText('\n');
+    // Insert new line
+    Transforms.insertNodes(editor, {
+      type: PARAGRAPH,
+      children: [generateDefaultText()]
+    }, {
+      at: newEditor.selection,
+      select: true
+    });
   };
   newEditor.deleteBackward = unit => {
     const {
@@ -63,32 +57,30 @@ const withBlockquote = editor => {
     }
     const node = getSelectedNodeByType(editor, BLOCKQUOTE);
     if (node) {
-      if (isSelectionAtBlockStart(editor)) {
+      const [currentLineEntry] = Editor.nodes(newEditor, {
+        match: n => Element.isElement(n) && n.type === PARAGRAPH,
+        mode: 'lowest'
+      });
+      if (!currentLineEntry) return deleteBackward(unit);
+      const currentLineIndex = currentLineEntry[1].slice(-1)[0];
+      if (currentLineIndex === 0) {
         setBlockQuoteType(editor, PARAGRAPH);
         return;
       }
-      if (unit === 'line' && Range.isCollapsed(selection)) {
-        const quoteString = Node.string(node);
-        for (let index = selection.anchor.offset; index > 1; index--) {
-          const char = quoteString.slice(index - 1, index);
-          if (char === '\n') {
-            const deleteRange = selection.anchor.offset === index ? _objectSpread(_objectSpread({}, selection), {}, {
-              anchor: _objectSpread(_objectSpread({}, selection.anchor), {}, {
-                offset: index - 1
-              })
-            }) // cursor at beginning of line, delete \n
-            : _objectSpread(_objectSpread({}, selection), {}, {
-              anchor: _objectSpread(_objectSpread({}, selection.anchor), {}, {
-                offset: index
-              })
-            }); // cursor at middle or end of line, save \n
-            Transforms.delete(editor, {
-              at: deleteRange
-            });
-            return;
-          }
-        }
-        deleteBackward(unit);
+      if (isSelectionAtBlockStart(editor)) {
+        const lineText = Node.string(currentLineEntry[0]);
+        const previousNodeEntry = Editor.previous(editor, {
+          at: currentLineEntry[1]
+        });
+        const focusPoint = Editor.end(newEditor, previousNodeEntry[1]);
+        Transforms.insertText(newEditor, lineText, {
+          at: Editor.end(newEditor, previousNodeEntry[1])
+        });
+        Transforms.removeNodes(editor, {
+          at: currentLineEntry[1]
+        });
+        focusEditor(newEditor, focusPoint);
+        return;
       }
     }
     deleteBackward(unit);

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

@@ -86,9 +86,9 @@ const FileLink = _ref => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   let style = {};
-  if (element.ADD) {
+  if (element.add) {
     style = _objectSpread({}, ADDED_STYLE);
-  } else if (element.DELETE) {
+  } else if (element.delete) {
     style = _objectSpread({}, DELETED_STYLE);
   }
   if (style.computed_background_color) {

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

@@ -19,7 +19,6 @@ const ImageHoverMenu = _ref => {
     element,
     parentNodeEntry,
     onHideImageHoverMenu,
-    onShowCaption,
     t
   } = _ref;
   const {
@@ -31,7 +30,7 @@ const ImageHoverMenu = _ref => {
     type
   } = parentNodeEntry[0];
   const {
-    caption = ''
+    show_caption = false
   } = data;
   const [popoverState, setPopoverState] = useState({
     displayPopover: false,
@@ -125,6 +124,14 @@ const ImageHoverMenu = _ref => {
         onHideImageHoverMenu();
         return;
       }
+      if (Object.keys(props)[0] === 'show_caption') {
+        Transforms.setNodes(editor, {
+          data: _objectSpread(_objectSpread({}, data), props)
+        }, {
+          at: path
+        });
+        return;
+      }
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
@@ -182,11 +189,11 @@ const ImageHoverMenu = _ref => {
     id: "sdoc_image_caption",
     role: "button",
     className: classnames('op-item', 'ml-1', {
-      'active': (caption === null || caption === void 0 ? void 0 : caption.length) !== 0
+      'active': show_caption
     }),
-    onClick: () => {
-      onShowCaption();
-    }
+    onClick: event => onSelect(event, {
+      'show_caption': !show_caption
+    })
   }, /*#__PURE__*/React.createElement("i", {
     className: "sdocfont sdoc-describe icon-font mr-1"
   }), isShowTooltip && /*#__PURE__*/React.createElement(Tooltip, {

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

@@ -10,9 +10,10 @@ import { INTERNAL_EVENT } from '../../../constants';
 import ImageHoverMenu from './hover-menu';
 import { useScrollContext } from '../../../hooks/use-scroll-context';
 import { IMAGE_BORDER_TYPE } from './constants';
-import { ADDED_STYLE, DELETED_STYLE } from '../../constants';
+import { ADDED_STYLE, DELETED_STYLE, IMAGE_BLOCK } from '../../constants';
 import imagePlaceholder from '../../../assets/images/image-placeholder.png';
 const Image = _ref => {
+  var _imageRef$current, _imageRef$current2;
   let {
     element,
     editor,
@@ -27,6 +28,9 @@ const Image = _ref => {
     data,
     border_type = IMAGE_BORDER_TYPE[0].type
   } = element;
+  const {
+    show_caption = false
+  } = data;
   const path = ReactEditor.findPath(editor, element);
   const nodeEntry = Editor.node(editor, [path[0]]);
   const imageStyle = {
@@ -42,7 +46,6 @@ const Image = _ref => {
   const [isShowImageHoverMenu, setIsShowImageHoverMenu] = useState(false);
   const [menuPosition, setMenuPosition] = useState({});
   const [caption, setCaption] = useState((data === null || data === void 0 ? void 0 : data.caption) || '');
-  const [isShowCaption, setIsShowCaption] = useState(false);
   const registerEvent = useCallback(eventList => {
     eventList.forEach(element => {
       document.addEventListener(element.eventName, element.event);
@@ -114,7 +117,8 @@ const Image = _ref => {
     var _imagePreviewer$;
     if (isResizing) return;
     const 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;
+    const isCaptionInput = e.target.id === 'sdoc-image-caption-input';
+    if (e.target === imageRef.current || ((_imagePreviewer$ = imagePreviewer[0]) === null || _imagePreviewer$ === void 0 ? void 0 : _imagePreviewer$.contains(e.target)) || isCaptionInput) return;
     setIsShowImageHoverMenu(false);
   }, [isResizing]);
   useEffect(() => {
@@ -225,10 +229,11 @@ const 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))), nodeEntry[0].type === 'image_block' && (isShowCaption || (data === null || data === void 0 ? void 0 : data.caption)) && /*#__PURE__*/React.createElement("input", {
+  }, /*#__PURE__*/React.createElement("span", null, t('Width'), ':', parseInt(movingWidth || ((_imageRef$current = imageRef.current) === null || _imageRef$current === void 0 ? void 0 : _imageRef$current.clientWidth))), /*#__PURE__*/React.createElement("span", null, "\xA0\xA0"), /*#__PURE__*/React.createElement("span", null, t('Height'), ':', imageRef.current.clientHeight))), nodeEntry[0].type === IMAGE_BLOCK && show_caption && /*#__PURE__*/React.createElement("input", {
+    id: "sdoc-image-caption-input",
     className: "sdoc-image-caption-input-wrapper",
     style: {
-      width: (data === null || data === void 0 ? void 0 : data.width) || imageRef.current.clientWidth
+      width: (data === null || data === void 0 ? void 0 : data.width) || ((_imageRef$current2 = imageRef.current) === null || _imageRef$current2 === void 0 ? void 0 : _imageRef$current2.clientWidth)
     },
     placeholder: t('Insert_caption'),
     value: caption,
@@ -246,9 +251,6 @@ const Image = _ref => {
     parentNodeEntry: nodeEntry,
     onHideImageHoverMenu: () => {
       setIsShowImageHoverMenu(false);
-    },
-    onShowCaption: () => {
-      setIsShowCaption(true);
     }
   })));
 };
@@ -266,8 +268,11 @@ export function renderImage(props, editor) {
   if (leaf && leaf.computed_background_color) {
     style['backgroundColor'] = leaf.computed_background_color;
   }
-  if (element.ADD || element.DELETE) {
-    style = Object.assign({}, style, element.ADD ? ADDED_STYLE : DELETED_STYLE);
+  if (element.add || element.delete) {
+    style = Object.assign({}, style, element.add ? ADDED_STYLE : DELETED_STYLE);
+    if (style.computed_background_color) {
+      style['backgroundColor'] = style.computed_background_color;
+    }
   }
   return /*#__PURE__*/React.createElement(SdocImage, Object.assign({}, props, {
     style: style,

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

@@ -88,9 +88,9 @@ const SdocFileLink = _ref => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   let style = {};
-  if (element.ADD) {
+  if (element.add) {
     style = _objectSpread({}, ADDED_STYLE);
-  } else if (element.DELETE) {
+  } else if (element.delete) {
     style = _objectSpread({}, DELETED_STYLE);
   }
   if (style.computed_background_color) {

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

@@ -1,8 +1,9 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import isHotkey from 'is-hotkey';
-import { Editor, Transforms, Path } from '@seafile/slate';
-import { getNodeType, getParentNode, getSelectedNodeByType, isLastNode, generateEmptyElement } from '../../core';
-import { ELEMENT_TYPE, KEYBOARD, PARAGRAPH, CLIPBOARD_FORMAT_KEY } from '../../constants';
+import { Editor, Transforms, Path, Element } from '@seafile/slate';
+import { ReactEditor } from '@seafile/slate-react';
+import { getNodeType, getParentNode, getSelectedNodeByType, isLastNode, generateEmptyElement, focusEditor } from '../../core';
+import { ELEMENT_TYPE, KEYBOARD, PARAGRAPH, CLIPBOARD_FORMAT_KEY, CHECK_LIST_ITEM, ORDERED_LIST, UNORDERED_LIST } from '../../constants';
 import { TABLE_MAX_ROWS, EMPTY_SELECTED_RANGE, TABLE_ELEMENT, TABLE_ELEMENT_POSITION } from './constants';
 import ObjectUtils from '../../../utils/object-utils';
 import { getSelectedInfo, insertTableElement, removeTable, insertMultipleRowsAndColumns, setTableFragmentData, deleteTableRangeData, focusCell, deleteHandler, isTableLocation, isLastTableCell } from './helpers';
@@ -88,9 +89,25 @@ const withTable = editor => {
       const before = Editor.before(newEditor, selection);
       if (before) {
         // If the current is not a table and the previous one is a table, no deletion will be performed. Otherwise, the last cell of the table will be deleted
+        // If deleting node is empty check-list, order-list, unordered-list, change to paragraph
         const isTableOnBeforeLocation = isTableLocation(newEditor, before);
         const isTableOnCurSelection = isTableLocation(newEditor, selection);
         if (isTableOnBeforeLocation && !isTableOnCurSelection) {
+          const transformTypes = [CHECK_LIST_ITEM, ORDERED_LIST, UNORDERED_LIST];
+          const [currentNodeEntry] = Editor.nodes(editor, {
+            match: n => Element.isElement(n) && !Editor.parent(n, ReactEditor.findPath(editor, n))[1].length
+          });
+          if (!currentNodeEntry) return;
+          const [currentNode, currentPath] = Array.from(currentNodeEntry);
+          if (transformTypes.includes(currentNode.type)) {
+            Transforms.delete(newEditor, {
+              at: currentPath
+            });
+            Transforms.insertNodes(newEditor, generateEmptyElement(PARAGRAPH), {
+              at: currentPath
+            });
+            focusEditor(editor, Editor.start(editor, currentPath));
+          }
           return;
         }
       }

package/dist/basic-sdk/extension/render/element-decorate/rebase-decorate/index.css

@@ -1,29 +1,46 @@
 .sdoc-rebase-btn-group {
+  display: flex;
+  width: 100%;
   color: #aaa;
+  margin-bottom: 3px;
 }
 
 .sdoc-rebase-btn-group .sdoc-rebase-btn {
   cursor: pointer;
 }
 
-.sdoc-rebase-current-changes-start {
+.sdoc-rebase-other-changes-title {
+  width: 100%;
+  padding-left: 4px;
   background-color: rgb(202, 232, 254);
+  border-radius: 3px 3px 0 0;
 }
 
-.sdoc-rebase-current-changes {
+.sdoc-rebase-other-changes {
   background-color: rgba(202, 232, 254, .8);
+  border-radius: 0 0 3px 3px;
+  margin-bottom: 3px;
 }
 
-.sdoc-rebase-incoming-changes {
+.sdoc-rebase-my-changes-title {
+  width: 100%;
+  padding-left: 4px;
+  background-color: rgb(212, 212, 254);
+  border-radius: 3px 3px 0 0;
+}
+
+.sdoc-rebase-my-changes {
   background-color: rgb(222, 232, 254);
+  border-radius: 0 0 3px 3px;
 }
 
-.sdoc-rebase-incoming-changes > *:first-child,
-.sdoc-rebase-current-changes > *:first-child {
-  margin: 0;
-  padding: 0.8em 0 0.8em 0.2em;
+.sdoc-rebase-my-changes.empty,
+.sdoc-rebase-other-changes.empty {
+  height: 3px;
 }
 
-.sdoc-rebase-incoming-changes-end {
-  background-color: rgb(212, 212, 254);
+.sdoc-rebase-my-changes > *:first-child,
+.sdoc-rebase-other-changes > *:first-child {
+  margin: 0;
+  padding: 0.8em 0 0.8em 0.2em;
 }

package/dist/basic-sdk/extension/render/element-decorate/rebase-decorate/rebase-delete-modify-decorate.js

@@ -35,7 +35,7 @@ const RebaseDeleteModifyDecorate = _ref => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [editor, element]);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-    className: "w-100 d-flex sdoc-rebase-btn-group",
+    className: "sdoc-rebase-btn-group",
     contentEditable: false
   }, /*#__PURE__*/React.createElement("div", {
     className: "sdoc-rebase-btn",
@@ -51,17 +51,17 @@ const RebaseDeleteModifyDecorate = _ref => {
     className: "sdoc-rebase-btn",
     onClick: deleteMark
   }, t('Keep_both_modification'))), /*#__PURE__*/React.createElement("div", {
-    className: "w-100 sdoc-rebase-current-changes-start",
+    className: "sdoc-rebase-other-changes-title",
     contentEditable: false
-  }, '<<<<<<<'), /*#__PURE__*/React.createElement("div", {
-    className: "w-100",
+  }, t('Other_modification')), /*#__PURE__*/React.createElement("div", {
+    className: "sdoc-rebase-other-changes empty",
     contentEditable: false
-  }, '======='), /*#__PURE__*/React.createElement("div", {
-    className: "w-100 sdoc-rebase-incoming-changes",
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "sdoc-rebase-my-changes-title",
     contentEditable: false
-  }, children), /*#__PURE__*/React.createElement("div", {
-    className: "w-100 sdoc-rebase-incoming-changes-end",
+  }, t('My_modification')), /*#__PURE__*/React.createElement("div", {
+    className: "sdoc-rebase-my-changes",
     contentEditable: false
-  }, '>>>>>>>'));
+  }, children));
 };
 export default RebaseDeleteModifyDecorate;

package/dist/basic-sdk/extension/render/element-decorate/rebase-decorate/rebase-modify-delete-decorate.js

@@ -35,7 +35,7 @@ const RebaseModifyDeleteDecorate = _ref => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [editor, element]);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-    className: "w-100 d-flex sdoc-rebase-btn-group",
+    className: "sdoc-rebase-btn-group",
     contentEditable: false
   }, /*#__PURE__*/React.createElement("div", {
     className: "sdoc-rebase-btn",
@@ -51,17 +51,17 @@ const RebaseModifyDeleteDecorate = _ref => {
     className: "sdoc-rebase-btn",
     onClick: deleteMark
   }, t('Keep_both_modification'))), /*#__PURE__*/React.createElement("div", {
-    className: "w-100 sdoc-rebase-current-changes-start",
+    className: "sdoc-rebase-other-changes-title",
     contentEditable: false
-  }, '<<<<<<<'), /*#__PURE__*/React.createElement("div", {
-    className: "w-100 sdoc-rebase-incoming-changes",
+  }, t('Other_modification')), /*#__PURE__*/React.createElement("div", {
+    className: "w-100 sdoc-rebase-my-changes",
     contentEditable: false
   }, children), /*#__PURE__*/React.createElement("div", {
-    className: "w-100",
+    className: "sdoc-rebase-my-changes-title",
     contentEditable: false
-  }, '======='), /*#__PURE__*/React.createElement("div", {
-    className: "w-100 sdoc-rebase-incoming-changes-end",
+  }, t('My_modification')), /*#__PURE__*/React.createElement("div", {
+    className: "sdoc-rebase-my-changes empty",
     contentEditable: false
-  }, '>>>>>>>'));
+  }));
 };
 export default RebaseModifyDeleteDecorate;

package/dist/basic-sdk/extension/render/element-decorate/rebase-decorate/rebase-modify-modify-decorate.js

@@ -62,7 +62,7 @@ const RebaseModifyModifyDecorate = _ref => {
   }, [editor, element]);
   if (element[REBASE_MARK_KEY.ORIGIN] === REBASE_ORIGIN.OTHER) {
     return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-      className: "w-100 d-flex sdoc-rebase-btn-group",
+      className: "sdoc-rebase-btn-group",
       contentEditable: false
     }, /*#__PURE__*/React.createElement("div", {
       className: "sdoc-rebase-btn",
@@ -78,22 +78,19 @@ const RebaseModifyModifyDecorate = _ref => {
       className: "sdoc-rebase-btn",
       onClick: useBothChanges
     }, t('Keep_both_modification'))), /*#__PURE__*/React.createElement("div", {
-      className: "w-100 sdoc-rebase-current-changes-start",
+      className: "sdoc-rebase-other-changes-title",
       contentEditable: false
-    }, '<<<<<<<'), /*#__PURE__*/React.createElement("div", {
-      className: "w-100 sdoc-rebase-current-changes",
+    }, t('Other_modification')), /*#__PURE__*/React.createElement("div", {
+      className: "sdoc-rebase-other-changes",
       contentEditable: false
     }, children));
   }
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-    className: "w-100",
+    className: "sdoc-rebase-my-changes-title",
     contentEditable: false
-  }, '======='), /*#__PURE__*/React.createElement("div", {
-    className: "w-100 sdoc-rebase-incoming-changes",
+  }, t('My_modification')), /*#__PURE__*/React.createElement("div", {
+    className: "sdoc-rebase-my-changes",
     contentEditable: false
-  }, children), /*#__PURE__*/React.createElement("div", {
-    className: "w-100 sdoc-rebase-incoming-changes-end",
-    contentEditable: false
-  }, '>>>>>>>'));
+  }, children));
 };
 export default RebaseModifyModifyDecorate;

package/dist/basic-sdk/index.js

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

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

@@ -0,0 +1,70 @@
+import React, { useCallback, useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import OutlineItem from './Outline-item';
+import { useScrollContext } from '../hooks/use-scroll-context';
+import './style.css';
+const getHeaderList = children => {
+  const headerList = [];
+  children.forEach(node => {
+    if (node.type === 'header2' || node.type === 'header3') {
+      headerList.push(node);
+    }
+  });
+  return headerList;
+};
+const Outline = _ref => {
+  let {
+    editor
+  } = _ref;
+  const {
+    t
+  } = useTranslation();
+  const scrollRef = useScrollContext();
+  const [headerList, setHeaderList] = useState([]);
+  const [activeId, setActiveId] = useState('');
+  useEffect(() => {
+    const headerList = getHeaderList(editor.children);
+    setHeaderList(headerList);
+  }, [editor.children]);
+  const handleScroll = useCallback(e => {
+    const scrollTop = scrollRef.current.scrollTop;
+    const styles = getComputedStyle(scrollRef === null || scrollRef === void 0 ? void 0 : scrollRef.current);
+    const paddingTop = parseInt(styles.paddingTop);
+    for (let i = 0; i < headerList.length; i++) {
+      const headerItem = headerList[i];
+      const dom = document.getElementById(headerItem.id);
+      const {
+        offsetTop,
+        offsetHeight
+      } = dom;
+      const styles = getComputedStyle(dom);
+      const marginTop = parseInt(styles.marginTop);
+      if (offsetTop + offsetHeight + marginTop > scrollTop - paddingTop) {
+        setActiveId(headerItem.id);
+        break;
+      }
+    }
+  }, [headerList, scrollRef]);
+  useEffect(() => {
+    let observerRefValue = null;
+    if (scrollRef.current) {
+      scrollRef.current.addEventListener('scroll', handleScroll);
+      observerRefValue = scrollRef.current;
+    }
+    return () => {
+      observerRefValue.removeEventListener('scroll', handleScroll);
+    };
+  }, [handleScroll, scrollRef]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "sdoc-md-editor-outline"
+  }, headerList.length === 0 && /*#__PURE__*/React.createElement("div", {
+    className: "empty-container"
+  }, t('No_out_line')), headerList.length > 0 && headerList.map((node, index) => {
+    return /*#__PURE__*/React.createElement(OutlineItem, {
+      key: index,
+      node: node,
+      activeId: activeId
+    });
+  }));
+};
+export default Outline;

package/dist/basic-sdk/md-outline/outline-item.js

@@ -0,0 +1,24 @@
+import React, { useCallback } from 'react';
+import classNames from 'classnames';
+const OutlineItem = _ref => {
+  let {
+    node,
+    activeId
+  } = _ref;
+  const onItemClick = useCallback(() => {
+    const {
+      id
+    } = node;
+    document.getElementById(id).scrollIntoView();
+  }, [node]);
+  const className = classNames({
+    'outline-h2': node.type === 'header2',
+    'outline-h3': node.type === 'header3',
+    'active': node.id === activeId
+  });
+  return /*#__PURE__*/React.createElement("div", {
+    className: className,
+    onClick: onItemClick
+  }, node.children.map(child => child.text).join(''));
+};
+export default OutlineItem;

package/dist/basic-sdk/md-outline/style.css

@@ -0,0 +1,45 @@
+.sdoc-md-editor-outline {
+  border-left: 1px solid #ddd;
+  padding: .5rem 1rem .5rem 0;
+}
+
+.sdoc-md-editor-outline .outline-h2, 
+.sdoc-md-editor-outline .outline-h3 {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.sdoc-md-editor-outline .outline-h2 {
+  margin-left: 20px;
+  line-height: 2.5;
+  color:#364149;
+  white-space: nowrap;
+  cursor:pointer;
+}
+
+.sdoc-md-editor-outline .outline-h2:hover {
+  color: #eb8205;
+}
+
+.sdoc-md-editor-outline .outline-h3 {
+  margin-left: 40px;
+  line-height: 2.5;
+  color:#364149;
+  white-space: nowrap;
+  cursor:pointer;
+}
+
+.sdoc-md-editor-outline .outline-h3:hover {
+  color: #eb8205;
+}
+
+.sdoc-md-editor-outline .empty-container {
+  margin-top: 10px;
+  text-align: center;
+}
+
+.sdoc-md-editor-outline .outline-h2.active,
+.sdoc-md-editor-outline .outline-h3.active {
+  color: #eb8205;
+}

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

@@ -1,12 +1,29 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import { generateIdMapAndIds, getIdDiffs } from './diff';
 import ObjectUtils from './object-utils';
-import { MODIFY_TYPE, REBASE_TYPE, REBASE_MARK_KEY, REBASE_ORIGIN } from '../constants';
+import { MODIFY_TYPE, REBASE_TYPE, REBASE_MARK_KEY, REBASE_ORIGIN, REBASE_TYPES } from '../constants';
 import { ELEMENT_TYPE } from '../extension/constants';
 import { replaceNodeId } from '../node-id/helpers';
 export const hasConflict = content => {
   if (!Array.isArray(content) || content.length === 0) return false;
-  return content.filter(item => item.rebase_type).length !== 0;
+  let flag = false;
+  for (let i = 0; i < content.length; i++) {
+    const element = content[i];
+    const {
+      rebase_type,
+      children
+    } = element;
+    if (REBASE_TYPES.includes(rebase_type)) {
+      flag = true;
+      break;
+    } else {
+      const childrenFlag = hasConflict(children);
+      if (!childrenFlag) continue;
+      flag = childrenFlag;
+      break;
+    }
+  }
+  return flag;
 };
 const getChanges = (masterContent, revisionContent) => {
   const {
@@ -156,8 +173,7 @@ const getMergeElement = (diffElement, baseElement) => {
       content: childrenContent
     } = getMergeContent(baseElement, diffElement.children);
     return [_objectSpread(_objectSpread({}, newElement), {}, {
-      children: childrenContent,
-      [REBASE_MARK_KEY.REBASE_TYPE]: REBASE_TYPE.CHILDREN_MODIFY
+      children: childrenContent
     })];
   }
   newElement[REBASE_MARK_KEY.OLD_ELEMENT] && delete newElement[REBASE_MARK_KEY.OLD_ELEMENT];

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

@@ -2,4 +2,5 @@ import SDocViewer from './sdoc-viewer';
 import DiffViewer from './sdoc-diff-viewer';
 import RevisionDiffViewer from './revision-diff-viewer';
 import PublishedRevisionDiffViewer from './published-revision-diff-viewer';
-export { SDocViewer, DiffViewer, RevisionDiffViewer, PublishedRevisionDiffViewer };
+import SDocMdViewer from './sdoc-md-viewer';
+export { SDocViewer, DiffViewer, RevisionDiffViewer, PublishedRevisionDiffViewer, SDocMdViewer };

package/dist/basic-sdk/views/sdoc-md-viewer.js

@@ -0,0 +1,44 @@
+import React, { useRef } from 'react';
+import { createDefaultEditor } from '../extension';
+import withNodeId from '../node-id';
+import { generateDefaultDocContent } from '../../utils';
+import { EditorContainer } from '../layout';
+import ReadOnlyArticle from './readonly-article';
+import { ColorProvider } from '../hooks/use-color-context';
+import { ScrollContext } from '../hooks/use-scroll-context';
+import Outline from '../md-outline';
+import '../assets/css/sdoc-md-viewer.css';
+const SDocMdViewer = _ref => {
+  let {
+    editor,
+    document,
+    showOutline
+  } = _ref;
+  const validEditor = editor || withNodeId(createDefaultEditor());
+  const slateValue = (document || generateDefaultDocContent()).children;
+  const scrollRef = useRef(null);
+  return /*#__PURE__*/React.createElement(EditorContainer, {
+    editor: validEditor,
+    readonly: true
+  }, /*#__PURE__*/React.createElement(ColorProvider, null, /*#__PURE__*/React.createElement("div", {
+    ref: scrollRef,
+    className: "sdoc-md-scroll-container"
+  }, /*#__PURE__*/React.createElement(ScrollContext.Provider, {
+    value: {
+      scrollRef
+    }
+  }, /*#__PURE__*/React.createElement(ReadOnlyArticle, {
+    editor: validEditor,
+    slateValue: slateValue,
+    isShowComment: false
+  }), showOutline && /*#__PURE__*/React.createElement("div", {
+    className: "sdoc-md-outline-container"
+  }, /*#__PURE__*/React.createElement(Outline, {
+    editor: validEditor
+  }))))));
+};
+SDocMdViewer.defaultProps = {
+  showToolbar: false,
+  showOutline: false
+};
+export default SDocMdViewer;

package/dist/components/doc-operations/index.js

@@ -2,7 +2,6 @@ import React from 'react';
 import { withTranslation } from 'react-i18next';
 import context from '../../context';
 import RevisionOperations from './revision-operations';
-import HistoryOperation from './history-operation';
 import CollaboratorsOperation from './collaborators-operation';
 import MoreOperations from './more-operations';
 import CommentsOperation from './comments-operation';
@@ -34,6 +33,6 @@ const DocOperations = _ref => {
     handleViewChangesToggle: handleViewChangesToggle,
     handleRevisionMerged: handleRevisionMerged,
     handleRevisionPublished: handleRevisionPublished
-  }), !isPublished && /*#__PURE__*/React.createElement(TagOperation, null), !isPublished && /*#__PURE__*/React.createElement(CommentsOperation, null), !isSdocRevision && /*#__PURE__*/React.createElement(ShareOperation, null), /*#__PURE__*/React.createElement(HistoryOperation, null), !isPublished && /*#__PURE__*/React.createElement(CollaboratorsOperation, null), !isSdocRevision && /*#__PURE__*/React.createElement(MoreOperations, null));
+  }), !isPublished && /*#__PURE__*/React.createElement(TagOperation, null), !isPublished && /*#__PURE__*/React.createElement(CommentsOperation, null), !isSdocRevision && /*#__PURE__*/React.createElement(ShareOperation, null), !isPublished && /*#__PURE__*/React.createElement(CollaboratorsOperation, null), !isSdocRevision && /*#__PURE__*/React.createElement(MoreOperations, null));
 };
 export default withTranslation('sdoc-editor')(DocOperations);

package/dist/components/doc-operations/more-operations.js

@@ -9,6 +9,12 @@ const MoreOperations = _ref => {
     t
   } = _ref;
   const [isDropdownOpen, setIsDropdownOpen] = useState(false);
+  const parentFolderURL = context.getSetting('parentFolderURL');
+  const isPro = context.getSetting('isPro');
+  const isFreezed = context.getSetting('isFreezed');
+  const docPerm = context.getSetting('docPerm');
+  const historyURL = context.getSetting('historyURL');
+  const isSdocRevision = context.getSetting('isSdocRevision');
   const toggleDropdown = useCallback(isDropdownOpen => {
     setIsDropdownOpen(!isDropdownOpen);
   }, []);
@@ -20,9 +26,13 @@ const MoreOperations = _ref => {
     const eventBus = EventBus.getInstance();
     eventBus.dispatch(EXTERNAL_EVENT.UNFREEZE);
   }, []);
-  const parentFolderURL = context.getSetting('parentFolderURL');
-  const isPro = context.getSetting('isPro');
-  const isFreezed = context.getSetting('isFreezed');
+  const handleClickHistory = useCallback(event => {
+    if (docPerm !== 'rw' || !historyURL) return;
+    if (isSdocRevision) return;
+    event.stopPropagation();
+    event.nativeEvent.stopImmediatePropagation();
+    window.location.href = historyURL;
+  }, [docPerm, historyURL, isSdocRevision]);
   return /*#__PURE__*/React.createElement(Dropdown, {
     isOpen: isDropdownOpen,
     toggle: () => toggleDropdown(isDropdownOpen)
@@ -44,6 +54,9 @@ const MoreOperations = _ref => {
   }, t('Unfreeze')), isPro && !isFreezed && /*#__PURE__*/React.createElement(DropdownItem, {
     className: "sdoc-dropdown-menu-item",
     onClick: onFreezeDocument
-  }, t('Freeze_Document'))));
+  }, t('Freeze_Document')), /*#__PURE__*/React.createElement(DropdownItem, {
+    className: "sdoc-dropdown-menu-item",
+    onClick: handleClickHistory
+  }, t('Document_history'))));
 };
 export default withTranslation('sdoc-editor')(MoreOperations);

package/dist/components/tip-dialog/index.js

@@ -27,7 +27,7 @@ const TipDialog = _ref => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [tipType, isSubmitting]);
   const onSubmit = useCallback(() => {
-    if (tipType === TIP_TYPE.HAS_CONFLICT_BEFORE_VIEW_CHANGES) {
+    if ([TIP_TYPE.HAS_CONFLICT_BEFORE_VIEW_CHANGES, TIP_TYPE.HAS_CONFLICT_BEFORE_PUBLISH].includes(tipType)) {
       closeDialog();
       return;
     }

package/dist/index.js

@@ -4,4 +4,5 @@ import SimpleEditor from './pages/simple-editor';
 import SimpleViewer from './pages/simple-viewer';
 import DiffViewer from './pages/diff-viewer';
 import PublishedRevisionViewer from './pages/published-revision-viewer';
-export { SDocViewer, SimpleEditor, SimpleViewer, EventBus, EXTERNAL_EVENT, DiffViewer, PublishedRevisionViewer };
+import MarkdownViewer from './pages/markdown-viewer';
+export { SDocViewer, SimpleEditor, SimpleViewer, EventBus, EXTERNAL_EVENT, DiffViewer, PublishedRevisionViewer, MarkdownViewer };

package/dist/pages/markdown-viewer.js

@@ -0,0 +1,17 @@
+import React from 'react';
+import context from '../context';
+import ErrorBoundary from './error-boundary';
+import { SDocMdViewer } from '../basic-sdk';
+import '../assets/css/simple-viewer.css';
+context.initApi();
+const MarkdownViewer = _ref => {
+  let {
+    document,
+    showOutline
+  } = _ref;
+  return /*#__PURE__*/React.createElement(ErrorBoundary, null, /*#__PURE__*/React.createElement(SDocMdViewer, {
+    document: document,
+    showOutline: showOutline
+  }));
+};
+export default MarkdownViewer;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seafile/sdoc-editor",
-  "version": "0.4.0",
+  "version": "0.4.2-1",
   "private": false,
   "description": "This is a sdoc editor",
   "main": "dist/index.js",

package/public/locales/en/sdoc-editor.json

@@ -425,5 +425,8 @@
   "Column_number": "Column number",
   "The_maximum_row_number_is_{number}": "The maximum row number is {number}",
   "Freeze_Document": "Freeze Document",
-  "Unfreeze": "Unfreeze"
+  "Unfreeze": "Unfreeze",
+  "Other_modification": "Other's modification",
+  "My_modification": "My modification",
+  "Document_history": "Document history"
 }

package/public/locales/fr/sdoc-editor.json

@@ -424,5 +424,6 @@
   "Row_number": "Row number",
   "Column_number": "Column number",
   "The_maximum_row_number_is_{number}": "The maximum row number is {number}",
-  "The_maximum_column_number_is_{number}": "The maximum column number is {number}"
+  "Freeze_Document": "Freeze Document",
+  "Unfreeze": "Unfreeze"
 }

package/public/locales/ru/sdoc-editor.json

@@ -424,6 +424,6 @@
   "Row_number": "Номер строки",
   "Column_number": "Номер столбца",
   "The_maximum_row_number_is_{number}": "Максимальное количество строк - {number}",
-  "Freeze_Document": "Freeze Document",
-  "Unfreeze": "Unfreeze"
+  "Freeze_Document": "Заморозить документ",
+  "Unfreeze": "Разморозить"
 }

package/public/locales/zh_CN/sdoc-editor.json

@@ -376,7 +376,7 @@
   "Link_sdoc": "链接 sdoc",
   "Link_file": "文件链接",
   "Keep_my_modification": "保留我的更改",
-  "Keep_other_modification": "保留其他的更改",
+  "Keep_other_modification": "保留他人的更改",
   "Keep_both_modification": "保留两者更改",
   "Tip": "提示",
   "Rebase_delete_no_change_revision_tip": "修订改没有更改，是否删除修订稿？",
@@ -425,5 +425,8 @@
   "Column_number": "列数",
   "The_maximum_row_number_is_{number}": "最大行数为 {number}",
   "Freeze_Document": "冻结文档",
-  "Unfreeze": "取消冻结"
+  "Unfreeze": "取消冻结",
+  "Other_modification": "他人更改",
+  "My_modification": "我的更改",
+  "Document_history":"文档历史"
 }

package/dist/components/doc-operations/history-operation.js

@@ -1,23 +0,0 @@
-import React, { useCallback } from 'react';
-import context from '../../context';
-const HistoryOperation = () => {
-  const docPerm = context.getSetting('docPerm');
-  const historyURL = context.getSetting('historyURL');
-  const isSdocRevision = context.getSetting('isSdocRevision');
-  const toggleHistory = useCallback(event => {
-    event.stopPropagation();
-    event.nativeEvent.stopImmediatePropagation();
-    window.location.href = historyURL;
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-  if (docPerm !== 'rw' || !historyURL) return null;
-  if (isSdocRevision) return null;
-  return /*#__PURE__*/React.createElement("span", {
-    className: "op-item",
-    onClick: toggleHistory
-  }, /*#__PURE__*/React.createElement("i", {
-    className: "sdocfont sdoc-history"
-  }));
-};
-export default HistoryOperation;