@seafile/sdoc-editor 0.1.103 → 0.1.105

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 (11) hide show
  1. package/dist/basic-sdk/comment/comment/comment-delete-shadow.js +11 -5
  2. package/dist/basic-sdk/comment/comment/comment-item-content.js +30 -46
  3. package/dist/basic-sdk/comment/comment/comment-item-reply.js +21 -41
  4. package/dist/basic-sdk/comment/comment/global-comment.js +13 -12
  5. package/dist/basic-sdk/editor.js +13 -3
  6. package/dist/basic-sdk/extension/constants/font.js +7 -1
  7. package/dist/basic-sdk/extension/constants/index.js +3 -2
  8. package/dist/basic-sdk/extension/plugins/code-block/render-elem.js +10 -8
  9. package/dist/basic-sdk/extension/plugins/font/helpers.js +17 -4
  10. package/dist/pages/simple-editor.js +21 -24
  11. package/package.json +1 -1
package/dist/basic-sdk/comment/comment/comment-delete-shadow.js CHANGED
@@ -1,4 +1,4 @@
1
- import React from 'react';
1
+ import React, { useCallback } from 'react';
2
2
  import { withTranslation } from 'react-i18next';
3
3
  import { Button } from 'reactstrap';
4
4
  var CommentDeleteShadow = function CommentDeleteShadow(_ref) {
@@ -6,6 +6,14 @@ var CommentDeleteShadow = function CommentDeleteShadow(_ref) {
6
6
  setIsShowDeleteModal = _ref.setIsShowDeleteModal,
7
7
  deleteConfirm = _ref.deleteConfirm,
8
8
  t = _ref.t;
9
+ var onDeleteCancel = useCallback(function (event) {
10
+ event.stopPropagation();
11
+ setIsShowDeleteModal(false);
12
+ }, [setIsShowDeleteModal]);
13
+ var onDeleteConfirm = useCallback(function (event) {
14
+ event.stopPropagation();
15
+ deleteConfirm();
16
+ }, [deleteConfirm]);
9
17
  var message = type === 'comment' ? 'comment' : 'reply';
10
18
  var content = t("Are_you_sure_to_delete_this_".concat(message));
11
19
  return /*#__PURE__*/React.createElement("div", {
@@ -17,12 +25,10 @@ var CommentDeleteShadow = function CommentDeleteShadow(_ref) {
17
25
  }, /*#__PURE__*/React.createElement(Button, {
18
26
  color: "secondary",
19
27
  className: "mr-2",
20
- onClick: function onClick() {
21
- setIsShowDeleteModal(false);
22
- }
28
+ onClick: onDeleteCancel
23
29
  }, t('Cancel')), /*#__PURE__*/React.createElement(Button, {
24
30
  color: "primary",
25
- onClick: deleteConfirm
31
+ onClick: onDeleteConfirm
26
32
  }, t('Confirm'))));
27
33
  };
28
34
  CommentDeleteShadow.defaultProps = {
package/dist/basic-sdk/comment/comment/comment-item-content.js CHANGED
@@ -2,7 +2,7 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
2
2
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
3
3
  import React, { useCallback, useMemo, useRef, useState } from 'react';
4
4
  import { withTranslation } from 'react-i18next';
5
- import { PopoverBody, UncontrolledPopover, UncontrolledTooltip } from 'reactstrap';
5
+ import { Dropdown, DropdownItem, DropdownMenu, DropdownToggle, UncontrolledTooltip } from 'reactstrap';
6
6
  import dayjs from 'dayjs';
7
7
  import CommentEditor from './comment-editor';
8
8
  var CommentItem = function CommentItem(_ref) {
@@ -13,32 +13,21 @@ var CommentItem = function CommentItem(_ref) {
13
13
  updateCommentState = _ref.updateCommentState,
14
14
  onDeleteComment = _ref.onDeleteComment,
15
15
  t = _ref.t;
16
- var popoverRef = useRef(null);
17
16
  var _useState = useState(false),
18
17
  _useState2 = _slicedToArray(_useState, 2),
19
- isMouseOver = _useState2[0],
20
- setMouseOver = _useState2[1];
21
- var onMouseEnter = useCallback(function () {
22
- if (!isActive) return;
23
- setMouseOver(true);
24
- }, [isActive]);
25
- var onMouseLeave = useCallback(function () {
26
- if (!isActive) return;
27
- setMouseOver(false);
28
- }, [isActive]);
29
-
30
- // const [isShowItemMenu, setIsShowItemMenu] = useState(false);
18
+ isDropdownOpen = _useState2[0],
19
+ setDropdownOpen = _useState2[1];
31
20
  var _useState3 = useState(false),
32
21
  _useState4 = _slicedToArray(_useState3, 2),
33
22
  isEditing = _useState4[0],
34
23
  setIsEditing = _useState4[1];
35
- var onEditToggle = useCallback(function () {
24
+ var onEditToggle = useCallback(function (event) {
25
+ event.stopPropagation();
36
26
  setIsEditing(true);
37
- popoverRef.current.toggle();
38
27
  }, []);
39
- var onDeleteToggle = useCallback(function () {
28
+ var onDeleteToggle = useCallback(function (event) {
29
+ event.stopPropagation();
40
30
  onDeleteComment(true);
41
- popoverRef.current.toggle();
42
31
  }, [onDeleteComment]);
43
32
  var updateContent = useCallback(function (content) {
44
33
  var commentId = comment.id;
@@ -62,20 +51,19 @@ var CommentItem = function CommentItem(_ref) {
62
51
  };
63
52
  updateCommentState(commentId, newComment);
64
53
  }, [comment.id, updateCommentState]);
65
- var markAsResolved = useCallback(function () {
54
+ var markAsResolved = useCallback(function (event) {
55
+ event.stopPropagation();
66
56
  updateCommentResolved(true);
67
57
  }, [updateCommentResolved]);
68
- var resubmit = useCallback(function () {
58
+ var resubmit = useCallback(function (event) {
59
+ event.stopPropagation();
69
60
  updateCommentResolved(false);
70
- popoverRef.current.toggle();
71
61
  }, [updateCommentResolved]);
72
62
  var menuId = useMemo(function () {
73
63
  return "comment_".concat(comment.id);
74
64
  }, [comment]);
75
65
  return /*#__PURE__*/React.createElement("li", {
76
- className: "comment-item",
77
- onMouseEnter: onMouseEnter,
78
- onMouseLeave: onMouseLeave
66
+ className: "comment-item"
79
67
  }, /*#__PURE__*/React.createElement("div", {
80
68
  className: "comment-header"
81
69
  }, /*#__PURE__*/React.createElement("div", {
@@ -91,7 +79,7 @@ var CommentItem = function CommentItem(_ref) {
91
79
  className: "name"
92
80
  }, comment.user_name), /*#__PURE__*/React.createElement("span", {
93
81
  className: "time"
94
- }, dayjs(comment.updated_at).format('MM-DD HH:mm')))), isMouseOver && /*#__PURE__*/React.createElement("div", {
82
+ }, dayjs(comment.updated_at).format('MM-DD HH:mm')))), isActive && /*#__PURE__*/React.createElement("div", {
95
83
  className: "d-flex"
96
84
  }, !comment.resolved && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
97
85
  className: "comment-operation mr-2",
@@ -107,35 +95,31 @@ var CommentItem = function CommentItem(_ref) {
107
95
  },
108
96
  fade: false,
109
97
  placement: "bottom"
110
- }, t('Resolved_tip'))), /*#__PURE__*/React.createElement("div", {
111
- id: menuId,
98
+ }, t('Resolved_tip'))), /*#__PURE__*/React.createElement(Dropdown, {
99
+ isOpen: isDropdownOpen,
100
+ toggle: function toggle() {
101
+ return setDropdownOpen(!isDropdownOpen);
102
+ }
103
+ }, /*#__PURE__*/React.createElement(DropdownToggle, {
104
+ tag: "div",
112
105
  className: "comment-operation"
113
106
  }, /*#__PURE__*/React.createElement("i", {
114
107
  className: "sdocfont sdoc-more-options"
115
- })), /*#__PURE__*/React.createElement(UncontrolledPopover, {
116
- ref: popoverRef,
117
- trigger: "legacy",
118
- target: menuId,
119
- placement: "bottom-end",
120
- hideArrow: true,
108
+ })), /*#__PURE__*/React.createElement(DropdownMenu, {
121
109
  container: container
122
- }, /*#__PURE__*/React.createElement(PopoverBody, {
123
- className: "sdoc-comment-menu"
124
- }, /*#__PURE__*/React.createElement("div", {
125
- className: "sdoc-popover-menu"
126
- }, /*#__PURE__*/React.createElement("div", {
127
- className: "sdoc-popover-menu__item",
110
+ }, /*#__PURE__*/React.createElement(DropdownItem, {
111
+ tag: "div",
128
112
  onClick: onEditToggle
129
- }, t('Edit')), /*#__PURE__*/React.createElement("div", {
130
- className: "sdoc-popover-menu__item",
113
+ }, t('Edit')), /*#__PURE__*/React.createElement(DropdownItem, {
114
+ tag: "div",
131
115
  onClick: onDeleteToggle
132
- }, t('Delete')), !comment.resolved && /*#__PURE__*/React.createElement("div", {
133
- className: "sdoc-popover-menu__item",
116
+ }, t('Delete')), !comment.resolved && /*#__PURE__*/React.createElement(DropdownItem, {
117
+ tag: "div",
134
118
  onClick: markAsResolved
135
- }, t('Mark_as_Resolved')), comment.resolved && /*#__PURE__*/React.createElement("div", {
136
- className: "sdoc-popover-menu__item",
119
+ }, t('Mark_as_Resolved')), comment.resolved && /*#__PURE__*/React.createElement(DropdownItem, {
120
+ tag: "div",
137
121
  onClick: resubmit
138
- }, t('Resubmit'))))))), /*#__PURE__*/React.createElement("div", {
122
+ }, t('Resubmit')))))), /*#__PURE__*/React.createElement("div", {
139
123
  className: "comment-content"
140
124
  }, isEditing && /*#__PURE__*/React.createElement(CommentEditor, {
141
125
  content: comment.comment,
package/dist/basic-sdk/comment/comment/comment-item-reply.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
2
  import React, { useCallback, useMemo, useRef, useState } from 'react';
3
3
  import { withTranslation } from 'react-i18next';
4
- import { PopoverBody, UncontrolledPopover } from 'reactstrap';
4
+ import { Dropdown, DropdownItem, DropdownMenu, DropdownToggle, PopoverBody, UncontrolledPopover } from 'reactstrap';
5
5
  import dayjs from 'dayjs';
6
6
  import context from '../../../context';
7
7
  import CommentEditor from './comment-editor';
@@ -13,36 +13,25 @@ var CommentItemReply = function CommentItemReply(_ref) {
13
13
  deleteReply = _ref.deleteReply,
14
14
  updateReply = _ref.updateReply,
15
15
  t = _ref.t;
16
- var popoverRef = useRef(null);
17
16
  var _useState = useState(false),
18
17
  _useState2 = _slicedToArray(_useState, 2),
19
- isMouseOver = _useState2[0],
20
- setMouseOver = _useState2[1];
21
- var onMouseEnter = useCallback(function () {
22
- if (!isActive) return;
23
- setMouseOver(true);
24
- }, [isActive]);
25
- var onMouseLeave = useCallback(function () {
26
- if (!isActive) return;
27
- setMouseOver(false);
28
- }, [isActive]);
29
-
30
- // const [isShowItemMenu, setIsShowItemMenu] = useState(false);
18
+ isDropdownOpen = _useState2[0],
19
+ setDropdownOpen = _useState2[1];
31
20
  var _useState3 = useState(false),
32
21
  _useState4 = _slicedToArray(_useState3, 2),
33
22
  isEditing = _useState4[0],
34
23
  setIsEditing = _useState4[1];
35
- var onEditToggle = useCallback(function () {
24
+ var onEditToggle = useCallback(function (event) {
25
+ event.stopPropagation();
36
26
  setIsEditing(true);
37
- popoverRef.current.toggle();
38
27
  }, []);
39
28
  var _useState5 = useState(false),
40
29
  _useState6 = _slicedToArray(_useState5, 2),
41
30
  isShowDeleteDialog = _useState6[0],
42
31
  setIsShowDeleteDialog = _useState6[1];
43
- var onDeleteToggle = useCallback(function () {
32
+ var onDeleteToggle = useCallback(function (event) {
33
+ event.stopPropagation();
44
34
  setIsShowDeleteDialog(true);
45
- popoverRef.current.toggle();
46
35
  }, []);
47
36
  var _deleteReply = useCallback(function () {
48
37
  deleteReply(reply.id);
@@ -59,14 +48,9 @@ var CommentItemReply = function CommentItemReply(_ref) {
59
48
  }
60
49
  setIsEditing(false);
61
50
  }, [reply, updateReply]);
62
- var menuId = useMemo(function () {
63
- return "reply_".concat(reply.id);
64
- }, [reply]);
65
51
  var user = context.getUserInfo();
66
52
  return /*#__PURE__*/React.createElement("li", {
67
- className: "comment-item",
68
- onMouseEnter: onMouseEnter,
69
- onMouseLeave: onMouseLeave
53
+ className: "comment-item"
70
54
  }, /*#__PURE__*/React.createElement("div", {
71
55
  className: "comment-header"
72
56
  }, /*#__PURE__*/React.createElement("div", {
@@ -82,29 +66,25 @@ var CommentItemReply = function CommentItemReply(_ref) {
82
66
  className: "name"
83
67
  }, reply.user_name), /*#__PURE__*/React.createElement("span", {
84
68
  className: "time"
85
- }, dayjs(reply.updated_at).format('MM-DD HH:mm')))), isMouseOver && user.username === reply.author && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
86
- id: menuId,
69
+ }, dayjs(reply.updated_at).format('MM-DD HH:mm')))), isActive && user.username === reply.author && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Dropdown, {
70
+ isOpen: isDropdownOpen,
71
+ toggle: function toggle() {
72
+ return setDropdownOpen(!isDropdownOpen);
73
+ }
74
+ }, /*#__PURE__*/React.createElement(DropdownToggle, {
75
+ tag: "div",
87
76
  className: "comment-operation"
88
77
  }, /*#__PURE__*/React.createElement("i", {
89
78
  className: "sdocfont sdoc-more-options"
90
- })), /*#__PURE__*/React.createElement(UncontrolledPopover, {
91
- ref: popoverRef,
92
- trigger: "legacy",
93
- target: menuId,
94
- placement: "bottom-end",
95
- hideArrow: true,
79
+ })), /*#__PURE__*/React.createElement(DropdownMenu, {
96
80
  container: container
97
- }, /*#__PURE__*/React.createElement(PopoverBody, {
98
- className: "sdoc-comment-menu"
99
- }, /*#__PURE__*/React.createElement("div", {
100
- className: "sdoc-popover-menu"
101
- }, /*#__PURE__*/React.createElement("div", {
102
- className: "sdoc-popover-menu__item",
81
+ }, /*#__PURE__*/React.createElement(DropdownItem, {
82
+ tag: "div",
103
83
  onClick: onEditToggle
104
- }, t('Edit')), /*#__PURE__*/React.createElement("div", {
105
- className: "sdoc-popover-menu__item",
84
+ }, t('Edit')), /*#__PURE__*/React.createElement(DropdownItem, {
85
+ tag: "div",
106
86
  onClick: onDeleteToggle
107
- }, t('Delete'))))))), /*#__PURE__*/React.createElement("div", {
87
+ }, t('Delete')))))), /*#__PURE__*/React.createElement("div", {
108
88
  className: "comment-content"
109
89
  }, isEditing && /*#__PURE__*/React.createElement(CommentEditor, {
110
90
  content: reply.reply,
package/dist/basic-sdk/comment/comment/global-comment.js CHANGED
@@ -8,20 +8,29 @@ import { withTranslation } from 'react-i18next';
8
8
  import GlobalCommentHeader from './global-comment-header';
9
9
  var GlobalComment = function GlobalComment(_ref) {
10
10
  var t = _ref.t;
11
+ var _useState = useState(false),
12
+ _useState2 = _slicedToArray(_useState, 2),
13
+ activeComment = _useState2[0],
14
+ setActiveComment = _useState2[1];
15
+ var onCommentClick = useCallback(function (comment) {
16
+ if (activeComment && activeComment.id === comment.id) return;
17
+ setActiveComment(comment);
18
+ }, [activeComment]);
11
19
  var commentRef = useRef(null);
12
20
  var _useCommentList = useCommentList(),
13
21
  commentList = _useCommentList.commentList,
14
22
  commentType = _useCommentList.commentType,
15
23
  setCommentType = _useCommentList.setCommentType;
16
- var _useState = useState(false),
17
- _useState2 = _slicedToArray(_useState, 2),
18
- isShowCommentList = _useState2[0],
19
- setShowCommentList = _useState2[1];
24
+ var _useState3 = useState(false),
25
+ _useState4 = _slicedToArray(_useState3, 2),
26
+ isShowCommentList = _useState4[0],
27
+ setShowCommentList = _useState4[1];
20
28
  useEffect(function () {
21
29
  var toggleOuterSide = function toggleOuterSide(e) {
22
30
  var commentWrapper = commentRef.current;
23
31
  var clickIsInComment = commentWrapper && commentWrapper.contains(e.target) && commentWrapper !== e.target;
24
32
  if (clickIsInComment) return;
33
+ setActiveComment(null);
25
34
  setShowCommentList(false);
26
35
  };
27
36
  var eventBus = EventBus.getInstance();
@@ -34,14 +43,6 @@ var GlobalComment = function GlobalComment(_ref) {
34
43
  document.removeEventListener('click', toggleOuterSide, true);
35
44
  };
36
45
  }, [isShowCommentList]);
37
- var _useState3 = useState(false),
38
- _useState4 = _slicedToArray(_useState3, 2),
39
- activeComment = _useState4[0],
40
- setActiveComment = _useState4[1];
41
- var onCommentClick = useCallback(function (comment) {
42
- if (activeComment && activeComment.id === comment.id) return;
43
- setActiveComment(comment);
44
- }, [activeComment]);
45
46
  var contentRef = useRef(null);
46
47
  var updateScrollPosition = useCallback(function () {
47
48
  var resolvedDom = document.querySelector('.sdoc-resolved');
package/dist/basic-sdk/editor.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
- import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
2
+ import React, { useCallback, useEffect, useMemo, useRef, useState, forwardRef, useImperativeHandle } from 'react';
3
3
  import { Editable, ReactEditor, Slate } from '@seafile/slate-react';
4
4
  import defaultEditor, { renderLeaf, renderElement, Toolbar, ContextToolbar } from './extension';
5
5
  import { focusEditor, getAboveBlockNode, getNextNode, getPrevNode, isSelectionAtBlockEnd, isSelectionAtBlockStart } from './extension/core';
@@ -20,7 +20,7 @@ import { ColorProvider } from './hooks/use-color-context';
20
20
  import './assets/css/layout.css';
21
21
  import './assets/css/sdoc-editor-plugins.css';
22
22
  import './assets/css/dropdown-menu.css';
23
- var SDocEditor = function SDocEditor(_ref) {
23
+ var SDocEditor = forwardRef(function (_ref, ref) {
24
24
  var document = _ref.document,
25
25
  config = _ref.config;
26
26
  // init editor
@@ -51,6 +51,16 @@ var SDocEditor = function SDocEditor(_ref) {
51
51
  return new EventProxy(editor);
52
52
  }, []);
53
53
 
54
+ // The parent component can call the method of this component through ref
55
+ useImperativeHandle(ref, function () {
56
+ return {
57
+ // get latest value
58
+ getValue: function getValue() {
59
+ return slateValue;
60
+ }
61
+ };
62
+ }, [slateValue]);
63
+
54
64
  // useMount: init socket connection
55
65
  useEffect(function () {
56
66
  editor.openConnection();
@@ -246,5 +256,5 @@ var SDocEditor = function SDocEditor(_ref) {
246
256
  decorate: decorate,
247
257
  onCut: eventProxy.onCut
248
258
  })), /*#__PURE__*/React.createElement(CommentWrapper, null)))))))))));
249
- };
259
+ });
250
260
  export default SDocEditor;
package/dist/basic-sdk/extension/constants/font.js CHANGED
@@ -1,3 +1,7 @@
1
+ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
2
+ var _HEADER_FONT_SIZE;
3
+ import * as ELEMENT_TYPE from './element-type';
4
+
1
5
  // font family
2
6
  var SERIF = 'serif';
3
7
  var SANS_SERIF = 'sans-serif';
@@ -588,4 +592,6 @@ export var FONT = [
588
592
  'zh-cn': 1
589
593
  }
590
594
  } // 楷体
591
- ];
595
+ ];
596
+
597
+ export var HEADER_FONT_SIZE = (_HEADER_FONT_SIZE = {}, _defineProperty(_HEADER_FONT_SIZE, ELEMENT_TYPE.HEADER1, 32), _defineProperty(_HEADER_FONT_SIZE, ELEMENT_TYPE.HEADER2, 28), _defineProperty(_HEADER_FONT_SIZE, ELEMENT_TYPE.HEADER3, 24), _defineProperty(_HEADER_FONT_SIZE, ELEMENT_TYPE.HEADER4, 18), _defineProperty(_HEADER_FONT_SIZE, ELEMENT_TYPE.HEADER5, 16), _defineProperty(_HEADER_FONT_SIZE, ELEMENT_TYPE.HEADER6, 14), _HEADER_FONT_SIZE);
package/dist/basic-sdk/extension/constants/index.js CHANGED
@@ -5,7 +5,7 @@ import * as ELEMENT_TYPE from './element-type';
5
5
  import { BLOCKQUOTE, HEADER, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, PARAGRAPH, BOLD, ITALIC, UNDERLINE, STRIKETHROUGH, SUPERSCRIPT, SUBSCRIPT, ORDERED_LIST, UNORDERED_LIST, LIST_ITEM, LIST_LIC, CHECK_LIST, CHECK_LIST_ITEM, LINK, HTML, CODE_BLOCK, CODE_LINE, IMAGE, TABLE, TABLE_CELL, TABLE_ROW, FORMULA, COLUMN, TEXT_STYLE, TEXT_STYLE_MORE, BOLD_ITALIC, TEXT_ALIGN, ALIGN_LEFT, ALIGN_RIGHT, ALIGN_CENTER, CLEAR_FORMAT, COLOR, HIGHLIGHT_COLOR } from './element-type';
6
6
  import KEYBOARD from './keyboard';
7
7
  import { DEFAULT_COLORS, STANDARD_COLORS, DEFAULT_RECENT_USED_LIST, DEFAULT_FONT_COLOR, RECENT_USED_HIGHLIGHT_COLORS_KEY, RECENT_USED_FONT_COLORS_KEY, RECENT_USED_TABLE_CELL_BG_COLORS_KEY, DEFAULT_LAST_USED_FONT_COLOR, DEFAULT_LAST_USED_HIGHLIGHT_COLOR, DEFAULT_LAST_USED_TABLE_CELL_BG_COLOR } from './color';
8
- import { SPECIAL_FONT_SIZE_NAME, DEFAULT_COMMON_FONT_SIZE, FONT_SIZE, DEFAULT_FONT, FONT, GOOGLE_FONT_CLASS, RECENT_USED_FONTS_KEY } from './font';
8
+ import { SPECIAL_FONT_SIZE_NAME, DEFAULT_COMMON_FONT_SIZE, FONT_SIZE, DEFAULT_FONT, FONT, GOOGLE_FONT_CLASS, RECENT_USED_FONTS_KEY, HEADER_FONT_SIZE } from './font';
9
9
 
10
10
  // history
11
11
  export var UNDO = 'undo';
@@ -132,6 +132,7 @@ export var MENUS_CONFIG_MAP = (_MENUS_CONFIG_MAP = {}, _defineProperty(_MENUS_CO
132
132
  iconClass: 'sdocfont sdoc-format-clear',
133
133
  text: 'Clear_format'
134
134
  }), _MENUS_CONFIG_MAP);
135
+ export var HEADERS = [HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6];
135
136
  export var HEADER_TITLE_MAP = (_HEADER_TITLE_MAP = {}, _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);
136
137
  export var DIFF_TYPE = {
137
138
  ADD: 'add',
@@ -155,4 +156,4 @@ export var HEADER_TYPE_ARRAY = ['header1', 'header2', 'header3', 'header4', 'hea
155
156
  export var LIST_TYPE_ARRAY = ['unordered_list', 'ordered_list'];
156
157
  export var TRANSPARENT = 'transparent';
157
158
  export var CLIPBOARD_FORMAT_KEY = 'x-slate-fragment';
158
- export { BLOCKQUOTE, HEADER, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, PARAGRAPH, BOLD, ITALIC, UNDERLINE, STRIKETHROUGH, SUPERSCRIPT, SUBSCRIPT, ORDERED_LIST, UNORDERED_LIST, LIST_ITEM, LIST_LIC, CHECK_LIST, CHECK_LIST_ITEM, LINK, HTML, CODE_BLOCK, CODE_LINE, IMAGE, TABLE, TABLE_CELL, TABLE_ROW, FORMULA, COLUMN, TEXT_STYLE, TEXT_STYLE_MORE, BOLD_ITALIC, TEXT_ALIGN, ALIGN_LEFT, ALIGN_RIGHT, ALIGN_CENTER, ELEMENT_TYPE, KEYBOARD, DEFAULT_COLORS, STANDARD_COLORS, DEFAULT_RECENT_USED_LIST, CLEAR_FORMAT, DEFAULT_FONT_COLOR, RECENT_USED_HIGHLIGHT_COLORS_KEY, RECENT_USED_FONT_COLORS_KEY, RECENT_USED_TABLE_CELL_BG_COLORS_KEY, DEFAULT_LAST_USED_FONT_COLOR, DEFAULT_LAST_USED_HIGHLIGHT_COLOR, DEFAULT_LAST_USED_TABLE_CELL_BG_COLOR, SPECIAL_FONT_SIZE_NAME, DEFAULT_COMMON_FONT_SIZE, FONT_SIZE, DEFAULT_FONT, FONT, GOOGLE_FONT_CLASS, RECENT_USED_FONTS_KEY };
159
+ export { BLOCKQUOTE, HEADER, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, PARAGRAPH, BOLD, ITALIC, UNDERLINE, STRIKETHROUGH, SUPERSCRIPT, SUBSCRIPT, ORDERED_LIST, UNORDERED_LIST, LIST_ITEM, LIST_LIC, CHECK_LIST, CHECK_LIST_ITEM, LINK, HTML, CODE_BLOCK, CODE_LINE, IMAGE, TABLE, TABLE_CELL, TABLE_ROW, FORMULA, COLUMN, TEXT_STYLE, TEXT_STYLE_MORE, BOLD_ITALIC, TEXT_ALIGN, ALIGN_LEFT, ALIGN_RIGHT, ALIGN_CENTER, ELEMENT_TYPE, KEYBOARD, DEFAULT_COLORS, STANDARD_COLORS, DEFAULT_RECENT_USED_LIST, CLEAR_FORMAT, DEFAULT_FONT_COLOR, RECENT_USED_HIGHLIGHT_COLORS_KEY, RECENT_USED_FONT_COLORS_KEY, RECENT_USED_TABLE_CELL_BG_COLORS_KEY, DEFAULT_LAST_USED_FONT_COLOR, DEFAULT_LAST_USED_HIGHLIGHT_COLOR, DEFAULT_LAST_USED_TABLE_CELL_BG_COLOR, SPECIAL_FONT_SIZE_NAME, DEFAULT_COMMON_FONT_SIZE, FONT_SIZE, DEFAULT_FONT, FONT, GOOGLE_FONT_CLASS, RECENT_USED_FONTS_KEY, HEADER_FONT_SIZE };
package/dist/basic-sdk/extension/plugins/code-block/render-elem.js CHANGED
@@ -89,6 +89,7 @@ var CodeBlock = function CodeBlock(_ref) {
89
89
  }, []);
90
90
  var onScroll = useCallback(function (e) {
91
91
  if (readOnly) return;
92
+ if (!showHoverMenu) return;
92
93
  if (e.currentTarget.scrollTop) {
93
94
  var _codeBlockRef$current2 = codeBlockRef.current.getBoundingClientRect(),
94
95
  top = _codeBlockRef$current2.top,
@@ -101,17 +102,18 @@ var CodeBlock = function CodeBlock(_ref) {
101
102
 
102
103
  setMenuPosition(newMenuPosition);
103
104
  }
104
- // eslint-disable-next-line react-hooks/exhaustive-deps
105
- }, []);
105
+ }, [readOnly, showHoverMenu]);
106
106
  useEffect(function () {
107
107
  if (readOnly) return;
108
- if (showHoverMenu) {
109
- scrollRef.current && scrollRef.current.addEventListener('scroll', onScroll);
110
- } else {
111
- scrollRef.current && scrollRef.current.removeEventListener('scroll', onScroll);
108
+ var observerRefValue = null;
109
+ if (scrollRef.current) {
110
+ scrollRef.current.addEventListener('scroll', onScroll);
111
+ observerRefValue = scrollRef.current;
112
112
  }
113
- // eslint-disable-next-line react-hooks/exhaustive-deps
114
- }, [showHoverMenu]);
113
+ return function () {
114
+ observerRefValue.removeEventListener('scroll', onScroll);
115
+ };
116
+ }, [onScroll, readOnly, scrollRef]);
115
117
  var isEntering = useCallback(function (e) {
116
118
  return !editor.operations.every(function (operation) {
117
119
  return operation.type === 'set_selection';
package/dist/basic-sdk/extension/plugins/font/helpers.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
2
  import { Editor, Element } from '@seafile/slate';
3
- import { CODE_BLOCK, DEFAULT_COMMON_FONT_SIZE, IMAGE, FONT_SIZE, SPECIAL_FONT_SIZE_NAME, DEFAULT_FONT, GOOGLE_FONT_CLASS, FONT } from '../../constants';
4
- import { focusEditor } from '../../core';
3
+ import { CODE_BLOCK, DEFAULT_COMMON_FONT_SIZE, IMAGE, FONT_SIZE, SPECIAL_FONT_SIZE_NAME, DEFAULT_FONT, GOOGLE_FONT_CLASS, FONT, HEADER_FONT_SIZE, HEADERS } from '../../constants';
4
+ import { focusEditor, getParentNode } from '../../core';
5
5
  import context from '../../../../context';
6
6
  import { isMac } from '../../../../utils';
7
7
  export var isMenuDisabled = function isMenuDisabled(editor) {
@@ -31,13 +31,26 @@ export var getFontSize = function getFontSize(editor) {
31
31
  var _Editor$nodes3 = Editor.nodes(editor, {
32
32
  at: Editor.unhangRange(editor, selection),
33
33
  match: function match(n) {
34
- return !Editor.isEditor(n) && !Element.isElement(n) && n['font-size'];
34
+ if (!Editor.isEditor(n) && !Element.isElement(n)) {
35
+ // console.log(n) && n['font-size']
36
+ if (n['font-size']) return true;
37
+ var _parentNode = getParentNode(editor.children, n.id);
38
+ if (_parentNode && HEADERS.includes(_parentNode.type)) {
39
+ return true;
40
+ }
41
+ return false;
42
+ }
43
+ return false;
35
44
  }
36
45
  }),
37
46
  _Editor$nodes4 = _slicedToArray(_Editor$nodes3, 1),
38
47
  match = _Editor$nodes4[0];
39
48
  if (!match) return DEFAULT_COMMON_FONT_SIZE;
40
- return match[0]['font-size'];
49
+ var matched = match[0];
50
+ if (matched['font-size']) return matched['font-size'];
51
+ var parentNode = getParentNode(editor.children, matched.id);
52
+ if (HEADERS.includes(parentNode.type)) return HEADER_FONT_SIZE[parentNode.type];
53
+ return DEFAULT_COMMON_FONT_SIZE;
41
54
  };
42
55
  export var setFontSize = function setFontSize(editor, value) {
43
56
  Editor.addMark(editor, 'font-size', value);
package/dist/pages/simple-editor.js CHANGED
@@ -1,6 +1,8 @@
1
+ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
1
2
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
- import React, { useCallback, useEffect, useState } from 'react';
3
+ import React, { useCallback, useEffect, useRef, useState } from 'react';
3
4
  import { withTranslation } from 'react-i18next';
5
+ import deepCopy from 'deep-copy';
4
6
  import { SDocEditor } from '../basic-sdk';
5
7
  import Loading from '../components/loading';
6
8
  import DocInfo from '../components/doc-info';
@@ -15,6 +17,7 @@ var SimpleEditor = function SimpleEditor(_ref) {
15
17
  var isStarred = _ref.isStarred,
16
18
  isDraft = _ref.isDraft,
17
19
  t = _ref.t;
20
+ var editorRef = useRef(null);
18
21
  var _useState = useState(true),
19
22
  _useState2 = _slicedToArray(_useState, 2),
20
23
  isFirstLoad = _useState2[0],
@@ -77,35 +80,28 @@ var SimpleEditor = function SimpleEditor(_ref) {
77
80
  var initChangesData = useCallback(function () {
78
81
  setShowChanges(true);
79
82
  context.getSeadocRevisionDownloadLinks().then(function (res) {
80
- var _res$data = res.data,
81
- fileDownloadLink = _res$data.file_download_link,
82
- originFileDownloadLink = _res$data.origin_file_download_link;
83
- fetch(fileDownloadLink).then(function (res) {
84
- return res.json();
85
- }).then(function (revisionContent) {
86
- fetch(originFileDownloadLink).then(function (res) {
87
- return res.json();
88
- }).then(function (originContent) {
89
- setCurrentContent(revisionContent);
90
- setLastContent(originContent);
91
- setErrorMessage(null);
92
- setContextInit(true);
93
- }).catch(function (error) {
94
- setErrorMessage('Load_doc_content_error');
95
- setContextInit(true);
96
- });
97
- }).catch(function (error) {
98
- setErrorMessage('Load_doc_content_error');
99
- setContextInit(true);
100
- });
83
+ var originFileDownloadLink = res.data.origin_file_download_link;
84
+ return fetch(originFileDownloadLink);
85
+ }).then(function (res) {
86
+ return res.json();
87
+ }).then(function (originContent) {
88
+ setLastContent(originContent);
89
+ setErrorMessage(null);
90
+ setContextInit(true);
101
91
  }).catch(function (error) {
102
92
  setErrorMessage('Load_doc_content_error');
103
93
  setContextInit(true);
104
94
  });
105
95
 
106
96
  // eslint-disable-next-line react-hooks/exhaustive-deps
107
- }, []);
97
+ }, [document]);
108
98
  var toggleViewChanges = useCallback(function (isShowChanges) {
99
+ if (isShowChanges) {
100
+ var newestValue = editorRef.current.getValue();
101
+ setCurrentContent(deepCopy(_objectSpread(_objectSpread({}, document), {}, {
102
+ children: newestValue
103
+ })));
104
+ }
109
105
  setContextInit(false);
110
106
  if (isShowChanges) {
111
107
  initChangesData();
@@ -114,7 +110,7 @@ var SimpleEditor = function SimpleEditor(_ref) {
114
110
  initDocumentData(false);
115
111
 
116
112
  // eslint-disable-next-line react-hooks/exhaustive-deps
117
- }, []);
113
+ }, [document]);
118
114
  if (isFirstLoad && !isContextInit) {
119
115
  return /*#__PURE__*/React.createElement(Loading, null);
120
116
  }
@@ -140,6 +136,7 @@ var SimpleEditor = function SimpleEditor(_ref) {
140
136
  }) : /*#__PURE__*/React.createElement(SDocEditor, {
141
137
  config: context.getEditorConfig(),
142
138
  document: document,
139
+ ref: editorRef,
143
140
  isOpenSocket: context.getSetting('isOpenSocket')
144
141
  })))));
145
142
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@seafile/sdoc-editor",
3
- "version": "0.1.103",
3
+ "version": "0.1.105",
4
4
  "private": false,
5
5
  "description": "This is a sdoc editor",
6
6
  "main": "dist/index.js",