fix: Invalid MUI to BUI conversion for --bui-bg

Signed-off-by: Gabriel Dugny <gabriel.dugny@believe.com>

.changeset/legal-hounds-think.md

@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-mui-to-bui': patch
+---
+
+Fix invalid conversion for `--bui-bg` variable

plugins/mui-to-bui/src/components/BuiThemerPage/convertMuiToBuiTheme.test.ts

@@ -59,6 +59,7 @@ describe('convertMuiToBuiTheme', () => {
     // Border radius tokens are only generated when radius is 0
     expect(result.css).not.toContain('--bui-radius-3:');
     // Background default maps to surface-2
+    expect(result.css).toContain('--bui-bg: #f5f5f5;');
     expect(result.css).toContain('--bui-bg-surface-2: #f5f5f5;');
     expect(result.css).toContain('--bui-bg-surface-1: #ffffff;');
     expect(result.css).toContain('--bui-fg-primary: #000000;');
@@ -97,6 +98,7 @@ describe('convertMuiToBuiTheme', () => {
 
     expect(result.css).toContain("[data-theme-mode='dark'] {");
     // Background default maps to surface-2 in dark mode as well
+    expect(result.css).toContain('--bui-bg: #121212;');
     expect(result.css).toContain('--bui-bg-surface-2: #121212;');
     expect(result.css).toContain('--bui-bg-surface-1: #1e1e1e;');
     expect(result.css).toContain('--bui-fg-primary: #ffffff;');

plugins/mui-to-bui/src/components/BuiThemerPage/convertMuiToBuiTheme.ts

@@ -125,7 +125,7 @@ function generateBuiVariables(theme: Mui5Theme): Record<string, string> {
     warning: palette.warning.light,
     success: palette.success.light,
   }).forEach(([key, value]) => {
-    styleObject[`--bui-bg-${key}`] = value;
+    styleObject[`--bui-bg${key ? `-${key}` : ''}`] = value;
   });
 
   // Border colors
@@ -134,7 +134,7 @@ function generateBuiVariables(theme: Mui5Theme): Record<string, string> {
     warning: palette.warning.main,
     success: palette.success.main,
   }).forEach(([key, value]) => {
-    styleObject[`--bui-border${key ? `-${key}` : ''}`] = value;
+    styleObject[`--bui-border-${key}`] = value;
   });
 
   // Base border color if available