@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.
Files changed (68) hide show
  1. package/dist/api/seafile-api.js +36 -2
  2. package/dist/assets/css/simple-editor.css +0 -32
  3. package/dist/assets/images/revision-avatar.png +0 -0
  4. package/dist/basic-sdk/assets/css/textlink-hovermenu.css +1 -0
  5. package/dist/basic-sdk/comment/components/comment-all-participants/index.css +83 -0
  6. package/dist/basic-sdk/comment/components/comment-all-participants/index.js +56 -0
  7. package/dist/basic-sdk/comment/components/comment-all-participants/participant-avatar.js +35 -0
  8. package/dist/basic-sdk/comment/{comment → components}/comment-editor.js +18 -36
  9. package/dist/basic-sdk/comment/components/comment-input/comment-participant-item.js +47 -0
  10. package/dist/basic-sdk/comment/components/comment-input/index.css +45 -0
  11. package/dist/basic-sdk/comment/components/comment-input/index.js +295 -0
  12. package/dist/basic-sdk/comment/{comment → components}/comment-item-content.js +7 -2
  13. package/dist/basic-sdk/comment/{comment → components}/comment-item-reply.js +6 -1
  14. package/dist/basic-sdk/comment/{comment → components}/comment-item-wrapper.js +3 -1
  15. package/dist/basic-sdk/comment/components/comment-participants-editor/index.css +132 -0
  16. package/dist/basic-sdk/comment/components/comment-participants-editor/index.js +67 -0
  17. package/dist/basic-sdk/comment/components/comment-participants-editor/searched-collaborators.js +53 -0
  18. package/dist/basic-sdk/comment/components/comment-participants-editor/selected-participants.js +39 -0
  19. package/dist/basic-sdk/comment/{comment → components}/global-comment-header.js +5 -6
  20. package/dist/basic-sdk/comment/{comment → components}/global-comment.js +3 -2
  21. package/dist/basic-sdk/comment/{comment → components}/style.css +8 -1
  22. package/dist/basic-sdk/comment/constants/index.js +11 -0
  23. package/dist/basic-sdk/comment/hooks/use-comment-list.js +1 -1
  24. package/dist/basic-sdk/comment/hooks/use-participants.js +90 -0
  25. package/dist/basic-sdk/comment/index.js +3 -2
  26. package/dist/basic-sdk/comment/utils/index.js +206 -0
  27. package/dist/basic-sdk/editor/sdoc-editor.js +3 -2
  28. package/dist/basic-sdk/extension/plugins/link/hover/index.js +3 -3
  29. package/dist/components/doc-info/index.css +53 -0
  30. package/dist/components/doc-info/index.js +11 -2
  31. package/dist/components/modal-portal/index.js +36 -0
  32. package/dist/constants/index.js +4 -1
  33. package/dist/constants/key-codes.js +102 -0
  34. package/dist/constants/transfer-types.js +3 -0
  35. package/dist/context.js +38 -8
  36. package/dist/hooks/index.js +3 -0
  37. package/dist/hooks/use-collaborators.js +44 -0
  38. package/dist/layout/layout.js +10 -27
  39. package/dist/model/index.js +2 -1
  40. package/dist/model/user.js +12 -0
  41. package/dist/pages/simple-editor.js +1 -1
  42. package/dist/utils/get-event-transfer.js +73 -0
  43. package/dist/utils/hotkey.js +25 -0
  44. package/dist/utils/index.js +58 -1
  45. package/package.json +1 -1
  46. package/public/locales/cs/sdoc-editor.json +6 -1
  47. package/public/locales/de/sdoc-editor.json +6 -1
  48. package/public/locales/en/sdoc-editor.json +3 -1
  49. package/public/locales/es/sdoc-editor.json +6 -1
  50. package/public/locales/fr/sdoc-editor.json +6 -1
  51. package/public/locales/it/sdoc-editor.json +6 -1
  52. package/public/locales/ru/sdoc-editor.json +6 -1
  53. package/public/locales/zh_CN/sdoc-editor.json +3 -1
  54. package/public/media/sdoc-editor-font/iconfont.eot +0 -0
  55. package/public/media/sdoc-editor-font/iconfont.svg +4 -0
  56. package/public/media/sdoc-editor-font/iconfont.ttf +0 -0
  57. package/public/media/sdoc-editor-font/iconfont.woff +0 -0
  58. package/public/media/sdoc-editor-font/iconfont.woff2 +0 -0
  59. package/public/media/sdoc-editor-font.css +14 -6
  60. /package/dist/basic-sdk/comment/{comment → components}/comment-delete-shadow.js +0 -0
  61. /package/dist/basic-sdk/comment/{comment → components}/comment-item-resolved-reply.js +0 -0
  62. /package/dist/basic-sdk/comment/{comment → components}/comment-list.css +0 -0
  63. /package/dist/basic-sdk/comment/{comment → components}/comment-list.js +0 -0
  64. /package/dist/basic-sdk/comment/{comment → components}/editor-comment.js +0 -0
  65. /package/dist/basic-sdk/comment/{comment → components}/elements-comment-count/element-comment-count.js +0 -0
  66. /package/dist/basic-sdk/comment/{comment → components}/elements-comment-count/index.css +0 -0
  67. /package/dist/basic-sdk/comment/{comment → components}/elements-comment-count/index.js +0 -0
  68. /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
- return setShowCommentList(!isShowCommentList);
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: 'global-comments-popover'
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 '../comment/global-comment-header';
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 './comment';
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(React.Fragment, null, /*#__PURE__*/React.createElement(EditorComment, null), /*#__PURE__*/React.createElement(GlobalComment, null));
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('<', '&lt;').replaceAll('>', '&gt;');
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 = '&nbsp;';
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: "doc-info d-flex flex-column align-items-start"
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;
@@ -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
+ };
@@ -0,0 +1,3 @@
1
+ export var HTML = 'text/html';
2
+ export var TEXT = 'text/plain';
3
+ export var FILES = 'files';