Justin Fowler
2024-02-02 8a6ebd193933c2879c2a36e1b2f164889575d3bc
quartz/plugins/transformers/syntax.ts
@@ -1,28 +1,20 @@
import { PluggableList } from "unified"
import { QuartzTransformerPlugin } from "../types"
import rehypePrettyCode, { Options as CodeOptions } from "rehype-pretty-code"
export class SyntaxHighlighting extends QuartzTransformerPlugin {
  name = "SyntaxHighlighting"
  markdownPlugins(): PluggableList {
    return []
  }
  htmlPlugins(): PluggableList {
    return [[rehypePrettyCode, {
      theme: 'css-variables',
      onVisitLine(node) {
        if (node.children.length === 0) {
          node.children = [{ type: 'text', value: ' ' }]
        }
      },
      onVisitHighlightedLine(node) {
        node.properties.className.push('highlighted')
      },
      onVisitHighlightedWord(node) {
        node.properties.className = ['word']
      },
    } satisfies Partial<CodeOptions>]]
  }
}
export const SyntaxHighlighting: QuartzTransformerPlugin = () => ({
  name: "SyntaxHighlighting",
  htmlPlugins() {
    return [
      [
        rehypePrettyCode,
        {
          keepBackground: false,
          theme: {
            dark: "github-dark",
            light: "github-light",
          },
        } satisfies Partial<CodeOptions>,
      ],
    ]
  },
})