Files
mermaid-live-editor/src/lib/util/mermaid.ts
T

63 lines
1.7 KiB
TypeScript

import { diagramData } from '@mermaid-js/examples';
import elkLayouts from '@mermaid-js/layout-elk';
import zenuml from '@mermaid-js/mermaid-zenuml';
import type { MermaidConfig, RenderResult } from 'mermaid';
import mermaid from 'mermaid';
mermaid.registerLayoutLoaders(elkLayouts);
const init = mermaid.registerExternalDiagrams([zenuml]);
export const render = async (
config: MermaidConfig,
code: string,
id: string
): Promise<RenderResult> => {
await init;
// Should be able to call this multiple times without any issues.
mermaid.initialize(config);
return await mermaid.render(id, code);
};
export const parse = async (code: string) => {
return await mermaid.parse(code);
};
export const standardizeDiagramType = (diagramType: string) => {
switch (diagramType) {
case 'class':
case 'classDiagram': {
return 'classDiagram';
}
case 'graph':
case 'flowchart':
case 'flowchart-elk':
case 'flowchart-v2': {
return 'flowchart';
}
default: {
return diagramType;
}
}
};
type DiagramDefinition = (typeof diagramData)[number];
const isValidDiagram = (diagram: DiagramDefinition): diagram is Required<DiagramDefinition> => {
return Boolean(diagram.name && diagram.examples && diagram.examples.length > 0);
};
export const getSampleDiagrams = () => {
const diagrams = diagramData
.filter((d) => isValidDiagram(d))
.map(({ examples, ...rest }) => ({
...rest,
example: examples?.filter(({ isDefault }) => isDefault)[0]
}));
const examples: Record<string, string> = {};
for (const diagram of diagrams) {
examples[diagram.name.replace(/ (Diagram|Chart|Graph)/, '')] = diagram.example.code;
}
return examples;
};