@docubook/flame 2.0.0-alpha.1 → 2.0.0-beta.0

package/.docu/components/Menu.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { useState } from "react";
-import Sublink from "./Sublink";
+import Sublink, { GroupAccordionProvider } from "./Sublink";
 import SidebarGroupHeader from "./SidebarGroupHeader";
 import type { DocuRoute } from "../node/types";
 import { cn } from "../node/utils";
@@ -76,28 +76,32 @@ export default function Menu({ onNavigate, className = "", pathname, routes = []
     // No context routes defined — fall back to flat list of all routes
     if (contextRoutes.length === 0) {
       return (
-        <nav {...navProps}>
-          <ul className={sharedUlClasses}>
-            {menuRoutes.map((route) => renderBorderItem(route, "", route.href))}
-          </ul>
-        </nav>
+        <GroupAccordionProvider>
+          <nav {...navProps}>
+            <ul className={sharedUlClasses}>
+              {menuRoutes.map((route) => renderBorderItem(route, "", route.href))}
+            </ul>
+          </nav>
+        </GroupAccordionProvider>
       );
     }
 
     return (
-      <nav {...navProps}>
-        {contextRoutes.map((route, i) => (
-          <div key={route.href} className={i > 0 ? "mt-6 lg:mt-8" : ""}>
-            <SidebarGroupHeader
-              icon={route.context?.icon}
-              title={route.context?.title || route.title}
-            />
-            <ul className={sharedUlClasses}>
-              {route.items?.map((item) => renderBorderItem(item, route.href, item.href))}
-            </ul>
-          </div>
-        ))}
-      </nav>
+      <GroupAccordionProvider>
+        <nav {...navProps}>
+          {contextRoutes.map((route, i) => (
+            <div key={route.href} className={i > 0 ? "mt-6 lg:mt-8" : ""}>
+              <SidebarGroupHeader
+                icon={route.context?.icon}
+                title={route.context?.title || route.title}
+              />
+              <ul className={sharedUlClasses}>
+                {route.items?.map((item) => renderBorderItem(item, route.href, item.href))}
+              </ul>
+            </div>
+          ))}
+        </nav>
+      </GroupAccordionProvider>
     );
   }
 
@@ -119,18 +123,20 @@ export default function Menu({ onNavigate, className = "", pathname, routes = []
   if (!contextRoute) return null;
 
   return (
-    <nav {...navProps}>
-      <ul className="flex flex-col gap-0.5 py-4">
-        <li key={contextRoute.title}>
-          <Sublink
-            {...contextRoute}
-            href={contextRoute.href}
-            level={0}
-            onNavigate={onNavigate}
-            parentHref="/docs"
-          />
-        </li>
-      </ul>
-    </nav>
+    <GroupAccordionProvider>
+      <nav {...navProps}>
+        <ul className="flex flex-col gap-0.5 py-4">
+          <li key={contextRoute.title}>
+            <Sublink
+              {...contextRoute}
+              href={contextRoute.href}
+              level={0}
+              onNavigate={onNavigate}
+              parentHref="/docs"
+            />
+          </li>
+        </ul>
+      </nav>
+    </GroupAccordionProvider>
   );
 }

package/.docu/components/Sublink.tsx

@@ -1,12 +1,43 @@
 "use client";
 
-import { useState, useRef, useEffect } from "react";
+import {
+  createContext,
+  useContext,
+  useState,
+  useRef,
+  useEffect,
+  useCallback,
+  type ReactNode,
+} from "react";
 import { ChevronDown } from "lucide-react";
 import Anchor from "./Anchor";
 import type { DocuRoute } from "../node/types";
 import { cn, docsHtmlHref } from "../node/utils";
 import { config as docuConfig } from "../node/client-routes";
 
+/** Exclusive accordion for level >= 2 sidebar groups — opening one group
+ * closes the previously open one. All level >= 2 groups default to closed
+ * and expand only when the header is clicked. `open` is used to auto-expand
+ * the group containing the active page. */
+export const GroupAccordionContext = createContext<{
+  openId: string | null;
+  open: (id: string) => void;
+  toggle: (id: string) => void;
+}>({ openId: null, open: () => {}, toggle: () => {} });
+
+export function GroupAccordionProvider({ children }: { children: ReactNode }) {
+  const [openId, setOpenId] = useState<string | null>(null);
+  // Exclusive: expanding B closes A — only one group stays open at a time;
+  // clicking the open group again collapses it.
+  const open = useCallback((id: string) => setOpenId(id), []);
+  const toggle = useCallback((id: string) => setOpenId((prev) => (prev === id ? null : id)), []);
+  return (
+    <GroupAccordionContext.Provider value={{ openId, open, toggle }}>
+      {children}
+    </GroupAccordionContext.Provider>
+  );
+}
+
 interface SublinkProps extends DocuRoute {
   level: number;
   onNavigate?: () => void;
@@ -28,12 +59,39 @@ export default function Sublink({
   const currentPathname =
     pathnameProp || (typeof window !== "undefined" ? window.location.pathname : "/docs");
 
+  // Groups with children are exclusive accordions (default closed, expand on
+  // click). In separator mode every nav item renders at level 0 (sections are
+  // SidebarGroupHeader, not Sublinks), so depth can't tell them apart — the
+  // mode does. In dropdown mode the top section is level 0 (stays open) and
+  // everything deeper is an accordion.
+  const isSeparator = docuConfig.sidebar?.context === "separator";
+  const { openId, open, toggle } = useContext(GroupAccordionContext);
+  const isAccordionGroup = Boolean(items) && (isSeparator || level >= 1);
+  // Routes-tree level: separator mode renders every item at level 0 (sections
+  // are SidebarGroupHeader), dropdown starts the context section at level 0.
+  const treeLevel = level + (isSeparator ? 2 : 1);
+
   const [isOpen, setIsOpen] = useState(() => {
-    if (level === 0) return true;
-    if (!items) return false;
-    return currentPathname.startsWith(fullHref) && currentPathname !== fullHref;
+    if (isAccordionGroup) return false; // default closed — context controls it
+    if (level === 0) return true; // top-level section stays open
+    return false; // leaves
   });
 
+  const effectiveOpen = isAccordionGroup ? openId === fullHref : isOpen;
+  const handleToggle = () => {
+    if (isAccordionGroup) toggle(fullHref);
+    else setIsOpen((o) => !o);
+  };
+
+  // Auto-expand the accordion group that contains the active page — on mount
+  // and whenever the current path changes. `open` is stable (useCallback), so
+  // this only fires on real path changes; a manual collapse by the user is
+  // respected until the path changes again.
+  const isInsideActive = currentPathname.startsWith(fullHref) && currentPathname !== fullHref;
+  useEffect(() => {
+    if (isAccordionGroup && isInsideActive) open(fullHref);
+  }, [isAccordionGroup, isInsideActive, fullHref, open]);
+
   // Shared padding based on nesting level
   const levelPadding = cn(level === 1 && "pl-4", level === 2 && "pl-8", level >= 3 && "pl-12");
   const isActive = currentPathname === fullHref || currentPathname === `${fullHref}.html`;
@@ -113,12 +171,15 @@ export default function Sublink({
       {/* Section header */}
       <button
         type="button"
-        onClick={() => setIsOpen(!isOpen)}
+        onClick={handleToggle}
         className={cn(
           "flex w-full cursor-pointer items-center justify-between py-1 text-left text-sm transition-colors",
-          noLink
+          // Only the top-level section label (routes-tree level 1) is bold.
+          // Deeper groups (e.g. Search at level 2) are children that happen to
+          // have items — style them like links, no header weight.
+          noLink && treeLevel === 1
             ? "text-base-content font-semibold"
-            : "text-base-content/80 hover:text-base-content font-medium"
+            : "text-foreground hover:text-foreground/80"
         )}
       >
         {noLink ? (
@@ -137,13 +198,15 @@ export default function Sublink({
         <ChevronDown
           className={cn(
             "text-base-content/40 h-4 w-4 shrink-0 transition-transform duration-200",
-            isOpen && "rotate-180"
+            // Tree convention: closed = chevron pointing right (expandable),
+            // open = pointing down — a 90° turn instead of the 180° flip.
+            effectiveOpen ? "rotate-0" : "-rotate-90"
           )}
         />
       </button>
 
       {/* Children */}
-      {isOpen && (
+      {effectiveOpen && (
         <div className="flex flex-col py-1">
           {items.map((item) => (
             <Sublink

package/.docu/lib/build.deno.js

@@ -1,9 +1,9 @@
 import {
   runBuildCli
-} from "./chunk-MQWWCO6O.js";
-import "./chunk-TRT6WQZG.js";
+} from "./chunk-C3RCUTUE.js";
+import "./chunk-LXJLSXQI.js";
 import "./chunk-EOK6KATZ.js";
-import "./chunk-JRERMREW.js";
+import "./chunk-IVM5UM44.js";
 import "./chunk-4IQXHHPF.js";
 
 // .docu/node/build.deno.ts

package/.docu/lib/{build.impl-VXB4KL4D.js → build.impl-S4DS5XPH.js}

@@ -1,10 +1,10 @@
 import {
   runBuild,
   runBuildCli
-} from "./chunk-MQWWCO6O.js";
-import "./chunk-TRT6WQZG.js";
+} from "./chunk-C3RCUTUE.js";
+import "./chunk-LXJLSXQI.js";
 import "./chunk-EOK6KATZ.js";
-import "./chunk-JRERMREW.js";
+import "./chunk-IVM5UM44.js";
 import "./chunk-4IQXHHPF.js";
 export {
   runBuild,

package/.docu/lib/build.node.js

@@ -1,9 +1,9 @@
 import {
   runBuildCli
-} from "./chunk-MQWWCO6O.js";
-import "./chunk-TRT6WQZG.js";
+} from "./chunk-C3RCUTUE.js";
+import "./chunk-LXJLSXQI.js";
 import "./chunk-EOK6KATZ.js";
-import "./chunk-JRERMREW.js";
+import "./chunk-IVM5UM44.js";
 import "./chunk-4IQXHHPF.js";
 
 // .docu/node/build.node.ts

package/.docu/lib/{chunk-MQWWCO6O.js → chunk-C3RCUTUE.js}

@@ -12,10 +12,14 @@ import {
   frontmatterField,
   generateSearchIndex,
   getGitLastModifiedBatch,
+  getPageContent,
+  getPageFrontmatter,
+  getPageStripped,
   htmlShell,
   initSentry,
-  loadPlugins
-} from "./chunk-TRT6WQZG.js";
+  loadPlugins,
+  registerPageContent
+} from "./chunk-LXJLSXQI.js";
 import {
   cspHeader,
   generateNonce,
@@ -23,7 +27,7 @@ import {
 } from "./chunk-EOK6KATZ.js";
 import {
   logger
-} from "./chunk-JRERMREW.js";
+} from "./chunk-IVM5UM44.js";
 import {
   ASSETS_DIR,
   CACHE_FILE,
@@ -109,7 +113,18 @@ async function renderDocsPage(docuConfig, slug, rawMdx, filePath, gitDates, buil
   try {
     const remarkPlugins = builder?.collectRemarkPlugins();
     const rehypePlugins = builder?.collectRehypePlugins();
-    result = await compileMdx(content, filePath, gitDates, remarkPlugins, rehypePlugins);
+    const preFm = getPageFrontmatter(`/${slug}`);
+    const preStripped = getPageStripped(`/${slug}`);
+    const pre = preFm !== void 0 && preStripped !== void 0 ? { frontmatter: preFm, strippedContent: preStripped } : void 0;
+    result = await compileMdx(
+      content,
+      filePath,
+      gitDates,
+      remarkPlugins,
+      rehypePlugins,
+      void 0,
+      pre
+    );
   } catch (err) {
     const msg = err instanceof Error ? err.message : "Unknown MDX error";
     throw new Error(`MDX Error in: docs/${slug}.mdx
@@ -222,6 +237,7 @@ async function runBuild() {
     } catch {
       return;
     }
+    registerPageContent(`/${file.path}`, raw);
     let content = raw;
     if (builder) {
       const relPath = file.absPath.replace(PROJECT_ROOT + "/", "");
@@ -230,7 +246,12 @@ async function runBuild() {
     }
     const remarkPlugins = builder?.collectRemarkPlugins();
     const rehypePlugins = builder?.collectRehypePlugins();
-    mdxSources[file.path] = await compileMdxModule(content, remarkPlugins, rehypePlugins);
+    mdxSources[file.path] = await compileMdxModule(
+      content,
+      remarkPlugins,
+      rehypePlugins,
+      `/${file.path}`
+    );
   });
   await Promise.all(prePassTasks);
   const indexMdxPath = join(DOCS_DIR, "index.mdx");
@@ -285,12 +306,14 @@ async function runBuild() {
         continue;
       }
     }
-    let rawMdx;
-    try {
-      rawMdx = await readFile(file.absPath, "utf-8");
-    } catch (err) {
-      if (err.code !== "ENOENT") throw err;
-      continue;
+    let rawMdx = getPageContent(`/${file.path}`);
+    if (rawMdx === void 0) {
+      try {
+        rawMdx = await readFile(file.absPath, "utf-8");
+      } catch (err) {
+        if (err.code !== "ENOENT") throw err;
+        continue;
+      }
     }
     if (rebuildDecision === "hash_check") {
       const contentHash = hashContent(rawMdx);
@@ -418,8 +441,9 @@ async function runBuild() {
   }
   logger.indexStart();
   t = performance.now();
-  const indexCount = await generateSearchIndex();
-  logger.indexDone(indexCount, Math.round(performance.now() - t));
+  const indexSkipped = built === 0 && existsSync(join(ASSETS_DIR, "search-index.json"));
+  const indexCount = indexSkipped ? 0 : await generateSearchIndex();
+  logger.indexDone(indexCount, Math.round(performance.now() - t), indexSkipped);
   logger.routes();
   await writeCache(cache);
   if (errors.length > 0) {

package/.docu/lib/{chunk-A6FIEG3H.js → chunk-D3QTSBR4.js}

@@ -15,7 +15,7 @@ import {
   htmlShell,
   initSentry,
   loadPlugins
-} from "./chunk-TRT6WQZG.js";
+} from "./chunk-LXJLSXQI.js";
 import {
   SECURITY_HEADERS,
   generateNonce,
@@ -28,7 +28,7 @@ import {
 } from "./chunk-EOK6KATZ.js";
 import {
   logger
-} from "./chunk-JRERMREW.js";
+} from "./chunk-IVM5UM44.js";
 import {
   DIST_DIR,
   DOCS_DIR,

package/.docu/lib/{chunk-JRERMREW.js → chunk-IVM5UM44.js}

@@ -5,7 +5,7 @@ import {
 // package.json
 var package_default = {
   name: "@docubook/flame",
-  version: "2.0.0-alpha.1",
+  version: "2.0.0-beta.0",
   description: "A blazing-fast React + MDX framework powered by Bun, built for modern documentation experiences.",
   type: "module",
   bin: {
@@ -239,9 +239,11 @@ ${c.bold}${c.cyan}  \u{1F525} DocuBook Flame${c.reset} ${c.dim}v${package_defaul
     if (guard("info", "index_start")) return;
     this.spinner.start("Generating search index...");
   },
-  indexDone(records, ms) {
-    if (guard("info", "index_done", { records, duration_ms: ms })) return;
-    this.spinner.stop(`Search index generated ${c.dim}(${records} records, ${ms}ms)${c.reset}`);
+  indexDone(records, ms, skipped = false) {
+    if (guard("info", "index_done", { records, duration_ms: ms, skipped })) return;
+    this.spinner.stop(
+      skipped ? `Search index cached ${c.dim}(${ms}ms)${c.reset}` : `Search index generated ${c.dim}(${records} records, ${ms}ms)${c.reset}`
+    );
   },
   routes() {
     if (guard("debug", "routes")) return;

package/.docu/lib/{chunk-LZDEWK25.js → chunk-JMQI3FKV.js}

@@ -7,7 +7,7 @@ import {
 } from "./chunk-EOK6KATZ.js";
 import {
   logger
-} from "./chunk-JRERMREW.js";
+} from "./chunk-IVM5UM44.js";
 import {
   DIST_DIR
 } from "./chunk-4IQXHHPF.js";