From daf97e5fa4f7746555a227dd4e67665d212465a2 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Sun, 23 Jun 2024 21:58:21 +0530
Subject: [PATCH 01/60] remove forced components export from root

---
 lib/src/client/index.ts | 2 --
 1 file changed, 2 deletions(-)

diff --git a/lib/src/client/index.ts b/lib/src/client/index.ts
index 7c74cd7e..0f0374a3 100644
--- a/lib/src/client/index.ts
+++ b/lib/src/client/index.ts
@@ -7,7 +7,5 @@
  */
 
 // client component exports
-export * from "./force-theme";
-export * from "./force-color-scheme";
 export * from "./theme-switcher";
 export * from "./color-switch";

From 4afdf90d4abf19a61ce5ac7dbb96eb87135fc67a Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Sun, 23 Jun 2024 21:59:30 +0530
Subject: [PATCH 02/60] docs(changeset): Do not export force-theme and
 force-color-scheme components from root.

---
 .changeset/fuzzy-timers-lie.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/fuzzy-timers-lie.md

diff --git a/.changeset/fuzzy-timers-lie.md b/.changeset/fuzzy-timers-lie.md
new file mode 100644
index 00000000..14673128
--- /dev/null
+++ b/.changeset/fuzzy-timers-lie.md
@@ -0,0 +1,5 @@
+---
+"nextjs-themes": major
+---
+
+Do not export force-theme and force-color-scheme components from root.

From 63704733806b8b06b4bd9f74c05aa93517d3b423 Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Sun, 23 Jun 2024 16:39:43 +0000
Subject: [PATCH 03/60] RELEASING: Releasing 2 package(s)

Releases:
  nextjs-themes@4.0.0-alpha.0
  @repo/shared@0.0.6-alpha.0
---
 lib/CHANGELOG.md             | 6 ++++++
 lib/package.json             | 2 +-
 packages/shared/CHANGELOG.md | 7 +++++++
 packages/shared/package.json | 2 +-
 4 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/lib/CHANGELOG.md b/lib/CHANGELOG.md
index 108f2f39..70c53aac 100644
--- a/lib/CHANGELOG.md
+++ b/lib/CHANGELOG.md
@@ -1,5 +1,11 @@
 # nextjs-themes
 
+## 4.0.0-alpha.0
+
+### Major Changes
+
+- aa3d50e: Do not export force-theme and force-color-scheme components from root.
+
 ## 3.1.7
 
 ### Patch Changes
diff --git a/lib/package.json b/lib/package.json
index 11aeb28d..f2e33940 100644
--- a/lib/package.json
+++ b/lib/package.json
@@ -2,7 +2,7 @@
   "name": "nextjs-themes",
   "author": "Mayank Kumar Chaudhari <https://mayank-chaudhari.vercel.app>",
   "private": false,
-  "version": "3.1.7",
+  "version": "4.0.0-alpha.0",
   "description": "Unleash the Power of React Server Components! Use multiple themes on your site with confidence, without losing any advantages of React Server Components.",
   "license": "MPL-2.0",
   "main": "./dist/index.js",
diff --git a/packages/shared/CHANGELOG.md b/packages/shared/CHANGELOG.md
index f3ffbcff..c831e18b 100644
--- a/packages/shared/CHANGELOG.md
+++ b/packages/shared/CHANGELOG.md
@@ -1,5 +1,12 @@
 # @repo/shared
 
+## 0.0.6-alpha.0
+
+### Patch Changes
+
+- Updated dependencies [aa3d50e]
+  - nextjs-themes@4.0.0-alpha.0
+
 ## 0.0.5
 
 ### Patch Changes
diff --git a/packages/shared/package.json b/packages/shared/package.json
index ed024697..67463c82 100644
--- a/packages/shared/package.json
+++ b/packages/shared/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@repo/shared",
-  "version": "0.0.5",
+  "version": "0.0.6-alpha.0",
   "private": true,
   "sideEffects": false,
   "main": "./dist/index.js",

From 623dcc576a91998d883130cc3029045bd868fa70 Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Sun, 23 Jun 2024 16:39:44 +0000
Subject: [PATCH 04/60] Apply changesets and update CHANGELOG

---
 .changeset/pre.json | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)
 create mode 100644 .changeset/pre.json

diff --git a/.changeset/pre.json b/.changeset/pre.json
new file mode 100644
index 00000000..5556df7e
--- /dev/null
+++ b/.changeset/pre.json
@@ -0,0 +1,17 @@
+{
+  "mode": "exit",
+  "tag": "alpha",
+  "initialVersions": {
+    "@example/app": "0.0.0",
+    "@example/pages": "0.0.0",
+    "@example/vite": "0.0.0",
+    "nextjs-themes": "3.1.7",
+    "@repo/eslint-config": "0.0.0",
+    "@repo/typescript-config": "0.0.0",
+    "@repo/shared": "0.0.5",
+    "@repo/scripts": "0.0.0"
+  },
+  "changesets": [
+    "fuzzy-timers-lie"
+  ]
+}

From 6dc46b7f0a486f7cbe0a9b48f89a9577fa3636d8 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Sun, 23 Jun 2024 22:12:55 +0530
Subject: [PATCH 05/60] docs(changeset): Patch alpha to avoid publishing over
 previously published version

---
 .changeset/good-cobras-deny.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/good-cobras-deny.md

diff --git a/.changeset/good-cobras-deny.md b/.changeset/good-cobras-deny.md
new file mode 100644
index 00000000..5592d8b6
--- /dev/null
+++ b/.changeset/good-cobras-deny.md
@@ -0,0 +1,5 @@
+---
+"nextjs-themes": patch
+---
+
+Patch alpha to avoid publishing over previously published version

From 84925fa2611f3d88f7d770e2938e6f3a91ffdde7 Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Sun, 23 Jun 2024 16:43:49 +0000
Subject: [PATCH 06/60] RELEASING: Releasing 2 package(s)

Releases:
  nextjs-themes@4.0.0-alpha.1
  @repo/shared@0.0.6-alpha.1
---
 lib/CHANGELOG.md             | 6 ++++++
 lib/package.json             | 2 +-
 packages/shared/CHANGELOG.md | 7 +++++++
 packages/shared/package.json | 2 +-
 4 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/lib/CHANGELOG.md b/lib/CHANGELOG.md
index 70c53aac..6dda9092 100644
--- a/lib/CHANGELOG.md
+++ b/lib/CHANGELOG.md
@@ -1,5 +1,11 @@
 # nextjs-themes
 
+## 4.0.0-alpha.1
+
+### Patch Changes
+
+- 4ca22c1: Patch alpha to avoid publishing over previously published version
+
 ## 4.0.0-alpha.0
 
 ### Major Changes
diff --git a/lib/package.json b/lib/package.json
index f2e33940..b56936c3 100644
--- a/lib/package.json
+++ b/lib/package.json
@@ -2,7 +2,7 @@
   "name": "nextjs-themes",
   "author": "Mayank Kumar Chaudhari <https://mayank-chaudhari.vercel.app>",
   "private": false,
-  "version": "4.0.0-alpha.0",
+  "version": "4.0.0-alpha.1",
   "description": "Unleash the Power of React Server Components! Use multiple themes on your site with confidence, without losing any advantages of React Server Components.",
   "license": "MPL-2.0",
   "main": "./dist/index.js",
diff --git a/packages/shared/CHANGELOG.md b/packages/shared/CHANGELOG.md
index c831e18b..22052c90 100644
--- a/packages/shared/CHANGELOG.md
+++ b/packages/shared/CHANGELOG.md
@@ -1,5 +1,12 @@
 # @repo/shared
 
+## 0.0.6-alpha.1
+
+### Patch Changes
+
+- Updated dependencies [4ca22c1]
+  - nextjs-themes@4.0.0-alpha.1
+
 ## 0.0.6-alpha.0
 
 ### Patch Changes
diff --git a/packages/shared/package.json b/packages/shared/package.json
index 67463c82..f184b952 100644
--- a/packages/shared/package.json
+++ b/packages/shared/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@repo/shared",
-  "version": "0.0.6-alpha.0",
+  "version": "0.0.6-alpha.1",
   "private": true,
   "sideEffects": false,
   "main": "./dist/index.js",

From 7e510ee6baeb1885844cdd69d25df845a6b217aa Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Sun, 23 Jun 2024 16:43:49 +0000
Subject: [PATCH 07/60] Apply changesets and update CHANGELOG

---
 .changeset/pre.json | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/.changeset/pre.json b/.changeset/pre.json
index 5556df7e..8f93cf92 100644
--- a/.changeset/pre.json
+++ b/.changeset/pre.json
@@ -5,13 +5,14 @@
     "@example/app": "0.0.0",
     "@example/pages": "0.0.0",
     "@example/vite": "0.0.0",
-    "nextjs-themes": "3.1.7",
+    "nextjs-themes": "4.0.0-alpha.0",
     "@repo/eslint-config": "0.0.0",
     "@repo/typescript-config": "0.0.0",
-    "@repo/shared": "0.0.5",
+    "@repo/shared": "0.0.6-alpha.0",
     "@repo/scripts": "0.0.0"
   },
   "changesets": [
-    "fuzzy-timers-lie"
+    "fuzzy-timers-lie",
+    "good-cobras-deny"
   ]
 }

From 8853a88d5fb1e8f0dd4cb166d5945877b416c780 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Sun, 23 Jun 2024 22:17:49 +0530
Subject: [PATCH 08/60] Fix changelog location

---
 scripts/manual-publish.js | 2 +-
 scripts/publish.js        | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/scripts/manual-publish.js b/scripts/manual-publish.js
index 6c82827f..6e12f2f0 100644
--- a/scripts/manual-publish.js
+++ b/scripts/manual-publish.js
@@ -73,7 +73,7 @@ execSync(`cd lib && pnpm build && npm publish --provenance --access public --tag
 
 /** Create GitHub release */
 execSync(
-  `gh release create ${NEW_VERSION} --generate-notes${isLatestRelease ? " --latest" : ""} -n "$(sed '1,/^## /d;/^## /,$d' CHANGELOG.md)" --title "Release v${NEW_VERSION}"`,
+  `gh release create ${NEW_VERSION} --generate-notes${isLatestRelease ? " --latest" : ""} -n "$(sed '1,/^## /d;/^## /,$d' lib/CHANGELOG.md)" --title "Release v${NEW_VERSION}"`,
 );
 
 execSync("node ./scripts/lite.js");
diff --git a/scripts/publish.js b/scripts/publish.js
index e65ea705..9d5d7bbc 100644
--- a/scripts/publish.js
+++ b/scripts/publish.js
@@ -61,7 +61,7 @@ execSync("cd lib/dist && npm publish --provenance --access public");
 
 /** Create GitHub release */
 execSync(
-  `gh release create ${VERSION} --generate-notes --latest -n "$(sed '1,/^## /d;/^## /,$d' CHANGELOG.md)" --title "Release v${VERSION}"`,
+  `gh release create ${VERSION} --generate-notes --latest -n "$(sed '1,/^## /d;/^## /,$d' lib/CHANGELOG.md)" --title "Release v${VERSION}"`,
 );
 
 execSync("node ./scripts/lite.js");

From e72c49c60788d4ee0210cc213be4b1ebc1a9e300 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 09:03:46 +0530
Subject: [PATCH 09/60] docs(changeset): Avoid rerendering without memo.
 Attempt to minify minzip further

---
 .changeset/purple-waves-marry.md              |  5 +
 .../client/theme-switcher/theme-switcher.tsx  | 91 +++++++++----------
 2 files changed, 48 insertions(+), 48 deletions(-)
 create mode 100644 .changeset/purple-waves-marry.md

diff --git a/.changeset/purple-waves-marry.md b/.changeset/purple-waves-marry.md
new file mode 100644
index 00000000..d71f6623
--- /dev/null
+++ b/.changeset/purple-waves-marry.md
@@ -0,0 +1,5 @@
+---
+"nextjs-themes": patch
+---
+
+Avoid rerendering without memo. Attempt to minify minzip further
diff --git a/lib/src/client/theme-switcher/theme-switcher.tsx b/lib/src/client/theme-switcher/theme-switcher.tsx
index 7ba821f3..973afb3f 100644
--- a/lib/src/client/theme-switcher/theme-switcher.tsx
+++ b/lib/src/client/theme-switcher/theme-switcher.tsx
@@ -1,4 +1,4 @@
-import { memo, useEffect } from "react";
+import { useEffect } from "react";
 import { ColorSchemeType } from "../../types";
 import { ResolveFunc, UpdateDOMFunc, UpdateForcedPropsFunc, noFOUCScript } from "./no-fouc";
 import { initialState, useForcedStore, useThemeStore } from "../../store";
@@ -15,42 +15,35 @@ export interface ThemeSwitcherProps {
   nonce?: string;
 }
 
-interface ScriptProps {
-  /** key */
-  k: string;
-  /** nonce */
-  n?: string;
-  /** styles */
-  s?: Record<string, string>;
-  /** forcedTheme */
-  t?: string;
-  /** forcedColorScheme */
-  c?: ColorSchemeType;
-}
-
 let media: MediaQueryList;
 let updateDOM: UpdateDOMFunc;
 let resolveTheme: ResolveFunc;
 let updateForcedProps: UpdateForcedPropsFunc;
 let updateForcedState: UpdateForcedPropsFunc;
 
-const Script = memo(
-  ({ k, n = "", s, t, c }: ScriptProps) => {
-    if (typeof m !== "undefined")
-      [media, updateDOM, resolveTheme, updateForcedProps, updateForcedState] = [m, u, r, f, g];
-    return (
-      <script
-        suppressHydrationWarning
-        // skipcq: JS-0440
-        dangerouslySetInnerHTML={{
-          __html: `(${noFOUCScript.toString()})(${JSON.stringify([k, initialState, s, t, c]).slice(1, -1)})`,
-        }}
-        nonce={n}
-      />
-    );
-  },
-  () => true,
-);
+const Script = ({
+  targetSelector,
+  nonce,
+  styles,
+  forcedTheme,
+  forcedColorScheme,
+}: ThemeSwitcherProps) => {
+  const k = targetSelector || `#${DEFAULT_ID}`;
+  // 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 m !== "undefined")
+    [media, updateDOM, resolveTheme, updateForcedProps, updateForcedState] = [m, u, r, f, g];
+  return (
+    <script
+      // skipcq: JS-0440
+      dangerouslySetInnerHTML={{
+        __html: `(${noFOUCScript})(${JSON.stringify([k, initialState, styles, forcedTheme, forcedColorScheme]).slice(1, -1)})`,
+      }}
+      nonce={nonce}
+    />
+  );
+};
 
 /** disable transition while switching theme */
 const modifyTransition = (themeTransition = "none") => {
@@ -67,28 +60,14 @@ const modifyTransition = (themeTransition = "none") => {
   };
 };
 
-/**
- *
- *
- * @example
- * ```tsx
- * <ThemeSwitcher />
- * ```
- *
- * @source - Source code
- */
-export const ThemeSwitcher = ({
+/** Root switcher */
+const Switcher = ({
   forcedTheme,
   forcedColorScheme,
   targetSelector,
   themeTransition,
-  styles,
-  nonce,
 }: ThemeSwitcherProps) => {
   const k = targetSelector || `#${DEFAULT_ID}`;
-  // 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);
 
   const [state, setState] = useThemeStore(targetSelector);
   const [forced] = useForcedStore(targetSelector);
@@ -118,6 +97,22 @@ export const ThemeSwitcher = ({
     updateForcedState(forced.f, forced.fc);
     updateDOM(resolveTheme(state));
   }, [forced]);
+  return null;
+};
 
-  return <Script {...{ k, n: nonce, s: styles, t: forcedTheme, c: forcedColorScheme }} />;
+/**
+ *
+ *
+ * @example
+ * ```tsx
+ * <ThemeSwitcher />
+ * ```
+ */
+export const ThemeSwitcher = (props: ThemeSwitcherProps) => {
+  return (
+    <>
+      <Script {...props} />
+      <Switcher {...props} />
+    </>
+  );
 };

From de931f44a66ae491028278bc6ae157bfda65f96e Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 03:38:05 +0000
Subject: [PATCH 10/60] RELEASING: Releasing 2 package(s)

Releases:
  nextjs-themes@4.0.0-alpha.2
  @repo/shared@0.0.6-alpha.2
---
 lib/CHANGELOG.md             | 6 ++++++
 lib/package.json             | 2 +-
 packages/shared/CHANGELOG.md | 7 +++++++
 packages/shared/package.json | 2 +-
 4 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/lib/CHANGELOG.md b/lib/CHANGELOG.md
index 6dda9092..5d1440e5 100644
--- a/lib/CHANGELOG.md
+++ b/lib/CHANGELOG.md
@@ -1,5 +1,11 @@
 # nextjs-themes
 
+## 4.0.0-alpha.2
+
+### Patch Changes
+
+- b8164f7: Avoid rerendering without memo. Attempt to minify minzip further
+
 ## 4.0.0-alpha.1
 
 ### Patch Changes
diff --git a/lib/package.json b/lib/package.json
index b56936c3..50204a97 100644
--- a/lib/package.json
+++ b/lib/package.json
@@ -2,7 +2,7 @@
   "name": "nextjs-themes",
   "author": "Mayank Kumar Chaudhari <https://mayank-chaudhari.vercel.app>",
   "private": false,
-  "version": "4.0.0-alpha.1",
+  "version": "4.0.0-alpha.2",
   "description": "Unleash the Power of React Server Components! Use multiple themes on your site with confidence, without losing any advantages of React Server Components.",
   "license": "MPL-2.0",
   "main": "./dist/index.js",
diff --git a/packages/shared/CHANGELOG.md b/packages/shared/CHANGELOG.md
index 22052c90..5a219b9a 100644
--- a/packages/shared/CHANGELOG.md
+++ b/packages/shared/CHANGELOG.md
@@ -1,5 +1,12 @@
 # @repo/shared
 
+## 0.0.6-alpha.2
+
+### Patch Changes
+
+- Updated dependencies [b8164f7]
+  - nextjs-themes@4.0.0-alpha.2
+
 ## 0.0.6-alpha.1
 
 ### Patch Changes
diff --git a/packages/shared/package.json b/packages/shared/package.json
index f184b952..340a1604 100644
--- a/packages/shared/package.json
+++ b/packages/shared/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@repo/shared",
-  "version": "0.0.6-alpha.1",
+  "version": "0.0.6-alpha.2",
   "private": true,
   "sideEffects": false,
   "main": "./dist/index.js",

From 0b97630b8ee2c3b17786b0dfd556e78afee82517 Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 03:38:05 +0000
Subject: [PATCH 11/60] Apply changesets and update CHANGELOG

---
 .changeset/pre.json | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/.changeset/pre.json b/.changeset/pre.json
index 8f93cf92..80b1de7e 100644
--- a/.changeset/pre.json
+++ b/.changeset/pre.json
@@ -5,14 +5,15 @@
     "@example/app": "0.0.0",
     "@example/pages": "0.0.0",
     "@example/vite": "0.0.0",
-    "nextjs-themes": "4.0.0-alpha.0",
+    "nextjs-themes": "4.0.0-alpha.1",
     "@repo/eslint-config": "0.0.0",
     "@repo/typescript-config": "0.0.0",
-    "@repo/shared": "0.0.6-alpha.0",
+    "@repo/shared": "0.0.6-alpha.1",
     "@repo/scripts": "0.0.0"
   },
   "changesets": [
     "fuzzy-timers-lie",
-    "good-cobras-deny"
+    "good-cobras-deny",
+    "purple-waves-marry"
   ]
 }

From 42db692131744563b2d47d1a123fc88548746542 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 10:23:47 +0530
Subject: [PATCH 12/60] Fix publish script

---
 lib/src/client/theme-switcher/no-fouc.ts |  2 +-
 scripts/manual-publish.js                | 17 ++++++++++++++---
 2 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/lib/src/client/theme-switcher/no-fouc.ts b/lib/src/client/theme-switcher/no-fouc.ts
index 56f98585..8322ea44 100644
--- a/lib/src/client/theme-switcher/no-fouc.ts
+++ b/lib/src/client/theme-switcher/no-fouc.ts
@@ -32,7 +32,7 @@ export const noFOUCScript = (
   forcedTheme_?: string,
   forcedColorScheme_?: ColorSchemeType,
 ) => {
-  window.m = matchMedia("(prefers-color-scheme: dark)");
+  window.m = matchMedia(`(prefers-color-scheme:${initialState.d})`);
   const keys = ["color-scheme", "csp", "theme", "th"];
   window.u = values => {
     const el = document.querySelector(key) ?? document.documentElement;
diff --git a/scripts/manual-publish.js b/scripts/manual-publish.js
index 6e12f2f0..22aaa72f 100644
--- a/scripts/manual-publish.js
+++ b/scripts/manual-publish.js
@@ -68,8 +68,19 @@ if (isNotPatch && BRANCH === DEFAULT_BRANCH) {
   execSync(pushCmd);
 }
 
-/** Create release */
-execSync(`cd lib && pnpm build && npm publish --provenance --access public --tag ${tag}`);
+delete pkg.files;
+
+fs.writeFileSync(
+  path.join(__dirname, "../lib/dist/package.json"),
+  JSON.stringify(pkg, null, 2).replace(/dist\//g, ""),
+);
+
+fs.copyFileSync(
+  path.join(__dirname, "../README.md"),
+  path.join(__dirname, "../lib/dist/README.md"),
+);
+
+execSync(`cd lib/dist && npm publish --provenance --access public --tag ${tag}`);
 
 /** Create GitHub release */
 execSync(
@@ -78,5 +89,5 @@ execSync(
 
 execSync("node ./scripts/lite.js");
 execSync(
-  "cd lib && pnpm build && cp package.json dist/package.json && cp README.md dist/README.md && cd dist && npm publish --provenance --access public --tag ${tag}",
+  `cd lib && pnpm build && cp package.json dist/package.json && cp README.md dist/README.md && cd dist && npm publish --provenance --access public --tag ${tag}`,
 );

From be0acc7b25ce6b0eddd70a722644dc6a297bdd32 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 10:39:12 +0530
Subject: [PATCH 13/60] docs(changeset): Touchup

---
 .changeset/clean-turtles-nail.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/clean-turtles-nail.md

diff --git a/.changeset/clean-turtles-nail.md b/.changeset/clean-turtles-nail.md
new file mode 100644
index 00000000..db1d548d
--- /dev/null
+++ b/.changeset/clean-turtles-nail.md
@@ -0,0 +1,5 @@
+---
+"nextjs-themes": patch
+---
+
+Touchup

From 2c36b26674eeba63c2d13fb065b0ce7c85fdbefa Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 05:10:07 +0000
Subject: [PATCH 14/60] RELEASING: Releasing 2 package(s)

Releases:
  nextjs-themes@4.0.0-alpha.3
  @repo/shared@0.0.6-alpha.3
---
 lib/CHANGELOG.md             | 6 ++++++
 lib/package.json             | 2 +-
 packages/shared/CHANGELOG.md | 7 +++++++
 packages/shared/package.json | 2 +-
 4 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/lib/CHANGELOG.md b/lib/CHANGELOG.md
index 5d1440e5..acf17c6c 100644
--- a/lib/CHANGELOG.md
+++ b/lib/CHANGELOG.md
@@ -1,5 +1,11 @@
 # nextjs-themes
 
+## 4.0.0-alpha.3
+
+### Patch Changes
+
+- a31d6e0: Touchup
+
 ## 4.0.0-alpha.2
 
 ### Patch Changes
diff --git a/lib/package.json b/lib/package.json
index 50204a97..af96bb97 100644
--- a/lib/package.json
+++ b/lib/package.json
@@ -2,7 +2,7 @@
   "name": "nextjs-themes",
   "author": "Mayank Kumar Chaudhari <https://mayank-chaudhari.vercel.app>",
   "private": false,
-  "version": "4.0.0-alpha.2",
+  "version": "4.0.0-alpha.3",
   "description": "Unleash the Power of React Server Components! Use multiple themes on your site with confidence, without losing any advantages of React Server Components.",
   "license": "MPL-2.0",
   "main": "./dist/index.js",
diff --git a/packages/shared/CHANGELOG.md b/packages/shared/CHANGELOG.md
index 5a219b9a..92d454af 100644
--- a/packages/shared/CHANGELOG.md
+++ b/packages/shared/CHANGELOG.md
@@ -1,5 +1,12 @@
 # @repo/shared
 
+## 0.0.6-alpha.3
+
+### Patch Changes
+
+- Updated dependencies [a31d6e0]
+  - nextjs-themes@4.0.0-alpha.3
+
 ## 0.0.6-alpha.2
 
 ### Patch Changes
diff --git a/packages/shared/package.json b/packages/shared/package.json
index 340a1604..ba9e9297 100644
--- a/packages/shared/package.json
+++ b/packages/shared/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@repo/shared",
-  "version": "0.0.6-alpha.2",
+  "version": "0.0.6-alpha.3",
   "private": true,
   "sideEffects": false,
   "main": "./dist/index.js",

From d14670e3ca91f0e8c94a359a969487b30f86e426 Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 05:10:08 +0000
Subject: [PATCH 15/60] Apply changesets and update CHANGELOG

---
 .changeset/pre.json | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/.changeset/pre.json b/.changeset/pre.json
index 80b1de7e..666999bd 100644
--- a/.changeset/pre.json
+++ b/.changeset/pre.json
@@ -5,13 +5,14 @@
     "@example/app": "0.0.0",
     "@example/pages": "0.0.0",
     "@example/vite": "0.0.0",
-    "nextjs-themes": "4.0.0-alpha.1",
+    "nextjs-themes": "4.0.0-alpha.2",
     "@repo/eslint-config": "0.0.0",
     "@repo/typescript-config": "0.0.0",
-    "@repo/shared": "0.0.6-alpha.1",
+    "@repo/shared": "0.0.6-alpha.2",
     "@repo/scripts": "0.0.0"
   },
   "changesets": [
+    "clean-turtles-nail",
     "fuzzy-timers-lie",
     "good-cobras-deny",
     "purple-waves-marry"

From aa681a0db1cfba53f51320145739b394350f5756 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 10:45:10 +0530
Subject: [PATCH 16/60] Fix publish script

---
 scripts/manual-publish.js | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/scripts/manual-publish.js b/scripts/manual-publish.js
index 22aaa72f..ae7b300e 100644
--- a/scripts/manual-publish.js
+++ b/scripts/manual-publish.js
@@ -17,7 +17,10 @@ const DEFAULT_BRANCH = process.env.DEFAULT_BRANCH;
 const isLatestRelease = BRANCH === DEFAULT_BRANCH || BRANCH.includes("release-");
 let tag = "latest";
 
-const OLD_VERSION = require("../lib/package.json").version;
+const pkg = require("../lib/package.json");
+
+const OLD_VERSION = pkg.version;
+
 if (!isLatestRelease) {
   /** pre-release branch name should be the tag name (e.g., beta, canery, etc.) or tag name followed by a '-' and version or other specifiers. e.g. beta-2.0 */
   tag = BRANCH.split("-")[0];

From 41ee42b39ac2c67a83b61c3d7fd7f6479ed5b71d Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 05:16:11 +0000
Subject: [PATCH 17/60] RELEASING: Releasing 0 package(s)

Releases:

From 546d3d312cb5ba2e5ab7d4e86db2d6ad66f0e02b Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 05:16:11 +0000
Subject: [PATCH 18/60] Apply changesets and update CHANGELOG

---
 .changeset/pre.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.changeset/pre.json b/.changeset/pre.json
index 666999bd..714ac7fb 100644
--- a/.changeset/pre.json
+++ b/.changeset/pre.json
@@ -5,10 +5,10 @@
     "@example/app": "0.0.0",
     "@example/pages": "0.0.0",
     "@example/vite": "0.0.0",
-    "nextjs-themes": "4.0.0-alpha.2",
+    "nextjs-themes": "4.0.0-alpha.3",
     "@repo/eslint-config": "0.0.0",
     "@repo/typescript-config": "0.0.0",
-    "@repo/shared": "0.0.6-alpha.2",
+    "@repo/shared": "0.0.6-alpha.3",
     "@repo/scripts": "0.0.0"
   },
   "changesets": [

From 2a65684361fdda5307d19d248122698be353d380 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 10:49:14 +0530
Subject: [PATCH 19/60] undo replacing dark with template variable

---
 lib/src/client/theme-switcher/no-fouc.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/src/client/theme-switcher/no-fouc.ts b/lib/src/client/theme-switcher/no-fouc.ts
index 8322ea44..56f98585 100644
--- a/lib/src/client/theme-switcher/no-fouc.ts
+++ b/lib/src/client/theme-switcher/no-fouc.ts
@@ -32,7 +32,7 @@ export const noFOUCScript = (
   forcedTheme_?: string,
   forcedColorScheme_?: ColorSchemeType,
 ) => {
-  window.m = matchMedia(`(prefers-color-scheme:${initialState.d})`);
+  window.m = matchMedia("(prefers-color-scheme: dark)");
   const keys = ["color-scheme", "csp", "theme", "th"];
   window.u = values => {
     const el = document.querySelector(key) ?? document.documentElement;

From 4b9007d07f13a99d02fb9685cb1e0d7bf545ce01 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 11:00:52 +0530
Subject: [PATCH 20/60] Export forced components as well

---
 lib/src/client/index.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/lib/src/client/index.ts b/lib/src/client/index.ts
index 0f0374a3..7c74cd7e 100644
--- a/lib/src/client/index.ts
+++ b/lib/src/client/index.ts
@@ -7,5 +7,7 @@
  */
 
 // client component exports
+export * from "./force-theme";
+export * from "./force-color-scheme";
 export * from "./theme-switcher";
 export * from "./color-switch";

From fc363fb9796a34b617e16aabc987659cff30284e Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 11:01:17 +0530
Subject: [PATCH 21/60] docs(changeset): Test bundle size by re-exporting
 forced components.

---
 .changeset/mighty-toes-boil.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/mighty-toes-boil.md

diff --git a/.changeset/mighty-toes-boil.md b/.changeset/mighty-toes-boil.md
new file mode 100644
index 00000000..3fac3b5c
--- /dev/null
+++ b/.changeset/mighty-toes-boil.md
@@ -0,0 +1,5 @@
+---
+"nextjs-themes": patch
+---
+
+Test bundle size by re-exporting forced components.

From f3326ce194498a0b0561b9a1b632f2538de07106 Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 05:32:33 +0000
Subject: [PATCH 22/60] RELEASING: Releasing 2 package(s)

Releases:
  nextjs-themes@4.0.0-alpha.4
  @repo/shared@0.0.6-alpha.4
---
 lib/CHANGELOG.md             | 6 ++++++
 lib/package.json             | 2 +-
 packages/shared/CHANGELOG.md | 7 +++++++
 packages/shared/package.json | 2 +-
 4 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/lib/CHANGELOG.md b/lib/CHANGELOG.md
index acf17c6c..9bf6b071 100644
--- a/lib/CHANGELOG.md
+++ b/lib/CHANGELOG.md
@@ -1,5 +1,11 @@
 # nextjs-themes
 
+## 4.0.0-alpha.4
+
+### Patch Changes
+
+- 66038c5: Test bundle size by re-exporting forced components.
+
 ## 4.0.0-alpha.3
 
 ### Patch Changes
diff --git a/lib/package.json b/lib/package.json
index af96bb97..415e7a79 100644
--- a/lib/package.json
+++ b/lib/package.json
@@ -2,7 +2,7 @@
   "name": "nextjs-themes",
   "author": "Mayank Kumar Chaudhari <https://mayank-chaudhari.vercel.app>",
   "private": false,
-  "version": "4.0.0-alpha.3",
+  "version": "4.0.0-alpha.4",
   "description": "Unleash the Power of React Server Components! Use multiple themes on your site with confidence, without losing any advantages of React Server Components.",
   "license": "MPL-2.0",
   "main": "./dist/index.js",
diff --git a/packages/shared/CHANGELOG.md b/packages/shared/CHANGELOG.md
index 92d454af..3c070a70 100644
--- a/packages/shared/CHANGELOG.md
+++ b/packages/shared/CHANGELOG.md
@@ -1,5 +1,12 @@
 # @repo/shared
 
+## 0.0.6-alpha.4
+
+### Patch Changes
+
+- Updated dependencies [66038c5]
+  - nextjs-themes@4.0.0-alpha.4
+
 ## 0.0.6-alpha.3
 
 ### Patch Changes
diff --git a/packages/shared/package.json b/packages/shared/package.json
index ba9e9297..4aa342e4 100644
--- a/packages/shared/package.json
+++ b/packages/shared/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@repo/shared",
-  "version": "0.0.6-alpha.3",
+  "version": "0.0.6-alpha.4",
   "private": true,
   "sideEffects": false,
   "main": "./dist/index.js",

From 18131af40a3a474688579ca04998984bc47907e6 Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 05:32:33 +0000
Subject: [PATCH 23/60] Apply changesets and update CHANGELOG

---
 .changeset/pre.json | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.changeset/pre.json b/.changeset/pre.json
index 714ac7fb..d9a298ea 100644
--- a/.changeset/pre.json
+++ b/.changeset/pre.json
@@ -15,6 +15,7 @@
     "clean-turtles-nail",
     "fuzzy-timers-lie",
     "good-cobras-deny",
+    "mighty-toes-boil",
     "purple-waves-marry"
   ]
 }

From 5a267f7dccca7db1017f8fdde209a6b3f96d55ee Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 11:04:08 +0530
Subject: [PATCH 24/60] docs(changeset): Updaet patch

---
 .changeset/brown-laws-perform.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/brown-laws-perform.md

diff --git a/.changeset/brown-laws-perform.md b/.changeset/brown-laws-perform.md
new file mode 100644
index 00000000..89500801
--- /dev/null
+++ b/.changeset/brown-laws-perform.md
@@ -0,0 +1,5 @@
+---
+"nextjs-themes": patch
+---
+
+Updaet patch

From 7eb103849bd7b53193a7d39468a31ba4ffe3635b Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 05:35:16 +0000
Subject: [PATCH 25/60] RELEASING: Releasing 2 package(s)

Releases:
  nextjs-themes@4.0.0-alpha.5
  @repo/shared@0.0.6-alpha.5
---
 lib/CHANGELOG.md             | 6 ++++++
 lib/package.json             | 2 +-
 packages/shared/CHANGELOG.md | 7 +++++++
 packages/shared/package.json | 2 +-
 4 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/lib/CHANGELOG.md b/lib/CHANGELOG.md
index 9bf6b071..4c8a2d53 100644
--- a/lib/CHANGELOG.md
+++ b/lib/CHANGELOG.md
@@ -1,5 +1,11 @@
 # nextjs-themes
 
+## 4.0.0-alpha.5
+
+### Patch Changes
+
+- dfe139c: Updaet patch
+
 ## 4.0.0-alpha.4
 
 ### Patch Changes
diff --git a/lib/package.json b/lib/package.json
index 415e7a79..4ba5b0dd 100644
--- a/lib/package.json
+++ b/lib/package.json
@@ -2,7 +2,7 @@
   "name": "nextjs-themes",
   "author": "Mayank Kumar Chaudhari <https://mayank-chaudhari.vercel.app>",
   "private": false,
-  "version": "4.0.0-alpha.4",
+  "version": "4.0.0-alpha.5",
   "description": "Unleash the Power of React Server Components! Use multiple themes on your site with confidence, without losing any advantages of React Server Components.",
   "license": "MPL-2.0",
   "main": "./dist/index.js",
diff --git a/packages/shared/CHANGELOG.md b/packages/shared/CHANGELOG.md
index 3c070a70..30068681 100644
--- a/packages/shared/CHANGELOG.md
+++ b/packages/shared/CHANGELOG.md
@@ -1,5 +1,12 @@
 # @repo/shared
 
+## 0.0.6-alpha.5
+
+### Patch Changes
+
+- Updated dependencies [dfe139c]
+  - nextjs-themes@4.0.0-alpha.5
+
 ## 0.0.6-alpha.4
 
 ### Patch Changes
diff --git a/packages/shared/package.json b/packages/shared/package.json
index 4aa342e4..cb0ba01f 100644
--- a/packages/shared/package.json
+++ b/packages/shared/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@repo/shared",
-  "version": "0.0.6-alpha.4",
+  "version": "0.0.6-alpha.5",
   "private": true,
   "sideEffects": false,
   "main": "./dist/index.js",

From ea603def0fe3c1af8485bff0348f85385cb5a13e Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 05:35:17 +0000
Subject: [PATCH 26/60] Apply changesets and update CHANGELOG

---
 .changeset/pre.json | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/.changeset/pre.json b/.changeset/pre.json
index d9a298ea..0373a10f 100644
--- a/.changeset/pre.json
+++ b/.changeset/pre.json
@@ -5,13 +5,14 @@
     "@example/app": "0.0.0",
     "@example/pages": "0.0.0",
     "@example/vite": "0.0.0",
-    "nextjs-themes": "4.0.0-alpha.3",
+    "nextjs-themes": "4.0.0-alpha.4",
     "@repo/eslint-config": "0.0.0",
     "@repo/typescript-config": "0.0.0",
-    "@repo/shared": "0.0.6-alpha.3",
+    "@repo/shared": "0.0.6-alpha.4",
     "@repo/scripts": "0.0.0"
   },
   "changesets": [
+    "brown-laws-perform",
     "clean-turtles-nail",
     "fuzzy-timers-lie",
     "good-cobras-deny",

From 6407a5d5ff8b373df6b86f8675d90622418a8ea9 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 18:04:12 +0530
Subject: [PATCH 27/60] docs(changeset): Minify CSS

---
 .changeset/moody-eggs-report.md               |  5 ++++
 .../color-switch/color-switch.module.scss     | 24 +++++++++----------
 lib/tsup.config.ts                            |  2 +-
 3 files changed, 18 insertions(+), 13 deletions(-)
 create mode 100644 .changeset/moody-eggs-report.md

diff --git a/.changeset/moody-eggs-report.md b/.changeset/moody-eggs-report.md
new file mode 100644
index 00000000..eeda6199
--- /dev/null
+++ b/.changeset/moody-eggs-report.md
@@ -0,0 +1,5 @@
+---
+"nextjs-themes": patch
+---
+
+Minify CSS
diff --git a/lib/src/client/color-switch/color-switch.module.scss b/lib/src/client/color-switch/color-switch.module.scss
index 8a10d3f1..05922b22 100644
--- a/lib/src/client/color-switch/color-switch.module.scss
+++ b/lib/src/client/color-switch/color-switch.module.scss
@@ -1,4 +1,4 @@
-.color-switch {
+.s {
   all: unset;
   position: relative;
   box-shadow: none;
@@ -12,9 +12,9 @@
   transition: all 0.3s ease-in-out 0s !important;
 }
 
-[data-csp="system"] .color-switch::after,
-[data-csp="system"] ~ .color-switch::after,
-[data-csp="system"] ~ * .color-switch::after {
+[data-csp="system"] .s::after,
+[data-csp="system"] ~ .s::after,
+[data-csp="system"] ~ * .s::after {
   position: absolute;
   height: 100%;
   width: 100%;
@@ -28,24 +28,24 @@
   content: "A";
 }
 
-[data-csp="dark"] .color-switch,
-[data-csp="dark"] ~ .color-switch,
-[data-csp="dark"] ~ * .color-switch {
+[data-csp="dark"] .s,
+[data-csp="dark"] ~ .s,
+[data-csp="dark"] ~ * .s {
   box-shadow: calc(var(--size) / 4) calc(var(--size) / -4) calc(var(--size) / 8) inset #fff;
   border: none;
   background: transparent;
-  animation: swing linear 0.5s;
+  animation: a linear 0.5s;
 }
 
-[data-csp="light"] .color-switch,
-[data-csp="light"] ~ .color-switch,
-[data-csp="light"] ~ * .color-switch {
+[data-csp="light"] .s,
+[data-csp="light"] ~ .s,
+[data-csp="light"] ~ * .s {
   box-shadow: 0 0 50px 10px yellow;
   background-color: yellow;
   border: 1px solid orangered;
 }
 
-@keyframes swing {
+@keyframes a {
   40% {
     transform: rotate(-15deg);
   }
diff --git a/lib/tsup.config.ts b/lib/tsup.config.ts
index d7e4c2ec..356d28b2 100644
--- a/lib/tsup.config.ts
+++ b/lib/tsup.config.ts
@@ -15,7 +15,7 @@ export default defineConfig(
       minify: !options.watch,
       esbuildPlugins: [
         react18Plugin({ disableJSXRequireDedup: true }),
-        cssPlugin({ generateScopedName: "nextjs-themes--[local]" }),
+        cssPlugin({ generateScopedName: "nth-[local]" }),
         rdiPlugin(),
       ],
       ...options,

From 471aa4697ff15d9d4774c8a21c3ea7fb516b4d21 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 18:05:31 +0530
Subject: [PATCH 28/60] Minify styles

---
 lib/src/client/color-switch/color-switch.module.scss | 10 +++++-----
 lib/src/client/color-switch/color-switch.tsx         |  4 ++--
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/lib/src/client/color-switch/color-switch.module.scss b/lib/src/client/color-switch/color-switch.module.scss
index 05922b22..d0a27ad4 100644
--- a/lib/src/client/color-switch/color-switch.module.scss
+++ b/lib/src/client/color-switch/color-switch.module.scss
@@ -6,9 +6,9 @@
   border-radius: 50%;
   border: 1px dashed gray;
   cursor: pointer;
-  --size: 25px;
-  height: var(--size);
-  width: var(--size);
+  --s: 25px;
+  height: var(--s);
+  width: var(--s);
   transition: all 0.3s ease-in-out 0s !important;
 }
 
@@ -21,7 +21,7 @@
   top: 0;
   left: 0;
   font-weight: 600;
-  font-size: calc(1 * var(--size) / 2);
+  font-size: calc(1 * var(--s) / 2);
   display: flex;
   align-items: center;
   justify-content: center;
@@ -31,7 +31,7 @@
 [data-csp="dark"] .s,
 [data-csp="dark"] ~ .s,
 [data-csp="dark"] ~ * .s {
-  box-shadow: calc(var(--size) / 4) calc(var(--size) / -4) calc(var(--size) / 8) inset #fff;
+  box-shadow: calc(var(--s) / 4) calc(var(--s) / -4) calc(var(--s) / 8) inset #fff;
   border: none;
   background: transparent;
   animation: a linear 0.5s;
diff --git a/lib/src/client/color-switch/color-switch.tsx b/lib/src/client/color-switch/color-switch.tsx
index 1d21cd7f..1f14260d 100644
--- a/lib/src/client/color-switch/color-switch.tsx
+++ b/lib/src/client/color-switch/color-switch.tsx
@@ -33,7 +33,7 @@ export const ColorSwitch = ({
 }: ColorSwitchProps) => {
   const { toggleColorScheme } = useTheme(targetSelector);
 
-  const cls = [styles["color-switch"], className].join(" ");
+  const cls = [styles.s, className].join(" ");
   return (
     <button
       className={cls}
@@ -41,7 +41,7 @@ export const ColorSwitch = ({
       // skipcq: JS-0417
       onClick={() => toggleColorScheme(skipSystem)}
       // @ts-expect-error -- setting custom attribute
-      style={{ "--size": `${size}px` }}
+      style={{ "--s": `${size}px` }}
       {...props}
     />
   );

From 1cda16f92c51bc17e3abcb462b3bc49339b8235c Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 12:36:35 +0000
Subject: [PATCH 29/60] RELEASING: Releasing 2 package(s)

Releases:
  nextjs-themes@4.0.0-alpha.6
  @repo/shared@0.0.6-alpha.6
---
 lib/CHANGELOG.md             | 6 ++++++
 lib/package.json             | 2 +-
 packages/shared/CHANGELOG.md | 7 +++++++
 packages/shared/package.json | 2 +-
 4 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/lib/CHANGELOG.md b/lib/CHANGELOG.md
index 4c8a2d53..93832180 100644
--- a/lib/CHANGELOG.md
+++ b/lib/CHANGELOG.md
@@ -1,5 +1,11 @@
 # nextjs-themes
 
+## 4.0.0-alpha.6
+
+### Patch Changes
+
+- c21dd8f: Minify CSS
+
 ## 4.0.0-alpha.5
 
 ### Patch Changes
diff --git a/lib/package.json b/lib/package.json
index 4ba5b0dd..5f7dbfa5 100644
--- a/lib/package.json
+++ b/lib/package.json
@@ -2,7 +2,7 @@
   "name": "nextjs-themes",
   "author": "Mayank Kumar Chaudhari <https://mayank-chaudhari.vercel.app>",
   "private": false,
-  "version": "4.0.0-alpha.5",
+  "version": "4.0.0-alpha.6",
   "description": "Unleash the Power of React Server Components! Use multiple themes on your site with confidence, without losing any advantages of React Server Components.",
   "license": "MPL-2.0",
   "main": "./dist/index.js",
diff --git a/packages/shared/CHANGELOG.md b/packages/shared/CHANGELOG.md
index 30068681..884d00f7 100644
--- a/packages/shared/CHANGELOG.md
+++ b/packages/shared/CHANGELOG.md
@@ -1,5 +1,12 @@
 # @repo/shared
 
+## 0.0.6-alpha.6
+
+### Patch Changes
+
+- Updated dependencies [c21dd8f]
+  - nextjs-themes@4.0.0-alpha.6
+
 ## 0.0.6-alpha.5
 
 ### Patch Changes
diff --git a/packages/shared/package.json b/packages/shared/package.json
index cb0ba01f..8eed8c13 100644
--- a/packages/shared/package.json
+++ b/packages/shared/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@repo/shared",
-  "version": "0.0.6-alpha.5",
+  "version": "0.0.6-alpha.6",
   "private": true,
   "sideEffects": false,
   "main": "./dist/index.js",

From 96fea66f99d2f718e7779c48bbd3c7c665b42691 Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 12:36:36 +0000
Subject: [PATCH 30/60] Apply changesets and update CHANGELOG

---
 .changeset/pre.json | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/.changeset/pre.json b/.changeset/pre.json
index 0373a10f..068e9f25 100644
--- a/.changeset/pre.json
+++ b/.changeset/pre.json
@@ -5,10 +5,10 @@
     "@example/app": "0.0.0",
     "@example/pages": "0.0.0",
     "@example/vite": "0.0.0",
-    "nextjs-themes": "4.0.0-alpha.4",
+    "nextjs-themes": "4.0.0-alpha.5",
     "@repo/eslint-config": "0.0.0",
     "@repo/typescript-config": "0.0.0",
-    "@repo/shared": "0.0.6-alpha.4",
+    "@repo/shared": "0.0.6-alpha.5",
     "@repo/scripts": "0.0.0"
   },
   "changesets": [
@@ -17,6 +17,7 @@
     "fuzzy-timers-lie",
     "good-cobras-deny",
     "mighty-toes-boil",
+    "moody-eggs-report",
     "purple-waves-marry"
   ]
 }

From c03e3f32d840b6b921e80c384fb559d9e3d889c3 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 18:07:31 +0530
Subject: [PATCH 31/60] Final updates after removing rarely used exports

---
 lib/src/client/index.ts | 2 --
 1 file changed, 2 deletions(-)

diff --git a/lib/src/client/index.ts b/lib/src/client/index.ts
index 7c74cd7e..0f0374a3 100644
--- a/lib/src/client/index.ts
+++ b/lib/src/client/index.ts
@@ -7,7 +7,5 @@
  */
 
 // client component exports
-export * from "./force-theme";
-export * from "./force-color-scheme";
 export * from "./theme-switcher";
 export * from "./color-switch";

From 65568490f82dfba8cf56e63cde191fe3d92220b8 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 18:07:47 +0530
Subject: [PATCH 32/60] docs(changeset): Remove rarely used exports

---
 .changeset/plenty-chicken-provide.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/plenty-chicken-provide.md

diff --git a/.changeset/plenty-chicken-provide.md b/.changeset/plenty-chicken-provide.md
new file mode 100644
index 00000000..afcb4a0d
--- /dev/null
+++ b/.changeset/plenty-chicken-provide.md
@@ -0,0 +1,5 @@
+---
+"nextjs-themes": patch
+---
+
+Remove rarely used exports

From 661427bd99d77b38e98a8d43bab90bbd49d12974 Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 12:38:48 +0000
Subject: [PATCH 33/60] RELEASING: Releasing 2 package(s)

Releases:
  nextjs-themes@4.0.0-alpha.7
  @repo/shared@0.0.6-alpha.7
---
 lib/CHANGELOG.md             | 6 ++++++
 lib/package.json             | 2 +-
 packages/shared/CHANGELOG.md | 7 +++++++
 packages/shared/package.json | 2 +-
 4 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/lib/CHANGELOG.md b/lib/CHANGELOG.md
index 93832180..b74383d8 100644
--- a/lib/CHANGELOG.md
+++ b/lib/CHANGELOG.md
@@ -1,5 +1,11 @@
 # nextjs-themes
 
+## 4.0.0-alpha.7
+
+### Patch Changes
+
+- 691038e: Remove rarely used exports
+
 ## 4.0.0-alpha.6
 
 ### Patch Changes
diff --git a/lib/package.json b/lib/package.json
index 5f7dbfa5..306c095b 100644
--- a/lib/package.json
+++ b/lib/package.json
@@ -2,7 +2,7 @@
   "name": "nextjs-themes",
   "author": "Mayank Kumar Chaudhari <https://mayank-chaudhari.vercel.app>",
   "private": false,
-  "version": "4.0.0-alpha.6",
+  "version": "4.0.0-alpha.7",
   "description": "Unleash the Power of React Server Components! Use multiple themes on your site with confidence, without losing any advantages of React Server Components.",
   "license": "MPL-2.0",
   "main": "./dist/index.js",
diff --git a/packages/shared/CHANGELOG.md b/packages/shared/CHANGELOG.md
index 884d00f7..cae70a5e 100644
--- a/packages/shared/CHANGELOG.md
+++ b/packages/shared/CHANGELOG.md
@@ -1,5 +1,12 @@
 # @repo/shared
 
+## 0.0.6-alpha.7
+
+### Patch Changes
+
+- Updated dependencies [691038e]
+  - nextjs-themes@4.0.0-alpha.7
+
 ## 0.0.6-alpha.6
 
 ### Patch Changes
diff --git a/packages/shared/package.json b/packages/shared/package.json
index 8eed8c13..01bfc26e 100644
--- a/packages/shared/package.json
+++ b/packages/shared/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@repo/shared",
-  "version": "0.0.6-alpha.6",
+  "version": "0.0.6-alpha.7",
   "private": true,
   "sideEffects": false,
   "main": "./dist/index.js",

From d6cb23a7f97a78f4c6ac700a5cf5d8cd8b1bfc57 Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 12:38:49 +0000
Subject: [PATCH 34/60] Apply changesets and update CHANGELOG

---
 .changeset/pre.json | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/.changeset/pre.json b/.changeset/pre.json
index 068e9f25..00ce46ff 100644
--- a/.changeset/pre.json
+++ b/.changeset/pre.json
@@ -5,10 +5,10 @@
     "@example/app": "0.0.0",
     "@example/pages": "0.0.0",
     "@example/vite": "0.0.0",
-    "nextjs-themes": "4.0.0-alpha.5",
+    "nextjs-themes": "4.0.0-alpha.6",
     "@repo/eslint-config": "0.0.0",
     "@repo/typescript-config": "0.0.0",
-    "@repo/shared": "0.0.6-alpha.5",
+    "@repo/shared": "0.0.6-alpha.6",
     "@repo/scripts": "0.0.0"
   },
   "changesets": [
@@ -18,6 +18,7 @@
     "good-cobras-deny",
     "mighty-toes-boil",
     "moody-eggs-report",
+    "plenty-chicken-provide",
     "purple-waves-marry"
   ]
 }

From 5c703e3591bb302bcc2d742ae287de4833ec041b Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 18:22:27 +0530
Subject: [PATCH 35/60] Import color-switch and hook from their own files

---
 lib/src/client/index.ts | 1 -
 lib/src/index.ts        | 1 -
 2 files changed, 2 deletions(-)

diff --git a/lib/src/client/index.ts b/lib/src/client/index.ts
index 0f0374a3..b6facbd0 100644
--- a/lib/src/client/index.ts
+++ b/lib/src/client/index.ts
@@ -8,4 +8,3 @@
 
 // client component exports
 export * from "./theme-switcher";
-export * from "./color-switch";
diff --git a/lib/src/index.ts b/lib/src/index.ts
index 6ee894f8..4e097645 100644
--- a/lib/src/index.ts
+++ b/lib/src/index.ts
@@ -1,5 +1,4 @@
 "use client";
 // client component exports
 export * from "./client";
-export * from "./hooks";
 export * from "./types";

From 2e377ece930d1267bf65dfaf1de7289cf11f30a2 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 18:22:53 +0530
Subject: [PATCH 36/60] docs(changeset): Import hook and color-switch from
 their own files.

---
 .changeset/twenty-paws-bathe.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/twenty-paws-bathe.md

diff --git a/.changeset/twenty-paws-bathe.md b/.changeset/twenty-paws-bathe.md
new file mode 100644
index 00000000..96971d69
--- /dev/null
+++ b/.changeset/twenty-paws-bathe.md
@@ -0,0 +1,5 @@
+---
+"nextjs-themes": patch
+---
+
+Import hook and color-switch from their own files.

From d5abb2ad018d7db246c8b49dcd7fc3d256b136b6 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 18:26:44 +0530
Subject: [PATCH 37/60] Fix build

---
 README.md                                                     | 4 ++--
 .../src/client/theme-controller/color-scheme-preference.tsx   | 2 +-
 .../shared/src/client/theme-controller/theme-selector.tsx     | 2 +-
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/README.md b/README.md
index 68b14a89..cccff724 100644
--- a/README.md
+++ b/README.md
@@ -161,7 +161,7 @@ Show different images based on the current theme:
 
 ```ts
 import Image from "next/image";
-import { useTheme } from "nextjs-themes";
+import { useTheme } from "nextjs-themes/hooks";
 
 function ThemedImage() {
   const { resolvedTheme } = useTheme();
@@ -177,7 +177,7 @@ export default ThemedImage;
 The `useTheme` hook provides theme information and allows changing the theme:
 
 ```js
-import { useTheme } from "nextjs-themes";
+import { useTheme } from "nextjs-themes/hooks";
 
 const ThemeChanger = () => {
   const { theme, setTheme } = useTheme();
diff --git a/packages/shared/src/client/theme-controller/color-scheme-preference.tsx b/packages/shared/src/client/theme-controller/color-scheme-preference.tsx
index 055f573b..48fcad7a 100644
--- a/packages/shared/src/client/theme-controller/color-scheme-preference.tsx
+++ b/packages/shared/src/client/theme-controller/color-scheme-preference.tsx
@@ -1,6 +1,6 @@
 "use client";
 import type { ColorSchemeType } from "nextjs-themes";
-import { useTheme } from "nextjs-themes";
+import { useTheme } from "nextjs-themes/hooks";
 import type { ChangeEvent } from "react";
 import { Select } from "../select";
 import styles from "./theme-controller.module.scss";
diff --git a/packages/shared/src/client/theme-controller/theme-selector.tsx b/packages/shared/src/client/theme-controller/theme-selector.tsx
index 0234f776..4dab1d28 100644
--- a/packages/shared/src/client/theme-controller/theme-selector.tsx
+++ b/packages/shared/src/client/theme-controller/theme-selector.tsx
@@ -1,6 +1,6 @@
 "use client";
 import type { ColorSchemeType } from "nextjs-themes";
-import { useTheme } from "nextjs-themes";
+import { useTheme } from "nextjs-themes/hooks";
 import { useEffect, useMemo } from "react";
 import type { ChangeEvent } from "react";
 import { Select } from "../select";

From 50eb2b24cd57dab75ec03e41739c639ebd007601 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 18:33:51 +0530
Subject: [PATCH 38/60] Fix build

---
 examples/app-router/src/app/layout.tsx   | 2 +-
 examples/pages-router/src/pages/_app.tsx | 2 +-
 examples/vite/src/app/index.tsx          | 2 +-
 lib/package.json                         | 6 +++---
 4 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/examples/app-router/src/app/layout.tsx b/examples/app-router/src/app/layout.tsx
index 098ee468..bf1a6731 100644
--- a/examples/app-router/src/app/layout.tsx
+++ b/examples/app-router/src/app/layout.tsx
@@ -7,7 +7,7 @@ import { Inter } from "next/font/google";
 import Link from "next/link";
 import { Cards, LandingPage } from "@repo/shared/dist/server";
 import { PageNavigatorCard, ThemeController } from "@repo/shared";
-import { ColorSwitch } from "nextjs-themes";
+import { ColorSwitch } from "nextjs-themes/color-switch";
 
 const inter = Inter({ subsets: ["latin"] });
 
diff --git a/examples/pages-router/src/pages/_app.tsx b/examples/pages-router/src/pages/_app.tsx
index 02b30810..a21467e5 100644
--- a/examples/pages-router/src/pages/_app.tsx
+++ b/examples/pages-router/src/pages/_app.tsx
@@ -8,7 +8,7 @@ import { Header } from "@repo/shared";
 import Link from "next/link";
 import { Card, Cards, LandingPage } from "@repo/shared/dist/server";
 import { ThemeController, PageNavigatorCard } from "@repo/shared";
-import { ColorSwitch } from "nextjs-themes";
+import { ColorSwitch } from "nextjs-themes/color-switch";
 
 const inter = Inter({ subsets: ["latin"] });
 
diff --git a/examples/vite/src/app/index.tsx b/examples/vite/src/app/index.tsx
index 2d13ec12..b686dce5 100644
--- a/examples/vite/src/app/index.tsx
+++ b/examples/vite/src/app/index.tsx
@@ -1,7 +1,7 @@
 import React from "react";
 import "./styles.css";
 import { Cards, LandingPage } from "@repo/shared/dist/server";
-import { ColorSwitch } from "nextjs-themes";
+import { ColorSwitch } from "nextjs-themes/color-switch";
 import { Header, PageNavigatorCard, ThemeController } from "@repo/shared";
 import { Link } from "react-router-dom";
 
diff --git a/lib/package.json b/lib/package.json
index 306c095b..e07105ad 100644
--- a/lib/package.json
+++ b/lib/package.json
@@ -91,9 +91,9 @@
       "import": "./dist/hooks/index.mjs",
       "types": "./dist/hooks/index.d.ts"
     },
-    "./styles.css": "./dist/index.css",
-    "./styles": "./dist/index.css",
-    "./css": "./dist/index.css"
+    "./styles.css": "./dist/client/color-switch/index.css",
+    "./styles": "./dist/client/color-switch/index.css",
+    "./css": "./dist/client/color-switch/index.css"
   },
   "scripts": {
     "build": "tsup && tsc -p tsconfig-build.json",

From 8884ac23372703debd498f8f598894be3227f926 Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 13:04:56 +0000
Subject: [PATCH 39/60] RELEASING: Releasing 2 package(s)

Releases:
  nextjs-themes@4.0.0-alpha.8
  @repo/shared@0.0.6-alpha.8
---
 lib/CHANGELOG.md             | 6 ++++++
 lib/package.json             | 2 +-
 packages/shared/CHANGELOG.md | 7 +++++++
 packages/shared/package.json | 2 +-
 4 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/lib/CHANGELOG.md b/lib/CHANGELOG.md
index b74383d8..8c46b559 100644
--- a/lib/CHANGELOG.md
+++ b/lib/CHANGELOG.md
@@ -1,5 +1,11 @@
 # nextjs-themes
 
+## 4.0.0-alpha.8
+
+### Patch Changes
+
+- c72dd2d: Import hook and color-switch from their own files.
+
 ## 4.0.0-alpha.7
 
 ### Patch Changes
diff --git a/lib/package.json b/lib/package.json
index e07105ad..57f1a51e 100644
--- a/lib/package.json
+++ b/lib/package.json
@@ -2,7 +2,7 @@
   "name": "nextjs-themes",
   "author": "Mayank Kumar Chaudhari <https://mayank-chaudhari.vercel.app>",
   "private": false,
-  "version": "4.0.0-alpha.7",
+  "version": "4.0.0-alpha.8",
   "description": "Unleash the Power of React Server Components! Use multiple themes on your site with confidence, without losing any advantages of React Server Components.",
   "license": "MPL-2.0",
   "main": "./dist/index.js",
diff --git a/packages/shared/CHANGELOG.md b/packages/shared/CHANGELOG.md
index cae70a5e..c7f503e1 100644
--- a/packages/shared/CHANGELOG.md
+++ b/packages/shared/CHANGELOG.md
@@ -1,5 +1,12 @@
 # @repo/shared
 
+## 0.0.6-alpha.8
+
+### Patch Changes
+
+- Updated dependencies [c72dd2d]
+  - nextjs-themes@4.0.0-alpha.8
+
 ## 0.0.6-alpha.7
 
 ### Patch Changes
diff --git a/packages/shared/package.json b/packages/shared/package.json
index 01bfc26e..ff4a41b5 100644
--- a/packages/shared/package.json
+++ b/packages/shared/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@repo/shared",
-  "version": "0.0.6-alpha.7",
+  "version": "0.0.6-alpha.8",
   "private": true,
   "sideEffects": false,
   "main": "./dist/index.js",

From 5817e00fbfaa38c433309071c679804045c1086c Mon Sep 17 00:00:00 2001
From: mayank1513 <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 13:04:57 +0000
Subject: [PATCH 40/60] Apply changesets and update CHANGELOG

---
 .changeset/pre.json | 7 ++++---
 lib/README.md       | 4 ++--
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/.changeset/pre.json b/.changeset/pre.json
index 00ce46ff..3d762529 100644
--- a/.changeset/pre.json
+++ b/.changeset/pre.json
@@ -5,10 +5,10 @@
     "@example/app": "0.0.0",
     "@example/pages": "0.0.0",
     "@example/vite": "0.0.0",
-    "nextjs-themes": "4.0.0-alpha.6",
+    "nextjs-themes": "4.0.0-alpha.7",
     "@repo/eslint-config": "0.0.0",
     "@repo/typescript-config": "0.0.0",
-    "@repo/shared": "0.0.6-alpha.6",
+    "@repo/shared": "0.0.6-alpha.7",
     "@repo/scripts": "0.0.0"
   },
   "changesets": [
@@ -19,6 +19,7 @@
     "mighty-toes-boil",
     "moody-eggs-report",
     "plenty-chicken-provide",
-    "purple-waves-marry"
+    "purple-waves-marry",
+    "twenty-paws-bathe"
   ]
 }
diff --git a/lib/README.md b/lib/README.md
index 68b14a89..cccff724 100644
--- a/lib/README.md
+++ b/lib/README.md
@@ -161,7 +161,7 @@ Show different images based on the current theme:
 
 ```ts
 import Image from "next/image";
-import { useTheme } from "nextjs-themes";
+import { useTheme } from "nextjs-themes/hooks";
 
 function ThemedImage() {
   const { resolvedTheme } = useTheme();
@@ -177,7 +177,7 @@ export default ThemedImage;
 The `useTheme` hook provides theme information and allows changing the theme:
 
 ```js
-import { useTheme } from "nextjs-themes";
+import { useTheme } from "nextjs-themes/hooks";
 
 const ThemeChanger = () => {
   const { theme, setTheme } = useTheme();

From f1eeedb206ee207a3acac2e6d15197a009391299 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 19:18:12 +0530
Subject: [PATCH 41/60] Balanced

---
 lib/src/client/index.ts | 1 +
 lib/src/index.ts        | 1 +
 2 files changed, 2 insertions(+)

diff --git a/lib/src/client/index.ts b/lib/src/client/index.ts
index b6facbd0..0f0374a3 100644
--- a/lib/src/client/index.ts
+++ b/lib/src/client/index.ts
@@ -8,3 +8,4 @@
 
 // client component exports
 export * from "./theme-switcher";
+export * from "./color-switch";
diff --git a/lib/src/index.ts b/lib/src/index.ts
index 4e097645..6ee894f8 100644
--- a/lib/src/index.ts
+++ b/lib/src/index.ts
@@ -1,4 +1,5 @@
 "use client";
 // client component exports
 export * from "./client";
+export * from "./hooks";
 export * from "./types";

From c2ca688410b805a608bd7d0e02b94cb1b76aa774 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 21:21:28 +0530
Subject: [PATCH 42/60] Update docs title

---
 typedoc.config.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/typedoc.config.js b/typedoc.config.js
index db6843c8..bf30931c 100644
--- a/typedoc.config.js
+++ b/typedoc.config.js
@@ -1,7 +1,7 @@
 /** @type {import('typedoc').TypeDocOptions} */
 module.exports = {
   tsconfig: "tsconfig.docs.json",
-  name: "React18 Loaders",
+  name: "Nextjs Themes",
   entryPoints: ["./lib/src"],
   exclude: ["**/*.test.tsx", "**/index.ts", "**/declaration.d.ts"],
   entryPointStrategy: "Expand",

From a741ed9e9cb38121b36b05644b8f0a5b19dd6242 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 21:25:36 +0530
Subject: [PATCH 43/60] Update contributing.md

---
 contributing.md | 66 +++++++++++++++++++++++++++----------------------
 1 file changed, 37 insertions(+), 29 deletions(-)

diff --git a/contributing.md b/contributing.md
index 39256cad..c3b280d5 100644
--- a/contributing.md
+++ b/contributing.md
@@ -4,39 +4,43 @@
 
 ### Included Utilities
 
-This template is equipped with pre-configured tools to streamline your development process:
-
-- Monorepo setup powered by TurboRepo
-  - TurboRepo is renowned for its efficient builds and caching mechanisms, minimizing unnecessary builds.
-- [TypeScript](https://www.typescriptlang.org/) for static type checking
-- [ESLint](https://eslint.org/) for code linting
-- [Prettier](https://prettier.io) for code formatting
-- Plop-based code generator for effortlessly scaffolding new components
-- Automatic rebranding functionality for this template
-- Workflows facilitating testing, documentation, dependency updates, and deployment of your docs and packages
-- Build setup capable of creating appropriate CJS and ESM builds to support React 18 server and client component exports from the same library
-- Out-of-the-box support for SCSS modules for `lib` and `packages/shared`
+This project is configured with a suite of pre-configured tools to enhance development experience:
+
+- **Monorepo setup with TurboRepo**:
+  - TurboRepo provides efficient builds and caching, reducing unnecessary rebuilds.
+- [TypeScript](https://www.typescriptlang.org/) for static type checking.
+- [ESLint](https://eslint.org/) for code linting.
+- [Prettier](https://prettier.io) for code formatting.
+- A Plop-based code generator for easy component scaffolding.
+- Workflows for testing, documentation, dependency updates, and deployment of docs and packages.
+- Build setup for generating both CJS and ESM builds to support React 18 server and client component exports from the same library.
+- Native support for SCSS modules in `lib` and `packages/shared`.
 
 ### Apps and Packages
 
-This TurboRepo comprises the following packages/examples, all written in [TypeScript](https://www.typescriptlang.org/):
+This TurboRepo includes the following packages/examples, all in [TypeScript](https://www.typescriptlang.org/):
 
-- `@example/nextjs`: a [Next.js](https://nextjs.org/) app
-- `@example/vite`: a [Vite.js](https://vitest.dev) app
-- `@example/remix`: a Remix app
-- `@repo/eslint-config`: `eslint` configurations (includes `eslint-config-next` and `eslint-config-prettier`)
-- `@repo/typescript-config`: `tsconfig.json`s used throughout the monorepo
-- `@repo/jest-presets`: Jest presets for unit testing
-- `@repo/shared`: An internal library of components utilized by the examples
-- `react18-loaders`: a React component library (The core package published to NPM)
+- **`nextjs-themes`**: The core React component library (published to NPM).
+- **`@example/app-router`**: A [Next.js](https://nextjs.org/) example app using the app router/directory.
+- **`@example/pages-router`**: A [Next.js](https://nextjs.org/) example app using the pages router.
+- **`@example/vite`**: A [Vite.js](https://vitejs.dev) app.
+- **`@repo/config-eslint`**: ESLint configurations (includes `eslint-config-next` and `eslint-config-prettier`).
+- **`@repo/config-typescript`**: `tsconfig.json` configurations used throughout the monorepo.
+- **`@repo/shared`**: An internal library of components used by the examples.
 
 ## Automated File Generation
 
-Simply execute `yarn turbo gen` and follow the prompts to automatically generate your new component along with a test file and dependency linking, adhering to best practices.
+To automatically generate a new component along with a test file and dependency linking, run:
+
+```bash
+yarn plop
+```
+
+Follow the prompts to ensure adherence to best practices.
 
 ### Build
 
-To build all apps and packages, execute the following command:
+To build all apps and packages, run:
 
 ```bash
 pnpm build
@@ -44,7 +48,7 @@ pnpm build
 
 ### Development
 
-For development of all apps and packages, run:
+For developing all apps and packages, use:
 
 ```bash
 pnpm dev
@@ -52,7 +56,7 @@ pnpm dev
 
 ### Running Unit Tests
 
-To execute unit tests, use:
+To run unit tests, execute:
 
 ```bash
 pnpm test
@@ -60,7 +64,7 @@ pnpm test
 
 ### Linting and Formatting
 
-Before creating a PR, ensure that linting passes and format the code properly with:
+Before submitting a PR, ensure your code passes linting and is properly formatted by running:
 
 ```bash
 pnpm lint
@@ -74,9 +78,9 @@ pnpm format
 
 ## Useful Resources
 
-Explore more about TurboRepo and Next.js through the following links:
+Learn more about TurboRepo and Next.js through these links:
 
-- [React and Next.js with TypeScript](https://www.udemy.com/course/react-and-next-js-with-typescript/?referralCode=7202184A1E57C3DCA8B2) - an interactive Next.js course.
+- [React and Next.js with TypeScript](https://www.udemy.com/course/react-and-next-js-with-typescript/?referralCode=7202184A1E57C3DCA8B2) - An interactive Next.js course.
 - [The Game of Chess with Next.js, React, and TypeScript](https://www.udemy.com/course/game-of-chess-with-nextjs-react-and-typescrypt/?referralCode=851A28F10B254A8523FE)
 - [Tasks](https://turbo.build/repo/docs/core-concepts/monorepos/running-tasks)
 - [Caching](https://turbo.build/repo/docs/core-concepts/caching)
@@ -85,7 +89,11 @@ Explore more about TurboRepo and Next.js through the following links:
 - [Configuration Options](https://turbo.build/repo/docs/reference/configuration)
 - [CLI Usage](https://turbo.build/repo/docs/reference/command-line-reference)
 
-> Quick tip: Remove all stale branches with `git branch --merged main | grep -v '^[ *]*main$' | xargs git branch -d`
+> **Quick tip**: Remove all stale branches with:
+>
+> ```bash
+> git branch --merged main | grep -v '^[ *]*main$' | xargs git branch -d
+> ```
 
 > <img src="https://github.com/react18-tools/turborepo-template/blob/main/popper.png?raw=true" style="height: 20px"/> Consider enrolling in [our courses](https://mayank-chaudhari.vercel.app/courses) or [sponsoring](https://github.com/sponsors/mayank1513) our work.
 

From 43067a6636f8962800d7f0b258b5291e28bd7708 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 21:27:14 +0530
Subject: [PATCH 44/60] Clean up

---
 examples/app-router/src/app/button.module.css | 15 -------------
 examples/app-router/src/app/button.tsx        | 21 -------------------
 2 files changed, 36 deletions(-)
 delete mode 100644 examples/app-router/src/app/button.module.css
 delete mode 100644 examples/app-router/src/app/button.tsx

diff --git a/examples/app-router/src/app/button.module.css b/examples/app-router/src/app/button.module.css
deleted file mode 100644
index 54c39828..00000000
--- a/examples/app-router/src/app/button.module.css
+++ /dev/null
@@ -1,15 +0,0 @@
-.btn {
-  display: block;
-  margin: auto;
-  margin-bottom: 3rem;
-  cursor: pointer;
-  padding: 15px 20px;
-  background: transparent;
-  border-radius: 10px;
-  color: var(--text-color);
-  box-shadow: -2px 2px 8px var(--text-color);
-}
-
-.btn:hover {
-  box-shadow: none;
-}
diff --git a/examples/app-router/src/app/button.tsx b/examples/app-router/src/app/button.tsx
deleted file mode 100644
index 8ea89880..00000000
--- a/examples/app-router/src/app/button.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-"use client";
-
-import { useCallback } from "react";
-import { useLoader } from "react18-loaders";
-import styles from "./button.module.css";
-
-/** Button to show global loader for 3 sec. */
-export default function MyButton() {
-  const { setLoading } = useLoader();
-  const handleClick = useCallback(() => {
-    setLoading(true);
-    setTimeout(() => {
-      setLoading(false);
-    }, 3000);
-  }, []);
-  return (
-    <button onClick={handleClick} className={styles.btn}>
-      Show Global Loader for 3 sec
-    </button>
-  );
-}

From 3249dbe900d5b7d1aa344aa1881d86063a6213c2 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 21:29:23 +0530
Subject: [PATCH 45/60] Clean up

---
 examples/app-router/src/app/layout.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/examples/app-router/src/app/layout.tsx b/examples/app-router/src/app/layout.tsx
index bf1a6731..a4258407 100644
--- a/examples/app-router/src/app/layout.tsx
+++ b/examples/app-router/src/app/layout.tsx
@@ -1,5 +1,4 @@
 import "./styles.css";
-import "react18-loaders/dist/index.css";
 import { ThemeSwitcher } from "nextjs-themes";
 import { Layout } from "@repo/shared/dist/server";
 import { GlobalLoader, Header } from "@repo/shared";

From bc3f9829efb5df472e47ad55f821c481ce07ca5e Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 22:21:14 +0530
Subject: [PATCH 46/60] Update doc comments for the theme-switcher

---
 .tkb                                          | 12 +++++--
 .../client/theme-switcher/theme-switcher.tsx  | 31 ++++++++++++++++---
 typedoc.config.js                             |  4 +++
 3 files changed, 41 insertions(+), 6 deletions(-)

diff --git a/.tkb b/.tkb
index 4d993d25..a56449c3 100644
--- a/.tkb
+++ b/.tkb
@@ -1,11 +1,19 @@
 {
   "scope": "Workspace",
-  "tasks": {},
+  "tasks": {
+    "0o1UME_ZgqZdcbYksPgDI": {
+      "id": "0o1UME_ZgqZdcbYksPgDI",
+      "description": "Update Docs\n- Use wiki - Export typedoc as md and then publish to wiki",
+      "columnId": "column-todo"
+    }
+  },
   "columns": [
     {
       "id": "column-todo",
       "title": "To do",
-      "tasksIds": []
+      "tasksIds": [
+        "0o1UME_ZgqZdcbYksPgDI"
+      ]
     },
     {
       "id": "column-doing",
diff --git a/lib/src/client/theme-switcher/theme-switcher.tsx b/lib/src/client/theme-switcher/theme-switcher.tsx
index 973afb3f..c233e0b1 100644
--- a/lib/src/client/theme-switcher/theme-switcher.tsx
+++ b/lib/src/client/theme-switcher/theme-switcher.tsx
@@ -5,13 +5,35 @@ import { initialState, useForcedStore, useThemeStore } from "../../store";
 import { DARK, DEFAULT_ID, LIGHT } from "../../constants";
 
 export interface ThemeSwitcherProps {
+  /**
+   * Forced theme name for the current page
+   * @see [Force per page theme and color-scheme](https://github.com/react18-tools/nextjs-themes?tab=readme-ov-file#force-per-page-theme-and-color-scheme)
+   */
   forcedTheme?: string;
+  /**
+   * Forced color scheme for the current page
+   * @see [Force per page theme and color-scheme](https://github.com/react18-tools/nextjs-themes?tab=readme-ov-file#force-per-page-theme-and-color-scheme)
+   */
   forcedColorScheme?: ColorSchemeType;
+  /**
+   * CSS selector for the target element to apply the theme.
+   * Use this to specify a different target element than the default (html or documentElement).
+   * This is particularly useful for controlling the theme of different parts of the page independently.
+   */
   targetSelector?: string;
+  /**
+   * @defaultValue 'none'
+   * the transition property to enforce on all elements, preventing unwanted transitions during theme changes.
+   * @example 'background .3s'
+   */
   themeTransition?: string;
-  /** provide styles object imported from CSS/SCSS modules, if you are using CSS/SCSS modules. */
+  /**
+   * Provide a styles object imported from CSS/SCSS modules if you are using these modules to define theme and color-scheme classes.
+   * All classes applied to the target are modified using the styles object as follows:
+   * `if (styles) classes = classes.map(cls => styles[cls] ?? cls);`
+   */
   styles?: Record<string, string>;
-  /** The nonce value for your Content Security Policy. @defaultValue '' */
+  /** The nonce value for your Content Security Policy. */
   nonce?: string;
 }
 
@@ -21,6 +43,7 @@ let resolveTheme: ResolveFunc;
 let updateForcedProps: UpdateForcedPropsFunc;
 let updateForcedState: UpdateForcedPropsFunc;
 
+/** Script component to inject script before hydration */
 const Script = ({
   targetSelector,
   nonce,
@@ -101,11 +124,11 @@ const Switcher = ({
 };
 
 /**
- *
+ * The Core component wich applies classes and transitions.
  *
  * @example
  * ```tsx
- * <ThemeSwitcher />
+ * <ThemeSwitcher [...props] />
  * ```
  */
 export const ThemeSwitcher = (props: ThemeSwitcherProps) => {
diff --git a/typedoc.config.js b/typedoc.config.js
index bf30931c..62f4ee48 100644
--- a/typedoc.config.js
+++ b/typedoc.config.js
@@ -8,7 +8,11 @@ module.exports = {
   out: "./docs",
   commentStyle: "all",
   searchInComments: true,
+  searchInDocuments: true,
+  cleanOutputDir: true,
+  excludePrivate: true,
   excludeExternals: true,
+  projectDocuments: ["guides/*.md"],
   plugin: [
     "typedoc-plugin-mdn-links",
     "typedoc-plugin-rename-defaults",

From 0968e3d804d1448042c794b4c706ff332ecadb27 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 23:09:57 +0530
Subject: [PATCH 47/60] ignore noFOUCScript from docs

---
 lib/src/client/theme-switcher/no-fouc.ts | 2 +-
 typedoc.config.js                        | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/lib/src/client/theme-switcher/no-fouc.ts b/lib/src/client/theme-switcher/no-fouc.ts
index 56f98585..9c51423f 100644
--- a/lib/src/client/theme-switcher/no-fouc.ts
+++ b/lib/src/client/theme-switcher/no-fouc.ts
@@ -24,7 +24,7 @@ declare global {
   var g: UpdateForcedPropsFunc;
 }
 
-/** Script to be injected for avoiding FOUC */
+/** @internal Script to be injected for avoiding FOUC */
 export const noFOUCScript = (
   key: string,
   initialState: ThemeStoreType,
diff --git a/typedoc.config.js b/typedoc.config.js
index 62f4ee48..22e7dfe3 100644
--- a/typedoc.config.js
+++ b/typedoc.config.js
@@ -12,6 +12,7 @@ module.exports = {
   cleanOutputDir: true,
   excludePrivate: true,
   excludeExternals: true,
+  excludeInternal: true,
   projectDocuments: ["guides/*.md"],
   plugin: [
     "typedoc-plugin-mdn-links",

From 199f9c66e809f870598120a73dac6614991b7cbf Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 23:10:29 +0530
Subject: [PATCH 48/60] Remove @source

---
 lib/src/hooks/use-theme.ts      | 2 --
 scripts/templates/component.hbs | 2 --
 scripts/templates/hook.hbs      | 2 --
 3 files changed, 6 deletions(-)

diff --git a/lib/src/hooks/use-theme.ts b/lib/src/hooks/use-theme.ts
index e8c71414..a6136151 100644
--- a/lib/src/hooks/use-theme.ts
+++ b/lib/src/hooks/use-theme.ts
@@ -33,8 +33,6 @@ interface UseThemeYield {
  * ```tsx
  * const [] = useTheme(options);
  * ```
- *
- * @source - Source code
  */
 
 export const useTheme = (targetSelector?: string): UseThemeYield => {
diff --git a/scripts/templates/component.hbs b/scripts/templates/component.hbs
index d5acbe28..65386918 100644
--- a/scripts/templates/component.hbs
+++ b/scripts/templates/component.hbs
@@ -12,8 +12,6 @@ export interface {{ pascalCase name }}Props extends HTMLProps<HTMLDivElement> {
  * ```tsx
  * <{{ pascalCase name }} />
  * ```
- * 
- * @source - Source code
  */
 export const {{ pascalCase name }} = ({ children, ...props }: {{ pascalCase name }}Props) => {
   const className = [props.className, styles["{{ kebabCase name }}"]].filter(Boolean).join(" ");
diff --git a/scripts/templates/hook.hbs b/scripts/templates/hook.hbs
index c7b3b954..5c354a0f 100644
--- a/scripts/templates/hook.hbs
+++ b/scripts/templates/hook.hbs
@@ -12,8 +12,6 @@ export interface {{ pascalCase name }}Options {
  * ```tsx
  * const [] = {{ camelCase name }}(options);
  * ```
- * 
- * @source - Source code
  */
 
 export const {{ camelCase name }} = (options?: {{ pascalCase name }}Options) => {

From 0e5732367658ec3c9eb71092634cf3c6ee6da22f Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 23:11:11 +0530
Subject: [PATCH 49/60] remove inline sources

---
 package.json      | 3 +--
 typedoc.config.js | 1 -
 2 files changed, 1 insertion(+), 3 deletions(-)

diff --git a/package.json b/package.json
index 76022164..62b416e3 100644
--- a/package.json
+++ b/package.json
@@ -19,7 +19,6 @@
     "turbo": "^2.0.4",
     "typedoc": "^0.26.2",
     "typedoc-plugin-extras": "^3.0.0",
-    "typedoc-plugin-inline-sources": "^1.0.2",
     "typedoc-plugin-mdn-links": "^3.2.1",
     "typedoc-plugin-missing-exports": "^3.0.0",
     "typedoc-plugin-rename-defaults": "^0.7.1",
@@ -34,4 +33,4 @@
     "enquirer": "^2.4.1"
   },
   "name": "turborepo-template"
-}
\ No newline at end of file
+}
diff --git a/typedoc.config.js b/typedoc.config.js
index 22e7dfe3..b53d9e64 100644
--- a/typedoc.config.js
+++ b/typedoc.config.js
@@ -19,7 +19,6 @@ module.exports = {
     "typedoc-plugin-rename-defaults",
     "typedoc-plugin-missing-exports",
     "typedoc-plugin-zod",
-    "typedoc-plugin-inline-sources",
     // "typedoc-plugin-extras",
   ],
 };

From f6684eea1472c3b9b79f9cfa15a83c0240bac9a5 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 23:16:21 +0530
Subject: [PATCH 50/60] Fix docs

---
 lib/src/constants.ts                                        | 4 ++++
 .../nextjs/server-side-wrapper/server-side-wrapper.tsx      | 2 ++
 lib/src/store.ts                                            | 6 +++++-
 3 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/lib/src/constants.ts b/lib/src/constants.ts
index b1e4a322..5717a7c1 100644
--- a/lib/src/constants.ts
+++ b/lib/src/constants.ts
@@ -1,5 +1,9 @@
 /** shared constants -- keep in separate files for better tree-shaking and dependency injection */
+/** @internal */
 export const DEFAULT_ID = "nth";
+/** @internal */
 export const LIGHT = "light";
+/** @internal */
 export const DARK = "dark";
+/** @internal */
 export const SYSTEM = "system";
diff --git a/lib/src/server/nextjs/server-side-wrapper/server-side-wrapper.tsx b/lib/src/server/nextjs/server-side-wrapper/server-side-wrapper.tsx
index fee38156..0d6d8670 100644
--- a/lib/src/server/nextjs/server-side-wrapper/server-side-wrapper.tsx
+++ b/lib/src/server/nextjs/server-side-wrapper/server-side-wrapper.tsx
@@ -9,6 +9,7 @@ export type ForcedPage =
     }
   | [pathMatcher: RegExp | string, themes: { theme?: string; colorScheme?: ColorSchemeType }];
 
+/** @deprecated */
 export interface NextJsSSRThemeSwitcherProps extends HTMLProps<HTMLElement> {
   children?: ReactNode;
   /** @defaultValue 'div' */
@@ -52,6 +53,7 @@ export const NextJsSSGThemeSwitcher = (props: NextJsSSRThemeSwitcherProps) => {
  */
 export { NextJsSSGThemeSwitcher as NextJsServerTarget };
 
+/** @deprecated */
 export interface ServerSideWrapperProps extends NextJsSSRThemeSwitcherProps {
   /** @defaultValue 'html' */
   tag?: keyof JSX.IntrinsicElements;
diff --git a/lib/src/store.ts b/lib/src/store.ts
index cc28df3f..66405666 100644
--- a/lib/src/store.ts
+++ b/lib/src/store.ts
@@ -2,6 +2,7 @@ import { useRGS } from "r18gs";
 import { DARK, DEFAULT_ID, LIGHT, SYSTEM } from "./constants";
 import { ColorSchemeType, ResolvedColorSchemeType } from "./types";
 
+/** @internal */
 export interface ThemeStoreType {
   /** theme */
   t: string;
@@ -15,6 +16,7 @@ export interface ThemeStoreType {
   s: ResolvedColorSchemeType;
 }
 
+/** @internal */
 export const initialState: ThemeStoreType = {
   t: "",
   d: DARK,
@@ -23,7 +25,7 @@ export const initialState: ThemeStoreType = {
   s: LIGHT,
 };
 
-/** internal store */
+/** @internal store */
 export const useThemeStore = (targetSelector?: string) => {
   const key = targetSelector ?? `#${DEFAULT_ID}`;
   return useRGS<ThemeStoreType>(key, () => {
@@ -32,11 +34,13 @@ export const useThemeStore = (targetSelector?: string) => {
   });
 };
 
+/** @internal */
 export interface ForcedStoreType {
   /** forced theme */ f?: string;
   /** forced colorScheme */ fc?: ColorSchemeType;
 }
 
+/** @internal */
 export const useForcedStore = (targetSelector?: string) => {
   const key = `${targetSelector ?? `#${DEFAULT_ID}`}-`;
   return useRGS<ForcedStoreType>(key, {});

From 01dbbd8716a4e89b5bf826184730f4b80e7a7585 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Mon, 24 Jun 2024 23:37:27 +0530
Subject: [PATCH 51/60] Clean up docs

---
 lib/src/constants.ts       |  4 ----
 lib/src/hooks/use-theme.ts |  2 +-
 typedoc.config.js          | 10 +++++++++-
 3 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/lib/src/constants.ts b/lib/src/constants.ts
index 5717a7c1..b1e4a322 100644
--- a/lib/src/constants.ts
+++ b/lib/src/constants.ts
@@ -1,9 +1,5 @@
 /** shared constants -- keep in separate files for better tree-shaking and dependency injection */
-/** @internal */
 export const DEFAULT_ID = "nth";
-/** @internal */
 export const LIGHT = "light";
-/** @internal */
 export const DARK = "dark";
-/** @internal */
 export const SYSTEM = "system";
diff --git a/lib/src/hooks/use-theme.ts b/lib/src/hooks/use-theme.ts
index a6136151..dae9d77c 100644
--- a/lib/src/hooks/use-theme.ts
+++ b/lib/src/hooks/use-theme.ts
@@ -7,7 +7,7 @@ import { DARK, LIGHT, SYSTEM } from "../constants";
 const colorSchemes = [SYSTEM, DARK, LIGHT] as ColorSchemeType[];
 let resolveTheme: ResolveFunc;
 
-interface UseThemeYield {
+export interface UseThemeYield {
   theme: string;
   darkTheme: string;
   lightTheme: string;
diff --git a/typedoc.config.js b/typedoc.config.js
index b53d9e64..202cc751 100644
--- a/typedoc.config.js
+++ b/typedoc.config.js
@@ -3,7 +3,15 @@ module.exports = {
   tsconfig: "tsconfig.docs.json",
   name: "Nextjs Themes",
   entryPoints: ["./lib/src"],
-  exclude: ["**/*.test.tsx", "**/index.ts", "**/declaration.d.ts"],
+  exclude: [
+    "**/*.test.tsx",
+    "**/index.ts",
+    "**/server/**",
+    "**/constants.ts",
+    "**/store.ts",
+    "**/no-fouc.ts",
+    "**/declaration.d.ts",
+  ],
   entryPointStrategy: "Expand",
   out: "./docs",
   commentStyle: "all",

From a48240274de9e8d34f33b8ef7317f96b66ce66f5 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Tue, 25 Jun 2024 00:10:47 +0530
Subject: [PATCH 52/60] Clean up docs

---
 guides/migration.md                              | 4 ++++
 lib/src/client/theme-switcher/theme-switcher.tsx | 4 ++--
 typedoc.config.js                                | 8 ++++++++
 3 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/guides/migration.md b/guides/migration.md
index b982dc55..862d7e5b 100644
--- a/guides/migration.md
+++ b/guides/migration.md
@@ -1,3 +1,7 @@
+---
+title: Migration Guide
+---
+
 # Migration Guide
 
 ## Migrating from v1 to v2
diff --git a/lib/src/client/theme-switcher/theme-switcher.tsx b/lib/src/client/theme-switcher/theme-switcher.tsx
index c233e0b1..70444086 100644
--- a/lib/src/client/theme-switcher/theme-switcher.tsx
+++ b/lib/src/client/theme-switcher/theme-switcher.tsx
@@ -22,9 +22,9 @@ export interface ThemeSwitcherProps {
    */
   targetSelector?: string;
   /**
-   * @defaultValue 'none'
-   * the transition property to enforce on all elements, preventing unwanted transitions during theme changes.
+   * The transition property to enforce on all elements, preventing unwanted transitions during theme changes.
    * @example 'background .3s'
+   * @defaultValue 'none'
    */
   themeTransition?: string;
   /**
diff --git a/typedoc.config.js b/typedoc.config.js
index 202cc751..c65db0e2 100644
--- a/typedoc.config.js
+++ b/typedoc.config.js
@@ -22,6 +22,14 @@ module.exports = {
   excludeExternals: true,
   excludeInternal: true,
   projectDocuments: ["guides/*.md"],
+  hideGenerator: true,
+  cleanOutputDir: true,
+  navigationLinks: {
+    GitHub: "https://github.com/react18-tools/nextjs-themes",
+  },
+  navigation: {
+    includeFolders: false,
+  },
   plugin: [
     "typedoc-plugin-mdn-links",
     "typedoc-plugin-rename-defaults",

From b3fc69e4b92307570b80c3b618c621e29c75464b Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Tue, 25 Jun 2024 00:24:52 +0530
Subject: [PATCH 53/60] Update migration guide

---
 guides/migration.md | 55 ++++++++++++++++++++++++++++-----------------
 1 file changed, 34 insertions(+), 21 deletions(-)

diff --git a/guides/migration.md b/guides/migration.md
index 862d7e5b..b03b3943 100644
--- a/guides/migration.md
+++ b/guides/migration.md
@@ -4,42 +4,55 @@ title: Migration Guide
 
 # Migration Guide
 
-## Migrating from v1 to v2
+## Migrating to V4
+
+- No more cookies.
+- You no longer need to use `NextJsSSGThemeSwitcher`, `NextJsServerTarget`, or `ServerSideWrapper`.
+- Flash of Unstyled Content (FOUC) is now handled by an injected script.
+- If you have been using these components, they will have no effect. We recommend removing them.
+- There is no need to use sibling selectors. Without `NextJsSSGThemeSwitcher` or `NextJsServerTarget`, you are free to use any target, whether as a wrapper or a sibling.
+
+### Breaking Changes
+
+- `ForceColorScheme` and `ForceTheme` are no longer exported from `nextjs-themes` or `nextjs-themes/client`. Use `nextjs-themes/force-color-scheme` or `nextjs-themes/force-theme` instead.
+- The class names for `ColorSwitch` have been shortened.
+
+## Migrating from V1 to V2
 
 ### Major Changes
 
-- 6f17cce: # Additonal CSS Combinations + Ensure seamless support for Tailwind
+- Commit `6f17cce`: Added additional CSS combinations to ensure seamless support for Tailwind.
 
-  - No changes required for client side code as `[data-theme=]` selectors work as before.
-  - If you are using `ServerSideWrapper` or `NextJsServerTarget` or `NextJsSSGThemeSwitcher`, you need to convert `forcedPages` elements to objects of the shape `{ pathMatcher: RegExp | string; props: ThemeSwitcherProps }`.
-  - Use `resolvedColorScheme` for more sturdy dark/light/system modes
-  - Use combinations of `[data-th=""]` and `[data-color-scheme=""]` for dark/light varients of themes
-  - Use `[data-csp=""]` to style based on colorSchemePreference.
+  - No changes are required for client-side code as `[data-theme=]` selectors function as before.
+  - If you are using `ServerSideWrapper`, `NextJsServerTarget`, or `NextJsSSGThemeSwitcher`, you need to convert `forcedPages` elements to objects shaped like `{ pathMatcher: RegExp | string; props: ThemeSwitcherProps }`.
+  - Use `resolvedColorScheme` for more robust dark/light/system modes.
+  - Use combinations of `[data-th=""]` and `[data-color-scheme=""]` for dark/light theme variants.
+  - Use `[data-csp=""]` to style based on color scheme preference.
 
 ### Minor Changes
 
-- # Support custom themeTransition
+- Support for custom `themeTransition`.
 
-  - Provide `themeTransition` prop to `ThemeSwitcher` component to apply smooth transition while changing theme.
+  - Provide the `themeTransition` prop to the `ThemeSwitcher` component to apply a smooth transition when changing the theme.
   - Use `setThemeSet` to set `lightTheme` and `darkTheme` together.
 
-#### Motivation:
+#### Motivation
 
-For server side syncing, we need to use cookies and headers. This means that this component and its children can not be static. They will be rendered server side for each request. Thus, we are avoiding the wrapper. Now, only the `NextJsSSGThemeSwitcher` will be rendered server side for each request and rest of your app can be server statically.
+For server-side syncing, cookies and headers are required. This means that this component and its children cannot be static and will be rendered server-side for each request. To avoid the wrapper, only the `NextJsSSGThemeSwitcher` will be rendered server-side for each request, while the rest of your app can be served statically.
 
-Take care of the following while migrating to `v2`.
+Consider the following when migrating to V2:
 
-- No changes required for projects not using `Next.js` app router or server components other than updating cookies policy if needed.
-- The persistent storage is realized with `cookies` in place of `localStorage`. (You might want to update cookies policy accordingly.)
-- We have provided `NextJsSSGThemeSwitcher` in addition to `ServerSideWrapper` for `Next.js`. You no longer need to use a wrapper component which broke static generation and forced SSR.
-- Visit [With Next.js `app` router (Server Components)](#with-nextjs-app-router-server-components)
+- No changes are required for projects not using the `Next.js` app router or server components, aside from updating the cookies policy if needed.
+- Persistent storage now uses cookies instead of `localStorage`. (You might need to update your cookies policy accordingly.)
+- We have introduced `NextJsSSGThemeSwitcher` in addition to `ServerSideWrapper` for `Next.js`. You no longer need to use a wrapper component that breaks static generation and forces SSR.
+- For more details, visit [With Next.js `app` router (Server Components)](#with-nextjs-app-router-server-components).
 
-## Migrating from v0 to v1
+## Migrating from V0 to V1
 
-- `defaultDarkTheme` is renamed to `darkTheme`
-- `setDefaultDarkTheme` is renamed to `setDarkTheme`
-- `defaultLightTheme` is renamed to `lightTheme`
-- `setDefaultLightTheme` is renamed to `setLightTheme`
+- `defaultDarkTheme` has been renamed to `darkTheme`.
+- `setDefaultDarkTheme` has been renamed to `setDarkTheme`.
+- `defaultLightTheme` has been renamed to `lightTheme`.
+- `setDefaultLightTheme` has been renamed to `setLightTheme`.
 
 <hr />
 

From 3018a179a9bde0c899228cf76bad67c579c73bbb Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Tue, 25 Jun 2024 00:26:25 +0530
Subject: [PATCH 54/60] clean up

---
 .../nextjs/server-side-wrapper/server-side-wrapper.test.tsx     | 1 -
 lib/vitest.setup.ts                                             | 2 --
 2 files changed, 3 deletions(-)

diff --git a/lib/src/server/nextjs/server-side-wrapper/server-side-wrapper.test.tsx b/lib/src/server/nextjs/server-side-wrapper/server-side-wrapper.test.tsx
index 9620d56d..b1706143 100644
--- a/lib/src/server/nextjs/server-side-wrapper/server-side-wrapper.test.tsx
+++ b/lib/src/server/nextjs/server-side-wrapper/server-side-wrapper.test.tsx
@@ -6,7 +6,6 @@ describe("server-side-target", () => {
   afterEach(cleanup);
 
   test("test default tag", ({ expect }) => {
-    globalThis.cookies = {};
     render(<NextJsSSGThemeSwitcher />);
     expect(screen.getByTestId("server-side-target").tagName).toBe("DIV");
   });
diff --git a/lib/vitest.setup.ts b/lib/vitest.setup.ts
index 957b61b2..de1b9739 100644
--- a/lib/vitest.setup.ts
+++ b/lib/vitest.setup.ts
@@ -5,8 +5,6 @@ declare global {
     media: "dark" | "light";
     matchMedia: (query: string) => MediaQueryList;
   }
-  var cookies: Record<string, { value: string }>; // eslint-disable-line no-var -- let is not supported in defining global due to block scope
-  var path: string; // eslint-disable-line no-var -- let is not supported in defining global due to block scope
 }
 
 const mediaListeners: (() => void)[] = [];

From d3107fe57b2863fe498f6299d7a03052fda782e9 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Tue, 25 Jun 2024 00:26:48 +0530
Subject: [PATCH 55/60] clean up

---
 .../nextjs/server-side-wrapper/server-side-wrapper.test.tsx     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/src/server/nextjs/server-side-wrapper/server-side-wrapper.test.tsx b/lib/src/server/nextjs/server-side-wrapper/server-side-wrapper.test.tsx
index b1706143..badc3af0 100644
--- a/lib/src/server/nextjs/server-side-wrapper/server-side-wrapper.test.tsx
+++ b/lib/src/server/nextjs/server-side-wrapper/server-side-wrapper.test.tsx
@@ -1,5 +1,5 @@
 import { cleanup, render, screen } from "@testing-library/react";
-import { afterEach, describe, test, beforeEach } from "vitest";
+import { afterEach, describe, test } from "vitest";
 import { NextJsSSGThemeSwitcher, ServerSideWrapper } from ".";
 
 describe("server-side-target", () => {

From e5b174c4a2d273d8321eeb551d9dbce641a70c0e Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Tue, 25 Jun 2024 00:29:12 +0530
Subject: [PATCH 56/60] Update lock file

---
 pnpm-lock.yaml | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 08d08a32..509fb7a5 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -35,10 +35,14 @@ importers:
         version: 0.26.2(typescript@5.5.2)
       typedoc-plugin-extras:
         specifier: ^3.0.0
+<<<<<<< HEAD
         version: 3.0.0(typedoc@0.26.2(typescript@5.5.2))
       typedoc-plugin-inline-sources:
         specifier: ^1.0.2
         version: 1.0.2(typedoc@0.26.2(typescript@5.5.2))
+=======
+        version: 3.0.0(typedoc@0.26.1(typescript@5.5.2))
+>>>>>>> 6c4d75c (Update lock file)
       typedoc-plugin-mdn-links:
         specifier: ^3.2.1
         version: 3.2.1(typedoc@0.26.2(typescript@5.5.2))
@@ -4663,12 +4667,6 @@ packages:
     peerDependencies:
       typedoc: 0.25.x
 
-  typedoc-plugin-inline-sources@1.0.2:
-    resolution: {integrity: sha512-J1L2Ky6t5EeAI2fTqhcRii/ntxYN6lSPyKiaTKc/MIHgMTDh81elRvXPZFmvy+xMY9EEE9nlkUujfLGNo5c5Tw==}
-    engines: {node: '>= 10.8.0'}
-    peerDependencies:
-      typedoc: ^0.25.7
-
   typedoc-plugin-mdn-links@3.2.1:
     resolution: {integrity: sha512-l76VJKKhOxCYXnb16aV6nAQG5JCsuStqviNFmgzhS9dW73nqm3/1MO9497+0KlDTOPO3o+R2uVXq87d2cDy/hg==}
     peerDependencies:
@@ -10411,11 +10409,15 @@ snapshots:
     dependencies:
       typedoc: 0.26.2(typescript@5.5.2)
 
+<<<<<<< HEAD
   typedoc-plugin-inline-sources@1.0.2(typedoc@0.26.2(typescript@5.5.2)):
     dependencies:
       typedoc: 0.26.2(typescript@5.5.2)
 
   typedoc-plugin-mdn-links@3.2.1(typedoc@0.26.2(typescript@5.5.2)):
+=======
+  typedoc-plugin-mdn-links@3.2.1(typedoc@0.26.1(typescript@5.5.2)):
+>>>>>>> 6c4d75c (Update lock file)
     dependencies:
       typedoc: 0.26.2(typescript@5.5.2)
 

From d4962ab11dda16dbbbdf15ddf8c599802af09ba9 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Tue, 25 Jun 2024 00:48:04 +0530
Subject: [PATCH 57/60] update Readme.

---
 README.md                 | 262 +-------------------------------
 guides/getting-started.md | 308 ++++++++++++++++++++++++++++++++++++++
 2 files changed, 310 insertions(+), 260 deletions(-)
 create mode 100644 guides/getting-started.md

diff --git a/README.md b/README.md
index cccff724..ba81e340 100644
--- a/README.md
+++ b/README.md
@@ -45,267 +45,9 @@ This project was inspired by next-themes. Unlike next-themes, `nextjs-themes` do
 
 > Check out the [live example](https://nextjs-themes.vercel.app/).
 
-<details>
-<summary><h2 style="display:inline">Installation</h2></summary>
-
-```bash
-$ pnpm add nextjs-themes
-```
-
-**_or_**
-
-```bash
-$ npm install nextjs-themes
-```
-
-**_or_**
-
-```bash
-$ yarn add nextjs-themes
-```
-
-</details>
-
-<details>
-<summary><h2 style="display:inline">Want Lite Version?</h2>
-
-[![npm bundle size](https://img.shields.io/bundlephobia/minzip/nextjs-themes-lite)](https://www.npmjs.com/package/nextjs-themes-lite) [![Version](https://img.shields.io/npm/v/nextjs-themes-lite.svg?colorB=green)](https://www.npmjs.com/package/nextjs-themes-lite) [![Downloads](https://img.jsdelivr.com/img.shields.io/npm/d18m/nextjs-themes-lite.svg)](https://www.npmjs.com/package/nextjs-themes-lite)
-
-</summary>
-
-```bash
-$ pnpm add nextjs-themes-lite
-```
-
-**or**
-
-```bash
-$ npm install nextjs-themes-lite
-```
-
-**or**
-
-```bash
-$ yarn add nextjs-themes-lite
-```
-
-> Note: `r18gs` is a peer dependency
-
-</details>
-
-## Usage
-
-### SPA (e.g., Vite, CRA) and Next.js pages directory (No server components)
-
-To add dark mode support, modify `_app.js` as follows:
-
-```js
-import { ThemeSwitcher } from "nextjs-themes";
-
-function MyApp({ Component, pageProps }) {
-  return (
-    <>
-      <ThemeSwitcher forcedTheme={Component.theme} />
-      <Component {...pageProps} />
-    </>
-  );
-}
-
-export default MyApp;
-```
-
-⚡🎉Boom! Dark mode is ready in just a couple of lines!
-
-### With Next.js `app` router (Server Components)
-
-Update `app/layout.jsx` to add `ThemeSwitcher` from `nextjs-themes`:
-
-```tsx
-// app/layout.jsx
-import { ThemeSwitcher } from "nextjs-themes";
-
-export default function Layout({ children }) {
-  return (
-    <html lang="en">
-      <head />
-      <body>
-        <ThemeSwitcher />
-        {children}
-      </body>
-    </html>
-  );
-}
-```
-
-Woohoo! Multiple theme modes with Server Components support!
-
-### HTML & CSS
-
-Next.js app supports dark mode, including System preference with `prefers-color-scheme`. The theme is synced between tabs, modifying the `data-theme` attribute on the `html` element:
-
-```css
-:root {
-  --background: white;
-  --foreground: black;
-}
-
-[data-theme="dark"] {
-  --background: black;
-  --foreground: white;
-}
-```
+## Getting Started
 
-## Images
-
-Show different images based on the current theme:
-
-```ts
-import Image from "next/image";
-import { useTheme } from "nextjs-themes/hooks";
-
-function ThemedImage() {
-  const { resolvedTheme } = useTheme();
-  const src = resolvedTheme === "light" ? "/light.png" : "/dark.png";
-  return <Image src={src} width={400} height={400} />;
-}
-
-export default ThemedImage;
-```
-
-### useTheme
-
-The `useTheme` hook provides theme information and allows changing the theme:
-
-```js
-import { useTheme } from "nextjs-themes/hooks";
-
-const ThemeChanger = () => {
-  const { theme, setTheme } = useTheme();
-
-  return (
-    <div>
-      The current theme is: {theme}
-      <button onClick={() => setTheme("light")}>Light Mode</button>
-      <button onClick={() => setTheme("dark")}>Dark Mode</button>
-    </div>
-  );
-};
-```
-
-The `useTheme` hook returns the following object:
-
-```tsx
-interface UseThemeYield {
-  theme: string;
-  darkTheme: string;
-  lightTheme: string;
-  colorSchemePref: ColorSchemeType;
-  systemColorScheme: ResolvedColorSchemeType;
-  resolvedColorScheme: ResolvedColorSchemeType;
-  resolvedTheme: string;
-  setTheme: (theme: string) => void;
-  setDarkTheme: (darkTheme: string) => void;
-  setLightTheme: (lightTheme: string) => void;
-  setThemeSet: (themeSet: { darkTheme: string; lightTheme: string }) => void;
-  setColorSchemePref: (colorSchemePref: ColorSchemeType) => void;
-  toggleColorScheme: (skipSystem?: boolean) => void;
-  setForcedTheme: (forcedTheme: string) => void;
-  setForcedColorScheme: (forcedColorScheme: ColorSchemeType) => void;
-}
-```
-
-<details>
-<summary><h2 style="display:inline">Force per page theme and color-scheme</h2></summary>
-
-### Next.js App Router
-
-```tsx
-import { ForceTheme } from "nextjs-themes/force-theme";
-
-function MyPage() {
-  return (
-    <>
-      <ForceTheme theme="my-theme" />
-      ...
-    </>
-  );
-}
-
-export default MyPage;
-```
-
-> If you are using TypeScript and have not set nodeResolution to `Bundler` or `Node16` or `NodeNext`, you need to import from `nextjs-themes/client/force-theme`
-
-### Next.js Pages Router
-
-For the pages router, you have two options. The first option is the same as the app router, and the second option, which is compatible with `next-themes`, involves adding the `theme` property to your page component like this:
-
-```javascript
-function MyPage() {
-  return <>...</>;
-}
-
-MyPage.theme = "my-theme";
-
-export default MyPage;
-```
-
-Similarly, you can force a color scheme. This will apply your `defaultDark` or `defaultLight` theme, which can be configured via hooks.
-
-</details>
-
-### With Styled Components and any CSS-in-JS
-
-Next Themes works with any library. For Styled Components, `createGlobalStyle` in your custom App:
-
-```js
-// pages/_app.js
-import { createGlobalStyle } from "styled-components";
-import { ThemeSwitcher } from "nextjs-themes";
-
-const GlobalStyle = createGlobalStyle`
-  :root {
-    --fg: #000;
-    --bg: #fff;
-  }
-
-  [data-theme="dark"] {
-    --fg: #fff;
-    --bg: #000;
-  }
-`;
-
-function MyApp({ Component, pageProps }) {
-  return (
-    <>
-      <GlobalStyle />
-      <ThemeSwitcher forcedTheme={Component.theme} />
-      <Component {...pageProps} />
-    </>
-  );
-}
-```
-
-### With Tailwind
-
-In `tailwind.config.js`, set the dark mode property to class:
-
-```js
-// tailwind.config.js
-module.exports = {
-  darkMode: "class",
-};
-```
-
-⚡🎉Ready to use dark mode in Tailwind!
-
-> Caution: Your class must be `"dark"`, which is the default value used in this library. Tailwind requires the class name `"dark"` for dark-theme.
-
-Use dark-mode specific classes:
-
-```tsx
-<h1 className="text-black dark:text-white">
-```
+> See [Getting Started](./guides/getting-started.md)
 
 ## Migration
 
diff --git a/guides/getting-started.md b/guides/getting-started.md
new file mode 100644
index 00000000..2511b131
--- /dev/null
+++ b/guides/getting-started.md
@@ -0,0 +1,308 @@
+---
+title: Getting Started
+---
+
+# Getting Started
+
+## Installation
+
+```bash
+$ pnpm add nextjs-themes
+```
+
+**_or_**
+
+```bash
+$ npm install nextjs-themes
+```
+
+**_or_**
+
+```bash
+$ yarn add nextjs-themes
+```
+
+### Want Lite Version?
+
+[![npm bundle size](https://img.shields.io/bundlephobia/minzip/nextjs-themes-lite)](https://www.npmjs.com/package/nextjs-themes-lite) [![Version](https://img.shields.io/npm/v/nextjs-themes-lite.svg?colorB=green)](https://www.npmjs.com/package/nextjs-themes-lite) [![Downloads](https://img.jsdelivr.com/img.shields.io/npm/d18m/nextjs-themes-lite.svg)](https://www.npmjs.com/package/nextjs-themes-lite)
+
+```bash
+$ pnpm add nextjs-themes-lite
+```
+
+**or**
+
+```bash
+$ npm install nextjs-themes-lite
+```
+
+**or**
+
+```bash
+$ yarn add nextjs-themes-lite
+```
+
+> Note: `r18gs` is a peer dependency
+
+## Simple Usage
+
+### SPA (e.g., Vite, CRA) and Next.js pages directory (No server components)
+
+To add dark mode support, modify `_app.js` as follows:
+
+```js
+import { ThemeSwitcher } from "nextjs-themes";
+
+function MyApp({ Component, pageProps }) {
+  return (
+    <>
+      <ThemeSwitcher forcedTheme={Component.theme} />
+      <Component {...pageProps} />
+    </>
+  );
+}
+
+export default MyApp;
+```
+
+⚡🎉Boom! Dark mode is ready in just a couple of lines!
+
+### With Next.js `app` router (Server Components)
+
+Update `app/layout.jsx` to add `ThemeSwitcher` from `nextjs-themes`:
+
+```tsx
+// app/layout.jsx
+import { ThemeSwitcher } from "nextjs-themes";
+
+export default function Layout({ children }) {
+  return (
+    <html lang="en">
+      <head />
+      <body>
+        <ThemeSwitcher />
+        {children}
+      </body>
+    </html>
+  );
+}
+```
+
+Woohoo! Multiple theme modes with Server Components support!
+
+### HTML & CSS
+
+Next.js app supports dark mode, including System preference with `prefers-color-scheme`. The theme is synced between tabs, modifying the `data-theme` attribute on the `html` element:
+
+```css
+:root {
+  --background: white;
+  --foreground: black;
+}
+
+[data-theme="dark"] {
+  --background: black;
+  --foreground: white;
+}
+```
+
+## Configuration
+
+Configuring nextjs-themes is super simple. You can use following props to configure the main `ThemeSwitcher` component.
+
+```ts
+export interface ThemeSwitcherProps {
+  /**
+   * Forced theme name for the current page
+   * @see [Force per page theme and color-scheme](https://github.com/react18-tools/nextjs-themes?tab=readme-ov-file#force-per-page-theme-and-color-scheme)
+   */
+  forcedTheme?: string;
+  /**
+   * Forced color scheme for the current page
+   * @see [Force per page theme and color-scheme](https://github.com/react18-tools/nextjs-themes?tab=readme-ov-file#force-per-page-theme-and-color-scheme)
+   */
+  forcedColorScheme?: ColorSchemeType;
+  /**
+   * CSS selector for the target element to apply the theme.
+   * Use this to specify a different target element than the default (html or documentElement).
+   * This is particularly useful for controlling the theme of different parts of the page independently.
+   */
+  targetSelector?: string;
+  /**
+   * The transition property to enforce on all elements, preventing unwanted transitions during theme changes.
+   * @example 'background .3s'
+   * @defaultValue 'none'
+   */
+  themeTransition?: string;
+  /**
+   * Provide a styles object imported from CSS/SCSS modules if you are using these modules to define theme and color-scheme classes.
+   * All classes applied to the target are modified using the styles object as follows:
+   * `if (styles) classes = classes.map(cls => styles[cls] ?? cls);`
+   */
+  styles?: Record<string, string>;
+  /** The nonce value for your Content Security Policy. */
+  nonce?: string;
+}
+```
+
+To augment the functionality, we also provide `ForceTheme` and `ForceColorScheme` components that effectively apply the `forcedTheme` and `forcedColorScheme` props via internal state variable. Please note that the props passed to the `ThemeSwitcher` has the highest priority.
+
+## Handling different scenarios
+
+### Images
+
+Show different images based on the current theme:
+
+```ts
+import Image from "next/image";
+import { useTheme } from "nextjs-themes/hooks";
+
+function ThemedImage() {
+  const { resolvedTheme } = useTheme();
+  const src = resolvedTheme === "light" ? "/light.png" : "/dark.png";
+  return <Image src={src} width={400} height={400} />;
+}
+
+export default ThemedImage;
+```
+
+### useTheme
+
+The `useTheme` hook provides theme information and allows changing the theme:
+
+```js
+import { useTheme } from "nextjs-themes/hooks";
+
+const ThemeChanger = () => {
+  const { theme, setTheme } = useTheme();
+
+  return (
+    <div>
+      The current theme is: {theme}
+      <button onClick={() => setTheme("light")}>Light Mode</button>
+      <button onClick={() => setTheme("dark")}>Dark Mode</button>
+    </div>
+  );
+};
+```
+
+The `useTheme` hook returns the following object:
+
+```tsx
+interface UseThemeYield {
+  theme: string;
+  darkTheme: string;
+  lightTheme: string;
+  colorSchemePref: ColorSchemeType;
+  systemColorScheme: ResolvedColorSchemeType;
+  resolvedColorScheme: ResolvedColorSchemeType;
+  resolvedTheme: string;
+  setTheme: (theme: string) => void;
+  setDarkTheme: (darkTheme: string) => void;
+  setLightTheme: (lightTheme: string) => void;
+  setThemeSet: (themeSet: { darkTheme: string; lightTheme: string }) => void;
+  setColorSchemePref: (colorSchemePref: ColorSchemeType) => void;
+  toggleColorScheme: (skipSystem?: boolean) => void;
+  setForcedTheme: (forcedTheme: string) => void;
+  setForcedColorScheme: (forcedColorScheme: ColorSchemeType) => void;
+}
+```
+
+<details>
+<summary><h2 style="display:inline">Force per page theme and color-scheme</h2></summary>
+
+### Next.js App Router
+
+```tsx
+import { ForceTheme } from "nextjs-themes/force-theme";
+
+function MyPage() {
+  return (
+    <>
+      <ForceTheme theme="my-theme" />
+      ...
+    </>
+  );
+}
+
+export default MyPage;
+```
+
+> If you are using TypeScript and have not set nodeResolution to `Bundler` or `Node16` or `NodeNext`, you need to import from `nextjs-themes/client/force-theme`
+
+### Next.js Pages Router
+
+For the pages router, you have two options. The first option is the same as the app router, and the second option, which is compatible with `next-themes`, involves adding the `theme` property to your page component like this:
+
+```javascript
+function MyPage() {
+  return <>...</>;
+}
+
+MyPage.theme = "my-theme";
+
+export default MyPage;
+```
+
+Similarly, you can force a color scheme. This will apply your `defaultDark` or `defaultLight` theme, which can be configured via hooks.
+
+</details>
+
+### With Styled Components and any CSS-in-JS
+
+Next Themes works with any library. For Styled Components, `createGlobalStyle` in your custom App:
+
+```js
+// pages/_app.js
+import { createGlobalStyle } from "styled-components";
+import { ThemeSwitcher } from "nextjs-themes";
+
+const GlobalStyle = createGlobalStyle`
+  :root {
+    --fg: #000;
+    --bg: #fff;
+  }
+
+  [data-theme="dark"] {
+    --fg: #fff;
+    --bg: #000;
+  }
+`;
+
+function MyApp({ Component, pageProps }) {
+  return (
+    <>
+      <GlobalStyle />
+      <ThemeSwitcher forcedTheme={Component.theme} />
+      <Component {...pageProps} />
+    </>
+  );
+}
+```
+
+### With Tailwind
+
+In `tailwind.config.js`, set the dark mode property to class:
+
+```js
+// tailwind.config.js
+module.exports = {
+  darkMode: "class",
+};
+```
+
+⚡🎉Ready to use dark mode in Tailwind!
+
+> Caution: Your class must be `"dark"`, which is the default value used in this library. Tailwind requires the class name `"dark"` for dark-theme.
+
+Use dark-mode specific classes:
+
+```tsx
+<h1 className="text-black dark:text-white">
+```
+
+> <img src="https://github.com/react18-tools/turborepo-template/blob/main/popper.png?raw=true" style="height: 20px"/> Please consider enrolling in [our courses](https://mayank-chaudhari.vercel.app/courses) or [sponsoring](https://github.com/sponsors/mayank1513) our work.
+
+<hr />
+
+<p align="center" style="text-align:center">with 💖 by <a href="https://mayank-chaudhari.vercel.app" target="_blank">Mayank Kumar Chaudhari</a></p>

From 7597e7d3953458178d4fe746714a8ee0e07a534a Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Tue, 25 Jun 2024 00:51:54 +0530
Subject: [PATCH 58/60] update Readme.

---
 README.md           | 3 +++
 guides/migration.md | 2 +-
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index ba81e340..0decce33 100644
--- a/README.md
+++ b/README.md
@@ -49,6 +49,9 @@ This project was inspired by next-themes. Unlike next-themes, `nextjs-themes` do
 
 > See [Getting Started](./guides/getting-started.md)
 
+> Want Lite Version? [![npm bundle size](https://img.shields.io/bundlephobia/minzip/nextjs-themes-lite)](https://www.npmjs.com/package/nextjs-themes-lite) [![Version](https://img.shields.io/npm/v/nextjs-themes-lite.svg?colorB=green)](https://www.npmjs.com/package/nextjs-themes-lite) [![Downloads](https://img.jsdelivr.com/img.shields.io/npm/d18m/nextjs-themes-lite.svg)](https://www.npmjs.com/package/nextjs-themes-lite)
+> In case you are using `r18gs` in your project, you may use lite version which requires `r18gs` as a peerDependency.
+
 ## Migration
 
 > Refer to the [migration guide](./guides/migration.md).
diff --git a/guides/migration.md b/guides/migration.md
index b03b3943..0130adac 100644
--- a/guides/migration.md
+++ b/guides/migration.md
@@ -12,7 +12,7 @@ title: Migration Guide
 - If you have been using these components, they will have no effect. We recommend removing them.
 - There is no need to use sibling selectors. Without `NextJsSSGThemeSwitcher` or `NextJsServerTarget`, you are free to use any target, whether as a wrapper or a sibling.
 
-### Breaking Changes
+### Breaking Changes - these should only affect a very small fraction of library users
 
 - `ForceColorScheme` and `ForceTheme` are no longer exported from `nextjs-themes` or `nextjs-themes/client`. Use `nextjs-themes/force-color-scheme` or `nextjs-themes/force-theme` instead.
 - The class names for `ColorSwitch` have been shortened.

From 2cd4d4e8da9feab24135bdd2028cc31e9ffe69a3 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Tue, 25 Jun 2024 00:55:09 +0530
Subject: [PATCH 59/60] update Readme.

---
 guides/migration.md | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/guides/migration.md b/guides/migration.md
index 0130adac..26134fd8 100644
--- a/guides/migration.md
+++ b/guides/migration.md
@@ -4,7 +4,9 @@ title: Migration Guide
 
 # Migration Guide
 
-## Migrating to V4
+## Migrating to V3 and V4
+
+> V3 was entirely re-written with minimal API changes. V4 optimises V3 by minor refactors.
 
 - No more cookies.
 - You no longer need to use `NextJsSSGThemeSwitcher`, `NextJsServerTarget`, or `ServerSideWrapper`.

From ff3b652854cd0ace531b7c4d7c8530fd3b37b069 Mon Sep 17 00:00:00 2001
From: Mayank <mayank.srmu@gmail.com>
Date: Tue, 25 Jun 2024 00:58:30 +0530
Subject: [PATCH 60/60] Update lock file

---
 pnpm-lock.yaml | 15 ---------------
 1 file changed, 15 deletions(-)

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 509fb7a5..d2509d09 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -35,14 +35,7 @@ importers:
         version: 0.26.2(typescript@5.5.2)
       typedoc-plugin-extras:
         specifier: ^3.0.0
-<<<<<<< HEAD
         version: 3.0.0(typedoc@0.26.2(typescript@5.5.2))
-      typedoc-plugin-inline-sources:
-        specifier: ^1.0.2
-        version: 1.0.2(typedoc@0.26.2(typescript@5.5.2))
-=======
-        version: 3.0.0(typedoc@0.26.1(typescript@5.5.2))
->>>>>>> 6c4d75c (Update lock file)
       typedoc-plugin-mdn-links:
         specifier: ^3.2.1
         version: 3.2.1(typedoc@0.26.2(typescript@5.5.2))
@@ -10409,15 +10402,7 @@ snapshots:
     dependencies:
       typedoc: 0.26.2(typescript@5.5.2)
 
-<<<<<<< HEAD
-  typedoc-plugin-inline-sources@1.0.2(typedoc@0.26.2(typescript@5.5.2)):
-    dependencies:
-      typedoc: 0.26.2(typescript@5.5.2)
-
   typedoc-plugin-mdn-links@3.2.1(typedoc@0.26.2(typescript@5.5.2)):
-=======
-  typedoc-plugin-mdn-links@3.2.1(typedoc@0.26.1(typescript@5.5.2)):
->>>>>>> 6c4d75c (Update lock file)
     dependencies:
       typedoc: 0.26.2(typescript@5.5.2)