@seafile/sdoc-editor 2.0.137 → 2.0.139-alpha.0

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

@@ -13,12 +13,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 _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 _commentEditor = _interopRequireDefault(require("./comment-editor"));
+var _useParticipants = require("../hooks/use-participants");
 var _commentImagePreviewer = _interopRequireDefault(require("./comment-image-previewer"));
 var CommentItemContent = function CommentItemContent(_ref) {
   var isActive = _ref.isActive,
@@ -29,6 +31,11 @@ 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],
@@ -119,6 +126,18 @@ 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", {
@@ -187,12 +206,7 @@ var CommentItemContent = function CommentItemContent(_ref) {
     dangerouslySetInnerHTML: {
       __html: editorContent
     }
-  })), isEditing && /*#__PURE__*/_react["default"].createElement(_commentEditor["default"], {
-    className: "pb-3",
-    content: comment.comment,
-    updateContent: updateContent,
-    setIsEditing: setIsEditing
-  }), imageUrl && /*#__PURE__*/_react["default"].createElement(_commentImagePreviewer["default"], {
+  })), isEditing && /*#__PURE__*/_react["default"].createElement(_commentEditor.SeafileCommentEditor, commentEditorProps), imageUrl && /*#__PURE__*/_react["default"].createElement(_commentImagePreviewer["default"], {
     imageUrl: imageUrl,
     toggle: function toggle() {
       return setImageUrl('');

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

@@ -12,11 +12,13 @@ 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,
@@ -25,6 +27,11 @@ 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],
@@ -101,6 +108,19 @@ 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
@@ -150,13 +170,7 @@ var CommentItemReply = function CommentItemReply(_ref) {
     dangerouslySetInnerHTML: {
       __html: editorContent
     }
-  })), 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"], {
+  })), isEditing && /*#__PURE__*/_react["default"].createElement(_commentEditor.SeafileCommentEditor, commentEditorProps), isShowDeletePopover && isActive && /*#__PURE__*/_react["default"].createElement(_commentDeletePopover["default"], {
     parentDom: itemRef.current,
     type: "reply",
     deleteConfirm: _deleteReply,

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

@@ -14,14 +14,16 @@ 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 _commentEditor = _interopRequireDefault(require("./comment-editor"));
+var _useParticipants = require("../hooks/use-participants");
 var _commentItemWrapper = _interopRequireDefault(require("./comment-item-wrapper"));
 require("./comment-list.css");
 var CommentList = function CommentList(_ref) {
@@ -42,6 +44,11 @@ var CommentList = function CommentList(_ref) {
   var commentPopover = (0, _react.useRef)(null);
   var commentDetailRef = (0, _react.useRef)(null);
   var position = (0, _useSelectionPosition.useCommentListPosition)(activeElementIds, isContextComment, isClickedContextComment, commentedDom, commentDetail, closeComment, editor);
+  var _useParticipantsConte = (0, _useParticipants.useParticipantsContext)(),
+    addParticipants = _useParticipantsConte.addParticipants,
+    participants = _useParticipantsConte.participants;
+  var _useCollaborators = (0, _useCollaborators2.useCollaborators)(),
+    collaborators = _useCollaborators.collaborators;
   var _useCommentContext = (0, _useCommentContext2.useCommentContext)(),
     dispatch = _useCommentContext.dispatch;
   var _useState = (0, _react.useState)(false),
@@ -202,12 +209,17 @@ var CommentList = function CommentList(_ref) {
       style: {
         paddingTop: isEmptyComment ? '16px' : ''
       }
-    }, isEmptyComment && /*#__PURE__*/_react["default"].createElement(_commentEditor["default"], {
+    }, isEmptyComment && /*#__PURE__*/_react["default"].createElement(_commentEditor.SeafileCommentEditor, {
+      addParticipants: addParticipants,
+      participants: participants,
+      collaborators: collaborators,
       type: "comment",
       insertContent: addNewComment,
       hiddenComment: hiddenComment,
-      isContextComment: isContextComment,
-      closeComment: closeComment
+      closePanel: closeComment,
+      api: {
+        uploadLocalImage: _context2["default"].uploadLocalImage
+      }
     }), !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,
@@ -215,29 +227,40 @@ var CommentList = function CommentList(_ref) {
       onFocus: function onFocus() {
         setActiveCommentKey(index);
       }
-    }), isActiveEditor && /*#__PURE__*/_react["default"].createElement(_commentEditor["default"], {
+    }), isActiveEditor && /*#__PURE__*/_react["default"].createElement(_commentEditor.SeafileCommentEditor, {
       type: "reply",
       placeholder: 'Enter_reply_shift_Enter_for_new_line_Enter_to_send',
-      commentContent: commentInputs[item.id] || '',
+      addParticipants: addParticipants,
+      participants: participants,
+      collaborators: collaborators,
+      content: commentInputs[item.id] || '',
       insertContent: function insertContent(value) {
         return handleReplySubmit(value, item.id);
       },
       onContentChange: function onContentChange(content) {
         return handleInputChange(item.id, content);
       },
-      hiddenComment: hiddenComment
+      hiddenComment: hiddenComment,
+      api: {
+        uploadLocalImage: _context2["default"].uploadLocalImage
+      }
     }))));
   }), 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["default"], {
+  }, isEmptyComment && /*#__PURE__*/_react["default"].createElement(_commentEditor.SeafileCommentEditor, {
     type: "comment",
+    addParticipants: addParticipants,
+    participants: participants,
+    collaborators: collaborators,
     insertContent: addNewComment,
     hiddenComment: hiddenComment,
-    isContextComment: isContextComment,
-    closeComment: closeComment
+    closePanel: closeComment,
+    api: {
+      uploadLocalImage: _context2["default"].uploadLocalImage
+    }
   }), !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,
@@ -245,15 +268,21 @@ var CommentList = function CommentList(_ref) {
     onFocus: function onFocus() {
       setShowEditor(true);
     }
-  }), showEditor && /*#__PURE__*/_react["default"].createElement(_commentEditor["default"], {
+  }), showEditor && /*#__PURE__*/_react["default"].createElement(_commentEditor.SeafileCommentEditor, {
     type: "reply",
     placeholder: 'Enter_reply_shift_Enter_for_new_line_Enter_to_send',
-    commentContent: inputContent,
+    addParticipants: addParticipants,
+    participants: participants,
+    collaborators: collaborators,
+    content: inputContent,
     insertContent: replyComment,
     onContentChange: function onContentChange(content) {
       setInputContent(content);
     },
-    hiddenComment: hiddenComment
+    hiddenComment: hiddenComment,
+    api: {
+      uploadLocalImage: _context2["default"].uploadLocalImage
+    }
   }))));
 };
 var _default = exports["default"] = (0, _reactI18next.withTranslation)('sdoc-editor')(CommentList);

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

@@ -6,8 +6,11 @@ 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 _commentEditor = _interopRequireDefault(require("../comment-editor"));
+var _context = _interopRequireDefault(require("../../../context"));
+var _useCollaborators2 = require("../../../hooks/use-collaborators");
+var _useParticipants = require("../../hooks/use-participants");
 var GlobalCommentEditor = function GlobalCommentEditor(_ref) {
   var isScrollDisplayed = _ref.isScrollDisplayed,
     globalCommentContent = _ref.globalCommentContent,
@@ -15,20 +18,32 @@ 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["default"], {
-    type: type,
-    className: "sdoc-doc-comment-editor",
-    commentContent: globalCommentContent,
-    hiddenUserInfo: true,
-    insertContent: insertDocComment,
-    hiddenComment: hiddenCommentEditor,
-    onContentChange: onContentChange
-  })));
+  }, /*#__PURE__*/_react["default"].createElement(_commentEditor.SeafileCommentEditor, commentEditorProps)));
 };
 var _default = exports["default"] = GlobalCommentEditor;

package/dist/extension/plugins/file-link/hover-menu/index.css

@@ -4,7 +4,7 @@
   z-index: 101;
   width: auto;
 }
-  
+
 .sdoc-file-link-hover-menu-container .hover-menu-container {
   height: 36px;
   padding: 7px 8px;
@@ -17,7 +17,7 @@
   border: 1px solid #e8e8e8;
 }
 
-.sdoc-file-link-hover-menu-container .hover-menu-container > span:not(:last-of-type) {
+.sdoc-file-link-hover-menu-container .hover-menu-container>span:not(:last-of-type) {
   padding-right: 8px;
   border-right: 1px solid #e5e5e5;
 }
@@ -69,7 +69,11 @@
 
 .sdoc-file-link-hover-menu-container .hover-menu-container .icon-font {
   font-size: 12px;
-  color: #999999;
+  color: #444444;
+}
+
+.sdoc-file-link-hover-menu-container .hover-menu-container .sdoc-drop-down {
+  color: #999;
 }
 
 .sdoc-file-link-hover-menu-container .sdoc-file-display-style-popover {

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

@@ -50,7 +50,11 @@
 
 .sdoc-image-hover-menu-container .hover-menu-container .icon-font {
   font-size: 12px;
-  color: #999999;
+  color: #444444;
+}
+
+.sdoc-image-hover-menu-container .hover-menu-container .sdoc-drop-down {
+  color: #999;
 }
 
 .sdoc-image-hover-menu-container .sdoc-image-popover {

package/dist/extension/plugins/sdoc-link/hover-menu/index.css

@@ -4,7 +4,7 @@
   z-index: 101;
   width: auto;
 }
-  
+
 .sdoc-link-hover-menu-container .hover-menu-container {
   height: 36px;
   padding: 7px 8px;
@@ -17,7 +17,7 @@
   border: 1px solid #e8e8e8;
 }
 
-.sdoc-link-hover-menu-container .hover-menu-container > span:not(:last-of-type) {
+.sdoc-link-hover-menu-container .hover-menu-container>span:not(:last-of-type) {
   padding-right: 8px;
   border-right: 1px solid #e5e5e5;
 }
@@ -72,6 +72,10 @@
   color: #444;
 }
 
+.sdoc-link-hover-menu-container .hover-menu-container .sdoc-drop-down {
+  color: #999;
+}
+
 .sdoc-link-hover-menu-container .sdoc-file-display-style-popover {
   position: absolute;
   top: 37px;

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

@@ -46,5 +46,5 @@
 
 .sdoc-whiteboard-hover-menu-container .hover-menu-container .icon-font {
   font-size: 12px;
-  color: #999999;
+  color: #444444;
 }

package/dist/layout/article-container.js

@@ -36,7 +36,7 @@ function ArticleContainer(_ref) {
       _ref2$isFullWidth = _ref2.isFullWidth,
       isFullWidth = _ref2$isFullWidth === void 0 ? _localStorageUtils["default"].getItem(_constants.FULL_WIDTH_MODE) : _ref2$isFullWidth;
     // Full width mode
-    if (isFullWidth) {
+    if (isFullWidth && editor.editorType !== _constants.WIKI_EDITOR) {
       var _containerStyle = (0, _fullWidthMode.getStyleByFullWidthMode)(scrollRef, editor);
       setContainerStyle(_containerStyle);
       return;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seafile/sdoc-editor",
-  "version": "2.0.137",
+  "version": "2.0.139-alpha.0",
   "main": "dist/index.js",
   "scripts": {
     "test": "jest",
@@ -17,6 +17,7 @@
   "license": "ISC",
   "description": "",
   "dependencies": {
+    "@seafile/comment-editor": "^0.0.4",
     "@seafile/print-js": "1.6.6",
     "@seafile/react-image-lightbox": "4.0.2",
     "@seafile/slate": "0.91.8",
@@ -69,6 +70,5 @@
   },
   "publishConfig": {
     "access": "public"
-  },
-  "gitHead": "029acc16295db33531ca8a701cc43b9ba5ba62b2"
+  }
 }

package/LICENSE.txt

@@ -1,13 +0,0 @@
-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-editor.js

@@ -1,162 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _reactI18next = require("react-i18next");
-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 _sdocCommentEditor = _interopRequireDefault(require("../../editor/sdoc-comment-editor"));
-var _extension = require("../../extension");
-var _constants2 = require("../../extension/constants");
-var _core = require("../../extension/core");
-var _nodeId = _interopRequireDefault(require("../../node-id"));
-var _mdToSlate = _interopRequireDefault(require("../../slate-convert/md-to-slate"));
-var _slateToMd = _interopRequireDefault(require("../../slate-convert/slate-to-md"));
-var _eventBus = _interopRequireDefault(require("../../utils/event-bus"));
-var _useParticipants = require("../hooks/use-participants");
-var getSubmitTip = function getSubmitTip(type, content) {
-  if (content) return 'Save';
-  return type === 'comment' ? 'Comment' : 'Reply';
-};
-var DEFAULT_PLACEHOLDER = 'Enter_comment_shift_enter_for_new_line_Enter_to_send';
-var CommentEditor = function CommentEditor(_ref) {
-  var type = _ref.type,
-    className = _ref.className,
-    content = _ref.content,
-    commentContent = _ref.commentContent,
-    _ref$placeholder = _ref.placeholder,
-    placeholder = _ref$placeholder === void 0 ? DEFAULT_PLACEHOLDER : _ref$placeholder,
-    insertContent = _ref.insertContent,
-    updateContent = _ref.updateContent,
-    setIsEditing = _ref.setIsEditing,
-    hiddenComment = _ref.hiddenComment,
-    hiddenUserInfo = _ref.hiddenUserInfo,
-    onContentChange = _ref.onContentChange,
-    isContextComment = _ref.isContextComment,
-    closeComment = _ref.closeComment;
-  var commentWrapperRef = (0, _react.useRef)();
-  var _useTranslation = (0, _reactI18next.useTranslation)('sdoc-editor'),
-    t = _useTranslation.t;
-  var _useParticipantsConte = (0, _useParticipants.useParticipantsContext)(),
-    addParticipants = _useParticipantsConte.addParticipants;
-  var submitTip = (0, _react.useMemo)(function () {
-    return getSubmitTip(type, content);
-  }, [content, type]);
-  var userInfo = _context["default"].getUserInfo();
-  var document = (0, _react.useMemo)(function () {
-    var cursor = {};
-    var elements = null;
-    elements = [(0, _core.generateEmptyElement)(_constants2.PARAGRAPH, {
-      placeholder: placeholder
-    })];
-    return {
-      elements: elements,
-      cursor: cursor
-    };
-  }, [placeholder]);
-  var editor = (0, _react.useMemo)(function () {
-    var defaultEditor = (0, _extension.createCommentEditor)();
-    var newEditor = (0, _nodeId["default"])(defaultEditor);
-    var cursors = document.cursors;
-    newEditor.cursors = cursors || {};
-    newEditor.width = _constants.COMMENT_EDITOR_EDIT_AREA_WIDTH; // default width
-    newEditor.editorType = _constants.COMMENT_EDITOR;
-    return newEditor;
-  }, [document]);
-  var updateValue = (0, _react.useCallback)(function (value) {
-    if (!value || value.trim() === '') return;
-    if (!content) return insertContent(value);
-    updateContent && updateContent(value);
-  }, [content, insertContent, updateContent]);
-  var onSubmit = (0, _react.useCallback)(function (event) {
-    event && event.stopPropagation();
-    var mdString = (0, _slateToMd["default"])(editor.children);
-    updateValue(mdString);
-    addParticipants(userInfo.username);
-    editor.children = [(0, _core.generateEmptyElement)(_constants2.PARAGRAPH, {
-      placeholder: placeholder
-    })];
-    _slate.Transforms.select(editor, _slate.Editor.start(editor, []));
-    onContentChange && onContentChange(null);
-    closeComment && closeComment();
-  }, [editor, updateValue, addParticipants, userInfo.username, placeholder, onContentChange, closeComment]);
-  var onSubmitByEnterKey = (0, _react.useCallback)(function (event) {
-    if (!_slateReact.ReactEditor.isFocused(editor)) return;
-    onSubmit(event);
-  }, [editor, onSubmit]);
-  (0, _react.useEffect)(function () {
-    var eventBus = _eventBus["default"].getInstance();
-    var unsubscribePostComment = eventBus.subscribe(_constants.INTERNAL_EVENT.COMMENT_EDITOR_POST_COMMENT, onSubmitByEnterKey);
-    return function () {
-      unsubscribePostComment();
-    };
-  }, [onSubmitByEnterKey]);
-  var onCancel = (0, _react.useCallback)(function (event) {
-    event.stopPropagation();
-    var eventType = event.type,
-      keyCode = event.keyCode,
-      target = event.target;
-    if (eventType === 'keydown' && keyCode !== _constants.KeyCodes.Esc) return;
-    if (eventType === 'click') {
-      var isSdocContentWrapper = target.classList.contains('sdoc-content-wrapper');
-      var listContainer = window.document.querySelector('#global-comment-list-container');
-      var resizeContainer = window.document.querySelector('.sdoc-comment-resize-handler');
-      var isClickOnListContainer = listContainer && listContainer.contains(target);
-      var isClickOnCommentEditorContainer = commentWrapperRef.current.contains(target);
-      var isClickResizeContainer = resizeContainer && resizeContainer.contains(target);
-      var isPreventCancel = isClickOnListContainer || isClickOnCommentEditorContainer || isClickResizeContainer || isSdocContentWrapper;
-      if (isPreventCancel) return;
-    }
-    setIsEditing && setIsEditing(false);
-    hiddenComment && hiddenComment(false);
-    if (onContentChange) {
-      if (editor.children.find(function (n) {
-        return _slate.Node.string(n).trim();
-      })) {
-        onContentChange((0, _slateToMd["default"])(editor.children));
-      } else {
-        onContentChange(null);
-      }
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [setIsEditing]);
-  (0, _react.useEffect)(function () {
-    var children = (0, _mdToSlate["default"])(content);
-    if (commentContent) {
-      children = (0, _mdToSlate["default"])(commentContent);
-    }
-    editor.children = children;
-    _slate.Transforms.select(editor, _slate.Editor.end(editor, []));
-  }, [editor, content, commentContent]);
-  return /*#__PURE__*/_react["default"].createElement("div", {
-    className: (0, _classnames["default"])('comment-editor-wrapper', className),
-    ref: commentWrapperRef
-  }, type === 'comment' && !hiddenUserInfo && /*#__PURE__*/_react["default"].createElement("div", {
-    className: "comment-editor-user-info"
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "comment-editor-user-img"
-  }, /*#__PURE__*/_react["default"].createElement("img", {
-    src: userInfo.avatar_url,
-    alt: "",
-    height: "100%",
-    width: "100%"
-  })), /*#__PURE__*/_react["default"].createElement("div", {
-    className: "comment-editor-user-name"
-  }, userInfo.name)), /*#__PURE__*/_react["default"].createElement(_sdocCommentEditor["default"], {
-    editor: editor,
-    type: type,
-    document: document,
-    onSubmit: onSubmit,
-    submitBtnText: t(submitTip),
-    onCancel: onCancel
-  }));
-};
-var _default = exports["default"] = CommentEditor;

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

@@ -1,209 +0,0 @@
-"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 _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
-var _regeneratorRuntime2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/regeneratorRuntime"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/asyncToGenerator"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _reactI18next = require("react-i18next");
-var _slate = require("@seafile/slate");
-var _deepCopy = _interopRequireDefault(require("deep-copy"));
-var _notificationHooks = require("../comment/hooks/notification-hooks");
-var _fileLoading = _interopRequireDefault(require("../components/file-loading"));
-var _toast = _interopRequireDefault(require("../components/toast"));
-var _constants = require("../constants");
-var _context2 = _interopRequireDefault(require("../context"));
-var _extension = require("../extension");
-var _core = require("../extension/core");
-var _commentEditorToolbar = _interopRequireDefault(require("../extension/toolbar/comment-editor-toolbar"));
-var _useCollaborators = require("../hooks/use-collaborators");
-var _useScrollContext = require("../hooks/use-scroll-context");
-var _layout = require("../layout");
-var _nodeId = _interopRequireDefault(require("../node-id"));
-var _socket = require("../socket");
-var _commonUtils = require("../utils/common-utils");
-var _eventBus = _interopRequireDefault(require("../utils/event-bus"));
-var _commentArticle = _interopRequireDefault(require("./comment-article"));
-var SdocCommentEditor = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
-  var propsEditor = _ref.editor,
-    document = _ref.document,
-    isReloading = _ref.isReloading,
-    type = _ref.type,
-    onSubmit = _ref.onSubmit,
-    submitBtnText = _ref.submitBtnText,
-    onCancel = _ref.onCancel;
-  var _useState = (0, _react.useState)(document.elements),
-    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-    slateValue = _useState2[0],
-    _setSlateValue = _useState2[1];
-  var commentEditorContainerRef = (0, _react.useRef)(null);
-  var commentTimeoutRef = (0, _react.useRef)(null);
-  var _useNotificationConte = (0, _notificationHooks.useNotificationContext)(),
-    notificationsInfo = _useNotificationConte.notificationsInfo;
-  var _useTranslation = (0, _reactI18next.useTranslation)('sdoc-editor'),
-    t = _useTranslation.t;
-  var validEditor = (0, _react.useMemo)(function () {
-    if (propsEditor) return propsEditor;
-    var defaultEditor = (0, _extension.createCommentEditor)();
-    var editorConfig = _context2["default"].getEditorConfig();
-    var newEditor = (0, _nodeId["default"])((0, _socket.withSocketIO)(defaultEditor, {
-      document: document,
-      config: editorConfig
-    }));
-    var cursors = document.cursors;
-    newEditor.cursors = cursors || {};
-    newEditor.width = _constants.COMMENT_EDITOR_EDIT_AREA_WIDTH; // default width
-
-    return newEditor;
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-  (0, _react.useEffect)(function () {
-    if (!(commentEditorContainerRef !== null && commentEditorContainerRef !== void 0 && commentEditorContainerRef.current)) return;
-    if (Object.keys(notificationsInfo.notifications_map || {}).length === 0) return;
-    if (!commentEditorContainerRef.current.closest('.global-comment-input-wrapper')) return;
-    var clearAllNotification = /*#__PURE__*/function () {
-      var _ref2 = (0, _asyncToGenerator2["default"])(/*#__PURE__*/(0, _regeneratorRuntime2["default"])().mark(function _callee() {
-        var res, notifications, eventBus, errorMessage;
-        return (0, _regeneratorRuntime2["default"])().wrap(function _callee$(_context) {
-          while (1) switch (_context.prev = _context.next) {
-            case 0:
-              _context.prev = 0;
-              _context.next = 3;
-              return _context2["default"].readAllNotifications();
-            case 3:
-              _context.next = 5;
-              return _context2["default"].listUnseenNotifications();
-            case 5:
-              res = _context.sent;
-              notifications = res.data.notifications;
-              eventBus = _eventBus["default"].getInstance();
-              eventBus.dispatch(_constants.INTERNAL_EVENT.UNSEEN_NOTIFICATIONS_COUNT, notifications === null || notifications === void 0 ? void 0 : notifications.length);
-              eventBus.dispatch(_constants.INTERNAL_EVENT.NEW_NOTIFICATION);
-              eventBus.dispatch(_constants.INTERNAL_EVENT.CLEAR_NOTIFICATION);
-              _context.next = 17;
-              break;
-            case 13:
-              _context.prev = 13;
-              _context.t0 = _context["catch"](0);
-              errorMessage = (0, _commonUtils.getErrorMsg)(_context.t0);
-              _toast["default"].danger(t(errorMessage));
-            case 17:
-            case "end":
-              return _context.stop();
-          }
-        }, _callee, null, [[0, 13]]);
-      }));
-      return function clearAllNotification() {
-        return _ref2.apply(this, arguments);
-      };
-    }();
-    var el = commentEditorContainerRef && commentEditorContainerRef.current;
-
-    // Mark comment as read if focusing commentEditorContainerRef over 3s
-    var handleFocusIn = function handleFocusIn(e) {
-      commentTimeoutRef.current = setTimeout(function () {
-        clearAllNotification();
-        commentTimeoutRef.current = null;
-      }, 3000);
-    };
-    var handleBlur = function handleBlur() {
-      clearTimeout(commentTimeoutRef.current);
-      commentTimeoutRef.current = null;
-    };
-    el.addEventListener('focusin', handleFocusIn);
-    el.addEventListener('focusout', handleBlur);
-    return function () {
-      el.removeEventListener('focusin', handleFocusIn);
-      el.removeEventListener('focusout', handleBlur);
-      if (commentTimeoutRef.current) {
-        clearTimeout(commentTimeoutRef.current);
-        commentTimeoutRef.current = null;
-      }
-    };
-  }, [notificationsInfo]);
-
-  // useMount: focus editor
-  (0, _react.useEffect)(function () {
-    var _validEditor$children = (0, _slicedToArray2["default"])(validEditor.children, 1),
-      firstNode = _validEditor$children[0];
-    if (firstNode) {
-      var _firstNode$children = (0, _slicedToArray2["default"])(firstNode.children, 1),
-        firstNodeFirstChild = _firstNode$children[0];
-      if (firstNodeFirstChild) {
-        var endOfFirstNode = _slate.Editor.end(validEditor, [0, 0]);
-        var range = {
-          anchor: endOfFirstNode,
-          focus: endOfFirstNode
-        };
-        (0, _core.focusEditor)(validEditor, range);
-      }
-      // Force refresh to fix comment list
-      _setSlateValue((0, _toConsumableArray2["default"])(validEditor.children));
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
-  // The parent component can call the method of this component through ref
-  (0, _react.useImperativeHandle)(ref, function () {
-    return {
-      setSlateValue: function setSlateValue(document) {
-        // Force update of editor's child elements
-        validEditor.children = document.elements;
-        _setSlateValue((0, _toConsumableArray2["default"])(document.elements));
-      },
-      updateDocumentVersion: function updateDocumentVersion(document) {
-        validEditor.updateDocumentVersion(document);
-      },
-      // get value
-      getSlateValue: function getSlateValue() {
-        return (0, _deepCopy["default"])((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, document), {}, {
-          elements: slateValue
-        }));
-      }
-
-      // eslint-disable-next-line react-hooks/exhaustive-deps
-    };
-  }, [document, validEditor, slateValue]);
-  if (isReloading) {
-    return /*#__PURE__*/_react["default"].createElement("div", {
-      className: "h-100 w-100 d-flex align-items-center justify-content-center"
-    }, /*#__PURE__*/_react["default"].createElement(_fileLoading["default"], null));
-  }
-  var handleFocusEditor = function handleFocusEditor(e) {
-    if (e.target === commentEditorContainerRef.current) {
-      var focusPoint = _slate.Editor.end(validEditor, []);
-      (0, _core.focusEditor)(validEditor, focusPoint);
-    }
-  };
-  return /*#__PURE__*/_react["default"].createElement(_layout.EditorContainer, {
-    editor: validEditor
-  }, /*#__PURE__*/_react["default"].createElement(_useCollaborators.CollaboratorsProvider, null, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "sdoc-comment-editor-wrapper"
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    ref: commentEditorContainerRef,
-    className: "article sdoc-comment-editor",
-    onClick: handleFocusEditor
-  }, /*#__PURE__*/_react["default"].createElement(_useScrollContext.ScrollContext.Provider, {
-    value: {
-      scrollRef: commentEditorContainerRef
-    }
-  }, /*#__PURE__*/_react["default"].createElement(_commentArticle["default"], {
-    type: type,
-    editor: validEditor,
-    slateValue: slateValue,
-    updateSlateValue: _setSlateValue
-  }))), /*#__PURE__*/_react["default"].createElement(_commentEditorToolbar["default"], {
-    editor: validEditor,
-    onSubmit: onSubmit,
-    submitBtnText: submitBtnText,
-    onCancel: onCancel
-  }))));
-});
-var _default = exports["default"] = SdocCommentEditor;