@seafile/sdoc-editor 2.0.134-alpha.4 → 2.0.135

package/LICENSE.txt

@@ -0,0 +1,13 @@
+Copyright (c) 2025 Seafile Ltd.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+  http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.

package/dist/comment/components/comment-item-content.js

@@ -13,14 +13,12 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm
 var _react = _interopRequireWildcard(require("react"));
 var _reactI18next = require("react-i18next");
 var _reactstrap = require("reactstrap");
-var _commentEditor = require("@seafile/comment-editor");
 var _dayjs = _interopRequireDefault(require("dayjs"));
 var _tooltip = _interopRequireDefault(require("../../components/tooltip"));
 var _context2 = _interopRequireDefault(require("../../context"));
-var _useCollaborators2 = require("../../hooks/use-collaborators");
 var _mdToHtml = _interopRequireDefault(require("../../slate-convert/md-to-html"));
 var _notificationHooks = require("../hooks/notification-hooks");
-var _useParticipants = require("../hooks/use-participants");
+var _commentEditor = _interopRequireDefault(require("./comment-editor"));
 var _commentImagePreviewer = _interopRequireDefault(require("./comment-image-previewer"));
 var CommentItemContent = function CommentItemContent(_ref) {
   var isActive = _ref.isActive,
@@ -31,11 +29,6 @@ var CommentItemContent = function CommentItemContent(_ref) {
     onDeleteComment = _ref.onDeleteComment,
     t = _ref.t,
     targetId = _ref.targetId;
-  var _useParticipantsConte = (0, _useParticipants.useParticipantsContext)(),
-    addParticipants = _useParticipantsConte.addParticipants,
-    participants = _useParticipantsConte.participants;
-  var _useCollaborators = (0, _useCollaborators2.useCollaborators)(),
-    collaborators = _useCollaborators.collaborators;
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
     isDropdownOpen = _useState2[0],
@@ -126,18 +119,6 @@ var CommentItemContent = function CommentItemContent(_ref) {
       setImageUrl(event.target.src);
     }
   }, []);
-  var commentEditorProps = {
-    className: 'pb-3',
-    addParticipants: addParticipants,
-    participants: participants,
-    collaborators: collaborators,
-    content: comment.comment,
-    insertContent: updateContent,
-    hiddenComment: setIsEditing,
-    api: {
-      uploadLocalImage: _context2["default"].uploadLocalImage
-    }
-  };
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: "comment-item"
   }, /*#__PURE__*/_react["default"].createElement("div", {
@@ -206,7 +187,12 @@ var CommentItemContent = function CommentItemContent(_ref) {
     dangerouslySetInnerHTML: {
       __html: editorContent
     }
-  })), isEditing && /*#__PURE__*/_react["default"].createElement(_commentEditor.SeafileCommentEditor, commentEditorProps), imageUrl && /*#__PURE__*/_react["default"].createElement(_commentImagePreviewer["default"], {
+  })), isEditing && /*#__PURE__*/_react["default"].createElement(_commentEditor["default"], {
+    className: "pb-3",
+    content: comment.comment,
+    updateContent: updateContent,
+    setIsEditing: setIsEditing
+  }), imageUrl && /*#__PURE__*/_react["default"].createElement(_commentImagePreviewer["default"], {
     imageUrl: imageUrl,
     toggle: function toggle() {
       return setImageUrl('');

package/dist/comment/components/comment-item-reply.js

@@ -12,13 +12,11 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm
 var _react = _interopRequireWildcard(require("react"));
 var _reactI18next = require("react-i18next");
 var _reactstrap = require("reactstrap");
-var _commentEditor = require("@seafile/comment-editor");
 var _dayjs = _interopRequireDefault(require("dayjs"));
 var _context2 = _interopRequireDefault(require("../../context"));
-var _useCollaborators2 = require("../../hooks/use-collaborators");
 var _mdToHtml = _interopRequireDefault(require("../../slate-convert/md-to-html"));
-var _useParticipants = require("../hooks/use-participants");
 var _commentDeletePopover = _interopRequireDefault(require("./comment-delete-popover"));
+var _commentEditor = _interopRequireDefault(require("./comment-editor"));
 var _commentImagePreviewer = _interopRequireDefault(require("./comment-image-previewer"));
 var CommentItemReply = function CommentItemReply(_ref) {
   var isActive = _ref.isActive,
@@ -27,11 +25,6 @@ var CommentItemReply = function CommentItemReply(_ref) {
     deleteReply = _ref.deleteReply,
     updateReply = _ref.updateReply,
     t = _ref.t;
-  var _useParticipantsConte = (0, _useParticipants.useParticipantsContext)(),
-    addParticipants = _useParticipantsConte.addParticipants,
-    participants = _useParticipantsConte.participants;
-  var _useCollaborators = (0, _useCollaborators2.useCollaborators)(),
-    collaborators = _useCollaborators.collaborators;
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
     isDropdownOpen = _useState2[0],
@@ -108,19 +101,6 @@ var CommentItemReply = function CommentItemReply(_ref) {
       setImageUrl(event.target.src);
     }
   }, []);
-  var commentEditorProps = {
-    type: 'reply',
-    className: 'pb-3',
-    addParticipants: addParticipants,
-    participants: participants,
-    collaborators: collaborators,
-    content: editorContent,
-    insertContent: updateContent,
-    hiddenComment: setIsEditing,
-    api: {
-      uploadLocalImage: _context2["default"].uploadLocalImage
-    }
-  };
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: "comment-item",
     ref: itemRef
@@ -170,7 +150,13 @@ var CommentItemReply = function CommentItemReply(_ref) {
     dangerouslySetInnerHTML: {
       __html: editorContent
     }
-  })), isEditing && /*#__PURE__*/_react["default"].createElement(_commentEditor.SeafileCommentEditor, commentEditorProps), isShowDeletePopover && isActive && /*#__PURE__*/_react["default"].createElement(_commentDeletePopover["default"], {
+  })), isEditing && /*#__PURE__*/_react["default"].createElement(_commentEditor["default"], {
+    className: "pb-3",
+    type: "reply",
+    content: editorContent,
+    updateContent: updateContent,
+    setIsEditing: setIsEditing
+  }), isShowDeletePopover && isActive && /*#__PURE__*/_react["default"].createElement(_commentDeletePopover["default"], {
     parentDom: itemRef.current,
     type: "reply",
     deleteConfirm: _deleteReply,

package/dist/comment/components/comment-list.js

@@ -14,16 +14,14 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm
 var _react = _interopRequireWildcard(require("react"));
 var _reactI18next = require("react-i18next");
 var _reactstrap = require("reactstrap");
-var _commentEditor = require("@seafile/comment-editor");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _dayjs = _interopRequireDefault(require("dayjs"));
 var _slugid = _interopRequireDefault(require("slugid"));
 var _context2 = _interopRequireDefault(require("../../context"));
-var _useCollaborators2 = require("../../hooks/use-collaborators");
 var _useSelectionPosition = require("../../hooks/use-selection-position");
 var _helper = require("../helper");
 var _useCommentContext2 = require("../hooks/comment-hooks/use-comment-context");
-var _useParticipants = require("../hooks/use-participants");
+var _commentEditor = _interopRequireDefault(require("./comment-editor"));
 var _commentItemWrapper = _interopRequireDefault(require("./comment-item-wrapper"));
 require("./comment-list.css");
 var CommentList = function CommentList(_ref) {
@@ -43,12 +41,7 @@ var CommentList = function CommentList(_ref) {
     t = _ref.t;
   var commentPopover = (0, _react.useRef)(null);
   var commentDetailRef = (0, _react.useRef)(null);
-  var _useParticipantsConte = (0, _useParticipants.useParticipantsContext)(),
-    addParticipants = _useParticipantsConte.addParticipants,
-    participants = _useParticipantsConte.participants;
-  var _useCollaborators = (0, _useCollaborators2.useCollaborators)(),
-    collaborators = _useCollaborators.collaborators;
-  var position = (0, _useSelectionPosition.useCommentListPosition)(activeElementIds, isContextComment, isClickedContextComment, commentedDom, commentDetail, closeComment);
+  var position = (0, _useSelectionPosition.useCommentListPosition)(activeElementIds, isContextComment, isClickedContextComment, commentedDom, commentDetail, closeComment, editor);
   var _useCommentContext = (0, _useCommentContext2.useCommentContext)(),
     dispatch = _useCommentContext.dispatch;
   var _useState = (0, _react.useState)(false),
@@ -209,17 +202,12 @@ var CommentList = function CommentList(_ref) {
       style: {
         paddingTop: isEmptyComment ? '16px' : ''
       }
-    }, isEmptyComment && /*#__PURE__*/_react["default"].createElement(_commentEditor.SeafileCommentEditor, {
-      addParticipants: addParticipants,
-      participants: participants,
-      collaborators: collaborators,
+    }, isEmptyComment && /*#__PURE__*/_react["default"].createElement(_commentEditor["default"], {
       type: "comment",
       insertContent: addNewComment,
       hiddenComment: hiddenComment,
-      closePanel: closeComment,
-      api: {
-        uploadLocalImage: _context2["default"].uploadLocalImage
-      }
+      isContextComment: isContextComment,
+      closeComment: closeComment
     }), !isEmptyComment && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, !isActiveEditor && /*#__PURE__*/_react["default"].createElement(_reactstrap.Input, {
       value: inputContent !== null && inputContent !== void 0 && inputContent.trim() ? '.....' : '',
       readOnly: true,
@@ -227,40 +215,29 @@ var CommentList = function CommentList(_ref) {
       onFocus: function onFocus() {
         setActiveCommentKey(index);
       }
-    }), isActiveEditor && /*#__PURE__*/_react["default"].createElement(_commentEditor.SeafileCommentEditor, {
+    }), isActiveEditor && /*#__PURE__*/_react["default"].createElement(_commentEditor["default"], {
       type: "reply",
       placeholder: 'Enter_reply_shift_Enter_for_new_line_Enter_to_send',
-      addParticipants: addParticipants,
-      participants: participants,
-      collaborators: collaborators,
-      content: commentInputs[item.id] || '',
+      commentContent: commentInputs[item.id] || '',
       insertContent: function insertContent(value) {
         return handleReplySubmit(value, item.id);
       },
       onContentChange: function onContentChange(content) {
         return handleInputChange(item.id, content);
       },
-      hiddenComment: hiddenComment,
-      api: {
-        uploadLocalImage: _context2["default"].uploadLocalImage
-      }
+      hiddenComment: hiddenComment
     }))));
   }), Object.values(commentDetail).length === 0 && /*#__PURE__*/_react["default"].createElement("div", {
     className: "non-global-comment-input-wrapper",
     style: {
       paddingTop: isEmptyComment ? '16px' : ''
     }
-  }, isEmptyComment && /*#__PURE__*/_react["default"].createElement(_commentEditor.SeafileCommentEditor, {
+  }, isEmptyComment && /*#__PURE__*/_react["default"].createElement(_commentEditor["default"], {
     type: "comment",
-    addParticipants: addParticipants,
-    participants: participants,
-    collaborators: collaborators,
     insertContent: addNewComment,
     hiddenComment: hiddenComment,
-    closePanel: closeComment,
-    api: {
-      uploadLocalImage: _context2["default"].uploadLocalImage
-    }
+    isContextComment: isContextComment,
+    closeComment: closeComment
   }), !isEmptyComment && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, !showEditor && /*#__PURE__*/_react["default"].createElement(_reactstrap.Input, {
     value: inputContent !== null && inputContent !== void 0 && inputContent.trim() ? '.....' : '',
     readOnly: true,
@@ -268,21 +245,15 @@ var CommentList = function CommentList(_ref) {
     onFocus: function onFocus() {
       setShowEditor(true);
     }
-  }), showEditor && /*#__PURE__*/_react["default"].createElement(_commentEditor.SeafileCommentEditor, {
+  }), showEditor && /*#__PURE__*/_react["default"].createElement(_commentEditor["default"], {
     type: "reply",
     placeholder: 'Enter_reply_shift_Enter_for_new_line_Enter_to_send',
-    addParticipants: addParticipants,
-    participants: participants,
-    collaborators: collaborators,
-    content: inputContent,
+    commentContent: inputContent,
     insertContent: replyComment,
     onContentChange: function onContentChange(content) {
       setInputContent(content);
     },
-    hiddenComment: hiddenComment,
-    api: {
-      uploadLocalImage: _context2["default"].uploadLocalImage
-    }
+    hiddenComment: hiddenComment
   }))));
 };
 var _default = exports["default"] = (0, _reactI18next.withTranslation)('sdoc-editor')(CommentList);

package/dist/comment/components/editor-comment.js

@@ -194,7 +194,7 @@ var EditorComment = function EditorComment(_ref) {
     className: "comment-container-main"
   }), /*#__PURE__*/_react["default"].createElement("div", {
     className: (0, _classnames["default"])('comment-container-right', {
-      'isContextComment': isContextComment
+      'is-context-comment': isContextComment
     })
   }, /*#__PURE__*/_react["default"].createElement(_elementsCommentCount["default"], {
     elementCommentsMap: element_comments_map,

package/dist/comment/components/global-comment/global-comment-editor.js

@@ -6,11 +6,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _commentEditor = require("@seafile/comment-editor");
 var _classnames = _interopRequireDefault(require("classnames"));
-var _context = _interopRequireDefault(require("../../../context"));
-var _useCollaborators2 = require("../../../hooks/use-collaborators");
-var _useParticipants = require("../../hooks/use-participants");
+var _commentEditor = _interopRequireDefault(require("../comment-editor"));
 var GlobalCommentEditor = function GlobalCommentEditor(_ref) {
   var isScrollDisplayed = _ref.isScrollDisplayed,
     globalCommentContent = _ref.globalCommentContent,
@@ -18,32 +15,20 @@ var GlobalCommentEditor = function GlobalCommentEditor(_ref) {
     insertDocComment = _ref.insertDocComment,
     hiddenCommentEditor = _ref.hiddenCommentEditor,
     onContentChange = _ref.onContentChange;
-  var _useParticipantsConte = (0, _useParticipants.useParticipantsContext)(),
-    addParticipants = _useParticipantsConte.addParticipants,
-    participants = _useParticipantsConte.participants;
-  var _useCollaborators = (0, _useCollaborators2.useCollaborators)(),
-    collaborators = _useCollaborators.collaborators;
-  var commentEditorProps = {
-    type: type,
-    className: 'sdoc-doc-comment-editor',
-    hiddenUserInfo: true,
-    content: globalCommentContent,
-    insertContent: insertDocComment,
-    onContentChange: onContentChange,
-    hiddenComment: hiddenCommentEditor,
-    addParticipants: addParticipants,
-    collaborators: collaborators,
-    participants: participants,
-    api: {
-      uploadLocalImage: _context["default"].uploadLocalImage
-    }
-  };
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: (0, _classnames["default"])('sdoc-doc-comment-editor-container', 'sdoc-comment-list-container', {
       'scrolled': isScrollDisplayed
     })
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "sdoc-doc-comment-editor-content"
-  }, /*#__PURE__*/_react["default"].createElement(_commentEditor.SeafileCommentEditor, commentEditorProps)));
+  }, /*#__PURE__*/_react["default"].createElement(_commentEditor["default"], {
+    type: type,
+    className: "sdoc-doc-comment-editor",
+    commentContent: globalCommentContent,
+    hiddenUserInfo: true,
+    insertContent: insertDocComment,
+    hiddenComment: hiddenCommentEditor,
+    onContentChange: onContentChange
+  })));
 };
 var _default = exports["default"] = GlobalCommentEditor;

package/dist/comment/components/global-comment/index.css

@@ -321,6 +321,6 @@
   font-weight: unset;
 }
 
-.sdoc-comment-drawer .sdoc-comment-list-container .global-comment-item-detail-wrapper .comment-item:not(:last-child){
+.sdoc-comment-drawer .sdoc-comment-list-container .global-comment-item-detail-wrapper .comment-item:not(:last-child) {
   margin-bottom: 16px;
 }

package/dist/comment/helper.js

@@ -4,13 +4,14 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useCursorPosition = exports.updateElementsAttrs = exports.updateCommentedElementsAttrs = exports.getSelectionRange = exports.getSelectedElemIds = exports.getPrimaryElementId = exports.getElementCommentCountTop = exports.getDomById = exports.getCursorPosition = exports.getCommentedTextsByElementId = exports.getAvatarUrl = void 0;
+exports.useCursorPosition = exports.updateElementsAttrs = exports.updateCommentedElementsAttrs = exports.getSelectionRange = exports.getSelectedElemIds = exports.getPrimaryElementId = exports.getElementCommentCountTop = exports.getDomById = exports.getCursorPosition = exports.getCommentedTextsByElementId = exports.getAvatarUrl = exports.commentContainerWikiTransfer = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
 var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/createForOfIteratorHelper"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
 var _slate = require("@seafile/slate");
 var _slateReact = require("@seafile/slate-react");
+var _constants = require("../constants");
 var _context = _interopRequireDefault(require("../context"));
 var _core = require("../extension/core");
 var _useScrollContext = require("../hooks/use-scroll-context");
@@ -56,6 +57,24 @@ var getAvatarUrl = exports.getAvatarUrl = function getAvatarUrl() {
   var avatarUrl = "".concat(server, "/media/avatars/default.png");
   return avatarUrl;
 };
+var commentContainerWikiTransfer = exports.commentContainerWikiTransfer = function commentContainerWikiTransfer(result, value) {
+  var newResult;
+  var isWikiTitleIcon = document.querySelector('.wiki-page-icon-wrapper');
+  var isWikiTitleCover = document.getElementById('wiki-page-cover');
+  if (isWikiTitleIcon && !isWikiTitleCover) {
+    // 90 is icon height in wiki
+    newResult = result - value - 90;
+  } else if (!isWikiTitleIcon && isWikiTitleCover) {
+    // 203 is icon height in wiki
+    newResult = result - value - 203;
+  } else if (isWikiTitleIcon && isWikiTitleCover) {
+    // 205 is icon and cover height in wiki
+    newResult = result - value - 205;
+  } else {
+    newResult = result - value;
+  }
+  return newResult;
+};
 var getElementCommentCountTop = exports.getElementCommentCountTop = function getElementCommentCountTop(editor, element, scrollTop) {
   var minY;
   var children = element.children || [];
@@ -71,7 +90,13 @@ var getElementCommentCountTop = exports.getElementCommentCountTop = function get
     if (!minY) minY = y;
     minY = Math.min(minY, y);
   });
-  return minY - 93 + scrollTop; // 100: header height(56) + toolbar height(37)
+  var resultY;
+  resultY = minY - 93 + scrollTop; // 100: header height(56) + toolbar height(37)
+  if (editor.editorType === _constants.WIKI_EDITOR) {
+    // 55 is basic top title height in wiki
+    resultY = commentContainerWikiTransfer(resultY, 55);
+  }
+  return resultY;
 };
 var getSelectedElemIds = exports.getSelectedElemIds = function getSelectedElemIds(editor) {
   var selection = editor.selection;

package/dist/editor/wiki-editor.js

@@ -18,7 +18,7 @@ var _constants = require("../constants");
 var _context = _interopRequireDefault(require("../context"));
 var _extension = require("../extension");
 var _insertElementDialog = _interopRequireDefault(require("../extension/commons/insert-element-dialog"));
-var _core = require("../extension/core");
+var _helpers = require("../extension/plugins/ai/ai-module/helpers");
 var _useColorContext = require("../hooks/use-color-context");
 var _useScrollContext = require("../hooks/use-scroll-context");
 var _layout = require("../layout");
@@ -34,7 +34,9 @@ var WikiEditor = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     document = _ref.document,
     isReloading = _ref.isReloading,
     isWikiReadOnly = _ref.isWikiReadOnly,
-    scrollRef = _ref.scrollRef;
+    scrollRef = _ref.scrollRef,
+    showComment = _ref.showComment,
+    isShowRightPanel = _ref.isShowRightPanel;
   var validEditor = (0, _react.useMemo)(function () {
     if (propsEditor) return propsEditor;
     var defaultEditor = (0, _extension.createDefaultEditor)();
@@ -90,6 +92,18 @@ var WikiEditor = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   (0, _react.useEffect)(function () {
     var eventBus = _eventBus["default"].getInstance();
     eventBus.subscribe(_constants.INTERNAL_EVENT.REFRESH_DOCUMENT, onRefreshDocument);
+
+    // Remove Marks on special conditions like unexpected exit or refresh page using AI or context comment
+    var hasSpecialMark = !_slate.Editor.nodes(validEditor, {
+      at: [],
+      match: function match(n) {
+        return _slate.Text.isText(n) && (n.sdoc_ai === true || n.comment === true);
+      }
+    }).next().done;
+    if (hasSpecialMark) {
+      (0, _helpers.removeMarks)(validEditor);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [onRefreshDocument]);
 
   // The parent component can call the method of this component through ref
@@ -162,7 +176,7 @@ var WikiEditor = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     editor: validEditor,
     slateValue: slateValue,
     updateSlateValue: onValueChange,
-    showComment: false
+    showComment: showComment
   })), /*#__PURE__*/_react["default"].createElement(_wikiOutline["default"], {
     doc: slateValue
   }))))), /*#__PURE__*/_react["default"].createElement(_insertElementDialog["default"], {

package/dist/extension/plugins/text-style/menu/index.js

@@ -156,7 +156,7 @@ var TextStyleMenuList = function TextStyleMenuList(_ref) {
     tipMessage: t('Reduce_font_size')
   }, /*#__PURE__*/_react["default"].createElement("i", {
     className: "sdocfont sdoc-reduce-font-size"
-  }))), idPrefix && ![_constants.DOCUMENT_PLUGIN_EDITOR, _constants.WIKI_EDITOR].includes(editor.editorType) && /*#__PURE__*/_react["default"].createElement(_commentContextMenu["default"], null), idPrefix && enableSeafileAI && /*#__PURE__*/_react["default"].createElement(_aiMenu.AIContextMenu, {
+  }))), idPrefix && ![_constants.DOCUMENT_PLUGIN_EDITOR].includes(editor.editorType) && /*#__PURE__*/_react["default"].createElement(_commentContextMenu["default"], null), idPrefix && enableSeafileAI && /*#__PURE__*/_react["default"].createElement(_aiMenu.AIContextMenu, {
     isRichEditor: isRichEditor
   }));
 };

package/dist/extension/plugins/whiteboard/hover-menu/index.css

@@ -0,0 +1,50 @@
+.sdoc-whiteboard-hover-menu-container {
+  position: absolute;
+  height: 42px;
+  z-index: 101;
+  width: auto;
+}
+
+.sdoc-whiteboard-hover-menu-container .hover-menu-container {
+  height: 36px;
+  background-color: #fff;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  border-radius: 3px;
+  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
+  border: 1px solid #e8e8e8;
+}
+
+.sdoc-whiteboard-hover-menu-container .hover-menu-container>span {
+  padding: 0 8px;
+}
+
+.sdoc-whiteboard-hover-menu-container .hover-menu-container>span:not(:last-of-type) {
+  padding: 0 8px;
+  border-right: 1px solid #e5e5e5;
+}
+
+.sdoc-whiteboard-hover-menu-container .hover-menu-container .op-item {
+  position: relative;
+  font-size: 12px;
+  color: #212529;
+  padding: 0 5px;
+  border-radius: 2px;
+  min-width: 24px;
+  height: 24px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.sdoc-whiteboard-hover-menu-container .hover-menu-container .op-item:hover {
+  color: #212529;
+  text-decoration: none;
+  background: #f1f1f1;
+}
+
+.sdoc-whiteboard-hover-menu-container .hover-menu-container .icon-font {
+  font-size: 12px;
+  color: #999999;
+}

package/dist/extension/plugins/whiteboard/hover-menu/index.js

@@ -0,0 +1,71 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _reactI18next = require("react-i18next");
+var _tooltip = _interopRequireDefault(require("../../../../components/tooltip"));
+var _commons = require("../../../commons");
+require("./index.css");
+var WhiteboardHoverMenu = function WhiteboardHoverMenu(_ref) {
+  var menuPosition = _ref.menuPosition,
+    onOpen = _ref.onOpen,
+    openFullscreen = _ref.openFullscreen,
+    onDeleteWhiteboard = _ref.onDeleteWhiteboard;
+  var _useTranslation = (0, _reactI18next.useTranslation)('sdoc-editor'),
+    t = _useTranslation.t;
+  var _useState = (0, _react.useState)(false),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    showTooltip = _useState2[0],
+    setShowTooltip = _useState2[1];
+  (0, _react.useEffect)(function () {
+    setShowTooltip(true);
+  }, []);
+  return /*#__PURE__*/_react["default"].createElement(_commons.ElementPopover, null, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "sdoc-whiteboard-hover-menu-container",
+    style: menuPosition
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "hover-menu-container"
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "op-group-item"
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    id: "sdoc_whiteboard_open",
+    role: "button",
+    className: "op-item",
+    onClick: onOpen
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "mr-1"
+  }, t('Open')))), /*#__PURE__*/_react["default"].createElement("span", {
+    className: "op-group-item"
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    id: "sdoc_whiteboard_delete",
+    role: "button",
+    className: "op-item",
+    onClick: onDeleteWhiteboard
+  }, /*#__PURE__*/_react["default"].createElement("i", {
+    className: "sdocfont sdoc-delete icon-font"
+  }), showTooltip && /*#__PURE__*/_react["default"].createElement(_tooltip["default"], {
+    target: "sdoc_whiteboard_delete",
+    placement: "top",
+    fade: true
+  }, t('Delete')))), /*#__PURE__*/_react["default"].createElement("span", {
+    className: "op-group-item"
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    id: "sdoc_whiteboard_full_screen_mode",
+    role: "button",
+    className: "op-item",
+    onClick: openFullscreen
+  }, /*#__PURE__*/_react["default"].createElement("i", {
+    className: "sdocfont sdoc-fullscreen icon-font"
+  }), showTooltip && /*#__PURE__*/_react["default"].createElement(_tooltip["default"], {
+    target: "sdoc_whiteboard_full_screen_mode",
+    placement: "top",
+    fade: true
+  }, t('Full_screen_mode')))))));
+};
+var _default = exports["default"] = WhiteboardHoverMenu;

package/dist/extension/plugins/whiteboard/render-elem.js

@@ -1,17 +1,23 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.renderWhiteboard = renderWhiteboard;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
+var _slate = require("@seafile/slate");
 var _slateReact = require("@seafile/slate-react");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _constants = require("../../../constants");
 var _context = _interopRequireDefault(require("../../../context"));
+var _useScrollContext = require("../../../hooks/use-scroll-context");
 var _eventBus = _interopRequireDefault(require("../../../utils/event-bus"));
+var _core = require("../../core");
+var _utils = require("../../utils");
+var _hoverMenu = _interopRequireDefault(require("./hover-menu"));
 require("./index.css");
 var Whiteboard = function Whiteboard(_ref) {
   var editor = _ref.editor,
@@ -21,7 +27,16 @@ var Whiteboard = function Whiteboard(_ref) {
     title = element.title,
     link = element.link;
   var whiteboardRef = (0, _react.useRef)();
+  var scrollRef = (0, _useScrollContext.useScrollContext)();
   var isSelected = (0, _slateReact.useSelected)();
+  var readOnly = (0, _slateReact.useReadOnly)();
+  var _useState = (0, _react.useState)({
+      top: '',
+      left: ''
+    }),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    menuPosition = _useState2[0],
+    setMenuPosition = _useState2[1];
   (0, _react.useEffect)(function () {
     var handleMessage = function handleMessage(event) {
       var _event$data;
@@ -47,6 +62,14 @@ var Whiteboard = function Whiteboard(_ref) {
       unsubscribeResizeArticle();
     };
   }, []);
+  var onDeleteWhiteboard = (0, _react.useCallback)(function () {
+    var path = _slateReact.ReactEditor.findPath(editor, element);
+    _slate.Transforms.removeNodes(editor, {
+      at: path
+    });
+    (0, _core.focusEditor)(editor);
+    _slate.Transforms.select(editor, editor.selection);
+  }, [editor, element]);
   var handleDoubleClick = function handleDoubleClick(event) {
     event.preventDefault();
     var siteRoot = _context["default"].getSetting('siteRoot');
@@ -54,7 +77,45 @@ var Whiteboard = function Whiteboard(_ref) {
     window.open(url, '_blank');
     return;
   };
-  return /*#__PURE__*/_react["default"].createElement("div", {
+  var handleScroll = (0, _react.useCallback)(function (e) {
+    if (readOnly) return;
+    if (!isSelected) return;
+    if (e.currentTarget.scrollTop) {
+      var _menuPosition = (0, _utils.getMenuPosition)(whiteboardRef.current, editor);
+      setMenuPosition(_menuPosition);
+    }
+  }, [editor, isSelected, readOnly]);
+  (0, _react.useEffect)(function () {
+    if (readOnly) return;
+    var observerRefValue = null;
+    if (scrollRef.current) {
+      scrollRef.current.addEventListener('scroll', handleScroll);
+      observerRefValue = scrollRef.current;
+    }
+    return function () {
+      observerRefValue.removeEventListener('scroll', handleScroll);
+    };
+  }, [handleScroll, readOnly, scrollRef]);
+  var handleOnClick = (0, _react.useCallback)(function () {
+    if (readOnly) return;
+    if (isSelected) {
+      var _menuPosition2 = (0, _utils.getMenuPosition)(whiteboardRef.current, editor);
+      setMenuPosition(_menuPosition2);
+    }
+  }, [editor, isSelected, readOnly]);
+  var openFullscreen = function openFullscreen() {
+    if (whiteboardRef.current.requestFullscreen) {
+      // Chrome
+      whiteboardRef.current.requestFullscreen();
+    } else if (whiteboardRef.current.webkitRequestFullscreen) {
+      // Safari
+      whiteboardRef.current.webkitRequestFullscreen();
+    } else if (whiteboardRef.current.msRequestFullscreen) {
+      // IE11
+      whiteboardRef.current.msRequestFullscreen();
+    }
+  };
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
     className: (0, _classnames["default"])('sdoc-whiteboard-container', {
       'isSelected': isSelected
     }),
@@ -69,7 +130,13 @@ var Whiteboard = function Whiteboard(_ref) {
     ref: whiteboardRef
   }), /*#__PURE__*/_react["default"].createElement("div", {
     className: "iframe-overlay",
-    onDoubleClick: handleDoubleClick
+    onDoubleClick: handleDoubleClick,
+    onClick: handleOnClick
+  })), isSelected && !readOnly && /*#__PURE__*/_react["default"].createElement(_hoverMenu["default"], {
+    menuPosition: menuPosition,
+    onOpen: handleDoubleClick,
+    openFullscreen: openFullscreen,
+    onDeleteWhiteboard: onDeleteWhiteboard
   }));
 };
 function renderWhiteboard(props, editor) {

package/dist/hooks/use-plugins.js

@@ -15,13 +15,17 @@ var PluginsContext = /*#__PURE__*/_react["default"].createContext(null);
 var PluginsProvider = exports.PluginsProvider = function PluginsProvider(_ref) {
   var showComment = _ref.showComment,
     propsPlugins = _ref.plugins,
-    children = _ref.children;
+    children = _ref.children,
+    setIsShowRightPanel = _ref.setIsShowRightPanel;
   var _useState = (0, _react.useState)(''),
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
     displayName = _useState2[0],
     setDisplayName = _useState2[1];
   var closePlugin = (0, _react.useCallback)(function () {
     setDisplayName('');
+    // Deal with comment component in wiki
+    setIsShowRightPanel && setIsShowRightPanel(false);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   var plugins = (0, _react.useMemo)(function () {
     var allPlugins = propsPlugins;

package/dist/hooks/use-selection-position.js

@@ -4,8 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useCommentListPosition = void 0;
+var _helper = require("../comment/helper");
+var _constants = require("../constants");
 var _useScrollContext = require("./use-scroll-context");
-var useCommentListPosition = exports.useCommentListPosition = function useCommentListPosition(selectedElementIds, isContextComment, isClickedContextComment, commentedDom, commentDetail, closeComment) {
+var useCommentListPosition = exports.useCommentListPosition = function useCommentListPosition(selectedElementIds, isContextComment, isClickedContextComment, commentedDom, commentDetail, closeComment, editor) {
   var _document$querySelect;
   var headerHeight = 100;
   var scrollRef = (0, _useScrollContext.useScrollContext)();
@@ -51,7 +53,12 @@ var useCommentListPosition = exports.useCommentListPosition = function useCommen
       }
     }
     var editorArticleRight = document.getElementById('sdoc-editor-print-wrapper').getBoundingClientRect().right;
-    var topPara = rect.bottom - headerHeight + 10 + scrollTop;
+    var topPara;
+    topPara = rect.bottom - headerHeight + 10 + scrollTop;
+    if (editor.editorType === _constants.WIKI_EDITOR) {
+      // 55 is basic top title height in wiki
+      topPara = (0, _helper.commentContainerWikiTransfer)(topPara, 55);
+    }
     var rightPara = editorArticleRight - rect.left - 300; // 300 is comment container's width
     return {
       right: rightPara,
@@ -63,6 +70,10 @@ var useCommentListPosition = exports.useCommentListPosition = function useCommen
   if (!selectionPosition) closeComment();
   if (selectionPosition && selectionPosition.y !== 0) {
     selectionPosition.y = selectionPosition.y - headerHeight + scrollTop;
+    if (editor.editorType === _constants.WIKI_EDITOR) {
+      // 47 is top nav bar height in wiki
+      selectionPosition.y = (0, _helper.commentContainerWikiTransfer)(selectionPosition.y, 47);
+    }
   }
   return {
     x: selectionPosition === null || selectionPosition === void 0 ? void 0 : selectionPosition.x,

package/dist/index.js

@@ -10,6 +10,12 @@ Object.defineProperty(exports, "CollaboratorsProvider", {
     return _useCollaborators.CollaboratorsProvider;
   }
 });
+Object.defineProperty(exports, "CommentContextProvider", {
+  enumerable: true,
+  get: function get() {
+    return _provider["default"];
+  }
+});
 Object.defineProperty(exports, "DiffViewer", {
   enumerable: true,
   get: function get() {
@@ -88,6 +94,12 @@ Object.defineProperty(exports, "RevisionEditor", {
     return _revisionEditor["default"];
   }
 });
+Object.defineProperty(exports, "RightPanel", {
+  enumerable: true,
+  get: function get() {
+    return _index["default"];
+  }
+});
 Object.defineProperty(exports, "SDocEditor", {
   enumerable: true,
   get: function get() {
@@ -244,6 +256,7 @@ Object.defineProperty(exports, "withSocketIO", {
     return _socket.withSocketIO;
   }
 });
+var _provider = _interopRequireDefault(require("./comment/provider"));
 var _fileLoading = _interopRequireDefault(require("./components/file-loading"));
 var _loading = _interopRequireDefault(require("./components/loading"));
 var _toast = _interopRequireDefault(require("./components/toast"));
@@ -260,6 +273,7 @@ var _useCollaborators = require("./hooks/use-collaborators");
 var _usePlugins = require("./hooks/use-plugins");
 var _nodeId = _interopRequireDefault(require("./node-id"));
 var _outline = _interopRequireDefault(require("./outline"));
+var _index = _interopRequireDefault(require("./right-panel/index"));
 var _slateConvert = require("./slate-convert");
 var _socket = require("./socket");
 var _commonUtils = require("./utils/common-utils");

package/dist/layout/article-container.js

@@ -17,7 +17,8 @@ var _fullWidthMode = require("../utils/full-width-mode");
 var _localStorageUtils = _interopRequireDefault(require("../utils/local-storage-utils"));
 function ArticleContainer(_ref) {
   var editor = _ref.editor,
-    children = _ref.children;
+    children = _ref.children,
+    isShowCommentPanelInWiki = _ref.isShowCommentPanelInWiki;
   var scrollRef = (0, _useScrollContext.useScrollContext)();
   var articleRef = (0, _react.useRef)(null);
   var _useState = (0, _react.useState)({}),
@@ -63,7 +64,6 @@ function ArticleContainer(_ref) {
     };
   }, [editor.editorType, handleWindowResize]);
   (0, _react.useEffect)(function () {
-    if (editor.editorType === _constants.WIKI_EDITOR) return;
     if (editor.editorType === _constants.DOCUMENT_PLUGIN_EDITOR) return;
     handleWindowResize();
     window.addEventListener('resize', handleWindowResize);
@@ -73,7 +73,7 @@ function ArticleContainer(_ref) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   var articleStyle = editor.getArticleStyle && editor.getArticleStyle();
-  var articleContainerStyle = editor.getArticleStyle ? {
+  var articleContainerStyle = editor.editorType !== _constants.WIKI_EDITOR && editor.getArticleStyle ? {
     width: articleStyle.width
   } : containerStyle;
   return /*#__PURE__*/_react["default"].createElement("div", {

package/dist/right-panel/index.js

@@ -9,6 +9,8 @@ exports["default"] = void 0;
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
+var _comment = _interopRequireDefault(require("../comment"));
+var _commentOperation = _interopRequireDefault(require("../comment/components/comment-operation"));
 var _constants = require("../constants");
 var _usePlugins2 = require("../hooks/use-plugins");
 var _eventBus = _interopRequireDefault(require("../utils/event-bus"));
@@ -27,6 +29,16 @@ var RightPanel = function RightPanel(_ref) {
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
     width = _useState2[0],
     setWidth = _useState2[1];
+  if (editor.editorType === _constants.WIKI_EDITOR) {
+    plugins = [{
+      name: 'sdoc-comment',
+      icon: /*#__PURE__*/_react["default"].createElement(_commentOperation["default"], null),
+      resizable_width: true,
+      display_type: _constants.PLUGIN_DISPLAY_TYPE.RIGHT_PANEL,
+      component: _comment["default"]
+    }];
+    displayPluginName = 'sdoc-comment';
+  }
   var panelWrapperStyle = (0, _react.useMemo)(function () {
     if (!displayPluginName) return null;
     var style = {

package/dist/utils/default-mode.js

@@ -10,9 +10,9 @@ var _localStorageUtils = _interopRequireDefault(require("./local-storage-utils")
 var getStyleByDefaultMode = exports.getStyleByDefaultMode = function getStyleByDefaultMode(scrollRef, editor) {
   var sdocStorage = _localStorageUtils["default"].getItem(_constants.SDOC_STORAGE) || {};
   var isShowOutline = sdocStorage.outlineOpen;
-  var containerStyle = {
+  var containerStyle = editor.editorType !== _constants.WIKI_EDITOR ? {
     width: _constants.ARTICLE_DEFAULT_WIDTH
-  };
+  } : {};
 
   // Has outline
   if (isShowOutline && editor.editorType !== _constants.WIKI_EDITOR) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seafile/sdoc-editor",
-  "version": "2.0.134-alpha.4",
+  "version": "2.0.135",
   "main": "dist/index.js",
   "scripts": {
     "test": "jest",
@@ -17,7 +17,6 @@
   "license": "ISC",
   "description": "",
   "dependencies": {
-    "@seafile/comment-editor": "^0.0.1-alpha.79",
     "@seafile/print-js": "1.6.6",
     "@seafile/react-image-lightbox": "4.0.2",
     "@seafile/slate": "0.91.8",
@@ -70,5 +69,6 @@
   },
   "publishConfig": {
     "access": "public"
-  }
-}
+  },
+  "gitHead": "1557e2e40dd8beaa1be653cdee381b75c9a8b9c5"
+}