Skip to content

Interface: Mermaid

mermaid.Mermaid

Properties

contentLoaded

contentLoaded: () => void

Type declaration

▸ (): void

##contentLoaded Callback function that is called when page is loaded. This functions fetches configuration for mermaid rendering and calls init for rendering the mermaid diagrams on the page.

Returns

void

Defined in

packages/mermaid/src/mermaid.ts:436


detectType

detectType: (text: string, config?: MermaidConfig) => string

Type declaration

▸ (text, config?): string

Detects the type of the graph text.

Takes into consideration the possible existence of an %%init directive

Parameters
NameTypeDescription
textstringThe text defining the graph. For example: mermaid %%{initialize: {"startOnLoad": true, logLevel: "fatal" }}%% graph LR a-->b b-->c c-->d d-->e e-->f f-->g g-->h
config?MermaidConfigThe mermaid config.
Returns

string

A graph definition key

Defined in

packages/mermaid/src/mermaid.ts:438


init

init: (config?: MermaidConfig, nodes?: string | HTMLElement | NodeListOf<HTMLElement>, callback?: (id: string) => unknown) => Promise<void>

Deprecated

Use initialize and run instead.

Type declaration

▸ (config?, nodes?, callback?): Promise<void>

Parameters
NameType
config?MermaidConfig
nodes?string | HTMLElement | NodeListOf<HTMLElement>
callback?(id: string) => unknown
Returns

Promise<void>

Defined in

packages/mermaid/src/mermaid.ts:431


initialize

initialize: (config: MermaidConfig) => void

Type declaration

▸ (config): void

Used to set configurations for mermaid. This function should be called before the run function.

Parameters
NameTypeDescription
configMermaidConfigConfiguration object for mermaid.
Returns

void

Defined in

packages/mermaid/src/mermaid.ts:435


mermaidAPI

mermaidAPI: Readonly<{ defaultConfig: MermaidConfig = configApi.defaultConfig; getConfig: () => MermaidConfig = configApi.getConfig; getDiagramFromText: (text: string, metadata: Pick<DiagramMetadata, "title">) => Promise<Diagram> ; getSiteConfig: () => MermaidConfig = configApi.getSiteConfig; globalReset: () => void ; initialize: (userOptions: MermaidConfig) => void ; parse: (text: string, parseOptions: ParseOptions & { suppressErrors: true }) => Promise<ParseResult | false>(text: string, parseOptions?: ParseOptions) => Promise<ParseResult> ; render: (id: string, text: string, svgContainingElement?: Element) => Promise<RenderResult> ; reset: () => void ; setConfig: (conf: MermaidConfig) => MermaidConfig = configApi.setConfig; updateSiteConfig: (conf: MermaidConfig) => MermaidConfig = configApi.updateSiteConfig }>

Deprecated

Use parse and render instead. Please open a discussion if your use case does not fit the new API.

Defined in

packages/mermaid/src/mermaid.ts:425


parse

parse: (text: string, parseOptions: ParseOptions & { suppressErrors: true }) => Promise<ParseResult | false>(text: string, parseOptions?: ParseOptions) => Promise<ParseResult>

Type declaration

▸ (text, parseOptions): Promise<ParseResult | false>

Parse the text and validate the syntax.

Parameters
NameTypeDescription
textstringThe mermaid diagram definition.
parseOptionsParseOptions & { suppressErrors: true }Options for parsing.
Returns

Promise<ParseResult | false>

An object with the diagramType set to type of the diagram if valid. Otherwise false if parseOptions.suppressErrors is true.

See

ParseOptions

Throws

Error if the diagram is invalid and parseOptions.suppressErrors is false or not set.

▸ (text, parseOptions?): Promise<ParseResult>

Parameters
NameType
textstring
parseOptions?ParseOptions
Returns

Promise<ParseResult>

Defined in

packages/mermaid/src/mermaid.ts:426


parseError

Optional parseError: ParseErrorFunction

Defined in

packages/mermaid/src/mermaid.ts:420


registerExternalDiagrams

registerExternalDiagrams: (diagrams: ExternalDiagramDefinition[], opts: { lazyLoad?: boolean = true }) => Promise<void>

Type declaration

▸ (diagrams, opts?): Promise<void>

Used to register external diagram types.

Parameters
NameTypeDefault valueDescription
diagramsExternalDiagramDefinition[]undefinedArray of ExternalDiagramDefinition.
optsObject{}If opts.lazyLoad is false, the diagrams will be loaded immediately.
opts.lazyLoad?booleantrue-
Returns

Promise<void>

Defined in

packages/mermaid/src/mermaid.ts:434


registerIconPacks

registerIconPacks: (iconLoaders: IconLoader[]) => void

Type declaration

▸ (iconLoaders): void

Parameters
NameType
iconLoadersIconLoader[]
Returns

void

Defined in

packages/mermaid/src/mermaid.ts:439


registerLayoutLoaders

registerLayoutLoaders: (loaders: LayoutLoaderDefinition[]) => void

Type declaration

▸ (loaders): void

Parameters
NameType
loadersLayoutLoaderDefinition[]
Returns

void

Defined in

packages/mermaid/src/mermaid.ts:433


render

render: (id: string, text: string, svgContainingElement?: Element) => Promise<RenderResult>

Type declaration

▸ (id, text, svgContainingElement?): Promise<RenderResult>

Parameters
NameType
idstring
textstring
svgContainingElement?Element
Returns

Promise<RenderResult>

Defined in

packages/mermaid/src/mermaid.ts:427


run

run: (options: RunOptions) => Promise<void>

Type declaration

▸ (options?): Promise<void>

run

Function that goes through the document to find the chart definitions in there and render them.

The function tags the processed attributes with the attribute data-processed and ignores found elements with the attribute already set. This way the init function can be triggered several times.

Renders the mermaid diagrams

Parameters
NameTypeDescription
optionsRunOptionsOptional runtime configs
Returns

Promise<void>

Defined in

packages/mermaid/src/mermaid.ts:432


setParseErrorHandler

setParseErrorHandler: (parseErrorHandler: (err: any, hash: any) => void) => void

Type declaration

▸ (parseErrorHandler): void

setParseErrorHandler Alternative to directly setting parseError using:

js
mermaid.parseError = function (err, hash) {
  forExampleDisplayErrorInGui(err); // do something with the error
};

This is provided for environments where the mermaid object can't directly have a new member added to it (eg. dart interop wrapper). (Initially there is no parseError member of mermaid).

Parameters
NameTypeDescription
parseErrorHandler(err: any, hash: any) => voidNew parseError() callback.
Returns

void

Defined in

packages/mermaid/src/mermaid.ts:437


startOnLoad

startOnLoad: boolean

Defined in

packages/mermaid/src/mermaid.ts:419