Merge branch 'develop' of https://github.com/mermaid-js/mermaid into develop

* 'develop' of https://github.com/mermaid-js/mermaid:
  #5726 Refactor paragraph margin in mermaid styles
  #5726 Setting the default margin
  [autofix.ci] apply automated fixes
  fix: Create a copy of config passed in initialize, so that theme variables are not leaked to the object
  refactor!(sankey): default to `useMaxWidth` true
  refactor!(git): default to `useMaxWidth` true
  [autofix.ci] apply automated fixes
  [autofix.ci] apply automated fixes
  chore: Simplify dataFetcher helper functions
  chore: Simplify dataFetcher helper functions

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

@@ -165,7 +165,7 @@ Internal helpers for mermaid
 
 ### 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 }>
+• **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`: (`userOptions`: [`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`**
 

docs/config/setup/modules/defaultConfig.md

@@ -14,7 +14,7 @@
 
 #### Defined in
 
-[packages/mermaid/src/defaultConfig.ts:279](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/defaultConfig.ts#L279)
+[packages/mermaid/src/defaultConfig.ts:266](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/defaultConfig.ts#L266)
 
 ---
 

packages/mermaid/src/defaultConfig.ts

@@ -248,19 +248,6 @@ const config: RequiredDeep<MermaidConfig> = {
     ...defaultConfigJson.requirement,
     useWidth: undefined,
   },
-  gitGraph: {
-    ...defaultConfigJson.gitGraph,
-    // TODO: This is a temporary override for `gitGraph`, since every other
-    //       diagram does have `useMaxWidth`, but instead sets it to `true`.
-    //       Should we set this to `true` instead?
-    useMaxWidth: false,
-  },
-  sankey: {
-    ...defaultConfigJson.sankey,
-    // this is false, unlike every other diagram (other than gitGraph)
-    // TODO: can we make this default to `true` instead?
-    useMaxWidth: false,
-  },
   packet: {
     ...defaultConfigJson.packet,
   },

packages/mermaid/src/diagrams/state/dataFetcher.js

@@ -166,43 +166,11 @@ function insertOrUpdateNode(nodes, nodeData, classes) {
  * @returns {string}
  */
 function getClassesFromDbInfo(dbInfoItem) {
-  if (dbInfoItem === undefined || dbInfoItem === null) {
+  return dbInfoItem?.classes?.join(' ') ?? '';
-    return '';
-  } else {
-    if (dbInfoItem.classes) {
-      let classStr = '';
-      // for each class in classes, add it to the string as comma separated
-      for (let i = 0; i < dbInfoItem.classes.length; i++) {
-        //do not add comma for the last class
-        if (i === dbInfoItem.classes.length - 1) {
-          classStr += dbInfoItem.classes[i];
-        }
-        //add comma for all other classes
-        else {
-          classStr += dbInfoItem.classes[i] + ' ';
-        }
-      }
-      return classStr;
-    } else {
-      return '';
-    }
-  }
 }
-/**
+
- * Get classes from the db for the info item.
- * If there aren't any or if dbInfoItem isn't defined, return an empty string.
- * Else create 1 string from the list of classes found
- */
 function getStylesFromDbInfo(dbInfoItem) {
-  if (dbInfoItem === undefined || dbInfoItem === null) {
+  return dbInfoItem?.styles ?? [];
-    return;
-  } else {
-    if (dbInfoItem.styles) {
-      return dbInfoItem.styles;
-    } else {
-      return [];
-    }
-  }
 }
 
 export const dataFetcher = (
@@ -224,10 +192,10 @@ export const dataFetcher = (
 
   if (itemId !== 'root') {
     let shape = SHAPE_STATE;
+    // The if === true / false can be removed if we can guarantee that the parsedItem.start is always a boolean
     if (parsedItem.start === true) {
       shape = SHAPE_START;
-    }
+    } else if (parsedItem.start === false) {
-    if (parsedItem.start === false) {
       shape = SHAPE_END;
     }
     if (parsedItem.type !== DEFAULT_STATE_TYPE) {

packages/mermaid/src/mermaidAPI.ts

@@ -25,6 +25,7 @@ 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';
+import assignWithDepth from './assignWithDepth.js';
 
 const MAX_TEXTLENGTH = 50_000;
 const MAX_TEXTLENGTH_EXCEEDED_MSG =
@@ -473,9 +474,10 @@ const render = async function (
 };
 
 /**
- * @param  options - Initial Mermaid options
+ * @param  userOptions - Initial Mermaid options
  */
-function initialize(options: MermaidConfig = {}) {
+function initialize(userOptions: MermaidConfig = {}) {
+  const options = assignWithDepth({}, userOptions);
   // Handle legacy location of font-family configuration
   if (options?.fontFamily && !options.themeVariables?.fontFamily) {
     if (!options.themeVariables) {

packages/mermaid/src/styles.ts

@@ -70,6 +70,9 @@ const getStyles = (
     font-family: ${options.fontFamily};
     font-size: ${options.fontSize};
   }
+   & p {
+    margin: 0
+   }
 
   ${diagramStyles}