comark-ui 0.7.2 → 0.7.5

package/dist/{editor-BAdok66p.mjs → editor-DmxNPK7K.mjs}

@@ -1,11 +1,15 @@
-import { parseMarkdown } from "comark";
-import { Extension, Node } from "@tiptap/core";
+import cjk from "comark-cjk";
+import critic from "comark-critic";
+import deflist from "comark-deflist";
+import footnotes from "comark-footnotes";
+import { defineComarkPlugin, parseMarkdown } from "comark";
+import { Extension, Mark, Node } from "@tiptap/core";
 import Image from "@tiptap/extension-image";
 import { TaskItem, TaskList } from "@tiptap/extension-list";
 import { TableKit } from "@tiptap/extension-table";
 import StarterKit from "@tiptap/starter-kit";
 import { renderMarkdown } from "comark/render";
-import { textContent } from "comark/utils";
+import { indent, textContent } from "comark/utils";
 import { Plugin, PluginKey } from "@tiptap/pm/state";
 import { Decoration, DecorationSet } from "@tiptap/pm/view";
 //#region src/editor/kit.ts
@@ -30,12 +34,26 @@ const typesWithProps = [
 	"italic",
 	"strike",
 	"code",
-	"link"
+	"link",
+	"definitionList",
+	"definitionTerm",
+	"definitionDescription"
 ];
-/** Comark attributes the editor doesn't show, carried as they were parsed so writing the node back keeps them. */
+function readProps(element) {
+	try {
+		return JSON.parse(element.getAttribute("data-comark-props") ?? "null");
+	} catch {
+		return null;
+	}
+}
+/**
+* Comark attributes the editor doesn't show, carried as they were parsed so writing the node back keeps them. They're
+* in the HTML too, since the clipboard copies nodes as HTML: a pasted `::screenshot` keeps its `src`.
+*/
 const props = {
 	default: null,
-	rendered: false
+	parseHTML: readProps,
+	renderHTML: (attrs) => attrs.props ? { "data-comark-props": JSON.stringify(attrs.props) } : {}
 };
 const name = (attribute) => ({
 	default: "",
@@ -123,9 +141,157 @@ const ComarkComment = Node.create({
 	parseHTML: () => [{ tag: "div[data-comark-comment]" }],
 	renderHTML: ({ HTMLAttributes }) => ["div", HTMLAttributes]
 });
+const label = {
+	default: "",
+	parseHTML: (element) => element.getAttribute("data-label") ?? "",
+	renderHTML: (attrs) => ({ "data-label": attrs.label })
+};
+/** A footnote reference, `[^label]`. */
+const FootnoteReference = Node.create({
+	name: "footnoteReference",
+	group: "inline",
+	inline: true,
+	atom: true,
+	addAttributes: () => ({ label }),
+	parseHTML: () => [{ tag: "sup[data-footnote-reference]" }],
+	renderHTML: ({ node, HTMLAttributes }) => [
+		"sup",
+		{
+			...HTMLAttributes,
+			"data-footnote-reference": ""
+		},
+		node.attrs.label
+	]
+});
+/** A note written where it applies, `^[text]`. */
+const InlineFootnote = Node.create({
+	name: "inlineFootnote",
+	group: "inline",
+	inline: true,
+	content: "inline*",
+	parseHTML: () => [{ tag: "span[data-inline-footnote]" }],
+	renderHTML: ({ HTMLAttributes }) => [
+		"span",
+		{
+			...HTMLAttributes,
+			"data-inline-footnote": ""
+		},
+		0
+	]
+});
+/** A footnote's text, `[^label]: text`, with the blocks indented under it. */
+const FootnoteDefinition = Node.create({
+	name: "footnoteDefinition",
+	group: "block",
+	content: "block+",
+	defining: true,
+	addAttributes: () => ({ label }),
+	parseHTML: () => [{ tag: "div[data-footnote-definition]" }],
+	renderHTML: ({ HTMLAttributes }) => [
+		"div",
+		{
+			...HTMLAttributes,
+			"data-footnote-definition": ""
+		},
+		0
+	]
+});
+/** A definition list, `Term` then `: Definition`. */
+const DefinitionList = Node.create({
+	name: "definitionList",
+	group: "block",
+	content: "(definitionTerm definitionDescription+)+",
+	parseHTML: () => [{ tag: "dl" }],
+	renderHTML: ({ HTMLAttributes }) => [
+		"dl",
+		HTMLAttributes,
+		0
+	]
+});
+const DefinitionTerm = Node.create({
+	name: "definitionTerm",
+	content: "inline*",
+	defining: true,
+	parseHTML: () => [{ tag: "dt" }],
+	renderHTML: ({ HTMLAttributes }) => [
+		"dt",
+		HTMLAttributes,
+		0
+	]
+});
+const DefinitionDescription = Node.create({
+	name: "definitionDescription",
+	content: "block+",
+	defining: true,
+	parseHTML: () => [{ tag: "dd" }],
+	renderHTML: ({ HTMLAttributes }) => [
+		"dd",
+		HTMLAttributes,
+		0
+	]
+});
+const substitution$2 = {
+	default: false,
+	parseHTML: (element) => element.hasAttribute("data-substitution"),
+	renderHTML: (attrs) => attrs.substitution ? { "data-substitution": "" } : {}
+};
+/** CriticMarkup's suggested insertion, `{++text++}`. */
+const CriticInsertion = Mark.create({
+	name: "criticInsertion",
+	addAttributes: () => ({ substitution: substitution$2 }),
+	parseHTML: () => [{ tag: "ins" }],
+	renderHTML: ({ HTMLAttributes }) => [
+		"ins",
+		HTMLAttributes,
+		0
+	]
+});
+/** CriticMarkup's suggested deletion, `{--text--}`. */
+const CriticDeletion = Mark.create({
+	name: "criticDeletion",
+	addAttributes: () => ({ substitution: substitution$2 }),
+	parseHTML: () => [{
+		tag: "del[data-critic]",
+		priority: 60
+	}],
+	renderHTML: ({ HTMLAttributes }) => [
+		"del",
+		{
+			...HTMLAttributes,
+			"data-critic": ""
+		},
+		0
+	]
+});
+/** CriticMarkup's highlight, `{==text==}`. */
+const CriticHighlight = Mark.create({
+	name: "criticHighlight",
+	parseHTML: () => [{ tag: "mark" }],
+	renderHTML: ({ HTMLAttributes }) => [
+		"mark",
+		HTMLAttributes,
+		0
+	]
+});
+/** CriticMarkup's comment, `{>>text<<}`. */
+const CriticComment = Node.create({
+	name: "criticComment",
+	group: "inline",
+	inline: true,
+	content: "inline*",
+	parseHTML: () => [{ tag: "span[data-critic-comment]" }],
+	renderHTML: ({ HTMLAttributes }) => [
+		"span",
+		{
+			...HTMLAttributes,
+			"data-critic-comment": ""
+		},
+		0
+	]
+});
 /**
 * The schema `fromMarkdown` and `toMarkdown` read and write: StarterKit's nodes and marks, task lists, inline images,
-* tables, and Comark's components, slots, and comments. It needs no DOM, so a server can load it to convert a document
+* tables, footnotes, definition lists, CriticMarkup, and Comark's components, slots, and comments. It needs no DOM, so a server can load it to convert a document
 * for a collaborative room.
 */
 const ComarkKit = Extension.create({
@@ -137,7 +303,9 @@ const ComarkKit = Extension.create({
 	}],
 	addExtensions() {
 		return [
-			StarterKit.configure({
+			StarterKit.extend({ addExtensions() {
+				return (this.parent?.() ?? []).map((extension) => extension.name === "code" ? extension.extend({ excludes: "" }) : extension);
+			} }).configure({
 				...this.options.starterKit,
 				underline: false
 			}),
@@ -148,16 +316,196 @@ const ComarkKit = Extension.create({
 			ComarkBlock,
 			ComarkSlot,
 			ComarkInline,
-			ComarkComment
+			ComarkComment,
+			FootnoteReference,
+			InlineFootnote,
+			FootnoteDefinition,
+			DefinitionList,
+			DefinitionTerm,
+			DefinitionDescription,
+			CriticInsertion,
+			CriticDeletion,
+			CriticHighlight,
+			CriticComment
 		];
 	}
 });
 //#endregion
+//#region src/editor/handlers.ts
+const handlers = /* @__PURE__ */ new WeakMap();
+const isElement$1 = (node) => Array.isArray(node) && node[0] !== null;
+/** Marks `node` to be written by `handler`. */
+function own(node, handler) {
+	handlers.set(node, handler);
+	return node;
+}
+const writeOptions = {
+	headingIds: false,
+	maxInlineAttributes: Number.POSITIVE_INFINITY,
+	components: { owned: {
+		match: (node) => handlers.has(node),
+		handler: (node, state, parent) => handlers.get(node)?.(node, state, parent) ?? ""
+	} }
+};
+const TABLE = "comark-editor-table";
+/**
+* A block component, `::name`. Written with no parent, since Comark indents a component inside another, and authors
+* write them flush: the colons already say how deep each one is.
+*/
+const blockComponent = async (node, state) => {
+	const [tag, attrs, ...children] = node;
+	if (tag !== "table") return state.handlers.mdc(node, state);
+	return (await state.handlers.mdc([
+		TABLE,
+		attrs,
+		...children
+	], state)).replace(TABLE, "table");
+};
+/** An inline component, `:name[text]{props}`, which Comark would write as a block when it's alone in its paragraph. */
+const inlineComponent = async (node, state, parent) => {
+	const revert = state.applyContext({ inline: true });
+	try {
+		return await state.handlers.mdc(node, state, parent);
+	} finally {
+		state.applyContext(revert);
+	}
+};
+/**
+* A task, written as a list item with its check box added after the marker. Comark's own writer indents the blocks
+* under a task by the width of `- [ ] `, which reads them back as code.
+*/
+const task = (checked) => async (node, state, parent) => (await state.handlers.li(node, state, parent)).replace(/^(- |\d+\. )/, `$1[${checked ? "x" : " "}] `);
+const END = "";
+/** A code block that ends in blank lines, which Comark's writer trims off. */
+const trailingLines = async ([tag, attrs, ...children], state) => {
+	const written = await state.handlers.pre([
+		tag,
+		attrs,
+		...children,
+		END
+	], state);
+	const at = written.lastIndexOf(END);
+	return written.slice(0, at) + written.slice(at + 1);
+};
+/** Inline content between two delimiters, such as `{++` and `++}`. */
+const between = (open, close) => async (node, state) => `${open}${await state.flow(node, state)}${close}`;
+/** `{~~old~>new~~}`, from its `del` and `ins` halves. */
+const substitution$1 = async ([, , removed, added], state) => {
+	const flow = async (half) => isElement$1(half) ? state.flow(half, state) : "";
+	return `{~~${await flow(removed)}~>${await flow(added)}~~}`;
+};
+const footnoteReference = (label) => () => `[^${label}]`;
+/** `[^label]: text`, with the rest of its blocks indented under it. */
+const footnoteDefinition = (label) => async (node, state) => {
+	const content = (await state.flow(node, state)).trim();
+	return `[^${label}]: ${indent(content, {
+		width: 4,
+		ignoreFirstLine: true
+	})}${state.context.blockSeparator}`;
+};
+/** Each term on its line, each definition after `:   ` with its blocks indented under it, and a blank line before the next term. */
+const definitionList = async (node, state) => {
+	let written = "";
+	for (const item of node.slice(2)) {
+		if (!isElement$1(item)) continue;
+		const content = (await state.flow(item, state)).trim();
+		if (item[0] === "dt") written += `${written ? "\n" : ""}${content}\n`;
+		else written += `:   ${indent(content, {
+			width: 4,
+			ignoreFirstLine: true
+		})}\n`;
+	}
+	return written.trimEnd() + state.context.blockSeparator;
+};
+//#endregion
+//#region ../../shared/markdown-it.ts
+/**
+* An inline element and a block element, by the prefix of their `_open` and `_close` types. Not `mdc_block_slot` for
+* blocks: directly inside a `::component` Comark reads those as named slots and splits the block apart.
+*/
+const SPAN = "mdc_inline_span";
+/**
+* Adds a rule before or after the first of `anchors` the parser has, else last. Comark's own rules exist only with
+* its default plugins, and markdown-exit throws on a missing anchor, which would make every parse throw.
+*/
+function addRule(ruler, place, anchors, name, fn, options) {
+	for (const anchor of anchors) try {
+		ruler[place](anchor, name, fn, options);
+		return;
+	} catch {}
+	ruler.push(name, fn, options);
+}
+//#endregion
+//#region src/editor/syntax.ts
+/** The element around the two halves of `{~~old~>new~~}`, which comark-critic writes as a `del` beside an `ins`. */
+const SUBSTITUTION = "critic-sub";
+let inside = false;
+function substitution(state, silent) {
+	if (silent || inside || !state.src.startsWith("{~~", state.pos)) return false;
+	const start = state.pos;
+	const max = state.posMax;
+	const rules = state.md.inline.ruler.getRules("");
+	const criticRule = rules[rules.indexOf(substitution) + 1];
+	if (!criticRule?.(state, true)) return false;
+	const end = state.pos;
+	state.pos = start;
+	state.push(`${SPAN}_open`, SUBSTITUTION, 1);
+	state.posMax = end;
+	inside = true;
+	try {
+		state.md.inline.tokenize(state);
+	} finally {
+		inside = false;
+	}
+	state.posMax = max;
+	state.push(`${SPAN}_close`, SUBSTITUTION, -1);
+	return true;
+}
+const substitutions = defineComarkPlugin(() => ({
+	name: "editor-critic-substitutions",
+	markdownItPlugins: [(md) => addRule(md.inline.ruler, "before", ["critic"], "critic_substitution", substitution)]
+}));
+const footnoteMarkers = defineComarkPlugin(() => ({
+	name: "editor-footnotes",
+	markdownItPlugins: footnotes().markdownItPlugins
+}));
+const noAlert = defineComarkPlugin(() => ({ name: "alert" }));
+/** The prop on a component written `:name{props}` alone on its line, which Comark reads like an empty `::name`. */
+const SHORTHAND = "data-comark-editor-shorthand";
+function markShorthands(tokens) {
+	for (const token of tokens) {
+		if (token.type === "mdc_block_shorthand" || token.type === "mdc_block_shorthand_open") token.attrSet(SHORTHAND, "");
+		if (token.children) markShorthands(token.children);
+	}
+}
+const shorthands = defineComarkPlugin(() => ({
+	name: "editor-shorthands",
+	markdownItPost: (state) => markShorthands(state.tokens)
+}));
+/**
+* The syntax the codec reads beyond Comark's own: CriticMarkup, definition lists, footnotes, and emphasis next to CJK
+* punctuation. Each would otherwise reach the tree as text, or not at all, and be written back escaped or dropped.
+* It also marks the components written `:name` alone on their line, so they're written back that way.
+*/
+const syntax = [
+	noAlert(),
+	critic(),
+	substitutions(),
+	deflist(),
+	cjk(),
+	footnoteMarkers(),
+	shorthands()
+];
+//#endregion
 //#region src/editor/markdown.ts
 const parseOptions = {
 	autoUnwrap: false,
 	headingIds: false
 };
+const readOptions = {
+	...parseOptions,
+	plugins: syntax
+};
 const marks = /* @__PURE__ */ new Map([
 	["strong", "bold"],
 	["em", "italic"],
@@ -165,13 +513,20 @@ const marks = /* @__PURE__ */ new Map([
 	["code", "code"],
 	["a", "link"]
 ]);
+const DEFINITION = "cfn-def:";
+const REFERENCE = "cfn-ref:";
+const NOTE = "cfn-note";
 const markTags = new Map([...marks].map(([tag, mark]) => [mark, tag]));
 const inlineTags = /* @__PURE__ */ new Set([
 	...marks.keys(),
 	"br",
 	"img",
 	"span",
-	"input"
+	"input",
+	"ins",
+	"mark",
+	SUBSTITUTION,
+	NOTE
 ]);
 const headings = /* @__PURE__ */ new Set([
 	"h1",
@@ -181,24 +536,14 @@ const headings = /* @__PURE__ */ new Set([
 	"h5",
 	"h6"
 ]);
-const builtIn = /* @__PURE__ */ new Set([
-	...headings,
-	"p",
-	"blockquote",
-	"hr",
-	"pre",
-	"table",
-	"ul",
-	"ol",
-	"li"
-]);
 const isText = (node) => !Array.isArray(node);
 const isElement = (node) => Array.isArray(node) && node[0] !== null;
 const childrenOf = (element) => element.slice(2);
 /** A prop as text. Comark props are strings, numbers, and booleans, or parsed JSON for `:prop` bindings. */
 const textOf = (value) => value === void 0 || value === null || value instanceof Object ? void 0 : String(value);
 const inlineHtml = ({ $: meta }) => meta instanceof Object && "block" in meta && meta.block === 0;
-const isInline = (node) => isText(node) || isElement(node) && (inlineTags.has(node[0]) || inlineHtml(node[1]));
+const isInline = (node) => isText(node) || isElement(node) && (inlineTags.has(node[0]) || node[0].startsWith(REFERENCE) || inlineHtml(node[1]));
+const isHtml = (props) => props.$ instanceof Object;
 /** The props a node has no field for, or `undefined` when none are left. */
 function rest(props, ...keys) {
 	const left = Object.fromEntries(Object.entries(props).filter(([key]) => !keys.includes(key)));
@@ -249,20 +594,38 @@ function readBlock(child, reading) {
 	if (!isElement(child)) return [node("comarkComment", { text: child[2] })];
 	const [tag, props] = child;
 	const children = childrenOf(child);
+	if ("data-comark-editor-shorthand" in props) {
+		const { [SHORTHAND]: _, ...attrs } = props;
+		return [node("paragraph", {}, readInline([[
+			tag,
+			attrs,
+			...children
+		]], [], reading))];
+	}
 	if (tag === "p") return [node("paragraph", withProps({}, rest(props)), readInline(children, [], reading))];
 	if (headings.has(tag)) return [node("heading", withProps({ level: Number(tag[1]) }, rest(props)), readInline(children, [], reading))];
 	if (tag === "blockquote") return [node("blockquote", withProps({}, rest(props)), readBlocks(children, reading))];
 	if (tag === "hr") return [node("horizontalRule", withProps({}, rest(props)))];
 	if (tag === "pre") return [readCode(props, children)];
-	if (tag === "table" && children.every((part) => isElement(part) && [
+	if (tag === "table" && children.length && children.every((part) => isElement(part) && [
 		"thead",
 		"tbody",
 		"tr"
 	].includes(part[0]))) return [readTable(props, children, reading)];
 	if (tag === "ul" || tag === "ol") return [readList(tag, props, children, reading)];
-	if (tag === "template" || builtIn.has(tag)) reading.lossy = true;
+	if (tag.startsWith(DEFINITION)) return [node("footnoteDefinition", { label: tag.slice(8) }, filled(readBlocks(children, reading)))];
+	if (tag === "dl") return [readDefinitions(props, children, reading)];
+	if (tag === "template") reading.lossy = true;
 	return [node("comarkBlock", withProps({ name: tag }, rest(props)), readComponent(children, reading))];
 }
+/** Blocks that need at least one, as an empty item or definition writes nothing. */
+const filled = (blocks) => blocks.length ? blocks : [{ type: "paragraph" }];
+function readDefinitions(props, children, reading) {
+	return node("definitionList", withProps({}, rest(props)), children.flatMap((item) => {
+		if (!isElement(item)) return [];
+		return item[0] === "dt" ? [node("definitionTerm", withProps({}, rest(item[1])), readInline(childrenOf(item), [], reading))] : [node("definitionDescription", withProps({}, rest(item[1])), filled(readBlocks(childrenOf(item), reading)))];
+	}));
+}
 function readComponent(children, reading) {
 	const out = [];
 	let run = [];
@@ -326,6 +689,29 @@ function readTable(props, children, reading) {
 	const rows = children.filter(isElement).flatMap((section) => section[0] === "tr" ? [section] : childrenOf(section).filter(isElement));
 	return node("table", withProps({}, rest(props)), rows.map((row) => node("tableRow", withProps({}, rest(row[1])), childrenOf(row).filter(isElement).map((cell) => node(cell[0] === "th" ? "tableHeader" : "tableCell", withProps({}, rest(cell[1])), [node("paragraph", {}, readInline(childrenOf(cell), [], reading))])))));
 }
+const critics = /* @__PURE__ */ new Map([
+	["ins", {
+		className: "ccm-ins",
+		type: "criticInsertion"
+	}],
+	["del", {
+		className: "ccm-del",
+		type: "criticDeletion"
+	}],
+	["mark", {
+		className: "ccm-mark",
+		type: "criticHighlight"
+	}]
+]);
+const COMMENT = "ccm-comment";
+function criticMark([tag, props]) {
+	const critic = critics.get(tag);
+	if (!critic || !classes(props).includes(critic.className)) return;
+	return {
+		className: critic.className,
+		mark: { type: critic.type }
+	};
+}
 function readInline(children, active, reading) {
 	const out = [];
 	const marked = (json) => active.length ? {
@@ -346,8 +732,24 @@ function readInline(children, active, reading) {
 		}
 		const [tag, props] = child;
 		const content = childrenOf(child);
+		const critic = criticMark(child);
 		const mark = marks.get(tag);
-		if (mark && !(tag === "code" && !content.every(isText))) {
+		if (critic) {
+			if (rest(withoutClass(props, critic.className))) reading.lossy = true;
+			out.push(...readInline(content, [...active, critic.mark], reading));
+		} else if (tag === "critic-sub") {
+			const [removed, added] = content.filter(isElement);
+			const half = (element, type) => element ? readInline(childrenOf(element), [...active, {
+				type,
+				attrs: { substitution: true }
+			}], reading) : [];
+			out.push(...half(removed, "criticDeletion"), ...half(added, "criticInsertion"));
+		} else if (tag === "span" && classes(props).includes(COMMENT)) {
+			if (rest(withoutClass(props, COMMENT))) reading.lossy = true;
+			out.push(marked(node("criticComment", {}, readInline(content, [], reading))));
+		} else if (tag.startsWith(REFERENCE)) out.push(marked(node("footnoteReference", { label: tag.slice(8) })));
+		else if (tag === NOTE) out.push(marked(node("inlineFootnote", {}, readInline(content, [], reading))));
+		else if (mark && !(tag === "code" && !content.every(isText))) {
 			const attrs = mark === "link" ? withProps({
 				href: props.href ?? null,
 				title: props.title ?? null
@@ -394,7 +796,8 @@ function writeBlock(json) {
 		case "horizontalRule": return [["hr", props]];
 		case "codeBlock": {
 			const language = textOf(attrs.language) || void 0;
-			return [[
+			const code = plainText(json.content);
+			const pre = [
 				"pre",
 				language ? {
 					...props,
@@ -403,9 +806,10 @@ function writeBlock(json) {
 				[
 					"code",
 					language ? { class: `language-${language}` } : {},
-					plainText(json.content)
+					code
 				]
-			]];
+			];
+			return [code.trimEnd() === code ? pre : own(pre, trailingLines)];
 		}
 		case "bulletList": return [[
 			"ul",
@@ -433,39 +837,48 @@ function writeBlock(json) {
 			withClass(props, "contains-task-list"),
 			...writeBlocks(json.content)
 		]];
-		case "taskItem": {
-			const [first, ...others] = json.content ?? [];
-			const text = writeInline(first?.content);
-			const [head] = text;
-			if (head !== void 0 && isText(head)) text[0] = ` ${head}`;
-			else text.unshift(" ");
-			const box = {
-				class: "task-list-item-checkbox",
-				type: "checkbox",
-				":disabled": "true"
-			};
-			if (attrs.checked) box[":checked"] = "true";
-			return [[
-				"li",
-				withClass(props, "task-list-item"),
-				["input", box],
-				...text,
-				...writeBlocks(others)
-			]];
-		}
+		case "taskItem": return [own([
+			"li",
+			props,
+			...writeBlocks(json.content)
+		], task(Boolean(attrs.checked)))];
 		case "table": return [writeTable(json, props)];
-		case "comarkBlock": return [[
-			String(attrs.name),
+		case "comarkBlock": {
+			const component = [
+				String(attrs.name),
+				props,
+				...(json.content ?? []).flatMap((child) => child.type === "comarkSlot" ? [[
+					"template",
+					{
+						...propsOf(child.attrs),
+						name: child.attrs?.name
+					},
+					...writeBlocks(child.content)
+				]] : writeBlock(child))
+			];
+			return [isHtml(props) ? component : own(component, blockComponent)];
+		}
+		case "footnoteDefinition": {
+			const label = textOf(attrs.label) ?? "";
+			return [own([
+				"footnote",
+				{},
+				...writeBlocks(json.content)
+			], footnoteDefinition(label))];
+		}
+		case "definitionList": return [own([
+			"dl",
 			props,
-			...(json.content ?? []).flatMap((child) => child.type === "comarkSlot" ? [[
-				"template",
-				{
-					...propsOf(child.attrs),
-					name: child.attrs?.name
-				},
-				...writeBlocks(child.content)
-			]] : writeBlock(child))
-		]];
+			...(json.content ?? []).map((item) => item.type === "definitionTerm" ? [
+				"dt",
+				propsOf(item.attrs),
+				...writeInline(item.content)
+			] : [
+				"dd",
+				propsOf(item.attrs),
+				...writeBlocks(item.content)
+			])
+		], definitionList)];
 		case "comarkComment": return [[
 			null,
 			{},
@@ -505,7 +918,18 @@ function writeTable(json, props) {
 	];
 }
 const sameMark = (a, b) => a.type === b.type && JSON.stringify(a.attrs ?? {}) === JSON.stringify(b.attrs ?? {});
+const criticDelimiters = /* @__PURE__ */ new Map([
+	["criticInsertion", ["{++", "++}"]],
+	["criticDeletion", ["{--", "--}"]],
+	["criticHighlight", ["{==", "==}"]]
+]);
 function writeMark(mark, children) {
+	const delimiters = criticDelimiters.get(mark.type);
+	if (delimiters) return own([
+		mark.attrs?.substitution ? mark.type : "critic",
+		{},
+		...children
+	], between(...delimiters));
 	const props = propsOf(mark.attrs);
 	if (mark.type !== "link") return [
 		markTags.get(mark.type) ?? "span",
@@ -537,7 +961,7 @@ function writeInline(content = []) {
 		for (let frame = open.pop(); frame; frame = open.length > depth ? open.pop() : void 0) append(open.at(-1)?.children ?? root, writeMark(frame.mark, frame.children));
 	};
 	for (const json of content) {
-		const active = json.marks ?? [];
+		const active = [...json.marks ?? []].sort((left, right) => markOrder(left) - markOrder(right));
 		const same = (index) => {
 			const frame = open[index];
 			const mark = active[index];
@@ -553,7 +977,23 @@ function writeInline(content = []) {
 		for (const child of writeLeaf(json)) append(open.at(-1)?.children ?? root, child);
 	}
 	if (open.length) close(0);
-	return root;
+	return pairSubstitutions(root);
+}
+const markOrder = (mark) => criticDelimiters.has(mark.type) ? -1 : mark.type === "code" ? 1 : 0;
+/** Joins a deletion and the insertion right after it, both from one `{~~old~>new~~}`, back into one. */
+function pairSubstitutions(children) {
+	const out = [];
+	for (const child of children) {
+		const last = out.at(-1);
+		if (isElement(child) && child[0] === "criticInsertion" && last !== void 0 && isElement(last) && last[0] === "criticDeletion") out[out.length - 1] = own([
+			SUBSTITUTION,
+			{},
+			last,
+			child
+		], substitution$1);
+		else out.push(child);
+	}
+	return out;
 }
 function writeLeaf(json) {
 	const props = propsOf(json.attrs);
@@ -569,11 +1009,25 @@ function writeLeaf(json) {
 		if (attrs.title) image.title = attrs.title;
 		return [["img", image]];
 	}
-	if (json.type === "comarkInline") return [[
-		String(attrs.name),
-		props,
+	if (json.type === "comarkInline") {
+		const component = [
+			String(attrs.name),
+			props,
+			...writeInline(json.content)
+		];
+		return [isHtml(props) ? component : own(component, inlineComponent)];
+	}
+	if (json.type === "footnoteReference") return [own(["footnote", {}], footnoteReference(textOf(attrs.label) ?? ""))];
+	if (json.type === "inlineFootnote") return [own([
+		"footnote",
+		{},
+		...writeInline(json.content)
+	], between("^[", "]"))];
+	if (json.type === "criticComment") return [own([
+		"span",
+		{},
 		...writeInline(json.content)
-	]];
+	], between("{>>", "<<}"))];
 	return [];
 }
 function equal(a, b) {
@@ -585,7 +1039,7 @@ function equal(a, b) {
 }
 /** Reads Markdown into the editor's document. */
 async function fromMarkdown(markdown) {
-	const tree = await parseMarkdown(markdown, parseOptions);
+	const tree = await parseMarkdown(markdown, readOptions);
 	const reading = { lossy: false };
 	const content = readBlocks(tree.nodes, reading);
 	return {
@@ -603,7 +1057,7 @@ async function toMarkdown(doc, options = {}) {
 		nodes: writeBlocks(doc.content),
 		frontmatter: options.frontmatter ?? {},
 		meta: {}
-	}, { headingIds: false });
+	}, writeOptions);
 	return markdown.trim() ? `${markdown.trimEnd()}\n` : "";
 }
 /**
@@ -832,4 +1286,4 @@ function createEditorCodec(options = {}) {
 	};
 }
 //#endregion
-export { uploadKey as a, fromMarkdown as c, ComarkComment as d, ComarkImage as f, ComarkSlot as h, startUploads as i, toMarkdown as l, ComarkKit as m, Upload as n, uploadPlugin as o, ComarkInline as p, findUpload as r, checkMarkdown as s, createEditorCodec as t, ComarkBlock as u };
+export { FootnoteDefinition as C, DefinitionTerm as S, InlineFootnote as T, CriticDeletion as _, uploadKey as a, DefinitionDescription as b, fromMarkdown as c, ComarkComment as d, ComarkImage as f, CriticComment as g, ComarkSlot as h, startUploads as i, toMarkdown as l, ComarkKit as m, Upload as n, uploadPlugin as o, ComarkInline as p, findUpload as r, checkMarkdown as s, createEditorCodec as t, ComarkBlock as u, CriticHighlight as v, FootnoteReference as w, DefinitionList as x, CriticInsertion as y };