Add headings to the component.

peterguy · peterguy · commit 0c2e8b56db85 · 2025-04-08T14:44:16.000-07:00
diff --git a/src/components/mdx/Heading.tsx b/src/components/mdx/Heading.tsx
@@ -58,13 +58,13 @@ function Anchor({id, children}: {id: string; children: ReactNode}) {
 }
 
 interface HeadingProps {
-	level?: '2' | '3';
+	level?: '2' | '3' | '4' | '5';
 	id: string;
 	props: any;
 }
 
 export function Heading({level = '2', id, props}: HeadingProps) {
-	let Component = `h${level}` as 'h2' | 'h3';
+	let Component = `h${level}` as 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
 	return (
 		<Component {...props}>
 			<Anchor id={id}>{props.children}</Anchor>

Original file line number	Diff line number	Diff line change
`@@ -58,13 +58,13 @@ function Anchor({id, children}: {id: string; children: ReactNode}) {`
`58`	`58`	`}`
`59`	`59`
`60`	`60`	`interface HeadingProps {`
`61`		`- level?: '2' \| '3';`
	`61`	`+ level?: '2' \| '3' \| '4' \| '5';`
`62`	`62`	`id: string;`
`63`	`63`	`props: any;`
`64`	`64`	`}`
`65`	`65`
`66`	`66`	`export function Heading({level = '2', id, props}: HeadingProps) {`
`67`		- let Component = `h${level}` as 'h2' \| 'h3';
	`67`	+ let Component = `h${level}` as 'h2' \| 'h3' \| 'h4' \| 'h5' \| 'h6';
`68`	`68`	`return (`
`69`	`69`	`<Component {...props}>`
`70`	`70`	`<Anchor id={id}>{props.children}</Anchor>`