fix: webpack loader issue with anti flicker script

Author: designcise

src/AntiFlickerScript.jsx

@@ -0,0 +1,6 @@
+import React, { memo } from 'react';
+
+export default memo(function AntiFlickerScript({ theme, color }) {
+    const script = `(function(theme,root){root.classList.remove(\`'${Object.values(color).join("','")}'\`);root.classList.add(theme);root.style.colorScheme=theme;})('${theme}',document.firstElementChild)`;
+    return <script dangerouslySetInnerHTML={{ __html: script }} />
+}, () => true);

src/ThemeProvider.jsx

@@ -1,16 +1,12 @@
 'use client'
 
-import React, { useEffect, useState, useCallback, memo } from 'react';
+import React, { useEffect, useState, useCallback } from 'react';
 import ThemeContext from './ThemeContext';
 import { getPreference, setPreference, getColors } from './helper/theme.helper';
+import AntiFlickerScript from './AntiFlickerScript';
 
 const color = getColors();
 
-const AntiFlickerScript = memo(function Script({ theme, color }) {
-    const script = (() => `(function(theme,root){root.classList.remove(\`'${Object.values(color).join("','")}'\`);root.classList.add(theme);root.style.colorScheme=theme;})('${theme}',document.firstElementChild)`)();
-    return <script dangerouslySetInnerHTML={{ __html: script }} />
-}, () => true);
-
 export default function ThemeProvider({
     children,
     storageKey,