@threadlabs/looma 0.28.17 → 0.28.19

package/editor/chunks/extensions.js

@@ -309,15 +309,49 @@ function parseLoomaFenceInfo(info) {
 		...numbers ? { lineNumbers: numbers[1] === void 0 } : {}
 	};
 }
+var MAPPING_KEY = /^(?:[^\s#:'"\-?,[\]{}&*!|>%@`][^:\n]*?|"[^"\n]*"|'[^'\n]*')[ \t]*:(?:[ \t]|$)/;
+var NOTATION = /[ \t]*(?:\/\/|#|--|<!--|\{?\/\*)[ \t]*\[!code highlight(?::(\d+))?\][ \t]*(?:-->|\*\/\}?)?[ \t]*$/;
+var ESCAPED_NOTATION = /\[\\(\\*!code highlight)/g;
+/**
+* Applies code notation: a line ending in a `[!code highlight]` comment is highlighted and loses
+* the comment, `[!code highlight:3]` covers three lines, and a marker alone on its line is removed
+* with the line and applies to the lines after it. A backslash between `[` and `!` escapes a
+* marker, `[\!code highlight]`, which then shows as text with one backslash fewer and highlights
+* nothing.
+* @contract Returns the code a reader sees and its highlighted line numbers, from 1, ascending.
+* ponytail: matched on source lines, so a string that ends in the marker counts too.
+*/
+function applyLoomaCodeNotation(code) {
+	const kept = [];
+	const lines = /* @__PURE__ */ new Set();
+	for (const line of code.split("\n")) {
+		const match = NOTATION.exec(line);
+		if (!match) {
+			kept.push(line);
+			continue;
+		}
+		const rest = line.slice(0, match.index);
+		const own = rest.trim() !== "";
+		if (own) kept.push(rest);
+		for (let count = 0; count < Number(match[1] ?? 1); count++) lines.add(kept.length + (own ? 0 : 1) + count);
+	}
+	return {
+		code: kept.join("\n").replace(ESCAPED_NOTATION, "[$1"),
+		lines: [...lines].sort((a, b) => a - b)
+	};
+}
 /**
 * Splits YAML front matter from the start of a document.
-* @contract Front matter opens with a `---` line at the very start, holds at least one `key: value`
-* line, and closes at a `---` or `...` line. `source` is the block as written, delimiters included.
+* @contract Front matter opens with a `---` line at the very start and closes at a `---` or `...`
+* line, and what lies between is a YAML mapping: its first line that is not blank or a comment
+* starts with a key, whose value may be a scalar, a list or a mapping. `source` is the block as
+* written, delimiters included.
 * @failure Returns null when the document has none.
 */
 function splitLoomaFrontmatter(document) {
 	const match = /^---[ \t]*\r?\n([\s\S]*?)\r?\n(?:---|\.\.\.)[ \t]*(?:\r?\n|$)/.exec(document.slice(0, 8192));
-	if (!match || !/^[A-Za-z][\w-]*:[ \t]*\S/m.test(match[1])) return null;
+	const first = match?.[1].split(/\r?\n/).find((line) => line.trim() && !line.trimStart().startsWith("#"));
+	if (!match || !first || !MAPPING_KEY.test(first)) return null;
 	return {
 		source: match[0].trimEnd(),
 		yaml: match[1],
@@ -9695,7 +9729,10 @@ function taskLists(state) {
 			inline.content = inline.content.replace(TASK, "");
 			item.attrSet("data-type", "taskItem");
 			item.attrSet("data-checked", String(checked));
-			item.meta = { checked };
+			inline.meta = {
+				...inline.meta,
+				task: checked
+			};
 		}
 	}
 }
@@ -9737,6 +9774,11 @@ function attributes(state) {
 		const token = tokens[index];
 		if (token.type !== "inline" || !token.children) continue;
 		const children = token.children;
+		if (typeof token.meta?.task === "boolean") {
+			const html = (content) => Object.assign(new state.Token("html_inline", "", 0), { content });
+			children.unshift(html(`<label><input type="checkbox" disabled=""${token.meta.task ? " checked=\"\"" : ""}> `));
+			children.push(html("</label>"));
+		}
 		for (let child = children.length - 3; child >= 0; child--) {
 			const text = children[child + 1];
 			if (children[child].type !== "link_open" || children[child].markup !== "linkify" || /^(?:[a-z][\w+.-]*:|www\.)/i.test(text.content)) continue;
@@ -9813,7 +9855,7 @@ function tableOfContents(tokens, format, depth, escape) {
 * @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.
 */
-function loomaMarkdown$1(md) {
+function loomaMarkdown$1(md, { codeNotation = "apply" } = {}) {
 	const escape = md.utils.escapeHtml;
 	md.block.ruler.before("table", "looma_frontmatter", frontmatter);
 	md.block.ruler.before("fence", "looma_container", container, { alt: [
@@ -9864,15 +9906,10 @@ function loomaMarkdown$1(md) {
 		const id = String(attributes.id);
 		return `<span data-type="mention" class="looma-mention" data-id="${escape(id)}" data-label="${escape(label || id)}">@${escape(label || id)}</span>`;
 	};
-	const listItem = rules.list_item_open ?? ((tokens, index, options, _env, self) => self.renderToken(tokens, index, options));
-	rules.list_item_open = (tokens, index, options, env, self) => {
-		const html = listItem(tokens, index, options, env, self);
-		const task = tokens[index].meta;
-		return task && typeof task.checked === "boolean" ? `${html}<input type="checkbox" disabled=""${task.checked ? " checked=\"\"" : ""}>` : html;
-	};
 	const code = (content, info) => {
 		const { language, meta } = parseLoomaFenceInfo(info);
-		return `<pre><code${language ? ` class="language-${escape(language)}"` : ""}${meta ? ` data-meta="${escape(meta)}"` : ""}>${escape(content.replace(/\n$/, ""))}</code></pre>\n`;
+		const source = content.replace(/\n$/, "");
+		return `<pre><code${language ? ` class="language-${escape(language)}"` : ""}${meta ? ` data-meta="${escape(meta)}"` : ""}>${escape(codeNotation === "keep" ? source : applyLoomaCodeNotation(source).code)}</code></pre>\n`;
 	};
 	rules.fence = (tokens, index) => code(tokens[index].content, tokens[index].info);
 	rules.code_block = (tokens, index) => code(tokens[index].content, "");
@@ -9881,17 +9918,17 @@ function loomaMarkdown$1(md) {
 * A markdown-it instance for Looma Markdown: raw HTML and GFM autolinks on, with `loomaMarkdown`.
 * @contract Each call returns a new instance that callers may extend.
 */
-function createLoomaMarkdownIt() {
+function createLoomaMarkdownIt(options = {}) {
 	return new MarkdownIt({
 		html: true,
 		linkify: true,
 		typographer: false
-	}).use(loomaMarkdown$1);
+	}).use(loomaMarkdown$1, options);
 }
 //#endregion
 //#region src/editor/extensions/markdown.ts
-/** The markdown-it instance LoomaEditor reads Looma Markdown with. */
-var loomaMarkdown = createLoomaMarkdownIt();
+/** The markdown-it instance LoomaEditor reads Looma Markdown with; code keeps its notation as source. */
+var loomaMarkdown = createLoomaMarkdownIt({ codeNotation: "keep" });
 /**
 * Renders Looma Markdown as the HTML the editor parses.
 * @contract The result is not sanitized; pass it to the editor's `setContent`, whose schema

package/editor/extensions/markdown.d.ts

@@ -1,5 +1,5 @@
 import { type Node as ProseMirrorNode } from "@tiptap/pm/model";
-/** The markdown-it instance LoomaEditor reads Looma Markdown with. */
+/** The markdown-it instance LoomaEditor reads Looma Markdown with; code keeps its notation as source. */
 export declare const loomaMarkdown: import("markdown-it").default;
 /**
  * Renders Looma Markdown as the HTML the editor parses.

package/markdown/fixtures.js

@@ -23,7 +23,11 @@ var files = /* #__PURE__ */ Object.assign({
 	"../../markdown-fixtures/code-blocks/fences.md": "```ts\nconst answer = 42;\n```\n\n```\nplain text\n```\n\n    indented\n",
 	"../../markdown-fixtures/code-blocks/long-fence.html": "<pre><code class=\"language-md\">```ts\nconst a = 1;\n```</code></pre>\n",
 	"../../markdown-fixtures/code-blocks/long-fence.md": "````md\n```ts\nconst a = 1;\n```\n````\n",
-	"../../markdown-fixtures/code-meta/notation.html": "<pre><code class=\"language-ts\">const port = 8080; // [!code highlight]</code></pre>\n",
+	"../../markdown-fixtures/code-meta/notation-alone.html": "<pre><code class=\"language-ts\">const host = &quot;localhost&quot;;\nconst port = 8080;</code></pre>\n",
+	"../../markdown-fixtures/code-meta/notation-alone.md": "```ts\n// [!code highlight:2]\nconst host = \"localhost\";\nconst port = 8080;\n```\n",
+	"../../markdown-fixtures/code-meta/notation-escaped.html": "<pre><code class=\"language-md\">const port = 8080; // [!code highlight]\nconst host = &quot;localhost&quot;; // [\\!code highlight:2]</code></pre>\n",
+	"../../markdown-fixtures/code-meta/notation-escaped.md": "```md\nconst port = 8080; // [\\!code highlight]\nconst host = \"localhost\"; // [\\\\!code highlight:2]\n```\n",
+	"../../markdown-fixtures/code-meta/notation.html": "<pre><code class=\"language-ts\">const port = 8080;</code></pre>\n",
 	"../../markdown-fixtures/code-meta/notation.md": "```ts\nconst port = 8080; // [!code highlight]\n```\n",
 	"../../markdown-fixtures/code-meta/title-lines.html": "<pre><code class=\"language-ts\" data-meta=\"title=&quot;config.ts&quot; {1,3-4} :line-numbers\">export default {\n  name: &quot;docs&quot;,\n  base: &quot;/docs/&quot;,\n};</code></pre>\n",
 	"../../markdown-fixtures/code-meta/title-lines.md": "```ts title=\"config.ts\" {1,3-4} :line-numbers\nexport default {\n  name: \"docs\",\n  base: \"/docs/\",\n};\n```\n",
@@ -47,9 +51,18 @@ 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/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",
+	"../../markdown-fixtures/front-matter/mapping-only.canonical.md": "# Notes\n",
+	"../../markdown-fixtures/front-matter/mapping-only.html": "<h1 id=\"notes\">Notes</h1>\n",
+	"../../markdown-fixtures/front-matter/mapping-only.md": "---\nhead:\n  meta:\n    robots: noindex\n---\n\n# Notes\n",
 	"../../markdown-fixtures/front-matter/metadata.canonical.md": "# Notes\n",
 	"../../markdown-fixtures/front-matter/metadata.html": "<h1 id=\"notes\">Notes</h1>\n",
 	"../../markdown-fixtures/front-matter/metadata.md": "---\ntitle: Release notes\n---\n\n# Notes\n",
+	"../../markdown-fixtures/front-matter/nested.canonical.md": "# Notes\n",
+	"../../markdown-fixtures/front-matter/nested.html": "<h1 id=\"notes\">Notes</h1>\n",
+	"../../markdown-fixtures/front-matter/nested.md": "---\n# Page settings\nsidebar:\n  position: 2\n  items:\n    - label: Intro\n      href: /intro/\ntitle: Notes\n---\n\n# Notes\n",
 	"../../markdown-fixtures/heading-ids/accented.html": "<h2 id=\"über-uns\">Über uns</h2>\n<h2 id=\"café-crème\">Café crème</h2>\n",
 	"../../markdown-fixtures/heading-ids/accented.md": "## Über uns\n\n## Café crème\n",
 	"../../markdown-fixtures/heading-ids/cjk.html": "<h2 id=\"はじめに\">はじめに</h2>\n<h2 id=\"設定-と-使い方\">設定 と 使い方</h2>\n",
@@ -85,8 +98,11 @@ var files = /* #__PURE__ */ Object.assign({
 	"../../markdown-fixtures/tabs/code-group.md": "::: code-group\n```js title=\"looma.config.js\"\nexport default { theme: \"light\" };\n```\n```ts\nexport default { theme: \"light\" } satisfies Config;\n```\n:::\n",
 	"../../markdown-fixtures/tabs/labelled.html": "<ui-tabs group=\"install\">\n<section aria-label=\"npm\">\n<pre><code class=\"language-sh\">npm install @threadlabs/looma</code></pre>\n</section>\n<section aria-label=\"pnpm\">\n<pre><code class=\"language-sh\">pnpm add @threadlabs/looma</code></pre>\n</section>\n</ui-tabs>\n",
 	"../../markdown-fixtures/tabs/labelled.md": "::: tabs install\n== npm\n```sh\nnpm install @threadlabs/looma\n```\n== pnpm\n```sh\npnpm add @threadlabs/looma\n```\n:::\n",
-	"../../markdown-fixtures/task-lists/checked.html": "<ul data-type=\"taskList\">\n<li data-type=\"taskItem\" data-checked=\"true\"><input type=\"checkbox\" disabled checked>Read the changelog</li>\n<li data-type=\"taskItem\" data-checked=\"false\"><input type=\"checkbox\" disabled>Run the migration</li>\n</ul>\n",
+	"../../markdown-fixtures/task-lists/checked.html": "<ul data-type=\"taskList\">\n<li data-type=\"taskItem\" data-checked=\"true\"><label><input type=\"checkbox\" disabled checked> Read the changelog</label></li>\n<li data-type=\"taskItem\" data-checked=\"false\"><label><input type=\"checkbox\" disabled> Run the migration</label></li>\n</ul>\n",
 	"../../markdown-fixtures/task-lists/checked.md": "- [x] Read the changelog\n- [ ] Run the migration\n",
+	"../../markdown-fixtures/task-lists/loose.canonical.md": "- [x] Read the changelog\n\n  Then tell the team.\n- [ ] Run the migration\n",
+	"../../markdown-fixtures/task-lists/loose.html": "<ul data-type=\"taskList\">\n<li data-type=\"taskItem\" data-checked=\"true\">\n<p><label><input type=\"checkbox\" disabled checked> Read the changelog</label></p>\n<p>Then tell the team.</p>\n</li>\n<li data-type=\"taskItem\" data-checked=\"false\">\n<p><label><input type=\"checkbox\" disabled> Run the migration</label></p>\n</li>\n</ul>\n",
+	"../../markdown-fixtures/task-lists/loose.md": "- [x] Read the changelog\n\n  Then tell the team.\n\n- [ ] Run the migration\n",
 	"../../markdown-fixtures/task-lists/mixed.canonical.md": "- \\[x\\] Done\n- Not a task\n",
 	"../../markdown-fixtures/task-lists/mixed.html": "<ul>\n<li>[x] Done</li>\n<li>Not a task</li>\n</ul>\n",
 	"../../markdown-fixtures/task-lists/mixed.md": "- [x] Done\n- Not a task\n",

package/markdown/index.d.ts

@@ -92,10 +92,25 @@ export interface LoomaFenceInfo {
 }
 /** Reads a fence's info string: ```` ```ts title="a.ts" {1,3-5} :line-numbers ````. */
 export declare function parseLoomaFenceInfo(info: string): LoomaFenceInfo;
+/**
+ * Applies code notation: a line ending in a `[!code highlight]` comment is highlighted and loses
+ * the comment, `[!code highlight:3]` covers three lines, and a marker alone on its line is removed
+ * with the line and applies to the lines after it. A backslash between `[` and `!` escapes a
+ * marker, `[\!code highlight]`, which then shows as text with one backslash fewer and highlights
+ * nothing.
+ * @contract Returns the code a reader sees and its highlighted line numbers, from 1, ascending.
+ * ponytail: matched on source lines, so a string that ends in the marker counts too.
+ */
+export declare function applyLoomaCodeNotation(code: string): {
+    code: string;
+    lines: number[];
+};
 /**
  * Splits YAML front matter from the start of a document.
- * @contract Front matter opens with a `---` line at the very start, holds at least one `key: value`
- * line, and closes at a `---` or `...` line. `source` is the block as written, delimiters included.
+ * @contract Front matter opens with a `---` line at the very start and closes at a `---` or `...`
+ * line, and what lies between is a YAML mapping: its first line that is not blank or a comment
+ * starts with a key, whose value may be a scalar, a list or a mapping. `source` is the block as
+ * written, delimiters included.
  * @failure Returns null when the document has none.
  */
 export declare function splitLoomaFrontmatter(document: string): {

package/markdown/index.js

@@ -204,15 +204,49 @@ function parseLoomaFenceInfo(info) {
 		...numbers ? { lineNumbers: numbers[1] === void 0 } : {}
 	};
 }
+var MAPPING_KEY = /^(?:[^\s#:'"\-?,[\]{}&*!|>%@`][^:\n]*?|"[^"\n]*"|'[^'\n]*')[ \t]*:(?:[ \t]|$)/;
+var NOTATION = /[ \t]*(?:\/\/|#|--|<!--|\{?\/\*)[ \t]*\[!code highlight(?::(\d+))?\][ \t]*(?:-->|\*\/\}?)?[ \t]*$/;
+var ESCAPED_NOTATION = /\[\\(\\*!code highlight)/g;
+/**
+* Applies code notation: a line ending in a `[!code highlight]` comment is highlighted and loses
+* the comment, `[!code highlight:3]` covers three lines, and a marker alone on its line is removed
+* with the line and applies to the lines after it. A backslash between `[` and `!` escapes a
+* marker, `[\!code highlight]`, which then shows as text with one backslash fewer and highlights
+* nothing.
+* @contract Returns the code a reader sees and its highlighted line numbers, from 1, ascending.
+* ponytail: matched on source lines, so a string that ends in the marker counts too.
+*/
+function applyLoomaCodeNotation(code) {
+	const kept = [];
+	const lines = /* @__PURE__ */ new Set();
+	for (const line of code.split("\n")) {
+		const match = NOTATION.exec(line);
+		if (!match) {
+			kept.push(line);
+			continue;
+		}
+		const rest = line.slice(0, match.index);
+		const own = rest.trim() !== "";
+		if (own) kept.push(rest);
+		for (let count = 0; count < Number(match[1] ?? 1); count++) lines.add(kept.length + (own ? 0 : 1) + count);
+	}
+	return {
+		code: kept.join("\n").replace(ESCAPED_NOTATION, "[$1"),
+		lines: [...lines].sort((a, b) => a - b)
+	};
+}
 /**
 * Splits YAML front matter from the start of a document.
-* @contract Front matter opens with a `---` line at the very start, holds at least one `key: value`
-* line, and closes at a `---` or `...` line. `source` is the block as written, delimiters included.
+* @contract Front matter opens with a `---` line at the very start and closes at a `---` or `...`
+* line, and what lies between is a YAML mapping: its first line that is not blank or a comment
+* starts with a key, whose value may be a scalar, a list or a mapping. `source` is the block as
+* written, delimiters included.
 * @failure Returns null when the document has none.
 */
 function splitLoomaFrontmatter(document) {
 	const match = /^---[ \t]*\r?\n([\s\S]*?)\r?\n(?:---|\.\.\.)[ \t]*(?:\r?\n|$)/.exec(document.slice(0, 8192));
-	if (!match || !/^[A-Za-z][\w-]*:[ \t]*\S/m.test(match[1])) return null;
+	const first = match?.[1].split(/\r?\n/).find((line) => line.trim() && !line.trimStart().startsWith("#"));
+	if (!match || !first || !MAPPING_KEY.test(first)) return null;
 	return {
 		source: match[0].trimEnd(),
 		yaml: match[1],
@@ -229,4 +263,4 @@ function loomaCodeFence(code) {
 	return "`".repeat(Math.max(3, longest + 1));
 }
 //#endregion
-export { LOOMA_BADGE_TONES, LOOMA_CALLOUT_TONES, LOOMA_CALLOUT_TONE_ALIASES, LOOMA_CHIP_TONES, LOOMA_CONTAINER_NAMES, LOOMA_MEANING_TONES, assignLoomaHeadingIds, formatLoomaAttributes, loomaCodeFence, loomaContainerMarker, loomaHeadingSlug, normalizeLoomaCalloutTone, normalizeLoomaChipTone, parseLoomaAttributes, parseLoomaFenceInfo, readLoomaAttributes, splitLoomaFrontmatter };
+export { LOOMA_BADGE_TONES, LOOMA_CALLOUT_TONES, LOOMA_CALLOUT_TONE_ALIASES, LOOMA_CHIP_TONES, LOOMA_CONTAINER_NAMES, LOOMA_MEANING_TONES, applyLoomaCodeNotation, assignLoomaHeadingIds, formatLoomaAttributes, loomaCodeFence, loomaContainerMarker, loomaHeadingSlug, normalizeLoomaCalloutTone, normalizeLoomaChipTone, parseLoomaAttributes, parseLoomaFenceInfo, readLoomaAttributes, splitLoomaFrontmatter };

package/markdown/markdown-it.d.ts

@@ -1,13 +1,21 @@
 import MarkdownIt from "markdown-it";
+/** How a Looma Markdown instance renders. */
+export interface LoomaMarkdownOptions {
+    /**
+     * `apply` (default) renders code as a reader sees it, without its `[!code highlight]` comments;
+     * `keep` keeps them in the code, for an editor that edits the source.
+     */
+    codeNotation?: "apply" | "keep";
+}
 /**
  * Adds Looma Markdown to a markdown-it instance: containers, alerts, task lists, 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.
  */
-export declare function loomaMarkdown(md: MarkdownIt): void;
+export declare function loomaMarkdown(md: MarkdownIt, { codeNotation }?: LoomaMarkdownOptions): void;
 /**
  * A markdown-it instance for Looma Markdown: raw HTML and GFM autolinks on, with `loomaMarkdown`.
  * @contract Each call returns a new instance that callers may extend.
  */
-export declare function createLoomaMarkdownIt(): MarkdownIt;
+export declare function createLoomaMarkdownIt(options?: LoomaMarkdownOptions): MarkdownIt;

package/markdown/markdown-it.js

@@ -1,4 +1,4 @@
-import { LOOMA_CONTAINER_NAMES, assignLoomaHeadingIds, normalizeLoomaCalloutTone, normalizeLoomaChipTone, parseLoomaAttributes, parseLoomaFenceInfo, readLoomaAttributes, splitLoomaFrontmatter } from "./index.js";
+import { LOOMA_CONTAINER_NAMES, applyLoomaCodeNotation, assignLoomaHeadingIds, normalizeLoomaCalloutTone, normalizeLoomaChipTone, parseLoomaAttributes, parseLoomaFenceInfo, readLoomaAttributes, splitLoomaFrontmatter } from "./index.js";
 import MarkdownIt from "markdown-it";
 //#region src/markdown/markdown-it.ts
 var CONTAINER_OPEN = /^(:{3,})[ \t]*([A-Za-z][\w-]*)(?:[ \t]+(.*?))?[ \t]*$/;
@@ -200,7 +200,10 @@ function taskLists(state) {
 			inline.content = inline.content.replace(TASK, "");
 			item.attrSet("data-type", "taskItem");
 			item.attrSet("data-checked", String(checked));
-			item.meta = { checked };
+			inline.meta = {
+				...inline.meta,
+				task: checked
+			};
 		}
 	}
 }
@@ -242,6 +245,11 @@ function attributes(state) {
 		const token = tokens[index];
 		if (token.type !== "inline" || !token.children) continue;
 		const children = token.children;
+		if (typeof token.meta?.task === "boolean") {
+			const html = (content) => Object.assign(new state.Token("html_inline", "", 0), { content });
+			children.unshift(html(`<label><input type="checkbox" disabled=""${token.meta.task ? " checked=\"\"" : ""}> `));
+			children.push(html("</label>"));
+		}
 		for (let child = children.length - 3; child >= 0; child--) {
 			const text = children[child + 1];
 			if (children[child].type !== "link_open" || children[child].markup !== "linkify" || /^(?:[a-z][\w+.-]*:|www\.)/i.test(text.content)) continue;
@@ -318,7 +326,7 @@ function tableOfContents(tokens, format, depth, escape) {
 * @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.
 */
-function loomaMarkdown(md) {
+function loomaMarkdown(md, { codeNotation = "apply" } = {}) {
 	const escape = md.utils.escapeHtml;
 	md.block.ruler.before("table", "looma_frontmatter", frontmatter);
 	md.block.ruler.before("fence", "looma_container", container, { alt: [
@@ -369,15 +377,10 @@ function loomaMarkdown(md) {
 		const id = String(attributes.id);
 		return `<span data-type="mention" class="looma-mention" data-id="${escape(id)}" data-label="${escape(label || id)}">@${escape(label || id)}</span>`;
 	};
-	const listItem = rules.list_item_open ?? ((tokens, index, options, _env, self) => self.renderToken(tokens, index, options));
-	rules.list_item_open = (tokens, index, options, env, self) => {
-		const html = listItem(tokens, index, options, env, self);
-		const task = tokens[index].meta;
-		return task && typeof task.checked === "boolean" ? `${html}<input type="checkbox" disabled=""${task.checked ? " checked=\"\"" : ""}>` : html;
-	};
 	const code = (content, info) => {
 		const { language, meta } = parseLoomaFenceInfo(info);
-		return `<pre><code${language ? ` class="language-${escape(language)}"` : ""}${meta ? ` data-meta="${escape(meta)}"` : ""}>${escape(content.replace(/\n$/, ""))}</code></pre>\n`;
+		const source = content.replace(/\n$/, "");
+		return `<pre><code${language ? ` class="language-${escape(language)}"` : ""}${meta ? ` data-meta="${escape(meta)}"` : ""}>${escape(codeNotation === "keep" ? source : applyLoomaCodeNotation(source).code)}</code></pre>\n`;
 	};
 	rules.fence = (tokens, index) => code(tokens[index].content, tokens[index].info);
 	rules.code_block = (tokens, index) => code(tokens[index].content, "");
@@ -386,12 +389,12 @@ function loomaMarkdown(md) {
 * A markdown-it instance for Looma Markdown: raw HTML and GFM autolinks on, with `loomaMarkdown`.
 * @contract Each call returns a new instance that callers may extend.
 */
-function createLoomaMarkdownIt() {
+function createLoomaMarkdownIt(options = {}) {
 	return new MarkdownIt({
 		html: true,
 		linkify: true,
 		typographer: false
-	}).use(loomaMarkdown);
+	}).use(loomaMarkdown, options);
 }
 //#endregion
 export { createLoomaMarkdownIt, loomaMarkdown };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@threadlabs/looma",
-  "version": "0.28.17",
+  "version": "0.28.19",
   "type": "module",
   "description": "Looma components as HTML, Vue, and plain DOM, with design tokens.",
   "license": "MIT",
@@ -171,6 +171,7 @@
     "@tiptap/vue-3": "^2.11.5",
     "@types/markdown-it": "14.2.0",
     "@vitest/browser": "~3.2.6",
+    "axe-core": "^4.10.3",
     "jsdom": "^27.0.0"
   },
   "engines": {