webapp/mdx.config.ts
2022-10-04 14:38:57 +03:00

35 lines
1.1 KiB
TypeScript

import type { AstroUserConfig } from 'astro'
import type { RehypePlugin } from '@astrojs/markdown-remark'
import { selectAll } from 'hast-util-select'
import rehypeToc from '@jsdevtools/rehype-toc'
import rehypeAutolinkHeadings from 'rehype-autolink-headings'
import rehypeSlug from 'rehype-slug'
import remarkCodeTitles from 'remark-code-titles'
const write =
(cl) =>
({ properties }) => {
properties.className = properties.className ? properties.className + ' ' + cl : cl
}
const adder = ([selector, className]) => {
const writer = write(className)
return (node) => selectAll(selector, node).forEach((el) => writer(el as any))
}
const addClasses = (additions) => {
const adders = Object.entries(additions).map((entry) => adder(entry))
return (node) => adders.forEach((a) => a(node))
}
export const markdownOptions: AstroUserConfig['markdown'] = {
remarkPlugins: [remarkCodeTitles],
rehypePlugins: [
rehypeSlug,
[rehypeToc as RehypePlugin<any[]>, { headings: ['h1', 'h2', 'h3'] }],
[rehypeAutolinkHeadings, { behavior: 'prepend' }],
[addClasses, { 'h1,h2,h3': 'title' }]
],
extendDefaultPlugins: true
}