@docubook/flame 2.0.0-beta.4 → 2.0.0

package/.docu/lib/{html.shared-WwQnhDty.js → html.shared-CsEFmy_Y.js}

@@ -1,23 +1,24 @@
-import { a as DOCS_DIR, c as PROJECT_ROOT, d as loadDocuConfig, f as resolveProjectFile, l as STYLES_DIR, o as FRAMEWORK_ROOT, s as LIB_DIR, t as ASSETS_DIR, u as cleanOldBundles } from "./paths-Bl2cdp9E.js";
+import { a as DOCS_DIR, d as cleanOldBundles, f as loadDocuConfig, l as PROJECT_ROOT, o as FRAMEWORK_ROOT, p as resolveProjectFile, s as LIB_DIR, t as ASSETS_DIR, u as STYLES_DIR } from "./paths-Cbz-dj4s.js";
 import { c as scanMdxFiles, f as cspMeta, i as formatDate2, n as cn, o as isExternalUrl, r as docsHtmlHref, v as normalizeImporterPath } from "./utils-B_CoyKie.js";
 import { builtinModules, createRequire } from "node:module";
 import { existsSync, readFileSync, readdirSync, statSync } from "node:fs";
-import { basename, dirname, extname, join, relative, resolve, sep } from "node:path";
+import { dirname, extname, join, relative, resolve, sep } from "node:path";
 import { mkdir, readFile, rename, stat, unlink, writeFile } from "node:fs/promises";
 import { execFile } from "node:child_process";
 import { promisify } from "node:util";
 import { build } from "vite";
-import { generateThemeCss, presetRegistry, resolveTheme } from "@docubook/themes-colors";
 import { createHash } from "node:crypto";
+import { generateThemeCss, presetRegistry, resolveTheme } from "@docubook/themes-colors";
 import React, { createContext, useCallback, useContext, useEffect, useRef, useState } from "react";
 import { z } from "zod";
-import { MDXRemote, createDefaultRehypePlugins, createDefaultRemarkPlugins, extractFrontmatter, extractFrontmatterWithContent, extractTocsFromRawMdx, serialize } from "@docubook/core";
+import { MDXRemote, createDefaultRehypePlugins, createDefaultRemarkPlugins, extractFrontmatter, extractFrontmatterWithContent, rehypeCollectTocs, serialize } from "@docubook/core";
 import { createMdxComponents } from "@docubook/markdown";
 import * as LucideIcons from "lucide-react";
-import { ArrowUpIcon, ArrowUpRight, ChevronDown, ChevronLeft, ChevronRight, ListIcon, SquarePen } from "lucide-react";
+import { ArrowUpIcon, ArrowUpRight, ChevronDown, ChevronLeft, ChevronRight, ListIcon, Moon, SquarePen, Sun } from "lucide-react";
 import { Breadcrumb, BreadcrumbItem, BreadcrumbList, BreadcrumbPage } from "@docubook/ui-react/breadcrumbs";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { PaginationDocs } from "@docubook/ui-react/pagination";
+import { ThemeControllerToggle } from "@docubook/ui-react/theme-controller";
 //#region .docu/node/plugin-loader.ts
 var NPM_PACKAGE_RE = /^(?:@[a-z0-9-~][a-z0-9-._~]*\/)?[a-z0-9-~][a-z0-9-._~]*$/;
 /**
@@ -224,15 +225,15 @@ var BuildPluginBuilder = class {
 	}
 	/**
 	* Register a callback to run once after all pages are built.
-	* Receives the resolved config and aggregated page metadata.
-	* Errors thrown by the callback propagate to the caller via `runOnEnd()`.
+	* Receives the resolved config, aggregated docs metadata, and final build metadata.
+	* Callback errors are logged by `runOnEnd()` and do not stop later callbacks.
 	*
-	* @param callback - Receives config and page metadata array. May return a Promise.
+	* @param callback - Receives config, page metadata, and emitted assets. May return a Promise.
 	*
 	* @example
-	* build.onEnd(async (config, pages) => {
+	* build.onEnd(async (config, pages, { outDir }) => {
 	*   const xml = generateSitemap(pages, config.meta.baseURL);
-	*   const out = ".docu/dist/sitemap.xml";
+	*   const out = join(outDir, "sitemap.xml");
 	*   // Bun.write on Bun for speed, writeFile on Node/Deno
 	*   await (typeof Bun !== "undefined"
 	*     ? Bun.write(out, xml)
@@ -246,7 +247,7 @@ var BuildPluginBuilder = class {
 	* Register a callback to transform raw file content before MDX compilation.
 	* Filtered by regex against the file's relative path — only the **first** matching
 	* handler's result is used.
-	* Errors thrown by the callback propagate to the caller via `runOnLoad()`.
+	* Callback errors are logged by `runOnLoad()` before trying later matching handlers.
 	*
 	* @param args.filter - RegExp matched against the file's relative path.
 	* @param args.namespace - Optional namespace prefix (reserved for future use).
@@ -266,7 +267,7 @@ var BuildPluginBuilder = class {
 	/**
 	* Register a callback to run once before the build starts.
 	* Receives the resolved DocuConfig for validation or resource initialization.
-	* Errors thrown by the callback propagate to the caller via `runOnStart()`.
+	* Callback errors are logged by `runOnStart()` and do not stop later callbacks.
 	*
 	* @param callback - Receives the resolved config. May return a Promise.
 	*
@@ -327,11 +328,12 @@ var BuildPluginBuilder = class {
 	* Errors inside individual callbacks are caught and logged — execution
 	* continues to the next callback without throwing.
 	*
-	* @param pages - Array of metadata for every built page.
+	* @param pages - Array of metadata for every built docs page.
+	* @param context - Final output directory and page-specific asset manifest.
 	*/
-	async runOnEnd(pages) {
+	async runOnEnd(pages, context) {
 		for (let i = 0; i < this._onEnd.length; i++) try {
-			await this._onEnd[i](this.config, pages);
+			await this._onEnd[i](this.config, pages, context);
 		} catch (err) {
 			console.error(`[plugin] onEnd callback #${i + 1} error: ${err instanceof Error ? err.message : String(err)}`);
 		}
@@ -637,13 +639,12 @@ function computeTailwindCacheKey(globals, themeSuffix, projectRoot = resolveProj
 	h.update("\0");
 	h.update(runtimeStamp());
 	h.update("\0");
-	h.update(`v4`);
+	h.update(`v5`);
 	return h.digest("hex").slice(0, 16);
 }
-/** Read globals.css content ("" when missing). Shared by both hydrators. */
-function readGlobalsCss() {
-	const globalsPath = join(STYLES_DIR, "globals.css");
-	return existsSync(globalsPath) ? readFileSync(globalsPath, "utf-8") : "";
+/** Read a Tailwind entry plus relative imports for cache invalidation. */
+function readStyleCss(file = "globals.css") {
+	return readCssWithImports(join(STYLES_DIR, file), /* @__PURE__ */ new Set());
 }
 /**
 * Atomic file write: tmp + rename so a crash mid-write never leaves a
@@ -683,7 +684,7 @@ function hookMemoryPressure(clear) {
 function hashMdxSources(mdxSources) {
 	const h = createHash("sha256");
 	const slugs = Object.keys(mdxSources).sort();
-	h.update(`v4:${runtimeStamp()}:`);
+	h.update(`v5:${runtimeStamp()}:`);
 	for (const slug of slugs) {
 		h.update(slug);
 		h.update("\0");
@@ -808,6 +809,12 @@ function resolveRoutes(docuJsonRoutes) {
 //#endregion
 //#region .docu/node/hydrate.ts
 var themeRegistry = presetRegistry;
+function createMdxModuleEntries(mdxSources) {
+	return Object.keys(mdxSources).sort().map((slug) => ({
+		slug,
+		id: `docubook-mdx-page-${createHash("sha256").update(slug).digest("hex").slice(0, 16)}`
+	}));
+}
 /**
 * Read the effective theme config with this priority:
 * 1. FLAME_THEME env var (CLI --theme flag)
@@ -817,9 +824,7 @@ function getThemeConfig() {
 	if (process.env.FLAME_THEME) return process.env.FLAME_THEME;
 	return loadDocuConfig().themes?.colors;
 }
-/**
-* Append theme CSS to compiled Tailwind output based on theme config.
-*/
+/** Append theme CSS to compiled Tailwind output based on theme config. */
 function buildThemeCss(baseCss, themeConfig) {
 	try {
 		const resolved = resolveTheme(themeConfig, themeRegistry);
@@ -829,10 +834,7 @@ function buildThemeCss(baseCss, themeConfig) {
 		return baseCss;
 	}
 }
-/**
-* Compute inline theme CSS for FOUC prevention.
-* Returns undefined if no theme is configured or on error.
-*/
+/** Compute inline theme CSS for FOUC prevention. */
 function computeInlineThemeCss() {
 	try {
 		const themeColors = getThemeConfig();
@@ -846,33 +848,27 @@ function computeInlineThemeCss() {
 }
 //#endregion
 //#region .docu/node/hydrate.node.ts
-/**
-* Client bundle builder for Node/Deno runtimes.
-*
-* Uses Vite with Rolldown plugins to produce a browser-ready client
-* bundle (JS + CSS) from the same components Bun.build handles natively.
-* Theme helpers (getThemeConfig, buildThemeCss, computeInlineThemeCss)
-* are re-exported from `hydrate.ts` — that module's `buildClientBundle`
-* is Bun-only and unused here.
-*/
+/** Client bundle builder for Node/Deno runtimes. */
 /** Extract Lucide icon names from user docu.json configuration. */
 function extractConfigIcons(config) {
 	const icons = [];
-	const pushIf = (s) => {
-		if (s) icons.push(s);
+	const pushIf = (value) => {
+		if (value) icons.push(value);
 	};
-	config.home?.hero?.actions?.forEach((a) => pushIf(a.icon));
-	config.home?.features?.forEach((f) => pushIf(f.icon));
+	config.home?.hero?.actions?.forEach((action) => pushIf(action.icon));
+	config.home?.features?.forEach((feature) => pushIf(feature.icon));
 	(function walk(routes) {
-		for (const r of routes) {
-			pushIf(r.context?.icon);
-			if (r.items) walk(r.items);
+		for (const route of routes) {
+			pushIf(route.context?.icon);
+			if (route.items) walk(route.items);
 		}
 	})(config.routes ?? []);
-	return [...new Set(icons.filter((n) => /^[A-Z]/.test(n)))];
+	return [...new Set(icons.filter((name) => /^[A-Z]/.test(name)))];
+}
+function viteChunkFileName(chunk) {
+	return `chunks/${chunk.name.replace(/^_docubook-mdx-page-/, "docubook-mdx-page-")}-[hash].js`;
 }
 var execFileAsync = promisify(execFile);
-/** Resolve the @tailwindcss/cli binary path from the installed package. */
 function resolveTailwindBin() {
 	const require = createRequire(import.meta.url);
 	const pkgPath = require.resolve("@tailwindcss/cli/package.json");
@@ -880,33 +876,30 @@ function resolveTailwindBin() {
 	const binRel = typeof pkg.bin === "string" ? pkg.bin : pkg.bin.tailwindcss;
 	return join(dirname(pkgPath), binRel);
 }
-/** Compute a cache key from globals.css + theme + config + toolchain. */
-function tailwindCacheKey() {
-	const globalsContent = readGlobalsCss();
-	let themeSuffix = "";
+function themeCacheSuffix() {
 	try {
 		const themeColors = getThemeConfig();
-		if (themeColors) themeSuffix = JSON.stringify(themeColors);
-	} catch {}
-	return computeTailwindCacheKey(globalsContent, themeSuffix);
+		return themeColors ? JSON.stringify(themeColors) : "";
+	} catch {
+		return "";
+	}
 }
-/**
-* Build Tailwind CSS with content-based caching.
-* If a CSS file for the current input hash already exists, skip the subprocess.
-* Returns the filename (e.g. "client-abc123.css") and CSS content.
-*/
-async function buildTailwindCss(key) {
-	const cachedFile = `client-${key}.css`;
+function tailwindCacheKey(styleFile) {
+	return computeTailwindCacheKey(readStyleCss(styleFile), `${styleFile}\0${themeCacheSuffix()}`);
+}
+async function buildTailwindCss(name, styleFile) {
+	const key = tailwindCacheKey(styleFile);
+	const cachedFile = `${name}-${key}.css`;
 	const cachedPath = join(ASSETS_DIR, cachedFile);
 	if (existsSync(cachedPath)) return {
 		file: cachedFile,
 		content: readFileSync(cachedPath, "utf-8")
 	};
-	const tmpCss = join(ASSETS_DIR, `_tmp-${key}.css`);
+	const tmpCss = join(ASSETS_DIR, `_tmp-${name}-${key}.css`);
 	const bin = resolveTailwindBin();
-	const twArgs = [
+	const tailwindArgs = [
 		"-i",
-		join(STYLES_DIR, "globals.css"),
+		join(STYLES_DIR, styleFile),
 		"-o",
 		tmpCss,
 		"--minify"
@@ -915,8 +908,8 @@ async function buildTailwindCss(key) {
 		"run",
 		"-A",
 		bin,
-		...twArgs
-	] : [bin, ...twArgs];
+		...tailwindArgs
+	] : [bin, ...tailwindArgs];
 	try {
 		await execFileAsync(process.execPath, args, { maxBuffer: 16777216 });
 	} catch (err) {
@@ -929,38 +922,34 @@ async function buildTailwindCss(key) {
 		const themeColors = getThemeConfig();
 		if (themeColors) cssContent = buildThemeCss(cssContent, themeColors);
 	} catch (err) {
-		console.warn(`[flame] Failed to resolve theme config, falling back to globals.css only: ${err instanceof Error ? err.message : String(err)}`);
+		console.warn(`[flame] Failed to resolve theme config: ${err instanceof Error ? err.message : String(err)}`);
 	}
-	const cssFile = `client-${key}.css`;
-	const outPath = join(ASSETS_DIR, cssFile);
-	if (!existsSync(outPath)) await atomicWriteFile(writeFile, rename, unlink, outPath, cssContent);
+	if (!existsSync(cachedPath)) await atomicWriteFile(writeFile, rename, unlink, cachedPath, cssContent);
 	return {
-		file: cssFile,
+		file: cachedFile,
 		content: cssContent
 	};
 }
-var NODE_BUILTINS_RE = new RegExp(`^(node:.*|${builtinModules.map((m) => m.replace(/\//g, "\\/")).join("|")})$`);
+var NODE_BUILTINS_RE = new RegExp(`^(node:.*|${builtinModules.map((module) => module.replace(/\//g, "\\/")).join("|")})$`);
 var lucideRealEntry;
-/** Resolve the real lucide-react entry path once (cached). */
 function getLucideRealEntry() {
 	if (!lucideRealEntry) lucideRealEntry = createRequire(import.meta.url).resolve("lucide-react");
 	return lucideRealEntry;
 }
 var LUCIDE_IMPORT_RE = /import\s*\{([^}]+)\}\s*from\s*["']lucide-react["']/g;
 var LUCIDE_ICON_RE = /^[A-Z]/;
-/** Walk a directory scanning JS/TS/TSX files for `lucide-react` named imports. */
 function scanDirLucideIcons(dir, set) {
 	if (!existsSync(dir)) return;
 	try {
 		const entries = readdirSync(dir, { withFileTypes: true });
-		for (const e of entries) {
-			const full = join(dir, e.name);
-			if (e.isDirectory()) {
-				if (e.name !== "node_modules") scanDirLucideIcons(full, set);
-			} else if (/\.(js|ts|tsx)$/.test(e.name)) {
+		for (const entry of entries) {
+			const full = join(dir, entry.name);
+			if (entry.isDirectory()) {
+				if (entry.name !== "node_modules") scanDirLucideIcons(full, set);
+			} else if (/\.(js|ts|tsx)$/.test(entry.name)) {
 				const content = readFileSync(full, "utf-8");
-				for (const m of content.matchAll(LUCIDE_IMPORT_RE)) for (const s of m[1].split(",")) {
-					const name = s.trim().split(/\s+as\s+/)[0].trim();
+				for (const match of content.matchAll(LUCIDE_IMPORT_RE)) for (const specifier of match[1].split(",")) {
+					const name = specifier.trim().split(/\s+as\s+/)[0].trim();
 					if (LUCIDE_ICON_RE.test(name)) set.add(name);
 				}
 			}
@@ -969,27 +958,27 @@ function scanDirLucideIcons(dir, set) {
 		console.warn(`[flame] Failed to scan lucide icons: ${err instanceof Error ? err.message : String(err)}`);
 	}
 }
-/** Collect every lucide icon name imported across flame sources and deps. */
 function collectAllLucideIcons() {
 	const icons = /* @__PURE__ */ new Set();
 	scanDirLucideIcons(join(FRAMEWORK_ROOT, ".docu/components"), icons);
 	scanDirLucideIcons(join(FRAMEWORK_ROOT, ".docu/pages"), icons);
-	const depDirs = [
+	const dependencyDirs = [
 		join(FRAMEWORK_ROOT, "..", "mdx-content", "dist"),
 		join(FRAMEWORK_ROOT, "..", "ui-react", "dist"),
 		join(FRAMEWORK_ROOT, "..", "core", "dist"),
 		join(FRAMEWORK_ROOT, "..", "themes-colors", "dist")
 	];
-	for (const d of depDirs) scanDirLucideIcons(resolve(d), icons);
+	for (const dir of dependencyDirs) scanDirLucideIcons(resolve(dir), icons);
 	return [...icons];
 }
-/** Build the client JS bundle and Tailwind CSS. */
 async function buildClientBundle(mdxSources = {}) {
 	await mkdir(ASSETS_DIR, { recursive: true });
-	const twKey = tailwindCacheKey();
-	await cleanOldBundles(/* @__PURE__ */ new Set([`client-${twKey}.css`]));
+	await cleanOldBundles();
 	const nodeEnv = process.env.NODE_ENV || "development";
-	const entryPath = join(LIB_DIR, "client.ts");
+	const mdxEntries = createMdxModuleEntries(mdxSources);
+	const mdxEntriesById = new Map(mdxEntries.map((entry) => [entry.id, entry]));
+	const docsEntryPath = join(LIB_DIR, "client.ts");
+	const homeEntryPath = join(LIB_DIR, "home-client.ts");
 	const bundle = await build({
 		configFile: false,
 		publicDir: false,
@@ -1046,21 +1035,15 @@ async function buildClientBundle(mdxSources = {}) {
 				name: "mdx-hydrate",
 				resolveId(id) {
 					if (/mdx-manifest$/.test(id)) return "\0mdx-manifest";
-					if (id.startsWith("mdx-module:")) return `\0${id}`;
+					if (/^docubook-mdx-page-[a-f0-9]{16}$/.test(id)) return `\0${id}`;
 					return null;
 				},
 				load(id) {
-					if (id === "\0mdx-manifest") {
-						const slugs = Object.keys(mdxSources).sort();
-						return `${slugs.map((slug, i) => {
-							const key = slug.replace(/["\\]/g, "");
-							return `import * as _mdx${i} from ${JSON.stringify(`mdx-module:${key}`)};`;
-						}).join("\n")}\nexport const mdxModules = { ${slugs.map((slug, i) => `${JSON.stringify(slug)}: _mdx${i}`).join(", ")} };\n`;
-					}
-					if (!id.startsWith("\0mdx-module:")) return null;
-					const slug = id.slice(12);
-					const contents = mdxSources[slug];
-					if (contents == null) throw new Error(`unknown mdx module: ${slug}`);
+					if (id === "\0mdx-manifest") return `export const mdxModules = { ${mdxEntries.map(({ slug, id }) => `${JSON.stringify(slug)}: () => import(${JSON.stringify(id)})`).join(", ")} };\n`;
+					if (!id.startsWith("\0docubook-mdx-page-")) return null;
+					const entry = mdxEntriesById.get(id.slice(1));
+					const contents = entry == null ? void 0 : mdxSources[entry.slug];
+					if (contents == null) throw new Error(`unknown mdx module: ${id}`);
 					return contents;
 				}
 			}
@@ -1072,36 +1055,45 @@ async function buildClientBundle(mdxSources = {}) {
 			minify: nodeEnv === "production",
 			target: "es2020",
 			rollupOptions: {
-				input: entryPath,
+				input: {
+					client: docsEntryPath,
+					"home-client": homeEntryPath
+				},
 				output: {
 					format: "es",
-					entryFileNames: "client-[hash].js",
-					chunkFileNames: "chunks/[name]-[hash].js",
+					entryFileNames: "[name]-[hash].js",
+					chunkFileNames: viteChunkFileName,
 					assetFileNames: "assets/[name]-[hash][extname]"
 				}
 			}
 		}
 	});
 	const outputs = Array.isArray(bundle) ? bundle : [bundle];
-	let jsFile;
+	let docsJs;
+	let homeJs;
 	for (const item of outputs) {
 		if (!("output" in item)) continue;
-		for (const output of item.output) if (output.type === "chunk" && output.isEntry && output.facadeModuleId && resolve(output.facadeModuleId) === entryPath) {
-			jsFile = basename(output.fileName);
-			break;
+		for (const output of item.output) {
+			if (output.type !== "chunk" || !output.isEntry) continue;
+			if (output.name === "client") docsJs = output.fileName;
+			if (output.name === "home-client") homeJs = output.fileName;
 		}
-		if (jsFile) break;
 	}
-	if (!jsFile) throw new Error("Client bundle produced no output files");
-	const { file: cssFile } = await buildTailwindCss(twKey);
-	await writeFile(join(ASSETS_DIR, "manifest.json"), JSON.stringify({
-		js: jsFile,
-		css: cssFile
-	}));
-	return {
-		js: jsFile,
-		css: cssFile
+	if (!docsJs || !homeJs) throw new Error("Client bundle produced incomplete entry-point outputs");
+	const [{ file: docsCss }, { file: siteCss }] = await Promise.all([buildTailwindCss("docs", "globals.css"), buildTailwindCss("site", "site.css")]);
+	const manifest = {
+		docs: {
+			js: docsJs,
+			css: docsCss
+		},
+		home: {
+			js: homeJs,
+			css: siteCss
+		},
+		notFound: { css: siteCss }
 	};
+	await writeFile(join(ASSETS_DIR, "manifest.json"), JSON.stringify(manifest));
+	return manifest;
 }
 //#endregion
 //#region .docu/node/git.ts
@@ -1288,10 +1280,12 @@ async function serializeWithDocPlugins(rawMdx, opts = {}, pre) {
 		remarkMdxJsxDocsHtmlLinks,
 		...opts.remarkPlugins ?? []
 	];
+	const tocs = [];
 	const finalRehype = [
 		...defaultRehype,
 		rehypeDocsHtmlLinks,
-		...opts.rehypePlugins ?? []
+		...opts.rehypePlugins ?? [],
+		[rehypeCollectTocs, tocs]
 	];
 	return serialize(strippedContent, {
 		outputFormat: opts.outputFormat,
@@ -1303,7 +1297,8 @@ async function serializeWithDocPlugins(rawMdx, opts = {}, pre) {
 	}).then((serialized) => ({
 		...serialized,
 		frontmatter,
-		strippedContent
+		strippedContent,
+		tocs
 	}));
 }
 /**
@@ -1317,7 +1312,6 @@ async function serializeWithDocPlugins(rawMdx, opts = {}, pre) {
 * @param frontmatterSchema - Custom schema overriding the default contract
 */
 async function compileMdx(rawMdx, filePath, gitDates, remarkPlugins, rehypePlugins, frontmatterSchema, pre) {
-	const tocs = extractTocsFromRawMdx(rawMdx);
 	const frontmatter = pre?.frontmatter ?? (frontmatterSchema ? extractFrontmatterWithContent(rawMdx, frontmatterSchema).frontmatter : extractFrontmatterWithContent(rawMdx).frontmatter);
 	const serialized = await serializeWithDocPlugins(rawMdx, {
 		remarkPlugins,
@@ -1339,7 +1333,7 @@ async function compileMdx(rawMdx, filePath, gitDates, remarkPlugins, rehypePlugi
 			...frontmatter,
 			date
 		},
-		tocs
+		tocs: serialized.tocs
 	};
 }
 /**
@@ -1495,9 +1489,13 @@ function extractRecords(filePath, raw) {
 			flushParagraph();
 			const level = headingMatch[1].length;
 			const title = headingMatch[2].replace(/[*`[\]]/g, "").trim();
+			if (level === 1) {
+				for (let i = 2; i <= 6; i++) hierarchy[`lvl${i}`] = null;
+				if (!hierarchy.lvl1) hierarchy.lvl1 = title;
+				continue;
+			}
 			for (let i = level; i <= 6; i++) hierarchy[`lvl${i}`] = null;
 			hierarchy[`lvl${level}`] = title;
-			if (level === 1 && !hierarchy.lvl1) hierarchy.lvl1 = title;
 			if (level >= 2) records.push({
 				url: `${url}#${slugify(title)}`,
 				hierarchy: { ...hierarchy },
@@ -1969,7 +1967,7 @@ function Toc({ tocs }) {
 				children: "On this page"
 			})]
 		}), /* @__PURE__ */ jsxs("div", {
-			className: "relative min-h-0 flex-1 overflow-y-auto overscroll-contain pr-1",
+			className: "relative min-h-0 flex-1 overflow-y-auto pr-1",
 			children: [/* @__PURE__ */ jsxs("div", {
 				className: "relative text-sm",
 				children: [/* @__PURE__ */ jsx("div", { className: "bg-base-300 absolute top-0 left-0 h-full w-px" }), /* @__PURE__ */ jsx("div", {
@@ -2091,29 +2089,23 @@ function DocsPage({ slug, title, description, date, content, tocs, filePath, rep
 	});
 }
 //#endregion
-//#region .docu/pages/404.tsx
-function NotFoundPage() {
-	return /* @__PURE__ */ jsx("div", {
-		className: "flex w-full flex-1 px-4 py-8 lg:h-[calc(100vh-4rem)] lg:px-8 lg:py-4",
-		children: /* @__PURE__ */ jsxs("div", {
-			className: "bg-base-100 border-base-300 flex min-h-[50vh] w-full flex-col items-center justify-center rounded-xl border shadow-md lg:min-h-0 lg:flex-1",
-			children: [
-				/* @__PURE__ */ jsx("h1", {
-					className: "text-6xl font-bold",
-					children: "404"
-				}),
-				/* @__PURE__ */ jsx("p", {
-					className: "text-base-content/60 py-4 text-xl",
-					children: "Page not found"
-				}),
-				/* @__PURE__ */ jsx("a", {
-					href: "/docs/",
-					className: "btn btn-primary mt-2",
-					children: "Go to Docs"
-				})
-			]
+//#region .docu/components/home/BackgroundBlobs.tsx
+function BackgroundBlobs() {
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
+		"aria-hidden": "true",
+		className: "pointer-events-none absolute -top-40 left-1/2 -z-10 -translate-x-1/2 blur-3xl sm:-top-80",
+		children: /* @__PURE__ */ jsx("div", {
+			style: { clipPath: "polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)" },
+			className: "from-primary to-accent h-[40rem] w-[80rem] bg-gradient-to-tr opacity-20"
 		})
-	});
+	}), /* @__PURE__ */ jsx("div", {
+		"aria-hidden": "true",
+		className: "pointer-events-none absolute bottom-0 left-1/2 -z-10 translate-x-1/4 blur-3xl",
+		children: /* @__PURE__ */ jsx("div", {
+			style: { clipPath: "polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)" },
+			className: "from-accent to-primary h-[30rem] w-[70rem] bg-gradient-to-tr opacity-20"
+		})
+	})] });
 }
 //#endregion
 //#region .docu/components/Lucide.tsx
@@ -2251,6 +2243,56 @@ function Features({ features, className }) {
 	});
 }
 //#endregion
+//#region .docu/pages/404.tsx
+function NotFoundPage() {
+	return /* @__PURE__ */ jsxs("main", {
+		className: "bg-base-100 relative isolate flex min-h-screen w-full items-center justify-center overflow-hidden",
+		children: [/* @__PURE__ */ jsx(BackgroundBlobs, {}), /* @__PURE__ */ jsx(Hero, { hero: {
+			headline: "404",
+			description: "Page not found",
+			actions: [{
+				text: "Go to Docs",
+				link: "/docs/"
+			}]
+		} })]
+	});
+}
+//#endregion
+//#region .docu/components/Theme.tsx
+function ThemeButtons({ className, isDark, toggle }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: `border-base-600 dark:border-base-content/20 bg-base-100/50 flex items-center gap-1 rounded-full border p-0.5 transition-all ${className || ""}`,
+		children: [/* @__PURE__ */ jsx("button", {
+			type: "button",
+			role: "switch",
+			"aria-label": "Light mode",
+			"aria-checked": !isDark,
+			onClick: toggle ? () => toggle(false) : void 0,
+			className: "bg-primary cursor-pointer rounded-full p-0.5 transition-all dark:bg-transparent",
+			children: /* @__PURE__ */ jsx(Sun, { className: `h-4 w-4 transition-colors ${!isDark ? "text-primary-foreground" : "text-foreground"}` })
+		}), /* @__PURE__ */ jsx("button", {
+			type: "button",
+			role: "switch",
+			"aria-label": "Dark mode",
+			"aria-checked": isDark,
+			onClick: toggle ? () => toggle(true) : void 0,
+			className: "dark:bg-primary cursor-pointer rounded-full p-0.5 transition-all",
+			children: /* @__PURE__ */ jsx(Moon, { className: `h-4 w-4 transition-colors ${isDark ? "text-primary-foreground" : "text-base-content/60"}` })
+		})]
+	});
+}
+function ThemeToggle({ className }) {
+	return /* @__PURE__ */ jsx(ThemeControllerToggle, {
+		lightTheme: "light",
+		darkTheme: "dark",
+		children: ({ isDark, toggle }) => /* @__PURE__ */ jsx(ThemeButtons, {
+			className,
+			isDark,
+			toggle
+		})
+	});
+}
+//#endregion
 //#region .docu/pages/index.tsx
 var docuConfig$2 = loadDocuConfig();
 function IndexPage() {
@@ -2285,26 +2327,14 @@ function IndexPage() {
 		children: [
 			/* @__PURE__ */ jsx("div", {
 				className: "absolute top-4 right-4 z-10",
-				id: "theme-island"
-			}),
-			/* @__PURE__ */ jsx("div", {
-				"aria-hidden": "true",
-				className: "pointer-events-none absolute -top-40 left-1/2 -z-10 -translate-x-1/2 blur-3xl sm:-top-80",
 				children: /* @__PURE__ */ jsx("div", {
-					style: { clipPath: "polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)" },
-					className: "from-primary to-accent h-[40rem] w-[80rem] bg-gradient-to-tr opacity-20"
+					id: "theme-toggle-island",
+					children: /* @__PURE__ */ jsx(ThemeToggle, {})
 				})
 			}),
+			/* @__PURE__ */ jsx(BackgroundBlobs, {}),
 			/* @__PURE__ */ jsx(Hero, { hero }),
-			/* @__PURE__ */ jsx(Features, { features }),
-			/* @__PURE__ */ jsx("div", {
-				"aria-hidden": "true",
-				className: "pointer-events-none absolute bottom-0 left-1/2 -z-10 translate-x-1/4 blur-3xl",
-				children: /* @__PURE__ */ jsx("div", {
-					style: { clipPath: "polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)" },
-					className: "from-accent to-primary h-[30rem] w-[70rem] bg-gradient-to-tr opacity-20"
-				})
-			})
+			/* @__PURE__ */ jsx(Features, { features })
 		]
 	});
 }
@@ -2634,6 +2664,7 @@ function htmlShell(opts) {
 	const bodyInjection = bodyExtra?.length ? `\n  ${bodyExtra.join("\n  ")}` : "";
 	const depthPrefix = depth === 0 ? "" : "../".repeat(depth);
 	const assetPrefix = absoluteAssets ? "/assets/" : depthPrefix + "assets/";
+	const clientScript = js ? `\n  <link rel="modulepreload" href="${escapeHtml(assetPrefix + js)}">\n  <script type="module"${nonceAttr} src="${escapeHtml(assetPrefix + js)}"><\/script>` : "";
 	const resolvePath = (path) => absoluteAssets ? path : path.startsWith("/") ? depthPrefix + path.slice(1) : path;
 	let seoTags = "";
 	if (opts.seo) {
@@ -2657,9 +2688,7 @@ function htmlShell(opts) {
   <script${nonceAttr}>try{if(localStorage.getItem("theme")==="dark")document.documentElement.classList.add("dark")}catch(e){}<\/script>${headInjection}
 </head>
 <body>
-  <div id="root">${body}</div>
-  <link rel="modulepreload" href="${escapeHtml(assetPrefix + js)}">
-  <script type="module"${nonceAttr} src="${escapeHtml(assetPrefix + js)}"><\/script>${extraScripts ? `\n  ${extraScripts}` : ""}${bodyInjection}
+  <div id="root">${body}</div>${clientScript}${extraScripts ? `\n  ${extraScripts}` : ""}${bodyInjection}
 </body>
 </html>`;
 }
@@ -2699,4 +2728,4 @@ function hmrScript(nonce) {
 //#endregion
 export { hashMdxSources as C, loadPlugins as D, BuildPluginBuilder as E, atomicWriteFile as S, runtimeStamp as T, getPageStripped as _, IndexPage as a, buildClientBundle as b, captureException as c, clearDerivedPageCaches as d, compileMdx as f, getPageFrontmatter as g, getPageContent as h, DocsLayout as i, initSentry as l, frontmatterField as m, hmrScript as n, NotFoundPage as o, compileMdxModule as p, htmlShell as r, DocsPage as s, errorHtml as t, generateSearchIndex as u, registerPageContent as v, hookMemoryPressure as w, computeInlineThemeCss as x, getGitLastModifiedBatch as y };
 
-//# sourceMappingURL=html.shared-WwQnhDty.js.map
+//# sourceMappingURL=html.shared-CsEFmy_Y.js.map