mermaid-js · sidharthv96 · Feb 11, 2024 · Aug 20, 2023 · Aug 20, 2023 · Aug 20, 2023
diff --git a/.build/langium-cli.d.ts b/.build/langium-cli.d.ts
diff --git a/docs/intro/getting-started.md b/docs/intro/getting-started.md
@@ -246,18 +246,18 @@ In this example, the `mermaidAPI` is being called through the `CDN`:
   <body>
     Here is one mermaid diagram:
     <pre class="mermaid">
-            graph TD 
-            A[Client] --> B[Load Balancer] 
-            B --> C[Server1] 
+            graph TD
+            A[Client] --> B[Load Balancer]
+            B --> C[Server1]
             B --> D[Server2]
     </pre>
 
     And here is another:
     <pre class="mermaid">
-            graph TD 
+            graph TD
             A[Client] -->|tcp_123| B
-            B(Load Balancer) 
-            B -->|tcp_456| C[Server1] 
+            B(Load Balancer)
+            B -->|tcp_456| C[Server1]
             B -->|tcp_456| D[Server2]
     </pre>
 
@@ -278,15 +278,15 @@ In this example, `mermaid.js` is referenced in `src` as a separate JavaScript fi
   </head>
   <body>
     <pre class="mermaid">
-            graph LR 
-            A --- B 
-            B-->C[fa:fa-ban forbidden] 
+            graph LR
+            A --- B
+            B-->C[fa:fa-ban forbidden]
             B-->D(fa:fa-spinner);
     </pre>
     <pre class="mermaid">
-            graph TD 
-            A[Client] --> B[Load Balancer] 
-            B --> C[Server1] 
+            graph TD
+            A[Client] --> B[Load Balancer]
+            B --> C[Server1]
             B --> D[Server2]
     </pre>
     <script type="module">

diff --git a/netlify.toml b/netlify.toml
@@ -7,9 +7,9 @@
   base = ""
 
   # Directory that contains the deploy-ready HTML files and
-  # assets generated by the build. This is an absolute path relative 
+  # assets generated by the build. This is an absolute path relative
   # to the base directory, which is the root by default (/).
-  # This sample publishes the directory located at the absolute 
+  # This sample publishes the directory located at the absolute
   # path "root/project/build-output"
 
   publish = "mermaid-live-editor/docs"

diff --git a/packages/mermaid/src/diagrams/pie/parser/pie.jison b/packages/mermaid/src/diagrams/pie/parser/pie.jison
diff --git a/packages/mermaid/src/diagrams/pie/pie.spec.ts b/packages/mermaid/src/diagrams/pie/pie.spec.ts
@@ -1,5 +1,4 @@
-// @ts-ignore: JISON doesn't support types
-import { parser } from './parser/pie.jison';
+import { parser } from './pieParser.js';
 import { DEFAULT_PIE_DB, db } from './pieDb.js';
 import { setConfig } from '../../diagram-api/diagramAPI.js';
 
@@ -8,26 +7,20 @@ setConfig({
 });
 
 describe('pie', () => {
-  beforeAll(() => {
-    parser.yy = db;
-  });
-
-  beforeEach(() => {
-    parser.yy.clear();
-  });
+  beforeEach(() => db.clear());
 
   describe('parse', () => {
-    it('should handle very simple pie', () => {
-      parser.parse(`pie
+    it('should handle very simple pie', async () => {
+      await parser.parse(`pie
       "ash": 100
       `);
 
       const sections = db.getSections();
       expect(sections['ash']).toBe(100);
     });
 
-    it('should handle simple pie', () => {
-      parser.parse(`pie
+    it('should handle simple pie', async () => {
+      await parser.parse(`pie
       "ash" : 60
       "bat" : 40
       `);
@@ -37,8 +30,8 @@ describe('pie', () => {
       expect(sections['bat']).toBe(40);
     });
 
-    it('should handle simple pie with showData', () => {
-      parser.parse(`pie showData
+    it('should handle simple pie with showData', async () => {
+      await parser.parse(`pie showData
       "ash" : 60
       "bat" : 40
       `);
@@ -50,8 +43,8 @@ describe('pie', () => {
       expect(sections['bat']).toBe(40);
     });
 
-    it('should handle simple pie with comments', () => {
-      parser.parse(`pie
+    it('should handle simple pie with comments', async () => {
+      await parser.parse(`pie
       %% comments
       "ash" : 60
       "bat" : 40
@@ -62,8 +55,8 @@ describe('pie', () => {
       expect(sections['bat']).toBe(40);
     });
 
-    it('should handle simple pie with a title', () => {
-      parser.parse(`pie title a 60/40 pie
+    it('should handle simple pie with a title', async () => {
+      await parser.parse(`pie title a 60/40 pie
       "ash" : 60
       "bat" : 40
       `);
@@ -75,8 +68,8 @@ describe('pie', () => {
       expect(sections['bat']).toBe(40);
     });
 
-    it('should handle simple pie with an acc title (accTitle)', () => {
-      parser.parse(`pie title a neat chart
+    it('should handle simple pie with an acc title (accTitle)', async () => {
+      await parser.parse(`pie title a neat chart
       accTitle: a neat acc title
       "ash" : 60
       "bat" : 40
@@ -91,8 +84,8 @@ describe('pie', () => {
       expect(sections['bat']).toBe(40);
     });
 
-    it('should handle simple pie with an acc description (accDescr)', () => {
-      parser.parse(`pie title a neat chart
+    it('should handle simple pie with an acc description (accDescr)', async () => {
+      await parser.parse(`pie title a neat chart
       accDescr: a neat description
       "ash" : 60
       "bat" : 40
@@ -107,8 +100,8 @@ describe('pie', () => {
       expect(sections['bat']).toBe(40);
     });
 
-    it('should handle simple pie with a multiline acc description (accDescr)', () => {
-      parser.parse(`pie title a neat chart
+    it('should handle simple pie with a multiline acc description (accDescr)', async () => {
+      await parser.parse(`pie title a neat chart
       accDescr {
         a neat description
         on multiple lines
@@ -126,8 +119,8 @@ describe('pie', () => {
       expect(sections['bat']).toBe(40);
     });
 
-    it('should handle simple pie with positive decimal', () => {
-      parser.parse(`pie
+    it('should handle simple pie with positive decimal', async () => {
+      await parser.parse(`pie
       "ash" : 60.67
       "bat" : 40
       `);
@@ -138,12 +131,12 @@ describe('pie', () => {
     });
 
     it('should handle simple pie with negative decimal', () => {
-      expect(() => {
-        parser.parse(`pie
+      expect(async () => {
+        await parser.parse(`pie
         "ash" : -60.67
         "bat" : 40.12
         `);
-      }).toThrowError();
+      }).rejects.toThrowError();
     });
   });
 

diff --git a/packages/mermaid/src/diagrams/pie/pieDb.ts b/packages/mermaid/src/diagrams/pie/pieDb.ts
@@ -1,6 +1,4 @@
 import { log } from '../../logger.js';
-import { getConfig as commonGetConfig } from '../../diagram-api/diagramAPI.js';
-import { sanitizeText } from '../common/common.js';
 import {
   setAccTitle,
   getAccTitle,
@@ -10,7 +8,7 @@ import {
   setAccDescription,
   clear as commonClear,
 } from '../common/commonDb.js';
-import type { PieFields, PieDB, Sections } from './pieTypes.js';
+import type { PieFields, PieDB, Sections, D3Section } from './pieTypes.js';
 import type { RequiredDeep } from 'type-fest';
 import type { PieDiagramConfig } from '../../config.type.js';
 import DEFAULT_CONFIG from '../../defaultConfig.js';
@@ -35,8 +33,7 @@ const clear = (): void => {
   commonClear();
 };
 
-const addSection = (label: string, value: number): void => {
-  label = sanitizeText(label, commonGetConfig());
+const addSection = ({ label, value }: D3Section): void => {
   if (sections[label] === undefined) {
     sections[label] = value;
     log.debug(`added new section: ${label}, with value: ${value}`);
@@ -45,13 +42,6 @@ const addSection = (label: string, value: number): void => {
 
 const getSections = (): Sections => sections;
 
-const cleanupValue = (value: string): number => {
-  if (value.substring(0, 1) === ':') {
-    value = value.substring(1).trim();
-  }
-  return Number(value.trim());
-};
-
 const setShowData = (toggle: boolean): void => {
   showData = toggle;
 };
@@ -71,7 +61,6 @@ export const db: PieDB = {
 
   addSection,
   getSections,
-  cleanupValue,
   setShowData,
   getShowData,
 };
diff --git a/packages/mermaid/src/diagrams/pie/pieDiagram.ts b/packages/mermaid/src/diagrams/pie/pieDiagram.ts
@@ -1,6 +1,5 @@
 import type { DiagramDefinition } from '../../diagram-api/types.js';
-// @ts-ignore: JISON doesn't support types
-import parser from './parser/pie.jison';
+import { parser } from './pieParser.js';
 import { db } from './pieDb.js';
 import styles from './pieStyles.js';
 import { renderer } from './pieRenderer.js';

diff --git a/packages/mermaid/src/diagrams/pie/pieParser.ts b/packages/mermaid/src/diagrams/pie/pieParser.ts
@@ -0,0 +1,21 @@
+import type { Pie } from '@mermaid-js/parser';
+import { parse } from '@mermaid-js/parser';
+import { log } from '../../logger.js';
+import type { ParserDefinition } from '../../diagram-api/types.js';
+import { populateCommonDb } from '../common/populateCommonDb.js';
+import type { PieDB } from './pieTypes.js';
+import { db } from './pieDb.js';
+
+const populateDb = (ast: Pie, db: PieDB) => {
+  populateCommonDb(ast, db);
+  db.setShowData(ast.showData);
+  ast.sections.map(db.addSection);
+};
+
+export const parser: ParserDefinition = {
+  parse: async (input: string): Promise<void> => {
+    const ast: Pie = await parse('pie', input);
+    log.debug(ast);
+    populateDb(ast, db);
+  },
+};