chore: Add ability to get classDefs from classDb

packages/mermaid/src/diagrams/class/classDb.ts

@@ -29,7 +29,7 @@ const MERMAID_DOM_ID_PREFIX = 'classId-';
 
 let relations: ClassRelation[] = [];
 let classes = new Map<string, ClassNode>();
-const styleClasses = new Map<string, StyleClass>();
+let styleClasses = new Map<string, StyleClass>();
 let notes: ClassNote[] = [];
 let interfaces: Interface[] = [];
 let classCounter = 0;
@@ -126,6 +126,7 @@ export const lookUpDomId = function (_id: string): string {
 export const clear = function () {
   relations = [];
   classes = new Map();
+  styleClasses = new Map();
   notes = [];
   interfaces = [];
   functions = [];
@@ -285,15 +286,16 @@ export const setCssClass = function (ids: string, className: string) {
 };
 
 export const defineClass = function (ids: string[], style: string[]) {
+  const styles = style[0].split(',');
   for (const id of ids) {
     let styleClass = styleClasses.get(id);
     if (styleClass === undefined) {
       styleClass = { id, styles: [], textStyles: [] };
       styleClasses.set(id, styleClass);
     }
 
-    if (style) {
-      style.forEach(function (s) {
+    if (styles.length > 0) {
+      styles.forEach(function (s: string) {
         if (/color/.exec(s)) {
           const newStyle = s.replace('fill', 'bgFill'); // .replace('color', 'fill');
           styleClass.textStyles.push(newStyle);
@@ -578,6 +580,10 @@ function getArrowMarker(type: number) {
   return marker;
 }
 
+export const getClassDefs = () => {
+  return styleClasses;
+};
+
 export const getData = () => {
   const nodes: Node[] = [];
   const edges: Edge[] = [];
@@ -732,5 +738,6 @@ export default {
   getNamespace,
   getNamespaces,
   setCssStyle,
+  getClassDefs,
   getData,
 };

packages/mermaid/src/diagrams/class/classDiagram-styles.spec.js

@@ -111,5 +111,32 @@ describe('class diagram, ', function () {
       ]);
       expect(parser.yy.getClass('Class01').cssClasses).toBe('default pink bold');
     });
+    it('should detect classDefs', function () {
+      const str =
+        'classDiagram\n' +
+        'class Animal\nclassDef red fill:red,color:white,stroke:red\nclassDef large color:black,font-size:20px,font-weight:bold';
+
+      parser.parse(str);
+      const expected = new Map([
+        [
+          'red',
+          {
+            id: 'red',
+            styles: ['fill:red', 'color:white', 'stroke:red'],
+            textStyles: ['color:white'],
+          },
+        ],
+        [
+          'large',
+          {
+            id: 'large',
+            styles: ['color:black', 'font-size:20px', 'font-weight:bold'],
+            textStyles: ['color:black'],
+          },
+        ],
+      ]);
+
+      expect(parser.yy.getClassDefs()).toStrictEqual(expected);
+    });
   });
 });