Adding mermaid plugin

[vlrevolution]

Is there any way to add mermaid support?

Perhaps with this: https://github.com/remcohaszing/rehype-mermaidjs

[longnguyen2004]

You can look at the Plugin type and the gfm plugin wrapper to see how to add a plugin yourself

[vlrevolution]

Thank you, I realized that it is simpler than it seemed at first. I will try soon!

[abdelaliz]

I am also trying to get this to work but am still struggling with initializing the plugin properly. How can one pass an options object to a rehype plugin?

I might be wrong, but the createParser method does not seem to take plugins options into consideration

export const createParser = (plugins: Plugin[]): Parser => {
    const processor = unified()
        .use(remarkParse)
        .use(plugins.map((plugin) => plugin.remarkPlugin).filter(nonNullable))
        .use(remarkRehype, { allowDangerousHtml: true })
        .use(plugins.map((plugin) => plugin.rehypePlugin).filter(nonNullable))
        .use(rehypeReactClassNameToSvelteClass);
    return (md: string) => processor.runSync(processor.parse(md), md);
};

[longnguyen2004]

You supply the option as the 2nd array element https://github.com/ssssota/svelte-exmarkdown/blob/98af8a6455875da21d8759d7650accc8b8058ad3/src/lib/gfm/index.ts#L5

[rishikanthc]

Did anyone manage to get mermaid working ? I've not been able to get it to work..

[ssssota]

Plugin overview page in the document is using mermaid to render rendering flow.

You can check the source code: https://github.com/ssssota/svelte-exmarkdown/tree/93e8d9646d827c8993382eecb57a4da04bf6bbf8/src/routes/docs/_mermaid (I must migrate it to runes)

[rishikanthc]

Thank you. Exactly what I needed.