@seafile/sdoc-editor 0.1.148 → 0.1.149-beta
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/api/sdoc-server-api.js +10 -0
- package/dist/api/seafile-api.js +27 -5
- package/dist/basic-sdk/comment/comment/comment-item-content.js +5 -0
- package/dist/basic-sdk/comment/comment/comment-item-reply.js +3 -0
- package/dist/basic-sdk/comment/comment/global-comment-header.js +5 -2
- package/dist/basic-sdk/comment/comment/global-comment.js +1 -1
- package/dist/basic-sdk/comment/comment/style.css +6 -5
- package/dist/basic-sdk/constants/index.js +20 -1
- package/dist/basic-sdk/editor/common-editor.js +50 -0
- package/dist/basic-sdk/editor/index.css +29 -0
- package/dist/basic-sdk/editor/index.js +129 -0
- package/dist/basic-sdk/{slate-editor.js → editor/slate-editor.js} +21 -16
- package/dist/basic-sdk/extension/constants/element-type.js +4 -1
- package/dist/basic-sdk/extension/core/transforms/replace-node-children.js +26 -0
- package/dist/basic-sdk/extension/render/render-element.js +213 -1
- package/dist/basic-sdk/socket/helpers.js +2 -0
- package/dist/basic-sdk/socket/socket-client.js +38 -0
- package/dist/basic-sdk/socket/socket-manager.js +25 -2
- package/dist/basic-sdk/socket/with-socket-io.js +35 -12
- package/dist/basic-sdk/utils/diff.js +2 -2
- package/dist/basic-sdk/utils/rebase.js +181 -0
- package/dist/basic-sdk/views/diff-viewer.js +3 -1
- package/dist/basic-sdk/views/viewer.js +9 -12
- package/dist/components/doc-operations/index.js +4 -2
- package/dist/components/doc-operations/revision-operations/index.js +5 -2
- package/dist/components/doc-operations/revision-operations/publish-button.js +6 -13
- package/dist/components/tip-dialog/index.js +48 -0
- package/dist/components/tip-dialog/tip-content.js +50 -0
- package/dist/constants/index.js +23 -2
- package/dist/context.js +35 -4
- package/dist/pages/simple-editor.js +255 -83
- package/package.json +1 -1
- package/public/locales/en/sdoc-editor.json +11 -1
- package/public/locales/zh_CN/sdoc-editor.json +10 -1
- package/public/media/sdoc-editor-font/iconfont.eot +0 -0
- package/public/media/sdoc-editor-font/iconfont.svg +4 -0
- package/public/media/sdoc-editor-font/iconfont.ttf +0 -0
- package/public/media/sdoc-editor-font/iconfont.woff +0 -0
- package/public/media/sdoc-editor-font/iconfont.woff2 +0 -0
- package/public/media/sdoc-editor-font.css +14 -6
- package/dist/basic-sdk/editor.js +0 -105
|
@@ -58,6 +58,16 @@ var SDocServerApi = /*#__PURE__*/function () {
|
|
|
58
58
|
}
|
|
59
59
|
});
|
|
60
60
|
}
|
|
61
|
+
|
|
62
|
+
// saveDocContentByRebase(content) {
|
|
63
|
+
// const { server, docUuid, accessToken } = this;
|
|
64
|
+
// const url = `${server}/api/v1/docs/${docUuid}/rebase/`;
|
|
65
|
+
|
|
66
|
+
// const formData = new FormData();
|
|
67
|
+
// formData.append('doc_content', JSON.stringify(content));
|
|
68
|
+
|
|
69
|
+
// return axios.post(url, formData, {headers: {Authorization: `Token ${accessToken}`}});
|
|
70
|
+
// }
|
|
61
71
|
}, {
|
|
62
72
|
key: "getCollaborators",
|
|
63
73
|
value: function getCollaborators() {
|
package/dist/api/seafile-api.js
CHANGED
|
@@ -48,9 +48,11 @@ var SeafileAPI = /*#__PURE__*/function () {
|
|
|
48
48
|
}
|
|
49
49
|
}, {
|
|
50
50
|
key: "sdocPublishRevision",
|
|
51
|
-
value: function sdocPublishRevision(docUuid) {
|
|
51
|
+
value: function sdocPublishRevision(docUuid, replace) {
|
|
52
52
|
var url = '/api/v2.1/seadoc/publish-revision/' + docUuid + '/';
|
|
53
|
-
|
|
53
|
+
var form = new FormData();
|
|
54
|
+
form.append('replace', replace);
|
|
55
|
+
return this._sendPostRequest(url, form);
|
|
54
56
|
}
|
|
55
57
|
}, {
|
|
56
58
|
key: "startRevise",
|
|
@@ -63,9 +65,9 @@ var SeafileAPI = /*#__PURE__*/function () {
|
|
|
63
65
|
return this._sendPostRequest(url, form);
|
|
64
66
|
}
|
|
65
67
|
}, {
|
|
66
|
-
key: "
|
|
67
|
-
value: function
|
|
68
|
-
var url = '/api/v2.1/seadoc/
|
|
68
|
+
key: "getSeadocOriginFileDownloadLink",
|
|
69
|
+
value: function getSeadocOriginFileDownloadLink(docUuid) {
|
|
70
|
+
var url = '/api/v2.1/seadoc/origin-file-download-link/' + docUuid + '/';
|
|
69
71
|
return this.req.get(url);
|
|
70
72
|
}
|
|
71
73
|
}, {
|
|
@@ -81,6 +83,26 @@ var SeafileAPI = /*#__PURE__*/function () {
|
|
|
81
83
|
var url = 'api/v2.1/seadoc/revisions/' + docUuid + '/?page=' + page + '&per_page=' + perPage;
|
|
82
84
|
return this.req.get(url);
|
|
83
85
|
}
|
|
86
|
+
}, {
|
|
87
|
+
key: "deleteSdocRevision",
|
|
88
|
+
value: function deleteSdocRevision(docUuid) {
|
|
89
|
+
var url = 'api/v2.1/seadoc/revision/' + docUuid + '/';
|
|
90
|
+
return this.req.delete(url);
|
|
91
|
+
}
|
|
92
|
+
}, {
|
|
93
|
+
key: "updateSdocRevision",
|
|
94
|
+
value: function updateSdocRevision(docUuid) {
|
|
95
|
+
var url = 'api/v2.1/seadoc/revision/' + docUuid + '/';
|
|
96
|
+
return this.req.put(url);
|
|
97
|
+
}
|
|
98
|
+
}, {
|
|
99
|
+
key: "getFileHistoryVersion",
|
|
100
|
+
value: function getFileHistoryVersion(docUuid, fileVersion, docPath) {
|
|
101
|
+
var url = 'api/v2.1/seadoc/history-content/' + docUuid + '/?p=' + encodeURIComponent(docPath) + '&file_version=' + fileVersion;
|
|
102
|
+
return this.req.get(url);
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
// local files
|
|
84
106
|
}, {
|
|
85
107
|
key: "getSdocFiles",
|
|
86
108
|
value: function getSdocFiles(docUuid, p) {
|
|
@@ -106,17 +106,22 @@ var CommentItem = function CommentItem(_ref) {
|
|
|
106
106
|
}, /*#__PURE__*/React.createElement("i", {
|
|
107
107
|
className: "sdocfont sdoc-more-options"
|
|
108
108
|
})), /*#__PURE__*/React.createElement(DropdownMenu, {
|
|
109
|
+
className: "sdoc-dropdown-menu",
|
|
109
110
|
container: container
|
|
110
111
|
}, /*#__PURE__*/React.createElement(DropdownItem, {
|
|
112
|
+
className: "sdoc-dropdown-menu-item",
|
|
111
113
|
tag: "div",
|
|
112
114
|
onClick: onEditToggle
|
|
113
115
|
}, t('Edit')), /*#__PURE__*/React.createElement(DropdownItem, {
|
|
116
|
+
className: "sdoc-dropdown-menu-item",
|
|
114
117
|
tag: "div",
|
|
115
118
|
onClick: onDeleteToggle
|
|
116
119
|
}, t('Delete')), !comment.resolved && /*#__PURE__*/React.createElement(DropdownItem, {
|
|
120
|
+
className: "sdoc-dropdown-menu-item",
|
|
117
121
|
tag: "div",
|
|
118
122
|
onClick: markAsResolved
|
|
119
123
|
}, t('Mark_as_Resolved')), comment.resolved && /*#__PURE__*/React.createElement(DropdownItem, {
|
|
124
|
+
className: "sdoc-dropdown-menu-item",
|
|
120
125
|
tag: "div",
|
|
121
126
|
onClick: resubmit
|
|
122
127
|
}, t('Resubmit')))))), /*#__PURE__*/React.createElement("div", {
|
|
@@ -77,11 +77,14 @@ var CommentItemReply = function CommentItemReply(_ref) {
|
|
|
77
77
|
}, /*#__PURE__*/React.createElement("i", {
|
|
78
78
|
className: "sdocfont sdoc-more-options"
|
|
79
79
|
})), /*#__PURE__*/React.createElement(DropdownMenu, {
|
|
80
|
+
className: "sdoc-dropdown-menu",
|
|
80
81
|
container: container
|
|
81
82
|
}, /*#__PURE__*/React.createElement(DropdownItem, {
|
|
83
|
+
className: "sdoc-dropdown-menu-item",
|
|
82
84
|
tag: "div",
|
|
83
85
|
onClick: onEditToggle
|
|
84
86
|
}, t('Edit')), /*#__PURE__*/React.createElement(DropdownItem, {
|
|
87
|
+
className: "sdoc-dropdown-menu-item",
|
|
85
88
|
tag: "div",
|
|
86
89
|
onClick: onDeleteToggle
|
|
87
90
|
}, t('Delete')))))), /*#__PURE__*/React.createElement("div", {
|
|
@@ -42,19 +42,22 @@ function GlobalCommentHeader(_ref) {
|
|
|
42
42
|
}, /*#__PURE__*/React.createElement("div", {
|
|
43
43
|
id: id
|
|
44
44
|
}, t(commentType))), /*#__PURE__*/React.createElement(DropdownMenu, {
|
|
45
|
-
|
|
46
|
-
|
|
45
|
+
className: "sdoc-dropdown-menu",
|
|
46
|
+
container: "comment-types"
|
|
47
47
|
}, /*#__PURE__*/React.createElement(DropdownItem, {
|
|
48
|
+
className: "sdoc-dropdown-menu-item",
|
|
48
49
|
tag: 'div',
|
|
49
50
|
onClick: function onClick() {
|
|
50
51
|
return onCommentTypeChanged(COMMENT_TYPES.all);
|
|
51
52
|
}
|
|
52
53
|
}, t(COMMENT_TYPES.all)), /*#__PURE__*/React.createElement(DropdownItem, {
|
|
54
|
+
className: "sdoc-dropdown-menu-item",
|
|
53
55
|
tag: 'div',
|
|
54
56
|
onClick: function onClick() {
|
|
55
57
|
return onCommentTypeChanged(COMMENT_TYPES.resolved);
|
|
56
58
|
}
|
|
57
59
|
}, t(COMMENT_TYPES.resolved)), /*#__PURE__*/React.createElement(DropdownItem, {
|
|
60
|
+
className: "sdoc-dropdown-menu-item",
|
|
58
61
|
tag: 'div',
|
|
59
62
|
onClick: function onClick() {
|
|
60
63
|
return onCommentTypeChanged(COMMENT_TYPES.unresolved);
|
|
@@ -67,7 +67,7 @@ var GlobalComment = function GlobalComment(_ref) {
|
|
|
67
67
|
return setShowCommentList(false);
|
|
68
68
|
}
|
|
69
69
|
}, /*#__PURE__*/React.createElement("i", {
|
|
70
|
-
className: "sdocfont sdoc-close"
|
|
70
|
+
className: "sdocfont sdoc-sm-close"
|
|
71
71
|
}))), /*#__PURE__*/React.createElement("div", {
|
|
72
72
|
className: "comments-panel-body"
|
|
73
73
|
}, /*#__PURE__*/React.createElement(GlobalCommentHeader, {
|
|
@@ -73,17 +73,17 @@
|
|
|
73
73
|
font-weight: 500;
|
|
74
74
|
}
|
|
75
75
|
|
|
76
|
-
.global-comments-popover .comments-panel-header .sdoc-close {
|
|
76
|
+
.global-comments-popover .comments-panel-header .sdoc-sm-close {
|
|
77
77
|
display: flex;
|
|
78
78
|
align-items: center;
|
|
79
79
|
justify-content: center;
|
|
80
|
-
font-size:
|
|
80
|
+
font-size: 16px;
|
|
81
81
|
font-weight: 700;
|
|
82
82
|
color: #999;
|
|
83
83
|
cursor: pointer;
|
|
84
84
|
}
|
|
85
85
|
|
|
86
|
-
.global-comments-popover .comments-panel-header .sdoc-close:hover {
|
|
86
|
+
.global-comments-popover .comments-panel-header .sdoc-sm-close:hover {
|
|
87
87
|
color: #5a5a5a;
|
|
88
88
|
}
|
|
89
89
|
|
|
@@ -145,6 +145,7 @@
|
|
|
145
145
|
background: #f5f5f5;
|
|
146
146
|
}
|
|
147
147
|
|
|
148
|
-
.sdoc-
|
|
149
|
-
font-size:
|
|
148
|
+
.sdoc-dropdown-menu .dropdown-item {
|
|
149
|
+
font-size: 14px;
|
|
150
|
+
color: #212529;
|
|
150
151
|
}
|
|
@@ -5,4 +5,23 @@ export var INTERNAL_EVENT = {
|
|
|
5
5
|
ON_MOUSE_ENTER_BLOCK: 'on_mouse_enter_block',
|
|
6
6
|
INSERT_ELEMENT: 'insert_element'
|
|
7
7
|
};
|
|
8
|
-
export var PAGE_EDIT_AREA_WIDTH = 672; // 672 = 794 - 2[borderLeft + borderRight] - 120[paddingLeft + paddingRight]
|
|
8
|
+
export var PAGE_EDIT_AREA_WIDTH = 672; // 672 = 794 - 2[borderLeft + borderRight] - 120[paddingLeft + paddingRight]
|
|
9
|
+
|
|
10
|
+
export var MODIFY_TYPE = {
|
|
11
|
+
ADD: 'add',
|
|
12
|
+
DELETE: 'delete',
|
|
13
|
+
MODIFY: 'modify',
|
|
14
|
+
CHILDREN_MODIFY: 'children-modify'
|
|
15
|
+
};
|
|
16
|
+
export var REBASE_TYPE = {
|
|
17
|
+
MODIFY_MODIFY: 'modify-modify',
|
|
18
|
+
DELETE_MODIFY: 'delete-modify',
|
|
19
|
+
CHILDREN_MODIFY: 'children-modify'
|
|
20
|
+
};
|
|
21
|
+
export var REBASE_MARK_KEY = {
|
|
22
|
+
ORIGIN: 'origin',
|
|
23
|
+
REBASE_TYPE: 'rebase_type',
|
|
24
|
+
MODIFY_TYPE: 'modify_type',
|
|
25
|
+
OLD_ELEMENT: 'old_element'
|
|
26
|
+
};
|
|
27
|
+
export var REBASE_MARKS = ['origin', 'rebase_type', 'old_element'];
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
2
|
+
import React, { useEffect } from 'react';
|
|
3
|
+
import { Editor } from '@seafile/slate';
|
|
4
|
+
import { focusEditor } from '../extension/core';
|
|
5
|
+
import { EditorContainer, EditorContent } from '../layout';
|
|
6
|
+
import SlateEditor from './slate-editor';
|
|
7
|
+
import InsertElementDialog from '../extension/commons/insert-element-dialog';
|
|
8
|
+
var CommonEditor = function CommonEditor(_ref) {
|
|
9
|
+
var slateValue = _ref.slateValue,
|
|
10
|
+
updateSlateValue = _ref.updateSlateValue,
|
|
11
|
+
editor = _ref.editor,
|
|
12
|
+
renderElement = _ref.renderElement;
|
|
13
|
+
// useMount: focus editor
|
|
14
|
+
useEffect(function () {
|
|
15
|
+
var timer = setTimeout(function () {
|
|
16
|
+
var _editor$children = _slicedToArray(editor.children, 1),
|
|
17
|
+
firstNode = _editor$children[0];
|
|
18
|
+
if (firstNode) {
|
|
19
|
+
var _firstNode$children = _slicedToArray(firstNode.children, 1),
|
|
20
|
+
firstNodeFirstChild = _firstNode$children[0];
|
|
21
|
+
if (firstNodeFirstChild) {
|
|
22
|
+
var endOfFirstNode = Editor.end(editor, [0, 0]);
|
|
23
|
+
var range = {
|
|
24
|
+
anchor: endOfFirstNode,
|
|
25
|
+
focus: endOfFirstNode
|
|
26
|
+
};
|
|
27
|
+
focusEditor(editor, range);
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
}, 300);
|
|
31
|
+
return function () {
|
|
32
|
+
clearTimeout(timer);
|
|
33
|
+
};
|
|
34
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
35
|
+
}, []);
|
|
36
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(EditorContainer, {
|
|
37
|
+
editor: editor
|
|
38
|
+
}, /*#__PURE__*/React.createElement(EditorContent, {
|
|
39
|
+
docValue: slateValue,
|
|
40
|
+
showOutline: true
|
|
41
|
+
}, /*#__PURE__*/React.createElement(SlateEditor, {
|
|
42
|
+
editor: editor,
|
|
43
|
+
slateValue: slateValue,
|
|
44
|
+
setSlateValue: updateSlateValue,
|
|
45
|
+
renderElement: renderElement
|
|
46
|
+
}))), /*#__PURE__*/React.createElement(InsertElementDialog, {
|
|
47
|
+
editor: editor
|
|
48
|
+
}));
|
|
49
|
+
};
|
|
50
|
+
export default CommonEditor;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
.sdoc-rebase-btn-group {
|
|
2
|
+
color: #aaa;
|
|
3
|
+
}
|
|
4
|
+
|
|
5
|
+
.sdoc-rebase-btn-group .sdoc-rebase-btn {
|
|
6
|
+
cursor: pointer;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
.sdoc-rebase-current-changes-start {
|
|
10
|
+
background-color: rgb(202, 232, 254);
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
.sdoc-rebase-current-changes {
|
|
14
|
+
background-color: rgba(202, 232, 254, .8);
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.sdoc-rebase-incoming-changes {
|
|
18
|
+
background-color: rgb(222, 232, 254);
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
.sdoc-rebase-incoming-changes > *:first-child,
|
|
22
|
+
.sdoc-rebase-current-changes > *:first-child {
|
|
23
|
+
margin: 0;
|
|
24
|
+
padding: 0.8em 0 0.8em 0.2em;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
.sdoc-rebase-incoming-changes-end {
|
|
28
|
+
background-color: rgb(212, 212, 254);
|
|
29
|
+
}
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
2
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
3
|
+
import React, { useMemo, useEffect, useState, useCallback, useImperativeHandle, forwardRef } from 'react';
|
|
4
|
+
import deepCopy from 'deep-copy';
|
|
5
|
+
import { createDefaultEditor, renderElement } from '../extension';
|
|
6
|
+
import { withSocketIO } from '../socket';
|
|
7
|
+
import withNodeId from '../node-id';
|
|
8
|
+
import { PAGE_EDIT_AREA_WIDTH } from '../constants';
|
|
9
|
+
import { MODE } from '../../constants';
|
|
10
|
+
import DiffViewer from '../views/diff-viewer';
|
|
11
|
+
import SDocEditor from './common-editor';
|
|
12
|
+
import CommonLoading from '../../components/common-loading';
|
|
13
|
+
import context from '../../context';
|
|
14
|
+
import './index.css';
|
|
15
|
+
var Editor = forwardRef(function (_ref, ref) {
|
|
16
|
+
var mode = _ref.mode,
|
|
17
|
+
document = _ref.document,
|
|
18
|
+
setDiffChanges = _ref.setDiffChanges;
|
|
19
|
+
var editor = useMemo(function () {
|
|
20
|
+
var defaultEditor = createDefaultEditor();
|
|
21
|
+
var editorConfig = context.getEditorConfig();
|
|
22
|
+
defaultEditor.mode = MODE.EDITOR;
|
|
23
|
+
var newEditor = withNodeId(withSocketIO(defaultEditor, {
|
|
24
|
+
document: document,
|
|
25
|
+
config: editorConfig
|
|
26
|
+
}));
|
|
27
|
+
var cursors = document.cursors;
|
|
28
|
+
newEditor.cursors = cursors || {};
|
|
29
|
+
newEditor.width = PAGE_EDIT_AREA_WIDTH; // default width
|
|
30
|
+
return newEditor;
|
|
31
|
+
|
|
32
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
33
|
+
}, []);
|
|
34
|
+
var _useState = useState(document.children),
|
|
35
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
36
|
+
slateValue = _useState2[0],
|
|
37
|
+
_setSlateValue = _useState2[1];
|
|
38
|
+
var _useState3 = useState(false),
|
|
39
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
40
|
+
isLoading = _useState4[0],
|
|
41
|
+
_setLoading = _useState4[1];
|
|
42
|
+
var _useState5 = useState(null),
|
|
43
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
44
|
+
diffContent = _useState6[0],
|
|
45
|
+
_setDiffContent = _useState6[1];
|
|
46
|
+
var _useState7 = useState(null),
|
|
47
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
48
|
+
currentContent = _useState8[0],
|
|
49
|
+
setCurrentContent = _useState8[1];
|
|
50
|
+
|
|
51
|
+
// useMount: init socket connection
|
|
52
|
+
useEffect(function () {
|
|
53
|
+
editor.openConnection();
|
|
54
|
+
return function () {
|
|
55
|
+
editor.closeConnection();
|
|
56
|
+
};
|
|
57
|
+
|
|
58
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
59
|
+
}, []);
|
|
60
|
+
var updateSlateValue = useCallback(function (value) {
|
|
61
|
+
_setSlateValue(value);
|
|
62
|
+
|
|
63
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
64
|
+
}, []);
|
|
65
|
+
|
|
66
|
+
// The parent component can call the method of this component through ref
|
|
67
|
+
useImperativeHandle(ref, function () {
|
|
68
|
+
return {
|
|
69
|
+
// set value
|
|
70
|
+
setLoading: function setLoading(isLoading) {
|
|
71
|
+
_setLoading(isLoading);
|
|
72
|
+
},
|
|
73
|
+
setDiffContent: function setDiffContent(content) {
|
|
74
|
+
setCurrentContent(deepCopy(_objectSpread(_objectSpread({}, document), {}, {
|
|
75
|
+
children: slateValue
|
|
76
|
+
})));
|
|
77
|
+
_setDiffContent(content);
|
|
78
|
+
},
|
|
79
|
+
setEditorMode: function setEditorMode(mode) {
|
|
80
|
+
editor.cursors = {};
|
|
81
|
+
editor.selection = null;
|
|
82
|
+
if (mode === MODE.EDITOR) {
|
|
83
|
+
editor.operations = [];
|
|
84
|
+
}
|
|
85
|
+
editor.mode = mode;
|
|
86
|
+
},
|
|
87
|
+
setSlateValue: function setSlateValue(document) {
|
|
88
|
+
_setSlateValue(document.children);
|
|
89
|
+
},
|
|
90
|
+
// get value
|
|
91
|
+
getSlateValue: function getSlateValue() {
|
|
92
|
+
return deepCopy(_objectSpread(_objectSpread({}, document), {}, {
|
|
93
|
+
children: slateValue
|
|
94
|
+
}));
|
|
95
|
+
},
|
|
96
|
+
// send message
|
|
97
|
+
publishDocument: function publishDocument(originDocUuid, originDocName, isNeedUpdateOriginDoc) {
|
|
98
|
+
editor.publishDocument(originDocUuid, originDocName, isNeedUpdateOriginDoc);
|
|
99
|
+
},
|
|
100
|
+
replaceDocument: function replaceDocument(value, originFileVersion) {
|
|
101
|
+
editor.replaceDocument(value, originFileVersion);
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
105
|
+
};
|
|
106
|
+
}, [document, editor, slateValue]);
|
|
107
|
+
if (isLoading) {
|
|
108
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
109
|
+
className: "h-100 w-100 d-flex align-items-center justify-content-center"
|
|
110
|
+
}, /*#__PURE__*/React.createElement(CommonLoading, null));
|
|
111
|
+
}
|
|
112
|
+
if (mode === MODE.DIFF_VIEWER) {
|
|
113
|
+
return /*#__PURE__*/React.createElement(DiffViewer, {
|
|
114
|
+
showToolbar: true,
|
|
115
|
+
showOutline: true,
|
|
116
|
+
editor: editor,
|
|
117
|
+
currentContent: currentContent,
|
|
118
|
+
lastContent: diffContent,
|
|
119
|
+
didMountCallback: setDiffChanges
|
|
120
|
+
});
|
|
121
|
+
}
|
|
122
|
+
return /*#__PURE__*/React.createElement(SDocEditor, {
|
|
123
|
+
slateValue: slateValue,
|
|
124
|
+
editor: editor,
|
|
125
|
+
updateSlateValue: updateSlateValue,
|
|
126
|
+
renderElement: renderElement
|
|
127
|
+
});
|
|
128
|
+
});
|
|
129
|
+
export default Editor;
|
|
@@ -1,22 +1,24 @@
|
|
|
1
1
|
import React, { useCallback, useMemo, Fragment } from 'react';
|
|
2
2
|
import { Editable, ReactEditor, Slate } from '@seafile/slate-react';
|
|
3
|
-
import { renderLeaf, renderElement, ContextToolbar, SideToolbar } from '
|
|
4
|
-
import { getAboveBlockNode, getNextNode, getPrevNode, isSelectionAtBlockEnd, isSelectionAtBlockStart } from '
|
|
5
|
-
import EventProxy from '
|
|
6
|
-
import { useCursors } from '
|
|
7
|
-
import { INTERNAL_EVENT } from '
|
|
8
|
-
import { SetNodeToDecorations } from '
|
|
9
|
-
import CommentContextProvider from '
|
|
10
|
-
import CommentWrapper from '
|
|
11
|
-
import { usePipDecorate } from '
|
|
12
|
-
import { getCursorPosition, getDomHeight, getDomMarginTop } from '
|
|
13
|
-
import EventBus from '
|
|
14
|
-
import { ArticleContainer } from '
|
|
15
|
-
import { useScrollContext } from '
|
|
3
|
+
import { renderLeaf, renderElement, ContextToolbar, SideToolbar } from '../extension';
|
|
4
|
+
import { getAboveBlockNode, getNextNode, getPrevNode, isSelectionAtBlockEnd, isSelectionAtBlockStart } from '../extension/core';
|
|
5
|
+
import EventProxy from '../utils/event-handler';
|
|
6
|
+
import { useCursors } from '../cursor/use-cursors';
|
|
7
|
+
import { INTERNAL_EVENT } from '../constants';
|
|
8
|
+
import { SetNodeToDecorations } from '../highlight-decorate/setNodeToDecorations';
|
|
9
|
+
import CommentContextProvider from '../comment/comment-context-provider';
|
|
10
|
+
import CommentWrapper from '../comment';
|
|
11
|
+
import { usePipDecorate } from '../decorates';
|
|
12
|
+
import { getCursorPosition, getDomHeight, getDomMarginTop } from '../utils/dom-utils';
|
|
13
|
+
import EventBus from '../utils/event-bus';
|
|
14
|
+
import { ArticleContainer } from '../layout';
|
|
15
|
+
import { useScrollContext } from '../hooks/use-scroll-context';
|
|
16
16
|
var SlateEditor = function SlateEditor(_ref) {
|
|
17
17
|
var editor = _ref.editor,
|
|
18
18
|
setSlateValue = _ref.setSlateValue,
|
|
19
|
-
slateValue = _ref.slateValue
|
|
19
|
+
slateValue = _ref.slateValue,
|
|
20
|
+
customRenderElement = _ref.renderElement,
|
|
21
|
+
isShowComment = _ref.isShowComment;
|
|
20
22
|
var _useCursors = useCursors(editor),
|
|
21
23
|
cursors = _useCursors.cursors;
|
|
22
24
|
var decorate = usePipDecorate(editor);
|
|
@@ -138,12 +140,15 @@ var SlateEditor = function SlateEditor(_ref) {
|
|
|
138
140
|
editor: editor
|
|
139
141
|
}, /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(ContextToolbar, null), /*#__PURE__*/React.createElement(SetNodeToDecorations, null), /*#__PURE__*/React.createElement(Editable, {
|
|
140
142
|
cursors: cursors,
|
|
141
|
-
renderElement: renderElement,
|
|
143
|
+
renderElement: customRenderElement || renderElement,
|
|
142
144
|
renderLeaf: renderLeaf,
|
|
143
145
|
onKeyDown: onKeyDown,
|
|
144
146
|
onMouseDown: onMouseDown,
|
|
145
147
|
decorate: decorate,
|
|
146
148
|
onCut: eventProxy.onCut
|
|
147
|
-
})), /*#__PURE__*/React.createElement(SideToolbar, null), /*#__PURE__*/React.createElement(CommentContextProvider, null, /*#__PURE__*/React.createElement(CommentWrapper, null))));
|
|
149
|
+
})), /*#__PURE__*/React.createElement(SideToolbar, null), isShowComment && /*#__PURE__*/React.createElement(CommentContextProvider, null, /*#__PURE__*/React.createElement(CommentWrapper, null))));
|
|
150
|
+
};
|
|
151
|
+
SlateEditor.defaultProps = {
|
|
152
|
+
isShowComment: true
|
|
148
153
|
};
|
|
149
154
|
export default SlateEditor;
|
|
@@ -46,4 +46,7 @@ export var SDOC_LINK = 'sdoc-link';
|
|
|
46
46
|
// font
|
|
47
47
|
export var FONT_SIZE = 'font-size';
|
|
48
48
|
export var FONT_SIZE_INCREASE = 'font-size-increase';
|
|
49
|
-
export var FONT_SIZE_REDUCE = 'font-size-reduce';
|
|
49
|
+
export var FONT_SIZE_REDUCE = 'font-size-reduce';
|
|
50
|
+
|
|
51
|
+
// rebase
|
|
52
|
+
export var REBASE_ELEMENT = 'rebase-element';
|
|
@@ -12,4 +12,30 @@ export var replaceNodeChildren = function replaceNodeChildren(editor, _ref) {
|
|
|
12
12
|
at: at.concat([0])
|
|
13
13
|
}));
|
|
14
14
|
});
|
|
15
|
+
};
|
|
16
|
+
export var replaceNode = function replaceNode(editor) {
|
|
17
|
+
var _ref2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
|
|
18
|
+
at = _ref2.at,
|
|
19
|
+
nodes = _ref2.nodes,
|
|
20
|
+
insertOptions = _ref2.insertOptions,
|
|
21
|
+
removeOptions = _ref2.removeOptions;
|
|
22
|
+
Editor.withoutNormalizing(editor, function () {
|
|
23
|
+
Transforms.removeNodes(editor, _objectSpread({
|
|
24
|
+
at: at
|
|
25
|
+
}, removeOptions));
|
|
26
|
+
Transforms.insertNodes(editor, nodes, _objectSpread(_objectSpread({}, insertOptions), {}, {
|
|
27
|
+
at: at
|
|
28
|
+
}));
|
|
29
|
+
});
|
|
30
|
+
};
|
|
31
|
+
export var deleteNodeMark = function deleteNodeMark(editor, path, element) {
|
|
32
|
+
var marks = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : [];
|
|
33
|
+
var newElement = _objectSpread({}, element);
|
|
34
|
+
marks.forEach(function (markItem) {
|
|
35
|
+
newElement[markItem] && delete newElement[markItem];
|
|
36
|
+
});
|
|
37
|
+
replaceNode(editor, {
|
|
38
|
+
at: path,
|
|
39
|
+
nodes: newElement
|
|
40
|
+
});
|
|
15
41
|
};
|