fix(docs - Theming): Resolving Issue "Hydration failed because the server rendered HTML didn't match the client. As a result this tree will be regenerated on the client. This can happen if a SSR-ed Client Component used"

apps/www/content/docs/dark-mode/next.mdx

@@ -18,16 +18,21 @@ npm install next-themes
 ### Create a theme provider
 
 ```tsx title="components/theme-provider.tsx"
-"use client"
+'use client'
 
-import * as React from "react"
-import { ThemeProvider as NextThemesProvider } from "next-themes"
+import { type ThemeProviderProps } from 'next-themes'
+import dynamic from 'next/dynamic'
+import * as React from 'react'
 
-export function ThemeProvider({
-  children,
-  ...props
-}: React.ComponentProps<typeof NextThemesProvider>) {
-  return <NextThemesProvider {...props}>{children}</NextThemesProvider>
+const NextThemesProvider = dynamic(
+    () => import('next-themes').then((e) => e.ThemeProvider),
+    {
+        ssr: false,
+    }
+)
+
+export function ThemeProvider({ children, ...props }: ThemeProviderProps) {
+    return <NextThemesProvider {...props}>{children}</NextThemesProvider>
 }
 ```