Merge pull request #50 from jboeijenga/main

feat(): Added default Mermaid theme when backstage theme variant is dark
johanneswuerbach · May 23, 2024 · 91426d0 · 91426d0
2 parents 87c0c75 + 7c02e68
commit 91426d0
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/src/Mermaid/Mermaid.test.tsx b/src/Mermaid/Mermaid.test.tsx
@@ -78,7 +78,7 @@ describe('Mermaid', () => {
   describe('selectConfig', () => {
     const legacyConfig = { config: { fontFamily: 'legacy-config' } };
     const lightConfig = { lightConfig: { fontFamily: 'light-config' } };
-    const darkConfig = { darkConfig: { fontFamily: 'dark-config' } };
+    const darkConfig = { darkConfig: { fontFamily: 'dark-config', theme: 'dark' } };
 
     it('legacy config is preferred for backwards-compatibility', () => {
       let config = selectConfig('light', { ...legacyConfig });
@@ -97,5 +97,10 @@ describe('Mermaid', () => {
       const config = selectConfig('dark', { ...lightConfig, ...darkConfig });
       expect(config).toEqual(darkConfig.darkConfig);
     });
+
+    it('dark theme is set by default when variant is dark', () => {
+      const config = selectConfig('dark', {});
+      expect(config).toEqual({ theme: 'dark'});
+    });
   });
 });
diff --git a/src/Mermaid/Mermaid.tsx b/src/Mermaid/Mermaid.tsx
@@ -35,7 +35,7 @@ export function selectConfig(backstagePalette: PaletteType, properties: MermaidP
     return properties.lightConfig || {};
   }
 
-  return properties.darkConfig || {};
+  return Object.assign({ theme: 'dark' }, properties.darkConfig);
 }
 
 /**