Mermaid types you can edit visually

The visual editor supports seven Mermaid types. Those seven are the ones where a canvas gesture maps cleanly onto a source change; the others do not have that property.

For anything else, the code pane is the editor.

#What this is for

Checking whether the diagram you have can be edited visually.
Choosing a Mermaid type for a diagram other people will edit.
Understanding why the button is missing.

#How it works

Action	How
Flowchart	Full support: nodes, edges, shapes and labels.
Sequence diagram	Participants and messages.
Class diagram	Classes and relationships.
State diagram	States and transitions.
Entity relationship	Entities and relationships.
Mind map	Nodes and hierarchy.
Git graph	Commits and branches.

#A few things that catch people out

If the visual editor button is missing, the diagram is a type it does not support. That is expected.
Choosing flowchart over a more exotic type makes a diagram easier for colleagues to edit later.
Support is per type, not per diagram. Nothing about your diagram disables it.

Select, move and rename on canvas

The three gestures you need first.

Connect Mermaid shapes

Alt and drag.

Mermaid visual editor

Back to the editor overview.

Drag it. The text keeps up.