Apply changesets and update CHANGELOG

mayank1513 · mayank1513 · commit 4a560da5e089 · 2024-06-14T15:42:22.000Z
diff --git a/lib/README.md b/lib/README.md
@@ -158,6 +158,26 @@ export default function Layout({ children }) {
 }
 ```
 
+If you prefer SSR over SSG for your entire app, you can wrap entire app with `ServerTarget` as follows:
+
+```tsx
+// app/layout.jsx
+import { Core } from "nextjs-darkmode"; // for better tree-shaking
+import { ServerTarget } from "nextjs-darkmode/server";
+
+export default function Layout({ children }) {
+  return (
+    <ServerTarget tag="html" lang="en">
+      <head />
+      <body>
+        <Core />
+        {children}
+      </body>
+    </ServerTarget>
+  );
+}
+```
+
 ### Switch
 
 An elegant color switch to toggle color schemes:
@@ -332,6 +352,8 @@ Now you can use dark-mode specific classes:
 <h1 className="text-black dark:text-white">
 ```
 
+> When you use Tailwind, make sure you replace `html` in `app/layout` to `<ServerTarget tag="html"...` to avoid FOUC.
+
 ## Performance
 
 `nextjs-darkmode` is designed to be fully tree-shakable, including only the code you use. For instance, if you only use the `useMode` hook, the rest of the library's code will be removed during the build process.
