@gavin-hu/my-pi-agent 0.14.0 → 0.15.0

package/extensions/file-browse/html.ts

@@ -12,6 +12,8 @@ import { GLYPHS } from "../../lib/tui/glyphs.ts";
 import {
 	brandLockup,
 	docHead,
+	type KeyHint,
+	keysSheet,
 	SIDEBAR_COLLAPSE_MAX,
 	WEB_BASE_CSS,
 	WEB_COMPONENTS_CSS,
@@ -24,7 +26,7 @@ import { DIFF_MODES, statusLetter, type ChangedFile, type DiffLine, type DiffMod
 import type { DiffFileView, GitStatus } from "./git.ts";
 import { detectLanguage, highlightLines, type HighlightLanguage } from "../../lib/highlight.ts";
 import { FOLDER_ICON, iconHref, languageOf, SPRITE, type IconSpec } from "./icons.ts";
-import { renderMarkdownDocument, type MarkdownHeading } from "./markdown.ts";
+import { renderMarkdown } from "./markdown.ts";
 import { encodePath } from "./paths.ts";
 
 const MONTHS = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
@@ -101,6 +103,9 @@ ${WEB_COMPONENTS_CSS}
 .browse-quick-open{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);width:100%;margin-bottom:var(--space-2);padding:6px var(--space-2);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--canvas);color:var(--muted);font:var(--fs-sm) var(--font-ui);cursor:pointer}
 .browse-quick-open:hover{border-color:var(--accent);color:var(--accent)}
 .browse-quick-open kbd{font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--dim)}
+.browse-side__filters{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-2)}
+.browse-side__filters .bf-field{flex:1 1 auto;min-width:0}
+.browse-side__filters .bf-btn{flex:0 0 auto;white-space:nowrap}
 .browse-cat{width:16px;height:16px;flex:0 0 16px;color:var(--accent)}
 .browse-cat.doc{color:var(--muted)}.browse-cat.img{color:var(--success)}.browse-cat.cfg{color:var(--warn)}.browse-cat.arc{color:var(--warn)}
 .browse-heading{margin:0 0 var(--space-3);font-size:var(--fs-lg)}
@@ -111,13 +116,6 @@ ${WEB_COMPONENTS_CSS}
 .browse-broken{color:var(--muted);text-decoration:line-through}
 .browse-link-mark{color:var(--muted);font-size:var(--fs-xs)}
 .browse-when{display:none}
-.browse-md-outline{max-width:80ch;margin:0 0 var(--space-3) var(--space-4);border:1px solid var(--border);border-radius:var(--radius-md);font-size:var(--fs-sm)}
-.browse-md-outline>summary{padding:var(--space-2) var(--space-3);cursor:pointer;color:var(--muted);font-family:var(--font-mono);font-size:var(--fs-xs)}
-.browse-md-outline ul{list-style:none;margin:0;padding:0 var(--space-3) var(--space-2)}
-.browse-md-outline a{display:block;padding:2px 0}
-.browse-md-outline a.lvl1{padding-left:var(--space-3)}
-.browse-md-outline a.lvl2{padding-left:var(--space-5)}
-.browse-md-outline a.lvl3{padding-left:var(--space-7)}
 body.palette-open{overflow:hidden}
 .browse-diff{font-family:var(--font-mono);gap:5px}
 .browse-diff:hover{color:var(--accent);text-decoration:none}
@@ -156,20 +154,27 @@ body.palette-open{overflow:hidden}
 .browse-progress{position:absolute;left:0;right:0;bottom:-1px;height:2px;overflow:hidden}
 .browse-progress__fill{display:block;height:100%;width:0;background:var(--accent);transition:width var(--motion-fast) linear}
 /* File and diff pages: a measured reading column inside the card. */
-/* GitHub's markdown body width: one content column that headings, prose,
-   tables, code, and images all live in, with wide tables scrolling inside it. */
+/* The Markdown body fills the card, so the scroll box is the card's width: its
+   scrollbar sits at the card edge. The measure lives on the blocks themselves:
+   on .bf-md it would be a flex item with auto inline margins, which is
+   shrink-to-fit, so a short document collapsed to its widest line. */
 .browse-measure{--browse-measure:1012px}
-.browse-measure .bf-md{max-width:var(--browse-measure);margin-inline:auto;padding-inline:0;padding-block:var(--space-4) var(--space-6)}
-.browse-measure .browse-md-outline{max-width:var(--browse-measure);margin:0 auto var(--space-3)}
+.browse-measure .bf-md{--browse-gutter:max(0px,calc((100% - var(--browse-measure)) / 2));max-width:none;margin-inline:0;padding-inline:var(--space-5);padding-block:var(--space-4) var(--space-6)}
+.browse-measure .bf-md>*{max-width:var(--browse-measure);margin-inline:auto}
+/* Tables start at the prose column and take only the gutter to its right, so a
+   wide window widens them without a dead band on their left. Code stays inside
+   the measure with the rest of the prose. */
+.browse-measure .bf-md>.md-table-frame{max-width:none;padding-left:var(--browse-gutter)}
+/* A table wider than the pane scrolls, but an overlay scrollbar is invisible
+   until it moves; a gradient on the frame marks the columns still out of view.
+   It has to be the frame: the scroller clips its own content, so a pseudo-element
+   inside it would scroll away with the table. */
+.browse-measure .bf-md>.md-table-frame.browse-table-more::after{content:"";position:absolute;top:0;right:0;bottom:0;width:40px;pointer-events:none;background:linear-gradient(to left,var(--surface) 12%,transparent)}
 .bf-card__meta{font-variant-numeric:tabular-nums}
 .browse-diff-summary{font-family:var(--font-mono);white-space:nowrap}
 .browse-diff-summary .browse-diff-add{color:var(--success)}
 .browse-diff-summary .browse-diff-del{color:var(--danger)}
 .browse-hunks{color:var(--muted)}
-.browse-keys{display:grid;grid-template-columns:auto 1fr;gap:8px var(--space-4);margin:0;padding:var(--space-4)}
-.browse-keys dt{white-space:nowrap}
-.browse-keys dd{margin:0;color:var(--muted);font-size:var(--fs-sm)}
-.browse-kbd{display:inline-block;min-width:20px;padding:1px 6px;border:1px solid var(--border);border-bottom-width:2px;border-radius:var(--radius-sm);background:var(--surface);color:var(--text);font:var(--fs-xs) var(--font-mono);text-align:center}
 /* Wide screens: pin quick open and the filter, and scroll the tree on its own
    box. The sidebar is a details element, whose content sits in an anonymous
    wrapper with no definite height, so the panel fills the sidebar by absolute
@@ -187,12 +192,6 @@ body.palette-open{overflow:hidden}
 .bf-toolbar .bf-theme-toggle{margin-left:auto}
 }`;
 
-/** One row of the keyboard sheet: the key or chord, and what it does. */
-export interface KeyHint {
-	keys: string;
-	label: string;
-}
-
 interface Layout {
 	title: string;
 	rootLabel: string;
@@ -210,22 +209,6 @@ interface Layout {
 	summary?: ChangeSummary;
 }
 
-/** The `?` keyboard sheet, hidden until the client opens it. */
-function renderKeysSheet(keys: KeyHint[]): string {
-	const rows = keys
-		.map(
-			(key) =>
-				`<div><dt><kbd class="browse-kbd">${escapeHtml(key.keys)}</kbd></dt><dd>${escapeHtml(key.label)}</dd></div>`,
-		)
-		.join("");
-	return `<div class="bf-dialog" id="keys-dialog" hidden>
-<div class="bf-dialog__panel" role="dialog" aria-modal="true" aria-labelledby="keys-title">
-<div class="bf-dialog__head"><h2 id="keys-title">Keyboard shortcuts</h2><span class="bf-spacer"></span><button type="button" class="bf-btn" id="keys-close">Close</button></div>
-<dl class="browse-keys">${rows}</dl>
-</div>
-</div>`;
-}
-
 /** A full two-pane page. */
 function renderLayout(layout: Layout): string {
 	return `<!doctype html>
@@ -237,7 +220,7 @@ ${docHead({ title: layout.title, css: STYLES })}
 <body class="bf-app">
 <a class="skip" href="#main">Skip to content</a>
 <p class="sr-only" id="copy-status" role="status" aria-live="polite"></p>
-<noscript><style>.bf-field{display:none}.bf-tree__tw--toggle{visibility:hidden}.bf-btn{display:none}.browse-quick-open{display:none}th .bf-sort{pointer-events:none;cursor:default}</style></noscript>
+<noscript><style>.bf-field{display:none}.browse-side__filters{display:none}.bf-tree__tw--toggle{visibility:hidden}.bf-btn{display:none}.browse-quick-open{display:none}th .bf-sort{pointer-events:none;cursor:default}</style></noscript>
 ${SPRITE}
 <header class="bf-app__header"><div class="bf-toolbar">
   ${brandLockup("browse")}
@@ -253,7 +236,10 @@ ${SPRITE}
     <summary class="bf-panel__summary">Files</summary>
     <aside class="bf-panel browse-side">
       <button type="button" class="browse-quick-open" id="quick-open" aria-haspopup="dialog"><span>quick open</span><kbd>/</kbd></button>
-      <label class="bf-field">⌕ <input class="bf-input" id="filter" type="search" placeholder="filter paths…" aria-label="Filter paths"></label>
+      <div class="browse-side__filters">
+        <label class="bf-field">⌕ <input class="bf-input" id="filter" type="search" placeholder="filter paths…" aria-label="Filter paths"></label>
+        <button type="button" class="bf-btn" id="fold-all" title="Fold or expand every folder">fold all</button>
+      </div>
       <nav class="bf-tree" aria-label="File tree">${renderTree(layout.tree, layout.currentRel, layout.summary)}</nav>
       <p class="bf-note" id="tree-empty" hidden>No matches.</p>
     </aside>
@@ -264,7 +250,7 @@ ${layout.main}
   </main>
 </div>
 <footer class="bf-app__footer">served from ${escapeHtml(layout.rootLabel)} · read-only · ${escapeHtml(layout.footerNote)}</footer>
-${layout.keys && layout.keys.length > 0 ? renderKeysSheet(layout.keys) : ""}
+${layout.keys && layout.keys.length > 0 ? keysSheet(layout.keys) : ""}
 <script src="/app.js" defer></script>
 </body>
 </html>
@@ -380,6 +366,8 @@ export interface FilePage {
 	git?: GitStatus;
 	/** Show the Markdown source instead of the rendered HTML. */
 	markdownRaw?: boolean;
+	/** Re-emit sanitized raw HTML in rendered Markdown; `false` escapes it as text. */
+	markdownHtml?: boolean;
 	/** True when this file has uncommitted changes, for the changes action. */
 	changed?: boolean;
 	/** Changed-path index for the header chip and the tree markers. */
@@ -406,21 +394,12 @@ function lastSegment(path: string): string {
 
 /** The shortcuts every page shares, plus whatever the page adds. */
 function pageKeys(...extra: KeyHint[]): KeyHint[] {
-	return [{ keys: "/ ⌘K", label: "Quick open a file" }, ...extra, { keys: "?", label: "This sheet" }];
-}
-
-/** An "on this page" outline from the headings the Markdown renderer emitted. */
-function renderOutline(headings: MarkdownHeading[]): string {
-	if (headings.length < 4) return "";
-	const base = Math.min(...headings.map((heading) => heading.level));
-	const items = headings
-		.map((heading) => {
-			const depth = Math.min(heading.level - base, 3);
-			const label = heading.text.replace(/\[([^\]]*)\]\([^)]*\)/g, "$1").replace(/[`*_~]/g, "");
-			return `<li><a class="lvl${depth}" href="#${heading.id}">${escapeHtml(label)}</a></li>`;
-		})
-		.join("");
-	return `<details class="browse-md-outline"><summary>On this page</summary><ul>${items}</ul></details>`;
+	return [
+		{ keys: "/ ⌘K", label: "Quick open a file" },
+		{ keys: "-", label: "Fold or expand every folder" },
+		...extra,
+		{ keys: "?", label: "This sheet" },
+	];
 }
 
 /** The card-head controls: Markdown mode, line wrapping, and copy actions. */
@@ -482,8 +461,10 @@ export function renderFilePage(page: FilePage): string {
 	let note = "";
 	if (page.file.kind === "text" || page.file.kind === "markdown") {
 		if (page.file.kind === "markdown" && !page.markdownRaw) {
-			const document = renderMarkdownDocument(page.file.lines.join("\n"), markdownBaseDir(page.rel));
-			content = `${renderOutline(document.headings)}<article class="bf-md">${document.html}</article>`;
+			const html = renderMarkdown(page.file.lines.join("\n"), markdownBaseDir(page.rel), {
+				html: page.markdownHtml !== false,
+			});
+			content = `<article class="bf-md">${html}</article>`;
 		} else {
 			content = `<pre class="bf-code bf-code--numbered"><code>${renderCodeLines(page.file.lines, language)}</code></pre>`;
 		}

package/extensions/file-browse/markdown.ts

@@ -5,8 +5,9 @@
  * that show up in repository READMEs — headings, paragraphs, fenced code,
  * blockquotes, nested and task lists, tables, code spans, emphasis, inline and
  * reference links, and images. Named and numeric character references are
- * decoded as literal text. Everything is escaped and only a known set of tags
- * is emitted; raw HTML in the source is shown as text, never executed.
+ * decoded as literal text. Raw HTML is re-emitted through the allowlist in
+ * `raw-html.ts`; `html: false` restores escape-only rendering, where the source
+ * is shown as text and never executed.
  *
  * Relative links become `/view/<path>` and relative images become `/raw/<path>`
  * so they resolve from any page URL. The `/view` and `/raw` routes re-vet the
@@ -15,21 +16,30 @@
  * and non-http(s) schemes such as `javascript:` are dropped.
  *
  * Headings get a stable anchor id and are demoted one level so the embedding
- * page keeps the only `h1`; `renderMarkdownDocument` returns them for an
- * outline.
+ * page keeps the only `h1`.
  *
  * Kept free of the page renderer: it imports only `lib/escape.ts`,
- * `lib/highlight.ts`, and `paths.ts`, so `html.ts` can compose it without a
- * module cycle.
+ * `lib/highlight.ts`, `urls.ts`, and `raw-html.ts`, so `html.ts` can compose it
+ * without a module cycle. The block scanner, the inline scanner, and their
+ * per-document state stay in one module because they are a single pass; URL
+ * policy and raw HTML do not.
  */
 
-import { posix } from "node:path";
 import { escapeHtml } from "../../lib/escape.ts";
 import { fenceLanguage, highlightLines } from "../../lib/highlight.ts";
-import { encodePath } from "./paths.ts";
+import {
+	closesSuppressed,
+	closeHtmlSink,
+	closeInlineTags,
+	createHtmlSink,
+	type HtmlBlockStart,
+	type HtmlSink,
+	htmlBlockStart,
+	sanitizeHtmlBlock,
+	sanitizeInlineTag,
+} from "./raw-html.ts";
+import { resolveImage, resolveLink } from "./urls.ts";
 
-const HAS_SCHEME = /^[a-zA-Z][a-zA-Z0-9+.-]*:/;
-const SAFE_LINK_SCHEME = /^(?:https?|mailto):/i;
 const HTTP_SCHEME = /^https?:/i;
 /** A GFM extended autolink: `http(s)://` or `www.` followed by a domain. */
 const AUTOLINK = /^(?:https?:\/\/|www\.)[^\s<>]*/i;
@@ -55,41 +65,36 @@ interface LinkDefinition {
 	title?: string;
 }
 
-/** A heading the renderer emitted, in document order. */
-export interface MarkdownHeading {
-	/** The rendered tag level, already demoted and capped at `h6`. */
-	level: number;
-	/** The anchor id, unique within the document. */
-	id: string;
-	/** The heading's raw inline Markdown. */
-	text: string;
-}
-
 /**
  * Per-document render state: the resolution base, the reference definitions,
- * and the headings emitted so far.
+ * and the raw-HTML balancing state.
  */
 interface Context {
 	baseDir: string;
 	defs: Map<string, LinkDefinition>;
-	headings: MarkdownHeading[];
+	/** Emit sanitized raw HTML; `false` escapes it as text. */
+	html: boolean;
+	sink: HtmlSink;
 	slug(text: string): string;
 }
 
-/**
- * Render a Markdown source string to a safe HTML fragment, plus the headings it
- * emitted so a caller can build an outline. Headings carry an anchor id and are
- * demoted one level, so the embedding page keeps the only `h1`.
- */
-export function renderMarkdownDocument(source: string, baseDir = ""): { html: string; headings: MarkdownHeading[] } {
-	const { defs, body } = collectDefinitions(source.split(/\r\n|\r|\n/));
-	const context = createContext(baseDir, defs);
-	return { html: renderBlocks(body, context), headings: context.headings };
+/** Render options; every field has the behaviour the browse page uses. */
+export interface MarkdownOptions {
+	/** Emit sanitized raw HTML (the default) or escape it (`false`). */
+	html?: boolean;
 }
 
-/** Render a Markdown source string to a safe HTML fragment. */
-export function renderMarkdown(source: string, baseDir = ""): string {
-	return renderMarkdownDocument(source, baseDir).html;
+/**
+ * Render a Markdown source string to a safe HTML fragment. Headings carry an
+ * anchor id and are demoted one level, so the embedding page keeps the only
+ * `h1`.
+ */
+export function renderMarkdown(source: string, baseDir = "", options: MarkdownOptions = {}): string {
+	const html = options.html ?? true;
+	const { defs, body } = collectDefinitions(source.split(/\r\n|\r|\n/), html);
+	const context = createContext(baseDir, defs, html);
+	const rendered = renderBlocks(body, context);
+	return html ? rendered + closeHtmlSink(context.sink) : rendered;
 }
 
 /** Turn heading text into a stable anchor id, dropping Markdown punctuation. */
@@ -105,12 +110,13 @@ function headingSlug(text: string): string {
 }
 
 /** Build the per-document render state, suffixing repeated heading slugs. */
-function createContext(baseDir: string, defs: Map<string, LinkDefinition>): Context {
+function createContext(baseDir: string, defs: Map<string, LinkDefinition>, html: boolean): Context {
 	const seen = new Map<string, number>();
 	return {
 		baseDir,
 		defs,
-		headings: [],
+		html,
+		sink: createHtmlSink(),
 		slug(text: string): string {
 			const base = headingSlug(text);
 			const count = seen.get(base) ?? 0;
@@ -132,10 +138,11 @@ function normalizeLabel(label: string): string {
  * definition-shaped line inside code stays literal. Definitions are
  * single-line; one inside a blockquote or list item is left in place as text.
  */
-function collectDefinitions(lines: string[]): { defs: Map<string, LinkDefinition>; body: string[] } {
+function collectDefinitions(lines: string[], html: boolean): { defs: Map<string, LinkDefinition>; body: string[] } {
 	const defs = new Map<string, LinkDefinition>();
 	const body: string[] = [];
 	let fence: Fence | undefined;
+	let inHtml: "block" | { suppressed: string } | undefined;
 	for (const line of lines) {
 		if (fence) {
 			const close = /^ {0,3}(`{3,}|~{3,})\s*$/.exec(line);
@@ -143,12 +150,31 @@ function collectDefinitions(lines: string[]): { defs: Map<string, LinkDefinition
 			body.push(line);
 			continue;
 		}
+		if (inHtml) {
+			if (inHtml === "block") {
+				if (isBlank(line)) inHtml = undefined;
+			} else if (closesSuppressed(line, inHtml.suppressed)) {
+				inHtml = undefined;
+			}
+			body.push(line);
+			continue;
+		}
 		const open = matchFence(line);
 		if (open) {
 			fence = open;
 			body.push(line);
 			continue;
 		}
+		const start = html ? htmlBlockStart(line) : undefined;
+		if (start) {
+			if (start.kind === "suppressed") {
+				inHtml = closesSuppressed(line, start.name) ? undefined : { suppressed: start.name };
+			} else {
+				inHtml = "block";
+			}
+			body.push(line);
+			continue;
+		}
 		const match = DEFINITION.exec(line);
 		if (!match) {
 			body.push(line);
@@ -210,7 +236,6 @@ function renderBlocks(lines: string[], ctx: Context): string {
 		if (heading) {
 			const level = Math.min(heading.level + 1, 6);
 			const id = ctx.slug(heading.text);
-			ctx.headings.push({ level, id, text: heading.text });
 			out.push(`<h${level} id="${id}">${renderInline(heading.text, ctx)}</h${level}>`);
 			i++;
 			continue;
@@ -245,6 +270,14 @@ function renderBlocks(lines: string[], ctx: Context): string {
 			continue;
 		}
 
+		const htmlBlock = ctx.html ? htmlBlockStart(line) : undefined;
+		if (htmlBlock) {
+			const [html, next] = renderHtmlBlock(lines, i, htmlBlock, ctx);
+			if (html !== "") out.push(html);
+			i = next;
+			continue;
+		}
+
 		const [html, next] = renderParagraph(lines, i, ctx);
 		out.push(html);
 		i = next;
@@ -253,7 +286,7 @@ function renderBlocks(lines: string[], ctx: Context): string {
 }
 
 /** True when `lines[i]` opens a block that may interrupt a paragraph. */
-function isBlockStart(lines: string[], i: number): boolean {
+function isBlockStart(lines: string[], i: number, html: boolean): boolean {
 	const line = lines[i];
 	return (
 		matchFence(line) !== undefined ||
@@ -261,6 +294,7 @@ function isBlockStart(lines: string[], i: number): boolean {
 		isThematicBreak(line) ||
 		isBlockquoteLine(line) ||
 		matchListItem(line) !== undefined ||
+		(html && htmlBlockStart(line) !== undefined) ||
 		(i + 1 < lines.length && isTableStart(line, lines[i + 1]))
 	);
 }
@@ -270,7 +304,7 @@ function renderParagraph(lines: string[], start: number, ctx: Context): [string,
 	let i = start;
 	for (; i < lines.length; i++) {
 		if (isBlank(lines[i])) break;
-		if (i > start && isBlockStart(lines, i)) break;
+		if (i > start && isBlockStart(lines, i, ctx.html)) break;
 		collected.push(lines[i]);
 	}
 	const html = collected
@@ -285,6 +319,28 @@ function renderParagraph(lines: string[], start: number, ctx: Context): [string,
 	return [`<p>${html}</p>`, i];
 }
 
+/**
+ * Render an HTML block. An allowed block runs to the next blank line, matching
+ * what a reader expects from GitHub: everything up to the blank line is markup,
+ * and Markdown resumes after it. A suppressed element (`<script>`, `<svg>`, …)
+ * swallows its body through the matching close tag, crossing blank lines, and
+ * emits nothing.
+ */
+function renderHtmlBlock(lines: string[], start: number, block: HtmlBlockStart, ctx: Context): [string, number] {
+	if (block.kind === "suppressed") {
+		let i = start;
+		while (i < lines.length && !closesSuppressed(lines[i], block.name)) i++;
+		return ["", Math.min(i + 1, lines.length)];
+	}
+	const collected: string[] = [];
+	let i = start;
+	for (; i < lines.length; i++) {
+		if (isBlank(lines[i])) break;
+		collected.push(lines[i]);
+	}
+	return [sanitizeHtmlBlock(collected.join("\n"), ctx.baseDir, ctx.sink), i];
+}
+
 interface Fence {
 	char: string;
 	length: number;
@@ -407,7 +463,10 @@ function renderTable(lines: string[], start: number, ctx: Context): [string, num
 		rows.push(`<tr>${tds.join("")}</tr>`);
 	}
 	const table = `<table class="md-table"><thead><tr>${head}</tr></thead><tbody>${rows.join("")}</tbody></table>`;
-	return [`<div class="md-table-wrap">${table}</div>`, i];
+	// The frame is the positioning context for the right-edge fade the client adds
+	// when the table scrolls; the scroller clips its own content, so the fade cannot
+	// live inside it.
+	return [`<div class="md-table-frame"><div class="md-table-wrap">${table}</div></div>`, i];
 }
 
 interface ListItem {
@@ -580,56 +639,6 @@ function parseReferenceLink(text: string, start: number, ctx: Context): ParsedLi
 	return undefined;
 }
 
-interface ResolvedLink {
-	href: string;
-	external: boolean;
-}
-
-interface ResolvedImage {
-	href: string;
-	image: boolean;
-}
-
-function resolveLocalPath(href: string, baseDir: string): { rel: string; suffix: string } | undefined {
-	const match = /^([^?#]*)([?#].*)?$/.exec(href);
-	if (!match) return undefined;
-	const rawPath = match[1];
-	const suffix = match[2] ?? "";
-	let path: string;
-	try {
-		path = decodeURIComponent(rawPath);
-	} catch {
-		path = rawPath;
-	}
-	let rel: string;
-	if (path.startsWith("/")) rel = posix.normalize(path).replace(/^\/+/, "");
-	else rel = posix.normalize(posix.join(baseDir, path));
-	if (rel === ".") rel = "";
-	if (rel === ".." || rel.startsWith("../") || rel.startsWith("/")) return undefined;
-	return { rel, suffix };
-}
-
-function resolveLink(dest: string, baseDir: string): ResolvedLink | undefined {
-	const value = dest.trim();
-	if (value === "") return undefined;
-	if (value.startsWith("#")) return { href: value, external: false };
-	if (SAFE_LINK_SCHEME.test(value)) return { href: value, external: HTTP_SCHEME.test(value) };
-	if (HAS_SCHEME.test(value)) return undefined;
-	const local = resolveLocalPath(value, baseDir);
-	if (!local) return undefined;
-	return { href: `/view/${encodePath(local.rel)}${local.suffix}`, external: false };
-}
-
-function resolveImage(dest: string, baseDir: string): ResolvedImage | undefined {
-	const value = dest.trim();
-	if (value === "") return undefined;
-	if (HTTP_SCHEME.test(value)) return { href: value, image: false };
-	if (HAS_SCHEME.test(value)) return undefined;
-	const local = resolveLocalPath(value, baseDir);
-	if (!local) return undefined;
-	return { href: `/raw/${encodePath(local.rel)}${local.suffix}`, image: true };
-}
-
 function renderLink(parsed: ParsedLink, ctx: Context): string {
 	const label = renderInline(parsed.label, ctx);
 	const target = resolveLink(parsed.dest, ctx.baseDir);
@@ -757,6 +766,7 @@ function matchEntity(text: string, start: number): Entity | undefined {
 function renderInline(text: string, ctx: Context): string {
 	let out = "";
 	let i = 0;
+	const tags: string[] = [];
 	while (i < text.length) {
 		const char = text[i];
 
@@ -814,6 +824,14 @@ function renderInline(text: string, ctx: Context): string {
 				i += match[0].length;
 				continue;
 			}
+			if (ctx.html) {
+				const tag = sanitizeInlineTag(text, i, ctx.baseDir, tags);
+				if (tag) {
+					out += tag.html;
+					i = tag.end;
+					continue;
+				}
+			}
 		}
 
 		// GFM extended autolink: a bare `https://` or `www.` URL in running text.
@@ -863,5 +881,5 @@ function renderInline(text: string, ctx: Context): string {
 		out += escapeHtml(char);
 		i++;
 	}
-	return out;
+	return out + closeInlineTags(tags);
 }