Internal link in Mermaid with defined link instead of node text

Use case or problem

In Mermaid it’s possible to create a node that links to a file, for example:

flowchart TB
node("Example")
class node internal-link;

However with the method it seems like you can only link to the full text of the node.

I was wondering if there was a way to have a display text, and a file separately.

Example / Proposed solution

Example 1:

flowchart TB
node("This is an example||example")
class node internal-link;

Example 2:

flowchart TB
node("This is an example")
class node internal-link-Example;

In these examples the text of the node would be “This is an example” - but the link would refer to the “example” file.

I would propose something like the second example, because the first one example messes with vanilla Mermaid and literally displays “This is an example||example”

Current workaround (optional)

The current workaround is to add extra nodes with just the exact text for linking purposes, but it adds extra unnecessary nodes to my diagram

Related feature requests (optional)

I need this feature too

not pretty and definitely a hack, but this is a workaround:

node["<a class='internal-link is-unresolved' href='path/to/file'>display text</a>"]

Thanks so much for finally making an alias.

1 Like