@seafile/sdoc-editor 0.1.83 → 0.1.84

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 (31) hide show
  1. package/dist/basic-sdk/comment/color-menu/color-item.js +22 -0
  2. package/dist/basic-sdk/comment/color-menu/index.css +109 -0
  3. package/dist/basic-sdk/comment/color-menu/index.js +199 -0
  4. package/dist/basic-sdk/constants/index.js +1 -0
  5. package/dist/basic-sdk/editor.js +3 -1
  6. package/dist/basic-sdk/extension/constants/color.js +265 -0
  7. package/dist/basic-sdk/extension/constants/index.js +9 -2
  8. package/dist/basic-sdk/extension/plugins/header/plugin.js +2 -1
  9. package/dist/basic-sdk/extension/plugins/table/helpers.js +386 -49
  10. package/dist/basic-sdk/extension/plugins/table/menu/active-table-menu/common-menu.js +4 -0
  11. package/dist/basic-sdk/extension/plugins/table/menu/active-table-menu/index.js +40 -13
  12. package/dist/basic-sdk/extension/plugins/table/plugin.js +138 -214
  13. package/dist/basic-sdk/extension/plugins/table/render/index.js +38 -8
  14. package/dist/basic-sdk/extension/plugins/table/render/render-cell.js +16 -7
  15. package/dist/basic-sdk/extension/plugins/table/render/table-header/rows-header/row-header.js +2 -2
  16. package/dist/basic-sdk/node-id/helpers.js +18 -0
  17. package/dist/basic-sdk/node-id/index.js +3 -3
  18. package/dist/basic-sdk/utils/event-handler.js +5 -1
  19. package/dist/basic-sdk/utils/object-utils.js +3 -0
  20. package/dist/constants/index.js +2 -1
  21. package/dist/utils/index.js +2 -1
  22. package/dist/utils/local-storage-utils.js +49 -0
  23. package/package.json +2 -1
  24. package/public/locales/en/sdoc-editor.json +44 -1
  25. package/public/locales/zh-CN/sdoc-editor.json +44 -1
  26. package/public/media/sdoc-editor-font/iconfont.eot +0 -0
  27. package/public/media/sdoc-editor-font/iconfont.svg +4 -0
  28. package/public/media/sdoc-editor-font/iconfont.ttf +0 -0
  29. package/public/media/sdoc-editor-font/iconfont.woff +0 -0
  30. package/public/media/sdoc-editor-font/iconfont.woff2 +0 -0
  31. package/public/media/sdoc-editor-font.css +14 -6
@@ -0,0 +1,22 @@
1
+ import React from 'react';
2
+ import { withTranslation } from 'react-i18next';
3
+ import classnames from 'classnames';
4
+ var ColorItem = function ColorItem(_ref) {
5
+ var t = _ref.t,
6
+ color = _ref.color,
7
+ recentUsedColor = _ref.recentUsedColor;
8
+ return /*#__PURE__*/React.createElement("div", {
9
+ className: classnames('sdoc-color-item', {
10
+ 'selected': recentUsedColor === color.value
11
+ }),
12
+ style: {
13
+ backgroundColor: color.value
14
+ },
15
+ color: color.value,
16
+ "data-color": color.value,
17
+ title: color.index ? t(color.name, {
18
+ value: color.index
19
+ }) : t(color.name)
20
+ });
21
+ };
22
+ export default withTranslation('sdoc-editor')(ColorItem);
@@ -0,0 +1,109 @@
1
+ .sdoc-color-menu .sdoc-color-icon {
2
+ font-size: 12px !important;
3
+ height: 12px;
4
+ line-height: 12px;
5
+ }
6
+
7
+ .sdoc-color-menu .recent-used-color {
8
+ width: 12px;
9
+ height: 3px;
10
+ border-radius: 1px;
11
+ margin-top: 2px;
12
+ border: 1px solid rgba(0, 0, 0, .08);
13
+ }
14
+
15
+ .sdoc-color-menu-popover .sdoc-color-dropdown-menu {
16
+ width: 251px;
17
+ padding: 0 0 12px 0;
18
+ }
19
+
20
+ .sdoc-color-menu-popover .sdoc-color-no-color-container {
21
+ width: 100%;
22
+ height: 24px;
23
+ margin-bottom: 5px;
24
+ }
25
+
26
+ .sdoc-color-menu-popover .sdoc-color-no-color-content {
27
+ height: 100%;
28
+ width: 100%;
29
+ text-align: center;
30
+ border: 1px solid rgba(0, 0, 0, .12);
31
+ border-radius: 2px;
32
+ font-size: 12px;
33
+ line-height: 22px;
34
+ cursor: pointer;
35
+ }
36
+
37
+ .sdoc-color-menu-popover .sdoc-color-default-colors-container {
38
+ display: flex;
39
+ flex-wrap: wrap;
40
+ }
41
+
42
+ .sdoc-color-menu-popover .sdoc-color-item {
43
+ height: 20px;
44
+ width: 20px;
45
+ margin-right: 3px;
46
+ margin-bottom: 3px;
47
+ border: 0.5px solid rgba(0, 0, 0, .08);
48
+ }
49
+
50
+ .sdoc-color-menu-popover .sdoc-color-item.selected {
51
+ position: relative;
52
+ }
53
+
54
+ .sdoc-color-menu-popover .sdoc-color-item.selected::after {
55
+ content: '';
56
+ position: absolute;
57
+ width: calc(100% + 4px);
58
+ height: calc((100% + 4px));
59
+ top: -2px;
60
+ left: -2px;
61
+ pointer-events: none;
62
+ border: 1px solid rgba(0, 0, 0, .88);
63
+ }
64
+
65
+ .sdoc-color-menu-popover .sdoc-color-item:hover {
66
+ cursor: pointer;
67
+ }
68
+
69
+ .sdoc-color-menu-popover .sdoc-color-item:nth-child(10n) {
70
+ margin-right: 0px;
71
+ }
72
+
73
+ .sdoc-color-menu-popover .sdoc-color-sub-title {
74
+ font-size: 11px;
75
+ line-height: 16px;
76
+ margin: 7px 0;
77
+ color: rgba(0, 0, 0, 0.4);
78
+ }
79
+
80
+ .sdoc-color-menu-popover .sdoc-colors-divider {
81
+ width: 100%;
82
+ height: 1px;
83
+ border-bottom: 1px solid rgba(0, 0, 0, 0.08);
84
+ margin: 0px 0 8px 0;
85
+ }
86
+
87
+ .sdoc-color-menu-popover .sdoc-more-colors {
88
+ display: flex;
89
+ align-items: center;
90
+ justify-content: baseline;
91
+ height: 30px;
92
+ font-size: 12px;
93
+ padding: 0 12px;
94
+ }
95
+
96
+ .sdoc-color-menu-popover .sdoc-more-colors .sdocfont {
97
+ font-size: 12px;
98
+ transform: scale(.6);
99
+ color: #888;
100
+ }
101
+
102
+ .sdoc-color-menu-popover .sdoc-more-colors.show-pick {
103
+ cursor: pointer;
104
+ background-color: rgba(51, 77, 102, .06);
105
+ }
106
+
107
+ .sdoc-more-colors-popover .popover {
108
+ left: 10px !important;
109
+ }
@@ -0,0 +1,199 @@
1
+ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
+ import React, { useCallback, useRef, useState } from 'react';
3
+ import { withTranslation } from 'react-i18next';
4
+ import classnames from 'classnames';
5
+ import { UncontrolledPopover } from 'reactstrap';
6
+ import { ChromePicker } from 'react-color';
7
+ import { DEFAULT_COLORS, STANDARD_COLORS, DEFAULT_RECENT_USED_COLORS } from '../../extension/constants';
8
+ import { LocalStorage } from '../../../utils';
9
+ import { eventStopPropagation } from '../../utils/mouse-event';
10
+ import ColorItem from './color-item';
11
+ import './index.css';
12
+ var ColorMenu = function ColorMenu(_ref) {
13
+ var iconClass = _ref.iconClass,
14
+ id = _ref.id,
15
+ isRichEditor = _ref.isRichEditor,
16
+ className = _ref.className,
17
+ disabled = _ref.disabled,
18
+ t = _ref.t,
19
+ setColor = _ref.setColor,
20
+ localStorageKey = _ref.localStorageKey;
21
+ var popoverRef = useRef(null);
22
+ var moreColorsPopoverRef = useRef(null);
23
+ var _useState = useState(LocalStorage.getItem(localStorageKey, DEFAULT_RECENT_USED_COLORS)),
24
+ _useState2 = _slicedToArray(_useState, 2),
25
+ recentUsedColors = _useState2[0],
26
+ setRecentUsedColors = _useState2[1];
27
+ var _useState3 = useState(false),
28
+ _useState4 = _slicedToArray(_useState3, 2),
29
+ isShowMenu = _useState4[0],
30
+ setMenuShow = _useState4[1];
31
+ var _useState5 = useState(false),
32
+ _useState6 = _slicedToArray(_useState5, 2),
33
+ isPickerShow = _useState6[0],
34
+ setPickerShow = _useState6[1];
35
+ var onSetColor = useCallback(function (color) {
36
+ var shouldClose = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
37
+ var validColor = color || 'transparent';
38
+ setColor(validColor);
39
+ if (validColor !== 'transparent' && recentUsedColors[0] !== validColor) {
40
+ var newRecentUsedColors = recentUsedColors.slice(0, 9);
41
+ newRecentUsedColors.unshift(validColor);
42
+ LocalStorage.setItem(localStorageKey, newRecentUsedColors);
43
+ setRecentUsedColors(newRecentUsedColors);
44
+ }
45
+ if (shouldClose) {
46
+ popoverRef.current.toggle();
47
+ setMenuShow(!isShowMenu);
48
+ }
49
+
50
+ // eslint-disable-next-line react-hooks/exhaustive-deps
51
+ }, [recentUsedColors, localStorageKey, isShowMenu, isPickerShow]);
52
+ var setColorProxy = useCallback(function (event) {
53
+ if (event.target.className.includes('sdoc-color-item')) {
54
+ var color = event.target.dataset.color;
55
+ onSetColor(color);
56
+ }
57
+
58
+ // eslint-disable-next-line react-hooks/exhaustive-deps
59
+ }, [recentUsedColors, localStorageKey, isShowMenu, isPickerShow]);
60
+ var toggle = useCallback(function () {
61
+ if (isPickerShow) return;
62
+ popoverRef.current.toggle();
63
+ setMenuShow(!isShowMenu);
64
+
65
+ // eslint-disable-next-line react-hooks/exhaustive-deps
66
+ }, [isShowMenu, isPickerShow]);
67
+ var moreColorsPopoverToggle = useCallback(function () {
68
+ moreColorsPopoverRef.current.toggle();
69
+ setPickerShow(!isPickerShow);
70
+
71
+ // eslint-disable-next-line react-hooks/exhaustive-deps
72
+ }, [moreColorsPopoverRef, isPickerShow]);
73
+ var onClick = useCallback(function (event) {
74
+ eventStopPropagation(event);
75
+
76
+ // eslint-disable-next-line react-hooks/exhaustive-deps
77
+ }, []);
78
+ var onChange = useCallback(function (color) {
79
+ var validColor = color.hex;
80
+ onSetColor(validColor, false);
81
+
82
+ // eslint-disable-next-line react-hooks/exhaustive-deps
83
+ }, []);
84
+ var validClassName = classnames(className, 'sdoc-color-menu', {
85
+ 'rich-icon-btn d-flex': isRichEditor,
86
+ 'rich-icon-btn-disabled': isRichEditor && disabled,
87
+ 'rich-icon-btn-hover': isRichEditor && !disabled,
88
+ 'btn btn-icon btn-secondary btn-active d-flex': !isRichEditor
89
+ });
90
+ var setRecentUsedColor = useCallback(function (event) {
91
+ eventStopPropagation(event);
92
+ onSetColor(recentUsedColors[0], false);
93
+
94
+ // eslint-disable-next-line react-hooks/exhaustive-deps
95
+ }, [recentUsedColors]);
96
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("button", {
97
+ type: "button",
98
+ className: validClassName
99
+ }, /*#__PURE__*/React.createElement("div", {
100
+ className: "d-flex flex-column justify-content-center h-100 mr-1 pt-1",
101
+ onClick: setRecentUsedColor
102
+ }, /*#__PURE__*/React.createElement("i", {
103
+ className: classnames(iconClass, 'sdoc-color-icon')
104
+ }), /*#__PURE__*/React.createElement("div", {
105
+ className: "recent-used-color",
106
+ style: {
107
+ backgroundColor: recentUsedColors[0] || 'transparent'
108
+ }
109
+ })), /*#__PURE__*/React.createElement("i", {
110
+ id: id,
111
+ className: "sdocfont sdoc-".concat(isShowMenu ? 'caret-up' : 'drop-down')
112
+ })), /*#__PURE__*/React.createElement(UncontrolledPopover, {
113
+ target: id,
114
+ className: "sdoc-color-menu-popover",
115
+ trigger: "legacy",
116
+ placement: "bottom-start",
117
+ hideArrow: true,
118
+ toggle: toggle,
119
+ fade: false,
120
+ ref: popoverRef
121
+ }, /*#__PURE__*/React.createElement("div", {
122
+ className: "sdoc-dropdown-menu sdoc-color-dropdown-menu"
123
+ }, /*#__PURE__*/React.createElement("div", {
124
+ className: "p-3 d-flex flex-column"
125
+ }, /*#__PURE__*/React.createElement("div", {
126
+ className: "sdoc-color-no-color-container"
127
+ }, /*#__PURE__*/React.createElement("div", {
128
+ className: "sdoc-color-no-color-content",
129
+ onClick: function onClick() {
130
+ return onSetColor();
131
+ }
132
+ }, t('No_color'))), /*#__PURE__*/React.createElement("div", {
133
+ className: "sdoc-color-default-colors-container",
134
+ onClick: setColorProxy
135
+ }, DEFAULT_COLORS.map(function (color, index) {
136
+ return /*#__PURE__*/React.createElement(ColorItem, {
137
+ key: "default-color-".concat(index),
138
+ color: color,
139
+ recentUsedColor: recentUsedColors[0]
140
+ });
141
+ })), /*#__PURE__*/React.createElement("div", {
142
+ className: "sdoc-color-standard-colors-container"
143
+ }, /*#__PURE__*/React.createElement("div", {
144
+ className: "sdoc-color-sub-title"
145
+ }, t('Standard_color')), /*#__PURE__*/React.createElement("div", {
146
+ className: "d-flex",
147
+ onClick: setColorProxy
148
+ }, STANDARD_COLORS.map(function (color, index) {
149
+ return /*#__PURE__*/React.createElement(ColorItem, {
150
+ key: "standard-color-".concat(index),
151
+ color: color,
152
+ recentUsedColor: recentUsedColors[0]
153
+ });
154
+ }))), /*#__PURE__*/React.createElement("div", {
155
+ className: "sdoc-color-recent-used-colors-container"
156
+ }, /*#__PURE__*/React.createElement("div", {
157
+ className: "sdoc-color-sub-title"
158
+ }, t('Recently_used')), /*#__PURE__*/React.createElement("div", {
159
+ className: "d-flex",
160
+ onClick: setColorProxy
161
+ }, recentUsedColors.map(function (color, index) {
162
+ return /*#__PURE__*/React.createElement(ColorItem, {
163
+ key: "standard-color-".concat(index),
164
+ color: {
165
+ value: color,
166
+ name: color
167
+ }
168
+ });
169
+ })))), /*#__PURE__*/React.createElement("div", {
170
+ className: "sdoc-colors-divider"
171
+ }), /*#__PURE__*/React.createElement("div", {
172
+ className: classnames('sdoc-more-colors', {
173
+ 'show-pick': isPickerShow
174
+ }),
175
+ id: "sdoc-more-colors"
176
+ }, /*#__PURE__*/React.createElement("span", null, t('More_color')), /*#__PURE__*/React.createElement("i", {
177
+ className: "sdocfont sdoc-right-slide"
178
+ })), /*#__PURE__*/React.createElement(UncontrolledPopover, {
179
+ target: "sdoc-more-colors",
180
+ className: "sdoc-more-colors-popover",
181
+ trigger: "hover",
182
+ placement: "left-end",
183
+ hideArrow: true,
184
+ toggle: moreColorsPopoverToggle,
185
+ ref: moreColorsPopoverRef
186
+ }, /*#__PURE__*/React.createElement("div", {
187
+ className: "sdoc-more-colors-container",
188
+ onClick: onClick
189
+ }, /*#__PURE__*/React.createElement(ChromePicker, {
190
+ disableAlpha: true,
191
+ color: recentUsedColors[0] || '',
192
+ onChange: onChange
193
+ }))))));
194
+ };
195
+ ColorMenu.defaultProps = {
196
+ isRichEditor: true,
197
+ className: 'menu-group-item'
198
+ };
199
+ export default withTranslation('sdoc-editor')(ColorMenu);
@@ -0,0 +1 @@
1
+ export var CLIPBOARD_FORMAT_KEY = 'x-slate-fragment';
@@ -100,6 +100,7 @@ var SDocEditor = function SDocEditor(_ref) {
100
100
  }, []);
101
101
  var onMouseDown = useCallback(function (event) {
102
102
  if (event.button === 0) {
103
+ editor.reSetTableSelectedRange();
103
104
  eventBus.dispatch(EXTERNAL_EVENT.CANCEL_TABLE_SELECT_RANGE);
104
105
  }
105
106
  // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -263,7 +264,8 @@ var SDocEditor = function SDocEditor(_ref) {
263
264
  onKeyDown: onKeyDown,
264
265
  onContextMenu: onContextMenu,
265
266
  onMouseDown: onMouseDown,
266
- decorate: decorate
267
+ decorate: decorate,
268
+ onCut: eventProxy.onCut
267
269
  })), /*#__PURE__*/React.createElement(CommentWrapper, null))))))))), isShowContextMenu && /*#__PURE__*/React.createElement(ContextMenu, {
268
270
  editor: editor,
269
271
  contextMenuPosition: menuPosition
@@ -0,0 +1,265 @@
1
+ export var DEFAULT_COLORS = [{
2
+ value: '#FFFFFF',
3
+ name: 'White'
4
+ }, {
5
+ value: '#000000',
6
+ name: 'Black'
7
+ }, {
8
+ value: '#485368',
9
+ name: 'Blue_grey'
10
+ }, {
11
+ value: '#2972F4',
12
+ name: 'Blue'
13
+ }, {
14
+ value: '#00A3F5',
15
+ name: 'Sky_blue'
16
+ }, {
17
+ value: '#319B62',
18
+ name: 'Green'
19
+ }, {
20
+ value: '#DE3C36',
21
+ name: 'Red'
22
+ }, {
23
+ value: '#F88825',
24
+ name: 'Orange'
25
+ }, {
26
+ value: '#F5C400',
27
+ name: 'Yellow'
28
+ }, {
29
+ value: '#9A38D7',
30
+ name: 'Purple'
31
+ }, {
32
+ value: '#F2F2F2',
33
+ name: 'Light_grey_x',
34
+ index: 1
35
+ }, {
36
+ value: '#7F7F7F',
37
+ name: 'Dark_grey_x',
38
+ index: 1
39
+ }, {
40
+ value: '#F3F5F7',
41
+ name: 'Light_blue_grey_x',
42
+ index: 1
43
+ }, {
44
+ value: '#E5EFFF',
45
+ name: 'Light_blue_x',
46
+ index: 1
47
+ }, {
48
+ value: '#E5F6FF',
49
+ name: 'Light_sky_blue_x',
50
+ index: 1
51
+ }, {
52
+ value: '#EAFAF1',
53
+ name: 'Light_green_x',
54
+ index: 1
55
+ }, {
56
+ value: '#FFE9E8',
57
+ name: 'Light_red_x',
58
+ index: 1
59
+ }, {
60
+ value: '#FFF3EB',
61
+ name: 'Light_orange_x',
62
+ index: 1
63
+ }, {
64
+ value: '#FFF9E3',
65
+ name: 'Light_yellow_x',
66
+ index: 1
67
+ }, {
68
+ value: '#FDEBFF',
69
+ name: 'Light_purple_x',
70
+ index: 1
71
+ }, {
72
+ value: '#D8D8D8',
73
+ name: 'Light_grey_x',
74
+ index: 2
75
+ }, {
76
+ value: '#595959',
77
+ name: 'Dark_grey_x',
78
+ index: 2
79
+ }, {
80
+ value: '#C5CAD3',
81
+ name: 'Light_blue_grey_x',
82
+ index: 2
83
+ }, {
84
+ value: '#C7DCFF',
85
+ name: 'Light_blue_x',
86
+ index: 2
87
+ }, {
88
+ value: '#C7ECFF',
89
+ name: 'Light_sky_blue_x',
90
+ index: 2
91
+ }, {
92
+ value: '#C3EAD5',
93
+ name: 'Light_green_x',
94
+ index: 2
95
+ }, {
96
+ value: '#FFC9C7',
97
+ name: 'Light_red_x',
98
+ index: 2
99
+ }, {
100
+ value: '#FFDCC4',
101
+ name: 'Light_orange_x',
102
+ index: 2
103
+ }, {
104
+ value: '#FFEEAD',
105
+ name: 'Light_yellow_x',
106
+ index: 2
107
+ }, {
108
+ value: '#F2C7FF',
109
+ name: 'Light_purple_x',
110
+ index: 2
111
+ }, {
112
+ value: '#BFBFBF',
113
+ name: 'Light_grey_x',
114
+ index: 3
115
+ }, {
116
+ value: '#3F3F3F',
117
+ name: 'Dark_grey_x',
118
+ index: 3
119
+ }, {
120
+ value: '#808B9E',
121
+ name: 'Light_blue_grey_x',
122
+ index: 3
123
+ }, {
124
+ value: '#99BEFF',
125
+ name: 'Light_blue_x',
126
+ index: 3
127
+ }, {
128
+ value: '#99DDFF',
129
+ name: 'Light_sky_blue_x',
130
+ index: 3
131
+ }, {
132
+ value: '#98D7B6',
133
+ name: 'Light_green_x',
134
+ index: 3
135
+ }, {
136
+ value: '#FF9C99',
137
+ name: 'Light_red_x',
138
+ index: 3
139
+ }, {
140
+ value: '#FFBA84',
141
+ name: 'Light_orange_x',
142
+ index: 3
143
+ }, {
144
+ value: '#FFE270',
145
+ name: 'Light_yellow_x',
146
+ index: 3
147
+ }, {
148
+ value: '#D58EFF',
149
+ name: 'Light_purple_x',
150
+ index: 3
151
+ }, {
152
+ value: '#A5A5A5',
153
+ name: 'Light_grey_x',
154
+ index: 4
155
+ }, {
156
+ value: '#262626',
157
+ name: 'Dark_grey_x',
158
+ index: 4
159
+ }, {
160
+ value: '#353B45',
161
+ name: 'Dark_blue_grey_x',
162
+ index: 1
163
+ }, {
164
+ value: '#1450B8',
165
+ name: 'Dark_blue_x',
166
+ index: 1
167
+ }, {
168
+ value: '#1274A5',
169
+ name: 'Dark_sky_blue_x',
170
+ index: 1
171
+ }, {
172
+ value: '#277C4F',
173
+ name: 'Dark_green_x',
174
+ index: 1
175
+ }, {
176
+ value: '#9E1E1A',
177
+ name: 'Dark_red_x',
178
+ index: 1
179
+ }, {
180
+ value: '#B86014',
181
+ name: 'Dark_orange_x',
182
+ index: 1
183
+ }, {
184
+ value: '#A38200',
185
+ name: 'Dark_yellow_x',
186
+ index: 1
187
+ }, {
188
+ value: '#5E2281',
189
+ name: 'Dark_purple_x',
190
+ index: 1
191
+ }, {
192
+ value: '#939393',
193
+ name: 'Light_grey_x',
194
+ index: 5
195
+ }, {
196
+ value: '#0D0D0D',
197
+ name: 'Dark_grey_x',
198
+ index: 5
199
+ }, {
200
+ value: '#24272E',
201
+ name: 'Dark_blue_grey_x',
202
+ index: 2
203
+ }, {
204
+ value: '#0C306E',
205
+ name: 'Dark_blue_x',
206
+ index: 2
207
+ }, {
208
+ value: '#0A415C',
209
+ name: 'Dark_sky_blue_x',
210
+ index: 2
211
+ }, {
212
+ value: '#184E32',
213
+ name: 'Dark_green_x',
214
+ index: 2
215
+ }, {
216
+ value: '#58110E',
217
+ name: 'Dark_red_x',
218
+ index: 2
219
+ }, {
220
+ value: '#5C300A',
221
+ name: 'Dark_orange_x',
222
+ index: 2
223
+ }, {
224
+ value: '#665200',
225
+ name: 'Dark_yellow_x',
226
+ index: 2
227
+ }, {
228
+ value: '#3b1551',
229
+ name: 'Dark_purple_x',
230
+ index: 2
231
+ }];
232
+ export var STANDARD_COLORS = [{
233
+ value: '#C00000',
234
+ name: 'Standard_dark_red'
235
+ }, {
236
+ value: '#FF0000',
237
+ name: 'Standard_red'
238
+ }, {
239
+ value: '#FFC000',
240
+ name: 'Standard_orange'
241
+ }, {
242
+ value: '#FFFF00',
243
+ name: 'Standard_yellow'
244
+ }, {
245
+ value: '#92D050',
246
+ name: 'Standard_light_green'
247
+ }, {
248
+ value: '#00B050',
249
+ name: 'Standard_green'
250
+ }, {
251
+ value: '#00B0F0',
252
+ name: 'Standard_light_blue'
253
+ }, {
254
+ value: '#0070C0',
255
+ name: 'Standard_blue'
256
+ }, {
257
+ value: '#002060',
258
+ name: 'Standard_dark_blue'
259
+ }, {
260
+ value: '#7030A0',
261
+ name: 'Standard_purple'
262
+ }];
263
+
264
+ // Initialize the most recently used colors
265
+ export var DEFAULT_RECENT_USED_COLORS = new Array(10).fill('');
@@ -4,6 +4,7 @@ var _MENUS_CONFIG_MAP, _HEADER_TITLE_MAP;
4
4
  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 } from './element-type';
6
6
  import KEYBOARD from './keyboard';
7
+ import { DEFAULT_COLORS, STANDARD_COLORS, DEFAULT_RECENT_USED_COLORS } from './color';
7
8
 
8
9
  // history
9
10
  export var UNDO = 'undo';
@@ -11,6 +12,7 @@ export var REDO = 'redo';
11
12
 
12
13
  // remove
13
14
  export var REMOVE_TABLE = 'remove_table';
15
+ export var BG_COLOR = 'bg_color';
14
16
 
15
17
  // menus config
16
18
  export var MENUS_CONFIG_MAP = (_MENUS_CONFIG_MAP = {}, _defineProperty(_MENUS_CONFIG_MAP, BLOCKQUOTE, {
@@ -101,6 +103,10 @@ export var MENUS_CONFIG_MAP = (_MENUS_CONFIG_MAP = {}, _defineProperty(_MENUS_CO
101
103
  iconClass: 'sdocfont sdoc-redo',
102
104
  text: 'Redo',
103
105
  type: 'redo'
106
+ }), _defineProperty(_MENUS_CONFIG_MAP, BG_COLOR, {
107
+ id: "sdoc_".concat(BG_COLOR),
108
+ iconClass: 'sdocfont sdoc-bg-color',
109
+ text: 'Background_color'
104
110
  }), _MENUS_CONFIG_MAP);
105
111
  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);
106
112
  export var DIFF_TYPE = {
@@ -110,7 +116,8 @@ export var DIFF_TYPE = {
110
116
  COMMON: 'common'
111
117
  };
112
118
  export var STYLE_KEY = {
113
- TEXT_ALIGN: 'textAlign'
119
+ TEXT_ALIGN: 'textAlign',
120
+ BG_COLOR: 'bg_color'
114
121
  };
115
122
  export var DELETED_STYLE = {
116
123
  computed_bg_color: '#ffeef0',
@@ -122,4 +129,4 @@ export var ADDED_STYLE = {
122
129
  };
123
130
  export var HEADER_TYPE_ARRAY = ['header1', 'header2', 'header3', 'header4', 'header5', 'header6'];
124
131
  export var LIST_TYPE_ARRAY = ['unordered_list', 'ordered_list'];
125
- 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 };
132
+ 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_COLORS };
@@ -54,11 +54,12 @@ var withHeader = function withHeader(editor) {
54
54
  }
55
55
  };
56
56
  newEditor.insertFragment = function (data) {
57
+ var _data$, _data$$children;
57
58
  var headerNode = getSelectedNodeByTypes(editor, HEADER_TYPE_ARRAY);
58
59
  var headerText = Node.string(headerNode || {
59
60
  children: []
60
61
  });
61
- var isSingleListItem = data.length === 1 && data[0].children.length === 1 && LIST_TYPE_ARRAY.includes(data[0].type);
62
+ var isSingleListItem = data.length === 1 && ((_data$ = data[0]) === null || _data$ === void 0 ? void 0 : (_data$$children = _data$.children) === null || _data$$children === void 0 ? void 0 : _data$$children.length) === 1 && LIST_TYPE_ARRAY.includes(data[0].type);
62
63
  // Insert a list item when the header is empty, insert only the text
63
64
  if (headerNode && headerText.length === 0 && isSingleListItem) {
64
65
  var text = Node.string(data[0]);