boltdocs 1.6.0 → 1.7.0

package/dist/{chunk-HSPDIRTW.mjs → chunk-MULKZFVN.mjs}

@@ -4,20 +4,342 @@ import {
 } from "./chunk-FMTOYQLO.mjs";
 
 // src/client/theme/ui/Navbar/Navbar.tsx
-import React10 from "react";
+import { Suspense as Suspense2, lazy as lazy2 } from "react";
+import { Link as Link2, useLocation as useLocation11 } from "react-router-dom";
+import { ChevronDown as ChevronDown3 } from "lucide-react";
+
+// src/client/theme/ui/LanguageSwitcher/LanguageSwitcher.tsx
+import { useState, useRef, useEffect } from "react";
+import { Globe, ChevronDown } from "lucide-react";
+import { useNavigate, useLocation } from "react-router-dom";
+import { jsx, jsxs } from "react/jsx-runtime";
+function getBaseFilePath(filePath, version, locale) {
+  let path = filePath;
+  if (version && (path === version || path.startsWith(version + "/"))) {
+    path = path === version ? "index.md" : path.slice(version.length + 1);
+  }
+  if (locale && (path === locale || path.startsWith(locale + "/"))) {
+    path = path === locale ? "index.md" : path.slice(locale.length + 1);
+  }
+  return path;
+}
+function LanguageSwitcher({
+  i18n,
+  currentLocale,
+  allRoutes
+}) {
+  const [isOpen, setIsOpen] = useState(false);
+  const dropdownRef = useRef(null);
+  const navigate = useNavigate();
+  const location = useLocation();
+  useEffect(() => {
+    function handleClickOutside(event) {
+      if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
+        setIsOpen(false);
+      }
+    }
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => document.removeEventListener("mousedown", handleClickOutside);
+  }, []);
+  const handleSelect = (locale) => {
+    setIsOpen(false);
+    if (locale === currentLocale) return;
+    const currentRoute = allRoutes.find((r) => r.path === location.pathname);
+    let targetPath = "/";
+    if (currentRoute) {
+      const baseFile = getBaseFilePath(
+        currentRoute.filePath,
+        currentRoute.version,
+        currentRoute.locale
+      );
+      const targetRoute = allRoutes.find(
+        (r) => getBaseFilePath(r.filePath, r.version, r.locale) === baseFile && (r.locale || i18n.defaultLocale) === locale && r.version === currentRoute.version
+      );
+      if (targetRoute) {
+        targetPath = targetRoute.path;
+      } else {
+        const defaultIndexRoute = allRoutes.find(
+          (r) => getBaseFilePath(r.filePath, r.version, r.locale) === "index.md" && (r.locale || i18n.defaultLocale) === locale && r.version === currentRoute.version
+        );
+        targetPath = defaultIndexRoute ? defaultIndexRoute.path : locale === i18n.defaultLocale ? currentRoute.version ? `/${currentRoute.version}` : "/" : currentRoute.version ? `/${currentRoute.version}/${locale}` : `/${locale}`;
+      }
+    } else {
+      targetPath = locale === i18n.defaultLocale ? "/" : `/${locale}`;
+    }
+    navigate(targetPath);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "boltdocs-language-switcher", ref: dropdownRef, children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        className: "language-btn",
+        onClick: () => setIsOpen(!isOpen),
+        "aria-label": "Switch language",
+        "aria-expanded": isOpen,
+        "aria-haspopup": "listbox",
+        children: [
+          /* @__PURE__ */ jsx(Globe, { size: 18 }),
+          /* @__PURE__ */ jsx("span", { className: "language-label", children: i18n.locales[currentLocale] || currentLocale }),
+          /* @__PURE__ */ jsx(ChevronDown, { size: 14 })
+        ]
+      }
+    ),
+    isOpen && /* @__PURE__ */ jsx("div", { className: "language-dropdown", children: Object.entries(i18n.locales).map(([key, label]) => /* @__PURE__ */ jsx(
+      "button",
+      {
+        className: `language-option ${key === currentLocale ? "active" : ""}`,
+        onClick: () => handleSelect(key),
+        children: label
+      },
+      key
+    )) })
+  ] });
+}
+
+// src/client/theme/ui/VersionSwitcher/VersionSwitcher.tsx
+import { useState as useState2, useRef as useRef2, useEffect as useEffect2 } from "react";
+import { ChevronDown as ChevronDown2 } from "lucide-react";
+import { useNavigate as useNavigate2, useLocation as useLocation2 } from "react-router-dom";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function getBaseFilePath2(filePath, version, locale) {
+  let path = filePath;
+  if (version && (path === version || path.startsWith(version + "/"))) {
+    path = path === version ? "index.md" : path.slice(version.length + 1);
+  }
+  if (locale && (path === locale || path.startsWith(locale + "/"))) {
+    path = path === locale ? "index.md" : path.slice(locale.length + 1);
+  }
+  return path;
+}
+function VersionSwitcher({
+  versions,
+  currentVersion,
+  currentLocale,
+  allRoutes
+}) {
+  const [isOpen, setIsOpen] = useState2(false);
+  const dropdownRef = useRef2(null);
+  const navigate = useNavigate2();
+  const location = useLocation2();
+  useEffect2(() => {
+    function handleClickOutside(event) {
+      if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
+        setIsOpen(false);
+      }
+    }
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => document.removeEventListener("mousedown", handleClickOutside);
+  }, []);
+  const handleSelect = (version) => {
+    setIsOpen(false);
+    if (version === currentVersion) return;
+    const currentRoute = allRoutes.find((r) => r.path === location.pathname);
+    let targetPath = `/docs/${version}`;
+    if (currentRoute) {
+      const baseFile = getBaseFilePath2(
+        currentRoute.filePath,
+        currentRoute.version,
+        currentRoute.locale
+      );
+      const targetRoute = allRoutes.find(
+        (r) => getBaseFilePath2(r.filePath, r.version, r.locale) === baseFile && (r.version || versions.defaultVersion) === version && (currentLocale ? r.locale === currentLocale : !r.locale)
+      );
+      if (targetRoute) {
+        targetPath = targetRoute.path;
+      } else {
+        const versionIndexRoute = allRoutes.find(
+          (r) => getBaseFilePath2(r.filePath, r.version, r.locale) === "index.md" && (r.version || versions.defaultVersion) === version && (currentLocale ? r.locale === currentLocale : !r.locale)
+        );
+        targetPath = versionIndexRoute ? versionIndexRoute.path : `/docs/${version}${currentLocale ? `/${currentLocale}` : ""}`;
+      }
+    }
+    navigate(targetPath);
+  };
+  return /* @__PURE__ */ jsxs2(
+    "div",
+    {
+      className: "boltdocs-version-switcher",
+      ref: dropdownRef,
+      style: { position: "relative", display: "flex", alignItems: "center" },
+      children: [
+        /* @__PURE__ */ jsxs2(
+          "button",
+          {
+            className: "navbar-version",
+            onClick: () => setIsOpen(!isOpen),
+            "aria-label": "Switch version",
+            "aria-expanded": isOpen,
+            "aria-haspopup": "listbox",
+            style: {
+              fontFamily: "inherit",
+              padding: "0.25rem 0.5rem",
+              marginLeft: "0.5rem"
+            },
+            children: [
+              /* @__PURE__ */ jsx2("span", { children: versions.versions[currentVersion] || currentVersion }),
+              /* @__PURE__ */ jsx2(ChevronDown2, { size: 14 })
+            ]
+          }
+        ),
+        isOpen && /* @__PURE__ */ jsx2(
+          "div",
+          {
+            className: "language-dropdown",
+            style: {
+              left: "0.5rem",
+              right: "auto",
+              minWidth: "150px",
+              top: "calc(100% + 8px)"
+            },
+            children: Object.entries(versions.versions).map(([key, label]) => /* @__PURE__ */ jsx2(
+              "button",
+              {
+                className: `language-option ${key === currentVersion ? "active" : ""}`,
+                onClick: () => handleSelect(key),
+                children: label
+              },
+              key
+            ))
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/client/theme/ui/ThemeToggle/ThemeToggle.tsx
+import { useEffect as useEffect3, useState as useState3 } from "react";
+import { Sun, Moon } from "lucide-react";
+import { jsx as jsx3 } from "react/jsx-runtime";
+function ThemeToggle() {
+  const [theme, setTheme] = useState3("dark");
+  const [mounted, setMounted] = useState3(false);
+  useEffect3(() => {
+    setMounted(true);
+    const stored = localStorage.getItem("boltdocs-theme");
+    if (stored === "light" || stored === "dark") {
+      setTheme(stored);
+    } else {
+      const prefersDark = window.matchMedia(
+        "(prefers-color-scheme: dark)"
+      ).matches;
+      setTheme(prefersDark ? "dark" : "light");
+    }
+    const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+    const handleChange = (e) => {
+      if (!localStorage.getItem("boltdocs-theme")) {
+        setTheme(e.matches ? "dark" : "light");
+      }
+    };
+    mediaQuery.addEventListener("change", handleChange);
+    return () => mediaQuery.removeEventListener("change", handleChange);
+  }, []);
+  useEffect3(() => {
+    if (!mounted) return;
+    const root = document.documentElement;
+    if (theme === "light") {
+      root.classList.add("theme-light");
+      root.dataset.theme = "light";
+    } else {
+      root.classList.remove("theme-light");
+      root.dataset.theme = "dark";
+    }
+  }, [theme, mounted]);
+  const toggleTheme = () => {
+    const newTheme = theme === "dark" ? "light" : "dark";
+    setTheme(newTheme);
+    localStorage.setItem("boltdocs-theme", newTheme);
+  };
+  if (!mounted) {
+    return /* @__PURE__ */ jsx3("button", { className: "navbar-icon-btn", "aria-label": "Toggle theme", disabled: true, children: /* @__PURE__ */ jsx3("span", { style: { width: 20, height: 20, display: "inline-block" } }) });
+  }
+  return /* @__PURE__ */ jsx3(
+    "button",
+    {
+      className: "navbar-icon-btn",
+      onClick: toggleTheme,
+      "aria-label": "Toggle theme",
+      title: `Switch to ${theme === "dark" ? "light" : "dark"} theme`,
+      children: theme === "dark" ? /* @__PURE__ */ jsx3(Sun, { size: 20 }) : /* @__PURE__ */ jsx3(Moon, { size: 20 })
+    }
+  );
+}
+
+// src/client/theme/icons/discord.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var Discord = (props) => /* @__PURE__ */ jsx4("svg", { ...props, viewBox: "0 0 256 199", preserveAspectRatio: "xMidYMid", children: /* @__PURE__ */ jsx4(
+  "path",
+  {
+    d: "M216.856 16.597A208.502 208.502 0 0 0 164.042 0c-2.275 4.113-4.933 9.645-6.766 14.046-19.692-2.961-39.203-2.961-58.533 0-1.832-4.4-4.55-9.933-6.846-14.046a207.809 207.809 0 0 0-52.855 16.638C5.618 67.147-3.443 116.4 1.087 164.956c22.169 16.555 43.653 26.612 64.775 33.193A161.094 161.094 0 0 0 79.735 175.3a136.413 136.413 0 0 1-21.846-10.632 108.636 108.636 0 0 0 5.356-4.237c42.122 19.702 87.89 19.702 129.51 0a131.66 131.66 0 0 0 5.355 4.237 136.07 136.07 0 0 1-21.886 10.653c4.006 8.02 8.638 15.67 13.873 22.848 21.142-6.58 42.646-16.637 64.815-33.213 5.316-56.288-9.08-105.09-38.056-148.36ZM85.474 135.095c-12.645 0-23.015-11.805-23.015-26.18s10.149-26.2 23.015-26.2c12.867 0 23.236 11.804 23.015 26.2.02 14.375-10.148 26.18-23.015 26.18Zm85.051 0c-12.645 0-23.014-11.805-23.014-26.18s10.148-26.2 23.014-26.2c12.867 0 23.236 11.804 23.015 26.2 0 14.375-10.148 26.18-23.015 26.18Z",
+    fill: "currentColor"
+  }
+) });
+
+// src/client/theme/icons/twitter.tsx
+import { jsx as jsx5 } from "react/jsx-runtime";
+var XformerlyTwitter = (props) => /* @__PURE__ */ jsx5("svg", { ...props, fill: "none", viewBox: "0 0 1200 1227", children: /* @__PURE__ */ jsx5(
+  "path",
+  {
+    fill: "currentColor",
+    d: "M714.163 519.284 1160.89 0h-105.86L667.137 450.887 357.328 0H0l468.492 681.821L0 1226.37h105.866l409.625-476.152 327.181 476.152H1200L714.137 519.284h.026ZM569.165 687.828l-47.468-67.894-377.686-540.24h162.604l304.797 435.991 47.468 67.894 396.2 566.721H892.476L569.165 687.854v-.026Z"
+  }
+) });
+
+// src/client/theme/ui/Navbar/GithubStars.tsx
+import { useEffect as useEffect4, useState as useState4 } from "react";
+
+// src/client/theme/icons/github.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
+var GitHub = (props) => /* @__PURE__ */ jsx6("svg", { ...props, viewBox: "0 0 1024 1024", fill: "none", children: /* @__PURE__ */ jsx6(
+  "path",
+  {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M8 0C3.58 0 0 3.58 0 8C0 11.54 2.29 14.53 5.47 15.59C5.87 15.66 6.02 15.42 6.02 15.21C6.02 15.02 6.01 14.39 6.01 13.72C4 14.09 3.48 13.23 3.32 12.78C3.23 12.55 2.84 11.84 2.5 11.65C2.22 11.5 1.82 11.13 2.49 11.12C3.12 11.11 3.57 11.7 3.72 11.94C4.44 13.15 5.59 12.81 6.05 12.6C6.12 12.08 6.33 11.73 6.56 11.53C4.78 11.33 2.92 10.64 2.92 7.58C2.92 6.71 3.23 5.99 3.74 5.43C3.66 5.23 3.38 4.41 3.82 3.31C3.82 3.31 4.49 3.1 6.02 4.13C6.66 3.95 7.34 3.86 8.02 3.86C8.7 3.86 9.38 3.95 10.02 4.13C11.55 3.09 12.22 3.31 12.22 3.31C12.66 4.41 12.38 5.23 12.3 5.43C12.81 5.99 13.12 6.7 13.12 7.58C13.12 10.65 11.25 11.33 9.47 11.53C9.76 11.78 10.01 12.26 10.01 13.01C10.01 14.08 10 14.94 10 15.21C10 15.42 10.15 15.67 10.55 15.59C13.71 14.53 16 11.53 16 8C16 3.58 12.42 0 8 0Z",
+    transform: "scale(64)",
+    fill: "currentColor"
+  }
+) });
+
+// src/client/theme/ui/Navbar/GithubStars.tsx
+import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
+function GithubStars({ repo }) {
+  const [stars, setStars] = useState4(null);
+  useEffect4(() => {
+    if (repo) {
+      getStarsRepo(repo).then((stars2) => setStars(stars2)).catch(() => setStars("0"));
+    }
+  }, [repo]);
+  return /* @__PURE__ */ jsxs3(
+    "a",
+    {
+      href: `https://github.com/${repo}`,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      className: "navbar-github-stars",
+      children: [
+        /* @__PURE__ */ jsx7(GitHub, {}),
+        stars && /* @__PURE__ */ jsx7("span", { children: stars })
+      ]
+    }
+  );
+}
+
+// src/client/theme/ui/Navbar/Tabs.tsx
+import { useLocation as useLocation10 } from "react-router-dom";
 
 // src/client/theme/ui/Link/Link.tsx
-import React7 from "react";
+import React8 from "react";
 import {
   Link as RouterLink,
   NavLink as RouterNavLink,
-  useLocation as useLocation7,
-  useNavigate
+  useLocation as useLocation9,
+  useNavigate as useNavigate3
 } from "react-router-dom";
 
 // src/client/app/preload.tsx
 import { createContext, useContext, useCallback } from "react";
-import { jsx } from "react/jsx-runtime";
+import { jsx as jsx8 } from "react/jsx-runtime";
 var PreloadContext = createContext({
   preload: () => {
   },
@@ -50,74 +372,34 @@ function PreloadProvider({
     },
     [routes, modules]
   );
-  return /* @__PURE__ */ jsx(PreloadContext.Provider, { value: { preload, routes }, children });
+  return /* @__PURE__ */ jsx8(PreloadContext.Provider, { value: { preload, routes }, children });
 }
 
 // src/client/app/index.tsx
-import React6, { useEffect as useEffect4, useState as useState6 } from "react";
+import React7, { useEffect as useEffect7, useState as useState9 } from "react";
 import ReactDOM from "react-dom/client";
 import {
   BrowserRouter,
   Routes,
   Route,
   Outlet,
-  useLocation as useLocation6
+  useLocation as useLocation8
 } from "react-router-dom";
 
 // src/client/theme/ui/Layout/Layout.tsx
-import React4, { useState as useState4 } from "react";
-import { useLocation as useLocation5 } from "react-router-dom";
-import { ChevronLeft as ChevronLeft2, ChevronRight as ChevronRight3 } from "lucide-react";
-
-// src/client/theme/ui/Navbar/GithubStars.tsx
-import { useEffect, useState } from "react";
-
-// src/client/theme/icons/github.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
-var GitHub = (props) => /* @__PURE__ */ jsx2("svg", { ...props, viewBox: "0 0 1024 1024", fill: "none", children: /* @__PURE__ */ jsx2(
-  "path",
-  {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "M8 0C3.58 0 0 3.58 0 8C0 11.54 2.29 14.53 5.47 15.59C5.87 15.66 6.02 15.42 6.02 15.21C6.02 15.02 6.01 14.39 6.01 13.72C4 14.09 3.48 13.23 3.32 12.78C3.23 12.55 2.84 11.84 2.5 11.65C2.22 11.5 1.82 11.13 2.49 11.12C3.12 11.11 3.57 11.7 3.72 11.94C4.44 13.15 5.59 12.81 6.05 12.6C6.12 12.08 6.33 11.73 6.56 11.53C4.78 11.33 2.92 10.64 2.92 7.58C2.92 6.71 3.23 5.99 3.74 5.43C3.66 5.23 3.38 4.41 3.82 3.31C3.82 3.31 4.49 3.1 6.02 4.13C6.66 3.95 7.34 3.86 8.02 3.86C8.7 3.86 9.38 3.95 10.02 4.13C11.55 3.09 12.22 3.31 12.22 3.31C12.66 4.41 12.38 5.23 12.3 5.43C12.81 5.99 13.12 6.7 13.12 7.58C13.12 10.65 11.25 11.33 9.47 11.53C9.76 11.78 10.01 12.26 10.01 13.01C10.01 14.08 10 14.94 10 15.21C10 15.42 10.15 15.67 10.55 15.59C13.71 14.53 16 11.53 16 8C16 3.58 12.42 0 8 0Z",
-    transform: "scale(64)",
-    fill: "currentColor"
-  }
-) });
-
-// src/client/theme/ui/Navbar/GithubStars.tsx
-import { jsx as jsx3, jsxs } from "react/jsx-runtime";
-function GithubStars({ repo }) {
-  const [stars, setStars] = useState(null);
-  useEffect(() => {
-    if (repo) {
-      getStarsRepo(repo).then((stars2) => setStars(stars2)).catch(() => setStars("0"));
-    }
-  }, [repo]);
-  return /* @__PURE__ */ jsxs(
-    "a",
-    {
-      href: `https://github.com/${repo}`,
-      target: "_blank",
-      rel: "noopener noreferrer",
-      className: "navbar-github-stars",
-      children: [
-        /* @__PURE__ */ jsx3(GitHub, {}),
-        stars && /* @__PURE__ */ jsx3("span", { children: stars })
-      ]
-    }
-  );
-}
+import React5 from "react";
+import { useLocation as useLocation7 } from "react-router-dom";
+import { ChevronLeft, ChevronRight as ChevronRight3 } from "lucide-react";
 
 // src/client/theme/ui/Sidebar/Sidebar.tsx
-import { useState as useState2 } from "react";
-import { useLocation } from "react-router-dom";
+import { useState as useState5 } from "react";
+import { useLocation as useLocation3 } from "react-router-dom";
 
 // src/client/theme/ui/PoweredBy/PoweredBy.tsx
 import { Zap } from "lucide-react";
-import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs4 } from "react/jsx-runtime";
 function PoweredBy() {
-  return /* @__PURE__ */ jsx4("div", { className: "powered-by-container", children: /* @__PURE__ */ jsxs2(
+  return /* @__PURE__ */ jsx9("div", { className: "powered-by-container", children: /* @__PURE__ */ jsxs4(
     "a",
     {
       href: "https://github.com/jesusalcaladev/boltdocs",
@@ -125,17 +407,18 @@ function PoweredBy() {
       rel: "noopener noreferrer",
       className: "powered-by-link",
       children: [
-        /* @__PURE__ */ jsx4(Zap, { className: "powered-by-icon", size: 12, fill: "currentColor" }),
-        /* @__PURE__ */ jsx4("span", { children: "Powered by" }),
-        /* @__PURE__ */ jsx4("span", { className: "powered-by-brand", children: "LiteDocs" })
+        /* @__PURE__ */ jsx9(Zap, { className: "powered-by-icon", size: 12, fill: "currentColor" }),
+        /* @__PURE__ */ jsx9("span", { children: "Powered by" }),
+        /* @__PURE__ */ jsx9("span", { className: "powered-by-brand", children: "LiteDocs" })
       ]
     }
   ) });
 }
 
 // src/client/theme/ui/Sidebar/Sidebar.tsx
-import { ChevronRight, PanelLeft } from "lucide-react";
-import { Fragment, jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
+import { ChevronRight } from "lucide-react";
+import * as LucideIcons from "lucide-react";
+import { jsx as jsx10, jsxs as jsxs5 } from "react/jsx-runtime";
 function renderBadge(badgeRaw) {
   if (!badgeRaw) return null;
   let text = "";
@@ -156,7 +439,6 @@ function renderBadge(badgeRaw) {
     }
   }
   if (!text) return null;
-  if (!text) return null;
   let typeClass = "badge-default";
   const lowerText = text.toLowerCase();
   if (lowerText === "new") {
@@ -166,18 +448,51 @@ function renderBadge(badgeRaw) {
   } else if (lowerText === "updated") {
     typeClass = "badge-updated";
   }
-  return /* @__PURE__ */ jsx5("span", { className: `sidebar-badge ${typeClass}`, children: text });
+  return /* @__PURE__ */ jsx10("span", { className: `sidebar-badge ${typeClass}`, children: text });
+}
+function renderIcon(iconName, size = 16) {
+  if (!iconName) return null;
+  const trimmed = iconName.trim();
+  if (trimmed.startsWith("<svg") || trimmed.includes("http")) {
+    if (trimmed.startsWith("<svg")) {
+      return /* @__PURE__ */ jsx10(
+        "span",
+        {
+          className: "sidebar-icon svg-icon",
+          dangerouslySetInnerHTML: { __html: trimmed }
+        }
+      );
+    }
+    return /* @__PURE__ */ jsx10(
+      "img",
+      {
+        src: trimmed,
+        className: "sidebar-icon",
+        style: { width: size, height: size },
+        alt: ""
+      }
+    );
+  }
+  const IconComponent = LucideIcons[iconName];
+  if (IconComponent) {
+    return /* @__PURE__ */ jsx10(IconComponent, { size, className: "sidebar-icon lucide-icon" });
+  }
+  return null;
 }
 function Sidebar({
   routes,
-  config,
-  isCollapsed,
-  onToggle
+  config
 }) {
-  const location = useLocation();
+  const location = useLocation3();
+  const currentRoute = routes.find((r) => r.path === location.pathname);
+  const activeTabId = currentRoute?.tab?.toLowerCase();
+  const filteredRoutes = activeTabId ? routes.filter((r) => {
+    if (!r.tab) return true;
+    return r.tab.toLowerCase() === activeTabId;
+  }) : routes;
   const ungrouped = [];
   const groupMap = /* @__PURE__ */ new Map();
-  for (const route of routes) {
+  for (const route of filteredRoutes) {
     if (!route.group) {
       ungrouped.push(route);
     } else {
@@ -185,49 +500,41 @@ function Sidebar({
         groupMap.set(route.group, {
           slug: route.group,
           title: route.groupTitle || route.group,
-          routes: []
-        });
-      }
-      groupMap.get(route.group).routes.push(route);
-    }
-  }
-  const groups = Array.from(groupMap.values());
-  return /* @__PURE__ */ jsxs3("aside", { className: "boltdocs-sidebar", children: [
-    onToggle && /* @__PURE__ */ jsx5("div", { className: "sidebar-collapse", children: /* @__PURE__ */ jsx5(
-      "button",
-      {
-        className: "sidebar-collapse-btn",
-        onClick: onToggle,
-        "aria-label": isCollapsed ? "Expand Sidebar" : "Collapse Sidebar",
-        title: isCollapsed ? "Expand Sidebar" : "Collapse Sidebar",
-        children: /* @__PURE__ */ jsx5(PanelLeft, { size: 18 })
-      }
-    ) }),
-    !isCollapsed && /* @__PURE__ */ jsxs3(Fragment, { children: [
-      /* @__PURE__ */ jsxs3("nav", { "aria-label": "Main Navigation", children: [
-        /* @__PURE__ */ jsx5("ul", { className: "sidebar-list", children: ungrouped.map((route) => /* @__PURE__ */ jsx5("li", { children: /* @__PURE__ */ jsx5(
-          Link,
-          {
-            to: route.path === "" ? "/" : route.path,
-            className: `sidebar-link ${location.pathname === route.path ? "active" : ""}`,
-            "aria-current": location.pathname === route.path ? "page" : void 0,
-            children: /* @__PURE__ */ jsxs3("div", { className: "sidebar-link-content", children: [
-              /* @__PURE__ */ jsx5("span", { children: route.title }),
-              renderBadge(route.badge)
-            ] })
-          }
-        ) }, route.path)) }),
-        groups.map((group) => /* @__PURE__ */ jsx5(
-          SidebarGroupSection,
-          {
-            group,
-            currentPath: location.pathname
-          },
-          group.slug
-        ))
-      ] }),
-      config.themeConfig?.poweredBy !== false && /* @__PURE__ */ jsx5(PoweredBy, {})
-    ] })
+          routes: [],
+          icon: route.groupIcon
+        });
+      }
+      groupMap.get(route.group).routes.push(route);
+    }
+  }
+  const groups = Array.from(groupMap.values());
+  return /* @__PURE__ */ jsxs5("aside", { className: "boltdocs-sidebar", children: [
+    /* @__PURE__ */ jsxs5("nav", { "aria-label": "Main Navigation", children: [
+      /* @__PURE__ */ jsx10("ul", { className: "sidebar-list", children: ungrouped.map((route) => /* @__PURE__ */ jsx10("li", { children: /* @__PURE__ */ jsx10(
+        Link,
+        {
+          to: route.path === "" ? "/" : route.path,
+          className: `sidebar-link ${location.pathname === route.path ? "active" : ""}`,
+          "aria-current": location.pathname === route.path ? "page" : void 0,
+          children: /* @__PURE__ */ jsxs5("div", { className: "sidebar-link-content", children: [
+            /* @__PURE__ */ jsxs5("div", { className: "sidebar-link-title-container", children: [
+              renderIcon(route.icon),
+              /* @__PURE__ */ jsx10("span", { children: route.title })
+            ] }),
+            renderBadge(route.badge)
+          ] })
+        }
+      ) }, route.path)) }),
+      groups.map((group) => /* @__PURE__ */ jsx10(
+        SidebarGroupSection,
+        {
+          group,
+          currentPath: location.pathname
+        },
+        group.slug
+      ))
+    ] }),
+    config.themeConfig?.poweredBy !== false && /* @__PURE__ */ jsx10(PoweredBy, {})
   ] });
 }
 function SidebarGroupSection({
@@ -235,9 +542,9 @@ function SidebarGroupSection({
   currentPath
 }) {
   const isActive = group.routes.some((r) => currentPath === r.path);
-  const [open, setOpen] = useState2(true);
-  return /* @__PURE__ */ jsxs3("div", { className: "sidebar-group", children: [
-    /* @__PURE__ */ jsxs3(
+  const [open, setOpen] = useState5(true);
+  return /* @__PURE__ */ jsxs5("div", { className: "sidebar-group", children: [
+    /* @__PURE__ */ jsxs5(
       "button",
       {
         className: `sidebar-group-header ${isActive ? "active" : ""}`,
@@ -245,19 +552,22 @@ function SidebarGroupSection({
         "aria-expanded": open,
         "aria-controls": `sidebar-group-${group.slug}`,
         children: [
-          /* @__PURE__ */ jsx5("span", { className: "sidebar-group-title", children: group.title }),
-          /* @__PURE__ */ jsx5("span", { className: `sidebar-group-chevron ${open ? "open" : ""}`, children: /* @__PURE__ */ jsx5(ChevronRight, { size: 16 }) })
+          /* @__PURE__ */ jsx10("div", { className: "sidebar-group-header-content", children: /* @__PURE__ */ jsx10("span", { className: "sidebar-group-title", children: group.title }) }),
+          /* @__PURE__ */ jsx10("span", { className: `sidebar-group-chevron ${open ? "open" : ""}`, children: /* @__PURE__ */ jsx10(ChevronRight, { size: 16 }) })
         ]
       }
     ),
-    open && /* @__PURE__ */ jsx5("ul", { className: "sidebar-group-list", id: `sidebar-group-${group.slug}`, children: group.routes.map((route) => /* @__PURE__ */ jsx5("li", { children: /* @__PURE__ */ jsx5(
+    open && /* @__PURE__ */ jsx10("ul", { className: "sidebar-group-list", id: `sidebar-group-${group.slug}`, children: group.routes.map((route) => /* @__PURE__ */ jsx10("li", { children: /* @__PURE__ */ jsx10(
       Link,
       {
         to: route.path === "" ? "/" : route.path,
         className: `sidebar-link sidebar-link-nested ${currentPath === route.path ? "active" : ""}`,
         "aria-current": currentPath === route.path ? "page" : void 0,
-        children: /* @__PURE__ */ jsxs3("div", { className: "sidebar-link-content", children: [
-          /* @__PURE__ */ jsx5("span", { children: route.title }),
+        children: /* @__PURE__ */ jsxs5("div", { className: "sidebar-link-content", children: [
+          /* @__PURE__ */ jsxs5("div", { className: "sidebar-link-title-container", children: [
+            renderIcon(route.icon),
+            /* @__PURE__ */ jsx10("span", { children: route.title })
+          ] }),
           renderBadge(route.badge)
         ] })
       }
@@ -266,22 +576,23 @@ function SidebarGroupSection({
 }
 
 // src/client/theme/ui/OnThisPage/OnThisPage.tsx
-import { useEffect as useEffect2, useState as useState3, useRef, useCallback as useCallback2 } from "react";
-import { useLocation as useLocation2 } from "react-router-dom";
+import { useEffect as useEffect5, useState as useState6, useRef as useRef3, useCallback as useCallback2 } from "react";
+import { useLocation as useLocation4 } from "react-router-dom";
 import { Pencil, CircleHelp } from "lucide-react";
-import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs6 } from "react/jsx-runtime";
 function OnThisPage({
   headings = [],
   editLink,
   communityHelp,
   filePath
 }) {
-  const [activeId, setActiveId] = useState3("");
-  const [indicatorStyle, setIndicatorStyle] = useState3({});
-  const observerRef = useRef(null);
-  const location = useLocation2();
-  const listRef = useRef(null);
-  useEffect2(() => {
+  const [activeId, setActiveId] = useState6(null);
+  const [indicatorStyle, setIndicatorStyle] = useState6({});
+  const observerRef = useRef3(null);
+  const location = useLocation4();
+  const listRef = useRef3(null);
+  const visibleIdsRef = useRef3(/* @__PURE__ */ new Set());
+  useEffect5(() => {
     if (headings.length > 0) {
       const hash = window.location.hash.substring(1);
       if (hash && headings.some((h) => h.id === hash)) {
@@ -291,38 +602,55 @@ function OnThisPage({
       }
     }
   }, [location.pathname, headings]);
-  useEffect2(() => {
+  useEffect5(() => {
     if (!activeId || !listRef.current) return;
-    const activeElement = listRef.current.querySelector(
+    const activeLink = listRef.current.querySelector(
       `a[href="#${activeId}"]`
     );
-    if (activeElement) {
-      const { offsetTop, offsetHeight } = activeElement;
+    if (activeLink) {
+      const top = activeLink.offsetTop;
+      const height = activeLink.offsetHeight;
       setIndicatorStyle({
-        transform: `translateY(${offsetTop}px)`,
-        height: `${offsetHeight}px`,
+        transform: `translateY(${top}px)`,
+        height: `${height}px`,
         opacity: 1
       });
     }
   }, [activeId, headings]);
-  useEffect2(() => {
+  useEffect5(() => {
     if (headings.length === 0) return;
+    visibleIdsRef.current.clear();
     if (observerRef.current) {
       observerRef.current.disconnect();
     }
     const callback = (entries) => {
-      const visibleEntries = entries.filter((entry) => entry.isIntersecting);
-      if (visibleEntries.length > 0) {
-        const closest = visibleEntries.reduce((prev, curr) => {
-          return Math.abs(curr.boundingClientRect.top - 100) < Math.abs(prev.boundingClientRect.top - 100) ? curr : prev;
-        });
-        setActiveId(closest.target.id);
+      entries.forEach((entry) => {
+        if (entry.isIntersecting) {
+          visibleIdsRef.current.add(entry.target.id);
+        } else {
+          visibleIdsRef.current.delete(entry.target.id);
+        }
+      });
+      const firstVisible = headings.find((h) => visibleIdsRef.current.has(h.id));
+      if (firstVisible) {
+        setActiveId(firstVisible.id);
+      } else {
+        const firstEl = document.getElementById(headings[0].id);
+        if (firstEl) {
+          const rect = firstEl.getBoundingClientRect();
+          if (rect.top > 200) {
+            setActiveId(headings[0].id);
+            return;
+          }
+        }
       }
     };
-    observerRef.current = new IntersectionObserver(callback, {
-      rootMargin: "-100px 0px -70% 0px",
+    const observerOptions = {
+      root: document.querySelector(".boltdocs-content"),
+      rootMargin: "-20% 0px -70% 0px",
       threshold: [0, 1]
-    });
+    };
+    observerRef.current = new IntersectionObserver(callback, observerOptions);
     const observeHeadings = () => {
       headings.forEach(({ id }) => {
         const el = document.getElementById(id);
@@ -347,22 +675,20 @@ function OnThisPage({
       window.removeEventListener("scroll", handleScroll);
     };
   }, [headings, location.pathname]);
-  useEffect2(() => {
+  useEffect5(() => {
     if (!activeId || !listRef.current) return;
     const activeLink = listRef.current.querySelector(
       `a[href="#${activeId}"]`
     );
     if (activeLink) {
-      const container = listRef.current.closest(
-        ".boltdocs-on-this-page"
-      );
+      const container = listRef.current.parentElement;
       if (!container) return;
       const linkRect = activeLink.getBoundingClientRect();
       const containerRect = container.getBoundingClientRect();
       const isVisible = linkRect.top >= containerRect.top && linkRect.bottom <= containerRect.bottom;
       if (!isVisible) {
         activeLink.scrollIntoView({
-          behavior: "smooth",
+          behavior: "auto",
           block: "nearest"
         });
       }
@@ -389,11 +715,11 @@ function OnThisPage({
     []
   );
   if (headings.length === 0) return null;
-  return /* @__PURE__ */ jsxs4("nav", { className: "boltdocs-on-this-page", "aria-label": "Table of contents", children: [
-    /* @__PURE__ */ jsx6("p", { className: "on-this-page-title", children: "On this page" }),
-    /* @__PURE__ */ jsxs4("div", { className: "on-this-page-container", children: [
-      /* @__PURE__ */ jsx6("div", { className: "toc-indicator", style: indicatorStyle }),
-      /* @__PURE__ */ jsx6("ul", { className: "on-this-page-list", ref: listRef, children: headings.map((h) => /* @__PURE__ */ jsx6("li", { className: h.level === 3 ? "toc-indent" : "", children: /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsxs6("nav", { className: "boltdocs-on-this-page", "aria-label": "Table of contents", children: [
+    /* @__PURE__ */ jsx11("p", { className: "on-this-page-title", children: "On this page" }),
+    /* @__PURE__ */ jsx11("div", { className: "on-this-page-container", children: /* @__PURE__ */ jsxs6("div", { className: "on-this-page-list-container", children: [
+      /* @__PURE__ */ jsx11("div", { className: "toc-indicator", style: indicatorStyle }),
+      /* @__PURE__ */ jsx11("ul", { className: "on-this-page-list", ref: listRef, children: headings.map((h) => /* @__PURE__ */ jsx11("li", { className: h.level === 3 ? "toc-indent" : "", children: /* @__PURE__ */ jsx11(
         "a",
         {
           href: `#${h.id}`,
@@ -403,11 +729,11 @@ function OnThisPage({
           children: h.text
         }
       ) }, h.id)) })
-    ] }),
-    (editLink || communityHelp) && /* @__PURE__ */ jsxs4("div", { className: "toc-help", children: [
-      /* @__PURE__ */ jsx6("p", { className: "toc-help-title", children: "Need help?" }),
-      /* @__PURE__ */ jsxs4("ul", { className: "toc-help-links", children: [
-        editLink && filePath && /* @__PURE__ */ jsx6("li", { children: /* @__PURE__ */ jsxs4(
+    ] }) }),
+    (editLink || communityHelp) && /* @__PURE__ */ jsxs6("div", { className: "toc-help", children: [
+      /* @__PURE__ */ jsx11("p", { className: "toc-help-title", children: "Need help?" }),
+      /* @__PURE__ */ jsxs6("ul", { className: "toc-help-links", children: [
+        editLink && filePath && /* @__PURE__ */ jsx11("li", { children: /* @__PURE__ */ jsxs6(
           "a",
           {
             href: editLink.replace(":path", filePath),
@@ -415,12 +741,12 @@ function OnThisPage({
             rel: "noopener noreferrer",
             className: "toc-help-link",
             children: [
-              /* @__PURE__ */ jsx6(Pencil, { size: 16 }),
+              /* @__PURE__ */ jsx11(Pencil, { size: 16 }),
               "Edit this page"
             ]
           }
         ) }),
-        communityHelp && /* @__PURE__ */ jsx6("li", { children: /* @__PURE__ */ jsxs4(
+        communityHelp && /* @__PURE__ */ jsx11("li", { children: /* @__PURE__ */ jsxs6(
           "a",
           {
             href: communityHelp,
@@ -428,7 +754,7 @@ function OnThisPage({
             rel: "noopener noreferrer",
             className: "toc-help-link",
             children: [
-              /* @__PURE__ */ jsx6(CircleHelp, { size: 16 }),
+              /* @__PURE__ */ jsx11(CircleHelp, { size: 16 }),
               "Community help"
             ]
           }
@@ -439,11 +765,11 @@ function OnThisPage({
 }
 
 // src/client/theme/ui/Head/Head.tsx
-import { useEffect as useEffect3 } from "react";
-import { useLocation as useLocation3 } from "react-router-dom";
+import { useEffect as useEffect6 } from "react";
+import { useLocation as useLocation5 } from "react-router-dom";
 function Head({ siteTitle, siteDescription, routes }) {
-  const location = useLocation3();
-  useEffect3(() => {
+  const location = useLocation5();
+  useEffect6(() => {
     const currentRoute = routes.find((r) => r.path === location.pathname);
     const pageTitle = currentRoute?.title;
     const pageDescription = currentRoute?.description || siteDescription || "";
@@ -489,25 +815,25 @@ function setMetaTag(attr, key, content) {
 }
 
 // src/client/theme/ui/Breadcrumbs/Breadcrumbs.tsx
-import { useLocation as useLocation4 } from "react-router-dom";
+import { useLocation as useLocation6 } from "react-router-dom";
 import { Home, ChevronRight as ChevronRight2 } from "lucide-react";
-import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
 function Breadcrumbs({ routes, config }) {
-  const location = useLocation4();
+  const location = useLocation6();
   if (config.themeConfig?.breadcrumbs === false) return null;
   if (location.pathname === "/") return null;
   const currentRoute = routes.find((r) => r.path === location.pathname);
   const groupRoute = currentRoute?.group ? routes.find((r) => r.group === currentRoute.group) : null;
-  return /* @__PURE__ */ jsx7("nav", { className: "boltdocs-breadcrumbs", "aria-label": "Breadcrumb", children: /* @__PURE__ */ jsxs5("ol", { className: "boltdocs-breadcrumbs-list", children: [
-    /* @__PURE__ */ jsxs5("li", { className: "boltdocs-breadcrumbs-item", children: [
-      /* @__PURE__ */ jsx7(Link, { to: "/", className: "boltdocs-breadcrumbs-link", children: /* @__PURE__ */ jsx7(Home, { size: 14 }) }),
-      /* @__PURE__ */ jsx7("span", { className: "boltdocs-breadcrumbs-separator", children: /* @__PURE__ */ jsx7(ChevronRight2, { size: 14 }) })
+  return /* @__PURE__ */ jsx12("nav", { className: "boltdocs-breadcrumbs", "aria-label": "Breadcrumb", children: /* @__PURE__ */ jsxs7("ol", { className: "boltdocs-breadcrumbs-list", children: [
+    /* @__PURE__ */ jsxs7("li", { className: "boltdocs-breadcrumbs-item", children: [
+      /* @__PURE__ */ jsx12(Link, { to: "/", className: "boltdocs-breadcrumbs-link", children: /* @__PURE__ */ jsx12(Home, { size: 14 }) }),
+      /* @__PURE__ */ jsx12("span", { className: "boltdocs-breadcrumbs-separator", children: /* @__PURE__ */ jsx12(ChevronRight2, { size: 14 }) })
     ] }),
-    currentRoute?.groupTitle && /* @__PURE__ */ jsxs5("li", { className: "boltdocs-breadcrumbs-item", children: [
-      groupRoute ? /* @__PURE__ */ jsx7(Link, { to: groupRoute.path, className: "boltdocs-breadcrumbs-link", children: currentRoute.groupTitle }) : /* @__PURE__ */ jsx7("span", { className: "boltdocs-breadcrumbs-text", children: currentRoute.groupTitle }),
-      /* @__PURE__ */ jsx7("span", { className: "boltdocs-breadcrumbs-separator", children: /* @__PURE__ */ jsx7(ChevronRight2, { size: 14 }) })
+    currentRoute?.groupTitle && /* @__PURE__ */ jsxs7("li", { className: "boltdocs-breadcrumbs-item", children: [
+      groupRoute ? /* @__PURE__ */ jsx12(Link, { to: groupRoute.path, className: "boltdocs-breadcrumbs-link", children: currentRoute.groupTitle }) : /* @__PURE__ */ jsx12("span", { className: "boltdocs-breadcrumbs-text", children: currentRoute.groupTitle }),
+      /* @__PURE__ */ jsx12("span", { className: "boltdocs-breadcrumbs-separator", children: /* @__PURE__ */ jsx12(ChevronRight2, { size: 14 }) })
     ] }),
-    currentRoute?.title && /* @__PURE__ */ jsx7("li", { className: "boltdocs-breadcrumbs-item", children: /* @__PURE__ */ jsx7(
+    currentRoute?.title && /* @__PURE__ */ jsx12("li", { className: "boltdocs-breadcrumbs-item", children: /* @__PURE__ */ jsx12(
       "span",
       {
         className: "boltdocs-breadcrumbs-text boltdocs-breadcrumbs-active",
@@ -519,16 +845,16 @@ function Breadcrumbs({ routes, config }) {
 }
 
 // src/client/theme/ui/BackgroundGradient/BackgroundGradient.tsx
-import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
 function BackgroundGradient() {
-  return /* @__PURE__ */ jsxs6("div", { className: "boltdocs-background-glow", children: [
-    /* @__PURE__ */ jsx8("div", { className: "glow-shape glow-1" }),
-    /* @__PURE__ */ jsx8("div", { className: "glow-shape glow-2" })
+  return /* @__PURE__ */ jsxs8("div", { className: "boltdocs-background-glow", children: [
+    /* @__PURE__ */ jsx13("div", { className: "glow-shape glow-1" }),
+    /* @__PURE__ */ jsx13("div", { className: "glow-shape glow-2" })
   ] });
 }
 
 // src/client/theme/ui/Layout/Layout.tsx
-import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
 function ThemeLayout({
   config,
   routes,
@@ -542,10 +868,9 @@ function ThemeLayout({
   className = "",
   style
 }) {
-  const [isSidebarOpen, setIsSidebarOpen] = useState4(true);
   const siteTitle = config.themeConfig?.title || "Boltdocs";
   const siteDescription = config.themeConfig?.description || "";
-  const location = useLocation5();
+  const location = useLocation7();
   const currentIndex = routes.findIndex((r) => r.path === location.pathname);
   const currentRoute = routes[currentIndex];
   const currentLocale = config.i18n ? currentRoute?.locale || config.i18n.defaultLocale : void 0;
@@ -561,13 +886,13 @@ function ThemeLayout({
   const prevPage = localIndex > 0 ? filteredRoutes[localIndex - 1] : null;
   const nextPage = localIndex >= 0 && localIndex < filteredRoutes.length - 1 ? filteredRoutes[localIndex + 1] : null;
   const { preload } = usePreload();
-  React4.useEffect(() => {
+  React5.useEffect(() => {
     if (prevPage?.path) preload(prevPage.path);
     if (nextPage?.path) preload(nextPage.path);
   }, [prevPage, nextPage, preload]);
-  return /* @__PURE__ */ jsxs7("div", { className: `boltdocs-layout ${className}`, style, children: [
-    background !== void 0 ? background : /* @__PURE__ */ jsx9(BackgroundGradient, {}),
-    head !== void 0 ? head : /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsxs9("div", { className: `boltdocs-layout ${className}`, style, children: [
+    background !== void 0 ? background : /* @__PURE__ */ jsx14(BackgroundGradient, {}),
+    head !== void 0 ? head : /* @__PURE__ */ jsx14(
       Head,
       {
         siteTitle,
@@ -575,7 +900,7 @@ function ThemeLayout({
         routes
       }
     ),
-    navbar !== void 0 ? navbar : /* @__PURE__ */ jsx9(
+    navbar !== void 0 ? navbar : /* @__PURE__ */ jsx14(
       Navbar,
       {
         config,
@@ -585,90 +910,76 @@ function ThemeLayout({
         currentVersion
       }
     ),
-    /* @__PURE__ */ jsxs7(
-      "div",
-      {
-        className: `boltdocs-main-container ${!isSidebarOpen ? "sidebar-collapsed" : ""}`,
-        children: [
-          sidebar !== void 0 ? sidebar : /* @__PURE__ */ jsx9(
-            Sidebar,
+    /* @__PURE__ */ jsxs9("div", { className: "boltdocs-main-container", children: [
+      sidebar !== void 0 ? sidebar : /* @__PURE__ */ jsx14(Sidebar, { routes: filteredRoutes, config }),
+      /* @__PURE__ */ jsxs9("main", { className: "boltdocs-content", children: [
+        breadcrumbs !== void 0 ? breadcrumbs : /* @__PURE__ */ jsx14(Breadcrumbs, { routes: filteredRoutes, config }),
+        /* @__PURE__ */ jsx14("div", { className: "boltdocs-page", children }),
+        (prevPage || nextPage) && /* @__PURE__ */ jsxs9("nav", { className: "page-nav", "aria-label": "Pagination", children: [
+          prevPage ? /* @__PURE__ */ jsxs9(
+            Link,
             {
-              routes: filteredRoutes,
-              config,
-              isCollapsed: !isSidebarOpen,
-              onToggle: () => setIsSidebarOpen(!isSidebarOpen)
+              to: prevPage.path || "/",
+              className: "page-nav-link page-nav-link--prev",
+              children: [
+                /* @__PURE__ */ jsxs9("div", { className: "page-nav-info", children: [
+                  /* @__PURE__ */ jsx14("span", { className: "page-nav-label", children: "Previous" }),
+                  /* @__PURE__ */ jsx14("span", { className: "page-nav-title", children: prevPage.title })
+                ] }),
+                /* @__PURE__ */ jsx14(ChevronLeft, { className: "page-nav-arrow", size: 16 })
+              ]
             }
-          ),
-          /* @__PURE__ */ jsxs7("main", { className: "boltdocs-content", children: [
-            breadcrumbs !== void 0 ? breadcrumbs : /* @__PURE__ */ jsx9(Breadcrumbs, { routes: filteredRoutes, config }),
-            /* @__PURE__ */ jsx9("div", { className: "boltdocs-page", children }),
-            (prevPage || nextPage) && /* @__PURE__ */ jsxs7("nav", { className: "page-nav", "aria-label": "Pagination", children: [
-              prevPage ? /* @__PURE__ */ jsxs7(
-                Link,
-                {
-                  to: prevPage.path || "/",
-                  className: "page-nav-link page-nav-link--prev",
-                  children: [
-                    /* @__PURE__ */ jsxs7("div", { className: "page-nav-info", children: [
-                      /* @__PURE__ */ jsx9("span", { className: "page-nav-label", children: "Previous" }),
-                      /* @__PURE__ */ jsx9("span", { className: "page-nav-title", children: prevPage.title })
-                    ] }),
-                    /* @__PURE__ */ jsx9(ChevronLeft2, { className: "page-nav-arrow", size: 16 })
-                  ]
-                }
-              ) : /* @__PURE__ */ jsx9("span", {}),
-              nextPage ? /* @__PURE__ */ jsxs7(
-                Link,
-                {
-                  to: nextPage.path || "/",
-                  className: "page-nav-link page-nav-link--next",
-                  children: [
-                    /* @__PURE__ */ jsxs7("div", { className: "page-nav-info", children: [
-                      /* @__PURE__ */ jsx9("span", { className: "page-nav-label", children: "Next" }),
-                      /* @__PURE__ */ jsx9("span", { className: "page-nav-title", children: nextPage.title })
-                    ] }),
-                    /* @__PURE__ */ jsx9(ChevronRight3, { className: "page-nav-arrow", size: 16 })
-                  ]
-                }
-              ) : /* @__PURE__ */ jsx9("span", {})
-            ] })
-          ] }),
-          toc !== void 0 ? toc : /* @__PURE__ */ jsx9(
-            OnThisPage,
+          ) : /* @__PURE__ */ jsx14("span", {}),
+          nextPage ? /* @__PURE__ */ jsxs9(
+            Link,
             {
-              headings: routes[currentIndex]?.headings,
-              editLink: config.themeConfig?.editLink,
-              communityHelp: config.themeConfig?.communityHelp,
-              filePath: routes[currentIndex]?.filePath
+              to: nextPage.path || "/",
+              className: "page-nav-link page-nav-link--next",
+              children: [
+                /* @__PURE__ */ jsxs9("div", { className: "page-nav-info", children: [
+                  /* @__PURE__ */ jsx14("span", { className: "page-nav-label", children: "Next" }),
+                  /* @__PURE__ */ jsx14("span", { className: "page-nav-title", children: nextPage.title })
+                ] }),
+                /* @__PURE__ */ jsx14(ChevronRight3, { className: "page-nav-arrow", size: 16 })
+              ]
             }
-          )
-        ]
-      }
-    )
+          ) : /* @__PURE__ */ jsx14("span", {})
+        ] })
+      ] }),
+      toc !== void 0 ? toc : /* @__PURE__ */ jsx14(
+        OnThisPage,
+        {
+          headings: routes[currentIndex]?.headings,
+          editLink: config.themeConfig?.editLink,
+          communityHelp: config.themeConfig?.communityHelp,
+          filePath: routes[currentIndex]?.filePath
+        }
+      )
+    ] })
   ] });
 }
 
 // src/client/theme/ui/NotFound/NotFound.tsx
 import { ArrowLeft } from "lucide-react";
-import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
 function NotFound() {
-  return /* @__PURE__ */ jsx10("div", { className: "boltdocs-not-found", children: /* @__PURE__ */ jsxs8("div", { className: "not-found-content", children: [
-    /* @__PURE__ */ jsx10("span", { className: "not-found-code", children: "404" }),
-    /* @__PURE__ */ jsx10("h1", { className: "not-found-title", children: "Page Not Found" }),
-    /* @__PURE__ */ jsx10("p", { className: "not-found-text", children: "The page you're looking for doesn't exist or has been moved." }),
-    /* @__PURE__ */ jsxs8(Link, { to: "/", className: "not-found-link", children: [
-      /* @__PURE__ */ jsx10(ArrowLeft, { size: 16 }),
+  return /* @__PURE__ */ jsx15("div", { className: "boltdocs-not-found", children: /* @__PURE__ */ jsxs10("div", { className: "not-found-content", children: [
+    /* @__PURE__ */ jsx15("span", { className: "not-found-code", children: "404" }),
+    /* @__PURE__ */ jsx15("h1", { className: "not-found-title", children: "Page Not Found" }),
+    /* @__PURE__ */ jsx15("p", { className: "not-found-text", children: "The page you're looking for doesn't exist or has been moved." }),
+    /* @__PURE__ */ jsxs10(Link, { to: "/", className: "not-found-link", children: [
+      /* @__PURE__ */ jsx15(ArrowLeft, { size: 16 }),
       " Go to Home"
     ] })
   ] }) });
 }
 
 // src/client/theme/ui/Loading/Loading.tsx
-import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
 function Loading() {
-  return /* @__PURE__ */ jsxs9("div", { className: "boltdocs-loading", children: [
-    /* @__PURE__ */ jsx11("div", { className: "loading-spinner" }),
-    /* @__PURE__ */ jsx11("p", { className: "loading-text", children: "Loading..." })
+  return /* @__PURE__ */ jsxs11("div", { className: "boltdocs-loading", children: [
+    /* @__PURE__ */ jsx16("div", { className: "loading-spinner" }),
+    /* @__PURE__ */ jsx16("p", { className: "loading-text", children: "Loading..." })
   ] });
 }
 
@@ -684,34 +995,34 @@ import {
 import { Link as LucideLink } from "lucide-react";
 
 // src/client/theme/components/CodeBlock/CodeBlock.tsx
-import { useState as useState5, useRef as useRef2, useCallback as useCallback3 } from "react";
+import { useState as useState8, useRef as useRef4, useCallback as useCallback3 } from "react";
 import { Copy, Check } from "lucide-react";
-import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
 function CodeBlock({ children, ...props }) {
-  const [copied, setCopied] = useState5(false);
-  const preRef = useRef2(null);
+  const [copied, setCopied] = useState8(false);
+  const preRef = useRef4(null);
   const handleCopy = useCallback3(async () => {
     const code = preRef.current?.textContent || "";
     copyToClipboard(code);
     setCopied(true);
     setTimeout(() => setCopied(false), 2e3);
   }, []);
-  return /* @__PURE__ */ jsxs10("div", { className: "code-block-wrapper", children: [
-    /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsxs12("div", { className: "code-block-wrapper", children: [
+    /* @__PURE__ */ jsx17(
       "button",
       {
         className: `code-block-copy ${copied ? "copied" : ""}`,
         onClick: handleCopy,
         "aria-label": "Copy code",
-        children: copied ? /* @__PURE__ */ jsx12(Check, { size: 16 }) : /* @__PURE__ */ jsx12(Copy, { size: 16 })
+        children: copied ? /* @__PURE__ */ jsx17(Check, { size: 16 }) : /* @__PURE__ */ jsx17(Copy, { size: 16 })
       }
     ),
-    /* @__PURE__ */ jsx12("pre", { ref: preRef, ...props, children })
+    /* @__PURE__ */ jsx17("pre", { ref: preRef, ...props, children })
   ] });
 }
 
 // src/client/app/index.tsx
-import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
 var ConfigContext = createContext2(null);
 function useConfig() {
   return useContext2(ConfigContext);
@@ -730,71 +1041,72 @@ var Heading = ({
   children
 }) => {
   const Tag = `h${level}`;
-  return /* @__PURE__ */ jsxs11(Tag, { id, className: "boltdocs-heading", children: [
+  return /* @__PURE__ */ jsxs13(Tag, { id, className: "boltdocs-heading", children: [
     children,
-    id && /* @__PURE__ */ jsx13("a", { href: `#${id}`, className: "header-anchor", "aria-label": "Anchor", children: /* @__PURE__ */ jsx13(LucideLink, { size: 16 }) })
+    id && /* @__PURE__ */ jsx18("a", { href: `#${id}`, className: "header-anchor", "aria-label": "Anchor", children: /* @__PURE__ */ jsx18(LucideLink, { size: 16 }) })
   ] });
 };
 var mdxComponents = {
-  h1: (props) => /* @__PURE__ */ jsx13(Heading, { level: 1, ...props }),
-  h2: (props) => /* @__PURE__ */ jsx13(Heading, { level: 2, ...props }),
-  h3: (props) => /* @__PURE__ */ jsx13(Heading, { level: 3, ...props }),
-  h4: (props) => /* @__PURE__ */ jsx13(Heading, { level: 4, ...props }),
-  h5: (props) => /* @__PURE__ */ jsx13(Heading, { level: 5, ...props }),
-  h6: (props) => /* @__PURE__ */ jsx13(Heading, { level: 6, ...props }),
-  pre: (props) => /* @__PURE__ */ jsx13(CodeBlock, { ...props, children: props.children }),
-  video: (props) => /* @__PURE__ */ jsx13(Suspense, { fallback: /* @__PURE__ */ jsx13("div", { className: "video-skeleton" }), children: /* @__PURE__ */ jsx13(Video, { ...props }) }),
-  PackageManagerTabs: (props) => /* @__PURE__ */ jsx13(Suspense, { fallback: /* @__PURE__ */ jsx13("div", { className: "pkg-tabs-skeleton" }), children: /* @__PURE__ */ jsx13(PackageManagerTabs, { ...props }) })
+  h1: (props) => /* @__PURE__ */ jsx18(Heading, { level: 1, ...props }),
+  h2: (props) => /* @__PURE__ */ jsx18(Heading, { level: 2, ...props }),
+  h3: (props) => /* @__PURE__ */ jsx18(Heading, { level: 3, ...props }),
+  h4: (props) => /* @__PURE__ */ jsx18(Heading, { level: 4, ...props }),
+  h5: (props) => /* @__PURE__ */ jsx18(Heading, { level: 5, ...props }),
+  h6: (props) => /* @__PURE__ */ jsx18(Heading, { level: 6, ...props }),
+  pre: (props) => /* @__PURE__ */ jsx18(CodeBlock, { ...props, children: props.children }),
+  video: (props) => /* @__PURE__ */ jsx18(Suspense, { fallback: /* @__PURE__ */ jsx18("div", { className: "video-skeleton" }), children: /* @__PURE__ */ jsx18(Video, { ...props }) }),
+  PackageManagerTabs: (props) => /* @__PURE__ */ jsx18(Suspense, { fallback: /* @__PURE__ */ jsx18("div", { className: "pkg-tabs-skeleton" }), children: /* @__PURE__ */ jsx18(PackageManagerTabs, { ...props }) })
 };
 function AppShell({
   initialRoutes,
   initialConfig,
+  docsDirName,
   modules,
   hot,
   homePage: HomePage,
   components: customComponents = {}
 }) {
-  const [routesInfo, setRoutesInfo] = useState6(initialRoutes);
-  const [config] = useState6(initialConfig);
+  const [routesInfo, setRoutesInfo] = useState9(initialRoutes);
+  const [config] = useState9(initialConfig);
   const resolveRoutes = (infos) => {
     return infos.filter(
       (route) => !(HomePage && (route.path === "/" || route.path === ""))
     ).map((route) => {
       const loaderKey = Object.keys(modules).find(
-        (k) => k.endsWith("/" + route.filePath)
+        (k) => k === `/${docsDirName}/${route.filePath}`
       );
       const loader = loaderKey ? modules[loaderKey] : null;
       return {
         ...route,
-        Component: React6.lazy(() => {
+        Component: React7.lazy(() => {
           if (!loader)
-            return Promise.resolve({ default: () => /* @__PURE__ */ jsx13(NotFound, {}) });
+            return Promise.resolve({ default: () => /* @__PURE__ */ jsx18(NotFound, {}) });
           return loader();
         })
       };
     });
   };
-  const [resolvedRoutes, setResolvedRoutes] = useState6(
+  const [resolvedRoutes, setResolvedRoutes] = useState9(
     () => resolveRoutes(initialRoutes)
   );
-  useEffect4(() => {
+  useEffect7(() => {
     if (hot) {
       hot.on("boltdocs:routes-update", (newRoutes) => {
         setRoutesInfo(newRoutes);
       });
     }
   }, [hot]);
-  useEffect4(() => {
+  useEffect7(() => {
     setResolvedRoutes(resolveRoutes(routesInfo));
-  }, [routesInfo, modules]);
-  return /* @__PURE__ */ jsx13(ConfigContext.Provider, { value: config, children: /* @__PURE__ */ jsxs11(PreloadProvider, { routes: routesInfo, modules, children: [
-    /* @__PURE__ */ jsx13(ScrollHandler, {}),
-    /* @__PURE__ */ jsxs11(Routes, { children: [
-      HomePage && /* @__PURE__ */ jsx13(
+  }, [routesInfo, modules, docsDirName]);
+  return /* @__PURE__ */ jsx18(ConfigContext.Provider, { value: config, children: /* @__PURE__ */ jsxs13(PreloadProvider, { routes: routesInfo, modules, children: [
+    /* @__PURE__ */ jsx18(ScrollHandler, {}),
+    /* @__PURE__ */ jsxs13(Routes, { children: [
+      HomePage && /* @__PURE__ */ jsx18(
         Route,
         {
           path: "/",
-          element: /* @__PURE__ */ jsx13(
+          element: /* @__PURE__ */ jsx18(
             ThemeLayout,
             {
               config,
@@ -803,20 +1115,20 @@ function AppShell({
               toc: null,
               breadcrumbs: null,
               ...config.themeConfig?.layoutProps,
-              children: /* @__PURE__ */ jsx13(HomePage, {})
+              children: /* @__PURE__ */ jsx18(HomePage, {})
             }
           )
         }
       ),
-      /* @__PURE__ */ jsx13(
+      /* @__PURE__ */ jsx18(
         Route,
         {
-          element: /* @__PURE__ */ jsx13(DocsLayout, { config, routes: routesInfo }),
-          children: resolvedRoutes.map((route) => /* @__PURE__ */ jsx13(
+          element: /* @__PURE__ */ jsx18(DocsLayout, { config, routes: routesInfo }),
+          children: resolvedRoutes.map((route) => /* @__PURE__ */ jsx18(
             Route,
             {
               path: route.path === "" ? "/" : route.path,
-              element: /* @__PURE__ */ jsx13(React6.Suspense, { fallback: /* @__PURE__ */ jsx13(Loading, {}), children: /* @__PURE__ */ jsx13(
+              element: /* @__PURE__ */ jsx18(React7.Suspense, { fallback: /* @__PURE__ */ jsx18(Loading, {}), children: /* @__PURE__ */ jsx18(
                 MdxPage,
                 {
                   Component: route.Component,
@@ -829,17 +1141,17 @@ function AppShell({
         },
         "docs-layout"
       ),
-      /* @__PURE__ */ jsx13(
+      /* @__PURE__ */ jsx18(
         Route,
         {
           path: "*",
-          element: /* @__PURE__ */ jsx13(
+          element: /* @__PURE__ */ jsx18(
             ThemeLayout,
             {
               config,
               routes: routesInfo,
               ...config.themeConfig?.layoutProps,
-              children: /* @__PURE__ */ jsx13(NotFound, {})
+              children: /* @__PURE__ */ jsx18(NotFound, {})
             }
           )
         }
@@ -848,7 +1160,7 @@ function AppShell({
   ] }) });
 }
 function ScrollHandler() {
-  const { pathname, hash } = useLocation6();
+  const { pathname, hash } = useLocation8();
   useLayoutEffect(() => {
     if (hash) {
       const id = hash.replace("#", "");
@@ -874,13 +1186,13 @@ function DocsLayout({
   config,
   routes
 }) {
-  return /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx18(
     ThemeLayout,
     {
       config,
       routes,
       ...config.themeConfig?.layoutProps,
-      children: /* @__PURE__ */ jsx13(Outlet, {})
+      children: /* @__PURE__ */ jsx18(Outlet, {})
     }
   );
 }
@@ -889,21 +1201,22 @@ function MdxPage({
   customComponents = {}
 }) {
   const allComponents = { ...mdxComponents, ...customComponents };
-  return /* @__PURE__ */ jsx13(MDXProvider, { components: allComponents, children: /* @__PURE__ */ jsx13(Component, {}) });
+  return /* @__PURE__ */ jsx18(MDXProvider, { components: allComponents, children: /* @__PURE__ */ jsx18(Component, {}) });
 }
 function createBoltdocsApp(options) {
-  const { target, routes, config, modules, hot, homePage } = options;
+  const { target, routes, docsDirName, config, modules, hot, homePage } = options;
   const container = document.querySelector(target);
   if (!container) {
     throw new Error(
       `[boltdocs] Mount target "${target}" not found in document.`
     );
   }
-  const app = /* @__PURE__ */ jsx13(React6.StrictMode, { children: /* @__PURE__ */ jsx13(BrowserRouter, { children: /* @__PURE__ */ jsx13(
+  const app = /* @__PURE__ */ jsx18(React7.StrictMode, { children: /* @__PURE__ */ jsx18(BrowserRouter, { children: /* @__PURE__ */ jsx18(
     AppShell,
     {
       initialRoutes: routes,
       initialConfig: config,
+      docsDirName,
       modules,
       hot,
       homePage,
@@ -915,9 +1228,9 @@ function createBoltdocsApp(options) {
 }
 
 // src/client/theme/ui/Link/LinkPreview.tsx
-import { useEffect as useEffect5, useState as useState7, useRef as useRef3 } from "react";
+import { useEffect as useEffect8, useState as useState10, useRef as useRef5 } from "react";
 import { createPortal } from "react-dom";
-import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx19, jsxs as jsxs14 } from "react/jsx-runtime";
 function LinkPreview({
   isVisible,
   title,
@@ -925,30 +1238,25 @@ function LinkPreview({
   x,
   y
 }) {
-  const [mounted, setMounted] = useState7(false);
-  const ref = useRef3(null);
-  const [position, setPosition] = useState7({ top: 0, left: 0 });
-  useEffect5(() => {
-    setMounted(true);
-  }, []);
-  useEffect5(() => {
-    if (isVisible && ref.current) {
+  const ref = useRef5(null);
+  const [position, setPosition] = useState10({ top: 0, left: 0 });
+  useEffect8(() => {
+    if (ref.current) {
       const rect = ref.current.getBoundingClientRect();
-      const padding = 15;
+      const padding = 12;
       let top = y + padding;
       let left = x + padding;
-      if (left + rect.width > window.innerWidth) {
+      if (left + rect.width > window.innerWidth - 20) {
         left = x - rect.width - padding;
       }
-      if (top + rect.height > window.innerHeight) {
+      if (top + rect.height > window.innerHeight - 20) {
         top = y - rect.height - padding;
       }
       setPosition({ top, left });
     }
-  }, [isVisible, x, y]);
-  if (!mounted) return null;
+  }, [x, y, isVisible]);
   return createPortal(
-    /* @__PURE__ */ jsxs12(
+    /* @__PURE__ */ jsx19(
       "div",
       {
         ref,
@@ -957,10 +1265,10 @@ function LinkPreview({
           top: position.top,
           left: position.left
         },
-        children: [
-          /* @__PURE__ */ jsx14("span", { className: "boltdocs-link-preview-title", children: title }),
-          summary && /* @__PURE__ */ jsx14("p", { className: "boltdocs-link-preview-summary", children: summary })
-        ]
+        children: /* @__PURE__ */ jsxs14("div", { className: "boltdocs-link-preview-content", children: [
+          /* @__PURE__ */ jsx19("span", { className: "boltdocs-link-preview-title", children: title }),
+          summary && /* @__PURE__ */ jsx19("p", { className: "boltdocs-link-preview-summary", children: summary })
+        ] })
       }
     ),
     document.body
@@ -968,9 +1276,9 @@ function LinkPreview({
 }
 
 // src/client/theme/ui/Link/Link.tsx
-import { Fragment as Fragment2, jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx20, jsxs as jsxs15 } from "react/jsx-runtime";
 function useLocalizedTo(to) {
-  const location = useLocation7();
+  const location = useLocation9();
   const config = useConfig();
   if (!config || typeof to !== "string") return to;
   if (!config.i18n && !config.versions) return to;
@@ -1024,7 +1332,7 @@ function useLocalizedTo(to) {
   }
   return finalPath === basePath ? basePath : finalPath;
 }
-var Link = React7.forwardRef(
+var Link = React8.forwardRef(
   (props, ref) => {
     const {
       boltdocsPrefetch = "hover",
@@ -1040,9 +1348,9 @@ var Link = React7.forwardRef(
     const localizedTo = useLocalizedTo(to);
     const { preload, routes } = usePreload();
     const config = useConfig();
-    const navigate = useNavigate();
+    const navigate = useNavigate3();
     const shouldShowPreview = boltdocsPreview && config?.themeConfig?.linkPreview !== false;
-    const [preview, setPreview] = React7.useState({ visible: false, x: 0, y: 0, title: "" });
+    const [preview, setPreview] = React8.useState({ visible: false, x: 0, y: 0, title: "" });
     const handleMouseEnter = (e) => {
       onMouseEnter?.(e);
       if (boltdocsPrefetch === "hover" && typeof localizedTo === "string" && localizedTo.startsWith("/")) {
@@ -1091,13 +1399,13 @@ var Link = React7.forwardRef(
       }
       if (typeof localizedTo === "string" && !localizedTo.startsWith("http")) {
         e.preventDefault();
-        React7.startTransition(() => {
+        React8.startTransition(() => {
           navigate(localizedTo);
         });
       }
     };
-    return /* @__PURE__ */ jsxs13(Fragment2, { children: [
-      /* @__PURE__ */ jsx15(
+    return /* @__PURE__ */ jsxs15(Fragment, { children: [
+      /* @__PURE__ */ jsx20(
         RouterLink,
         {
           ref,
@@ -1111,7 +1419,7 @@ var Link = React7.forwardRef(
           ...rest
         }
       ),
-      shouldShowPreview && /* @__PURE__ */ jsx15(
+      preview.visible && shouldShowPreview && /* @__PURE__ */ jsx20(
         LinkPreview,
         {
           isVisible: preview.visible,
@@ -1125,7 +1433,7 @@ var Link = React7.forwardRef(
   }
 );
 Link.displayName = "Link";
-var NavLink = React7.forwardRef(
+var NavLink = React8.forwardRef(
   (props, ref) => {
     const {
       boltdocsPrefetch = "hover",
@@ -1141,376 +1449,140 @@ var NavLink = React7.forwardRef(
     const localizedTo = useLocalizedTo(to);
     const { preload, routes } = usePreload();
     const config = useConfig();
-    const navigate = useNavigate();
+    const navigate = useNavigate3();
     const shouldShowPreview = boltdocsPreview && config?.themeConfig?.linkPreview !== false;
-    const [preview, setPreview] = React7.useState({ visible: false, x: 0, y: 0, title: "" });
+    const [preview, setPreview] = React8.useState({ visible: false, x: 0, y: 0, title: "" });
     const handleMouseEnter = (e) => {
       onMouseEnter?.(e);
       if (boltdocsPrefetch === "hover" && typeof localizedTo === "string" && localizedTo.startsWith("/")) {
         preload(localizedTo);
       }
-      if (shouldShowPreview && typeof localizedTo === "string" && localizedTo.startsWith("/")) {
-        const cleanPath = localizedTo.split("#")[0].split("?")[0];
-        const route = routes.find(
-          (r) => r.path === cleanPath || cleanPath === "/" && r.path === ""
-        );
-        if (route) {
-          setPreview({
-            visible: true,
-            x: e.clientX,
-            y: e.clientY,
-            title: route.title,
-            summary: route.description
-          });
-        }
-      }
-    };
-    const handleMouseMove = (e) => {
-      if (preview.visible) {
-        setPreview((prev) => ({ ...prev, x: e.clientX, y: e.clientY }));
-      }
-    };
-    const handleMouseLeave = (e) => {
-      onMouseLeave?.(e);
-      setPreview((prev) => ({ ...prev, visible: false }));
-    };
-    const handleFocus = (e) => {
-      onFocus?.(e);
-      if (boltdocsPrefetch === "hover" && typeof localizedTo === "string" && localizedTo.startsWith("/")) {
-        preload(localizedTo);
-      }
-    };
-    const handleBlur = (e) => {
-      onBlur?.(e);
-      setPreview((prev) => ({ ...prev, visible: false }));
-    };
-    const handleClick = (e) => {
-      onClick?.(e);
-      setPreview((prev) => ({ ...prev, visible: false }));
-      if (e.defaultPrevented || e.button !== 0 || e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) {
-        return;
-      }
-      if (typeof localizedTo === "string" && !localizedTo.startsWith("http")) {
-        e.preventDefault();
-        React7.startTransition(() => {
-          navigate(localizedTo);
-        });
-      }
-    };
-    return /* @__PURE__ */ jsxs13(Fragment2, { children: [
-      /* @__PURE__ */ jsx15(
-        RouterNavLink,
-        {
-          ref,
-          to: localizedTo,
-          onMouseEnter: handleMouseEnter,
-          onMouseMove: handleMouseMove,
-          onMouseLeave: handleMouseLeave,
-          onFocus: handleFocus,
-          onBlur: handleBlur,
-          onClick: handleClick,
-          ...rest
-        }
-      ),
-      shouldShowPreview && /* @__PURE__ */ jsx15(
-        LinkPreview,
-        {
-          isVisible: preview.visible,
-          title: preview.title,
-          summary: preview.summary,
-          x: preview.x,
-          y: preview.y
-        }
-      )
-    ] });
-  }
-);
-NavLink.displayName = "NavLink";
-
-// src/client/theme/ui/Navbar/Navbar.tsx
-import { ChevronDown as ChevronDown3 } from "lucide-react";
-
-// src/client/theme/ui/LanguageSwitcher/LanguageSwitcher.tsx
-import { useState as useState8, useRef as useRef4, useEffect as useEffect6 } from "react";
-import { Globe, ChevronDown } from "lucide-react";
-import { useNavigate as useNavigate2, useLocation as useLocation8 } from "react-router-dom";
-import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
-function getBaseFilePath(filePath, version, locale) {
-  let path = filePath;
-  if (version && (path === version || path.startsWith(version + "/"))) {
-    path = path === version ? "index.md" : path.slice(version.length + 1);
-  }
-  if (locale && (path === locale || path.startsWith(locale + "/"))) {
-    path = path === locale ? "index.md" : path.slice(locale.length + 1);
-  }
-  return path;
-}
-function LanguageSwitcher({
-  i18n,
-  currentLocale,
-  allRoutes
-}) {
-  const [isOpen, setIsOpen] = useState8(false);
-  const dropdownRef = useRef4(null);
-  const navigate = useNavigate2();
-  const location = useLocation8();
-  useEffect6(() => {
-    function handleClickOutside(event) {
-      if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
-        setIsOpen(false);
-      }
-    }
-    document.addEventListener("mousedown", handleClickOutside);
-    return () => document.removeEventListener("mousedown", handleClickOutside);
-  }, []);
-  const handleSelect = (locale) => {
-    setIsOpen(false);
-    if (locale === currentLocale) return;
-    const currentRoute = allRoutes.find((r) => r.path === location.pathname);
-    let targetPath = "/";
-    if (currentRoute) {
-      const baseFile = getBaseFilePath(
-        currentRoute.filePath,
-        currentRoute.version,
-        currentRoute.locale
-      );
-      const targetRoute = allRoutes.find(
-        (r) => getBaseFilePath(r.filePath, r.version, r.locale) === baseFile && (r.locale || i18n.defaultLocale) === locale && r.version === currentRoute.version
-      );
-      if (targetRoute) {
-        targetPath = targetRoute.path;
-      } else {
-        const defaultIndexRoute = allRoutes.find(
-          (r) => getBaseFilePath(r.filePath, r.version, r.locale) === "index.md" && (r.locale || i18n.defaultLocale) === locale && r.version === currentRoute.version
-        );
-        targetPath = defaultIndexRoute ? defaultIndexRoute.path : locale === i18n.defaultLocale ? currentRoute.version ? `/${currentRoute.version}` : "/" : currentRoute.version ? `/${currentRoute.version}/${locale}` : `/${locale}`;
-      }
-    } else {
-      targetPath = locale === i18n.defaultLocale ? "/" : `/${locale}`;
-    }
-    navigate(targetPath);
-  };
-  return /* @__PURE__ */ jsxs14("div", { className: "boltdocs-language-switcher", ref: dropdownRef, children: [
-    /* @__PURE__ */ jsxs14(
-      "button",
-      {
-        className: "language-btn",
-        onClick: () => setIsOpen(!isOpen),
-        "aria-label": "Switch language",
-        "aria-expanded": isOpen,
-        "aria-haspopup": "listbox",
-        children: [
-          /* @__PURE__ */ jsx16(Globe, { size: 18 }),
-          /* @__PURE__ */ jsx16("span", { className: "language-label", children: i18n.locales[currentLocale] || currentLocale }),
-          /* @__PURE__ */ jsx16(ChevronDown, { size: 14 })
-        ]
-      }
-    ),
-    isOpen && /* @__PURE__ */ jsx16("div", { className: "language-dropdown", children: Object.entries(i18n.locales).map(([key, label]) => /* @__PURE__ */ jsx16(
-      "button",
-      {
-        className: `language-option ${key === currentLocale ? "active" : ""}`,
-        onClick: () => handleSelect(key),
-        children: label
-      },
-      key
-    )) })
-  ] });
-}
-
-// src/client/theme/ui/VersionSwitcher/VersionSwitcher.tsx
-import { useState as useState9, useRef as useRef5, useEffect as useEffect7 } from "react";
-import { ChevronDown as ChevronDown2 } from "lucide-react";
-import { useNavigate as useNavigate3, useLocation as useLocation9 } from "react-router-dom";
-import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
-function getBaseFilePath2(filePath, version, locale) {
-  let path = filePath;
-  if (version && (path === version || path.startsWith(version + "/"))) {
-    path = path === version ? "index.md" : path.slice(version.length + 1);
-  }
-  if (locale && (path === locale || path.startsWith(locale + "/"))) {
-    path = path === locale ? "index.md" : path.slice(locale.length + 1);
-  }
-  return path;
-}
-function VersionSwitcher({
-  versions,
-  currentVersion,
-  currentLocale,
-  allRoutes
-}) {
-  const [isOpen, setIsOpen] = useState9(false);
-  const dropdownRef = useRef5(null);
-  const navigate = useNavigate3();
-  const location = useLocation9();
-  useEffect7(() => {
-    function handleClickOutside(event) {
-      if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
-        setIsOpen(false);
-      }
-    }
-    document.addEventListener("mousedown", handleClickOutside);
-    return () => document.removeEventListener("mousedown", handleClickOutside);
-  }, []);
-  const handleSelect = (version) => {
-    setIsOpen(false);
-    if (version === currentVersion) return;
-    const currentRoute = allRoutes.find((r) => r.path === location.pathname);
-    let targetPath = `/docs/${version}`;
-    if (currentRoute) {
-      const baseFile = getBaseFilePath2(
-        currentRoute.filePath,
-        currentRoute.version,
-        currentRoute.locale
-      );
-      const targetRoute = allRoutes.find(
-        (r) => getBaseFilePath2(r.filePath, r.version, r.locale) === baseFile && (r.version || versions.defaultVersion) === version && (currentLocale ? r.locale === currentLocale : !r.locale)
-      );
-      if (targetRoute) {
-        targetPath = targetRoute.path;
-      } else {
-        const versionIndexRoute = allRoutes.find(
-          (r) => getBaseFilePath2(r.filePath, r.version, r.locale) === "index.md" && (r.version || versions.defaultVersion) === version && (currentLocale ? r.locale === currentLocale : !r.locale)
+      if (shouldShowPreview && typeof localizedTo === "string" && localizedTo.startsWith("/")) {
+        const cleanPath = localizedTo.split("#")[0].split("?")[0];
+        const route = routes.find(
+          (r) => r.path === cleanPath || cleanPath === "/" && r.path === ""
         );
-        targetPath = versionIndexRoute ? versionIndexRoute.path : `/docs/${version}${currentLocale ? `/${currentLocale}` : ""}`;
+        if (route) {
+          setPreview({
+            visible: true,
+            x: e.clientX,
+            y: e.clientY,
+            title: route.title,
+            summary: route.description
+          });
+        }
       }
-    }
-    navigate(targetPath);
-  };
-  return /* @__PURE__ */ jsxs15(
-    "div",
-    {
-      className: "boltdocs-version-switcher",
-      ref: dropdownRef,
-      style: { position: "relative", display: "flex", alignItems: "center" },
-      children: [
-        /* @__PURE__ */ jsxs15(
-          "button",
-          {
-            className: "navbar-version",
-            onClick: () => setIsOpen(!isOpen),
-            "aria-label": "Switch version",
-            "aria-expanded": isOpen,
-            "aria-haspopup": "listbox",
-            style: {
-              fontFamily: "inherit",
-              padding: "0.25rem 0.5rem",
-              marginLeft: "0.5rem"
-            },
-            children: [
-              /* @__PURE__ */ jsx17("span", { children: versions.versions[currentVersion] || currentVersion }),
-              /* @__PURE__ */ jsx17(ChevronDown2, { size: 14 })
-            ]
-          }
-        ),
-        isOpen && /* @__PURE__ */ jsx17(
-          "div",
-          {
-            className: "language-dropdown",
-            style: {
-              left: "0.5rem",
-              right: "auto",
-              minWidth: "150px",
-              top: "calc(100% + 8px)"
-            },
-            children: Object.entries(versions.versions).map(([key, label]) => /* @__PURE__ */ jsx17(
-              "button",
-              {
-                className: `language-option ${key === currentVersion ? "active" : ""}`,
-                onClick: () => handleSelect(key),
-                children: label
-              },
-              key
-            ))
-          }
-        )
-      ]
-    }
-  );
-}
-
-// src/client/theme/ui/ThemeToggle/ThemeToggle.tsx
-import { useEffect as useEffect8, useState as useState10 } from "react";
-import { Sun, Moon } from "lucide-react";
-import { jsx as jsx18 } from "react/jsx-runtime";
-function ThemeToggle() {
-  const [theme, setTheme] = useState10("dark");
-  const [mounted, setMounted] = useState10(false);
-  useEffect8(() => {
-    setMounted(true);
-    const stored = localStorage.getItem("boltdocs-theme");
-    if (stored === "light" || stored === "dark") {
-      setTheme(stored);
-    } else {
-      const prefersDark = window.matchMedia(
-        "(prefers-color-scheme: dark)"
-      ).matches;
-      setTheme(prefersDark ? "dark" : "light");
-    }
-    const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
-    const handleChange = (e) => {
-      if (!localStorage.getItem("boltdocs-theme")) {
-        setTheme(e.matches ? "dark" : "light");
+    };
+    const handleMouseMove = (e) => {
+      if (preview.visible) {
+        setPreview((prev) => ({ ...prev, x: e.clientX, y: e.clientY }));
       }
     };
-    mediaQuery.addEventListener("change", handleChange);
-    return () => mediaQuery.removeEventListener("change", handleChange);
-  }, []);
-  useEffect8(() => {
-    if (!mounted) return;
-    const root = document.documentElement;
-    if (theme === "light") {
-      root.classList.add("theme-light");
-      root.dataset.theme = "light";
-    } else {
-      root.classList.remove("theme-light");
-      root.dataset.theme = "dark";
-    }
-  }, [theme, mounted]);
-  const toggleTheme = () => {
-    const newTheme = theme === "dark" ? "light" : "dark";
-    setTheme(newTheme);
-    localStorage.setItem("boltdocs-theme", newTheme);
-  };
-  if (!mounted) {
-    return /* @__PURE__ */ jsx18("button", { className: "navbar-icon-btn", "aria-label": "Toggle theme", disabled: true, children: /* @__PURE__ */ jsx18("span", { style: { width: 20, height: 20, display: "inline-block" } }) });
+    const handleMouseLeave = (e) => {
+      onMouseLeave?.(e);
+      setPreview((prev) => ({ ...prev, visible: false }));
+    };
+    const handleFocus = (e) => {
+      onFocus?.(e);
+      if (boltdocsPrefetch === "hover" && typeof localizedTo === "string" && localizedTo.startsWith("/")) {
+        preload(localizedTo);
+      }
+    };
+    const handleBlur = (e) => {
+      onBlur?.(e);
+      setPreview((prev) => ({ ...prev, visible: false }));
+    };
+    const handleClick = (e) => {
+      onClick?.(e);
+      setPreview((prev) => ({ ...prev, visible: false }));
+      if (e.defaultPrevented || e.button !== 0 || e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) {
+        return;
+      }
+      if (typeof localizedTo === "string" && !localizedTo.startsWith("http")) {
+        e.preventDefault();
+        React8.startTransition(() => {
+          navigate(localizedTo);
+        });
+      }
+    };
+    return /* @__PURE__ */ jsxs15(Fragment, { children: [
+      /* @__PURE__ */ jsx20(
+        RouterNavLink,
+        {
+          ref,
+          to: localizedTo,
+          onMouseEnter: handleMouseEnter,
+          onMouseMove: handleMouseMove,
+          onMouseLeave: handleMouseLeave,
+          onFocus: handleFocus,
+          onBlur: handleBlur,
+          onClick: handleClick,
+          ...rest
+        }
+      ),
+      preview.visible && shouldShowPreview && /* @__PURE__ */ jsx20(
+        LinkPreview,
+        {
+          isVisible: preview.visible,
+          title: preview.title,
+          summary: preview.summary,
+          x: preview.x,
+          y: preview.y
+        }
+      )
+    ] });
   }
-  return /* @__PURE__ */ jsx18(
-    "button",
-    {
-      className: "navbar-icon-btn",
-      onClick: toggleTheme,
-      "aria-label": "Toggle theme",
-      title: `Switch to ${theme === "dark" ? "light" : "dark"} theme`,
-      children: theme === "dark" ? /* @__PURE__ */ jsx18(Sun, { size: 20 }) : /* @__PURE__ */ jsx18(Moon, { size: 20 })
+);
+NavLink.displayName = "NavLink";
+
+// src/client/theme/ui/Navbar/Tabs.tsx
+import * as Icons from "lucide-react";
+import { jsx as jsx21, jsxs as jsxs16 } from "react/jsx-runtime";
+function Tabs({ tabs, routes }) {
+  const location = useLocation10();
+  const currentRoute = routes.find((r) => r.path === location.pathname);
+  const currentTabId = currentRoute?.tab?.toLowerCase();
+  if (!tabs || tabs.length === 0) return null;
+  const renderTabIcon = (iconName) => {
+    if (!iconName) return null;
+    if (iconName.trim().startsWith("<svg")) {
+      return /* @__PURE__ */ jsx21(
+        "span",
+        {
+          className: "tab-icon svg-icon",
+          dangerouslySetInnerHTML: { __html: iconName }
+        }
+      );
     }
-  );
+    const LucideIcon = Icons[iconName];
+    if (LucideIcon) {
+      return /* @__PURE__ */ jsx21(LucideIcon, { size: 16, className: "tab-icon lucide-icon" });
+    }
+    return /* @__PURE__ */ jsx21("img", { src: iconName, alt: "", className: "tab-icon img-icon" });
+  };
+  return /* @__PURE__ */ jsx21("div", { className: "boltdocs-tabs-container", children: /* @__PURE__ */ jsx21("div", { className: "boltdocs-tabs", children: tabs.map((tab, index) => {
+    const isActive = currentTabId ? currentTabId === tab.id.toLowerCase() : index === 0;
+    const firstRoute = routes.find((r) => r.tab && r.tab.toLowerCase() === tab.id.toLowerCase());
+    const linkTo = firstRoute ? firstRoute.path : "#";
+    return /* @__PURE__ */ jsxs16(
+      Link,
+      {
+        to: linkTo,
+        className: `boltdocs-tab-item ${isActive ? "active" : ""}`,
+        children: [
+          renderTabIcon(tab.icon),
+          /* @__PURE__ */ jsx21("span", { children: tab.text })
+        ]
+      },
+      tab.id
+    );
+  }) }) });
 }
 
-// src/client/theme/icons/discord.tsx
-import { jsx as jsx19 } from "react/jsx-runtime";
-var Discord = (props) => /* @__PURE__ */ jsx19("svg", { ...props, viewBox: "0 0 256 199", preserveAspectRatio: "xMidYMid", children: /* @__PURE__ */ jsx19(
-  "path",
-  {
-    d: "M216.856 16.597A208.502 208.502 0 0 0 164.042 0c-2.275 4.113-4.933 9.645-6.766 14.046-19.692-2.961-39.203-2.961-58.533 0-1.832-4.4-4.55-9.933-6.846-14.046a207.809 207.809 0 0 0-52.855 16.638C5.618 67.147-3.443 116.4 1.087 164.956c22.169 16.555 43.653 26.612 64.775 33.193A161.094 161.094 0 0 0 79.735 175.3a136.413 136.413 0 0 1-21.846-10.632 108.636 108.636 0 0 0 5.356-4.237c42.122 19.702 87.89 19.702 129.51 0a131.66 131.66 0 0 0 5.355 4.237 136.07 136.07 0 0 1-21.886 10.653c4.006 8.02 8.638 15.67 13.873 22.848 21.142-6.58 42.646-16.637 64.815-33.213 5.316-56.288-9.08-105.09-38.056-148.36ZM85.474 135.095c-12.645 0-23.015-11.805-23.015-26.18s10.149-26.2 23.015-26.2c12.867 0 23.236 11.804 23.015 26.2.02 14.375-10.148 26.18-23.015 26.18Zm85.051 0c-12.645 0-23.014-11.805-23.014-26.18s10.148-26.2 23.014-26.2c12.867 0 23.236 11.804 23.015 26.2 0 14.375-10.148 26.18-23.015 26.18Z",
-    fill: "currentColor"
-  }
-) });
-
-// src/client/theme/icons/twitter.tsx
-import { jsx as jsx20 } from "react/jsx-runtime";
-var XformerlyTwitter = (props) => /* @__PURE__ */ jsx20("svg", { ...props, fill: "none", viewBox: "0 0 1200 1227", children: /* @__PURE__ */ jsx20(
-  "path",
-  {
-    fill: "currentColor",
-    d: "M714.163 519.284 1160.89 0h-105.86L667.137 450.887 357.328 0H0l468.492 681.821L0 1226.37h105.866l409.625-476.152 327.181 476.152H1200L714.137 519.284h.026ZM569.165 687.828l-47.468-67.894-377.686-540.24h162.604l304.797 435.991 47.468 67.894 396.2 566.721H892.476L569.165 687.854v-.026Z"
-  }
-) });
-
 // src/client/theme/ui/Navbar/Navbar.tsx
-import { jsx as jsx21, jsxs as jsxs16 } from "react/jsx-runtime";
-var SearchDialog = React10.lazy(
-  () => import("./SearchDialog-J3KNRGNO.mjs").then((m) => ({ default: m.SearchDialog }))
+import { jsx as jsx22, jsxs as jsxs17 } from "react/jsx-runtime";
+var SearchDialog = lazy2(
+  () => import("./SearchDialog-YOXMFGH6.mjs").then((m) => ({ default: m.SearchDialog }))
 );
 var ICON_MAP = {
   discord: Discord,
@@ -1523,81 +1595,123 @@ function Navbar({
   currentLocale,
   currentVersion
 }) {
+  const location = useLocation11();
+  const isHomePage = location.pathname === "/";
   const title = config.themeConfig?.title || "Boltdocs";
   const navItems = config.themeConfig?.navbar || [];
   const socialLinks = config.themeConfig?.socialLinks || [];
-  return /* @__PURE__ */ jsx21("header", { className: "boltdocs-navbar", children: /* @__PURE__ */ jsxs16("div", { className: "navbar-container", children: [
-    /* @__PURE__ */ jsxs16("div", { className: "navbar-left", children: [
-      /* @__PURE__ */ jsx21("div", { className: "navbar-logo", children: /* @__PURE__ */ jsxs16(Link, { to: "/", children: [
-        config.themeConfig?.logo ? config.themeConfig.logo.trim().startsWith("<svg") ? /* @__PURE__ */ jsx21(
-          "span",
-          {
-            className: "navbar-logo-svg",
-            dangerouslySetInnerHTML: {
-              __html: config.themeConfig.logo
-            }
-          }
-        ) : /* @__PURE__ */ jsx21(
-          "img",
-          {
-            src: config.themeConfig.logo,
-            alt: title,
-            className: "navbar-logo-img"
-          }
-        ) : null,
-        title
-      ] }) }),
-      config.versions && currentVersion && allRoutes ? /* @__PURE__ */ jsx21(
-        VersionSwitcher,
-        {
-          versions: config.versions,
-          currentVersion,
-          currentLocale,
-          allRoutes
-        }
-      ) : config.themeConfig?.version ? /* @__PURE__ */ jsxs16("div", { className: "navbar-version", children: [
-        config.themeConfig.version,
-        " ",
-        /* @__PURE__ */ jsx21(ChevronDown3, { size: 14 })
-      ] }) : null,
-      /* @__PURE__ */ jsx21("nav", { className: "navbar-links", "aria-label": "Top Navigation", children: navItems.map((item, i) => /* @__PURE__ */ jsx21(Link, { to: item.link, children: item.text }, i)) })
-    ] }),
-    /* @__PURE__ */ jsxs16("div", { className: "navbar-right", children: [
-      /* @__PURE__ */ jsx21(
-        React10.Suspense,
-        {
-          fallback: /* @__PURE__ */ jsx21("div", { className: "navbar-search-placeholder" }),
-          children: /* @__PURE__ */ jsx21(SearchDialog, { routes: routes || [] })
-        }
-      ),
-      config.i18n && currentLocale && allRoutes && /* @__PURE__ */ jsx21(
-        LanguageSwitcher,
+  const hasTabs = !isHomePage && config.themeConfig?.tabs && config.themeConfig.tabs.length > 0;
+  const leftItems = navItems.filter((item) => item.position !== "right");
+  const rightItems = navItems.filter((item) => item.position === "right");
+  const renderNavItem = (item, i) => {
+    const text = item.label || item.text || "";
+    const href = item.to || item.href || item.link || "";
+    const isExternal = href.startsWith("http") || href.startsWith("//") || href.includes("://");
+    return /* @__PURE__ */ jsxs17(Link2, { to: href, target: isExternal ? "_blank" : void 0, children: [
+      text,
+      isExternal && /* @__PURE__ */ jsx22("span", { className: "navbar-external-icon", children: /* @__PURE__ */ jsxs17(
+        "svg",
         {
-          i18n: config.i18n,
-          currentLocale,
-          allRoutes
+          viewBox: "0 0 24 24",
+          width: "13",
+          height: "13",
+          stroke: "currentColor",
+          strokeWidth: "2",
+          fill: "none",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          children: [
+            /* @__PURE__ */ jsx22("path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }),
+            /* @__PURE__ */ jsx22("polyline", { points: "15 3 21 3 21 9" }),
+            /* @__PURE__ */ jsx22("line", { x1: "10", y1: "14", x2: "21", y2: "3" })
+          ]
         }
-      ),
-      /* @__PURE__ */ jsx21(ThemeToggle, {}),
-      config.themeConfig?.githubRepo && /* @__PURE__ */ jsx21(GithubStars, { repo: config.themeConfig.githubRepo }),
-      socialLinks.length > 0 && /* @__PURE__ */ jsx21("div", { className: "navbar-divider" }),
-      /* @__PURE__ */ jsx21("div", { className: "navbar-icons", children: socialLinks.map((link, i) => {
-        const IconComp = ICON_MAP[link.icon.toLowerCase()];
-        return /* @__PURE__ */ jsx21(
-          "a",
-          {
-            href: link.link,
-            target: "_blank",
-            rel: "noopener noreferrer",
-            className: "navbar-icon-btn",
-            "aria-label": link.icon,
-            children: IconComp ? /* @__PURE__ */ jsx21(IconComp, {}) : /* @__PURE__ */ jsx21("span", { children: link.icon })
-          },
-          i
-        );
-      }) })
-    ] })
-  ] }) });
+      ) })
+    ] }, i);
+  };
+  return /* @__PURE__ */ jsxs17("header", { className: `boltdocs-navbar ${hasTabs ? "has-tabs" : ""}`, children: [
+    /* @__PURE__ */ jsxs17(
+      "div",
+      {
+        className: "navbar-container",
+        style: { height: "var(--ld-navbar-height)" },
+        children: [
+          /* @__PURE__ */ jsxs17("div", { className: "navbar-left", children: [
+            /* @__PURE__ */ jsx22("div", { className: "navbar-logo", children: /* @__PURE__ */ jsxs17(Link2, { to: "/", children: [
+              config.themeConfig?.logo ? config.themeConfig.logo.trim().startsWith("<svg") ? /* @__PURE__ */ jsx22(
+                "span",
+                {
+                  className: "navbar-logo-svg",
+                  dangerouslySetInnerHTML: {
+                    __html: config.themeConfig.logo
+                  }
+                }
+              ) : /* @__PURE__ */ jsx22(
+                "img",
+                {
+                  src: config.themeConfig.logo,
+                  alt: title,
+                  className: "navbar-logo-img"
+                }
+              ) : null,
+              title
+            ] }) }),
+            config.versions && currentVersion && allRoutes ? /* @__PURE__ */ jsx22(
+              VersionSwitcher,
+              {
+                versions: config.versions,
+                currentVersion,
+                currentLocale,
+                allRoutes
+              }
+            ) : config.themeConfig?.version ? /* @__PURE__ */ jsxs17("div", { className: "navbar-version", children: [
+              config.themeConfig.version,
+              " ",
+              /* @__PURE__ */ jsx22(ChevronDown3, { size: 14 })
+            ] }) : null,
+            /* @__PURE__ */ jsx22("nav", { className: "navbar-links", "aria-label": "Top Navigation Left", children: leftItems.map(renderNavItem) })
+          ] }),
+          /* @__PURE__ */ jsxs17("div", { className: "navbar-right", children: [
+            /* @__PURE__ */ jsx22("nav", { className: "navbar-links", "aria-label": "Top Navigation Right", children: rightItems.map(renderNavItem) }),
+            /* @__PURE__ */ jsx22(Suspense2, { fallback: /* @__PURE__ */ jsx22("div", { className: "navbar-search-placeholder" }), children: /* @__PURE__ */ jsx22(SearchDialog, { routes: routes || [] }) }),
+            config.i18n && currentLocale && allRoutes && /* @__PURE__ */ jsx22(
+              LanguageSwitcher,
+              {
+                i18n: config.i18n,
+                currentLocale,
+                allRoutes
+              }
+            ),
+            /* @__PURE__ */ jsx22(ThemeToggle, {}),
+            config.themeConfig?.githubRepo && /* @__PURE__ */ jsx22(GithubStars, { repo: config.themeConfig.githubRepo }),
+            socialLinks.length > 0 && /* @__PURE__ */ jsx22("div", { className: "navbar-divider" }),
+            /* @__PURE__ */ jsx22("div", { className: "navbar-icons", children: socialLinks.map((link, i) => {
+              const IconComp = ICON_MAP[link.icon.toLowerCase()];
+              return /* @__PURE__ */ jsx22(
+                "a",
+                {
+                  href: link.link,
+                  target: "_blank",
+                  rel: "noopener noreferrer",
+                  className: "navbar-icon-btn",
+                  "aria-label": link.icon,
+                  children: IconComp ? /* @__PURE__ */ jsx22(IconComp, {}) : /* @__PURE__ */ jsx22("span", { children: link.icon })
+                },
+                i
+              );
+            }) })
+          ] })
+        ]
+      }
+    ),
+    hasTabs && config.themeConfig?.tabs && /* @__PURE__ */ jsx22(
+      Tabs,
+      {
+        tabs: config.themeConfig.tabs,
+        routes: allRoutes || routes || []
+      }
+    )
+  ] });
 }
 
 export {