Merge commit 'f8746bee0454b01378726d04f9c65bbc3974eb3a' into merge-refactor/improving-rendering-shape-types

See https://github.com/mermaid-js/mermaid/pull/5974

Conflicts:
	docs/config/setup/interfaces/mermaid.RenderResult.md
	packages/mermaid/src/rendering-util/rendering-elements/shapes/util.ts

docs/config/setup/interfaces/mermaid.RenderResult.md

@@ -39,7 +39,7 @@ bindFunctions?.(div); // To call bindFunctions only if it's present.
 
 #### Defined in
 
-[packages/mermaid/src/types.ts:100](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L100)
+[packages/mermaid/src/types.ts:105](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L105)
 
 ---
 
@@ -51,7 +51,7 @@ The diagram type, e.g. 'flowchart', 'sequence', etc.
 
 #### Defined in
 
-[packages/mermaid/src/types.ts:90](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L90)
+[packages/mermaid/src/types.ts:95](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L95)
 
 ---
 
@@ -63,4 +63,4 @@ The svg code for the rendered graph.
 
 #### Defined in
 
-[packages/mermaid/src/types.ts:86](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L86)
+[packages/mermaid/src/types.ts:91](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/types.ts#L91)

packages/mermaid-layout-elk/src/render.ts

@@ -10,11 +10,18 @@ import { curveLinear } from 'd3';
 import ELK from 'elkjs/lib/elk.bundled.js';
 import { type TreeData, findCommonAncestor } from './find-common-ancestor.js';
 
-type Node = LayoutData['nodes'][0];
+type Node = LayoutData['nodes'][number];
+
+interface LabelData {
+  width: number;
+  height: number;
+  wrappingWidth?: number;
+  labelNode?: SVGGElement | null;
+}
 
 interface NodeWithVertex extends Omit<Node, 'domId'> {
   children?: unknown[];
-  labelData?: any;
+  labelData?: LabelData;
   domId?: Node['domId'] | SVGGroup | d3.Selection<SVGAElement, unknown, Element | null, unknown>;
 }
 
@@ -45,7 +52,7 @@ export const render = async (
     nodeArr: Node[],
     node: Node
   ) => {
-    const labelData: any = { width: 0, height: 0 };
+    const labelData: LabelData = { width: 0, height: 0 };
 
     const config = getConfig();
 

packages/mermaid/src/rendering-util/rendering-elements/nodes.ts

@@ -1,7 +1,7 @@
 import { log } from '../../logger.js';
 import { shapes } from './shapes.js';
-import type { Node } from '../types.js';
+import type { Node, ShapeRenderOptions } from '../types.js';
-import type { MermaidConfig, SVGGroup } from '../../mermaid.js';
+import type { SVGGroup } from '../../mermaid.js';
 import type { D3Selection } from '../../types.js';
 import { handleUndefinedAttr } from '../../utils.js';
 import type { graphlib } from 'dagre-d3-es';
@@ -11,11 +11,7 @@ type NodeElement = D3Selection<SVGAElement> | Awaited<ReturnType<ShapeHandler>>;
 
 const nodeElems = new Map<string, NodeElement>();
 
-export async function insertNode(
+export async function insertNode(elem: SVGGroup, node: Node, renderOptions: ShapeRenderOptions) {
-  elem: SVGGroup,
-  node: Node,
-  renderOptions: { config: MermaidConfig; dir: Node['dir'] }
-) {
   let newEl: NodeElement | undefined;
   let el;
 

packages/mermaid/src/rendering-util/rendering-elements/shapes.ts

@@ -1,5 +1,5 @@
 import type { Entries } from 'type-fest';
-import type { D3Selection } from '../../types.js';
+import type { D3Selection, MaybePromise } from '../../types.js';
 import type { Node, ShapeRenderOptions } from '../types.js';
 import { anchor } from './shapes/anchor.js';
 import { bowTieRect } from './shapes/bowTieRect.js';
@@ -58,7 +58,6 @@ import { waveEdgedRectangle } from './shapes/waveEdgedRectangle.js';
 import { waveRectangle } from './shapes/waveRectangle.js';
 import { windowPane } from './shapes/windowPane.js';
 
-type MaybePromise<T> = T | Promise<T>;
 type ShapeHandler = <T extends SVGGraphicsElement>(
   parent: D3Selection<T>,
   node: Node,

packages/mermaid/src/rendering-util/rendering-elements/shapes/util.ts

@@ -2,9 +2,10 @@ import { createText } from '../../createText.js';
 import type { Node } from '../../types.js';
 import { getConfig } from '../../../diagram-api/diagramAPI.js';
 import { select } from 'd3';
+import defaultConfig from '../../../defaultConfig.js';
 import { evaluate, sanitizeText } from '../../../diagrams/common/common.js';
 import { log } from '../../../logger.js';
-import { decodeEntities, handleUndefinedAttr } from '../../../utils.js';
+import { decodeEntities, handleUndefinedAttr, parseFontSize } from '../../../utils.js';
 import type { D3Selection, Point } from '../../../types.js';
 
 export const labelHelper = async <T extends SVGGraphicsElement>(
@@ -78,10 +79,7 @@ export const labelHelper = async <T extends SVGGraphicsElement>(
                     ? getConfig().fontSize
                     : window.getComputedStyle(document.body).fontSize;
                   const enlargingFactor = 5;
-                  const parsedBodyFontSize =
+                  const [parsedBodyFontSize = defaultConfig.fontSize] = parseFontSize(bodyFontSize);
-                    typeof bodyFontSize === 'number'
-                      ? bodyFontSize
-                      : parseInt(bodyFontSize ?? '', 10);
                   const width = parsedBodyFontSize * enlargingFactor + 'px';
                   img.style.minWidth = width;
                   img.style.maxWidth = width;

packages/mermaid/src/types.ts

@@ -104,3 +104,10 @@ export interface RenderResult {
    */
   bindFunctions?: (element: Element) => void;
 }
+
+/**
+ * Can be converted back to `T` by awaiting/`Awaited<T>`.
+ *
+ * This is useful for function types that may be either synchronous or asynchronous.
+ */
+export type MaybePromise<T> = T | Promise<T>;