@seafile/sdoc-editor 0.5.10 → 0.5.12
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/basic-sdk/assets/css/sdoc-comment-editor-plugin.css +14 -2
- package/dist/basic-sdk/comment/components/comment-list.css +22 -2
- package/dist/basic-sdk/editor/sdoc-comment-editor.js +11 -2
- package/dist/basic-sdk/extension/commons/insert-element-dialog/index.js +3 -3
- package/dist/basic-sdk/extension/commons/menu/menu.css +1 -1
- package/dist/basic-sdk/extension/commons/select-file-dialog/index.js +1 -0
- package/dist/basic-sdk/extension/plugins/paragraph/render-elem.js +0 -1
- package/dist/basic-sdk/extension/plugins/table/render/index.css +4 -0
- package/dist/basic-sdk/extension/plugins/table/render/render-cell.js +7 -3
- package/dist/basic-sdk/extension/toolbar/header-toolbar/index.js +5 -3
- package/package.json +1 -1
- package/dist/basic-sdk/extension/plugins/paragraph/index.css +0 -4
|
@@ -1,7 +1,19 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
/* List */
|
|
2
|
+
.sdoc-editor-container .sdoc-comment-editor .list-container {
|
|
3
|
+
padding-left: 2em !important;
|
|
3
4
|
}
|
|
4
5
|
|
|
5
6
|
.sdoc-comment-editor .list-container li p {
|
|
6
7
|
margin: 0 !important;
|
|
7
8
|
}
|
|
9
|
+
|
|
10
|
+
/* Paragraph */
|
|
11
|
+
.sdoc-comment-editor .sdoc-comment-editor-paragraph {
|
|
12
|
+
margin: 0.8em 0 !important;
|
|
13
|
+
padding: 0 !important;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
/* Image */
|
|
17
|
+
.sdoc-comment-editor .sdoc-image-wrapper {
|
|
18
|
+
padding: 1px !important;
|
|
19
|
+
}
|
|
@@ -48,6 +48,8 @@
|
|
|
48
48
|
overflow-x: hidden;
|
|
49
49
|
overflow-y: auto;
|
|
50
50
|
margin: 0;
|
|
51
|
+
padding: 0;
|
|
52
|
+
list-style: none;
|
|
51
53
|
}
|
|
52
54
|
|
|
53
55
|
.sdoc-comment-list-container .comment-item {
|
|
@@ -85,9 +87,22 @@
|
|
|
85
87
|
word-wrap: break-word;
|
|
86
88
|
}
|
|
87
89
|
|
|
90
|
+
.comment-item .comment-content {
|
|
91
|
+
font-size: 11pt;
|
|
92
|
+
}
|
|
93
|
+
|
|
88
94
|
.comment-item .comment-content ol,
|
|
89
95
|
.comment-item .comment-content ul {
|
|
90
|
-
padding-left:
|
|
96
|
+
padding-left: 2em;
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
.comment-item .comment-content ol li p,
|
|
100
|
+
.comment-item .comment-content ul li p {
|
|
101
|
+
margin: 0;
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
.comment-item .comment-content p {
|
|
105
|
+
margin: 0.8em 0;
|
|
91
106
|
}
|
|
92
107
|
|
|
93
108
|
.sdoc-comment-list-container .comment-header .comment-author__avatar {
|
|
@@ -216,7 +231,8 @@
|
|
|
216
231
|
|
|
217
232
|
.comment-editor-wrapper .sdoc-comment-editor-wrapper .article.sdoc-comment-editor {
|
|
218
233
|
width: 365px;
|
|
219
|
-
padding:
|
|
234
|
+
padding: 8px;
|
|
235
|
+
padding-bottom: 0;
|
|
220
236
|
min-height: 130px;
|
|
221
237
|
max-height: 130px;
|
|
222
238
|
box-shadow: none;
|
|
@@ -226,6 +242,10 @@
|
|
|
226
242
|
background-color: transparent;
|
|
227
243
|
}
|
|
228
244
|
|
|
245
|
+
.article.sdoc-comment-editor :first-child {
|
|
246
|
+
padding-top: 0;
|
|
247
|
+
}
|
|
248
|
+
|
|
229
249
|
.sdoc-comment-list-container .comment-editor-wrapper {
|
|
230
250
|
display: flex;
|
|
231
251
|
flex-direction: column;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
2
|
-
import React, { useEffect, useState, useImperativeHandle, forwardRef, useMemo, useCallback } from 'react';
|
|
2
|
+
import React, { useEffect, useState, useImperativeHandle, forwardRef, useMemo, useCallback, useRef } from 'react';
|
|
3
3
|
import { Editor } from '@seafile/slate';
|
|
4
4
|
import deepCopy from 'deep-copy';
|
|
5
5
|
import context from '../../context';
|
|
@@ -23,6 +23,7 @@ const SdocCommentEditor = forwardRef((_ref, ref) => {
|
|
|
23
23
|
type
|
|
24
24
|
} = _ref;
|
|
25
25
|
const [slateValue, setSlateValue] = useState(document.children);
|
|
26
|
+
const commentEditorContainerRef = useRef(null);
|
|
26
27
|
const validEditor = propsEditor || useMemo(() => {
|
|
27
28
|
const defaultEditor = createCommentEditor();
|
|
28
29
|
const editorConfig = context.getEditorConfig();
|
|
@@ -92,12 +93,20 @@ const SdocCommentEditor = forwardRef((_ref, ref) => {
|
|
|
92
93
|
className: "h-100 w-100 d-flex align-items-center justify-content-center"
|
|
93
94
|
}, /*#__PURE__*/React.createElement(CommonLoading, null));
|
|
94
95
|
}
|
|
96
|
+
const handleFocusEditor = e => {
|
|
97
|
+
if (e.target === commentEditorContainerRef.current) {
|
|
98
|
+
const focusPoint = Editor.end(validEditor, []);
|
|
99
|
+
focusEditor(validEditor, focusPoint);
|
|
100
|
+
}
|
|
101
|
+
};
|
|
95
102
|
return /*#__PURE__*/React.createElement(EditorContainer, {
|
|
96
103
|
editor: validEditor
|
|
97
104
|
}, /*#__PURE__*/React.createElement(CollaboratorsProvider, null, /*#__PURE__*/React.createElement("div", {
|
|
98
105
|
className: "sdoc-comment-editor-wrapper"
|
|
99
106
|
}, /*#__PURE__*/React.createElement("div", {
|
|
100
|
-
|
|
107
|
+
ref: commentEditorContainerRef,
|
|
108
|
+
className: "article sdoc-comment-editor",
|
|
109
|
+
onClick: handleFocusEditor
|
|
101
110
|
}, /*#__PURE__*/React.createElement(CommentArticle, {
|
|
102
111
|
type: type,
|
|
103
112
|
editor: validEditor,
|
|
@@ -46,8 +46,7 @@ const InsertElementDialog = _ref => {
|
|
|
46
46
|
slateNode,
|
|
47
47
|
insertFileLinkCallback,
|
|
48
48
|
insertSdocFileLinkCallback,
|
|
49
|
-
isShowHistoryFiles
|
|
50
|
-
editor
|
|
49
|
+
isShowHistoryFiles
|
|
51
50
|
} = _ref2;
|
|
52
51
|
setInsertPosition(insertPosition);
|
|
53
52
|
setSlateNode(slateNode);
|
|
@@ -65,7 +64,7 @@ const InsertElementDialog = _ref => {
|
|
|
65
64
|
uploadLocalImageInputRef.current && uploadLocalImageInputRef.current.click();
|
|
66
65
|
}, 0);
|
|
67
66
|
}
|
|
68
|
-
}, [
|
|
67
|
+
}, [editor]);
|
|
69
68
|
const closeDialog = useCallback(() => {
|
|
70
69
|
setInsertPosition(INSERT_POSITION.CURRENT);
|
|
71
70
|
setSlateNode(null);
|
|
@@ -121,6 +120,7 @@ const InsertElementDialog = _ref => {
|
|
|
121
120
|
case LOCAL_IMAGE:
|
|
122
121
|
{
|
|
123
122
|
return /*#__PURE__*/React.createElement("input", {
|
|
123
|
+
onClick: e => e.stopPropagation(),
|
|
124
124
|
ref: uploadLocalImageInputRef,
|
|
125
125
|
type: "file",
|
|
126
126
|
multiple: true,
|
|
@@ -5,7 +5,6 @@ import { useSlateStatic } from '@seafile/slate-react';
|
|
|
5
5
|
import { Placeholder } from '../../core';
|
|
6
6
|
import { isEmptyNode } from './helper';
|
|
7
7
|
import { COMMENT_EDITOR } from '../../../constants';
|
|
8
|
-
import './index.css';
|
|
9
8
|
const PLACEHOLDER = 'Please_enter_text';
|
|
10
9
|
const Paragraph = _ref => {
|
|
11
10
|
let {
|
|
@@ -100,7 +100,9 @@ const TableCell = _ref => {
|
|
|
100
100
|
"cell-index": cellIndex,
|
|
101
101
|
onContextMenu: onContextMenu,
|
|
102
102
|
onMouseMove: onMouseMove
|
|
103
|
-
}),
|
|
103
|
+
}), /*#__PURE__*/React.createElement("div", {
|
|
104
|
+
className: "sdoc-cell-container"
|
|
105
|
+
}, children));
|
|
104
106
|
};
|
|
105
107
|
function renderTableCell(props) {
|
|
106
108
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
@@ -121,7 +123,7 @@ function renderTableCell(props) {
|
|
|
121
123
|
const cellIndex = cellPath[pathLength - 1];
|
|
122
124
|
|
|
123
125
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
124
|
-
const highlightClass = useMemo(() => getHighlightClass(editor, cellPath), []);
|
|
126
|
+
const highlightClass = useMemo(() => getHighlightClass(editor, cellPath), [cellPath, editor]);
|
|
125
127
|
|
|
126
128
|
// const cellValue = element;
|
|
127
129
|
let style = attributes.style || {};
|
|
@@ -149,7 +151,9 @@ function renderTableCell(props) {
|
|
|
149
151
|
style: _objectSpread(_objectSpread({}, element.style), style),
|
|
150
152
|
className: classnames('table-cell', highlightClass, attributes.className),
|
|
151
153
|
"data-id": element.id
|
|
152
|
-
}),
|
|
154
|
+
}), /*#__PURE__*/React.createElement("div", {
|
|
155
|
+
className: "sdoc-cell-container"
|
|
156
|
+
}, children));
|
|
153
157
|
}
|
|
154
158
|
return /*#__PURE__*/React.createElement(TableCell, props);
|
|
155
159
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import React, { useMemo } from 'react';
|
|
2
2
|
import useSelectionUpdate from '../../../hooks/use-selection-update';
|
|
3
|
-
import { ORDERED_LIST, UNORDERED_LIST } from '../../constants';
|
|
3
|
+
import { ORDERED_LIST, TABLE_CELL, UNORDERED_LIST } from '../../constants';
|
|
4
4
|
import { MenuGroup } from '../../commons';
|
|
5
5
|
import QuoteMenu from '../../plugins/blockquote/menu';
|
|
6
6
|
import ListMenu from '../../plugins/list/menu';
|
|
@@ -15,12 +15,14 @@ import InsertToolbar from './insert-toolbar';
|
|
|
15
15
|
import ActiveTableMenu from '../../plugins/table/menu/active-table-menu';
|
|
16
16
|
import CalloutMenu from '../../plugins/callout/menu';
|
|
17
17
|
import SearchReplaceMenu from '../../plugins/search-replace/menu';
|
|
18
|
+
import { getSelectedNodeByType } from '../../core';
|
|
18
19
|
const HeaderToolbar = _ref => {
|
|
19
20
|
let {
|
|
20
21
|
editor,
|
|
21
22
|
readonly
|
|
22
23
|
} = _ref;
|
|
23
24
|
useSelectionUpdate();
|
|
25
|
+
const isSelectTableCell = useMemo(() => getSelectedNodeByType(editor, TABLE_CELL), [editor]);
|
|
24
26
|
return /*#__PURE__*/React.createElement("div", {
|
|
25
27
|
className: "sdoc-editor-toolbar"
|
|
26
28
|
}, /*#__PURE__*/React.createElement(MenuGroup, null, /*#__PURE__*/React.createElement(HistoryMenu, {
|
|
@@ -41,7 +43,7 @@ const HeaderToolbar = _ref => {
|
|
|
41
43
|
}), /*#__PURE__*/React.createElement(TextStyleMenuList, {
|
|
42
44
|
editor: editor,
|
|
43
45
|
readonly: readonly
|
|
44
|
-
})), /*#__PURE__*/React.createElement(MenuGroup, null, /*#__PURE__*/React.createElement(QuoteMenu, {
|
|
46
|
+
})), !isSelectTableCell && /*#__PURE__*/React.createElement(MenuGroup, null, /*#__PURE__*/React.createElement(QuoteMenu, {
|
|
45
47
|
editor: editor,
|
|
46
48
|
readonly: readonly
|
|
47
49
|
}), /*#__PURE__*/React.createElement(ListMenu, {
|
package/package.json
CHANGED