@lobehub/editor 1.31.2 → 1.33.0

package/es/plugins/litexml/node/DiffNode.js

@@ -0,0 +1,164 @@
+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 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; }
+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; }
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+function _get() { if (typeof Reflect !== "undefined" && Reflect.get) { _get = Reflect.get.bind(); } else { _get = function _get(target, property, receiver) { var base = _superPropBase(target, property); if (!base) return; var desc = Object.getOwnPropertyDescriptor(base, property); if (desc.get) { return desc.get.call(arguments.length < 3 ? target : receiver); } return desc.value; }; } return _get.apply(this, arguments); }
+function _superPropBase(object, property) { while (!Object.prototype.hasOwnProperty.call(object, property)) { object = _getPrototypeOf(object); if (object === null) break; } return object; }
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+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); }
+/* eslint-disable @typescript-eslint/no-use-before-define */
+import { $applyNodeReplacement } from 'lexical';
+import { getKernelFromEditor, getKernelFromEditorConfig, reconcileDecorator } from "../../../editor-kernel/utils";
+import { CardLikeElementNode } from "../../common/node/cursor";
+/** DiffNode - contains two block children: original and modified */
+export var DiffNode = /*#__PURE__*/function (_CardLikeElementNode) {
+  _inherits(DiffNode, _CardLikeElementNode);
+  var _super = _createSuper(DiffNode);
+  function DiffNode(type, key) {
+    var _this;
+    _classCallCheck(this, DiffNode);
+    _this = _super.call(this, key);
+    _defineProperty(_assertThisInitialized(_this), "__diffType", 'unchanged');
+    _this.__diffType = type;
+    return _this;
+  }
+  _createClass(DiffNode, [{
+    key: "diffType",
+    get: function get() {
+      return this.__diffType;
+    }
+  }, {
+    key: "setDiffType",
+    value: function setDiffType(type) {
+      this.getWritable().__diffType = type;
+      return this;
+    }
+  }, {
+    key: "updateFromJSON",
+    value: function updateFromJSON(serializedNode) {
+      return _get(_getPrototypeOf(DiffNode.prototype), "updateFromJSON", this).call(this, serializedNode).setDiffType(serializedNode.diffType);
+    }
+  }, {
+    key: "exportJSON",
+    value: function exportJSON() {
+      return _objectSpread(_objectSpread({}, _get(_getPrototypeOf(DiffNode.prototype), "exportJSON", this).call(this)), {}, {
+        diffType: this.__diffType,
+        type: 'diff'
+      });
+    }
+  }, {
+    key: "exportDOM",
+    value: function exportDOM(editor) {
+      return _get(_getPrototypeOf(DiffNode.prototype), "exportDOM", this).call(this, editor);
+    }
+  }, {
+    key: "createDOM",
+    value: function createDOM(config, editor) {
+      var _getKernelFromEditor;
+      var el = document.createElement('div');
+      el.contentEditable = 'false';
+      el.dataset.lexicalKey = this.getKey();
+      el.dataset.diffType = this.__diffType;
+      el.classList.add('ne-diff');
+      if (config.theme.diffNode) {
+        el.classList.add(config.theme.diffNode);
+      }
+      var toolbar = document.createElement('div');
+      toolbar.className = 'toolbar';
+      toolbar.dataset.lexicalDecorator = 'true';
+      el.append(toolbar);
+      var content = document.createElement('div');
+      content.className = 'content';
+      el.append(content);
+      var decorator = ((_getKernelFromEditor = getKernelFromEditor(editor)) === null || _getKernelFromEditor === void 0 ? void 0 : _getKernelFromEditor.getDecorator('diff')) || null;
+      if (decorator) {
+        if (typeof decorator === 'function') {
+          reconcileDecorator(editor, this.getKey(), decorator(this, editor));
+        } else {
+          reconcileDecorator(editor, this.getKey(), {
+            queryDOM: decorator.queryDOM,
+            render: decorator.render(this, editor)
+          });
+        }
+      }
+      return el;
+    }
+  }, {
+    key: "updateDOM",
+    value: function updateDOM(_prevNode, _dom, _config) {
+      if (_dom.dataset.diffType !== this.__diffType) {
+        _dom.dataset.diffType = this.__diffType;
+      }
+      var kernel = getKernelFromEditorConfig(_config);
+      var editor = kernel === null || kernel === void 0 ? void 0 : kernel.getLexicalEditor();
+      if (editor) {
+        var decorator = (kernel === null || kernel === void 0 ? void 0 : kernel.getDecorator('diff')) || null;
+        if (decorator) {
+          if (typeof decorator === 'function') {
+            reconcileDecorator(editor, this.getKey(), decorator(this, editor));
+          } else {
+            reconcileDecorator(editor, this.getKey(), {
+              queryDOM: decorator.queryDOM,
+              render: decorator.render(this, editor)
+            });
+          }
+        }
+      }
+      return false;
+    }
+  }, {
+    key: "getDOMSlot",
+    value: function getDOMSlot(element) {
+      return _get(_getPrototypeOf(DiffNode.prototype), "getDOMSlot", this).call(this, element).withElement(element.querySelector('.content'));
+    }
+  }, {
+    key: "isInline",
+    value: function isInline() {
+      return false;
+    }
+  }, {
+    key: "isCardLike",
+    value: function isCardLike() {
+      return true;
+    }
+  }], [{
+    key: "getType",
+    value: function getType() {
+      return 'diff';
+    }
+  }, {
+    key: "clone",
+    value: function clone(node) {
+      return new DiffNode(node.__diffType, node.__key);
+    }
+  }, {
+    key: "importJSON",
+    value: function importJSON(serializedNode) {
+      return $createDiffNode().updateFromJSON(serializedNode);
+    }
+  }, {
+    key: "importDOM",
+    value: function importDOM() {
+      // TODO: Should link node should handle the import over autolink?
+      return null;
+    }
+  }]);
+  return DiffNode;
+}(CardLikeElementNode);
+export function $createDiffNode() {
+  var diffType = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'unchanged';
+  return $applyNodeReplacement(new DiffNode(diffType));
+}
+export function $isDiffNode(node) {
+  return node instanceof DiffNode;
+}

package/es/plugins/litexml/plugin/index.d.ts

@@ -1,13 +1,17 @@
+import { LexicalEditor } from 'lexical';
 import type { IEditorPluginConstructor } from "../../../types";
+import { DiffNode } from '../node/DiffNode';
 /**
  * LitexmlPluginOptions - Configuration options for the Litexml plugin
  */
 export interface LitexmlPluginOptions {
+    decorator: (node: DiffNode, editor: LexicalEditor) => any;
     /**
      * Enable or disable the litexml data source
      * @default true
      */
     enabled?: boolean;
+    theme?: string;
 }
 /**
  * LitexmlPlugin - A plugin that provides XML-based data source support

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

@@ -15,7 +15,9 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 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 { KernelPlugin } from "../../../editor-kernel/plugin";
 import { registerLiteXMLCommand } from "../command";
+import { registerLiteXMLDiffCommand } from "../command/diffCommand";
 import LitexmlDataSource from "../data-source/litexml-data-source";
+import { DiffNode } from "../node/DiffNode";
 import { ILitexmlService, LitexmlService } from "../service/litexml-service";
 
 /**
@@ -33,14 +35,30 @@ export var LitexmlPlugin = (_class = /*#__PURE__*/function (_KernelPlugin) {
     var _this;
     _classCallCheck(this, LitexmlPlugin);
     _this = _super.call(this);
-
-    // Create and register the Litexml service
     _defineProperty(_assertThisInitialized(_this), "datasource", void 0);
     _this.kernel = kernel;
     _this.config = config;
+    kernel.registerThemes({
+      diffNode: (config === null || config === void 0 ? void 0 : config.theme) || 'editor_diffNode'
+    });
+
+    // Create and register the Litexml service
     var litexmlService = new LitexmlService();
     kernel.registerService(ILitexmlService, litexmlService);
-    _this.datasource = new LitexmlDataSource('litexml', litexmlService);
+    _this.datasource = new LitexmlDataSource('litexml', function (serviceId) {
+      return kernel.requireService(serviceId);
+    }, litexmlService);
+
+    // register diff node type
+    kernel.registerNodes([DiffNode]);
+    kernel.registerDecorator(DiffNode.getType(), {
+      queryDOM: function queryDOM(el) {
+        return el.querySelector('.toolbar');
+      },
+      render: function render(node, editor) {
+        return config !== null && config !== void 0 && config.decorator ? config.decorator(node, editor) : null;
+      }
+    });
 
     // Register the litexml data source
     if ((config === null || config === void 0 ? void 0 : config.enabled) !== false) {
@@ -52,7 +70,8 @@ export var LitexmlPlugin = (_class = /*#__PURE__*/function (_KernelPlugin) {
     key: "onInit",
     value: function onInit(editor) {
       // Plugin initialization logic can be added here if needed
-      registerLiteXMLCommand(editor, this.datasource);
+      this.register(registerLiteXMLCommand(editor, this.datasource));
+      this.register(registerLiteXMLDiffCommand(editor));
     }
   }]);
   return LitexmlPlugin;

package/es/plugins/litexml/react/DiffNodeToolbar.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { LexicalEditor } from 'lexical';
+import { DiffNode } from '../node/DiffNode';
+interface ReactDiffNodeToolbarProps {
+    className?: string;
+    editor: LexicalEditor;
+    node: DiffNode;
+}
+declare const ReactDiffNodeToolbar: import("react").NamedExoticComponent<ReactDiffNodeToolbarProps>;
+export default ReactDiffNodeToolbar;

package/es/plugins/litexml/react/DiffNodeToolbar.js

@@ -0,0 +1,47 @@
+import { Check, X } from 'lucide-react';
+import { memo } from 'react';
+import { LexicalPortalContainer } from "../../../editor-kernel/react";
+import { DiffAction, LITEXML_DIFFNODE_COMMAND } from "../command/diffCommand";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var ReactDiffNodeToolbar = /*#__PURE__*/memo(function (_ref) {
+  var editor = _ref.editor,
+    node = _ref.node;
+  return /*#__PURE__*/_jsxs(LexicalPortalContainer, {
+    editor: editor,
+    node: node,
+    children: [/*#__PURE__*/_jsx("button", {
+      "aria-label": "Accept change",
+      className: "toolbarButton accept",
+      onClick: function onClick() {
+        console.log('Accept change');
+        editor.dispatchCommand(LITEXML_DIFFNODE_COMMAND, {
+          action: DiffAction.Accept,
+          nodeKey: node.getKey()
+        });
+      },
+      title: "Accept",
+      type: "button",
+      children: /*#__PURE__*/_jsx(Check, {
+        size: 16
+      })
+    }), /*#__PURE__*/_jsx("button", {
+      "aria-label": "Reject change",
+      className: "toolbarButton reject",
+      onClick: function onClick() {
+        console.log('Reject change');
+        editor.dispatchCommand(LITEXML_DIFFNODE_COMMAND, {
+          action: DiffAction.Reject,
+          nodeKey: node.getKey()
+        });
+      },
+      title: "Reject",
+      type: "button",
+      children: /*#__PURE__*/_jsx(X, {
+        size: 16
+      })
+    })]
+  });
+});
+ReactDiffNodeToolbar.displayName = 'ReactDiffNodeToolbar';
+export default ReactDiffNodeToolbar;

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

@@ -8,13 +8,28 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { useLayoutEffect } from 'react';
 import { useLexicalComposerContext } from "../../../editor-kernel/react";
+import { INodePlugin } from "../../inode";
 import { LitexmlPlugin } from "../plugin";
+import ReactDiffNodeToolbar from "./DiffNodeToolbar";
+import { useStyles } from "./style";
+import { jsx as _jsx } from "react/jsx-runtime";
 export var ReactLiteXmlPlugin = function ReactLiteXmlPlugin() {
   var _useLexicalComposerCo = useLexicalComposerContext(),
     _useLexicalComposerCo2 = _slicedToArray(_useLexicalComposerCo, 1),
     editor = _useLexicalComposerCo2[0];
+  var _useStyles = useStyles(),
+    styles = _useStyles.styles;
   useLayoutEffect(function () {
-    editor.registerPlugin(LitexmlPlugin);
+    editor.registerPlugin(INodePlugin);
+    editor.registerPlugin(LitexmlPlugin, {
+      decorator: function decorator(node, editor) {
+        return /*#__PURE__*/_jsx(ReactDiffNodeToolbar, {
+          editor: editor,
+          node: node
+        });
+      },
+      theme: styles
+    });
   }, [editor]);
   return null;
 };

package/es/plugins/litexml/react/style.d.ts

@@ -0,0 +1 @@
+export declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<import("antd-style").SerializedStyles>;

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

@@ -0,0 +1,8 @@
+var _templateObject;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+import { createStyles } from 'antd-style';
+export var useStyles = createStyles(function (_ref) {
+  var css = _ref.css,
+    token = _ref.token;
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    position: relative;\n    border: 1px solid ", ";\n\n    .toolbar {\n      position: absolute;\n      z-index: 10;\n      inset-block-start: 0;\n      inset-inline-end: 0;\n\n      display: flex;\n      gap: 4px;\n      align-items: center;\n\n      padding: 4px;\n      border: 1px solid #eee;\n      border-radius: 4px;\n\n      background: #fff;\n      box-shadow: 0 2px 4px rgba(0, 0, 0, 10%);\n    }\n\n    .toolbarButton {\n      cursor: pointer;\n\n      display: flex;\n      align-items: center;\n      justify-content: center;\n\n      padding: 2px;\n      border: none;\n\n      background: none;\n    }\n\n    .toolbarButton:focus {\n      border-radius: 3px;\n      outline: 2px solid ", ";\n      outline-offset: 2px;\n    }\n\n    .accept {\n      color: ", ";\n    }\n\n    .reject {\n      color: ", ";\n    }\n\n    &[data-diff-type='add'] .content {\n      position: relative;\n      background-color: ", ";\n    }\n\n    &[data-diff-type='remove'] .content {\n      position: relative;\n      background-color: ", ";\n\n      > *:first-child p,\n      > *:first-child span {\n        text-decoration: line-through;\n      }\n    }\n\n    &[data-diff-type='modify'] .content {\n      position: relative;\n\n      /* first child: original (deleted) */\n      > *:first-child {\n        opacity: 0.6;\n      }\n\n      /* visually indicate deletion with strike-through for text nodes */\n      > *:first-child p,\n      > *:first-child span {\n        text-decoration: line-through;\n      }\n\n      /* second child: modified/new - normal appearance */\n      > *:nth-child(2) {\n        color: inherit;\n        opacity: 1;\n      }\n    }\n  "])), token.colorBorderSecondary, token.colorPrimary, token.colorSuccess, token.colorError, token.colorSuccessBgHover, token.colorErrorBgHover);
+});

package/es/plugins/litexml/utils/index.d.ts

@@ -1,2 +1,5 @@
 import { LexicalEditor, LexicalNode } from 'lexical';
 export declare function $parseSerializedNodeImpl(serializedNode: any, editor: LexicalEditor): LexicalNode;
+export declare function $cloneNode(node: LexicalNode, editor: LexicalEditor): LexicalNode;
+export declare function idToChar(id: string | number): string;
+export declare function charToId(char: string): string;

package/es/plugins/litexml/utils/index.js

@@ -30,4 +30,51 @@ export function $parseSerializedNodeImpl(serializedNode, editor) {
     }
   }
   return node;
+}
+function exportNodeToJSON(node) {
+  var serializedNode = node.exportJSON();
+  var nodeClass = node.constructor;
+  if (serializedNode.type !== nodeClass.getType()) {
+    throw new Error("LexicalNode: Node ".concat(nodeClass.name, " does not match the serialized type. Check if .exportJSON() is implemented and it is returning the correct type."));
+  }
+  if ($isElementNode(node)) {
+    var serializedChildren = serializedNode.children;
+    if (!Array.isArray(serializedChildren)) {
+      throw new Error("LexicalNode: Node ".concat(nodeClass.name, " is an element but .exportJSON() does not have a children array."));
+    }
+    var children = node.getChildren();
+    var _iterator2 = _createForOfIteratorHelper(children),
+      _step2;
+    try {
+      for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+        var child = _step2.value;
+        var serializedChildNode = exportNodeToJSON(child);
+        serializedChildren.push(serializedChildNode);
+      }
+    } catch (err) {
+      _iterator2.e(err);
+    } finally {
+      _iterator2.f();
+    }
+  }
+
+  // @ts-expect-error
+  return serializedNode;
+}
+export function $cloneNode(node, editor) {
+  var json = exportNodeToJSON(node);
+  return $parseSerializedNodeImpl(json, editor);
+}
+var maxId = 1679616; // 36^4
+var startId = 1000000; // to avoid short ids
+var step = 7211; // a prime number to reduce collisions
+var modInverse = 1394051; // modular inverse of step mod maxId
+
+export function idToChar(id) {
+  var nId = (Number(id) * step + startId) % maxId;
+  return nId.toString(36).padStart(4, '0');
+}
+export function charToId(char) {
+  var nId = parseInt(char, 36);
+  return String((nId - startId + maxId) * modInverse % maxId);
 }

package/es/plugins/markdown/data-source/markdown-data-source.d.ts

@@ -1,11 +1,13 @@
 import type { LexicalEditor } from 'lexical';
 import { DataSource } from "../../../editor-kernel";
 import type { IWriteOptions } from "../../../editor-kernel/data-source";
+import type { IServiceID } from "../../../types";
 import type { MarkdownShortCutService } from '../service/shortcut';
 export default class MarkdownDataSource extends DataSource {
     protected dataType: string;
     protected markdownService: MarkdownShortCutService;
-    constructor(dataType: string, markdownService: MarkdownShortCutService);
+    protected getService?: (<T>(serviceId: IServiceID<T>) => T | null) | undefined;
+    constructor(dataType: string, markdownService: MarkdownShortCutService, getService?: (<T>(serviceId: IServiceID<T>) => T | null) | undefined);
     read(editor: LexicalEditor, data: string): void;
     write(editor: LexicalEditor, options?: IWriteOptions): any;
 }

package/es/plugins/markdown/data-source/markdown-data-source.js

@@ -29,26 +29,30 @@ import { $isTableSelection } from '@lexical/table';
 import { $getCharacterOffsets, $getNodeByKey, $getRoot, $getSelection, $isElementNode, $isRangeSelection, $isTextNode } from 'lexical';
 import { DataSource } from "../../../editor-kernel";
 import { INodeHelper } from "../../../editor-kernel/inode/helper";
+import { INodeService } from "../../inode";
 import { logger } from "../utils/logger";
 import { MarkdownWriterContext } from "./markdown-writer-context";
 import { parseMarkdownToLexical } from "./markdown/parse";
 var MarkdownDataSource = /*#__PURE__*/function (_DataSource) {
   _inherits(MarkdownDataSource, _DataSource);
   var _super = _createSuper(MarkdownDataSource);
-  function MarkdownDataSource(dataType, markdownService) {
+  function MarkdownDataSource(dataType, markdownService, getService) {
     var _this;
     _classCallCheck(this, MarkdownDataSource);
     _this = _super.call(this, dataType);
     _this.dataType = dataType;
     _this.markdownService = markdownService;
+    _this.getService = getService;
     return _this;
   }
   _createClass(MarkdownDataSource, [{
     key: "read",
     value: function read(editor, data) {
+      var _this$getService;
       var inode = {
         root: parseMarkdownToLexical(data, this.markdownService.markdownReaders)
       };
+      (_this$getService = this.getService) === null || _this$getService === void 0 || (_this$getService = _this$getService.call(this, INodeService)) === null || _this$getService === void 0 || _this$getService.processNodeTree(inode);
       logger.debug('Parsed Lexical State:', inode);
       editor.setEditorState(editor.parseEditorState(inode));
     }

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

@@ -35,8 +35,9 @@ export var MarkdownPlugin = (_class = /*#__PURE__*/function (_KernelPlugin) {
     _this.config = config;
     _this.service = new MarkdownShortCutService(kernel);
     kernel.registerService(IMarkdownShortCutService, _this.service);
-    // @todo To be implemented
-    kernel.registerDataSource(new MarkdownDataSource('markdown', _this.service));
+    kernel.registerDataSource(new MarkdownDataSource('markdown', _this.service, function (serviceId) {
+      return kernel.requireService(serviceId);
+    }));
     return _this;
   }
   _createClass(MarkdownPlugin, [{

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

@@ -11,6 +11,7 @@ import { Space, notification } from 'antd';
 import { useLayoutEffect } from 'react';
 import { useLexicalComposerContext } from "../../../editor-kernel/react";
 import { useTranslation } from "../../../editor-kernel/react/useTranslation";
+import { INodePlugin } from "../../inode";
 import { INSERT_MARKDOWN_COMMAND } from "../command";
 import { MarkdownPlugin } from "../plugin";
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -25,6 +26,7 @@ var ReactMarkdownPlugin = function ReactMarkdownPlugin() {
     contextHolder = _notification$useNoti2[1];
   var t = useTranslation();
   useLayoutEffect(function () {
+    editor.registerPlugin(INodePlugin);
     editor.registerPlugin(MarkdownPlugin);
     var handleEvent = function handleEvent(_ref) {
       var markdown = _ref.markdown,

package/es/plugins/math/node/index.js

@@ -92,8 +92,18 @@ export var MathInlineNode = /*#__PURE__*/function (_DecoratorNode) {
   }, {
     key: "decorate",
     value: function decorate(editor) {
-      var _getKernelFromEditor, _getKernelFromEditor$;
-      return ((_getKernelFromEditor = getKernelFromEditor(editor)) === null || _getKernelFromEditor === void 0 || (_getKernelFromEditor$ = _getKernelFromEditor.getDecorator(MathInlineNode.getType())) === null || _getKernelFromEditor$ === void 0 ? void 0 : _getKernelFromEditor$(this, editor)) || null;
+      var _getKernelFromEditor;
+      var decorator = (_getKernelFromEditor = getKernelFromEditor(editor)) === null || _getKernelFromEditor === void 0 ? void 0 : _getKernelFromEditor.getDecorator(MathInlineNode.getType());
+      if (!decorator) {
+        return null;
+      }
+      if (typeof decorator === 'function') {
+        return decorator(this, editor);
+      }
+      return {
+        queryDOM: decorator.queryDOM,
+        render: decorator.render(this, editor)
+      };
     }
   }], [{
     key: "getType",
@@ -200,8 +210,18 @@ export var MathBlockNode = /*#__PURE__*/function (_DecoratorNode2) {
   }, {
     key: "decorate",
     value: function decorate(editor) {
-      var _getKernelFromEditor2, _getKernelFromEditor3;
-      return ((_getKernelFromEditor2 = getKernelFromEditor(editor)) === null || _getKernelFromEditor2 === void 0 || (_getKernelFromEditor3 = _getKernelFromEditor2.getDecorator(MathBlockNode.getType())) === null || _getKernelFromEditor3 === void 0 ? void 0 : _getKernelFromEditor3(this, editor)) || null;
+      var _getKernelFromEditor2;
+      var decorator = (_getKernelFromEditor2 = getKernelFromEditor(editor)) === null || _getKernelFromEditor2 === void 0 ? void 0 : _getKernelFromEditor2.getDecorator(MathBlockNode.getType());
+      if (!decorator) {
+        return null;
+      }
+      if (typeof decorator === 'function') {
+        return decorator(this, editor);
+      }
+      return {
+        queryDOM: decorator.queryDOM,
+        render: decorator.render(this, editor)
+      };
     }
   }], [{
     key: "getType",

package/es/plugins/mention/node/MentionNode.js

@@ -94,8 +94,18 @@ export var MentionNode = /*#__PURE__*/function (_DecoratorNode) {
   }, {
     key: "decorate",
     value: function decorate(editor) {
-      var _getKernelFromEditor, _getKernelFromEditor$;
-      return ((_getKernelFromEditor = getKernelFromEditor(editor)) === null || _getKernelFromEditor === void 0 || (_getKernelFromEditor$ = _getKernelFromEditor.getDecorator('mention')) === null || _getKernelFromEditor$ === void 0 ? void 0 : _getKernelFromEditor$(this, editor)) || null;
+      var _getKernelFromEditor;
+      var decorator = (_getKernelFromEditor = getKernelFromEditor(editor)) === null || _getKernelFromEditor === void 0 ? void 0 : _getKernelFromEditor.getDecorator(MentionNode.getType());
+      if (!decorator) {
+        return null;
+      }
+      if (typeof decorator === 'function') {
+        return decorator(this, editor);
+      }
+      return {
+        queryDOM: decorator.queryDOM,
+        render: decorator.render(this, editor)
+      };
     }
   }], [{
     key: "getType",

package/es/types/kernel.d.ts

@@ -1,11 +1,16 @@
 import type { HistoryState, HistoryStateEntry } from '@lexical/history';
-import type { CommandListener, CommandListenerPriority, CommandPayloadType, DecoratorNode, EditorState, LexicalCommand, LexicalEditor, LexicalNodeConfig } from 'lexical';
+import type { CommandListener, CommandListenerPriority, CommandPayloadType, EditorState, LexicalCommand, LexicalEditor, LexicalNode, LexicalNodeConfig } from 'lexical';
 import type DataSource from "../editor-kernel/data-source";
 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>;
+export type IDecoratorFunc = (_node: LexicalNode, _editor: LexicalEditor) => any;
+export type IDecorator = {
+    queryDOM: (_element: HTMLElement) => HTMLElement;
+    render: IDecoratorFunc;
+} | IDecoratorFunc;
 /**
  * Service ID type
  */
@@ -206,7 +211,7 @@ export interface IEditorKernel extends IEditor {
      * Get editor Node decorator for specific Node rendering
      * @param name
      */
-    getDecorator(name: string): ((_node: DecoratorNode<any>, _editor: LexicalEditor) => any) | undefined;
+    getDecorator(name: string): IDecorator | undefined;
     /**
      * Get editor history state
      */
@@ -229,7 +234,7 @@ export interface IEditorKernel extends IEditor {
      * @param name
      * @param decorator
      */
-    registerDecorator(name: string, decorator: (_node: DecoratorNode<any>, _editor: LexicalEditor) => any): void;
+    registerDecorator(name: string, decorator: IDecorator): void;
     /**
      * Register Lexical Node
      * @param nodes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/editor",
-  "version": "1.31.2",
+  "version": "1.33.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",
@@ -13,7 +13,7 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/lobehub/lobe-editor.git"
+    "url": "git+https://github.com/lobehub/lobe-editor.git"
   },
   "license": "MIT",
   "author": "LobeHub <i@lobehub.com>",