@lobehub/editor 4.15.0 → 4.15.2

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

@@ -0,0 +1,338 @@
+import { INodeHelper, init_helper } from "../../../editor-kernel/inode/helper.js";
+import { $isCursorInQuote, $isCursorInTable, createBlockNode, init_utils, sampleReader } from "../utils/index.js";
+import { KernelPlugin, init_plugin } from "../../../editor-kernel/plugin.js";
+import { noop } from "../../../editor-kernel/utils.js";
+import { registerCommands } from "../command/index.js";
+import { CursorNode, registerCursorNode } from "../node/cursor.js";
+import { ILitexmlService } from "../../litexml/service/litexml-service.js";
+import { isPunctuationChar } from "../../markdown/utils/index.js";
+import { IMarkdownShortCutService } from "../../markdown/service/shortcut.js";
+import JSONDataSource from "../data-source/json-data-source.js";
+import TextDataSource from "../data-source/text-data-source.js";
+import { registerBreakLineClick } from "../node/ElementDOMSlot.js";
+import { registerMDReader } from "./mdReader.js";
+import { handleFilePaste, handlePlainTextPaste, handleVSCodePaste, runPasteHandlers } from "./paste-handler.js";
+import { registerHeaderBackspace, registerLastElement, registerRichKeydown } from "./register.js";
+import { registerHistory } from "@lexical/history";
+import { $createLineBreakNode, $createParagraphNode, $getSelection, $isRangeSelection, $isTextNode, COMMAND_PRIORITY_CRITICAL, COMMAND_PRIORITY_HIGH, INSERT_LINE_BREAK_COMMAND, INSERT_PARAGRAPH_COMMAND, PASTE_COMMAND, ParagraphNode, TEXT_TYPE_TO_FORMAT, TextNode } from "lexical";
+import { $createHeadingNode, $createQuoteNode, $isHeadingNode, $isQuoteNode, HeadingNode, QuoteNode, registerRichText } from "@lexical/rich-text";
+import { CAN_USE_DOM } from "@lexical/utils";
+import { registerDragonSupport } from "@lexical/dragon";
+//#region src/plugins/common/plugin/index.ts
+init_helper();
+init_plugin();
+init_utils();
+const CommonPlugin = class extends KernelPlugin {
+	static {
+		this.pluginName = "CommonPlugin";
+	}
+	constructor(kernel, config = {}) {
+		super();
+		this.kernel = kernel;
+		this.config = config;
+		this.formats = {
+			bold: true,
+			header: true,
+			italic: true,
+			quote: true,
+			strikethrough: true,
+			subscript: false,
+			superscript: false
+		};
+		const markdownOption = config.markdownOption ?? true;
+		if (typeof markdownOption === "object") {
+			this.formats.bold = markdownOption.bold ?? true;
+			this.formats.header = markdownOption.header ?? true;
+			this.formats.italic = markdownOption.italic ?? true;
+			this.formats.quote = markdownOption.quote ?? true;
+			this.formats.strikethrough = markdownOption.strikethrough ?? true;
+			this.formats.subscript = markdownOption.subscript ?? false;
+			this.formats.superscript = markdownOption.superscript ?? false;
+		} else if (markdownOption === false) {
+			this.formats.bold = false;
+			this.formats.header = false;
+			this.formats.italic = false;
+			this.formats.quote = false;
+			this.formats.strikethrough = false;
+			this.formats.subscript = false;
+			this.formats.superscript = false;
+		}
+		kernel.registerDataSource(new JSONDataSource("json"));
+		kernel.registerDataSource(new TextDataSource("text"));
+		kernel.registerNodes([
+			HeadingNode,
+			QuoteNode,
+			CursorNode
+		]);
+		if (config?.theme) kernel.registerThemes({
+			quote: config.theme.quote,
+			text: {
+				bold: config.theme.textBold,
+				code: config.theme.textCode,
+				highlight: config.theme.textHighlight,
+				italic: config.theme.textItalic,
+				strikethrough: config.theme.textStrikethrough,
+				subscript: config.theme.textSubscript,
+				superscript: config.theme.textSuperscript,
+				underline: config.theme.textUnderline,
+				underlineStrikethrough: config.theme.textUnderlineStrikethrough
+			}
+		});
+	}
+	registerMarkdown(kernel) {
+		const markdownService = kernel.requireService(IMarkdownShortCutService);
+		if (!markdownService) return;
+		const breakMark = (this.config?.markdownOption ?? true) !== false ? "\n\n" : "\n";
+		const formats = this.formats;
+		if (formats.quote) markdownService.registerMarkdownShortCut({
+			regExp: /^(>|》)\s/,
+			replace: (parentNode, children, _match, isImport) => {
+				if (isImport) {
+					const previousNode = parentNode.getPreviousSibling();
+					if ($isQuoteNode(previousNode)) {
+						previousNode.splice(previousNode.getChildrenSize(), 0, [$createLineBreakNode(), ...children]);
+						parentNode.remove();
+						return;
+					}
+				}
+				const node = $createQuoteNode();
+				node.append(...children);
+				parentNode.replace(node);
+				if (!isImport) node.select(0, 0);
+			},
+			type: "element"
+		});
+		if (formats.header) markdownService.registerMarkdownShortCut({
+			regExp: /^(#{1,6})\s/,
+			replace: createBlockNode((match, parentNode) => {
+				const tag = "h" + match[1].length;
+				if ($isHeadingNode(parentNode) && parentNode.getTag() === tag) return $createParagraphNode();
+				return $createHeadingNode(tag);
+			}),
+			type: "element"
+		});
+		const textFormatShortcuts = [];
+		if (formats.bold) textFormatShortcuts.push({
+			format: ["bold"],
+			tag: "**",
+			type: "text-format"
+		}, {
+			format: ["bold"],
+			intraword: false,
+			tag: "__",
+			type: "text-format"
+		});
+		if (formats.strikethrough) textFormatShortcuts.push({
+			format: ["strikethrough"],
+			tag: "~~",
+			type: "text-format"
+		});
+		if (formats.italic) textFormatShortcuts.push({
+			format: ["italic"],
+			tag: "*",
+			type: "text-format"
+		}, {
+			format: ["italic"],
+			intraword: false,
+			tag: "_",
+			type: "text-format"
+		});
+		if (formats.superscript) textFormatShortcuts.push({
+			format: ["superscript"],
+			tag: "^",
+			type: "text-format"
+		});
+		if (formats.subscript) textFormatShortcuts.push({
+			format: ["subscript"],
+			tag: "~",
+			type: "text-format"
+		});
+		if (textFormatShortcuts.length > 0) markdownService.registerMarkdownShortCuts(textFormatShortcuts);
+		markdownService.registerMarkdownWriter("paragraph", (ctx) => {
+			ctx.wrap("", breakMark);
+		});
+		if (formats.quote) markdownService.registerMarkdownWriter("quote", (ctx, node) => {
+			if ($isQuoteNode(node)) ctx.wrap("> ", breakMark);
+		});
+		if (formats.header) markdownService.registerMarkdownWriter("heading", (ctx, node) => {
+			if ($isHeadingNode(node)) switch (node.getTag()) {
+				case "h1":
+					ctx.wrap("# ", "\n\n");
+					break;
+				case "h2":
+					ctx.wrap("## ", "\n\n");
+					break;
+				case "h3":
+					ctx.wrap("### ", "\n\n");
+					break;
+				case "h4":
+					ctx.wrap("#### ", "\n\n");
+					break;
+				case "h5":
+					ctx.wrap("##### ", "\n\n");
+					break;
+				case "h6":
+					ctx.wrap("###### ", "\n\n");
+					break;
+				default:
+					ctx.wrap("", "\n\n");
+					break;
+			}
+		});
+		markdownService.registerMarkdownWriter("text", (ctx, node) => {
+			if (!$isTextNode(node)) return;
+			const isBold = formats.bold && node.hasFormat("bold");
+			const isItalic = formats.italic && node.hasFormat("italic");
+			const isUnderline = node.hasFormat("underline");
+			const isStrikethrough = formats.strikethrough && node.hasFormat("strikethrough");
+			const isSuperscript = formats.superscript && node.hasFormat("superscript");
+			const isSubscript = formats.subscript && node.hasFormat("subscript");
+			if (isBold) ctx.appendLine("**");
+			if (isStrikethrough) ctx.appendLine("~~");
+			if (isItalic) ctx.appendLine("_");
+			if (isUnderline) ctx.appendLine("<ins>");
+			if (isSuperscript) ctx.appendLine("^");
+			if (isSubscript) ctx.appendLine("~");
+			const textContent = node.getTextContent();
+			const res = textContent.match(/\s+$/);
+			let tailSpace = "";
+			if (res) tailSpace = res[0];
+			const append = textContent.trimEnd();
+			const lastChar = append.at(-1);
+			ctx.appendLine(append);
+			if (isSubscript) ctx.appendLine("~");
+			if (isSuperscript) ctx.appendLine("^");
+			if (isUnderline) ctx.appendLine("</ins>");
+			if (isItalic) ctx.appendLine("_");
+			if (isStrikethrough) ctx.appendLine("~~");
+			if (isBold) ctx.appendLine("**");
+			if (tailSpace) ctx.appendLine(tailSpace);
+			else if (lastChar && isPunctuationChar(lastChar)) ctx.appendLine(" ");
+		});
+		markdownService.registerMarkdownWriter("linebreak", (ctx) => {
+			ctx.appendLine("\n");
+		});
+		registerMDReader(markdownService);
+	}
+	onInit(editor) {
+		this.register(this.kernel.registerHighCommand(PASTE_COMMAND, (event) => {
+			if (!(event instanceof ClipboardEvent)) return false;
+			const clipboardData = event.clipboardData;
+			if (!clipboardData) return false;
+			this.kernel.emit("onPaste", event);
+			const ctx = {
+				clipboardData,
+				config: this.config,
+				editor,
+				event
+			};
+			if (this.config?.pasteVSCodeAsCodeBlock) {
+				if (handleVSCodePaste(ctx) === "handled") return true;
+			}
+			if (this.config?.pasteAsPlainText) return runPasteHandlers(ctx, [handleFilePaste, handlePlainTextPaste]);
+			return false;
+		}, COMMAND_PRIORITY_CRITICAL));
+		this.registerClears(registerRichText(editor), CAN_USE_DOM ? registerDragonSupport(editor) : noop, registerHistory(editor, this.kernel.getHistoryState(), 300), registerHeaderBackspace(editor), registerRichKeydown(editor, this.kernel, { enableHotkey: this.config?.enableHotkey }), registerCommands(editor), registerBreakLineClick(editor), registerCursorNode(editor), registerLastElement(editor), editor.registerCommand(INSERT_LINE_BREAK_COMMAND, () => {
+			const selection = $getSelection();
+			if (!$isRangeSelection(selection)) return false;
+			const { inCell, inTable } = $isCursorInTable(selection);
+			if (inCell) return false;
+			if (inTable) return false;
+			if ($isCursorInQuote(selection)) return false;
+			editor.update(() => {
+				editor.dispatchCommand(INSERT_PARAGRAPH_COMMAND, void 0);
+			});
+			return true;
+		}, COMMAND_PRIORITY_HIGH));
+		this.registerMarkdown(this.kernel);
+		this.registerLiteXml();
+	}
+	registerLiteXml() {
+		const litexmlService = this.kernel.requireService(ILitexmlService);
+		if (!litexmlService) return;
+		const formats = this.formats;
+		litexmlService.registerXMLWriter(TextNode.getType(), (node, ctx) => {
+			const attr = {};
+			if ($isTextNode(node)) {
+				if (formats.bold && node.hasFormat("bold")) attr["bold"] = "true";
+				if (formats.italic && node.hasFormat("italic")) attr["italic"] = "true";
+				if (node.hasFormat("underline")) attr["underline"] = "true";
+				if (formats.strikethrough && node.hasFormat("strikethrough")) attr["strikethrough"] = "true";
+				if (formats.subscript && node.hasFormat("subscript")) attr["subscript"] = "true";
+				if (formats.superscript && node.hasFormat("superscript")) attr["superscript"] = "true";
+				return ctx.createXmlNode("span", attr, node.getTextContent());
+			}
+			return false;
+		});
+		if (formats.bold) {
+			litexmlService.registerXMLReader("b", sampleReader.bind(this, TEXT_TYPE_TO_FORMAT["bold"]));
+			litexmlService.registerXMLReader("strong", sampleReader.bind(this, TEXT_TYPE_TO_FORMAT["bold"]));
+		}
+		if (formats.italic) {
+			litexmlService.registerXMLReader("i", sampleReader.bind(this, TEXT_TYPE_TO_FORMAT["italic"]));
+			litexmlService.registerXMLReader("emphasis", sampleReader.bind(this, TEXT_TYPE_TO_FORMAT["italic"]));
+		}
+		litexmlService.registerXMLReader("u", sampleReader.bind(this, TEXT_TYPE_TO_FORMAT["underline"]));
+		litexmlService.registerXMLReader("ins", sampleReader.bind(this, TEXT_TYPE_TO_FORMAT["underline"]));
+		litexmlService.registerXMLReader("span", (xmlElement, children) => {
+			const bold = xmlElement.getAttribute("bold");
+			const italic = xmlElement.getAttribute("italic");
+			const underline = xmlElement.getAttribute("underline");
+			const strikethrough = xmlElement.getAttribute("strikethrough");
+			const subscript = xmlElement.getAttribute("subscript");
+			const superscript = xmlElement.getAttribute("superscript");
+			let format = 0;
+			if (formats.bold && bold === "true") format |= TEXT_TYPE_TO_FORMAT["bold"];
+			if (formats.italic && italic === "true") format |= TEXT_TYPE_TO_FORMAT["italic"];
+			if (underline === "true") format |= TEXT_TYPE_TO_FORMAT["underline"];
+			if (formats.strikethrough && strikethrough === "true") format |= TEXT_TYPE_TO_FORMAT["strikethrough"];
+			if (formats.subscript && subscript === "true") format |= TEXT_TYPE_TO_FORMAT["subscript"];
+			if (formats.superscript && superscript === "true") format |= TEXT_TYPE_TO_FORMAT["superscript"];
+			children.forEach((child) => {
+				if (INodeHelper.isTextNode(child)) child.format = (child.format || 0) | format;
+			});
+			return children;
+		});
+		if (formats.quote) {
+			litexmlService.registerXMLWriter("quote", (node, ctx) => {
+				if ($isQuoteNode(node)) return ctx.createXmlNode("quote", {});
+				return false;
+			});
+			litexmlService.registerXMLReader("quote", (xmlElement, children) => {
+				return INodeHelper.createElementNode(QuoteNode.getType(), { children });
+			});
+		}
+		if (formats.header) {
+			litexmlService.registerXMLWriter("heading", (node, ctx) => {
+				if ($isHeadingNode(node)) return ctx.createXmlNode(node.getTag(), {});
+				return false;
+			});
+			[
+				"h1",
+				"h2",
+				"h3",
+				"h4",
+				"h5",
+				"h6"
+			].forEach((tag) => {
+				litexmlService.registerXMLReader(tag, (xmlElement, children) => {
+					return INodeHelper.createElementNode(HeadingNode.getType(), {
+						children,
+						tag
+					});
+				});
+			});
+		}
+		litexmlService.registerXMLWriter(ParagraphNode.getType(), (node, ctx) => {
+			return ctx.createXmlNode("p", {});
+		});
+		litexmlService.registerXMLReader("p", (xmlElement, children) => {
+			return INodeHelper.createElementNode(ParagraphNode.getType(), { children });
+		});
+	}
+	destroy() {
+		super.destroy();
+	}
+};
+//#endregion
+export { CommonPlugin };

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

@@ -0,0 +1,62 @@
+import { INodeHelper, init_helper } from "../../../editor-kernel/inode/helper.js";
+import { IS_BOLD, IS_ITALIC, IS_STRIKETHROUGH, IS_SUBSCRIPT, IS_SUPERSCRIPT, IS_UNDERLINE } from "lexical";
+//#region src/plugins/common/plugin/mdReader.ts
+init_helper();
+function registerMDReader(markdownService) {
+	markdownService.registerMarkdownReader("blockquote", (node, children) => {
+		return INodeHelper.createElementNode("quote", {
+			children,
+			direction: "ltr",
+			format: "",
+			indent: 0,
+			version: 1
+		});
+	});
+	markdownService.registerMarkdownReader("strong", (node, children) => {
+		return children.map((child) => {
+			if (INodeHelper.isTextNode(child)) child.format = (child.format || 0) | IS_BOLD;
+			return child;
+		});
+	});
+	markdownService.registerMarkdownReader("emphasis", (node, children) => {
+		return children.map((child) => {
+			if (INodeHelper.isTextNode(child)) child.format = (child.format || 0) | IS_ITALIC;
+			return child;
+		});
+	});
+	markdownService.registerMarkdownReader("delete", (node, children) => {
+		return children.map((child) => {
+			if (INodeHelper.isTextNode(child)) child.format = (child.format || 0) | IS_STRIKETHROUGH;
+			return child;
+		});
+	});
+	markdownService.registerMarkdownReader("subscript", (node, children) => {
+		return children.map((child) => {
+			if (INodeHelper.isTextNode(child)) child.format = (child.format || 0) | IS_SUBSCRIPT;
+			return child;
+		});
+	});
+	markdownService.registerMarkdownReader("superscript", (node, children) => {
+		return children.map((child) => {
+			if (INodeHelper.isTextNode(child)) child.format = (child.format || 0) | IS_SUPERSCRIPT;
+			return child;
+		});
+	});
+	markdownService.registerMarkdownReader("html", (node, children) => {
+		if (["<ins>", "<u>"].includes(node.value.toLocaleLowerCase())) return children.map((child) => {
+			if (INodeHelper.isTextNode(child)) child.format = (child.format || 0) | IS_UNDERLINE;
+			return child;
+		});
+		else if (["<em>"].includes(node.value.toLocaleLowerCase())) return children.map((child) => {
+			if (INodeHelper.isTextNode(child)) child.format = (child.format || 0) | IS_ITALIC;
+			return child;
+		});
+		else if (["<strong>"].includes(node.value.toLocaleLowerCase())) return children.map((child) => {
+			if (INodeHelper.isTextNode(child)) child.format = (child.format || 0) | IS_BOLD;
+			return child;
+		});
+		return false;
+	});
+}
+//#endregion
+export { registerMDReader };

package/es/plugins/common/plugin/paste-handler.d.ts

@@ -0,0 +1,11 @@
+import { LexicalEditor } from "lexical";
+
+//#region src/plugins/common/plugin/paste-handler.d.ts
+/**
+ * Configuration options relevant to paste handling
+ */
+interface PasteHandlerConfig {
+  pasteVSCodeAsCodeBlock?: boolean;
+}
+//#endregion
+export { PasteHandlerConfig };

package/es/plugins/common/plugin/paste-handler.js

@@ -0,0 +1,61 @@
+import { $createCodeMirrorNode } from "../../codemirror-block/node/CodeMirrorNode.js";
+import { $createNodeSelection, $getSelection, $insertNodes, $isRangeSelection, $setSelection, CONTROLLED_TEXT_INSERTION_COMMAND } from "lexical";
+//#region src/plugins/common/plugin/paste-handler.ts
+/**
+* Check if it's a file paste - skip plain text handling to let file uploads work normally
+*/
+const handleFilePaste = ({ clipboardData }) => {
+	const items = clipboardData.items;
+	for (const item of items) if (item.kind === "file") return "skip";
+	return "next";
+};
+/**
+* Handle VS Code paste - create code block with language from vscode-editor-data
+*/
+const handleVSCodePaste = ({ clipboardData, config, editor, event }) => {
+	if (!config.pasteVSCodeAsCodeBlock) return "next";
+	const vscodeDataStr = clipboardData.getData("vscode-editor-data");
+	if (!vscodeDataStr) return "next";
+	try {
+		const vscodeData = JSON.parse(vscodeDataStr);
+		const language = vscodeData.mode || vscodeData.language || "plaintext";
+		const text = clipboardData.getData("text/plain");
+		if (!text) return "next";
+		event.preventDefault();
+		editor.update(() => {
+			if (!$isRangeSelection($getSelection())) return;
+			const codeNode = $createCodeMirrorNode(language, text);
+			$insertNodes([codeNode]);
+			const nodeSelection = $createNodeSelection();
+			nodeSelection.add(codeNode.getKey());
+			$setSelection(nodeSelection);
+		});
+		return "handled";
+	} catch {
+		return "next";
+	}
+};
+/**
+* Handle plain text paste - fallback handler that pastes as plain text
+*/
+const handlePlainTextPaste = ({ clipboardData, editor, event }) => {
+	const text = clipboardData.getData("text/plain");
+	if (!text) return "skip";
+	event.preventDefault();
+	editor.dispatchCommand(CONTROLLED_TEXT_INSERTION_COMMAND, text);
+	return "handled";
+};
+/**
+* Run paste handlers in sequence (middleware chain pattern)
+* @returns true if event was handled, false to let default behavior continue
+*/
+function runPasteHandlers(ctx, handlers) {
+	for (const handler of handlers) {
+		const result = handler(ctx);
+		if (result === "handled") return true;
+		if (result === "skip") return false;
+	}
+	return false;
+}
+//#endregion
+export { handleFilePaste, handlePlainTextPaste, handleVSCodePaste, runPasteHandlers };