@threadlabs/looma 0.30.7 → 0.30.8

package/EXPRESSIVE-MARKDOWN.md

@@ -40,7 +40,9 @@ beginning of a line or after whitespace; embedded at signs remain literal.
 Headings, text formatting, links, images, lists, tasks, quotes, code, callouts,
 disclosures, figures, tabs, chips, mentions and tables map to their semantic AST
 nodes. Mention targets become `ref`; chips keep their `tone`; merged table cells
-keep numeric spans and block bodies.
+keep numeric spans and block bodies. A footnote reference is the inline node
+`footnote` with its label as text, and the notes are a `footnotes` container
+holding a `footnote` container per note, titled by its label.
 
 Table cell presentation uses string attributes: `textAlign`, `backgroundColor`
 and the adapter profile's `columnWidths` (comma-separated pixel widths, such as

package/editor/chunks/extensions.js

@@ -475,6 +475,134 @@ var LoomaFigcaption = Node$1.create({
 	}
 });
 //#endregion
+//#region src/editor/extensions/footnote.ts
+var labelFrom = (href, prefix) => href?.startsWith(`#${prefix}`) ? href.slice(prefix.length + 1) : null;
+/**
+* A footnote reference, `[^label]`, saved as `<sup><a data-footnote-ref>`.
+* @invariant `label` names its note. `number` and `occurrence` are the note's number and this
+* reference's place among the note's references, as the document had them when it loaded.
+*/
+var LoomaFootnoteReference = Node$1.create({
+	name: "loomaFootnoteReference",
+	group: "inline",
+	inline: true,
+	atom: true,
+	selectable: true,
+	addAttributes() {
+		const link = (element) => element.querySelector(":scope > a[data-footnote-ref]");
+		const label = (element) => labelFrom(link(element)?.getAttribute("href"), "fn:") ?? "";
+		return {
+			label: {
+				default: "",
+				parseHTML: label,
+				renderHTML: () => ({})
+			},
+			number: {
+				default: null,
+				parseHTML: (element) => Number(element.textContent) || null,
+				renderHTML: () => ({})
+			},
+			occurrence: {
+				default: 1,
+				parseHTML: (element) => Number(link(element)?.id.slice(`fnref:${label(element)}:`.length)) || 1,
+				renderHTML: () => ({})
+			}
+		};
+	},
+	parseHTML() {
+		return [{
+			tag: "sup",
+			priority: 1100,
+			getAttrs: (element) => element.querySelector(":scope > a[data-footnote-ref]") ? null : false
+		}];
+	},
+	renderHTML({ node }) {
+		const { label, number, occurrence } = node.attrs;
+		return ["sup", [
+			"a",
+			{
+				href: `#fn:${label}`,
+				id: `fnref:${label}${occurrence > 1 ? `:${occurrence}` : ""}`,
+				"data-footnote-ref": "",
+				"aria-describedby": "footnote:label"
+			},
+			String(number ?? label)
+		]];
+	},
+	renderText({ node }) {
+		return `[^${node.attrs.label}]`;
+	}
+});
+/**
+* The document's notes, saved as `<section data-footnotes>` with its `<ol>`.
+* @invariant It holds only footnotes; Markdown writes it as definitions after the text.
+*/
+var LoomaFootnotes = Node$1.create({
+	name: "loomaFootnotes",
+	group: "block",
+	content: "loomaFootnote+",
+	isolating: true,
+	parseHTML() {
+		return [{
+			tag: "section[data-footnotes]",
+			contentElement: "ol"
+		}];
+	},
+	renderHTML() {
+		return [
+			"section",
+			{
+				"data-footnotes": "",
+				class: "footnotes"
+			},
+			[
+				"h2",
+				{
+					id: "footnote:label",
+					class: "sr-only"
+				},
+				"Footnotes"
+			],
+			["ol", 0]
+		];
+	}
+});
+/**
+* One note, `[^label]: …`, saved as `<li id="fn:label">`.
+* @invariant It exists only inside `LoomaFootnotes`. Its back-links are presentation that Looma
+* Markdown renders, so the editor reads past them and saves none.
+*/
+var LoomaFootnote = Node$1.create({
+	name: "loomaFootnote",
+	content: "block+",
+	defining: true,
+	addAttributes() {
+		return { label: {
+			default: "",
+			parseHTML: (element) => labelFrom(`#${element.id}`, "fn:") ?? "",
+			renderHTML: () => ({})
+		} };
+	},
+	parseHTML() {
+		return [{
+			tag: "li",
+			priority: 1100,
+			context: "loomaFootnotes/"
+		}, {
+			tag: "a[data-footnote-backref]",
+			priority: 1100,
+			ignore: true
+		}];
+	},
+	renderHTML({ node }) {
+		return [
+			"li",
+			{ id: `fn:${node.attrs.label}` },
+			0
+		];
+	}
+});
+//#endregion
 //#region src/editor/extensions/tabs.ts
 /**
 * Tabs or a code group, kept whole so Looma Markdown's `::: tabs` and `::: code-group` survive
@@ -9728,6 +9856,119 @@ function applyImageAttributes(image, attributes) {
 	if (typeof placement === "string" && PLACEMENTS.has(placement) && placement !== "block") image.attrSet("data-placement", placement);
 	if (attributes.responsive === true) image.attrSet("data-looma-responsive", "");
 }
+var FOOTNOTE_DEFINITION = /^\[\^([^\s\]]+)\]:/;
+var FOOTNOTE_REFERENCE = /^\[\^([^\s\]]+)\]/;
+function footnoteDefinition(state, startLine, endLine, silent) {
+	if (state.sCount[startLine] - state.blkIndent >= 4) return false;
+	const start = state.bMarks[startLine] + state.tShift[startLine];
+	const match = FOOTNOTE_DEFINITION.exec(state.src.slice(start, state.eMarks[startLine]));
+	if (!match) return false;
+	if (silent) return true;
+	(state.env.footnotes ??= /* @__PURE__ */ new Set()).add(match[1]);
+	const open = state.push("looma_footnote_open", "li", 1);
+	Object.assign(open, {
+		meta: { label: match[1] },
+		block: true,
+		map: [startLine, startLine]
+	});
+	const saved = {
+		bMark: state.bMarks[startLine],
+		tShift: state.tShift[startLine],
+		sCount: state.sCount[startLine],
+		parentType: state.parentType
+	};
+	let position = start + match[0].length;
+	const contentStart = position;
+	let offset = state.sCount[startLine] + match[0].length;
+	const initial = offset;
+	while (position < state.eMarks[startLine] && (state.src[position] === " " || state.src[position] === "	")) {
+		offset += state.src[position] === "	" ? 4 - (offset + state.bsCount[startLine]) % 4 : 1;
+		position++;
+	}
+	state.tShift[startLine] = position - contentStart;
+	state.sCount[startLine] = offset - initial;
+	state.bMarks[startLine] = contentStart;
+	state.blkIndent += 4;
+	state.parentType = "footnote";
+	if (state.sCount[startLine] < state.blkIndent) state.sCount[startLine] += state.blkIndent;
+	state.md.block.tokenize(state, startLine, endLine);
+	state.parentType = saved.parentType;
+	state.blkIndent -= 4;
+	state.tShift[startLine] = saved.tShift;
+	state.sCount[startLine] = saved.sCount;
+	state.bMarks[startLine] = saved.bMark;
+	open.map[1] = state.line;
+	state.push("looma_footnote_close", "li", -1).block = true;
+	return true;
+}
+function footnoteReference(state, silent) {
+	if (state.src.charCodeAt(state.pos) !== 91 || state.src.charCodeAt(state.pos + 1) !== 94) return false;
+	const match = FOOTNOTE_REFERENCE.exec(state.src.slice(state.pos, state.posMax));
+	if (!match || !state.env.footnotes?.has(match[1])) return false;
+	if (!silent) state.push("looma_footnote_ref", "sup", 0).meta = { label: match[1] };
+	state.pos += match[0].length;
+	return true;
+}
+function footnotes(state) {
+	const definitions = /* @__PURE__ */ new Map();
+	const body = [];
+	for (let index = 0; index < state.tokens.length; index++) {
+		const token = state.tokens[index];
+		if (token.type !== "looma_footnote_open") {
+			body.push(token);
+			continue;
+		}
+		let depth = 0, end = index;
+		for (; end < state.tokens.length; end++) if (state.tokens[end].type === "looma_footnote_open") depth++;
+		else if (state.tokens[end].type === "looma_footnote_close" && --depth === 0) break;
+		const label = token.meta.label;
+		if (!definitions.has(label)) definitions.set(label, state.tokens.slice(index, end + 1));
+		index = end;
+	}
+	if (!definitions.size) return;
+	const order = [];
+	const counts = /* @__PURE__ */ new Map();
+	const number = (tokens) => {
+		for (const token of tokens) for (const child of token.children ?? []) {
+			if (child.type !== "looma_footnote_ref") continue;
+			const label = child.meta.label;
+			if (!counts.has(label)) order.push(label);
+			const occurrence = (counts.get(label) ?? 0) + 1;
+			counts.set(label, occurrence);
+			child.meta = {
+				label,
+				number: order.indexOf(label) + 1,
+				occurrence
+			};
+		}
+	};
+	number(body);
+	const notes = [];
+	for (let index = 0; index < order.length; index++) {
+		const label = order[index];
+		const tokens = definitions.get(label);
+		number(tokens);
+		const backrefs = Object.assign(new state.Token("looma_footnote_backrefs", "", 0), { meta: {
+			label,
+			number: index + 1
+		} });
+		const last = tokens.length - 2;
+		if (tokens[last].type === "paragraph_close") tokens.splice(last, 0, backrefs);
+		else tokens.splice(last + 1, 0, new state.Token("paragraph_open", "p", 1), backrefs, new state.Token("paragraph_close", "p", -1));
+		notes.push(...tokens);
+	}
+	if (!notes.length) {
+		state.tokens = body;
+		return;
+	}
+	for (const note of notes) if (note.type === "looma_footnote_open") note.meta.count = counts.get(note.meta.label);
+	state.tokens = [
+		...body,
+		Object.assign(new state.Token("looma_footnotes_open", "section", 1), { block: true }),
+		...notes,
+		Object.assign(new state.Token("looma_footnotes_close", "section", -1), { block: true })
+	];
+}
 function tableOfContents(tokens, format, depth, escape) {
 	const roots = [];
 	const ancestors = [];
@@ -9753,7 +9994,7 @@ function tableOfContents(tokens, format, depth, escape) {
 	return `<nav data-looma-toc="" data-format="${format}" data-depth="${depth}" aria-label="Table of contents"><strong>Table of contents</strong>${roots.length ? render(roots) : ""}</nav>\n`;
 }
 /**
-* Adds Looma Markdown to a markdown-it instance: containers, alerts, task lists, the table of
+* Adds Looma Markdown to a markdown-it instance: containers, alerts, task lists, footnotes, the table of
 * contents, chips, mentions, brace attributes, heading anchors, code meta and front matter.
 * @contract Renders the canonical HTML, which is the HTML LoomaEditor saves. It is not sanitized.
 * Linkify and raw HTML are instance options; `createLoomaMarkdownIt` turns both on.
@@ -9761,6 +10002,7 @@ function tableOfContents(tokens, format, depth, escape) {
 function loomaMarkdown$1(md, { codeNotation = "apply" } = {}) {
 	const escape = md.utils.escapeHtml;
 	md.block.ruler.before("table", "looma_frontmatter", frontmatter);
+	md.block.ruler.before("reference", "looma_footnote", footnoteDefinition, { alt: ["paragraph", "reference"] });
 	md.block.ruler.before("fence", "looma_container", container, { alt: [
 		"paragraph",
 		"reference",
@@ -9774,9 +10016,11 @@ function loomaMarkdown$1(md, { codeNotation = "apply" } = {}) {
 		"list"
 	] });
 	md.inline.ruler.before("link", "looma_directive", directive);
+	md.inline.ruler.before("link", "looma_footnote_ref", footnoteReference);
 	md.core.ruler.after("block", "looma_task_lists", taskLists);
 	md.core.ruler.before("inline", "looma_alerts", alerts);
 	md.core.ruler.before("text_join", "looma_attributes", attributes);
+	md.core.ruler.after("inline", "looma_footnotes", footnotes);
 	const rules = md.renderer.rules;
 	rules.looma_frontmatter = () => "";
 	rules.looma_container_open = (tokens, index) => {
@@ -9798,6 +10042,22 @@ function loomaMarkdown$1(md, { codeNotation = "apply" } = {}) {
 	};
 	rules.looma_tab_open = (tokens, index) => `<section aria-label="${escape(tokens[index].meta.label)}">\n`;
 	rules.looma_tab_close = () => "</section>\n";
+	rules.looma_footnote_ref = (tokens, index) => {
+		const { label, number, occurrence } = tokens[index].meta;
+		return `<sup><a href="#fn:${escape(label)}" id="fnref:${escape(label)}${occurrence > 1 ? `:${occurrence}` : ""}" data-footnote-ref="" aria-describedby="footnote:label">${number}</a></sup>`;
+	};
+	rules.looma_footnote_backrefs = (tokens, index) => {
+		const { label, number } = tokens[index].meta;
+		const count = tokens.find((token) => token.type === "looma_footnote_open" && token.meta.label === label)?.meta.count ?? 1;
+		return Array.from({ length: count }, (_, occurrence) => {
+			const suffix = occurrence ? `:${occurrence + 1}` : "";
+			return ` <a href="#fnref:${escape(label)}${suffix}" data-footnote-backref="" aria-label="Back to reference ${number}${occurrence ? `-${occurrence + 1}` : ""}">↩${occurrence ? `<sup>${occurrence + 1}</sup>` : ""}</a>`;
+		}).join("");
+	};
+	rules.looma_footnotes_open = () => "<section data-footnotes=\"\" class=\"footnotes\">\n<h2 id=\"footnote:label\" class=\"sr-only\">Footnotes</h2>\n<ol>\n";
+	rules.looma_footnotes_close = () => "</ol>\n</section>\n";
+	rules.looma_footnote_open = (tokens, index) => `<li id="fn:${escape(tokens[index].meta.label)}">\n`;
+	rules.looma_footnote_close = () => "</li>\n";
 	rules.looma_toc = (tokens, index) => tableOfContents(tokens, tokens[index].meta.format, tokens[index].meta.depth, escape);
 	rules.looma_chip = (tokens, index) => {
 		const { label, attributes } = tokens[index].meta;
@@ -9955,6 +10215,9 @@ var NODES = {
 		})}`);
 		state.closeBlock(node);
 	},
+	loomaFootnoteReference: (state, node) => state.write(`[^${node.attrs.label}]`),
+	loomaFootnotes: (state, node) => state.renderContent(node),
+	loomaFootnote: (state, node) => state.wrapBlock("    ", `[^${node.attrs.label}]: `, node, () => state.renderContent(node)),
 	loomaChip: (state, node) => {
 		const tone = normalizeLoomaChipTone(node.attrs.color);
 		state.write(`:chip[${label(String(node.attrs.label ?? ""))}]${formatLoomaAttributes({ tone: tone !== "neutral" ? tone : null })}`);
@@ -10838,6 +11101,9 @@ function getDefaultEditorExtensions(options = {}) {
 		...imageInline ? [] : [LoomaFigure, LoomaFigcaption],
 		LoomaExpand.configure({ nodeView: expandNodeView ?? null }),
 		LoomaTableOfContents.configure({ nodeView: tableOfContentsNodeView ?? null }),
+		LoomaFootnoteReference,
+		LoomaFootnotes,
+		LoomaFootnote,
 		dividerNodeView ? HorizontalRule.extend({ addNodeView: () => dividerNodeView }) : HorizontalRule,
 		HardBreak,
 		History,
@@ -11827,4 +12093,4 @@ function createLoomaSlashCommandExtension(options = {}) {
 	});
 }
 //#endregion
-export { filterLoomaMentionItems as A, LoomaFigcaption as B, loomaMarkdownToHtml as C, createLoomaMentionExtension as D, LoomaMentionSuggestionPluginKey as E, LoomaTableOfContents as F, LoomaChip as G, LoomaExpand as H, getTableOfContentsEntries as I, LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS as J, normalizeLoomaChipColor as K, normalizeTableOfContentsConfig as L, LoomaImage as M, normalizeImageDimension as N, DEFAULT_MENTION_RESULT_LIMIT as O, normalizeImagePlacement as P, LoomaActiveBlockPluginKey as Q, LoomaTab as R, loomaMarkdownFromDoc as S, siteRelativeHref as T, revealLoomaExpandAt as U, LoomaFigure as V, LOOMA_CHIP_COLORS as W, LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS as X, LOOMA_ACTIVE_BLOCK_CLASS as Y, LoomaActiveBlock as Z, getActiveTableCellAlignment as _, getActiveTableUiState as a, setActiveTableCellBackground as b, insertTableAtRange as c, LoomaTableKit as d, getDefaultEditorExtensions as f, LoomaTableHeader as g, LoomaTableCell as h, getDefaultSlashCommands as i, normalizeMentionResultLimit as j, MAX_MENTION_RESULT_LIMIT as k, normalizeActiveTableColumnWidths as l, LoomaTable as m, createLoomaSlashCommandExtension as n, handleTableAction as o, getLoomaTableExtensions as p, LoomaCallout as q, filterLoomaSlashCommands as r, handleTableOverlayAction as s, LoomaSlashCommand as t, shouldShowTextFormattingToolbar as u, getActiveTableCellBackground as v, createSiteRelativeLinks as w, LoomaSmartPaste as x, setActiveTableCellAlignment as y, LoomaTabs as z };
+export { LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS as $, filterLoomaMentionItems as A, LoomaFootnote as B, loomaMarkdownToHtml as C, createLoomaMentionExtension as D, LoomaMentionSuggestionPluginKey as E, LoomaTableOfContents as F, LoomaExpand as G, LoomaFootnotes as H, getTableOfContentsEntries as I, LoomaChip as J, revealLoomaExpandAt as K, normalizeTableOfContentsConfig as L, LoomaImage as M, normalizeImageDimension as N, DEFAULT_MENTION_RESULT_LIMIT as O, normalizeImagePlacement as P, LOOMA_ACTIVE_BLOCK_CLASS as Q, LoomaTab as R, loomaMarkdownFromDoc as S, siteRelativeHref as T, LoomaFigcaption as U, LoomaFootnoteReference as V, LoomaFigure as W, LoomaCallout as X, normalizeLoomaChipColor as Y, LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS as Z, getActiveTableCellAlignment as _, getActiveTableUiState as a, setActiveTableCellBackground as b, insertTableAtRange as c, LoomaTableKit as d, LoomaActiveBlock as et, getDefaultEditorExtensions as f, LoomaTableHeader as g, LoomaTableCell as h, getDefaultSlashCommands as i, normalizeMentionResultLimit as j, MAX_MENTION_RESULT_LIMIT as k, normalizeActiveTableColumnWidths as l, LoomaTable as m, createLoomaSlashCommandExtension as n, handleTableAction as o, getLoomaTableExtensions as p, LOOMA_CHIP_COLORS as q, filterLoomaSlashCommands as r, handleTableOverlayAction as s, LoomaSlashCommand as t, LoomaActiveBlockPluginKey as tt, shouldShowTextFormattingToolbar as u, getActiveTableCellBackground as v, createSiteRelativeLinks as w, LoomaSmartPaste as x, setActiveTableCellAlignment as y, LoomaTabs as z };

package/editor/expressmark.js

@@ -232,6 +232,7 @@ function toNode(node, path, context) {
 		"mention",
 		"loomaReference",
 		"loomaChip",
+		"loomaFootnoteReference",
 		"hardBreak"
 	].includes(node.type ?? "")) fail(path, "marks on a block node");
 	for (const mark of [...node.marks ?? []].reverse()) {
@@ -395,6 +396,22 @@ function toBareNode(node, path, context) {
 				value: string(attrs.label),
 				attributes: { tone: string(attrs.color, "neutral") }
 			};
+		case "loomaFootnoteReference":
+			fields(node, [
+				"label",
+				"number",
+				"occurrence"
+			], path);
+			return {
+				type: "inline",
+				subType: "footnote",
+				value: string(attrs.label)
+			};
+		case "loomaFootnotes": return block("container", [], { subType: "footnotes" });
+		case "loomaFootnote": return block("container", ["label"], {
+			subType: "footnote",
+			title: title(string(attrs.label))
+		});
 		case "loomaCallout": return block("container", ["tone", "heading"], {
 			subType: string(attrs.tone, "note"),
 			...attrs.heading ? { title: title(string(attrs.heading)) } : {}
@@ -779,6 +796,14 @@ function fromNode(node, path, marks = []) {
 					...marks.length ? { marks } : {}
 				}];
 			}
+			if (node.subType === "footnote") {
+				check();
+				return [{
+					type: "loomaFootnoteReference",
+					attrs: { label: text(node) },
+					...marks.length ? { marks } : {}
+				}];
+			}
 			if (node.subType === "chip") {
 				check(["tone"]);
 				if (attrs.tone !== void 0 && !LOOMA_CHIP_TONES.includes(attrs.tone)) fail(path, "unsupported chip tone");
@@ -852,6 +877,14 @@ function fromNode(node, path, marks = []) {
 					}]
 				}];
 			}
+			if (node.subType === "footnotes") {
+				check();
+				return wrap("loomaFootnotes");
+			}
+			if (node.subType === "footnote") {
+				check();
+				return wrap("loomaFootnote", { label });
+			}
 			if (node.subType === "toc") {
 				check(["depth", "format"]);
 				if (node.title) fail(path, "table-of-contents title");

package/editor/extensions/footnote.d.ts

@@ -0,0 +1,18 @@
+import { Node } from "@tiptap/core";
+/**
+ * A footnote reference, `[^label]`, saved as `<sup><a data-footnote-ref>`.
+ * @invariant `label` names its note. `number` and `occurrence` are the note's number and this
+ * reference's place among the note's references, as the document had them when it loaded.
+ */
+export declare const LoomaFootnoteReference: Node<any, any>;
+/**
+ * The document's notes, saved as `<section data-footnotes>` with its `<ol>`.
+ * @invariant It holds only footnotes; Markdown writes it as definitions after the text.
+ */
+export declare const LoomaFootnotes: Node<any, any>;
+/**
+ * One note, `[^label]: …`, saved as `<li id="fn:label">`.
+ * @invariant It exists only inside `LoomaFootnotes`. Its back-links are presentation that Looma
+ * Markdown renders, so the editor reads past them and saves none.
+ */
+export declare const LoomaFootnote: Node<any, any>;

package/editor/extensions/index.d.ts

@@ -11,6 +11,7 @@ export { LoomaCallout, LOOMA_CALLOUT_TONES, type LoomaCalloutTone, } from "./cal
 export { LoomaChip, LOOMA_CHIP_COLORS, normalizeLoomaChipColor, type LoomaChipColor } from "./chip.js";
 export { LoomaExpand, revealLoomaExpandAt, type LoomaExpandAttributes } from "./expand.js";
 export { LoomaFigcaption, LoomaFigure } from "./figure.js";
+export { LoomaFootnote, LoomaFootnoteReference, LoomaFootnotes } from "./footnote.js";
 export { LoomaTab, LoomaTabs } from "./tabs.js";
 export { LoomaTableOfContents, getTableOfContentsEntries, normalizeTableOfContentsConfig, type LoomaTableOfContentsConfig, type LoomaTableOfContentsEntry, type LoomaTableOfContentsFormat, } from "./table-of-contents.js";
 export { getDefaultEditorExtensions, getLoomaTableExtensions, LoomaTableKit, type DefaultEditorExtensionsOptions, type LoomaCodeLanguages, } from "./preset.js";

package/editor/extensions/index.js

@@ -1,4 +1,4 @@
 import { n as TABLE_CELL_BACKGROUND_PRESETS } from "../chunks/table-backgrounds.js";
-import { A as filterLoomaMentionItems, B as LoomaFigcaption, C as loomaMarkdownToHtml, D as createLoomaMentionExtension, E as LoomaMentionSuggestionPluginKey, F as LoomaTableOfContents, G as LoomaChip, H as LoomaExpand, I as getTableOfContentsEntries, J as LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS, K as normalizeLoomaChipColor, L as normalizeTableOfContentsConfig, M as LoomaImage, N as normalizeImageDimension, O as DEFAULT_MENTION_RESULT_LIMIT, P as normalizeImagePlacement, Q as LoomaActiveBlockPluginKey, R as LoomaTab, S as loomaMarkdownFromDoc, T as siteRelativeHref, U as revealLoomaExpandAt, V as LoomaFigure, W as LOOMA_CHIP_COLORS, X as LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS, Y as LOOMA_ACTIVE_BLOCK_CLASS, Z as LoomaActiveBlock, _ as getActiveTableCellAlignment, a as getActiveTableUiState, b as setActiveTableCellBackground, c as insertTableAtRange, d as LoomaTableKit, f as getDefaultEditorExtensions, g as LoomaTableHeader, h as LoomaTableCell, i as getDefaultSlashCommands, j as normalizeMentionResultLimit, k as MAX_MENTION_RESULT_LIMIT, l as normalizeActiveTableColumnWidths, m as LoomaTable, n as createLoomaSlashCommandExtension, o as handleTableAction, p as getLoomaTableExtensions, q as LoomaCallout, r as filterLoomaSlashCommands, s as handleTableOverlayAction, t as LoomaSlashCommand, u as shouldShowTextFormattingToolbar, v as getActiveTableCellBackground, w as createSiteRelativeLinks, x as LoomaSmartPaste, y as setActiveTableCellAlignment, z as LoomaTabs } from "../chunks/extensions.js";
+import { $ as LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS, A as filterLoomaMentionItems, B as LoomaFootnote, C as loomaMarkdownToHtml, D as createLoomaMentionExtension, E as LoomaMentionSuggestionPluginKey, F as LoomaTableOfContents, G as LoomaExpand, H as LoomaFootnotes, I as getTableOfContentsEntries, J as LoomaChip, K as revealLoomaExpandAt, L as normalizeTableOfContentsConfig, M as LoomaImage, N as normalizeImageDimension, O as DEFAULT_MENTION_RESULT_LIMIT, P as normalizeImagePlacement, Q as LOOMA_ACTIVE_BLOCK_CLASS, R as LoomaTab, S as loomaMarkdownFromDoc, T as siteRelativeHref, U as LoomaFigcaption, V as LoomaFootnoteReference, W as LoomaFigure, X as LoomaCallout, Y as normalizeLoomaChipColor, Z as LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS, _ as getActiveTableCellAlignment, a as getActiveTableUiState, b as setActiveTableCellBackground, c as insertTableAtRange, d as LoomaTableKit, et as LoomaActiveBlock, f as getDefaultEditorExtensions, g as LoomaTableHeader, h as LoomaTableCell, i as getDefaultSlashCommands, j as normalizeMentionResultLimit, k as MAX_MENTION_RESULT_LIMIT, l as normalizeActiveTableColumnWidths, m as LoomaTable, n as createLoomaSlashCommandExtension, o as handleTableAction, p as getLoomaTableExtensions, q as LOOMA_CHIP_COLORS, r as filterLoomaSlashCommands, s as handleTableOverlayAction, t as LoomaSlashCommand, tt as LoomaActiveBlockPluginKey, u as shouldShowTextFormattingToolbar, v as getActiveTableCellBackground, w as createSiteRelativeLinks, x as LoomaSmartPaste, y as setActiveTableCellAlignment, z as LoomaTabs } from "../chunks/extensions.js";
 import { a as setReferenceDisplay, i as referenceDisplay, n as LoomaReferencePresentation, o as LOOMA_CALLOUT_TONES, r as getReferenceDisplay, t as LoomaReference } from "../chunks/reference-display.js";
-export { DEFAULT_MENTION_RESULT_LIMIT, LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS, LOOMA_ACTIVE_BLOCK_CLASS, LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS, LOOMA_CALLOUT_TONES, LOOMA_CHIP_COLORS, LoomaActiveBlock, LoomaActiveBlockPluginKey, LoomaCallout, LoomaChip, LoomaExpand, LoomaFigcaption, LoomaFigure, LoomaImage, LoomaMentionSuggestionPluginKey, LoomaReference, LoomaReferencePresentation, LoomaSlashCommand, LoomaSmartPaste, LoomaTab, LoomaTable, LoomaTableCell, LoomaTableHeader, LoomaTableKit, LoomaTableOfContents, LoomaTabs, MAX_MENTION_RESULT_LIMIT, TABLE_CELL_BACKGROUND_PRESETS, createLoomaMentionExtension, createLoomaSlashCommandExtension, createSiteRelativeLinks, filterLoomaMentionItems, filterLoomaSlashCommands, getActiveTableCellAlignment, getActiveTableCellBackground, getActiveTableUiState, getDefaultEditorExtensions, getDefaultSlashCommands, getLoomaTableExtensions, getReferenceDisplay, getTableOfContentsEntries, handleTableAction, handleTableOverlayAction, insertTableAtRange, loomaMarkdownFromDoc, loomaMarkdownToHtml, normalizeActiveTableColumnWidths, normalizeImageDimension, normalizeImagePlacement, normalizeLoomaChipColor, normalizeMentionResultLimit, normalizeTableOfContentsConfig, referenceDisplay, revealLoomaExpandAt, setActiveTableCellAlignment, setActiveTableCellBackground, setReferenceDisplay, shouldShowTextFormattingToolbar, siteRelativeHref };
+export { DEFAULT_MENTION_RESULT_LIMIT, LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS, LOOMA_ACTIVE_BLOCK_CLASS, LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS, LOOMA_CALLOUT_TONES, LOOMA_CHIP_COLORS, LoomaActiveBlock, LoomaActiveBlockPluginKey, LoomaCallout, LoomaChip, LoomaExpand, LoomaFigcaption, LoomaFigure, LoomaFootnote, LoomaFootnoteReference, LoomaFootnotes, LoomaImage, LoomaMentionSuggestionPluginKey, LoomaReference, LoomaReferencePresentation, LoomaSlashCommand, LoomaSmartPaste, LoomaTab, LoomaTable, LoomaTableCell, LoomaTableHeader, LoomaTableKit, LoomaTableOfContents, LoomaTabs, MAX_MENTION_RESULT_LIMIT, TABLE_CELL_BACKGROUND_PRESETS, createLoomaMentionExtension, createLoomaSlashCommandExtension, createSiteRelativeLinks, filterLoomaMentionItems, filterLoomaSlashCommands, getActiveTableCellAlignment, getActiveTableCellBackground, getActiveTableUiState, getDefaultEditorExtensions, getDefaultSlashCommands, getLoomaTableExtensions, getReferenceDisplay, getTableOfContentsEntries, handleTableAction, handleTableOverlayAction, insertTableAtRange, loomaMarkdownFromDoc, loomaMarkdownToHtml, normalizeActiveTableColumnWidths, normalizeImageDimension, normalizeImagePlacement, normalizeLoomaChipColor, normalizeMentionResultLimit, normalizeTableOfContentsConfig, referenceDisplay, revealLoomaExpandAt, setActiveTableCellAlignment, setActiveTableCellBackground, setReferenceDisplay, shouldShowTextFormattingToolbar, siteRelativeHref };

package/editor/index.js

@@ -1,6 +1,6 @@
 import { n as TABLE_CELL_BACKGROUND_PRESETS, t as TABLE_CELL_BACKGROUND_OPTIONS } from "./chunks/table-backgrounds.js";
 import { n as resolveTableCellAt, t as measureTableOverlayGeometry } from "./chunks/ui.js";
-import { A as filterLoomaMentionItems, B as LoomaFigcaption, C as loomaMarkdownToHtml, D as createLoomaMentionExtension, E as LoomaMentionSuggestionPluginKey, F as LoomaTableOfContents, G as LoomaChip, H as LoomaExpand, I as getTableOfContentsEntries, J as LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS, K as normalizeLoomaChipColor, L as normalizeTableOfContentsConfig, M as LoomaImage, N as normalizeImageDimension, O as DEFAULT_MENTION_RESULT_LIMIT, P as normalizeImagePlacement, Q as LoomaActiveBlockPluginKey, R as LoomaTab, S as loomaMarkdownFromDoc, T as siteRelativeHref, U as revealLoomaExpandAt, V as LoomaFigure, W as LOOMA_CHIP_COLORS, X as LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS, Y as LOOMA_ACTIVE_BLOCK_CLASS, Z as LoomaActiveBlock, _ as getActiveTableCellAlignment, a as getActiveTableUiState, b as setActiveTableCellBackground, c as insertTableAtRange, d as LoomaTableKit, f as getDefaultEditorExtensions, g as LoomaTableHeader, h as LoomaTableCell, i as getDefaultSlashCommands, j as normalizeMentionResultLimit, k as MAX_MENTION_RESULT_LIMIT, l as normalizeActiveTableColumnWidths, m as LoomaTable, n as createLoomaSlashCommandExtension, o as handleTableAction, p as getLoomaTableExtensions, q as LoomaCallout, r as filterLoomaSlashCommands, s as handleTableOverlayAction, t as LoomaSlashCommand, u as shouldShowTextFormattingToolbar, v as getActiveTableCellBackground, w as createSiteRelativeLinks, x as LoomaSmartPaste, y as setActiveTableCellAlignment, z as LoomaTabs } from "./chunks/extensions.js";
+import { $ as LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS, A as filterLoomaMentionItems, B as LoomaFootnote, C as loomaMarkdownToHtml, D as createLoomaMentionExtension, E as LoomaMentionSuggestionPluginKey, F as LoomaTableOfContents, G as LoomaExpand, H as LoomaFootnotes, I as getTableOfContentsEntries, J as LoomaChip, K as revealLoomaExpandAt, L as normalizeTableOfContentsConfig, M as LoomaImage, N as normalizeImageDimension, O as DEFAULT_MENTION_RESULT_LIMIT, P as normalizeImagePlacement, Q as LOOMA_ACTIVE_BLOCK_CLASS, R as LoomaTab, S as loomaMarkdownFromDoc, T as siteRelativeHref, U as LoomaFigcaption, V as LoomaFootnoteReference, W as LoomaFigure, X as LoomaCallout, Y as normalizeLoomaChipColor, Z as LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS, _ as getActiveTableCellAlignment, a as getActiveTableUiState, b as setActiveTableCellBackground, c as insertTableAtRange, d as LoomaTableKit, et as LoomaActiveBlock, f as getDefaultEditorExtensions, g as LoomaTableHeader, h as LoomaTableCell, i as getDefaultSlashCommands, j as normalizeMentionResultLimit, k as MAX_MENTION_RESULT_LIMIT, l as normalizeActiveTableColumnWidths, m as LoomaTable, n as createLoomaSlashCommandExtension, o as handleTableAction, p as getLoomaTableExtensions, q as LOOMA_CHIP_COLORS, r as filterLoomaSlashCommands, s as handleTableOverlayAction, t as LoomaSlashCommand, tt as LoomaActiveBlockPluginKey, u as shouldShowTextFormattingToolbar, v as getActiveTableCellBackground, w as createSiteRelativeLinks, x as LoomaSmartPaste, y as setActiveTableCellAlignment, z as LoomaTabs } from "./chunks/extensions.js";
 import { a as setReferenceDisplay, i as referenceDisplay, n as LoomaReferencePresentation, o as LOOMA_CALLOUT_TONES, r as getReferenceDisplay, t as LoomaReference } from "./chunks/reference-display.js";
 import { AlignCenter, AlignLeft, AlignRight, ArrowLeft, Bell, Bold, BookUser, Braces, Calculator, Check, ChevronDown, ChevronLeft, ChevronRight, CircleCheck, CircleDot, CircleQuestionMark, CircleX, CodeXml, Columns3, Compass, CreditCard, Ellipsis, Eraser, ExternalLink, FileText, Folder, GripHorizontal, GripVertical, Heading1, Heading2, Heading3, Highlighter, History, Image, Info, Italic, LayoutDashboard, Lightbulb, Link, List, ListOrdered, ListTodo, LoaderCircle, Merge, MessageSquareWarning, Minus, NotebookPen, PaintBucket, PanelBottom, PanelLeft, PanelRight, PanelTop, Pencil, Pilcrow, Plus, Quote, Receipt, Redo2, Rows3, Search, Settings, Split, Strikethrough, Table2, Tag, Trash2, TriangleAlert, Truck, Underline, Undo2, Unlink, UserRound, Users, X } from "lucide";
 //#region src/editor/icons.ts
@@ -124,4 +124,4 @@ function getVisualViewportRect(owner = window) {
 	};
 }
 //#endregion
-export { DEFAULT_MENTION_RESULT_LIMIT, LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS, LOOMA_ACTIVE_BLOCK_CLASS, LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS, LOOMA_CALLOUT_TONES, LOOMA_CHIP_COLORS, LOOMA_ICONS, LoomaActiveBlock, LoomaActiveBlockPluginKey, LoomaCallout, LoomaChip, LoomaExpand, LoomaFigcaption, LoomaFigure, LoomaImage, LoomaMentionSuggestionPluginKey, LoomaReference, LoomaReferencePresentation, LoomaSlashCommand, LoomaSmartPaste, LoomaTab, LoomaTable, LoomaTableCell, LoomaTableHeader, LoomaTableKit, LoomaTableOfContents, LoomaTabs, MAX_MENTION_RESULT_LIMIT, TABLE_CELL_BACKGROUND_OPTIONS, TABLE_CELL_BACKGROUND_PRESETS, createLoomaMentionExtension, createLoomaSlashCommandExtension, createSiteRelativeLinks, filterLoomaMentionItems, filterLoomaSlashCommands, getActiveTableCellAlignment, getActiveTableCellBackground, getActiveTableUiState, getDefaultEditorExtensions, getDefaultSlashCommands, getLoomaTableExtensions, getReferenceDisplay, getTableOfContentsEntries, getVisualViewportRect, handleTableAction, handleTableOverlayAction, insertTableAtRange, loomaIconMarkup, loomaMarkdownFromDoc, loomaMarkdownToHtml, measureTableOverlayGeometry, normalizeActiveTableColumnWidths, normalizeImageDimension, normalizeImagePlacement, normalizeLoomaChipColor, normalizeMentionResultLimit, normalizeTableOfContentsConfig, referenceDisplay, resolveTableCellAt, revealLoomaExpandAt, setActiveTableCellAlignment, setActiveTableCellBackground, setReferenceDisplay, shouldShowTextFormattingToolbar, siteRelativeHref };
+export { DEFAULT_MENTION_RESULT_LIMIT, LOOMA_ACTIVE_BLOCK_BLUR_GRACE_MS, LOOMA_ACTIVE_BLOCK_CLASS, LOOMA_ACTIVE_BLOCK_TYPING_IDLE_MS, LOOMA_CALLOUT_TONES, LOOMA_CHIP_COLORS, LOOMA_ICONS, LoomaActiveBlock, LoomaActiveBlockPluginKey, LoomaCallout, LoomaChip, LoomaExpand, LoomaFigcaption, LoomaFigure, LoomaFootnote, LoomaFootnoteReference, LoomaFootnotes, LoomaImage, LoomaMentionSuggestionPluginKey, LoomaReference, LoomaReferencePresentation, LoomaSlashCommand, LoomaSmartPaste, LoomaTab, LoomaTable, LoomaTableCell, LoomaTableHeader, LoomaTableKit, LoomaTableOfContents, LoomaTabs, MAX_MENTION_RESULT_LIMIT, TABLE_CELL_BACKGROUND_OPTIONS, TABLE_CELL_BACKGROUND_PRESETS, createLoomaMentionExtension, createLoomaSlashCommandExtension, createSiteRelativeLinks, filterLoomaMentionItems, filterLoomaSlashCommands, getActiveTableCellAlignment, getActiveTableCellBackground, getActiveTableUiState, getDefaultEditorExtensions, getDefaultSlashCommands, getLoomaTableExtensions, getReferenceDisplay, getTableOfContentsEntries, getVisualViewportRect, handleTableAction, handleTableOverlayAction, insertTableAtRange, loomaIconMarkup, loomaMarkdownFromDoc, loomaMarkdownToHtml, measureTableOverlayGeometry, normalizeActiveTableColumnWidths, normalizeImageDimension, normalizeImagePlacement, normalizeLoomaChipColor, normalizeMentionResultLimit, normalizeTableOfContentsConfig, referenceDisplay, resolveTableCellAt, revealLoomaExpandAt, setActiveTableCellAlignment, setActiveTableCellBackground, setReferenceDisplay, shouldShowTextFormattingToolbar, siteRelativeHref };

package/markdown/fixtures.js

@@ -51,6 +51,16 @@ var files = /* #__PURE__ */ Object.assign({
 	"../../markdown-fixtures/details/open.md": "::: details Show the full log {open}\nThe build finished in 42 seconds.\n:::\n",
 	"../../markdown-fixtures/figures/caption.html": "<figure>\n<img src=\"./pipeline.svg\" alt=\"The build pipeline\">\n<figcaption>The build, from <em>source</em> to release</figcaption>\n</figure>\n",
 	"../../markdown-fixtures/figures/caption.md": "::: figure The build, from *source* to release\n![The build pipeline](./pipeline.svg)\n:::\n",
+	"../../markdown-fixtures/footnotes/basic.html": "<p>Markdown renders tables<sup><a href=\"#fn:tables\" id=\"fnref:tables\" data-footnote-ref=\"\" aria-describedby=\"footnote:label\">1</a></sup> and task lists<sup><a href=\"#fn:1\" id=\"fnref:1\" data-footnote-ref=\"\" aria-describedby=\"footnote:label\">2</a></sup>.</p>\n<section data-footnotes=\"\" class=\"footnotes\">\n<h2 id=\"footnote:label\" class=\"sr-only\">Footnotes</h2>\n<ol>\n<li id=\"fn:tables\">\n<p>GitHub Flavored Markdown tables. <a href=\"#fnref:tables\" data-footnote-backref=\"\" aria-label=\"Back to reference 1\">↩</a></p>\n</li>\n<li id=\"fn:1\">\n<p>Each item has a checkbox. <a href=\"#fnref:1\" data-footnote-backref=\"\" aria-label=\"Back to reference 2\">↩</a></p>\n</li>\n</ol>\n</section>\n",
+	"../../markdown-fixtures/footnotes/basic.md": "Markdown renders tables[^tables] and task lists[^1].\n\n[^tables]: GitHub Flavored Markdown tables.\n\n[^1]: Each item has a checkbox.\n",
+	"../../markdown-fixtures/footnotes/blocks.canonical.md": "The build writes a log[^log].\n\n[^log]: The log holds every step.\n\n    ```sh\n    pnpm build --verbose\n    ```\n\n    It is kept for a week.\n",
+	"../../markdown-fixtures/footnotes/blocks.html": "<p>The build writes a log<sup><a href=\"#fn:log\" id=\"fnref:log\" data-footnote-ref=\"\" aria-describedby=\"footnote:label\">1</a></sup>.</p>\n<section data-footnotes=\"\" class=\"footnotes\">\n<h2 id=\"footnote:label\" class=\"sr-only\">Footnotes</h2>\n<ol>\n<li id=\"fn:log\">\n<p>The log holds every step.</p>\n<pre><code class=\"language-sh\">pnpm build --verbose</code></pre>\n<p>It is kept for a week. <a href=\"#fnref:log\" data-footnote-backref=\"\" aria-label=\"Back to reference 1\">↩</a></p>\n</li>\n</ol>\n</section>\n",
+	"../../markdown-fixtures/footnotes/blocks.md": "[^log]: The log holds every step.\n\n    ```sh\n    pnpm build --verbose\n    ```\n\n    It is kept for a week.\n\nThe build writes a log[^log].\n",
+	"../../markdown-fixtures/footnotes/repeated.html": "<p>The build<sup><a href=\"#fn:build\" id=\"fnref:build\" data-footnote-ref=\"\" aria-describedby=\"footnote:label\">1</a></sup> runs in CI, and every build<sup><a href=\"#fn:build\" id=\"fnref:build:2\" data-footnote-ref=\"\" aria-describedby=\"footnote:label\">1</a></sup> uploads its report<sup><a href=\"#fn:report\" id=\"fnref:report\" data-footnote-ref=\"\" aria-describedby=\"footnote:label\">2</a></sup>.</p>\n<section data-footnotes=\"\" class=\"footnotes\">\n<h2 id=\"footnote:label\" class=\"sr-only\">Footnotes</h2>\n<ol>\n<li id=\"fn:build\">\n<p>A clean install, then the tests. <a href=\"#fnref:build\" data-footnote-backref=\"\" aria-label=\"Back to reference 1\">↩</a> <a href=\"#fnref:build:2\" data-footnote-backref=\"\" aria-label=\"Back to reference 1-2\">↩<sup>2</sup></a></p>\n</li>\n<li id=\"fn:report\">\n<p>The coverage summary. <a href=\"#fnref:report\" data-footnote-backref=\"\" aria-label=\"Back to reference 2\">↩</a></p>\n</li>\n</ol>\n</section>\n",
+	"../../markdown-fixtures/footnotes/repeated.md": "The build[^build] runs in CI, and every build[^build] uploads its report[^report].\n\n[^build]: A clean install, then the tests.\n\n[^report]: The coverage summary.\n",
+	"../../markdown-fixtures/footnotes/unreferenced.canonical.md": "A note with no definition\\[^missing\\] stays text, and a definition nobody refers to renders nothing.\n",
+	"../../markdown-fixtures/footnotes/unreferenced.html": "<p>A note with no definition[^missing] stays text, and a definition nobody refers to renders nothing.</p>\n",
+	"../../markdown-fixtures/footnotes/unreferenced.md": "A note with no definition[^missing] stays text, and a definition nobody refers to renders nothing.\n\n[^unused]: Unused.\n",
 	"../../markdown-fixtures/front-matter/list-only.canonical.md": "# Notes\n",
 	"../../markdown-fixtures/front-matter/list-only.html": "<h1 id=\"notes\">Notes</h1>\n",
 	"../../markdown-fixtures/front-matter/list-only.md": "---\naliases:\n  - /old/\n  - /older/\n---\n\n# Notes\n",

package/markdown/markdown-it.d.ts

@@ -8,7 +8,7 @@ export interface LoomaMarkdownOptions {
     codeNotation?: "apply" | "keep";
 }
 /**
- * Adds Looma Markdown to a markdown-it instance: containers, alerts, task lists, the table of
+ * Adds Looma Markdown to a markdown-it instance: containers, alerts, task lists, footnotes, the table of
  * contents, chips, mentions, brace attributes, heading anchors, code meta and front matter.
  * @contract Renders the canonical HTML, which is the HTML LoomaEditor saves. It is not sanitized.
  * Linkify and raw HTML are instance options; `createLoomaMarkdownIt` turns both on.

package/markdown/markdown-it.js

@@ -296,6 +296,119 @@ function applyImageAttributes(image, attributes) {
 	if (typeof placement === "string" && PLACEMENTS.has(placement) && placement !== "block") image.attrSet("data-placement", placement);
 	if (attributes.responsive === true) image.attrSet("data-looma-responsive", "");
 }
+var FOOTNOTE_DEFINITION = /^\[\^([^\s\]]+)\]:/;
+var FOOTNOTE_REFERENCE = /^\[\^([^\s\]]+)\]/;
+function footnoteDefinition(state, startLine, endLine, silent) {
+	if (state.sCount[startLine] - state.blkIndent >= 4) return false;
+	const start = state.bMarks[startLine] + state.tShift[startLine];
+	const match = FOOTNOTE_DEFINITION.exec(state.src.slice(start, state.eMarks[startLine]));
+	if (!match) return false;
+	if (silent) return true;
+	(state.env.footnotes ??= /* @__PURE__ */ new Set()).add(match[1]);
+	const open = state.push("looma_footnote_open", "li", 1);
+	Object.assign(open, {
+		meta: { label: match[1] },
+		block: true,
+		map: [startLine, startLine]
+	});
+	const saved = {
+		bMark: state.bMarks[startLine],
+		tShift: state.tShift[startLine],
+		sCount: state.sCount[startLine],
+		parentType: state.parentType
+	};
+	let position = start + match[0].length;
+	const contentStart = position;
+	let offset = state.sCount[startLine] + match[0].length;
+	const initial = offset;
+	while (position < state.eMarks[startLine] && (state.src[position] === " " || state.src[position] === "	")) {
+		offset += state.src[position] === "	" ? 4 - (offset + state.bsCount[startLine]) % 4 : 1;
+		position++;
+	}
+	state.tShift[startLine] = position - contentStart;
+	state.sCount[startLine] = offset - initial;
+	state.bMarks[startLine] = contentStart;
+	state.blkIndent += 4;
+	state.parentType = "footnote";
+	if (state.sCount[startLine] < state.blkIndent) state.sCount[startLine] += state.blkIndent;
+	state.md.block.tokenize(state, startLine, endLine);
+	state.parentType = saved.parentType;
+	state.blkIndent -= 4;
+	state.tShift[startLine] = saved.tShift;
+	state.sCount[startLine] = saved.sCount;
+	state.bMarks[startLine] = saved.bMark;
+	open.map[1] = state.line;
+	state.push("looma_footnote_close", "li", -1).block = true;
+	return true;
+}
+function footnoteReference(state, silent) {
+	if (state.src.charCodeAt(state.pos) !== 91 || state.src.charCodeAt(state.pos + 1) !== 94) return false;
+	const match = FOOTNOTE_REFERENCE.exec(state.src.slice(state.pos, state.posMax));
+	if (!match || !state.env.footnotes?.has(match[1])) return false;
+	if (!silent) state.push("looma_footnote_ref", "sup", 0).meta = { label: match[1] };
+	state.pos += match[0].length;
+	return true;
+}
+function footnotes(state) {
+	const definitions = /* @__PURE__ */ new Map();
+	const body = [];
+	for (let index = 0; index < state.tokens.length; index++) {
+		const token = state.tokens[index];
+		if (token.type !== "looma_footnote_open") {
+			body.push(token);
+			continue;
+		}
+		let depth = 0, end = index;
+		for (; end < state.tokens.length; end++) if (state.tokens[end].type === "looma_footnote_open") depth++;
+		else if (state.tokens[end].type === "looma_footnote_close" && --depth === 0) break;
+		const label = token.meta.label;
+		if (!definitions.has(label)) definitions.set(label, state.tokens.slice(index, end + 1));
+		index = end;
+	}
+	if (!definitions.size) return;
+	const order = [];
+	const counts = /* @__PURE__ */ new Map();
+	const number = (tokens) => {
+		for (const token of tokens) for (const child of token.children ?? []) {
+			if (child.type !== "looma_footnote_ref") continue;
+			const label = child.meta.label;
+			if (!counts.has(label)) order.push(label);
+			const occurrence = (counts.get(label) ?? 0) + 1;
+			counts.set(label, occurrence);
+			child.meta = {
+				label,
+				number: order.indexOf(label) + 1,
+				occurrence
+			};
+		}
+	};
+	number(body);
+	const notes = [];
+	for (let index = 0; index < order.length; index++) {
+		const label = order[index];
+		const tokens = definitions.get(label);
+		number(tokens);
+		const backrefs = Object.assign(new state.Token("looma_footnote_backrefs", "", 0), { meta: {
+			label,
+			number: index + 1
+		} });
+		const last = tokens.length - 2;
+		if (tokens[last].type === "paragraph_close") tokens.splice(last, 0, backrefs);
+		else tokens.splice(last + 1, 0, new state.Token("paragraph_open", "p", 1), backrefs, new state.Token("paragraph_close", "p", -1));
+		notes.push(...tokens);
+	}
+	if (!notes.length) {
+		state.tokens = body;
+		return;
+	}
+	for (const note of notes) if (note.type === "looma_footnote_open") note.meta.count = counts.get(note.meta.label);
+	state.tokens = [
+		...body,
+		Object.assign(new state.Token("looma_footnotes_open", "section", 1), { block: true }),
+		...notes,
+		Object.assign(new state.Token("looma_footnotes_close", "section", -1), { block: true })
+	];
+}
 function tableOfContents(tokens, format, depth, escape) {
 	const roots = [];
 	const ancestors = [];
@@ -321,7 +434,7 @@ function tableOfContents(tokens, format, depth, escape) {
 	return `<nav data-looma-toc="" data-format="${format}" data-depth="${depth}" aria-label="Table of contents"><strong>Table of contents</strong>${roots.length ? render(roots) : ""}</nav>\n`;
 }
 /**
-* Adds Looma Markdown to a markdown-it instance: containers, alerts, task lists, the table of
+* Adds Looma Markdown to a markdown-it instance: containers, alerts, task lists, footnotes, the table of
 * contents, chips, mentions, brace attributes, heading anchors, code meta and front matter.
 * @contract Renders the canonical HTML, which is the HTML LoomaEditor saves. It is not sanitized.
 * Linkify and raw HTML are instance options; `createLoomaMarkdownIt` turns both on.
@@ -329,6 +442,7 @@ function tableOfContents(tokens, format, depth, escape) {
 function loomaMarkdown(md, { codeNotation = "apply" } = {}) {
 	const escape = md.utils.escapeHtml;
 	md.block.ruler.before("table", "looma_frontmatter", frontmatter);
+	md.block.ruler.before("reference", "looma_footnote", footnoteDefinition, { alt: ["paragraph", "reference"] });
 	md.block.ruler.before("fence", "looma_container", container, { alt: [
 		"paragraph",
 		"reference",
@@ -342,9 +456,11 @@ function loomaMarkdown(md, { codeNotation = "apply" } = {}) {
 		"list"
 	] });
 	md.inline.ruler.before("link", "looma_directive", directive);
+	md.inline.ruler.before("link", "looma_footnote_ref", footnoteReference);
 	md.core.ruler.after("block", "looma_task_lists", taskLists);
 	md.core.ruler.before("inline", "looma_alerts", alerts);
 	md.core.ruler.before("text_join", "looma_attributes", attributes);
+	md.core.ruler.after("inline", "looma_footnotes", footnotes);
 	const rules = md.renderer.rules;
 	rules.looma_frontmatter = () => "";
 	rules.looma_container_open = (tokens, index) => {
@@ -366,6 +482,22 @@ function loomaMarkdown(md, { codeNotation = "apply" } = {}) {
 	};
 	rules.looma_tab_open = (tokens, index) => `<section aria-label="${escape(tokens[index].meta.label)}">\n`;
 	rules.looma_tab_close = () => "</section>\n";
+	rules.looma_footnote_ref = (tokens, index) => {
+		const { label, number, occurrence } = tokens[index].meta;
+		return `<sup><a href="#fn:${escape(label)}" id="fnref:${escape(label)}${occurrence > 1 ? `:${occurrence}` : ""}" data-footnote-ref="" aria-describedby="footnote:label">${number}</a></sup>`;
+	};
+	rules.looma_footnote_backrefs = (tokens, index) => {
+		const { label, number } = tokens[index].meta;
+		const count = tokens.find((token) => token.type === "looma_footnote_open" && token.meta.label === label)?.meta.count ?? 1;
+		return Array.from({ length: count }, (_, occurrence) => {
+			const suffix = occurrence ? `:${occurrence + 1}` : "";
+			return ` <a href="#fnref:${escape(label)}${suffix}" data-footnote-backref="" aria-label="Back to reference ${number}${occurrence ? `-${occurrence + 1}` : ""}">↩${occurrence ? `<sup>${occurrence + 1}</sup>` : ""}</a>`;
+		}).join("");
+	};
+	rules.looma_footnotes_open = () => "<section data-footnotes=\"\" class=\"footnotes\">\n<h2 id=\"footnote:label\" class=\"sr-only\">Footnotes</h2>\n<ol>\n";
+	rules.looma_footnotes_close = () => "</ol>\n</section>\n";
+	rules.looma_footnote_open = (tokens, index) => `<li id="fn:${escape(tokens[index].meta.label)}">\n`;
+	rules.looma_footnote_close = () => "</li>\n";
 	rules.looma_toc = (tokens, index) => tableOfContents(tokens, tokens[index].meta.format, tokens[index].meta.depth, escape);
 	rules.looma_chip = (tokens, index) => {
 		const { label, attributes } = tokens[index].meta;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@threadlabs/looma",
-  "version": "0.30.7",
+  "version": "0.30.8",
   "type": "module",
   "description": "Looma components as HTML, Vue, and plain DOM, with design tokens.",
   "license": "MIT",