diff --git a/cypress/platform/per.html b/cypress/platform/per.html
index f68a3f50b..4fca4c808 100644
--- a/cypress/platform/per.html
+++ b/cypress/platform/per.html
@@ -6,10 +6,6 @@
       rel="stylesheet"
       href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
     />
-    <link
-      href="https://cdn.jsdelivr.net/npm/@mdi/font@6.9.96/css/materialdesignicons.min.css"
-      rel="stylesheet"
-    />
     <link
       href="https://fonts.googleapis.com/css?family=Noto+Sans+SC&display=swap"
       rel="stylesheet"
@@ -29,12 +25,6 @@
       }
       .mermaid svg {
         /* font-size: 18px !important; */
-        background-color: #eee;
-        background-image: radial-gradient(#fff 1%, transparent 11%),
-          radial-gradient(#fff 1%, transparent 11%);
-        background-size: 20px 20px;
-        background-position: 0 0, 10px 10px;
-        background-repeat: repeat;
       }
       .malware {
         position: fixed;
@@ -56,33 +46,29 @@
   <body>
     <div>Security check</div>
     <pre id="diagram" class="mermaid">
-bar title Pets adopted by volunteers
-    "Dogs" : 386
-    "Cats" : 85
-    "Rats" : 15
-    </pre>
-
-    <!-- <div id="cy"></div> -->
-    <!-- <script src="http://localhost:9000/packages/mermaid-mindmap/dist/mermaid-mindmap-detector.js"></script> -->
-    <!-- <script src="./mermaid-example-diagram-detector.js"></script>    -->
-    <!-- <script src="//cdn.jsdelivr.net/npm/mermaid@9.1.7/dist/mermaid.min.js"></script> -->
-    <script src="./mermaid.js"></script>
-
+flowchart LR
+A-->B
+        </pre
+    >
+    <pre id="diagram" class="mermaid2">
+            mindmap
+          root
+            ch1
+            ch2
+        </pre
+    >
+    <script src="./packages/mermaid-mindmap/dist/mermaid-mindmap-detector.js"></script>
+    <script src="./packages/mermaid-mindmap/dist/mermaid-example-diagram-detector.js"></script>
+    <script src="./packages/mermaid/dist/mermaid.js"></script>
     <script>
       mermaid.parseError = function (err, hash) {
         // console.error('Mermaid error: ', err);
       };
       mermaid.initialize({
-        theme: 'forest',
         startOnLoad: true,
         logLevel: 0,
-        // basePath: './packages/',
-        // themeVariables: { darkMode: true },
-        lazyLoadedDiagrams: [
-          './mermaid-mindmap-detector.esm.mjs',
-          './mermaid-example-diagram-detector.esm.mjs',
-        ],
-        // lazyLoadedDiagrams: ['../../mermaid-mindmap/registry.ts'],
+        basePath: './packages/',
+        // themeVariables: {relationLabelColor: 'red'}
       });
       function callback() {
         alert('It worked');
diff --git a/demos/pie.html b/demos/pie.html
index b1d3c4902..333ef9491 100644
--- a/demos/pie.html
+++ b/demos/pie.html
@@ -19,7 +19,7 @@
       pie title Pets adopted by volunteers
       accTitle: simple pie char demo
       accDescr: pie chart with 3 sections: dogs, cats, rats. Most are dogs.
-    "Dogs" : 140
+    "Dogs" : 386
     "Cats" : 85
     "Rats" : 15
     </pre>
diff --git a/packages/mermaid/src/diagrams/pie/parser/pie.jison b/packages/mermaid/src/diagrams/pie/parser/pie.jison
index 345da059f..e98638aa8 100644
--- a/packages/mermaid/src/diagrams/pie/parser/pie.jison
+++ b/packages/mermaid/src/diagrams/pie/parser/pie.jison
@@ -40,7 +40,6 @@ accDescr\s*"{"\s*                                { this.begin("acc_descr_multili
 <string>["]                                                     { this.popState(); }
 <string>[^"]*                                                   { return "txt"; }
 "pie"		                                                        return 'PIE';
-"bar"		                                                        return 'BAR';
 "showData"                                                      return 'showData';
 ":"[\s]*[\d]+(?:\.[\d]+)?                                       return "value";
 <<EOF>>                                                         return 'EOF';
@@ -54,15 +53,10 @@ accDescr\s*"{"\s*                                { this.begin("acc_descr_multili
 start
   : eol start
   | directive start
-	| document_type document
-  | document_type showData document {yy.setShowData(true);}
+	| PIE document
+  | PIE showData document {yy.setShowData(true);}
 	;
 
-document_type
-  : PIE {yy.setDiagramType($1); }
-  | BAR {yy.setDiagramType($1); }
-  ;
-
 document
 	: /* empty */
 	| document line
diff --git a/packages/mermaid/src/diagrams/pie/pieDb.js b/packages/mermaid/src/diagrams/pie/pieDb.js
index ddf804499..8ef4d9efc 100644
--- a/packages/mermaid/src/diagrams/pie/pieDb.js
+++ b/packages/mermaid/src/diagrams/pie/pieDb.js
@@ -14,7 +14,6 @@ import {
 
 let sections = {};
 let showData = false;
-let diagramType = 'pie';
 
 export const parseDirective = function (statement, context, type) {
   mermaidAPI.parseDirective(this, statement, context, type);
@@ -27,16 +26,6 @@ const addSection = function (id, value) {
     log.debug('Added new section :', id);
   }
 };
-
-const setDiagramType = function (diagType) {
-  diagramType = diagType;
-  log.debug('Added diag type :', diagType);
-};
-
-const getDiagramType = function () {
-  return diagramType;
-};
-
 const getSections = () => sections;
 
 const setShowData = function (toggle) {
@@ -77,6 +66,4 @@ export default {
   getShowData,
   getAccDescription,
   setAccDescription,
-  setDiagramType,
-  getDiagramType,
 };
diff --git a/packages/mermaid/src/diagrams/pie/pieDetector.ts b/packages/mermaid/src/diagrams/pie/pieDetector.ts
index e267c710a..65a011c7a 100644
--- a/packages/mermaid/src/diagrams/pie/pieDetector.ts
+++ b/packages/mermaid/src/diagrams/pie/pieDetector.ts
@@ -1,6 +1,5 @@
 import type { DiagramDetector } from '../../diagram-api/types';
 
 export const pieDetector: DiagramDetector = (txt) => {
-  const logOutput = txt.match(/^\s*pie/) !== null || txt.match(/^\s*bar/) !== null;
-  return logOutput;
+  return txt.match(/^\s*pie/) !== null;
 };
diff --git a/packages/mermaid/src/diagrams/pie/pieRenderer.js b/packages/mermaid/src/diagrams/pie/pieRenderer.js
index 3faa752fd..60e9a59c9 100644
--- a/packages/mermaid/src/diagrams/pie/pieRenderer.js
+++ b/packages/mermaid/src/diagrams/pie/pieRenderer.js
@@ -6,200 +6,20 @@ import * as configApi from '../../config';
 import addSVGAccessibilityFields from '../../accessibility';
 
 let conf = configApi.getConfig();
+
 /**
- * Draws a Bar Chart with the data given in text.
+ * Draws a Pie Chart with the data given in text.
  *
  * @param text
- * @param txt
  * @param id
- * @param _version
- * @param diagObj
  */
-// export const drawBarChart = (txt, id, _version, diagObj) => {
-//   try {
-//     let locDiagType;
-
-//     conf = configApi.getConfig();
-//     log.debug('Rendering info diagram\n' + txt);
-//     locDiagType = diagObj.db.getDiagramType();
-//     const securityLevel = configApi.getConfig().securityLevel;
-//     // Handle root and Document for when rendering in sandbox mode
-//     let sandboxElement;
-//     if (securityLevel === 'sandbox') {
-//       sandboxElement = select('#i' + id);
-//     }
-//     const root =
-//       securityLevel === 'sandbox'
-//         ? select(sandboxElement.nodes()[0].contentDocument.body)
-//         : select('body');
-//     const doc = securityLevel === 'sandbox' ? sandboxElement.nodes()[0].contentDocument : document;
-
-//     // Parse the Pie Chart definition
-//     diagObj.db.clear();
-//     diagObj.parser.parse(txt);
-//     log.debug('Parsed info diagram');
-//     const elem = doc.getElementById(id);
-//     width = elem.parentElement.offsetWidth;
-
-//     if (typeof width === 'undefined') {
-//       width = 1200;
-//     }
-
-//     if (typeof conf.useWidth !== 'undefined') {
-//       width = conf.useWidth;
-//     }
-//     if (typeof conf.pie.useWidth !== 'undefined') {
-//       width = conf.pie.useWidth;
-//     }
-
-//     const diagram = root.select('#' + id);
-//     configureSvgSize(diagram, height, width, conf.pie.useMaxWidth);
-
-//     addSVGAccessibilityFields(diagObj.db, diagram, id);
-//     // Set viewBox
-//     elem.setAttribute('viewBox', '0 0 ' + width + ' ' + height);
-
-//     // Fetch the default direction, use TD if none was found
-//     var margin = 40;
-//     var legendRectSize = 18;
-//     var legendSpacing = 4;
-
-//     var radius = Math.min(width, height) / 2 - margin;
-
-//     var svg = diagram
-//       .append('g')
-//       .attr('transform', 'translate(' + width / 2 + ',' + height / 2 + ')');
-
-//     var data = diagObj.db.getSections();
-//     var sum = 0;
-//     Object.keys(data).forEach(function (key) {
-//       sum += data[key];
-//     });
-
-//     const themeVariables = conf.themeVariables;
-//     var myGeneratedColors = [
-//       themeVariables.pie1,
-//       themeVariables.pie2,
-//       themeVariables.pie3,
-//       themeVariables.pie4,
-//       themeVariables.pie5,
-//       themeVariables.pie6,
-//       themeVariables.pie7,
-//       themeVariables.pie8,
-//       themeVariables.pie9,
-//       themeVariables.pie10,
-//       themeVariables.pie11,
-//       themeVariables.pie12,
-//     ];
-
-//     // Set the color scale
-//     var color = scaleOrdinal().range(myGeneratedColors);
-
-//     // Compute the position of each group on the pie:
-//     var pieData = Object.entries(data).map(function (el, idx) {
-//       return {
-//         order: idx,
-//         name: el[0],
-//         value: el[1],
-//       };
-//     });
-//     var pie = d3pie()
-//       .value(function (d) {
-//         return d.value;
-//       })
-//       .sort(function (a, b) {
-//         // Sort slices in clockwise direction
-//         return a.order - b.order;
-//       });
-//     var dataReady = pie(pieData);
-
-//     // Shape helper to build arcs:
-//     var arcGenerator = arc().innerRadius(0).outerRadius(radius);
-
-//     // Build the pie chart: each part of the pie is a path that we build using the arc function.
-//     svg
-//       .selectAll('mySlices')
-//       .data(dataReady)
-//       .enter()
-//       .append('path')
-//       .attr('d', arcGenerator)
-//       .attr('fill', function (d) {
-//         return color(d.data.name);
-//       })
-//       .attr('class', 'pieCircle');
-
-//     // Now add the percentage.
-//     // Use the centroid method to get the best coordinates.
-//     svg
-//       .selectAll('mySlices')
-//       .data(dataReady)
-//       .enter()
-//       .append('text')
-//       .text(function (d) {
-//         return ((d.data.value / sum) * 100).toFixed(0) + '%';
-//       })
-//       .attr('transform', function (d) {
-//         return 'translate(' + arcGenerator.centroid(d) + ')';
-//       })
-//       .style('text-anchor', 'middle')
-//       .attr('class', 'slice');
-
-//     svg
-//       .append('text')
-//       .text(diagObj.db.getDiagramTitle())
-//       .attr('x', 0)
-//       .attr('y', -(height - 50) / 2)
-//       .attr('class', 'pieTitleText');
-
-//     // Add the legends/annotations for each section
-//     var legend = svg
-//       .selectAll('.legend')
-//       .data(color.domain())
-//       .enter()
-//       .append('g')
-//       .attr('class', 'legend')
-//       .attr('transform', function (d, i) {
-//         var height = legendRectSize + legendSpacing;
-//         var offset = (height * color.domain().length) / 2;
-//         var horizontal = 12 * legendRectSize;
-//         var vertical = i * height - offset;
-//         return 'translate(' + horizontal + ',' + vertical + ')';
-//       });
-
-//     legend
-//       .append('rect')
-//       .attr('width', legendRectSize)
-//       .attr('height', legendRectSize)
-//       .style('fill', color)
-//       .style('stroke', color);
-
-//     legend
-//       .data(dataReady)
-//       .append('text')
-//       .attr('x', legendRectSize + legendSpacing)
-//       .attr('y', legendRectSize - legendSpacing)
-//       .text(function (d) {
-//         if (diagObj.db.getShowData() || conf.showData || conf.pie.showData) {
-//           return d.data.name + ' [' + d.data.value + ']';
-//         } else {
-//           return d.data.name;
-//         }
-//       });
-//   } catch (e) {
-//     log.error('Error while rendering info diagram');
-//     log.error(e);
-//   }
-// };
-
 let width;
 const height = 450;
 export const draw = (txt, id, _version, diagObj) => {
   try {
-    let locDiagType;
-
     conf = configApi.getConfig();
     log.debug('Rendering info diagram\n' + txt);
-    locDiagType = diagObj.db.getDiagramType();
+
     const securityLevel = configApi.getConfig().securityLevel;
     // Handle root and Document for when rendering in sandbox mode
     let sandboxElement;
@@ -371,5 +191,4 @@ export const draw = (txt, id, _version, diagObj) => {
 
 export default {
   draw,
-  //  drawBarChart,
 };
