@ctzhian/tiptap 1.12.6 → 1.12.8
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 +2 -2
- package/dist/EditorMarkdown/Toolbar.d.ts +3 -1
- package/dist/EditorMarkdown/Toolbar.js +187 -17
- package/dist/EditorMarkdown/demo.js +72 -58
- package/dist/EditorMarkdown/index.d.ts +2 -0
- package/dist/EditorMarkdown/index.js +4 -2
- package/dist/component/CustomDragHandle/index.js +3 -3
- package/dist/component/Toolbar/EditorInsert/index.js +3 -3
- package/dist/contants/enums.js +1 -1
- package/dist/contants/markdown-placeholder.d.ts +1 -1
- package/dist/contants/markdown-placeholder.js +1 -1
- package/dist/contants/slash-commands.js +1 -1
- package/dist/extension/component/Alert/index.js +85 -73
- package/dist/extension/component/Link/Markdown.js +36 -4
- package/dist/extension/component/SlashCommandsList/index.js +6 -6
- package/dist/extension/component/UploadProgress/index.d.ts +1 -1
- package/dist/extension/index.js +12 -12
- package/dist/extension/mark/Link.js +76 -2
- package/dist/extension/node/Video.js +0 -3
- package/package.json +1 -1
package/dist/Editor/demo.js
CHANGED
|
@@ -8,7 +8,7 @@ import React from 'react';
|
|
|
8
8
|
import "../index.css";
|
|
9
9
|
var Reader = function Reader() {
|
|
10
10
|
var _useTiptap = useTiptap({
|
|
11
|
-
editable:
|
|
11
|
+
editable: true,
|
|
12
12
|
exclude: ['invisibleCharacters'],
|
|
13
13
|
onError: function onError(error) {
|
|
14
14
|
alert(error.message);
|
|
@@ -152,7 +152,7 @@ var Reader = function Reader() {
|
|
|
152
152
|
}
|
|
153
153
|
return onUpload;
|
|
154
154
|
}(),
|
|
155
|
-
content:
|
|
155
|
+
content: ''
|
|
156
156
|
}),
|
|
157
157
|
editor = _useTiptap.editor;
|
|
158
158
|
return /*#__PURE__*/React.createElement(EditorThemeProvider, {
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import AceEditor from "react-ace";
|
|
3
|
+
import { UploadFunction } from "../type";
|
|
3
4
|
interface EditorMarkdownToolbarProps {
|
|
4
5
|
aceEditorRef: React.RefObject<AceEditor>;
|
|
5
6
|
isExpend?: boolean;
|
|
7
|
+
onUpload?: UploadFunction;
|
|
6
8
|
}
|
|
7
|
-
declare const EditorMarkdownToolbar: ({ aceEditorRef, isExpend }: EditorMarkdownToolbarProps) => React.JSX.Element;
|
|
9
|
+
declare const EditorMarkdownToolbar: ({ aceEditorRef, isExpend, onUpload }: EditorMarkdownToolbarProps) => React.JSX.Element;
|
|
8
10
|
export default EditorMarkdownToolbar;
|
|
@@ -1,18 +1,92 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
1
2
|
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
2
3
|
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
4
|
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
5
|
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
5
6
|
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
6
7
|
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; }
|
|
8
|
+
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; }
|
|
9
|
+
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); } }
|
|
10
|
+
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); }); }; }
|
|
7
11
|
import { Box, Divider, Stack, Typography } from "@mui/material";
|
|
8
12
|
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";
|
|
13
|
+
import { AddCircleFillIcon, ArrowDownSLineIcon, AttachmentLineIcon, BoldIcon, CheckboxCircleFillIcon, CloseCircleFillIcon, CodeBoxLineIcon, CodeLineIcon, DoubleQuotesLIcon, ErrorWarningFillIcon, Folder2LineIcon, FunctionsIcon, H1Icon, H2Icon, H3Icon, H4Icon, H5Icon, H6Icon, ImageLineIcon, Information2FillIcon, Information2LineIcon, ItalicIcon, LinkIcon, ListCheck3Icon, ListOrdered2Icon, ListUnorderedIcon, MarkPenLineIcon, MenuFold2FillIcon, MovieLineIcon, Music2LineIcon, SeparatorIcon, SquareRootIcon, StrikethroughIcon, SubscriptIcon, SuperscriptIcon, Table2Icon, UnderlineIcon, UserSmileFillIcon } from "../component/Icons";
|
|
10
14
|
import Menu from "../component/Menu";
|
|
11
15
|
import { ToolbarItem } from "../component/Toolbar";
|
|
12
16
|
import TableSizePicker from "../component/Toolbar/TableSizePicker";
|
|
17
|
+
import { getFileType } from "../util/fileHandler";
|
|
13
18
|
var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
14
19
|
var aceEditorRef = _ref.aceEditorRef,
|
|
15
|
-
isExpend = _ref.isExpend
|
|
20
|
+
isExpend = _ref.isExpend,
|
|
21
|
+
onUpload = _ref.onUpload;
|
|
22
|
+
var imageInputRef = React.useRef(null);
|
|
23
|
+
var videoInputRef = React.useRef(null);
|
|
24
|
+
var audioInputRef = React.useRef(null);
|
|
25
|
+
var attachmentInputRef = React.useRef(null);
|
|
26
|
+
var handleFileUpload = /*#__PURE__*/function () {
|
|
27
|
+
var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(file, expectedType) {
|
|
28
|
+
var url, fileType, content;
|
|
29
|
+
return _regeneratorRuntime().wrap(function _callee$(_context) {
|
|
30
|
+
while (1) switch (_context.prev = _context.next) {
|
|
31
|
+
case 0:
|
|
32
|
+
if (onUpload) {
|
|
33
|
+
_context.next = 2;
|
|
34
|
+
break;
|
|
35
|
+
}
|
|
36
|
+
return _context.abrupt("return");
|
|
37
|
+
case 2:
|
|
38
|
+
_context.prev = 2;
|
|
39
|
+
_context.next = 5;
|
|
40
|
+
return onUpload(file, function (_ref3) {
|
|
41
|
+
var progress = _ref3.progress;
|
|
42
|
+
// 可以在这里显示上传进度
|
|
43
|
+
console.log('Upload progress:', progress);
|
|
44
|
+
});
|
|
45
|
+
case 5:
|
|
46
|
+
url = _context.sent;
|
|
47
|
+
fileType = getFileType(file);
|
|
48
|
+
content = ''; // 根据文件类型插入对应的内容
|
|
49
|
+
if (expectedType === 'image') {
|
|
50
|
+
// 图片：插入 [file.name](url)
|
|
51
|
+
content = "![".concat(file.name, "](").concat(url, ")");
|
|
52
|
+
} else if (expectedType === 'video') {
|
|
53
|
+
// 视频：插入 <video src="url"></video>
|
|
54
|
+
content = "<p>\n<video src=\"".concat(url, "\" controls=\"true\"></video>\n</p>");
|
|
55
|
+
} else if (expectedType === 'audio') {
|
|
56
|
+
// 音频：插入 <audio src="url"></audio>
|
|
57
|
+
content = "<p>\n<audio src=\"".concat(url, "\" controls=\"true\"></audio>\n</p>");
|
|
58
|
+
} else {
|
|
59
|
+
// 附件：插入 <a href="url" download="file.name">file.name</a>
|
|
60
|
+
content = "<p>\n<a href=\"".concat(url, "\" download=\"").concat(file.name, "\">").concat(file.name, "</a>\n</p>");
|
|
61
|
+
}
|
|
62
|
+
insertTextAndFocusPositionRow({
|
|
63
|
+
text: content,
|
|
64
|
+
block: true
|
|
65
|
+
});
|
|
66
|
+
_context.next = 15;
|
|
67
|
+
break;
|
|
68
|
+
case 12:
|
|
69
|
+
_context.prev = 12;
|
|
70
|
+
_context.t0 = _context["catch"](2);
|
|
71
|
+
console.error('文件上传失败:', _context.t0);
|
|
72
|
+
case 15:
|
|
73
|
+
case "end":
|
|
74
|
+
return _context.stop();
|
|
75
|
+
}
|
|
76
|
+
}, _callee, null, [[2, 12]]);
|
|
77
|
+
}));
|
|
78
|
+
return function handleFileUpload(_x, _x2) {
|
|
79
|
+
return _ref2.apply(this, arguments);
|
|
80
|
+
};
|
|
81
|
+
}();
|
|
82
|
+
var handleFileSelect = function handleFileSelect(event, expectedType) {
|
|
83
|
+
var _event$target$files;
|
|
84
|
+
var file = (_event$target$files = event.target.files) === null || _event$target$files === void 0 ? void 0 : _event$target$files[0];
|
|
85
|
+
if (file) {
|
|
86
|
+
handleFileUpload(file, expectedType);
|
|
87
|
+
}
|
|
88
|
+
event.target.value = '';
|
|
89
|
+
};
|
|
16
90
|
var insertTextAndFocusPositionRow = function insertTextAndFocusPositionRow(options) {
|
|
17
91
|
var _aceEditorRef$current;
|
|
18
92
|
var _options$position = options.position,
|
|
@@ -352,6 +426,20 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
352
426
|
position: 1
|
|
353
427
|
});
|
|
354
428
|
}
|
|
429
|
+
}, {
|
|
430
|
+
id: 'image',
|
|
431
|
+
icon: /*#__PURE__*/React.createElement(ImageLineIcon, {
|
|
432
|
+
sx: {
|
|
433
|
+
fontSize: '1rem'
|
|
434
|
+
}
|
|
435
|
+
}),
|
|
436
|
+
label: '图片',
|
|
437
|
+
onClick: function onClick() {
|
|
438
|
+
insertTextAndFocusPositionRow({
|
|
439
|
+
text: '![alt]()',
|
|
440
|
+
position: 7
|
|
441
|
+
});
|
|
442
|
+
}
|
|
355
443
|
}];
|
|
356
444
|
return /*#__PURE__*/React.createElement(Stack, {
|
|
357
445
|
direction: 'row',
|
|
@@ -390,20 +478,6 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
390
478
|
}
|
|
391
479
|
}, "\u901A\u7528"),
|
|
392
480
|
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
481
|
}, {
|
|
408
482
|
label: '表格',
|
|
409
483
|
key: 'table',
|
|
@@ -444,6 +518,63 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
444
518
|
}
|
|
445
519
|
})
|
|
446
520
|
}]
|
|
521
|
+
}, {
|
|
522
|
+
label: '上传文件',
|
|
523
|
+
key: 'upload-file',
|
|
524
|
+
icon: /*#__PURE__*/React.createElement(Folder2LineIcon, {
|
|
525
|
+
sx: {
|
|
526
|
+
fontSize: '1rem'
|
|
527
|
+
}
|
|
528
|
+
}),
|
|
529
|
+
children: [{
|
|
530
|
+
label: '上传图片',
|
|
531
|
+
key: 'upload-image',
|
|
532
|
+
icon: /*#__PURE__*/React.createElement(ImageLineIcon, {
|
|
533
|
+
sx: {
|
|
534
|
+
fontSize: '1rem'
|
|
535
|
+
}
|
|
536
|
+
}),
|
|
537
|
+
onClick: function onClick() {
|
|
538
|
+
var _imageInputRef$curren;
|
|
539
|
+
return (_imageInputRef$curren = imageInputRef.current) === null || _imageInputRef$curren === void 0 ? void 0 : _imageInputRef$curren.click();
|
|
540
|
+
}
|
|
541
|
+
}, {
|
|
542
|
+
label: '上传视频',
|
|
543
|
+
key: 'upload-video',
|
|
544
|
+
icon: /*#__PURE__*/React.createElement(MovieLineIcon, {
|
|
545
|
+
sx: {
|
|
546
|
+
fontSize: '1rem'
|
|
547
|
+
}
|
|
548
|
+
}),
|
|
549
|
+
onClick: function onClick() {
|
|
550
|
+
var _videoInputRef$curren;
|
|
551
|
+
return (_videoInputRef$curren = videoInputRef.current) === null || _videoInputRef$curren === void 0 ? void 0 : _videoInputRef$curren.click();
|
|
552
|
+
}
|
|
553
|
+
}, {
|
|
554
|
+
label: '上传音频',
|
|
555
|
+
key: 'upload-audio',
|
|
556
|
+
icon: /*#__PURE__*/React.createElement(Music2LineIcon, {
|
|
557
|
+
sx: {
|
|
558
|
+
fontSize: '1rem'
|
|
559
|
+
}
|
|
560
|
+
}),
|
|
561
|
+
onClick: function onClick() {
|
|
562
|
+
var _audioInputRef$curren;
|
|
563
|
+
return (_audioInputRef$curren = audioInputRef.current) === null || _audioInputRef$curren === void 0 ? void 0 : _audioInputRef$curren.click();
|
|
564
|
+
}
|
|
565
|
+
}, {
|
|
566
|
+
label: '上传附件',
|
|
567
|
+
key: 'upload-attachment',
|
|
568
|
+
icon: /*#__PURE__*/React.createElement(AttachmentLineIcon, {
|
|
569
|
+
sx: {
|
|
570
|
+
fontSize: '1rem'
|
|
571
|
+
}
|
|
572
|
+
}),
|
|
573
|
+
onClick: function onClick() {
|
|
574
|
+
var _attachmentInputRef$c;
|
|
575
|
+
return (_attachmentInputRef$c = attachmentInputRef.current) === null || _attachmentInputRef$c === void 0 ? void 0 : _attachmentInputRef$c.click();
|
|
576
|
+
}
|
|
577
|
+
}]
|
|
447
578
|
}, {
|
|
448
579
|
customLabel: /*#__PURE__*/React.createElement(Typography, {
|
|
449
580
|
sx: {
|
|
@@ -500,7 +631,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
500
631
|
});
|
|
501
632
|
}
|
|
502
633
|
}, {
|
|
503
|
-
label: '
|
|
634
|
+
label: '警告块',
|
|
504
635
|
key: 'highlight',
|
|
505
636
|
icon: /*#__PURE__*/React.createElement(Information2LineIcon, {
|
|
506
637
|
sx: {
|
|
@@ -665,6 +796,45 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
665
796
|
icon: it.icon,
|
|
666
797
|
onClick: it === null || it === void 0 ? void 0 : it.onClick
|
|
667
798
|
});
|
|
799
|
+
}), /*#__PURE__*/React.createElement("input", {
|
|
800
|
+
ref: imageInputRef,
|
|
801
|
+
type: "file",
|
|
802
|
+
accept: "image/*",
|
|
803
|
+
style: {
|
|
804
|
+
display: 'none'
|
|
805
|
+
},
|
|
806
|
+
onChange: function onChange(e) {
|
|
807
|
+
return handleFileSelect(e, 'image');
|
|
808
|
+
}
|
|
809
|
+
}), /*#__PURE__*/React.createElement("input", {
|
|
810
|
+
ref: videoInputRef,
|
|
811
|
+
type: "file",
|
|
812
|
+
accept: "video/*",
|
|
813
|
+
style: {
|
|
814
|
+
display: 'none'
|
|
815
|
+
},
|
|
816
|
+
onChange: function onChange(e) {
|
|
817
|
+
return handleFileSelect(e, 'video');
|
|
818
|
+
}
|
|
819
|
+
}), /*#__PURE__*/React.createElement("input", {
|
|
820
|
+
ref: audioInputRef,
|
|
821
|
+
type: "file",
|
|
822
|
+
accept: "audio/*",
|
|
823
|
+
style: {
|
|
824
|
+
display: 'none'
|
|
825
|
+
},
|
|
826
|
+
onChange: function onChange(e) {
|
|
827
|
+
return handleFileSelect(e, 'audio');
|
|
828
|
+
}
|
|
829
|
+
}), /*#__PURE__*/React.createElement("input", {
|
|
830
|
+
ref: attachmentInputRef,
|
|
831
|
+
type: "file",
|
|
832
|
+
style: {
|
|
833
|
+
display: 'none'
|
|
834
|
+
},
|
|
835
|
+
onChange: function onChange(e) {
|
|
836
|
+
return handleFileSelect(e, 'attachment');
|
|
837
|
+
}
|
|
668
838
|
}));
|
|
669
839
|
};
|
|
670
840
|
export default EditorMarkdownToolbar;
|
|
@@ -10,13 +10,54 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
|
|
|
10
10
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
11
11
|
import { EditorMarkdown, EditorThemeProvider, useTiptap } from "./..";
|
|
12
12
|
import { Box } from '@mui/material';
|
|
13
|
-
import React, { useState } from 'react';
|
|
13
|
+
import React, { useCallback, useEffect, useState } from 'react';
|
|
14
14
|
import "../index.css";
|
|
15
15
|
var Reader = function Reader() {
|
|
16
16
|
var _useState = useState(''),
|
|
17
17
|
_useState2 = _slicedToArray(_useState, 2),
|
|
18
18
|
mdContent = _useState2[0],
|
|
19
19
|
setMdContent = _useState2[1];
|
|
20
|
+
var onUpload = /*#__PURE__*/function () {
|
|
21
|
+
var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(file, onProgress) {
|
|
22
|
+
return _regeneratorRuntime().wrap(function _callee$(_context) {
|
|
23
|
+
while (1) switch (_context.prev = _context.next) {
|
|
24
|
+
case 0:
|
|
25
|
+
return _context.abrupt("return", new Promise(function (resolve) {
|
|
26
|
+
var progress = 0;
|
|
27
|
+
var interval = setInterval(function () {
|
|
28
|
+
progress += Math.random() * 20;
|
|
29
|
+
if (progress >= 100) {
|
|
30
|
+
progress = 100;
|
|
31
|
+
onProgress === null || onProgress === void 0 || onProgress({
|
|
32
|
+
progress: progress / 100
|
|
33
|
+
});
|
|
34
|
+
clearInterval(interval);
|
|
35
|
+
setTimeout(function () {
|
|
36
|
+
if (file.type.startsWith('image/')) {
|
|
37
|
+
resolve('https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg');
|
|
38
|
+
} else if (file.type.startsWith('video/')) {
|
|
39
|
+
resolve('http://vjs.zencdn.net/v/oceans.mp4');
|
|
40
|
+
} else {
|
|
41
|
+
resolve('https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg');
|
|
42
|
+
}
|
|
43
|
+
}, 200);
|
|
44
|
+
} else {
|
|
45
|
+
onProgress === null || onProgress === void 0 || onProgress({
|
|
46
|
+
progress: progress / 100
|
|
47
|
+
});
|
|
48
|
+
}
|
|
49
|
+
}, 100);
|
|
50
|
+
}));
|
|
51
|
+
case 1:
|
|
52
|
+
case "end":
|
|
53
|
+
return _context.stop();
|
|
54
|
+
}
|
|
55
|
+
}, _callee);
|
|
56
|
+
}));
|
|
57
|
+
return function onUpload(_x, _x2) {
|
|
58
|
+
return _ref.apply(this, arguments);
|
|
59
|
+
};
|
|
60
|
+
}();
|
|
20
61
|
var _useTiptap = useTiptap({
|
|
21
62
|
editable: false,
|
|
22
63
|
contentType: 'markdown',
|
|
@@ -25,107 +66,79 @@ var Reader = function Reader() {
|
|
|
25
66
|
console.error('Editor Error:', error);
|
|
26
67
|
},
|
|
27
68
|
onValidateUrl: function () {
|
|
28
|
-
var _onValidateUrl = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function
|
|
29
|
-
return _regeneratorRuntime().wrap(function
|
|
30
|
-
while (1) switch (
|
|
69
|
+
var _onValidateUrl = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(url, type) {
|
|
70
|
+
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
|
|
71
|
+
while (1) switch (_context2.prev = _context2.next) {
|
|
31
72
|
case 0:
|
|
32
73
|
console.log("\u9A8C\u8BC1 ".concat(type, " \u94FE\u63A5:"), url);
|
|
33
74
|
|
|
34
75
|
// 拦截 base64 链接
|
|
35
76
|
if (!url.startsWith('data:')) {
|
|
36
|
-
|
|
77
|
+
_context2.next = 3;
|
|
37
78
|
break;
|
|
38
79
|
}
|
|
39
80
|
throw new Error("\u4E0D\u652F\u6301 base64 \u94FE\u63A5\uFF0C\u8BF7\u4F7F\u7528\u53EF\u8BBF\u95EE\u7684 ".concat(type, " URL"));
|
|
40
81
|
case 3:
|
|
41
|
-
|
|
42
|
-
|
|
82
|
+
_context2.t0 = type;
|
|
83
|
+
_context2.next = _context2.t0 === 'image' ? 6 : _context2.t0 === 'video' ? 8 : _context2.t0 === 'audio' ? 10 : _context2.t0 === 'iframe' ? 12 : 14;
|
|
43
84
|
break;
|
|
44
85
|
case 6:
|
|
45
86
|
if (!url.match(/\.(jpg|jpeg|png|gif|webp|svg)(\?.*)?$/i)) {
|
|
46
87
|
console.warn('图片链接可能不是有效的图片格式');
|
|
47
88
|
}
|
|
48
|
-
return
|
|
89
|
+
return _context2.abrupt("break", 14);
|
|
49
90
|
case 8:
|
|
50
91
|
if (!url.match(/\.(mp4|webm|ogg|mov|avi|wmv|flv|mkv)(\?.*)?$/i)) {
|
|
51
92
|
console.warn('视频链接可能不是有效的视频格式');
|
|
52
93
|
}
|
|
53
|
-
return
|
|
94
|
+
return _context2.abrupt("break", 14);
|
|
54
95
|
case 10:
|
|
55
96
|
if (!url.match(/\.(mp3|wav|ogg|m4a|flac|aac|wma)(\?.*)?$/i)) {
|
|
56
97
|
console.warn('音频链接可能不是有效的音频格式');
|
|
57
98
|
}
|
|
58
|
-
return
|
|
99
|
+
return _context2.abrupt("break", 14);
|
|
59
100
|
case 12:
|
|
60
101
|
// iframe 可以嵌入任何 URL，但可以检查是否是 HTTPS
|
|
61
102
|
if (url.startsWith('http://') && !url.includes('localhost')) {
|
|
62
103
|
console.warn('建议使用 HTTPS 链接以确保安全性');
|
|
63
104
|
}
|
|
64
|
-
return
|
|
105
|
+
return _context2.abrupt("break", 14);
|
|
65
106
|
case 14:
|
|
66
|
-
return
|
|
107
|
+
return _context2.abrupt("return", url);
|
|
67
108
|
case 15:
|
|
68
109
|
case "end":
|
|
69
|
-
return
|
|
110
|
+
return _context2.stop();
|
|
70
111
|
}
|
|
71
|
-
},
|
|
112
|
+
}, _callee2);
|
|
72
113
|
}));
|
|
73
|
-
function onValidateUrl(
|
|
114
|
+
function onValidateUrl(_x3, _x4) {
|
|
74
115
|
return _onValidateUrl.apply(this, arguments);
|
|
75
116
|
}
|
|
76
117
|
return onValidateUrl;
|
|
77
118
|
}(),
|
|
78
119
|
onSave: function onSave(editor) {
|
|
79
|
-
|
|
120
|
+
var value = editor.getMarkdown();
|
|
121
|
+
console.log(value);
|
|
80
122
|
// editor.chain().focus().setContent(value, {
|
|
81
123
|
// contentType: 'markdown'
|
|
82
124
|
// }).run()
|
|
83
125
|
},
|
|
84
|
-
onUpload: function () {
|
|
85
|
-
var _onUpload = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(file, onProgress) {
|
|
86
|
-
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
|
|
87
|
-
while (1) switch (_context2.prev = _context2.next) {
|
|
88
|
-
case 0:
|
|
89
|
-
return _context2.abrupt("return", new Promise(function (resolve) {
|
|
90
|
-
var progress = 0;
|
|
91
|
-
var interval = setInterval(function () {
|
|
92
|
-
progress += Math.random() * 20;
|
|
93
|
-
if (progress >= 100) {
|
|
94
|
-
progress = 100;
|
|
95
|
-
onProgress === null || onProgress === void 0 || onProgress({
|
|
96
|
-
progress: progress / 100
|
|
97
|
-
});
|
|
98
|
-
clearInterval(interval);
|
|
99
|
-
setTimeout(function () {
|
|
100
|
-
if (file.type.startsWith('image/')) {
|
|
101
|
-
resolve('https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg');
|
|
102
|
-
} else if (file.type.startsWith('video/')) {
|
|
103
|
-
resolve('http://vjs.zencdn.net/v/oceans.mp4');
|
|
104
|
-
} else {
|
|
105
|
-
resolve('https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg');
|
|
106
|
-
}
|
|
107
|
-
}, 200);
|
|
108
|
-
} else {
|
|
109
|
-
onProgress === null || onProgress === void 0 || onProgress({
|
|
110
|
-
progress: progress / 100
|
|
111
|
-
});
|
|
112
|
-
}
|
|
113
|
-
}, 100);
|
|
114
|
-
}));
|
|
115
|
-
case 1:
|
|
116
|
-
case "end":
|
|
117
|
-
return _context2.stop();
|
|
118
|
-
}
|
|
119
|
-
}, _callee2);
|
|
120
|
-
}));
|
|
121
|
-
function onUpload(_x3, _x4) {
|
|
122
|
-
return _onUpload.apply(this, arguments);
|
|
123
|
-
}
|
|
124
|
-
return onUpload;
|
|
125
|
-
}(),
|
|
126
126
|
content: mdContent
|
|
127
127
|
}),
|
|
128
128
|
editor = _useTiptap.editor;
|
|
129
|
+
var handleGlobalSave = useCallback(function (event) {
|
|
130
|
+
if ((event.ctrlKey || event.metaKey) && event.key === 's') {
|
|
131
|
+
event.preventDefault();
|
|
132
|
+
var value = editor.getHTML();
|
|
133
|
+
console.log(value);
|
|
134
|
+
}
|
|
135
|
+
}, [editor]);
|
|
136
|
+
useEffect(function () {
|
|
137
|
+
document.addEventListener('keydown', handleGlobalSave);
|
|
138
|
+
return function () {
|
|
139
|
+
document.removeEventListener('keydown', handleGlobalSave);
|
|
140
|
+
};
|
|
141
|
+
}, [handleGlobalSave]);
|
|
129
142
|
return /*#__PURE__*/React.createElement(EditorThemeProvider, {
|
|
130
143
|
mode: "light"
|
|
131
144
|
}, /*#__PURE__*/React.createElement(Box, {
|
|
@@ -142,6 +155,7 @@ var Reader = function Reader() {
|
|
|
142
155
|
editor: editor,
|
|
143
156
|
height: '500px',
|
|
144
157
|
value: mdContent,
|
|
158
|
+
onUpload: onUpload,
|
|
145
159
|
onAceChange: setMdContent
|
|
146
160
|
})));
|
|
147
161
|
};
|
|
@@ -4,6 +4,7 @@
|
|
|
4
4
|
/// <reference types="ace-builds/types/ace-theme" />
|
|
5
5
|
import { Editor } from '@tiptap/core';
|
|
6
6
|
import React from "react";
|
|
7
|
+
import { UploadFunction } from '../type';
|
|
7
8
|
import 'ace-builds/src-noconflict/ace';
|
|
8
9
|
import 'ace-builds/src-noconflict/ext-language_tools';
|
|
9
10
|
import 'ace-builds/src-noconflict/mode-markdown';
|
|
@@ -12,6 +13,7 @@ interface EditorMarkdownProps {
|
|
|
12
13
|
editor: Editor;
|
|
13
14
|
value?: string;
|
|
14
15
|
height: number | string;
|
|
16
|
+
onUpload?: UploadFunction;
|
|
15
17
|
onAceChange?: (value: string) => void;
|
|
16
18
|
onTiptapChange?: (value: string) => void;
|
|
17
19
|
}
|
|
@@ -24,7 +24,8 @@ var EditorMarkdown = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
24
24
|
var editor = _ref.editor,
|
|
25
25
|
value = _ref.value,
|
|
26
26
|
onAceChange = _ref.onAceChange,
|
|
27
|
-
height = _ref.height
|
|
27
|
+
height = _ref.height,
|
|
28
|
+
onUpload = _ref.onUpload;
|
|
28
29
|
var theme = useTheme();
|
|
29
30
|
var aceEditorRef = useRef(null);
|
|
30
31
|
var _useState = useState('edit'),
|
|
@@ -104,7 +105,8 @@ var EditorMarkdown = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
104
105
|
}
|
|
105
106
|
}, /*#__PURE__*/React.createElement(EditorMarkdownToolbar, {
|
|
106
107
|
aceEditorRef: aceEditorRef,
|
|
107
|
-
isExpend: isExpend
|
|
108
|
+
isExpend: isExpend,
|
|
109
|
+
onUpload: onUpload
|
|
108
110
|
}), /*#__PURE__*/React.createElement(Stack, {
|
|
109
111
|
direction: 'row',
|
|
110
112
|
alignItems: 'center',
|
|
@@ -1072,8 +1072,8 @@ var CustomDragHandle = function CustomDragHandle(_ref3) {
|
|
|
1072
1072
|
current.editor.commands.toggleBlockquote();
|
|
1073
1073
|
}
|
|
1074
1074
|
}
|
|
1075
|
-
}
|
|
1076
|
-
label: '
|
|
1075
|
+
}, {
|
|
1076
|
+
label: '警告块',
|
|
1077
1077
|
selected: ((_current$node14 = current.node) === null || _current$node14 === void 0 ? void 0 : _current$node14.type.name) === 'alert',
|
|
1078
1078
|
key: 'convert-to-alert',
|
|
1079
1079
|
icon: /*#__PURE__*/React.createElement(Information2LineIcon, {
|
|
@@ -1102,7 +1102,7 @@ var CustomDragHandle = function CustomDragHandle(_ref3) {
|
|
|
1102
1102
|
});
|
|
1103
1103
|
}
|
|
1104
1104
|
}
|
|
1105
|
-
}]
|
|
1105
|
+
}]
|
|
1106
1106
|
}] : []), _toConsumableArray(currentNode !== null && currentNode !== void 0 && currentNode.download && ((_current$node15 = current.node) !== null && _current$node15 !== void 0 && _current$node15.attrs.src || (_current$node16 = current.node) !== null && _current$node16 !== void 0 && _current$node16.attrs.src) ? [{
|
|
1107
1107
|
label: "\u4E0B\u8F7D".concat(currentNode === null || currentNode === void 0 ? void 0 : currentNode.label),
|
|
1108
1108
|
key: 'download',
|
|
@@ -223,8 +223,8 @@ var EditorInsert = function EditorInsert(_ref) {
|
|
|
223
223
|
onClick: function onClick() {
|
|
224
224
|
return editor.chain().focus().setDetails().run();
|
|
225
225
|
}
|
|
226
|
-
}
|
|
227
|
-
label: '
|
|
226
|
+
}, {
|
|
227
|
+
label: '警告块',
|
|
228
228
|
key: 'highlight',
|
|
229
229
|
icon: /*#__PURE__*/React.createElement(Information2LineIcon, {
|
|
230
230
|
sx: {
|
|
@@ -307,7 +307,7 @@ var EditorInsert = function EditorInsert(_ref) {
|
|
|
307
307
|
}).run();
|
|
308
308
|
}
|
|
309
309
|
}]
|
|
310
|
-
}
|
|
310
|
+
}, {
|
|
311
311
|
customLabel: /*#__PURE__*/React.createElement(Typography, {
|
|
312
312
|
sx: {
|
|
313
313
|
px: 1,
|
package/dist/contants/enums.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const MARKDOWN_EDITOR_PLACEHOLDER = "\u6807\u51C6 Markdown \u8BED\u6CD5\u901F\u67E5\uFF08GFM \u517C\u5BB9\uFF09\n\n# \u6807\u9898\u4E00\n## \u6807\u9898\u4E8C\n### \u6807\u9898\u4E09\n#### \u6807\u9898\u56DB \n##### \u6807\u9898\u4E94\n###### \u6807\u9898\u516D\n\n*\u659C\u4F53* \u6216 _\u659C\u4F53_\n**\u52A0\u7C97** \u6216 __\u52A0\u7C97__\n***\u52A0\u7C97\u659C\u4F53***\n~~\u5220\u9664\u7EBF~~\n^\u4E0A^\u6807\n~\u4E0B~\u6807\n++\u4E0B\u5212\u7EBF++\n\n- [ ] functionA\n- [x] functionB\n- [ ] functionC\n\n- \u65E0\u5E8F\u5217\u8868\u9879 A\n- \u65E0\u5E8F\u5217\u8868\u9879 B\n - \u65E0\u5E8F\u5217\u8868\u9879 B1\n\n1. \u6709\u5E8F\u5217\u8868\u9879 A\n2. \u6709\u5E8F\u5217\u8868\u9879 B\n a. \u6709\u5E8F\u5217\u8868\u9879 B1\n\n\u884C\u5185\u4EE3\u7801\uFF1A`console.log(\"hi\")`\n\n\u4EE3\u7801\u5757\uFF08\u8BED\u6CD5\u9AD8\u4EAE\uFF09\uFF1A\n```js\nfunction hello() {\n console.log(\"hi\");\n}\n```\n\n> \u5F15\u7528\n\n>> \u591A\u91CD\u5F15\u7528\n\n[\u94FE\u63A5](https://example.com)\n\n[](https://example.com)\n\n\u8868\u683C\uFF1A\n| \u52171 | \u52172 | \u53F3\u5BF9\u9F50 |\n|---|:---:|---:|\n| \u5DE6 | \u4E2D | \u53F3 |\n| a | b | 123 |\n\n\u5206\u9694\u7EBF\uFF1A\n`---`\n\n`***`\n\n\u884C\u5185\u6570\u5B66\u516C\u5F0F\uFF1A$ E = mc^2 $\n\u5757\u7EA7\u6570\u5B66\u516C\u5F0F\uFF1A\n$$\nint_{0}^{1} x^2 , dx = \frac{1}{3}\n$$\n\n\u8B66\u544A\
|
|
1
|
+
export declare const MARKDOWN_EDITOR_PLACEHOLDER = "\u6807\u51C6 Markdown \u8BED\u6CD5\u901F\u67E5\uFF08GFM \u517C\u5BB9\uFF09\n\n# \u6807\u9898\u4E00\n## \u6807\u9898\u4E8C\n### \u6807\u9898\u4E09\n#### \u6807\u9898\u56DB \n##### \u6807\u9898\u4E94\n###### \u6807\u9898\u516D\n\n*\u659C\u4F53* \u6216 _\u659C\u4F53_\n**\u52A0\u7C97** \u6216 __\u52A0\u7C97__\n***\u52A0\u7C97\u659C\u4F53***\n~~\u5220\u9664\u7EBF~~\n^\u4E0A^\u6807\n~\u4E0B~\u6807\n++\u4E0B\u5212\u7EBF++\n\n- [ ] functionA\n- [x] functionB\n- [ ] functionC\n\n- \u65E0\u5E8F\u5217\u8868\u9879 A\n- \u65E0\u5E8F\u5217\u8868\u9879 B\n - \u65E0\u5E8F\u5217\u8868\u9879 B1\n\n1. \u6709\u5E8F\u5217\u8868\u9879 A\n2. \u6709\u5E8F\u5217\u8868\u9879 B\n a. \u6709\u5E8F\u5217\u8868\u9879 B1\n\n\u884C\u5185\u4EE3\u7801\uFF1A`console.log(\"hi\")`\n\n\u4EE3\u7801\u5757\uFF08\u8BED\u6CD5\u9AD8\u4EAE\uFF09\uFF1A\n```js\nfunction hello() {\n console.log(\"hi\");\n}\n```\n\n> \u5F15\u7528\n\n>> \u591A\u91CD\u5F15\u7528\n\n[\u94FE\u63A5](https://example.com)\n\n[](https://example.com)\n\n\u8868\u683C\uFF1A\n| \u52171 | \u52172 | \u53F3\u5BF9\u9F50 |\n|---|:---:|---:|\n| \u5DE6 | \u4E2D | \u53F3 |\n| a | b | 123 |\n\n\u5206\u9694\u7EBF\uFF1A\n`---`\n\n`***`\n\n\u884C\u5185\u6570\u5B66\u516C\u5F0F\uFF1A$ E = mc^2 $\n\u5757\u7EA7\u6570\u5B66\u516C\u5F0F\uFF1A\n$$\nint_{0}^{1} x^2 , dx = \frac{1}{3}\n$$\n\n\u8B66\u544A\u5757\uFF1A\n:::alert {variant=\"warning\"}\n\n\u8FD9\u662F\u4E00\u6BB5\u8B66\u544A\u5757\n\n:::\n\n\u4FE1\u606F\u63D0\u793A\uFF1A\n:::alert {variant=\"info\"}\n\n\u8FD9\u662F\u4E00\u4E2A\u4FE1\u606F\u63D0\u793A\n\n:::\n\n\u6210\u529F\u63D0\u793A\uFF1A\n:::alert {variant=\"success\"}\n\n\u8FD9\u662F\u4E00\u4E2A\u6210\u529F\u63D0\u793A\n\n:::\n\n\u9519\u8BEF\u63D0\u793A\uFF1A\n:::alert {variant=\"error\"}\n\n\u8FD9\u662F\u4E00\u4E2A\u9519\u8BEF\u63D0\u793A\n\n:::\n\n\u9ED8\u8BA4\u63D0\u793A\uFF1A\n:::alert {variant=\"default\"}\n\n\u8FD9\u662F\u4E00\u4E2A\u9ED8\u8BA4\u63D0\u793A\n\n:::\n\n\u4E0D\u5E26\u56FE\u6807\u7684\u4FE1\u606F\u63D0\u793A\uFF1A\n:::alert {variant=\"info\" type=\"text\"}\n\n\u8FD9\u662F\u4E00\u4E2A\u4E0D\u5E26\u56FE\u6807\u7684\u4FE1\u606F\u63D0\u793A\n\n:::\n\n\u6298\u53E0\u5757 Details\uFF1A\n:::details {indent=\"0\" open}\n\n:::detailsSummary {indent=\"0\"}\n\n\u8FD9\u662F\u6298\u53E0\u9762\u677F\u7684\u6807\u9898\n\n:::\n\n:::detailsContent {indent=\"0\"}\n\n\u8FD9\u662F\u6298\u53E0\u9762\u677F\u7684\u5185\u5BB9\uFF0C\u53EF\u4EE5\u5C55\u793A\u5757\u7EA7\u5143\u7D20\n\n:::\n\n:::\n";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export var MARKDOWN_EDITOR_PLACEHOLDER = "\u6807\u51C6 Markdown \u8BED\u6CD5\u901F\u67E5\uFF08GFM \u517C\u5BB9\uFF09\n\n# \u6807\u9898\u4E00\n## \u6807\u9898\u4E8C\n### \u6807\u9898\u4E09\n#### \u6807\u9898\u56DB \n##### \u6807\u9898\u4E94\n###### \u6807\u9898\u516D\n\n*\u659C\u4F53* \u6216 _\u659C\u4F53_\n**\u52A0\u7C97** \u6216 __\u52A0\u7C97__\n***\u52A0\u7C97\u659C\u4F53***\n~~\u5220\u9664\u7EBF~~\n^\u4E0A^\u6807\n~\u4E0B~\u6807\n++\u4E0B\u5212\u7EBF++\n\n- [ ] functionA\n- [x] functionB\n- [ ] functionC\n\n- \u65E0\u5E8F\u5217\u8868\u9879 A\n- \u65E0\u5E8F\u5217\u8868\u9879 B\n - \u65E0\u5E8F\u5217\u8868\u9879 B1\n\n1. \u6709\u5E8F\u5217\u8868\u9879 A\n2. \u6709\u5E8F\u5217\u8868\u9879 B\n a. \u6709\u5E8F\u5217\u8868\u9879 B1\n\n\u884C\u5185\u4EE3\u7801\uFF1A`console.log(\"hi\")`\n\n\u4EE3\u7801\u5757\uFF08\u8BED\u6CD5\u9AD8\u4EAE\uFF09\uFF1A\n```js\nfunction hello() {\n console.log(\"hi\");\n}\n```\n\n> \u5F15\u7528\n\n>> \u591A\u91CD\u5F15\u7528\n\n[\u94FE\u63A5](https://example.com)\n\n[](https://example.com)\n\n\u8868\u683C\uFF1A\n| \u52171 | \u52172 | \u53F3\u5BF9\u9F50 |\n|---|:---:|---:|\n| \u5DE6 | \u4E2D | \u53F3 |\n| a | b | 123 |\n\n\u5206\u9694\u7EBF\uFF1A\n`---`\n\n`***`\n\n\u884C\u5185\u6570\u5B66\u516C\u5F0F\uFF1A$ E = mc^2 $\n\u5757\u7EA7\u6570\u5B66\u516C\u5F0F\uFF1A\n$$\nint_{0}^{1} x^2 , dx = \frac{1}{3}\n$$\n\n\u8B66\u544A\
|
|
1
|
+
export var MARKDOWN_EDITOR_PLACEHOLDER = "\u6807\u51C6 Markdown \u8BED\u6CD5\u901F\u67E5\uFF08GFM \u517C\u5BB9\uFF09\n\n# \u6807\u9898\u4E00\n## \u6807\u9898\u4E8C\n### \u6807\u9898\u4E09\n#### \u6807\u9898\u56DB \n##### \u6807\u9898\u4E94\n###### \u6807\u9898\u516D\n\n*\u659C\u4F53* \u6216 _\u659C\u4F53_\n**\u52A0\u7C97** \u6216 __\u52A0\u7C97__\n***\u52A0\u7C97\u659C\u4F53***\n~~\u5220\u9664\u7EBF~~\n^\u4E0A^\u6807\n~\u4E0B~\u6807\n++\u4E0B\u5212\u7EBF++\n\n- [ ] functionA\n- [x] functionB\n- [ ] functionC\n\n- \u65E0\u5E8F\u5217\u8868\u9879 A\n- \u65E0\u5E8F\u5217\u8868\u9879 B\n - \u65E0\u5E8F\u5217\u8868\u9879 B1\n\n1. \u6709\u5E8F\u5217\u8868\u9879 A\n2. \u6709\u5E8F\u5217\u8868\u9879 B\n a. \u6709\u5E8F\u5217\u8868\u9879 B1\n\n\u884C\u5185\u4EE3\u7801\uFF1A`console.log(\"hi\")`\n\n\u4EE3\u7801\u5757\uFF08\u8BED\u6CD5\u9AD8\u4EAE\uFF09\uFF1A\n```js\nfunction hello() {\n console.log(\"hi\");\n}\n```\n\n> \u5F15\u7528\n\n>> \u591A\u91CD\u5F15\u7528\n\n[\u94FE\u63A5](https://example.com)\n\n[](https://example.com)\n\n\u8868\u683C\uFF1A\n| \u52171 | \u52172 | \u53F3\u5BF9\u9F50 |\n|---|:---:|---:|\n| \u5DE6 | \u4E2D | \u53F3 |\n| a | b | 123 |\n\n\u5206\u9694\u7EBF\uFF1A\n`---`\n\n`***`\n\n\u884C\u5185\u6570\u5B66\u516C\u5F0F\uFF1A$ E = mc^2 $\n\u5757\u7EA7\u6570\u5B66\u516C\u5F0F\uFF1A\n$$\nint_{0}^{1} x^2 , dx = \frac{1}{3}\n$$\n\n\u8B66\u544A\u5757\uFF1A\n:::alert {variant=\"warning\"}\n\n\u8FD9\u662F\u4E00\u6BB5\u8B66\u544A\u5757\n\n:::\n\n\u4FE1\u606F\u63D0\u793A\uFF1A\n:::alert {variant=\"info\"}\n\n\u8FD9\u662F\u4E00\u4E2A\u4FE1\u606F\u63D0\u793A\n\n:::\n\n\u6210\u529F\u63D0\u793A\uFF1A\n:::alert {variant=\"success\"}\n\n\u8FD9\u662F\u4E00\u4E2A\u6210\u529F\u63D0\u793A\n\n:::\n\n\u9519\u8BEF\u63D0\u793A\uFF1A\n:::alert {variant=\"error\"}\n\n\u8FD9\u662F\u4E00\u4E2A\u9519\u8BEF\u63D0\u793A\n\n:::\n\n\u9ED8\u8BA4\u63D0\u793A\uFF1A\n:::alert {variant=\"default\"}\n\n\u8FD9\u662F\u4E00\u4E2A\u9ED8\u8BA4\u63D0\u793A\n\n:::\n\n\u4E0D\u5E26\u56FE\u6807\u7684\u4FE1\u606F\u63D0\u793A\uFF1A\n:::alert {variant=\"info\" type=\"text\"}\n\n\u8FD9\u662F\u4E00\u4E2A\u4E0D\u5E26\u56FE\u6807\u7684\u4FE1\u606F\u63D0\u793A\n\n:::\n\n\u6298\u53E0\u5757 Details\uFF1A\n:::details {indent=\"0\" open}\n\n:::detailsSummary {indent=\"0\"}\n\n\u8FD9\u662F\u6298\u53E0\u9762\u677F\u7684\u6807\u9898\n\n:::\n\n:::detailsContent {indent=\"0\"}\n\n\u8FD9\u662F\u6298\u53E0\u9762\u677F\u7684\u5185\u5BB9\uFF0C\u53EF\u4EE5\u5C55\u793A\u5757\u7EA7\u5143\u7D20\n\n:::\n\n:::\n";
|
|
@@ -1,9 +1,15 @@
|
|
|
1
|
-
|
|
1
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
2
|
+
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."); }
|
|
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 _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; }
|
|
5
|
+
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; } }
|
|
6
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
7
|
+
import { FloatingPopover } from "../../../component";
|
|
2
8
|
import { CheckboxCircleFillIcon, CloseCircleFillIcon, ErrorWarningFillIcon, Information2FillIcon, ScrollToBottomLineIcon, TextIcon, UserSmileFillIcon } from "../../../component/Icons";
|
|
3
9
|
import { ToolbarItem } from "../../../component/Toolbar";
|
|
4
10
|
import { Box, Divider, Stack } from '@mui/material';
|
|
5
11
|
import { NodeViewContent, NodeViewWrapper } from '@tiptap/react';
|
|
6
|
-
import React, { useMemo, useRef } from 'react';
|
|
12
|
+
import React, { useMemo, useRef, useState } from 'react';
|
|
7
13
|
var VARIANT_DATA = {
|
|
8
14
|
info: {
|
|
9
15
|
icon: /*#__PURE__*/React.createElement(Information2FillIcon, {
|
|
@@ -54,11 +60,62 @@ var AlertView = function AlertView(_ref) {
|
|
|
54
60
|
selected = _ref.selected;
|
|
55
61
|
var attrs = node.attrs;
|
|
56
62
|
var containerRef = useRef(null);
|
|
63
|
+
var _useState = useState(null),
|
|
64
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
65
|
+
anchorEl = _useState2[0],
|
|
66
|
+
setAnchorEl = _useState2[1];
|
|
57
67
|
var showIcon = attrs.type !== 'text';
|
|
58
68
|
var variantData = useMemo(function () {
|
|
59
69
|
return VARIANT_DATA[attrs.variant || 'info'];
|
|
60
70
|
}, [attrs.variant]);
|
|
61
|
-
var
|
|
71
|
+
var handleShowOperationPopover = function handleShowOperationPopover(event) {
|
|
72
|
+
return setAnchorEl(event.currentTarget);
|
|
73
|
+
};
|
|
74
|
+
var handleCloseOperationPopover = function handleCloseOperationPopover() {
|
|
75
|
+
return setAnchorEl(null);
|
|
76
|
+
};
|
|
77
|
+
return /*#__PURE__*/React.createElement(NodeViewWrapper, {
|
|
78
|
+
ref: containerRef,
|
|
79
|
+
className: "alert-wrapper ".concat(selected ? 'ProseMirror-selectednode' : ''),
|
|
80
|
+
"data-drag-handle": true,
|
|
81
|
+
as: 'div',
|
|
82
|
+
style: {
|
|
83
|
+
marginLeft: (_node$attrs = node.attrs) !== null && _node$attrs !== void 0 && _node$attrs.indent ? node.attrs.indent * 32 : undefined,
|
|
84
|
+
border: '1px solid',
|
|
85
|
+
borderColor: variantData.color,
|
|
86
|
+
// color: attrs.variant === 'default' ? 'var(--mui-palette-text-primary)' : variantData.color,
|
|
87
|
+
borderRadius: '10px',
|
|
88
|
+
padding: '12px 16px',
|
|
89
|
+
lineHeight: 1.625,
|
|
90
|
+
display: 'flex',
|
|
91
|
+
alignItems: 'flex-start',
|
|
92
|
+
gap: '16px',
|
|
93
|
+
background: attrs.variant === 'default' ? 'var(--mui-palette-background-paper3)' : "color-mix(in srgb, ".concat(variantData.color, " 10%, transparent)")
|
|
94
|
+
},
|
|
95
|
+
onClick: handleShowOperationPopover
|
|
96
|
+
}, showIcon && /*#__PURE__*/React.createElement(Box, {
|
|
97
|
+
sx: {
|
|
98
|
+
pt: '2px',
|
|
99
|
+
lineHeight: 1,
|
|
100
|
+
color: attrs.variant === 'default' ? 'text.disabled' : variantData.color
|
|
101
|
+
}
|
|
102
|
+
}, variantData.icon), /*#__PURE__*/React.createElement(Box, {
|
|
103
|
+
sx: {
|
|
104
|
+
flex: 1,
|
|
105
|
+
width: 0,
|
|
106
|
+
'code': {
|
|
107
|
+
borderColor: attrs.variant === 'default' ? '' : "color-mix(in srgb, ".concat(variantData.color, " 30%, transparent) !important"),
|
|
108
|
+
bgcolor: attrs.variant === 'default' ? '' : "color-mix(in srgb, ".concat(variantData.color, " 10%, transparent) !important")
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
}, /*#__PURE__*/React.createElement(NodeViewContent, {
|
|
112
|
+
as: 'div'
|
|
113
|
+
})), editor.isEditable && /*#__PURE__*/React.createElement(FloatingPopover, {
|
|
114
|
+
open: Boolean(anchorEl),
|
|
115
|
+
anchorEl: anchorEl,
|
|
116
|
+
onClose: handleCloseOperationPopover,
|
|
117
|
+
placement: "top"
|
|
118
|
+
}, /*#__PURE__*/React.createElement(Stack, {
|
|
62
119
|
direction: 'row',
|
|
63
120
|
alignItems: 'center',
|
|
64
121
|
sx: {
|
|
@@ -143,78 +200,33 @@ var AlertView = function AlertView(_ref) {
|
|
|
143
200
|
alignSelf: 'center',
|
|
144
201
|
borderColor: 'divider'
|
|
145
202
|
}
|
|
146
|
-
}), /*#__PURE__*/React.createElement(
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
icon: /*#__PURE__*/React.createElement(TextIcon, {
|
|
151
|
-
sx: {
|
|
152
|
-
fontSize: '1rem'
|
|
153
|
-
}
|
|
154
|
-
}),
|
|
155
|
-
onClick: function onClick() {
|
|
156
|
-
return updateAttributes({
|
|
157
|
-
type: 'text'
|
|
158
|
-
});
|
|
159
|
-
}
|
|
160
|
-
}, {
|
|
161
|
-
key: 'icon',
|
|
162
|
-
label: '图标文字',
|
|
163
|
-
icon: /*#__PURE__*/React.createElement(ScrollToBottomLineIcon, {
|
|
164
|
-
sx: {
|
|
165
|
-
transform: 'rotate(90deg)',
|
|
166
|
-
fontSize: '1rem'
|
|
167
|
-
}
|
|
168
|
-
}),
|
|
169
|
-
onClick: function onClick() {
|
|
170
|
-
return updateAttributes({
|
|
171
|
-
type: 'icon'
|
|
172
|
-
});
|
|
203
|
+
}), /*#__PURE__*/React.createElement(ToolbarItem, {
|
|
204
|
+
icon: /*#__PURE__*/React.createElement(TextIcon, {
|
|
205
|
+
sx: {
|
|
206
|
+
fontSize: '1rem'
|
|
173
207
|
}
|
|
174
|
-
}
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
"data-drag-handle": true,
|
|
188
|
-
as: 'div',
|
|
189
|
-
style: {
|
|
190
|
-
marginLeft: (_node$attrs = node.attrs) !== null && _node$attrs !== void 0 && _node$attrs.indent ? node.attrs.indent * 32 : undefined,
|
|
191
|
-
border: '1px solid',
|
|
192
|
-
borderColor: "color-mix(in srgb, ".concat(variantData.color, " 50%, transparent)"),
|
|
193
|
-
borderRadius: '10px',
|
|
194
|
-
padding: '16px',
|
|
195
|
-
lineHeight: 1.625,
|
|
196
|
-
display: 'flex',
|
|
197
|
-
alignItems: 'flex-start',
|
|
198
|
-
gap: '16px',
|
|
199
|
-
background: attrs.variant === 'default' ? 'var(--mui-palette-background-paper3)' : "color-mix(in srgb, ".concat(variantData.color, " 10%, transparent)")
|
|
200
|
-
}
|
|
201
|
-
}, showIcon && /*#__PURE__*/React.createElement(Box, {
|
|
202
|
-
sx: {
|
|
203
|
-
pt: '2px',
|
|
204
|
-
lineHeight: 1,
|
|
205
|
-
color: attrs.variant === 'default' ? 'text.disabled' : variantData.color
|
|
206
|
-
}
|
|
207
|
-
}, variantData.icon), /*#__PURE__*/React.createElement(Box, {
|
|
208
|
-
sx: {
|
|
209
|
-
flex: 1,
|
|
210
|
-
width: 0,
|
|
211
|
-
'code': {
|
|
212
|
-
borderColor: attrs.variant === 'default' ? '' : "color-mix(in srgb, ".concat(variantData.color, " 30%, transparent) !important"),
|
|
213
|
-
bgcolor: attrs.variant === 'default' ? '' : "color-mix(in srgb, ".concat(variantData.color, " 10%, transparent) !important")
|
|
208
|
+
}),
|
|
209
|
+
tip: "\u7EAF\u6587\u5B57",
|
|
210
|
+
onClick: function onClick() {
|
|
211
|
+
return updateAttributes({
|
|
212
|
+
type: 'text'
|
|
213
|
+
});
|
|
214
|
+
},
|
|
215
|
+
className: attrs.type === 'text' ? 'tool-active' : ''
|
|
216
|
+
}), /*#__PURE__*/React.createElement(ToolbarItem, {
|
|
217
|
+
icon: /*#__PURE__*/React.createElement(ScrollToBottomLineIcon, {
|
|
218
|
+
sx: {
|
|
219
|
+
transform: 'rotate(90deg)',
|
|
220
|
+
fontSize: '1rem'
|
|
214
221
|
}
|
|
215
|
-
}
|
|
216
|
-
|
|
217
|
-
|
|
222
|
+
}),
|
|
223
|
+
tip: "\u56FE\u6807\u6587\u5B57",
|
|
224
|
+
onClick: function onClick() {
|
|
225
|
+
return updateAttributes({
|
|
226
|
+
type: 'icon'
|
|
227
|
+
});
|
|
228
|
+
},
|
|
229
|
+
className: attrs.type === 'icon' ? 'tool-active' : ''
|
|
218
230
|
}))));
|
|
219
231
|
};
|
|
220
232
|
export default AlertView;
|
|
@@ -1,8 +1,40 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { useTheme } from "@mui/material/styles";
|
|
2
2
|
import { MarkViewContent } from "@tiptap/react";
|
|
3
|
-
import React from "react";
|
|
3
|
+
import React, { useCallback } from "react";
|
|
4
4
|
var LinkViewWrapper = function LinkViewWrapper(_ref) {
|
|
5
|
-
var
|
|
6
|
-
|
|
5
|
+
var _mark$attrs2, _mark$attrs3, _mark$attrs4;
|
|
6
|
+
var editor = _ref.editor,
|
|
7
|
+
mark = _ref.mark;
|
|
8
|
+
var theme = useTheme();
|
|
9
|
+
var handleClick = useCallback(function (e) {
|
|
10
|
+
var _mark$attrs;
|
|
11
|
+
if (mark !== null && mark !== void 0 && (_mark$attrs = mark.attrs) !== null && _mark$attrs !== void 0 && _mark$attrs.download) {
|
|
12
|
+
e.preventDefault();
|
|
13
|
+
var _href = mark.attrs.href;
|
|
14
|
+
if (_href) {
|
|
15
|
+
var link = document.createElement('a');
|
|
16
|
+
link.href = _href;
|
|
17
|
+
link.download = mark.attrs.download === '' ? _href.split('/').pop() || 'download' : mark.attrs.download;
|
|
18
|
+
document.body.appendChild(link);
|
|
19
|
+
link.click();
|
|
20
|
+
document.body.removeChild(link);
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
}, [mark]);
|
|
24
|
+
var href = (mark === null || mark === void 0 || (_mark$attrs2 = mark.attrs) === null || _mark$attrs2 === void 0 ? void 0 : _mark$attrs2.href) || '';
|
|
25
|
+
var target = (mark === null || mark === void 0 || (_mark$attrs3 = mark.attrs) === null || _mark$attrs3 === void 0 ? void 0 : _mark$attrs3.target) || '_blank';
|
|
26
|
+
var download = mark === null || mark === void 0 || (_mark$attrs4 = mark.attrs) === null || _mark$attrs4 === void 0 ? void 0 : _mark$attrs4.download;
|
|
27
|
+
return /*#__PURE__*/React.createElement(MarkViewContent, {
|
|
28
|
+
as: "a",
|
|
29
|
+
href: href,
|
|
30
|
+
target: download ? undefined : target,
|
|
31
|
+
download: download || undefined,
|
|
32
|
+
onClick: handleClick,
|
|
33
|
+
style: {
|
|
34
|
+
color: theme.palette.primary.main,
|
|
35
|
+
textDecoration: 'underline',
|
|
36
|
+
cursor: 'pointer'
|
|
37
|
+
}
|
|
38
|
+
});
|
|
7
39
|
};
|
|
8
40
|
export default LinkViewWrapper;
|
|
@@ -71,7 +71,7 @@ var SlashCommandsList = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
71
71
|
})
|
|
72
72
|
}]
|
|
73
73
|
}, {
|
|
74
|
-
label: '
|
|
74
|
+
label: '警告块',
|
|
75
75
|
key: 'highlight',
|
|
76
76
|
icon: /*#__PURE__*/React.createElement(Information2LineIcon, {
|
|
77
77
|
sx: {
|
|
@@ -89,7 +89,7 @@ var SlashCommandsList = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
89
89
|
}),
|
|
90
90
|
onClick: function onClick() {
|
|
91
91
|
var node = items.find(function (it) {
|
|
92
|
-
return it.title === '
|
|
92
|
+
return it.title === '警告块';
|
|
93
93
|
});
|
|
94
94
|
if (node) command(_objectSpread(_objectSpread({}, node), {}, {
|
|
95
95
|
attrs: {
|
|
@@ -109,7 +109,7 @@ var SlashCommandsList = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
109
109
|
}),
|
|
110
110
|
onClick: function onClick() {
|
|
111
111
|
var node = items.find(function (it) {
|
|
112
|
-
return it.title === '
|
|
112
|
+
return it.title === '警告块';
|
|
113
113
|
});
|
|
114
114
|
if (node) command(_objectSpread(_objectSpread({}, node), {}, {
|
|
115
115
|
attrs: {
|
|
@@ -129,7 +129,7 @@ var SlashCommandsList = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
129
129
|
}),
|
|
130
130
|
onClick: function onClick() {
|
|
131
131
|
var node = items.find(function (it) {
|
|
132
|
-
return it.title === '
|
|
132
|
+
return it.title === '警告块';
|
|
133
133
|
});
|
|
134
134
|
if (node) command(_objectSpread(_objectSpread({}, node), {}, {
|
|
135
135
|
attrs: {
|
|
@@ -149,7 +149,7 @@ var SlashCommandsList = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
149
149
|
}),
|
|
150
150
|
onClick: function onClick() {
|
|
151
151
|
var node = items.find(function (it) {
|
|
152
|
-
return it.title === '
|
|
152
|
+
return it.title === '警告块';
|
|
153
153
|
});
|
|
154
154
|
if (node) command(_objectSpread(_objectSpread({}, node), {}, {
|
|
155
155
|
attrs: {
|
|
@@ -169,7 +169,7 @@ var SlashCommandsList = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
169
169
|
}),
|
|
170
170
|
onClick: function onClick() {
|
|
171
171
|
var node = items.find(function (it) {
|
|
172
|
-
return it.title === '
|
|
172
|
+
return it.title === '警告块';
|
|
173
173
|
});
|
|
174
174
|
if (node) command(_objectSpread(_objectSpread({}, node), {}, {
|
|
175
175
|
attrs: {
|
|
@@ -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,7 +6,6 @@ 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';
|
|
10
9
|
import TextAlign from '@tiptap/extension-text-align';
|
|
11
10
|
import { TextStyleKit } from '@tiptap/extension-text-style';
|
|
12
11
|
import { CharacterCount, Placeholder } from '@tiptap/extensions';
|
|
@@ -15,6 +14,7 @@ import StarterKit from '@tiptap/starter-kit';
|
|
|
15
14
|
import { PLACEHOLDER } from "../contants/placeholder";
|
|
16
15
|
import { AiWritingExtension, SlashCommands, StructuredDiffExtension } from "./extension";
|
|
17
16
|
import { CodeExtension } from "./mark/Code";
|
|
17
|
+
import CustomLink from "./mark/Link";
|
|
18
18
|
import { AlertExtension, AudioExtension, BlockAttachmentExtension, BlockLinkExtension, CodeBlockLowlightExtension, CustomBlockMathExtension, CustomHorizontalRule, CustomInlineMathExtension, CustomSubscript, CustomSuperscript, DetailsContentExtension, DetailsExtension, DetailsSummaryExtension, EmojiExtension, FileHandlerExtension, IframeExtension, ImageExtension, Indent, InlineAttachmentExtension, InlineLinkExtension, InlineUploadProgressExtension, ListExtension, MentionExtension, TableExtension, TableOfContents, UploadProgressExtension, VerticalAlign, VideoExtension, YamlFormat, YoutubeExtension } from "./node";
|
|
19
19
|
export var getExtensions = function getExtensions(_ref) {
|
|
20
20
|
var contentType = _ref.contentType,
|
|
@@ -44,7 +44,15 @@ export var getExtensions = function getExtensions(_ref) {
|
|
|
44
44
|
color: 'var(--mui-palette-primary-main)',
|
|
45
45
|
width: 2
|
|
46
46
|
}
|
|
47
|
-
}), TextStyleKit, CodeExtension, ListExtension, EmojiExtension, AlertExtension, CustomSubscript, DetailsExtension, CustomSuperscript, DetailsContentExtension, DetailsSummaryExtension, CodeBlockLowlightExtension, InlineUploadProgressExtension, YamlFormat, CustomHorizontalRule
|
|
47
|
+
}), TextStyleKit, CodeExtension, ListExtension, EmojiExtension, AlertExtension, CustomSubscript, DetailsExtension, CustomSuperscript, DetailsContentExtension, DetailsSummaryExtension, CodeBlockLowlightExtension, InlineUploadProgressExtension, YamlFormat, CustomHorizontalRule, VideoExtension({
|
|
48
|
+
onUpload: onUpload,
|
|
49
|
+
onError: onError,
|
|
50
|
+
onValidateUrl: onValidateUrl
|
|
51
|
+
}), AudioExtension({
|
|
52
|
+
onUpload: onUpload,
|
|
53
|
+
onError: onError,
|
|
54
|
+
onValidateUrl: onValidateUrl
|
|
55
|
+
})].concat(_toConsumableArray(TableExtension({
|
|
48
56
|
editable: editable
|
|
49
57
|
})), [TableOfContents({
|
|
50
58
|
onTocUpdate: onTocUpdate
|
|
@@ -93,7 +101,7 @@ export var getExtensions = function getExtensions(_ref) {
|
|
|
93
101
|
}
|
|
94
102
|
})]);
|
|
95
103
|
if (contentType === 'markdown') {
|
|
96
|
-
defaultExtensions.push
|
|
104
|
+
defaultExtensions.push(CustomLink, Markdown.configure({
|
|
97
105
|
indentation: {
|
|
98
106
|
style: 'space',
|
|
99
107
|
size: 2
|
|
@@ -103,19 +111,11 @@ export var getExtensions = function getExtensions(_ref) {
|
|
|
103
111
|
breaks: false,
|
|
104
112
|
pedantic: false
|
|
105
113
|
}
|
|
106
|
-
})
|
|
114
|
+
}));
|
|
107
115
|
} else {
|
|
108
116
|
defaultExtensions.push.apply(defaultExtensions, [InlineLinkExtension, BlockLinkExtension, IframeExtension({
|
|
109
117
|
onError: onError,
|
|
110
118
|
onValidateUrl: onValidateUrl
|
|
111
|
-
}), VideoExtension({
|
|
112
|
-
onUpload: onUpload,
|
|
113
|
-
onError: onError,
|
|
114
|
-
onValidateUrl: onValidateUrl
|
|
115
|
-
}), AudioExtension({
|
|
116
|
-
onUpload: onUpload,
|
|
117
|
-
onError: onError,
|
|
118
|
-
onValidateUrl: onValidateUrl
|
|
119
119
|
}), BlockAttachmentExtension({
|
|
120
120
|
onUpload: onUpload,
|
|
121
121
|
onError: onError
|
|
@@ -1,11 +1,85 @@
|
|
|
1
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
6
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
7
|
+
// @ts-nocheck
|
|
8
|
+
|
|
1
9
|
import { Link } from "@tiptap/extension-link";
|
|
10
|
+
import { Plugin, PluginKey } from '@tiptap/pm/state';
|
|
2
11
|
import { ReactMarkViewRenderer } from "@tiptap/react";
|
|
3
12
|
import LinkViewWrapper from "../component/Link/Markdown";
|
|
4
13
|
var CustomLink = Link.extend({
|
|
5
14
|
addMarkView: function addMarkView() {
|
|
6
|
-
return ReactMarkViewRenderer(LinkViewWrapper
|
|
7
|
-
|
|
15
|
+
return ReactMarkViewRenderer(LinkViewWrapper);
|
|
16
|
+
},
|
|
17
|
+
addAttributes: function addAttributes() {
|
|
18
|
+
var _this$parent;
|
|
19
|
+
return _objectSpread(_objectSpread({}, (_this$parent = this.parent) === null || _this$parent === void 0 ? void 0 : _this$parent.call(this)), {}, {
|
|
20
|
+
download: {
|
|
21
|
+
default: null,
|
|
22
|
+
parseHTML: function parseHTML(element) {
|
|
23
|
+
return element.getAttribute('download');
|
|
24
|
+
},
|
|
25
|
+
renderHTML: function renderHTML(attributes) {
|
|
26
|
+
if (!attributes.download) {
|
|
27
|
+
return {};
|
|
28
|
+
}
|
|
29
|
+
return {
|
|
30
|
+
download: attributes.download
|
|
31
|
+
};
|
|
32
|
+
}
|
|
33
|
+
}
|
|
8
34
|
});
|
|
35
|
+
},
|
|
36
|
+
// 确保能够解析 HTML 中的 <a> 标签
|
|
37
|
+
parseHTML: function parseHTML() {
|
|
38
|
+
return [{
|
|
39
|
+
tag: 'a[href]',
|
|
40
|
+
getAttrs: function getAttrs(element) {
|
|
41
|
+
if (typeof element === 'string') return false;
|
|
42
|
+
var href = element.getAttribute('href');
|
|
43
|
+
if (!href) return false;
|
|
44
|
+
return {
|
|
45
|
+
href: href,
|
|
46
|
+
target: element.getAttribute('target') || '_blank',
|
|
47
|
+
download: element.getAttribute('download')
|
|
48
|
+
};
|
|
49
|
+
}
|
|
50
|
+
}];
|
|
51
|
+
},
|
|
52
|
+
renderHTML: function renderHTML(_ref) {
|
|
53
|
+
var HTMLAttributes = _ref.HTMLAttributes;
|
|
54
|
+
return ['a', HTMLAttributes, 0];
|
|
55
|
+
},
|
|
56
|
+
addProseMirrorPlugins: function addProseMirrorPlugins() {
|
|
57
|
+
return [new Plugin({
|
|
58
|
+
key: new PluginKey('linkDownloadHandler'),
|
|
59
|
+
props: {
|
|
60
|
+
handleDOMEvents: {
|
|
61
|
+
click: function click(view, event) {
|
|
62
|
+
var target = event.target;
|
|
63
|
+
var link = target.closest('a[download]');
|
|
64
|
+
if (link) {
|
|
65
|
+
var downloadAttr = link.getAttribute('download');
|
|
66
|
+
var href = link.getAttribute('href');
|
|
67
|
+
if (href && downloadAttr !== null) {
|
|
68
|
+
event.preventDefault();
|
|
69
|
+
var downloadLink = document.createElement('a');
|
|
70
|
+
downloadLink.href = href;
|
|
71
|
+
downloadLink.download = downloadAttr === '' ? href.split('/').pop() || 'download' : downloadAttr;
|
|
72
|
+
document.body.appendChild(downloadLink);
|
|
73
|
+
downloadLink.click();
|
|
74
|
+
document.body.removeChild(downloadLink);
|
|
75
|
+
return true;
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
return false;
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
})];
|
|
9
83
|
}
|
|
10
84
|
});
|
|
11
85
|
export default CustomLink;
|