@seafile/sdoc-editor 0.2.16 → 0.2.18
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/seafile-api.js +36 -2
- package/dist/assets/css/simple-editor.css +0 -32
- package/dist/assets/images/revision-avatar.png +0 -0
- package/dist/basic-sdk/assets/css/textlink-hovermenu.css +1 -0
- package/dist/basic-sdk/comment/components/comment-all-participants/index.css +83 -0
- package/dist/basic-sdk/comment/components/comment-all-participants/index.js +56 -0
- package/dist/basic-sdk/comment/components/comment-all-participants/participant-avatar.js +35 -0
- package/dist/basic-sdk/comment/{comment → components}/comment-editor.js +18 -36
- package/dist/basic-sdk/comment/components/comment-input/comment-participant-item.js +47 -0
- package/dist/basic-sdk/comment/components/comment-input/index.css +45 -0
- package/dist/basic-sdk/comment/components/comment-input/index.js +295 -0
- package/dist/basic-sdk/comment/{comment → components}/comment-item-content.js +7 -2
- package/dist/basic-sdk/comment/{comment → components}/comment-item-reply.js +6 -1
- package/dist/basic-sdk/comment/{comment → components}/comment-item-wrapper.js +3 -1
- package/dist/basic-sdk/comment/components/comment-participants-editor/index.css +132 -0
- package/dist/basic-sdk/comment/components/comment-participants-editor/index.js +67 -0
- package/dist/basic-sdk/comment/components/comment-participants-editor/searched-collaborators.js +53 -0
- package/dist/basic-sdk/comment/components/comment-participants-editor/selected-participants.js +39 -0
- package/dist/basic-sdk/comment/{comment → components}/global-comment-header.js +5 -6
- package/dist/basic-sdk/comment/{comment → components}/global-comment.js +3 -2
- package/dist/basic-sdk/comment/{comment → components}/style.css +8 -1
- package/dist/basic-sdk/comment/constants/index.js +11 -0
- package/dist/basic-sdk/comment/hooks/use-comment-list.js +1 -1
- package/dist/basic-sdk/comment/hooks/use-participants.js +90 -0
- package/dist/basic-sdk/comment/index.js +3 -2
- package/dist/basic-sdk/comment/utils/index.js +206 -0
- package/dist/basic-sdk/editor/sdoc-editor.js +3 -2
- package/dist/basic-sdk/extension/plugins/link/hover/index.js +3 -3
- package/dist/components/doc-info/index.css +53 -0
- package/dist/components/doc-info/index.js +11 -2
- package/dist/components/modal-portal/index.js +36 -0
- package/dist/constants/index.js +4 -1
- package/dist/constants/key-codes.js +102 -0
- package/dist/constants/transfer-types.js +3 -0
- package/dist/context.js +38 -8
- package/dist/hooks/index.js +3 -0
- package/dist/hooks/use-collaborators.js +44 -0
- package/dist/layout/layout.js +10 -27
- package/dist/model/index.js +2 -1
- package/dist/model/user.js +12 -0
- package/dist/pages/simple-editor.js +1 -1
- package/dist/utils/get-event-transfer.js +73 -0
- package/dist/utils/hotkey.js +25 -0
- package/dist/utils/index.js +58 -1
- package/package.json +1 -1
- package/public/locales/cs/sdoc-editor.json +6 -1
- package/public/locales/de/sdoc-editor.json +6 -1
- package/public/locales/en/sdoc-editor.json +3 -1
- package/public/locales/es/sdoc-editor.json +6 -1
- package/public/locales/fr/sdoc-editor.json +6 -1
- package/public/locales/it/sdoc-editor.json +6 -1
- package/public/locales/ru/sdoc-editor.json +6 -1
- package/public/locales/zh_CN/sdoc-editor.json +3 -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/comment/{comment → components}/comment-delete-shadow.js +0 -0
- /package/dist/basic-sdk/comment/{comment → components}/comment-item-resolved-reply.js +0 -0
- /package/dist/basic-sdk/comment/{comment → components}/comment-list.css +0 -0
- /package/dist/basic-sdk/comment/{comment → components}/comment-list.js +0 -0
- /package/dist/basic-sdk/comment/{comment → components}/editor-comment.js +0 -0
- /package/dist/basic-sdk/comment/{comment → components}/elements-comment-count/element-comment-count.js +0 -0
- /package/dist/basic-sdk/comment/{comment → components}/elements-comment-count/index.css +0 -0
- /package/dist/basic-sdk/comment/{comment → components}/elements-comment-count/index.js +0 -0
- /package/dist/basic-sdk/comment/{comment → components}/index.js +0 -0
|
@@ -42,7 +42,8 @@ var GlobalComment = function GlobalComment(_ref) {
|
|
|
42
42
|
useEffect(function () {
|
|
43
43
|
var eventBus = EventBus.getInstance();
|
|
44
44
|
var unsubscribe = eventBus.subscribe('COMMENT_LIST_CLICK', function () {
|
|
45
|
-
|
|
45
|
+
setActiveComment(null);
|
|
46
|
+
setShowCommentList(!isShowCommentList);
|
|
46
47
|
});
|
|
47
48
|
return function () {
|
|
48
49
|
unsubscribe();
|
|
@@ -61,7 +62,7 @@ var GlobalComment = function GlobalComment(_ref) {
|
|
|
61
62
|
}, []);
|
|
62
63
|
if (!isShowCommentList) return null;
|
|
63
64
|
return /*#__PURE__*/React.createElement(ElementPopover, {
|
|
64
|
-
className:
|
|
65
|
+
className: "global-comments-popover"
|
|
65
66
|
}, /*#__PURE__*/React.createElement("div", {
|
|
66
67
|
ref: commentRef,
|
|
67
68
|
className: "comments-panel-wrapper"
|
|
@@ -95,11 +95,18 @@
|
|
|
95
95
|
}
|
|
96
96
|
|
|
97
97
|
.global-comments-popover .comments-panel-body__header {
|
|
98
|
+
height: 80px;
|
|
99
|
+
display: flex;
|
|
100
|
+
flex-direction: column;
|
|
101
|
+
padding: 0 16px;
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
.global-comments-popover .comments-panel-body__header .comments-types-count {
|
|
98
105
|
height: 38px;
|
|
99
106
|
display: flex;
|
|
100
107
|
justify-content: space-between;
|
|
101
108
|
align-items: center;
|
|
102
|
-
padding: 16px;
|
|
109
|
+
padding: 16px 0;
|
|
103
110
|
}
|
|
104
111
|
|
|
105
112
|
.global-comments-popover .comments-panel-body__header .comment-type {
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export var COMMENT_TYPES = {
|
|
2
|
+
all: 'All_comments',
|
|
3
|
+
resolved: 'Resolved_comments',
|
|
4
|
+
unresolved: 'Unresolved_comments'
|
|
5
|
+
};
|
|
6
|
+
export var DOWN = 'down';
|
|
7
|
+
export var UP = 'up';
|
|
8
|
+
export var FONT_SIZE_WIDTH = 15;
|
|
9
|
+
export var LINE_HEIGHT = 22;
|
|
10
|
+
export var POPOVER_ADDING_HEIGHT = 10;
|
|
11
|
+
export var COMMENT_URL_CLASSNAME = 'sdoc-comment-url';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
2
2
|
import { useEffect, useState } from 'react';
|
|
3
3
|
import { useCommentContext } from './use-comment-context';
|
|
4
|
-
import { COMMENT_TYPES } from '../
|
|
4
|
+
import { COMMENT_TYPES } from '../constants';
|
|
5
5
|
var useCommentList = function useCommentList() {
|
|
6
6
|
var _useCommentContext = useCommentContext(),
|
|
7
7
|
commentsInfo = _useCommentContext.commentsInfo;
|
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
2
|
+
import React, { useContext, useEffect, useState, useCallback } from 'react';
|
|
3
|
+
import { useTranslation } from 'react-i18next';
|
|
4
|
+
import context from '../../../context';
|
|
5
|
+
import { User } from '../../../model';
|
|
6
|
+
import toaster from '../../../components/toast';
|
|
7
|
+
import { getErrorMsg } from '../../../utils';
|
|
8
|
+
var ParticipantsContext = React.createContext(null);
|
|
9
|
+
export var ParticipantsProvider = function ParticipantsProvider(props) {
|
|
10
|
+
var isSdocRevision = context.getSetting('isSdocRevision');
|
|
11
|
+
var isPublished = context.getSetting('isPublished');
|
|
12
|
+
var _useState = useState([]),
|
|
13
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
14
|
+
participants = _useState2[0],
|
|
15
|
+
setParticipants = _useState2[1];
|
|
16
|
+
var _useTranslation = useTranslation(),
|
|
17
|
+
t = _useTranslation.t;
|
|
18
|
+
var updateLocalParticipants = useCallback(function () {
|
|
19
|
+
var added = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
20
|
+
if (!Array.isArray(added) || added.length === 0) return;
|
|
21
|
+
var newParticipants = participants.slice(0);
|
|
22
|
+
added.forEach(function (participant) {
|
|
23
|
+
var newParticipant = new User(participant);
|
|
24
|
+
if (!newParticipants.find(function (item) {
|
|
25
|
+
return item.username === newParticipant.username;
|
|
26
|
+
})) {
|
|
27
|
+
newParticipants.push(newParticipant);
|
|
28
|
+
}
|
|
29
|
+
});
|
|
30
|
+
setParticipants(newParticipants);
|
|
31
|
+
}, [participants]);
|
|
32
|
+
var addParticipants = useCallback(function (otherEmail) {
|
|
33
|
+
if (participants.find(function (participant) {
|
|
34
|
+
return participant.username === otherEmail;
|
|
35
|
+
})) return;
|
|
36
|
+
context.addParticipants([otherEmail]).then(function (res) {
|
|
37
|
+
var success = res.data.success;
|
|
38
|
+
updateLocalParticipants(success);
|
|
39
|
+
}).catch(function (error) {
|
|
40
|
+
var errorMessage = getErrorMsg(error);
|
|
41
|
+
toaster.danger(t(errorMessage));
|
|
42
|
+
});
|
|
43
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
44
|
+
}, [updateLocalParticipants, participants]);
|
|
45
|
+
var deleteParticipant = useCallback(function (email) {
|
|
46
|
+
if (!participants.find(function (participant) {
|
|
47
|
+
return participant.username === email;
|
|
48
|
+
})) return;
|
|
49
|
+
context.deleteParticipants(email).then(function (res) {
|
|
50
|
+
var newParticipants = participants.slice(0);
|
|
51
|
+
newParticipants = newParticipants.filter(function (participant) {
|
|
52
|
+
return participant.username !== email;
|
|
53
|
+
});
|
|
54
|
+
setParticipants(newParticipants);
|
|
55
|
+
}).catch(function (error) {
|
|
56
|
+
var errorMessage = getErrorMsg(error);
|
|
57
|
+
toaster.danger(t(errorMessage));
|
|
58
|
+
});
|
|
59
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
60
|
+
}, [participants]);
|
|
61
|
+
useEffect(function () {
|
|
62
|
+
if (isSdocRevision && isPublished) return;
|
|
63
|
+
context.listParticipants().then(function (res) {
|
|
64
|
+
var participants = res.data.participant_list;
|
|
65
|
+
updateLocalParticipants(participants);
|
|
66
|
+
}).catch(function (error) {});
|
|
67
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
68
|
+
}, []);
|
|
69
|
+
return /*#__PURE__*/React.createElement(ParticipantsContext.Provider, {
|
|
70
|
+
value: {
|
|
71
|
+
participants: participants,
|
|
72
|
+
addParticipants: addParticipants,
|
|
73
|
+
deleteParticipant: deleteParticipant
|
|
74
|
+
}
|
|
75
|
+
}, props.children);
|
|
76
|
+
};
|
|
77
|
+
export var useParticipantsContext = function useParticipantsContext() {
|
|
78
|
+
var context = useContext(ParticipantsContext);
|
|
79
|
+
if (!context) {
|
|
80
|
+
throw new Error('\'ParticipantsContext\' is null');
|
|
81
|
+
}
|
|
82
|
+
var participants = context.participants,
|
|
83
|
+
addParticipants = context.addParticipants,
|
|
84
|
+
deleteParticipant = context.deleteParticipant;
|
|
85
|
+
return {
|
|
86
|
+
participants: participants,
|
|
87
|
+
addParticipants: addParticipants,
|
|
88
|
+
deleteParticipant: deleteParticipant
|
|
89
|
+
};
|
|
90
|
+
};
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { useCommentContext } from './hooks/use-comment-context';
|
|
3
|
-
import { EditorComment, GlobalComment } from './
|
|
3
|
+
import { EditorComment, GlobalComment } from './components';
|
|
4
|
+
import { ParticipantsProvider } from './hooks/use-participants';
|
|
4
5
|
var CommentWrapper = function CommentWrapper() {
|
|
5
6
|
var _useCommentContext = useCommentContext(),
|
|
6
7
|
commentsInfo = _useCommentContext.commentsInfo;
|
|
7
8
|
if (commentsInfo.isFetching) {
|
|
8
9
|
return null;
|
|
9
10
|
}
|
|
10
|
-
return /*#__PURE__*/React.createElement(
|
|
11
|
+
return /*#__PURE__*/React.createElement(ParticipantsProvider, null, /*#__PURE__*/React.createElement(EditorComment, null), /*#__PURE__*/React.createElement(GlobalComment, null));
|
|
11
12
|
};
|
|
12
13
|
export default CommentWrapper;
|
|
@@ -0,0 +1,206 @@
|
|
|
1
|
+
import _createClass from "@babel/runtime/helpers/esm/createClass";
|
|
2
|
+
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
|
|
3
|
+
import { getEventTransfer } from '../../../utils';
|
|
4
|
+
import { COMMENT_URL_CLASSNAME } from '../constants';
|
|
5
|
+
import { KeyCodes } from '../../../constants';
|
|
6
|
+
export var searchCollaborators = function searchCollaborators(collaborators, searchValue) {
|
|
7
|
+
var validSearchValue = searchValue ? searchValue.trim().toLowerCase() : '';
|
|
8
|
+
var validCollaborators = Array.isArray(collaborators) && collaborators.length > 0 ? collaborators : [];
|
|
9
|
+
if (!validSearchValue) return validCollaborators;
|
|
10
|
+
return validCollaborators.filter(function (collaborator) {
|
|
11
|
+
var name = collaborator.name,
|
|
12
|
+
_collaborator$name_pi = collaborator.name_pinyin,
|
|
13
|
+
name_pinyin = _collaborator$name_pi === void 0 ? '' : _collaborator$name_pi;
|
|
14
|
+
if (name.toString().toLowerCase().indexOf(validSearchValue) > -1) return true;
|
|
15
|
+
if (!name_pinyin) return false;
|
|
16
|
+
var validNamePinyin = name_pinyin.toString().toLowerCase();
|
|
17
|
+
var validSearchPinyinValue = validSearchValue.replace(/ |'/g, '');
|
|
18
|
+
|
|
19
|
+
// complete: For example, seatable can be retrieved when searching for sea.
|
|
20
|
+
if (validNamePinyin.indexOf(validSearchPinyinValue) > -1) return true;
|
|
21
|
+
if (validNamePinyin.replace(/'/g, '').indexOf(validSearchPinyinValue) > -1) return true;
|
|
22
|
+
var validNamePinyinList = validNamePinyin.split('\'');
|
|
23
|
+
// acronym: For example, sea table can be retrieved when searching for st.
|
|
24
|
+
var namePinyinAcronym = validNamePinyinList.map(function (item) {
|
|
25
|
+
return item && item.trim() ? item.trim().slice(0, 1) : '';
|
|
26
|
+
});
|
|
27
|
+
if (namePinyinAcronym.join('').indexOf(validSearchPinyinValue) > -1) return true;
|
|
28
|
+
return false;
|
|
29
|
+
});
|
|
30
|
+
};
|
|
31
|
+
|
|
32
|
+
// Mailto, file, tel, callto, sms, cid, xmpp, etc. are not support
|
|
33
|
+
var ALLOWED_URL_REG = /((http|https):\/\/[-A-Za-z0-9+&@#/%?=~_|!:,.;]+[-A-Za-z0-9+&@#/%=~_|])/g;
|
|
34
|
+
export var textToHtml = function textToHtml(text) {
|
|
35
|
+
if (!text) return '';
|
|
36
|
+
return text.replace(ALLOWED_URL_REG, '<a href="$1" target="_blank" class=' + COMMENT_URL_CLASSNAME + '>$1</a>');
|
|
37
|
+
};
|
|
38
|
+
export var convertComment = function convertComment(value) {
|
|
39
|
+
return value.replaceAll('<', '<').replaceAll('>', '>');
|
|
40
|
+
};
|
|
41
|
+
export var checkMentionOperation = function checkMentionOperation(event) {
|
|
42
|
+
var keyCode = event.keyCode;
|
|
43
|
+
var Escape = KeyCodes.Escape,
|
|
44
|
+
LeftArrow = KeyCodes.LeftArrow,
|
|
45
|
+
RightArrow = KeyCodes.RightArrow;
|
|
46
|
+
if (keyCode === Escape || keyCode === LeftArrow || keyCode === RightArrow) return false;
|
|
47
|
+
return true;
|
|
48
|
+
};
|
|
49
|
+
var CommentUtilities = /*#__PURE__*/_createClass(function CommentUtilities() {
|
|
50
|
+
var _this = this;
|
|
51
|
+
_classCallCheck(this, CommentUtilities);
|
|
52
|
+
this.onInsertElement = function (_ref) {
|
|
53
|
+
var commentRef = _ref.commentRef,
|
|
54
|
+
selection = _ref.selection,
|
|
55
|
+
range = _ref.range,
|
|
56
|
+
content = _ref.content,
|
|
57
|
+
nodeType = _ref.nodeType;
|
|
58
|
+
if (range) {
|
|
59
|
+
selection.removeAllRanges();
|
|
60
|
+
selection.addRange(range);
|
|
61
|
+
}
|
|
62
|
+
return _this.createHtmlElement({
|
|
63
|
+
commentRef: commentRef,
|
|
64
|
+
selection: selection,
|
|
65
|
+
range: range,
|
|
66
|
+
content: content,
|
|
67
|
+
nodeType: nodeType
|
|
68
|
+
});
|
|
69
|
+
};
|
|
70
|
+
this.getHtmlElement = function (nodeType, content) {
|
|
71
|
+
switch (nodeType) {
|
|
72
|
+
case 'image':
|
|
73
|
+
{
|
|
74
|
+
var parentElement = document.createElement('div');
|
|
75
|
+
parentElement.className = 'image-container';
|
|
76
|
+
parentElement.contentEditable = 'false';
|
|
77
|
+
var imageContainer = document.createElement('img');
|
|
78
|
+
imageContainer.src = content;
|
|
79
|
+
imageContainer.height = 60;
|
|
80
|
+
parentElement.appendChild(imageContainer);
|
|
81
|
+
return parentElement.outerHTML;
|
|
82
|
+
}
|
|
83
|
+
default:
|
|
84
|
+
{
|
|
85
|
+
return '';
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
};
|
|
89
|
+
this.createHtmlElement = function (_ref2) {
|
|
90
|
+
var commentRef = _ref2.commentRef,
|
|
91
|
+
selection = _ref2.selection,
|
|
92
|
+
range = _ref2.range,
|
|
93
|
+
content = _ref2.content,
|
|
94
|
+
nodeType = _ref2.nodeType;
|
|
95
|
+
var spanNode1, spanNode2, imageContainer;
|
|
96
|
+
if (nodeType === 'image') {
|
|
97
|
+
spanNode1 = document.createElement('div');
|
|
98
|
+
spanNode1.className = 'image-container';
|
|
99
|
+
spanNode1.contentEditable = 'false';
|
|
100
|
+
imageContainer = document.createElement('img');
|
|
101
|
+
imageContainer.src = content;
|
|
102
|
+
imageContainer.height = 60;
|
|
103
|
+
spanNode1.appendChild(imageContainer);
|
|
104
|
+
spanNode2 = document.createElement('span');
|
|
105
|
+
spanNode2.innerHTML = ' ';
|
|
106
|
+
}
|
|
107
|
+
if (nodeType === 'collaborator') {
|
|
108
|
+
spanNode1 = document.createElement('span');
|
|
109
|
+
spanNode2 = document.createElement('span');
|
|
110
|
+
spanNode1.className = 'at-text';
|
|
111
|
+
spanNode1.innerHTML = "@".concat(content.name);
|
|
112
|
+
spanNode2.innerHTML = ' ';
|
|
113
|
+
}
|
|
114
|
+
var frag = document.createDocumentFragment();
|
|
115
|
+
frag.appendChild(spanNode1);
|
|
116
|
+
var lastNode = frag.appendChild(spanNode2);
|
|
117
|
+
if (range) {
|
|
118
|
+
range.insertNode(frag);
|
|
119
|
+
} else {
|
|
120
|
+
commentRef.current.appendChild(frag);
|
|
121
|
+
range = selection.getRangeAt(0);
|
|
122
|
+
}
|
|
123
|
+
if (lastNode) {
|
|
124
|
+
range = range.cloneRange();
|
|
125
|
+
range.setStartAfter(lastNode);
|
|
126
|
+
range.collapse(true);
|
|
127
|
+
selection.removeAllRanges();
|
|
128
|
+
selection.addRange(range);
|
|
129
|
+
}
|
|
130
|
+
return range;
|
|
131
|
+
};
|
|
132
|
+
this.onSelectParticipant = function (_ref3) {
|
|
133
|
+
var selection = _ref3.selection,
|
|
134
|
+
range = _ref3.range,
|
|
135
|
+
participant = _ref3.participant,
|
|
136
|
+
callBack = _ref3.callBack,
|
|
137
|
+
commentRef = _ref3.commentRef;
|
|
138
|
+
if (range) {
|
|
139
|
+
// delete '@xxx';
|
|
140
|
+
selection.removeAllRanges();
|
|
141
|
+
selection.addRange(range);
|
|
142
|
+
var textNode = range.startContainer;
|
|
143
|
+
var atIndex = _this.getAtIndexWithAnchorPosition(range.startOffset, textNode.data);
|
|
144
|
+
if (atIndex > -1) {
|
|
145
|
+
range.setStart(textNode, atIndex);
|
|
146
|
+
range.setEnd(textNode, range.endOffset);
|
|
147
|
+
range.deleteContents();
|
|
148
|
+
}
|
|
149
|
+
}
|
|
150
|
+
var newRange = _this.createHtmlElement({
|
|
151
|
+
selection: selection,
|
|
152
|
+
range: range,
|
|
153
|
+
content: participant,
|
|
154
|
+
nodeType: 'collaborator',
|
|
155
|
+
commentRef: commentRef
|
|
156
|
+
});
|
|
157
|
+
if (callBack) {
|
|
158
|
+
callBack();
|
|
159
|
+
}
|
|
160
|
+
if (commentRef.current) {
|
|
161
|
+
commentRef.current.focus();
|
|
162
|
+
}
|
|
163
|
+
return newRange;
|
|
164
|
+
};
|
|
165
|
+
/**
|
|
166
|
+
* get the index of '@' from anchor position.
|
|
167
|
+
* @param {*} anchorPosition '@text|anchor position|'
|
|
168
|
+
* @param {*} text '@abc'
|
|
169
|
+
* @returns index
|
|
170
|
+
* e.g. '@abc|anchor position|' // 0
|
|
171
|
+
* '@123 @|anchor position| @abc' // 5
|
|
172
|
+
*/
|
|
173
|
+
this.getAtIndexWithAnchorPosition = function (anchorPosition, text) {
|
|
174
|
+
var atIndex = -1;
|
|
175
|
+
for (var i = anchorPosition - 1; i > -1; i--) {
|
|
176
|
+
if (text[i] === '@') {
|
|
177
|
+
atIndex = i;
|
|
178
|
+
break;
|
|
179
|
+
}
|
|
180
|
+
}
|
|
181
|
+
return atIndex;
|
|
182
|
+
};
|
|
183
|
+
this.onPaste = function (event, callBack) {
|
|
184
|
+
event.stopPropagation();
|
|
185
|
+
var cliperData = getEventTransfer(event);
|
|
186
|
+
if (cliperData.files) {
|
|
187
|
+
var file = cliperData.files[0];
|
|
188
|
+
var isImage = /image/i.test(file.type);
|
|
189
|
+
if (isImage) {
|
|
190
|
+
event.preventDefault();
|
|
191
|
+
if (callBack) {
|
|
192
|
+
callBack(cliperData.files);
|
|
193
|
+
}
|
|
194
|
+
}
|
|
195
|
+
} else {
|
|
196
|
+
event.preventDefault();
|
|
197
|
+
var text = cliperData.text;
|
|
198
|
+
if (document.queryCommandSupported('insertText')) {
|
|
199
|
+
document.execCommand('insertText', false, text);
|
|
200
|
+
} else {
|
|
201
|
+
document.execCommand('paste', false, text);
|
|
202
|
+
}
|
|
203
|
+
}
|
|
204
|
+
};
|
|
205
|
+
});
|
|
206
|
+
export { CommentUtilities };
|
|
@@ -18,6 +18,7 @@ import { ColorProvider } from '../hooks/use-color-context';
|
|
|
18
18
|
import { HeaderToolbar } from '../extension';
|
|
19
19
|
import ReadOnlyArticle from '../views/readonly-article';
|
|
20
20
|
import { isMobile } from '../../utils';
|
|
21
|
+
import { CollaboratorsProvider } from '../../hooks';
|
|
21
22
|
var SdocEditor = forwardRef(function (_ref, ref) {
|
|
22
23
|
var document = _ref.document,
|
|
23
24
|
isReloading = _ref.isReloading;
|
|
@@ -115,7 +116,7 @@ var SdocEditor = forwardRef(function (_ref, ref) {
|
|
|
115
116
|
}
|
|
116
117
|
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(EditorContainer, {
|
|
117
118
|
editor: editor
|
|
118
|
-
}, /*#__PURE__*/React.createElement(ColorProvider, null, /*#__PURE__*/React.createElement(HeaderToolbar, {
|
|
119
|
+
}, /*#__PURE__*/React.createElement(CollaboratorsProvider, null, /*#__PURE__*/React.createElement(ColorProvider, null, /*#__PURE__*/React.createElement(HeaderToolbar, {
|
|
119
120
|
editor: editor
|
|
120
121
|
}), /*#__PURE__*/React.createElement(EditorContent, {
|
|
121
122
|
docValue: slateValue,
|
|
@@ -124,7 +125,7 @@ var SdocEditor = forwardRef(function (_ref, ref) {
|
|
|
124
125
|
editor: editor,
|
|
125
126
|
slateValue: slateValue,
|
|
126
127
|
updateSlateValue: _setSlateValue
|
|
127
|
-
})))), /*#__PURE__*/React.createElement(InsertElementDialog, {
|
|
128
|
+
}))))), /*#__PURE__*/React.createElement(InsertElementDialog, {
|
|
128
129
|
editor: editor
|
|
129
130
|
}));
|
|
130
131
|
});
|
|
@@ -23,12 +23,12 @@ var LinkHover = function LinkHover(_ref) {
|
|
|
23
23
|
return /*#__PURE__*/React.createElement(React.Fragment, null, createPortal( /*#__PURE__*/React.createElement("div", {
|
|
24
24
|
id: "link-op-menu",
|
|
25
25
|
className: "link-op-menu",
|
|
26
|
-
style: menuPosition
|
|
27
|
-
onMouseDown: onMouseDown
|
|
26
|
+
style: menuPosition
|
|
28
27
|
}, /*#__PURE__*/React.createElement("span", {
|
|
29
28
|
target: "_blank",
|
|
30
29
|
rel: "noopener noreferrer",
|
|
31
|
-
className: "link-op-menu-link"
|
|
30
|
+
className: "link-op-menu-link",
|
|
31
|
+
onMouseDown: onMouseDown
|
|
32
32
|
}, t('Open_link')), /*#__PURE__*/React.createElement("div", {
|
|
33
33
|
className: "link-op-icons d-flex"
|
|
34
34
|
}, /*#__PURE__*/React.createElement("span", {
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
.sdoc-editor-page-header .doc-info {
|
|
2
|
+
display: flex;
|
|
3
|
+
align-items: center;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
.sdoc-editor-page-header .doc-info .doc-name {
|
|
7
|
+
font-size: 18px;
|
|
8
|
+
font-weight: 700;
|
|
9
|
+
color: #212529;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
.sdoc-editor-page-header .doc-info .doc-icon {
|
|
13
|
+
margin-left: 0.5rem;
|
|
14
|
+
color: #999;
|
|
15
|
+
cursor: pointer;
|
|
16
|
+
font-size: 14px;
|
|
17
|
+
line-height: 1;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
.sdoc-editor-page-header .doc-info .doc-icon:hover {
|
|
21
|
+
margin-left: 0.5rem;
|
|
22
|
+
color: #333;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
.sdoc-editor-page-header .doc-info .sdoc-link {
|
|
26
|
+
font-size: 14px;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
.sdoc-editor-page-header .doc-state {
|
|
30
|
+
font-size: 0.8125rem;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.sdoc-editor-page-header .doc-info .sdoc-revision-avatar {
|
|
34
|
+
width: 44px;
|
|
35
|
+
margin-right: 6px;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
.sdoc-editor-page-header .sdoc-revision-info .sdoc-revision-avatar {
|
|
39
|
+
width: 44px;
|
|
40
|
+
height: 44px;
|
|
41
|
+
margin-right: 6px;
|
|
42
|
+
overflow: hidden;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
.sdoc-editor-page-header .sdoc-revision-avatar img {
|
|
46
|
+
height: 100%;
|
|
47
|
+
width: 100%;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
.sdoc-editor-page-header .sdoc-revision-info .sdoc-revision-detail {
|
|
51
|
+
display: flex;
|
|
52
|
+
flex-direction: column;
|
|
53
|
+
}
|
|
@@ -6,6 +6,8 @@ import { EventBus } from '../../basic-sdk';
|
|
|
6
6
|
import { EXTERNAL_EVENT } from '../../constants';
|
|
7
7
|
import { DateUtils } from '../../utils';
|
|
8
8
|
import DraftDropdown from '../draft-dropdown';
|
|
9
|
+
import RevisionAvatar from '../../assets/images/revision-avatar.png';
|
|
10
|
+
import './index.css';
|
|
9
11
|
var DocInfo = function DocInfo(_ref) {
|
|
10
12
|
var t = _ref.t,
|
|
11
13
|
isStarred = _ref.isStarred,
|
|
@@ -50,7 +52,14 @@ var DocInfo = function DocInfo(_ref) {
|
|
|
50
52
|
var revisionId = context.getSetting('revisionId');
|
|
51
53
|
var isPublished = context.getSetting('isPublished');
|
|
52
54
|
return /*#__PURE__*/React.createElement("div", {
|
|
53
|
-
className: "
|
|
55
|
+
className: "sdoc-revision-info doc-info"
|
|
56
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
57
|
+
className: "sdoc-revision-avatar"
|
|
58
|
+
}, /*#__PURE__*/React.createElement("img", {
|
|
59
|
+
src: RevisionAvatar,
|
|
60
|
+
alt: ""
|
|
61
|
+
})), /*#__PURE__*/React.createElement("div", {
|
|
62
|
+
className: "sdoc-revision-detail"
|
|
54
63
|
}, /*#__PURE__*/React.createElement("div", {
|
|
55
64
|
className: "doc-name-container d-flex align-items-center justify-content-start w-100"
|
|
56
65
|
}, /*#__PURE__*/React.createElement("div", {
|
|
@@ -65,6 +74,6 @@ var DocInfo = function DocInfo(_ref) {
|
|
|
65
74
|
className: "doc-state"
|
|
66
75
|
}, /*#__PURE__*/React.createElement("span", {
|
|
67
76
|
className: "mr-2"
|
|
68
|
-
}, t('Created_at')), /*#__PURE__*/React.createElement("span", null, DateUtils.format(revisionCreatedAt, 'YYYY-MM-DD HH:MM'))));
|
|
77
|
+
}, t('Created_at')), /*#__PURE__*/React.createElement("span", null, DateUtils.format(revisionCreatedAt, 'YYYY-MM-DD HH:MM')))));
|
|
69
78
|
};
|
|
70
79
|
export default withTranslation('sdoc-editor')(DocInfo);
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
|
|
2
|
+
import _createClass from "@babel/runtime/helpers/esm/createClass";
|
|
3
|
+
import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
4
|
+
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
|
|
5
|
+
import React from 'react';
|
|
6
|
+
import ReactDOM from 'react-dom';
|
|
7
|
+
var modalRoot = document.getElementById('modal-wrapper');
|
|
8
|
+
var ModalPortal = /*#__PURE__*/function (_React$Component) {
|
|
9
|
+
_inherits(ModalPortal, _React$Component);
|
|
10
|
+
var _super = _createSuper(ModalPortal);
|
|
11
|
+
function ModalPortal(props) {
|
|
12
|
+
var _this;
|
|
13
|
+
_classCallCheck(this, ModalPortal);
|
|
14
|
+
_this = _super.call(this, props);
|
|
15
|
+
_this.el = document.createElement('div');
|
|
16
|
+
return _this;
|
|
17
|
+
}
|
|
18
|
+
_createClass(ModalPortal, [{
|
|
19
|
+
key: "componentDidMount",
|
|
20
|
+
value: function componentDidMount() {
|
|
21
|
+
modalRoot.appendChild(this.el);
|
|
22
|
+
}
|
|
23
|
+
}, {
|
|
24
|
+
key: "componentWillUnmount",
|
|
25
|
+
value: function componentWillUnmount() {
|
|
26
|
+
modalRoot.removeChild(this.el);
|
|
27
|
+
}
|
|
28
|
+
}, {
|
|
29
|
+
key: "render",
|
|
30
|
+
value: function render() {
|
|
31
|
+
return ReactDOM.createPortal(this.props.children, this.el);
|
|
32
|
+
}
|
|
33
|
+
}]);
|
|
34
|
+
return ModalPortal;
|
|
35
|
+
}(React.Component);
|
|
36
|
+
export default ModalPortal;
|
package/dist/constants/index.js
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
2
|
var _TIP_TITLE, _TIP_CONTENT;
|
|
3
|
+
import KeyCodes from './key-codes';
|
|
4
|
+
import * as TransferTypes from './transfer-types';
|
|
3
5
|
export var REVISION_FIRST_LOAD_KEY = 'first-load';
|
|
4
6
|
export var REVISION_FIRST_LOAD_VALUE = '1';
|
|
5
7
|
export var EXTERNAL_EVENT = {
|
|
@@ -27,4 +29,5 @@ export var TIP_TYPE = {
|
|
|
27
29
|
DELETE_REVISION: 'delete_revision'
|
|
28
30
|
};
|
|
29
31
|
export var TIP_TITLE = (_TIP_TITLE = {}, _defineProperty(_TIP_TITLE, TIP_TYPE.DELETE_NO_CHANGES_REVISION, 'Tip'), _defineProperty(_TIP_TITLE, TIP_TYPE.MERGE, 'Tip'), _defineProperty(_TIP_TITLE, TIP_TYPE.HAS_CONFLICT_BEFORE_PUBLISH, 'Tip'), _defineProperty(_TIP_TITLE, TIP_TYPE.HAS_BEEN_PUBLISHED, 'Tip'), _defineProperty(_TIP_TITLE, TIP_TYPE.HAS_BEEN_REPLACED, 'Tip'), _defineProperty(_TIP_TITLE, TIP_TYPE.HAS_CONFLICT_BEFORE_VIEW_CHANGES, 'Tip'), _defineProperty(_TIP_TITLE, TIP_TYPE.HAS_BEEN_REMOVED, 'Tip'), _defineProperty(_TIP_TITLE, TIP_TYPE.CHECKING, 'Tip'), _defineProperty(_TIP_TITLE, TIP_TYPE.PUBLISHING, 'Tip'), _defineProperty(_TIP_TITLE, TIP_TYPE.DELETE_REVISION, 'Delete_revision'), _TIP_TITLE);
|
|
30
|
-
export var TIP_CONTENT = (_TIP_CONTENT = {}, _defineProperty(_TIP_CONTENT, TIP_TYPE.DELETE_NO_CHANGES_REVISION, 'Rebase_delete_no_change_revision_tip'), _defineProperty(_TIP_CONTENT, TIP_TYPE.MERGE, 'Merge_tip'), _defineProperty(_TIP_CONTENT, TIP_TYPE.HAS_CONFLICT_BEFORE_PUBLISH, 'Has_conflict_before_publish_tip'), _defineProperty(_TIP_CONTENT, TIP_TYPE.HAS_BEEN_PUBLISHED, 'Has_been_published_tip'), _defineProperty(_TIP_CONTENT, TIP_TYPE.HAS_BEEN_REPLACED, 'Has_been_replaced_tip'), _defineProperty(_TIP_CONTENT, TIP_TYPE.HAS_CONFLICT_BEFORE_VIEW_CHANGES, 'Has_conflict_before_view_changes_tip'), _defineProperty(_TIP_CONTENT, TIP_TYPE.HAS_BEEN_REMOVED, 'Has_been_removed_tip'), _defineProperty(_TIP_CONTENT, TIP_TYPE.CHECKING, 'Checking'), _defineProperty(_TIP_CONTENT, TIP_TYPE.PUBLISHING, 'Publishing'), _defineProperty(_TIP_CONTENT, TIP_TYPE.DELETE_REVISION, 'Delete_tip'), _TIP_CONTENT);
|
|
32
|
+
export var TIP_CONTENT = (_TIP_CONTENT = {}, _defineProperty(_TIP_CONTENT, TIP_TYPE.DELETE_NO_CHANGES_REVISION, 'Rebase_delete_no_change_revision_tip'), _defineProperty(_TIP_CONTENT, TIP_TYPE.MERGE, 'Merge_tip'), _defineProperty(_TIP_CONTENT, TIP_TYPE.HAS_CONFLICT_BEFORE_PUBLISH, 'Has_conflict_before_publish_tip'), _defineProperty(_TIP_CONTENT, TIP_TYPE.HAS_BEEN_PUBLISHED, 'Has_been_published_tip'), _defineProperty(_TIP_CONTENT, TIP_TYPE.HAS_BEEN_REPLACED, 'Has_been_replaced_tip'), _defineProperty(_TIP_CONTENT, TIP_TYPE.HAS_CONFLICT_BEFORE_VIEW_CHANGES, 'Has_conflict_before_view_changes_tip'), _defineProperty(_TIP_CONTENT, TIP_TYPE.HAS_BEEN_REMOVED, 'Has_been_removed_tip'), _defineProperty(_TIP_CONTENT, TIP_TYPE.CHECKING, 'Checking'), _defineProperty(_TIP_CONTENT, TIP_TYPE.PUBLISHING, 'Publishing'), _defineProperty(_TIP_CONTENT, TIP_TYPE.DELETE_REVISION, 'Delete_tip'), _TIP_CONTENT);
|
|
33
|
+
export { KeyCodes, TransferTypes };
|
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
module.exports = {
|
|
2
|
+
Backspace: 8,
|
|
3
|
+
Tab: 9,
|
|
4
|
+
Enter: 13,
|
|
5
|
+
Shift: 16,
|
|
6
|
+
Ctrl: 17,
|
|
7
|
+
Alt: 18,
|
|
8
|
+
PauseBreak: 19,
|
|
9
|
+
CapsLock: 20,
|
|
10
|
+
Escape: 27,
|
|
11
|
+
Esc: 27,
|
|
12
|
+
Space: 32,
|
|
13
|
+
PageUp: 33,
|
|
14
|
+
PageDown: 34,
|
|
15
|
+
End: 35,
|
|
16
|
+
Home: 36,
|
|
17
|
+
LeftArrow: 37,
|
|
18
|
+
UpArrow: 38,
|
|
19
|
+
RightArrow: 39,
|
|
20
|
+
DownArrow: 40,
|
|
21
|
+
Insert: 45,
|
|
22
|
+
Delete: 46,
|
|
23
|
+
0: 48,
|
|
24
|
+
1: 49,
|
|
25
|
+
2: 50,
|
|
26
|
+
3: 51,
|
|
27
|
+
4: 52,
|
|
28
|
+
5: 53,
|
|
29
|
+
6: 54,
|
|
30
|
+
7: 55,
|
|
31
|
+
8: 56,
|
|
32
|
+
9: 57,
|
|
33
|
+
a: 65,
|
|
34
|
+
b: 66,
|
|
35
|
+
c: 67,
|
|
36
|
+
d: 68,
|
|
37
|
+
e: 69,
|
|
38
|
+
f: 70,
|
|
39
|
+
g: 71,
|
|
40
|
+
h: 72,
|
|
41
|
+
i: 73,
|
|
42
|
+
j: 74,
|
|
43
|
+
k: 75,
|
|
44
|
+
l: 76,
|
|
45
|
+
m: 77,
|
|
46
|
+
n: 78,
|
|
47
|
+
o: 79,
|
|
48
|
+
p: 80,
|
|
49
|
+
q: 81,
|
|
50
|
+
r: 82,
|
|
51
|
+
s: 83,
|
|
52
|
+
t: 84,
|
|
53
|
+
u: 85,
|
|
54
|
+
v: 86,
|
|
55
|
+
w: 87,
|
|
56
|
+
x: 88,
|
|
57
|
+
y: 89,
|
|
58
|
+
z: 90,
|
|
59
|
+
LeftWindowKey: 91,
|
|
60
|
+
RightWindowKey: 92,
|
|
61
|
+
SelectKey: 93,
|
|
62
|
+
NumPad0: 96,
|
|
63
|
+
NumPad1: 97,
|
|
64
|
+
NumPad2: 98,
|
|
65
|
+
NumPad3: 99,
|
|
66
|
+
NumPad4: 100,
|
|
67
|
+
NumPad5: 101,
|
|
68
|
+
NumPad6: 102,
|
|
69
|
+
NumPad7: 103,
|
|
70
|
+
NumPad8: 104,
|
|
71
|
+
NumPad9: 105,
|
|
72
|
+
Multiply: 106,
|
|
73
|
+
Add: 107,
|
|
74
|
+
Subtract: 109,
|
|
75
|
+
DecimalPoint: 110,
|
|
76
|
+
Divide: 111,
|
|
77
|
+
F1: 112,
|
|
78
|
+
F2: 113,
|
|
79
|
+
F3: 114,
|
|
80
|
+
F4: 115,
|
|
81
|
+
F5: 116,
|
|
82
|
+
F6: 117,
|
|
83
|
+
F7: 118,
|
|
84
|
+
F8: 119,
|
|
85
|
+
F9: 120,
|
|
86
|
+
F10: 121,
|
|
87
|
+
F12: 123,
|
|
88
|
+
NumLock: 144,
|
|
89
|
+
ScrollLock: 145,
|
|
90
|
+
SemiColon: 186,
|
|
91
|
+
EqualSign: 187,
|
|
92
|
+
Comma: 188,
|
|
93
|
+
Dash: 189,
|
|
94
|
+
Period: 190,
|
|
95
|
+
ForwardSlash: 191,
|
|
96
|
+
GraveAccent: 192,
|
|
97
|
+
OpenBracket: 219,
|
|
98
|
+
BackSlash: 220,
|
|
99
|
+
CloseBracket: 221,
|
|
100
|
+
SingleQuote: 222,
|
|
101
|
+
ChineseInputMethod: 229
|
|
102
|
+
};
|