@seafile/sdoc-editor 0.5.63 → 0.5.65

package/dist/basic-sdk/assets/css/sdoc-editor-plugins.css

@@ -56,13 +56,14 @@
 .sdoc-editor-container .article .sdoc-image-wrapper {
   position: relative;
   display: inline-block;
-  padding: 6px 1px 6px 1px;
   margin: 0 0.15em;
+  caret-color: transparent;
 }
 
 .sdoc-editor-container .article .sdoc-image-inner {
   position: relative;
   display: inline-block;
+  margin: 0 3px;
 }
 
 .sdoc-editor-container .article .sdoc-image-content {

package/dist/basic-sdk/comment/components/comment-item-wrapper.js

@@ -3,6 +3,7 @@ import React, { useCallback, useEffect, useRef, useState } from 'react';
 import dayjs from 'dayjs';
 import classNames from 'classnames';
 import { Node } from '@seafile/slate';
+import { ReactEditor } from '@seafile/slate-react';
 import context from '../../../context';
 import { useCommentContext } from '../hooks/comment-hooks/use-comment-context';
 import CommentItemContent from './comment-item-content';
@@ -19,12 +20,14 @@ const CommentItemWrapper = _ref => {
     comment,
     onCommentClick,
     updateScrollPosition,
-    hiddenComment
+    hiddenComment,
+    editor
   } = _ref;
   const listRef = useRef(null);
   const {
     dispatch
   } = useCommentContext();
+  const scrollRef = useRef(document.querySelector('.sdoc-scroll-container'));
   const commentOpToolsId = "commentOpTools_".concat(comment.id);
   const deleteComment = useCallback(async commentId => {
     await context.deleteComment(commentId);
@@ -234,12 +237,22 @@ const CommentItemWrapper = _ref => {
     'd-flex flex-column pt-0': element
   });
   const tip = comment.resolved ? 'Reopen_discussion' : 'Enter_reply_Enter_for_new_line_Shift_Enter_to_send';
+  const handleScrollToArticle = useCallback(e => {
+    e.stopPropagation();
+    const dom = ReactEditor.toDOMNode(editor, element);
+    const headerHeight = 56 + 37;
+    scrollRef.current.scrollTo({
+      top: dom.offsetTop - headerHeight,
+      behavior: 'smooth'
+    });
+  }, [editor, element, scrollRef]);
   return /*#__PURE__*/React.createElement("div", {
     id: "comment-item-wrapper_".concat(comment.id),
     className: className,
     onClick: onItemClick
   }, element && /*#__PURE__*/React.createElement("div", {
-    className: "comment-item-selected-text-container"
+    className: "comment-item-selected-text-container",
+    onClick: handleScrollToArticle
   }, /*#__PURE__*/React.createElement("i", {
     className: "sdocfont sdoc-comment-quote mr-2"
   }), /*#__PURE__*/React.createElement("div", {

package/dist/basic-sdk/comment/components/global-comment/index.js

@@ -231,7 +231,8 @@ const GlobalComment = _ref => {
       onCommentClick: comment => onCommentClick(comment, element),
       hiddenComment: hiddenComment,
       updateScrollPosition: updateScrollPosition,
-      isClickCommentPanelBody: isClickCommentPanelBody
+      isClickCommentPanelBody: isClickCommentPanelBody,
+      editor: editor
     });
   }))), showEditor && /*#__PURE__*/React.createElement(GlobalCommentEditor, {
     isScrollDisplayed: isScrollDisplayed,

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

@@ -200,7 +200,8 @@ const Image = _ref => {
     className: classNames('sdoc-image-wrapper', className)
   }, attributes, {
     style: _objectSpread({}, style),
-    onMouseOver: e => selectImageWhenSelectPartial(e, editor, element, isSelected)
+    onMouseOver: e => selectImageWhenSelectPartial(e, editor, element, isSelected),
+    contentEditable: "true"
   }), /*#__PURE__*/React.createElement("img", {
     ref: imageRef,
     src: imagePlaceholder,
@@ -212,9 +213,11 @@ const Image = _ref => {
     className: classNames('sdoc-image-wrapper', className)
   }, attributes, {
     style: _objectSpread({}, style),
-    onMouseOver: e => selectImageWhenSelectPartial(e, editor, element, isSelected)
+    onMouseOver: e => selectImageWhenSelectPartial(e, editor, element, isSelected),
+    contentEditable: "true"
   }), /*#__PURE__*/React.createElement("span", {
-    className: "sdoc-image-inner"
+    className: "sdoc-image-inner",
+    contentEditable: "false"
   }, /*#__PURE__*/React.createElement("span", {
     className: "sdoc-image-content"
   }, /*#__PURE__*/React.createElement("span", {
@@ -311,10 +314,10 @@ export function renderImageBlock(props, editor) {
     className: "sdoc-image-block-wrapper",
     style: {
       display: 'flex',
-      padding: '5px 0px',
       justifyContent: "".concat(justifyContent)
     }
   }, attributes, {
-    onMouseOver: e => selectImageWhenSelectPartial(e, editor, element, isSelected)
+    onMouseOver: e => selectImageWhenSelectPartial(e, editor, element, isSelected),
+    contentEditable: "false"
   }), children);
 }

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

@@ -8,6 +8,7 @@ import { transformToText } from './helper';
 import { useScrollContext } from '../../../hooks/use-scroll-context';
 import { INSERT_POSITION } from '../../constants';
 import QuickInsertBlockMenu from '../../toolbar/insert-element-toolbar';
+import { isVoidNode } from '../../toolbar/side-toolbar/helpers';
 const RenderQuickInsert = (_ref, editor) => {
   let {
     attributes,
@@ -24,6 +25,7 @@ const RenderQuickInsert = (_ref, editor) => {
   const insertElmRef = useRef(null);
   const aboveBlockNode = getAboveBlockNode(editor);
   const searchText = Node.string(element);
+  const isEmptyNode = isVoidNode(aboveBlockNode === null || aboveBlockNode === void 0 ? void 0 : aboveBlockNode[0]);
   const handleClick = useCallback(e => {
     if (!insertElmRef.current.contains(e.target)) {
       transformToText(editor, element);
@@ -74,7 +76,8 @@ const RenderQuickInsert = (_ref, editor) => {
     ref: sideMenuRef,
     className: "sdoc-side-menu sdoc-dropdown-menu"
   }, /*#__PURE__*/React.createElement(QuickInsertBlockMenu, {
-    insertPosition: INSERT_POSITION.AFTER,
+    isEmptyNode: isEmptyNode,
+    insertPosition: isEmptyNode ? INSERT_POSITION.CURRENT : INSERT_POSITION.AFTER,
     slateNode: aboveBlockNode === null || aboveBlockNode === void 0 ? void 0 : aboveBlockNode[0],
     searchText: searchText,
     callback: handleInsertBlock

package/dist/basic-sdk/extension/toolbar/insert-element-toolbar/index.js

@@ -2,7 +2,7 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { useSlateStatic } from '@seafile/slate-react';
 import { Transforms } from '@seafile/slate';
-import { insertElement } from '../side-toolbar/helpers';
+import { insertElement, isVoidNode } from '../side-toolbar/helpers';
 import { insertTable } from '../../plugins/table/helpers';
 import TableSizePopover from '../../plugins/table/popover/table-size-popover';
 import { changeToCodeBlock } from '../../plugins/code-block/helpers';
@@ -21,7 +21,8 @@ const QuickInsertBlockMenu = _ref => {
     insertPosition,
     slateNode,
     searchText,
-    callback
+    callback,
+    isEmptyNode
   } = _ref;
   const editor = useSlateStatic();
   const [currentSelectIndex, setCurrentSelectIndex] = useState(0);
@@ -145,6 +146,7 @@ const QuickInsertBlockMenu = _ref => {
         onClick: onInsertCheckList
       }),
       [PARAGRAPH]: /*#__PURE__*/React.createElement(DropdownMenuItem, {
+        disabled: isEmptyNode,
         key: "sdoc-insert-menu-paragraph",
         menuConfig: _objectSpread({}, SIDE_INSERT_MENUS_CONFIG[ELEMENT_TYPE.PARAGRAPH]),
         onClick: () => onInsert(ELEMENT_TYPE.PARAGRAPH)
@@ -158,7 +160,7 @@ const QuickInsertBlockMenu = _ref => {
       });
     });
     return items;
-  }, [createTable, editor, onInsert, onInsertCallout, onInsertCheckList, onInsertCodeBlock, onInsertImageToggle, onInsertList, openLinkDialog]);
+  }, [createTable, editor, isEmptyNode, onInsert, onInsertCallout, onInsertCheckList, onInsertCodeBlock, onInsertImageToggle, onInsertList, openLinkDialog]);
   const getSelectItemDom = selectIndex => {
     const dropDownItemWrapper = downDownWrapperRef.current;
     const currentSelectItem = dropDownItemWrapper.children[selectIndex];

package/dist/basic-sdk/extension/toolbar/side-toolbar/insert-block-menu.js

@@ -16,7 +16,8 @@ import { wrapCallout } from '../../plugins/callout/helper';
 const InsertBlockMenu = _ref => {
   let {
     insertPosition,
-    slateNode
+    slateNode,
+    isNodeEmpty
   } = _ref;
   const editor = useSlateStatic();
   const onInsertImageToggle = useCallback(() => {
@@ -113,6 +114,7 @@ const InsertBlockMenu = _ref => {
     onClick: onInsertCheckList
   }), [SIDE_INSERT_MENUS_CONFIG[ELEMENT_TYPE.PARAGRAPH], ...SIDE_INSERT_MENUS_CONFIG[ELEMENT_TYPE.HEADER]].map(item => {
     return /*#__PURE__*/React.createElement(DropdownMenuItem, {
+      disabled: isNodeEmpty && item.type === PARAGRAPH,
       key: item.id,
       menuConfig: item,
       onClick: () => onInsert(item.type)

package/dist/basic-sdk/extension/toolbar/side-toolbar/side-menu.js

@@ -85,6 +85,7 @@ const SideMenu = _ref => {
     slateNode: slateNode,
     onReset: onReset
   }))), isNodeEmpty && /*#__PURE__*/React.createElement(InsertBlockMenu, {
+    isNodeEmpty: isNodeEmpty,
     slateNode: slateNode
   }), !isNodeEmpty && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DropdownMenuItem, {
     menuConfig: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seafile/sdoc-editor",
-  "version": "0.5.63",
+  "version": "0.5.65",
   "private": false,
   "description": "This is a sdoc editor",
   "main": "dist/index.js",
@@ -141,7 +141,7 @@
     "react-hot-loader": "4.13.1",
     "react-i18next": "12.1.4",
     "react-mentions": "4.4.7",
-    "release-it": "16.2.1",
+    "release-it": "17.3.0",
     "resolve": "1.12.0",
     "resolve-url-loader": "5.0.0",
     "sass-loader": "13.3.2",