chore: merged with develop

demos/c4context.html

@@ -217,8 +217,8 @@
      </pre>
     <hr />
 
-    <script src="./mermaid.js"></script>
-    <script>
+    <script type="module">
+      import mermaid from './mermaid.esm.mjs';
       const ALLOWED_TAGS = [
         'a',
         'b',
@@ -273,8 +273,7 @@
         },
         // sequenceDiagram: { actorMargin: 300 } // deprecated
       });
-    </script>
-    <script>
+
       function testClick(nodeId) {
         console.log('clicked', nodeId);
         let originalBgColor = document.querySelector('body').style.backgroundColor;
@@ -283,21 +282,18 @@
           document.querySelector('body').style.backgroundColor = originalBgColor;
         }, 100);
       }
-    </script>
-    <script>
-      const testLineEndings = (test, input) => {
+
+      const testLineEndings = async (test, input) => {
         try {
-          mermaid.render(test, input, () => {
-            //no-op
-          });
+          await mermaid.render(test, input);
         } catch (err) {
           console.error('Error in %s:\n\n%s', test, err);
         }
       };
 
-      testLineEndings('CR', 'graph LR\rsubgraph CR\rA --> B\rend');
-      testLineEndings('LF', 'graph LR\nsubgraph LF\nA --> B\nend');
-      testLineEndings('CRLF', 'graph LR\r\nsubgraph CRLF\r\nA --> B\r\nend');
+      await testLineEndings('CR', 'graph LR\rsubgraph CR\rA --> B\rend');
+      await testLineEndings('LF', 'graph LR\nsubgraph LF\nA --> B\nend');
+      await testLineEndings('CRLF', 'graph LR\r\nsubgraph CRLF\r\nA --> B\r\nend');
     </script>
   </body>
 </html>

demos/classchart.html

@@ -154,8 +154,8 @@
     </pre>
     <hr />
 
-    <script src="./mermaid.js"></script>
-    <script>
+    <script type="module">
+      import mermaid from './mermaid.esm.mjs';
       mermaid.initialize({
         theme: 'default',
         // themeCSS: '.node rect { fill: red; }',

demos/dataflowchart.html

@@ -34,8 +34,8 @@
       noSide[|borders:no| stroke no side ];
     </pre>
 
-    <script src="./mermaid.js"></script>
-    <script>
+    <script type="module">
+      import mermaid from './mermaid.esm.mjs';
       mermaid.initialize({
         theme: 'forest',
         logLevel: 3,

demos/er.html

@@ -109,8 +109,8 @@
         MANUFACTURER only one to zero or more CAR : makes
     </pre>
 
-    <script src="./mermaid.js"></script>
     <script type="module">
+      import mermaid from './mermaid.esm.mjs';
       mermaid.initialize({
         theme: 'default',
 

demos/flowchart.html

@@ -1558,8 +1558,8 @@
 
     <h1 id="link-clicked">Anchor for "link-clicked" test</h1>
 
-    <script src="./mermaid.js"></script>
-    <script>
+    <script type="module">
+      import mermaid from './mermaid.esm.mjs';
       mermaid.initialize({
         theme: 'forest',
         logLevel: 3,

demos/gantt.html

@@ -182,8 +182,8 @@
       }
     </script>
 
-    <script src="./mermaid.js"></script>
-    <script>
+    <script type="module">
+      import mermaid from './mermaid.esm.mjs';
       mermaid.initialize({
         logLevel: 3,
         securityLevel: 'loose',

demos/git.html

@@ -38,8 +38,8 @@
     merge newbranch
     </pre>
 
-    <script src="./mermaid.js"></script>
-    <script>
+    <script type="module">
+      import mermaid from './mermaid.esm.mjs';
       const ALLOWED_TAGS = [
         'a',
         'b',

demos/journey.html

@@ -17,7 +17,7 @@
     <h1>Journey diagram demo</h1>
     <pre class="mermaid">
     ---
-    title: My working day 
+    title: My working day
     ---
      journey
       accTitle: Very simple journey demo
@@ -32,8 +32,8 @@
       Sit down: 3: Me
 				</pre>
 
-    <script src="./mermaid.js"></script>
-    <script>
+    <script type="module">
+      import mermaid from './mermaid.esm.mjs';
       mermaid.initialize({
         theme: 'forest',
         logLevel: 3,

demos/mindmap.html

@@ -40,7 +40,6 @@
 
     <script type="module">
       import mermaid from './mermaid.esm.mjs';
-      import mermaidMindmap from './mermaid-mindmap.esm.mjs';
 
       const ALLOWED_TAGS = [
         'a',

demos/requirements.html

@@ -159,8 +159,8 @@
     An Example <- copies - test_entity2
     </pre>
 
-    <script src="./mermaid.js"></script>
-    <script>
+    <script type="module">
+      import mermaid from './mermaid.esm.mjs';
       mermaid.initialize({
         theme: 'neutral',
         // themeCSS: '.node rect { fill: red; }',

demos/sequence.html

@@ -144,8 +144,8 @@
     >
     <hr />
 
-    <script src="./mermaid.js"></script>
-    <script>
+    <script type="module">
+      import mermaid from './mermaid.esm.mjs';
       mermaid.initialize({
         theme: 'base',
         // themeCSS: '.node rect { fill: red; }',

demos/state.html

@@ -218,8 +218,8 @@
     </pre>
     <hr />
 
-    <script src="./mermaid.js"></script>
-    <script>
+    <script type="module">
+      import mermaid from './mermaid.esm.mjs';
       mermaid.initialize({
         theme: 'default',
         // themeCSS: '.node rect { fill: red; }',

demos/timeline.html

@@ -23,8 +23,8 @@
           1940 : fourth step : fifth step
 				</pre>
 
-    <script src="./mermaid.js"></script>
-    <script>
+    <script type="module">
+      import mermaid from './mermaid.esm.mjs';
       mermaid.initialize({
         theme: 'forest',
         logLevel: 1,