@lofcz/platejs-markdown 52.3.8 → 53.0.0

package/dist/index.d.ts

@@ -1,8 +1,8 @@
 import * as platejs2 from "platejs";
 import { Descendant, NodeKey, Nullable, OmitFirst, PluginConfig, SlateEditor, TElement, TListElement, TNodeMap, TText, Value } from "platejs";
 import { MdxJsxFlowElement, MdxJsxFlowElement as MdMdxJsxFlowElement, MdxJsxTextElement, MdxJsxTextElement as MdMdxJsxTextElement } from "mdast-util-mdx";
-import { Options } from "remark-stringify";
 import { Plugin } from "unified";
+import { Options } from "remark-stringify";
 import { Token } from "marked";
 import baseRemarkMdx from "remark-mdx";
 import { Blockquote as MdBlockquote, Break as MdBreak, Code as MdCode, Content as MdContent, Definition as MdDefinition, Delete as MdDelete, Emphasis as MdEmphasis, FootnoteDefinition as MdFootnoteDefinition, FootnoteReference as MdFootnoteReference, Heading as MdHeading, Html as MdHtml, Image as MdImage, ImageReference as MdImageReference, InlineCode as MdInlineCode, Link as MdLink, LinkReference as MdLinkReference, List as MdList, ListItem as MdListItem, Paragraph as MdParagraph, PhrasingContent as MDPhrasingContent, Root, Root as MdRoot, RootContent as MdRootContent, Strong as MdStrong, Table as MdTable, TableCell as MdTableCell, TableRow as MdTableRow, Text as MdText, ThematicBreak as MdThematicBreak, Yaml as MdYaml } from "mdast";
@@ -40,9 +40,6 @@ declare const convertTextsSerialize: (slateTexts: readonly TText[], options: Ser
 //#region src/lib/serializer/listToMdastTree.d.ts
 declare function listToMdastTree(nodes: TListElement[], options: SerializeMdOptions, isBlock?: boolean): any;
 //#endregion
-//#region src/lib/serializer/serializeInlineMd.d.ts
-declare const serializeInlineMd: (editor: SlateEditor, options?: SerializeMdOptions) => string;
-//#endregion
 //#region src/lib/serializer/serializeMdWithSourceMap.d.ts
 type SelectionPath = number[];
 type MarkdownSourceMapKind = 'block' | 'blockquote' | 'code_block' | 'heading' | 'list_item' | 'media' | 'paragraph' | 'table_cell';
@@ -58,11 +55,36 @@ type MarkdownSourceMapSegment = {
   text: string;
 };
 type SerializeMdSourceMapResult = {
+  /** All segments including container-level (parent MDX) segments, sorted by path. */
+  allSegments: MarkdownSourceMapSegment[];
   markdown: string;
+  /** Leaf-level segments only (most precise per path). */
   segments: MarkdownSourceMapSegment[];
 };
 declare const serializeMdWithSourceMap: (editor: SlateEditor, options?: Omit<SerializeMdOptions, "editor">) => SerializeMdSourceMapResult;
 //#endregion
+//#region src/lib/serializer/resolveSelectionLines.d.ts
+type SelectionPoint = {
+  offset: number;
+  path: number[];
+};
+type SelectionRange = {
+  anchor: SelectionPoint;
+  focus: SelectionPoint;
+};
+type ResolveSelectionByPathResult = {
+  containsMdx: boolean;
+  endLine: number;
+  extractedMarkdown: string;
+  markdown: string;
+  segments: MarkdownSourceMapSegment[];
+  startLine: number;
+};
+declare const resolveSelectionByPath: (editor: SlateEditor, selection: SelectionRange, options?: Omit<SerializeMdOptions, "editor">) => ResolveSelectionByPathResult;
+//#endregion
+//#region src/lib/serializer/serializeInlineMd.d.ts
+declare const serializeInlineMd: (editor: SlateEditor, options?: SerializeMdOptions) => string;
+//#endregion
 //#region src/lib/serializer/wrapWithBlockId.d.ts
 /**
  * Wraps an mdast node with a block element containing an ID attribute. Used for
@@ -514,4 +536,4 @@ declare const tagRemarkPlugin: (pluginFn: any, tag: string) => {
 };
 declare const getRemarkPluginsWithoutMdx: (plugins: Plugin[]) => Plugin[];
 //#endregion
-export { AllowNodeConfig, DeserializeMdOptions, type MDPhrasingContent, MarkdownConfig, MarkdownPlugin, MarkdownSourceMapKind, MarkdownSourceMapSegment, type MdBlockquote, type MdBreak, type MdCode, type MdContent, MdDecoration, type MdDefinition, type MdDelete, type MdEmphasis, type MdFootnoteDefinition, type MdFootnoteReference, type MdHeading, type MdHtml, type MdImage, type MdImageReference, type MdInlineCode, type MdInlineMath, type MdLink, type MdLinkReference, type MdList, type MdListItem, MdMark, type MdMath, type MdMdxJsxFlowElement, type MdMdxJsxTextElement, MdNodeParser, type MdParagraph, type MdRoot, type MdRootContent, MdRules, type MdStrong, type MdTable, type MdTableCell, type MdTableRow, type MdText, type MdThematicBreak, MdType, type MdYaml, MentionNode, ParseMarkdownBlocksOptions, PlateType, REMARK_MDX_TAG, SerializeMdOptions, SerializeMdSourceMapResult, StrictPlateType, basicMarkdownMarks, buildMdastNode, buildRules, buildSlateNode, columnRules, convertChildrenDeserialize, convertNodesDeserialize, convertNodesSerialize, convertTextsDeserialize, convertTextsSerialize, customMdxDeserialize, defaultRules, deserializeInlineMd, deserializeMd, fontRules, getCustomMark, getDeserializerByKey, getMergedOptionsDeserialize, getMergedOptionsSerialize, getRemarkPluginsWithoutMdx, getSerializerByKey, getStyleValue, htmlToJsx, listToMdastTree, markdownToAstProcessor, markdownToSlateNodes, markdownToSlateNodesSafely, mdastToPlate, mdastToSlate, mediaRules, parseAttributes, parseMarkdownBlocks, plateToMdast, propsToAttributes, remarkMdx, remarkMention, serializeInlineMd, serializeMd, serializeMdWithSourceMap, splitIncompleteMdx, stripMarkdown, stripMarkdownBlocks, stripMarkdownInline, tagRemarkPlugin, type unistLib, unreachable, wrapWithBlockId };
+export { AllowNodeConfig, DeserializeMdOptions, type MDPhrasingContent, MarkdownConfig, MarkdownPlugin, MarkdownSourceMapKind, MarkdownSourceMapSegment, type MdBlockquote, type MdBreak, type MdCode, type MdContent, MdDecoration, type MdDefinition, type MdDelete, type MdEmphasis, type MdFootnoteDefinition, type MdFootnoteReference, type MdHeading, type MdHtml, type MdImage, type MdImageReference, type MdInlineCode, type MdInlineMath, type MdLink, type MdLinkReference, type MdList, type MdListItem, MdMark, type MdMath, type MdMdxJsxFlowElement, type MdMdxJsxTextElement, MdNodeParser, type MdParagraph, type MdRoot, type MdRootContent, MdRules, type MdStrong, type MdTable, type MdTableCell, type MdTableRow, type MdText, type MdThematicBreak, MdType, type MdYaml, MentionNode, ParseMarkdownBlocksOptions, PlateType, REMARK_MDX_TAG, ResolveSelectionByPathResult, SelectionRange, SerializeMdOptions, SerializeMdSourceMapResult, StrictPlateType, basicMarkdownMarks, buildMdastNode, buildRules, buildSlateNode, columnRules, convertChildrenDeserialize, convertNodesDeserialize, convertNodesSerialize, convertTextsDeserialize, convertTextsSerialize, customMdxDeserialize, defaultRules, deserializeInlineMd, deserializeMd, fontRules, getCustomMark, getDeserializerByKey, getMergedOptionsDeserialize, getMergedOptionsSerialize, getRemarkPluginsWithoutMdx, getSerializerByKey, getStyleValue, htmlToJsx, listToMdastTree, markdownToAstProcessor, markdownToSlateNodes, markdownToSlateNodesSafely, mdastToPlate, mdastToSlate, mediaRules, parseAttributes, parseMarkdownBlocks, plateToMdast, propsToAttributes, remarkMdx, remarkMention, resolveSelectionByPath, serializeInlineMd, serializeMd, serializeMdWithSourceMap, splitIncompleteMdx, stripMarkdown, stripMarkdownBlocks, stripMarkdownInline, tagRemarkPlugin, type unistLib, unreachable, wrapWithBlockId };

package/dist/index.js

@@ -1,9 +1,10 @@
 import { ElementApi, KEYS, TextApi, bindFirst, createTSlatePlugin, getPluginKey, getPluginType, isUrl } from "platejs";
 import "mdast-util-mdx";
+import { normalizeDateValue } from "@platejs/date";
 import kebabCase from "lodash/kebabCase.js";
-import remarkStringify from "remark-stringify";
-import { unified } from "unified";
 import { defaultHandlers, toMarkdown } from "mdast-util-to-markdown";
+import { unified } from "unified";
+import remarkStringify from "remark-stringify";
 import remarkParse from "remark-parse";
 import { marked } from "marked";
 import baseRemarkMdx from "remark-mdx";
@@ -131,7 +132,7 @@ function propsToAttributes(props) {
 	return Object.entries(props).map(([name, value]) => ({
 		name,
 		type: "mdxJsxAttribute",
-		value: typeof value === "string" ? value : JSON.stringify(value)
+		value: typeof value === "string" || value?.type === "mdxJsxAttributeValueExpression" ? value : JSON.stringify(value)
 	}));
 }
 
@@ -239,7 +240,7 @@ function createMediaRule() {
 			};
 		},
 		serialize: (node, options) => {
-			const { id, children, type, url, ...rest } = node;
+			const { children, type, url, ...rest } = node;
 			return {
 				attributes: propsToAttributes({
 					...rest,
@@ -255,6 +256,7 @@ function createMediaRule() {
 const mediaRules = {
 	audio: createMediaRule(),
 	file: createMediaRule(),
+	media_embed: createMediaRule(),
 	video: createMediaRule()
 };
 
@@ -655,45 +657,6 @@ const shouldIncludeNode$2 = (node, options) => {
 	return true;
 };
 
-//#endregion
-//#region src/lib/serializer/serializeInlineMd.ts
-const serializeInlineMd = (editor, options) => {
-	const mergedOptions = getMergedOptionsSerialize(editor, options);
-	const toRemarkProcessor = unified().use(mergedOptions.remarkPlugins ?? []).use(remarkStringify, {
-		emphasis: "_",
-		...mergedOptions?.remarkStringifyOptions
-	});
-	if (options?.value?.length === 0) return "";
-	const convertedTexts = convertTextsSerialize(mergedOptions.value, { editor });
-	return toRemarkProcessor.stringify({
-		children: convertedTexts,
-		type: "root"
-	});
-};
-
-//#endregion
-//#region src/lib/serializer/serializeMd.ts
-/** Serialize the editor value to Markdown. */
-const serializeMd = (editor, options) => {
-	const mergedOptions = getMergedOptionsSerialize(editor, options);
-	const { remarkPlugins, value } = mergedOptions;
-	const toRemarkProcessor = unified().use(remarkPlugins ?? []).use(remarkStringify, {
-		emphasis: "_",
-		...mergedOptions?.remarkStringifyOptions
-	});
-	const mdast = slateToMdast({
-		children: value,
-		options: mergedOptions
-	});
-	return toRemarkProcessor.stringify(mdast);
-};
-const slateToMdast = ({ children, options }) => {
-	return {
-		children: convertNodesSerialize(children, options, true),
-		type: "root"
-	};
-};
-
 //#endregion
 //#region src/lib/serializer/serializeMdWithSourceMap.ts
 const collectSlateText = (node) => {
@@ -770,7 +733,6 @@ const buildSource = (node, editor) => {
 	const path = Array.isArray(node.__sourceMapPath) ? node.__sourceMapPath : null;
 	if (!path) return null;
 	const text = collectSlateText(node);
-	if (!text.trim() && kind !== "media" && kind !== "block") return null;
 	return {
 		containsMdx: false,
 		kind,
@@ -826,6 +788,72 @@ const attachTableCellSources = (mdastTable, slateTable, editor) => {
 		}
 	}
 };
+/**
+* Custom serializers (e.g. MDX components) build their own mdast subtree,
+* bypassing convertNodesWithSource. Walk Slate and mdast element children
+* in parallel (by position) and attach sourceMap data so the handler
+* wrappers capture per-child segments during serialization.
+*
+* Position-based matching works because custom serializers preserve child
+* order. We filter to element children only (skip text/leaf nodes) in both
+* trees before zipping.
+*/
+/**
+* Walk the mdast list tree and attach sources from the flat Slate list
+* paragraphs. Slate uses flat paragraphs with `listStyleType` while mdast
+* nests them as list > listItem > paragraph. We walk both in document order
+* to zip them correctly.
+*/
+const attachListSources = (mdastList, slateListItems, editor, insideMdx) => {
+	let slateIdx = 0;
+	const walkList = (list) => {
+		if (!Array.isArray(list.children)) return;
+		for (const listItem of list.children) {
+			if (listItem.type !== "listItem" || !Array.isArray(listItem.children)) continue;
+			for (const child of listItem.children) if (child.type === "list") walkList(child);
+			else if (slateIdx < slateListItems.length) {
+				const slateChild = slateListItems[slateIdx++];
+				const source = buildSource(slateChild, editor);
+				if (source) {
+					if (insideMdx) source.containsMdx = true;
+					attachSource(child, source);
+				}
+			}
+		}
+	};
+	walkList(mdastList);
+};
+const attachDescendantSources = (mdastNode, slateNode, editor, insideMdx) => {
+	if (!insideMdx && !MDX_MDAST_TYPES.has(mdastNode?.type ?? "")) return;
+	const slateChildren = slateNode?.children;
+	const mdastChildren = mdastNode?.children;
+	if (!Array.isArray(slateChildren) || !Array.isArray(mdastChildren)) return;
+	const slateElements = slateChildren.filter((c) => c?.type && Array.isArray(c.children));
+	const mdastElements = mdastChildren.filter((c) => c.type && c.type !== "text");
+	let si = 0;
+	for (const mdastChild of mdastElements) {
+		if (mdastChild.type === "list") {
+			const listRun = [];
+			while (si < slateElements.length && slateElements[si].listStyleType) {
+				listRun.push(slateElements[si]);
+				si++;
+			}
+			attachListSources(mdastChild, listRun, editor, insideMdx);
+			continue;
+		}
+		if (si >= slateElements.length) break;
+		const slateChild = slateElements[si];
+		si++;
+		const isMdx = insideMdx || MDX_MDAST_TYPES.has(mdastChild.type ?? "");
+		const source = buildSource(slateChild, editor);
+		if (source) {
+			if (isMdx) source.containsMdx = true;
+			attachSource(mdastChild, source);
+		}
+		if (mdastChild.type === "table") attachTableCellSources(mdastChild, slateChild, editor);
+		else if (insideMdx || MDX_MDAST_TYPES.has(mdastChild.type ?? "")) attachDescendantSources(mdastChild, slateChild, editor, isMdx);
+	}
+};
 const buildMdastNodeWithSource = (node, options, isBlock = false) => {
 	let mdastNode = buildMdastNode(node, options, isBlock);
 	if (!mdastNode) {
@@ -847,19 +875,20 @@ const buildMdastNodeWithSource = (node, options, isBlock = false) => {
 		return mdastNode;
 	}
 	const source = buildSource(node, options.editor);
+	const isMdxOutput = MDX_MDAST_TYPES.has(mdastNode?.type ?? "");
 	if (!source) {
-		if (mdastNode && MDX_MDAST_TYPES.has(mdastNode.type ?? "")) propagateMdxFlag(mdastNode);
+		if (isMdxOutput) propagateMdxFlag(mdastNode);
+		attachDescendantSources(mdastNode, node, options.editor, isMdxOutput);
 		return mdastNode;
 	}
-	if (MDX_MDAST_TYPES.has(mdastNode?.type ?? "")) {
-		source.containsMdx = true;
-		if (Array.isArray(mdastNode?.children)) for (const child of mdastNode.children) propagateMdxFlag(child);
-	}
+	if (isMdxOutput) source.containsMdx = true;
 	if (source.kind === "blockquote" && Array.isArray(mdastNode?.children) && mdastNode.children[0]) {
 		attachSource(mdastNode.children[0], source);
 		return mdastNode;
 	}
-	return attachSource(mdastNode, source);
+	attachSource(mdastNode, source);
+	attachDescendantSources(mdastNode, node, options.editor, isMdxOutput);
+	return mdastNode;
 };
 const convertNodesWithSource = (nodes, options, isBlock = false) => {
 	const mdastNodes = [];
@@ -1046,13 +1075,248 @@ const serializeMdWithSourceMap = (editor, options) => {
 	}
 	const ordered = Array.from(deduped.values()).sort((a, b) => comparePaths(a.path, b.path));
 	return {
+		allSegments: ordered,
 		markdown,
 		segments: ordered.filter((seg) => !ordered.some((other) => other !== seg && isPathPrefix(seg.path, other.path)))
 	};
 };
 
+//#endregion
+//#region src/lib/serializer/resolveSelectionLines.ts
+const MDX_TAG_RE = /<[a-zA-Z_][\w.-]*/;
+/** `a` is an ancestor-or-self of `b`: a's path is a prefix of (or equal to) b's. */
+const isAncestorOrSelf = (a, b) => a.length <= b.length && a.every((v, i) => b[i] === v);
+const comparePoints = (a, b) => {
+	const len = Math.max(a.path.length, b.path.length);
+	for (let i = 0; i < len; i++) {
+		const av = a.path[i] ?? 0;
+		const bv = b.path[i] ?? 0;
+		if (av !== bv) return av - bv;
+	}
+	return a.offset - b.offset;
+};
+/**
+* Find the segment covering the start of a selection at `path`.
+*
+* 1. Ancestor-or-self: segment whose path is a prefix of `path` (most specific wins)
+* 2. First descendant: `path` is a prefix of segment's path (container selection)
+*/
+const findStartSegment = (segments, path) => {
+	let best = null;
+	let bestLen = -1;
+	for (const seg of segments) if (isAncestorOrSelf(seg.path, path) && seg.path.length > bestLen) {
+		best = seg;
+		bestLen = seg.path.length;
+	}
+	if (best) return best;
+	for (const seg of segments) if (isAncestorOrSelf(path, seg.path)) return seg;
+	return null;
+};
+/**
+* Find the segment covering the end of a selection at `path`.
+*
+* Same as findStartSegment but for descendant matches picks the LAST one
+* (the container's last child segment).
+*/
+const findEndSegment = (segments, path) => {
+	let best = null;
+	let bestLen = -1;
+	for (const seg of segments) if (isAncestorOrSelf(seg.path, path) && seg.path.length > bestLen) {
+		best = seg;
+		bestLen = seg.path.length;
+	}
+	if (best) return best;
+	let last = null;
+	for (const seg of segments) if (isAncestorOrSelf(path, seg.path)) last = seg;
+	return last;
+};
+/** Recursively compute the total text length of a Slate node. */
+const getTextLength = (node) => {
+	if (typeof node?.text === "string") return node.text.length;
+	if (Array.isArray(node?.children)) return node.children.reduce((sum, child) => sum + getTextLength(child), 0);
+	return 0;
+};
+/** Walk the editor tree to reach the node at `path`. */
+const getNodeAtPath = (editor, path) => {
+	let node = { children: editor.children };
+	for (const idx of path) {
+		if (!node?.children?.[idx]) return null;
+		node = node.children[idx];
+	}
+	return node;
+};
+/**
+* Compute the absolute character offset within a segment's text.
+*
+* Given a segment at `segPath` (e.g. [1,3,0] = a paragraph) and a selection
+* point at `selPath` (e.g. [1,3,0,1] = second text node) with `selOffset`,
+* sum up text lengths of all Slate nodes preceding the selection point within
+* the segment, then add `selOffset`.
+*/
+const computeAbsoluteOffset = (editor, segPath, selPath, selOffset) => {
+	const segNode = getNodeAtPath(editor, segPath);
+	if (!segNode) return null;
+	const remainingPath = selPath.slice(segPath.length);
+	if (remainingPath.length === 0) {
+		let textOffset = 0;
+		const children = segNode.children ?? [];
+		for (let i = 0; i < Math.min(selOffset, children.length); i++) textOffset += getTextLength(children[i]);
+		return textOffset;
+	}
+	let current = segNode;
+	let accumulated = 0;
+	for (const childIdx of remainingPath) {
+		const children = current.children ?? [];
+		for (let i = 0; i < childIdx && i < children.length; i++) accumulated += getTextLength(children[i]);
+		if (!children[childIdx]) return null;
+		current = children[childIdx];
+	}
+	return accumulated + selOffset;
+};
+/**
+* Given a segment and an absolute text offset, determine which line within
+* the segment the offset falls on.
+*/
+const offsetToLine = (segText, segStartLine, absOffset) => {
+	const clamped = Math.max(0, Math.min(absOffset, segText.length));
+	return segStartLine + (segText.slice(0, clamped).match(/\n/g) ?? []).length;
+};
+/**
+* Whether a segment supports sub-line narrowing. Only for kinds where text
+* content lines map 1:1 to markdown output lines (no structural wrappers
+* like code fences, MDX tags, or table delimiters).
+*/
+const NARROWABLE_KINDS = new Set([
+	"paragraph",
+	"heading",
+	"list_item",
+	"blockquote"
+]);
+const canNarrow = (seg) => NARROWABLE_KINDS.has(seg.kind);
+const extractLines = (md, start, end) => md.split("\n").slice(start - 1, end).join("\n");
+/**
+* Resolve which markdown lines correspond to a Plate editor selection
+* using the source-map path mapping (no text matching).
+*
+* 1. Serializes editor to markdown with source-map segments
+* 2. Finds the segment matching the anchor path (longest prefix)
+* 3. Finds the segment matching the focus path
+* 4. Narrows to sub-line precision using selection offsets
+* 5. Returns the line range and extracted markdown
+*/
+/**
+* When the selection lands on a container path (e.g. clicking an MDX label),
+* look up the container segment in `allSegments` to include the MDX wrapper
+* lines (opening/closing tags) rather than just the inner content.
+*/
+const tryContainerExpand = ({ allSegments, leafSeg, selPath, currentLine, direction }) => {
+	if (!leafSeg) return currentLine;
+	if (selPath.length >= leafSeg.path.length) return currentLine;
+	let containerSeg = null;
+	let containerLen = -1;
+	for (const seg of allSegments) if (isAncestorOrSelf(seg.path, selPath) && seg.path.length > containerLen && seg !== leafSeg) {
+		containerSeg = seg;
+		containerLen = seg.path.length;
+	}
+	for (const seg of allSegments) if (seg.path.length === selPath.length && seg.path.every((v, i) => selPath[i] === v)) {
+		containerSeg = seg;
+		break;
+	}
+	if (!containerSeg) return currentLine;
+	return direction === "start" ? Math.min(currentLine, containerSeg.startLine) : Math.max(currentLine, containerSeg.endLine);
+};
+const resolveSelectionByPath = (editor, selection, options) => {
+	const { allSegments, markdown, segments } = serializeMdWithSourceMap(editor, options);
+	const [start, end] = comparePoints(selection.anchor, selection.focus) <= 0 ? [selection.anchor, selection.focus] : [selection.focus, selection.anchor];
+	const startSeg = findStartSegment(segments, start.path);
+	const endSeg = findEndSegment(segments, end.path);
+	if (!startSeg && !endSeg) return {
+		containsMdx: false,
+		endLine: 1,
+		extractedMarkdown: "",
+		markdown,
+		segments,
+		startLine: 1
+	};
+	let startLine = startSeg?.startLine ?? endSeg.startLine;
+	let endLine = endSeg?.endLine ?? startSeg.endLine;
+	if (startSeg && startSeg.endLine > startSeg.startLine && canNarrow(startSeg)) {
+		const absOffset = computeAbsoluteOffset(editor, startSeg.path, start.path, start.offset);
+		if (absOffset !== null) startLine = offsetToLine(startSeg.text, startSeg.startLine, absOffset);
+	}
+	if (endSeg && endSeg.endLine > endSeg.startLine && canNarrow(endSeg)) {
+		const absOffset = computeAbsoluteOffset(editor, endSeg.path, end.path, end.offset);
+		if (absOffset !== null) endLine = offsetToLine(endSeg.text, endSeg.startLine, absOffset);
+	}
+	startLine = tryContainerExpand({
+		allSegments,
+		currentLine: startLine,
+		direction: "start",
+		leafSeg: startSeg,
+		selPath: start.path
+	});
+	endLine = tryContainerExpand({
+		allSegments,
+		currentLine: endLine,
+		direction: "end",
+		leafSeg: endSeg,
+		selPath: end.path
+	});
+	if (startLine > endLine) [startLine, endLine] = [endLine, startLine];
+	const extractedMarkdown = extractLines(markdown, startLine, endLine);
+	return {
+		containsMdx: extractedMarkdown.includes("<") && MDX_TAG_RE.test(extractedMarkdown),
+		endLine,
+		extractedMarkdown,
+		markdown,
+		segments,
+		startLine
+	};
+};
+
+//#endregion
+//#region src/lib/serializer/serializeInlineMd.ts
+const serializeInlineMd = (editor, options) => {
+	const mergedOptions = getMergedOptionsSerialize(editor, options);
+	const toRemarkProcessor = unified().use(mergedOptions.remarkPlugins ?? []).use(remarkStringify, {
+		emphasis: "_",
+		...mergedOptions?.remarkStringifyOptions
+	});
+	if (options?.value?.length === 0) return "";
+	const convertedTexts = convertTextsSerialize(mergedOptions.value, { editor });
+	return toRemarkProcessor.stringify({
+		children: convertedTexts,
+		type: "root"
+	});
+};
+
+//#endregion
+//#region src/lib/serializer/serializeMd.ts
+/** Serialize the editor value to Markdown. */
+const serializeMd = (editor, options) => {
+	const mergedOptions = getMergedOptionsSerialize(editor, options);
+	const { remarkPlugins, value } = mergedOptions;
+	const toRemarkProcessor = unified().use(remarkPlugins ?? []).use(remarkStringify, {
+		emphasis: "_",
+		resourceLink: false,
+		...mergedOptions?.remarkStringifyOptions
+	});
+	const mdast = slateToMdast({
+		children: value,
+		options: mergedOptions
+	});
+	return toRemarkProcessor.stringify(mdast);
+};
+const slateToMdast = ({ children, options }) => {
+	return {
+		children: convertNodesSerialize(children, options, true),
+		type: "root"
+	};
+};
+
 //#endregion
 //#region src/lib/rules/defaultRules.ts
+const BARE_AUTOLINK_PROTOCOL_REGEX = /^https?:\/\//i;
 const LEADING_NEWLINE_REGEX = /^\n/;
 function isBoolean(value) {
 	return value === true || value === false || !!value && typeof value === "object" && Object.prototype.toString.call(value) === "[object Boolean]";
@@ -1070,6 +1334,33 @@ const deserializeClassicListItemChildren = (mdastChildren, deco, options) => {
 	if (!children.some((child) => child.type === licType)) children.unshift(createClassicListItemContent(options.editor));
 	return children;
 };
+const groupInlineChildrenIntoParagraphs = (editor, children = []) => {
+	const paragraphType = getPluginType(editor, KEYS.p);
+	const elements = [];
+	let inlineNodes = [];
+	const flushInlineNodes = () => {
+		if (inlineNodes.length === 0) return;
+		elements.push({
+			children: inlineNodes,
+			type: paragraphType
+		});
+		inlineNodes = [];
+	};
+	children.forEach((child) => {
+		if (ElementApi.isElement(child) && !editor.api.isInline(child) && editor.api.isBlock(child)) {
+			flushInlineNodes();
+			elements.push(child);
+			return;
+		}
+		inlineNodes.push(child);
+	});
+	flushInlineNodes();
+	if (elements.length > 0) return elements;
+	return [{
+		children: [{ text: "" }],
+		type: paragraphType
+	}];
+};
 const defaultRules = {
 	a: {
 		deserialize: (mdastNode, deco, options) => ({
@@ -1077,48 +1368,29 @@ const defaultRules = {
 			type: getPluginType(options.editor, KEYS.a),
 			url: mdastNode.url
 		}),
-		serialize: (node, options) => ({
-			children: convertNodesSerialize(node.children, options),
-			type: "link",
-			url: node.url
-		})
-	},
-	blockquote: {
-		deserialize: (mdastNode, deco, options) => {
-			return {
-				children: (mdastNode.children.length > 0 ? mdastNode.children.flatMap((paragraph, index, children) => {
-					if (paragraph.type === "paragraph") {
-						if (children.length > 1 && children.length - 1 !== index) {
-							const paragraphChildren = convertChildrenDeserialize(paragraph.children, deco, options);
-							paragraphChildren.push({ text: "\n" }, { text: "\n" });
-							return paragraphChildren;
-						}
-						return convertChildrenDeserialize(paragraph.children, deco, options);
-					}
-					if ("children" in paragraph) return convertChildrenDeserialize(paragraph.children, deco, options);
-					return [{ text: "" }];
-				}) : [{ text: "" }]).flatMap((child) => child.type === "blockquote" ? child.children : [child]),
-				type: getPluginType(options.editor, KEYS.blockquote)
-			};
-		},
 		serialize: (node, options) => {
-			const nodes = [];
-			for (const child of node.children) if (child.text === "\n") nodes.push({ type: "break" });
-			else nodes.push(child);
-			const paragraphChildren = convertNodesSerialize(nodes, options);
-			if (paragraphChildren.length > 0 && paragraphChildren.at(-1).type === "break") {
-				paragraphChildren.at(-1).type = "html";
-				paragraphChildren.at(-1).value = "\n<br />";
-			}
+			const children = convertNodesSerialize(node.children, options);
+			if (children.length === 1 && children[0]?.type === "text" && children[0].value === node.url && BARE_AUTOLINK_PROTOCOL_REGEX.test(node.url ?? "")) return {
+				type: "html",
+				value: node.url
+			};
 			return {
-				children: [{
-					children: paragraphChildren,
-					type: "paragraph"
-				}],
-				type: "blockquote"
+				children,
+				type: "link",
+				url: node.url
 			};
 		}
 	},
+	blockquote: {
+		deserialize: (mdastNode, deco, options) => ({
+			children: groupInlineChildrenIntoParagraphs(options.editor, convertNodesDeserialize(mdastNode.children, deco, options)),
+			type: getPluginType(options.editor, KEYS.blockquote)
+		}),
+		serialize: (node, options) => ({
+			children: convertNodesSerialize(groupInlineChildrenIntoParagraphs(options.editor, node.children), options),
+			type: "blockquote"
+		})
+	},
 	bold: {
 		mark: true,
 		deserialize: (mdastNode, deco, options) => convertTextsDeserialize(mdastNode, deco, options)
@@ -1194,18 +1466,25 @@ const defaultRules = {
 	},
 	date: {
 		deserialize(mdastNode, _deco, options) {
+			const props = parseAttributes(mdastNode.attributes);
 			return {
 				children: [{ text: "" }],
-				date: (mdastNode.children?.[0])?.value || "",
+				...normalizeDateValue(typeof props.value === "string" ? props.value : (mdastNode.children?.[0])?.value || ""),
 				type: getPluginType(options.editor, KEYS.date)
 			};
 		},
-		serialize({ date }) {
+		serialize({ date, rawDate }) {
+			if (date && !rawDate) return {
+				attributes: propsToAttributes({ value: date }),
+				children: [],
+				name: "date",
+				type: "mdxJsxTextElement"
+			};
 			return {
 				attributes: [],
 				children: [{
 					type: "text",
-					value: date ?? ""
+					value: rawDate ?? date ?? ""
 				}],
 				name: "date",
 				type: "mdxJsxTextElement"
@@ -1230,13 +1509,47 @@ const defaultRules = {
 			value: node.texExpression
 		})
 	},
-	footnoteDefinition: { deserialize: (mdastNode, deco, options) => {
-		return {
-			children: convertChildrenDeserialize(mdastNode.children, deco, options).flatMap((child) => child.type === "p" ? child.children : [child]),
-			type: getPluginType(options.editor, KEYS.p)
-		};
-	} },
-	footnoteReference: {},
+	footnoteDefinition: {
+		deserialize: (mdastNode, deco, options) => {
+			const paragraphType = getPluginType(options.editor, KEYS.p);
+			const blocks = convertNodesDeserialize(mdastNode.children, deco, options).map((child) => child.type === paragraphType ? child : {
+				children: [child],
+				type: paragraphType
+			});
+			const identifier = mdastNode.identifier;
+			if (blocks.length === 0) return {
+				children: [{
+					children: [{ text: "" }],
+					type: paragraphType
+				}],
+				identifier,
+				type: getPluginType(options.editor, "footnoteDefinition")
+			};
+			return {
+				children: blocks,
+				identifier,
+				type: getPluginType(options.editor, "footnoteDefinition")
+			};
+		},
+		serialize: (node, options) => ({
+			children: convertNodesSerialize(node.children, options),
+			identifier: node.identifier,
+			type: "footnoteDefinition"
+		})
+	},
+	footnoteReference: {
+		deserialize: (mdastNode, _deco, options) => {
+			return {
+				children: [{ text: "" }],
+				identifier: mdastNode.identifier ?? "",
+				type: getPluginType(options.editor, "footnoteReference")
+			};
+		},
+		serialize: (node) => ({
+			identifier: node.identifier ?? node.children?.map((child) => child.text ?? "").join("") ?? "",
+			type: "footnoteReference"
+		})
+	},
 	heading: {
 		deserialize: (mdastNode, deco, options) => {
 			const defaultType = {
@@ -1308,11 +1621,11 @@ const defaultRules = {
 				...rest
 			};
 		},
-		serialize: ({ caption, url }) => {
+		serialize: ({ caption, title, url }) => {
 			return {
 				children: [{
 					alt: caption ? caption.map((c) => c.text).join("") : void 0,
-					title: caption ? caption.map((c) => c.text).join("") : void 0,
+					title: typeof title === "string" ? title : void 0,
 					type: "image",
 					url
 				}],
@@ -1758,6 +2071,34 @@ const getDeserializerByKey = (key, options) => {
 
 //#endregion
 //#region src/lib/deserializer/utils/customMdxDeserialize.ts
+const MDX_ATTR_NAME_TO_HTML_ATTR = {
+	className: "class",
+	htmlFor: "for"
+};
+const serializeUnknownMdxChild = (child) => {
+	if (child?.type === "mdxJsxTextElement" || child?.type === "mdxJsxFlowElement") return serializeUnknownMdxNode(child);
+	if ("value" in (child ?? {})) return child.value ?? "";
+	if (Array.isArray(child?.children)) return child.children.map(serializeUnknownMdxChild).join("");
+	return "";
+};
+const serializeUnknownMdxAttributes = (attributes) => {
+	if (!attributes?.length) return "";
+	const serialized = attributes.map((attribute) => {
+		const name = MDX_ATTR_NAME_TO_HTML_ATTR[attribute.name] ?? attribute.name;
+		if (attribute.value === void 0 || attribute.value === null) return name;
+		if (typeof attribute.value === "object" && attribute.value?.type === "mdxJsxAttributeValueExpression") return `${name}={${attribute.value.value}}`;
+		return `${name}="${String(attribute.value)}"`;
+	});
+	return serialized.length > 0 ? ` ${serialized.join(" ")}` : "";
+};
+const serializeUnknownMdxNode = (mdastNode) => {
+	const attrs = serializeUnknownMdxAttributes(mdastNode.attributes);
+	const openTag = `<${mdastNode.name}${attrs}`;
+	if (!mdastNode.children?.length) return `${openTag} />`;
+	const inner = mdastNode.children.map(serializeUnknownMdxChild).join(mdastNode.type === "mdxJsxFlowElement" ? "\n" : "");
+	if (mdastNode.type === "mdxJsxFlowElement") return `${openTag}>\n${inner}\n</${mdastNode.name}>`;
+	return `${openTag}>${inner}</${mdastNode.name}>`;
+};
 const customMdxDeserialize = (mdastNode, deco, options) => {
 	const customJsxElementKey = mdastNode.name;
 	const key = getPluginKey(options.editor, customJsxElementKey) ?? mdastNode.name;
@@ -1765,26 +2106,11 @@ const customMdxDeserialize = (mdastNode, deco, options) => {
 		const nodeParserDeserialize = getDeserializerByKey(mdastToPlate(options.editor, key), options);
 		if (nodeParserDeserialize) return nodeParserDeserialize(mdastNode, deco, options);
 	} else console.warn("This MDX node does not have a parser for deserialization", mdastNode);
-	if (mdastNode.type === "mdxJsxTextElement") {
-		const tagName = mdastNode.name;
-		let textContent = "";
-		if (mdastNode.children) textContent = mdastNode.children.map((child) => {
-			if ("value" in child) return child.value;
-			return "";
-		}).join("");
-		return [{ text: `<${tagName}>${textContent}</${tagName}>` }];
-	}
-	if (mdastNode.type === "mdxJsxFlowElement") {
-		const tagName = mdastNode.name;
-		return [{
-			children: [
-				{ text: `<${tagName}>\n` },
-				...convertChildrenDeserialize(mdastNode.children, deco, options),
-				{ text: `\n</${tagName}>` }
-			],
-			type: getPluginType(options.editor, KEYS.p)
-		}];
-	}
+	if (mdastNode.type === "mdxJsxTextElement") return [{ text: serializeUnknownMdxNode(mdastNode) }];
+	if (mdastNode.type === "mdxJsxFlowElement") return [{
+		children: [{ text: serializeUnknownMdxNode(mdastNode) }],
+		type: getPluginType(options.editor, KEYS.p)
+	}];
 };
 
 //#endregion
@@ -2292,4 +2618,4 @@ const remarkMention = () => (tree) => {
 };
 
 //#endregion
-export { MarkdownPlugin, REMARK_MDX_TAG, basicMarkdownMarks, buildMdastNode, buildRules, buildSlateNode, columnRules, convertChildrenDeserialize, convertNodesDeserialize, convertNodesSerialize, convertTextsDeserialize, convertTextsSerialize, customMdxDeserialize, defaultRules, deserializeInlineMd, deserializeMd, fontRules, getCustomMark, getDeserializerByKey, getMergedOptionsDeserialize, getMergedOptionsSerialize, getRemarkPluginsWithoutMdx, getSerializerByKey, getStyleValue, htmlToJsx, listToMdastTree, markdownToAstProcessor, markdownToSlateNodes, markdownToSlateNodesSafely, mdastToPlate, mdastToSlate, mediaRules, parseAttributes, parseMarkdownBlocks, plateToMdast, propsToAttributes, remarkMdx, remarkMention, serializeInlineMd, serializeMd, serializeMdWithSourceMap, splitIncompleteMdx, stripMarkdown, stripMarkdownBlocks, stripMarkdownInline, tagRemarkPlugin, unreachable, wrapWithBlockId };
+export { MarkdownPlugin, REMARK_MDX_TAG, basicMarkdownMarks, buildMdastNode, buildRules, buildSlateNode, columnRules, convertChildrenDeserialize, convertNodesDeserialize, convertNodesSerialize, convertTextsDeserialize, convertTextsSerialize, customMdxDeserialize, defaultRules, deserializeInlineMd, deserializeMd, fontRules, getCustomMark, getDeserializerByKey, getMergedOptionsDeserialize, getMergedOptionsSerialize, getRemarkPluginsWithoutMdx, getSerializerByKey, getStyleValue, htmlToJsx, listToMdastTree, markdownToAstProcessor, markdownToSlateNodes, markdownToSlateNodesSafely, mdastToPlate, mdastToSlate, mediaRules, parseAttributes, parseMarkdownBlocks, plateToMdast, propsToAttributes, remarkMdx, remarkMention, resolveSelectionByPath, serializeInlineMd, serializeMd, serializeMdWithSourceMap, splitIncompleteMdx, stripMarkdown, stripMarkdownBlocks, stripMarkdownInline, tagRemarkPlugin, unreachable, wrapWithBlockId };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lofcz/platejs-markdown",
-  "version": "52.3.8",
+  "version": "53.0.0",
   "description": "Markdown serializer plugin for Plate",
   "keywords": [
     "markdown",
@@ -42,18 +42,21 @@
     "remark-stringify": "^11.0.0",
     "ts-essentials": "10.1.0",
     "unified": "^11.0.5",
-    "unist-util-visit": "5.0.0"
+    "unist-util-visit": "5.0.0",
+    "@platejs/date": "npm:@lofcz/platejs-date@53.0.0"
   },
   "devDependencies": {
     "@types/mdast": "^4.0.4",
     "@types/unist": "^3.0.3",
+    "remark-emoji": "5.0.1",
     "remark-gfm": "4.0.1",
     "remark-math": "6.0.0",
     "@plate/scripts": "1.0.0",
-    "platejs": "npm:@lofcz/platejs@52.3.6"
+    "@platejs/footnote": "npm:@lofcz/platejs-footnote@53.0.0",
+    "platejs": "npm:@lofcz/platejs@53.0.0"
   },
   "peerDependencies": {
-    "platejs": ">=52.0.11",
+    "platejs": ">=53.0.0",
     "react": ">=18.0.0",
     "react-dom": ">=18.0.0"
   },