fix(getThemeModeScript): wrap classsName in proper string tags

Author: SutuSebastian

packages/ui/src/theme/mode-script.test.tsx

@@ -37,13 +37,13 @@ describe("ThemeModeScript", () => {
     const { container } = render(<ThemeModeScript prefix="custom-" version={3} />);
     const script = container.querySelector("script");
 
-    expect(script?.innerHTML).toContain("custom-dark");
+    expect(script?.innerHTML).toContain('const className = "custom-dark"');
   });
 
   it("should not include prefix when version is 4", () => {
     const { container } = render(<ThemeModeScript prefix="custom-" version={4} />);
     const script = container.querySelector("script");
 
-    expect(script?.innerHTML).toContain("dark");
+    expect(script?.innerHTML).toContain('const className = "dark"');
   });
 });

packages/ui/src/theme/mode-script.tsx

@@ -117,7 +117,7 @@ export function getThemeModeScript(
       const resolvedMode = (isStorageModeValid ? storageMode : null) ?? ${mode ? `"${mode}"` : undefined} ?? "${defaultMode}";
       const computedMode =
         resolvedMode === "auto" ? (window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light") : resolvedMode;
-      const className = ${version === 3 ? `"${prefix}dark"` : "dark"};
+      const className = ${version === 3 ? `"${prefix}dark"` : `"dark"`};
 
       if (computedMode === "dark") {
         document.documentElement.classList.add(className);