@seafile/sdoc-editor 0.1.148-beta → 0.1.149
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 +0 -10
- package/dist/api/seafile-api.js +5 -27
- 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 +1 -14
- package/dist/basic-sdk/editor.js +105 -0
- package/dist/basic-sdk/extension/constants/element-type.js +1 -4
- package/dist/basic-sdk/extension/core/transforms/replace-node-children.js +0 -26
- package/dist/basic-sdk/extension/render/render-element.js +1 -209
- package/dist/basic-sdk/{editor/slate-editor.js → slate-editor.js} +16 -21
- package/dist/basic-sdk/socket/helpers.js +0 -2
- package/dist/basic-sdk/socket/socket-client.js +0 -38
- package/dist/basic-sdk/socket/socket-manager.js +2 -25
- package/dist/basic-sdk/socket/with-socket-io.js +12 -35
- package/dist/basic-sdk/utils/diff.js +2 -2
- package/dist/basic-sdk/views/diff-viewer.js +1 -3
- package/dist/basic-sdk/views/viewer.js +11 -8
- package/dist/components/doc-operations/index.js +2 -4
- package/dist/components/doc-operations/revision-operations/index.js +2 -5
- package/dist/components/doc-operations/revision-operations/publish-button.js +13 -6
- package/dist/constants/index.js +2 -23
- package/dist/context.js +4 -35
- package/dist/pages/simple-editor.js +83 -247
- package/package.json +1 -1
- package/public/locales/en/sdoc-editor.json +1 -11
- package/public/locales/zh_CN/sdoc-editor.json +1 -10
- 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/common-editor.js +0 -50
- package/dist/basic-sdk/editor/index.css +0 -29
- package/dist/basic-sdk/editor/index.js +0 -129
- package/dist/basic-sdk/utils/rebase.js +0 -197
- package/dist/components/tip-dialog/index.css +0 -0
- package/dist/components/tip-dialog/index.js +0 -49
- package/dist/components/tip-dialog/tip-content.js +0 -56
|
@@ -58,16 +58,6 @@ 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
|
-
// }
|
|
71
61
|
}, {
|
|
72
62
|
key: "getCollaborators",
|
|
73
63
|
value: function getCollaborators() {
|
package/dist/api/seafile-api.js
CHANGED
|
@@ -48,11 +48,9 @@ var SeafileAPI = /*#__PURE__*/function () {
|
|
|
48
48
|
}
|
|
49
49
|
}, {
|
|
50
50
|
key: "sdocPublishRevision",
|
|
51
|
-
value: function sdocPublishRevision(docUuid
|
|
51
|
+
value: function sdocPublishRevision(docUuid) {
|
|
52
52
|
var url = '/api/v2.1/seadoc/publish-revision/' + docUuid + '/';
|
|
53
|
-
|
|
54
|
-
form.append('replace', replace);
|
|
55
|
-
return this._sendPostRequest(url, form);
|
|
53
|
+
return this.req.post(url);
|
|
56
54
|
}
|
|
57
55
|
}, {
|
|
58
56
|
key: "startRevise",
|
|
@@ -65,9 +63,9 @@ var SeafileAPI = /*#__PURE__*/function () {
|
|
|
65
63
|
return this._sendPostRequest(url, form);
|
|
66
64
|
}
|
|
67
65
|
}, {
|
|
68
|
-
key: "
|
|
69
|
-
value: function
|
|
70
|
-
var url = '/api/v2.1/seadoc/
|
|
66
|
+
key: "getSeadocRevisionDownloadLinks",
|
|
67
|
+
value: function getSeadocRevisionDownloadLinks(docUuid) {
|
|
68
|
+
var url = '/api/v2.1/seadoc/revision/download-links/' + docUuid + '/';
|
|
71
69
|
return this.req.get(url);
|
|
72
70
|
}
|
|
73
71
|
}, {
|
|
@@ -83,26 +81,6 @@ var SeafileAPI = /*#__PURE__*/function () {
|
|
|
83
81
|
var url = 'api/v2.1/seadoc/revisions/' + docUuid + '/?page=' + page + '&per_page=' + perPage;
|
|
84
82
|
return this.req.get(url);
|
|
85
83
|
}
|
|
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
|
|
106
84
|
}, {
|
|
107
85
|
key: "getSdocFiles",
|
|
108
86
|
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,17 +5,4 @@ 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]
|
|
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_MARKS = ['origin', 'rebaseType', 'oldElement'];
|
|
8
|
+
export var PAGE_EDIT_AREA_WIDTH = 672; // 672 = 794 - 2[borderLeft + borderRight] - 120[paddingLeft + paddingRight]
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
2
|
+
import React, { useEffect, useMemo, useState, forwardRef, useImperativeHandle } from 'react';
|
|
3
|
+
import { Editor } from '@seafile/slate';
|
|
4
|
+
import { useTranslation } from 'react-i18next';
|
|
5
|
+
import { createDefaultEditor } from './extension';
|
|
6
|
+
import { focusEditor } from './extension/core';
|
|
7
|
+
import { withSocketIO } from './socket';
|
|
8
|
+
import withNodeId from './node-id';
|
|
9
|
+
import { PAGE_EDIT_AREA_WIDTH } from './constants';
|
|
10
|
+
import context from '../context';
|
|
11
|
+
import { EditorContainer, EditorContent } from './layout';
|
|
12
|
+
import SlateEditor from './slate-editor';
|
|
13
|
+
import InsertElementDialog from './extension/commons/insert-element-dialog';
|
|
14
|
+
var SDocEditor = forwardRef(function (_ref, ref) {
|
|
15
|
+
var document = _ref.document,
|
|
16
|
+
config = _ref.config;
|
|
17
|
+
var _useTranslation = useTranslation(),
|
|
18
|
+
t = _useTranslation.t;
|
|
19
|
+
|
|
20
|
+
// init editor
|
|
21
|
+
var editor = useMemo(function () {
|
|
22
|
+
var defaultEditor = createDefaultEditor();
|
|
23
|
+
var newEditor = withNodeId(withSocketIO(defaultEditor, {
|
|
24
|
+
document: document,
|
|
25
|
+
config: config
|
|
26
|
+
}));
|
|
27
|
+
var cursors = document.cursors;
|
|
28
|
+
newEditor.cursors = cursors || {};
|
|
29
|
+
newEditor.width = PAGE_EDIT_AREA_WIDTH; // default width
|
|
30
|
+
newEditor.readonly = false;
|
|
31
|
+
return newEditor;
|
|
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
|
+
|
|
39
|
+
// The parent component can call the method of this component through ref
|
|
40
|
+
useImperativeHandle(ref, function () {
|
|
41
|
+
return {
|
|
42
|
+
// get latest value
|
|
43
|
+
getValue: function getValue() {
|
|
44
|
+
return slateValue;
|
|
45
|
+
}
|
|
46
|
+
};
|
|
47
|
+
}, [slateValue]);
|
|
48
|
+
|
|
49
|
+
// useMount: init socket connection
|
|
50
|
+
useEffect(function () {
|
|
51
|
+
editor.openConnection();
|
|
52
|
+
return function () {
|
|
53
|
+
editor.closeConnection();
|
|
54
|
+
};
|
|
55
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
56
|
+
}, []);
|
|
57
|
+
|
|
58
|
+
// useMount: focus editor
|
|
59
|
+
useEffect(function () {
|
|
60
|
+
var timer = setTimeout(function () {
|
|
61
|
+
var _editor$children = _slicedToArray(editor.children, 1),
|
|
62
|
+
firstNode = _editor$children[0];
|
|
63
|
+
if (firstNode) {
|
|
64
|
+
var _firstNode$children = _slicedToArray(firstNode.children, 1),
|
|
65
|
+
firstNodeFirstChild = _firstNode$children[0];
|
|
66
|
+
if (firstNodeFirstChild) {
|
|
67
|
+
var endOfFirstNode = Editor.end(editor, [0, 0]);
|
|
68
|
+
var range = {
|
|
69
|
+
anchor: endOfFirstNode,
|
|
70
|
+
focus: endOfFirstNode
|
|
71
|
+
};
|
|
72
|
+
focusEditor(editor, range);
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
}, 300);
|
|
76
|
+
return function () {
|
|
77
|
+
clearTimeout(timer);
|
|
78
|
+
};
|
|
79
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
80
|
+
}, []);
|
|
81
|
+
|
|
82
|
+
// useMount: reset title
|
|
83
|
+
useEffect(function () {
|
|
84
|
+
var isSdocRevision = context.getSetting('isSdocRevision');
|
|
85
|
+
var originFilename = context.getSetting('originFilename');
|
|
86
|
+
if (isSdocRevision) {
|
|
87
|
+
window.document.getElementsByTagName('title')[0].innerText = "".concat(t('Revision'), " - ").concat(originFilename);
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
91
|
+
}, []);
|
|
92
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(EditorContainer, {
|
|
93
|
+
editor: editor
|
|
94
|
+
}, /*#__PURE__*/React.createElement(EditorContent, {
|
|
95
|
+
docValue: slateValue,
|
|
96
|
+
showOutline: true
|
|
97
|
+
}, /*#__PURE__*/React.createElement(SlateEditor, {
|
|
98
|
+
editor: editor,
|
|
99
|
+
slateValue: slateValue,
|
|
100
|
+
setSlateValue: setSlateValue
|
|
101
|
+
}))), /*#__PURE__*/React.createElement(InsertElementDialog, {
|
|
102
|
+
editor: editor
|
|
103
|
+
}));
|
|
104
|
+
});
|
|
105
|
+
export default SDocEditor;
|
|
@@ -46,7 +46,4 @@ 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';
|
|
50
|
-
|
|
51
|
-
// rebase
|
|
52
|
-
export var REBASE_ELEMENT = 'rebase-element';
|
|
49
|
+
export var FONT_SIZE_REDUCE = 'font-size-reduce';
|
|
@@ -12,30 +12,4 @@ 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
|
-
});
|
|
41
15
|
};
|
|
@@ -1,16 +1,10 @@
|
|
|
1
|
-
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
|
|
2
|
-
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
3
1
|
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
4
2
|
import React, { useCallback } from 'react';
|
|
5
3
|
import { useSlateStatic } from '@seafile/slate-react';
|
|
6
|
-
import { Transforms } from '@seafile/slate';
|
|
7
|
-
import deepCopy from 'deep-copy';
|
|
8
|
-
import { useTranslation } from 'react-i18next';
|
|
9
4
|
import { BLOCKQUOTE, LINK, CHECK_LIST_ITEM, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, LIST_ITEM, LIST_LIC, ORDERED_LIST, PARAGRAPH, UNORDERED_LIST, CODE_BLOCK, CODE_LINE, IMAGE, ELEMENT_TYPE, SDOC_LINK, TITLE, SUBTITLE } from '../constants';
|
|
10
5
|
import { BlockquotePlugin, LinkPlugin, CheckListPlugin, HeaderPlugin, ListPlugin, CodeBlockPlugin, ImagePlugin, TablePlugin, SdocLinkPlugin, ParagraphPlugin } from '../plugins';
|
|
11
6
|
import EventBus from '../../utils/event-bus';
|
|
12
|
-
import { INTERNAL_EVENT
|
|
13
|
-
import { findPath, getNode, replaceNode, generateEmptyElement, deleteNodeMark } from '../../extension/core';
|
|
7
|
+
import { INTERNAL_EVENT } from '../../constants';
|
|
14
8
|
var CustomElement = function CustomElement(props) {
|
|
15
9
|
var editor = useSlateStatic();
|
|
16
10
|
var element = props.element,
|
|
@@ -146,208 +140,6 @@ var CustomElement = function CustomElement(props) {
|
|
|
146
140
|
}
|
|
147
141
|
};
|
|
148
142
|
var RenderElement = function RenderElement(props) {
|
|
149
|
-
var editor = useSlateStatic();
|
|
150
|
-
var _useTranslation = useTranslation(),
|
|
151
|
-
t = _useTranslation.t;
|
|
152
|
-
var updateParentNodeByPath = useCallback(function (path) {
|
|
153
|
-
var parentPath = path.slice(0, -1);
|
|
154
|
-
var parentNode = getNode(editor, parentPath);
|
|
155
|
-
if (parentNode.children.filter(function (item) {
|
|
156
|
-
return item.rebaseType;
|
|
157
|
-
}).length === 0) {
|
|
158
|
-
var newParentElement = _objectSpread({}, parentNode);
|
|
159
|
-
newParentElement['rebaseType'] && delete newParentElement['rebaseType'];
|
|
160
|
-
newParentElement['oldElement'] && delete newParentElement['oldElement'];
|
|
161
|
-
newParentElement['origin'] && delete newParentElement['origin'];
|
|
162
|
-
newParentElement['children'] = newParentElement['children'].map(function (item) {
|
|
163
|
-
item['rebaseType'] && delete item['rebaseType'];
|
|
164
|
-
item['oldElement'] && delete item['oldElement'];
|
|
165
|
-
item['origin'] && delete item['origin'];
|
|
166
|
-
return item;
|
|
167
|
-
});
|
|
168
|
-
replaceNode(editor, {
|
|
169
|
-
at: parentPath,
|
|
170
|
-
nodes: newParentElement
|
|
171
|
-
});
|
|
172
|
-
}
|
|
173
|
-
|
|
174
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
175
|
-
}, [editor]);
|
|
176
|
-
var deleteElement = useCallback(function (element) {
|
|
177
|
-
var path = findPath(editor, element);
|
|
178
|
-
Transforms.removeNodes(editor, {
|
|
179
|
-
at: path
|
|
180
|
-
});
|
|
181
|
-
if (element.type === ELEMENT_TYPE.LIST_ITEM) {
|
|
182
|
-
updateParentNodeByPath(path);
|
|
183
|
-
}
|
|
184
|
-
|
|
185
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
186
|
-
}, [editor]);
|
|
187
|
-
var deleteMark = useCallback(function (element) {
|
|
188
|
-
var path = findPath(editor, element);
|
|
189
|
-
deleteNodeMark(editor, path, element, REBASE_MARKS);
|
|
190
|
-
if (element.type === ELEMENT_TYPE.LIST_ITEM) {
|
|
191
|
-
updateParentNodeByPath(path);
|
|
192
|
-
}
|
|
193
|
-
|
|
194
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
195
|
-
}, [editor]);
|
|
196
|
-
var addDeletedElement = useCallback(function (element) {
|
|
197
|
-
var path = findPath(editor, element);
|
|
198
|
-
deleteNodeMark(editor, path, element, REBASE_MARKS);
|
|
199
|
-
if (element.type !== ELEMENT_TYPE.LIST_ITEM) {
|
|
200
|
-
var emptyNode = generateEmptyElement(ELEMENT_TYPE.PARAGRAPH);
|
|
201
|
-
Transforms.insertNodes(editor, emptyNode, {
|
|
202
|
-
at: [path[0]]
|
|
203
|
-
});
|
|
204
|
-
} else {
|
|
205
|
-
var _emptyNode = generateEmptyElement(ELEMENT_TYPE.LIST_ITEM);
|
|
206
|
-
_emptyNode.children[0] = generateEmptyElement(ELEMENT_TYPE.LIST_LIC);
|
|
207
|
-
var parentPath = path.slice(0, -1);
|
|
208
|
-
var parentNode = getNode(editor, parentPath);
|
|
209
|
-
var newChildren = _toConsumableArray(parentNode.children);
|
|
210
|
-
var index = path[path.length - 1];
|
|
211
|
-
newChildren.splice(index, 0, _emptyNode);
|
|
212
|
-
replaceNode(editor, {
|
|
213
|
-
at: parentPath,
|
|
214
|
-
nodes: _objectSpread(_objectSpread({}, parentNode), {}, {
|
|
215
|
-
children: newChildren
|
|
216
|
-
})
|
|
217
|
-
});
|
|
218
|
-
}
|
|
219
|
-
if (element.type === ELEMENT_TYPE.LIST_ITEM) {
|
|
220
|
-
updateParentNodeByPath(path);
|
|
221
|
-
}
|
|
222
|
-
|
|
223
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
224
|
-
}, [editor]);
|
|
225
|
-
var useMasterChanges = useCallback(function (element) {
|
|
226
|
-
var path = findPath(editor, element);
|
|
227
|
-
deleteNodeMark(editor, path, element, REBASE_MARKS);
|
|
228
|
-
var nextElementPath = _toConsumableArray(path);
|
|
229
|
-
nextElementPath[path.length - 1] = path[path.length - 1] + 1;
|
|
230
|
-
Transforms.removeNodes(editor, {
|
|
231
|
-
at: nextElementPath
|
|
232
|
-
});
|
|
233
|
-
if (element.type === ELEMENT_TYPE.LIST_ITEM) {
|
|
234
|
-
updateParentNodeByPath(path);
|
|
235
|
-
}
|
|
236
|
-
|
|
237
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
238
|
-
}, [editor]);
|
|
239
|
-
var useCurrentChanges = useCallback(function (element) {
|
|
240
|
-
var path = findPath(editor, element);
|
|
241
|
-
var currentElementPath = _toConsumableArray(path);
|
|
242
|
-
currentElementPath[path.length - 1] = path[path.length - 1] + 1;
|
|
243
|
-
var currentElement = getNode(editor, currentElementPath);
|
|
244
|
-
var newCurrentElement = deepCopy(currentElement);
|
|
245
|
-
deleteNodeMark(editor, currentElementPath, newCurrentElement, REBASE_MARKS);
|
|
246
|
-
Transforms.removeNodes(editor, {
|
|
247
|
-
at: path
|
|
248
|
-
});
|
|
249
|
-
if (element.type === ELEMENT_TYPE.LIST_ITEM) {
|
|
250
|
-
updateParentNodeByPath(path);
|
|
251
|
-
}
|
|
252
|
-
|
|
253
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
254
|
-
}, [editor]);
|
|
255
|
-
var useBothChanges = useCallback(function (element) {
|
|
256
|
-
// delete element marks
|
|
257
|
-
var path = findPath(editor, element);
|
|
258
|
-
deleteNodeMark(editor, path, element, REBASE_MARKS);
|
|
259
|
-
|
|
260
|
-
// delete next element marks
|
|
261
|
-
var nextElementPath = [].concat(_toConsumableArray(path.slice(0, -1)), [path[path.length - 1] + 1]);
|
|
262
|
-
var nextElement = getNode(editor, nextElementPath);
|
|
263
|
-
deleteNodeMark(editor, nextElementPath, nextElement, REBASE_MARKS);
|
|
264
|
-
if (element.type === ELEMENT_TYPE.LIST_ITEM) {
|
|
265
|
-
updateParentNodeByPath(path);
|
|
266
|
-
}
|
|
267
|
-
|
|
268
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
269
|
-
}, [editor]);
|
|
270
|
-
var element = props.element;
|
|
271
|
-
if (!element.rebaseType) {
|
|
272
|
-
return /*#__PURE__*/React.createElement(CustomElement, props);
|
|
273
|
-
}
|
|
274
|
-
if (element.rebaseType === REBASE_TYPE.DELETE_MODIFY) {
|
|
275
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
276
|
-
className: "w-100 d-flex sdoc-rebase-btn-group",
|
|
277
|
-
contentEditable: false
|
|
278
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
279
|
-
className: "sdoc-rebase-btn",
|
|
280
|
-
onClick: function onClick() {
|
|
281
|
-
return deleteElement(element);
|
|
282
|
-
}
|
|
283
|
-
}, t('Keep_other_modification')), /*#__PURE__*/React.createElement("div", {
|
|
284
|
-
className: "mr-2 ml-2"
|
|
285
|
-
}, '|'), /*#__PURE__*/React.createElement("div", {
|
|
286
|
-
className: "sdoc-rebase-btn",
|
|
287
|
-
onClick: function onClick() {
|
|
288
|
-
return deleteMark(element);
|
|
289
|
-
}
|
|
290
|
-
}, t('Keep_my_modification')), /*#__PURE__*/React.createElement("div", {
|
|
291
|
-
className: "mr-2 ml-2"
|
|
292
|
-
}, '|'), /*#__PURE__*/React.createElement("div", {
|
|
293
|
-
className: "sdoc-rebase-btn",
|
|
294
|
-
onClick: function onClick() {
|
|
295
|
-
return addDeletedElement(element);
|
|
296
|
-
}
|
|
297
|
-
}, t('Keep_both_modification'))), /*#__PURE__*/React.createElement("div", {
|
|
298
|
-
className: "w-100 sdoc-rebase-current-changes-start",
|
|
299
|
-
contentEditable: false
|
|
300
|
-
}, '<<<<<<<'), /*#__PURE__*/React.createElement("div", {
|
|
301
|
-
className: "w-100",
|
|
302
|
-
contentEditable: false
|
|
303
|
-
}, '======='), /*#__PURE__*/React.createElement("div", {
|
|
304
|
-
className: "w-100 sdoc-rebase-incoming-changes"
|
|
305
|
-
}, /*#__PURE__*/React.createElement(CustomElement, props)), /*#__PURE__*/React.createElement("div", {
|
|
306
|
-
className: "w-100 sdoc-rebase-incoming-changes-end",
|
|
307
|
-
contentEditable: false
|
|
308
|
-
}, '>>>>>>>'));
|
|
309
|
-
}
|
|
310
|
-
if (element.rebaseType === REBASE_TYPE.MODIFY_MODIFY) {
|
|
311
|
-
if (element.origin === 'master') {
|
|
312
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
313
|
-
className: "w-100 d-flex sdoc-rebase-btn-group",
|
|
314
|
-
contentEditable: false
|
|
315
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
316
|
-
className: "sdoc-rebase-btn",
|
|
317
|
-
onClick: function onClick() {
|
|
318
|
-
return useMasterChanges(element);
|
|
319
|
-
}
|
|
320
|
-
}, t('Keep_other_modification')), /*#__PURE__*/React.createElement("div", {
|
|
321
|
-
className: "mr-2 ml-2"
|
|
322
|
-
}, '|'), /*#__PURE__*/React.createElement("div", {
|
|
323
|
-
className: "sdoc-rebase-btn",
|
|
324
|
-
onClick: function onClick() {
|
|
325
|
-
return useCurrentChanges(element);
|
|
326
|
-
}
|
|
327
|
-
}, t('Keep_my_modification')), /*#__PURE__*/React.createElement("div", {
|
|
328
|
-
className: "mr-2 ml-2"
|
|
329
|
-
}, '|'), /*#__PURE__*/React.createElement("div", {
|
|
330
|
-
className: "sdoc-rebase-btn",
|
|
331
|
-
onClick: function onClick() {
|
|
332
|
-
return useBothChanges(element);
|
|
333
|
-
}
|
|
334
|
-
}, t('Keep_both_modification'))), /*#__PURE__*/React.createElement("div", {
|
|
335
|
-
className: "w-100 sdoc-rebase-current-changes-start",
|
|
336
|
-
contentEditable: false
|
|
337
|
-
}, '<<<<<<<'), /*#__PURE__*/React.createElement("div", {
|
|
338
|
-
className: "w-100 sdoc-rebase-current-changes"
|
|
339
|
-
}, /*#__PURE__*/React.createElement(CustomElement, props)));
|
|
340
|
-
}
|
|
341
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
342
|
-
className: "w-100",
|
|
343
|
-
contentEditable: false
|
|
344
|
-
}, '======='), /*#__PURE__*/React.createElement("div", {
|
|
345
|
-
className: "w-100 sdoc-rebase-incoming-changes"
|
|
346
|
-
}, /*#__PURE__*/React.createElement(CustomElement, props)), /*#__PURE__*/React.createElement("div", {
|
|
347
|
-
className: "w-100 sdoc-rebase-incoming-changes-end",
|
|
348
|
-
contentEditable: false
|
|
349
|
-
}, '>>>>>>>'));
|
|
350
|
-
}
|
|
351
143
|
return /*#__PURE__*/React.createElement(CustomElement, props);
|
|
352
144
|
|
|
353
145
|
// const { element } = props;
|
|
@@ -1,24 +1,22 @@
|
|
|
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
|
|
20
|
-
customRenderElement = _ref.renderElement,
|
|
21
|
-
isShowComment = _ref.isShowComment;
|
|
19
|
+
slateValue = _ref.slateValue;
|
|
22
20
|
var _useCursors = useCursors(editor),
|
|
23
21
|
cursors = _useCursors.cursors;
|
|
24
22
|
var decorate = usePipDecorate(editor);
|
|
@@ -140,15 +138,12 @@ var SlateEditor = function SlateEditor(_ref) {
|
|
|
140
138
|
editor: editor
|
|
141
139
|
}, /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(ContextToolbar, null), /*#__PURE__*/React.createElement(SetNodeToDecorations, null), /*#__PURE__*/React.createElement(Editable, {
|
|
142
140
|
cursors: cursors,
|
|
143
|
-
renderElement:
|
|
141
|
+
renderElement: renderElement,
|
|
144
142
|
renderLeaf: renderLeaf,
|
|
145
143
|
onKeyDown: onKeyDown,
|
|
146
144
|
onMouseDown: onMouseDown,
|
|
147
145
|
decorate: decorate,
|
|
148
146
|
onCut: eventProxy.onCut
|
|
149
|
-
})), /*#__PURE__*/React.createElement(SideToolbar, null),
|
|
150
|
-
};
|
|
151
|
-
SlateEditor.defaultProps = {
|
|
152
|
-
isShowComment: true
|
|
147
|
+
})), /*#__PURE__*/React.createElement(SideToolbar, null), /*#__PURE__*/React.createElement(CommentContextProvider, null, /*#__PURE__*/React.createElement(CommentWrapper, null))));
|
|
153
148
|
};
|
|
154
149
|
export default SlateEditor;
|
|
@@ -4,7 +4,6 @@ import { Editor, Operation } from '@seafile/slate';
|
|
|
4
4
|
import { getNode } from '../extension/core';
|
|
5
5
|
import * as OPERATION from '../node-id/constants';
|
|
6
6
|
import { setCursor } from '../cursor/helper';
|
|
7
|
-
import { MODE } from '../../constants';
|
|
8
7
|
export var getNodePathById = function getNodePathById(rootNode, nodeId) {
|
|
9
8
|
var path = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
|
|
10
9
|
if (rootNode.id === nodeId) return path;
|
|
@@ -253,7 +252,6 @@ export var reExecRevertOperationList = function reExecRevertOperationList(editor
|
|
|
253
252
|
}
|
|
254
253
|
};
|
|
255
254
|
export var syncRemoteOperations = function syncRemoteOperations(editor, remoteOperations) {
|
|
256
|
-
if (editor.mode !== MODE.EDITOR) return;
|
|
257
255
|
if (remoteOperations.length === 0) return;
|
|
258
256
|
Editor.withoutNormalizing(editor, function () {
|
|
259
257
|
for (var i = 0; i < remoteOperations.length; i++) {
|