@san-siva/blogkit-md 0.3.7 → 0.3.9

package/dist/index.js

@@ -93,7 +93,7 @@ var consumeNode = (nodes, index, sections, section) => {
   if (isIncrementingHeading) {
     if (section.nodes.length > 0) {
       const subSection = {
-        title: "",
+        titleNodes: [],
         headingLevel: section.headingLevel,
         nodes: section.nodes,
         subsections: [],
@@ -103,7 +103,7 @@ var consumeNode = (nodes, index, sections, section) => {
       section.nodes = [];
     }
     const subsection = {
-      title: extractText(node.children),
+      titleNodes: node.children,
       headingLevel,
       nodes: [],
       subsections: [],
@@ -114,7 +114,7 @@ var consumeNode = (nodes, index, sections, section) => {
   }
   if (!section.previousSection) {
     const subSection = {
-      title: extractText(node.children),
+      titleNodes: node.children,
       headingLevel,
       nodes: [],
       subsections: [],
@@ -127,7 +127,7 @@ var consumeNode = (nodes, index, sections, section) => {
 };
 var groupSections = (nodes) => {
   const initialSection = {
-    title: "",
+    titleNodes: [],
     headingLevel: Infinity,
     nodes: [],
     subsections: [],
@@ -135,7 +135,7 @@ var groupSections = (nodes) => {
   };
   const sections = [initialSection];
   consumeNode(nodes, 0, sections, initialSection);
-  return sections.filter((s) => s.title !== "" || s.nodes.length > 0);
+  return sections.filter((s) => s.titleNodes.length > 0 || s.nodes.length > 0);
 };
 
 // src/utils/renderPhrasingContent.tsx
@@ -326,18 +326,11 @@ function renderNode({
         (item) => item.checked !== null && item.checked !== void 0
       );
       if (isTaskList) {
-        const items = node.children.map((item, index) => ({
-          id: String(index),
-          isChecked: item.checked === true,
-          children: item.children.map(
-            (child, childIndex) => renderNode({
-              node: child,
-              key: childIndex,
-              inList: true,
-              counters
-            })
-          )
-        }));
+        const items = node.children.map((item, index) => {
+          const para = item.children.find((c) => c.type === "paragraph");
+          const children = (para == null ? void 0 : para.type) === "paragraph" ? /* @__PURE__ */ jsx2("p", { children: renderPhrasingContent(para.children) }) : /* @__PURE__ */ jsx2("p", {});
+          return { id: String(index), isChecked: item.checked === true, children };
+        });
         return /* @__PURE__ */ jsx2(CheckList, { items, hasMarginUp: true, hasMarginDown: true }, key);
       }
       const Tag = node.ordered ? "ol" : "ul";
@@ -361,8 +354,8 @@ function renderNodes(nodes, counters) {
   );
 }
 function renderSection(section, counters, key = -1) {
-  var _a;
-  return /* @__PURE__ */ jsxs(BlogSection, { title: (_a = section == null ? void 0 : section.title) != null ? _a : "", children: [
+  const title = section.titleNodes.length > 0 ? /* @__PURE__ */ jsx2("p", { children: renderPhrasingContent(section.titleNodes) }) : "";
+  return /* @__PURE__ */ jsxs(BlogSection, { title, children: [
     renderNodes(section.nodes, counters),
     section.subsections.map(
       (subsection, index) => renderSection(subsection, counters, index)
@@ -371,9 +364,9 @@ function renderSection(section, counters, key = -1) {
 }
 function stripRedundantSectionTitle(grouped, isTitleEmpty) {
   if (!isTitleEmpty && grouped.length === 1) {
-    const [{ title, nodes, subsections }] = grouped;
-    if (title.length > 0 && (nodes.length > 0 || subsections.length > 0)) {
-      grouped[0].title = "";
+    const [{ titleNodes, nodes, subsections }] = grouped;
+    if (titleNodes.length > 0 && (nodes.length > 0 || subsections.length > 0)) {
+      grouped[0].titleNodes = [];
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@san-siva/blogkit-md",
-	"version": "0.3.7",
+	"version": "0.3.9",
 	"description": "Converts markdown files into JSX blog posts for Blogkit",
 	"main": "./dist/index.js",
 	"exports": {
@@ -21,7 +21,7 @@
 		"fix": "eslint . --config eslint.config.ts --fix"
 	},
 	"dependencies": {
-		"@san-siva/blogkit": "^1.1.30",
+		"@san-siva/blogkit": "^1.1.32",
 		"@san-siva/stylekit": "^1.0.12",
 		"next": "^16.0.10",
 		"react": "^19.0.0",

package/src/utils/groupSections.test.ts

@@ -4,6 +4,7 @@ import remarkParse from 'remark-parse';
 import { unified } from 'unified';
 import type { Root } from 'mdast';
 
+import { extractText } from './extractText';
 import { groupSections } from './groupSections';
 
 const sections = (md: string) => {
@@ -11,6 +12,9 @@ const sections = (md: string) => {
 	return groupSections(ast.children);
 };
 
+const title = (s: ReturnType<typeof sections>[number]) =>
+	extractText(s.titleNodes);
+
 describe('groupSections', () => {
 	describe('empty input', () => {
 		it('returns an empty array', () => {
@@ -22,7 +26,7 @@ describe('groupSections', () => {
 		it('returns a single untitled section containing all nodes', () => {
 			const result = sections('some text\n\nmore text');
 			expect(result).toHaveLength(1);
-			expect(result[0].title).toBe('');
+			expect(result[0].titleNodes).toHaveLength(0);
 			expect(result[0].nodes).toHaveLength(2);
 		});
 	});
@@ -31,21 +35,21 @@ describe('groupSections', () => {
 		it('creates a section for H1', () => {
 			const result = sections('# Title');
 			expect(result).toHaveLength(1);
-			expect(result[0].title).toBe('Title');
+			expect(title(result[0])).toBe('Title');
 			expect(result[0].headingLevel).toBe(1);
 		});
 
 		it('creates a section for H2', () => {
 			const result = sections('## Section');
 			expect(result).toHaveLength(1);
-			expect(result[0].title).toBe('Section');
+			expect(title(result[0])).toBe('Section');
 			expect(result[0].headingLevel).toBe(2);
 		});
 
 		it('creates multiple sections for sequential H2s', () => {
 			const result = sections('## One\n\n## Two\n\n## Three');
 			expect(result).toHaveLength(3);
-			expect(result.map(s => s.title)).toEqual(['One', 'Two', 'Three']);
+			expect(result.map(s => title(s))).toEqual(['One', 'Two', 'Three']);
 		});
 
 		it('groups content nodes under their section', () => {
@@ -59,9 +63,9 @@ describe('groupSections', () => {
 		it('returns an untitled intro section followed by headed sections', () => {
 			const result = sections('intro text\n\n## Section');
 			expect(result).toHaveLength(2);
-			expect(result[0].title).toBe('');
+			expect(result[0].titleNodes).toHaveLength(0);
 			expect(result[0].nodes).toHaveLength(1);
-			expect(result[1].title).toBe('Section');
+			expect(title(result[1])).toBe('Section');
 		});
 	});
 
@@ -69,20 +73,20 @@ describe('groupSections', () => {
 		it('moves content preceding a subsection into its own untitled subsection', () => {
 			const result = sections('## Parent\n\nsome text\n\n### Child');
 			expect(result).toHaveLength(1);
-			expect(result[0].title).toBe('Parent');
+			expect(title(result[0])).toBe('Parent');
 			expect(result[0].nodes).toHaveLength(0);
 			expect(result[0].subsections).toHaveLength(2);
-			expect(result[0].subsections[0].title).toBe('');
+			expect(result[0].subsections[0].titleNodes).toHaveLength(0);
 			expect(result[0].subsections[0].nodes).toHaveLength(1);
-			expect(result[0].subsections[1].title).toBe('Child');
+			expect(title(result[0].subsections[1])).toBe('Child');
 		});
 
 		it('skips the untitled subsection when no content precedes the deeper heading', () => {
 			const result = sections('## Parent\n\n### Child');
 			expect(result).toHaveLength(1);
-			expect(result[0].title).toBe('Parent');
+			expect(title(result[0])).toBe('Parent');
 			expect(result[0].subsections).toHaveLength(1);
-			expect(result[0].subsections[0].title).toBe('Child');
+			expect(title(result[0].subsections[0])).toBe('Child');
 		});
 	});
 
@@ -91,19 +95,19 @@ describe('groupSections', () => {
 			const result = sections('## Parent\n\n### Child');
 			expect(result).toHaveLength(1);
 			expect(result[0].subsections).toHaveLength(1);
-			expect(result[0].subsections[0].title).toBe('Child');
+			expect(title(result[0].subsections[0])).toBe('Child');
 		});
 
 		it('promotes H3 to top-level when no parent section exists', () => {
 			const result = sections('### Orphan');
 			expect(result).toHaveLength(1);
-			expect(result[0].title).toBe('Orphan');
+			expect(title(result[0])).toBe('Orphan');
 		});
 
 		it('creates multiple subsections under one parent', () => {
 			const result = sections('## Parent\n\n### A\n\n### B');
 			expect(result).toHaveLength(1);
-			expect(result[0].subsections.map(s => s.title)).toEqual(['A', 'B']);
+			expect(result[0].subsections.map(s => title(s))).toEqual(['A', 'B']);
 		});
 	});
 

package/src/utils/groupSections.ts

@@ -1,9 +1,7 @@
-import type { RootContent } from 'mdast';
-
-import { extractText } from './extractText';
+import type { PhrasingContent, RootContent } from 'mdast';
 
 export type Section = {
-	title: string;
+	titleNodes: PhrasingContent[];
 	headingLevel: number;
 	nodes: RootContent[];
 	subsections: Section[];
@@ -37,7 +35,7 @@ const consumeNode = (
 		// instead of: Parent { nodes: [...], subsections: [Child] }
 		if (section.nodes.length > 0) {
 			const subSection: Section = {
-				title: '',
+				titleNodes: [],
 				headingLevel: section.headingLevel,
 				nodes: section.nodes,
 				subsections: [],
@@ -47,7 +45,7 @@ const consumeNode = (
 			section.nodes = [];
 		}
 		const subsection: Section = {
-			title: extractText(node.children),
+			titleNodes: node.children,
 			headingLevel,
 			nodes: [],
 			subsections: [],
@@ -59,7 +57,7 @@ const consumeNode = (
 
 	if (!section.previousSection) {
 		const subSection: Section = {
-			title: extractText(node.children),
+			titleNodes: node.children,
 			headingLevel,
 			nodes: [],
 			subsections: [],
@@ -74,7 +72,7 @@ const consumeNode = (
 
 export const groupSections = (nodes: RootContent[]): Section[] => {
 	const initialSection: Section = {
-		title: '',
+		titleNodes: [],
 		headingLevel: Infinity,
 		nodes: [],
 		subsections: [],
@@ -82,5 +80,5 @@ export const groupSections = (nodes: RootContent[]): Section[] => {
 	};
 	const sections: Section[] = [initialSection];
 	consumeNode(nodes, 0, sections, initialSection);
-	return sections.filter(s => s.title !== '' || s.nodes.length > 0);
+	return sections.filter(s => s.titleNodes.length > 0 || s.nodes.length > 0);
 };

package/src/utils/renderMarkdown.test.tsx

@@ -17,13 +17,16 @@ vi.mock('@san-siva/blogkit', () => ({
 
 import { renderMarkdownAst, stripRedundantSectionTitle } from './renderMarkdown';
 import type { Section } from './groupSections';
+import type { PhrasingContent } from 'mdast';
+
+const textNode = (value: string): PhrasingContent => ({ type: 'text', value });
 
 const makeSection = (
-	title: string,
+	titleNodes: PhrasingContent[] = [],
 	nodes: Section['nodes'] = [],
 	subsections: Section[] = []
 ): Section => ({
-	title,
+	titleNodes,
 	headingLevel: 2,
 	nodes,
 	subsections,
@@ -33,45 +36,45 @@ const parse = (md: string): Root =>
 	unified().use(remarkParse).use(remarkGfm).parse(md) as Root;
 
 describe('stripRedundantSectionTitle', () => {
-	it('clears the section title when isTitleEmpty is false and the section has nodes', () => {
-		const grouped = [makeSection('My Title', [{ type: 'paragraph', children: [] }])];
+	it('clears titleNodes when isTitleEmpty is false and the section has nodes', () => {
+		const grouped = [makeSection([textNode('My Title')], [{ type: 'paragraph', children: [] }])];
 		stripRedundantSectionTitle(grouped, false);
-		expect(grouped[0].title).toBe('');
+		expect(grouped[0].titleNodes).toHaveLength(0);
 	});
 
-	it('clears the section title when isTitleEmpty is false and the section has subsections', () => {
-		const sub = makeSection('Sub', [{ type: 'paragraph', children: [] }]);
-		const grouped = [makeSection('My Title', [], [sub])];
+	it('clears titleNodes when isTitleEmpty is false and the section has subsections', () => {
+		const sub = makeSection([textNode('Sub')], [{ type: 'paragraph', children: [] }]);
+		const grouped = [makeSection([textNode('My Title')], [], [sub])];
 		stripRedundantSectionTitle(grouped, false);
-		expect(grouped[0].title).toBe('');
+		expect(grouped[0].titleNodes).toHaveLength(0);
 	});
 
-	it('does not clear the title when isTitleEmpty is true', () => {
-		const grouped = [makeSection('My Title', [{ type: 'paragraph', children: [] }])];
+	it('does not clear titleNodes when isTitleEmpty is true', () => {
+		const grouped = [makeSection([textNode('My Title')], [{ type: 'paragraph', children: [] }])];
 		stripRedundantSectionTitle(grouped, true);
-		expect(grouped[0].title).toBe('My Title');
+		expect(grouped[0].titleNodes).toEqual([textNode('My Title')]);
 	});
 
-	it('does not clear the title when there are multiple sections', () => {
+	it('does not clear titleNodes when there are multiple sections', () => {
 		const grouped = [
-			makeSection('Title A', [{ type: 'paragraph', children: [] }]),
-			makeSection('Title B', [{ type: 'paragraph', children: [] }]),
+			makeSection([textNode('Title A')], [{ type: 'paragraph', children: [] }]),
+			makeSection([textNode('Title B')], [{ type: 'paragraph', children: [] }]),
 		];
 		stripRedundantSectionTitle(grouped, false);
-		expect(grouped[0].title).toBe('Title A');
-		expect(grouped[1].title).toBe('Title B');
+		expect(grouped[0].titleNodes).toEqual([textNode('Title A')]);
+		expect(grouped[1].titleNodes).toEqual([textNode('Title B')]);
 	});
 
-	it('does not clear the title when the section has no nodes or subsections', () => {
-		const grouped = [makeSection('My Title')];
+	it('does not clear titleNodes when the section has no nodes or subsections', () => {
+		const grouped = [makeSection([textNode('My Title')])];
 		stripRedundantSectionTitle(grouped, false);
-		expect(grouped[0].title).toBe('My Title');
+		expect(grouped[0].titleNodes).toEqual([textNode('My Title')]);
 	});
 
-	it('does not clear the title when it is already empty', () => {
-		const grouped = [makeSection('', [{ type: 'paragraph', children: [] }])];
+	it('does not clear titleNodes when they are already empty', () => {
+		const grouped = [makeSection([], [{ type: 'paragraph', children: [] }])];
 		stripRedundantSectionTitle(grouped, false);
-		expect(grouped[0].title).toBe('');
+		expect(grouped[0].titleNodes).toHaveLength(0);
 	});
 });
 
@@ -100,12 +103,19 @@ describe('renderMarkdownAst', () => {
 	it('preserves the section title when isTitleEmpty is true', () => {
 		const result = renderMarkdownAst(parse('## Section\n\nSome content'), true);
 		const section = result.sections[0] as React.ReactElement;
-		expect(section.props.title).toBe('Section');
+		const titleEl = section.props.title as React.ReactElement;
+		expect(titleEl.type).toBe('p');
+		expect(titleEl.props.children).toEqual(['Section']);
 	});
 
 	it('preserves titles of all sections when there are multiple sections', () => {
 		const result = renderMarkdownAst(parse('## One\n\n## Two'), false);
-		const titles = (result.sections as React.ReactElement[]).map(s => s.props.title);
-		expect(titles).toEqual(['One', 'Two']);
+		const titleEls = (result.sections as React.ReactElement[]).map(
+			s => s.props.title as React.ReactElement
+		);
+		expect(titleEls[0].type).toBe('p');
+		expect(titleEls[0].props.children).toEqual(['One']);
+		expect(titleEls[1].type).toBe('p');
+		expect(titleEls[1].props.children).toEqual(['Two']);
 	});
 });

package/src/utils/renderMarkdown.tsx

@@ -155,18 +155,16 @@ function renderNode({
 				item => item.checked !== null && item.checked !== undefined
 			);
 			if (isTaskList) {
-				const items: CheckListItem[] = node.children.map((item, index) => ({
-					id: String(index),
-					isChecked: item.checked === true,
-					children: item.children.map((child, childIndex) =>
-						renderNode({
-							node: child as RootContent,
-							key: childIndex,
-							inList: true,
-							counters,
-						})
-					),
-				}));
+				const items: CheckListItem[] = node.children.map((item, index) => {
+					const para = item.children.find(c => c.type === 'paragraph');
+					const children =
+						para?.type === 'paragraph' ? (
+							<p>{renderPhrasingContent(para.children)}</p>
+						) : (
+							<p />
+						);
+					return { id: String(index), isChecked: item.checked === true, children };
+				});
 				return <CheckList key={key} items={items} hasMarginUp hasMarginDown />;
 			}
 			const Tag = node.ordered ? 'ol' : 'ul';
@@ -207,8 +205,11 @@ function renderSection(
 	counters: Counters,
 	key = -1
 ): React.ReactNode {
+	const title = section.titleNodes.length > 0
+		? <p>{renderPhrasingContent(section.titleNodes)}</p>
+		: '';
 	return (
-		<BlogSection key={key} title={section?.title ?? ''}>
+		<BlogSection key={key} title={title}>
 			{renderNodes(section.nodes, counters)}
 			{section.subsections.map((subsection, index) =>
 				renderSection(subsection, counters, index)
@@ -226,9 +227,9 @@ export function stripRedundantSectionTitle(
 	isTitleEmpty: boolean
 ): void {
 	if (!isTitleEmpty && grouped.length === 1) {
-		const [{ title, nodes, subsections }] = grouped;
-		if (title.length > 0 && (nodes.length > 0 || subsections.length > 0)) {
-			grouped[0].title = '';
+		const [{ titleNodes, nodes, subsections }] = grouped;
+		if (titleNodes.length > 0 && (nodes.length > 0 || subsections.length > 0)) {
+			grouped[0].titleNodes = [];
 		}
 	}
 }