@seafile/sdoc-editor 2.0.22 → 2.0.23
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/extension/plugins/image/helpers.js +13 -2
- package/dist/basic-sdk/extension/plugins/image/hover-menu/index.js +1 -1
- package/dist/basic-sdk/extension/plugins/image/plugin.js +14 -0
- package/dist/basic-sdk/extension/plugins/multi-column/helper.js +13 -2
- package/dist/basic-sdk/extension/plugins/multi-column/plugin.js +40 -0
- package/dist/basic-sdk/extension/toolbar/insert-element-toolbar/index.js +7 -0
- package/dist/basic-sdk/extension/toolbar/side-toolbar/index.js +5 -0
- package/package.json +1 -1
|
@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
|
-
exports.updateImage = exports.selectImageWhenSelectPartial = exports.resetCursor = exports.queryCopyMoveProgressView = exports.isInsertImageMenuDisabled = exports.isImagUrlIsFromCopy = exports.insertImageFiles = exports.insertImage = exports.hasSdocImages = exports.handleBase64Image = exports.getSingleImageFromFragment = exports.getImageURL = exports.getImageData = exports.generateImageNode = void 0;
|
|
7
|
+
exports.updateImage = exports.selectImageWhenSelectPartial = exports.resetCursor = exports.removeImageBlockNode = exports.queryCopyMoveProgressView = exports.isInsertImageMenuDisabled = exports.isImagUrlIsFromCopy = exports.insertImageFiles = exports.insertImage = exports.hasSdocImages = exports.handleBase64Image = exports.getSingleImageFromFragment = exports.getImageURL = exports.getImageData = exports.generateImageNode = void 0;
|
|
8
8
|
var _urlJoin = _interopRequireDefault(require("url-join"));
|
|
9
9
|
var _slate = require("@seafile/slate");
|
|
10
10
|
var _slateReact = require("@seafile/slate-react");
|
|
@@ -283,4 +283,15 @@ const isImagUrlIsFromCopy = url => {
|
|
|
283
283
|
if (url && url.startsWith('attachment')) return true; // from yuque
|
|
284
284
|
return false;
|
|
285
285
|
};
|
|
286
|
-
exports.isImagUrlIsFromCopy = isImagUrlIsFromCopy;
|
|
286
|
+
exports.isImagUrlIsFromCopy = isImagUrlIsFromCopy;
|
|
287
|
+
const removeImageBlockNode = (editor, path) => {
|
|
288
|
+
_slate.Transforms.removeNodes(editor, {
|
|
289
|
+
at: path
|
|
290
|
+
});
|
|
291
|
+
const p = (0, _core.generateEmptyElement)(_constants2.ELEMENT_TYPE.PARAGRAPH);
|
|
292
|
+
_slate.Transforms.insertNodes(editor, p, {
|
|
293
|
+
at: path
|
|
294
|
+
});
|
|
295
|
+
(0, _core.focusEditor)(editor, path);
|
|
296
|
+
};
|
|
297
|
+
exports.removeImageBlockNode = removeImageBlockNode;
|
|
@@ -165,7 +165,7 @@ const ImageHoverMenu = _ref => {
|
|
|
165
165
|
style: menuPosition
|
|
166
166
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
167
167
|
className: "hover-menu-container"
|
|
168
|
-
}, ![_constants2.TABLE, _constants2.BLOCKQUOTE, _constants2.CALL_OUT].includes(type) && !readonly && /*#__PURE__*/_react.default.createElement("span", {
|
|
168
|
+
}, ![_constants2.TABLE, _constants2.BLOCKQUOTE, _constants2.CALL_OUT, _constants2.MULTI_COLUMN].includes(type) && !readonly && /*#__PURE__*/_react.default.createElement("span", {
|
|
169
169
|
className: "op-group-item"
|
|
170
170
|
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
171
171
|
role: "button",
|
|
@@ -173,6 +173,20 @@ const withImage = editor => {
|
|
|
173
173
|
if (imageBlock) {
|
|
174
174
|
const path = selection.anchor.path;
|
|
175
175
|
const deletePath = [path[0]];
|
|
176
|
+
|
|
177
|
+
// Delete image_block element in multi-column node
|
|
178
|
+
const currentTopNode = (0, _core.getNode)(editor, deletePath);
|
|
179
|
+
const currentBlockNode = (0, _core.getNode)(editor, path.slice(0, 3));
|
|
180
|
+
// Image_block not in callout or blockquote
|
|
181
|
+
if (currentTopNode.type === _constants.MULTI_COLUMN && ![_constants.CALL_OUT, _constants.BLOCKQUOTE].includes(currentBlockNode.type)) {
|
|
182
|
+
(0, _helpers.removeImageBlockNode)(editor, path.slice(0, 3));
|
|
183
|
+
return;
|
|
184
|
+
}
|
|
185
|
+
// Image_block in callout or blockquote
|
|
186
|
+
if (currentTopNode.type === _constants.MULTI_COLUMN && [_constants.CALL_OUT, _constants.BLOCKQUOTE].includes(currentBlockNode.type)) {
|
|
187
|
+
(0, _helpers.removeImageBlockNode)(editor, path.slice(0, 4));
|
|
188
|
+
return;
|
|
189
|
+
}
|
|
176
190
|
_slate.Transforms.removeNodes(editor, {
|
|
177
191
|
at: deletePath
|
|
178
192
|
});
|
|
@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
|
-
exports.updateColumnWidthOnDeletion = exports.updateColumnWidth = exports.insertMultiColumn = exports.handleInsertMultiColumn = exports.getCurrentPageWidth = exports.generateEmptyMultiColumn = void 0;
|
|
7
|
+
exports.updateColumnWidthOnDeletion = exports.updateColumnWidth = exports.insertMultiColumn = exports.hasImageInColumn = exports.handleInsertMultiColumn = exports.getCurrentPageWidth = exports.generateEmptyMultiColumn = void 0;
|
|
8
8
|
var _slugid = _interopRequireDefault(require("slugid"));
|
|
9
9
|
var _slate = require("@seafile/slate");
|
|
10
10
|
var _slateReact = require("@seafile/slate-react");
|
|
@@ -178,4 +178,15 @@ const getCurrentPageWidth = editor => {
|
|
|
178
178
|
}
|
|
179
179
|
return pageWidth;
|
|
180
180
|
};
|
|
181
|
-
exports.getCurrentPageWidth = getCurrentPageWidth;
|
|
181
|
+
exports.getCurrentPageWidth = getCurrentPageWidth;
|
|
182
|
+
const hasImageInColumn = (editor, columnPath) => {
|
|
183
|
+
for (const [node] of _slate.Editor.nodes(editor, {
|
|
184
|
+
at: columnPath
|
|
185
|
+
})) {
|
|
186
|
+
if ([_constants.IMAGE_BLOCK, _constants.IMAGE].includes(node === null || node === void 0 ? void 0 : node.type)) {
|
|
187
|
+
return true;
|
|
188
|
+
}
|
|
189
|
+
}
|
|
190
|
+
return false;
|
|
191
|
+
};
|
|
192
|
+
exports.hasImageInColumn = hasImageInColumn;
|
|
@@ -8,6 +8,7 @@ var _slate = require("@seafile/slate");
|
|
|
8
8
|
var _core = require("../../core");
|
|
9
9
|
var _constants = require("../../constants");
|
|
10
10
|
var _helper = require("./helper");
|
|
11
|
+
var _unwrapList = require("../list/transforms/unwrap-list");
|
|
11
12
|
const withMultiColumn = editor => {
|
|
12
13
|
const {
|
|
13
14
|
normalizeNode,
|
|
@@ -54,9 +55,41 @@ const withMultiColumn = editor => {
|
|
|
54
55
|
const currentColumnEntry = (0, _core.getSelectedNodeEntryByType)(editor, _constants.ELEMENT_TYPE.COLUMN);
|
|
55
56
|
const isOnlyOneChild = currentColumnEntry[0].children.length === 1;
|
|
56
57
|
const isAtStart = _slate.Editor.isStart(editor, selection.focus, selection.anchor.path.slice(0, 2));
|
|
58
|
+
const currentNodeInColumn = currentColumnEntry[0].children[0];
|
|
59
|
+
const currentNodePathInColumn = (0, _core.findPath)(editor, currentNodeInColumn);
|
|
60
|
+
// Only one child inline-image in current column
|
|
61
|
+
// Return if cursor is at the start of only one child image
|
|
62
|
+
if (isOnlyOneChild && currentNodeInColumn.children.length === 3) {
|
|
63
|
+
const isImageType = currentNodeInColumn.children[1].type === _constants.IMAGE;
|
|
64
|
+
if (isImageType && selection.anchor.path[3] === 0 && selection.anchor.offset === 0) {
|
|
65
|
+
return;
|
|
66
|
+
}
|
|
67
|
+
}
|
|
57
68
|
|
|
58
69
|
// When selection is at start of the only one existed child nodes in current column node, delete column node
|
|
59
70
|
if (isOnlyOneChild && isAtStart) {
|
|
71
|
+
// Transform non-paragraph elements without callout element to paragraph elements
|
|
72
|
+
if (currentNodeInColumn.type !== _constants.PARAGRAPH) {
|
|
73
|
+
var _currentNodeInColumn$;
|
|
74
|
+
// Unwrap list if list-item exists in the current column node
|
|
75
|
+
if ([_constants.UNORDERED_LIST, _constants.ORDERED_LIST].includes(currentNodeInColumn.type)) {
|
|
76
|
+
(0, _unwrapList.unwrapList)(editor);
|
|
77
|
+
return;
|
|
78
|
+
}
|
|
79
|
+
if ([_constants.UNORDERED_LIST, _constants.ORDERED_LIST].includes(currentNodeInColumn === null || currentNodeInColumn === void 0 ? void 0 : (_currentNodeInColumn$ = currentNodeInColumn.children[0]) === null || _currentNodeInColumn$ === void 0 ? void 0 : _currentNodeInColumn$.type)) {
|
|
80
|
+
_slate.Transforms.unwrapNodes(editor, {
|
|
81
|
+
at: currentNodePathInColumn
|
|
82
|
+
});
|
|
83
|
+
} else {
|
|
84
|
+
_slate.Transforms.setNodes(editor, {
|
|
85
|
+
type: _constants.PARAGRAPH
|
|
86
|
+
}, {
|
|
87
|
+
at: currentNodePathInColumn
|
|
88
|
+
});
|
|
89
|
+
}
|
|
90
|
+
return;
|
|
91
|
+
}
|
|
92
|
+
|
|
60
93
|
// Delete multi_column and column wrap when only one child column node exists
|
|
61
94
|
if (childColumn.length <= 2) {
|
|
62
95
|
deleteBackward();
|
|
@@ -89,6 +122,13 @@ const withMultiColumn = editor => {
|
|
|
89
122
|
} = currentMultiColumnEntry[0];
|
|
90
123
|
const isOnlyOneChild = childColumn[nextColumnIndex].children.length === 1;
|
|
91
124
|
const isAtEnd = _slate.Editor.isEnd(editor, selection.focus, selection.anchor.path.slice(0, 2));
|
|
125
|
+
|
|
126
|
+
// When deleteForwarding only one child including image or image-block in next column, return
|
|
127
|
+
const hasImageInOnlyOneChild = isOnlyOneChild && (0, _helper.hasImageInColumn)(editor, nextNode[1].slice(0, 2));
|
|
128
|
+
if (isOnlyOneChild && isAtEnd && hasImageInOnlyOneChild) {
|
|
129
|
+
return;
|
|
130
|
+
}
|
|
131
|
+
|
|
92
132
|
// When selection is at end and the only one existed child nodes in next column node, delete column node
|
|
93
133
|
if (isOnlyOneChild && isAtEnd) {
|
|
94
134
|
// Delete multi_column and column wrap when only one child column node exists and selection is on the first column node
|
|
@@ -150,6 +150,12 @@ const QuickInsertBlockMenu = _ref => {
|
|
|
150
150
|
});
|
|
151
151
|
return !!callout;
|
|
152
152
|
}, [editor]);
|
|
153
|
+
const isDisableCodeBlock = (0, _react.useMemo)(() => {
|
|
154
|
+
const callout = (0, _core.getAboveBlockNode)(editor, {
|
|
155
|
+
match: n => [_constants.ELEMENT_TYPE.MULTI_COLUMN].includes(n.type)
|
|
156
|
+
});
|
|
157
|
+
return !!callout;
|
|
158
|
+
}, [editor]);
|
|
153
159
|
const createMultiColumn = (0, _react.useCallback)(type => {
|
|
154
160
|
callback && callback();
|
|
155
161
|
const newInsertPosition = slateNode.type === _constants.ELEMENT_TYPE.LIST_ITEM ? _constants.INSERT_POSITION.AFTER : insertPosition;
|
|
@@ -209,6 +215,7 @@ const QuickInsertBlockMenu = _ref => {
|
|
|
209
215
|
}),
|
|
210
216
|
[_constants.CODE_BLOCK]: /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
|
|
211
217
|
isHidden: !quickInsertMenuSearchMap[_constants.CODE_BLOCK],
|
|
218
|
+
disabled: isDisableCodeBlock,
|
|
212
219
|
key: "sdoc-insert-menu-code-block",
|
|
213
220
|
menuConfig: {
|
|
214
221
|
..._constants.SIDE_INSERT_MENUS_CONFIG[_constants.ELEMENT_TYPE.CODE_BLOCK]
|
|
@@ -119,6 +119,11 @@ const SideToolbar = () => {
|
|
|
119
119
|
if ([_constants2.ORDERED_LIST, _constants2.UNORDERED_LIST, _constants2.BLOCKQUOTE].includes(parentNode.type)) {
|
|
120
120
|
domLeft = document.querySelector(`[data-id="${parentNode.id}"]`) && document.querySelector(`[data-id="${parentNode.id}"]`).getBoundingClientRect().left;
|
|
121
121
|
}
|
|
122
|
+
if ([_constants2.IMAGE_BLOCK].includes(node.type)) {
|
|
123
|
+
var _dom$querySelectorAll;
|
|
124
|
+
const imageWrapperDomId = (_dom$querySelectorAll = dom.querySelectorAll('span')[1]) === null || _dom$querySelectorAll === void 0 ? void 0 : _dom$querySelectorAll.getAttribute('data-id');
|
|
125
|
+
domLeft = document.querySelector(`[data-id="${imageWrapperDomId}"]`) && document.querySelector(`[data-id="${imageWrapperDomId}"]`).getBoundingClientRect().left;
|
|
126
|
+
}
|
|
122
127
|
const {
|
|
123
128
|
left: containerLeft
|
|
124
129
|
} = document.querySelector('.sdoc-editor__article').getBoundingClientRect();
|