@seafile/sdoc-editor 0.1.67-beta → 0.1.68-beta

package/dist/basic-sdk/assets/css/code-block.css

@@ -3,7 +3,8 @@
 }
 
 .sdoc-code-block-pre {
-  border: 1px solid #ccc;
+  background: #FAFAFA;
+  border: 1px solid #f0f0f0;
 }
 
 .sdoc-code-block-pre .sdoc-code-no-wrap {
@@ -16,19 +17,21 @@
 
 .sdoc-code-block-code .sdoc-code-line {
   position: relative;
-  padding-left: 5px;
+  padding-left: 24px;
 }
 
 .sdoc-code-block-code .sdoc-code-line .sdoc-code-line-index {
   position: absolute;
-  left: -10px;
+  left: -8px;
   color: #ccc;
-  width: 10px;
-  height: 10px;
   caret-color: transparent;
   pointer-events: none;
 }
 
+.sdoc-code-block-code .sdoc-code-line .sdoc-code-line-index::selection {
+  background: transparent; 
+}
+
 .sdoc-code-line
 .token.comment,
 .token.prolog,

package/dist/basic-sdk/comment/style.css

@@ -64,6 +64,7 @@
 .sdoc-comment-container .comment-item .comment-header {
   display: flex;
   justify-content: space-between;
+  align-items: center;
 }
 
 .sdoc-comment-container .comment-item .comment-content {

package/dist/basic-sdk/editor.js

@@ -47,6 +47,7 @@ var SDocEditor = function SDocEditor(_ref) {
   var _useCursors = useCursors(editor),
     cursors = _useCursors.cursors;
   var scrollRef = useRef(null);
+  var articleRef = useRef(null);
   var decorate = usePipDecorate(editor);
 
   // init eventHandler
@@ -59,7 +60,7 @@ var SDocEditor = function SDocEditor(_ref) {
   // useMount: init socket connection
   useEffect(function () {
     editor.openConnection();
-    editor.width = scrollRef.current.children[0].clientWidth;
+    editor.width = articleRef.current.children[0].clientWidth;
     return function () {
       editor.closeConnection();
     };
@@ -121,7 +122,8 @@ var SDocEditor = function SDocEditor(_ref) {
     value: slateValue,
     onChange: onChange
   }, /*#__PURE__*/React.createElement(CommentContextProvider, null, /*#__PURE__*/React.createElement("div", {
-    className: "article"
+    className: "article",
+    ref: articleRef
   }, /*#__PURE__*/React.createElement(SetNodeToDecorations, null), /*#__PURE__*/React.createElement(Editable, {
     renderElement: renderElement,
     renderLeaf: renderLeaf,

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

@@ -1,10 +1,78 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import { Transforms } from '@seafile/slate';
-import { getNodeType, isLastNode, genEmptyParagraph } from '../../core';
-import { CODE_BLOCK } from '../../constants';
+import _toArray from "@babel/runtime/helpers/esm/toArray";
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import slugid from 'slugid';
+import { Transforms, Node, Range, Editor } from '@seafile/slate';
+import { getNodeType, isLastNode, genEmptyParagraph, getSelectedNodeByType, generateEmptyElement } from '../../core';
+import { CODE_BLOCK, PARAGRAPH, CODE_LINE } from '../../constants';
 var withCodeBlock = function withCodeBlock(editor) {
-  var normalizeNode = editor.normalizeNode;
+  var normalizeNode = editor.normalizeNode,
+    insertFragment = editor.insertFragment,
+    insertText = editor.insertText,
+    insertBreak = editor.insertBreak;
   var newEditor = editor;
+  newEditor.insertFragment = function (data) {
+    // only selected code block content
+    if (data.length === 1 && data[0].type === CODE_BLOCK && !getSelectedNodeByType(editor, CODE_BLOCK)) {
+      data.forEach(function (node, index) {
+        if (node.type === CODE_BLOCK) {
+          var newBlock = node.children.map(function (line) {
+            var text = Node.string(line);
+            var p = generateEmptyElement(PARAGRAPH);
+            p.children[0].text = text;
+            return p;
+          });
+          data.splice.apply(data, [index, 1].concat(_toConsumableArray(newBlock)));
+        }
+      });
+      return insertFragment(data);
+    } else {
+      if (getSelectedNodeByType(editor, CODE_BLOCK)) {
+        // Paste into code block
+
+        // Pasted data is code block split with code-line
+        data.forEach(function (node, index) {
+          if (node.type === CODE_BLOCK) {
+            var codeLineArr = node.children.map(function (line) {
+              return line;
+            });
+            data.splice.apply(data, [index, 1].concat(_toConsumableArray(codeLineArr)));
+          }
+        });
+        var newData = data.map(function (node) {
+          var text = Node.string(node);
+          var codeLine = {
+            id: slugid.nice(),
+            type: CODE_LINE,
+            children: [{
+              text: text,
+              id: slugid.nice()
+            }]
+          };
+          return codeLine;
+        });
+
+        // current focus code-line string not empty
+        var string = Editor.string(newEditor, newEditor.selection.focus.path);
+        if (string.length !== 0 && Range.isCollapsed(newEditor.selection)) {
+          var _newData = _toArray(newData),
+            node = _newData[0],
+            restNode = _newData.slice(1);
+          var text = Node.string(node);
+          insertText(text);
+          if (restNode.length !== 0) {
+            insertBreak();
+            insertFragment(restNode);
+          }
+          return;
+        }
+        return insertFragment(newData);
+      } else {
+        // Paste into not a code block
+        return insertFragment(data);
+      }
+    }
+  };
 
   // Rewrite normalizeNode
   newEditor.normalizeNode = function (_ref) {

package/dist/basic-sdk/extension/plugins/table/render/render-row.js

@@ -10,6 +10,7 @@ import { TABLE_ROW_MIN_HEIGHT } from '../constants';
 import { updateTableRowHeight } from '../helpers';
 import { eventStopPropagation, getMouseDownInfo, getMouseMoveInfo, registerResizeEvents, unregisterResizeEvents } from '../../../../utils/mouse-event';
 import { useSettingSelectRangeContext, useResizeHandlersContext } from './hooks';
+import { useScrollContext } from '../../../../hooks/use-scroll-context';
 var TableRow = function TableRow(_ref) {
   var _element$style;
   var element = _ref.element,
@@ -36,11 +37,11 @@ var TableRow = function TableRow(_ref) {
     _useState6 = _slicedToArray(_useState5, 2),
     height = _useState6[0],
     setHeight = _useState6[1];
+  var scrollContent = useScrollContext();
   var onMouseDown = useCallback(function (event) {
     eventStopPropagation(event);
     Transforms.deselect(editor);
-    var pageElement = document.getElementsByClassName('sdoc-editor-article-container')[0];
-    var mouseDownInfo = getMouseDownInfo(event, pageElement);
+    var mouseDownInfo = getMouseDownInfo(event, scrollContent.current);
     setMouseDownInfo(mouseDownInfo);
     setIsResizing(true);
 
@@ -50,8 +51,7 @@ var TableRow = function TableRow(_ref) {
     if (!isResizing) return;
     var onMouseMove = function onMouseMove(event) {
       eventStopPropagation(event);
-      var pageElement = document.getElementsByClassName('sdoc-editor-article-container')[0];
-      var mouseMoveInfo = getMouseMoveInfo(event, mouseDownInfo, pageElement);
+      var mouseMoveInfo = getMouseMoveInfo(event, mouseDownInfo, scrollContent.current);
       var newHeight = tableRow.current + mouseMoveInfo.displacementY;
       var validHeight = Math.max(TABLE_ROW_MIN_HEIGHT, newHeight);
       setHeight(validHeight);

package/dist/basic-sdk/extension/render/render-element.js

@@ -99,6 +99,7 @@ var CustomElement = function CustomElement(props) {
         return /*#__PURE__*/React.createElement("div", Object.assign({}, attributes, {
           className: 'sdoc-code-line'
         }), lineNumber && /*#__PURE__*/React.createElement("span", {
+          spellCheck: false,
           className: "sdoc-code-line-index"
         }, lineNumber), children);
       }

package/dist/basic-sdk/hooks/use-scroll-context.js

@@ -1,4 +1,4 @@
-import React, { useContext } from "react";
+import React, { useContext } from 'react';
 export var ScrollContext = React.createContext(null);
 export var useScrollContext = function useScrollContext() {
   var context = useContext(ScrollContext);

package/dist/basic-sdk/index.js

@@ -1,5 +1,5 @@
 import SDocEditor from './editor';
-import SDocViewer from './viewer';
+import { DiffViewer, SDocViewer } from './views';
 import SDocOutline from './outline';
 import EventBus from './utils/event-bus';
-export { SDocEditor, SDocViewer, SDocOutline, EventBus };
+export { SDocEditor, SDocViewer, SDocOutline, EventBus, DiffViewer };

package/dist/{pages/diff-viewer → basic-sdk/views}/diff-viewer.js

@@ -1,9 +1,9 @@
 import React, { useCallback, useEffect } from 'react';
-import { renderLeaf, renderElement } from '../../basic-sdk/extension';
-import { getDiff } from '../../basic-sdk/utils/diff';
+import { renderLeaf, renderElement } from '../extension';
+import { getDiff } from '../utils/diff';
 import context from '../../context';
-import { ELEMENT_TYPE, ADDED_STYLE, DELETED_STYLE } from '../../basic-sdk/extension/constants';
-import { SDocViewer } from '../../basic-sdk';
+import { ELEMENT_TYPE, ADDED_STYLE, DELETED_STYLE } from '../extension/constants';
+import SDocViewer from './viewer';
 import '../../assets/css/diff-viewer.css';
 var DiffViewer = function DiffViewer(_ref) {
   var currentContent = _ref.currentContent,

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

@@ -0,0 +1,3 @@
+import DiffViewer from './diff-viewer';
+import SDocViewer from './viewer';
+export { DiffViewer, SDocViewer };

package/dist/basic-sdk/{viewer.js → views/viewer.js}

@@ -1,12 +1,12 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import React, { useRef, useEffect, useState } from 'react';
 import { Editable, Slate } from '@seafile/slate-react';
-import defaultEditor, { renderLeaf as _renderLeaf, renderElement as _renderElement } from './extension';
-import { withSocketIO } from './socket';
-import withNodeId from './node-id';
-import './assets/css/layout.css';
-import './assets/css/sdoc-editor-plugins.css';
-import { generateDefaultDocContent } from '../utils';
+import defaultEditor, { renderLeaf as _renderLeaf, renderElement as _renderElement } from '../extension';
+import { withSocketIO } from '../socket';
+import withNodeId from '../node-id';
+import '../assets/css/layout.css';
+import '../assets/css/sdoc-editor-plugins.css';
+import { generateDefaultDocContent } from '../../utils';
 var SDocViewer = function SDocViewer(_ref) {
   var isOpenSocket = _ref.isOpenSocket,
     document = _ref.document,

package/dist/components/code-block-hover-menu/index.css

@@ -26,7 +26,7 @@
 .sdoc-code-block-hover-menu-container .hover-menu-container .op-item {
   font-size: 12px;
   color: #212529;
-  padding: 0 5px;
+  padding: 0 3px;
   border-radius: 2px;
 }
 
@@ -37,7 +37,7 @@
 }
 
 .sdoc-code-block-hover-menu-container .hover-menu-container .icon-font {
-  font-size: 12px;
+  font-size: 14px;
   color: #999999;
 }
 

package/dist/components/doc-operations/history-operation.js

@@ -3,6 +3,7 @@ import context from '../../context';
 var HistoryOperation = function HistoryOperation() {
   var docPerm = context.getSetting('docPerm');
   var historyURL = context.getSetting('historyURL');
+  var isSdocRevision = context.getSetting('isSdocRevision');
   var toggleHistory = useCallback(function (event) {
     event.stopPropagation();
     event.nativeEvent.stopImmediatePropagation();
@@ -11,6 +12,7 @@ var HistoryOperation = function HistoryOperation() {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   if (docPerm !== 'rw' || !historyURL) return null;
+  if (isSdocRevision) return null;
   return /*#__PURE__*/React.createElement("span", {
     className: "op-item",
     onClick: toggleHistory

package/dist/components/doc-operations/{revision-operations/index.js → revision-operations.js}

@@ -1,8 +1,8 @@
 import React, { useCallback } from 'react';
 import { Button } from 'reactstrap';
 import { withTranslation } from 'react-i18next';
-import context from '../../../context';
-import toaster from '../../../components/toast';
+import context from '../../context';
+import toaster from '../../components/toast';
 var RevisionOperations = function RevisionOperations(_ref) {
   var t = _ref.t;
   var isSdocRevision = context.getSetting('isSdocRevision');
@@ -30,7 +30,7 @@ var RevisionOperations = function RevisionOperations(_ref) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   if (!isSdocRevision) return null;
-  return /*#__PURE__*/React.createElement(React.Fragment, null, revisionURL && /*#__PURE__*/React.createElement(Button, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, !isPublished && revisionURL && /*#__PURE__*/React.createElement(Button, {
     color: "success",
     className: "mr-4",
     onClick: viewChanges

package/dist/pages/diff-viewer/index.js

@@ -4,7 +4,7 @@ import _inherits from "@babel/runtime/helpers/esm/inherits";
 import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React, { Component } from 'react';
 import HistoryVersionViewer from './history-version-viewer';
-import DiffViewer from './diff-viewer';
+import { DiffViewer } from '../../basic-sdk';
 import context from '../../context';
 var Index = /*#__PURE__*/function (_Component) {
   _inherits(Index, _Component);

package/package.json

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