(wiki) fix rendering nested headings in ToC
This commit is contained in:
parent
6862bdebeb
commit
bdb78b7eac
|
@ -8,6 +8,27 @@ interface Props {
|
||||||
headings: MarkdownHeading[];
|
headings: MarkdownHeading[];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export type Nested = MarkdownHeading & { children?: MarkdownHeading[] };
|
||||||
|
|
||||||
|
|
||||||
|
function fold(headings: MarkdownHeading[]): Nested[] {
|
||||||
|
const toc = [] as Nested[];
|
||||||
|
const map = new Map<number, Nested>();
|
||||||
|
for (const h of headings) {
|
||||||
|
const heading = { ...h };
|
||||||
|
map.set(heading.depth, heading);
|
||||||
|
if (heading.depth === 2)
|
||||||
|
toc.push(heading)
|
||||||
|
else {
|
||||||
|
const backref = map.get(heading.depth - 1)!;
|
||||||
|
backref.children
|
||||||
|
? backref.children.push(heading)
|
||||||
|
: backref.children = [heading];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return toc;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
const { headings } = Astro.props;
|
const { headings } = Astro.props;
|
||||||
---
|
---
|
||||||
|
@ -16,5 +37,7 @@ const { headings } = Astro.props;
|
||||||
<span class="link-tree__heading-text">Content</span>
|
<span class="link-tree__heading-text">Content</span>
|
||||||
</h2>
|
</h2>
|
||||||
<nav id="table-of-contents" class="link-tree__nav">
|
<nav id="table-of-contents" class="link-tree__nav">
|
||||||
<HeadingsList headings={Maybe.of(headings)} />
|
<HeadingsList
|
||||||
|
headings={Maybe.of(headings).map(fold)}
|
||||||
|
/>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
|
@ -1,38 +1,17 @@
|
||||||
---
|
---
|
||||||
import type { MarkdownHeading } from 'astro';
|
|
||||||
import { Maybe } from 'purify-ts';
|
import { Maybe } from 'purify-ts';
|
||||||
|
import type { Nested } from './Headings.astro';
|
||||||
|
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
headings: Maybe<MarkdownHeading[]>;
|
headings: Maybe<Nested[]>;
|
||||||
}
|
}
|
||||||
|
|
||||||
type Nested = MarkdownHeading & { children?: MarkdownHeading[] };
|
|
||||||
|
|
||||||
|
|
||||||
const { headings } = Astro.props;
|
const { headings } = Astro.props;
|
||||||
|
|
||||||
function fold(headings: MarkdownHeading[]) {
|
|
||||||
const toc = [] as Nested[];
|
|
||||||
const map = new Map<number, Nested>();
|
|
||||||
for (const h of headings) {
|
|
||||||
const heading = { ...h };
|
|
||||||
map.set(heading.depth, heading);
|
|
||||||
if (heading.depth === 2)
|
|
||||||
toc.push(heading)
|
|
||||||
else {
|
|
||||||
const backref = map.get(heading.depth - 1)!;
|
|
||||||
backref.children
|
|
||||||
? backref.children.push(heading)
|
|
||||||
: backref.children = [heading];
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return toc;
|
|
||||||
}
|
|
||||||
---
|
---
|
||||||
|
|
||||||
{headings
|
{headings
|
||||||
.map(fold)
|
|
||||||
.map(headings =>
|
.map(headings =>
|
||||||
<ul class="link-tree__nav-list">
|
<ul class="link-tree__nav-list">
|
||||||
{headings.map(heading =>
|
{headings.map(heading =>
|
||||||
|
|
Loading…
Reference in a new issue