@seafile/sdoc-editor 2.0.82 → 2.0.83

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

@@ -1,33 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.commentDecorate = void 0;
-var _slate = require("@seafile/slate");
-const commentDecorate = editor => _ref => {
-  var _editor$element_comme;
-  let [node, path] = _ref;
-  const decorations = [];
-  const comments = ((_editor$element_comme = editor.element_comments_map) === null || _editor$element_comme === void 0 ? void 0 : _editor$element_comme[node.id]) || [];
-  const unresolvedComments = comments && comments.filter(item => !(item !== null && item !== void 0 && item.resolved));
-  for (const comment of unresolvedComments) {
-    if (comment.detail.element_id) {
-      const commentedContextId = comment.detail.text_comment_id;
-      // rgba prevents occlusion of the cursor
-      decorations.push({
-        anchor: {
-          path,
-          offset: 0
-        },
-        focus: {
-          path: path,
-          offset: _slate.Node.string(node).length
-        },
-        [`sdoc_comment_${commentedContextId}`]: true
-      });
-    }
-  }
-  return decorations;
-};
-exports.commentDecorate = commentDecorate;

package/dist/basic-sdk/comment/components/comment-all-participants/index.js

@@ -1,67 +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 _slateReact = require("@seafile/slate-react");
-var _tooltip = _interopRequireDefault(require("../../../components/tooltip"));
-var _useParticipants = require("../../hooks/use-participants");
-var _commentParticipantsEditor = _interopRequireDefault(require("../comment-participants-editor"));
-var _participantAvatar = _interopRequireDefault(require("./participant-avatar"));
-require("./index.css");
-const CommentAllParticipants = () => {
-  const popoverRef = (0, _react.useRef)();
-  const {
-    participants
-  } = (0, _useParticipants.useParticipantsContext)();
-  const editor = (0, _slateReact.useSlateStatic)();
-  const {
-    t
-  } = (0, _reactI18next.useTranslation)('sdoc-editor');
-  const addParticipantId = 'sdoc-add-participants';
-  const commentsParticipantsId = 'sdoc-comments-participants';
-  const [isDidMount, setDidMount] = (0, _react.useState)(false);
-  (0, _react.useEffect)(() => {
-    setDidMount(true);
-  }, []);
-  const toggle = (0, _react.useCallback)(() => {
-    popoverRef.current && popoverRef.current.toggle();
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [popoverRef.current]);
-  const participantsCount = participants.length;
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-    className: "comments-participants-container"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "comments-participants-editor-target",
-    id: commentsParticipantsId
-  }), participants.slice(0, 14).map((participant, index) => {
-    const {
-      username
-    } = participant;
-    return /*#__PURE__*/_react.default.createElement(_participantAvatar.default, {
-      key: username,
-      participant: participant,
-      index: index,
-      showMore: participantsCount > 13 && index === 13
-    });
-  }), /*#__PURE__*/_react.default.createElement("div", {
-    className: "add-comments-participants",
-    id: addParticipantId,
-    onClick: toggle
-  }, /*#__PURE__*/_react.default.createElement("i", {
-    className: "sdocfont sdoc-add"
-  })), isDidMount && /*#__PURE__*/_react.default.createElement(_tooltip.default, {
-    target: addParticipantId
-  }, t('Add_participants'))), isDidMount && /*#__PURE__*/_react.default.createElement(_commentParticipantsEditor.default, {
-    target: commentsParticipantsId,
-    ref: popoverRef,
-    editor: editor
-  }));
-};
-var _default = exports.default = CommentAllParticipants;

package/dist/basic-sdk/comment/components/comment-all-participants/participant-avatar.js

@@ -1,43 +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 _classnames = _interopRequireDefault(require("classnames"));
-var _tooltip = _interopRequireDefault(require("../../../components/tooltip"));
-const ParticipantAvatar = _ref => {
-  let {
-    participant,
-    index,
-    showMore
-  } = _ref;
-  const [showTooltip, setShowTooltip] = (0, _react.useState)(false);
-  (0, _react.useEffect)(() => {
-    setShowTooltip(true);
-  }, []);
-  const {
-    name,
-    avatar_url
-  } = participant;
-  const id = `comment-participant-avatar-${index}-${Math.floor(Math.random() * 1000)}`;
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)('comment-participant-avatar', {
-      'position-relative': showMore
-    }),
-    id: id
-  }, /*#__PURE__*/_react.default.createElement("img", {
-    src: avatar_url,
-    alt: ""
-  }), showTooltip && /*#__PURE__*/_react.default.createElement(_tooltip.default, {
-    target: id
-  }, name), showMore && /*#__PURE__*/_react.default.createElement("div", {
-    className: "comment-participants-more"
-  }, /*#__PURE__*/_react.default.createElement("i", {
-    className: "sdocfont sdoc-more"
-  })));
-};
-var _default = exports.default = ParticipantAvatar;

package/dist/basic-sdk/comment/components/comment-context-menu/index.js

@@ -1,38 +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 _constants = require("../../../constants");
-var _eventBus = _interopRequireDefault(require("../../../utils/event-bus"));
-var _menuItem = _interopRequireDefault(require("./menu-item"));
-require("./index.css");
-const CommentContextMenu = _ref => {
-  let {
-    isRichEditor
-  } = _ref;
-  const onCommentClick = (0, _react.useCallback)(event => {
-    const eventBus = _eventBus.default.getInstance();
-    eventBus.dispatch(_constants.INTERNAL_EVENT.ADD_CONTEXT_COMMENT);
-  }, []);
-  const commentProps = {
-    id: 'context-toolbar-comment',
-    isRichEditor,
-    className: 'menu-group-item sdoc-comment-menu-container',
-    disabled: false,
-    isActive: false,
-    onMouseDown: onCommentClick,
-    iconClass: 'sdocfont sdoc-comments',
-    text: 'Comment',
-    ariaLabel: 'Add_Comment',
-    type: 'sdoc-add-comment'
-  };
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-    className: "sdoc-context-menu-divider"
-  }), /*#__PURE__*/_react.default.createElement(_menuItem.default, commentProps));
-};
-var _default = exports.default = CommentContextMenu;

package/dist/basic-sdk/comment/components/comment-context-menu/menu-item.js

@@ -1,57 +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 _classnames = _interopRequireDefault(require("classnames"));
-var _tooltip = _interopRequireDefault(require("../../../components/tooltip"));
-const MenuItem = _ref => {
-  let {
-    isRichEditor = true,
-    className = 'menu-group-item',
-    disabled,
-    isActive,
-    type,
-    onMouseDown,
-    id,
-    text,
-    ariaLabel,
-    iconClass
-  } = _ref;
-  const {
-    t
-  } = (0, _reactI18next.useTranslation)('sdoc-editor');
-  const onClick = (0, _react.useCallback)(event => {
-    if (disabled) return;
-    onMouseDown(event, type);
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [disabled, type]);
-  const validClassName = (0, _classnames.default)('', className, {
-    'btn btn-icon btn-secondary btn-active': !isRichEditor,
-    'rich-icon-btn': isRichEditor,
-    'rich-icon-btn-disabled': isRichEditor && disabled,
-    'rich-icon-btn-hover': isRichEditor && !disabled
-  });
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("button", {
-    id: id,
-    type: "button",
-    "aria-label": ariaLabel,
-    className: validClassName,
-    disabled: disabled,
-    "data-active": isActive,
-    onClick: onClick
-  }, /*#__PURE__*/_react.default.createElement("span", {
-    className: "sdoc-comment-menu-item"
-  }, /*#__PURE__*/_react.default.createElement("span", {
-    className: iconClass
-  }), /*#__PURE__*/_react.default.createElement("span", null, t(text)))), /*#__PURE__*/_react.default.createElement(_tooltip.default, {
-    target: id
-  }, t(ariaLabel)));
-};
-var _default = exports.default = MenuItem;

package/dist/basic-sdk/comment/components/comment-delete-popover.js

@@ -1,80 +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 _reactstrap = require("reactstrap");
-var _isHotkey = _interopRequireDefault(require("is-hotkey"));
-var _utils = require("../utils");
-require("./comment-list.css");
-const CommentDeletePopover = _ref => {
-  let {
-    type,
-    setIsShowDeletePopover,
-    deleteConfirm,
-    targetId,
-    parentDom
-  } = _ref;
-  const popoverRef = (0, _react.useRef)(null);
-  const hide = (0, _react.useCallback)(event => {
-    if (popoverRef.current && !(0, _utils.getEventClassName)(event).includes('popover') && !popoverRef.current.contains(event.target)) {
-      setIsShowDeletePopover(false);
-      event.preventDefault();
-      event.stopPropagation();
-      return false;
-    }
-  }, [setIsShowDeletePopover]);
-  const onHotKey = (0, _react.useCallback)(event => {
-    if ((0, _isHotkey.default)('esc', event)) {
-      event.preventDefault();
-      setIsShowDeletePopover(false);
-    }
-  }, [setIsShowDeletePopover]);
-  (0, _react.useEffect)(() => {
-    document.addEventListener('click', hide, true);
-    document.addEventListener('keydown', onHotKey);
-    return () => {
-      document.removeEventListener('click', hide, true);
-      document.removeEventListener('keydown', onHotKey);
-    };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-  const {
-    t
-  } = (0, _reactI18next.useTranslation)('sdoc-editor');
-  const onDeleteCancel = (0, _react.useCallback)(event => {
-    event.stopPropagation();
-    setIsShowDeletePopover(false);
-  }, [setIsShowDeletePopover]);
-  const handleConfirm = (0, _react.useCallback)(event => {
-    event.stopPropagation();
-    deleteConfirm();
-  }, [deleteConfirm]);
-  return /*#__PURE__*/_react.default.createElement(_reactstrap.UncontrolledPopover, {
-    container: parentDom,
-    target: targetId,
-    onClick: event => event.stopPropagation(),
-    placement: "left",
-    className: "comment-delete-popover",
-    isOpen: true
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "comment-delete-popover-container",
-    ref: popoverRef
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "delete-tip"
-  }, t(`Are_you_sure_to_delete_this_${type === 'comment' ? 'comment' : 'reply'}`)), /*#__PURE__*/_react.default.createElement("div", {
-    className: "delete-control mt-5"
-  }, /*#__PURE__*/_react.default.createElement("button", {
-    className: "btn btn-secondary mr-2",
-    onClick: onDeleteCancel
-  }, t('Cancel')), /*#__PURE__*/_react.default.createElement("button", {
-    className: "btn btn-primary",
-    onClick: handleConfirm
-  }, t('Confirm')))));
-};
-var _default = exports.default = CommentDeletePopover;

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

@@ -1,165 +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");
-const getSubmitTip = (type, content) => {
-  if (content) return 'Save';
-  return type === 'comment' ? 'Comment' : 'Reply';
-};
-const DEFAULT_PLACEHOLDER = 'Enter_comment_shift_enter_for_new_line_Enter_to_send';
-const CommentEditor = _ref => {
-  let {
-    type,
-    className,
-    content,
-    commentContent,
-    placeholder = DEFAULT_PLACEHOLDER,
-    insertContent,
-    updateContent,
-    setIsEditing,
-    hiddenComment,
-    hiddenUserInfo,
-    onContentChange,
-    isContextComment,
-    closeComment
-  } = _ref;
-  const commentWrapperRef = (0, _react.useRef)();
-  const {
-    t
-  } = (0, _reactI18next.useTranslation)('sdoc-editor');
-  const {
-    addParticipants
-  } = (0, _useParticipants.useParticipantsContext)();
-  const submitTip = (0, _react.useMemo)(() => getSubmitTip(type, content), [content, type]);
-  const userInfo = _context.default.getUserInfo();
-  const document = (0, _react.useMemo)(() => {
-    const cursor = {};
-    let elements = null;
-    elements = [(0, _core.generateEmptyElement)(_constants2.PARAGRAPH, {
-      placeholder
-    })];
-    return {
-      elements,
-      cursor
-    };
-  }, [placeholder]);
-  const editor = (0, _react.useMemo)(() => {
-    const defaultEditor = (0, _extension.createCommentEditor)();
-    const newEditor = (0, _nodeId.default)(defaultEditor);
-    const {
-      cursors
-    } = document;
-    newEditor.cursors = cursors || {};
-    newEditor.width = _constants.COMMENT_EDITOR_EDIT_AREA_WIDTH; // default width
-    newEditor.editorType = _constants.COMMENT_EDITOR;
-    return newEditor;
-  }, [document]);
-  const updateValue = (0, _react.useCallback)(value => {
-    if (!value || value.trim() === '') return;
-    if (!content) return insertContent(value);
-    updateContent && updateContent(value);
-  }, [content, insertContent, updateContent]);
-  const onSubmit = (0, _react.useCallback)(event => {
-    event && event.stopPropagation();
-    const mdString = (0, _slateToMd.default)(editor.children);
-    updateValue(mdString);
-    addParticipants(userInfo.username);
-    editor.children = [(0, _core.generateEmptyElement)(_constants2.PARAGRAPH, {
-      placeholder
-    })];
-    _slate.Transforms.select(editor, _slate.Editor.start(editor, []));
-    onContentChange && onContentChange(null);
-    closeComment && closeComment();
-  }, [editor, updateValue, addParticipants, userInfo.username, placeholder, onContentChange, closeComment]);
-  const onSubmitByEnterKey = (0, _react.useCallback)(event => {
-    if (!_slateReact.ReactEditor.isFocused(editor)) return;
-    onSubmit(event);
-  }, [editor, onSubmit]);
-  (0, _react.useEffect)(() => {
-    const eventBus = _eventBus.default.getInstance();
-    const unsubscribePostComment = eventBus.subscribe(_constants.INTERNAL_EVENT.COMMENT_EDITOR_POST_COMMENT, onSubmitByEnterKey);
-    return () => {
-      unsubscribePostComment();
-    };
-  }, [onSubmitByEnterKey]);
-  const onCancel = (0, _react.useCallback)(event => {
-    event.stopPropagation();
-    const {
-      type: eventType,
-      keyCode,
-      target
-    } = event;
-    if (eventType === 'keydown' && keyCode !== _constants.KeyCodes.Esc) return;
-    if (eventType === 'click') {
-      const isSdocContentWrapper = target.classList.contains('sdoc-content-wrapper');
-      const listContainer = window.document.querySelector('#global-comment-list-container');
-      const resizeContainer = window.document.querySelector('.sdoc-comment-resize-handler');
-      const isClickOnListContainer = listContainer && listContainer.contains(target);
-      const isClickOnCommentEditorContainer = commentWrapperRef.current.contains(target);
-      const isClickResizeContainer = resizeContainer && resizeContainer.contains(target);
-      const isPreventCancel = isClickOnListContainer || isClickOnCommentEditorContainer || isClickResizeContainer || isSdocContentWrapper;
-      if (isPreventCancel) return;
-    }
-    setIsEditing && setIsEditing(false);
-    hiddenComment && hiddenComment(false);
-    if (onContentChange) {
-      if (editor.children.find(n => _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)(() => {
-    let 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/basic-sdk/comment/components/comment-item-collapse-wrapper.js

@@ -1,160 +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 _dayjs = _interopRequireDefault(require("dayjs"));
-var _mdToHtml = _interopRequireDefault(require("../../slate-convert/md-to-html"));
-var _constants = require("../constants");
-var _helper = require("../helper");
-var _notificationHooks = require("../hooks/notification-hooks");
-const CommentItemCollapseWrapper = _ref => {
-  var _topLevelComment$deta;
-  let {
-    element,
-    topLevelComment,
-    latestReply,
-    editor,
-    replyCount,
-    setCurrentCommentGroup,
-    t
-  } = _ref;
-  const scrollRef = (0, _react.useRef)(document.querySelector('.sdoc-scroll-container'));
-  const {
-    notificationsInfo
-  } = (0, _notificationHooks.useNotificationContext)();
-  const [commentContent, setCommentContent] = (0, _react.useState)('');
-  const [replyContent, setReplyContent] = (0, _react.useState)('');
-  const isUnseen = notificationsInfo.notifications_map[`sdoc_notification_${topLevelComment.id}`] ? true : false;
-  const isReplayUnseen = (0, _react.useMemo)(() => {
-    if (!latestReply) return false;
-    const isUnseen = notificationsInfo.notifications_map[`sdoc_notification_${topLevelComment.id}_${latestReply.id}`] ? true : false;
-    return isUnseen;
-  }, [latestReply, notificationsInfo.notifications_map, topLevelComment.id]);
-  (0, _react.useEffect)(() => {
-    const initCommentContent = async () => {
-      const htmlString = await _mdToHtml.default.process(topLevelComment.comment);
-      setCommentContent(String(htmlString));
-    };
-    initCommentContent();
-  }, [topLevelComment.comment]);
-  (0, _react.useEffect)(() => {
-    const initReplyContent = async () => {
-      if (!latestReply) {
-        setReplyContent('');
-        return;
-      }
-      let mdString = '';
-      if (latestReply.reply) {
-        mdString = latestReply.reply;
-      } else {
-        mdString = '';
-      }
-      const htmlString = await _mdToHtml.default.process(mdString);
-      setReplyContent(String(htmlString));
-    };
-    initReplyContent();
-  }, [latestReply, t]);
-  const handleScrollToArticle = (0, _react.useCallback)(e => {
-    e.stopPropagation();
-    const dom = _slateReact.ReactEditor.toDOMNode(editor, element);
-    const headerHeight = 56 + 37;
-    scrollRef.current.scrollTo({
-      top: dom.offsetTop - headerHeight,
-      behavior: 'smooth'
-    });
-  }, [editor, element, scrollRef]);
-  const onItemClick = (0, _react.useCallback)(event => {
-    event.stopPropagation();
-    if (event.target.className === _constants.COMMENT_URL_CLASSNAME) return;
-    setCurrentCommentGroup(topLevelComment.id);
-  }, [setCurrentCommentGroup, topLevelComment.id]);
-  return /*#__PURE__*/_react.default.createElement("div", {
-    id: `comment-item-wrapper_${topLevelComment.id}`,
-    className: (0, _classnames.default)('comment-collapse-wrapper', 'comment-ui-container', {
-      'sdoc-resolved': topLevelComment.resolved,
-      'd-flex flex-column': element
-    }),
-    onClick: onItemClick
-  }, topLevelComment.detail.element_id_list && /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)('comment-item-selected-text-container', {
-      'detail-context-comment': ((_topLevelComment$deta = topLevelComment.detail.element_id_list) === null || _topLevelComment$deta === void 0 ? void 0 : _topLevelComment$deta.length) > 0
-    }),
-    onClick: handleScrollToArticle
-  }, /*#__PURE__*/_react.default.createElement("i", {
-    className: "sdocfont sdoc-comment-quote mr-2"
-  }), /*#__PURE__*/_react.default.createElement("div", {
-    className: "comment-item-selected-text"
-  }, topLevelComment.detail.element_id_list.map((elementId, index) => {
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: "context-comment-item-selected-text",
-      key: index
-    }, (0, _helper.getCommentedTextsByElementId)(elementId, topLevelComment.detail.text_comment_id));
-  }))), element && /*#__PURE__*/_react.default.createElement("div", {
-    className: "comment-item-selected-text-container",
-    onClick: handleScrollToArticle
-  }, /*#__PURE__*/_react.default.createElement("i", {
-    className: "sdocfont sdoc-comment-quote mr-2"
-  }), /*#__PURE__*/_react.default.createElement("div", {
-    className: "comment-item-selected-text"
-  }, _slate.Node.string(element))), /*#__PURE__*/_react.default.createElement("div", {
-    className: "comment-item-list"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "comment-item"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "comment-header"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "comment-author"
-  }, /*#__PURE__*/_react.default.createElement("span", {
-    className: "comment-author__avatar"
-  }, /*#__PURE__*/_react.default.createElement("img", {
-    alt: "",
-    src: topLevelComment.avatar_url
-  })), /*#__PURE__*/_react.default.createElement("span", {
-    className: "comment-author__info"
-  }, /*#__PURE__*/_react.default.createElement("span", {
-    className: "name"
-  }, topLevelComment.user_name), /*#__PURE__*/_react.default.createElement("span", {
-    className: "time"
-  }, (0, _dayjs.default)(topLevelComment.updated_at).format('MM-DD HH:mm'), (topLevelComment === null || topLevelComment === void 0 ? void 0 : topLevelComment.resolved) && /*#__PURE__*/_react.default.createElement("span", {
-    className: "comment-success-resolved sdocfont sdoc-mark-as-resolved"
-  })))), (isUnseen || isReplayUnseen) && /*#__PURE__*/_react.default.createElement("div", {
-    className: "sdoc-unread-message-tip"
-  })), /*#__PURE__*/_react.default.createElement("div", {
-    className: "comment-content"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    dangerouslySetInnerHTML: {
-      __html: commentContent
-    }
-  })), replyCount !== 0 && /*#__PURE__*/_react.default.createElement("div", {
-    className: "comment-footer"
-  }, /*#__PURE__*/_react.default.createElement("span", {
-    className: "comments-count"
-  }, /*#__PURE__*/_react.default.createElement("i", {
-    className: "sdocfont sdoc-comments"
-  }), /*#__PURE__*/_react.default.createElement("span", {
-    className: "comments-count-number"
-  }, replyCount)), /*#__PURE__*/_react.default.createElement("div", {
-    className: "comment-author"
-  }, /*#__PURE__*/_react.default.createElement("span", {
-    className: "comment-author__avatar"
-  }, /*#__PURE__*/_react.default.createElement("img", {
-    alt: "",
-    src: latestReply.avatar_url
-  })), /*#__PURE__*/_react.default.createElement("div", {
-    className: "comment-author__latest-reply"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    dangerouslySetInnerHTML: {
-      __html: replyContent
-    }
-  })))))));
-};
-var _default = exports.default = (0, _reactI18next.withTranslation)('sdoc-editor')(CommentItemCollapseWrapper);