touch up

react18-tools · Jun 27, 2024 · 9b06e4d · 9b06e4d
1 parent 961b453
commit 9b06e4d
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 7 deletions.
diff --git a/lib/src/client/color-switch/color-switch.tsx b/lib/src/client/color-switch/color-switch.tsx
@@ -33,10 +33,9 @@ export const ColorSwitch = ({
 }: ColorSwitchProps) => {
   const { toggleColorScheme, colorSchemePref } = useTheme(targetSelector);
 
-  const cls = [styles.s, styles[colorSchemePref], className].join(" ");
   return (
     <button
-      className={cls}
+      className={[styles.s, styles[colorSchemePref], className].join(" ")}
       data-testid="color-switch"
       // skipcq: JS-0417
       onClick={() => toggleColorScheme(skipSystem)}

diff --git a/lib/src/client/theme-switcher/no-fouc.ts b/lib/src/client/theme-switcher/no-fouc.ts
@@ -24,6 +24,14 @@ declare global {
   var g: UpdateForcedPropsFunc;
 }
 
+export type ScriptArgs = [
+  string,
+  ThemeStoreType,
+  Record<string, string> | undefined,
+  string | undefined,
+  ColorSchemeType | undefined,
+];
+
 /** @internal Script to be injected for avoiding FOUC */
 export const noFOUCScript = (
   key: string,

diff --git a/lib/src/client/theme-switcher/theme-switcher.tsx b/lib/src/client/theme-switcher/theme-switcher.tsx
@@ -1,5 +1,5 @@
 import { ColorSchemeType } from "../../types";
-import { noFOUCScript } from "./no-fouc";
+import { noFOUCScript, type ScriptArgs } from "./no-fouc";
 import { initialState } from "../../store";
 import { DEFAULT_ID } from "../../constants";
 import { Switcher } from "../switcher";
@@ -45,15 +45,20 @@ const Script = ({
   forcedTheme,
   forcedColorScheme,
 }: ThemeSwitcherProps) => {
-  const k = targetSelector || `#${DEFAULT_ID}`;
+  const args = [
+    targetSelector || `#${DEFAULT_ID}`,
+    initialState,
+    styles,
+    forcedTheme,
+    forcedColorScheme,
+  ] as ScriptArgs;
   // handle client side exceptions when script is not run. <- for client side apps like vite or CRA
-  if (typeof window !== "undefined" && !window.m)
-    noFOUCScript(k, initialState, styles, forcedTheme, forcedColorScheme);
+  if (typeof window !== "undefined" && !window.m) noFOUCScript(...args);
   return (
     <script
       // skipcq: JS-0440
       dangerouslySetInnerHTML={{
-        __html: `(${noFOUCScript})(${JSON.stringify([k, initialState, styles, forcedTheme, forcedColorScheme]).slice(1, -1)})`,
+        __html: `(${noFOUCScript})(${JSON.stringify(args).slice(1, -1)})`,
       }}
       nonce={nonce}
     />