Skip to content

Feature Request: Ability to initialize mermaid.js with icon packs #789

@ApolonTorq

Description

@ApolonTorq

I want to be able to use icons and multiple icon packs within Mermaid diagrams for Retype sites. See below for an example of the style of markdown. The rendered equivalent shows up with question marks when the icon packs aren't loaded.

See this link for an example of the initialization form needed to set up icon packs for Mermaid.js.
https://docs.mermaidchart.com/mermaid-oss/config/icons.html

The feature being requested is the ability to add an initialization script in the retype _includes/head.html file, which has access to the Mermaid object for initialization of icon packs and also for any other Mermaid.js initialization options in general. This would allow retype authors to be able to add sets of icon packs such as Font Awesome, Azure icons, AWS icons etc.

Example Markdown

```mermaid
flowchart LR
    A(("User")) --> B{"Process"}
    B --> C["Result"]
    A@{ icon: "fa:user"}
    B@{ icon: "fa:copy"}
    C@{ icon: "fa:window-restore"}

What it looks like in a retype render:

Image

What I'd like it to look like in terms of icon rendering:

Image

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions