@ctzhian/tiptap 1.12.5 → 1.12.6
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/Editor/demo.js +1 -1
- package/dist/EditorMarkdown/Toolbar.d.ts +8 -0
- package/dist/EditorMarkdown/Toolbar.js +670 -0
- package/dist/EditorMarkdown/demo.js +23 -54
- package/dist/EditorMarkdown/index.js +43 -30
- package/dist/component/FloatingPopover/index.js +1 -1
- package/dist/component/Menu/NestedList.d.ts +1 -0
- package/dist/component/Menu/NestedList.js +6 -3
- package/dist/component/Menu/index.d.ts +4 -1
- package/dist/component/Menu/index.js +16 -5
- package/dist/extension/component/Link/Markdown.d.ts +4 -0
- package/dist/extension/component/Link/Markdown.js +8 -0
- package/dist/extension/component/UploadProgress/index.d.ts +1 -1
- package/dist/extension/index.js +5 -4
- package/dist/extension/mark/Link.d.ts +2 -0
- package/dist/extension/mark/Link.js +11 -58
- package/dist/extension/node/Link/index.js +0 -19
- package/dist/type/index.d.ts +1 -0
- package/package.json +1 -1
package/dist/Editor/demo.js
CHANGED
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import AceEditor from "react-ace";
|
|
3
|
+
interface EditorMarkdownToolbarProps {
|
|
4
|
+
aceEditorRef: React.RefObject<AceEditor>;
|
|
5
|
+
isExpend?: boolean;
|
|
6
|
+
}
|
|
7
|
+
declare const EditorMarkdownToolbar: ({ aceEditorRef, isExpend }: EditorMarkdownToolbarProps) => React.JSX.Element;
|
|
8
|
+
export default EditorMarkdownToolbar;
|
|
@@ -0,0 +1,670 @@
|
|
|
1
|
+
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
2
|
+
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
3
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
4
|
+
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
5
|
+
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
6
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
7
|
+
import { Box, Divider, Stack, Typography } from "@mui/material";
|
|
8
|
+
import React from "react";
|
|
9
|
+
import { AddCircleFillIcon, ArrowDownSLineIcon, BoldIcon, CheckboxCircleFillIcon, CloseCircleFillIcon, CodeBoxLineIcon, CodeLineIcon, DoubleQuotesLIcon, ErrorWarningFillIcon, FunctionsIcon, H1Icon, H2Icon, H3Icon, H4Icon, H5Icon, H6Icon, ImageLineIcon, Information2FillIcon, Information2LineIcon, ItalicIcon, LinkIcon, ListCheck3Icon, ListOrdered2Icon, ListUnorderedIcon, MarkPenLineIcon, MenuFold2FillIcon, SeparatorIcon, SquareRootIcon, StrikethroughIcon, SubscriptIcon, SuperscriptIcon, Table2Icon, UnderlineIcon, UserSmileFillIcon } from "../component/Icons";
|
|
10
|
+
import Menu from "../component/Menu";
|
|
11
|
+
import { ToolbarItem } from "../component/Toolbar";
|
|
12
|
+
import TableSizePicker from "../component/Toolbar/TableSizePicker";
|
|
13
|
+
var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
14
|
+
var aceEditorRef = _ref.aceEditorRef,
|
|
15
|
+
isExpend = _ref.isExpend;
|
|
16
|
+
var insertTextAndFocusPositionRow = function insertTextAndFocusPositionRow(options) {
|
|
17
|
+
var _aceEditorRef$current;
|
|
18
|
+
var _options$position = options.position,
|
|
19
|
+
position = _options$position === void 0 ? 0 : _options$position,
|
|
20
|
+
_options$row = options.row,
|
|
21
|
+
row = _options$row === void 0 ? 0 : _options$row,
|
|
22
|
+
_options$block = options.block,
|
|
23
|
+
block = _options$block === void 0 ? false : _options$block;
|
|
24
|
+
var editor = (_aceEditorRef$current = aceEditorRef.current) === null || _aceEditorRef$current === void 0 ? void 0 : _aceEditorRef$current.editor;
|
|
25
|
+
if (!editor) return;
|
|
26
|
+
var cursor = editor.getCursorPosition();
|
|
27
|
+
var isEditorEmpty = editor.getValue().length === 0;
|
|
28
|
+
var text = options.text;
|
|
29
|
+
var curRow = cursor.row + row;
|
|
30
|
+
var curColumn = cursor.column + position;
|
|
31
|
+
if (block) {
|
|
32
|
+
curColumn = position;
|
|
33
|
+
text = "\n\n".concat(options.text);
|
|
34
|
+
curRow += 2;
|
|
35
|
+
}
|
|
36
|
+
if (isEditorEmpty) {
|
|
37
|
+
text = "".concat(options.text);
|
|
38
|
+
}
|
|
39
|
+
editor.insert(text);
|
|
40
|
+
editor.moveCursorTo(curRow, curColumn);
|
|
41
|
+
editor.focus();
|
|
42
|
+
};
|
|
43
|
+
var HeadingOptions = [{
|
|
44
|
+
id: '1',
|
|
45
|
+
icon: /*#__PURE__*/React.createElement(H1Icon, {
|
|
46
|
+
sx: {
|
|
47
|
+
fontSize: '1rem'
|
|
48
|
+
}
|
|
49
|
+
}),
|
|
50
|
+
label: '一级标题',
|
|
51
|
+
onClick: function onClick() {
|
|
52
|
+
insertTextAndFocusPositionRow({
|
|
53
|
+
text: '# ',
|
|
54
|
+
position: 2,
|
|
55
|
+
block: true
|
|
56
|
+
});
|
|
57
|
+
}
|
|
58
|
+
}, {
|
|
59
|
+
id: '2',
|
|
60
|
+
icon: /*#__PURE__*/React.createElement(H2Icon, {
|
|
61
|
+
sx: {
|
|
62
|
+
fontSize: '1rem'
|
|
63
|
+
}
|
|
64
|
+
}),
|
|
65
|
+
label: '二级标题',
|
|
66
|
+
onClick: function onClick() {
|
|
67
|
+
insertTextAndFocusPositionRow({
|
|
68
|
+
text: '## ',
|
|
69
|
+
position: 3,
|
|
70
|
+
block: true
|
|
71
|
+
});
|
|
72
|
+
}
|
|
73
|
+
}, {
|
|
74
|
+
id: '3',
|
|
75
|
+
icon: /*#__PURE__*/React.createElement(H3Icon, {
|
|
76
|
+
sx: {
|
|
77
|
+
fontSize: '1rem'
|
|
78
|
+
}
|
|
79
|
+
}),
|
|
80
|
+
label: '三级标题',
|
|
81
|
+
onClick: function onClick() {
|
|
82
|
+
insertTextAndFocusPositionRow({
|
|
83
|
+
text: '### ',
|
|
84
|
+
position: 4,
|
|
85
|
+
block: true
|
|
86
|
+
});
|
|
87
|
+
}
|
|
88
|
+
}, {
|
|
89
|
+
id: '4',
|
|
90
|
+
icon: /*#__PURE__*/React.createElement(H4Icon, {
|
|
91
|
+
sx: {
|
|
92
|
+
fontSize: '1rem'
|
|
93
|
+
}
|
|
94
|
+
}),
|
|
95
|
+
label: '四级标题',
|
|
96
|
+
onClick: function onClick() {
|
|
97
|
+
insertTextAndFocusPositionRow({
|
|
98
|
+
text: '#### ',
|
|
99
|
+
position: 5,
|
|
100
|
+
block: true
|
|
101
|
+
});
|
|
102
|
+
}
|
|
103
|
+
}, {
|
|
104
|
+
id: '5',
|
|
105
|
+
icon: /*#__PURE__*/React.createElement(H5Icon, {
|
|
106
|
+
sx: {
|
|
107
|
+
fontSize: '1rem'
|
|
108
|
+
}
|
|
109
|
+
}),
|
|
110
|
+
label: '五级标题',
|
|
111
|
+
onClick: function onClick() {
|
|
112
|
+
insertTextAndFocusPositionRow({
|
|
113
|
+
text: '##### ',
|
|
114
|
+
position: 6,
|
|
115
|
+
block: true
|
|
116
|
+
});
|
|
117
|
+
}
|
|
118
|
+
}, {
|
|
119
|
+
id: '6',
|
|
120
|
+
icon: /*#__PURE__*/React.createElement(H6Icon, {
|
|
121
|
+
sx: {
|
|
122
|
+
fontSize: '1rem'
|
|
123
|
+
}
|
|
124
|
+
}),
|
|
125
|
+
label: '六级标题',
|
|
126
|
+
onClick: function onClick() {
|
|
127
|
+
insertTextAndFocusPositionRow({
|
|
128
|
+
text: '###### ',
|
|
129
|
+
position: 7,
|
|
130
|
+
block: true
|
|
131
|
+
});
|
|
132
|
+
}
|
|
133
|
+
}];
|
|
134
|
+
var ToolList = [{
|
|
135
|
+
id: 'bold',
|
|
136
|
+
icon: /*#__PURE__*/React.createElement(BoldIcon, {
|
|
137
|
+
sx: {
|
|
138
|
+
fontSize: '1rem'
|
|
139
|
+
}
|
|
140
|
+
}),
|
|
141
|
+
label: '加粗',
|
|
142
|
+
onClick: function onClick() {
|
|
143
|
+
insertTextAndFocusPositionRow({
|
|
144
|
+
text: '****',
|
|
145
|
+
position: 2
|
|
146
|
+
});
|
|
147
|
+
}
|
|
148
|
+
}, {
|
|
149
|
+
id: 'italic',
|
|
150
|
+
icon: /*#__PURE__*/React.createElement(ItalicIcon, {
|
|
151
|
+
sx: {
|
|
152
|
+
fontSize: '1rem'
|
|
153
|
+
}
|
|
154
|
+
}),
|
|
155
|
+
label: '斜体',
|
|
156
|
+
onClick: function onClick() {
|
|
157
|
+
insertTextAndFocusPositionRow({
|
|
158
|
+
text: '**',
|
|
159
|
+
position: 1
|
|
160
|
+
});
|
|
161
|
+
}
|
|
162
|
+
}, {
|
|
163
|
+
id: 'strikethrough',
|
|
164
|
+
icon: /*#__PURE__*/React.createElement(StrikethroughIcon, {
|
|
165
|
+
sx: {
|
|
166
|
+
fontSize: '1rem'
|
|
167
|
+
}
|
|
168
|
+
}),
|
|
169
|
+
label: '删除线',
|
|
170
|
+
onClick: function onClick() {
|
|
171
|
+
insertTextAndFocusPositionRow({
|
|
172
|
+
text: '~~~~',
|
|
173
|
+
position: 2
|
|
174
|
+
});
|
|
175
|
+
}
|
|
176
|
+
}, {
|
|
177
|
+
id: 'underline',
|
|
178
|
+
icon: /*#__PURE__*/React.createElement(UnderlineIcon, {
|
|
179
|
+
sx: {
|
|
180
|
+
fontSize: '1rem'
|
|
181
|
+
}
|
|
182
|
+
}),
|
|
183
|
+
label: '下划线',
|
|
184
|
+
onClick: function onClick() {
|
|
185
|
+
insertTextAndFocusPositionRow({
|
|
186
|
+
text: '++++',
|
|
187
|
+
position: 2
|
|
188
|
+
});
|
|
189
|
+
}
|
|
190
|
+
}, {
|
|
191
|
+
id: 'highlight',
|
|
192
|
+
icon: /*#__PURE__*/React.createElement(MarkPenLineIcon, {
|
|
193
|
+
sx: {
|
|
194
|
+
fontSize: '1rem'
|
|
195
|
+
}
|
|
196
|
+
}),
|
|
197
|
+
label: '高亮',
|
|
198
|
+
onClick: function onClick() {
|
|
199
|
+
insertTextAndFocusPositionRow({
|
|
200
|
+
text: '====',
|
|
201
|
+
position: 2
|
|
202
|
+
});
|
|
203
|
+
}
|
|
204
|
+
}, {
|
|
205
|
+
id: 'superscript',
|
|
206
|
+
icon: /*#__PURE__*/React.createElement(SuperscriptIcon, {
|
|
207
|
+
sx: {
|
|
208
|
+
fontSize: '1rem'
|
|
209
|
+
}
|
|
210
|
+
}),
|
|
211
|
+
label: '上标',
|
|
212
|
+
onClick: function onClick() {
|
|
213
|
+
insertTextAndFocusPositionRow({
|
|
214
|
+
text: '^^',
|
|
215
|
+
position: 1
|
|
216
|
+
});
|
|
217
|
+
}
|
|
218
|
+
}, {
|
|
219
|
+
id: 'subscript',
|
|
220
|
+
icon: /*#__PURE__*/React.createElement(SubscriptIcon, {
|
|
221
|
+
sx: {
|
|
222
|
+
fontSize: '1rem'
|
|
223
|
+
}
|
|
224
|
+
}),
|
|
225
|
+
label: '下标',
|
|
226
|
+
onClick: function onClick() {
|
|
227
|
+
insertTextAndFocusPositionRow({
|
|
228
|
+
text: '~~',
|
|
229
|
+
position: 1
|
|
230
|
+
});
|
|
231
|
+
}
|
|
232
|
+
}, {
|
|
233
|
+
id: 'divider-1'
|
|
234
|
+
}, {
|
|
235
|
+
id: 'bullet-list',
|
|
236
|
+
icon: /*#__PURE__*/React.createElement(ListUnorderedIcon, {
|
|
237
|
+
sx: {
|
|
238
|
+
fontSize: '1rem'
|
|
239
|
+
}
|
|
240
|
+
}),
|
|
241
|
+
label: '无序列表',
|
|
242
|
+
onClick: function onClick() {
|
|
243
|
+
insertTextAndFocusPositionRow({
|
|
244
|
+
text: '- ',
|
|
245
|
+
position: 2,
|
|
246
|
+
block: true
|
|
247
|
+
});
|
|
248
|
+
}
|
|
249
|
+
}, {
|
|
250
|
+
id: 'ordered-list',
|
|
251
|
+
icon: /*#__PURE__*/React.createElement(ListOrdered2Icon, {
|
|
252
|
+
sx: {
|
|
253
|
+
fontSize: '1rem'
|
|
254
|
+
}
|
|
255
|
+
}),
|
|
256
|
+
label: '有序列表',
|
|
257
|
+
onClick: function onClick() {
|
|
258
|
+
insertTextAndFocusPositionRow({
|
|
259
|
+
text: '1. ',
|
|
260
|
+
position: 3,
|
|
261
|
+
block: true
|
|
262
|
+
});
|
|
263
|
+
}
|
|
264
|
+
}, {
|
|
265
|
+
id: 'task-list',
|
|
266
|
+
icon: /*#__PURE__*/React.createElement(ListCheck3Icon, {
|
|
267
|
+
sx: {
|
|
268
|
+
fontSize: '1rem'
|
|
269
|
+
}
|
|
270
|
+
}),
|
|
271
|
+
label: '任务列表',
|
|
272
|
+
onClick: function onClick() {
|
|
273
|
+
insertTextAndFocusPositionRow({
|
|
274
|
+
text: '- [ ] ',
|
|
275
|
+
position: 6,
|
|
276
|
+
block: true
|
|
277
|
+
});
|
|
278
|
+
}
|
|
279
|
+
}, {
|
|
280
|
+
id: 'divider-2'
|
|
281
|
+
}, {
|
|
282
|
+
id: 'inline-math',
|
|
283
|
+
icon: /*#__PURE__*/React.createElement(SquareRootIcon, {
|
|
284
|
+
sx: {
|
|
285
|
+
fontSize: '1rem'
|
|
286
|
+
}
|
|
287
|
+
}),
|
|
288
|
+
label: '行内数学公式',
|
|
289
|
+
onClick: function onClick() {
|
|
290
|
+
insertTextAndFocusPositionRow({
|
|
291
|
+
text: '$$',
|
|
292
|
+
position: 1
|
|
293
|
+
});
|
|
294
|
+
}
|
|
295
|
+
}, {
|
|
296
|
+
id: 'block-math',
|
|
297
|
+
icon: /*#__PURE__*/React.createElement(FunctionsIcon, {
|
|
298
|
+
sx: {
|
|
299
|
+
fontSize: '1rem'
|
|
300
|
+
}
|
|
301
|
+
}),
|
|
302
|
+
label: '块级数学公式',
|
|
303
|
+
onClick: function onClick() {
|
|
304
|
+
insertTextAndFocusPositionRow({
|
|
305
|
+
text: '$$\n\n$$',
|
|
306
|
+
row: 1,
|
|
307
|
+
block: true
|
|
308
|
+
});
|
|
309
|
+
}
|
|
310
|
+
}, {
|
|
311
|
+
id: 'code',
|
|
312
|
+
icon: /*#__PURE__*/React.createElement(CodeLineIcon, {
|
|
313
|
+
sx: {
|
|
314
|
+
fontSize: '1rem'
|
|
315
|
+
}
|
|
316
|
+
}),
|
|
317
|
+
label: '代码',
|
|
318
|
+
onClick: function onClick() {
|
|
319
|
+
insertTextAndFocusPositionRow({
|
|
320
|
+
text: '``',
|
|
321
|
+
position: 1
|
|
322
|
+
});
|
|
323
|
+
}
|
|
324
|
+
}, {
|
|
325
|
+
id: 'codeBlock',
|
|
326
|
+
icon: /*#__PURE__*/React.createElement(CodeBoxLineIcon, {
|
|
327
|
+
sx: {
|
|
328
|
+
fontSize: '1rem'
|
|
329
|
+
}
|
|
330
|
+
}),
|
|
331
|
+
label: '代码块',
|
|
332
|
+
onClick: function onClick() {
|
|
333
|
+
insertTextAndFocusPositionRow({
|
|
334
|
+
text: '```\n\n```',
|
|
335
|
+
row: 1,
|
|
336
|
+
block: true
|
|
337
|
+
});
|
|
338
|
+
}
|
|
339
|
+
}, {
|
|
340
|
+
id: 'divider-3'
|
|
341
|
+
}, {
|
|
342
|
+
id: 'link',
|
|
343
|
+
icon: /*#__PURE__*/React.createElement(LinkIcon, {
|
|
344
|
+
sx: {
|
|
345
|
+
fontSize: '1rem'
|
|
346
|
+
}
|
|
347
|
+
}),
|
|
348
|
+
label: '链接',
|
|
349
|
+
onClick: function onClick() {
|
|
350
|
+
insertTextAndFocusPositionRow({
|
|
351
|
+
text: '[]()',
|
|
352
|
+
position: 1
|
|
353
|
+
});
|
|
354
|
+
}
|
|
355
|
+
}];
|
|
356
|
+
return /*#__PURE__*/React.createElement(Stack, {
|
|
357
|
+
direction: 'row',
|
|
358
|
+
alignItems: 'center'
|
|
359
|
+
}, /*#__PURE__*/React.createElement(Menu, {
|
|
360
|
+
context: /*#__PURE__*/React.createElement(ToolbarItem, {
|
|
361
|
+
text: '插入',
|
|
362
|
+
icon: /*#__PURE__*/React.createElement(AddCircleFillIcon, {
|
|
363
|
+
sx: {
|
|
364
|
+
fontSize: '1rem'
|
|
365
|
+
}
|
|
366
|
+
})
|
|
367
|
+
}),
|
|
368
|
+
anchorOrigin: {
|
|
369
|
+
vertical: 'bottom',
|
|
370
|
+
horizontal: 'left'
|
|
371
|
+
},
|
|
372
|
+
transformOrigin: {
|
|
373
|
+
vertical: 'top',
|
|
374
|
+
horizontal: 'left'
|
|
375
|
+
},
|
|
376
|
+
arrowIcon: /*#__PURE__*/React.createElement(ArrowDownSLineIcon, {
|
|
377
|
+
sx: {
|
|
378
|
+
fontSize: '1rem',
|
|
379
|
+
transform: 'rotate(-90deg)'
|
|
380
|
+
}
|
|
381
|
+
}),
|
|
382
|
+
zIndex: isExpend ? 2100 : undefined,
|
|
383
|
+
list: [{
|
|
384
|
+
customLabel: /*#__PURE__*/React.createElement(Typography, {
|
|
385
|
+
sx: {
|
|
386
|
+
px: 1,
|
|
387
|
+
pt: 2,
|
|
388
|
+
fontSize: '12px',
|
|
389
|
+
color: 'text.disabled'
|
|
390
|
+
}
|
|
391
|
+
}, "\u901A\u7528"),
|
|
392
|
+
key: 'current-node'
|
|
393
|
+
}, {
|
|
394
|
+
label: '图片',
|
|
395
|
+
key: 'image',
|
|
396
|
+
icon: /*#__PURE__*/React.createElement(ImageLineIcon, {
|
|
397
|
+
sx: {
|
|
398
|
+
fontSize: '1rem'
|
|
399
|
+
}
|
|
400
|
+
}),
|
|
401
|
+
onClick: function onClick() {
|
|
402
|
+
return insertTextAndFocusPositionRow({
|
|
403
|
+
text: '![alt]()',
|
|
404
|
+
position: 7
|
|
405
|
+
});
|
|
406
|
+
}
|
|
407
|
+
}, {
|
|
408
|
+
label: '表格',
|
|
409
|
+
key: 'table',
|
|
410
|
+
icon: /*#__PURE__*/React.createElement(Table2Icon, {
|
|
411
|
+
sx: {
|
|
412
|
+
fontSize: '1rem'
|
|
413
|
+
}
|
|
414
|
+
}),
|
|
415
|
+
children: [{
|
|
416
|
+
key: 'table-size-picker',
|
|
417
|
+
customLabel: /*#__PURE__*/React.createElement(TableSizePicker, {
|
|
418
|
+
onConfirm: function onConfirm(cols, rows) {
|
|
419
|
+
var headerRow = "| ".concat(Array.from({
|
|
420
|
+
length: cols
|
|
421
|
+
}).map(function () {
|
|
422
|
+
return '';
|
|
423
|
+
}).join(' | '), " |\n");
|
|
424
|
+
var separatorRow = "| ".concat(Array.from({
|
|
425
|
+
length: cols
|
|
426
|
+
}).map(function () {
|
|
427
|
+
return '---';
|
|
428
|
+
}).join(' | '), " |\n");
|
|
429
|
+
var dataRows = Array.from({
|
|
430
|
+
length: rows
|
|
431
|
+
}).map(function () {
|
|
432
|
+
return "| ".concat(Array.from({
|
|
433
|
+
length: cols
|
|
434
|
+
}).map(function () {
|
|
435
|
+
return '';
|
|
436
|
+
}).join(' | '), " |\n");
|
|
437
|
+
}).join('');
|
|
438
|
+
var tableMarkdown = "".concat(headerRow).concat(separatorRow).concat(dataRows);
|
|
439
|
+
insertTextAndFocusPositionRow({
|
|
440
|
+
text: tableMarkdown,
|
|
441
|
+
position: 1,
|
|
442
|
+
block: true
|
|
443
|
+
});
|
|
444
|
+
}
|
|
445
|
+
})
|
|
446
|
+
}]
|
|
447
|
+
}, {
|
|
448
|
+
customLabel: /*#__PURE__*/React.createElement(Typography, {
|
|
449
|
+
sx: {
|
|
450
|
+
px: 1,
|
|
451
|
+
pt: 2,
|
|
452
|
+
fontSize: '12px',
|
|
453
|
+
color: 'text.disabled'
|
|
454
|
+
}
|
|
455
|
+
}, "\u6837\u5F0F\u5E03\u5C40"),
|
|
456
|
+
key: 'style'
|
|
457
|
+
}, {
|
|
458
|
+
label: '分割线',
|
|
459
|
+
key: 'separator',
|
|
460
|
+
icon: /*#__PURE__*/React.createElement(SeparatorIcon, {
|
|
461
|
+
sx: {
|
|
462
|
+
fontSize: '1rem'
|
|
463
|
+
}
|
|
464
|
+
}),
|
|
465
|
+
onClick: function onClick() {
|
|
466
|
+
return insertTextAndFocusPositionRow({
|
|
467
|
+
text: '---',
|
|
468
|
+
position: 3,
|
|
469
|
+
block: true
|
|
470
|
+
});
|
|
471
|
+
}
|
|
472
|
+
}, {
|
|
473
|
+
label: '引用',
|
|
474
|
+
key: 'blockquote',
|
|
475
|
+
icon: /*#__PURE__*/React.createElement(DoubleQuotesLIcon, {
|
|
476
|
+
sx: {
|
|
477
|
+
fontSize: '1rem'
|
|
478
|
+
}
|
|
479
|
+
}),
|
|
480
|
+
onClick: function onClick() {
|
|
481
|
+
return insertTextAndFocusPositionRow({
|
|
482
|
+
text: '> ',
|
|
483
|
+
position: 2,
|
|
484
|
+
block: true
|
|
485
|
+
});
|
|
486
|
+
}
|
|
487
|
+
}, {
|
|
488
|
+
label: '折叠面板',
|
|
489
|
+
key: 'details',
|
|
490
|
+
icon: /*#__PURE__*/React.createElement(MenuFold2FillIcon, {
|
|
491
|
+
sx: {
|
|
492
|
+
fontSize: '1rem'
|
|
493
|
+
}
|
|
494
|
+
}),
|
|
495
|
+
onClick: function onClick() {
|
|
496
|
+
return insertTextAndFocusPositionRow({
|
|
497
|
+
text: ':::details\n\n:::detailsSummary\n\n:::\n\n:::detailsContent\n\n:::\n\n:::\n',
|
|
498
|
+
row: 1,
|
|
499
|
+
block: true
|
|
500
|
+
});
|
|
501
|
+
}
|
|
502
|
+
}, {
|
|
503
|
+
label: '警告提示',
|
|
504
|
+
key: 'highlight',
|
|
505
|
+
icon: /*#__PURE__*/React.createElement(Information2LineIcon, {
|
|
506
|
+
sx: {
|
|
507
|
+
fontSize: '1rem'
|
|
508
|
+
}
|
|
509
|
+
}),
|
|
510
|
+
children: [{
|
|
511
|
+
label: '信息 Info',
|
|
512
|
+
key: 'info',
|
|
513
|
+
icon: /*#__PURE__*/React.createElement(Information2FillIcon, {
|
|
514
|
+
sx: {
|
|
515
|
+
fontSize: '1rem',
|
|
516
|
+
color: 'primary.main'
|
|
517
|
+
}
|
|
518
|
+
}),
|
|
519
|
+
onClick: function onClick() {
|
|
520
|
+
insertTextAndFocusPositionRow({
|
|
521
|
+
text: ':::alert {variant="info"}\n\n:::',
|
|
522
|
+
row: -1,
|
|
523
|
+
block: true
|
|
524
|
+
});
|
|
525
|
+
}
|
|
526
|
+
}, {
|
|
527
|
+
label: '警告 Warning',
|
|
528
|
+
key: 'warning',
|
|
529
|
+
icon: /*#__PURE__*/React.createElement(ErrorWarningFillIcon, {
|
|
530
|
+
sx: {
|
|
531
|
+
fontSize: '1rem',
|
|
532
|
+
color: 'warning.main'
|
|
533
|
+
}
|
|
534
|
+
}),
|
|
535
|
+
onClick: function onClick() {
|
|
536
|
+
insertTextAndFocusPositionRow({
|
|
537
|
+
text: ':::alert {variant="warning"}\n\n:::',
|
|
538
|
+
row: -1,
|
|
539
|
+
block: true
|
|
540
|
+
});
|
|
541
|
+
}
|
|
542
|
+
}, {
|
|
543
|
+
label: '错误 Error',
|
|
544
|
+
key: 'error',
|
|
545
|
+
icon: /*#__PURE__*/React.createElement(CloseCircleFillIcon, {
|
|
546
|
+
sx: {
|
|
547
|
+
fontSize: '1rem',
|
|
548
|
+
color: 'error.main'
|
|
549
|
+
}
|
|
550
|
+
}),
|
|
551
|
+
onClick: function onClick() {
|
|
552
|
+
insertTextAndFocusPositionRow({
|
|
553
|
+
text: ':::alert {variant="error"}\n\n:::',
|
|
554
|
+
row: -1,
|
|
555
|
+
block: true
|
|
556
|
+
});
|
|
557
|
+
}
|
|
558
|
+
}, {
|
|
559
|
+
label: '成功 Success',
|
|
560
|
+
key: 'success',
|
|
561
|
+
icon: /*#__PURE__*/React.createElement(CheckboxCircleFillIcon, {
|
|
562
|
+
sx: {
|
|
563
|
+
fontSize: '1rem',
|
|
564
|
+
color: 'success.main'
|
|
565
|
+
}
|
|
566
|
+
}),
|
|
567
|
+
onClick: function onClick() {
|
|
568
|
+
insertTextAndFocusPositionRow({
|
|
569
|
+
text: ':::alert {variant="success"}\n\n:::',
|
|
570
|
+
row: -1,
|
|
571
|
+
block: true
|
|
572
|
+
});
|
|
573
|
+
}
|
|
574
|
+
}, {
|
|
575
|
+
label: '默认 Default',
|
|
576
|
+
key: 'default',
|
|
577
|
+
icon: /*#__PURE__*/React.createElement(UserSmileFillIcon, {
|
|
578
|
+
sx: {
|
|
579
|
+
fontSize: '1rem',
|
|
580
|
+
color: 'text.disabled'
|
|
581
|
+
}
|
|
582
|
+
}),
|
|
583
|
+
onClick: function onClick() {
|
|
584
|
+
insertTextAndFocusPositionRow({
|
|
585
|
+
text: ':::alert {variant="default"}\n\n:::',
|
|
586
|
+
row: -1,
|
|
587
|
+
block: true
|
|
588
|
+
});
|
|
589
|
+
}
|
|
590
|
+
}]
|
|
591
|
+
}]
|
|
592
|
+
}), /*#__PURE__*/React.createElement(Divider, {
|
|
593
|
+
sx: {
|
|
594
|
+
mx: 0.5,
|
|
595
|
+
height: 20,
|
|
596
|
+
alignSelf: 'center'
|
|
597
|
+
},
|
|
598
|
+
orientation: "vertical",
|
|
599
|
+
flexItem: true
|
|
600
|
+
}), /*#__PURE__*/React.createElement(Menu, {
|
|
601
|
+
context: /*#__PURE__*/React.createElement(ToolbarItem, {
|
|
602
|
+
tip: '标题',
|
|
603
|
+
text: /*#__PURE__*/React.createElement(Box, {
|
|
604
|
+
sx: {
|
|
605
|
+
position: 'relative',
|
|
606
|
+
pr: 1
|
|
607
|
+
}
|
|
608
|
+
}, /*#__PURE__*/React.createElement(Box, {
|
|
609
|
+
sx: {
|
|
610
|
+
width: '38px',
|
|
611
|
+
textAlign: 'left'
|
|
612
|
+
}
|
|
613
|
+
}, "\u6807\u9898"), /*#__PURE__*/React.createElement(ArrowDownSLineIcon, {
|
|
614
|
+
sx: {
|
|
615
|
+
position: 'absolute',
|
|
616
|
+
right: -6,
|
|
617
|
+
top: '50%',
|
|
618
|
+
transform: 'translateY(-50%)',
|
|
619
|
+
flexSelf: 'center',
|
|
620
|
+
fontSize: '1rem',
|
|
621
|
+
flexShrink: 0,
|
|
622
|
+
mr: 0,
|
|
623
|
+
color: 'text.disabled',
|
|
624
|
+
cursor: 'pointer',
|
|
625
|
+
pointerEvents: 'none'
|
|
626
|
+
}
|
|
627
|
+
}))
|
|
628
|
+
}),
|
|
629
|
+
anchorOrigin: {
|
|
630
|
+
vertical: 'bottom',
|
|
631
|
+
horizontal: 'left'
|
|
632
|
+
},
|
|
633
|
+
transformOrigin: {
|
|
634
|
+
vertical: 'top',
|
|
635
|
+
horizontal: 'left'
|
|
636
|
+
},
|
|
637
|
+
arrowIcon: /*#__PURE__*/React.createElement(ArrowDownSLineIcon, {
|
|
638
|
+
sx: {
|
|
639
|
+
fontSize: '1rem',
|
|
640
|
+
transform: 'rotate(-90deg)'
|
|
641
|
+
}
|
|
642
|
+
}),
|
|
643
|
+
zIndex: isExpend ? 2100 : undefined,
|
|
644
|
+
list: _toConsumableArray(HeadingOptions.map(function (it) {
|
|
645
|
+
return {
|
|
646
|
+
label: it.label,
|
|
647
|
+
key: it.id,
|
|
648
|
+
icon: it.icon,
|
|
649
|
+
onClick: it.onClick
|
|
650
|
+
};
|
|
651
|
+
}))
|
|
652
|
+
}), ToolList.map(function (it) {
|
|
653
|
+
return it.id.includes('divider') ? /*#__PURE__*/React.createElement(Divider, {
|
|
654
|
+
key: it.id,
|
|
655
|
+
sx: {
|
|
656
|
+
mx: 0.5,
|
|
657
|
+
height: 20,
|
|
658
|
+
alignSelf: 'center'
|
|
659
|
+
},
|
|
660
|
+
orientation: "vertical",
|
|
661
|
+
flexItem: true
|
|
662
|
+
}) : /*#__PURE__*/React.createElement(ToolbarItem, {
|
|
663
|
+
key: it.id,
|
|
664
|
+
tip: it.label,
|
|
665
|
+
icon: it.icon,
|
|
666
|
+
onClick: it === null || it === void 0 ? void 0 : it.onClick
|
|
667
|
+
});
|
|
668
|
+
}));
|
|
669
|
+
};
|
|
670
|
+
export default EditorMarkdownToolbar;
|
|
@@ -2,12 +2,21 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
|
|
|
2
2
|
function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap; var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator.return && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, catch: function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; }
|
|
3
3
|
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
|
|
4
4
|
function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
|
|
5
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
6
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
7
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
8
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
9
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
10
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
5
11
|
import { EditorMarkdown, EditorThemeProvider, useTiptap } from "./..";
|
|
6
12
|
import { Box } from '@mui/material';
|
|
7
|
-
import React from 'react';
|
|
8
|
-
import { MARKDOWN_EDITOR_PLACEHOLDER } from "../contants/markdown-placeholder";
|
|
13
|
+
import React, { useState } from 'react';
|
|
9
14
|
import "../index.css";
|
|
10
15
|
var Reader = function Reader() {
|
|
16
|
+
var _useState = useState(''),
|
|
17
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
18
|
+
mdContent = _useState2[0],
|
|
19
|
+
setMdContent = _useState2[1];
|
|
11
20
|
var _useTiptap = useTiptap({
|
|
12
21
|
editable: false,
|
|
13
22
|
contentType: 'markdown',
|
|
@@ -67,58 +76,17 @@ var Reader = function Reader() {
|
|
|
67
76
|
return onValidateUrl;
|
|
68
77
|
}(),
|
|
69
78
|
onSave: function onSave(editor) {
|
|
70
|
-
|
|
71
|
-
editor.chain().focus().setContent(value, {
|
|
72
|
-
|
|
73
|
-
}).run()
|
|
79
|
+
// const value = editor.getMarkdown();
|
|
80
|
+
// editor.chain().focus().setContent(value, {
|
|
81
|
+
// contentType: 'markdown'
|
|
82
|
+
// }).run()
|
|
74
83
|
},
|
|
75
|
-
|
|
76
|
-
var
|
|
77
|
-
var prefix, suffix;
|
|
84
|
+
onUpload: function () {
|
|
85
|
+
var _onUpload = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(file, onProgress) {
|
|
78
86
|
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
|
|
79
87
|
while (1) switch (_context2.prev = _context2.next) {
|
|
80
88
|
case 0:
|
|
81
|
-
prefix = _ref.prefix, suffix = _ref.suffix;
|
|
82
89
|
return _context2.abrupt("return", new Promise(function (resolve) {
|
|
83
|
-
resolve(['this is a default suggestion.', 'we are good.', 'what is your name?', 'how are you?', 'what is your favorite color?', 'what is your favorite food?', 'what is your favorite animal?', 'what is your favorite book?', 'what is your favorite movie?', 'what is your favorite song?', 'what is your favorite artist?', 'what is your favorite band?', 'what is your favorite city?', 'what is your favorite country?', 'what is your favorite sport?'][Math.floor(Math.random() * 10)]);
|
|
84
|
-
}));
|
|
85
|
-
case 2:
|
|
86
|
-
case "end":
|
|
87
|
-
return _context2.stop();
|
|
88
|
-
}
|
|
89
|
-
}, _callee2);
|
|
90
|
-
}));
|
|
91
|
-
function onAiWritingGetSuggestion(_x3) {
|
|
92
|
-
return _onAiWritingGetSuggestion.apply(this, arguments);
|
|
93
|
-
}
|
|
94
|
-
return onAiWritingGetSuggestion;
|
|
95
|
-
}(),
|
|
96
|
-
// onTocUpdate: handleTocUpdate,
|
|
97
|
-
// onMentionFilter: async ({ query }: { query: string }) => {
|
|
98
|
-
// return new Promise((resolve) => {
|
|
99
|
-
// resolve([
|
|
100
|
-
// 'Winona Ryder',
|
|
101
|
-
// 'Molly Ringwald',
|
|
102
|
-
// 'Ally Sheedy',
|
|
103
|
-
// 'Debbie Harry',
|
|
104
|
-
// 'Olivia Newton-John',
|
|
105
|
-
// 'Elton John',
|
|
106
|
-
// 'Michael J. Fox',
|
|
107
|
-
// 'Axl Rose',
|
|
108
|
-
// 'Emilio Estevez',
|
|
109
|
-
// 'Ralph Macchio',
|
|
110
|
-
// 'Rob Lowe',
|
|
111
|
-
// 'Jennifer Grey',
|
|
112
|
-
// ].filter(item => item.toLowerCase().startsWith(query.toLowerCase()))
|
|
113
|
-
// .slice(0, 5))
|
|
114
|
-
// })
|
|
115
|
-
// },
|
|
116
|
-
onUpload: function () {
|
|
117
|
-
var _onUpload = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(file, onProgress) {
|
|
118
|
-
return _regeneratorRuntime().wrap(function _callee3$(_context3) {
|
|
119
|
-
while (1) switch (_context3.prev = _context3.next) {
|
|
120
|
-
case 0:
|
|
121
|
-
return _context3.abrupt("return", new Promise(function (resolve) {
|
|
122
90
|
var progress = 0;
|
|
123
91
|
var interval = setInterval(function () {
|
|
124
92
|
progress += Math.random() * 20;
|
|
@@ -146,16 +114,16 @@ var Reader = function Reader() {
|
|
|
146
114
|
}));
|
|
147
115
|
case 1:
|
|
148
116
|
case "end":
|
|
149
|
-
return
|
|
117
|
+
return _context2.stop();
|
|
150
118
|
}
|
|
151
|
-
},
|
|
119
|
+
}, _callee2);
|
|
152
120
|
}));
|
|
153
|
-
function onUpload(
|
|
121
|
+
function onUpload(_x3, _x4) {
|
|
154
122
|
return _onUpload.apply(this, arguments);
|
|
155
123
|
}
|
|
156
124
|
return onUpload;
|
|
157
125
|
}(),
|
|
158
|
-
content:
|
|
126
|
+
content: mdContent
|
|
159
127
|
}),
|
|
160
128
|
editor = _useTiptap.editor;
|
|
161
129
|
return /*#__PURE__*/React.createElement(EditorThemeProvider, {
|
|
@@ -173,7 +141,8 @@ var Reader = function Reader() {
|
|
|
173
141
|
}, /*#__PURE__*/React.createElement(EditorMarkdown, {
|
|
174
142
|
editor: editor,
|
|
175
143
|
height: '500px',
|
|
176
|
-
value:
|
|
144
|
+
value: mdContent,
|
|
145
|
+
onAceChange: setMdContent
|
|
177
146
|
})));
|
|
178
147
|
};
|
|
179
148
|
export default Reader;
|
|
@@ -15,6 +15,7 @@ import { alpha, Box, Divider, IconButton, Stack, useTheme } from "@mui/material"
|
|
|
15
15
|
import React, { forwardRef, useEffect, useImperativeHandle, useMemo, useRef, useState } from "react";
|
|
16
16
|
import AceEditor from "react-ace";
|
|
17
17
|
import { MARKDOWN_EDITOR_PLACEHOLDER } from "../contants/markdown-placeholder";
|
|
18
|
+
import EditorMarkdownToolbar from "./Toolbar";
|
|
18
19
|
import 'ace-builds/src-noconflict/ace';
|
|
19
20
|
import 'ace-builds/src-noconflict/ext-language_tools';
|
|
20
21
|
import 'ace-builds/src-noconflict/mode-markdown';
|
|
@@ -26,7 +27,7 @@ var EditorMarkdown = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
26
27
|
height = _ref.height;
|
|
27
28
|
var theme = useTheme();
|
|
28
29
|
var aceEditorRef = useRef(null);
|
|
29
|
-
var _useState = useState('
|
|
30
|
+
var _useState = useState('edit'),
|
|
30
31
|
_useState2 = _slicedToArray(_useState, 2),
|
|
31
32
|
displayMode = _useState2[0],
|
|
32
33
|
setDisplayMode = _useState2[1];
|
|
@@ -35,13 +36,13 @@ var EditorMarkdown = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
35
36
|
isExpend = _useState4[0],
|
|
36
37
|
setIsExpend = _useState4[1];
|
|
37
38
|
var EditorHeight = useMemo(function () {
|
|
38
|
-
return isExpend ? 'calc(100vh -
|
|
39
|
+
return isExpend ? 'calc(100vh - 45px)' : height;
|
|
39
40
|
}, [isExpend, height]);
|
|
40
41
|
var onChange = function onChange(value) {
|
|
41
42
|
onAceChange === null || onAceChange === void 0 || onAceChange(value);
|
|
42
|
-
editor.
|
|
43
|
+
editor.commands.setContent(value, {
|
|
43
44
|
contentType: 'markdown'
|
|
44
|
-
})
|
|
45
|
+
});
|
|
45
46
|
};
|
|
46
47
|
useImperativeHandle(ref, function () {
|
|
47
48
|
return {
|
|
@@ -96,16 +97,42 @@ var EditorMarkdown = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
96
97
|
color: 'primary.main',
|
|
97
98
|
bgcolor: alpha(theme.palette.primary.main, 0.1)
|
|
98
99
|
},
|
|
99
|
-
'
|
|
100
|
+
'.md-display-mode:hover': {
|
|
100
101
|
borderRadius: '4px',
|
|
101
102
|
bgcolor: 'background.paper3'
|
|
102
103
|
}
|
|
103
104
|
}
|
|
104
|
-
}, /*#__PURE__*/React.createElement(
|
|
105
|
+
}, /*#__PURE__*/React.createElement(EditorMarkdownToolbar, {
|
|
106
|
+
aceEditorRef: aceEditorRef,
|
|
107
|
+
isExpend: isExpend
|
|
108
|
+
}), /*#__PURE__*/React.createElement(Stack, {
|
|
109
|
+
direction: 'row',
|
|
110
|
+
alignItems: 'center',
|
|
111
|
+
gap: 1
|
|
112
|
+
}, /*#__PURE__*/React.createElement(IconButton, {
|
|
113
|
+
color: "inherit",
|
|
114
|
+
onClick: function onClick() {
|
|
115
|
+
return setIsExpend(!isExpend);
|
|
116
|
+
}
|
|
117
|
+
}, isExpend ? /*#__PURE__*/React.createElement(CollapseIcon, {
|
|
118
|
+
sx: {
|
|
119
|
+
fontSize: '16px'
|
|
120
|
+
}
|
|
121
|
+
}) : /*#__PURE__*/React.createElement(ExpendIcon, {
|
|
122
|
+
sx: {
|
|
123
|
+
fontSize: '16px'
|
|
124
|
+
}
|
|
125
|
+
})), /*#__PURE__*/React.createElement(Stack, {
|
|
105
126
|
direction: 'row',
|
|
106
|
-
alignItems: 'center'
|
|
127
|
+
alignItems: 'center',
|
|
128
|
+
sx: {
|
|
129
|
+
p: 0.5,
|
|
130
|
+
borderRadius: '4px',
|
|
131
|
+
border: '1px solid',
|
|
132
|
+
borderColor: 'divider'
|
|
133
|
+
}
|
|
107
134
|
}, /*#__PURE__*/React.createElement(Box, {
|
|
108
|
-
className: displayMode === '
|
|
135
|
+
className: displayMode === 'edit' ? 'md-display-mode-active' : 'md-display-mode',
|
|
109
136
|
sx: {
|
|
110
137
|
px: 1,
|
|
111
138
|
py: 0.25,
|
|
@@ -113,10 +140,10 @@ var EditorMarkdown = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
113
140
|
borderRadius: '4px'
|
|
114
141
|
},
|
|
115
142
|
onClick: function onClick() {
|
|
116
|
-
return setDisplayMode('
|
|
143
|
+
return setDisplayMode('edit');
|
|
117
144
|
}
|
|
118
|
-
}, "\
|
|
119
|
-
className: displayMode === '
|
|
145
|
+
}, "\u7F16\u8F91\u6A21\u5F0F"), /*#__PURE__*/React.createElement(Box, {
|
|
146
|
+
className: displayMode === 'preview' ? 'md-display-mode-active' : 'md-display-mode',
|
|
120
147
|
sx: {
|
|
121
148
|
px: 1,
|
|
122
149
|
py: 0.25,
|
|
@@ -124,10 +151,10 @@ var EditorMarkdown = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
124
151
|
borderRadius: '4px'
|
|
125
152
|
},
|
|
126
153
|
onClick: function onClick() {
|
|
127
|
-
return setDisplayMode('
|
|
154
|
+
return setDisplayMode('preview');
|
|
128
155
|
}
|
|
129
|
-
}, "\
|
|
130
|
-
className: displayMode === '
|
|
156
|
+
}, "\u9884\u89C8\u6A21\u5F0F"), /*#__PURE__*/React.createElement(Box, {
|
|
157
|
+
className: displayMode === 'split' ? 'md-display-mode-active' : 'md-display-mode',
|
|
131
158
|
sx: {
|
|
132
159
|
px: 1,
|
|
133
160
|
py: 0.25,
|
|
@@ -135,23 +162,9 @@ var EditorMarkdown = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
135
162
|
borderRadius: '4px'
|
|
136
163
|
},
|
|
137
164
|
onClick: function onClick() {
|
|
138
|
-
return setDisplayMode('
|
|
139
|
-
}
|
|
140
|
-
}, "\u9884\u89C8\u6A21\u5F0F")), /*#__PURE__*/React.createElement(IconButton, {
|
|
141
|
-
size: "small",
|
|
142
|
-
color: "inherit",
|
|
143
|
-
onClick: function onClick() {
|
|
144
|
-
return setIsExpend(!isExpend);
|
|
145
|
-
}
|
|
146
|
-
}, isExpend ? /*#__PURE__*/React.createElement(CollapseIcon, {
|
|
147
|
-
sx: {
|
|
148
|
-
fontSize: '14px'
|
|
149
|
-
}
|
|
150
|
-
}) : /*#__PURE__*/React.createElement(ExpendIcon, {
|
|
151
|
-
sx: {
|
|
152
|
-
fontSize: '14px'
|
|
165
|
+
return setDisplayMode('split');
|
|
153
166
|
}
|
|
154
|
-
}))), /*#__PURE__*/React.createElement(Stack, {
|
|
167
|
+
}, "\u5206\u5C4F\u6A21\u5F0F")))), /*#__PURE__*/React.createElement(Stack, {
|
|
155
168
|
direction: 'row',
|
|
156
169
|
alignItems: 'stretch',
|
|
157
170
|
sx: {
|
|
@@ -28,7 +28,8 @@ var NestedList = function NestedList(_ref) {
|
|
|
28
28
|
horizontal: 'left'
|
|
29
29
|
}
|
|
30
30
|
} : _ref$childrenProps,
|
|
31
|
-
onItemClick = _ref.onItemClick
|
|
31
|
+
onItemClick = _ref.onItemClick,
|
|
32
|
+
zIndex = _ref.zIndex;
|
|
32
33
|
var _React$useState = React.useState(null),
|
|
33
34
|
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
34
35
|
hoveredItem = _React$useState2[0],
|
|
@@ -102,9 +103,11 @@ var NestedList = function NestedList(_ref) {
|
|
|
102
103
|
open: Boolean(subMenuAnchor),
|
|
103
104
|
anchorEl: subMenuAnchor,
|
|
104
105
|
onClose: handleItemLeave,
|
|
105
|
-
sx: {
|
|
106
|
+
sx: _objectSpread({
|
|
106
107
|
pointerEvents: 'none'
|
|
107
|
-
},
|
|
108
|
+
}, zIndex ? {
|
|
109
|
+
zIndex: zIndex
|
|
110
|
+
} : {}),
|
|
108
111
|
disableScrollLock: true,
|
|
109
112
|
disableAutoFocus: true,
|
|
110
113
|
disableEnforceFocus: true,
|
|
@@ -1,4 +1,7 @@
|
|
|
1
1
|
import { MenuProps } from "../../type";
|
|
2
2
|
import React from 'react';
|
|
3
|
-
|
|
3
|
+
export interface MenuRef {
|
|
4
|
+
close: () => void;
|
|
5
|
+
}
|
|
6
|
+
declare const Menu: React.ForwardRefExoticComponent<MenuProps & React.RefAttributes<MenuRef>>;
|
|
4
7
|
export default Menu;
|
|
@@ -7,7 +7,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
|
7
7
|
import { Box, Popover } from '@mui/material';
|
|
8
8
|
import React from 'react';
|
|
9
9
|
import NestedList from "./NestedList";
|
|
10
|
-
var Menu = function
|
|
10
|
+
var Menu = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
11
11
|
var _ref$id = _ref.id,
|
|
12
12
|
id = _ref$id === void 0 ? 'menu-select' : _ref$id,
|
|
13
13
|
width = _ref.width,
|
|
@@ -36,7 +36,8 @@ var Menu = function Menu(_ref) {
|
|
|
36
36
|
vertical: 'top',
|
|
37
37
|
horizontal: 'left'
|
|
38
38
|
}
|
|
39
|
-
} : _ref$childrenProps
|
|
39
|
+
} : _ref$childrenProps,
|
|
40
|
+
zIndex = _ref.zIndex;
|
|
40
41
|
var _React$useState = React.useState(null),
|
|
41
42
|
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
42
43
|
anchorEl = _React$useState2[0],
|
|
@@ -51,6 +52,11 @@ var Menu = function Menu(_ref) {
|
|
|
51
52
|
var handleClose = function handleClose() {
|
|
52
53
|
setAnchorEl(null);
|
|
53
54
|
};
|
|
55
|
+
React.useImperativeHandle(ref, function () {
|
|
56
|
+
return {
|
|
57
|
+
close: handleClose
|
|
58
|
+
};
|
|
59
|
+
});
|
|
54
60
|
var handleItemClick = function handleItemClick(item) {
|
|
55
61
|
if (item.onClick) {
|
|
56
62
|
item.onClick();
|
|
@@ -72,7 +78,10 @@ var Menu = function Menu(_ref) {
|
|
|
72
78
|
disableScrollLock: true,
|
|
73
79
|
disableAutoFocus: true,
|
|
74
80
|
disableEnforceFocus: true,
|
|
75
|
-
disableRestoreFocus: true
|
|
81
|
+
disableRestoreFocus: true,
|
|
82
|
+
sx: zIndex ? {
|
|
83
|
+
zIndex: zIndex
|
|
84
|
+
} : undefined
|
|
76
85
|
}, /*#__PURE__*/React.createElement(Box, {
|
|
77
86
|
sx: {
|
|
78
87
|
p: 0.5
|
|
@@ -84,7 +93,9 @@ var Menu = function Menu(_ref) {
|
|
|
84
93
|
list: list,
|
|
85
94
|
arrowIcon: arrowIcon,
|
|
86
95
|
childrenProps: childrenProps,
|
|
87
|
-
onItemClick: handleItemClick
|
|
96
|
+
onItemClick: handleItemClick,
|
|
97
|
+
zIndex: zIndex
|
|
88
98
|
}))));
|
|
89
|
-
};
|
|
99
|
+
});
|
|
100
|
+
Menu.displayName = 'Menu';
|
|
90
101
|
export default Menu;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { Box } from "@mui/material";
|
|
2
|
+
import { MarkViewContent } from "@tiptap/react";
|
|
3
|
+
import React from "react";
|
|
4
|
+
var LinkViewWrapper = function LinkViewWrapper(_ref) {
|
|
5
|
+
var editor = _ref.editor;
|
|
6
|
+
return /*#__PURE__*/React.createElement(MarkViewContent, null, /*#__PURE__*/React.createElement(Box, null, "aaa"));
|
|
7
|
+
};
|
|
8
|
+
export default LinkViewWrapper;
|
|
@@ -7,6 +7,6 @@ export interface UploadProgressAttributes {
|
|
|
7
7
|
tempId: string;
|
|
8
8
|
}
|
|
9
9
|
export declare const getFileIcon: (fileType: string) => React.JSX.Element;
|
|
10
|
-
export declare const getFileTypeText: (fileType: string) => "
|
|
10
|
+
export declare const getFileTypeText: (fileType: string) => "音频" | "图片" | "视频" | "文件";
|
|
11
11
|
declare const UploadProgressView: React.FC<NodeViewProps>;
|
|
12
12
|
export default UploadProgressView;
|
package/dist/extension/index.js
CHANGED
|
@@ -6,6 +6,7 @@ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToAr
|
|
|
6
6
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
7
7
|
import Highlight from '@tiptap/extension-highlight';
|
|
8
8
|
import InvisibleCharacters from '@tiptap/extension-invisible-characters';
|
|
9
|
+
import Link from '@tiptap/extension-link';
|
|
9
10
|
import TextAlign from '@tiptap/extension-text-align';
|
|
10
11
|
import { TextStyleKit } from '@tiptap/extension-text-style';
|
|
11
12
|
import { CharacterCount, Placeholder } from '@tiptap/extensions';
|
|
@@ -43,7 +44,7 @@ export var getExtensions = function getExtensions(_ref) {
|
|
|
43
44
|
color: 'var(--mui-palette-primary-main)',
|
|
44
45
|
width: 2
|
|
45
46
|
}
|
|
46
|
-
}), TextStyleKit, CodeExtension, ListExtension, EmojiExtension, AlertExtension, CustomSubscript, DetailsExtension, CustomSuperscript,
|
|
47
|
+
}), TextStyleKit, CodeExtension, ListExtension, EmojiExtension, AlertExtension, CustomSubscript, DetailsExtension, CustomSuperscript, DetailsContentExtension, DetailsSummaryExtension, CodeBlockLowlightExtension, InlineUploadProgressExtension, YamlFormat, CustomHorizontalRule].concat(_toConsumableArray(TableExtension({
|
|
47
48
|
editable: editable
|
|
48
49
|
})), [TableOfContents({
|
|
49
50
|
onTocUpdate: onTocUpdate
|
|
@@ -92,7 +93,7 @@ export var getExtensions = function getExtensions(_ref) {
|
|
|
92
93
|
}
|
|
93
94
|
})]);
|
|
94
95
|
if (contentType === 'markdown') {
|
|
95
|
-
defaultExtensions.push(Markdown.configure({
|
|
96
|
+
defaultExtensions.push.apply(defaultExtensions, [Link, Markdown.configure({
|
|
96
97
|
indentation: {
|
|
97
98
|
style: 'space',
|
|
98
99
|
size: 2
|
|
@@ -102,9 +103,9 @@ export var getExtensions = function getExtensions(_ref) {
|
|
|
102
103
|
breaks: false,
|
|
103
104
|
pedantic: false
|
|
104
105
|
}
|
|
105
|
-
}));
|
|
106
|
+
})]);
|
|
106
107
|
} else {
|
|
107
|
-
defaultExtensions.push.apply(defaultExtensions, [BlockLinkExtension, IframeExtension({
|
|
108
|
+
defaultExtensions.push.apply(defaultExtensions, [InlineLinkExtension, BlockLinkExtension, IframeExtension({
|
|
108
109
|
onError: onError,
|
|
109
110
|
onValidateUrl: onValidateUrl
|
|
110
111
|
}), VideoExtension({
|
|
@@ -1,58 +1,11 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
// renderHTML: (attributes: any) => {
|
|
13
|
-
// return {
|
|
14
|
-
// 'data-type': attributes.type,
|
|
15
|
-
// }
|
|
16
|
-
// }
|
|
17
|
-
// },
|
|
18
|
-
// title: {
|
|
19
|
-
// default: '',
|
|
20
|
-
// parseHTML: (element: HTMLElement) => {
|
|
21
|
-
// return element.getAttribute('data-title') || ''
|
|
22
|
-
// },
|
|
23
|
-
// renderHTML: (attributes: any) => {
|
|
24
|
-
// return {
|
|
25
|
-
// 'data-title': attributes.title,
|
|
26
|
-
// }
|
|
27
|
-
// }
|
|
28
|
-
// },
|
|
29
|
-
// }
|
|
30
|
-
// },
|
|
31
|
-
// addKeyboardShortcuts() {
|
|
32
|
-
// return {
|
|
33
|
-
// 'Mod-k': () => {
|
|
34
|
-
// return this.editor.commands.setLink({ href: '' })
|
|
35
|
-
// }
|
|
36
|
-
// }
|
|
37
|
-
// },
|
|
38
|
-
// // addMarkView() {
|
|
39
|
-
// // return ReactMarkViewRenderer(LinkViewWrapper, {
|
|
40
|
-
// // as: 'a',
|
|
41
|
-
// // })
|
|
42
|
-
// // }
|
|
43
|
-
// })
|
|
44
|
-
|
|
45
|
-
// export const LinkExtension = customLink.configure({
|
|
46
|
-
// autolink: true,
|
|
47
|
-
// openOnClick: true,
|
|
48
|
-
// enableClickSelection: true,
|
|
49
|
-
// linkOnPaste: true,
|
|
50
|
-
// protocols: ['http', 'https', 'mailto', 'tel'],
|
|
51
|
-
// defaultProtocol: 'http',
|
|
52
|
-
// HTMLAttributes: {
|
|
53
|
-
// rel: null,
|
|
54
|
-
// target: '_blank',
|
|
55
|
-
// },
|
|
56
|
-
// })
|
|
57
|
-
|
|
58
|
-
// export default LinkExtension
|
|
1
|
+
import { Link } from "@tiptap/extension-link";
|
|
2
|
+
import { ReactMarkViewRenderer } from "@tiptap/react";
|
|
3
|
+
import LinkViewWrapper from "../component/Link/Markdown";
|
|
4
|
+
var CustomLink = Link.extend({
|
|
5
|
+
addMarkView: function addMarkView() {
|
|
6
|
+
return ReactMarkViewRenderer(LinkViewWrapper, {
|
|
7
|
+
as: 'a'
|
|
8
|
+
});
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
export default CustomLink;
|
|
@@ -199,25 +199,6 @@ export var InlineLinkExtension = Node.create({
|
|
|
199
199
|
}
|
|
200
200
|
return ['a', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes), title];
|
|
201
201
|
},
|
|
202
|
-
markdownTokenName: 'link',
|
|
203
|
-
parseMarkdown: function parseMarkdown(token, helpers) {
|
|
204
|
-
var content = helpers.parseInline(token.tokens || []);
|
|
205
|
-
return {
|
|
206
|
-
type: 'inlineLink',
|
|
207
|
-
attrs: {
|
|
208
|
-
href: token.href,
|
|
209
|
-
title: token.title || null,
|
|
210
|
-
type: 'text'
|
|
211
|
-
},
|
|
212
|
-
content: content
|
|
213
|
-
};
|
|
214
|
-
},
|
|
215
|
-
renderMarkdown: function renderMarkdown(node, h) {
|
|
216
|
-
var _node$attrs, _node$attrs2;
|
|
217
|
-
var href = ((_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.href) || '';
|
|
218
|
-
var text = ((_node$attrs2 = node.attrs) === null || _node$attrs2 === void 0 ? void 0 : _node$attrs2.title) || h.renderChildren(node) || '';
|
|
219
|
-
return "[".concat(text, "](").concat(href, ")");
|
|
220
|
-
},
|
|
221
202
|
addCommands: function addCommands() {
|
|
222
203
|
var _this3 = this;
|
|
223
204
|
return {
|
package/dist/type/index.d.ts
CHANGED