@lobehub/editor 3.3.2 → 3.4.0

package/es/editor-kernel/lexical/nodes/LexicalParagraphNode.d.ts

@@ -0,0 +1,39 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import type { EditorConfig, KlassConstructor, LexicalEditor, Spread } from '../LexicalEditor';
+import type { DOMConversionMap, DOMExportOutput, LexicalNode } from '../LexicalNode';
+import type { RangeSelection } from '../LexicalSelection';
+import type { SerializedElementNode } from './LexicalElementNode';
+import { ElementNode } from './LexicalElementNode';
+
+export type SerializedParagraphNode = Spread<
+  {
+    textFormat: number;
+    textStyle: string;
+  },
+  SerializedElementNode
+>;
+/** @noInheritDoc */
+export declare class ParagraphNode extends ElementNode {
+  /** @internal */
+  ['constructor']: KlassConstructor<typeof ParagraphNode>;
+  static getType(): string;
+  static clone(node: ParagraphNode): ParagraphNode;
+  createDOM(config: EditorConfig): HTMLElement;
+  updateDOM(prevNode: ParagraphNode, dom: HTMLElement, config: EditorConfig): boolean;
+  static importDOM(): DOMConversionMap | null;
+  exportDOM(editor: LexicalEditor): DOMExportOutput;
+  static importJSON(serializedNode: SerializedParagraphNode): ParagraphNode;
+  exportJSON(): SerializedParagraphNode;
+  insertNewAfter(rangeSelection: RangeSelection, restoreSelection: boolean): ParagraphNode;
+  collapseAtStart(): boolean;
+}
+export declare function $createParagraphNode(): ParagraphNode;
+export declare function $isParagraphNode(
+  node: LexicalNode | null | undefined,
+): node is ParagraphNode;

package/es/editor-kernel/lexical/nodes/LexicalRootNode.d.ts

@@ -0,0 +1,35 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import type { LexicalNode, SerializedLexicalNode } from '../LexicalNode';
+import type { SerializedElementNode } from './LexicalElementNode';
+import { ElementNode } from './LexicalElementNode';
+
+export type SerializedRootNode<T extends SerializedLexicalNode = SerializedLexicalNode> =
+  SerializedElementNode<T>;
+/** @noInheritDoc */
+export declare class RootNode extends ElementNode {
+  /** @internal */
+  __cachedText: null | string;
+  static getType(): string;
+  static clone(): RootNode;
+  constructor();
+  getTopLevelElementOrThrow(): never;
+  getTextContent(): string;
+  remove(): never;
+  replace<N = LexicalNode>(node: N): never;
+  insertBefore(nodeToInsert: LexicalNode): LexicalNode;
+  insertAfter(nodeToInsert: LexicalNode): LexicalNode;
+  updateDOM(prevNode: this, dom: HTMLElement): false;
+  splice(start: number, deleteCount: number, nodesToInsert: LexicalNode[]): this;
+  static importJSON(serializedNode: SerializedRootNode): RootNode;
+  collapseAtStart(): true;
+}
+export declare function $createRootNode(): RootNode;
+export declare function $isRootNode(
+  node: RootNode | LexicalNode | null | undefined,
+): node is RootNode;

package/es/editor-kernel/lexical/nodes/LexicalTabNode.d.ts

@@ -0,0 +1,30 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import { EditorConfig } from '../LexicalEditor';
+import type { DOMConversionMap, NodeKey } from '../LexicalNode';
+import { LexicalNode } from '../LexicalNode';
+import { SerializedTextNode, TextDetailType, TextModeType, TextNode } from './LexicalTextNode';
+
+export type SerializedTabNode = SerializedTextNode;
+/** @noInheritDoc */
+export declare class TabNode extends TextNode {
+  static getType(): string;
+  static clone(node: TabNode): TabNode;
+  constructor(key?: NodeKey);
+  static importDOM(): DOMConversionMap | null;
+  createDOM(config: EditorConfig): HTMLElement;
+  static importJSON(serializedTabNode: SerializedTabNode): TabNode;
+  setTextContent(text: string): this;
+  spliceText(offset: number, delCount: number, newText: string, moveSelection?: boolean): TextNode;
+  setDetail(detail: TextDetailType | number): this;
+  setMode(type: TextModeType): this;
+  canInsertTextBefore(): boolean;
+  canInsertTextAfter(): boolean;
+}
+export declare function $createTabNode(): TabNode;
+export declare function $isTabNode(node: LexicalNode | null | undefined): node is TabNode;

package/es/editor-kernel/lexical/nodes/LexicalTextNode.d.ts

@@ -0,0 +1,311 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import type { EditorConfig, KlassConstructor, LexicalEditor, Spread } from '../LexicalEditor';
+import type {
+  DOMConversionMap,
+  DOMExportOutput,
+  LexicalUpdateJSON,
+  NodeKey,
+  SerializedLexicalNode,
+} from '../LexicalNode';
+import { LexicalNode } from '../LexicalNode';
+import type { BaseSelection, RangeSelection } from '../LexicalSelection';
+import type { ElementNode } from './LexicalElementNode';
+
+export type SerializedTextNode = Spread<
+  {
+    detail: number;
+    format: number;
+    mode: TextModeType;
+    style: string;
+    text: string;
+  },
+  SerializedLexicalNode
+>;
+export type TextDetailType = 'directionless' | 'unmergable';
+export type TextFormatType =
+  | 'bold'
+  | 'underline'
+  | 'strikethrough'
+  | 'italic'
+  | 'highlight'
+  | 'code'
+  | 'subscript'
+  | 'superscript'
+  | 'lowercase'
+  | 'uppercase'
+  | 'capitalize';
+export type TextModeType = 'normal' | 'token' | 'segmented';
+export type TextMark = {
+  end: null | number;
+  id: string;
+  start: null | number;
+};
+export type TextMarks = Array<TextMark>;
+export interface TextNode {
+  getTopLevelElement(): ElementNode | null;
+  getTopLevelElementOrThrow(): ElementNode;
+}
+/** @noInheritDoc */
+export declare class TextNode extends LexicalNode {
+  /** @internal */
+  ['constructor']: KlassConstructor<typeof TextNode>;
+  __text: string;
+  /** @internal */
+  __format: number;
+  /** @internal */
+  __style: string;
+  /** @internal */
+  __mode: 0 | 1 | 2 | 3;
+  /** @internal */
+  __detail: number;
+  static getType(): string;
+  static clone(node: TextNode): TextNode;
+  afterCloneFrom(prevNode: this): void;
+  constructor(text?: string, key?: NodeKey);
+  /**
+   * Returns a 32-bit integer that represents the TextFormatTypes currently applied to the
+   * TextNode. You probably don't want to use this method directly - consider using TextNode.hasFormat instead.
+   *
+   * @returns a number representing the format of the text node.
+   */
+  getFormat(): number;
+  /**
+   * Returns a 32-bit integer that represents the TextDetailTypes currently applied to the
+   * TextNode. You probably don't want to use this method directly - consider using TextNode.isDirectionless
+   * or TextNode.isUnmergeable instead.
+   *
+   * @returns a number representing the detail of the text node.
+   */
+  getDetail(): number;
+  /**
+   * Returns the mode (TextModeType) of the TextNode, which may be "normal", "token", or "segmented"
+   *
+   * @returns TextModeType.
+   */
+  getMode(): TextModeType;
+  /**
+   * Returns the styles currently applied to the node. This is analogous to CSSText in the DOM.
+   *
+   * @returns CSSText-like string of styles applied to the underlying DOM node.
+   */
+  getStyle(): string;
+  /**
+   * Returns whether or not the node is in "token" mode. TextNodes in token mode can be navigated through character-by-character
+   * with a RangeSelection, but are deleted as a single entity (not individually by character).
+   *
+   * @returns true if the node is in token mode, false otherwise.
+   */
+  isToken(): boolean;
+  /**
+   *
+   * @returns true if Lexical detects that an IME or other 3rd-party script is attempting to
+   * mutate the TextNode, false otherwise.
+   */
+  isComposing(): boolean;
+  /**
+   * Returns whether or not the node is in "segmented" mode. TextNodes in segmented mode can be navigated through character-by-character
+   * with a RangeSelection, but are deleted in space-delimited "segments".
+   *
+   * @returns true if the node is in segmented mode, false otherwise.
+   */
+  isSegmented(): boolean;
+  /**
+   * Returns whether or not the node is "directionless". Directionless nodes don't respect changes between RTL and LTR modes.
+   *
+   * @returns true if the node is directionless, false otherwise.
+   */
+  isDirectionless(): boolean;
+  /**
+   * Returns whether or not the node is unmergeable. In some scenarios, Lexical tries to merge
+   * adjacent TextNodes into a single TextNode. If a TextNode is unmergeable, this won't happen.
+   *
+   * @returns true if the node is unmergeable, false otherwise.
+   */
+  isUnmergeable(): boolean;
+  /**
+   * Returns whether or not the node has the provided format applied. Use this with the human-readable TextFormatType
+   * string values to get the format of a TextNode.
+   *
+   * @param type - the TextFormatType to check for.
+   *
+   * @returns true if the node has the provided format, false otherwise.
+   */
+  hasFormat(type: TextFormatType): boolean;
+  /**
+   * Returns whether or not the node is simple text. Simple text is defined as a TextNode that has the string type "text"
+   * (i.e., not a subclass) and has no mode applied to it (i.e., not segmented or token).
+   *
+   * @returns true if the node is simple text, false otherwise.
+   */
+  isSimpleText(): boolean;
+  /**
+   * Returns the text content of the node as a string.
+   *
+   * @returns a string representing the text content of the node.
+   */
+  getTextContent(): string;
+  /**
+   * Returns the format flags applied to the node as a 32-bit integer.
+   *
+   * @returns a number representing the TextFormatTypes applied to the node.
+   */
+  getFormatFlags(type: TextFormatType, alignWithFormat: null | number): number;
+  /**
+   *
+   * @returns true if the text node supports font styling, false otherwise.
+   */
+  canHaveFormat(): boolean;
+  /**
+   * @returns true if the text node is inline, false otherwise.
+   */
+  isInline(): true;
+  createDOM(config: EditorConfig, editor?: LexicalEditor): HTMLElement;
+  updateDOM(prevNode: this, dom: HTMLElement, config: EditorConfig): boolean;
+  static importDOM(): DOMConversionMap | null;
+  static importJSON(serializedNode: SerializedTextNode): TextNode;
+  updateFromJSON(serializedNode: LexicalUpdateJSON<SerializedTextNode>): this;
+  exportDOM(editor: LexicalEditor): DOMExportOutput;
+  exportJSON(): SerializedTextNode;
+  selectionTransform(prevSelection: null | BaseSelection, nextSelection: RangeSelection): void;
+  /**
+   * Sets the node format to the provided TextFormatType or 32-bit integer. Note that the TextFormatType
+   * version of the argument can only specify one format and doing so will remove all other formats that
+   * may be applied to the node. For toggling behavior, consider using {@link TextNode.toggleFormat}
+   *
+   * @param format - TextFormatType or 32-bit integer representing the node format.
+   *
+   * @returns this TextNode.
+   * // TODO 0.12 This should just be a `string`.
+   */
+  setFormat(format: TextFormatType | number): this;
+  /**
+   * Sets the node detail to the provided TextDetailType or 32-bit integer. Note that the TextDetailType
+   * version of the argument can only specify one detail value and doing so will remove all other detail values that
+   * may be applied to the node. For toggling behavior, consider using {@link TextNode.toggleDirectionless}
+   * or {@link TextNode.toggleUnmergeable}
+   *
+   * @param detail - TextDetailType or 32-bit integer representing the node detail.
+   *
+   * @returns this TextNode.
+   * // TODO 0.12 This should just be a `string`.
+   */
+  setDetail(detail: TextDetailType | number): this;
+  /**
+   * Sets the node style to the provided CSSText-like string. Set this property as you
+   * would an HTMLElement style attribute to apply inline styles to the underlying DOM Element.
+   *
+   * @param style - CSSText to be applied to the underlying HTMLElement.
+   *
+   * @returns this TextNode.
+   */
+  setStyle(style: string): this;
+  /**
+   * Applies the provided format to this TextNode if it's not present. Removes it if it's present.
+   * The subscript and superscript formats are mutually exclusive.
+   * Prefer using this method to turn specific formats on and off.
+   *
+   * @param type - TextFormatType to toggle.
+   *
+   * @returns this TextNode.
+   */
+  toggleFormat(type: TextFormatType): this;
+  /**
+   * Toggles the directionless detail value of the node. Prefer using this method over setDetail.
+   *
+   * @returns this TextNode.
+   */
+  toggleDirectionless(): this;
+  /**
+   * Toggles the unmergeable detail value of the node. Prefer using this method over setDetail.
+   *
+   * @returns this TextNode.
+   */
+  toggleUnmergeable(): this;
+  /**
+   * Sets the mode of the node.
+   *
+   * @returns this TextNode.
+   */
+  setMode(type: TextModeType): this;
+  /**
+   * Sets the text content of the node.
+   *
+   * @param text - the string to set as the text value of the node.
+   *
+   * @returns this TextNode.
+   */
+  setTextContent(text: string): this;
+  /**
+   * Sets the current Lexical selection to be a RangeSelection with anchor and focus on this TextNode at the provided offsets.
+   *
+   * @param _anchorOffset - the offset at which the Selection anchor will be placed.
+   * @param _focusOffset - the offset at which the Selection focus will be placed.
+   *
+   * @returns the new RangeSelection.
+   */
+  select(_anchorOffset?: number, _focusOffset?: number): RangeSelection;
+  selectStart(): RangeSelection;
+  selectEnd(): RangeSelection;
+  /**
+   * Inserts the provided text into this TextNode at the provided offset, deleting the number of characters
+   * specified. Can optionally calculate a new selection after the operation is complete.
+   *
+   * @param offset - the offset at which the splice operation should begin.
+   * @param delCount - the number of characters to delete, starting from the offset.
+   * @param newText - the text to insert into the TextNode at the offset.
+   * @param moveSelection - optional, whether or not to move selection to the end of the inserted substring.
+   *
+   * @returns this TextNode.
+   */
+  spliceText(offset: number, delCount: number, newText: string, moveSelection?: boolean): TextNode;
+  /**
+   * This method is meant to be overridden by TextNode subclasses to control the behavior of those nodes
+   * when a user event would cause text to be inserted before them in the editor. If true, Lexical will attempt
+   * to insert text into this node. If false, it will insert the text in a new sibling node.
+   *
+   * @returns true if text can be inserted before the node, false otherwise.
+   */
+  canInsertTextBefore(): boolean;
+  /**
+   * This method is meant to be overridden by TextNode subclasses to control the behavior of those nodes
+   * when a user event would cause text to be inserted after them in the editor. If true, Lexical will attempt
+   * to insert text into this node. If false, it will insert the text in a new sibling node.
+   *
+   * @returns true if text can be inserted after the node, false otherwise.
+   */
+  canInsertTextAfter(): boolean;
+  /**
+   * Splits this TextNode at the provided character offsets, forming new TextNodes from the substrings
+   * formed by the split, and inserting those new TextNodes into the editor, replacing the one that was split.
+   *
+   * @param splitOffsets - rest param of the text content character offsets at which this node should be split.
+   *
+   * @returns an Array containing the newly-created TextNodes.
+   */
+  splitText(...splitOffsets: Array<number>): Array<TextNode>;
+  /**
+   * Merges the target TextNode into this TextNode, removing the target node.
+   *
+   * @param target - the TextNode to merge into this one.
+   *
+   * @returns this TextNode.
+   */
+  mergeWithSibling(target: TextNode): TextNode;
+  /**
+   * This method is meant to be overridden by TextNode subclasses to control the behavior of those nodes
+   * when used with the registerLexicalTextEntity function. If you're using registerLexicalTextEntity, the
+   * node class that you create and replace matched text with should return true from this method.
+   *
+   * @returns true if the node is to be treated as a "text entity", false otherwise.
+   */
+  isTextEntity(): boolean;
+}
+export declare function findParentPreDOMNode(node: Node): Node | null;
+export declare function $createTextNode(text?: string): TextNode;
+export declare function $isTextNode(node: LexicalNode | null | undefined): node is TextNode;

package/es/plugins/common/data-source/json-data-source.js

@@ -20,11 +20,16 @@ function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) ===
 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); }
+/* eslint-disable import/no-duplicates */
 /* eslint-disable unicorn/no-for-loop */
 import { $isTableSelection } from '@lexical/table';
 import { $getCharacterOffsets, $getNodeByKey, $getSelection, $isElementNode, $isRangeSelection, $isTextNode, IS_CODE } from 'lexical';
+import { $getRoot } from 'lexical';
 import { DataSource } from "../../../editor-kernel";
+import { INodeHelper } from "../../../editor-kernel/inode/helper";
+import { $parseSerializedNodeImpl } from "../../litexml/utils";
 import { cursorNodeSerialized } from "../node/cursor";
+import { exportNodeToJSON } from "../utils";
 var JSONDataSource = /*#__PURE__*/function (_DataSource) {
   _inherits(JSONDataSource, _DataSource);
   var _super = _createSuper(JSONDataSource);
@@ -63,7 +68,24 @@ var JSONDataSource = /*#__PURE__*/function (_DataSource) {
         }
       };
       process(dataObj.root);
-      editor.setEditorState(editor.parseEditorState(dataObj));
+      // @ts-expect-error add id option
+      if (dataObj.keepId) {
+        var state = editor.parseEditorState({
+          root: INodeHelper.createRootNode()
+        }, function (state) {
+          try {
+            var root = $parseSerializedNodeImpl(dataObj.root, editor, true, state);
+            state._nodeMap.set(root.getKey(), root);
+          } catch (error) {
+            console.error(error);
+          }
+        });
+        editor.setEditorState(state);
+      } else {
+        editor.setEditorState(editor.parseEditorState({
+          root: dataObj.root
+        }));
+      }
     }
   }, {
     key: "write",
@@ -173,11 +195,15 @@ var JSONDataSource = /*#__PURE__*/function (_DataSource) {
             // todo
           }
           return selection.getNodes().map(function (node) {
-            return node.exportJSON();
+            return exportNodeToJSON(node);
           });
         });
       }
-      return editor.getEditorState().toJSON();
+      return editor.read(function () {
+        return {
+          root: exportNodeToJSON($getRoot())
+        };
+      });
     }
   }]);
   return JSONDataSource;

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

@@ -146,6 +146,15 @@ var ReactPlainText = /*#__PURE__*/memo(function (_ref) {
       }
     });
   }, [editor, type, content, onChange, onTextChange, isInitialized]);
+  useEffect(function () {
+    var handleDocumentChange = function handleDocumentChange() {
+      onTextChange === null || onTextChange === void 0 || onTextChange(editor);
+    };
+    editor.on('documentChange', handleDocumentChange);
+    return function () {
+      editor.off('documentChange', handleDocumentChange);
+    };
+  }, [editor, onTextChange]);
   useEffect(function () {
     if (!isInitialized) return;
     if (typeof editable === 'boolean') {

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

@@ -1,4 +1,4 @@
-import type { ElementNode } from 'lexical';
+import type { ElementNode, LexicalNode, SerializedLexicalNode } from 'lexical';
 import type { ElementTransformer } from "../../markdown/service/transformers";
 export declare const sampleReader: (format: number, xmlElement: Element, children: any[]) => any[];
 export declare const createBlockNode: (createNode: (match: Array<string>, parentNode: ElementNode) => ElementNode) => ElementTransformer['replace'];
@@ -32,3 +32,4 @@ export declare function $isCursorInTable(selection: any): {
     inTable: boolean;
 };
 export declare function $isCursorInQuote(selection: any): boolean;
+export declare function exportNodeToJSON<SerializedNode extends SerializedLexicalNode>(node: LexicalNode): SerializedNode;

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

@@ -1,3 +1,4 @@
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 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); }
@@ -162,4 +163,36 @@ export function $isCursorInQuote(selection) {
     currentNode = parent;
   }
   return false;
+}
+export function exportNodeToJSON(node) {
+  var serializedNode = node.exportJSON();
+  var nodeClass = node.constructor;
+  // @ts-expect-error not error
+  serializedNode.id = node.getKey();
+  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 _iterator = _createForOfIteratorHelper(children),
+      _step;
+    try {
+      for (_iterator.s(); !(_step = _iterator.n()).done;) {
+        var child = _step.value;
+        var serializedChildNode = exportNodeToJSON(child);
+        serializedChildren.push(serializedChildNode);
+      }
+    } catch (err) {
+      _iterator.e(err);
+    } finally {
+      _iterator.f();
+    }
+  }
+
+  // @ts-expect-error not error
+  return serializedNode;
 }

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

@@ -128,7 +128,15 @@ export var LITEXML_REMOVE_COMMAND = createCommand('LITEXML_REMOVE_COMMAND');
 export var LITEXML_INSERT_COMMAND = createCommand('LITEXML_INSERT_COMMAND');
 export function registerLiteXMLCommand(editor, dataSource) {
   return mergeRegister(editor.registerCommand(LITEXML_MODIFY_COMMAND, function (payload) {
-    payload.forEach(function (item) {
+    var resultPayload = payload.reduce(function (acc, cur) {
+      if (cur.action === 'insert') {
+        acc.unshift(cur);
+      } else {
+        acc.push(cur);
+      }
+      return acc;
+    }, []);
+    resultPayload.forEach(function (item) {
       var action = item.action;
       switch (action) {
         case 'modify':

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

@@ -33,7 +33,7 @@ import { INodeHelper } from "../../../editor-kernel/inode/helper";
 import { INodeService } from "../../inode";
 import { createDebugLogger } from "../../../utils/debug";
 import { LitexmlService } from "../service/litexml-service";
-import { charToId, idToChar } from "../utils";
+import { $parseSerializedNodeImpl, charToId, idToChar } from "../utils";
 var logger = createDebugLogger('plugin', 'litexml');
 var IXmlWriterContext = /*#__PURE__*/function () {
   function IXmlWriterContext() {
@@ -97,7 +97,17 @@ var LitexmlDataSource = /*#__PURE__*/function (_DataSource) {
     value: function read(editor, data) {
       try {
         var inode = this.readLiteXMLToInode(data);
-        editor.setEditorState(editor.parseEditorState(inode));
+        var newState = editor.parseEditorState({
+          root: INodeHelper.createRootNode()
+        }, function (state) {
+          try {
+            var root = $parseSerializedNodeImpl(inode.root, editor, true, state);
+            state._nodeMap.set(root.getKey(), root);
+          } catch (error) {
+            console.error(error);
+          }
+        });
+        editor.setEditorState(newState);
       } catch (error) {
         logger.error('Failed to parse XML:', error);
         throw error;

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

@@ -14,6 +14,7 @@ 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 { KernelPlugin } from "../../../editor-kernel/plugin";
+import { IMarkdownShortCutService } from "../../markdown";
 import { registerLiteXMLCommand } from "../command";
 import { registerLiteXMLDiffCommand } from "../command/diffCommand";
 import LitexmlDataSource from "../data-source/litexml-data-source";
@@ -74,11 +75,12 @@ export var LitexmlPlugin = (_class = /*#__PURE__*/function (_KernelPlugin) {
       // Plugin initialization logic can be added here if needed
       this.register(registerLiteXMLCommand(editor, this.datasource));
       this.register(registerLiteXMLDiffCommand(editor));
-      this.regiserLiteXml();
+      this.registerLiteXml();
+      this.registerMarkdown();
     }
   }, {
-    key: "regiserLiteXml",
-    value: function regiserLiteXml() {
+    key: "registerLiteXml",
+    value: function registerLiteXml() {
       this.service.registerXMLWriter(DiffNode.getType(), function (node, ctx, indent, nodeToXML) {
         var diffNode = node;
         var lines = [];
@@ -114,6 +116,42 @@ export var LitexmlPlugin = (_class = /*#__PURE__*/function (_KernelPlugin) {
         };
       });
     }
+  }, {
+    key: "registerMarkdown",
+    value: function registerMarkdown() {
+      var markdownService = this.kernel.requireService(IMarkdownShortCutService);
+      markdownService === null || markdownService === void 0 || markdownService.registerMarkdownWriter(DiffNode.getType(), function (ctx, node) {
+        var diffNode = node;
+        switch (diffNode.diffType) {
+          case 'modify':
+            {
+              ctx.processChild(ctx, diffNode.getChildAtIndex(1));
+              break;
+            }
+          case 'add':
+            {
+              ctx.processChild(ctx, diffNode.getChildAtIndex(0));
+              break;
+            }
+          case 'remove':
+            {
+              break;
+            }
+          case 'listItemModify':
+            {
+              diffNode.getChildAtIndex(1).getChildren().forEach(function (child) {
+                ctx.processChild(ctx, child);
+              });
+              break;
+            }
+          default:
+            {
+              break;
+            }
+        }
+        return true;
+      });
+    }
   }]);
   return LitexmlPlugin;
 }(KernelPlugin), _defineProperty(_class, "pluginName", 'LitexmlPlugin'), _class);

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

@@ -1,5 +1,6 @@
+import type { EditorState } from 'lexical';
 import { LexicalEditor, LexicalNode } from 'lexical';
-export declare function $parseSerializedNodeImpl(serializedNode: any, editor: LexicalEditor): LexicalNode;
+export declare function $parseSerializedNodeImpl(serializedNode: any, editor: LexicalEditor, keepId?: boolean, state?: EditorState | null): 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;