@ctzhian/tiptap 1.12.6 → 1.12.7

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.
@@ -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: false,
11
+ editable: true,
12
12
  exclude: ['invisibleCharacters'],
13
13
  onError: function onError(error) {
14
14
  alert(error.message);
@@ -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 _callee(url, type) {
29
- return _regeneratorRuntime().wrap(function _callee$(_context) {
30
- while (1) switch (_context.prev = _context.next) {
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
- _context.next = 3;
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
- _context.t0 = type;
42
- _context.next = _context.t0 === 'image' ? 6 : _context.t0 === 'video' ? 8 : _context.t0 === 'audio' ? 10 : _context.t0 === 'iframe' ? 12 : 14;
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 _context.abrupt("break", 14);
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 _context.abrupt("break", 14);
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 _context.abrupt("break", 14);
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 _context.abrupt("break", 14);
105
+ return _context2.abrupt("break", 14);
65
106
  case 14:
66
- return _context.abrupt("return", url);
107
+ return _context2.abrupt("return", url);
67
108
  case 15:
68
109
  case "end":
69
- return _context.stop();
110
+ return _context2.stop();
70
111
  }
71
- }, _callee);
112
+ }, _callee2);
72
113
  }));
73
- function onValidateUrl(_x, _x2) {
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
- // const value = editor.getMarkdown();
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
- }].concat(_toConsumableArray(!isMarkdown ? [{
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
- }], _toConsumableArray(isMarkdown ? [{
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,
@@ -58,7 +58,7 @@ export var NODE_TYPE_LABEL = (_NODE_TYPE_LABEL = {}, _defineProperty(_defineProp
58
58
  align: true,
59
59
  convert: true
60
60
  }), NodeTypeEnum.Alert, {
61
- label: '警告提示',
61
+ label: '警告块',
62
62
  color: true,
63
63
  fontSize: true,
64
64
  align: true,
@@ -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![\u56FE\u7247](https://via.placeholder.com/600x400)\n[![\u56FE\u7247](https://via.placeholder.com/600x400)](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\u63D0\u793A\uFF1A\n:::alert {variant=\"warning\"}\n\n\u8FD9\u662F\u4E00\u6BB5\u8B66\u544A\u63D0\u793A\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
+ 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![\u56FE\u7247](https://via.placeholder.com/600x400)\n[![\u56FE\u7247](https://via.placeholder.com/600x400)](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![\u56FE\u7247](https://via.placeholder.com/600x400)\n[![\u56FE\u7247](https://via.placeholder.com/600x400)](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\u63D0\u793A\uFF1A\n:::alert {variant=\"warning\"}\n\n\u8FD9\u662F\u4E00\u6BB5\u8B66\u544A\u63D0\u793A\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
+ 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![\u56FE\u7247](https://via.placeholder.com/600x400)\n[![\u56FE\u7247](https://via.placeholder.com/600x400)](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";
@@ -255,7 +255,7 @@ export var slashCommands = [{
255
255
  }).run();
256
256
  }
257
257
  }, {
258
- title: '警告提示',
258
+ title: '警告块',
259
259
  icon: /*#__PURE__*/React.createElement(Information2LineIcon, {
260
260
  sx: {
261
261
  fontSize: '1rem'
@@ -1,8 +1,40 @@
1
- import { Box } from "@mui/material";
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 editor = _ref.editor;
6
- return /*#__PURE__*/React.createElement(MarkViewContent, null, /*#__PURE__*/React.createElement(Box, null, "aaa"));
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;
@@ -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].concat(_toConsumableArray(TableExtension({
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.apply(defaultExtensions, [Link, Markdown.configure({
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
- as: 'a'
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;
@@ -34,9 +34,6 @@ export var VideoExtension = function VideoExtension(props) {
34
34
  },
35
35
  addAttributes: function addAttributes() {
36
36
  return {
37
- class: {
38
- default: 'video-wrapper'
39
- },
40
37
  src: {
41
38
  default: null,
42
39
  parseHTML: function parseHTML(element) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ctzhian/tiptap",
3
- "version": "1.12.6",
3
+ "version": "1.12.7",
4
4
  "description": "基于 Tiptap 二次开发的编辑器组件",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",