@ctzhian/tiptap 1.12.19 → 1.12.21
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/EditorMarkdown/Toolbar.d.ts +2 -5
- package/dist/EditorMarkdown/Toolbar.js +62 -251
- package/dist/EditorMarkdown/UploadProgress.d.ts +7 -0
- package/dist/EditorMarkdown/UploadProgress.js +85 -0
- package/dist/EditorMarkdown/demo.js +4 -3
- package/dist/EditorMarkdown/index.d.ts +2 -0
- package/dist/EditorMarkdown/index.js +291 -9
- package/dist/EditorMarkdown/util.d.ts +17 -0
- package/dist/EditorMarkdown/util.js +84 -0
- package/dist/extension/node/Link/index.js +3 -1
- package/dist/index.css +1 -0
- package/package.json +1 -1
|
@@ -1,12 +1,9 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import AceEditor from "react-ace";
|
|
3
|
-
import { UploadFunction } from "../type";
|
|
4
3
|
interface EditorMarkdownToolbarProps {
|
|
5
4
|
aceEditorRef: React.RefObject<AceEditor>;
|
|
6
5
|
isExpend?: boolean;
|
|
7
|
-
|
|
8
|
-
onUpload?: UploadFunction;
|
|
9
|
-
setLoading?: (loading: boolean) => void;
|
|
6
|
+
onFileUpload: (file: File, expectedType?: 'image' | 'video' | 'audio' | 'attachment') => void;
|
|
10
7
|
}
|
|
11
|
-
declare const EditorMarkdownToolbar: ({ aceEditorRef, isExpend,
|
|
8
|
+
declare const EditorMarkdownToolbar: ({ aceEditorRef, isExpend, onFileUpload }: EditorMarkdownToolbarProps) => React.JSX.Element;
|
|
12
9
|
export default EditorMarkdownToolbar;
|
|
@@ -1,198 +1,46 @@
|
|
|
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
1
|
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
3
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
4
|
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
5
5
|
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
6
|
-
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; }
|
|
7
|
-
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); } }
|
|
8
|
-
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); }); }; }
|
|
9
|
-
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
10
|
-
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."); }
|
|
11
|
-
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); }
|
|
12
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; }
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
import { alpha, Box, Divider, Paper, Stack, Typography, useTheme } from "@mui/material";
|
|
16
|
-
import React, { useState } from "react";
|
|
7
|
+
import { Box, Divider, Stack, Typography } from "@mui/material";
|
|
8
|
+
import React from "react";
|
|
17
9
|
import { AddCircleFillIcon, ArrowDownSLineIcon, AttachmentLineIcon, BoldIcon, CheckboxCircleFillIcon, CloseCircleFillIcon, CodeBoxLineIcon, CodeLineIcon, CodeSSlashLineIcon, DoubleQuotesLIcon, ErrorWarningFillIcon, Folder2LineIcon, FormulaIcon, 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";
|
|
18
10
|
import Menu from "../component/Menu";
|
|
19
11
|
import { ToolbarItem } from "../component/Toolbar";
|
|
20
12
|
import TableSizePicker from "../component/Toolbar/TableSizePicker";
|
|
13
|
+
import { insertBlockTool, insertHeadingTool, insertInlineTool } from "./util";
|
|
21
14
|
var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
22
15
|
var aceEditorRef = _ref.aceEditorRef,
|
|
23
16
|
isExpend = _ref.isExpend,
|
|
24
|
-
|
|
25
|
-
onUpload = _ref.onUpload,
|
|
26
|
-
setLoading = _ref.setLoading;
|
|
27
|
-
var theme = useTheme();
|
|
17
|
+
onFileUpload = _ref.onFileUpload;
|
|
28
18
|
var imageInputRef = React.useRef(null);
|
|
29
19
|
var videoInputRef = React.useRef(null);
|
|
30
20
|
var audioInputRef = React.useRef(null);
|
|
31
21
|
var attachmentInputRef = React.useRef(null);
|
|
32
|
-
var _useState = useState(0),
|
|
33
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
34
|
-
uplaodProgress = _useState2[0],
|
|
35
|
-
setUplaodProgress = _useState2[1];
|
|
36
|
-
var _useState3 = useState(''),
|
|
37
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
38
|
-
fileUploadingName = _useState4[0],
|
|
39
|
-
setFileUploadingName = _useState4[1];
|
|
40
|
-
var insertBlockTool = function insertBlockTool(options) {
|
|
41
|
-
var _aceEditorRef$current;
|
|
42
|
-
var editor = (_aceEditorRef$current = aceEditorRef.current) === null || _aceEditorRef$current === void 0 ? void 0 : _aceEditorRef$current.editor;
|
|
43
|
-
if (!editor) return;
|
|
44
|
-
var cursor = editor.getCursorPosition();
|
|
45
|
-
var curRowLength = editor.session.getLine(cursor.row).length;
|
|
46
|
-
var prevRowLength = editor.session.getLine(cursor.row - 1).length;
|
|
47
|
-
var text = "\n\n".concat(options.text);
|
|
48
|
-
var plusRow = 2;
|
|
49
|
-
if (curRowLength === 0 && prevRowLength === 0 && cursor.row > 1) {
|
|
50
|
-
text = "".concat(options.text);
|
|
51
|
-
if (options.wrap) {
|
|
52
|
-
plusRow = 0;
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
|
-
if (curRowLength === 0 && cursor.row === 0) {
|
|
56
|
-
text = options.text;
|
|
57
|
-
if (options.wrap) {
|
|
58
|
-
plusRow = 0;
|
|
59
|
-
}
|
|
60
|
-
}
|
|
61
|
-
if (curRowLength === 0 && prevRowLength > 0) {
|
|
62
|
-
text = "\n".concat(options.text);
|
|
63
|
-
if (options.wrap) {
|
|
64
|
-
plusRow = 1;
|
|
65
|
-
}
|
|
66
|
-
}
|
|
67
|
-
editor.moveCursorTo(cursor.row, curRowLength);
|
|
68
|
-
editor.clearSelection();
|
|
69
|
-
editor.insert(text);
|
|
70
|
-
editor.moveCursorTo(cursor.row + plusRow + (options.row || 0), options.position || 0);
|
|
71
|
-
editor.focus();
|
|
72
|
-
};
|
|
73
|
-
var insertInlineTool = function insertInlineTool(options) {
|
|
74
|
-
var _aceEditorRef$current2;
|
|
75
|
-
var editor = (_aceEditorRef$current2 = aceEditorRef.current) === null || _aceEditorRef$current2 === void 0 ? void 0 : _aceEditorRef$current2.editor;
|
|
76
|
-
if (!editor) return;
|
|
77
|
-
var left = options.single || options.left || '';
|
|
78
|
-
var right = options.single || options.right || '';
|
|
79
|
-
var selectedText = editor.getSelectedText();
|
|
80
|
-
var cursor = editor.getCursorPosition();
|
|
81
|
-
var selectionRange = editor.getSelectionRange();
|
|
82
|
-
if (selectedText) {
|
|
83
|
-
var wrappedText = "".concat(left).concat(selectedText).concat(right);
|
|
84
|
-
editor.insert(wrappedText);
|
|
85
|
-
var startRow = selectionRange.start.row;
|
|
86
|
-
var startColumn = selectionRange.start.column;
|
|
87
|
-
var endRow = selectionRange.end.row;
|
|
88
|
-
var endColumn = selectionRange.end.column;
|
|
89
|
-
editor.moveCursorTo(startRow, startColumn);
|
|
90
|
-
editor.selection.selectTo(endRow, endColumn + left.length + right.length);
|
|
91
|
-
} else {
|
|
92
|
-
var _options$position = options.position,
|
|
93
|
-
position = _options$position === void 0 ? 0 : _options$position,
|
|
94
|
-
_options$row = options.row,
|
|
95
|
-
row = _options$row === void 0 ? 0 : _options$row;
|
|
96
|
-
var text = "".concat(left).concat(right);
|
|
97
|
-
var curRow = cursor.row + row;
|
|
98
|
-
var curColumn = cursor.column + position;
|
|
99
|
-
editor.insert(text);
|
|
100
|
-
editor.moveCursorTo(curRow, curColumn + left.length);
|
|
101
|
-
}
|
|
102
|
-
editor.focus();
|
|
103
|
-
};
|
|
104
|
-
var insertHeadingTool = function insertHeadingTool(options) {
|
|
105
|
-
var _aceEditorRef$current3;
|
|
106
|
-
var editor = (_aceEditorRef$current3 = aceEditorRef.current) === null || _aceEditorRef$current3 === void 0 ? void 0 : _aceEditorRef$current3.editor;
|
|
107
|
-
if (!editor) return;
|
|
108
|
-
|
|
109
|
-
// 1. 获取当前行数,在下方创建一行
|
|
110
|
-
var cursor = editor.getCursorPosition();
|
|
111
|
-
var currentRow = cursor.row;
|
|
112
|
-
var isEditorEmpty = editor.getValue().trim().length === 0;
|
|
113
|
-
|
|
114
|
-
// 2. 在创建的行中插入标题
|
|
115
|
-
var headingPrefix = '#'.repeat(options.level) + ' ';
|
|
116
|
-
var text = "\n\n".concat(headingPrefix);
|
|
117
|
-
var targetRow = currentRow + 2;
|
|
118
|
-
var targetColumn = headingPrefix.length;
|
|
119
|
-
if (isEditorEmpty) {
|
|
120
|
-
text = headingPrefix;
|
|
121
|
-
targetRow = currentRow;
|
|
122
|
-
targetColumn = headingPrefix.length;
|
|
123
|
-
}
|
|
124
|
-
editor.insert(text);
|
|
125
|
-
|
|
126
|
-
// 3. 将光标置于标题中
|
|
127
|
-
editor.moveCursorTo(targetRow, targetColumn);
|
|
128
|
-
editor.focus();
|
|
129
|
-
};
|
|
130
|
-
var handleFileUpload = /*#__PURE__*/function () {
|
|
131
|
-
var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(file, expectedType) {
|
|
132
|
-
var url, content;
|
|
133
|
-
return _regeneratorRuntime().wrap(function _callee$(_context) {
|
|
134
|
-
while (1) switch (_context.prev = _context.next) {
|
|
135
|
-
case 0:
|
|
136
|
-
if (onUpload) {
|
|
137
|
-
_context.next = 2;
|
|
138
|
-
break;
|
|
139
|
-
}
|
|
140
|
-
return _context.abrupt("return");
|
|
141
|
-
case 2:
|
|
142
|
-
_context.prev = 2;
|
|
143
|
-
setLoading === null || setLoading === void 0 || setLoading(true);
|
|
144
|
-
setFileUploadingName(file.name);
|
|
145
|
-
_context.next = 7;
|
|
146
|
-
return onUpload(file, function (progress) {
|
|
147
|
-
setUplaodProgress(Math.round(progress.progress * 100));
|
|
148
|
-
});
|
|
149
|
-
case 7:
|
|
150
|
-
url = _context.sent;
|
|
151
|
-
content = '';
|
|
152
|
-
if (expectedType === 'image') {
|
|
153
|
-
content = ".concat(url, ")");
|
|
154
|
-
} else if (expectedType === 'video') {
|
|
155
|
-
content = "<video src=\"".concat(url, "\" controls=\"true\"></video>");
|
|
156
|
-
} else if (expectedType === 'audio') {
|
|
157
|
-
content = "<audio src=\"".concat(url, "\" controls=\"true\"></audio>");
|
|
158
|
-
} else {
|
|
159
|
-
content = "<a href=\"".concat(url, "\" download=\"").concat(file.name, "\">").concat(file.name, "</a>");
|
|
160
|
-
}
|
|
161
|
-
insertBlockTool({
|
|
162
|
-
text: content,
|
|
163
|
-
row: 1,
|
|
164
|
-
position: 1000
|
|
165
|
-
});
|
|
166
|
-
_context.next = 16;
|
|
167
|
-
break;
|
|
168
|
-
case 13:
|
|
169
|
-
_context.prev = 13;
|
|
170
|
-
_context.t0 = _context["catch"](2);
|
|
171
|
-
console.error('文件上传失败:', _context.t0);
|
|
172
|
-
case 16:
|
|
173
|
-
_context.prev = 16;
|
|
174
|
-
setLoading === null || setLoading === void 0 || setLoading(false);
|
|
175
|
-
setFileUploadingName('');
|
|
176
|
-
setUplaodProgress(0);
|
|
177
|
-
return _context.finish(16);
|
|
178
|
-
case 21:
|
|
179
|
-
case "end":
|
|
180
|
-
return _context.stop();
|
|
181
|
-
}
|
|
182
|
-
}, _callee, null, [[2, 13, 16, 21]]);
|
|
183
|
-
}));
|
|
184
|
-
return function handleFileUpload(_x, _x2) {
|
|
185
|
-
return _ref2.apply(this, arguments);
|
|
186
|
-
};
|
|
187
|
-
}();
|
|
188
22
|
var handleFileSelect = function handleFileSelect(event, expectedType) {
|
|
189
23
|
var _event$target$files;
|
|
190
24
|
var file = (_event$target$files = event.target.files) === null || _event$target$files === void 0 ? void 0 : _event$target$files[0];
|
|
191
25
|
if (file) {
|
|
192
|
-
|
|
26
|
+
onFileUpload(file, expectedType);
|
|
193
27
|
}
|
|
194
28
|
event.target.value = '';
|
|
195
29
|
};
|
|
30
|
+
var handleInsertHeading = function handleInsertHeading(level) {
|
|
31
|
+
if (!aceEditorRef.current) return;
|
|
32
|
+
insertHeadingTool(aceEditorRef.current, {
|
|
33
|
+
level: level
|
|
34
|
+
});
|
|
35
|
+
};
|
|
36
|
+
var handleInsertInline = function handleInsertInline(options) {
|
|
37
|
+
if (!aceEditorRef.current) return;
|
|
38
|
+
insertInlineTool(aceEditorRef.current, options);
|
|
39
|
+
};
|
|
40
|
+
var handleInsertBlock = function handleInsertBlock(options) {
|
|
41
|
+
if (!aceEditorRef.current) return;
|
|
42
|
+
insertBlockTool(aceEditorRef.current, options);
|
|
43
|
+
};
|
|
196
44
|
var HeadingOptions = [{
|
|
197
45
|
id: '1',
|
|
198
46
|
icon: /*#__PURE__*/React.createElement(H1Icon, {
|
|
@@ -202,9 +50,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
202
50
|
}),
|
|
203
51
|
label: '一级标题',
|
|
204
52
|
onClick: function onClick() {
|
|
205
|
-
|
|
206
|
-
level: 1
|
|
207
|
-
});
|
|
53
|
+
return handleInsertHeading(1);
|
|
208
54
|
}
|
|
209
55
|
}, {
|
|
210
56
|
id: '2',
|
|
@@ -215,9 +61,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
215
61
|
}),
|
|
216
62
|
label: '二级标题',
|
|
217
63
|
onClick: function onClick() {
|
|
218
|
-
|
|
219
|
-
level: 2
|
|
220
|
-
});
|
|
64
|
+
return handleInsertHeading(2);
|
|
221
65
|
}
|
|
222
66
|
}, {
|
|
223
67
|
id: '3',
|
|
@@ -228,9 +72,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
228
72
|
}),
|
|
229
73
|
label: '三级标题',
|
|
230
74
|
onClick: function onClick() {
|
|
231
|
-
|
|
232
|
-
level: 3
|
|
233
|
-
});
|
|
75
|
+
return handleInsertHeading(3);
|
|
234
76
|
}
|
|
235
77
|
}, {
|
|
236
78
|
id: '4',
|
|
@@ -241,9 +83,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
241
83
|
}),
|
|
242
84
|
label: '四级标题',
|
|
243
85
|
onClick: function onClick() {
|
|
244
|
-
|
|
245
|
-
level: 4
|
|
246
|
-
});
|
|
86
|
+
return handleInsertHeading(4);
|
|
247
87
|
}
|
|
248
88
|
}, {
|
|
249
89
|
id: '5',
|
|
@@ -254,9 +94,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
254
94
|
}),
|
|
255
95
|
label: '五级标题',
|
|
256
96
|
onClick: function onClick() {
|
|
257
|
-
|
|
258
|
-
level: 5
|
|
259
|
-
});
|
|
97
|
+
return handleInsertHeading(5);
|
|
260
98
|
}
|
|
261
99
|
}, {
|
|
262
100
|
id: '6',
|
|
@@ -267,9 +105,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
267
105
|
}),
|
|
268
106
|
label: '六级标题',
|
|
269
107
|
onClick: function onClick() {
|
|
270
|
-
|
|
271
|
-
level: 6
|
|
272
|
-
});
|
|
108
|
+
return handleInsertHeading(6);
|
|
273
109
|
}
|
|
274
110
|
}];
|
|
275
111
|
var ToolList = [{
|
|
@@ -281,7 +117,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
281
117
|
}),
|
|
282
118
|
label: '加粗',
|
|
283
119
|
onClick: function onClick() {
|
|
284
|
-
|
|
120
|
+
return handleInsertInline({
|
|
285
121
|
single: '**'
|
|
286
122
|
});
|
|
287
123
|
}
|
|
@@ -294,7 +130,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
294
130
|
}),
|
|
295
131
|
label: '斜体',
|
|
296
132
|
onClick: function onClick() {
|
|
297
|
-
|
|
133
|
+
return handleInsertInline({
|
|
298
134
|
single: '*'
|
|
299
135
|
});
|
|
300
136
|
}
|
|
@@ -307,7 +143,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
307
143
|
}),
|
|
308
144
|
label: '删除线',
|
|
309
145
|
onClick: function onClick() {
|
|
310
|
-
|
|
146
|
+
return handleInsertInline({
|
|
311
147
|
single: '~~'
|
|
312
148
|
});
|
|
313
149
|
}
|
|
@@ -320,7 +156,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
320
156
|
}),
|
|
321
157
|
label: '下划线',
|
|
322
158
|
onClick: function onClick() {
|
|
323
|
-
|
|
159
|
+
return handleInsertInline({
|
|
324
160
|
single: '++'
|
|
325
161
|
});
|
|
326
162
|
}
|
|
@@ -333,7 +169,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
333
169
|
}),
|
|
334
170
|
label: '高亮',
|
|
335
171
|
onClick: function onClick() {
|
|
336
|
-
|
|
172
|
+
return handleInsertInline({
|
|
337
173
|
single: '=='
|
|
338
174
|
});
|
|
339
175
|
}
|
|
@@ -346,7 +182,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
346
182
|
}),
|
|
347
183
|
label: '上标',
|
|
348
184
|
onClick: function onClick() {
|
|
349
|
-
|
|
185
|
+
return handleInsertInline({
|
|
350
186
|
single: '^'
|
|
351
187
|
});
|
|
352
188
|
}
|
|
@@ -359,7 +195,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
359
195
|
}),
|
|
360
196
|
label: '下标',
|
|
361
197
|
onClick: function onClick() {
|
|
362
|
-
|
|
198
|
+
return handleInsertInline({
|
|
363
199
|
single: '~'
|
|
364
200
|
});
|
|
365
201
|
}
|
|
@@ -374,7 +210,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
374
210
|
}),
|
|
375
211
|
label: '无序列表',
|
|
376
212
|
onClick: function onClick() {
|
|
377
|
-
return
|
|
213
|
+
return handleInsertBlock({
|
|
378
214
|
text: '- ',
|
|
379
215
|
position: 2
|
|
380
216
|
});
|
|
@@ -388,7 +224,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
388
224
|
}),
|
|
389
225
|
label: '有序列表',
|
|
390
226
|
onClick: function onClick() {
|
|
391
|
-
return
|
|
227
|
+
return handleInsertBlock({
|
|
392
228
|
text: '1. ',
|
|
393
229
|
position: 3
|
|
394
230
|
});
|
|
@@ -402,7 +238,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
402
238
|
}),
|
|
403
239
|
label: '任务列表',
|
|
404
240
|
onClick: function onClick() {
|
|
405
|
-
return
|
|
241
|
+
return handleInsertBlock({
|
|
406
242
|
text: '- [ ] ',
|
|
407
243
|
position: 6
|
|
408
244
|
});
|
|
@@ -418,7 +254,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
418
254
|
}),
|
|
419
255
|
label: '分割线',
|
|
420
256
|
onClick: function onClick() {
|
|
421
|
-
return
|
|
257
|
+
return handleInsertBlock({
|
|
422
258
|
text: '---\n\n',
|
|
423
259
|
row: 2
|
|
424
260
|
});
|
|
@@ -432,7 +268,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
432
268
|
}),
|
|
433
269
|
label: '引用',
|
|
434
270
|
onClick: function onClick() {
|
|
435
|
-
return
|
|
271
|
+
return handleInsertBlock({
|
|
436
272
|
text: '> ',
|
|
437
273
|
position: 2
|
|
438
274
|
});
|
|
@@ -446,7 +282,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
446
282
|
}),
|
|
447
283
|
label: '折叠面板',
|
|
448
284
|
onClick: function onClick() {
|
|
449
|
-
return
|
|
285
|
+
return handleInsertBlock({
|
|
450
286
|
text: ':::details\n\n:::detailsSummary\n\n:::\n\n:::detailsContent\n\n:::\n\n:::\n',
|
|
451
287
|
row: 3,
|
|
452
288
|
wrap: true
|
|
@@ -461,7 +297,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
461
297
|
}),
|
|
462
298
|
label: '警告块',
|
|
463
299
|
onClick: function onClick() {
|
|
464
|
-
return
|
|
300
|
+
return handleInsertBlock({
|
|
465
301
|
text: ':::alert {variant="info"}\n\n:::',
|
|
466
302
|
row: 1,
|
|
467
303
|
wrap: true
|
|
@@ -476,7 +312,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
476
312
|
}),
|
|
477
313
|
label: '行内数学公式',
|
|
478
314
|
onClick: function onClick() {
|
|
479
|
-
return
|
|
315
|
+
return handleInsertInline({
|
|
480
316
|
single: '$'
|
|
481
317
|
});
|
|
482
318
|
}
|
|
@@ -489,7 +325,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
489
325
|
}),
|
|
490
326
|
label: '块级数学公式',
|
|
491
327
|
onClick: function onClick() {
|
|
492
|
-
return
|
|
328
|
+
return handleInsertBlock({
|
|
493
329
|
text: '$$\n\n$$',
|
|
494
330
|
row: 1,
|
|
495
331
|
wrap: true
|
|
@@ -504,7 +340,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
504
340
|
}),
|
|
505
341
|
label: '代码',
|
|
506
342
|
onClick: function onClick() {
|
|
507
|
-
return
|
|
343
|
+
return handleInsertInline({
|
|
508
344
|
single: '`'
|
|
509
345
|
});
|
|
510
346
|
}
|
|
@@ -517,7 +353,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
517
353
|
}),
|
|
518
354
|
label: '代码块',
|
|
519
355
|
onClick: function onClick() {
|
|
520
|
-
return
|
|
356
|
+
return handleInsertBlock({
|
|
521
357
|
text: '```\n\n```',
|
|
522
358
|
row: 1,
|
|
523
359
|
wrap: true
|
|
@@ -534,7 +370,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
534
370
|
}),
|
|
535
371
|
label: '链接',
|
|
536
372
|
onClick: function onClick() {
|
|
537
|
-
return
|
|
373
|
+
return handleInsertInline({
|
|
538
374
|
left: '[',
|
|
539
375
|
right: ']()'
|
|
540
376
|
});
|
|
@@ -548,38 +384,13 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
548
384
|
}),
|
|
549
385
|
label: '图片',
|
|
550
386
|
onClick: function onClick() {
|
|
551
|
-
return
|
|
387
|
+
return handleInsertInline({
|
|
552
388
|
left: '![',
|
|
553
389
|
right: ']()'
|
|
554
390
|
});
|
|
555
391
|
}
|
|
556
392
|
}]);
|
|
557
|
-
return /*#__PURE__*/React.createElement(
|
|
558
|
-
sx: {
|
|
559
|
-
position: 'absolute',
|
|
560
|
-
left: '50%',
|
|
561
|
-
top: 45,
|
|
562
|
-
overflow: 'hidden',
|
|
563
|
-
px: 2,
|
|
564
|
-
py: 1,
|
|
565
|
-
transform: 'translateX(-50%)',
|
|
566
|
-
bgcolor: 'background.default',
|
|
567
|
-
zIndex: 10,
|
|
568
|
-
border: '1px solid',
|
|
569
|
-
borderColor: 'primary.main',
|
|
570
|
-
color: 'text.disabled',
|
|
571
|
-
'&::before': {
|
|
572
|
-
content: '""',
|
|
573
|
-
position: 'absolute',
|
|
574
|
-
top: 0,
|
|
575
|
-
left: 0,
|
|
576
|
-
width: "".concat(uplaodProgress, "%"),
|
|
577
|
-
height: '100%',
|
|
578
|
-
bgcolor: alpha(theme.palette.primary.main, 0.1),
|
|
579
|
-
transition: 'width 0.3s ease'
|
|
580
|
-
}
|
|
581
|
-
}
|
|
582
|
-
}, "\u6B63\u5728\u4E0A\u4F20\u6587\u4EF6\uFF1A", fileUploadingName), /*#__PURE__*/React.createElement(Stack, {
|
|
393
|
+
return /*#__PURE__*/React.createElement(Stack, {
|
|
583
394
|
direction: 'row',
|
|
584
395
|
alignItems: 'center'
|
|
585
396
|
}, /*#__PURE__*/React.createElement(Menu, {
|
|
@@ -648,7 +459,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
648
459
|
}).join(' | '), " |\n");
|
|
649
460
|
}).join('');
|
|
650
461
|
var tableMarkdown = "".concat(headerRow).concat(separatorRow).concat(dataRows);
|
|
651
|
-
|
|
462
|
+
handleInsertBlock({
|
|
652
463
|
text: tableMarkdown,
|
|
653
464
|
position: 1,
|
|
654
465
|
wrap: true
|
|
@@ -732,7 +543,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
732
543
|
}
|
|
733
544
|
}),
|
|
734
545
|
onClick: function onClick() {
|
|
735
|
-
return
|
|
546
|
+
return handleInsertBlock({
|
|
736
547
|
text: '---\n\n',
|
|
737
548
|
row: 2
|
|
738
549
|
});
|
|
@@ -746,7 +557,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
746
557
|
}
|
|
747
558
|
}),
|
|
748
559
|
onClick: function onClick() {
|
|
749
|
-
return
|
|
560
|
+
return handleInsertBlock({
|
|
750
561
|
text: '> ',
|
|
751
562
|
position: 2
|
|
752
563
|
});
|
|
@@ -760,7 +571,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
760
571
|
}
|
|
761
572
|
}),
|
|
762
573
|
onClick: function onClick() {
|
|
763
|
-
return
|
|
574
|
+
return handleInsertBlock({
|
|
764
575
|
text: ':::details\n\n:::detailsSummary\n\n:::\n\n:::detailsContent\n\n:::\n\n:::\n',
|
|
765
576
|
row: 3,
|
|
766
577
|
wrap: true
|
|
@@ -784,7 +595,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
784
595
|
}
|
|
785
596
|
}),
|
|
786
597
|
onClick: function onClick() {
|
|
787
|
-
return
|
|
598
|
+
return handleInsertBlock({
|
|
788
599
|
text: ':::alert {variant="info"}\n\n:::',
|
|
789
600
|
row: 1,
|
|
790
601
|
wrap: true
|
|
@@ -800,7 +611,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
800
611
|
}
|
|
801
612
|
}),
|
|
802
613
|
onClick: function onClick() {
|
|
803
|
-
return
|
|
614
|
+
return handleInsertBlock({
|
|
804
615
|
text: ':::alert {variant="warning"}\n\n:::',
|
|
805
616
|
row: 1,
|
|
806
617
|
wrap: true
|
|
@@ -816,7 +627,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
816
627
|
}
|
|
817
628
|
}),
|
|
818
629
|
onClick: function onClick() {
|
|
819
|
-
return
|
|
630
|
+
return handleInsertBlock({
|
|
820
631
|
text: ':::alert {variant="error"}\n\n:::',
|
|
821
632
|
row: 1,
|
|
822
633
|
wrap: true
|
|
@@ -832,7 +643,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
832
643
|
}
|
|
833
644
|
}),
|
|
834
645
|
onClick: function onClick() {
|
|
835
|
-
return
|
|
646
|
+
return handleInsertBlock({
|
|
836
647
|
text: ':::alert {variant="success"}\n\n:::',
|
|
837
648
|
row: 1,
|
|
838
649
|
wrap: true
|
|
@@ -848,7 +659,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
848
659
|
}
|
|
849
660
|
}),
|
|
850
661
|
onClick: function onClick() {
|
|
851
|
-
return
|
|
662
|
+
return handleInsertBlock({
|
|
852
663
|
text: ':::alert {variant="default"}\n\n:::',
|
|
853
664
|
row: 1,
|
|
854
665
|
wrap: true
|
|
@@ -882,7 +693,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
882
693
|
}
|
|
883
694
|
}),
|
|
884
695
|
onClick: function onClick() {
|
|
885
|
-
return
|
|
696
|
+
return handleInsertInline({
|
|
886
697
|
single: '`'
|
|
887
698
|
});
|
|
888
699
|
}
|
|
@@ -895,7 +706,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
895
706
|
}
|
|
896
707
|
}),
|
|
897
708
|
onClick: function onClick() {
|
|
898
|
-
return
|
|
709
|
+
return handleInsertBlock({
|
|
899
710
|
text: '```\n\n```',
|
|
900
711
|
row: 1,
|
|
901
712
|
wrap: true
|
|
@@ -919,7 +730,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
919
730
|
}
|
|
920
731
|
}),
|
|
921
732
|
onClick: function onClick() {
|
|
922
|
-
return
|
|
733
|
+
return handleInsertInline({
|
|
923
734
|
single: '$'
|
|
924
735
|
});
|
|
925
736
|
}
|
|
@@ -932,7 +743,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
932
743
|
}
|
|
933
744
|
}),
|
|
934
745
|
onClick: function onClick() {
|
|
935
|
-
return
|
|
746
|
+
return handleInsertBlock({
|
|
936
747
|
text: '$$\n\n$$',
|
|
937
748
|
row: 1,
|
|
938
749
|
wrap: true
|
|
@@ -1064,7 +875,7 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
1064
875
|
}).join(' | '), " |\n");
|
|
1065
876
|
}).join('');
|
|
1066
877
|
var tableMarkdown = "".concat(headerRow).concat(separatorRow).concat(dataRows);
|
|
1067
|
-
|
|
878
|
+
handleInsertBlock({
|
|
1068
879
|
text: tableMarkdown,
|
|
1069
880
|
position: 1,
|
|
1070
881
|
wrap: true
|
|
@@ -1111,6 +922,6 @@ var EditorMarkdownToolbar = function EditorMarkdownToolbar(_ref) {
|
|
|
1111
922
|
onChange: function onChange(e) {
|
|
1112
923
|
return handleFileSelect(e, 'attachment');
|
|
1113
924
|
}
|
|
1114
|
-
}))
|
|
925
|
+
}));
|
|
1115
926
|
};
|
|
1116
927
|
export default EditorMarkdownToolbar;
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
import { alpha, Box, Paper, useTheme } from "@mui/material";
|
|
2
|
+
import React from "react";
|
|
3
|
+
var UploadProgress = function UploadProgress(_ref) {
|
|
4
|
+
var progress = _ref.progress,
|
|
5
|
+
fileName = _ref.fileName;
|
|
6
|
+
var theme = useTheme();
|
|
7
|
+
return /*#__PURE__*/React.createElement(Paper, {
|
|
8
|
+
sx: {
|
|
9
|
+
position: 'absolute',
|
|
10
|
+
left: '50%',
|
|
11
|
+
top: 45,
|
|
12
|
+
overflow: 'hidden',
|
|
13
|
+
px: 2,
|
|
14
|
+
py: 1,
|
|
15
|
+
transform: 'translateX(-50%)',
|
|
16
|
+
bgcolor: 'background.default',
|
|
17
|
+
zIndex: 10,
|
|
18
|
+
fontSize: 12,
|
|
19
|
+
color: 'text.disabled',
|
|
20
|
+
boxShadow: "0px 4px 20px ".concat(alpha(theme.palette.info.main, 0.25), ", 0px 0px 10px ").concat(alpha(theme.palette.info.main, 0.15)),
|
|
21
|
+
borderRadius: 2,
|
|
22
|
+
backdropFilter: 'blur(10px)',
|
|
23
|
+
border: "1px solid ".concat(alpha(theme.palette.info.main, 0.2)),
|
|
24
|
+
'&::before': {
|
|
25
|
+
content: '""',
|
|
26
|
+
position: 'absolute',
|
|
27
|
+
top: 0,
|
|
28
|
+
left: 0,
|
|
29
|
+
width: "".concat(progress, "%"),
|
|
30
|
+
height: '100%',
|
|
31
|
+
background: "linear-gradient(90deg, \n ".concat(alpha(theme.palette.info.main, 0.2), " 0%, \n ").concat(alpha(theme.palette.info.main, 0.35), " 50%, \n ").concat(alpha(theme.palette.info.main, 0.2), " 100%)"),
|
|
32
|
+
transition: 'width 0.2s cubic-bezier(0.4, 0, 0.2, 1)',
|
|
33
|
+
zIndex: 0
|
|
34
|
+
},
|
|
35
|
+
'&::after': {
|
|
36
|
+
content: '""',
|
|
37
|
+
position: 'absolute',
|
|
38
|
+
top: 0,
|
|
39
|
+
left: 0,
|
|
40
|
+
width: "".concat(progress, "%"),
|
|
41
|
+
height: '100%',
|
|
42
|
+
background: "linear-gradient(90deg, \n transparent 0%, \n ".concat(alpha(theme.palette.info.light || '#74CAFF', 0.4), " 50%, \n transparent 100%)"),
|
|
43
|
+
backgroundSize: '200% 100%',
|
|
44
|
+
animation: progress >= 100 ? 'none' : 'shimmer 2s infinite',
|
|
45
|
+
transition: 'width 0.2s cubic-bezier(0.4, 0, 0.2, 1)',
|
|
46
|
+
zIndex: 1,
|
|
47
|
+
'@keyframes shimmer': {
|
|
48
|
+
'0%': {
|
|
49
|
+
backgroundPosition: '-200% 0'
|
|
50
|
+
},
|
|
51
|
+
'100%': {
|
|
52
|
+
backgroundPosition: '200% 0'
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
}, /*#__PURE__*/React.createElement(Box, {
|
|
58
|
+
sx: {
|
|
59
|
+
position: 'relative',
|
|
60
|
+
zIndex: 2
|
|
61
|
+
}
|
|
62
|
+
}, "\u6B63\u5728\u4E0A\u4F20\u6587\u4EF6\uFF1A", fileName, " ", /*#__PURE__*/React.createElement(Box, {
|
|
63
|
+
component: 'span',
|
|
64
|
+
sx: {
|
|
65
|
+
color: 'info.main',
|
|
66
|
+
display: 'inline-block',
|
|
67
|
+
ml: 2,
|
|
68
|
+
fontWeight: 600,
|
|
69
|
+
transition: 'all 0.3s cubic-bezier(0.4, 0, 0.2, 1)',
|
|
70
|
+
textShadow: "0 0 8px ".concat(alpha(theme.palette.info.main, 0.6)),
|
|
71
|
+
animation: progress >= 100 ? 'none' : 'pulse 2s ease-in-out infinite',
|
|
72
|
+
'@keyframes pulse': {
|
|
73
|
+
'0%, 100%': {
|
|
74
|
+
opacity: 1,
|
|
75
|
+
transform: 'scale(1)'
|
|
76
|
+
},
|
|
77
|
+
'50%': {
|
|
78
|
+
opacity: 0.8,
|
|
79
|
+
transform: 'scale(1.05)'
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
}, progress, "%")));
|
|
84
|
+
};
|
|
85
|
+
export default UploadProgress;
|
|
@@ -155,9 +155,10 @@ var Reader = function Reader() {
|
|
|
155
155
|
editor: editor,
|
|
156
156
|
height: '500px',
|
|
157
157
|
value: mdContent,
|
|
158
|
-
splitMode: true
|
|
159
|
-
showToolbar
|
|
160
|
-
|
|
158
|
+
splitMode: true
|
|
159
|
+
// showToolbar={false}
|
|
160
|
+
,
|
|
161
|
+
defaultDisplayMode: "split",
|
|
161
162
|
placeholder: "\u8BF7\u8F93\u5165\u5185\u5BB9",
|
|
162
163
|
onUpload: onUpload,
|
|
163
164
|
onAceChange: setMdContent
|
|
@@ -12,12 +12,14 @@ import 'ace-builds/src-noconflict/theme-github';
|
|
|
12
12
|
interface EditorMarkdownProps {
|
|
13
13
|
editor: Editor;
|
|
14
14
|
value?: string;
|
|
15
|
+
readOnly?: string;
|
|
15
16
|
placeholder?: string;
|
|
16
17
|
height: number | string;
|
|
17
18
|
onUpload?: UploadFunction;
|
|
18
19
|
defaultDisplayMode?: DisplayMode;
|
|
19
20
|
splitMode?: boolean;
|
|
20
21
|
showToolbar?: boolean;
|
|
22
|
+
showLineNumbers?: boolean;
|
|
21
23
|
onAceChange?: (value: string) => void;
|
|
22
24
|
onTiptapChange?: (value: string) => void;
|
|
23
25
|
}
|
|
@@ -4,6 +4,10 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
|
|
|
4
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
5
|
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
6
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
|
+
function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
|
|
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
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
8
12
|
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."); }
|
|
9
13
|
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); }
|
|
@@ -16,6 +20,8 @@ import React, { forwardRef, useEffect, useImperativeHandle, useMemo, useRef, use
|
|
|
16
20
|
import AceEditor from "react-ace";
|
|
17
21
|
import { MARKDOWN_EDITOR_PLACEHOLDER } from "../contants/markdown-placeholder";
|
|
18
22
|
import EditorMarkdownToolbar from "./Toolbar";
|
|
23
|
+
import UploadProgress from "./UploadProgress";
|
|
24
|
+
import { insertInlineTool } from "./util";
|
|
19
25
|
import 'ace-builds/src-noconflict/ace';
|
|
20
26
|
import 'ace-builds/src-noconflict/ext-language_tools';
|
|
21
27
|
import 'ace-builds/src-noconflict/mode-markdown';
|
|
@@ -27,12 +33,16 @@ var EditorMarkdown = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
27
33
|
onAceChange = _ref.onAceChange,
|
|
28
34
|
height = _ref.height,
|
|
29
35
|
onUpload = _ref.onUpload,
|
|
36
|
+
_ref$readOnly = _ref.readOnly,
|
|
37
|
+
readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
|
|
30
38
|
_ref$splitMode = _ref.splitMode,
|
|
31
39
|
splitMode = _ref$splitMode === void 0 ? false : _ref$splitMode,
|
|
32
40
|
_ref$defaultDisplayMo = _ref.defaultDisplayMode,
|
|
33
41
|
defaultDisplayMode = _ref$defaultDisplayMo === void 0 ? 'edit' : _ref$defaultDisplayMo,
|
|
34
42
|
_ref$showToolbar = _ref.showToolbar,
|
|
35
|
-
showToolbar = _ref$showToolbar === void 0 ? true : _ref$showToolbar
|
|
43
|
+
showToolbar = _ref$showToolbar === void 0 ? true : _ref$showToolbar,
|
|
44
|
+
_ref$showLineNumbers = _ref.showLineNumbers,
|
|
45
|
+
showLineNumbers = _ref$showLineNumbers === void 0 ? true : _ref$showLineNumbers;
|
|
36
46
|
var theme = useTheme();
|
|
37
47
|
var aceEditorRef = useRef(null);
|
|
38
48
|
var _useState = useState(defaultDisplayMode),
|
|
@@ -47,6 +57,14 @@ var EditorMarkdown = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
47
57
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
48
58
|
loading = _useState6[0],
|
|
49
59
|
setLoading = _useState6[1];
|
|
60
|
+
var _useState7 = useState(0),
|
|
61
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
62
|
+
progress = _useState8[0],
|
|
63
|
+
setProgress = _useState8[1];
|
|
64
|
+
var _useState9 = useState(''),
|
|
65
|
+
_useState10 = _slicedToArray(_useState9, 2),
|
|
66
|
+
fileName = _useState10[0],
|
|
67
|
+
setFileName = _useState10[1];
|
|
50
68
|
var EditorHeight = useMemo(function () {
|
|
51
69
|
return isExpend ? 'calc(100vh - 45px)' : height;
|
|
52
70
|
}, [isExpend, height]);
|
|
@@ -56,6 +74,264 @@ var EditorMarkdown = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
56
74
|
contentType: 'markdown'
|
|
57
75
|
});
|
|
58
76
|
};
|
|
77
|
+
var handleFileUpload = /*#__PURE__*/function () {
|
|
78
|
+
var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(file, expectedType) {
|
|
79
|
+
var url, content;
|
|
80
|
+
return _regeneratorRuntime().wrap(function _callee$(_context) {
|
|
81
|
+
while (1) switch (_context.prev = _context.next) {
|
|
82
|
+
case 0:
|
|
83
|
+
if (!(!onUpload || !aceEditorRef.current)) {
|
|
84
|
+
_context.next = 2;
|
|
85
|
+
break;
|
|
86
|
+
}
|
|
87
|
+
return _context.abrupt("return");
|
|
88
|
+
case 2:
|
|
89
|
+
_context.prev = 2;
|
|
90
|
+
setLoading === null || setLoading === void 0 || setLoading(true);
|
|
91
|
+
setFileName(file.name);
|
|
92
|
+
_context.next = 7;
|
|
93
|
+
return onUpload(file, function (progress) {
|
|
94
|
+
setProgress(Math.round(progress.progress * 100));
|
|
95
|
+
});
|
|
96
|
+
case 7:
|
|
97
|
+
url = _context.sent;
|
|
98
|
+
content = '';
|
|
99
|
+
if (expectedType === 'image') {
|
|
100
|
+
content = ".concat(url, ")");
|
|
101
|
+
} else if (expectedType === 'video') {
|
|
102
|
+
content = "<video src=\"".concat(url, "\" controls=\"true\"></video>");
|
|
103
|
+
} else if (expectedType === 'audio') {
|
|
104
|
+
content = "<audio src=\"".concat(url, "\" controls=\"true\"></audio>");
|
|
105
|
+
} else {
|
|
106
|
+
content = "<a href=\"".concat(url, "\" download=\"").concat(file.name, "\">").concat(file.name, "</a>");
|
|
107
|
+
}
|
|
108
|
+
insertInlineTool(aceEditorRef.current, {
|
|
109
|
+
left: content,
|
|
110
|
+
position: 1000
|
|
111
|
+
});
|
|
112
|
+
_context.next = 16;
|
|
113
|
+
break;
|
|
114
|
+
case 13:
|
|
115
|
+
_context.prev = 13;
|
|
116
|
+
_context.t0 = _context["catch"](2);
|
|
117
|
+
console.error('文件上传失败:', _context.t0);
|
|
118
|
+
case 16:
|
|
119
|
+
_context.prev = 16;
|
|
120
|
+
setLoading === null || setLoading === void 0 || setLoading(false);
|
|
121
|
+
setFileName('');
|
|
122
|
+
setProgress(0);
|
|
123
|
+
return _context.finish(16);
|
|
124
|
+
case 21:
|
|
125
|
+
case "end":
|
|
126
|
+
return _context.stop();
|
|
127
|
+
}
|
|
128
|
+
}, _callee, null, [[2, 13, 16, 21]]);
|
|
129
|
+
}));
|
|
130
|
+
return function handleFileUpload(_x, _x2) {
|
|
131
|
+
return _ref2.apply(this, arguments);
|
|
132
|
+
};
|
|
133
|
+
}();
|
|
134
|
+
var handlePaste = /*#__PURE__*/function () {
|
|
135
|
+
var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(e) {
|
|
136
|
+
var items, i, item, file;
|
|
137
|
+
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
|
|
138
|
+
while (1) switch (_context2.prev = _context2.next) {
|
|
139
|
+
case 0:
|
|
140
|
+
if (!(!['edit', 'split'].includes(displayMode) || loading || !!readOnly)) {
|
|
141
|
+
_context2.next = 2;
|
|
142
|
+
break;
|
|
143
|
+
}
|
|
144
|
+
return _context2.abrupt("return");
|
|
145
|
+
case 2:
|
|
146
|
+
items = e.clipboardData.items;
|
|
147
|
+
i = 0;
|
|
148
|
+
case 4:
|
|
149
|
+
if (!(i < items.length)) {
|
|
150
|
+
_context2.next = 16;
|
|
151
|
+
break;
|
|
152
|
+
}
|
|
153
|
+
item = items[i];
|
|
154
|
+
if (!(item.type.indexOf('image') !== -1)) {
|
|
155
|
+
_context2.next = 13;
|
|
156
|
+
break;
|
|
157
|
+
}
|
|
158
|
+
e.preventDefault();
|
|
159
|
+
file = item.getAsFile();
|
|
160
|
+
if (!file) {
|
|
161
|
+
_context2.next = 12;
|
|
162
|
+
break;
|
|
163
|
+
}
|
|
164
|
+
_context2.next = 12;
|
|
165
|
+
return handleFileUpload(file, 'image');
|
|
166
|
+
case 12:
|
|
167
|
+
return _context2.abrupt("break", 16);
|
|
168
|
+
case 13:
|
|
169
|
+
i++;
|
|
170
|
+
_context2.next = 4;
|
|
171
|
+
break;
|
|
172
|
+
case 16:
|
|
173
|
+
case "end":
|
|
174
|
+
return _context2.stop();
|
|
175
|
+
}
|
|
176
|
+
}, _callee2);
|
|
177
|
+
}));
|
|
178
|
+
return function handlePaste(_x3) {
|
|
179
|
+
return _ref3.apply(this, arguments);
|
|
180
|
+
};
|
|
181
|
+
}();
|
|
182
|
+
var handleDragOver = function handleDragOver(e) {
|
|
183
|
+
e.preventDefault();
|
|
184
|
+
e.stopPropagation();
|
|
185
|
+
};
|
|
186
|
+
var handleDragLeave = function handleDragLeave(e) {
|
|
187
|
+
e.preventDefault();
|
|
188
|
+
e.stopPropagation();
|
|
189
|
+
};
|
|
190
|
+
var handleDrop = /*#__PURE__*/function () {
|
|
191
|
+
var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(e) {
|
|
192
|
+
var files, imageFiles, videoFiles, audioFiles, attachmentFiles, _iterator, _step, file, _iterator2, _step2, _file, _iterator3, _step3, _file2, _iterator4, _step4, _file3;
|
|
193
|
+
return _regeneratorRuntime().wrap(function _callee3$(_context3) {
|
|
194
|
+
while (1) switch (_context3.prev = _context3.next) {
|
|
195
|
+
case 0:
|
|
196
|
+
if (['edit', 'split'].includes(displayMode)) {
|
|
197
|
+
_context3.next = 2;
|
|
198
|
+
break;
|
|
199
|
+
}
|
|
200
|
+
return _context3.abrupt("return");
|
|
201
|
+
case 2:
|
|
202
|
+
e.preventDefault();
|
|
203
|
+
e.stopPropagation();
|
|
204
|
+
|
|
205
|
+
// 先聚焦编辑器,确保光标位置正确
|
|
206
|
+
if (aceEditorRef.current) {
|
|
207
|
+
aceEditorRef.current.editor.focus();
|
|
208
|
+
}
|
|
209
|
+
files = Array.from(e.dataTransfer.files);
|
|
210
|
+
imageFiles = files.filter(function (file) {
|
|
211
|
+
return file.type.startsWith('image/');
|
|
212
|
+
});
|
|
213
|
+
videoFiles = files.filter(function (file) {
|
|
214
|
+
return file.type.startsWith('video/');
|
|
215
|
+
});
|
|
216
|
+
audioFiles = files.filter(function (file) {
|
|
217
|
+
return file.type.startsWith('audio/');
|
|
218
|
+
});
|
|
219
|
+
attachmentFiles = files.filter(function (file) {
|
|
220
|
+
return !file.type.startsWith('image/') && !file.type.startsWith('video/') && !file.type.startsWith('audio/');
|
|
221
|
+
});
|
|
222
|
+
_iterator = _createForOfIteratorHelper(imageFiles);
|
|
223
|
+
_context3.prev = 11;
|
|
224
|
+
_iterator.s();
|
|
225
|
+
case 13:
|
|
226
|
+
if ((_step = _iterator.n()).done) {
|
|
227
|
+
_context3.next = 19;
|
|
228
|
+
break;
|
|
229
|
+
}
|
|
230
|
+
file = _step.value;
|
|
231
|
+
_context3.next = 17;
|
|
232
|
+
return handleFileUpload(file, 'image');
|
|
233
|
+
case 17:
|
|
234
|
+
_context3.next = 13;
|
|
235
|
+
break;
|
|
236
|
+
case 19:
|
|
237
|
+
_context3.next = 24;
|
|
238
|
+
break;
|
|
239
|
+
case 21:
|
|
240
|
+
_context3.prev = 21;
|
|
241
|
+
_context3.t0 = _context3["catch"](11);
|
|
242
|
+
_iterator.e(_context3.t0);
|
|
243
|
+
case 24:
|
|
244
|
+
_context3.prev = 24;
|
|
245
|
+
_iterator.f();
|
|
246
|
+
return _context3.finish(24);
|
|
247
|
+
case 27:
|
|
248
|
+
_iterator2 = _createForOfIteratorHelper(videoFiles);
|
|
249
|
+
_context3.prev = 28;
|
|
250
|
+
_iterator2.s();
|
|
251
|
+
case 30:
|
|
252
|
+
if ((_step2 = _iterator2.n()).done) {
|
|
253
|
+
_context3.next = 36;
|
|
254
|
+
break;
|
|
255
|
+
}
|
|
256
|
+
_file = _step2.value;
|
|
257
|
+
_context3.next = 34;
|
|
258
|
+
return handleFileUpload(_file, 'video');
|
|
259
|
+
case 34:
|
|
260
|
+
_context3.next = 30;
|
|
261
|
+
break;
|
|
262
|
+
case 36:
|
|
263
|
+
_context3.next = 41;
|
|
264
|
+
break;
|
|
265
|
+
case 38:
|
|
266
|
+
_context3.prev = 38;
|
|
267
|
+
_context3.t1 = _context3["catch"](28);
|
|
268
|
+
_iterator2.e(_context3.t1);
|
|
269
|
+
case 41:
|
|
270
|
+
_context3.prev = 41;
|
|
271
|
+
_iterator2.f();
|
|
272
|
+
return _context3.finish(41);
|
|
273
|
+
case 44:
|
|
274
|
+
_iterator3 = _createForOfIteratorHelper(audioFiles);
|
|
275
|
+
_context3.prev = 45;
|
|
276
|
+
_iterator3.s();
|
|
277
|
+
case 47:
|
|
278
|
+
if ((_step3 = _iterator3.n()).done) {
|
|
279
|
+
_context3.next = 53;
|
|
280
|
+
break;
|
|
281
|
+
}
|
|
282
|
+
_file2 = _step3.value;
|
|
283
|
+
_context3.next = 51;
|
|
284
|
+
return handleFileUpload(_file2, 'audio');
|
|
285
|
+
case 51:
|
|
286
|
+
_context3.next = 47;
|
|
287
|
+
break;
|
|
288
|
+
case 53:
|
|
289
|
+
_context3.next = 58;
|
|
290
|
+
break;
|
|
291
|
+
case 55:
|
|
292
|
+
_context3.prev = 55;
|
|
293
|
+
_context3.t2 = _context3["catch"](45);
|
|
294
|
+
_iterator3.e(_context3.t2);
|
|
295
|
+
case 58:
|
|
296
|
+
_context3.prev = 58;
|
|
297
|
+
_iterator3.f();
|
|
298
|
+
return _context3.finish(58);
|
|
299
|
+
case 61:
|
|
300
|
+
_iterator4 = _createForOfIteratorHelper(attachmentFiles);
|
|
301
|
+
_context3.prev = 62;
|
|
302
|
+
_iterator4.s();
|
|
303
|
+
case 64:
|
|
304
|
+
if ((_step4 = _iterator4.n()).done) {
|
|
305
|
+
_context3.next = 70;
|
|
306
|
+
break;
|
|
307
|
+
}
|
|
308
|
+
_file3 = _step4.value;
|
|
309
|
+
_context3.next = 68;
|
|
310
|
+
return handleFileUpload(_file3, 'attachment');
|
|
311
|
+
case 68:
|
|
312
|
+
_context3.next = 64;
|
|
313
|
+
break;
|
|
314
|
+
case 70:
|
|
315
|
+
_context3.next = 75;
|
|
316
|
+
break;
|
|
317
|
+
case 72:
|
|
318
|
+
_context3.prev = 72;
|
|
319
|
+
_context3.t3 = _context3["catch"](62);
|
|
320
|
+
_iterator4.e(_context3.t3);
|
|
321
|
+
case 75:
|
|
322
|
+
_context3.prev = 75;
|
|
323
|
+
_iterator4.f();
|
|
324
|
+
return _context3.finish(75);
|
|
325
|
+
case 78:
|
|
326
|
+
case "end":
|
|
327
|
+
return _context3.stop();
|
|
328
|
+
}
|
|
329
|
+
}, _callee3, null, [[11, 21, 24, 27], [28, 38, 41, 44], [45, 55, 58, 61], [62, 72, 75, 78]]);
|
|
330
|
+
}));
|
|
331
|
+
return function handleDrop(_x4) {
|
|
332
|
+
return _ref4.apply(this, arguments);
|
|
333
|
+
};
|
|
334
|
+
}();
|
|
59
335
|
useImperativeHandle(ref, function () {
|
|
60
336
|
return {
|
|
61
337
|
scrollToHeading: function scrollToHeading(headingText) {
|
|
@@ -92,7 +368,10 @@ var EditorMarkdown = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
92
368
|
right: 0,
|
|
93
369
|
zIndex: 2000
|
|
94
370
|
})
|
|
95
|
-
},
|
|
371
|
+
}, loading && /*#__PURE__*/React.createElement(UploadProgress, {
|
|
372
|
+
progress: progress,
|
|
373
|
+
fileName: fileName
|
|
374
|
+
}), showToolbar && /*#__PURE__*/React.createElement(Stack, {
|
|
96
375
|
direction: "row",
|
|
97
376
|
alignItems: 'center',
|
|
98
377
|
justifyContent: 'space-between',
|
|
@@ -115,11 +394,9 @@ var EditorMarkdown = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
115
394
|
}
|
|
116
395
|
}
|
|
117
396
|
}, /*#__PURE__*/React.createElement(EditorMarkdownToolbar, {
|
|
118
|
-
aceEditorRef: aceEditorRef,
|
|
119
397
|
isExpend: isExpend,
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
setLoading: setLoading
|
|
398
|
+
aceEditorRef: aceEditorRef,
|
|
399
|
+
onFileUpload: handleFileUpload
|
|
123
400
|
}), /*#__PURE__*/React.createElement(Stack, {
|
|
124
401
|
direction: 'row',
|
|
125
402
|
alignItems: 'center',
|
|
@@ -189,6 +466,10 @@ var EditorMarkdown = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
189
466
|
}
|
|
190
467
|
}, ['edit', 'split'].includes(displayMode) && /*#__PURE__*/React.createElement(Stack, {
|
|
191
468
|
direction: "column",
|
|
469
|
+
onPaste: handlePaste,
|
|
470
|
+
onDragOver: handleDragOver,
|
|
471
|
+
onDragLeave: handleDragLeave,
|
|
472
|
+
onDrop: handleDrop,
|
|
192
473
|
sx: {
|
|
193
474
|
flex: 1,
|
|
194
475
|
fontFamily: 'monospace',
|
|
@@ -196,7 +477,8 @@ var EditorMarkdown = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
196
477
|
transform: 'scale(1)',
|
|
197
478
|
height: '100%',
|
|
198
479
|
overflow: 'auto',
|
|
199
|
-
width: '100%'
|
|
480
|
+
width: '100%',
|
|
481
|
+
fontStyle: 'normal'
|
|
200
482
|
}
|
|
201
483
|
}
|
|
202
484
|
}, /*#__PURE__*/React.createElement(AceEditor, {
|
|
@@ -207,7 +489,7 @@ var EditorMarkdown = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
207
489
|
onChange: onChange,
|
|
208
490
|
name: "project-doc-editor",
|
|
209
491
|
wrapEnabled: true,
|
|
210
|
-
readOnly: loading,
|
|
492
|
+
readOnly: loading || !!readOnly,
|
|
211
493
|
showPrintMargin: false,
|
|
212
494
|
placeholder: placeholder || MARKDOWN_EDITOR_PLACEHOLDER,
|
|
213
495
|
fontSize: 16,
|
|
@@ -217,7 +499,7 @@ var EditorMarkdown = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
217
499
|
setOptions: {
|
|
218
500
|
enableBasicAutocompletion: true,
|
|
219
501
|
enableLiveAutocompletion: true,
|
|
220
|
-
showLineNumbers:
|
|
502
|
+
showLineNumbers: showLineNumbers,
|
|
221
503
|
tabSize: 2
|
|
222
504
|
},
|
|
223
505
|
style: {
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import AceEditor from "react-ace";
|
|
2
|
+
export declare const insertBlockTool: (ace: AceEditor, options: {
|
|
3
|
+
text: string;
|
|
4
|
+
position?: number | undefined;
|
|
5
|
+
row?: number | undefined;
|
|
6
|
+
wrap?: boolean | undefined;
|
|
7
|
+
}) => void;
|
|
8
|
+
export declare const insertInlineTool: (ace: AceEditor, options: {
|
|
9
|
+
single?: string | undefined;
|
|
10
|
+
left?: string | undefined;
|
|
11
|
+
right?: string | undefined;
|
|
12
|
+
position?: number | undefined;
|
|
13
|
+
row?: number | undefined;
|
|
14
|
+
}) => void;
|
|
15
|
+
export declare const insertHeadingTool: (ace: AceEditor, options: {
|
|
16
|
+
level: 1 | 2 | 3 | 4 | 5 | 6;
|
|
17
|
+
}) => void;
|
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
export var insertBlockTool = function insertBlockTool(ace, options) {
|
|
2
|
+
if (!ace || !ace.editor) return;
|
|
3
|
+
var cursor = ace.editor.getCursorPosition();
|
|
4
|
+
var curRowLength = ace.editor.session.getLine(cursor.row).length;
|
|
5
|
+
var prevRowLength = ace.editor.session.getLine(cursor.row - 1).length;
|
|
6
|
+
var text = "\n\n".concat(options.text);
|
|
7
|
+
var plusRow = 2;
|
|
8
|
+
if (curRowLength === 0 && prevRowLength === 0 && cursor.row > 1) {
|
|
9
|
+
text = "".concat(options.text);
|
|
10
|
+
if (options.wrap) {
|
|
11
|
+
plusRow = 0;
|
|
12
|
+
}
|
|
13
|
+
}
|
|
14
|
+
if (curRowLength === 0 && cursor.row === 0) {
|
|
15
|
+
text = options.text;
|
|
16
|
+
if (options.wrap) {
|
|
17
|
+
plusRow = 0;
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
if (curRowLength === 0 && prevRowLength > 0) {
|
|
21
|
+
text = "\n".concat(options.text);
|
|
22
|
+
if (options.wrap) {
|
|
23
|
+
plusRow = 1;
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
ace.editor.moveCursorTo(cursor.row, curRowLength);
|
|
27
|
+
ace.editor.clearSelection();
|
|
28
|
+
ace.editor.insert(text);
|
|
29
|
+
ace.editor.moveCursorTo(cursor.row + plusRow + (options.row || 0), options.position || 0);
|
|
30
|
+
ace.editor.focus();
|
|
31
|
+
};
|
|
32
|
+
export var insertInlineTool = function insertInlineTool(ace, options) {
|
|
33
|
+
if (!ace || !ace.editor) return;
|
|
34
|
+
var left = options.single || options.left || '';
|
|
35
|
+
var right = options.single || options.right || '';
|
|
36
|
+
var selectedText = ace.editor.getSelectedText();
|
|
37
|
+
var cursor = ace.editor.getCursorPosition();
|
|
38
|
+
var selectionRange = ace.editor.getSelectionRange();
|
|
39
|
+
if (selectedText) {
|
|
40
|
+
var wrappedText = "".concat(left).concat(selectedText).concat(right);
|
|
41
|
+
ace.editor.insert(wrappedText);
|
|
42
|
+
var startRow = selectionRange.start.row;
|
|
43
|
+
var startColumn = selectionRange.start.column;
|
|
44
|
+
var endRow = selectionRange.end.row;
|
|
45
|
+
var endColumn = selectionRange.end.column;
|
|
46
|
+
ace.editor.moveCursorTo(startRow, startColumn);
|
|
47
|
+
ace.editor.selection.selectTo(endRow, endColumn + left.length + right.length);
|
|
48
|
+
} else {
|
|
49
|
+
var _options$position = options.position,
|
|
50
|
+
position = _options$position === void 0 ? 0 : _options$position,
|
|
51
|
+
_options$row = options.row,
|
|
52
|
+
row = _options$row === void 0 ? 0 : _options$row;
|
|
53
|
+
var text = "".concat(left).concat(right);
|
|
54
|
+
var curRow = cursor.row + row;
|
|
55
|
+
var curColumn = cursor.column + position;
|
|
56
|
+
ace.editor.insert(text);
|
|
57
|
+
ace.editor.moveCursorTo(curRow, curColumn + left.length);
|
|
58
|
+
}
|
|
59
|
+
ace.editor.focus();
|
|
60
|
+
};
|
|
61
|
+
export var insertHeadingTool = function insertHeadingTool(ace, options) {
|
|
62
|
+
if (!ace || !ace.editor) return;
|
|
63
|
+
|
|
64
|
+
// 1. 获取当前行数,在下方创建一行
|
|
65
|
+
var cursor = ace.editor.getCursorPosition();
|
|
66
|
+
var currentRow = cursor.row;
|
|
67
|
+
var isEditorEmpty = ace.editor.getValue().trim().length === 0;
|
|
68
|
+
|
|
69
|
+
// 2. 在创建的行中插入标题
|
|
70
|
+
var headingPrefix = '#'.repeat(options.level) + ' ';
|
|
71
|
+
var text = "\n\n".concat(headingPrefix);
|
|
72
|
+
var targetRow = currentRow + 2;
|
|
73
|
+
var targetColumn = headingPrefix.length;
|
|
74
|
+
if (isEditorEmpty) {
|
|
75
|
+
text = headingPrefix;
|
|
76
|
+
targetRow = currentRow;
|
|
77
|
+
targetColumn = headingPrefix.length;
|
|
78
|
+
}
|
|
79
|
+
ace.editor.insert(text);
|
|
80
|
+
|
|
81
|
+
// 3. 将光标置于标题中
|
|
82
|
+
ace.editor.moveCursorTo(targetRow, targetColumn);
|
|
83
|
+
ace.editor.focus();
|
|
84
|
+
};
|
|
@@ -66,7 +66,9 @@ export var InlineLinkExtension = Node.create({
|
|
|
66
66
|
HTMLAttributes: {
|
|
67
67
|
target: '_blank',
|
|
68
68
|
class: null,
|
|
69
|
-
type: 'icon'
|
|
69
|
+
type: 'icon',
|
|
70
|
+
rel: null,
|
|
71
|
+
title: null
|
|
70
72
|
},
|
|
71
73
|
isAllowedUri: function isAllowedUri(url, ctx) {
|
|
72
74
|
return !!_isAllowedUri(url, ctx.protocols);
|
package/dist/index.css
CHANGED