@seafile/sdoc-editor 0.1.172 → 0.1.174

package/dist/api/seafile-api.js

@@ -125,6 +125,14 @@ var SeafileAPI = /*#__PURE__*/function () {
         image_list: imageList
       });
     }
+  }, {
+    key: "getLinkFilesInfo",
+    value: function getLinkFilesInfo(docUuid, filesUrl) {
+      var url = '/api/v2.1/seadoc/files-info/' + docUuid + '/';
+      return this.req.post(url, {
+        files_url: filesUrl
+      });
+    }
   }]);
   return SeafileAPI;
 }();

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

@@ -7,6 +7,7 @@ import { useCursorPosition } from '../helper';
 import CommentList from './comment-list';
 import { useSelectionElement } from '../../hooks/use-selection-element';
 import { useCommentContext } from '../hooks/use-comment-context';
+import ElementsCommentCount from './elements-comment-count';
 var EditorComment = function EditorComment() {
   useSelectionUpdate();
   var editor = useSlateStatic();
@@ -82,8 +83,10 @@ var EditorComment = function EditorComment() {
     className: "add-comment-icon",
     onClick: onAddCommentToggle
   }, /*#__PURE__*/React.createElement("i", {
-    className: "sdocfont sdoc-comment mr-1"
-  }))), /*#__PURE__*/React.createElement("div", {
+    className: "sdocfont sdoc-add-comment mr-1"
+  }))), /*#__PURE__*/React.createElement(ElementsCommentCount, {
+    elementCommentsMap: element_comments_map
+  }), /*#__PURE__*/React.createElement("div", {
     className: "comment-list-wrapper",
     style: isShowComments ? {
       width: '294px'

package/dist/basic-sdk/comment/comment/elements-comment-count/element-comment-count.js

@@ -0,0 +1,40 @@
+import React, { useCallback } from 'react';
+import { useSlateStatic } from '@seafile/slate-react';
+import { Editor } from '@seafile/slate';
+import { getNodeById, focusEditor, findPath } from '../../../extension/core';
+import { useScrollContext } from '../../../hooks/use-scroll-context';
+import { getElementCommentCountTop } from '../../helper';
+import { eventStopPropagation } from '../../../utils/mouse-event';
+var ElementCommentCount = function ElementCommentCount(_ref) {
+  var _scrollRef$current;
+  var elementId = _ref.elementId,
+    commentsCount = _ref.commentsCount;
+  var editor = useSlateStatic();
+  var element = getNodeById(editor.children, elementId);
+  var scrollRef = useScrollContext();
+  var onClick = useCallback(function (event) {
+    eventStopPropagation(event);
+    var path = findPath(editor, element);
+    var endOfFirstNode = Editor.end(editor, path);
+    var range = {
+      anchor: endOfFirstNode,
+      focus: endOfFirstNode
+    };
+    focusEditor(editor, range);
+  }, [editor, element]);
+  if (!element) return null;
+  var scrollTop = (scrollRef === null || scrollRef === void 0 ? void 0 : (_scrollRef$current = scrollRef.current) === null || _scrollRef$current === void 0 ? void 0 : _scrollRef$current.scrollTop) || 0;
+  var top = getElementCommentCountTop(editor, element, scrollTop);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "element-comments-count",
+    style: {
+      top: top
+    },
+    onClick: onClick
+  }, /*#__PURE__*/React.createElement("i", {
+    className: "sdocfont sdoc-comment-count"
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "element-comments-count-value"
+  }, commentsCount));
+};
+export default ElementCommentCount;

package/dist/basic-sdk/comment/comment/elements-comment-count/index.css

@@ -0,0 +1,29 @@
+.sdoc-comment-container .comment-container-right .element-comments-count {
+  position: absolute;
+  left: -22px;
+  height: 16px;
+  width: 16px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #999;
+}
+
+.sdoc-comment-container .comment-container-right .element-comments-count:hover {
+  color: #333;
+  cursor: pointer;
+}
+
+.sdoc-comment-container .comment-container-right .element-comments-count-value {
+  width: 16px;
+  height: 14px;
+  position: absolute;
+  left: 0;
+  top: 0;
+  cursor: pointer;
+  pointer-events: none;
+  font-size: 12px;
+  color: #fff;
+  line-height: 13px;
+  text-align: center;
+}

package/dist/basic-sdk/comment/comment/elements-comment-count/index.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import ElementCommentCount from './element-comment-count';
+import './index.css';
+var ElementsCommentCount = function ElementsCommentCount(_ref) {
+  var elementCommentsMap = _ref.elementCommentsMap;
+  if (!elementCommentsMap) return null;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "elements-comments-count"
+  }, Object.keys(elementCommentsMap).map(function (elementId) {
+    var comments = elementCommentsMap[elementId];
+    if (!Array.isArray(comments) || comments.length === 0) return null;
+    var unresolvedComment = comments.filter(function (item) {
+      return !item.resolved;
+    });
+    var unresolvedCommentCount = unresolvedComment.length;
+    if (unresolvedCommentCount === 0) return null;
+    return /*#__PURE__*/React.createElement(ElementCommentCount, {
+      key: elementId,
+      elementId: elementId,
+      commentsCount: unresolvedCommentCount
+    });
+  }));
+};
+export default ElementsCommentCount;

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

@@ -1,3 +1,4 @@
+import { ReactEditor } from '@seafile/slate-react';
 import context from '../../context';
 import { useScrollContext } from '../hooks/use-scroll-context';
 export var getSelectionRange = function getSelectionRange() {
@@ -41,4 +42,21 @@ export var getAvatarUrl = function getAvatarUrl() {
   var server = context.getSetting('serviceUrl');
   var avatarUrl = "".concat(server, "/media/avatars/default.png");
   return avatarUrl;
+};
+export var getElementCommentCountTop = function getElementCommentCountTop(editor, element, scrollTop) {
+  var minY;
+  var children = element.children || [];
+  children.forEach(function (child) {
+    var childDom = ReactEditor.toDOMNode(editor, child);
+
+    // use child real dom
+    var childRealDom = childDom.childNodes[0];
+    var _ref2 = childRealDom ? childRealDom.getBoundingClientRect() : {
+        y: 0
+      },
+      y = _ref2.y;
+    if (!minY) minY = y;
+    minY = Math.min(minY, y);
+  });
+  return minY - 100 + scrollTop; // 100: header height(56) + toolbar height(44)
 };

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

@@ -1,6 +1,6 @@
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import { commentDecorate } from '../comment/comment-decorate';
-import { highlightDecorate } from '../highlight-decorate';
+import { highlightDecorate } from '../highlight';
 import useSelectionUpdate from '../hooks/use-selection-update';
 var pluginDecorates = [highlightDecorate, commentDecorate];
 export var usePipDecorate = function usePipDecorate(editor) {

package/dist/basic-sdk/editor/editable-article.js

@@ -5,7 +5,6 @@ import { getAboveBlockNode, getNextNode, getPrevNode, isSelectionAtBlockEnd, isS
 import EventProxy from '../utils/event-handler';
 import { useCursors } from '../cursor/use-cursors';
 import { INTERNAL_EVENT } from '../constants';
-import { SetNodeToDecorations } from '../highlight-decorate/setNodeToDecorations';
 import CommentContextProvider from '../comment/comment-context-provider';
 import CommentWrapper from '../comment';
 import { usePipDecorate } from '../decorates';
@@ -13,6 +12,7 @@ import { getCursorPosition, getDomHeight, getDomMarginTop } from '../utils/dom-u
 import EventBus from '../utils/event-bus';
 import { ArticleContainer } from '../layout';
 import { useScrollContext } from '../hooks/use-scroll-context';
+import { SetNodeToDecorations } from '../highlight';
 var EditableArticle = function EditableArticle(_ref) {
   var isShowComment = _ref.isShowComment,
     editor = _ref.editor,

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

@@ -44,6 +44,30 @@ export var getNode = function getNode(editor, path) {
 export var getNodeType = function getNodeType(node) {
   return Element.isElement(node) ? node.type : '';
 };
+export var getNodeById = function getNodeById(nodes, nodeId) {
+  var node;
+  for (var i = 0; i < nodes.length; i++) {
+    var currentNode = nodes[i];
+    if (currentNode.id === nodeId) {
+      node = currentNode;
+      break;
+    }
+    var childrenNodes = currentNode.children;
+    if (!Array.isArray(childrenNodes)) continue;
+    var childNode = childrenNodes.find(function (node) {
+      return node.id === nodeId;
+    });
+    if (childNode) {
+      node = childNode;
+      break;
+    }
+    childNode = getNodeById(childrenNodes, nodeId);
+    if (!childNode) continue;
+    node = childNode;
+    break;
+  }
+  return node;
+};
 export var isTextNode = function isTextNode(node) {
   if (!node) return false;
   if (!ObjectUtils.hasProperty(node, 'children') && ObjectUtils.hasProperty(node, 'text')) return true;

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

@@ -1,4 +1,5 @@
 export * from './move-children';
 export * from './remove-node-children';
 export * from './focus-editor';
-export * from './replace-node-children';
+export * from './replace-node';
+export * from './update-parent-node.js';

package/dist/basic-sdk/extension/core/transforms/update-parent-node.js

@@ -0,0 +1,25 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import { REBASE_MARK_KEY } from '../../../constants';
+import { getNode } from '../queries';
+import { replaceNode } from './replace-node';
+export var updateRebaseParentNodeByPath = function updateRebaseParentNodeByPath(editor, path) {
+  var parentPath = path.slice(0, -1);
+  var parentNode = getNode(editor, parentPath);
+  if (parentNode.children.filter(function (item) {
+    return item[REBASE_MARK_KEY.REBASE_TYPE];
+  }).length !== 0) return;
+  var newParentElement = _objectSpread({}, parentNode);
+  newParentElement[REBASE_MARK_KEY.REBASE_TYPE] && delete newParentElement[REBASE_MARK_KEY.REBASE_TYPE];
+  newParentElement[REBASE_MARK_KEY.OLD_ELEMENT] && delete newParentElement[REBASE_MARK_KEY.OLD_ELEMENT];
+  newParentElement[REBASE_MARK_KEY.ORIGIN] && delete newParentElement[REBASE_MARK_KEY.ORIGIN];
+  newParentElement['children'] = newParentElement['children'].map(function (item) {
+    item[REBASE_MARK_KEY.REBASE_TYPE] && delete item[REBASE_MARK_KEY.REBASE_TYPE];
+    item[REBASE_MARK_KEY.OLD_ELEMENT] && delete item[REBASE_MARK_KEY.OLD_ELEMENT];
+    item[REBASE_MARK_KEY.ORIGIN] && delete item[REBASE_MARK_KEY.ORIGIN];
+    return item;
+  });
+  replaceNode(editor, {
+    at: parentPath,
+    nodes: newParentElement
+  });
+};

package/dist/basic-sdk/extension/plugins/link/dialog/add-link-dialog/index.js

@@ -1,7 +1,7 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import React, { Fragment, useCallback, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { Button, Modal, ModalHeader, ModalBody, ModalFooter, Alert } from 'reactstrap';
+import { Button, Modal, ModalHeader, ModalBody, ModalFooter, Alert, Label } from 'reactstrap';
 import { insertLink, updateLink, checkLink } from '../../helpers';
 var AddLinkDialog = function AddLinkDialog(_ref) {
   var editor = _ref.editor,
@@ -89,9 +89,8 @@ var AddLinkDialog = function AddLinkDialog(_ref) {
     toggle: closeDialog
   }, t('Insert_link')), /*#__PURE__*/React.createElement(ModalBody, null, /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
     className: "form-group"
-  }, /*#__PURE__*/React.createElement("label", {
-    className: "form-check-label",
-    htmlFor: "addLink"
+  }, /*#__PURE__*/React.createElement(Label, {
+    for: "addLink"
   }, t('Link_address')), /*#__PURE__*/React.createElement("input", {
     onKeyDown: onKeyDown,
     autoFocus: true,
@@ -105,9 +104,8 @@ var AddLinkDialog = function AddLinkDialog(_ref) {
     className: "mt-2"
   }, t(linkErrorMessage))), /*#__PURE__*/React.createElement("div", {
     className: "form-group"
-  }, /*#__PURE__*/React.createElement("label", {
-    className: "form-check-label",
-    htmlFor: "addTitle"
+  }, /*#__PURE__*/React.createElement(Label, {
+    for: "addTitle"
   }, t('Link_title')), /*#__PURE__*/React.createElement("input", {
     onKeyDown: onKeyDown,
     type: "text",

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

@@ -203,4 +203,12 @@ export var unWrapLinkNode = /*#__PURE__*/function () {
   return function unWrapLinkNode(_x) {
     return _ref3.apply(this, arguments);
   };
-}();
+}();
+export var isSdocFile = function isSdocFile(res, url) {
+  var files_info = res.data.files_info;
+  var fileInfo = files_info[url];
+  var _ref4 = fileInfo || {},
+    is_dir = _ref4.is_dir,
+    file_ext = _ref4.file_ext;
+  return !is_dir && file_ext === 'sdoc';
+};

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

@@ -2,9 +2,12 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import { Transforms, Node, Editor, Range } from '@seafile/slate';
 import slugid from 'slugid';
 import isUrl from 'is-url';
-import { genLinkNode } from './helpers';
+import context from '../../../../context';
+import { insertSdocFileLink } from '../sdoc-link/helpers';
+import { genLinkNode, isSdocFile } from './helpers';
 import { getNodeType, getSelectedNodeByType } from '../../core';
-import { isImage } from '../../utils';
+import { isImage, isSameDomain } from '../../utils';
+import { LINK } from '../../constants';
 var withLink = function withLink(editor) {
   var normalizeNode = editor.normalizeNode,
     isInline = editor.isInline,
@@ -15,14 +18,14 @@ var withLink = function withLink(editor) {
   // Rewrite isInline
   newEditor.isInline = function (elem) {
     var type = elem.type;
-    if (type === 'link') {
+    if (type === LINK) {
       return true;
     }
     return isInline(elem);
   };
   newEditor.insertText = function (text) {
     var path = Editor.path(editor, editor.selection);
-    if (Range.isCollapsed(editor.selection) && getSelectedNodeByType(editor, 'link') && Editor.isEnd(editor, editor.selection.focus, path)) {
+    if (Range.isCollapsed(editor.selection) && getSelectedNodeByType(editor, LINK) && Editor.isEnd(editor, editor.selection.focus, path)) {
       editor.insertFragment([{
         id: slugid.nice(),
         text: text
@@ -36,10 +39,28 @@ var withLink = function withLink(editor) {
     var text = data.getData('text/plain');
     if (isUrl(text) && !isImage(text)) {
       var link = genLinkNode(text, text);
-      Transforms.insertNodes(newEditor, [link, {
-        id: slugid.nice(),
-        text: ' '
-      }]);
+      Transforms.insertNodes(newEditor, link);
+      if (isSameDomain(text, context.getSetting('serviceUrl'))) {
+        context.getLinkFilesInfo([text]).then(function (res) {
+          if (isSdocFile(res, text)) {
+            var _Editor$nodes = Editor.nodes(editor, {
+                match: function match(n) {
+                  return n.type === LINK;
+                },
+                universal: true
+              }),
+              _Editor$nodes2 = _slicedToArray(_Editor$nodes, 1),
+              nodeEntry = _Editor$nodes2[0];
+            var fileName = res.data.files_info[text].name;
+            var fileUuid = res.data.files_info[text].file_uuid;
+            Transforms.removeNodes(editor, {
+              at: nodeEntry[1]
+            });
+            insertSdocFileLink(editor, fileName, fileUuid);
+            return;
+          }
+        });
+      }
       return;
     }
     insertData(data);
@@ -51,7 +72,7 @@ var withLink = function withLink(editor) {
       node = _ref2[0],
       path = _ref2[1];
     var type = getNodeType(node);
-    if (type !== 'link') {
+    if (type !== LINK) {
       // If the type is not link, perform default normalizeNode
       return normalizeNode([node, path]);
     }

package/dist/basic-sdk/extension/render/custom-element.js

@@ -0,0 +1,148 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import { useCallback } from 'react';
+import { useSlateStatic } from '@seafile/slate-react';
+import { BLOCKQUOTE, LINK, CHECK_LIST_ITEM, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, LIST_ITEM, LIST_LIC, ORDERED_LIST, PARAGRAPH, UNORDERED_LIST, CODE_BLOCK, CODE_LINE, IMAGE, ELEMENT_TYPE, SDOC_LINK, FILE_LINK, TITLE, SUBTITLE } from '../constants';
+import { BlockquotePlugin, LinkPlugin, CheckListPlugin, HeaderPlugin, ListPlugin, CodeBlockPlugin, ImagePlugin, TablePlugin, SdocLinkPlugin, ParagraphPlugin, FileLinkPlugin } from '../plugins';
+import EventBus from '../../utils/event-bus';
+import { INTERNAL_EVENT } from '../../constants';
+var CustomRenderElement = function CustomRenderElement(props) {
+  var editor = useSlateStatic();
+  var element = props.element,
+    attributes = props.attributes;
+  var onMouseEnter = useCallback(function (event) {
+    event.stopPropagation();
+    var eventBus = EventBus.getInstance();
+    eventBus.dispatch(INTERNAL_EVENT.ON_MOUSE_ENTER_BLOCK, event);
+  }, []);
+  switch (element.type) {
+    case PARAGRAPH:
+      {
+        attributes['onMouseEnter'] = onMouseEnter;
+        var _ParagraphPlugin$rend = _slicedToArray(ParagraphPlugin.renderElements, 1),
+          renderParagraph = _ParagraphPlugin$rend[0];
+        return renderParagraph(props);
+      }
+    case TITLE:
+      {
+        var _HeaderPlugin$renderE = _slicedToArray(HeaderPlugin.renderElements, 1),
+          renderTitle = _HeaderPlugin$renderE[0];
+        return renderTitle(props, editor);
+      }
+    case SUBTITLE:
+      {
+        attributes['onMouseEnter'] = onMouseEnter;
+        var _HeaderPlugin$renderE2 = _slicedToArray(HeaderPlugin.renderElements, 2),
+          renderSubtitle = _HeaderPlugin$renderE2[1];
+        return renderSubtitle(props, editor);
+      }
+    case HEADER1:
+    case HEADER2:
+    case HEADER3:
+    case HEADER4:
+    case HEADER5:
+    case HEADER6:
+      {
+        attributes['onMouseEnter'] = onMouseEnter;
+        var _HeaderPlugin$renderE3 = _slicedToArray(HeaderPlugin.renderElements, 3),
+          renderHeader = _HeaderPlugin$renderE3[2];
+        return renderHeader(props, editor);
+      }
+    case LINK:
+      {
+        var _LinkPlugin$renderEle = _slicedToArray(LinkPlugin.renderElements, 1),
+          renderLink = _LinkPlugin$renderEle[0];
+        return renderLink(props, editor);
+      }
+    case BLOCKQUOTE:
+      {
+        attributes['onMouseEnter'] = onMouseEnter;
+        var _BlockquotePlugin$ren = _slicedToArray(BlockquotePlugin.renderElements, 1),
+          renderBlockquote = _BlockquotePlugin$ren[0];
+        return renderBlockquote(props, editor);
+      }
+    case ORDERED_LIST:
+    case UNORDERED_LIST:
+      {
+        var _ListPlugin$renderEle = _slicedToArray(ListPlugin.renderElements, 1),
+          renderList = _ListPlugin$renderEle[0];
+        return renderList(props, editor);
+      }
+    case LIST_ITEM:
+      {
+        attributes['onMouseEnter'] = onMouseEnter;
+        var _ListPlugin$renderEle2 = _slicedToArray(ListPlugin.renderElements, 2),
+          renderListItem = _ListPlugin$renderEle2[1];
+        return renderListItem(props, editor);
+      }
+    case LIST_LIC:
+      {
+        var _ListPlugin$renderEle3 = _slicedToArray(ListPlugin.renderElements, 3),
+          renderListLic = _ListPlugin$renderEle3[2];
+        return renderListLic(props, editor);
+      }
+    case CHECK_LIST_ITEM:
+      {
+        attributes['onMouseEnter'] = onMouseEnter;
+        var _CheckListPlugin$rend = _slicedToArray(CheckListPlugin.renderElements, 1),
+          renderCheckListItem = _CheckListPlugin$rend[0];
+        return renderCheckListItem(props, editor);
+      }
+    case CODE_BLOCK:
+      {
+        attributes['onMouseEnter'] = onMouseEnter;
+        var _CodeBlockPlugin$rend = _slicedToArray(CodeBlockPlugin.renderElements, 1),
+          renderCodeBlock = _CodeBlockPlugin$rend[0];
+        return renderCodeBlock(props, editor);
+      }
+    case CODE_LINE:
+      {
+        var _CodeBlockPlugin$rend2 = _slicedToArray(CodeBlockPlugin.renderElements, 2),
+          renderCodeLine = _CodeBlockPlugin$rend2[1];
+        return renderCodeLine(props, editor);
+      }
+    case IMAGE:
+      {
+        var _ImagePlugin$renderEl = _slicedToArray(ImagePlugin.renderElements, 1),
+          renderImage = _ImagePlugin$renderEl[0];
+        return renderImage(props, editor);
+      }
+    case ELEMENT_TYPE.TABLE:
+      {
+        attributes['onMouseEnter'] = onMouseEnter;
+        var _TablePlugin$renderEl = _slicedToArray(TablePlugin.renderElements, 1),
+          renderTable = _TablePlugin$renderEl[0];
+        return renderTable(props, editor);
+      }
+    case ELEMENT_TYPE.TABLE_ROW:
+      {
+        var _TablePlugin$renderEl2 = _slicedToArray(TablePlugin.renderElements, 2),
+          renderTableRow = _TablePlugin$renderEl2[1];
+        return renderTableRow(props, editor);
+      }
+    case ELEMENT_TYPE.TABLE_CELL:
+      {
+        var _TablePlugin$renderEl3 = _slicedToArray(TablePlugin.renderElements, 3),
+          renderTableCell = _TablePlugin$renderEl3[2];
+        return renderTableCell(props, editor);
+      }
+    case SDOC_LINK:
+      {
+        var _SdocLinkPlugin$rende = _slicedToArray(SdocLinkPlugin.renderElements, 1),
+          renderSdocLink = _SdocLinkPlugin$rende[0];
+        return renderSdocLink(props, editor);
+      }
+    case FILE_LINK:
+      {
+        var _FileLinkPlugin$rende = _slicedToArray(FileLinkPlugin.renderElements, 1),
+          renderFileLink = _FileLinkPlugin$rende[0];
+        return renderFileLink(props, editor);
+      }
+    default:
+      {
+        var _ParagraphPlugin$rend2 = _slicedToArray(ParagraphPlugin.renderElements, 1),
+          _renderParagraph = _ParagraphPlugin$rend2[0];
+        return _renderParagraph(props);
+      }
+  }
+};
+export default CustomRenderElement;

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

@@ -0,0 +1,2 @@
+import RebaseDecorate from './rebase-decorate';
+export { RebaseDecorate };

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

@@ -0,0 +1,29 @@
+import React from 'react';
+import RebaseModifyDeleteDecorate from './rebase-modify-delete-decorate';
+import RebaseModifyModifyDecorate from './rebase-modify-modify-decorate';
+import RebaseDeleteModifyDecorate from './rebase-delete-modify-decorate';
+import { REBASE_MARK_KEY, REBASE_TYPE } from '../../../../constants';
+import './index.css';
+var RebaseDecorate = function RebaseDecorate(_ref) {
+  var element = _ref.element,
+    children = _ref.children;
+  var rebaseType = element[REBASE_MARK_KEY.REBASE_TYPE];
+  if (!rebaseType) return /*#__PURE__*/React.createElement(React.Fragment, null, children);
+  if (rebaseType === REBASE_TYPE.MODIFY_DELETE) {
+    return /*#__PURE__*/React.createElement(RebaseModifyDeleteDecorate, {
+      element: element
+    }, children);
+  }
+  if (rebaseType === REBASE_TYPE.DELETE_MODIFY) {
+    return /*#__PURE__*/React.createElement(RebaseDeleteModifyDecorate, {
+      element: element
+    }, children);
+  }
+  if (rebaseType === REBASE_TYPE.MODIFY_MODIFY) {
+    return /*#__PURE__*/React.createElement(RebaseModifyModifyDecorate, {
+      element: element
+    }, children);
+  }
+  return /*#__PURE__*/React.createElement(React.Fragment, null, children);
+};
+export default RebaseDecorate;

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

@@ -0,0 +1,64 @@
+import React, { useCallback } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Transforms } from '@seafile/slate';
+import { useSlateStatic } from '@seafile/slate-react';
+import { ELEMENT_TYPE } from '../../../constants';
+import { REBASE_MARKS } from '../../../../constants';
+import { findPath, deleteNodeMark, updateRebaseParentNodeByPath } from '../../../core';
+var RebaseDeleteModifyDecorate = function RebaseDeleteModifyDecorate(_ref) {
+  var element = _ref.element,
+    children = _ref.children;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var editor = useSlateStatic();
+  var deleteElement = useCallback(function () {
+    var path = findPath(editor, element);
+    Transforms.removeNodes(editor, {
+      at: path
+    });
+    if (element.type === ELEMENT_TYPE.LIST_ITEM) {
+      updateRebaseParentNodeByPath(editor, path);
+    }
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [editor, element]);
+  var deleteMark = useCallback(function () {
+    var path = findPath(editor, element);
+    deleteNodeMark(editor, path, element, REBASE_MARKS);
+    if (element.type === ELEMENT_TYPE.LIST_ITEM) {
+      updateRebaseParentNodeByPath(editor, path);
+    }
+
+    // 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",
+    contentEditable: false
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "sdoc-rebase-btn",
+    onClick: deleteElement
+  }, t('Keep_other_modification')), /*#__PURE__*/React.createElement("div", {
+    className: "mr-2 ml-2"
+  }, '|'), /*#__PURE__*/React.createElement("div", {
+    className: "sdoc-rebase-btn",
+    onClick: deleteMark
+  }, t('Keep_my_modification')), /*#__PURE__*/React.createElement("div", {
+    className: "mr-2 ml-2"
+  }, '|'), /*#__PURE__*/React.createElement("div", {
+    className: "sdoc-rebase-btn",
+    onClick: deleteMark
+  }, t('Keep_both_modification'))), /*#__PURE__*/React.createElement("div", {
+    className: "w-100 sdoc-rebase-current-changes-start",
+    contentEditable: false
+  }, '<<<<<<<'), /*#__PURE__*/React.createElement("div", {
+    className: "w-100",
+    contentEditable: false
+  }, '======='), /*#__PURE__*/React.createElement("div", {
+    className: "w-100 sdoc-rebase-incoming-changes",
+    contentEditable: false
+  }, children), /*#__PURE__*/React.createElement("div", {
+    className: "w-100 sdoc-rebase-incoming-changes-end",
+    contentEditable: false
+  }, '>>>>>>>'));
+};
+export default RebaseDeleteModifyDecorate;