API
parseMermaidToExcalidraw: its config options, what it returns and the errors it throws.
parseMermaidToExcalidraw
parseMermaidToExcalidraw(
definition: string,
config?: MermaidConfig,
): Promise<MermaidToExcalidrawResult>Parses and lays out a Mermaid definition, and resolves to Excalidraw element skeletons. Pass them to convertToExcalidrawElements to get elements you can add to a scene (see Getting started).
import { parseMermaidToExcalidraw } from "@excalidraw/mermaid-to-excalidraw";
const { elements, files } = await parseMermaidToExcalidraw(definition, {
elbow: true,
themeVariables: { fontSize: "25px" },
});Config
config takes a subset of Mermaid's config. Other Mermaid options are ignored.
| Option | Type | Default | Description |
|---|---|---|---|
elbow | boolean | { flowchart?: boolean; state?: boolean } | false | Draws flowchart edges and state diagram transitions as elbow arrows: true for both, or per diagram type, e.g. { flowchart: true }. Swimlane edges are always elbow arrows. A curve set in the definition itself (front matter or a %%{init}%% directive) wins. |
themeVariables.fontSize | string | "20px" | The font size of labels, e.g. "25px". Nodes are sized for it. |
maxEdges | number | 500 | The most edges Pele parses in a diagram. |
maxTextSize | number | 50000 | The most characters Pele parses in a definition. |
The type is exported as MermaidConfig:
import type { MermaidConfig } from "@excalidraw/mermaid-to-excalidraw";With elbow: true, edges become elbow arrows:
Result
interface MermaidToExcalidrawResult {
elements: ExcalidrawElementSkeleton[];
files?: BinaryFiles;
}| Field | Description |
|---|---|
elements | The diagram as ExcalidrawElementSkeletons. Labels are bound to their shapes, and flowchart edges and state transitions to the shapes they connect. |
files | Set when the diagram is inserted as an image (diagram types that aren't converted to elements). Add them with excalidrawAPI.addFiles(Object.values(files)). |
Errors
The promise rejects when the definition isn't valid Mermaid syntax, or Pele can't parse it. The error message follows Mermaid's format, so you can show it to users as is.
Last updated on
