Merge pull request #4821 from mermaid-js/sidv/deprecateMermaidAPI

chore: Deprecate mermaidAPI
This commit is contained in:
Sidharth Vinod 2024-06-28 11:42:18 +05:30 committed by GitHub
commit ceb487f2d4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
33 changed files with 1340 additions and 507 deletions

View File

@ -10,4 +10,4 @@
- [config](modules/config.md)
- [defaultConfig](modules/defaultConfig.md)
- [mermaidAPI](modules/mermaidAPI.md)
- [mermaid](modules/mermaid.md)

View File

@ -0,0 +1,171 @@
> **Warning**
>
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
>
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/classes/mermaid.UnknownDiagramError.md](../../../../packages/mermaid/src/docs/config/setup/classes/mermaid.UnknownDiagramError.md).
# Class: UnknownDiagramError
[mermaid](../modules/mermaid.md).UnknownDiagramError
## Hierarchy
- `Error`
**`UnknownDiagramError`**
## Constructors
### constructor
**new UnknownDiagramError**(`message`): [`UnknownDiagramError`](mermaid.UnknownDiagramError.md)
#### Parameters
| Name | Type |
| :-------- | :------- |
| `message` | `string` |
#### Returns
[`UnknownDiagramError`](mermaid.UnknownDiagramError.md)
#### Overrides
Error.constructor
#### Defined in
[packages/mermaid/src/errors.ts:2](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/errors.ts#L2)
## Properties
### cause
`Optional` **cause**: `unknown`
#### Inherited from
Error.cause
#### Defined in
node_modules/.pnpm/typescript\@5.4.5/node_modules/typescript/lib/lib.es2022.error.d.ts:24
---
### message
**message**: `string`
#### Inherited from
Error.message
#### Defined in
node_modules/.pnpm/typescript\@5.4.5/node_modules/typescript/lib/lib.es5.d.ts:1077
---
### name
**name**: `string`
#### Inherited from
Error.name
#### Defined in
node_modules/.pnpm/typescript\@5.4.5/node_modules/typescript/lib/lib.es5.d.ts:1076
---
### stack
`Optional` **stack**: `string`
#### Inherited from
Error.stack
#### Defined in
node_modules/.pnpm/typescript\@5.4.5/node_modules/typescript/lib/lib.es5.d.ts:1078
---
### prepareStackTrace
`Static` `Optional` **prepareStackTrace**: (`err`: `Error`, `stackTraces`: `CallSite`\[]) => `any`
Optional override for formatting stack traces
**`See`**
<https://v8.dev/docs/stack-trace-api#customizing-stack-traces>
#### Type declaration
▸ (`err`, `stackTraces`): `any`
##### Parameters
| Name | Type |
| :------------ | :------------ |
| `err` | `Error` |
| `stackTraces` | `CallSite`\[] |
##### Returns
`any`
#### Inherited from
Error.prepareStackTrace
#### Defined in
node_modules/@types/node/globals.d.ts:28
---
### stackTraceLimit
`Static` **stackTraceLimit**: `number`
#### Inherited from
Error.stackTraceLimit
#### Defined in
node_modules/@types/node/globals.d.ts:30
## Methods
### captureStackTrace
**captureStackTrace**(`targetObject`, `constructorOpt?`): `void`
Create .stack property on a target object
#### Parameters
| Name | Type |
| :---------------- | :--------- |
| `targetObject` | `object` |
| `constructorOpt?` | `Function` |
#### Returns
`void`
#### Inherited from
Error.captureStackTrace
#### Defined in
node_modules/@types/node/globals.d.ts:21

View File

@ -0,0 +1,49 @@
> **Warning**
>
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
>
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.DetailedError.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.DetailedError.md).
# Interface: DetailedError
[mermaid](../modules/mermaid.md).DetailedError
## Properties
### error
`Optional` **error**: `any`
#### Defined in
[packages/mermaid/src/utils.ts:789](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L789)
---
### hash
**hash**: `any`
#### Defined in
[packages/mermaid/src/utils.ts:787](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L787)
---
### message
`Optional` **message**: `string`
#### Defined in
[packages/mermaid/src/utils.ts:790](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L790)
---
### str
**str**: `string`
#### Defined in
[packages/mermaid/src/utils.ts:785](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/utils.ts#L785)

View File

@ -0,0 +1,39 @@
> **Warning**
>
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
>
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.ExternalDiagramDefinition.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.ExternalDiagramDefinition.md).
# Interface: ExternalDiagramDefinition
[mermaid](../modules/mermaid.md).ExternalDiagramDefinition
## Properties
### detector
**detector**: `DiagramDetector`
#### Defined in
[packages/mermaid/src/diagram-api/types.ts:101](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L101)
---
### id
**id**: `string`
#### Defined in
[packages/mermaid/src/diagram-api/types.ts:100](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L100)
---
### loader
**loader**: `DiagramLoader`
#### Defined in
[packages/mermaid/src/diagram-api/types.ts:102](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/diagram-api/types.ts#L102)

View File

@ -0,0 +1,340 @@
> **Warning**
>
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
>
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.Mermaid.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.Mermaid.md).
# Interface: Mermaid
[mermaid](../modules/mermaid.md).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:425](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L425)
---
### detectType
**detectType**: (`text`: `string`, `config?`: [`MermaidConfig`](mermaid.MermaidConfig.md)) => `string`
#### Type declaration
▸ (`text`, `config?`): `string`
Detects the type of the graph text.
Takes into consideration the possible existence of an `%%init` directive
##### Parameters
| Name | Type | Description |
| :-------- | :------------------------------------------ | :------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| `text` | `string` | The 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?` | [`MermaidConfig`](mermaid.MermaidConfig.md) | The mermaid config. |
##### Returns
`string`
A graph definition key
#### Defined in
[packages/mermaid/src/mermaid.ts:427](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L427)
---
### init
**init**: (`config?`: [`MermaidConfig`](mermaid.MermaidConfig.md), `nodes?`: `string` | `HTMLElement` | `NodeListOf`<`HTMLElement`>, `callback?`: (`id`: `string`) => `unknown`) => `Promise`<`void`>
**`Deprecated`**
Use [initialize](mermaid.Mermaid.md#initialize) and [run](mermaid.Mermaid.md#run) instead.
#### Type declaration
▸ (`config?`, `nodes?`, `callback?`): `Promise`<`void`>
##### Parameters
| Name | Type |
| :---------- | :------------------------------------------------------- |
| `config?` | [`MermaidConfig`](mermaid.MermaidConfig.md) |
| `nodes?` | `string` \| `HTMLElement` \| `NodeListOf`<`HTMLElement`> |
| `callback?` | (`id`: `string`) => `unknown` |
##### Returns
`Promise`<`void`>
#### Defined in
[packages/mermaid/src/mermaid.ts:421](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L421)
---
### initialize
**initialize**: (`config`: [`MermaidConfig`](mermaid.MermaidConfig.md)) => `void`
#### Type declaration
▸ (`config`): `void`
Used to set configurations for mermaid.
This function should be called before the run function.
##### Parameters
| Name | Type | Description |
| :------- | :------------------------------------------ | :-------------------------------- |
| `config` | [`MermaidConfig`](mermaid.MermaidConfig.md) | Configuration object for mermaid. |
##### Returns
`void`
#### Defined in
[packages/mermaid/src/mermaid.ts:424](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L424)
---
### mermaidAPI
**mermaidAPI**: `Readonly`<{ `defaultConfig`: [`MermaidConfig`](mermaid.MermaidConfig.md) = configApi.defaultConfig; `getConfig`: () => [`MermaidConfig`](mermaid.MermaidConfig.md) = configApi.getConfig; `getDiagramFromText`: (`text`: `string`, `metadata`: `Pick`<`DiagramMetadata`, `"title"`>) => `Promise`<`Diagram`> ; `getSiteConfig`: () => [`MermaidConfig`](mermaid.MermaidConfig.md) = configApi.getSiteConfig; `globalReset`: () => `void` ; `initialize`: (`options`: [`MermaidConfig`](mermaid.MermaidConfig.md)) => `void` ; `parse`: (`text`: `string`, `parseOptions`: [`ParseOptions`](mermaid.ParseOptions.md) & { `suppressErrors`: `true` }) => `Promise`<[`ParseResult`](mermaid.ParseResult.md) | `false`>(`text`: `string`, `parseOptions?`: [`ParseOptions`](mermaid.ParseOptions.md)) => `Promise`<[`ParseResult`](mermaid.ParseResult.md)> ; `render`: (`id`: `string`, `text`: `string`, `svgContainingElement?`: `Element`) => `Promise`<[`RenderResult`](mermaid.RenderResult.md)> ; `reset`: () => `void` ; `setConfig`: (`conf`: [`MermaidConfig`](mermaid.MermaidConfig.md)) => [`MermaidConfig`](mermaid.MermaidConfig.md) = configApi.setConfig; `updateSiteConfig`: (`conf`: [`MermaidConfig`](mermaid.MermaidConfig.md)) => [`MermaidConfig`](mermaid.MermaidConfig.md) = configApi.updateSiteConfig }>
**`Deprecated`**
Use [parse](mermaid.Mermaid.md#parse) and [render](mermaid.Mermaid.md#render) instead. Please [open a discussion](https://github.com/mermaid-js/mermaid/discussions) if your use case does not fit the new API.
#### Defined in
[packages/mermaid/src/mermaid.ts:415](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L415)
---
### parse
**parse**: (`text`: `string`, `parseOptions`: [`ParseOptions`](mermaid.ParseOptions.md) & { `suppressErrors`: `true` }) => `Promise`<[`ParseResult`](mermaid.ParseResult.md) | `false`>(`text`: `string`, `parseOptions?`: [`ParseOptions`](mermaid.ParseOptions.md)) => `Promise`<[`ParseResult`](mermaid.ParseResult.md)>
#### Type declaration
▸ (`text`, `parseOptions`): `Promise`<[`ParseResult`](mermaid.ParseResult.md) | `false`>
Parse the text and validate the syntax.
##### Parameters
| Name | Type | Description |
| :------------- | :----------------------------------------------------------------------- | :------------------------------ |
| `text` | `string` | The mermaid diagram definition. |
| `parseOptions` | [`ParseOptions`](mermaid.ParseOptions.md) & { `suppressErrors`: `true` } | Options for parsing. |
##### Returns
`Promise`<[`ParseResult`](mermaid.ParseResult.md) | `false`>
An object with the `diagramType` set to type of the diagram if valid. Otherwise `false` if parseOptions.suppressErrors is `true`.
**`See`**
[ParseOptions](mermaid.ParseOptions.md)
**`Throws`**
Error if the diagram is invalid and parseOptions.suppressErrors is false or not set.
▸ (`text`, `parseOptions?`): `Promise`<[`ParseResult`](mermaid.ParseResult.md)>
##### Parameters
| Name | Type |
| :-------------- | :---------------------------------------- |
| `text` | `string` |
| `parseOptions?` | [`ParseOptions`](mermaid.ParseOptions.md) |
##### Returns
`Promise`<[`ParseResult`](mermaid.ParseResult.md)>
#### Defined in
[packages/mermaid/src/mermaid.ts:416](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L416)
---
### parseError
`Optional` **parseError**: [`ParseErrorFunction`](../modules/mermaid.md#parseerrorfunction)
#### Defined in
[packages/mermaid/src/mermaid.ts:410](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L410)
---
### registerExternalDiagrams
**registerExternalDiagrams**: (`diagrams`: [`ExternalDiagramDefinition`](mermaid.ExternalDiagramDefinition.md)\[], `opts`: { `lazyLoad?`: `boolean` = true }) => `Promise`<`void`>
#### Type declaration
▸ (`diagrams`, `opts?`): `Promise`<`void`>
Used to register external diagram types.
##### Parameters
| Name | Type | Default value | Description |
| :--------------- | :--------------------------------------------------------------------- | :------------ | :-------------------------------------------------------------------------- |
| `diagrams` | [`ExternalDiagramDefinition`](mermaid.ExternalDiagramDefinition.md)\[] | `undefined` | Array of [ExternalDiagramDefinition](mermaid.ExternalDiagramDefinition.md). |
| `opts` | `Object` | `{}` | If opts.lazyLoad is false, the diagrams will be loaded immediately. |
| `opts.lazyLoad?` | `boolean` | `true` | - |
##### Returns
`Promise`<`void`>
#### Defined in
[packages/mermaid/src/mermaid.ts:423](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L423)
---
### render
**render**: (`id`: `string`, `text`: `string`, `svgContainingElement?`: `Element`) => `Promise`<[`RenderResult`](mermaid.RenderResult.md)>
#### Type declaration
▸ (`id`, `text`, `svgContainingElement?`): `Promise`<[`RenderResult`](mermaid.RenderResult.md)>
##### Parameters
| Name | Type |
| :---------------------- | :-------- |
| `id` | `string` |
| `text` | `string` |
| `svgContainingElement?` | `Element` |
##### Returns
`Promise`<[`RenderResult`](mermaid.RenderResult.md)>
#### Defined in
[packages/mermaid/src/mermaid.ts:417](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L417)
---
### run
**run**: (`options`: [`RunOptions`](mermaid.RunOptions.md)) => `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.
```mermaid-example
graph LR;
a(Find elements)-->b{Processed}
b-->|Yes|c(Leave element)
b-->|No |d(Transform)
```
```mermaid
graph LR;
a(Find elements)-->b{Processed}
b-->|Yes|c(Leave element)
b-->|No |d(Transform)
```
Renders the mermaid diagrams
##### Parameters
| Name | Type | Description |
| :-------- | :------------------------------------ | :----------------------- |
| `options` | [`RunOptions`](mermaid.RunOptions.md) | Optional runtime configs |
##### Returns
`Promise`<`void`>
#### Defined in
[packages/mermaid/src/mermaid.ts:422](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L422)
---
### 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
| Name | Type | Description |
| :------------------ | :-------------------------------------- | :------------------------- |
| `parseErrorHandler` | (`err`: `any`, `hash`: `any`) => `void` | New parseError() callback. |
##### Returns
`void`
#### Defined in
[packages/mermaid/src/mermaid.ts:426](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L426)
---
### startOnLoad
**startOnLoad**: `boolean`
#### Defined in
[packages/mermaid/src/mermaid.ts:409](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L409)

View File

@ -0,0 +1,467 @@
> **Warning**
>
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
>
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.MermaidConfig.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.MermaidConfig.md).
# Interface: MermaidConfig
[mermaid](../modules/mermaid.md).MermaidConfig
## Properties
### altFontFamily
`Optional` **altFontFamily**: `string`
#### Defined in
[packages/mermaid/src/config.type.ts:85](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L85)
---
### arrowMarkerAbsolute
`Optional` **arrowMarkerAbsolute**: `boolean`
Controls whether or arrow markers in html code are absolute paths or anchors.
This matters if you are using base tag settings.
#### Defined in
[packages/mermaid/src/config.type.ts:104](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L104)
---
### block
`Optional` **block**: `BlockDiagramConfig`
#### Defined in
[packages/mermaid/src/config.type.ts:162](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L162)
---
### c4
`Optional` **c4**: `C4DiagramConfig`
#### Defined in
[packages/mermaid/src/config.type.ts:159](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L159)
---
### class
`Optional` **class**: `ClassDiagramConfig`
#### Defined in
[packages/mermaid/src/config.type.ts:150](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L150)
---
### darkMode
`Optional` **darkMode**: `boolean`
#### Defined in
[packages/mermaid/src/config.type.ts:76](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L76)
---
### deterministicIDSeed
`Optional` **deterministicIDSeed**: `string`
This option is the optional seed for deterministic ids.
If set to `undefined` but deterministicIds is `true`, a simple number iterator is used.
You can set this attribute to base the seed on a static string.
#### Defined in
[packages/mermaid/src/config.type.ts:144](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L144)
---
### deterministicIds
`Optional` **deterministicIds**: `boolean`
This option controls if the generated ids of nodes in the SVG are
generated randomly or based on a seed.
If set to `false`, the IDs are generated based on the current date and
thus are not deterministic. This is the default behavior.
This matters if your files are checked into source control e.g. git and
should not change unless content is changed.
#### Defined in
[packages/mermaid/src/config.type.ts:137](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L137)
---
### dompurifyConfig
`Optional` **dompurifyConfig**: `Config`
#### Defined in
[packages/mermaid/src/config.type.ts:163](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L163)
---
### er
`Optional` **er**: `ErDiagramConfig`
#### Defined in
[packages/mermaid/src/config.type.ts:152](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L152)
---
### flowchart
`Optional` **flowchart**: `FlowchartDiagramConfig`
#### Defined in
[packages/mermaid/src/config.type.ts:145](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L145)
---
### fontFamily
`Optional` **fontFamily**: `string`
Specifies the font to be used in the rendered diagrams.
Can be any possible CSS `font-family`.
See <https://developer.mozilla.org/en-US/docs/Web/CSS/font-family>
#### Defined in
[packages/mermaid/src/config.type.ts:84](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L84)
---
### fontSize
`Optional` **fontSize**: `number`
#### Defined in
[packages/mermaid/src/config.type.ts:165](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L165)
---
### forceLegacyMathML
`Optional` **forceLegacyMathML**: `boolean`
This option forces Mermaid to rely on KaTeX's own stylesheet for rendering MathML. Due to differences between OS
fonts and browser's MathML implementation, this option is recommended if consistent rendering is important.
If set to true, ignores legacyMathML.
#### Defined in
[packages/mermaid/src/config.type.ts:126](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L126)
---
### gantt
`Optional` **gantt**: `GanttDiagramConfig`
#### Defined in
[packages/mermaid/src/config.type.ts:147](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L147)
---
### gitGraph
`Optional` **gitGraph**: `GitGraphDiagramConfig`
#### Defined in
[packages/mermaid/src/config.type.ts:158](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L158)
---
### htmlLabels
`Optional` **htmlLabels**: `boolean`
#### Defined in
[packages/mermaid/src/config.type.ts:77](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L77)
---
### journey
`Optional` **journey**: `JourneyDiagramConfig`
#### Defined in
[packages/mermaid/src/config.type.ts:148](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L148)
---
### legacyMathML
`Optional` **legacyMathML**: `boolean`
This option specifies if Mermaid can expect the dependent to include KaTeX stylesheets for browsers
without their own MathML implementation. If this option is disabled and MathML is not supported, the math
equations are replaced with a warning. If this option is enabled and MathML is not supported, Mermaid will
fall back to legacy rendering for KaTeX.
#### Defined in
[packages/mermaid/src/config.type.ts:119](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L119)
---
### logLevel
`Optional` **logLevel**: `0` | `2` | `1` | `"trace"` | `"debug"` | `"info"` | `"warn"` | `"error"` | `"fatal"` | `3` | `4` | `5`
This option decides the amount of logging to be used by mermaid.
#### Defined in
[packages/mermaid/src/config.type.ts:90](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L90)
---
### markdownAutoWrap
`Optional` **markdownAutoWrap**: `boolean`
#### Defined in
[packages/mermaid/src/config.type.ts:166](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L166)
---
### maxEdges
`Optional` **maxEdges**: `number`
Defines the maximum number of edges that can be drawn in a graph.
#### Defined in
[packages/mermaid/src/config.type.ts:75](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L75)
---
### maxTextSize
`Optional` **maxTextSize**: `number`
The maximum allowed size of the users text diagram
#### Defined in
[packages/mermaid/src/config.type.ts:70](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L70)
---
### mindmap
`Optional` **mindmap**: `MindmapDiagramConfig`
#### Defined in
[packages/mermaid/src/config.type.ts:157](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L157)
---
### packet
`Optional` **packet**: `PacketDiagramConfig`
#### Defined in
[packages/mermaid/src/config.type.ts:161](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L161)
---
### pie
`Optional` **pie**: `PieDiagramConfig`
#### Defined in
[packages/mermaid/src/config.type.ts:153](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L153)
---
### quadrantChart
`Optional` **quadrantChart**: `QuadrantChartConfig`
#### Defined in
[packages/mermaid/src/config.type.ts:154](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L154)
---
### requirement
`Optional` **requirement**: `RequirementDiagramConfig`
#### Defined in
[packages/mermaid/src/config.type.ts:156](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L156)
---
### sankey
`Optional` **sankey**: `SankeyDiagramConfig`
#### Defined in
[packages/mermaid/src/config.type.ts:160](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L160)
---
### secure
`Optional` **secure**: `string`\[]
This option controls which `currentConfig` keys are considered secure and
can only be changed via call to `mermaid.initialize`.
This prevents malicious graph directives from overriding a site's default security.
#### Defined in
[packages/mermaid/src/config.type.ts:111](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L111)
---
### securityLevel
`Optional` **securityLevel**: `"strict"` | `"loose"` | `"antiscript"` | `"sandbox"`
Level of trust for parsed diagram
#### Defined in
[packages/mermaid/src/config.type.ts:94](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L94)
---
### sequence
`Optional` **sequence**: `SequenceDiagramConfig`
#### Defined in
[packages/mermaid/src/config.type.ts:146](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L146)
---
### startOnLoad
`Optional` **startOnLoad**: `boolean`
Dictates whether mermaid starts on Page load
#### Defined in
[packages/mermaid/src/config.type.ts:98](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L98)
---
### state
`Optional` **state**: `StateDiagramConfig`
#### Defined in
[packages/mermaid/src/config.type.ts:151](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L151)
---
### suppressErrorRendering
`Optional` **suppressErrorRendering**: `boolean`
Suppresses inserting 'Syntax error' diagram in the DOM.
This is useful when you want to control how to handle syntax errors in your application.
#### Defined in
[packages/mermaid/src/config.type.ts:172](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L172)
---
### theme
`Optional` **theme**: `"default"` | `"forest"` | `"dark"` | `"neutral"` | `"null"`
Theme, the CSS style sheet.
You may also use `themeCSS` to override this value.
#### Defined in
[packages/mermaid/src/config.type.ts:64](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L64)
---
### themeCSS
`Optional` **themeCSS**: `string`
#### Defined in
[packages/mermaid/src/config.type.ts:66](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L66)
---
### themeVariables
`Optional` **themeVariables**: `any`
#### Defined in
[packages/mermaid/src/config.type.ts:65](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L65)
---
### timeline
`Optional` **timeline**: `TimelineDiagramConfig`
#### Defined in
[packages/mermaid/src/config.type.ts:149](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L149)
---
### wrap
`Optional` **wrap**: `boolean`
#### Defined in
[packages/mermaid/src/config.type.ts:164](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L164)
---
### xyChart
`Optional` **xyChart**: `XYChartConfig`
#### Defined in
[packages/mermaid/src/config.type.ts:155](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.type.ts#L155)

View File

@ -2,11 +2,11 @@
>
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
>
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaidAPI.ParseOptions.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaidAPI.ParseOptions.md).
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.ParseOptions.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.ParseOptions.md).
# Interface: ParseOptions
[mermaidAPI](../modules/mermaidAPI.md).ParseOptions
[mermaid](../modules/mermaid.md).ParseOptions
## Properties
@ -19,4 +19,4 @@ The `parseError` function will not be called.
#### Defined in
[mermaidAPI.ts:65](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L65)
[packages/mermaid/src/types.ts:43](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L43)

View File

@ -0,0 +1,21 @@
> **Warning**
>
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
>
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.ParseResult.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.ParseResult.md).
# Interface: ParseResult
[mermaid](../modules/mermaid.md).ParseResult
## Properties
### diagramType
**diagramType**: `string`
The diagram type, e.g. 'flowchart', 'sequence', etc.
#### Defined in
[packages/mermaid/src/types.ts:50](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L50)

View File

@ -2,11 +2,11 @@
>
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
>
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaidAPI.RenderResult.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaidAPI.RenderResult.md).
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.RenderResult.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.RenderResult.md).
# Interface: RenderResult
[mermaidAPI](../modules/mermaidAPI.md).RenderResult
[mermaid](../modules/mermaid.md).RenderResult
## Properties
@ -18,7 +18,7 @@ Bind function to be called after the svg has been inserted into the DOM.
This is necessary for adding event listeners to the elements in the svg.
```js
const { svg, bindFunctions } = mermaidAPI.render('id1', 'graph TD;A-->B');
const { svg, bindFunctions } = await mermaid.render('id1', 'graph TD;A-->B');
div.innerHTML = svg;
bindFunctions?.(div); // To call bindFunctions only if it's present.
```
@ -39,7 +39,7 @@ bindFunctions?.(div); // To call bindFunctions only if it's present.
#### Defined in
[mermaidAPI.ts:95](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L95)
[packages/mermaid/src/types.ts:73](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L73)
---
@ -51,7 +51,7 @@ The diagram type, e.g. 'flowchart', 'sequence', etc.
#### Defined in
[mermaidAPI.ts:85](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L85)
[packages/mermaid/src/types.ts:63](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L63)
---
@ -63,4 +63,4 @@ The svg code for the rendered graph.
#### Defined in
[mermaidAPI.ts:81](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L81)
[packages/mermaid/src/types.ts:59](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L59)

View File

@ -0,0 +1,71 @@
> **Warning**
>
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
>
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaid.RunOptions.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaid.RunOptions.md).
# Interface: RunOptions
[mermaid](../modules/mermaid.md).RunOptions
## Properties
### nodes
`Optional` **nodes**: `ArrayLike`<`HTMLElement`>
The nodes to render. If this is set, `querySelector` will be ignored.
#### Defined in
[packages/mermaid/src/mermaid.ts:39](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L39)
---
### postRenderCallback
`Optional` **postRenderCallback**: (`id`: `string`) => `unknown`
A callback to call after each diagram is rendered.
#### Type declaration
▸ (`id`): `unknown`
##### Parameters
| Name | Type |
| :--- | :------- |
| `id` | `string` |
##### Returns
`unknown`
#### Defined in
[packages/mermaid/src/mermaid.ts:43](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L43)
---
### querySelector
`Optional` **querySelector**: `string`
The query selector to use when finding elements to render. Default: `".mermaid"`.
#### Defined in
[packages/mermaid/src/mermaid.ts:35](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L35)
---
### suppressErrors
`Optional` **suppressErrors**: `boolean`
If `true`, errors will be logged to the console, but not thrown. Default: `false`
#### Defined in
[packages/mermaid/src/mermaid.ts:47](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L47)

View File

@ -1,21 +0,0 @@
> **Warning**
>
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
>
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/interfaces/mermaidAPI.ParseResult.md](../../../../packages/mermaid/src/docs/config/setup/interfaces/mermaidAPI.ParseResult.md).
# Interface: ParseResult
[mermaidAPI](../modules/mermaidAPI.md).ParseResult
## Properties
### diagramType
**diagramType**: `string`
The diagram type, e.g. 'flowchart', 'sequence', etc.
#### Defined in
[mermaidAPI.ts:72](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L72)

View File

@ -10,11 +10,11 @@
### defaultConfig
`Const` **defaultConfig**: `MermaidConfig`
`Const` **defaultConfig**: [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
#### Defined in
[config.ts:8](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L8)
[packages/mermaid/src/config.ts:8](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L8)
## Functions
@ -26,9 +26,9 @@ Pushes in a directive to the configuration
#### Parameters
| Name | Type | Description |
| :---------- | :-------------- | :----------------------- |
| `directive` | `MermaidConfig` | The directive to push in |
| Name | Type | Description |
| :---------- | :-------------------------------------------------------- | :----------------------- |
| `directive` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) | The directive to push in |
#### Returns
@ -36,13 +36,13 @@ Pushes in a directive to the configuration
#### Defined in
[config.ts:188](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L188)
[packages/mermaid/src/config.ts:188](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L188)
---
### getConfig
**getConfig**(): `MermaidConfig`
**getConfig**(): [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
## getConfig
@ -54,19 +54,19 @@ Pushes in a directive to the configuration
#### Returns
`MermaidConfig`
[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
The currentConfig
#### Defined in
[config.ts:131](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L131)
[packages/mermaid/src/config.ts:131](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L131)
---
### getSiteConfig
**getSiteConfig**(): `MermaidConfig`
**getSiteConfig**(): [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
## getSiteConfig
@ -78,13 +78,13 @@ The currentConfig
#### Returns
`MermaidConfig`
[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
The siteConfig
#### Defined in
[config.ts:96](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L96)
[packages/mermaid/src/config.ts:96](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L96)
---
@ -108,9 +108,9 @@ The siteConfig
#### Parameters
| Name | Type | Default value | Description |
| :------- | :-------------- | :------------ | :------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| `config` | `MermaidConfig` | `siteConfig` | base set of values, which currentConfig could be **reset** to. Defaults to the current siteConfig (e.g returned by [getSiteConfig](config.md#getsiteconfig)). |
| Name | Type | Default value | Description |
| :------- | :-------------------------------------------------------- | :------------ | :------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| `config` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) | `siteConfig` | base set of values, which currentConfig could be **reset** to. Defaults to the current siteConfig (e.g returned by [getSiteConfig](config.md#getsiteconfig)). |
#### Returns
@ -118,7 +118,7 @@ The siteConfig
#### Defined in
[config.ts:218](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L218)
[packages/mermaid/src/config.ts:218](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L218)
---
@ -147,7 +147,7 @@ options in-place
#### Defined in
[config.ts:146](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L146)
[packages/mermaid/src/config.ts:146](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L146)
---
@ -157,9 +157,9 @@ options in-place
#### Parameters
| Name | Type |
| :----- | :-------------- |
| `conf` | `MermaidConfig` |
| Name | Type |
| :----- | :-------------------------------------------------------- |
| `conf` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) |
#### Returns
@ -167,13 +167,13 @@ options in-place
#### Defined in
[config.ts:75](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L75)
[packages/mermaid/src/config.ts:75](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L75)
---
### setConfig
**setConfig**(`conf`): `MermaidConfig`
**setConfig**(`conf`): [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
## setConfig
@ -187,25 +187,25 @@ corresponding siteConfig value.
#### Parameters
| Name | Type | Description |
| :----- | :-------------- | :-------------------------- |
| `conf` | `MermaidConfig` | The potential currentConfig |
| Name | Type | Description |
| :----- | :-------------------------------------------------------- | :-------------------------- |
| `conf` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) | The potential currentConfig |
#### Returns
`MermaidConfig`
[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
The currentConfig merged with the sanitized conf
#### Defined in
[config.ts:113](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L113)
[packages/mermaid/src/config.ts:113](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L113)
---
### setSiteConfig
**setSiteConfig**(`conf`): `MermaidConfig`
**setSiteConfig**(`conf`): [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
## setSiteConfig
@ -220,57 +220,57 @@ function _Default value: At default, will mirror Global Config_
#### Parameters
| Name | Type | Description |
| :----- | :-------------- | :------------------------------------------ |
| `conf` | `MermaidConfig` | The base currentConfig to use as siteConfig |
| Name | Type | Description |
| :----- | :-------------------------------------------------------- | :------------------------------------------ |
| `conf` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) | The base currentConfig to use as siteConfig |
#### Returns
`MermaidConfig`
[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
The new siteConfig
#### Defined in
[config.ts:61](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L61)
[packages/mermaid/src/config.ts:61](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L61)
---
### updateCurrentConfig
**updateCurrentConfig**(`siteCfg`, `_directives`): `MermaidConfig`
**updateCurrentConfig**(`siteCfg`, `_directives`): [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
#### Parameters
| Name | Type |
| :------------ | :----------------- |
| `siteCfg` | `MermaidConfig` |
| `_directives` | `MermaidConfig`\[] |
| Name | Type |
| :------------ | :----------------------------------------------------------- |
| `siteCfg` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) |
| `_directives` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)\[] |
#### Returns
`MermaidConfig`
[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
#### Defined in
[config.ts:15](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L15)
[packages/mermaid/src/config.ts:15](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L15)
---
### updateSiteConfig
**updateSiteConfig**(`conf`): `MermaidConfig`
**updateSiteConfig**(`conf`): [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
#### Parameters
| Name | Type |
| :----- | :-------------- |
| `conf` | `MermaidConfig` |
| Name | Type |
| :----- | :-------------------------------------------------------- |
| `conf` | [`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md) |
#### Returns
`MermaidConfig`
[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)
#### Defined in
[config.ts:79](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L79)
[packages/mermaid/src/config.ts:79](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/config.ts#L79)

View File

@ -14,13 +14,13 @@
#### Defined in
[defaultConfig.ts:275](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/defaultConfig.ts#L275)
[packages/mermaid/src/defaultConfig.ts:275](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/defaultConfig.ts#L275)
---
### default
`Const` **default**: `RequiredDeep`<`MermaidConfig`>
`Const` **default**: `RequiredDeep`<[`MermaidConfig`](../interfaces/mermaid.MermaidConfig.md)>
Default mermaid configuration options.
@ -30,4 +30,4 @@ Non-JSON JS default values are listed in this file, e.g. functions, or
#### Defined in
[defaultConfig.ts:18](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/defaultConfig.ts#L18)
[packages/mermaid/src/defaultConfig.ts:18](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/defaultConfig.ts#L18)

View File

@ -0,0 +1,57 @@
> **Warning**
>
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
>
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/modules/mermaid.md](../../../../packages/mermaid/src/docs/config/setup/modules/mermaid.md).
# Module: mermaid
## Classes
- [UnknownDiagramError](../classes/mermaid.UnknownDiagramError.md)
## Interfaces
- [DetailedError](../interfaces/mermaid.DetailedError.md)
- [ExternalDiagramDefinition](../interfaces/mermaid.ExternalDiagramDefinition.md)
- [Mermaid](../interfaces/mermaid.Mermaid.md)
- [MermaidConfig](../interfaces/mermaid.MermaidConfig.md)
- [ParseOptions](../interfaces/mermaid.ParseOptions.md)
- [ParseResult](../interfaces/mermaid.ParseResult.md)
- [RenderResult](../interfaces/mermaid.RenderResult.md)
- [RunOptions](../interfaces/mermaid.RunOptions.md)
## Type Aliases
### ParseErrorFunction
Ƭ **ParseErrorFunction**: (`err`: `string` | [`DetailedError`](../interfaces/mermaid.DetailedError.md) | `unknown`, `hash?`: `any`) => `void`
#### Type declaration
▸ (`err`, `hash?`): `void`
##### Parameters
| Name | Type |
| :------ | :--------------------------------------------------------------------------------- |
| `err` | `string` \| [`DetailedError`](../interfaces/mermaid.DetailedError.md) \| `unknown` |
| `hash?` | `any` |
##### Returns
`void`
#### Defined in
[packages/mermaid/src/Diagram.ts:9](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/Diagram.ts#L9)
## Variables
### default
`Const` **default**: [`Mermaid`](../interfaces/mermaid.Mermaid.md)
#### Defined in
[packages/mermaid/src/mermaid.ts:430](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaid.ts#L430)

View File

@ -1,283 +0,0 @@
> **Warning**
>
> ## THIS IS AN AUTOGENERATED FILE. DO NOT EDIT.
>
> ## Please edit the corresponding file in [/packages/mermaid/src/docs/config/setup/modules/mermaidAPI.md](../../../../packages/mermaid/src/docs/config/setup/modules/mermaidAPI.md).
# Module: mermaidAPI
## Interfaces
- [ParseOptions](../interfaces/mermaidAPI.ParseOptions.md)
- [ParseResult](../interfaces/mermaidAPI.ParseResult.md)
- [RenderResult](../interfaces/mermaidAPI.RenderResult.md)
## References
### default
Renames and re-exports [mermaidAPI](mermaidAPI.md#mermaidapi)
## Type Aliases
### D3Element
Ƭ **D3Element**: `any`
#### Defined in
[mermaidAPI.ts:75](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L75)
## Variables
### mermaidAPI
`Const` **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`: (`options`: `MermaidConfig`) => `void` ; `parse`: (`text`: `string`, `parseOptions`: [`ParseOptions`](../interfaces/mermaidAPI.ParseOptions.md) & { `suppressErrors`: `true` }) => `Promise`<[`ParseResult`](../interfaces/mermaidAPI.ParseResult.md) | `false`>(`text`: `string`, `parseOptions?`: [`ParseOptions`](../interfaces/mermaidAPI.ParseOptions.md)) => `Promise`<[`ParseResult`](../interfaces/mermaidAPI.ParseResult.md)> ; `render`: (`id`: `string`, `text`: `string`, `svgContainingElement?`: `Element`) => `Promise`<[`RenderResult`](../interfaces/mermaidAPI.RenderResult.md)> ; `reset`: () => `void` ; `setConfig`: (`conf`: `MermaidConfig`) => `MermaidConfig` = configApi.setConfig; `updateSiteConfig`: (`conf`: `MermaidConfig`) => `MermaidConfig` = configApi.updateSiteConfig }>
## mermaidAPI configuration defaults
```ts
const config = {
theme: 'default',
logLevel: 'fatal',
securityLevel: 'strict',
startOnLoad: true,
arrowMarkerAbsolute: false,
suppressErrorRendering: false,
er: {
diagramPadding: 20,
layoutDirection: 'TB',
minEntityWidth: 100,
minEntityHeight: 75,
entityPadding: 15,
stroke: 'gray',
fill: 'honeydew',
fontSize: 12,
useMaxWidth: true,
},
flowchart: {
diagramPadding: 8,
htmlLabels: true,
curve: 'basis',
},
sequence: {
diagramMarginX: 50,
diagramMarginY: 10,
actorMargin: 50,
width: 150,
height: 65,
boxMargin: 10,
boxTextMargin: 5,
noteMargin: 10,
messageMargin: 35,
messageAlign: 'center',
mirrorActors: true,
bottomMarginAdj: 1,
useMaxWidth: true,
rightAngles: false,
showSequenceNumbers: false,
},
gantt: {
titleTopMargin: 25,
barHeight: 20,
barGap: 4,
topPadding: 50,
leftPadding: 75,
gridLineStartPadding: 35,
fontSize: 11,
fontFamily: '"Open Sans", sans-serif',
numberSectionStyles: 4,
axisFormat: '%Y-%m-%d',
topAxis: false,
displayMode: '',
},
};
mermaid.initialize(config);
```
#### Defined in
[mermaidAPI.ts:634](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L634)
## Functions
### appendDivSvgG
**appendDivSvgG**(`parentRoot`, `id`, `enclosingDivId`, `divStyle?`, `svgXlink?`): `any`
Append an enclosing div, then svg, then g (group) to the d3 parentRoot. Set attributes.
Only set the style attribute on the enclosing div if divStyle is given.
Only set the xmlns:xlink attribute on svg if svgXlink is given.
Return the last node appended
#### Parameters
| Name | Type | Description |
| :--------------- | :------- | :----------------------------------------------- |
| `parentRoot` | `any` | the d3 node to append things to |
| `id` | `string` | the value to set the id attr to |
| `enclosingDivId` | `string` | the id to set the enclosing div to |
| `divStyle?` | `string` | if given, the style to set the enclosing div to |
| `svgXlink?` | `string` | if given, the link to set the new svg element to |
#### Returns
`any`
- returns the parentRoot that had nodes appended
#### Defined in
[mermaidAPI.ts:276](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L276)
---
### cleanUpSvgCode
**cleanUpSvgCode**(`svgCode?`, `inSandboxMode`, `useArrowMarkerUrls`): `string`
Clean up svgCode. Do replacements needed
#### Parameters
| Name | Type | Default value | Description |
| :------------------- | :-------- | :------------ | :---------------------------------------------------------- |
| `svgCode` | `string` | `''` | the code to clean up |
| `inSandboxMode` | `boolean` | `undefined` | security level |
| `useArrowMarkerUrls` | `boolean` | `undefined` | should arrow marker's use full urls? (vs. just the anchors) |
#### Returns
`string`
the cleaned up svgCode
#### Defined in
[mermaidAPI.ts:223](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L223)
---
### createCssStyles
**createCssStyles**(`config`, `classDefs?`): `string`
Create the user styles
#### Parameters
| Name | Type | Description |
| :---------- | :--------------------------------------------------------------- | :------------------------------------------------------------------------------------------------------------------------ |
| `config` | `MermaidConfig` | configuration that has style and theme settings to use |
| `classDefs` | `undefined` \| `null` \| `Map`<`string`, `DiagramStyleClassDef`> | the classDefs in the diagram text. Might be null if none were defined. Usually is the result of a call to getClasses(...) |
#### Returns
`string`
the string with all the user styles
#### Defined in
[mermaidAPI.ts:154](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L154)
---
### createUserStyles
**createUserStyles**(`config`, `graphType`, `classDefs`, `svgId`): `string`
#### Parameters
| Name | Type |
| :---------- | :----------------------------------------------------- |
| `config` | `MermaidConfig` |
| `graphType` | `string` |
| `classDefs` | `undefined` \| `Map`<`string`, `DiagramStyleClassDef`> |
| `svgId` | `string` |
#### Returns
`string`
#### Defined in
[mermaidAPI.ts:200](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L200)
---
### cssImportantStyles
**cssImportantStyles**(`cssClass`, `element`, `cssClasses?`): `string`
Create a CSS style that starts with the given class name, then the element,
with an enclosing block that has each of the cssClasses followed by !important;
#### Parameters
| Name | Type | Default value | Description |
| :----------- | :---------- | :------------ | :--------------------------------------------- |
| `cssClass` | `string` | `undefined` | CSS class name |
| `element` | `string` | `undefined` | CSS element |
| `cssClasses` | `string`\[] | `[]` | list of CSS styles to append after the element |
#### Returns
`string`
- the constructed string
#### Defined in
[mermaidAPI.ts:139](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L139)
---
### putIntoIFrame
**putIntoIFrame**(`svgCode?`, `svgElement?`): `string`
Put the svgCode into an iFrame. Return the iFrame code
#### Parameters
| Name | Type | Default value | Description |
| :------------ | :------- | :------------ | :--------------------------------------------------------------------------- |
| `svgCode` | `string` | `''` | the svg code to put inside the iFrame |
| `svgElement?` | `any` | `undefined` | the d3 node that has the current svgElement so we can get the height from it |
#### Returns
`string`
- the code with the iFrame that now contains the svgCode
#### Defined in
[mermaidAPI.ts:253](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L253)
---
### removeExistingElements
**removeExistingElements**(`doc`, `id`, `divId`, `iFrameId`): `void`
Remove any existing elements from the given document
#### Parameters
| Name | Type | Description |
| :--------- | :--------- | :------------------------------------ |
| `doc` | `Document` | the document to removed elements from |
| `id` | `string` | id for any existing SVG element |
| `divId` | `string` | - |
| `iFrameId` | `string` | - |
#### Returns
`void`
#### Defined in
[mermaidAPI.ts:326](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L326)

View File

@ -24,12 +24,12 @@ Themes can now be customized at the site-wide level, or on individual Mermaid di
## Site-wide Theme
To customize themes site-wide, call the `initialize` method on the `mermaidAPI`.
To customize themes site-wide, call the `initialize` method on the `mermaid`.
Example of `initialize` call setting `theme` to `base`:
```javascript
mermaidAPI.initialize({
mermaid.initialize({
securityLevel: 'loose',
theme: 'base',
});

View File

@ -193,7 +193,7 @@ await mermaid.run({
### Calling `mermaid.init` - Deprecated
> **Warning**
> mermaid.init is deprecated in v10 and will be removed in v11. Please use mermaid.run instead.
> mermaid.init is deprecated in v10 and will be removed in a future release. Please use mermaid.run instead.
By default, `mermaid.init` will be called when the document is ready, finding all elements with
`class="mermaid"`. If you are adding content after mermaid is loaded, or otherwise need
@ -217,9 +217,6 @@ Or with no config object, and a jQuery selection:
mermaid.init(undefined, $('#someId .yetAnotherClass'));
```
> **Warning**
> This type of integration is deprecated. Instead the preferred way of handling more complex integration is to use the mermaidAPI instead.
## Usage with webpack
mermaid fully supports webpack. Here is a [working demo](https://github.com/mermaidjs/mermaid-webpack-demo).

View File

@ -34,7 +34,7 @@
"scripts": {
"clean": "rimraf dist",
"dev": "pnpm -w dev",
"docs:code": "typedoc src/defaultConfig.ts src/config.ts src/mermaidAPI.ts && prettier --write ./src/docs/config/setup",
"docs:code": "typedoc src/defaultConfig.ts src/config.ts src/mermaid.ts && prettier --write ./src/docs/config/setup",
"docs:build": "rimraf ../../docs && pnpm docs:spellcheck && pnpm docs:code && tsx scripts/docs.cli.mts",
"docs:verify": "pnpm docs:spellcheck && pnpm docs:code && tsx scripts/docs.cli.mts --verify",
"docs:pre:vitepress": "pnpm --filter ./src/docs prefetch && rimraf src/vitepress && pnpm docs:code && tsx scripts/docs.cli.mts --vitepress && pnpm --filter ./src/vitepress install --no-frozen-lockfile --ignore-scripts",

View File

@ -1,6 +1,6 @@
import { MockedD3 } from './tests/MockedD3.js';
import { setA11yDiagramInfo, addSVGa11yTitleDescription } from './accessibility.js';
import type { D3Element } from './mermaidAPI.js';
import type { D3Element } from './types.js';
describe('accessibility', () => {
const fauxSvgNode: MockedD3 = new MockedD3();

View File

@ -5,7 +5,7 @@
* @see https://www.w3.org/TR/wai-aria-1.1/
* @see https://www.w3.org/TR/svg-aam-1.0/
*/
import type { D3Element } from './mermaidAPI.js';
import type { D3Element } from './types.js';
/**
* SVG element role:

View File

@ -104,10 +104,7 @@ export interface MermaidConfig {
arrowMarkerAbsolute?: boolean;
/**
* This option controls which `currentConfig` keys are considered secure and
* can only be changed via call to `mermaidAPI.initialize`.
* Calls to `mermaidAPI.reinitialize` cannot make changes to the secure keys
* in the current `currentConfig`.
*
* can only be changed via call to `mermaid.initialize`.
* This prevents malicious graph directives from overriding a site's default security.
*
*/

View File

@ -1,5 +1,5 @@
import { getConfig } from '../../diagram-api/diagramAPI.js';
import type { D3Element } from '../../mermaidAPI.js';
import type { D3Element } from '../../types.js';
import { sanitizeText } from '../../diagrams/common/common.js';
import { log } from '../../logger.js';
import type { MindmapNode } from './mindmapTypes.js';

View File

@ -6,7 +6,7 @@ import type { MermaidConfig } from '../../config.type.js';
import { getConfig } from '../../diagram-api/diagramAPI.js';
import type { DrawDefinition } from '../../diagram-api/types.js';
import { log } from '../../logger.js';
import type { D3Element } from '../../mermaidAPI.js';
import type { D3Element } from '../../types.js';
import { selectSvgElement } from '../../rendering-util/selectSvgElement.js';
import { setupGraphViewbox } from '../../setupGraphViewbox.js';
import type { FilledMindMapNode, MindmapDB, MindmapNode } from './mindmapTypes.js';

View File

@ -1,7 +1,6 @@
import type { D3Element } from '../../mermaidAPI.js';
import { createText } from '../../rendering-util/createText.js';
import type { FilledMindMapNode, MindmapDB } from './mindmapTypes.js';
import type { Point } from '../../types.js';
import type { Point, D3Element } from '../../types.js';
import { parseFontSize } from '../../utils.js';
import type { MermaidConfig } from '../../config.type.js';

View File

@ -1675,7 +1675,6 @@ it should handle one actor, when textPlacement is ${textPlacement}`, async () =>
sequenceDiagram
participant Alice`;
// mermaidAPI.reinitialize({ sequence: { textPlacement: textPlacement } });
await mermaidAPI.parse(str);
// diagram.renderer.setConf(mermaidAPI.getConfig().sequence);
await diagram.renderer.draw(str, 'tst', '1.2.3', diagram);

View File

@ -18,12 +18,12 @@ Themes can now be customized at the site-wide level, or on individual Mermaid di
## Site-wide Theme
To customize themes site-wide, call the `initialize` method on the `mermaidAPI`.
To customize themes site-wide, call the `initialize` method on the `mermaid`.
Example of `initialize` call setting `theme` to `base`:
```javascript
mermaidAPI.initialize({
mermaid.initialize({
securityLevel: 'loose',
theme: 'base',
});

View File

@ -188,7 +188,7 @@ await mermaid.run({
### Calling `mermaid.init` - Deprecated
```warning
mermaid.init is deprecated in v10 and will be removed in v11. Please use mermaid.run instead.
mermaid.init is deprecated in v10 and will be removed in a future release. Please use mermaid.run instead.
```
By default, `mermaid.init` will be called when the document is ready, finding all elements with
@ -213,10 +213,6 @@ Or with no config object, and a jQuery selection:
mermaid.init(undefined, $('#someId .yetAnotherClass'));
```
```warning
This type of integration is deprecated. Instead the preferred way of handling more complex integration is to use the mermaidAPI instead.
```
## Usage with webpack
mermaid fully supports webpack. Here is a [working demo](https://github.com/mermaidjs/mermaid-webpack-demo).

View File

@ -6,7 +6,7 @@ import { dedent } from 'ts-dedent';
import type { MermaidConfig } from './config.type.js';
import { log } from './logger.js';
import utils from './utils.js';
import type { ParseOptions, ParseResult, RenderResult } from './mermaidAPI.js';
import type { ParseOptions, ParseResult, RenderResult } from './types.js';
import { mermaidAPI } from './mermaidAPI.js';
import { registerLazyLoadedDiagrams, detectType } from './diagram-api/detectType.js';
import { loadRegisteredDiagrams } from './diagram-api/loadDiagram.js';
@ -277,7 +277,7 @@ if (typeof document !== 'undefined') {
* ## setParseErrorHandler Alternative to directly setting parseError using:
*
* ```js
* mermaid.parseError = function(err,hash){=
* mermaid.parseError = function(err,hash) {
* forExampleDisplayErrorInGui(err); // do something with the error
* };
* ```
@ -408,9 +408,16 @@ const render: typeof mermaidAPI.render = (id, text, container) => {
export interface Mermaid {
startOnLoad: boolean;
parseError?: ParseErrorFunction;
/**
* @deprecated Use {@link parse} and {@link render} instead. Please [open a discussion](https://github.com/mermaid-js/mermaid/discussions) if your use case does not fit the new API.
* @internal
*/
mermaidAPI: typeof mermaidAPI;
parse: typeof parse;
render: typeof render;
/**
* @deprecated Use {@link initialize} and {@link run} instead.
*/
init: typeof init;
run: typeof run;
registerExternalDiagrams: typeof registerExternalDiagrams;

View File

@ -593,7 +593,6 @@ describe('mermaidAPI', () => {
mermaidAPI.initialize({ securityLevel: 'loose' });
},
};
// mermaidAPI.reinitialize(config);
expect(mermaidAPI.getConfig().secure).toEqual(mermaidAPI.getSiteConfig().secure);
expect(mermaidAPI.getConfig().securityLevel).toBe('strict');
mermaidAPI.reset();

View File

@ -1,14 +1,6 @@
/**
* This is the API to be used when optionally handling the integration with the web page, instead of
* using the default integration provided by mermaid.js.
*
* The core of this api is the [**render**](Setup.md?id=render) function which, given a graph
* definition as text, renders the graph/diagram and returns an svg element for the graph.
*
* It is then up to the user of the API to make use of the svg, either insert it somewhere in the
* page or do something completely different.
*
* In addition to the render function, a number of behavioral configuration options are available.
* This file contains functions that are used internally by mermaid
* and is not intended to be used by the end user.
*/
// @ts-ignore TODO: Investigate D3 issue
import { select } from 'd3';
@ -32,6 +24,7 @@ import type { DiagramMetadata, DiagramStyleClassDef } from './diagram-api/types.
import { preprocessDiagram } from './preprocess.js';
import { decodeEntities } from './utils.js';
import { toBase64 } from './utils/base64.js';
import type { D3Element, ParseOptions, ParseResult, RenderResult } from './types.js';
const MAX_TEXTLENGTH = 50_000;
const MAX_TEXTLENGTH_EXCEEDED_MSG =
@ -57,44 +50,6 @@ const IFRAME_NOT_SUPPORTED_MSG = 'The "iframe" tag is not supported by your brow
const DOMPURIFY_TAGS = ['foreignobject'];
const DOMPURIFY_ATTR = ['dominant-baseline'];
export interface ParseOptions {
/**
* If `true`, parse will return `false` instead of throwing error when the diagram is invalid.
* The `parseError` function will not be called.
*/
suppressErrors?: boolean;
}
export interface ParseResult {
/**
* The diagram type, e.g. 'flowchart', 'sequence', etc.
*/
diagramType: string;
}
// This makes it clear that we're working with a d3 selected element of some kind, even though it's hard to specify the exact type.
export type D3Element = any;
export interface RenderResult {
/**
* The svg code for the rendered graph.
*/
svg: string;
/**
* The diagram type, e.g. 'flowchart', 'sequence', etc.
*/
diagramType: string;
/**
* Bind function to be called after the svg has been inserted into the DOM.
* This is necessary for adding event listeners to the elements in the svg.
* ```js
* const { svg, bindFunctions } = mermaidAPI.render('id1', 'graph TD;A-->B');
* div.innerHTML = svg;
* bindFunctions?.(div); // To call bindFunctions only if it's present.
* ```
*/
bindFunctions?: (element: Element) => void;
}
function processAndSetConfigs(text: string) {
const processed = preprocessDiagram(text);
configApi.reset();
@ -568,69 +523,8 @@ function addA11yInfo(
}
/**
* ## mermaidAPI configuration defaults
*
* ```ts
* const config = {
* theme: 'default',
* logLevel: 'fatal',
* securityLevel: 'strict',
* startOnLoad: true,
* arrowMarkerAbsolute: false,
* suppressErrorRendering: false,
*
* er: {
* diagramPadding: 20,
* layoutDirection: 'TB',
* minEntityWidth: 100,
* minEntityHeight: 75,
* entityPadding: 15,
* stroke: 'gray',
* fill: 'honeydew',
* fontSize: 12,
* useMaxWidth: true,
* },
* flowchart: {
* diagramPadding: 8,
* htmlLabels: true,
* curve: 'basis',
* },
* sequence: {
* diagramMarginX: 50,
* diagramMarginY: 10,
* actorMargin: 50,
* width: 150,
* height: 65,
* boxMargin: 10,
* boxTextMargin: 5,
* noteMargin: 10,
* messageMargin: 35,
* messageAlign: 'center',
* mirrorActors: true,
* bottomMarginAdj: 1,
* useMaxWidth: true,
* rightAngles: false,
* showSequenceNumbers: false,
* },
* gantt: {
* titleTopMargin: 25,
* barHeight: 20,
* barGap: 4,
* topPadding: 50,
* leftPadding: 75,
* gridLineStartPadding: 35,
* fontSize: 11,
* fontFamily: '"Open Sans", sans-serif',
* numberSectionStyles: 4,
* axisFormat: '%Y-%m-%d',
* topAxis: false,
* displayMode: '',
* },
* };
* mermaid.initialize(config);
* ```
* @internal - Use mermaid.function instead of mermaid.mermaidAPI.function
*/
export const mermaidAPI = Object.freeze({
render,
parse,

View File

@ -154,10 +154,7 @@ properties:
secure:
description: |
This option controls which `currentConfig` keys are considered secure and
can only be changed via call to `mermaidAPI.initialize`.
Calls to `mermaidAPI.reinitialize` cannot make changes to the secure keys
in the current `currentConfig`.
can only be changed via call to `mermaid.initialize`.
This prevents malicious graph directives from overriding a site's default security.
default:
[

View File

@ -34,3 +34,41 @@ export interface EdgeData {
}
export type ArrayElement<A> = A extends readonly (infer T)[] ? T : never;
export interface ParseOptions {
/**
* If `true`, parse will return `false` instead of throwing error when the diagram is invalid.
* The `parseError` function will not be called.
*/
suppressErrors?: boolean;
}
export interface ParseResult {
/**
* The diagram type, e.g. 'flowchart', 'sequence', etc.
*/
diagramType: string;
}
// This makes it clear that we're working with a d3 selected element of some kind, even though it's hard to specify the exact type.
export type D3Element = any;
export interface RenderResult {
/**
* The svg code for the rendered graph.
*/
svg: string;
/**
* The diagram type, e.g. 'flowchart', 'sequence', etc.
*/
diagramType: string;
/**
* Bind function to be called after the svg has been inserted into the DOM.
* This is necessary for adding event listeners to the elements in the svg.
* ```js
* const { svg, bindFunctions } = await mermaid.render('id1', 'graph TD;A-->B');
* div.innerHTML = svg;
* bindFunctions?.(div); // To call bindFunctions only if it's present.
* ```
*/
bindFunctions?: (element: Element) => void;
}

View File

@ -32,8 +32,7 @@ import type { MermaidConfig } from './config.type.js';
import memoize from 'lodash-es/memoize.js';
import merge from 'lodash-es/merge.js';
import { directiveRegex } from './diagram-api/regexes.js';
import type { D3Element } from './mermaidAPI.js';
import type { Point, TextDimensionConfig, TextDimensions } from './types.js';
import type { D3Element, Point, TextDimensionConfig, TextDimensions } from './types.js';
export const ZERO_WIDTH_SPACE = '\u200b';