@lobehub/editor 4.10.3 → 4.11.0

package/es/index.js

@@ -1,10 +1,10 @@
-import { $ as DOM_TEXT_TYPE, A as $createCodeMirrorNode, At as createDebugLogger, B as Editor, C as $createCodeNode$1, Ct as CONTROL_OR_META, Dt as KeyEnum, E as CodeNode$1, Et as HotkeyScopeEnum, F as $isCursorNode, Ft as init_debug, G as kernel_exports, Gt as INodeHelper, H as DataSource, I as CardLikeElementNode, It as prodSafeLogger, J as $getNearestNodeFromDOMNode, K as $closest, Kt as init_helper, M as CodeMirrorNode, Mt as debugLoggers, N as $createCursorNode, Nt as debug_exports, Ot as init_hotkey, P as $isCardLikeElementNode, Pt as devConsole, Q as DOM_ELEMENT_TYPE, R as cursorNodeSerialized, S as formatUrl, St as init_registerHotkey, Tt as HotkeyEnum, U as Kernel, V as resetRandomKey, W as init_kernel, X as DOM_DOCUMENT_FRAGMENT_TYPE, Y as $getNodeFromDOMNode, Yt as __toCommonJS, Z as DOM_DOCUMENT_TYPE, _ as AutoLinkNode, _t as unregisterEditorKernel, a as $createMathBlockNode, at as generateEditorId, b as LinkNode, bt as HOVER_COMMAND, c as MathBlockNode, ct as getNodeKeyFromDOMNode, dt as isDOMNode, et as EDITOR_THEME_KEY, f as LinkHighlightNode, ft as isDocumentFragment, g as $toggleLink, gt as registerEditorKernel, h as $isLinkNode, ht as reconcileDecorator, it as genServiceId, j as $isCodeMirrorNode, jt as debugLogger, kt as browserDebug, l as MathInlineNode, lt as getParentElement, m as $createLinkNode, mt as noop, nt as compareNodeOrder, o as $createMathInlineNode, ot as getKernelFromEditor, pt as moment, q as $closestNodeType, rt as createEmptyEditorState, s as $isMathNode, st as getKernelFromEditorConfig, tt as assert, u as $createLinkHighlightNode, ut as init_utils, v as HOVER_LINK_COMMAND, vt as KernelPlugin, wt as init_sys, x as TOGGLE_LINK_COMMAND, xt as getHotkeyById, y as HOVER_OUT_LINK_COMMAND, yt as init_plugin } from "./style-CLtp6okE.js";
-import { A as detectLanguage, B as INodePlugin, C as ReactPlainText, D as useTranslation, E as ReactMarkdownPlugin, F as GET_MARKDOWN_SELECTION_COMMAND, G as idToChar, H as $cloneNode, I as INSERT_MARKDOWN_COMMAND, J as useLexicalEditor, K as INSERT_HEADING_COMMAND, L as isPunctuationChar, M as MARKDOWN_READER_LEVEL_HIGH, N as MARKDOWN_READER_LEVEL_NORMAL, O as MarkdownPlugin, P as MARKDOWN_WRITER_LEVEL_MAX, R as ILitexmlService, S as registerCodeInlineCommand, T as CommonPlugin, U as $parseSerializedNodeImpl, V as INodeService, W as charToId, X as useLexicalComposerContext, Y as ReactEditor, Z as LexicalErrorBoundary, _ as extractUrlFromText, a as ReactMentionPlugin, c as INSERT_LINK_HIGHLIGHT_COMMAND, d as bundledLanguagesInfo, f as CodeblockPlugin, g as registerCheckList, h as INSERT_CHECK_LIST_COMMAND, i as SlashPlugin, j as IMarkdownShortCutService, k as detectCodeLanguage, l as registerLinkHighlightCommand, m as getCodeLanguageByInput, n as ReactSlashOption, o as MentionPlugin, p as UPDATE_CODEBLOCK_LANG, q as INSERT_QUOTE_COMMAND, r as SlashMenu, s as INSERT_MENTION_COMMAND, t as ReactSlashPlugin, u as useLexicalNodeSelection, v as getSelectedNode, w as ReactEditorContent, x as INSERT_CODEINLINE_COMMAND, y as sanitizeUrl, z as LitexmlService } from "./ReactSlashPlugin-CBLFF1e6.js";
-import { S as DiffNode, _ as PlaceholderNode, a as styles$16, b as HorizontalRuleNode, c as ImageNode, d as BlockImageNode, f as styles$15, g as PlaceholderBlockNode, h as FileNode, i as imageBroken, l as $createBlockImageNode, m as $isFileNode, n as styles$18, o as $createImageNode, p as $createFileNode, r as styles$17, s as $isImageNode, t as styles$19, u as $isBlockImageNode, v as $createHorizontalRuleNode, x as $createDiffNode, y as $isHorizontalRuleNode } from "./style-D-dIPHv5.js";
+import { $ as DOM_TEXT_TYPE, A as $createCodeMirrorNode, At as createDebugLogger, B as Editor, C as $createCodeNode$1, Ct as CONTROL_OR_META, Dt as KeyEnum, E as CodeNode$1, Et as HotkeyScopeEnum, F as $isCursorNode, Ft as init_debug, G as kernel_exports, Gt as INodeHelper, H as DataSource, I as CardLikeElementNode, It as prodSafeLogger, J as $getNearestNodeFromDOMNode, K as $closest, Kt as init_helper, M as CodeMirrorNode, Mt as debugLoggers, N as $createCursorNode, Nt as debug_exports, Ot as init_hotkey, P as $isCardLikeElementNode, Pt as devConsole, Q as DOM_ELEMENT_TYPE, R as cursorNodeSerialized, S as formatUrl, St as init_registerHotkey, Tt as HotkeyEnum, U as Kernel, V as resetRandomKey, W as init_kernel, X as DOM_DOCUMENT_FRAGMENT_TYPE, Y as $getNodeFromDOMNode, Yt as __toCommonJS, Z as DOM_DOCUMENT_TYPE, _ as AutoLinkNode, _t as unregisterEditorKernel, a as $createMathBlockNode, at as generateEditorId, b as LinkNode, bt as HOVER_COMMAND, c as MathBlockNode, ct as getNodeKeyFromDOMNode, dt as isDOMNode, et as EDITOR_THEME_KEY, f as LinkHighlightNode, ft as isDocumentFragment, g as $toggleLink, gt as registerEditorKernel, h as $isLinkNode, ht as reconcileDecorator, it as genServiceId, j as $isCodeMirrorNode, jt as debugLogger, kt as browserDebug, l as MathInlineNode, lt as getParentElement, m as $createLinkNode, mt as noop, nt as compareNodeOrder, o as $createMathInlineNode, ot as getKernelFromEditor, pt as moment, q as $closestNodeType, rt as createEmptyEditorState, s as $isMathNode, st as getKernelFromEditorConfig, tt as assert, u as $createLinkHighlightNode, ut as init_utils, v as HOVER_LINK_COMMAND, vt as KernelPlugin, wt as init_sys, x as TOGGLE_LINK_COMMAND, xt as getHotkeyById, y as HOVER_OUT_LINK_COMMAND, yt as init_plugin } from "./style-DjwW7ClE.js";
+import { $ as LexicalErrorBoundary, A as MarkdownPlugin, B as ILitexmlService, C as INSERT_CODEINLINE_COMMAND, D as CommonPlugin, E as ReactEditorContent, F as MARKDOWN_READER_LEVEL_NORMAL, G as $parseSerializedNodeImpl, H as INodePlugin, I as MARKDOWN_WRITER_LEVEL_MAX, J as INSERT_HEADING_COMMAND, K as charToId, L as GET_MARKDOWN_SELECTION_COMMAND, M as detectLanguage, N as IMarkdownShortCutService, O as ReactMarkdownPlugin, P as MARKDOWN_READER_LEVEL_HIGH, Q as useLexicalComposerContext, R as INSERT_MARKDOWN_COMMAND, T as ReactPlainText, U as INodeService, V as LitexmlService, W as $cloneNode, X as useLexicalEditor, Y as INSERT_QUOTE_COMMAND, Z as ReactEditor, _ as INSERT_CHECK_LIST_COMMAND, a as ReactMentionPlugin, b as getSelectedNode, c as INSERT_LINK_HIGHLIGHT_COMMAND, d as bundledLanguagesInfo, f as CodeblockPlugin, g as getCodeLanguageByInput, h as IBlockMenuService, i as SlashPlugin, j as detectCodeLanguage, k as useTranslation, l as registerLinkHighlightCommand, m as BlockMenuService, n as ReactSlashOption, o as MentionPlugin, p as UPDATE_CODEBLOCK_LANG, q as idToChar, r as SlashMenu, s as INSERT_MENTION_COMMAND, t as ReactSlashPlugin, u as useLexicalNodeSelection, v as registerCheckList, w as registerCodeInlineCommand, x as sanitizeUrl, y as extractUrlFromText, z as isPunctuationChar } from "./ReactSlashPlugin-DkEXwDgH.js";
+import { S as DiffNode, _ as PlaceholderNode, a as styles$17, b as HorizontalRuleNode, c as ImageNode, d as BlockImageNode, f as styles$16, g as PlaceholderBlockNode, h as FileNode, i as imageBroken, l as $createBlockImageNode, m as $isFileNode, n as styles$19, o as $createImageNode, p as $createFileNode, r as styles$18, s as $isImageNode, t as styles$20, u as $isBlockImageNode, v as $createHorizontalRuleNode, x as $createDiffNode, y as $isHorizontalRuleNode } from "./style-DejqW6OX.js";
 import { $computeTableMapSkipCellCheck, $createTableNodeWithDimensions, $createTableSelection, $deleteTableColumnAtSelection, $deleteTableRowAtSelection, $findTableNode, $getElementForTableNode, $getNodeTriplet, $getTableAndElementByKey, $getTableCellNodeFromLexicalNode, $getTableColumnIndexFromTableCellNode, $getTableNodeFromLexicalNodeOrThrow, $getTableRowIndexFromTableCellNode, $insertTableColumnAtSelection, $insertTableRowAtSelection, $isTableCellNode, $isTableNode, $isTableRowNode, $isTableSelection, $mergeCells, $unmergeCell, TableCellHeaderStates, TableCellNode, TableNode, TableNode as TableNode$1, TableRowNode, getDOMCellFromTarget, getTableElement, getTableObserverFromTableElement, registerTableCellUnmergeTransform, registerTablePlugin, registerTableSelectionObserver, setScrollableTablesActive } from "@lexical/table";
 import { debounce } from "es-toolkit/compat";
 import EventEmitter from "eventemitter3";
-import { $createNodeSelection, $createParagraphNode, $createRangeSelection, $createTextNode, $getNearestNodeFromDOMNode as $getNearestNodeFromDOMNode$1, $getNodeByKey, $getPreviousSelection, $getRoot, $getSelection, $insertNodes, $isBlockElementNode, $isDecoratorNode, $isElementNode, $isNodeSelection, $isRangeSelection, $isRootNode, $isRootOrShadowRoot, $isTextNode, $nodesOfType, $normalizeSelection__EXPERIMENTAL, $setSelection, CLICK_COMMAND, COMMAND_PRIORITY_CRITICAL, COMMAND_PRIORITY_EDITOR, COMMAND_PRIORITY_HIGH, COMMAND_PRIORITY_LOW, COMMAND_PRIORITY_NORMAL, DROP_COMMAND, HISTORY_MERGE_TAG, INDENT_CONTENT_COMMAND, INSERT_TAB_COMMAND, KEY_ARROW_DOWN_COMMAND, KEY_ARROW_UP_COMMAND, KEY_BACKSPACE_COMMAND, KEY_DOWN_COMMAND, KEY_ESCAPE_COMMAND, KEY_TAB_COMMAND, OUTDENT_CONTENT_COMMAND, PASTE_COMMAND, ParagraphNode, SELECTION_CHANGE_COMMAND, SKIP_SCROLL_INTO_VIEW_TAG, TabNode, TextNode, createCommand, getDOMSelection, getDOMSelectionFromTarget, isHTMLElement, isModifierMatch } from "lexical";
+import { $createNodeSelection, $createParagraphNode, $createRangeSelection, $createTextNode, $getNearestNodeFromDOMNode as $getNearestNodeFromDOMNode$1, $getNodeByKey, $getPreviousSelection, $getRoot, $getSelection, $insertNodes, $isBlockElementNode, $isDecoratorNode, $isElementNode, $isNodeSelection, $isParagraphNode, $isRangeSelection, $isRootNode, $isRootOrShadowRoot, $isTextNode, $nodesOfType, $normalizeSelection__EXPERIMENTAL, $setSelection, CLICK_COMMAND, COMMAND_PRIORITY_CRITICAL, COMMAND_PRIORITY_EDITOR, COMMAND_PRIORITY_HIGH, COMMAND_PRIORITY_LOW, COMMAND_PRIORITY_NORMAL, DROP_COMMAND, HISTORY_MERGE_TAG, INDENT_CONTENT_COMMAND, INSERT_TAB_COMMAND, KEY_ARROW_DOWN_COMMAND, KEY_ARROW_LEFT_COMMAND, KEY_ARROW_RIGHT_COMMAND, KEY_ARROW_UP_COMMAND, KEY_BACKSPACE_COMMAND, KEY_DOWN_COMMAND, KEY_ESCAPE_COMMAND, KEY_TAB_COMMAND, OUTDENT_CONTENT_COMMAND, PASTE_COMMAND, ParagraphNode, SELECTION_CHANGE_COMMAND, SKIP_SCROLL_INTO_VIEW_TAG, TabNode, TextNode, createCommand, getDOMSelection, getDOMSelectionFromTarget, isHTMLElement, isModifierMatch } from "lexical";
 import { DRAG_DROP_PASTE } from "@lexical/rich-text";
 import { $filter, $findMatchingParent, $getNearestBlockElementAncestorOrThrow, $getNearestNodeOfType, $insertNodeToNearestRoot, $wrapNodeInElement, addClassNamesToElement, calculateZoomLevel, mergeRegister, removeClassNamesFromElement } from "@lexical/utils";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -15,9 +15,9 @@ import katex, { renderToString } from "katex";
 import { $isCodeHighlightNode, $isCodeNode, CodeHighlightNode, CodeNode } from "@lexical/code-core";
 import { ActionIcon, ActionIconGroup, Block, Button, Center, Dropdown, Flexbox, Hotkey, Icon, Input, InputNumber, LOBE_THEME_APP_ID, MaterialFileTypeIcon, Popover, Select, Text, TextArea } from "@lobehub/ui";
 import { createStaticStyles, cssVar, cx, useThemeMode } from "antd-style";
-import { BaselineIcon, Check, ChevronDown, ChevronRight, CopyIcon, EditIcon, ExternalLinkIcon, Grid2X2XIcon, LinkIcon, LoaderCircleIcon, MoreHorizontalIcon, PanelBottomCloseIcon, PanelLeftCloseIcon, PanelRightCloseIcon, PanelTopCloseIcon, PlusIcon, TableColumnsSplitIcon, TableRowsSplitIcon, UnlinkIcon, UploadIcon, X } from "lucide-react";
+import { BaselineIcon, Check, ChevronDown, ChevronRight, CopyIcon, EditIcon, ExternalLinkIcon, Grid2X2XIcon, GripVerticalIcon, LinkIcon, LoaderCircleIcon, MoreHorizontalIcon, PanelBottomCloseIcon, PanelLeftCloseIcon, PanelRightCloseIcon, PanelTopCloseIcon, PlusIcon, TableColumnsSplitIcon, TableRowsSplitIcon, UnlinkIcon, UploadIcon, X } from "lucide-react";
 import { createPortal } from "react-dom";
-import { Switch, message } from "antd";
+import { Button as Button$1, Dropdown as Dropdown$1, Switch, message, theme } from "antd";
 import { computePosition, flip, offset, shift } from "@floating-ui/dom";
 //#region src/editor-kernel/react/PortalContainer.tsx
 const LexicalPortalContainer = forwardRef(({ editor, node, children }, ref) => {
@@ -46,7 +46,7 @@ init_helper();
 init_hotkey();
 init_plugin();
 init_debug();
-const logger$6 = createDebugLogger("plugin", "litexml");
+const logger$9 = createDebugLogger("plugin", "litexml");
 function toArrayXml(litexml) {
 	return Array.isArray(litexml) ? litexml : [litexml];
 }
@@ -58,7 +58,7 @@ function tryParseChild(child, editor) {
 			oldNode
 		};
 	} catch (error) {
-		logger$6.error("❌ Error parsing child node:", error);
+		logger$9.error("❌ Error parsing child node:", error);
 		return {
 			newNode: null,
 			oldNode: null
@@ -171,12 +171,12 @@ function registerLiteXMLCommand(editor, dataSource) {
 							delay: true
 						}, dataSource);
 						break;
-					default: logger$6.warn(`⚠️ Unknown action type: ${action}`);
+					default: logger$9.warn(`⚠️ Unknown action type: ${action}`);
 				}
 			});
 			return false;
 		} catch (error) {
-			logger$6.error("❌ Error processing LITEXML_MODIFY_COMMAND:", error);
+			logger$9.error("❌ Error processing LITEXML_MODIFY_COMMAND:", error);
 			return false;
 		}
 	}, COMMAND_PRIORITY_EDITOR), editor.registerCommand(LITEXML_APPLY_COMMAND, (payload) => {
@@ -201,9 +201,9 @@ function handleModify(editor, dataSource, arrayXml, delay) {
 				try {
 					const { oldNode, newNode } = tryParseChild(child, editor);
 					if (oldNode && newNode) handleReplaceForApplyDelay(oldNode, newNode, modifyBlockNodes, diffNodeMap, editor);
-					else logger$6.warn(`⚠️ Node with key ${child.id} not found for diffing.`);
+					else logger$9.warn(`⚠️ Node with key ${child.id} not found for diffing.`);
 				} catch (error) {
-					logger$6.error("❌ Error replacing node:", error);
+					logger$9.error("❌ Error replacing node:", error);
 				}
 			});
 		});
@@ -227,7 +227,7 @@ function handleModify(editor, dataSource, arrayXml, delay) {
 					} else prevNode = prevNode.insertAfter(newNode);
 					else $insertNodes([newNode]);
 				} catch (error) {
-					logger$6.error("❌ Error replacing node:", error);
+					logger$9.error("❌ Error replacing node:", error);
 				}
 			});
 		});
@@ -364,7 +364,7 @@ function handleInsert(editor, payload, dataSource) {
 				});
 			}
 		} catch (error) {
-			logger$6.error("❌ Error inserting node:", error);
+			logger$9.error("❌ Error inserting node:", error);
 		}
 	});
 }
@@ -474,7 +474,7 @@ ReactNodePlugin.displayName = "ReactNodePlugin";
 //#endregion
 //#region src/plugins/litexml/data-source/litexml-data-source.ts
 init_debug();
-const logger$5 = createDebugLogger("plugin", "litexml");
+const logger$8 = createDebugLogger("plugin", "litexml");
 var IXmlWriterContext = class {
 	createXmlNode(tagName, attributes, textContent) {
 		return {
@@ -502,7 +502,7 @@ var LitexmlDataSource = class extends DataSource {
 		const xml = this.parseXMLString(litexml);
 		const inode = this.xmlToLexical(xml);
 		this.getService?.(INodeService)?.processNodeTree(inode);
-		logger$5.debug("Parsed XML to Lexical State:", inode);
+		logger$8.debug("Parsed XML to Lexical State:", inode);
 		return inode;
 	}
 	/**
@@ -523,7 +523,7 @@ var LitexmlDataSource = class extends DataSource {
 			});
 			editor.setEditorState(newState);
 		} catch (error) {
-			logger$5.error("Failed to parse XML:", error);
+			logger$8.error("Failed to parse XML:", error);
 			throw error;
 		}
 	}
@@ -558,7 +558,7 @@ var LitexmlDataSource = class extends DataSource {
 				return this.lexicalToXML(rootNode);
 			});
 		} catch (error) {
-			logger$5.error("Failed to export to XML:", error);
+			logger$8.error("Failed to export to XML:", error);
 			throw error;
 		}
 	}
@@ -873,7 +873,7 @@ const LitexmlPlugin = class extends KernelPlugin {
 };
 //#endregion
 //#region src/plugins/litexml/react/DiffNodeToolbar/style.ts
-const styles$14 = createStaticStyles(({ css, cssVar }) => ({
+const styles$15 = createStaticStyles(({ css, cssVar }) => ({
 	accept: css`
     color: ${cssVar.colorSuccess};
   `,
@@ -902,7 +902,7 @@ const ReactDiffNodeToolbar = ({ editor, node }) => {
 		editor,
 		node,
 		children: /* @__PURE__ */ jsxs(Block, {
-			className: isDarkMode ? styles$14.toolbarDark : styles$14.toolbarLight,
+			className: isDarkMode ? styles$15.toolbarDark : styles$15.toolbarLight,
 			gap: 2,
 			horizontal: true,
 			padding: 2,
@@ -910,7 +910,7 @@ const ReactDiffNodeToolbar = ({ editor, node }) => {
 			variant: "outlined",
 			children: [/* @__PURE__ */ jsx(ActionIcon, {
 				"aria-label": "Reject change",
-				className: styles$14.reject,
+				className: styles$15.reject,
 				danger: true,
 				icon: X,
 				onClick: () => {
@@ -926,7 +926,7 @@ const ReactDiffNodeToolbar = ({ editor, node }) => {
 				title: t("modifier.reject")
 			}), /* @__PURE__ */ jsx(ActionIcon, {
 				"aria-label": "Accept change",
-				className: styles$14.accept,
+				className: styles$15.accept,
 				icon: Check,
 				onClick: () => {
 					editor.dispatchCommand(LITEXML_DIFFNODE_COMMAND, {
@@ -946,7 +946,7 @@ const ReactDiffNodeToolbar = ({ editor, node }) => {
 ReactDiffNodeToolbar.displayName = "ReactDiffNodeToolbar";
 //#endregion
 //#region src/plugins/litexml/react/style.ts
-const styles$13 = createStaticStyles(({ css, cssVar }) => css`
+const styles$14 = createStaticStyles(({ css, cssVar }) => css`
     position: relative;
 
     .toolbar {
@@ -1077,7 +1077,7 @@ const ReactLiteXmlPlugin = () => {
 				editor,
 				node
 			}),
-			theme: styles$13
+			theme: styles$14
 		});
 	}, [editor]);
 	return null;
@@ -2274,8 +2274,6 @@ function createHeadlessEditor(options) {
 init_plugin();
 init_debug();
 const AUTO_COMPLETE_GUARD_LIMIT = 5e4;
-const CLEAR_PLACEHOLDER_BURST_LIMIT = 20;
-const CLEAR_PLACEHOLDER_BURST_WINDOW_MS = 1e3;
 const AutoCompletePlugin = class extends KernelPlugin {
 	static {
 		this.pluginName = "AutoCompletePlugin";
@@ -2288,11 +2286,11 @@ const AutoCompletePlugin = class extends KernelPlugin {
 		this.lastCursorPosition = null;
 		this.cursorStableTimer = null;
 		this.abortController = null;
-		this.placeholderNodes = [];
 		this.currentSuggestion = null;
+		this.placeholderAnchorPosition = null;
+		this.placeholderSelectionSnapshot = null;
 		this.markdownService = null;
 		this.skipNextTextContentListener = false;
-		this.clearPlaceholderCallTimestamps = [];
 		this.delay = config?.delay ?? 1e3;
 		kernel.registerNodes([PlaceholderNode, PlaceholderBlockNode]);
 		if (config?.theme) kernel.registerThemes(config?.theme);
@@ -2307,13 +2305,13 @@ const AutoCompletePlugin = class extends KernelPlugin {
 			editorState.read(() => {
 				if (editor.isComposing()) {
 					this.clearTimer();
-					this.clearPlaceholderNodes(editor);
+					if (this.currentSuggestion) this.clearPlaceholderNodes(editor, { restoreSelection: false });
 					return;
 				}
 				const selection = $getSelection();
 				if (!$isRangeSelection(selection) || !selection.isCollapsed()) {
 					this.clearTimer();
-					this.clearPlaceholderNodes(editor);
+					if (this.currentSuggestion) this.clearPlaceholderNodes(editor, { restoreSelection: false });
 					return;
 				}
 				const currentPosition = {
@@ -2323,7 +2321,7 @@ const AutoCompletePlugin = class extends KernelPlugin {
 				};
 				if (this.hasPositionChanged(currentPosition)) {
 					this.clearTimer();
-					this.clearPlaceholderNodes(editor);
+					if (this.currentSuggestion) this.clearPlaceholderNodes(editor, { restoreSelection: false });
 					this.abortController = new AbortController();
 					this.cursorStableTimer = window.setTimeout(() => {
 						this.handleCursorStable(editor, currentPosition);
@@ -2339,11 +2337,24 @@ const AutoCompletePlugin = class extends KernelPlugin {
 			}
 			return false;
 		}, COMMAND_PRIORITY_HIGH));
+		this.register(editor.registerCommand(KEY_ARROW_LEFT_COMMAND, () => {
+			if (this.currentSuggestion) {
+				this.clearPlaceholderNodes(editor, { restoreSelection: false });
+				return false;
+			}
+			return false;
+		}, COMMAND_PRIORITY_CRITICAL));
+		this.register(editor.registerCommand(KEY_ARROW_RIGHT_COMMAND, () => {
+			if (this.currentSuggestion) {
+				this.clearPlaceholderNodes(editor, { restoreSelection: false });
+				return false;
+			}
+			return false;
+		}, COMMAND_PRIORITY_CRITICAL));
 		this.register(editor.registerCommand(KEY_ESCAPE_COMMAND, (event) => {
 			if (this.currentSuggestion) {
 				event?.preventDefault();
 				this.clearPlaceholderNodes(editor);
-				this.currentSuggestion = null;
 				return true;
 			}
 			return false;
@@ -2353,7 +2364,7 @@ const AutoCompletePlugin = class extends KernelPlugin {
 				this.skipNextTextContentListener = false;
 				return;
 			}
-			if (this.currentSuggestion) this.clearPlaceholderNodes(editor);
+			if (this.currentSuggestion) this.clearPlaceholderNodes(editor, { restoreSelection: false });
 		}));
 	}
 	hasPositionChanged(currentPosition) {
@@ -2371,7 +2382,7 @@ const AutoCompletePlugin = class extends KernelPlugin {
 		editor.getEditorState().read(() => {
 			if (editor.isComposing()) {
 				this.clearTimer();
-				this.clearPlaceholderNodes(editor);
+				if (this.currentSuggestion) this.clearPlaceholderNodes(editor, { restoreSelection: false });
 				return;
 			}
 			if (!this.abortController || this.abortController.signal.aborted) return;
@@ -2386,9 +2397,8 @@ const AutoCompletePlugin = class extends KernelPlugin {
 			if (this.lastCursorPosition && this.isSamePosition(position, this.lastCursorPosition)) return;
 			this.lastCursorPosition = currentPosition;
 			const anchorNode = selection.anchor.getNode();
-			let selectionType = "unknown";
 			const textRet = this.getTextBeforeCursor(selection);
-			selectionType = anchorNode.getType();
+			const selectionType = anchorNode.getType();
 			if (this.config?.onAutoComplete) this.config.onAutoComplete({
 				abortSignal: this.abortController.signal,
 				afterText: textRet.textAfter,
@@ -2401,11 +2411,11 @@ const AutoCompletePlugin = class extends KernelPlugin {
 					currentSelection = $getSelection();
 				});
 				if (editor.isComposing()) {
-					this.clearPlaceholderNodes(editor);
+					this.clearPlaceholderNodes(editor, { restoreSelection: false });
 					return;
 				}
 				if (!currentSelection || !$isRangeSelection(currentSelection) || !currentSelection.isCollapsed()) {
-					this.clearPlaceholderNodes(editor);
+					this.clearPlaceholderNodes(editor, { restoreSelection: false });
 					return;
 				}
 				const newPosition = {
@@ -2414,11 +2424,12 @@ const AutoCompletePlugin = class extends KernelPlugin {
 					type: currentSelection.anchor.type
 				};
 				if (!this.isSamePosition(currentPosition, newPosition)) {
-					this.clearPlaceholderNodes(editor);
+					this.clearPlaceholderNodes(editor, { restoreSelection: false });
 					return;
 				}
 				if (result) {
 					this.currentSuggestion = result;
+					this.placeholderAnchorPosition = currentPosition;
 					this.showPlaceholderNodes(editor, result);
 					this.logger.debug("🔍 Auto-complete triggered:", {
 						afterText: textRet.textAfter,
@@ -2427,15 +2438,11 @@ const AutoCompletePlugin = class extends KernelPlugin {
 						result,
 						selectionType
 					});
-				} else this.clearPlaceholderNodes(editor);
+				} else this.clearPlaceholderNodes(editor, { restoreSelection: false });
 			});
 		});
 	}
 	getTextBeforeCursor(selection) {
-		const ret = {
-			textAfter: "",
-			textBefore: ""
-		};
 		const anchorNode = selection.anchor.getNode();
 		const anchorOffset = selection.anchor.offset;
 		let paragraphNode = anchorNode;
@@ -2447,7 +2454,10 @@ const AutoCompletePlugin = class extends KernelPlugin {
 			if (!parent) break;
 			paragraphNode = parent;
 		}
-		if (!paragraphNode) return ret;
+		if (!paragraphNode) return {
+			textAfter: "",
+			textBefore: ""
+		};
 		this.logger.debug("🔍 Paragraph Node Type:", paragraphNode, anchorNode);
 		let founded = false;
 		let recursionDepth = 0;
@@ -2503,6 +2513,8 @@ const AutoCompletePlugin = class extends KernelPlugin {
 				this.logger.warn("⚠️ No valid markdown service for placeholder");
 				return;
 			}
+			for (const node of $nodesOfType(PlaceholderNode)) node.remove();
+			for (const node of $nodesOfType(PlaceholderBlockNode)) node.remove();
 			const nodes = this.markdownService.parseMarkdownToLexical(suggestion);
 			if (nodes.children[0]) {
 				const firstChild = nodes.children[0];
@@ -2519,28 +2531,31 @@ const AutoCompletePlugin = class extends KernelPlugin {
 				};
 			}
 			const saveSel = selection.clone();
+			this.placeholderSelectionSnapshot = saveSel;
 			this.markdownService.insertIRootNode(editor, nodes, selection);
 			$setSelection(saveSel);
 		});
 	}
-	clearPlaceholderNodes(editor) {
-		const now = Date.now();
-		this.clearPlaceholderCallTimestamps = this.clearPlaceholderCallTimestamps.filter((ts) => now - ts <= CLEAR_PLACEHOLDER_BURST_WINDOW_MS);
-		if (this.clearPlaceholderCallTimestamps.length >= CLEAR_PLACEHOLDER_BURST_LIMIT) return;
-		this.clearPlaceholderCallTimestamps.push(now);
-		this.skipNextTextContentListener = true;
+	clearPlaceholderNodes(editor, options) {
+		const shouldRestoreSelection = options?.restoreSelection ?? true;
+		const restoreSelection = this.placeholderSelectionSnapshot;
 		this.currentSuggestion = null;
-		this.placeholderNodes = [];
+		this.placeholderAnchorPosition = null;
+		this.placeholderSelectionSnapshot = null;
+		this.clearTimer();
+		let hasPlaceholderNodes = false;
+		editor.getEditorState().read(() => {
+			hasPlaceholderNodes = $nodesOfType(PlaceholderNode).length > 0 || $nodesOfType(PlaceholderBlockNode).length > 0;
+		});
+		if (!hasPlaceholderNodes && !(shouldRestoreSelection && restoreSelection)) {
+			this.skipNextTextContentListener = false;
+			return;
+		}
+		this.skipNextTextContentListener = true;
 		editor.update(() => {
-			const selection = $getSelection();
-			const clonedSelection = selection ? selection.clone() : null;
-			let iterCount = 0;
-			editor.getEditorState()._nodeMap.forEach((node) => {
-				iterCount++;
-				if (iterCount > AUTO_COMPLETE_GUARD_LIMIT) throw new Error(`clearPlaceholderNodes: forEach loop > ${AUTO_COMPLETE_GUARD_LIMIT} iterations`);
-				if (node.isAttached() && ["PlaceholderBlock", "PlaceholderInline"].includes(node.getType())) node.remove();
-			});
-			if (clonedSelection) $setSelection(clonedSelection);
+			for (const node of $nodesOfType(PlaceholderNode)) node.remove();
+			for (const node of $nodesOfType(PlaceholderBlockNode)) node.remove();
+			if (shouldRestoreSelection && restoreSelection) $setSelection(restoreSelection);
 		});
 	}
 	applySuggestion(editor) {
@@ -2549,13 +2564,11 @@ const AutoCompletePlugin = class extends KernelPlugin {
 		editor.update(() => {
 			const selection = $getSelection();
 			if (!$isRangeSelection(selection) || !selection.isCollapsed() || !this.markdownService) return;
-			editor.getEditorState()._nodeMap.forEach((node) => {
-				if (node.isAttached() && ["PlaceholderBlock", "PlaceholderInline"].includes(node.getType())) node.remove();
-			});
+			for (const node of $nodesOfType(PlaceholderNode)) node.remove();
+			for (const node of $nodesOfType(PlaceholderBlockNode)) node.remove();
 			const nodes = this.markdownService.parseMarkdownToLexical(markdown);
 			this.markdownService.insertIRootNode(editor, nodes, selection);
-			this.clearPlaceholderNodes(editor);
-			this.currentSuggestion = null;
+			this.clearPlaceholderNodes(editor, { restoreSelection: false });
 		});
 	}
 	isSamePosition(pos1, pos2) {
@@ -2563,13 +2576,12 @@ const AutoCompletePlugin = class extends KernelPlugin {
 	}
 	destroy() {
 		this.clearTimer();
-		this.placeholderNodes = [];
 		super.destroy();
 	}
 };
 //#endregion
 //#region src/plugins/auto-complete/react/style.ts
-const styles$12 = createStaticStyles(({ css }) => ({
+const styles$13 = createStaticStyles(({ css }) => ({
 	placeholderBlock: css`
     opacity: 0.4;
   `,
@@ -2586,8 +2598,8 @@ const ReactAutoCompletePlugin = ({ onAutoComplete, delay }) => {
 			delay,
 			onAutoComplete,
 			theme: {
-				placeholderBlock: cx(styles$12.placeholderBlock),
-				placeholderInline: cx(styles$12.placeholderInline)
+				placeholderBlock: cx(styles$13.placeholderBlock),
+				placeholderInline: cx(styles$13.placeholderInline)
 			}
 		});
 	}, []);
@@ -2595,6 +2607,1119 @@ const ReactAutoCompletePlugin = ({ onAutoComplete, delay }) => {
 };
 ReactAutoCompletePlugin.displayName = "ReactAutoCompletePlugin";
 //#endregion
+//#region src/plugins/block/command/index.ts
+init_debug();
+const MOVE_BLOCK_COMMAND = createCommand("MOVE_BLOCK_COMMAND");
+const logger$7 = createDebugLogger("plugin", "block-command");
+const getListParent = (node) => {
+	if (!node) return null;
+	const parent = node.getParent();
+	return $isListNode(parent) ? parent : null;
+};
+const getTopListContextFromItem = (item) => {
+	let currentItem = item;
+	let currentList = getListParent(item);
+	while (currentList && $isListItemNode(currentList.getParent())) {
+		currentItem = currentList.getParent();
+		currentList = getListParent(currentItem);
+	}
+	return {
+		item: currentItem,
+		list: currentList
+	};
+};
+const cloneListTail = (listNode, tailStart, fallbackStartValue) => {
+	if (!tailStart) return null;
+	const newListNode = $createListNode(listNode.getListType(), fallbackStartValue);
+	let current = tailStart;
+	while (current) {
+		const nextSibling = current.getNextSibling();
+		current.remove();
+		newListNode.append(current);
+		current = nextSibling;
+	}
+	return newListNode;
+};
+const alignListItemDepth = (item, target) => {
+	const targetWithIndent = target;
+	const itemWithIndent = item;
+	if (typeof targetWithIndent.getIndent === "function" && typeof itemWithIndent.setIndent === "function") itemWithIndent.setIndent(targetWithIndent.getIndent());
+};
+const cleanupEmptyListForItem = (listItem) => {
+	const parentList = getListParent(listItem);
+	if (parentList && parentList.getChildrenSize() === 0) parentList.remove();
+};
+const moveBlockNode = (payload) => {
+	logger$7.debug("start", payload);
+	const sourceNode = $getNodeByKey(payload.sourceBlockId);
+	const targetNode = $getNodeByKey(payload.targetBlockId);
+	if (!sourceNode || !targetNode) {
+		logger$7.debug("abort: node-not-found", {
+			sourceFound: Boolean(sourceNode),
+			targetFound: Boolean(targetNode)
+		});
+		return;
+	}
+	if (sourceNode === targetNode) {
+		logger$7.debug("abort: source-equals-target");
+		return;
+	}
+	if (!$isListItemNode(targetNode)) {
+		const sourceIsListItem = $isListItemNode(sourceNode);
+		let movingNode = sourceNode;
+		logger$7.debug("branch: normal-block-target", {
+			placement: payload.placement,
+			targetType: targetNode.getType()
+		});
+		if (sourceIsListItem) {
+			const sourceListItem = sourceNode;
+			const paragraphNode = $createParagraphNode();
+			paragraphNode.append(...sourceListItem.getChildren());
+			sourceListItem.remove();
+			cleanupEmptyListForItem(sourceListItem);
+			movingNode = paragraphNode;
+			logger$7.debug("convert: listItem-to-paragraph", { sourceType: sourceNode.getType() });
+		}
+		if (payload.placement === "before") targetNode.insertBefore(movingNode);
+		else targetNode.insertAfter(movingNode);
+		logger$7.debug("done: normal-block-target");
+		return;
+	}
+	const targetListItem = targetNode;
+	const sourceIsListItem = $isListItemNode(sourceNode);
+	const sourceIsParagraph = $isParagraphNode(sourceNode);
+	if (sourceIsListItem || sourceIsParagraph) {
+		logger$7.debug("branch: list-insert-with-item-or-paragraph", {
+			sourceIsListItem,
+			sourceIsParagraph,
+			targetType: targetListItem.getType()
+		});
+		let movingListItem;
+		if (sourceIsListItem) movingListItem = sourceNode;
+		else {
+			const sourceParagraph = sourceNode;
+			const targetListType = getListParent(targetListItem)?.getListType();
+			const targetChecked = targetListItem.getChecked?.();
+			const newListItem = $createListItemNode(targetListType === "check" ? targetChecked : void 0);
+			newListItem.append(...sourceParagraph.getChildren());
+			sourceParagraph.remove();
+			movingListItem = newListItem;
+		}
+		alignListItemDepth(movingListItem, targetListItem);
+		if (payload.placement === "before") targetListItem.insertBefore(movingListItem);
+		else targetListItem.insertAfter(movingListItem);
+		logger$7.debug("done: list-insert-with-item-or-paragraph");
+		return;
+	}
+	const topContext = getTopListContextFromItem(targetListItem);
+	const topListNode = topContext.list;
+	const topListItem = topContext.item;
+	if (!topListNode) {
+		logger$7.debug("branch: list-target-without-top-list", { placement: payload.placement });
+		if (payload.placement === "before") targetListItem.insertBefore(sourceNode);
+		else targetListItem.insertAfter(sourceNode);
+		logger$7.debug("done: list-target-without-top-list");
+		return;
+	}
+	const tailStart = payload.placement === "before" ? topListItem : topListItem.getNextSibling();
+	if (tailStart === topListItem && topListItem.getPreviousSibling() === null) {
+		logger$7.debug("branch: split-list-head-insert-before-list");
+		topListNode.insertBefore(sourceNode);
+		logger$7.debug("done: split-list-head-insert-before-list");
+		return;
+	}
+	if (!tailStart) {
+		logger$7.debug("branch: split-list-tail-insert-after-list");
+		topListNode.insertAfter(sourceNode);
+		logger$7.debug("done: split-list-tail-insert-after-list");
+		return;
+	}
+	const listStartValue = $isListItemNode(tailStart) && typeof tailStart.getValue === "function" ? tailStart.getValue() : 1;
+	const newTailList = cloneListTail(topListNode, tailStart, listStartValue);
+	logger$7.debug("branch: split-list-middle", {
+		hasNewTailList: Boolean(newTailList),
+		listStartValue,
+		tailStartType: tailStart.getType()
+	});
+	topListNode.insertAfter(sourceNode);
+	if (newTailList) sourceNode.insertAfter(newTailList);
+	if (topListNode.getChildrenSize() === 0) topListNode.remove();
+	if (!$isRootNode(sourceNode.getParent())) {
+		const parent = sourceNode.getParent();
+		if (parent && !$isRootNode(parent) && $isListItemNode(parent)) {
+			const parentList = getListParent(parent);
+			if (parentList && parentList.getChildrenSize() === 0) parentList.remove();
+		}
+	}
+	logger$7.debug("done: split-list-middle");
+};
+function registerBlockMoveCommand(editor) {
+	const unregister = editor.registerCommand(MOVE_BLOCK_COMMAND, (payload) => {
+		logger$7.debug("received-command", payload);
+		moveBlockNode(payload);
+		return true;
+	}, COMMAND_PRIORITY_EDITOR);
+	return () => {
+		unregister();
+	};
+}
+//#endregion
+//#region src/plugins/block/plugin/index.ts
+init_plugin();
+const PATCHED_NODE_TYPES = /* @__PURE__ */ new Set();
+const resolveNodeClass = (node) => {
+	if (typeof node === "function") return node;
+	if (typeof node === "object" && node && typeof node.replace === "function") return node.replace;
+	return null;
+};
+const patchBlockNodeCreateDOM = (nodeClass, attributeName) => {
+	const type = nodeClass.getType?.();
+	if (!type || PATCHED_NODE_TYPES.has(type)) return;
+	const originCreateDOM = nodeClass.prototype.createDOM;
+	if (typeof originCreateDOM !== "function") return;
+	nodeClass.prototype.createDOM = function patchedCreateDOM(config, editor) {
+		const dom = originCreateDOM.call(this, config, editor);
+		const latestNode = typeof this.getLatest === "function" ? this.getLatest() : this;
+		const isRootOrListChainToRoot = (() => {
+			let current = typeof latestNode.getParent === "function" ? latestNode.getParent() : null;
+			if (!current || typeof current.getType !== "function") return false;
+			if (current.getType() === "root") return true;
+			while (current && typeof current.getType === "function") {
+				const parentType = current.getType();
+				if (parentType === "root") return true;
+				if (parentType !== "list" && parentType !== "listitem") return false;
+				current = typeof current.getParent === "function" ? current.getParent() : null;
+			}
+			return false;
+		})();
+		const nodeKey = typeof latestNode.getKey === "function" ? latestNode.getKey() : this.getKey();
+		const nodeType = typeof latestNode.getType === "function" ? latestNode.getType() : "";
+		if (dom && typeof latestNode.isInline === "function" && !latestNode.isInline() && nodeType !== "list" && isRootOrListChainToRoot) {
+			dom.dataset.blockId = nodeKey;
+			if (attributeName !== "data-block-id") dom.setAttribute(attributeName, nodeKey);
+		}
+		return dom;
+	};
+	PATCHED_NODE_TYPES.add(type);
+};
+const BlockPlugin = class extends KernelPlugin {
+	static {
+		this.pluginName = "BlockPlugin";
+	}
+	constructor(kernel, config) {
+		super();
+		this.kernel = kernel;
+		this.config = config;
+		const attributeName = config?.attributeName || "data-block-id";
+		const rootClassName = config?.className?.trim();
+		kernel.registerServiceHotReload(IBlockMenuService, new BlockMenuService());
+		if (rootClassName) this.registerRootClassName(kernel, rootClassName);
+		patchBlockNodeCreateDOM(ParagraphNode, attributeName);
+		this.registerNodeTransform(kernel, (node) => {
+			const nodeClass = resolveNodeClass(node);
+			if (!nodeClass) return node;
+			patchBlockNodeCreateDOM(nodeClass, attributeName);
+			return node;
+		});
+	}
+	onInit(editor) {
+		const blockMenuService = this.kernel.requireService(IBlockMenuService);
+		if (blockMenuService) {
+			const unregisterDeleteMenu = blockMenuService.registerMenu({
+				key: "__block_default_delete",
+				label: (context) => context.editor.t("block.delete"),
+				onClick: (context) => {
+					const lexicalEditor = context.editor.getLexicalEditor();
+					if (!lexicalEditor) return;
+					lexicalEditor.update(() => {
+						const target = $getNodeByKey(context.blockId);
+						if (!target) return;
+						target.remove();
+					});
+				},
+				order: 999
+			});
+			this.register(unregisterDeleteMenu);
+		}
+		this.register(registerBlockMoveCommand(editor));
+	}
+};
+//#endregion
+//#region src/plugins/block/react/core/runtime-context.ts
+const createRuntimeContext = () => ({
+	dragAutoScrollRaf: null,
+	dragBlocks: [],
+	dragCleanup: null,
+	dragMoved: false,
+	dragPointerY: null,
+	dragRaf: null,
+	dragStartPoint: null,
+	dragStarted: false,
+	dragTarget: null,
+	draggingSource: null,
+	hideTimer: null,
+	hoveredBlock: null,
+	ignoreNextHandleClick: false,
+	operationMenuAnchorBlockId: null
+});
+//#endregion
+//#region src/plugins/block/react/drag/drag-utils.ts
+const collectDragBlocks = (root) => {
+	if (!root) return [];
+	return Array.from(root.querySelectorAll("[data-block-id]")).reduce((acc, block) => {
+		const blockId = block.dataset.blockId;
+		if (!blockId) return acc;
+		const rect = block.getBoundingClientRect();
+		if (rect.height <= 0) return acc;
+		acc.push({
+			block,
+			blockId,
+			rect: {
+				bottom: rect.bottom,
+				height: rect.height,
+				left: rect.left,
+				top: rect.top,
+				width: rect.width
+			}
+		});
+		return acc;
+	}, []).sort((a, b) => a.rect.top - b.rect.top);
+};
+const resolveScrollContainers = (root) => {
+	if (!root) return [];
+	let element = root;
+	const containers = [];
+	while (element) {
+		const overflowY = window.getComputedStyle(element).overflowY;
+		if ((overflowY === "auto" || overflowY === "scroll") && element.scrollHeight > element.clientHeight) containers.push(element);
+		element = element.parentElement;
+	}
+	const pageScroller = document.scrollingElement;
+	if (pageScroller && !containers.includes(pageScroller)) containers.push(pageScroller);
+	return containers;
+};
+const getAutoScrollDelta = (pointerY, container) => {
+	const isPageScroller = container === document.scrollingElement;
+	const top = isPageScroller ? 0 : container.getBoundingClientRect().top;
+	const bottom = isPageScroller ? window.innerHeight : container.getBoundingClientRect().bottom;
+	if (pointerY < top + 80) {
+		const ratio = (top + 80 - pointerY) / 80;
+		return -Math.max(1, Math.round(ratio * 18));
+	}
+	if (pointerY > bottom - 80) {
+		const ratio = (pointerY - (bottom - 80)) / 80;
+		return Math.max(1, Math.round(ratio * 18));
+	}
+	return 0;
+};
+const resolveNearestInsertionSlot = (sourceBlockId, blocks, y) => {
+	if (blocks.length === 0) return null;
+	const slots = [];
+	const first = blocks[0];
+	slots.push({
+		left: first.rect.left,
+		placement: "before",
+		sourceBlockId,
+		targetBlockId: first.blockId,
+		width: first.rect.width,
+		y: first.rect.top
+	});
+	for (let i = 0; i < blocks.length - 1; i++) {
+		const next = blocks[i + 1];
+		slots.push({
+			left: next.rect.left,
+			placement: "before",
+			sourceBlockId,
+			targetBlockId: next.blockId,
+			width: next.rect.width,
+			y: next.rect.top
+		});
+	}
+	const last = blocks[blocks.length - 1];
+	slots.push({
+		left: last.rect.left,
+		placement: "after",
+		sourceBlockId,
+		targetBlockId: last.blockId,
+		width: last.rect.width,
+		y: last.rect.bottom
+	});
+	let bestSlot = slots[0];
+	let bestDistance = Math.abs(y - bestSlot.y);
+	for (let i = 1; i < slots.length; i++) {
+		const slot = slots[i];
+		const distance = Math.abs(y - slot.y);
+		if (distance < bestDistance) {
+			bestSlot = slot;
+			bestDistance = distance;
+		}
+	}
+	return bestSlot;
+};
+//#endregion
+//#region src/plugins/block/react/drag/drag-session.ts
+init_debug();
+const logger$6 = createDebugLogger("plugin", "block-react");
+const DRAG_GHOST_OFFSET_X = 14;
+const DRAG_GHOST_OFFSET_Y = 14;
+const DRAG_SOURCE_OPACITY = "0.45";
+const LIST_ITEM_GHOST_PADDING_INLINE_START = 24;
+const createDragGhostContent = (sourceBlock, clone) => {
+	if (sourceBlock.tagName !== "LI") return clone;
+	const list = sourceBlock.parentElement;
+	if (!list || list.tagName !== "UL" && list.tagName !== "OL") return clone;
+	const listClone = list.cloneNode(false);
+	listClone.style.margin = "0";
+	listClone.style.paddingInlineStart = `${LIST_ITEM_GHOST_PADDING_INLINE_START}px`;
+	listClone.style.pointerEvents = "none";
+	listClone.style.width = `calc(100% - ${LIST_ITEM_GHOST_PADDING_INLINE_START}px)`;
+	listClone.append(clone);
+	return listClone;
+};
+const createDragGhost = (sourceBlock, x, y, container) => {
+	const rect = sourceBlock.getBoundingClientRect();
+	const ghost = document.createElement("div");
+	const clone = sourceBlock.cloneNode(true);
+	ghost.dataset.blockDragGhost = "true";
+	ghost.setAttribute("aria-hidden", "true");
+	ghost.style.position = "fixed";
+	ghost.style.top = "0";
+	ghost.style.left = "0";
+	ghost.style.pointerEvents = "none";
+	ghost.style.zIndex = "10001";
+	ghost.style.opacity = "0.5";
+	ghost.style.width = `${rect.width}px`;
+	ghost.style.height = `${rect.height}px`;
+	ghost.style.overflow = "hidden";
+	ghost.style.borderRadius = "8px";
+	ghost.style.boxShadow = "0 10px 30px rgba(0, 0, 0, 0.12), 0 0 0 1px var(--lobe-color-border-secondary, rgba(0, 0, 0, 0.06)) inset";
+	ghost.style.transform = `translate3d(${x + DRAG_GHOST_OFFSET_X}px, ${y + DRAG_GHOST_OFFSET_Y}px, 0)`;
+	clone.style.margin = "0";
+	clone.style.pointerEvents = "none";
+	clone.style.width = "100%";
+	clone.style.height = "100%";
+	clone.setAttribute("contenteditable", "false");
+	clone.querySelectorAll("[contenteditable]").forEach((element) => {
+		element.setAttribute("contenteditable", "false");
+	});
+	ghost.append(createDragGhostContent(sourceBlock, clone));
+	(container || document.body).append(ghost);
+	return ghost;
+};
+const updateDragGhostPosition = (ghost, x, y) => {
+	ghost.style.transform = `translate3d(${x + DRAG_GHOST_OFFSET_X}px, ${y + DRAG_GHOST_OFFSET_Y}px, 0)`;
+};
+const removeDragGhost = (ghost) => {
+	if (!ghost) return;
+	ghost.remove();
+};
+const applyDragSourceOpacity = (sourceBlock) => {
+	const previousOpacity = sourceBlock.style.opacity;
+	sourceBlock.style.opacity = DRAG_SOURCE_OPACITY;
+	return () => {
+		sourceBlock.style.opacity = previousOpacity;
+	};
+};
+const startBlockDragSession = ({ clientX, clientY, clearDragPreview, contextRef, dragGhostContainer, editor, menuContext, onDraggingChange, onDragTargetResolve, setDragIndicator, setOperationMenuContext, setOperationMenuOpen, toggleOperationMenu }) => {
+	setOperationMenuOpen(false);
+	let dragGhost = null;
+	let restoreSourceOpacity = null;
+	contextRef.current.dragStartPoint = {
+		x: clientX,
+		y: clientY
+	};
+	contextRef.current.dragStarted = false;
+	contextRef.current.dragMoved = false;
+	contextRef.current.dragCleanup?.();
+	contextRef.current.dragCleanup = null;
+	if (contextRef.current.hideTimer !== null) {
+		window.clearTimeout(contextRef.current.hideTimer);
+		contextRef.current.hideTimer = null;
+	}
+	contextRef.current.draggingSource = {
+		blockElement: menuContext.blockElement,
+		blockId: menuContext.blockId
+	};
+	contextRef.current.dragPointerY = clientY;
+	contextRef.current.dragBlocks = collectDragBlocks(editor.getRootElement());
+	const refreshDragBlocksSnapshot = () => {
+		if (!contextRef.current.draggingSource) return;
+		contextRef.current.dragBlocks = collectDragBlocks(editor.getRootElement());
+	};
+	const updateDragPreview = (y) => {
+		const source = contextRef.current.draggingSource;
+		const blocks = contextRef.current.dragBlocks;
+		if (!source || blocks.length === 0) {
+			clearDragPreview();
+			return;
+		}
+		const bestSlot = resolveNearestInsertionSlot(source.blockId, blocks, y);
+		if (!bestSlot) {
+			clearDragPreview();
+			return;
+		}
+		contextRef.current.dragTarget = {
+			placement: bestSlot.placement,
+			sourceBlockId: bestSlot.sourceBlockId,
+			targetBlockId: bestSlot.targetBlockId
+		};
+		setDragIndicator({
+			left: bestSlot.left,
+			top: bestSlot.y,
+			width: bestSlot.width
+		});
+	};
+	const scrollContainers = resolveScrollContainers(editor.getRootElement());
+	const onPointerMove = (pointerEvent) => {
+		contextRef.current.dragPointerY = pointerEvent.clientY;
+		if (!contextRef.current.dragStarted && contextRef.current.dragStartPoint) {
+			if (Math.hypot(pointerEvent.clientX - contextRef.current.dragStartPoint.x, pointerEvent.clientY - contextRef.current.dragStartPoint.y) >= 10) {
+				contextRef.current.dragStarted = true;
+				contextRef.current.dragMoved = true;
+				contextRef.current.ignoreNextHandleClick = true;
+				onDraggingChange?.(true);
+				setOperationMenuOpen(false);
+				setOperationMenuContext(null);
+				if (!dragGhost && contextRef.current.draggingSource) {
+					dragGhost = createDragGhost(contextRef.current.draggingSource.blockElement, pointerEvent.clientX, pointerEvent.clientY, dragGhostContainer || editor.getRootElement()?.parentElement);
+					if (!restoreSourceOpacity) restoreSourceOpacity = applyDragSourceOpacity(contextRef.current.draggingSource.blockElement);
+				}
+			}
+		}
+		if (!contextRef.current.dragStarted) return;
+		if (dragGhost) updateDragGhostPosition(dragGhost, pointerEvent.clientX, pointerEvent.clientY);
+		if (contextRef.current.dragRaf !== null) return;
+		contextRef.current.dragRaf = window.requestAnimationFrame(() => {
+			contextRef.current.dragRaf = null;
+			if (contextRef.current.dragPointerY === null) {
+				clearDragPreview();
+				return;
+			}
+			updateDragPreview(contextRef.current.dragPointerY);
+		});
+	};
+	const onViewportChange = () => {
+		refreshDragBlocksSnapshot();
+		if (contextRef.current.dragPointerY !== null) updateDragPreview(contextRef.current.dragPointerY);
+	};
+	const onPointerUp = () => {
+		if (!contextRef.current.dragStarted && !contextRef.current.dragMoved) {
+			toggleOperationMenu(menuContext);
+			contextRef.current.ignoreNextHandleClick = true;
+			contextRef.current.draggingSource = null;
+			contextRef.current.dragPointerY = null;
+			contextRef.current.dragBlocks = [];
+			contextRef.current.dragStartPoint = null;
+			removeDragGhost(dragGhost);
+			dragGhost = null;
+			restoreSourceOpacity?.();
+			restoreSourceOpacity = null;
+			onDraggingChange?.(false);
+			window.removeEventListener("pointermove", onPointerMove, true);
+			window.removeEventListener("pointerup", onPointerUp, true);
+			window.removeEventListener("resize", onViewportChange);
+			document.removeEventListener("scroll", onViewportChange, true);
+			contextRef.current.dragCleanup = null;
+			return;
+		}
+		const finalTarget = contextRef.current.dragTarget;
+		if (finalTarget) {
+			logger$6.debug("drag-end", {
+				位置: finalTarget.placement === "before" ? "上方" : "下方",
+				位置节点id: finalTarget.targetBlockId,
+				插入节点id: finalTarget.sourceBlockId
+			});
+			const handled = editor.dispatchCommand(MOVE_BLOCK_COMMAND, finalTarget);
+			logger$6.debug("move-block-command-handled", handled);
+		}
+		onDragTargetResolve?.(contextRef.current.dragTarget);
+		if (contextRef.current.dragRaf !== null) {
+			window.cancelAnimationFrame(contextRef.current.dragRaf);
+			contextRef.current.dragRaf = null;
+		}
+		if (contextRef.current.dragAutoScrollRaf !== null) {
+			window.cancelAnimationFrame(contextRef.current.dragAutoScrollRaf);
+			contextRef.current.dragAutoScrollRaf = null;
+		}
+		contextRef.current.draggingSource = null;
+		contextRef.current.dragPointerY = null;
+		contextRef.current.dragBlocks = [];
+		contextRef.current.dragStartPoint = null;
+		removeDragGhost(dragGhost);
+		dragGhost = null;
+		restoreSourceOpacity?.();
+		restoreSourceOpacity = null;
+		onDraggingChange?.(false);
+		clearDragPreview();
+		window.removeEventListener("pointermove", onPointerMove, true);
+		window.removeEventListener("pointerup", onPointerUp, true);
+		window.removeEventListener("resize", onViewportChange);
+		document.removeEventListener("scroll", onViewportChange, true);
+		contextRef.current.dragCleanup = null;
+	};
+	window.addEventListener("pointermove", onPointerMove, true);
+	window.addEventListener("pointerup", onPointerUp, true);
+	window.addEventListener("resize", onViewportChange);
+	document.addEventListener("scroll", onViewportChange, true);
+	const runAutoScroll = () => {
+		contextRef.current.dragAutoScrollRaf = window.requestAnimationFrame(runAutoScroll);
+		if (!contextRef.current.draggingSource || contextRef.current.dragPointerY === null || !contextRef.current.dragStarted) return;
+		let didScroll = false;
+		for (const scrollContainer of scrollContainers) {
+			const delta = getAutoScrollDelta(contextRef.current.dragPointerY, scrollContainer);
+			if (delta === 0) continue;
+			const maxScrollTop = scrollContainer.scrollHeight - scrollContainer.clientHeight;
+			const nextScrollTop = Math.max(0, Math.min(maxScrollTop, scrollContainer.scrollTop + delta));
+			if (nextScrollTop === scrollContainer.scrollTop) continue;
+			scrollContainer.scrollTop = nextScrollTop;
+			didScroll = true;
+		}
+		if (didScroll) {
+			refreshDragBlocksSnapshot();
+			if (contextRef.current.dragPointerY !== null) updateDragPreview(contextRef.current.dragPointerY);
+			return;
+		}
+		const blocks = contextRef.current.dragBlocks;
+		if (blocks.length === 0) return;
+		const pointerY = contextRef.current.dragPointerY;
+		const nearBottom = pointerY > window.innerHeight - 80;
+		const nearTop = pointerY < 80;
+		const lastBlock = blocks[blocks.length - 1];
+		if (nearBottom) lastBlock.block.scrollIntoView({ block: "end" });
+		else if (nearTop) blocks[0].block.scrollIntoView({ block: "start" });
+		refreshDragBlocksSnapshot();
+		if (contextRef.current.dragPointerY !== null) updateDragPreview(contextRef.current.dragPointerY);
+	};
+	contextRef.current.dragAutoScrollRaf = window.requestAnimationFrame(runAutoScroll);
+	contextRef.current.dragCleanup = () => {
+		if (contextRef.current.dragRaf !== null) {
+			window.cancelAnimationFrame(contextRef.current.dragRaf);
+			contextRef.current.dragRaf = null;
+		}
+		if (contextRef.current.dragAutoScrollRaf !== null) {
+			window.cancelAnimationFrame(contextRef.current.dragAutoScrollRaf);
+			contextRef.current.dragAutoScrollRaf = null;
+		}
+		contextRef.current.draggingSource = null;
+		contextRef.current.dragPointerY = null;
+		contextRef.current.dragBlocks = [];
+		contextRef.current.dragStartPoint = null;
+		removeDragGhost(dragGhost);
+		dragGhost = null;
+		restoreSourceOpacity?.();
+		restoreSourceOpacity = null;
+		onDraggingChange?.(false);
+		clearDragPreview();
+		window.removeEventListener("pointermove", onPointerMove, true);
+		window.removeEventListener("pointerup", onPointerUp, true);
+		window.removeEventListener("resize", onViewportChange);
+		document.removeEventListener("scroll", onViewportChange, true);
+	};
+};
+//#endregion
+//#region src/plugins/block/react/style.ts
+const styles$12 = createStaticStyles(({ css, cssVar }) => ({
+	dragHandle: css`
+    cursor: grab !important;
+
+    &:active {
+      cursor: grabbing !important;
+    }
+  `,
+	dragIndicator: css`
+    pointer-events: none;
+
+    position: fixed;
+    z-index: 10000;
+
+    height: 2px;
+    border-radius: 999px;
+
+    background: var(--lobe-color-primary, ${cssVar.colorPrimary});
+  `,
+	dragLayer: css`
+    pointer-events: none;
+
+    position: fixed;
+    z-index: 10001;
+    inset: 0;
+
+    overflow: visible;
+  `,
+	menu: css`
+    pointer-events: auto;
+    position: fixed;
+    z-index: 100;
+    transition:
+      inset-inline-start 200ms ease,
+      inset-block-start 200ms ease;
+  `,
+	menuInner: css`
+    display: flex;
+    gap: 4px;
+    align-items: center;
+
+    min-width: 28px;
+    min-height: 28px;
+    padding: 2px;
+    border-radius: 8px;
+
+    background: transparent;
+    box-shadow: none;
+
+    transition:
+      background 120ms ease,
+      box-shadow 120ms ease;
+
+    &:hover {
+      background: var(--lobe-color-fill-secondary, ${cssVar.colorFillSecondary});
+      box-shadow: 0 0 0 1px ${cssVar.colorBorderSecondary} inset;
+    }
+  `,
+	root: css`
+    padding-inline: 54px 54px;
+  `
+}));
+//#endregion
+//#region src/plugins/block/react/ReactBlockPlugin.tsx
+init_debug();
+const logger$5 = createDebugLogger("plugin", "block-react");
+const OPERATION_MENU_OVERLAY_CLASS = "lobe-block-operation-dropdown";
+const ReactBlockPlugin = (props) => {
+	const { token } = theme.useToken();
+	const [editor] = useLexicalComposerContext();
+	const { rootClassName, className, attributeName, locale, onHoverBlockChange, onDragTargetChange, onDragTargetResolve } = props;
+	const mergedRootClassName = cx(styles$12.root, rootClassName?.trim() || className?.trim());
+	const menuRef = useRef(null);
+	const dragLayerRef = useRef(null);
+	const contextRef = useRef(createRuntimeContext());
+	const [hoveredBlock, setHoveredBlock] = useState(null);
+	const [menuVersion, setMenuVersion] = useState(0);
+	const [menuPosition, setMenuPosition] = useState({});
+	const [operationMenuOpen, setOperationMenuOpen] = useState(false);
+	const [operationMenuContext, setOperationMenuContext] = useState(null);
+	const [dragIndicator, setDragIndicator] = useState(null);
+	const [dragLayerContainer, setDragLayerContainer] = useState(null);
+	const [isDragging, setIsDragging] = useState(false);
+	const [blockMenuService, setBlockMenuService] = useState(null);
+	useLayoutEffect(() => {
+		if (locale) editor.registerLocale(locale);
+		editor.registerPlugin(BlockPlugin, {
+			attributeName,
+			className: mergedRootClassName
+		});
+	}, [
+		attributeName,
+		editor,
+		locale,
+		mergedRootClassName
+	]);
+	useLexicalEditor(() => {
+		const service = editor.requireService(IBlockMenuService);
+		if (!service) {
+			logger$5.warn("BlockMenuService not found");
+			return;
+		}
+		setBlockMenuService(service);
+		return () => {
+			setBlockMenuService((current) => current === service ? null : current);
+		};
+	}, []);
+	useEffect(() => {
+		contextRef.current.hoveredBlock = hoveredBlock;
+	}, [hoveredBlock]);
+	useEffect(() => {
+		if (!blockMenuService) return;
+		return blockMenuService.subscribe(() => {
+			setMenuVersion((v) => v + 1);
+		});
+	}, [blockMenuService]);
+	useEffect(() => {
+		return () => {
+			contextRef.current.dragCleanup?.();
+			contextRef.current.dragCleanup = null;
+			setIsDragging(false);
+		};
+	}, []);
+	useEffect(() => {
+		let raf = null;
+		const syncDragLayerContainer = () => {
+			const container = editor.getRootElement()?.parentElement ?? null;
+			setDragLayerContainer((current) => current === container ? current : container);
+			if (!container) raf = window.requestAnimationFrame(syncDragLayerContainer);
+		};
+		syncDragLayerContainer();
+		return () => {
+			if (raf !== null) window.cancelAnimationFrame(raf);
+		};
+	}, [editor]);
+	useEffect(() => {
+		let hoverRaf = null;
+		let blockRectsCache = collectDragBlocks(editor.getRootElement());
+		let blockRectsDirty = true;
+		let latestPointer = null;
+		const markBlockRectsDirty = () => {
+			blockRectsDirty = true;
+		};
+		const getBlockRects = (root) => {
+			if (blockRectsDirty) {
+				blockRectsCache = collectDragBlocks(root);
+				blockRectsDirty = false;
+			}
+			return blockRectsCache;
+		};
+		const resolveBlockByY = (rects, y) => {
+			if (rects.length === 0) return null;
+			let left = 0;
+			let right = rects.length - 1;
+			while (left <= right) {
+				const mid = left + right >> 1;
+				const entry = rects[mid];
+				if (y < entry.rect.top) {
+					right = mid - 1;
+					continue;
+				}
+				if (y > entry.rect.bottom) {
+					left = mid + 1;
+					continue;
+				}
+				return entry;
+			}
+			const nextIndex = Math.min(Math.max(left, 0), rects.length - 1);
+			const prevIndex = Math.min(Math.max(right, 0), rects.length - 1);
+			const next = rects[nextIndex];
+			const prev = rects[prevIndex];
+			if (!next) return prev || null;
+			if (!prev) return next || null;
+			return Math.min(Math.abs(y - next.rect.top), Math.abs(y - next.rect.bottom)) < Math.min(Math.abs(y - prev.rect.top), Math.abs(y - prev.rect.bottom)) ? next : prev;
+		};
+		const isInRootLeftPaddingArea = (root, clientX, clientY) => {
+			const rootRect = root.getBoundingClientRect();
+			if (!(clientX >= rootRect.left && clientX <= rootRect.right && clientY >= rootRect.top && clientY <= rootRect.bottom)) return false;
+			const paddingLeft = Number.parseFloat(window.getComputedStyle(root).paddingLeft || "0");
+			if (paddingLeft <= 0) return false;
+			return clientX <= rootRect.left + paddingLeft;
+		};
+		const getHoveredBlock = (target, clientX, clientY) => {
+			const root = editor.getRootElement();
+			if (!root || !(target instanceof Node)) return null;
+			const targetElement = target instanceof Element ? target : target.parentElement;
+			if (!targetElement) return null;
+			if (menuRef.current?.contains(targetElement)) return contextRef.current.hoveredBlock;
+			if (targetElement.closest(`.${OPERATION_MENU_OVERLAY_CLASS}`)) return contextRef.current.hoveredBlock;
+			const blockElement = targetElement.closest("[data-block-id]");
+			if (blockElement instanceof HTMLElement && root.contains(blockElement)) {
+				const blockId = blockElement.dataset.blockId;
+				if (!blockId) return null;
+				return {
+					blockElement,
+					blockId
+				};
+			}
+			if (!root.contains(targetElement)) return null;
+			if (!isInRootLeftPaddingArea(root, clientX, clientY)) return null;
+			const rects = getBlockRects(root);
+			if (rects.length === 0) return null;
+			const entry = resolveBlockByY(rects, clientY);
+			if (!entry) return null;
+			return {
+				blockElement: entry.block,
+				blockId: entry.blockId
+			};
+		};
+		const processHover = () => {
+			if (!latestPointer) return;
+			if (contextRef.current.draggingSource) return;
+			const { clientX, clientY, target } = latestPointer;
+			const next = getHoveredBlock(target, clientX, clientY);
+			if (next) {
+				if (contextRef.current.hideTimer !== null) {
+					window.clearTimeout(contextRef.current.hideTimer);
+					contextRef.current.hideTimer = null;
+				}
+				setHoveredBlock((current) => {
+					if (!current) return next;
+					if (next.blockId === current.blockId && next.blockElement === current.blockElement) return current;
+					return next;
+				});
+				return;
+			}
+			if (contextRef.current.hideTimer !== null) return;
+			contextRef.current.hideTimer = window.setTimeout(() => {
+				contextRef.current.hideTimer = null;
+				setHoveredBlock((current) => current ? null : current);
+			}, 120);
+		};
+		const scheduleHoverProcess = () => {
+			if (hoverRaf !== null) return;
+			hoverRaf = window.requestAnimationFrame(() => {
+				hoverRaf = null;
+				processHover();
+			});
+		};
+		const handleMouseMove = (event) => {
+			const root = editor.getRootElement();
+			const target = event.target;
+			if (!root || !(target instanceof Node)) {
+				if (!contextRef.current.hoveredBlock) return;
+			} else {
+				const targetElement = target instanceof Element ? target : target.parentElement;
+				if (!targetElement) {
+					if (!contextRef.current.hoveredBlock) return;
+				} else {
+					const overMenu = menuRef.current?.contains(targetElement) || Boolean(targetElement.closest(`.${OPERATION_MENU_OVERLAY_CLASS}`));
+					const overBlock = targetElement.closest("[data-block-id]") instanceof HTMLElement && root.contains(targetElement);
+					const inPaddingArea = root.contains(targetElement) ? isInRootLeftPaddingArea(root, event.clientX, event.clientY) : false;
+					if (!overMenu && !overBlock && !inPaddingArea && !contextRef.current.hoveredBlock) return;
+				}
+			}
+			latestPointer = {
+				clientX: event.clientX,
+				clientY: event.clientY,
+				target
+			};
+			scheduleHoverProcess();
+		};
+		const handleViewportChange = () => {
+			markBlockRectsDirty();
+			scheduleHoverProcess();
+		};
+		const rootResizeObserver = typeof ResizeObserver !== "undefined" ? new ResizeObserver(() => {
+			markBlockRectsDirty();
+		}) : null;
+		const root = editor.getRootElement();
+		const unregisterUpdate = editor.getLexicalEditor()?.registerUpdateListener(() => {
+			markBlockRectsDirty();
+			scheduleHoverProcess();
+		}) || (() => {});
+		if (root) rootResizeObserver?.observe(root);
+		document.addEventListener("mousemove", handleMouseMove, true);
+		window.addEventListener("resize", handleViewportChange);
+		document.addEventListener("scroll", handleViewportChange, true);
+		return () => {
+			document.removeEventListener("mousemove", handleMouseMove, true);
+			window.removeEventListener("resize", handleViewportChange);
+			document.removeEventListener("scroll", handleViewportChange, true);
+			rootResizeObserver?.disconnect();
+			unregisterUpdate();
+			if (hoverRaf !== null) {
+				window.cancelAnimationFrame(hoverRaf);
+				hoverRaf = null;
+			}
+			if (contextRef.current.hideTimer !== null) {
+				window.clearTimeout(contextRef.current.hideTimer);
+				contextRef.current.hideTimer = null;
+			}
+		};
+	}, [editor, isDragging]);
+	useEffect(() => {
+		if (!hoveredBlock) {
+			if (operationMenuOpen) return;
+			setMenuPosition({});
+			return;
+		}
+		const updateMenuPosition = () => {
+			const rect = hoveredBlock.blockElement.getBoundingClientRect();
+			const menuWidth = menuRef.current?.offsetWidth || 32;
+			const gap = 8;
+			const listItemOffset = hoveredBlock.blockElement.tagName === "LI" ? 16 : 0;
+			setMenuPosition({
+				left: Math.max(gap, rect.left - menuWidth - gap - listItemOffset),
+				top: rect.top
+			});
+		};
+		updateMenuPosition();
+		window.addEventListener("resize", updateMenuPosition);
+		document.addEventListener("scroll", updateMenuPosition, true);
+		return () => {
+			window.removeEventListener("resize", updateMenuPosition);
+			document.removeEventListener("scroll", updateMenuPosition, true);
+		};
+	}, [hoveredBlock]);
+	const menuContext = useMemo(() => {
+		if (!hoveredBlock) return null;
+		return {
+			blockElement: hoveredBlock.blockElement,
+			blockId: hoveredBlock.blockId,
+			editor
+		};
+	}, [editor, hoveredBlock]);
+	const operationMenus = useMemo(() => {
+		if (!operationMenuContext || !blockMenuService) return [];
+		return blockMenuService.getMenus(operationMenuContext);
+	}, [
+		blockMenuService,
+		operationMenuContext,
+		menuVersion
+	]);
+	const actionButtons = useMemo(() => {
+		if (!menuContext || !blockMenuService) return [];
+		return blockMenuService.getActionButtons(menuContext);
+	}, [
+		blockMenuService,
+		menuContext,
+		menuVersion
+	]);
+	useEffect(() => {
+		onHoverBlockChange?.(menuContext);
+	}, [menuContext, onHoverBlockChange]);
+	useEffect(() => {
+		if (!operationMenuOpen || !menuContext || !contextRef.current.operationMenuAnchorBlockId) return;
+		if (contextRef.current.operationMenuAnchorBlockId !== menuContext.blockId) {
+			setOperationMenuOpen(false);
+			setOperationMenuContext(null);
+		}
+	}, [menuContext, operationMenuOpen]);
+	useEffect(() => {
+		if (!operationMenuOpen) {
+			contextRef.current.operationMenuAnchorBlockId = null;
+			setOperationMenuContext(null);
+		}
+	}, [operationMenuOpen]);
+	useEffect(() => {
+		if (!operationMenuOpen) return;
+		const handlePointerDown = (event) => {
+			const target = event.target;
+			if (!(target instanceof Element)) return;
+			if (menuRef.current?.contains(target)) return;
+			if (target.closest(`.${OPERATION_MENU_OVERLAY_CLASS}`)) return;
+			contextRef.current.operationMenuAnchorBlockId = null;
+			setOperationMenuOpen(false);
+			setOperationMenuContext(null);
+		};
+		document.addEventListener("pointerdown", handlePointerDown, true);
+		return () => {
+			document.removeEventListener("pointerdown", handlePointerDown, true);
+		};
+	}, [operationMenuOpen]);
+	useEffect(() => {
+		onDragTargetChange?.(contextRef.current.dragTarget);
+	}, [dragIndicator, onDragTargetChange]);
+	const preventEditorSelectionLost = (event) => {
+		if (event.target?.closest("[data-block-drag-handle=\"true\"]")) return;
+		event.preventDefault();
+	};
+	const clearDragPreview = () => {
+		contextRef.current.dragTarget = null;
+		setDragIndicator(null);
+	};
+	const toggleOperationMenu = (context) => {
+		if (!context) {
+			setOperationMenuOpen(false);
+			setOperationMenuContext(null);
+			return;
+		}
+		setOperationMenuOpen((open) => {
+			const shouldOpen = !(open && contextRef.current.operationMenuAnchorBlockId === context.blockId);
+			contextRef.current.operationMenuAnchorBlockId = shouldOpen ? context.blockId : null;
+			setOperationMenuContext(shouldOpen ? context : null);
+			return shouldOpen;
+		});
+	};
+	const handleDragHandlePointerDown = (event) => {
+		if (!menuContext) return;
+		event.stopPropagation();
+		startBlockDragSession({
+			clearDragPreview,
+			clientX: event.clientX,
+			clientY: event.clientY,
+			contextRef,
+			dragGhostContainer: dragLayerRef.current,
+			editor,
+			menuContext,
+			onDragTargetResolve,
+			onDraggingChange: setIsDragging,
+			setDragIndicator,
+			setOperationMenuContext,
+			setOperationMenuOpen,
+			toggleOperationMenu
+		});
+	};
+	const handleDragHandleClick = () => {
+		if (contextRef.current.ignoreNextHandleClick) {
+			contextRef.current.ignoreNextHandleClick = false;
+			return;
+		}
+		toggleOperationMenu(menuContext);
+	};
+	const dropdownItems = useMemo(() => operationMenus.map((item) => ({
+		key: item.key,
+		label: typeof item.label === "function" ? item.label(operationMenuContext) : item.label,
+		onClick: () => {
+			item.onClick(operationMenuContext);
+			setOperationMenuOpen(false);
+			setOperationMenuContext(null);
+		}
+	})), [operationMenus, operationMenuContext]);
+	const shouldRenderPortal = menuContext || dragIndicator;
+	const menuNode = menuContext && !isDragging ? /* @__PURE__ */ jsx("div", {
+		className: styles$12.menu,
+		ref: menuRef,
+		style: menuPosition,
+		children: /* @__PURE__ */ jsxs("div", {
+			className: styles$12.menuInner,
+			onMouseDown: preventEditorSelectionLost,
+			children: [actionButtons.map((item) => {
+				const title = typeof item.title === "function" ? item.title(menuContext) : item.title;
+				return /* @__PURE__ */ jsx(Button$1, {
+					"aria-label": title,
+					icon: item.icon === "plus" ? /* @__PURE__ */ jsx(Icon, {
+						icon: PlusIcon,
+						size: 14
+					}) : void 0,
+					onClick: () => item.onClick(menuContext),
+					size: "small",
+					title,
+					type: "text"
+				}, item.key);
+			}), /* @__PURE__ */ jsx(Dropdown$1, {
+				align: { points: ["tr", "tl"] },
+				classNames: { root: OPERATION_MENU_OVERLAY_CLASS },
+				menu: { items: dropdownItems },
+				onOpenChange: (open) => {
+					if (!open) {
+						setOperationMenuOpen(false);
+						setOperationMenuContext(null);
+						contextRef.current.operationMenuAnchorBlockId = null;
+					}
+				},
+				open: operationMenuOpen && operationMenuContext?.blockId === menuContext.blockId,
+				trigger: [],
+				children: /* @__PURE__ */ jsx(Button$1, {
+					"aria-label": "Block actions and drag",
+					className: styles$12.dragHandle,
+					"data-block-drag-handle": "true",
+					icon: /* @__PURE__ */ jsx(Icon, {
+						icon: GripVerticalIcon,
+						size: 14
+					}),
+					onClick: handleDragHandleClick,
+					onPointerDown: handleDragHandlePointerDown,
+					size: "small",
+					title: "Block actions and drag",
+					type: "text"
+				})
+			})]
+		})
+	}) : null;
+	const dragLayerNode = /* @__PURE__ */ jsx("div", {
+		"aria-hidden": "true",
+		className: styles$12.dragLayer,
+		"data-block-drag-layer": "true",
+		ref: dragLayerRef
+	});
+	return /* @__PURE__ */ jsxs(Fragment, { children: [dragLayerContainer ? createPortal(dragLayerNode, dragLayerContainer) : dragLayerNode, shouldRenderPortal && createPortal(/* @__PURE__ */ jsxs(Fragment, { children: [menuNode, dragIndicator && /* @__PURE__ */ jsx("div", {
+		className: styles$12.dragIndicator,
+		style: {
+			backgroundColor: token.colorPrimary,
+			left: dragIndicator.left,
+			top: dragIndicator.top,
+			width: dragIndicator.width
+		}
+	})] }), document.body)] });
+};
+ReactBlockPlugin.displayName = "ReactBlockPlugin";
+//#endregion
 //#region src/plugins/code/react/style.ts
 const styles$11 = createStaticStyles(({ css, cssVar }) => ({ codeInline: css`
     display: inline;
@@ -4273,7 +5398,7 @@ const ReactFilePlugin = ({ className, locale, handleUpload, markdownWriter, them
 				throw new Error("No upload handler provided");
 			},
 			markdownWriter,
-			theme: theme || styles$15
+			theme: theme || styles$16
 		});
 	}, [editor]);
 	return null;
@@ -5038,6 +6163,10 @@ const ResizeHandle = ({ imageRef, isBlock, onResize, onResizeEnd, onResizeStart,
 ResizeHandle.displayName = "ResizeHandle";
 //#endregion
 //#region src/plugins/image/react/components/Image.tsx
+function getResizedImageWidth(startWidth, deltaX, maxWidth) {
+	const adjustedDeltaX = deltaX * 2;
+	return Math.max(50, Math.min(startWidth + adjustedDeltaX, maxWidth));
+}
 const Image$1 = memo(({ node, className, showScaleInfo = false, handleUpload, onPickFile }) => {
 	const [isSelected, setSelected] = useLexicalNodeSelection(node.getKey());
 	const [isHovered, setIsHovered] = useState(false);
@@ -5073,8 +6202,7 @@ const Image$1 = memo(({ node, className, showScaleInfo = false, handleUpload, on
 		if (!imageRef.current) return;
 		const aspectRatio = originalSizeRef.current.width / originalSizeRef.current.height;
 		const maxWidth = imageRef.current.parentElement?.clientWidth || window.innerWidth;
-		const adjustedDeltaX = deltaX * 2;
-		const newWidth = Math.max(50, Math.min(startWidthRef.current + adjustedDeltaX, maxWidth));
+		const newWidth = getResizedImageWidth(startWidthRef.current, deltaX, maxWidth);
 		setSize({
 			height: newWidth / aspectRatio,
 			width: newWidth
@@ -5148,8 +6276,7 @@ const Image$1 = memo(({ node, className, showScaleInfo = false, handleUpload, on
 		if (!originalSizeRef.current.width || !originalSizeRef.current.height) return;
 		if (!imageRef.current) return;
 		const maxWidth = imageRef.current.parentElement?.clientWidth || window.innerWidth;
-		const adjustedDeltaX = deltaX / 2;
-		const finalWidth = Math.max(50, Math.min(startWidthRef.current + adjustedDeltaX, maxWidth));
+		const finalWidth = getResizedImageWidth(startWidthRef.current, deltaX, maxWidth);
 		const editor = editorRef.current;
 		if (!editor) return;
 		editor.update(() => {
@@ -5235,7 +6362,7 @@ const ReactImagePlugin = ({ theme, className, defaultBlockImage, handleUpload, n
 					onPickFile
 				});
 			},
-			theme: theme || styles$16
+			theme: theme || styles$17
 		});
 	}, []);
 	return null;
@@ -5844,9 +6971,9 @@ const ReactListPlugin = ({ enableHotkey = true }) => {
 		editor.registerPlugin(MarkdownPlugin);
 		editor.registerPlugin(ListPlugin, {
 			enableHotkey,
-			theme: styles$17
+			theme: styles$18
 		});
-	}, [enableHotkey, styles$17]);
+	}, [enableHotkey, styles$18]);
 	return null;
 };
 ReactListPlugin.displayName = "ReactListPlugin";
@@ -6091,7 +7218,7 @@ const MathEditorContainer = memo(({ children, isBlockMode, mathDOM, onFocus, pre
 	return /* @__PURE__ */ jsx(Popover, {
 		arrow: false,
 		content: /* @__PURE__ */ jsx(Flexbox, {
-			className: styles$18.mathEditor,
+			className: styles$19.mathEditor,
 			"data-math-editor-container": true,
 			style: blockWidth ? { width: blockWidth } : void 0,
 			children
@@ -6103,7 +7230,7 @@ const MathEditorContainer = memo(({ children, isBlockMode, mathDOM, onFocus, pre
 			padding: 0
 		} },
 		children: /* @__PURE__ */ jsx("span", {
-			className: styles$18.mathEditorAnchor,
+			className: styles$19.mathEditorAnchor,
 			onClick: handleAnchorClick,
 			ref: anchorRef
 		})
@@ -6187,7 +7314,7 @@ const MathEditorContent = memo(({ focusRef, mathNode, onArrowLeft, onArrowRight,
 				maxRows: 6,
 				minRows: 1
 			},
-			className: styles$18.mathEditorTextArea,
+			className: styles$19.mathEditorTextArea,
 			onChange: (e) => {
 				onValueChange(e.target.value);
 			},
@@ -6199,7 +7326,7 @@ const MathEditorContent = memo(({ focusRef, mathNode, onArrowLeft, onArrowRight,
 			variant: "borderless"
 		}),
 		latexError && /* @__PURE__ */ jsx(Flexbox, {
-			className: styles$18.mathEditorFooter,
+			className: styles$19.mathEditorFooter,
 			horizontal: true,
 			paddingBlock: 4,
 			paddingInline: 12,
@@ -6211,7 +7338,7 @@ const MathEditorContent = memo(({ focusRef, mathNode, onArrowLeft, onArrowRight,
 			})
 		}),
 		/* @__PURE__ */ jsx(Flexbox, {
-			className: styles$18.mathEditorFooter,
+			className: styles$19.mathEditorFooter,
 			horizontal: true,
 			justify: "flex-end",
 			padding: 4,
@@ -6425,7 +7552,7 @@ const Placeholder = ({ mathBlock }) => {
 	const t = useTranslation();
 	const node = /* @__PURE__ */ jsx(Text, {
 		as: "span",
-		className: cx("katex", styles$18.mathPlaceholder),
+		className: cx("katex", styles$19.mathPlaceholder),
 		fontSize: mathBlock ? "1.2em" : "1em",
 		type: "secondary",
 		children: t("math.placeholder")
@@ -6526,13 +7653,13 @@ const ReactMathPlugin = ({ className, renderComp, theme }) => {
 					node
 				});
 			},
-			theme: theme || styles$18
+			theme: theme || styles$19
 		});
 	}, [
 		editor,
 		className,
 		theme,
-		styles$18
+		styles$19
 	]);
 	return /* @__PURE__ */ jsx(MathEdit, { renderComp });
 };
@@ -7405,7 +8532,7 @@ const ReactTablePlugin = ({ className, locale }) => {
 	}, []);
 	useLayoutEffect(() => {
 		if (locale) editor.registerLocale(locale);
-		editor.registerPlugin(TablePlugin, { theme: cx(styles$19, className) });
+		editor.registerPlugin(TablePlugin, { theme: cx(styles$20, className) });
 	}, []);
 	useLexicalEditor((editor) => {
 		setLexicalEditor(editor);
@@ -7882,4 +9009,4 @@ function disableHotReload() {
 	}
 }
 //#endregion
-export { $closest, $closestNodeType, $createCursorNode, $getNearestNodeFromDOMNode, $getNodeFromDOMNode, $isCardLikeElementNode, $isCursorNode, AutoCompletePlugin, CardLikeElementNode, CodePlugin, CodeblockPlugin, CodemirrorPlugin, CommonPlugin, DEFAULT_HEADLESS_EDITOR_PLUGINS, DOM_DOCUMENT_FRAGMENT_TYPE, DOM_DOCUMENT_TYPE, DOM_ELEMENT_TYPE, DOM_TEXT_TYPE, DataSource, DiffAction, EDITOR_THEME_KEY, FilePlugin, GET_MARKDOWN_SELECTION_COMMAND, HIDE_TOOLBAR_COMMAND, HOVER_COMMAND, HRPlugin, HeadlessEditor, HotkeyEnum, HotkeyScopeEnum, ILinkService, ILitexmlService, IMarkdownShortCutService, INSERT_CHECK_LIST_COMMAND, INSERT_CODEINLINE_COMMAND, INSERT_CODEMIRROR_COMMAND, INSERT_FILE_COMMAND, INSERT_HEADING_COMMAND, INSERT_HORIZONTAL_RULE_COMMAND, INSERT_IMAGE_COMMAND, INSERT_LINK_COMMAND, INSERT_LINK_HIGHLIGHT_COMMAND, INSERT_MARKDOWN_COMMAND, INSERT_MATH_COMMAND, INSERT_MENTION_COMMAND, INSERT_ORDERED_LIST_COMMAND, INSERT_QUOTE_COMMAND, INSERT_TABLE_COMMAND, INSERT_UNORDERED_LIST_COMMAND, INodePlugin, INodeService, IUploadService, ImagePlugin, Kernel, KeyEnum, LITEXML_APPLY_COMMAND, LITEXML_DIFFNODE_ALL_COMMAND, LITEXML_DIFFNODE_COMMAND, LITEXML_INSERT_COMMAND, LITEXML_MODIFY_COMMAND, LITEXML_REMOVE_COMMAND, LexicalErrorBoundary, LexicalPortalContainer, LinkHighlightPlugin, LinkPlugin, ListPlugin, LitexmlDataSource, LitexmlPlugin, LitexmlService, MARKDOWN_READER_LEVEL_HIGH, MARKDOWN_READER_LEVEL_NORMAL, MARKDOWN_WRITER_LEVEL_MAX, MarkdownPlugin, MathPlugin, MentionPlugin, REMOVE_LIST_COMMAND, ReactAutoCompletePlugin, ReactCodePlugin, ReactCodeblockPlugin, ReactCodemirrorPlugin, ReactEditor, ReactEditorContent, ReactFilePlugin, ReactHRPlugin, ReactImagePlugin, ReactLinkHighlightPlugin, ReactLinkPlugin, ReactListPlugin, ReactLiteXmlPlugin, ReactMarkdownPlugin, ReactMathPlugin, ReactMentionPlugin, ReactNodePlugin, ReactPlainText, ReactSlashOption, ReactSlashPlugin, ReactTablePlugin, ReactToolbarPlugin, ReactVirtualBlockPlugin, SELECT_AFTER_CODEMIRROR_COMMAND, SELECT_BEFORE_CODEMIRROR_COMMAND, SELECT_TABLE_COMMAND, SHOW_TOOLBAR_COMMAND, SlashMenu, SlashPlugin, TablePlugin, UPDATE_CODEBLOCK_LANG, UPDATE_LIST_START_COMMAND, UPLOAD_PRIORITY_HIGH, UPLOAD_PRIORITY_LOW, UPLOAD_PRIORITY_MEDIUM, UploadPlugin, VirtualBlockPlugin, assert, browserDebug, bundledLanguagesInfo, compareNodeOrder, createDebugLogger, createEmptyEditorState, createHeadlessEditor, cursorNodeSerialized, debugLogger, debugLoggers, detectCodeLanguage, detectLanguage, devConsole, disableHotReload, enableHotReload, genServiceId, generateEditorId, getHotkeyById, getKernelFromEditor, getKernelFromEditorConfig, getNodeKeyFromDOMNode, getParentElement, isDOMNode, isDocumentFragment, isPunctuationChar, isPureUrl, isValidUrl, moment, noop, prodSafeLogger, reconcileDecorator, registerEditorKernel, registerLinkHighlightCommand, registerToolbarCommand, resetRandomKey, scrollIntoView, unregisterEditorKernel, useHasDiffNode, useLexicalComposerContext, useLexicalEditor };
+export { $closest, $closestNodeType, $createCursorNode, $getNearestNodeFromDOMNode, $getNodeFromDOMNode, $isCardLikeElementNode, $isCursorNode, AutoCompletePlugin, BlockMenuService, BlockPlugin, CardLikeElementNode, CodePlugin, CodeblockPlugin, CodemirrorPlugin, CommonPlugin, DEFAULT_HEADLESS_EDITOR_PLUGINS, DOM_DOCUMENT_FRAGMENT_TYPE, DOM_DOCUMENT_TYPE, DOM_ELEMENT_TYPE, DOM_TEXT_TYPE, DataSource, DiffAction, EDITOR_THEME_KEY, FilePlugin, GET_MARKDOWN_SELECTION_COMMAND, HIDE_TOOLBAR_COMMAND, HOVER_COMMAND, HRPlugin, HeadlessEditor, HotkeyEnum, HotkeyScopeEnum, IBlockMenuService, ILinkService, ILitexmlService, IMarkdownShortCutService, INSERT_CHECK_LIST_COMMAND, INSERT_CODEINLINE_COMMAND, INSERT_CODEMIRROR_COMMAND, INSERT_FILE_COMMAND, INSERT_HEADING_COMMAND, INSERT_HORIZONTAL_RULE_COMMAND, INSERT_IMAGE_COMMAND, INSERT_LINK_COMMAND, INSERT_LINK_HIGHLIGHT_COMMAND, INSERT_MARKDOWN_COMMAND, INSERT_MATH_COMMAND, INSERT_MENTION_COMMAND, INSERT_ORDERED_LIST_COMMAND, INSERT_QUOTE_COMMAND, INSERT_TABLE_COMMAND, INSERT_UNORDERED_LIST_COMMAND, INodePlugin, INodeService, IUploadService, ImagePlugin, Kernel, KeyEnum, LITEXML_APPLY_COMMAND, LITEXML_DIFFNODE_ALL_COMMAND, LITEXML_DIFFNODE_COMMAND, LITEXML_INSERT_COMMAND, LITEXML_MODIFY_COMMAND, LITEXML_REMOVE_COMMAND, LexicalErrorBoundary, LexicalPortalContainer, LinkHighlightPlugin, LinkPlugin, ListPlugin, LitexmlDataSource, LitexmlPlugin, LitexmlService, MARKDOWN_READER_LEVEL_HIGH, MARKDOWN_READER_LEVEL_NORMAL, MARKDOWN_WRITER_LEVEL_MAX, MOVE_BLOCK_COMMAND, MarkdownPlugin, MathPlugin, MentionPlugin, REMOVE_LIST_COMMAND, ReactAutoCompletePlugin, ReactBlockPlugin, ReactCodePlugin, ReactCodeblockPlugin, ReactCodemirrorPlugin, ReactEditor, ReactEditorContent, ReactFilePlugin, ReactHRPlugin, ReactImagePlugin, ReactLinkHighlightPlugin, ReactLinkPlugin, ReactListPlugin, ReactLiteXmlPlugin, ReactMarkdownPlugin, ReactMathPlugin, ReactMentionPlugin, ReactNodePlugin, ReactPlainText, ReactSlashOption, ReactSlashPlugin, ReactTablePlugin, ReactToolbarPlugin, ReactVirtualBlockPlugin, SELECT_AFTER_CODEMIRROR_COMMAND, SELECT_BEFORE_CODEMIRROR_COMMAND, SELECT_TABLE_COMMAND, SHOW_TOOLBAR_COMMAND, SlashMenu, SlashPlugin, TablePlugin, UPDATE_CODEBLOCK_LANG, UPDATE_LIST_START_COMMAND, UPLOAD_PRIORITY_HIGH, UPLOAD_PRIORITY_LOW, UPLOAD_PRIORITY_MEDIUM, UploadPlugin, VirtualBlockPlugin, assert, browserDebug, bundledLanguagesInfo, compareNodeOrder, createDebugLogger, createEmptyEditorState, createHeadlessEditor, cursorNodeSerialized, debugLogger, debugLoggers, detectCodeLanguage, detectLanguage, devConsole, disableHotReload, enableHotReload, genServiceId, generateEditorId, getHotkeyById, getKernelFromEditor, getKernelFromEditorConfig, getNodeKeyFromDOMNode, getParentElement, isDOMNode, isDocumentFragment, isPunctuationChar, isPureUrl, isValidUrl, moment, noop, prodSafeLogger, reconcileDecorator, registerBlockMoveCommand, registerEditorKernel, registerLinkHighlightCommand, registerToolbarCommand, resetRandomKey, scrollIntoView, unregisterEditorKernel, useHasDiffNode, useLexicalComposerContext, useLexicalEditor };