${callouts[canonicalizeCallout(calloutType)]}
${title}
`
- }
+ }
- const blockquoteContent: (BlockContent | DefinitionContent)[] = [titleNode]
- if (remainingText.length > 0) {
- blockquoteContent.push({
- type: 'paragraph',
- children: [{
- type: 'text',
- value: remainingText,
- }]
+ const blockquoteContent: (BlockContent | DefinitionContent)[] = [titleNode]
+ if (remainingText.length > 0) {
+ blockquoteContent.push({
+ type: 'paragraph',
+ children: [{
+ type: 'text',
+ value: remainingText,
+ }]
- })
- }
+ })
+ }
- // replace first line of blockquote with title and rest of the paragraph text
- node.children.splice(0, 1, ...blockquoteContent)
+ // replace first line of blockquote with title and rest of the paragraph text
+ node.children.splice(0, 1, ...blockquoteContent)
- // add properties to base blockquote
- node.data = {
- hProperties: {
- ...(node.data?.hProperties ?? {}),
- className: `callout ${collapse ? "is-collapsible" : ""} ${defaultState === "collapsed" ? "is-collapsed" : ""}`,
- "data-callout": calloutType,
- "data-callout-fold": collapse,
+ // add properties to base blockquote
+ node.data = {
+ hProperties: {
+ ...(node.data?.hProperties ?? {}),
+ className: `callout ${collapse ? "is-collapsible" : ""} ${defaultState === "collapsed" ? "is-collapsed" : ""}`,
+ "data-callout": calloutType,
+ "data-callout-fold": collapse,
+ }
}
}
- }
- })
- }
- })
+ })
+ }
+ })
+ }
+ return plugins
+ },
+
+ htmlPlugins() {
+ return [rehypeRaw]
}
-
- return plugins
- }
-
- htmlPlugins(): PluggableList {
- return [rehypeRaw]
}
}
diff --git a/quartz/plugins/transformers/syntax.ts b/quartz/plugins/transformers/syntax.ts
index f09daaa5..16424ec8 100644
--- a/quartz/plugins/transformers/syntax.ts
+++ b/quartz/plugins/transformers/syntax.ts
@@ -1,15 +1,12 @@
-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 {
+export const SyntaxHighlighting: QuartzTransformerPlugin = () => ({
+ name: "SyntaxHighlighting",
+ markdownPlugins() {
return []
- }
-
- htmlPlugins(): PluggableList {
+ },
+ htmlPlugins() {
return [[rehypePrettyCode, {
theme: 'css-variables',
onVisitLine(node) {
@@ -25,4 +22,4 @@ export class SyntaxHighlighting extends QuartzTransformerPlugin {
},
} satisfies Partial