Upgrade

.changeset/thin-melons-dress.md

@@ -0,0 +1,5 @@
+---
+"nextjs-darkmode": patch
+---
+
+Upgrade packages...

examples/nextjs/next-env.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
+/// <reference types="next/navigation-types/compat/navigation" />
 
 // NOTE: This file should not be edited
 // see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

lib/package.json

@@ -17,29 +17,29 @@
   ],
   "exports": {
     ".": {
+      "types": "./dist/index.d.ts",
       "require": "./dist/index.js",
-      "import": "./dist/index.mjs",
-      "types": "./dist/index.d.ts"
+      "import": "./dist/index.mjs"
     },
     "./switch": {
+      "types": "./dist/client/switch/index.d.ts",
       "require": "./dist/client/switch/index.js",
-      "import": "./dist/client/switch/index.mjs",
-      "types": "./dist/client/switch/index.d.ts"
+      "import": "./dist/client/switch/index.mjs"
     },
     "./dist/client/switch": {
+      "types": "./dist/client/switch/index.d.ts",
       "require": "./dist/client/switch/index.js",
-      "import": "./dist/client/switch/index.mjs",
-      "types": "./dist/client/switch/index.d.ts"
+      "import": "./dist/client/switch/index.mjs"
     },
     "./hooks": {
+      "types": "./dist/hooks/index.d.ts",
       "require": "./dist/hooks/index.js",
-      "import": "./dist/hooks/index.mjs",
-      "types": "./dist/hooks/index.d.ts"
+      "import": "./dist/hooks/index.mjs"
     },
     "./dist/hooks": {
+      "types": "./dist/hooks/index.d.ts",
       "require": "./dist/hooks/index.js",
-      "import": "./dist/hooks/index.mjs",
-      "types": "./dist/hooks/index.d.ts"
+      "import": "./dist/hooks/index.mjs"
     },
     "./css": "./dist/index.css",
     "./dist/index.css": "./dist/index.css"

lib/src/client/core/core.tsx

@@ -1,6 +1,6 @@
 import { DARK, LIGHT } from "../../constants";
 import { ColorSchemePreference, ResolvedScheme, useStore } from "../../utils";
-import { memo, useEffect } from "react";
+import { useEffect } from "react";
 import { noFOUCScript } from "./no-fouc";
 
 let media: MediaQueryList,
@@ -14,16 +14,13 @@ interface ScriptProps {
 }
 
 /** Avoid rerender of script */
-const Script = memo(
-  ({ n, k }: ScriptProps) => (
-    <script
-      suppressHydrationWarning
-      // skipcq: JS-0440
-      dangerouslySetInnerHTML={{ __html: `(${noFOUCScript.toString()})('${k}')` }}
-      nonce={n}
-    />
-  ),
-  () => true,
+const Script = ({ n, k }: ScriptProps) => (
+  <script
+    suppressHydrationWarning
+    // skipcq: JS-0440
+    dangerouslySetInnerHTML={{ __html: `(${noFOUCScript.toString()})('${k}')` }}
+    nonce={n}
+  />
 );
 
 export interface CoreProps {

lib/src/hooks/use-mode.ts

@@ -19,15 +19,12 @@ export interface UseModeYeild {
  * @source - Source code
  */
 export const useMode = (): UseModeYeild => {
-  const [{ m: mode, s: systemMode }, setState] = useStore();
+  const [{ m, s }, setState] = useStore();
   /** Set user preference */
-  const setMode = (m: ColorSchemePreference) => {
-    setState(prev => ({ ...prev, m }));
-  };
   return {
-    mode,
-    systemMode,
-    resolvedMode: (mode === SYSTEM ? systemMode : mode) as ResolvedScheme,
-    setMode,
+    mode: m,
+    systemMode: s,
+    resolvedMode: (m === SYSTEM ? s : m) as ResolvedScheme,
+    setMode: (m: ColorSchemePreference) => setState({ s, m }),
   };
 };