@docubook/flame 1.0.0-beta.80 → 1.0.1

package/.docu/components/Anchor.tsx

@@ -34,7 +34,7 @@ export default function Anchor({
 
   const activeClass = isActive ? activeClassName : "";
   const baseClasses = cn(
-    "text-blue-600 hover:text-blue-800 hover:underline transition-colors",
+    "hover:underline transition-colors",
     className,
     activeClass,
     disabled && "cursor-not-allowed opacity-50"

package/.docu/components/Breadcrumb.tsx

@@ -1,4 +1,9 @@
-import { Breadcrumb, BreadcrumbItem, BreadcrumbList, BreadcrumbPage } from "./base/breadcrumbs";
+import {
+  Breadcrumb,
+  BreadcrumbItem,
+  BreadcrumbList,
+  BreadcrumbPage,
+} from "@docubook/ui-react/breadcrumbs";
 
 export interface DocsBreadcrumbProps {
   paths: string[];

package/.docu/components/Context.tsx

@@ -2,7 +2,7 @@
 
 import { useState } from "react";
 import { cn } from "../node/utils";
-import { Dropdown, DropdownItem } from "./base/dropdown";
+import { Dropdown, DropdownItem } from "@docubook/ui-react/dropdown";
 import { routes } from "../node/client-routes";
 import { ChevronsUpDown, Check, type LucideIcon } from "lucide-react";
 import * as LucideIcons from "lucide-react";
@@ -51,6 +51,7 @@ export function Context({ className }: ContextProps) {
     <Dropdown
       className={cn("w-full", className)}
       align="start"
+      menuClassName="w-full"
       trigger={
         <div className="border-base-300 flex items-center justify-between rounded-lg border px-3 py-2 text-sm font-semibold">
           <div className="flex min-w-0 items-center gap-2">

package/.docu/components/Navbar.tsx

@@ -8,9 +8,9 @@ import {
   NavMenu as BaseNavMenu,
   NavMenuLink as BaseNavMenuLink,
   type NavMenuItem as BaseNavMenuItem,
-} from "./base/navbar";
+} from "@docubook/ui-react/navbar";
 
-export type { NavMenuItem } from "./base/navbar";
+export type { NavMenuItem } from "@docubook/ui-react/navbar";
 
 interface AppNavMenuItem {
   title: string;

package/.docu/components/Pagination.tsx

@@ -1,14 +1,24 @@
 "use client";
 
+import type { ReactNode } from "react";
 import { getPreviousNext } from "../node/route";
-import { PaginationDocs } from "./base/pagination";
+import { PaginationDocs } from "@docubook/ui-react/pagination";
 
 interface PaginationProps {
   pathname: string;
   className?: string;
+  prevIcon?: ReactNode;
+  nextIcon?: ReactNode;
+  linkClassName?: string;
 }
 
-export default function Pagination({ pathname, className }: PaginationProps) {
+export default function Pagination({
+  pathname,
+  className,
+  prevIcon,
+  nextIcon,
+  linkClassName,
+}: PaginationProps) {
   const { prev, next } = getPreviousNext(pathname);
 
   if (!prev && !next) {
@@ -20,6 +30,9 @@ export default function Pagination({ pathname, className }: PaginationProps) {
       prev={prev ? { href: `/docs${prev.href}`, title: prev.title } : undefined}
       next={next ? { href: `/docs${next.href}`, title: next.title } : undefined}
       className={className}
+      prevIcon={prevIcon}
+      nextIcon={nextIcon}
+      linkClassName={linkClassName}
     />
   );
 }

package/.docu/components/Search.tsx

@@ -2,8 +2,8 @@
 
 import { useState, useEffect, useRef, useCallback } from "react";
 import { Search as SearchIcon, FileText, CornerDownLeft, Hash, AlignLeft } from "lucide-react";
-import { Modal, useModal } from "./base/modal";
-import { Kbd, FnKey } from "./base/kbd";
+import { Modal, useModal } from "@docubook/ui-react/modal";
+import { Kbd, FnKey } from "@docubook/ui-react/kbd";
 import { cn } from "../node/utils";
 import { search, type SearchResult } from "../node/search";
 import type { SearchRecord } from "../node/search-indexer";
@@ -217,16 +217,10 @@ function SearchTrigger({ onClick }: { onClick: () => void }) {
           <SearchIcon className="h-4 w-4 shrink-0" />
           <span className="flex-1 text-left">Search</span>
           <div className="flex items-center gap-0.5">
-            <Kbd
-              size="s"
-              className="bg-primary text-[12px text-base-300 dark:text-foreground rounded-md p-1.5 font-medium"
-            >
+            <Kbd className="bg-primary text-[12px text-base-300 dark:text-foreground rounded-md p-1.5 font-medium">
               <FnKey.Cmd />
             </Kbd>
-            <Kbd
-              size="s"
-              className="bg-primary text-base-300 dark:text-foreground rounded-md p-1.5 text-[12px] font-medium"
-            >
+            <Kbd className="bg-primary text-base-300 dark:text-foreground rounded-md p-1.5 text-[12px] font-medium">
               K
             </Kbd>
           </div>

package/.docu/components/Sidebar.tsx

@@ -9,8 +9,9 @@ import {
   PanelRightClose,
   FileText,
 } from "lucide-react";
-import { Dropdown, DropdownLink } from "./base/dropdown";
+import { Dropdown } from "@docubook/ui-react/dropdown";
 import { cn } from "../node/utils";
+import Anchor from "./Anchor";
 import { Context } from "./Context";
 import Menu from "./Menu";
 import { ThemeToggle } from "./Theme";
@@ -132,6 +133,7 @@ export function MobileBar({
         <div className="flex items-center gap-1 p-2">
           <Dropdown
             align="start"
+            menuClassName="w-52 min-w-0"
             trigger={
               <span className="btn btn-ghost btn-sm btn-square">
                 <EllipsisVertical className="text-base-content/60 h-5 w-5" />
@@ -139,9 +141,22 @@ export function MobileBar({
             }
           >
             {(docuConfig.navbar?.menu || []).map((item) => (
-              <DropdownLink key={item.href} href={item.href}>
-                {item.title}
-              </DropdownLink>
+              <li
+                key={item.href}
+                role="menuitem"
+                className="text-base-content/80 hover:text-base-content hover:bg-base-200 cursor-pointer"
+              >
+                <Anchor
+                  href={item.href}
+                  activeWhen={(path: string) =>
+                    path === item.href || path.startsWith(item.href + "/")
+                  }
+                  activeClassName="text-primary font-semibold"
+                  className="block rounded px-2 py-2 text-sm"
+                >
+                  {item.title}
+                </Anchor>
+              </li>
             ))}
           </Dropdown>
 

package/.docu/components/Sublink.tsx

@@ -33,6 +33,9 @@ export default function Sublink({
     return currentPathname.startsWith(fullHref) && currentPathname !== fullHref;
   });
 
+  // Shared padding based on nesting level
+  const levelPadding = cn(level === 1 && "pl-2", level === 2 && "pl-4", level >= 3 && "pl-6");
+
   // Leaf node (no children)
   if (!items) {
     const isActive = currentPathname === fullHref || currentPathname === `${fullHref}.html`;
@@ -52,7 +55,8 @@ export default function Sublink({
       <div
         className={cn(
           "py-1.5",
-          level >= 2 && "border-l-2 pl-3",
+          levelPadding,
+          level >= 2 && "border-l-2",
           level >= 2 && (isActive ? "border-primary" : "border-base-300")
         )}
       >
@@ -63,7 +67,7 @@ export default function Sublink({
 
   // Section with children
   return (
-    <div className="flex flex-col">
+    <div className={cn("flex flex-col", levelPadding)}>
       {/* Section header */}
       <button
         type="button"

package/.docu/components/Theme.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { Moon, Sun } from "lucide-react";
-import { ThemeControllerToggle } from "./base/theme-controller";
+import { ThemeControllerToggle } from "@docubook/ui-react/theme-controller";
 
 interface ThemeToggleProps {
   className?: string;

package/.docu/components/registry.ts

@@ -1,56 +1,32 @@
 import type { ComponentType } from "react";
 import { createMdxComponents } from "@docubook/mdx-content";
-import {
-  Dropdown,
-  DropdownItem,
-  DropdownLink,
-  DropdownLabel,
-  DropdownDivider,
-} from "./base/dropdown";
-import {
-  Pagination,
-  PaginationItem,
-  PaginationButtons,
-  PaginationRange,
-  PaginationInfo,
-  PaginationFull,
-  PaginationDocs,
-} from "./base/pagination";
-import { Toggle, ToggleGroup } from "./base/toggle";
-import {
-  ThemeController,
-  ThemeControllerToggle,
-  ThemeControllerSelect,
-  ThemeControllerRadio,
-} from "./base/theme-controller";
+import { Dropdown, DropdownItem, DropdownLink } from "@docubook/ui-react/dropdown";
+import { PaginationDocs } from "@docubook/ui-react/pagination";
+import { Toggle, ToggleGroup } from "@docubook/ui-react/toggle";
+import { ThemeControllerToggle } from "@docubook/ui-react/theme-controller";
 import {
   Breadcrumb,
   BreadcrumbItem,
-  BreadcrumbLink,
   BreadcrumbPage,
-  BreadcrumbSeparator,
   BreadcrumbList,
-} from "./base/breadcrumbs";
-import Collapse, { Accordion } from "./base/collapse";
+} from "@docubook/ui-react/breadcrumbs";
+import { Collapse, Accordion } from "@docubook/ui-react/collapse";
 import {
   Drawer,
   useDrawerState,
   DrawerTrigger,
   DrawerContent,
   DrawerSidePanel,
-} from "./base/drawer";
-import { Input, InputGroup } from "./base/input";
-import { Kbd, FnKey } from "./base/kbd";
-import { Modal, ModalAction, useModal } from "./base/modal";
+} from "@docubook/ui-react/drawer";
+import { Input, InputGroup } from "@docubook/ui-react/input";
+import { Kbd, FnKey } from "@docubook/ui-react/kbd";
+import { Modal, useModal } from "@docubook/ui-react/modal";
 import {
   Navbar as BaseNavbar,
-  NavbarContainer,
   Logo as BaseLogo,
   NavMenu as BaseNavMenu,
   NavMenuLink,
-  NavToggle,
-  NavbarVersion,
-} from "./base/navbar";
+} from "@docubook/ui-react/navbar";
 import PaginationComp from "./Pagination";
 import Anchor from "./Anchor";
 import { Footer } from "./Footer";
@@ -71,40 +47,17 @@ import {
 import Search from "./Search";
 import Sidebar from "./Sidebar";
 
-export { Dropdown, DropdownItem, DropdownLink, DropdownLabel, DropdownDivider };
-export {
-  Pagination,
-  PaginationItem,
-  PaginationButtons,
-  PaginationRange,
-  PaginationInfo,
-  PaginationFull,
-  PaginationDocs,
-};
+export { Dropdown, DropdownItem, DropdownLink };
+export { PaginationDocs };
 export { Toggle, ToggleGroup };
-export { ThemeController, ThemeControllerToggle, ThemeControllerSelect, ThemeControllerRadio };
-export {
-  Breadcrumb,
-  BreadcrumbItem,
-  BreadcrumbLink,
-  BreadcrumbPage,
-  BreadcrumbSeparator,
-  BreadcrumbList,
-};
+export { ThemeControllerToggle };
+export { Breadcrumb, BreadcrumbItem, BreadcrumbPage, BreadcrumbList };
 export { Collapse, Accordion };
 export { Drawer, useDrawerState, DrawerTrigger, DrawerContent, DrawerSidePanel };
 export { Input, InputGroup };
 export { Kbd, FnKey };
-export { Modal, ModalAction, useModal };
-export {
-  BaseNavbar,
-  NavbarContainer,
-  BaseLogo,
-  BaseNavMenu,
-  NavMenuLink,
-  NavToggle,
-  NavbarVersion,
-};
+export { Modal, useModal };
+export { BaseNavbar, BaseLogo, BaseNavMenu, NavMenuLink };
 export { Footer };
 export { ThemeToggle };
 export { Context };
@@ -122,16 +75,8 @@ const BASE_COMPONENTS = {
   Dropdown,
   DropdownItem,
   DropdownLink,
-  DropdownLabel,
-  DropdownDivider,
 
   // Pagination
-  Pagination,
-  PaginationItem,
-  PaginationButtons,
-  PaginationRange,
-  PaginationInfo,
-  PaginationFull,
   PaginationDocs,
 
   // Toggle
@@ -139,17 +84,12 @@ const BASE_COMPONENTS = {
   ToggleGroup,
 
   // Theme
-  ThemeController,
   ThemeControllerToggle,
-  ThemeControllerSelect,
-  ThemeControllerRadio,
 
   // Breadcrumb
   Breadcrumb,
   BreadcrumbItem,
-  BreadcrumbLink,
   BreadcrumbPage,
-  BreadcrumbSeparator,
   BreadcrumbList,
 
   // Accordion
@@ -173,17 +113,13 @@ const BASE_COMPONENTS = {
 
   // Modal
   Modal,
-  ModalAction,
   useModal,
 
   // Base Navbar
   BaseNavbar,
-  NavbarContainer,
   BaseLogo,
   BaseNavMenu,
   NavMenuLink,
-  NavToggle,
-  NavbarVersion,
 } as const;
 
 const APP_COMPONENTS = {
@@ -216,15 +152,13 @@ export function createComponentsRegistry(): Record<string, unknown> {
 export async function createFullComponentsRegistry(): Promise<Record<string, unknown>> {
   const baseComponents = createComponentsRegistry();
 
-  let mdxComponents: ComponentRegistry = {};
   try {
     const mdx = createMdxComponents() as unknown as ComponentRegistry;
-    mdxComponents = mdx;
-  } catch {
-    // MDX components not available
+    return { ...baseComponents, ...mdx };
+  } catch (error) {
+    console.error("Failed to load MDX components:", error);
+    return { ...baseComponents };
   }
-
-  return { ...baseComponents, ...mdxComponents };
 }
 
 export const componentsRegistry = createComponentsRegistry();

package/.docu/node/build.ts

@@ -83,7 +83,11 @@ async function findMdxFiles(dir: string, baseDir = ""): Promise<{ path: string;
   return files;
 }
 
-function shouldRebuild(path: string, mtime: number, cache: BuildCache): boolean {
+export function parseConcurrency(): number {
+  return Math.max(1, parseInt(process.env.BUILD_CONCURRENCY || "10", 10) || 10);
+}
+
+export function shouldRebuild(path: string, mtime: number, cache: BuildCache): boolean {
   const cached = cache[path];
   if (!cached) return true;
   return mtime > cached.builtAt;
@@ -212,7 +216,7 @@ async function build() {
     .filter((p): p is string => p !== null);
   const gitDates = await getGitLastModifiedBatch(allRelPaths);
 
-  const CONCURRENCY = Math.max(1, parseInt(process.env.BUILD_CONCURRENCY || "10", 10) || 10);
+  const CONCURRENCY = parseConcurrency();
   const buildTasks = [];
   const errors: string[] = [];
 

package/.docu/node/client.ts

@@ -5,16 +5,9 @@ import { createMdxComponents } from "@docubook/mdx-content";
 import Sidebar, { MobileBar } from "../components/Sidebar";
 import Toc from "../components/Toc";
 import { ThemeToggle } from "../components/Theme";
+import { safeParseTocs } from "./parse-tocs";
 import type { TocItem } from "./types";
 
-function safeParseTocs(raw: string | undefined): TocItem[] {
-  try {
-    return JSON.parse(raw || "[]");
-  } catch {
-    return [];
-  }
-}
-
 function mountIsland(
   id: string,
   render: (el: HTMLElement) => React.ReactElement,

package/.docu/node/html.ts

@@ -29,3 +29,15 @@ export function htmlShell(opts: HtmlShellOptions): string {
 </body>
 </html>`;
 }
+
+export function hmrScript(nonce: string): string {
+  return `<script nonce="${Bun.escapeHTML(nonce)}">
+(function(){
+  const es = new EventSource("/__hmr");
+  es.onmessage = function(e) {
+    if (e.data === "reload") window.location.reload();
+  };
+  es.onerror = function() { es.close(); setTimeout(() => { window.location.reload(); }, 2000); };
+})();
+</script>`;
+}

package/.docu/node/parse-tocs.ts

@@ -0,0 +1,10 @@
+import type { TocItem } from "./types";
+
+export function safeParseTocs(raw: string | undefined): TocItem[] {
+  try {
+    const parsed = JSON.parse(raw || "[]");
+    return Array.isArray(parsed) ? parsed : [];
+  } catch {
+    return [];
+  }
+}

package/.docu/node/search-indexer.ts

@@ -56,7 +56,19 @@ function slugify(text: string): string {
     .replace(/^-+|-+$/g, "");
 }
 
-function extractRecords(filePath: string, raw: string): SearchRecord[] {
+export function stripJsx(content: string): string {
+  let result = content;
+  let prev = "";
+  while (result !== prev) {
+    prev = result;
+    result = result
+      .replace(/<[A-Z][\w.]*[\s\S]*?\/>/g, "")
+      .replace(/<[A-Z][\w.]*[\s\S]*?>([\s\S]*?)<\/[A-Z][\w.]*>/g, "$1");
+  }
+  return result;
+}
+
+export function extractRecords(filePath: string, raw: string): SearchRecord[] {
   const { frontmatter, strippedContent: content } = extractFrontmatterWithContent<Frontmatter>(raw);
   const records: SearchRecord[] = [];
   const url = `/docs/${filePath}`;
@@ -82,7 +94,8 @@ function extractRecords(filePath: string, raw: string): SearchRecord[] {
     });
   }
 
-  const lines = content.split("\n");
+  const plainContent = stripJsx(content);
+  const lines = plainContent.split("\n");
   let currentParagraph: string[] = [];
   let inCodeBlock = false;
 
@@ -119,7 +132,6 @@ function extractRecords(filePath: string, raw: string): SearchRecord[] {
     if (inCodeBlock) continue;
 
     if (/^import\s+[\w{*]/.test(trimmed) || /^export\s+[\w{*]/.test(trimmed)) continue;
-    if (/^<\/?[A-Z][\w.]*[\s/>]/.test(trimmed) && !/>(.+)<\//.test(trimmed)) continue;
 
     const headingMatch = trimmed.match(/^(#{1,6})\s+(.+)$/);
     if (headingMatch) {
@@ -152,6 +164,8 @@ function extractRecords(filePath: string, raw: string): SearchRecord[] {
       continue;
     }
 
+    if (/^\|.+\|/.test(trimmed)) continue;
+
     const cleaned = trimmed
       .replace(/^[-*+]\s+/, "") // list markers
       .replace(/^\d+\.\s+/, "") // ordered list

package/.docu/node/server.ts

@@ -16,7 +16,7 @@ import { generateSearchIndex } from "./search-indexer";
 import { logger } from "./logger";
 import { initSentry, captureException } from "./sentry";
 import { SECURITY_HEADERS, generateNonce, htmlResponse } from "./security";
-import { htmlShell as createHtmlShell } from "./html";
+import { htmlShell as createHtmlShell, hmrScript } from "./html";
 
 const docuConfig = loadDocuConfig();
 
@@ -50,18 +50,6 @@ try {
 
 const hmrClients = new Set<ReadableStreamDefaultController>();
 
-function hmrScript(nonce: string): string {
-  return `<script nonce="${Bun.escapeHTML(nonce)}">
-(function(){
-  const es = new EventSource("/__hmr");
-  es.onmessage = function(e) {
-    if (e.data === "reload") window.location.reload();
-  };
-  es.onerror = function() { es.close(); setTimeout(() => { window.location.reload(); }, 2000); };
-})();
-</script>`;
-}
-
 let hmrTimeout: ReturnType<typeof setTimeout> | null = null;
 const watcher = watch(DOCS_DIR, { recursive: true }, (_event, filename) => {
   if (!filename || (!filename.endsWith(".mdx") && !filename.endsWith(".md"))) return;

package/.docu/node/utils.ts

@@ -7,7 +7,8 @@ export function isExternalUrl(url: string): boolean {
 export function getPath(url: string): string {
   try {
     return new URL(url).pathname;
-  } catch {
+  } catch (err) {
+    console.error("Failed to parse URL", url, err);
     return url;
   }
 }
@@ -28,7 +29,8 @@ export async function getGitLastModified(filePath: string): Promise<string | nul
     const text = await new Response(proc.stdout).text();
     const date = text.trim();
     return date || null;
-  } catch {
+  } catch (err) {
+    console.error("Failed to get git last modified for", filePath, err);
     return null;
   }
 }
@@ -55,8 +57,8 @@ export async function getGitLastModifiedBatch(filePaths: string[]): Promise<Map<
         result.set(trimmed, currentDate);
       }
     }
-  } catch {
-    // fallback: return empty map, callers use frontmatter date
+  } catch (err) {
+    console.error("Failed to get git last modified batch for", filePaths, err);
   }
 
   return result;

package/.docu/pages/docs/[[...slug]].tsx

@@ -1,4 +1,5 @@
 import type { ReactNode } from "react";
+import { ChevronLeft, ChevronRight } from "lucide-react";
 import DocsBreadcrumb from "../../components/Breadcrumb";
 import Pagination from "../../components/Pagination";
 import { Typography } from "../../components/Typography";
@@ -72,7 +73,11 @@ export default function DocsPage({
                 </p>
               )}
             </div>
-            <Pagination pathname={pathname} />
+            <Pagination
+              pathname={pathname}
+              prevIcon={<ChevronLeft className="h-3 w-3" />}
+              nextIcon={<ChevronRight className="h-3 w-3" />}
+            />
             <Footer />
           </Typography>
         </div>

package/.docu/styles/globals.css

@@ -126,6 +126,14 @@
       background-color 0.2s ease,
       color 0.2s ease;
   }
+
+  /* Remove default summary marker from details elements */
+  summary::-webkit-details-marker {
+    display: none;
+  }
+  summary::marker {
+    display: none;
+  }
 }
 
 /* Code block utilities */

package/README.md

@@ -16,12 +16,12 @@
 
 ```bash
 mkdir my-docs && cd my-docs
-bun add @docubook/flame@beta
+bun add @docubook/flame
 bunx flame init
 bun run dev
 ```
 
-> 📦 **Lightweight** — ~57 kB packed, ~207 kB unpacked. No bloat, just fire.
+> **Lightweight** — 📦 ~57 kB packed, ~207 kB unpacked. No bloat, just fire.
 
 ## Features
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@docubook/flame",
-  "version": "1.0.0-beta.80",
+  "version": "1.0.1",
   "description": "A blazing-fast React + MDX framework powered by Bun, built for modern documentation experiences.",
   "type": "module",
   "bin": {
@@ -30,12 +30,15 @@
     "static-site",
     "daisyui",
     "bun",
-    "docs framework"
+    "docs framework",
+    "react",
+    "react-dom"
   ],
   "homepage": "https://docubook.pro/",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/DocuBook/docubook.git"
+    "url": "git+https://github.com/DocuBook/docubook.git",
+    "directory": "packages/flame"
   },
   "author": "wildan.nrs",
   "author-url": "https://wildan.dev",
@@ -48,8 +51,9 @@
     "lucide-react": "^1.14.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
+    "@docubook/mdx-content": "^3.2.1",
     "@docubook/core": "^1.7.0",
-    "@docubook/mdx-content": "^3.2.1"
+    "@docubook/ui-react": "^0.1.2"
   },
   "peerDependencies": {
     "@sentry/bun": "^9.0.0"