1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
|
import Markdoc, {
type Config as MarkdocConfig,
type RenderableTreeNode,
type Schema,
} from '@markdoc/markdoc';
import Slugger from 'github-slugger';
import { getTextContent } from './runtime.js';
import { MarkdocError } from './utils.js';
function getSlug(
attributes: Record<string, any>,
children: RenderableTreeNode[],
headingSlugger: Slugger,
experimentalHeadingIdCompat: boolean,
): string {
if (attributes.id && typeof attributes.id === 'string') {
return attributes.id;
}
const textContent = attributes.content ?? getTextContent(children);
let slug = headingSlugger.slug(textContent);
if (!experimentalHeadingIdCompat) {
if (slug.endsWith('-')) slug = slug.slice(0, -1);
}
return slug;
}
type HeadingIdConfig = MarkdocConfig & {
ctx: { headingSlugger: Slugger; experimentalHeadingIdCompat: boolean };
};
/*
Expose standalone node for users to import in their config.
Allows users to apply a custom `render: AstroComponent`
and spread our default heading attributes.
*/
export const heading: Schema = {
children: ['inline'],
attributes: {
id: { type: String },
level: { type: Number, required: true, default: 1 },
},
transform(node, config: HeadingIdConfig) {
const { level, ...attributes } = node.transformAttributes(config);
const children = node.transformChildren(config);
if (!config.ctx?.headingSlugger) {
throw new MarkdocError({
message:
'Unexpected problem adding heading IDs to Markdoc file. Did you modify the `ctx.headingSlugger` property in your Markdoc config?',
});
}
const slug = getSlug(
attributes,
children,
config.ctx.headingSlugger,
config.ctx.experimentalHeadingIdCompat,
);
const render = config.nodes?.heading?.render ?? `h${level}`;
const tagProps =
// For components, pass down `level` as a prop,
// alongside `__collectHeading` for our `headings` collector.
// Avoid accidentally rendering `level` as an HTML attribute otherwise!
typeof render === 'string'
? { ...attributes, id: slug }
: { ...attributes, id: slug, __collectHeading: true, level };
return new Markdoc.Tag(render, tagProps, children);
},
};
// Called internally to ensure `ctx` is generated per-file, instead of per-build.
export function setupHeadingConfig(experimentalHeadingIdCompat: boolean): HeadingIdConfig {
const headingSlugger = new Slugger();
return {
ctx: {
headingSlugger,
experimentalHeadingIdCompat,
},
nodes: {
heading,
},
};
}
|
