#5237 Fixes after visual testing. Handling multi-line notes and positioning of notes relative to the state

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

@@ -328,6 +328,7 @@ export const dataFetcher = (parent, parsedItem, diagramStates, nodes, edges, alt
         look,
         position: parsedItem.note.position,
       };
+      const parentNodeId = itemId + PARENT_ID;
       const groupData = {
         labelStyle: '',
         shape: SHAPE_NOTEGROUP,
@@ -344,12 +345,11 @@ export const dataFetcher = (parent, parsedItem, diagramStates, nodes, edges, alt
       };
       graphItemCount++;
 
-      const parentNodeId = itemId + PARENT_ID;
-
       //add parent id to groupData
       groupData.id = parentNodeId;
       //add parent id to noteData
       noteData.parentId = parentNodeId;
+      nodeData.parentId = parentNodeId;
 
       //insert groupData
       insertOrUpdateNode(nodes, groupData);

packages/mermaid/src/rendering-util/createText.ts

@@ -198,16 +198,7 @@ export const createText = (
   } = {},
   config: MermaidConfig
 ) => {
-  log.info(
-    'createText XEX',
-    text,
-    style,
-    isTitle,
-    classes,
-    useHtmlLabels,
-    isNode,
-    addSvgBackground
-  );
+  log.info('createText', text, style, isTitle, classes, useHtmlLabels, isNode, addSvgBackground);
   if (useHtmlLabels) {
     // TODO: addHtmlLabel accepts a labelStyle. Do we possibly have that?
 

packages/mermaid/src/rendering-util/handle-markdown-text.ts

@@ -75,6 +75,8 @@ export function markdownToHTML(markdown: string, { markdownAutoWrap }: MermaidCo
       return `<em>${node.children.map(output).join('')}</em>`;
     } else if (node.type === 'paragraph') {
       return `<p>${node.children.map(output).join('')}</p>`;
+    } else if (node.type === 'html' && /^<br\s*\/?>$/i.test(node.value)) {
+      return `${node.value}`;
     }
     return `Unsupported markdown: ${node.type}`;
   }