feat(config): add dompurify config option

demos/index.html

@@ -37,7 +37,7 @@
       axisFormat %m-%d %a
       excludes	weekends, 2021-10-01,2021-10-04,2021-10-05,2021-10-06,2021-10-07
       includes 2021-10-09
-        
+
       section Airworks 3.4.1
       开发	:b, 2021-10-07, 5d
       测试	:after b, 4d
@@ -619,7 +619,7 @@
 
   <div class="mermaid">
     classDiagram
-    Class01 <|-- AveryLongClass : Cool 
+    Class01 <|-- AveryLongClass : Cool
 
     &lt;&lt;interface&gt;&gt; Class01
     Class03 "0" *-- "0..n" Class04
@@ -656,7 +656,7 @@
 
   <div class="mermaid">
     classDiagram
-    Class01~T~ <|-- AveryLongClass : Cool 
+    Class01~T~ <|-- AveryLongClass : Cool
     &lt;&lt;interface&gt;&gt; Class01
     Class03~T~ "0" *-- "0..n" Class04
     Class05 "1" o-- "many" Class06
@@ -786,6 +786,43 @@
 
   <script src="./mermaid.js"></script>
   <script>
+    const ALLOWED_TAGS = [
+      'a',
+  'b',
+  'blockquote',
+  'br',
+  'dd',
+  'div',
+  'dl',
+      'dt',
+  'em',
+  'foreignObject',
+  'h1',
+  'h2',
+  'h3',
+  'h4',
+      'h5',
+  'h6',
+  'h7',
+  'h8',
+  'hr',
+  'i',
+  'li',
+  'ul',
+  'ol',
+  'p',
+      'pre',
+  'span',
+  'strike',
+  'strong',
+  'table',
+  'tbody',
+      'td',
+  'tfoot',
+  'th',
+  'thead',
+  'tr',
+    ];
     mermaid.initialize({
       theme: 'forest',
       // themeCSS: '.node rect { fill: red; }',
@@ -794,6 +831,13 @@
       flowchart: { curve: 'basis' },
       gantt: { axisFormat: '%m/%d/%Y' },
       sequence: { actorMargin: 50 },
+      dompurifyConfig: {
+        USE_PROFILES: {
+          svg: true,
+        },
+        ADD_TAGS: ALLOWED_TAGS,
+        ADD_ATTR: ['transform-origin'],
+      },
       // sequenceDiagram: { actorMargin: 300 } // deprecated
     });
   </script>