diff --git a/packages/mermaid/src/config.ts b/packages/mermaid/src/config.ts index ede3a568d..4168c24c4 100644 --- a/packages/mermaid/src/config.ts +++ b/packages/mermaid/src/config.ts @@ -124,7 +124,7 @@ export const setConfig = (conf: MermaidConfig): MermaidConfig => { * | --------- | ------------------------- | ----------- | ------------------------------ | * | getConfig | Obtains the currentConfig | Get Request | Any Values from current Config | * - * **Notes**: Returns **any** the currentConfig + * **Notes**: Avoid calling this function repeatedly. Instead, store the result in a variable and use it, and pass it down to function calls. * * @returns The currentConfig */ diff --git a/packages/mermaid/src/dagre-wrapper/clusters.js b/packages/mermaid/src/dagre-wrapper/clusters.js index 9dde40187..2c7746876 100644 --- a/packages/mermaid/src/dagre-wrapper/clusters.js +++ b/packages/mermaid/src/dagre-wrapper/clusters.js @@ -30,7 +30,7 @@ const rect = (parent, node) => { // .appendChild(createLabel(node.labelText, node.labelStyle, undefined, true)); const text = node.labelType === 'markdown' - ? createText(label, node.labelText, { style: node.labelStyle, useHtmlLabels }) + ? createText(label, node.labelText, { style: node.labelStyle, useHtmlLabels }, siteConfig) : label.node().appendChild(createLabel(node.labelText, node.labelStyle, undefined, true)); // Get the size of the label diff --git a/packages/mermaid/src/dagre-wrapper/edges.js b/packages/mermaid/src/dagre-wrapper/edges.js index 6f7e4695d..1a72328e8 100644 --- a/packages/mermaid/src/dagre-wrapper/edges.js +++ b/packages/mermaid/src/dagre-wrapper/edges.js @@ -18,15 +18,21 @@ export const clear = () => { }; export const insertEdgeLabel = (elem, edge) => { - const useHtmlLabels = evaluate(getConfig().flowchart.htmlLabels); + const config = getConfig(); + const useHtmlLabels = evaluate(config.flowchart.htmlLabels); // Create the actual text element const labelElement = edge.labelType === 'markdown' - ? createText(elem, edge.label, { - style: edge.labelStyle, - useHtmlLabels, - addSvgBackground: true, - }) + ? createText( + elem, + edge.label, + { + style: edge.labelStyle, + useHtmlLabels, + addSvgBackground: true, + }, + config + ) : createLabel(edge.label, edge.labelStyle); // Create outer g, edgeLabel, this will be positioned after graph layout diff --git a/packages/mermaid/src/dagre-wrapper/shapes/util.js b/packages/mermaid/src/dagre-wrapper/shapes/util.js index df2c27bd5..1d0d2d77e 100644 --- a/packages/mermaid/src/dagre-wrapper/shapes/util.js +++ b/packages/mermaid/src/dagre-wrapper/shapes/util.js @@ -6,8 +6,9 @@ import { evaluate, sanitizeText } from '../../diagrams/common/common.js'; import { decodeEntities } from '../../utils.js'; export const labelHelper = async (parent, node, _classes, isNode) => { + const config = getConfig(); let classes; - const useHtmlLabels = node.useHtmlLabels || evaluate(getConfig().flowchart.htmlLabels); + const useHtmlLabels = node.useHtmlLabels || evaluate(config.flowchart.htmlLabels); if (!_classes) { classes = 'node default'; } else { @@ -35,26 +36,26 @@ export const labelHelper = async (parent, node, _classes, isNode) => { let text; if (node.labelType === 'markdown') { // text = textNode; - text = createText(label, sanitizeText(decodeEntities(labelText), getConfig()), { - useHtmlLabels, - width: node.width || getConfig().flowchart.wrappingWidth, - classes: 'markdown-node-label', - }); + text = createText( + label, + sanitizeText(decodeEntities(labelText), config), + { + useHtmlLabels, + width: node.width || config.flowchart.wrappingWidth, + classes: 'markdown-node-label', + }, + config + ); } else { text = textNode.appendChild( - createLabel( - sanitizeText(decodeEntities(labelText), getConfig()), - node.labelStyle, - false, - isNode - ) + createLabel(sanitizeText(decodeEntities(labelText), config), node.labelStyle, false, isNode) ); } // Get the size of the label let bbox = text.getBBox(); const halfPadding = node.padding / 2; - if (evaluate(getConfig().flowchart.htmlLabels)) { + if (evaluate(config.flowchart.htmlLabels)) { const div = text.children[0]; const dv = select(text); @@ -76,8 +77,8 @@ export const labelHelper = async (parent, node, _classes, isNode) => { if (noImgText) { // default size if no text - const bodyFontSize = getConfig().fontSize - ? getConfig().fontSize + const bodyFontSize = config.fontSize + ? config.fontSize : window.getComputedStyle(document.body).fontSize; const enlargingFactor = 5; const width = parseInt(bodyFontSize, 10) * enlargingFactor + 'px'; diff --git a/packages/mermaid/src/diagrams/mindmap/svgDraw.ts b/packages/mermaid/src/diagrams/mindmap/svgDraw.ts index 3c7da8615..c84a7b16c 100644 --- a/packages/mermaid/src/diagrams/mindmap/svgDraw.ts +++ b/packages/mermaid/src/diagrams/mindmap/svgDraw.ts @@ -196,11 +196,16 @@ export const drawNode = function ( // Create the wrapped text element const textElem = nodeElem.append('g'); const description = node.descr.replace(/()/g, '\n'); - const newEl = createText(textElem, description, { - useHtmlLabels: htmlLabels, - width: node.width, - classes: 'mindmap-node-label', - }); + const newEl = createText( + textElem, + description, + { + useHtmlLabels: htmlLabels, + width: node.width, + classes: 'mindmap-node-label', + }, + conf + ); if (!htmlLabels) { textElem diff --git a/packages/mermaid/src/rendering-util/createText.ts b/packages/mermaid/src/rendering-util/createText.ts index c50a019f1..d5c30b8bb 100644 --- a/packages/mermaid/src/rendering-util/createText.ts +++ b/packages/mermaid/src/rendering-util/createText.ts @@ -183,7 +183,7 @@ export const createText = ( width = 200, addSvgBackground = false, } = {}, - config: MermaidConfig = {} + config: MermaidConfig ) => { log.info('createText', text, style, isTitle, classes, useHtmlLabels, isNode, addSvgBackground); if (useHtmlLabels) {