Configure Mermaid Renderer

Environment: client

This setup function will only run on client side. Make sure the browser compatibility when importing packages.

1. The user installs the Mermaid library they want to use. e.g.) npm install beautiful-mermaid
2. Create ./setup/mermaid-renderer.ts with the following content:

// setup/mermaid-renderer.ts
import { defineMermaidRendererSetup } from '@slidev/types'
// example. https://github.com/lukilabs/beautiful-mermaid?tab=readme-ov-file#readme
import { renderMermaid } from 'beautiful-mermaid'

export default defineMermaidRendererSetup(() => {
  return (code, _options) => renderMermaid(code)
})

This setting allows you to use the 3rd party Mermaid library. Replace the renderMermaid() part with the render function of the library.