@seafile/sdoc-editor 0.1.140 → 0.1.142-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 +15 -0
- package/dist/api/seafile-api.js +27 -5
- package/dist/basic-sdk/assets/css/default.css +1 -1
- package/dist/basic-sdk/assets/css/dropdown-menu.css +5 -1
- package/dist/basic-sdk/constants/index.js +14 -1
- package/dist/basic-sdk/editor/common-editor.js +45 -0
- package/dist/basic-sdk/editor/index.js +135 -0
- package/dist/basic-sdk/editor/rebase-editor/index.css +29 -0
- package/dist/basic-sdk/editor/rebase-editor/index.js +276 -0
- package/dist/basic-sdk/{slate-editor.js → editor/slate-editor.js} +21 -16
- package/dist/basic-sdk/extension/constants/index.js +1 -1
- package/dist/basic-sdk/extension/core/transforms/replace-node-children.js +26 -0
- package/dist/basic-sdk/extension/plugins/link/plugin.js +15 -3
- package/dist/basic-sdk/extension/toolbar/header-toolbar/index.js +5 -1
- package/dist/basic-sdk/extension/toolbar/header-toolbar/insert-toolbar/index.css +7 -2
- package/dist/basic-sdk/socket/helpers.js +1 -0
- package/dist/basic-sdk/socket/socket-client.js +5 -0
- package/dist/basic-sdk/socket/socket-manager.js +8 -2
- package/dist/basic-sdk/socket/with-socket-io.js +20 -12
- package/dist/basic-sdk/utils/diff.js +2 -2
- package/dist/basic-sdk/utils/rebase.js +193 -0
- package/dist/basic-sdk/views/diff-viewer.js +3 -1
- package/dist/basic-sdk/views/viewer.js +8 -11
- package/dist/components/doc-operations/index.js +8 -2
- package/dist/components/doc-operations/revision-operations/index.js +11 -3
- package/dist/components/doc-operations/revision-operations/publish-button.js +16 -13
- package/dist/components/tip-dialog/index.css +0 -0
- package/dist/components/tip-dialog/index.js +45 -0
- package/dist/constants/index.js +8 -1
- package/dist/context.js +30 -4
- package/dist/pages/simple-editor.js +221 -71
- package/package.json +2 -2
- package/public/locales/cs/sdoc-editor.json +2 -2
- package/public/locales/de/sdoc-editor.json +2 -2
- package/public/locales/en/sdoc-editor.json +8 -2
- package/public/locales/es/sdoc-editor.json +2 -2
- package/public/locales/fr/sdoc-editor.json +2 -2
- package/public/locales/ru/sdoc-editor.json +2 -2
- package/public/locales/zh_CN/sdoc-editor.json +8 -2
- package/dist/basic-sdk/editor.js +0 -105
|
@@ -58,6 +58,21 @@ var SDocServerApi = /*#__PURE__*/function () {
|
|
|
58
58
|
}
|
|
59
59
|
});
|
|
60
60
|
}
|
|
61
|
+
}, {
|
|
62
|
+
key: "saveDocContentByRebase",
|
|
63
|
+
value: function saveDocContentByRebase(content) {
|
|
64
|
+
var server = this.server,
|
|
65
|
+
docUuid = this.docUuid,
|
|
66
|
+
accessToken = this.accessToken;
|
|
67
|
+
var url = "".concat(server, "/api/v1/docs/").concat(docUuid, "/rebase/");
|
|
68
|
+
var formData = new FormData();
|
|
69
|
+
formData.append('doc_content', JSON.stringify(content));
|
|
70
|
+
return axios.post(url, formData, {
|
|
71
|
+
headers: {
|
|
72
|
+
Authorization: "Token ".concat(accessToken)
|
|
73
|
+
}
|
|
74
|
+
});
|
|
75
|
+
}
|
|
61
76
|
}, {
|
|
62
77
|
key: "getCollaborators",
|
|
63
78
|
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: "rebaseSdocRevision",
|
|
94
|
+
value: function rebaseSdocRevision(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) {
|
|
@@ -5,4 +5,17 @@ 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_MARKS = ['origin', 'rebaseType', 'oldElement'];
|
|
@@ -0,0 +1,45 @@
|
|
|
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
|
+
var CommonEditor = function CommonEditor(_ref) {
|
|
8
|
+
var slateValue = _ref.slateValue,
|
|
9
|
+
updateSlateValue = _ref.updateSlateValue,
|
|
10
|
+
editor = _ref.editor;
|
|
11
|
+
// useMount: focus editor
|
|
12
|
+
useEffect(function () {
|
|
13
|
+
var timer = setTimeout(function () {
|
|
14
|
+
var _editor$children = _slicedToArray(editor.children, 1),
|
|
15
|
+
firstNode = _editor$children[0];
|
|
16
|
+
if (firstNode) {
|
|
17
|
+
var _firstNode$children = _slicedToArray(firstNode.children, 1),
|
|
18
|
+
firstNodeFirstChild = _firstNode$children[0];
|
|
19
|
+
if (firstNodeFirstChild) {
|
|
20
|
+
var endOfFirstNode = Editor.end(editor, [0, 0]);
|
|
21
|
+
var range = {
|
|
22
|
+
anchor: endOfFirstNode,
|
|
23
|
+
focus: endOfFirstNode
|
|
24
|
+
};
|
|
25
|
+
focusEditor(editor, range);
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
}, 300);
|
|
29
|
+
return function () {
|
|
30
|
+
clearTimeout(timer);
|
|
31
|
+
};
|
|
32
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
33
|
+
}, []);
|
|
34
|
+
return /*#__PURE__*/React.createElement(EditorContainer, {
|
|
35
|
+
editor: editor
|
|
36
|
+
}, /*#__PURE__*/React.createElement(EditorContent, {
|
|
37
|
+
docValue: slateValue,
|
|
38
|
+
showOutline: true
|
|
39
|
+
}, /*#__PURE__*/React.createElement(SlateEditor, {
|
|
40
|
+
editor: editor,
|
|
41
|
+
slateValue: slateValue,
|
|
42
|
+
setSlateValue: updateSlateValue
|
|
43
|
+
})));
|
|
44
|
+
};
|
|
45
|
+
export default CommonEditor;
|
|
@@ -0,0 +1,135 @@
|
|
|
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 } 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 SDocRebaseEditor from './rebase-editor';
|
|
12
|
+
import SDocEditor from './common-editor';
|
|
13
|
+
import CommonLoading from '../../components/common-loading';
|
|
14
|
+
import context from '../../context';
|
|
15
|
+
var Editor = forwardRef(function (_ref, ref) {
|
|
16
|
+
var mode = _ref.mode,
|
|
17
|
+
document = _ref.document,
|
|
18
|
+
setDiffChanges = _ref.setDiffChanges,
|
|
19
|
+
toggleViewChanges = _ref.toggleViewChanges;
|
|
20
|
+
context.initApi();
|
|
21
|
+
var editor = useMemo(function () {
|
|
22
|
+
var defaultEditor = createDefaultEditor();
|
|
23
|
+
var editorConfig = context.getEditorConfig();
|
|
24
|
+
defaultEditor.mode = MODE.EDITOR;
|
|
25
|
+
var newEditor = withNodeId(withSocketIO(defaultEditor, {
|
|
26
|
+
document: document,
|
|
27
|
+
config: editorConfig
|
|
28
|
+
}));
|
|
29
|
+
var cursors = document.cursors;
|
|
30
|
+
newEditor.cursors = cursors || {};
|
|
31
|
+
newEditor.width = PAGE_EDIT_AREA_WIDTH; // default width
|
|
32
|
+
return newEditor;
|
|
33
|
+
|
|
34
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
35
|
+
}, []);
|
|
36
|
+
var _useState = useState(document.children),
|
|
37
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
38
|
+
slateValue = _useState2[0],
|
|
39
|
+
_setSlateValue = _useState2[1];
|
|
40
|
+
var _useState3 = useState(false),
|
|
41
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
42
|
+
isLoading = _useState4[0],
|
|
43
|
+
_setLoading = _useState4[1];
|
|
44
|
+
var _useState5 = useState(null),
|
|
45
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
46
|
+
diffContent = _useState6[0],
|
|
47
|
+
_setDiffContent = _useState6[1];
|
|
48
|
+
var _useState7 = useState(null),
|
|
49
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
50
|
+
currentContent = _useState8[0],
|
|
51
|
+
setCurrentContent = _useState8[1];
|
|
52
|
+
|
|
53
|
+
// useMount: init socket connection
|
|
54
|
+
useEffect(function () {
|
|
55
|
+
editor.openConnection();
|
|
56
|
+
return function () {
|
|
57
|
+
editor.closeConnection();
|
|
58
|
+
};
|
|
59
|
+
|
|
60
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
61
|
+
}, []);
|
|
62
|
+
var updateSlateValue = useCallback(function (value) {
|
|
63
|
+
_setSlateValue(value);
|
|
64
|
+
|
|
65
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
66
|
+
}, []);
|
|
67
|
+
|
|
68
|
+
// The parent component can call the method of this component through ref
|
|
69
|
+
useImperativeHandle(ref, function () {
|
|
70
|
+
return {
|
|
71
|
+
// set value
|
|
72
|
+
setLoading: function setLoading(isLoading) {
|
|
73
|
+
_setLoading(isLoading);
|
|
74
|
+
},
|
|
75
|
+
setDiffContent: function setDiffContent(content) {
|
|
76
|
+
setCurrentContent(deepCopy(_objectSpread(_objectSpread({}, document), {}, {
|
|
77
|
+
children: slateValue
|
|
78
|
+
})));
|
|
79
|
+
_setDiffContent(content);
|
|
80
|
+
},
|
|
81
|
+
setEditorMode: function setEditorMode(mode) {
|
|
82
|
+
editor.cursors = {};
|
|
83
|
+
editor.selection = null;
|
|
84
|
+
if (mode === MODE.EDITOR) {
|
|
85
|
+
editor.operations = [];
|
|
86
|
+
}
|
|
87
|
+
editor.mode = mode;
|
|
88
|
+
},
|
|
89
|
+
setSlateValue: function setSlateValue(document) {
|
|
90
|
+
_setSlateValue(document.children);
|
|
91
|
+
},
|
|
92
|
+
// get value
|
|
93
|
+
getSlateValue: function getSlateValue() {
|
|
94
|
+
return deepCopy(_objectSpread(_objectSpread({}, document), {}, {
|
|
95
|
+
children: slateValue
|
|
96
|
+
}));
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
100
|
+
};
|
|
101
|
+
}, [document, editor, slateValue]);
|
|
102
|
+
if (isLoading) {
|
|
103
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
104
|
+
className: "h-100 w-100 d-flex align-items-center justify-content-center"
|
|
105
|
+
}, /*#__PURE__*/React.createElement(CommonLoading, null));
|
|
106
|
+
}
|
|
107
|
+
if (mode === MODE.DIFF_VIEWER) {
|
|
108
|
+
return /*#__PURE__*/React.createElement(DiffViewer, {
|
|
109
|
+
showToolbar: true,
|
|
110
|
+
showOutline: true,
|
|
111
|
+
editor: editor,
|
|
112
|
+
currentContent: currentContent,
|
|
113
|
+
lastContent: diffContent,
|
|
114
|
+
didMountCallback: setDiffChanges
|
|
115
|
+
});
|
|
116
|
+
}
|
|
117
|
+
if (mode === MODE.EDITOR) {
|
|
118
|
+
return /*#__PURE__*/React.createElement(SDocEditor, {
|
|
119
|
+
slateValue: slateValue,
|
|
120
|
+
editor: editor,
|
|
121
|
+
updateSlateValue: updateSlateValue
|
|
122
|
+
});
|
|
123
|
+
}
|
|
124
|
+
if (mode === MODE.REBASE) {
|
|
125
|
+
return /*#__PURE__*/React.createElement(SDocRebaseEditor, {
|
|
126
|
+
slateValue: slateValue,
|
|
127
|
+
editor: editor,
|
|
128
|
+
version: document.version,
|
|
129
|
+
updateSlateValue: updateSlateValue,
|
|
130
|
+
toggleViewChanges: toggleViewChanges
|
|
131
|
+
});
|
|
132
|
+
}
|
|
133
|
+
return null;
|
|
134
|
+
});
|
|
135
|
+
export default Editor;
|
|
@@ -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,276 @@
|
|
|
1
|
+
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
|
|
2
|
+
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
3
|
+
import React, { useCallback, useEffect } from 'react';
|
|
4
|
+
import deepCopy from 'deep-copy';
|
|
5
|
+
import { useTranslation } from 'react-i18next';
|
|
6
|
+
import { Transforms } from '@seafile/slate';
|
|
7
|
+
import { renderElement } from '../../extension';
|
|
8
|
+
import { focusEditor, findPath, getNode, replaceNode, generateEmptyElement, deleteNodeMark } from '../../extension/core';
|
|
9
|
+
import { REBASE_TYPE, REBASE_MARKS } from '../../constants';
|
|
10
|
+
import context from '../../../context';
|
|
11
|
+
import toaster from '../../../components/toast';
|
|
12
|
+
import { ELEMENT_TYPE } from '../../extension/constants';
|
|
13
|
+
import { replaceNodeId } from '../../node-id/helpers';
|
|
14
|
+
import { EditorContainer, EditorContent } from '../../layout';
|
|
15
|
+
import SlateEditor from '../slate-editor';
|
|
16
|
+
import './index.css';
|
|
17
|
+
var SDocRebaseEditor = function SDocRebaseEditor(_ref) {
|
|
18
|
+
var slateValue = _ref.slateValue,
|
|
19
|
+
editor = _ref.editor,
|
|
20
|
+
version = _ref.version,
|
|
21
|
+
updateSlateValue = _ref.updateSlateValue,
|
|
22
|
+
toggleViewChanges = _ref.toggleViewChanges;
|
|
23
|
+
var _useTranslation = useTranslation(),
|
|
24
|
+
t = _useTranslation.t;
|
|
25
|
+
|
|
26
|
+
// useMount: focus editor
|
|
27
|
+
useEffect(function () {
|
|
28
|
+
var timer = setTimeout(function () {
|
|
29
|
+
focusEditor(editor);
|
|
30
|
+
}, 300);
|
|
31
|
+
return function () {
|
|
32
|
+
clearTimeout(timer);
|
|
33
|
+
};
|
|
34
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
35
|
+
}, []);
|
|
36
|
+
var onChange = useCallback(function (slateValue) {
|
|
37
|
+
updateSlateValue(slateValue);
|
|
38
|
+
if (slateValue.filter(function (item) {
|
|
39
|
+
return item.rebaseType;
|
|
40
|
+
}).length === 0) {
|
|
41
|
+
var user = context.getUserInfo();
|
|
42
|
+
context.rebaseSdocRevision().then(function (res) {
|
|
43
|
+
return context.saveDocContentByRebase({
|
|
44
|
+
children: slateValue,
|
|
45
|
+
version: version + 1,
|
|
46
|
+
last_modify_user: user.username
|
|
47
|
+
});
|
|
48
|
+
}).then(function (res) {
|
|
49
|
+
toaster.success(t('Successfully_rebase_'));
|
|
50
|
+
toggleViewChanges(false, true);
|
|
51
|
+
}).catch(function (error) {
|
|
52
|
+
toaster.danger(t('Error'));
|
|
53
|
+
});
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
57
|
+
}, [version, toggleViewChanges]);
|
|
58
|
+
var updateParentNodeByPath = useCallback(function (path) {
|
|
59
|
+
var parentPath = path.slice(0, -1);
|
|
60
|
+
var parentNode = getNode(editor, parentPath);
|
|
61
|
+
if (parentNode.children.filter(function (item) {
|
|
62
|
+
return item.rebaseType;
|
|
63
|
+
}).length === 0) {
|
|
64
|
+
var newParentElement = _objectSpread({}, parentNode);
|
|
65
|
+
newParentElement['rebaseType'] && delete newParentElement['rebaseType'];
|
|
66
|
+
newParentElement['oldElement'] && delete newParentElement['oldElement'];
|
|
67
|
+
newParentElement['origin'] && delete newParentElement['origin'];
|
|
68
|
+
newParentElement['children'] = newParentElement['children'].map(function (item) {
|
|
69
|
+
item['rebaseType'] && delete item['rebaseType'];
|
|
70
|
+
item['oldElement'] && delete item['oldElement'];
|
|
71
|
+
item['origin'] && delete item['origin'];
|
|
72
|
+
return item;
|
|
73
|
+
});
|
|
74
|
+
replaceNode(editor, {
|
|
75
|
+
at: parentPath,
|
|
76
|
+
nodes: newParentElement
|
|
77
|
+
});
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
81
|
+
}, [editor]);
|
|
82
|
+
var deleteElement = useCallback(function (element) {
|
|
83
|
+
var path = findPath(editor, element);
|
|
84
|
+
Transforms.removeNodes(editor, {
|
|
85
|
+
at: path
|
|
86
|
+
});
|
|
87
|
+
if (element.type === ELEMENT_TYPE.LIST_ITEM) {
|
|
88
|
+
updateParentNodeByPath(path);
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
92
|
+
}, [slateValue, editor]);
|
|
93
|
+
var deleteMark = useCallback(function (element) {
|
|
94
|
+
var path = findPath(editor, element);
|
|
95
|
+
deleteNodeMark(editor, path, element, REBASE_MARKS);
|
|
96
|
+
if (element.type === ELEMENT_TYPE.LIST_ITEM) {
|
|
97
|
+
updateParentNodeByPath(path);
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
101
|
+
}, [slateValue, editor]);
|
|
102
|
+
var addDeletedElement = useCallback(function (element) {
|
|
103
|
+
var path = findPath(editor, element);
|
|
104
|
+
deleteNodeMark(editor, path, element, REBASE_MARKS);
|
|
105
|
+
if (element.type !== ELEMENT_TYPE.LIST_ITEM) {
|
|
106
|
+
var emptyNode = generateEmptyElement(ELEMENT_TYPE.PARAGRAPH);
|
|
107
|
+
Transforms.insertNodes(editor, emptyNode, {
|
|
108
|
+
at: [path[0]]
|
|
109
|
+
});
|
|
110
|
+
} else {
|
|
111
|
+
var _emptyNode = generateEmptyElement(ELEMENT_TYPE.LIST_ITEM);
|
|
112
|
+
_emptyNode.children[0] = generateEmptyElement(ELEMENT_TYPE.LIST_LIC);
|
|
113
|
+
var parentPath = path.slice(0, -1);
|
|
114
|
+
var parentNode = getNode(editor, parentPath);
|
|
115
|
+
var newChildren = _toConsumableArray(parentNode.children);
|
|
116
|
+
var index = path[path.length - 1];
|
|
117
|
+
newChildren.splice(index, 0, _emptyNode);
|
|
118
|
+
replaceNode(editor, {
|
|
119
|
+
at: parentPath,
|
|
120
|
+
nodes: _objectSpread(_objectSpread({}, parentNode), {}, {
|
|
121
|
+
children: newChildren
|
|
122
|
+
})
|
|
123
|
+
});
|
|
124
|
+
}
|
|
125
|
+
if (element.type === ELEMENT_TYPE.LIST_ITEM) {
|
|
126
|
+
updateParentNodeByPath(path);
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
130
|
+
}, [slateValue, editor]);
|
|
131
|
+
var useMasterChanges = useCallback(function (element) {
|
|
132
|
+
var path = findPath(editor, element);
|
|
133
|
+
deleteNodeMark(editor, path, element, REBASE_MARKS);
|
|
134
|
+
var nextElementPath = _toConsumableArray(path);
|
|
135
|
+
nextElementPath[path.length - 1] = path[path.length - 1] + 1;
|
|
136
|
+
Transforms.removeNodes(editor, {
|
|
137
|
+
at: nextElementPath
|
|
138
|
+
});
|
|
139
|
+
if (element.type === ELEMENT_TYPE.LIST_ITEM) {
|
|
140
|
+
updateParentNodeByPath(path);
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
144
|
+
}, [slateValue, editor]);
|
|
145
|
+
var useCurrentChanges = useCallback(function (element) {
|
|
146
|
+
var path = findPath(editor, element);
|
|
147
|
+
var currentElementPath = _toConsumableArray(path);
|
|
148
|
+
currentElementPath[path.length - 1] = path[path.length - 1] + 1;
|
|
149
|
+
var currentElement = getNode(editor, currentElementPath);
|
|
150
|
+
var newCurrentElement = deepCopy(currentElement);
|
|
151
|
+
deleteNodeMark(editor, currentElementPath, newCurrentElement, REBASE_MARKS);
|
|
152
|
+
Transforms.removeNodes(editor, {
|
|
153
|
+
at: path
|
|
154
|
+
});
|
|
155
|
+
if (element.type === ELEMENT_TYPE.LIST_ITEM) {
|
|
156
|
+
updateParentNodeByPath(path);
|
|
157
|
+
}
|
|
158
|
+
|
|
159
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
160
|
+
}, [slateValue, editor]);
|
|
161
|
+
var useBothChanges = useCallback(function (element) {
|
|
162
|
+
// delete element marks
|
|
163
|
+
var path = findPath(editor, element);
|
|
164
|
+
deleteNodeMark(editor, path, element, REBASE_MARKS);
|
|
165
|
+
|
|
166
|
+
// delete next element marks
|
|
167
|
+
var nextElementPath = [].concat(_toConsumableArray(path.slice(0, -1)), [path[path.length - 1] + 1]);
|
|
168
|
+
var nextElement = getNode(editor, nextElementPath);
|
|
169
|
+
var newNextElement = replaceNodeId(deepCopy(nextElement));
|
|
170
|
+
deleteNodeMark(editor, nextElementPath, newNextElement, REBASE_MARKS);
|
|
171
|
+
if (element.type === ELEMENT_TYPE.LIST_ITEM) {
|
|
172
|
+
updateParentNodeByPath(path);
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
176
|
+
}, [slateValue, editor]);
|
|
177
|
+
var renderRebaseElement = useCallback(function (props) {
|
|
178
|
+
var element = props.element;
|
|
179
|
+
if (!element.rebaseType) {
|
|
180
|
+
return renderElement(props);
|
|
181
|
+
}
|
|
182
|
+
if (element.rebaseType === REBASE_TYPE.DELETE_MODIFY) {
|
|
183
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
184
|
+
className: "w-100 d-flex sdoc-rebase-btn-group",
|
|
185
|
+
contentEditable: false
|
|
186
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
187
|
+
className: "sdoc-rebase-btn",
|
|
188
|
+
onClick: function onClick() {
|
|
189
|
+
return deleteElement(element);
|
|
190
|
+
}
|
|
191
|
+
}, t('Keep_my_modification')), /*#__PURE__*/React.createElement("div", {
|
|
192
|
+
className: "mr-2 ml-2"
|
|
193
|
+
}, '|'), /*#__PURE__*/React.createElement("div", {
|
|
194
|
+
className: "sdoc-rebase-btn",
|
|
195
|
+
onClick: function onClick() {
|
|
196
|
+
return deleteMark(element);
|
|
197
|
+
}
|
|
198
|
+
}, t('Keep_other_modification')), /*#__PURE__*/React.createElement("div", {
|
|
199
|
+
className: "mr-2 ml-2"
|
|
200
|
+
}, '|'), /*#__PURE__*/React.createElement("div", {
|
|
201
|
+
className: "sdoc-rebase-btn",
|
|
202
|
+
onClick: function onClick() {
|
|
203
|
+
return addDeletedElement(element);
|
|
204
|
+
}
|
|
205
|
+
}, t('Keep_both_modification'))), /*#__PURE__*/React.createElement("div", {
|
|
206
|
+
className: "w-100 sdoc-rebase-current-changes-start",
|
|
207
|
+
contentEditable: false
|
|
208
|
+
}, '<<<<<<<'), /*#__PURE__*/React.createElement("div", {
|
|
209
|
+
className: "w-100",
|
|
210
|
+
contentEditable: false
|
|
211
|
+
}, '======='), /*#__PURE__*/React.createElement("div", {
|
|
212
|
+
className: "w-100 sdoc-rebase-incoming-changes"
|
|
213
|
+
}, renderElement(props)), /*#__PURE__*/React.createElement("div", {
|
|
214
|
+
className: "w-100 sdoc-rebase-incoming-changes-end",
|
|
215
|
+
contentEditable: false
|
|
216
|
+
}, '>>>>>>>'));
|
|
217
|
+
}
|
|
218
|
+
if (element.rebaseType === REBASE_TYPE.MODIFY_MODIFY) {
|
|
219
|
+
if (element.origin === 'master') {
|
|
220
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
221
|
+
className: "w-100 d-flex sdoc-rebase-btn-group",
|
|
222
|
+
contentEditable: false
|
|
223
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
224
|
+
className: "sdoc-rebase-btn",
|
|
225
|
+
onClick: function onClick() {
|
|
226
|
+
return useMasterChanges(element);
|
|
227
|
+
}
|
|
228
|
+
}, t('Keep_my_modification')), /*#__PURE__*/React.createElement("div", {
|
|
229
|
+
className: "mr-2 ml-2"
|
|
230
|
+
}, '|'), /*#__PURE__*/React.createElement("div", {
|
|
231
|
+
className: "sdoc-rebase-btn",
|
|
232
|
+
onClick: function onClick() {
|
|
233
|
+
return useCurrentChanges(element);
|
|
234
|
+
}
|
|
235
|
+
}, t('Keep_other_modification')), /*#__PURE__*/React.createElement("div", {
|
|
236
|
+
className: "mr-2 ml-2"
|
|
237
|
+
}, '|'), /*#__PURE__*/React.createElement("div", {
|
|
238
|
+
className: "sdoc-rebase-btn",
|
|
239
|
+
onClick: function onClick() {
|
|
240
|
+
return useBothChanges(element);
|
|
241
|
+
}
|
|
242
|
+
}, t('Keep_both_modification'))), /*#__PURE__*/React.createElement("div", {
|
|
243
|
+
className: "w-100 sdoc-rebase-current-changes-start",
|
|
244
|
+
contentEditable: false
|
|
245
|
+
}, '<<<<<<<'), /*#__PURE__*/React.createElement("div", {
|
|
246
|
+
className: "w-100 sdoc-rebase-current-changes"
|
|
247
|
+
}, renderElement(props)));
|
|
248
|
+
}
|
|
249
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
250
|
+
className: "w-100",
|
|
251
|
+
contentEditable: false
|
|
252
|
+
}, '======='), /*#__PURE__*/React.createElement("div", {
|
|
253
|
+
className: "w-100 sdoc-rebase-incoming-changes"
|
|
254
|
+
}, renderElement(props)), /*#__PURE__*/React.createElement("div", {
|
|
255
|
+
className: "w-100 sdoc-rebase-incoming-changes-end",
|
|
256
|
+
contentEditable: false
|
|
257
|
+
}, '>>>>>>>'));
|
|
258
|
+
}
|
|
259
|
+
return renderElement(props);
|
|
260
|
+
|
|
261
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
262
|
+
}, []);
|
|
263
|
+
return /*#__PURE__*/React.createElement(EditorContainer, {
|
|
264
|
+
editor: editor
|
|
265
|
+
}, /*#__PURE__*/React.createElement(EditorContent, {
|
|
266
|
+
docValue: slateValue,
|
|
267
|
+
showOutline: true
|
|
268
|
+
}, /*#__PURE__*/React.createElement(SlateEditor, {
|
|
269
|
+
isShowComment: false,
|
|
270
|
+
editor: editor,
|
|
271
|
+
slateValue: slateValue,
|
|
272
|
+
setSlateValue: onChange,
|
|
273
|
+
renderElement: renderRebaseElement
|
|
274
|
+
})));
|
|
275
|
+
};
|
|
276
|
+
export default SDocRebaseEditor;
|
|
@@ -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;
|
|
@@ -134,7 +134,7 @@ export var MENUS_CONFIG_MAP = (_MENUS_CONFIG_MAP = {}, _defineProperty(_MENUS_CO
|
|
|
134
134
|
}), _defineProperty(_MENUS_CONFIG_MAP, SDOC_LINK, {
|
|
135
135
|
id: "sdoc_".concat(SDOC_LINK),
|
|
136
136
|
iconClass: 'sdocfont sdoc-document',
|
|
137
|
-
text: '
|
|
137
|
+
text: 'Link_sdoc'
|
|
138
138
|
}), _MENUS_CONFIG_MAP);
|
|
139
139
|
export var HEADERS = [HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6];
|
|
140
140
|
export var HEADER_TITLE_MAP = (_HEADER_TITLE_MAP = {}, _defineProperty(_HEADER_TITLE_MAP, TITLE, 'Title'), _defineProperty(_HEADER_TITLE_MAP, SUBTITLE, 'Subtitle'), _defineProperty(_HEADER_TITLE_MAP, HEADER1, 'Header_one'), _defineProperty(_HEADER_TITLE_MAP, HEADER2, 'Header_two'), _defineProperty(_HEADER_TITLE_MAP, HEADER3, 'Header_three'), _defineProperty(_HEADER_TITLE_MAP, HEADER4, 'Header_four'), _defineProperty(_HEADER_TITLE_MAP, HEADER5, 'Header_five'), _defineProperty(_HEADER_TITLE_MAP, HEADER6, 'Header_six'), _defineProperty(_HEADER_TITLE_MAP, PARAGRAPH, 'Paragraph'), _HEADER_TITLE_MAP);
|