wiki-viewer 1.0.0 → 1.1.0

package/.next/standalone/src/components/wiki/markdown-preview.tsx

@@ -0,0 +1,120 @@
+"use client";
+
+import { useCallback, useEffect, useRef, useState } from "react";
+import { markdownToHtml } from "@/lib/markdown/to-html";
+import { useWikiSlugsStore } from "@/stores/wiki-slugs-store";
+
+interface MarkdownPreviewProps {
+	markdown: string;
+	pagePath: string;
+	onNavigate: (targetPath: string, anchor: string | null) => void;
+}
+
+export function MarkdownPreview({
+	markdown,
+	pagePath,
+	onNavigate,
+}: MarkdownPreviewProps) {
+	const [html, setHtml] = useState<string>("");
+	const containerRef = useRef<HTMLDivElement>(null);
+
+	// Recompute HTML whenever markdown or pagePath changes.
+	useEffect(() => {
+		let cancelled = false;
+		markdownToHtml(markdown, { pagePath, sanitize: true }).then((result) => {
+			if (!cancelled) setHtml(result);
+		});
+		return () => {
+			cancelled = true;
+		};
+	}, [markdown, pagePath]);
+
+	// Delegated click handler: wiki-links navigate; external links get _blank.
+	const handleClick = useCallback(
+		(e: MouseEvent) => {
+			const link = (e.target as HTMLElement).closest(
+				"a",
+			) as HTMLAnchorElement | null;
+			if (!link) return;
+
+			if (link.dataset.wikiLink === "true") {
+				e.preventDefault();
+				const slug = link.dataset.slug ?? "";
+				if (!slug) return;
+				const dir = useWikiSlugsStore.getState().getDir(slug);
+				if (!dir) return; // broken link - no nav
+				const targetPath =
+					dir === "root" ? `${slug}.md` : `${dir}/${slug}.md`;
+				const anchor = link.dataset.anchor ?? null;
+				onNavigate(targetPath, anchor);
+				return;
+			}
+
+			// External links: ensure _blank + noreferrer.
+			const href = link.getAttribute("href") ?? "";
+			if (/^https?:\/\//.test(href)) {
+				if (!link.target) {
+					link.setAttribute("target", "_blank");
+					link.setAttribute("rel", "noreferrer");
+				}
+				return;
+			}
+
+			// Anchor-only hrefs: let browser scroll natively.
+		},
+		[onNavigate],
+	);
+
+	// Attach and detach click handler whenever html or handler changes.
+	useEffect(() => {
+		const el = containerRef.current;
+		if (!el) return;
+		// Set _blank on external links at bind time so they work without JS.
+		el.querySelectorAll<HTMLAnchorElement>("a[href^='http']").forEach((a) => {
+			if (!a.target) {
+				a.setAttribute("target", "_blank");
+				a.setAttribute("rel", "noreferrer");
+			}
+		});
+		el.addEventListener("click", handleClick);
+		return () => el.removeEventListener("click", handleClick);
+	}, [html, handleClick]);
+
+	// Apply broken-link styling after render and whenever slug store updates.
+	const slugsLoadedAt = useWikiSlugsStore((s) => s.loadedAt);
+	useEffect(() => {
+		const el = containerRef.current;
+		if (!el) return;
+		const store = useWikiSlugsStore.getState();
+		el.querySelectorAll<HTMLAnchorElement>(
+			'a[data-wiki-link="true"]',
+		).forEach((link) => {
+			const slug = link.dataset.slug ?? "";
+			if (slug && !store.has(slug)) {
+				link.dataset.broken = "true";
+			} else {
+				delete link.dataset.broken;
+			}
+		});
+	}, [html, slugsLoadedAt]);
+
+	// Disable task-list checkboxes in read-only viewer.
+	useEffect(() => {
+		const el = containerRef.current;
+		if (!el) return;
+		el.querySelectorAll<HTMLInputElement>(
+			'input[type="checkbox"]',
+		).forEach((input) => {
+			input.disabled = true;
+		});
+	}, [html]);
+
+	return (
+		<div
+			ref={containerRef}
+			className="tiptap md-preview"
+			// biome-ignore lint/security/noDangerouslySetInnerHtml: HTML is sanitized by rehype-sanitize
+			dangerouslySetInnerHTML={{ __html: html }}
+		/>
+	);
+}

package/.next/standalone/src/lib/auth/allowlist.ts

@@ -0,0 +1,50 @@
+/**
+ * Email allowlist check.
+ *
+ * Source of truth is ~/.wiki-viewer/config.json (allowedEmails / allowedDomains),
+ * editable at runtime via the UI. Env vars AUTH_ALLOWED_EMAILS and
+ * AUTH_ALLOWED_DOMAIN act as a fallback seed when config is empty, so existing
+ * deployments keep working without a config file.
+ *
+ * If neither config nor env sets any restriction, all emails are allowed.
+ */
+import { readConfig } from "@/lib/config";
+
+function splitList(raw: string | undefined): string[] {
+	return (raw ?? "")
+		.split(",")
+		.map((s) => s.trim().toLowerCase())
+		.filter(Boolean);
+}
+
+/** Resolve the effective allowlist: config wins, env is the fallback. */
+export async function getAllowlist(): Promise<{
+	emails: string[];
+	domains: string[];
+}> {
+	const config = await readConfig();
+	const emails =
+		config.allowedEmails && config.allowedEmails.length > 0
+			? config.allowedEmails.map((s) => s.trim().toLowerCase()).filter(Boolean)
+			: splitList(process.env.AUTH_ALLOWED_EMAILS);
+	const domains =
+		config.allowedDomains && config.allowedDomains.length > 0
+			? config.allowedDomains.map((s) => s.trim().toLowerCase()).filter(Boolean)
+			: splitList(process.env.AUTH_ALLOWED_DOMAIN);
+	return { emails, domains };
+}
+
+export async function isEmailAllowed(email: string): Promise<boolean> {
+	const { emails, domains } = await getAllowlist();
+
+	// No restrictions set — allow all
+	if (emails.length === 0 && domains.length === 0) return true;
+
+	const e = email.toLowerCase();
+	if (emails.includes(e)) return true;
+
+	const at = e.lastIndexOf("@");
+	if (at >= 0 && domains.includes(e.slice(at + 1))) return true;
+
+	return false;
+}

package/.next/standalone/src/lib/auth/client.ts

@@ -0,0 +1,4 @@
+"use client";
+import { createAuthClient } from "better-auth/react";
+
+export const authClient = createAuthClient();

package/.next/standalone/src/lib/auth/csrf.ts

@@ -0,0 +1,68 @@
+import { NextResponse } from "next/server";
+
+/**
+ * Reject cross-origin state-changing requests that arrive with a session cookie.
+ * Bearer-only requests (no Origin/Referer) pass through — they are authenticated
+ * separately and are not vulnerable to CSRF.
+ *
+ * Returns null if the request may proceed, or a NextResponse(403) to return.
+ *
+ * Call at the top of every POST/PUT/DELETE/PATCH handler in /api/wiki/* and
+ * /api/system/* before requireUser.
+ */
+export function checkOrigin(req: Request): NextResponse | null {
+	const method = req.method.toUpperCase();
+	if (method === "GET" || method === "HEAD" || method === "OPTIONS") return null;
+
+	// Bearer-auth agents typically omit Origin/Referer — let checkAuth handle them.
+	const origin = req.headers.get("origin");
+	const referer = req.headers.get("referer");
+	if (!origin && !referer) return null;
+
+	const allowed = buildAllowedOrigins(req.headers.get("host") ?? "");
+
+	if (origin) {
+		if (allowed.has(origin)) return null;
+		return NextResponse.json(
+			{ error: "FORBIDDEN", message: "Bad origin" },
+			{ status: 403 },
+		);
+	}
+
+	if (referer) {
+		try {
+			const { protocol, host } = new URL(referer);
+			if (allowed.has(`${protocol}//${host}`)) return null;
+		} catch {
+			// malformed Referer — reject
+		}
+		return NextResponse.json(
+			{ error: "FORBIDDEN", message: "Bad referer" },
+			{ status: 403 },
+		);
+	}
+
+	return null;
+}
+
+function buildAllowedOrigins(hostHeader: string): Set<string> {
+	const hostname = hostHeader.split(":")[0];
+	const extra = (process.env.WIKI_OWNER_HOSTS ?? "")
+		.split(",")
+		.map((h) => h.trim())
+		.filter(Boolean);
+
+	const hosts = Array.from(new Set(["localhost", "127.0.0.1", hostname, ...extra]));
+	const ports = ["", ":3000", ":3003"];
+	if (hostHeader.includes(":")) ports.push(":" + hostHeader.split(":")[1]);
+
+	const allowed = new Set<string>();
+	for (const h of hosts) {
+		for (const proto of ["http", "https"]) {
+			for (const port of ports) {
+				allowed.add(`${proto}://${h}${port}`);
+			}
+		}
+	}
+	return allowed;
+}

package/.next/standalone/src/lib/auth/server.ts

@@ -0,0 +1,164 @@
+/**
+ * Better Auth server instance.
+ * Supports: email+password, Google OAuth (optional).
+ * DB: SQLite at ~/.wiki-viewer/auth.db (WAL mode).
+ */
+import { betterAuth } from "better-auth";
+import { nextCookies } from "better-auth/next-js";
+import Database from "better-sqlite3";
+import path from "node:path";
+import os from "node:os";
+import { mkdirSync, readFileSync, writeFileSync, existsSync, chmodSync } from "node:fs";
+import { randomBytes } from "node:crypto";
+import { isEmailAllowed } from "./allowlist";
+
+// Guard runs at server startup, not during next build (NEXT_PHASE=phase-production-build).
+// Set WIKI_ALLOW_INSECURE=1 to bypass the https requirement (development / CI / smoke tests).
+if (
+	process.env.NODE_ENV === "production" &&
+	process.env.NEXT_PHASE !== "phase-production-build" &&
+	process.env.WIKI_ALLOW_INSECURE !== "1"
+) {
+	const url = process.env.BETTER_AUTH_URL ?? "";
+	if (!url) {
+		throw new Error(
+			"BETTER_AUTH_URL is required in production. Set it to https://your-domain so cookies and OAuth callbacks resolve correctly. Set WIKI_ALLOW_INSECURE=1 to bypass (development only).",
+		);
+	}
+	if (!url.startsWith("https://")) {
+		throw new Error(
+			`BETTER_AUTH_URL must be https:// in production (got: ${url}). Set WIKI_ALLOW_INSECURE=1 to bypass (development only).`,
+		);
+	}
+}
+
+const DATA_DIR = path.join(process.env.HOME ?? os.homedir(), ".wiki-viewer");
+mkdirSync(DATA_DIR, { recursive: true });
+const DB_PATH = path.join(DATA_DIR, "auth.db");
+const SECRET_PATH = path.join(DATA_DIR, "auth.secret");
+
+function resolveSecret(): string {
+	if (process.env.BETTER_AUTH_SECRET) return process.env.BETTER_AUTH_SECRET;
+	if (existsSync(SECRET_PATH)) {
+		return readFileSync(SECRET_PATH, "utf-8").trim();
+	}
+	const fresh = randomBytes(32).toString("base64");
+	writeFileSync(SECRET_PATH, fresh, { mode: 0o600 });
+	try {
+		chmodSync(SECRET_PATH, 0o600);
+	} catch {
+		// chmod best-effort on platforms that support it
+	}
+	return fresh;
+}
+
+const db = new Database(DB_PATH);
+db.pragma("journal_mode = WAL");
+
+function getTrustedOrigins(): string[] {
+	const extra = (process.env.WIKI_OWNER_HOSTS ?? "")
+		.split(",")
+		.map((h) => h.trim())
+		.filter(Boolean);
+	const ports = ["", ":3000", ":3003"];
+	const base = ["http://localhost:3000", "http://localhost:3003"];
+	const extras = extra.flatMap((h) =>
+		ports.flatMap((p) => [`http://${h}${p}`, `https://${h}${p}`]),
+	);
+	return Array.from(new Set([...base, ...extras]));
+}
+
+const socialProviders: Record<string, unknown> = {};
+if (process.env.GOOGLE_CLIENT_ID && process.env.GOOGLE_CLIENT_SECRET) {
+	socialProviders.google = {
+		clientId: process.env.GOOGLE_CLIENT_ID,
+		clientSecret: process.env.GOOGLE_CLIENT_SECRET,
+	};
+}
+
+export const auth = betterAuth({
+	database: db,
+	secret: resolveSecret(),
+	baseURL: process.env.BETTER_AUTH_URL,
+	emailAndPassword: {
+		enabled: true,
+		requireEmailVerification: false,
+		autoSignIn: true,
+	},
+	// Loosen Better Auth's default 3-per-10-seconds limit on /sign-in/email
+	// so a single bad password doesn't lock the user out for the window.
+	// Per-user lockout is not implemented (Better Auth rate-limits by IP).
+	rateLimit: {
+		enabled: process.env.NODE_ENV === "production",
+		window: 60,
+		max: 100,
+		customRules: {
+			"/sign-in/email": { window: 60, max: 20 },
+			"/sign-up/email": { window: 60, max: 10 },
+		},
+	},
+	socialProviders,
+	databaseHooks: {
+		user: {
+			create: {
+				before: async (user: { email: string }) => {
+					if (!(await isEmailAllowed(user.email))) {
+						throw new Error("SIGNUP_NOT_ALLOWED");
+					}
+					return { data: user };
+				},
+			},
+		},
+	},
+	plugins: [nextCookies()],
+	trustedOrigins: getTrustedOrigins(),
+});
+
+// Auto-migrate tables on first import. Idempotent: re-runs are no-ops once schema matches.
+// Exposed as a Promise so consumers can await readiness before issuing auth calls.
+const MIGRATED_PROMISE_KEY = Symbol.for("wiki-viewer.better-auth.migration-promise");
+interface GlobalWithPromise {
+	[k: symbol]: Promise<void> | undefined;
+}
+const g = globalThis as unknown as GlobalWithPromise;
+if (!g[MIGRATED_PROMISE_KEY]) {
+	g[MIGRATED_PROMISE_KEY] = (async () => {
+		const mod = (await import("better-auth/db/migration")) as {
+			getMigrations: (opts: unknown) => Promise<{ runMigrations: () => Promise<void> }>;
+		};
+		const { runMigrations } = await mod.getMigrations(
+			(auth as unknown as { options: unknown }).options,
+		);
+		await runMigrations();
+	})();
+}
+
+/** Await this in tests / one-shot scripts before calling auth.api.*. */
+export function authReady(): Promise<void> {
+	return g[MIGRATED_PROMISE_KEY] ?? Promise.resolve();
+}
+
+export interface SessionUser {
+	id: string;
+	email: string;
+	name: string;
+}
+
+export async function getSessionFromRequest(req: Request) {
+	return auth.api.getSession({ headers: req.headers });
+}
+
+export async function requireUser(
+	req: Request,
+): Promise<{ ok: true; user: SessionUser } | { ok: false }> {
+	const session = await getSessionFromRequest(req);
+	if (!session?.user) return { ok: false };
+	return {
+		ok: true,
+		user: {
+			id: session.user.id,
+			email: session.user.email,
+			name: session.user.name,
+		},
+	};
+}

package/.next/standalone/src/lib/config.ts

@@ -5,6 +5,10 @@ import path from "node:path";
 interface WikiViewerConfig {
 	pinnedPaths?: string[];
 	lastOpenedPath?: string;
+	/** Email allowlist for signup. Empty/undefined = no email restriction. */
+	allowedEmails?: string[];
+	/** Domain allowlist for signup. Empty/undefined = no domain restriction. */
+	allowedDomains?: string[];
 }
 
 function configPath() {

package/.next/standalone/src/lib/markdown/parse-frontmatter.ts

@@ -41,6 +41,19 @@ export function parseFrontmatter(text: string): ParsedFrontmatter {
 
 	const block = match[1];
 	const body = text.slice(match[0].length);
+
+	// Guard against runaway capture. BLOCK_RE matches from the opening `---`
+	// to the FIRST `\n---\n`, which may be a markdown horizontal rule far down
+	// the document rather than a real closing fence. If the block does not look
+	// like YAML (a markdown heading or HTML on the first non-empty line, or a
+	// blank line gap typical of body content), bail out and treat the whole
+	// text as body so the document still renders.
+	const blockLines = block.split(/\r?\n/);
+	const firstContent = blockLines.find((l) => l.trim() !== "") ?? "";
+	if (/^\s*(#{1,6}\s|<|>|-\s|\*\s|\d+\.\s)/.test(firstContent)) {
+		return { data: {}, body: text };
+	}
+
 	const data: Record<string, unknown> = {};
 
 	const lines = block.split(/\r?\n/);
@@ -80,5 +93,12 @@ export function parseFrontmatter(text: string): ParsedFrontmatter {
 		i += 1;
 	}
 
+	// A valid frontmatter block always yields at least one key. Zero keys means
+	// BLOCK_RE consumed body content up to a stray `---` (e.g. a horizontal
+	// rule). Reject so the body is not swallowed.
+	if (Object.keys(data).length === 0) {
+		return { data: {}, body: text };
+	}
+
 	return { data, body };
 }

package/.next/standalone/src/lib/markdown/sanitize-schema.ts

@@ -0,0 +1,106 @@
+import { defaultSchema } from "rehype-sanitize";
+import type { Options as SanitizeOptions } from "rehype-sanitize";
+
+/**
+ * Sanitize schema for the read-only markdown preview.
+ *
+ * The base `defaultSchema` from rehype-sanitize strips most attributes and
+ * many elements. Wiki content legitimately embeds raw HTML: tables, task-list
+ * checkboxes, and video/embed iframes produced by the shared pipeline.
+ * Extend the schema so that markup renders instead of being escaped to literal
+ * text, while still removing scripts, event handlers, and other dangerous
+ * vectors that defaultSchema blocks.
+ */
+const tableTags = ["table", "thead", "tbody", "tfoot", "tr", "th", "td", "colgroup", "col"];
+
+export const previewSanitizeSchema: SanitizeOptions = {
+	...defaultSchema,
+	tagNames: Array.from(
+		new Set([
+			...(defaultSchema.tagNames ?? []),
+			...tableTags,
+			// Task-list structure emitted by fixTaskListHtml.
+			"label",
+			// Embed wrapper divs and iframes from upgradeProviderVideos.
+			"iframe",
+			"video",
+		]),
+	),
+	attributes: {
+		...defaultSchema.attributes,
+		// Allow layout attributes on table elements.
+		table: [...(defaultSchema.attributes?.table ?? []), "className", "style"],
+		th: [
+			...(defaultSchema.attributes?.th ?? []),
+			"colSpan",
+			"rowSpan",
+			"style",
+			"className",
+		],
+		td: [
+			...(defaultSchema.attributes?.td ?? []),
+			"colSpan",
+			"rowSpan",
+			"style",
+			"className",
+		],
+		col: ["span", "style", "className"],
+		colgroup: ["span", "style", "className"],
+		tr: ["style", "className"],
+		// Preserve wiki-link data attributes used by the delegated click handler.
+		// rehype-sanitize uses hast property names (camelCase) in the attributes map.
+		// Plain string = allow any value; tuple [name, val1, val2] = allow only those values.
+		a: [
+			...(defaultSchema.attributes?.a ?? []),
+			"className",
+			["dataWikiLink", "true"],
+			"dataSlug",
+			"dataAlias",
+			"dataAnchor",
+			["dataBroken", "true"],
+			["dataPdfLink", "true"],
+		],
+		// Task-list input/label.
+		input: ["type", "checked", "disabled"],
+		label: ["className"],
+		// Embed iframes - allow all attrs used by upgradeProviderVideos.
+		iframe: [
+			"src",
+			"allow",
+			"allowFullScreen",
+			"frameBorder",
+			"loading",
+			"referrerPolicy",
+			"dataEmbedProvider",
+		],
+		// Embed wrapper divs.
+		div: [
+			...(defaultSchema.attributes?.div ?? []),
+			"className",
+			["dataEmbed", "true"],
+			"dataProvider",
+			"dataSrc",
+			"dataOriginalUrl",
+			"dataAspectRatio",
+		],
+		// Task-list list items.
+		li: [
+			...(defaultSchema.attributes?.li ?? []),
+			"className",
+			"dataType",
+			"dataChecked",
+		],
+		ul: [
+			...(defaultSchema.attributes?.ul ?? []),
+			"className",
+			"dataType",
+		],
+		// Allow class names + id on all elements for styling.
+		"*": [...(defaultSchema.attributes?.["*"] ?? []), "className", "id"],
+	},
+	// Allow https iframe src (for embed providers). http excluded intentionally.
+	protocols: {
+		...defaultSchema.protocols,
+		src: [...(defaultSchema.protocols?.src ?? []), "https"],
+	},
+};

package/.next/standalone/src/lib/markdown/to-html.ts

@@ -1,9 +1,13 @@
+import rehypeParse from "rehype-parse";
+import rehypeRaw from "rehype-raw";
+import rehypeSanitize from "rehype-sanitize";
 import rehypeStringify from "rehype-stringify";
 import remarkGfm from "remark-gfm";
 import remarkParse from "remark-parse";
 import remarkRehype from "remark-rehype";
 import { unified } from "unified";
 import { detectEmbed } from "@/lib/embeds/detect";
+import { previewSanitizeSchema } from "@/lib/markdown/sanitize-schema";
 
 // Canonical wiki-link regex (llm-wiki-pm ground truth).
 // Groups: 1=slug  2=alias  3=anchor
@@ -133,8 +137,11 @@ function resolveRelativeUrls(html: string, pagePath: string): string {
 }
 
 // Unified's plugin resolution + processor freeze runs on every `unified()`
-// call. Reuse a single frozen pipeline across every page render so
+// call. Reuse single frozen pipelines across every page render so
 // navigation doesn't pay that cost on the hot path.
+
+// Base pipeline: produces HTML with raw nodes passed through as-is.
+// Used for both editor and (pre-sanitize) viewer passes.
 const processor = unified()
 	.use(remarkParse)
 	.use(remarkGfm)
@@ -142,26 +149,57 @@ const processor = unified()
 	.use(rehypeStringify, { allowDangerousHtml: true })
 	.freeze();
 
+// Sanitize-only pipeline: takes a fully assembled HTML string, parses it back
+// into hast (rehype-parse as a fragment), expands any raw nodes (rehype-raw),
+// then strips unsafe nodes (rehype-sanitize). Runs LAST so all string
+// post-processing is covered by sanitize.
+const sanitizerOnly = unified()
+	.use(rehypeParse, { fragment: true })
+	.use(rehypeRaw)
+	.use(rehypeSanitize, previewSanitizeSchema)
+	.use(rehypeStringify)
+	.freeze();
+
+export interface MarkdownToHtmlOptions {
+	/** File path used to resolve relative URLs (./image.png etc.). */
+	pagePath?: string;
+	/** Run rehype-sanitize on output. Use true for read-only viewer. Default false. */
+	sanitize?: boolean;
+}
+
 export async function markdownToHtml(
 	markdown: string,
-	pagePath?: string,
+	optsOrPagePath?: string | MarkdownToHtmlOptions,
 ): Promise<string> {
+	const opts: MarkdownToHtmlOptions =
+		typeof optsOrPagePath === "string"
+			? { pagePath: optsOrPagePath }
+			: (optsOrPagePath ?? {});
+
 	// Pre-process wiki-links before remark (which would treat [[ as text)
 	const preprocessed = convertWikiLinks(markdown);
 
+	// Always use the base pipeline first.
 	const result = await processor.process(preprocessed);
-
 	let html = String(result);
 
-	// Post-process task lists for Tiptap compatibility
+	// Post-process task lists for Tiptap compatibility.
 	html = fixTaskListHtml(html);
 
-	// Heal <video src="youtube-url"> into real iframe embeds
+	// Heal <video src="youtube-url"> into real iframe embeds.
+	// Must run before sanitize so <video src> attr is still present.
 	html = upgradeProviderVideos(html);
 
-	// Resolve relative URLs if page path is provided
-	if (pagePath) {
-		html = resolveRelativeUrls(html, pagePath);
+	// Resolve relative URLs if page path is provided.
+	// Must run before sanitize so interpolated paths are covered.
+	if (opts.pagePath) {
+		html = resolveRelativeUrls(html, opts.pagePath);
+	}
+
+	// Sanitize last, after all string post-processing, so no injected
+	// content escapes the sanitizer.
+	if (opts.sanitize) {
+		html = String(await sanitizerOnly.process(html));
 	}
 
 	return html;

package/.next/standalone/src/lib/markdown/to-markdown.ts

@@ -49,6 +49,20 @@ turndown.addRule("wikiLink", {
 	},
 });
 
+// Preserve <proof-span> provenance marks — must run before styledSpan so the
+// custom tag is matched first. DOM uppercases custom tag names, so check PROOF-SPAN.
+turndown.addRule("proofSpan", {
+	filter: (node) => node.nodeName === "PROOF-SPAN",
+	replacement: (content, node) => {
+		const el = node as HTMLElement;
+		const attrs: string[] = [];
+		for (const a of Array.from(el.attributes)) {
+			attrs.push(`${a.name}="${a.value.replace(/"/g, "&quot;")}"`);
+		}
+		return `<proof-span${attrs.length ? " " + attrs.join(" ") : ""}>${content}</proof-span>`;
+	},
+});
+
 // Preserve inline styled spans (text color, background color, font weight, etc.)
 // so colors and highlights survive markdown roundtrip.
 turndown.addRule("styledSpan", {