Updated parser typing + Mermaid parser

quartz/plugins/parsers/custom/default.ts

@@ -24,20 +24,18 @@ export const CustomDefault: QuartzParserPlugin<Partial<Options>> = (userOpts) =>
     },
     markdownPlugins(_ctx) {
       const plug: Pluggable = (tree: Root, _file) => {
-        if (opts.enabled) {
         const replacements: [RegExp, string | ReplaceFunction][] = []
         mdastFindReplace(tree, replacements)
       }
-      }
       return plug
     },
     htmlPlugins(_ctx) {
       const plug: Pluggable = () => {}
       return plug
     },
-    externalResources(_ctx) {
+    externalResources() {
-      const js = [] as JSResource[]
+      const js = {} as JSResource
-      return { js }
+      return js
     },
   }
 }

quartz/plugins/parsers/obsidian/arrows.ts

@@ -31,9 +31,11 @@ export const ObsidianArrow: QuartzParserPlugin<Partial<Options>> = (userOpts) =>
   return {
     name: "ObsidianArrow",
     textTransform(_ctx, src: string | Buffer) {
+      if (opts.enabled) {
         if (src instanceof Buffer) {
           src = src.toString()
         }
+      }
       return src
     },
     markdownPlugins(_ctx) {
@@ -60,9 +62,9 @@ export const ObsidianArrow: QuartzParserPlugin<Partial<Options>> = (userOpts) =>
       const plug: Pluggable = () => {}
       return plug
     },
-    externalResources(_ctx) {
+    externalResources() {
-      const js = [] as JSResource[]
+      const js = {} as JSResource
-      return { js }
+      return js
     },
   }
 }

quartz/plugins/parsers/obsidian/callouts.ts

@@ -68,14 +68,15 @@ export const ObsidianCallouts: QuartzParserPlugin<Partial<Options>> = (userOpts)
   return {
     name: "ObsidianCallouts",
     textTransform(_ctx, src: string | Buffer) {
+      if (opts.enabled) {
         if (src instanceof Buffer) {
           src = src.toString()
         }
-
         src = src.replace(calloutLineRegex, (value) => {
           // force newline after title of callout
           return value + "\n> "
         })
+      }
 
       return src
     },
@@ -190,14 +191,16 @@ export const ObsidianCallouts: QuartzParserPlugin<Partial<Options>> = (userOpts)
       const plug: Pluggable = () => {}
       return plug
     },
-    externalResources(_ctx) {
+    externalResources() {
-      const js = [] as JSResource[]
+      if (opts.enabled) {
-      js.push({
+        const js: JSResource = {
           script: calloutScript,
           loadTime: "afterDOMReady",
           contentType: "inline",
-      })
+        }
-      return { js }
+        return js
+      }
+      return {} as JSResource
     },
   }
 }

quartz/plugins/parsers/obsidian/comments.ts

@@ -19,12 +19,13 @@ export const ObsidianComments: QuartzParserPlugin<Partial<Options>> = (userOpts)
   return {
     name: "ObsidianComments",
     textTransform(_ctx, src: string | Buffer) {
-      // do comments at text level
+      if (opts.enabled) {
         if (src instanceof Buffer) {
           src = src.toString()
         }
 
         src = src.replace(commentRegex, "")
+      }
 
       return src
     },
@@ -41,9 +42,9 @@ export const ObsidianComments: QuartzParserPlugin<Partial<Options>> = (userOpts)
       const plug: Pluggable = () => {}
       return plug
     },
-    externalResources(_ctx) {
+    externalResources() {
-      const js = [] as JSResource[]
+      const js = {} as JSResource
-      return { js }
+      return js
     },
   }
 }

quartz/plugins/parsers/obsidian/highlights.ts

@@ -19,9 +19,11 @@ export const ObsidianHighlights: QuartzParserPlugin<Partial<Options>> = (userOpt
   return {
     name: "ObsidianHighlights",
     textTransform(_ctx, src: string | Buffer) {
+      if (opts.enabled) {
         if (src instanceof Buffer) {
           src = src.toString()
         }
+      }
       return src
     },
     markdownPlugins(_ctx) {
@@ -47,9 +49,9 @@ export const ObsidianHighlights: QuartzParserPlugin<Partial<Options>> = (userOpt
       const plug: Pluggable = () => {}
       return plug
     },
-    externalResources(_ctx) {
+    externalResources() {
-      const js = [] as JSResource[]
+      const js = {} as JSResource
-      return { js }
+      return js
     },
   }
 }

quartz/plugins/parsers/obsidian/index.ts

@@ -2,4 +2,5 @@ export { ObsidianArrow } from "./arrows"
 export { ObsidianCallouts } from "./callouts"
 export { ObsidianComments } from "./comments"
 export { ObsidianHighlights } from "./highlights"
+export { ObsidianMermaid } from "./mermaid"
 export { ObsidianWikilinks } from "./wikilinks"

quartz/plugins/parsers/obsidian/mermaid.ts

@@ -0,0 +1,78 @@
+import { QuartzParserPlugin } from "../../types"
+import { JSResource } from "../../../util/resources"
+import { visit } from "unist-util-visit"
+import { Root, Code } from "mdast"
+import { Pluggable } from "unified"
+
+interface Options {
+  enabled: Boolean
+}
+
+const defaultOptions: Options = {
+  enabled: true,
+}
+
+export const ObsidianMermaid: QuartzParserPlugin<Partial<Options>> = (userOpts) => {
+  const opts: Options = { ...defaultOptions, ...userOpts }
+  return {
+    name: "ObsidianMermaid",
+    textTransform(_ctx, src: string | Buffer) {
+      if (opts.enabled) {
+        if (src instanceof Buffer) {
+          src = src.toString()
+        }
+      }
+      return src
+    },
+    markdownPlugins(_ctx) {
+      const plug: Pluggable = (tree: Root, _file) => {
+        if (opts.enabled) {
+          visit(tree, "code", (node: Code) => {
+            if (node.lang === "mermaid") {
+              node.data = {
+                hProperties: {
+                  className: ["mermaid"],
+                },
+              }
+            }
+          })
+        }
+      }
+      return plug
+    },
+    htmlPlugins(_ctx) {
+      const plug: Pluggable = () => {}
+      return plug
+    },
+    externalResources() {
+      if (opts.enabled) {
+        const js: JSResource = {
+          script: `
+            let mermaidImport = undefined
+            document.addEventListener('nav', async () => {
+              if (document.querySelector("code.mermaid")) {
+                mermaidImport ||= await import('https://cdnjs.cloudflare.com/ajax/libs/mermaid/10.7.0/mermaid.esm.min.mjs')
+                const mermaid = mermaidImport.default
+                const darkMode = document.documentElement.getAttribute('saved-theme') === 'dark'
+                mermaid.initialize({
+                  startOnLoad: false,
+                  securityLevel: 'loose',
+                  theme: darkMode ? 'dark' : 'default'
+                })
+  
+                await mermaid.run({
+                  querySelector: '.mermaid'
+                })
+              }
+            });
+            `,
+          loadTime: "afterDOMReady",
+          moduleType: "module",
+          contentType: "inline",
+        }
+        return js
+      }
+      return {} as JSResource
+    },
+  }
+}

quartz/plugins/parsers/obsidian/wikilinks.ts

@@ -80,7 +80,6 @@ export const ObsidianWikilinks: QuartzParserPlugin<Partial<Options>> = (userOpts
     },
     markdownPlugins(_ctx) {
       const plug: Pluggable = (tree: Root, path) => {
-        if (opts.enabled) {
         const replacements: [RegExp, string | ReplaceFunction][] = []
         replacements.push([
           wikilinkRegex,
@@ -115,9 +114,7 @@ export const ObsidianWikilinks: QuartzParserPlugin<Partial<Options>> = (userOpts
                   type: "html",
                   value: `<video src="${url}" controls></video>`,
                 }
-                } else if (
+              } else if ([".mp3", ".webm", ".wav", ".m4a", ".ogg", ".3gp", ".flac"].includes(ext)) {
-                  [".mp3", ".webm", ".wav", ".m4a", ".ogg", ".3gp", ".flac"].includes(ext)
-                ) {
                 return {
                   type: "html",
                   value: `<audio src="${url}" controls></audio>`,
@@ -157,16 +154,15 @@ export const ObsidianWikilinks: QuartzParserPlugin<Partial<Options>> = (userOpts
         ])
         mdastFindReplace(tree, replacements)
       }
-      }
       return plug
     },
     htmlPlugins(_ctx) {
       const plug: Pluggable = () => {}
       return plug
     },
-    externalResources(_ctx) {
+    externalResources() {
-      const js = [] as JSResource[]
+      const js = {} as JSResource
-      return { js }
+      return js
     },
   }
 }

quartz/plugins/transformers/markdown.ts

@@ -40,6 +40,7 @@ import {
   ObsidianCallouts,
   ObsidianComments,
   ObsidianHighlights,
+  ObsidianMermaid,
   ObsidianWikilinks,
 } from "../parsers/obsidian"
 
@@ -206,6 +207,7 @@ export const ObsidianFlavoredMarkdown: QuartzTransformerPlugin<Partial<ObsidianO
       plugins.push(ObsidianHighlights({ enabled: opts.highlight }).markdownPlugins(ctx))
       plugins.push(ObsidianArrow({ enabled: opts.parseArrows }).markdownPlugins(ctx))
       plugins.push(ObsidianCallouts({ enabled: opts.callouts }).markdownPlugins(ctx))
+      plugins.push(ObsidianMermaid({ enabled: opts.mermaid }).markdownPlugins(ctx))
 
       return plugins
     },
@@ -219,6 +221,9 @@ export const ObsidianFlavoredMarkdown: QuartzTransformerPlugin<Partial<ObsidianO
     externalResources() {
       const js: JSResource[] = []
 
+      js.push(ObsidianCallouts({ enabled: opts.callouts }).externalResources() as JSResource)
+      js.push(ObsidianMermaid({ enabled: opts.mermaid }).externalResources() as JSResource)
+
       return { js }
     },
   }

quartz/plugins/types.ts

@@ -1,5 +1,5 @@
 import { PluggableList, Pluggable } from "unified"
-import { StaticResources } from "../util/resources"
+import { JSResource, StaticResources } from "../util/resources"
 import { ProcessedContent } from "./vfile"
 import { QuartzComponent } from "../components/types"
 import { FilePath } from "../util/path"
@@ -55,5 +55,5 @@ export type QuartzParserPluginInstance = {
   textTransform: (ctx: BuildCtx, src: string | Buffer) => string | Buffer
   markdownPlugins: (ctx: BuildCtx) => Pluggable
   htmlPlugins: (ctx: BuildCtx) => Pluggable
-  externalResources: (ctx: BuildCtx) => Partial<StaticResources>
+  externalResources: () => JSResource | string
 }