heading.transform() — astro Function Reference

Architecture documentation for the heading.transform() function in heading-ids.ts from the astro codebase.

Function typescript CoreAstro RoutingSystem calls 1

Entity Profile

CoreAstro→ RoutingSystem→ heading.transform() — astro Function Reference

Dependency Diagram

graph TD
  e4e19689_8b6e_a761_609c_9df4ca836232["heading.transform()"]
  d811757b_f0ec_7a3f_0ab1_72f873fa4618["heading-ids.ts"]
  e4e19689_8b6e_a761_609c_9df4ca836232 -->|defined in| d811757b_f0ec_7a3f_0ab1_72f873fa4618
  6de01015_c794_57fb_07f7_e76abc339720["getSlug()"]
  e4e19689_8b6e_a761_609c_9df4ca836232 -->|calls| 6de01015_c794_57fb_07f7_e76abc339720
  style e4e19689_8b6e_a761_609c_9df4ca836232 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/integrations/markdoc/src/heading-ids.ts lines 37–60

	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);

		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);
	},