mr-md 1.0.1 → 1.0.2

package/dist/renderer/blocks.d.ts

@@ -5,11 +5,11 @@ export declare function escHtml(str: string): string;
 export declare function escAttr(str: string): string;
 declare function renderBlock(block: Block, idx: number, options: BuildOptions): {
     html: string;
-    navItem?: NavItem;
+    navItems?: NavItem[];
 };
 declare function renderBlockInner(block: Block, idx: number, options: BuildOptions): {
     html: string;
-    navItem?: NavItem;
+    navItems?: NavItem[];
 };
 export { blockChrome, renderBlock, renderBlockInner };
 //# sourceMappingURL=blocks.d.ts.map

package/dist/renderer/blocks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"blocks.d.ts","sourceRoot":"","sources":["../../src/renderer/blocks.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,YAAY,EAA0B,MAAM,aAAa,CAAC;AAC/E,OAAO,EACN,WAAW,EAKX,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,KAAK,OAAO,EAAmC,MAAM,YAAY,CAAC;AAG3E,wBAAgB,OAAO,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAO3C;AACD,wBAAgB,OAAO,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAE3C;AAID,iBAAS,WAAW,CACnB,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,MAAM,EACX,OAAO,EAAE,YAAY,GACnB;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,CAuBrC;AAED,iBAAS,gBAAgB,CACxB,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,MAAM,EACX,OAAO,EAAE,YAAY,GACnB;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,CAqQrC;AAuID,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,gBAAgB,EAAE,CAAC"}
+{"version":3,"file":"blocks.d.ts","sourceRoot":"","sources":["../../src/renderer/blocks.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,YAAY,EAA0B,MAAM,aAAa,CAAC;AAC/E,OAAO,EACN,WAAW,EAKX,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,KAAK,OAAO,EAAmC,MAAM,YAAY,CAAC;AAG3E,wBAAgB,OAAO,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAO3C;AACD,wBAAgB,OAAO,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAE3C;AAID,iBAAS,WAAW,CACnB,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,MAAM,EACX,OAAO,EAAE,YAAY,GACnB;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,EAAE,CAAA;CAAE,CAuBxC;AAED,iBAAS,gBAAgB,CACxB,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,MAAM,EACX,OAAO,EAAE,YAAY,GACnB;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,EAAE,CAAA;CAAE,CA0QxC;AAuID,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,gBAAgB,EAAE,CAAC"}

package/dist/renderer/blocks.js

@@ -42,13 +42,18 @@ function renderBlockInner(block, idx, options) {
             const id = `heading-${idx}`;
             return {
                 html: `<section id="${id}" class="bk-section bk-heading">${html}</section>`,
-                navItem: { id, label, kind: "heading" },
+                navItems: [{ id, label, kind: "heading" }],
             };
         }
         case "markdown": {
             const md = resolveContent(block.src, options, "md");
-            const { html } = mdToHtml(md);
-            return { html: `<div class="bk-markdown">${html}</div>` };
+            const { html, headings } = mdToHtml(md);
+            const navItems = headings.map(h => ({
+                id: h.id,
+                label: h.text,
+                kind: h.level === 2 ? "heading" : "section"
+            }));
+            return { html: `<div class="bk-markdown">${html}</div>`, navItems: navItems.length > 0 ? navItems : undefined };
         }
         case "section": {
             const md = resolveContent(block.src, options, "md");
@@ -57,7 +62,7 @@ function renderBlockInner(block, idx, options) {
             const id = `section-${idx}`;
             return {
                 html: `<section id="${id}" class="bk-section bk-subsection">${html}</section>`,
-                navItem: { id, label, kind: "section" },
+                navItems: [{ id, label, kind: "section" }],
             };
         }
         case "important":
@@ -227,11 +232,11 @@ function renderBlockInner(block, idx, options) {
             ${quiz.questions.map((q, qi) => renderQuestion(q, `quiz-${idx}`, qi)).join("\n")}
           </div>
         </div>`,
-                navItem: {
-                    id: `quiz-${idx}`,
-                    label: block.label ?? "Questions",
-                    kind: "quiz",
-                },
+                navItems: [{
+                        id: `quiz-${idx}`,
+                        label: block.label ?? "Questions",
+                        kind: "quiz",
+                    }],
             };
         }
         case "divider":

package/dist/renderer/index.js

@@ -5,10 +5,10 @@ export function render(lesson, opts = {}) {
     const bodyItems = [];
     const structuredNavItems = [];
     lesson.blocks.forEach((block, idx) => {
-        const { html, navItem } = renderBlock(block, idx, opts);
+        const { html, navItems } = renderBlock(block, idx, opts);
         bodyItems.push(html);
-        if (navItem) {
-            structuredNavItems.push(navItem);
+        if (navItems) {
+            structuredNavItems.push(...navItems);
         }
     });
     return renderPage(lesson, structuredNavItems, bodyItems.join("\n"), opts);

package/dist/renderer/markdown.d.ts

@@ -2,6 +2,11 @@ import type { Block } from "../types.js";
 declare function mdToHtml(md: string): {
     html: string;
     title: string;
+    headings: {
+        id: string;
+        text: string;
+        level: number;
+    }[];
 };
 declare function blockChrome(kind: string, label: string | undefined, caption: string | undefined, body: string, accent?: string, allowMaximize?: boolean): string;
 declare function mdInline(text: string): string;

package/dist/renderer/markdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"markdown.d.ts","sourceRoot":"","sources":["../../src/renderer/markdown.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAYzC,iBAAS,QAAQ,CAAC,EAAE,EAAE,MAAM,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAsE7D;AAeD,iBAAS,WAAW,CACnB,IAAI,EAAE,MAAM,EACZ,KAAK,EAAE,MAAM,GAAG,SAAS,EACzB,OAAO,EAAE,MAAM,GAAG,SAAS,EAC3B,IAAI,EAAE,MAAM,EACZ,MAAM,SAAY,EAClB,aAAa,UAAO,GAClB,MAAM,CAYR;AAED,iBAAS,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAmBtC;AAED,iBAAS,wBAAwB,CAChC,KAAK,EAAE,OAAO,CAAC,KAAK,EAAE;IAAE,IAAI,EAAE,YAAY,CAAA;CAAE,CAAC,GAC3C,MAAM,CAiCR;AAED,iBAAS,gBAAgB,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,CAIhD;AAED,OAAO,EACN,WAAW,EACX,gBAAgB,EAChB,QAAQ,EACR,QAAQ,EACR,wBAAwB,GACxB,CAAC"}
+{"version":3,"file":"markdown.d.ts","sourceRoot":"","sources":["../../src/renderer/markdown.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAYzC,iBAAS,QAAQ,CAAC,EAAE,EAAE,MAAM,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAA;CAAE,CAmFtH;AAeD,iBAAS,WAAW,CACnB,IAAI,EAAE,MAAM,EACZ,KAAK,EAAE,MAAM,GAAG,SAAS,EACzB,OAAO,EAAE,MAAM,GAAG,SAAS,EAC3B,IAAI,EAAE,MAAM,EACZ,MAAM,SAAY,EAClB,aAAa,UAAO,GAClB,MAAM,CAYR;AAED,iBAAS,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAmBtC;AAED,iBAAS,wBAAwB,CAChC,KAAK,EAAE,OAAO,CAAC,KAAK,EAAE;IAAE,IAAI,EAAE,YAAY,CAAA;CAAE,CAAC,GAC3C,MAAM,CAiCR;AAED,iBAAS,gBAAgB,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,CAIhD;AAED,OAAO,EACN,WAAW,EACX,gBAAgB,EAChB,QAAQ,EACR,QAAQ,EACR,wBAAwB,GACxB,CAAC"}

package/dist/renderer/markdown.js

@@ -41,7 +41,18 @@ function mdToHtml(md) {
     codeBlocks.forEach((match, id) => {
         processedMd = processedMd.replace(`@@BK_CODE_${id}@@`, () => match);
     });
-    let html = marked.parse(processedMd);
+    const headings = [];
+    let headingIdCounter = 0;
+    const renderer = new marked.Renderer();
+    renderer.heading = ({ tokens, depth, text }) => {
+        const id = `bk-heading-${headingIdCounter++}`;
+        if (depth === 2 || depth === 3) {
+            const plainText = text.replace(/<[^>]+>/g, "");
+            headings.push({ id, text: plainText, level: depth });
+        }
+        return `<h${depth} id="${id}" class="bk-heading-${depth}">${text}</h${depth}>`;
+    };
+    let html = marked.parse(processedMd, { renderer });
     // Restore math
     mathBlocks.forEach((tex, id) => {
         const rendered = katex.renderToString(tex, {
@@ -60,7 +71,7 @@ function mdToHtml(md) {
         });
         html = html.replace(`@@BK_MATH_INLINE_${id}@@`, () => rendered);
     });
-    return { html, title };
+    return { html, title, headings };
 }
 function escHtml(s) {
     return s

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "mr-md",
-	"version": "1.0.1",
+	"version": "1.0.2",
 	"description": "Mr Markdown is an opinionated TypeScript SDK for building interactive, single-file learning pages.",
 	"type": "module",
 	"main": "dist/index.js",

package/src/renderer/blocks.ts

@@ -29,7 +29,7 @@ function renderBlock(
 	block: Block,
 	idx: number,
 	options: BuildOptions,
-): { html: string; navItem?: NavItem } {
+): { html: string; navItems?: NavItem[] } {
 	try {
 		const result = renderBlockInner(block, idx, options);
 		if (
@@ -58,7 +58,7 @@ function renderBlockInner(
 	block: Block,
 	idx: number,
 	options: BuildOptions,
-): { html: string; navItem?: NavItem } {
+): { html: string; navItems?: NavItem[] } {
 	switch (block.type) {
 		case "heading": {
 			const md = resolveContent(block.src, options, "md");
@@ -67,14 +67,19 @@ function renderBlockInner(
 			const id = `heading-${idx}`;
 			return {
 				html: `<section id="${id}" class="bk-section bk-heading">${html}</section>`,
-				navItem: { id, label, kind: "heading" },
+				navItems: [{ id, label, kind: "heading" }],
 			};
 		}
 
 		case "markdown": {
 			const md = resolveContent(block.src, options, "md");
-			const { html } = mdToHtml(md);
-			return { html: `<div class="bk-markdown">${html}</div>` };
+			const { html, headings } = mdToHtml(md);
+			const navItems: NavItem[] = headings.map(h => ({
+				id: h.id,
+				label: h.text,
+				kind: h.level === 2 ? "heading" : "section"
+			}));
+			return { html: `<div class="bk-markdown">${html}</div>`, navItems: navItems.length > 0 ? navItems : undefined };
 		}
 
 		case "section": {
@@ -84,7 +89,7 @@ function renderBlockInner(
 			const id = `section-${idx}`;
 			return {
 				html: `<section id="${id}" class="bk-section bk-subsection">${html}</section>`,
-				navItem: { id, label, kind: "section" },
+				navItems: [{ id, label, kind: "section" }],
 			};
 		}
 
@@ -305,11 +310,11 @@ function renderBlockInner(
             ${quiz.questions.map((q, qi) => renderQuestion(q, `quiz-${idx}`, qi)).join("\n")}
           </div>
         </div>`,
-				navItem: {
+				navItems: [{
 					id: `quiz-${idx}`,
 					label: block.label ?? "Questions",
 					kind: "quiz",
-				},
+				}],
 			};
 		}
 

package/src/renderer/index.ts

@@ -10,10 +10,10 @@ export function render(lesson: Lesson, opts: BuildOptions = {}): string {
 	const structuredNavItems: NavItem[] = [];
 
 	lesson.blocks.forEach((block, idx) => {
-		const { html, navItem } = renderBlock(block, idx, opts);
+		const { html, navItems } = renderBlock(block, idx, opts);
 		bodyItems.push(html);
-		if (navItem) {
-			structuredNavItems.push(navItem);
+		if (navItems) {
+			structuredNavItems.push(...navItems);
 		}
 	});
 

package/src/renderer/markdown.ts

@@ -14,7 +14,7 @@ marked.use(markedHighlight({
 
 // ─── Markdown Rendering (using Marked + KaTeX) ───────────────────────────────
 
-function mdToHtml(md: string): { html: string; title: string } {
+function mdToHtml(md: string): { html: string; title: string; headings: { id: string; text: string; level: number }[] } {
 	let title = "";
 
 	// Extract first H1 or H2 as title
@@ -55,7 +55,20 @@ function mdToHtml(md: string): { html: string; title: string } {
 		processedMd = processedMd.replace(`@@BK_CODE_${id}@@`, () => match);
 	});
 
-	let html = marked.parse(processedMd) as string;
+	const headings: { id: string; text: string; level: number }[] = [];
+	let headingIdCounter = 0;
+
+	const renderer = new marked.Renderer();
+	renderer.heading = ({ tokens, depth, text }) => {
+		const id = `bk-heading-${headingIdCounter++}`;
+		if (depth === 2 || depth === 3) {
+			const plainText = text.replace(/<[^>]+>/g, "");
+			headings.push({ id, text: plainText, level: depth });
+		}
+		return `<h${depth} id="${id}" class="bk-heading-${depth}">${text}</h${depth}>`;
+	};
+
+	let html = marked.parse(processedMd, { renderer }) as string;
 
 	// Restore math
 	mathBlocks.forEach((tex, id) => {
@@ -83,7 +96,7 @@ function mdToHtml(md: string): { html: string; title: string } {
 		html = html.replace(`@@BK_MATH_INLINE_${id}@@`, () => rendered);
 	});
 
-	return { html, title };
+	return { html, title, headings };
 }
 
 function escHtml(s: string): string {