@ctzhian/tiptap 1.6.2 → 1.6.3

package/dist/Editor/demo.js

@@ -5,7 +5,6 @@ function _asyncToGenerator(fn) { return function () { var self = this, args = ar
 import { Editor, EditorThemeProvider, EditorToolbar, useTiptap } from "./..";
 import { Box } from '@mui/material';
 import React from 'react';
-import { AiGenerate2Icon } from "../component/Icons";
 import "../index.css";
 var Reader = function Reader() {
   var _useTiptap = useTiptap({
@@ -15,17 +14,13 @@ var Reader = function Reader() {
         console.log(editor.getHTML());
         editor.commands.setContent(editor.getHTML());
       },
-      onCreate: function onCreate(_ref) {
-        var currentEditor = _ref.editor;
-        currentEditor.commands.setAiWriting(true);
-      },
       onAiWritingGetSuggestion: function () {
-        var _onAiWritingGetSuggestion = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(_ref2) {
+        var _onAiWritingGetSuggestion = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(_ref) {
           var prefix, suffix;
           return _regeneratorRuntime().wrap(function _callee$(_context) {
             while (1) switch (_context.prev = _context.next) {
               case 0:
-                prefix = _ref2.prefix, suffix = _ref2.suffix;
+                prefix = _ref.prefix, suffix = _ref.suffix;
                 console.log('onAiWritingGetSuggestion', prefix, suffix);
                 return _context.abrupt("return", new Promise(function (resolve) {
                   resolve(['this is a default suggestion.', 'we are good.', 'what is your name?', 'how are you?', 'what is your favorite color?', 'what is your favorite food?', 'what is your favorite animal?', 'what is your favorite book?', 'what is your favorite movie?', 'what is your favorite song?', 'what is your favorite artist?', 'what is your favorite band?', 'what is your favorite city?', 'what is your favorite country?', 'what is your favorite sport?'][Math.floor(Math.random() * 10)]);
@@ -43,12 +38,12 @@ var Reader = function Reader() {
       }(),
       // onTocUpdate: handleTocUpdate,
       onMentionFilter: function () {
-        var _onMentionFilter = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(_ref3) {
+        var _onMentionFilter = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(_ref2) {
           var query;
           return _regeneratorRuntime().wrap(function _callee2$(_context2) {
             while (1) switch (_context2.prev = _context2.next) {
               case 0:
-                query = _ref3.query;
+                query = _ref2.query;
                 return _context2.abrupt("return", new Promise(function (resolve) {
                   resolve(['Winona Ryder', 'Molly Ringwald', 'Ally Sheedy', 'Debbie Harry', 'Olivia Newton-John', 'Elton John', 'Michael J. Fox', 'Axl Rose', 'Emilio Estevez', 'Ralph Macchio', 'Rob Lowe', 'Jennifer Grey'].filter(function (item) {
                     return item.toLowerCase().startsWith(query.toLowerCase());
@@ -125,19 +120,7 @@ var Reader = function Reader() {
       marginBottom: '30px'
     }
   }, /*#__PURE__*/React.createElement(EditorToolbar, {
-    editor: editor,
-    menuInToolbarMore: [{
-      id: 'ai',
-      icon: /*#__PURE__*/React.createElement(AiGenerate2Icon, {
-        sx: {
-          fontSize: '1rem'
-        }
-      }),
-      onClick: function onClick() {
-        alert('ai');
-      },
-      label: 'AI 文本润色'
-    }]
+    editor: editor
   })), /*#__PURE__*/React.createElement(Box, {
     sx: {
       '.tiptap': {
@@ -149,31 +132,7 @@ var Reader = function Reader() {
       }
     }
   }, /*#__PURE__*/React.createElement(Editor, {
-    editor: editor,
-    menuInDragHandle: [{
-      label: '文本润色',
-      key: 'ai',
-      icon: /*#__PURE__*/React.createElement(AiGenerate2Icon, {
-        sx: {
-          fontSize: '1rem'
-        }
-      }),
-      onClick: function onClick() {
-        alert('ai');
-      }
-    }],
-    menuInBubbleMenu: [{
-      label: '文本润色',
-      key: 'ai',
-      icon: /*#__PURE__*/React.createElement(AiGenerate2Icon, {
-        sx: {
-          fontSize: '1rem'
-        }
-      }),
-      onClick: function onClick() {
-        alert('ai');
-      }
-    }]
+    editor: editor
   }))));
 };
 export default Reader;

package/dist/EditorToolbar/index.js

@@ -1,3 +1,7 @@
+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); }
+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; }
+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); } }
+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); }); }; }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 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."); }
 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); }
@@ -6,9 +10,8 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { Box, Divider, Stack } from '@mui/material';
 import React, { useEffect, useState } from 'react';
-import { ArrowGoBackLineIcon, ArrowGoForwardLineIcon, BoldIcon, DoubleQuotesLIcon, Information2LineIcon, ItalicIcon, LinkIcon, MenuFold2FillIcon, StrikethroughIcon, Table2Icon, UnderlineIcon, WindowFillIcon } from "../component/Icons";
-import { EditorAlignSelect, EditorCode, EditorFontBgColor, EditorFontColor, EditorFontSize, EditorHeading, EditorInsert, EditorListSelect, EditorMath, EditorMore, EditorScript, EditorVerticalAlignSelect, ToolbarItem } from "../component/Toolbar";
-import TableSizePicker from "../component/Toolbar/TableSizePicker";
+import { AiGenerate2Icon, ArrowGoBackLineIcon, ArrowGoForwardLineIcon, BoldIcon, EraserLineIcon, ItalicIcon, LinkIcon, StrikethroughIcon, SubscriptIcon, SuperscriptIcon, UnderlineIcon } from "../component/Icons";
+import { EditorAlignSelect, EditorFontBgColor, EditorFontColor, EditorFontSize, EditorHeading, EditorInsert, EditorListSelect, EditorMore, EditorVerticalAlignSelect, ToolbarItem } from "../component/Toolbar";
 var EditorToolbar = function EditorToolbar(_ref) {
   var editor = _ref.editor,
     menuInToolbarMore = _ref.menuInToolbarMore;
@@ -26,7 +29,8 @@ var EditorToolbar = function EditorToolbar(_ref) {
       table: false,
       link: false,
       alert: false,
-      iframe: false
+      iframe: false,
+      aiWriting: false
     }),
     _useState2 = _slicedToArray(_useState, 2),
     active = _useState2[0],
@@ -46,7 +50,8 @@ var EditorToolbar = function EditorToolbar(_ref) {
       table: editor.isActive('table'),
       link: editor.isActive('link'),
       alert: editor.isActive('alert'),
-      iframe: editor.isActive('iframe')
+      iframe: editor.isActive('iframe'),
+      aiWriting: editor.storage.aiWriting.enabled
     });
   };
   useEffect(function () {
@@ -90,7 +95,30 @@ var EditorToolbar = function EditorToolbar(_ref) {
         }
       }
     }
-  }, /*#__PURE__*/React.createElement(ToolbarItem, {
+  }, /*#__PURE__*/React.createElement(EditorInsert, {
+    editor: editor
+  }), editor.options.extensions.find(function (it) {
+    return it.name === 'aiWriting';
+  }) && /*#__PURE__*/React.createElement(ToolbarItem, {
+    text: 'AI 伴写',
+    icon: /*#__PURE__*/React.createElement(AiGenerate2Icon, {
+      sx: {
+        fontSize: '1rem'
+      }
+    }),
+    onClick: function onClick() {
+      return editor.commands.setAiWriting(!active.aiWriting);
+    },
+    className: active.aiWriting ? 'tool-active' : ''
+  }), /*#__PURE__*/React.createElement(Divider, {
+    orientation: "vertical",
+    flexItem: true,
+    sx: {
+      mx: 0.5,
+      height: 20,
+      alignSelf: 'center'
+    }
+  }), /*#__PURE__*/React.createElement(ToolbarItem, {
     tip: '撤销',
     shortcutKey: ['ctrl', 'Z'],
     icon: /*#__PURE__*/React.createElement(ArrowGoBackLineIcon, {
@@ -114,6 +142,43 @@ var EditorToolbar = function EditorToolbar(_ref) {
       return editor.chain().focus().redo().run();
     },
     disabled: !active.redo
+  }), /*#__PURE__*/React.createElement(ToolbarItem, {
+    tip: '清除格式',
+    icon: /*#__PURE__*/React.createElement(EraserLineIcon, {
+      sx: {
+        fontSize: '1rem'
+      }
+    }),
+    disabled: editor.state.selection.empty,
+    onClick: /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
+      var tr, currentNode, empty, content;
+      return _regeneratorRuntime().wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            if (!editor.state.selection.empty) {
+              tr = editor.state.tr;
+              currentNode = editor.state.selection.content();
+              empty = currentNode.content.size === 0;
+              if (!empty) {
+                content = currentNode.content.content;
+                if (content && content.length > 0) {
+                  tr.doc.nodesBetween(editor.state.selection.from, editor.state.selection.to, function (node, pos) {
+                    if (!node.isInline) return true;
+                    node.marks.forEach(function (mark) {
+                      tr.removeMark(pos, pos + node.nodeSize, mark.type);
+                    });
+                    return true;
+                  });
+                }
+              }
+              editor.view.dispatch(tr);
+            }
+          case 1:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }))
   }), /*#__PURE__*/React.createElement(Divider, {
     orientation: "vertical",
     flexItem: true,
@@ -126,38 +191,6 @@ var EditorToolbar = function EditorToolbar(_ref) {
     editor: editor
   }), /*#__PURE__*/React.createElement(EditorFontSize, {
     editor: editor
-  }), /*#__PURE__*/React.createElement(EditorListSelect, {
-    editor: editor
-  }), /*#__PURE__*/React.createElement(EditorAlignSelect, {
-    editor: editor
-  }), /*#__PURE__*/React.createElement(EditorVerticalAlignSelect, {
-    editor: editor
-  }), /*#__PURE__*/React.createElement(ToolbarItem, {
-    tip: '引用块',
-    shortcutKey: ['ctrl', 'shift', 'B'],
-    icon: /*#__PURE__*/React.createElement(DoubleQuotesLIcon, {
-      sx: {
-        fontSize: '1rem'
-      }
-    }),
-    onClick: function onClick() {
-      return editor.chain().focus().toggleBlockquote().run();
-    },
-    className: active.quote ? 'tool-active' : ''
-  }), /*#__PURE__*/React.createElement(ToolbarItem, {
-    tip: '警告提示',
-    icon: /*#__PURE__*/React.createElement(Information2LineIcon, {
-      sx: {
-        fontSize: '1rem'
-      }
-    }),
-    onClick: function onClick() {
-      return editor.chain().focus().toggleAlert({
-        type: 'icon',
-        variant: 'info'
-      }).run();
-    },
-    className: active.alert ? 'tool-active' : ''
   }), /*#__PURE__*/React.createElement(Divider, {
     orientation: "vertical",
     flexItem: true,
@@ -214,16 +247,30 @@ var EditorToolbar = function EditorToolbar(_ref) {
       return editor.chain().focus().toggleUnderline().run();
     },
     className: active.underline ? 'tool-active' : ''
-  }), /*#__PURE__*/React.createElement(Divider, {
-    orientation: "vertical",
-    flexItem: true,
-    sx: {
-      mx: 0.5,
-      height: 20,
-      alignSelf: 'center'
-    }
-  }), /*#__PURE__*/React.createElement(EditorScript, {
-    editor: editor
+  }), /*#__PURE__*/React.createElement(ToolbarItem, {
+    tip: '上标',
+    shortcutKey: ['ctrl', '.'],
+    icon: /*#__PURE__*/React.createElement(SuperscriptIcon, {
+      sx: {
+        fontSize: '1rem'
+      }
+    }),
+    onClick: function onClick() {
+      return editor.chain().focus().toggleSuperscript().run();
+    },
+    className: active.superscript ? 'tool-active' : ''
+  }), /*#__PURE__*/React.createElement(ToolbarItem, {
+    tip: '下标',
+    shortcutKey: ['ctrl', ','],
+    icon: /*#__PURE__*/React.createElement(SubscriptIcon, {
+      sx: {
+        fontSize: '1rem'
+      }
+    }),
+    onClick: function onClick() {
+      return editor.chain().focus().toggleSubscript().run();
+    },
+    className: active.subscript ? 'tool-active' : ''
   }), /*#__PURE__*/React.createElement(EditorFontColor, {
     editor: editor
   }), /*#__PURE__*/React.createElement(EditorFontBgColor, {
@@ -236,6 +283,8 @@ var EditorToolbar = function EditorToolbar(_ref) {
       height: 20,
       alignSelf: 'center'
     }
+  }), /*#__PURE__*/React.createElement(EditorListSelect, {
+    editor: editor
   }), /*#__PURE__*/React.createElement(ToolbarItem, {
     tip: '链接',
     shortcutKey: ['ctrl', '1'],
@@ -255,59 +304,10 @@ var EditorToolbar = function EditorToolbar(_ref) {
       }).run();
     },
     className: active.link ? 'tool-active' : ''
-  }), /*#__PURE__*/React.createElement(ToolbarItem, {
-    tip: '折叠块',
-    shortcutKey: ['ctrl', '8'],
-    icon: /*#__PURE__*/React.createElement(MenuFold2FillIcon, {
-      sx: {
-        fontSize: '1rem'
-      }
-    }),
-    onClick: function onClick() {
-      if (!active.details) {
-        editor.chain().focus().setDetails().run();
-      } else {
-        editor.chain().focus().unsetDetails().run();
-      }
-    },
-    className: active.details ? 'tool-active' : ''
-  }), /*#__PURE__*/React.createElement(EditorCode, {
+  }), /*#__PURE__*/React.createElement(EditorAlignSelect, {
     editor: editor
-  }), /*#__PURE__*/React.createElement(EditorMath, {
+  }), /*#__PURE__*/React.createElement(EditorVerticalAlignSelect, {
     editor: editor
-  }), /*#__PURE__*/React.createElement(ToolbarItem, {
-    tip: '表格',
-    shortcutKey: ['ctrl', '9'],
-    icon: /*#__PURE__*/React.createElement(Table2Icon, {
-      sx: {
-        fontSize: '1rem'
-      }
-    }),
-    className: active.table ? 'tool-active' : '',
-    customComponent: /*#__PURE__*/React.createElement(TableSizePicker, {
-      onConfirm: function onConfirm(cols, rows) {
-        editor.chain().focus().insertTable({
-          rows: rows,
-          cols: cols,
-          withHeaderRow: true
-        }).run();
-      }
-    })
-  }), /*#__PURE__*/React.createElement(ToolbarItem, {
-    tip: 'iframe',
-    icon: /*#__PURE__*/React.createElement(WindowFillIcon, {
-      sx: {
-        fontSize: '1rem'
-      }
-    }),
-    onClick: function onClick() {
-      return editor.commands.setIframe({
-        src: '',
-        width: 760,
-        height: 400
-      });
-    },
-    className: active.iframe ? 'tool-active' : ''
   }), /*#__PURE__*/React.createElement(Divider, {
     orientation: "vertical",
     flexItem: true,
@@ -316,8 +316,6 @@ var EditorToolbar = function EditorToolbar(_ref) {
       height: 20,
       alignSelf: 'center'
     }
-  }), /*#__PURE__*/React.createElement(EditorInsert, {
-    editor: editor
   }), /*#__PURE__*/React.createElement(EditorMore, {
     more: menuInToolbarMore
   })));

package/dist/component/CustomDragHandle/index.js

@@ -17,7 +17,7 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 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; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-import { AddLineIcon, AlignBottomIcon, AlignCenterIcon, AlignJustifyIcon, AlignLeftIcon, AlignRightIcon, AlignTopIcon, ArrowDownSLineIcon, AttachmentLineIcon, BrushLineIcon, DeleteLineIcon, DownloadLineIcon, DraggableIcon, FontSizeIcon, FormatClearIcon, H1Icon, H2Icon, H3Icon, ImageLineIcon, IndentDecreaseIcon, IndentIncreaseIcon, Information2LineIcon, ListCheck3Icon, ListOrdered2Icon, ListUnorderedIcon, MovieLineIcon, Music2LineIcon, QuoteTextIcon, Repeat2LineIcon, ScissorsCutLineIcon, SeparatorIcon, TextIcon, TextWrapIcon } from "../Icons";
+import { AddLineIcon, AlignBottomIcon, AlignCenterIcon, AlignJustifyIcon, AlignLeftIcon, AlignRightIcon, AlignTopIcon, ArrowDownSLineIcon, AttachmentLineIcon, BrushLineIcon, DeleteLineIcon, DownloadLineIcon, DraggableIcon, EraserLineIcon, FileCopyLineIcon, FontSizeIcon, H1Icon, H2Icon, H3Icon, ImageLineIcon, IndentDecreaseIcon, IndentIncreaseIcon, Information2LineIcon, ListCheck3Icon, ListOrdered2Icon, ListUnorderedIcon, MovieLineIcon, Music2LineIcon, QuoteTextIcon, Repeat2LineIcon, ScissorsCutLineIcon, SeparatorIcon, TextIcon, TextWrapIcon } from "../Icons";
 import { NODE_TYPE_LABEL, NodeTypeEnum } from "../../contants/enums";
 import { Box, Divider, Stack, Typography, useTheme } from '@mui/material';
 import DragHandle from '@tiptap/extension-drag-handle-react';
@@ -25,7 +25,6 @@ import { Fragment, Slice } from '@tiptap/pm/model';
 import { NodeSelection } from '@tiptap/pm/state';
 import React, { useCallback, useState } from 'react';
 import { convertNodeAt, downloadFiles, filterResourcesByType, getAllResources } from "../../util";
-import { FileCopyLineIcon } from "../Icons/file-copy-line-icon";
 import Menu from "../Menu";
 import { ToolbarItem } from "../Toolbar";
 var DragIcon = function DragIcon(_ref) {
@@ -314,6 +313,7 @@ var CustomDragHandle = function CustomDragHandle(_ref3) {
       }
     }
   }), currentNode ? /*#__PURE__*/React.createElement(Menu, {
+    width: 224,
     context: /*#__PURE__*/React.createElement(DragIcon, null),
     anchorOrigin: {
       vertical: 'bottom',
@@ -569,6 +569,7 @@ var CustomDragHandle = function CustomDragHandle(_ref3) {
       key: 'color',
       label: '颜色',
       maxHeight: 400,
+      width: 160,
       icon: /*#__PURE__*/React.createElement(BrushLineIcon, {
         sx: {
           fontSize: '1rem'
@@ -654,6 +655,7 @@ var CustomDragHandle = function CustomDragHandle(_ref3) {
           fontSize: '1rem'
         }
       }),
+      width: 100,
       minWidth: 100,
       maxHeight: 200,
       children: _toConsumableArray([10, 12, 14, 16, 18, 20, 22, 24, 26, 28, 30, 32, 34, 36, 38, 40, 42, 44, 46, 48, 50, 52, 54, 56, 58, 60].map(function (it) {
@@ -678,6 +680,7 @@ var CustomDragHandle = function CustomDragHandle(_ref3) {
     }] : []), _toConsumableArray(currentNode !== null && currentNode !== void 0 && currentNode.align ? [{
       key: 'align',
       label: '对齐方式',
+      width: 160,
       icon: /*#__PURE__*/React.createElement(AlignLeftIcon, {
         sx: {
           fontSize: '1rem'
@@ -833,6 +836,7 @@ var CustomDragHandle = function CustomDragHandle(_ref3) {
     }] : []), _toConsumableArray(currentNode !== null && currentNode !== void 0 && currentNode.convert ? [{
       label: '转换',
       key: 'convert',
+      width: 160,
       maxHeight: 400,
       icon: /*#__PURE__*/React.createElement(Repeat2LineIcon, {
         sx: {
@@ -1361,7 +1365,7 @@ var CustomDragHandle = function CustomDragHandle(_ref3) {
     }] : []))), _toConsumableArray(more ? more : []), _toConsumableArray(showFormat ? [{
       label: '文本格式化',
       key: 'format',
-      icon: /*#__PURE__*/React.createElement(FormatClearIcon, {
+      icon: /*#__PURE__*/React.createElement(EraserLineIcon, {
         sx: {
           fontSize: '1rem'
         }

package/dist/component/Icons/add-circle-fill-icon.d.ts

@@ -0,0 +1,6 @@
+import { SvgIconProps } from "@mui/material";
+import * as React from "react";
+export declare const AddCircleFillIcon: {
+    (props: SvgIconProps): React.JSX.Element;
+    displayName: string;
+};

package/dist/component/Icons/add-circle-fill-icon.js

@@ -0,0 +1,13 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+import { SvgIcon } from "@mui/material";
+import * as React from "react";
+export var AddCircleFillIcon = function AddCircleFillIcon(props) {
+  return /*#__PURE__*/React.createElement(SvgIcon, _extends({
+    viewBox: "0 0 24 24",
+    version: "1.1",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    d: "M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM11 11H7V13H11V17H13V13H17V11H13V7H11V11Z"
+  }));
+};
+AddCircleFillIcon.displayName = 'icon-add-circle-fill';

package/dist/component/Icons/eraser-line-icon.d.ts

@@ -0,0 +1,6 @@
+import { SvgIconProps } from "@mui/material";
+import * as React from "react";
+export declare const EraserLineIcon: {
+    (props: SvgIconProps): React.JSX.Element;
+    displayName: string;
+};

package/dist/component/Icons/eraser-line-icon.js

@@ -0,0 +1,13 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+import { SvgIcon } from "@mui/material";
+import * as React from "react";
+export var EraserLineIcon = function EraserLineIcon(props) {
+  return /*#__PURE__*/React.createElement(SvgIcon, _extends({
+    viewBox: "0 0 24 24",
+    version: "1.1",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    d: "M8.58564 8.85449L3.63589 13.8042L8.83021 18.9985L9.99985 18.9978V18.9966H11.1714L14.9496 15.2184L8.58564 8.85449ZM9.99985 7.44027L16.3638 13.8042L19.1922 10.9758L12.8283 4.61185L9.99985 7.44027ZM13.9999 18.9966H20.9999V20.9966H11.9999L8.00229 20.9991L1.51457 14.5113C1.12405 14.1208 1.12405 13.4877 1.51457 13.0971L12.1212 2.49053C12.5117 2.1 13.1449 2.1 13.5354 2.49053L21.3136 10.2687C21.7041 10.6592 21.7041 11.2924 21.3136 11.6829L13.9999 18.9966Z"
+  }));
+};
+EraserLineIcon.displayName = 'icon-eraser-line';

package/dist/component/Icons/folder-2-line-icon.d.ts

@@ -0,0 +1,6 @@
+import { SvgIconProps } from "@mui/material";
+import * as React from "react";
+export declare const Folder2LineIcon: {
+    (props: SvgIconProps): React.JSX.Element;
+    displayName: string;
+};

package/dist/component/Icons/folder-2-line-icon.js

@@ -0,0 +1,13 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+import { SvgIcon } from "@mui/material";
+import * as React from "react";
+export var Folder2LineIcon = function Folder2LineIcon(props) {
+  return /*#__PURE__*/React.createElement(SvgIcon, _extends({
+    viewBox: "0 0 24 24",
+    version: "1.1",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    d: "M12.4142 5H21C21.5523 5 22 5.44772 22 6V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H10.4142L12.4142 5ZM20 11H4V19H20V11ZM20 9V7H11.5858L9.58579 5H4V9H20Z"
+  }));
+};
+Folder2LineIcon.displayName = 'icon-folder-2-line';

package/dist/component/Icons/index.d.ts

@@ -1,3 +1,4 @@
+export { AddCircleFillIcon } from './add-circle-fill-icon';
 export { AddLineIcon } from './add-line-icon';
 export { AiGenerate2Icon } from './ai-generate-2-icon';
 export { AiGenerateTextIcon } from './ai-generate-text-icon';
@@ -36,11 +37,13 @@ export { DoubleQuotesLIcon } from './double-quotes-l-icon';
 export { DownloadLineIcon } from './download-line-icon';
 export { DraggableIcon } from './draggable-icon';
 export { EditBoxLineIcon } from './edit-box-line-icon';
+export { EraserLineIcon } from './eraser-line-icon';
 export { ErrorWarningFillIcon } from './error-warning-fill-icon';
 export { ExportLineIcon } from './export-line-icon';
 export { FileCopyLineIcon } from './file-copy-line-icon';
 export { FileUploadLineIcon } from './file-upload-line-icon';
 export { FlowChartIcon } from './flow-chart-icon';
+export { Folder2LineIcon } from './folder-2-line-icon';
 export { FontColorIcon } from './font-color-icon';
 export { FontFamilyIcon } from './font-family-icon';
 export { FontSizeIcon } from './font-size-icon';

package/dist/component/Icons/index.js

@@ -1,6 +1,7 @@
 // 此文件由脚本自动生成
 // 导出所有图标组件
 
+export { AddCircleFillIcon } from "./add-circle-fill-icon";
 export { AddLineIcon } from "./add-line-icon";
 export { AiGenerate2Icon } from "./ai-generate-2-icon";
 export { AiGenerateTextIcon } from "./ai-generate-text-icon";
@@ -39,11 +40,13 @@ export { DoubleQuotesLIcon } from "./double-quotes-l-icon";
 export { DownloadLineIcon } from "./download-line-icon";
 export { DraggableIcon } from "./draggable-icon";
 export { EditBoxLineIcon } from "./edit-box-line-icon";
+export { EraserLineIcon } from "./eraser-line-icon";
 export { ErrorWarningFillIcon } from "./error-warning-fill-icon";
 export { ExportLineIcon } from "./export-line-icon";
 export { FileCopyLineIcon } from "./file-copy-line-icon";
 export { FileUploadLineIcon } from "./file-upload-line-icon";
 export { FlowChartIcon } from "./flow-chart-icon";
+export { Folder2LineIcon } from "./folder-2-line-icon";
 export { FontColorIcon } from "./font-color-icon";
 export { FontFamilyIcon } from "./font-family-icon";
 export { FontSizeIcon } from "./font-size-icon";

package/dist/component/Menu/NestedList.d.ts

@@ -3,6 +3,7 @@ import { PopoverOrigin } from '@mui/material';
 import React from 'react';
 export interface NestedMenuListProps {
     list: MenuItem[];
+    width?: number;
     arrowIcon?: React.ReactNode;
     childrenProps?: {
         anchorOrigin?: PopoverOrigin;

package/dist/component/Menu/NestedList.js

@@ -15,6 +15,7 @@ import { Box, Popover, Stack } from '@mui/material';
 import React from 'react';
 var NestedList = function NestedList(_ref) {
   var list = _ref.list,
+    width = _ref.width,
     arrowIcon = _ref.arrowIcon,
     _ref$childrenProps = _ref.childrenProps,
     childrenProps = _ref$childrenProps === void 0 ? {
@@ -58,6 +59,7 @@ var NestedList = function NestedList(_ref) {
     className: "menu-select-list",
     sx: {
       minWidth: 160,
+      width: width,
       lineHeight: 1.625
     }
   }, list.map(function (item) {
@@ -104,13 +106,16 @@ var NestedList = function NestedList(_ref) {
       }
     }, childrenProps), /*#__PURE__*/React.createElement(Box, {
       className: "menu-select-sub-list",
-      sx: _objectSpread(_objectSpread({
+      sx: _objectSpread(_objectSpread(_objectSpread({
         pointerEvents: 'auto',
         p: 0.5,
+        width: width,
         minWidth: 160,
         maxHeight: 360,
         overflow: 'auto'
-      }, item.minWidth ? {
+      }, item.width ? {
+        width: item.width
+      } : {}), item.minWidth ? {
         minWidth: item.minWidth
       } : {}), item.maxHeight ? {
         maxHeight: item.maxHeight

package/dist/component/Menu/index.js

@@ -10,6 +10,8 @@ import NestedList from "./NestedList";
 var Menu = function Menu(_ref) {
   var _ref$id = _ref.id,
     id = _ref$id === void 0 ? 'menu-select' : _ref$id,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? 160 : _ref$width,
     arrowIcon = _ref.arrowIcon,
     list = _ref.list,
     _ref$header = _ref.header,
@@ -75,6 +77,7 @@ var Menu = function Menu(_ref) {
   }, /*#__PURE__*/React.createElement(Box, {
     onClick: handleClose
   }, header), /*#__PURE__*/React.createElement(NestedList, {
+    width: width,
     list: list,
     arrowIcon: arrowIcon,
     childrenProps: childrenProps,