@seafile/sdoc-editor 0.4.2-3 → 0.4.3

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

@@ -1,5 +1,6 @@
 import React, { useCallback, useMemo, Fragment } from 'react';
 import { Editable, ReactEditor, Slate } from '@seafile/slate-react';
+import { Editor } from '@seafile/slate';
 import { renderLeaf, renderElement, ContextToolbar, SideToolbar } from '../extension';
 import { getAboveBlockNode, getNextNode, getPrevNode, isSelectionAtBlockEnd, isSelectionAtBlockStart } from '../extension/core';
 import EventProxy from '../utils/event-handler';
@@ -12,6 +13,7 @@ import EventBus from '../utils/event-bus';
 import { ArticleContainer } from '../layout';
 import { useScrollContext } from '../hooks/use-scroll-context';
 import { SetNodeToDecorations } from '../highlight';
+import { IMAGE } from '../extension/constants';
 const EditableArticle = _ref => {
   let {
     isShowComment,
@@ -132,6 +134,24 @@ const EditableArticle = _ref => {
 
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [scrollRef]);
+  const handleScrollIntoView = useCallback((editor, domRange) => {
+    try {
+      const {
+        selection
+      } = editor;
+      const [imageNodeEntry] = Editor.nodes(editor, {
+        match: n => n.type === IMAGE
+      });
+      if (imageNodeEntry) return;
+      const domNode = ReactEditor.toDOMNode(editor, selection.focus.path);
+      if (!domNode) return;
+      domNode.scrollIntoView({
+        block: 'nearest'
+      });
+    } catch (error) {
+      // 
+    }
+  }, []);
   return /*#__PURE__*/React.createElement(Slate, {
     editor: editor,
     value: slateValue,
@@ -139,6 +159,7 @@ const EditableArticle = _ref => {
   }, /*#__PURE__*/React.createElement(ArticleContainer, {
     editor: editor
   }, /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(ContextToolbar, null), /*#__PURE__*/React.createElement(SetNodeToDecorations, null), /*#__PURE__*/React.createElement(Editable, {
+    scrollSelectionIntoView: handleScrollIntoView,
     cursors: cursors,
     renderElement: renderElement,
     renderLeaf: renderLeaf,

package/dist/basic-sdk/extension/plugins/code-block/helpers.js

@@ -33,7 +33,8 @@ export const changeToCodeBlock = function (editor) {
   let language = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
   let position = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : INSERT_POSITION.CURRENT;
   // Summarizes the strings for the selected highest-level node
-  let strArr = [];
+  let strArr = [],
+    path = Editor.path(editor, editor.selection);
   if (position === INSERT_POSITION.AFTER) {
     strArr = [''];
   } else {
@@ -72,7 +73,6 @@ export const changeToCodeBlock = function (editor) {
       }]
     }]
   };
-  const path = Editor.path(editor, editor.selection);
   if (position === INSERT_POSITION.AFTER) {
     Transforms.insertNodes(editor, newCodeBlockNode, {
       mode: 'highest',

package/dist/basic-sdk/index.js

@@ -1,6 +1,6 @@
 import SDocEditor from './editor/sdoc-editor';
 import RevisionEditor from './editor/revision-editor';
-import { DiffViewer, SDocViewer, PublishedRevisionDiffViewer, SDocMdViewer } from './views';
+import { DiffViewer, SDocViewer, PublishedRevisionDiffViewer } from './views';
 import SDocOutline from './outline';
 import EventBus from './utils/event-bus';
-export { SDocEditor, RevisionEditor, SDocViewer, SDocOutline, EventBus, DiffViewer, PublishedRevisionDiffViewer, SDocMdViewer };
+export { SDocEditor, RevisionEditor, SDocViewer, SDocOutline, EventBus, DiffViewer, PublishedRevisionDiffViewer };

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

@@ -2,5 +2,4 @@ import SDocViewer from './sdoc-viewer';
 import DiffViewer from './sdoc-diff-viewer';
 import RevisionDiffViewer from './revision-diff-viewer';
 import PublishedRevisionDiffViewer from './published-revision-diff-viewer';
-import SDocMdViewer from './sdoc-md-viewer';
-export { SDocViewer, DiffViewer, RevisionDiffViewer, PublishedRevisionDiffViewer, SDocMdViewer };
+export { SDocViewer, DiffViewer, RevisionDiffViewer, PublishedRevisionDiffViewer };

package/dist/components/doc-info/index.js

@@ -19,7 +19,9 @@ const DocInfo = _ref => {
   } = _ref;
   const onInternalLinkClick = useCallback(() => {
     const eventBus = EventBus.getInstance();
-    eventBus.dispatch(EXTERNAL_EVENT.INTERNAL_LINK_CLICK);
+    eventBus.dispatch(EXTERNAL_EVENT.INTERNAL_LINK_CLICK, {
+      internalLink: window.location.href
+    });
   }, []);
   const toggleStar = useCallback(() => {
     const eventBus = EventBus.getInstance();
@@ -80,7 +82,13 @@ const DocInfo = _ref => {
     className: "doc-name"
   }, oldDocName), /*#__PURE__*/React.createElement("div", {
     className: "sdoc-revision-order"
-  }, t('Revision') + ' ' + revisionId), isPublished && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+  }, t('Revision') + ' ' + revisionId), isShowInternalLink && /*#__PURE__*/React.createElement("span", {
+    className: "doc-icon"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "internal-link sdocfont sdoc-link",
+    title: t('Internal_link'),
+    onClick: onInternalLinkClick
+  })), isPublished && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
     className: "sdoc-revision-published-tip"
   }, t('Published')), /*#__PURE__*/React.createElement("div", {
     className: "sdoc-revision-source-doc",

package/dist/index.js

@@ -4,5 +4,4 @@ import SimpleEditor from './pages/simple-editor';
 import SimpleViewer from './pages/simple-viewer';
 import DiffViewer from './pages/diff-viewer';
 import PublishedRevisionViewer from './pages/published-revision-viewer';
-import MarkdownViewer from './pages/markdown-viewer';
-export { SDocViewer, SimpleEditor, SimpleViewer, EventBus, EXTERNAL_EVENT, DiffViewer, PublishedRevisionViewer, MarkdownViewer };
+export { SDocViewer, SimpleEditor, SimpleViewer, EventBus, EXTERNAL_EVENT, DiffViewer, PublishedRevisionViewer };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seafile/sdoc-editor",
-  "version": "0.4.2-3",
+  "version": "0.4.3",
   "private": false,
   "description": "This is a sdoc editor",
   "main": "dist/index.js",

package/dist/basic-sdk/assets/css/sdoc-md-viewer.css

@@ -1,29 +0,0 @@
-.sdoc-editor-container {
-  flex: 1;
-  display: flex;
-  min-height: 0;
-}
-
-.sdoc-md-scroll-container {
-  display: flex;
-  overflow: auto;
-}
-
-.sdoc-md-scroll-container .sdoc-article-container {
-  width: 100%;
-  margin: 0 340px 0 40px !important;
-}
-
-.sdoc-md-scroll-container .sdoc-article-container .article .sdoc-header-2 {
-  border-bottom: 1px solid #ccc;
-}
-
-.sdoc-md-outline-container {
-  height: 80%;
-  overflow-y: auto;
-  padding-right: 1rem;
-  position: fixed;
-  right: 0;
-  top: 97px;
-  width: 300px;
-}

package/dist/basic-sdk/md-outline/index.js

@@ -1,70 +0,0 @@
-import React, { useCallback, useEffect, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import OutlineItem from './outline-item';
-import { useScrollContext } from '../hooks/use-scroll-context';
-import './style.css';
-const getHeaderList = children => {
-  const headerList = [];
-  children.forEach(node => {
-    if (node.type === 'header2' || node.type === 'header3') {
-      headerList.push(node);
-    }
-  });
-  return headerList;
-};
-const Outline = _ref => {
-  let {
-    editor
-  } = _ref;
-  const {
-    t
-  } = useTranslation();
-  const scrollRef = useScrollContext();
-  const [headerList, setHeaderList] = useState([]);
-  const [activeId, setActiveId] = useState('');
-  useEffect(() => {
-    const headerList = getHeaderList(editor.children);
-    setHeaderList(headerList);
-  }, [editor.children]);
-  const handleScroll = useCallback(e => {
-    const scrollTop = scrollRef.current.scrollTop;
-    const styles = getComputedStyle(scrollRef === null || scrollRef === void 0 ? void 0 : scrollRef.current);
-    const paddingTop = parseInt(styles.paddingTop);
-    for (let i = 0; i < headerList.length; i++) {
-      const headerItem = headerList[i];
-      const dom = document.getElementById(headerItem.id);
-      const {
-        offsetTop,
-        offsetHeight
-      } = dom;
-      const styles = getComputedStyle(dom);
-      const marginTop = parseInt(styles.marginTop);
-      if (offsetTop + offsetHeight + marginTop > scrollTop - paddingTop) {
-        setActiveId(headerItem.id);
-        break;
-      }
-    }
-  }, [headerList, scrollRef]);
-  useEffect(() => {
-    let observerRefValue = null;
-    if (scrollRef.current) {
-      scrollRef.current.addEventListener('scroll', handleScroll);
-      observerRefValue = scrollRef.current;
-    }
-    return () => {
-      observerRefValue.removeEventListener('scroll', handleScroll);
-    };
-  }, [handleScroll, scrollRef]);
-  return /*#__PURE__*/React.createElement("div", {
-    className: "sdoc-md-editor-outline"
-  }, headerList.length === 0 && /*#__PURE__*/React.createElement("div", {
-    className: "empty-container"
-  }, t('No_out_line')), headerList.length > 0 && headerList.map((node, index) => {
-    return /*#__PURE__*/React.createElement(OutlineItem, {
-      key: index,
-      node: node,
-      activeId: activeId
-    });
-  }));
-};
-export default Outline;

package/dist/basic-sdk/md-outline/outline-item.js

@@ -1,24 +0,0 @@
-import React, { useCallback } from 'react';
-import classNames from 'classnames';
-const OutlineItem = _ref => {
-  let {
-    node,
-    activeId
-  } = _ref;
-  const onItemClick = useCallback(() => {
-    const {
-      id
-    } = node;
-    document.getElementById(id).scrollIntoView();
-  }, [node]);
-  const className = classNames({
-    'outline-h2': node.type === 'header2',
-    'outline-h3': node.type === 'header3',
-    'active': node.id === activeId
-  });
-  return /*#__PURE__*/React.createElement("div", {
-    className: className,
-    onClick: onItemClick
-  }, node.children.map(child => child.text).join(''));
-};
-export default OutlineItem;

package/dist/basic-sdk/md-outline/style.css

@@ -1,45 +0,0 @@
-.sdoc-md-editor-outline {
-  border-left: 1px solid #ddd;
-  padding: .5rem 1rem .5rem 0;
-}
-
-.sdoc-md-editor-outline .outline-h2, 
-.sdoc-md-editor-outline .outline-h3 {
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.sdoc-md-editor-outline .outline-h2 {
-  margin-left: 20px;
-  line-height: 2.5;
-  color:#364149;
-  white-space: nowrap;
-  cursor:pointer;
-}
-
-.sdoc-md-editor-outline .outline-h2:hover {
-  color: #eb8205;
-}
-
-.sdoc-md-editor-outline .outline-h3 {
-  margin-left: 40px;
-  line-height: 2.5;
-  color:#364149;
-  white-space: nowrap;
-  cursor:pointer;
-}
-
-.sdoc-md-editor-outline .outline-h3:hover {
-  color: #eb8205;
-}
-
-.sdoc-md-editor-outline .empty-container {
-  margin-top: 10px;
-  text-align: center;
-}
-
-.sdoc-md-editor-outline .outline-h2.active,
-.sdoc-md-editor-outline .outline-h3.active {
-  color: #eb8205;
-}

package/dist/basic-sdk/views/sdoc-md-viewer.js

@@ -1,44 +0,0 @@
-import React, { useRef } from 'react';
-import { createDefaultEditor } from '../extension';
-import withNodeId from '../node-id';
-import { generateDefaultDocContent } from '../../utils';
-import { EditorContainer } from '../layout';
-import ReadOnlyArticle from './readonly-article';
-import { ColorProvider } from '../hooks/use-color-context';
-import { ScrollContext } from '../hooks/use-scroll-context';
-import Outline from '../md-outline';
-import '../assets/css/sdoc-md-viewer.css';
-const SDocMdViewer = _ref => {
-  let {
-    editor,
-    document,
-    showOutline
-  } = _ref;
-  const validEditor = editor || withNodeId(createDefaultEditor());
-  const slateValue = (document || generateDefaultDocContent()).children;
-  const scrollRef = useRef(null);
-  return /*#__PURE__*/React.createElement(EditorContainer, {
-    editor: validEditor,
-    readonly: true
-  }, /*#__PURE__*/React.createElement(ColorProvider, null, /*#__PURE__*/React.createElement("div", {
-    ref: scrollRef,
-    className: "sdoc-md-scroll-container"
-  }, /*#__PURE__*/React.createElement(ScrollContext.Provider, {
-    value: {
-      scrollRef
-    }
-  }, /*#__PURE__*/React.createElement(ReadOnlyArticle, {
-    editor: validEditor,
-    slateValue: slateValue,
-    isShowComment: false
-  }), showOutline && /*#__PURE__*/React.createElement("div", {
-    className: "sdoc-md-outline-container"
-  }, /*#__PURE__*/React.createElement(Outline, {
-    editor: validEditor
-  }))))));
-};
-SDocMdViewer.defaultProps = {
-  showToolbar: false,
-  showOutline: false
-};
-export default SDocMdViewer;

package/dist/pages/markdown-viewer.js

@@ -1,17 +0,0 @@
-import React from 'react';
-import context from '../context';
-import ErrorBoundary from './error-boundary';
-import { SDocMdViewer } from '../basic-sdk';
-import '../assets/css/simple-viewer.css';
-const MarkdownViewer = _ref => {
-  let {
-    document,
-    showOutline
-  } = _ref;
-  context.initApi();
-  return /*#__PURE__*/React.createElement(ErrorBoundary, null, /*#__PURE__*/React.createElement(SDocMdViewer, {
-    document: document,
-    showOutline: showOutline
-  }));
-};
-export default MarkdownViewer;