Skip to content

Commit

Permalink
Merge pull request #4187 from Pr0dt0s/feature/4156_expose_detectType
Browse files Browse the repository at this point in the history
Expose detectType function
  • Loading branch information
sidharthv96 committed Mar 7, 2023
2 parents 7bea44e + 878c9f1 commit a57e392
Show file tree
Hide file tree
Showing 3 changed files with 41 additions and 1 deletion.
17 changes: 17 additions & 0 deletions docs/config/usage.md
Original file line number Diff line number Diff line change
Expand Up @@ -247,6 +247,23 @@ The example below show an outline of how this could be used. The example just lo
</script>
```

To determine the type of diagram present in a given text, you can utilize the `mermaid.detectType` function, as demonstrated in the example below.

```html
<script type="module">
import mermaid from './mermaid.esm.mjs';
const graphDefinition = `sequenceDiagram
Pumbaa->>Timon:I ate like a pig.
Timon->>Pumbaa:Pumbaa, you ARE a pig.`;
try {
const type = mermaid.detectType(graphDefinition);
console.log(type); // 'sequence'
} catch (error) {
// UnknownDiagramError
}
</script>
```

### Binding events

Sometimes the generated graph also has defined interactions like tooltip and click events. When using the API one must
Expand Down
17 changes: 17 additions & 0 deletions packages/mermaid/src/docs/config/usage.md
Original file line number Diff line number Diff line change
Expand Up @@ -244,6 +244,23 @@ The example below show an outline of how this could be used. The example just lo
</script>
```

To determine the type of diagram present in a given text, you can utilize the `mermaid.detectType` function, as demonstrated in the example below.

```html
<script type="module">
import mermaid from './mermaid.esm.mjs';
const graphDefinition = `sequenceDiagram
Pumbaa->>Timon:I ate like a pig.
Timon->>Pumbaa:Pumbaa, you ARE a pig.`;
try {
const type = mermaid.detectType(graphDefinition);
console.log(type); // 'sequence'
} catch (error) {
// UnknownDiagramError
}
</script>
```

### Binding events

Sometimes the generated graph also has defined interactions like tooltip and click events. When using the API one must
Expand Down
8 changes: 7 additions & 1 deletion packages/mermaid/src/mermaid.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,11 @@ import { MermaidConfig } from './config.type';
import { log } from './logger';
import utils from './utils';
import { mermaidAPI, ParseOptions, RenderResult } from './mermaidAPI';
import { registerLazyLoadedDiagrams, loadRegisteredDiagrams } from './diagram-api/detectType';
import {
registerLazyLoadedDiagrams,
loadRegisteredDiagrams,
detectType,
} from './diagram-api/detectType';
import type { ParseErrorFunction } from './Diagram';
import { isDetailedError } from './utils';
import type { DetailedError } from './utils';
Expand Down Expand Up @@ -400,6 +404,7 @@ const mermaid: {
initialize: typeof initialize;
contentLoaded: typeof contentLoaded;
setParseErrorHandler: typeof setParseErrorHandler;
detectType: typeof detectType;
} = {
startOnLoad: true,
mermaidAPI,
Expand All @@ -412,6 +417,7 @@ const mermaid: {
parseError: undefined,
contentLoaded,
setParseErrorHandler,
detectType,
};

export default mermaid;

0 comments on commit a57e392

Please sign in to comment.