@lobehub/editor 1.22.0 → 1.23.0

package/es/editor-kernel/kernel.d.ts

@@ -1,3 +1,4 @@
+import { HistoryState } from '@lexical/history';
 import EventEmitter from 'eventemitter3';
 import { CommandListener, CommandListenerPriority, CommandPayloadType, DecoratorNode, LexicalCommand, LexicalEditor, LexicalNodeConfig } from 'lexical';
 import { HotkeyId } from "../types/hotkey";
@@ -17,8 +18,10 @@ export declare class Kernel extends EventEmitter implements IEditorKernel {
     private localeMap;
     private hotReloadMode;
     private logger;
+    private historyState;
     private editor?;
     constructor();
+    getHistoryState(): HistoryState;
     private detectDevelopmentMode;
     /**
      * Globally enable or disable hot reload mode for all kernel instances
@@ -33,6 +36,7 @@ export declare class Kernel extends EventEmitter implements IEditorKernel {
     destroy(): void;
     getRootElement(): HTMLElement | null;
     setRootElement(dom: HTMLElement): LexicalEditor;
+    initNodeEditor(): LexicalEditor;
     setDocument(type: string, content: any): void;
     focus(): void;
     blur(): void;

package/es/editor-kernel/kernel.js

@@ -19,6 +19,7 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g
 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; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
 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); }
+import { createEmptyHistoryState } from '@lexical/history';
 import EventEmitter from 'eventemitter3';
 import { $getSelection, $isRangeSelection, COMMAND_PRIORITY_CRITICAL, KEY_DOWN_COMMAND, createEditor } from 'lexical';
 import { get, merge, template, templateSettings } from 'lodash-es';
@@ -48,6 +49,7 @@ export var Kernel = /*#__PURE__*/function (_EventEmitter) {
     _defineProperty(_assertThisInitialized(_this), "localeMap", defaultLocale);
     _defineProperty(_assertThisInitialized(_this), "hotReloadMode", false);
     _defineProperty(_assertThisInitialized(_this), "logger", createDebugLogger('kernel'));
+    _defineProperty(_assertThisInitialized(_this), "historyState", createEmptyHistoryState());
     _defineProperty(_assertThisInitialized(_this), "editor", void 0);
     _defineProperty(_assertThisInitialized(_this), "_commands", new Map());
     _defineProperty(_assertThisInitialized(_this), "_commandsClean", new Map());
@@ -58,6 +60,11 @@ export var Kernel = /*#__PURE__*/function (_EventEmitter) {
     return _this;
   }
   _createClass(Kernel, [{
+    key: "getHistoryState",
+    value: function getHistoryState() {
+      return this.historyState;
+    }
+  }, {
     key: "detectDevelopmentMode",
     value: function detectDevelopmentMode() {
       var _process$env;
@@ -184,6 +191,50 @@ export var Kernel = /*#__PURE__*/function (_EventEmitter) {
       this.emit('initialized', editor);
       return this.editor;
     }
+  }, {
+    key: "initNodeEditor",
+    value: function initNodeEditor() {
+      var _this3 = this;
+      if (this.editor) {
+        return this.editor;
+      }
+      // Initialize plugins if not already done
+      if (this.pluginsInstances.length === 0) {
+        this.logger.info("\uD83D\uDD0C Initializing ".concat(this.plugins.length, " plugins"));
+        var _iterator2 = _createForOfIteratorHelper(this.plugins),
+          _step2;
+        try {
+          for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+            var plugin = _step2.value;
+            var instance = new plugin(this, plugin.__config);
+            this.pluginsInstances.push(instance);
+          }
+        } catch (err) {
+          _iterator2.e(err);
+        } finally {
+          _iterator2.f();
+        }
+      }
+      this.logger.info("\uD83D\uDCDD Creating editor with ".concat(this.nodes.length, " nodes"));
+      var editor = this.editor = createEditor({
+        // @ts-expect-error Inject into lexical editor instance
+        __kernel: this,
+        namespace: 'lobehub',
+        nodes: this.nodes,
+        onError: function onError(error) {
+          _this3.logger.error('❌ Lexical editor error:', error);
+          _this3.emit('error', error);
+        },
+        theme: this.themes
+      });
+      this.pluginsInstances.forEach(function (plugin) {
+        var _plugin$onInit2;
+        (_plugin$onInit2 = plugin.onInit) === null || _plugin$onInit2 === void 0 || _plugin$onInit2.call(plugin, editor);
+      });
+      this.logger.info("\u2705 Editor ready with ".concat(this.pluginsInstances.length, " plugins"));
+      this.emit('initialized', editor);
+      return editor || null;
+    }
   }, {
     key: "setDocument",
     value: function setDocument(type, content) {
@@ -339,18 +390,18 @@ export var Kernel = /*#__PURE__*/function (_EventEmitter) {
                 // Clean up decorators registered by the old plugin instance
                 if (oldInstance instanceof KernelPlugin) {
                   var decoratorNames = oldInstance.getRegisteredDecorators();
-                  var _iterator2 = _createForOfIteratorHelper(decoratorNames),
-                    _step2;
+                  var _iterator3 = _createForOfIteratorHelper(decoratorNames),
+                    _step3;
                   try {
-                    for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
-                      var decoratorName = _step2.value;
+                    for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+                      var decoratorName = _step3.value;
                       this.unregisterDecorator(decoratorName);
                       this.logger.debug("\uD83E\uDDE8 Cleanup: decorator \"".concat(decoratorName, "\""));
                     }
                   } catch (err) {
-                    _iterator2.e(err);
+                    _iterator3.e(err);
                   } finally {
-                    _iterator2.f();
+                    _iterator3.f();
                   }
                 }
                 if (oldInstance.destroy) {
@@ -381,11 +432,11 @@ export var Kernel = /*#__PURE__*/function (_EventEmitter) {
   }, {
     key: "registerPlugins",
     value: function registerPlugins(plugins) {
-      var _iterator3 = _createForOfIteratorHelper(plugins),
-        _step3;
+      var _iterator4 = _createForOfIteratorHelper(plugins),
+        _step4;
       try {
-        for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
-          var plugin = _step3.value;
+        for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
+          var plugin = _step4.value;
           if (Array.isArray(plugin)) {
             this.registerPlugin(plugin[0], plugin[1]);
           } else {
@@ -393,9 +444,9 @@ export var Kernel = /*#__PURE__*/function (_EventEmitter) {
           }
         }
       } catch (err) {
-        _iterator3.e(err);
+        _iterator4.e(err);
       } finally {
-        _iterator3.f();
+        _iterator4.f();
       }
       this.logger.debug("\uD83D\uDD0C Registered ".concat(plugins.length, " plugins"));
       return this;
@@ -532,12 +583,12 @@ export var Kernel = /*#__PURE__*/function (_EventEmitter) {
   }, {
     key: "isEmpty",
     get: function get() {
-      var _this3 = this;
+      var _this4 = this;
       if (!this.editor) {
         return true;
       }
       return this.editor.getEditorState().read(function () {
-        return $isRootTextContentEmpty(_this3.editor.isComposing(), true);
+        return $isRootTextContentEmpty(_this4.editor.isComposing(), true);
       });
     }
   }, {
@@ -580,7 +631,7 @@ export var Kernel = /*#__PURE__*/function (_EventEmitter) {
   }, {
     key: "registerHighCommand",
     value: function registerHighCommand(command, listener, priority) {
-      var _this4 = this;
+      var _this5 = this;
       var lexicalEditor = this.editor;
       if (!lexicalEditor) {
         throw new Error('Editor is not initialized.');
@@ -591,22 +642,22 @@ export var Kernel = /*#__PURE__*/function (_EventEmitter) {
         commandsMap.set(command, [new Set(), new Set(), new Set(), new Set(), new Set()]);
         this._commandsClean.set(command, lexicalEditor.registerCommand(command, function (payload) {
           for (var i = 4; i >= 0; i--) {
-            var listenerInPriorityOrder = _this4._commands.get(command);
+            var listenerInPriorityOrder = _this5._commands.get(command);
             if (listenerInPriorityOrder !== undefined) {
               var listenersSet = listenerInPriorityOrder[i];
-              var _iterator4 = _createForOfIteratorHelper(listenersSet),
-                _step4;
+              var _iterator5 = _createForOfIteratorHelper(listenersSet),
+                _step5;
               try {
-                for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
-                  var _listener = _step4.value;
+                for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
+                  var _listener = _step5.value;
                   if (_listener(payload, lexicalEditor)) {
                     return true;
                   }
                 }
               } catch (err) {
-                _iterator4.e(err);
+                _iterator5.e(err);
               } finally {
-                _iterator4.f();
+                _iterator5.f();
               }
             }
           }
@@ -628,9 +679,9 @@ export var Kernel = /*#__PURE__*/function (_EventEmitter) {
         if (listenersInPriorityOrder.every(function (listenersSet) {
           return listenersSet.size === 0;
         })) {
-          var _this4$_commandsClean;
+          var _this5$_commandsClean;
           commandsMap.delete(command);
-          (_this4$_commandsClean = _this4._commandsClean.get(command)) === null || _this4$_commandsClean === void 0 || _this4$_commandsClean();
+          (_this5$_commandsClean = _this5._commandsClean.get(command)) === null || _this5$_commandsClean === void 0 || _this5$_commandsClean();
         }
       };
     }

package/es/plugins/common/plugin/index.js

@@ -22,8 +22,9 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key i
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
 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); }
 import { registerDragonSupport } from '@lexical/dragon';
-import { createEmptyHistoryState, registerHistory } from '@lexical/history';
+import { registerHistory } from '@lexical/history';
 import { $createHeadingNode, $createQuoteNode, $isHeadingNode, $isQuoteNode, HeadingNode, QuoteNode, registerRichText } from '@lexical/rich-text';
+import { CAN_USE_DOM } from '@lexical/utils';
 import { $createLineBreakNode, $createParagraphNode, $getSelection, $isRangeSelection, $isTextNode, COMMAND_PRIORITY_HIGH, INSERT_LINE_BREAK_COMMAND, INSERT_PARAGRAPH_COMMAND } from 'lexical';
 import { KernelPlugin } from "../../../editor-kernel/plugin";
 import { IMarkdownShortCutService } from "../../markdown/service/shortcut";
@@ -322,7 +323,7 @@ export var CommonPlugin = (_class = /*#__PURE__*/function (_KernelPlugin) {
     key: "onInit",
     value: function onInit(editor) {
       var _this$config2;
-      this.registerClears(registerRichText(editor), registerDragonSupport(editor), registerHistory(editor, createEmptyHistoryState(), 300), registerHeaderBackspace(editor), registerRichKeydown(editor, this.kernel, {
+      this.registerClears(registerRichText(editor), CAN_USE_DOM ? registerDragonSupport(editor) : function () {}, registerHistory(editor, this.kernel.getHistoryState(), 300), registerHeaderBackspace(editor), registerRichKeydown(editor, this.kernel, {
         enableHotkey: (_this$config2 = this.config) === null || _this$config2 === void 0 ? void 0 : _this$config2.enableHotkey
       }), registerCommands(editor), registerBreakLineClick(editor), registerCursorNode(editor), registerLastElement(editor),
       // Convert soft line breaks (Shift+Enter) to hard line breaks (paragraph breaks)

package/es/plugins/common/react/Placeholder/index.d.ts

@@ -1,6 +1,7 @@
 import { type CSSProperties, type ReactNode } from 'react';
 export interface PlaceholderProps {
     children: ReactNode;
+    lineEmptyPlaceholder?: string;
     style?: CSSProperties;
 }
 declare const Placeholder: import("react").NamedExoticComponent<PlaceholderProps>;

package/es/plugins/common/react/Placeholder/index.js

@@ -5,7 +5,8 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 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 { mergeRegister } from '@lexical/utils';
-import { memo, useState } from 'react';
+import { $getNodeByKey, $getSelection, $isBlockElementNode, $isRangeSelection } from 'lexical';
+import { memo, useRef, useState } from 'react';
 import { useLexicalEditor } from "../../../../editor-kernel/react";
 import { $canShowPlaceholderCurry } from "../../utils";
 import { useStyles } from "./style";
@@ -14,9 +15,17 @@ function canShowPlaceholderFromCurrentEditorState(editor) {
   var currentCanShowPlaceholder = editor.getEditorState().read($canShowPlaceholderCurry(editor.isComposing()));
   return currentCanShowPlaceholder;
 }
+
+// 判断 DOM 是否只有一个 br 子元素
+function hasOnlyBrChild(element) {
+  var children = element.childNodes;
+  return children.length === 1 && children[0].nodeType === Node.ELEMENT_NODE && children[0].tagName.toLowerCase() === 'br';
+}
 var Placeholder = /*#__PURE__*/memo(function (_ref) {
   var children = _ref.children,
-    style = _ref.style;
+    style = _ref.style,
+    lineEmptyPlaceholder = _ref.lineEmptyPlaceholder;
+  var currentPlaceHolderRef = useRef(null);
   var _useState = useState(function () {
       return false;
     }),
@@ -32,10 +41,38 @@ var Placeholder = /*#__PURE__*/memo(function (_ref) {
     function resetCanShowPlaceholder() {
       var currentCanShowPlaceholder = canShowPlaceholderFromCurrentEditorState(editor);
       setCanShowPlaceholder(currentCanShowPlaceholder);
+      return currentCanShowPlaceholder;
     }
     resetCanShowPlaceholder();
     return mergeRegister(editor.registerUpdateListener(function () {
-      resetCanShowPlaceholder();
+      var show = resetCanShowPlaceholder();
+      if (!show && lineEmptyPlaceholder) {
+        editor.read(function () {
+          var sel = $getSelection();
+          if ($isRangeSelection(sel) && sel.isCollapsed()) {
+            var anchor = sel.anchor;
+            var node = $getNodeByKey(anchor.key);
+            while (node && !$isBlockElementNode(node)) {
+              node = node.getParent();
+            }
+            if (node) {
+              var dom = editor.getElementByKey(node.getKey());
+              if (dom && hasOnlyBrChild(dom)) {
+                if (currentPlaceHolderRef.current && currentPlaceHolderRef.current !== dom) {
+                  currentPlaceHolderRef.current.dataset.placeholder = '';
+                }
+                currentPlaceHolderRef.current = dom;
+                dom.dataset.placeholder = lineEmptyPlaceholder;
+                return;
+              }
+            }
+            if (currentPlaceHolderRef.current) {
+              currentPlaceHolderRef.current.dataset.placeholder = '';
+              currentPlaceHolderRef.current = null;
+            }
+          }
+        });
+      }
     }), editor.registerEditableListener(function () {
       resetCanShowPlaceholder();
     }));

package/es/plugins/common/react/ReactPlainText.js

@@ -82,7 +82,8 @@ var ReactPlainText = /*#__PURE__*/memo(function (_ref) {
     _Children$only$props = _Children$only.props,
     type = _Children$only$props.type,
     content = _Children$only$props.content,
-    placeholder = _Children$only$props.placeholder;
+    placeholder = _Children$only$props.placeholder,
+    lineEmptyPlaceholder = _Children$only$props.lineEmptyPlaceholder;
   useLayoutEffect(function () {
     editor.registerPlugin(MarkdownPlugin, {
       enablePasteMarkdown: enablePasteMarkdown
@@ -202,6 +203,7 @@ var ReactPlainText = /*#__PURE__*/memo(function (_ref) {
         outline: 'none'
       }
     }), /*#__PURE__*/_jsx(Placeholder, {
+      lineEmptyPlaceholder: lineEmptyPlaceholder,
       style: style,
       children: placeholder
     }), decorators]

package/es/plugins/common/react/style.js

@@ -28,7 +28,7 @@ export var useStyles = createStyles(function (_ref2, _ref3) {
     marginMultiple = _ref3$marginMultiple === void 0 ? 2 : _ref3$marginMultiple,
     _ref3$lineHeight = _ref3.lineHeight,
     lineHeight = _ref3$lineHeight === void 0 ? 1.8 : _ref3$lineHeight;
-  var __root = css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n      --lobe-markdown-font-size: ", "px;\n      --lobe-markdown-header-multiple: ", ";\n      --lobe-markdown-margin-multiple: ", ";\n      --lobe-markdown-line-height: ", ";\n      --lobe-markdown-border-radius: ", ";\n      --lobe-markdown-border-color: ", ";\n\n      position: relative;\n\n      display: flex;\n      flex-direction: column;\n\n      width: 100%;\n      max-width: 100%;\n      height: 100%;\n\n      font-size: var(--lobe-markdown-font-size);\n      line-height: var(--lobe-markdown-line-height);\n      word-break: break-word;\n\n      @keyframes cursor-blink {\n        to {\n          visibility: hidden;\n        }\n      }\n\n      [data-lexical-cursor='true'] {\n        pointer-events: none;\n        position: absolute;\n        display: block;\n\n        &::after {\n          content: '';\n\n          position: absolute;\n          inset-block-start: -2px;\n\n          display: block;\n\n          width: 20px;\n          border-block-start: 1px solid ", ";\n\n          animation: cursor-blink 1.1s steps(2, start) infinite;\n        }\n      }\n    "])), fontSize, headerMultiple, marginMultiple, lineHeight, token.borderRadiusLG, token.colorFillQuaternary, token.colorText);
+  var __root = css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n      --lobe-markdown-font-size: ", "px;\n      --lobe-markdown-header-multiple: ", ";\n      --lobe-markdown-margin-multiple: ", ";\n      --lobe-markdown-line-height: ", ";\n      --lobe-markdown-border-radius: ", ";\n      --lobe-markdown-border-color: ", ";\n\n      position: relative;\n\n      display: flex;\n      flex-direction: column;\n\n      width: 100%;\n      max-width: 100%;\n      height: 100%;\n\n      font-size: var(--lobe-markdown-font-size);\n      line-height: var(--lobe-markdown-line-height);\n      word-break: break-word;\n\n      @keyframes cursor-blink {\n        to {\n          visibility: hidden;\n        }\n      }\n\n      [data-placeholder] {\n        position: relative;\n      }\n\n      [data-placeholder]::after {\n        pointer-events: none;\n        content: attr(data-placeholder);\n        user-select: none;\n        user-select: none;\n        user-select: none;\n\n        position: absolute;\n        inset-block-start: 50%;\n        transform: translateY(-50%);\n\n        padding-inline-start: 2px;\n\n        color: ", ";\n        white-space: nowrap;\n      }\n\n      [data-lexical-cursor='true'] {\n        pointer-events: none;\n        position: absolute;\n        display: block;\n\n        &::after {\n          content: '';\n\n          position: absolute;\n          inset-block-start: -2px;\n\n          display: block;\n\n          width: 20px;\n          border-block-start: 1px solid ", ";\n\n          animation: cursor-blink 1.1s steps(2, start) infinite;\n        }\n      }\n    "])), fontSize, headerMultiple, marginMultiple, lineHeight, token.borderRadiusLG, token.colorFillQuaternary, token.colorTextDescription, token.colorText);
   var header = css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n      h1,\n      h2,\n      h3,\n      h4,\n      h5,\n      h6 {\n        margin-block: max(\n          calc(var(--lobe-markdown-header-multiple) * var(--lobe-markdown-margin-multiple) * 0.4em),\n          var(--lobe-markdown-font-size)\n        );\n        font-weight: bold;\n        line-height: 1.25;\n      }\n\n      h1 {\n        font-size: calc(\n          var(--lobe-markdown-font-size) * (1 + 1.5 * var(--lobe-markdown-header-multiple))\n        );\n      }\n\n      h2 {\n        font-size: calc(\n          var(--lobe-markdown-font-size) * (1 + var(--lobe-markdown-header-multiple))\n        );\n      }\n\n      h3 {\n        font-size: calc(\n          var(--lobe-markdown-font-size) * (1 + 0.5 * var(--lobe-markdown-header-multiple))\n        );\n      }\n\n      h4 {\n        font-size: calc(\n          var(--lobe-markdown-font-size) * (1 + 0.25 * var(--lobe-markdown-header-multiple))\n        );\n      }\n\n      h5,\n      h6 {\n        font-size: calc(var(--lobe-markdown-font-size) * 1);\n      }\n    "])));
   var p = css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n      p {\n        margin-block: 4px;\n        line-height: var(--lobe-markdown-line-height);\n        letter-spacing: 0.02em;\n\n        &:not(:first-child) {\n          margin-block-start: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n        }\n\n        &:not(:last-child) {\n          margin-block-end: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n        }\n      }\n    "])));
   var blockquote = css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n      .editor_quote {\n        margin-block: calc(var(--lobe-markdown-margin-multiple) * 0.5em);\n        margin-inline: 0;\n        padding-block: 0;\n        padding-inline: 1em;\n        border-inline-start: solid 4px ", ";\n\n        color: ", ";\n      }\n    "])), token.colorBorder, token.colorTextSecondary);

package/es/plugins/common/react/type.d.ts

@@ -3,6 +3,7 @@ import type { CommonPluginOptions } from "..";
 import type { IEditor } from "../../../types";
 export interface ReactEditorContentProps {
     content: any;
+    lineEmptyPlaceholder?: string;
     placeholder?: ReactNode;
     type: string;
 }

package/es/plugins/markdown/command/index.d.ts

@@ -1,6 +1,8 @@
+import { HistoryState, HistoryStateEntry } from '@lexical/history';
 import { LexicalEditor } from 'lexical';
 import { MarkdownShortCutService } from '../service/shortcut';
 export declare const INSERT_MARKDOWN_COMMAND: import("lexical").LexicalCommand<{
+    historyState: HistoryStateEntry | null;
     markdown: string;
 }>;
-export declare function registerMarkdownCommand(editor: LexicalEditor, service: MarkdownShortCutService): () => void;
+export declare function registerMarkdownCommand(editor: LexicalEditor, service: MarkdownShortCutService, history: HistoryState): () => void;

package/es/plugins/markdown/command/index.js

@@ -1,25 +1,43 @@
-import { $getSelection, COMMAND_PRIORITY_HIGH, createCommand } from 'lexical';
+import { $getSelection, CAN_UNDO_COMMAND, COMMAND_PRIORITY_HIGH, HISTORIC_TAG, createCommand } from 'lexical';
 import { createDebugLogger } from "../../../utils/debug";
 import { parseMarkdownToLexical } from "../data-source/markdown/parse";
 import { $generateNodesFromSerializedNodes, $insertGeneratedNodes } from "../utils";
 var logger = createDebugLogger('plugin', 'markdown');
 export var INSERT_MARKDOWN_COMMAND = createCommand('INSERT_MARKDOWN_COMMAND');
-export function registerMarkdownCommand(editor, service) {
+function undoToEntry(editor, historyState, entry) {
+  var undoStack = historyState.undoStack;
+  var current = historyState.current;
+  if (current) {
+    undoStack.push(current);
+    editor.dispatchCommand(CAN_UNDO_COMMAND, false);
+  }
+  historyState.current = entry || null;
+  if (entry) {
+    editor.setEditorState(entry.editorState, {
+      tag: HISTORIC_TAG
+    });
+  }
+  return editor.getEditorState();
+}
+export function registerMarkdownCommand(editor, service, history) {
   return editor.registerCommand(INSERT_MARKDOWN_COMMAND, function (payload) {
     var markdown = payload.markdown;
     logger.debug('INSERT_MARKDOWN_COMMAND payload:', payload);
-    editor.update(function () {
-      try {
-        // Use the markdown data source to parse the content
-        var root = parseMarkdownToLexical(markdown, service.markdownReaders);
-        var selection = $getSelection();
-        var nodes = $generateNodesFromSerializedNodes(root.children);
-        logger.debug('INSERT_MARKDOWN_COMMAND nodes:', nodes);
-        $insertGeneratedNodes(editor, nodes, selection);
-        return true;
-      } catch (error) {
-        logger.error('Failed to handle markdown paste:', error);
-      }
+    undoToEntry(editor, history, payload.historyState);
+    queueMicrotask(function () {
+      editor.update(function () {
+        try {
+          // Use the markdown data source to parse the content
+          var root = parseMarkdownToLexical(markdown, service.markdownReaders);
+          var selection = $getSelection();
+          var nodes = $generateNodesFromSerializedNodes(root.children);
+          logger.debug('INSERT_MARKDOWN_COMMAND nodes:', nodes);
+          $insertGeneratedNodes(editor, nodes, selection);
+          return true;
+        } catch (error) {
+          logger.error('Failed to handle markdown paste:', error);
+        }
+      });
     });
     return false;
   }, COMMAND_PRIORITY_HIGH // Priority

package/es/plugins/markdown/plugin/index.js

@@ -144,9 +144,11 @@ export var MarkdownPlugin = (_class = /*#__PURE__*/function (_KernelPlugin) {
         if (hasMarkdownContent) {
           // Markdown detected - show confirmation dialog
           _this2.logger.debug('markdown patterns detected:', _this2.getMarkdownPatterns(text));
+          var historyState = _this2.kernel.getHistoryState().current;
           setTimeout(function () {
             _this2.kernel.emit('markdownParse', {
               cacheState: editor.getEditorState(),
+              historyState: historyState,
               markdown: text
             });
           }, 10);
@@ -156,7 +158,7 @@ export var MarkdownPlugin = (_class = /*#__PURE__*/function (_KernelPlugin) {
         }
         return false;
       }, COMMAND_PRIORITY_CRITICAL));
-      this.register(registerMarkdownCommand(editor, this.service));
+      this.register(registerMarkdownCommand(editor, this.service, this.kernel.getHistoryState()));
     }
 
     /**

package/es/plugins/markdown/react/index.js

@@ -8,7 +8,6 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { Button } from '@lobehub/ui';
 import { Space, notification } from 'antd';
-import { UNDO_COMMAND } from 'lexical';
 import { useLayoutEffect } from 'react';
 import { useLexicalComposerContext } from "../../../editor-kernel/react";
 import { useTranslation } from "../../../editor-kernel/react/useTranslation";
@@ -28,7 +27,8 @@ var ReactMarkdownPlugin = function ReactMarkdownPlugin() {
   useLayoutEffect(function () {
     editor.registerPlugin(MarkdownPlugin);
     var handleEvent = function handleEvent(_ref) {
-      var markdown = _ref.markdown;
+      var markdown = _ref.markdown,
+        historyState = _ref.historyState;
       var key = "open".concat(Date.now());
       var actions = /*#__PURE__*/_jsxs(Space, {
         children: [/*#__PURE__*/_jsx(Button, {
@@ -39,8 +39,8 @@ var ReactMarkdownPlugin = function ReactMarkdownPlugin() {
           children: t('markdown.cancel')
         }), /*#__PURE__*/_jsx(Button, {
           onClick: function onClick() {
-            editor.dispatchCommand(UNDO_COMMAND, undefined);
             editor.dispatchCommand(INSERT_MARKDOWN_COMMAND, {
+              historyState: historyState,
               markdown: markdown
             });
             api.destroy();

package/es/react/Editor/Editor.js

@@ -32,6 +32,7 @@ var Editor = /*#__PURE__*/memo(function (_ref) {
     onInit = _ref.onInit,
     onChange = _ref.onChange,
     placeholder = _ref.placeholder,
+    lineEmptyPlaceholder = _ref.lineEmptyPlaceholder,
     _ref$plugins = _ref.plugins,
     plugins = _ref$plugins === void 0 ? [] : _ref$plugins,
     _ref$slashOption = _ref.slashOption,
@@ -113,6 +114,7 @@ var Editor = /*#__PURE__*/memo(function (_ref) {
       variant: variant,
       children: /*#__PURE__*/_jsx(ReactEditorContent, {
         content: content,
+        lineEmptyPlaceholder: lineEmptyPlaceholder,
         placeholder: placeholder,
         type: type
       })

package/es/types/kernel.d.ts

@@ -1,8 +1,9 @@
+import type { HistoryState, HistoryStateEntry } from '@lexical/history';
 import type { CommandListener, CommandListenerPriority, CommandPayloadType, DecoratorNode, EditorState, LexicalCommand, LexicalEditor, LexicalNodeConfig } from 'lexical';
 import type DataSource from "../editor-kernel/data-source";
-import { HotkeyId } from "./hotkey";
-import { HotkeyOptions, HotkeysEvent } from "../utils/hotkey/registerHotkey";
-import { ILocaleKeys } from './locale';
+import type { HotkeyId } from "./hotkey";
+import type { HotkeyOptions, HotkeysEvent } from "../utils/hotkey/registerHotkey";
+import type { ILocaleKeys } from './locale';
 export type Commands = Map<LexicalCommand<unknown>, Array<Set<CommandListener<unknown>>>>;
 export type CommandsClean = Map<LexicalCommand<unknown>, () => void>;
 /**
@@ -28,6 +29,7 @@ export interface IKernelEventMap {
      */
     markdownParse: (params: {
         cacheState: EditorState;
+        historyState: HistoryStateEntry | null;
         markdown: string;
     }) => void;
 }
@@ -78,6 +80,10 @@ export interface IEditor {
      * Get editor theme
      */
     getTheme(): Record<string, string | Record<string, string>>;
+    /**
+     * Get node editor instance
+     */
+    initNodeEditor(): LexicalEditor | null;
     /**
      * Check if editor content is empty
      * @returns true if editor content is empty, false otherwise
@@ -188,6 +194,10 @@ export interface IEditorKernel extends IEditor {
      * @param name
      */
     getDecorator(name: string): ((_node: DecoratorNode<any>, _editor: LexicalEditor) => any) | undefined;
+    /**
+     * Get editor history state
+     */
+    getHistoryState(): HistoryState;
     /**
      * Get all registered decorator names
      */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/editor",
-  "version": "1.22.0",
+  "version": "1.23.0",
   "description": "A powerful and extensible rich text editor built on Meta's Lexical framework, providing a modern editing experience with React integration.",
   "keywords": [
     "lobehub",
@@ -27,38 +27,38 @@
     "react.js"
   ],
   "dependencies": {
-    "@floating-ui/dom": "^1.7.3",
-    "@floating-ui/react": "^0.27.15",
-    "@lexical/code": "^0.34.0",
-    "@lexical/code-shiki": "^0.34.0",
-    "@lexical/dragon": "^0.34.0",
-    "@lexical/history": "^0.34.0",
-    "@lexical/link": "^0.34.0",
-    "@lexical/list": "^0.34.0",
-    "@lexical/rich-text": "^0.34.0",
-    "@lexical/selection": "^0.34.0",
-    "@lexical/table": "^0.34.0",
-    "@lexical/utils": "^0.34.0",
-    "@shikijs/core": "^3.9.2",
-    "@shikijs/engine-javascript": "^3.9.2",
-    "ahooks": "^3.9.3",
+    "@floating-ui/dom": "^1.7.4",
+    "@floating-ui/react": "^0.27.16",
+    "@lexical/code": "^0.38.2",
+    "@lexical/code-shiki": "^0.38.2",
+    "@lexical/dragon": "^0.38.2",
+    "@lexical/history": "^0.38.2",
+    "@lexical/link": "^0.38.2",
+    "@lexical/list": "^0.38.2",
+    "@lexical/rich-text": "^0.38.2",
+    "@lexical/selection": "^0.38.2",
+    "@lexical/table": "^0.38.2",
+    "@lexical/utils": "^0.38.2",
+    "@shikijs/core": "^3.15.0",
+    "@shikijs/engine-javascript": "^3.15.0",
+    "ahooks": "^3.9.6",
     "antd-style": "^3.7.1",
-    "debug": "^4.4.1",
+    "debug": "^4.4.3",
     "eventemitter3": "^5.0.1",
-    "framer-motion": "^12.23.12",
+    "framer-motion": "^12.23.24",
     "fuse.js": "^7.1.0",
-    "katex": "^0.16.22",
-    "lexical": "^0.34.0",
+    "katex": "^0.16.25",
+    "lexical": "^0.38.2",
     "lodash-es": "^4.17.21",
-    "lucide-react": "^0.536.0",
+    "lucide-react": "^0.553.0",
     "polished": "^4.3.1",
     "re-resizable": "^6.11.2",
     "react-error-boundary": "^6.0.0",
     "react-layout-kit": "^2.0.0",
     "react-merge-refs": "^3.0.2",
-    "remark-cjk-friendly": "^1.2.1",
+    "remark-cjk-friendly": "^1.2.3",
     "remark-supersub": "^1.0.0",
-    "shiki": "^3.9.2",
+    "shiki": "^3.15.0",
     "ts-key-enum": "^3.0.13",
     "use-merge-value": "^1.2.0"
   },