boltdocs 1.0.0 → 1.0.4

package/dist/node/index.mjs

@@ -1,10 +1,3 @@
-import {
-  CONFIG_FILES,
-  init_config,
-  resolveConfig
-} from "../chunk-X2TDGMTR.mjs";
-import "../chunk-X6BYQHVC.mjs";
-
 // src/node/plugin/index.ts
 import { loadEnv } from "vite";
 
@@ -338,12 +331,60 @@ async function generateRoutes(docsDir, config, basePath = "/docs") {
 }
 
 // src/node/plugin/index.ts
-init_config();
 import { ViteImageOptimizer } from "vite-plugin-image-optimizer";
 
-// src/node/ssg/index.ts
-import fs2 from "fs";
+// src/node/config.ts
 import path2 from "path";
+import { pathToFileURL } from "url";
+import fs2 from "fs";
+var CONFIG_FILES = [
+  "boltdocs.config.js",
+  "boltdocs.config.mjs",
+  "boltdocs.config.ts"
+];
+async function resolveConfig(docsDir) {
+  const projectRoot = process.cwd();
+  const defaults = {
+    docsDir: path2.resolve(docsDir),
+    themeConfig: {
+      title: "Boltdocs",
+      description: "A Vite documentation framework",
+      navbar: [
+        { text: "Home", link: "/" },
+        { text: "Documentation", link: "/docs" }
+      ]
+    }
+  };
+  for (const filename of CONFIG_FILES) {
+    const configPath = path2.resolve(projectRoot, filename);
+    if (fs2.existsSync(configPath)) {
+      try {
+        const fileUrl = pathToFileURL(configPath).href + "?t=" + Date.now();
+        const mod = await import(fileUrl);
+        const userConfig = mod.default || mod;
+        const userThemeConfig = userConfig.themeConfig || userConfig;
+        return {
+          docsDir: path2.resolve(docsDir),
+          themeConfig: {
+            ...defaults.themeConfig,
+            ...userThemeConfig
+          },
+          i18n: userConfig.i18n,
+          versions: userConfig.versions,
+          siteUrl: userConfig.siteUrl,
+          plugins: userConfig.plugins || []
+        };
+      } catch (e) {
+        console.warn(`[boltdocs] Failed to load config from ${filename}:`, e);
+      }
+    }
+  }
+  return defaults;
+}
+
+// src/node/ssg/index.ts
+import fs3 from "fs";
+import path3 from "path";
 import { fileURLToPath } from "url";
 import { createRequire } from "module";
 
@@ -407,15 +448,15 @@ ${entries.map(
 
 // src/node/ssg/index.ts
 var _filename = fileURLToPath(import.meta.url);
-var _dirname = path2.dirname(_filename);
+var _dirname = path3.dirname(_filename);
 var _require = createRequire(import.meta.url);
 async function generateStaticPages(options) {
   const { docsDir, outDir, config } = options;
   const routes = await generateRoutes(docsDir, config);
   const siteTitle = config?.themeConfig?.title || "Boltdocs";
   const siteDescription = config?.themeConfig?.description || "";
-  const ssrModulePath = path2.resolve(_dirname, "../client/ssr.js");
-  if (!fs2.existsSync(ssrModulePath)) {
+  const ssrModulePath = path3.resolve(_dirname, "../client/ssr.js");
+  if (!fs3.existsSync(ssrModulePath)) {
     console.error(
       "[boltdocs] SSR module not found at",
       ssrModulePath,
@@ -424,12 +465,12 @@ async function generateStaticPages(options) {
     return;
   }
   const { render } = _require(ssrModulePath);
-  const templatePath = path2.join(outDir, "index.html");
-  if (!fs2.existsSync(templatePath)) {
+  const templatePath = path3.join(outDir, "index.html");
+  if (!fs3.existsSync(templatePath)) {
     console.warn("[boltdocs] No index.html found in outDir, skipping SSG.");
     return;
   }
-  const template = fs2.readFileSync(templatePath, "utf-8");
+  const template = fs3.readFileSync(templatePath, "utf-8");
   let homePageComp;
   if (config?._homePagePath) {
     try {
@@ -455,10 +496,10 @@ async function generateStaticPages(options) {
           title: escapeHtml(pageTitle),
           description: escapeHtml(pageDescription)
         }).replace("<!--app-html-->", appHtml).replace(`<div id="root"></div>`, `<div id="root">${appHtml}</div>`);
-        const routeDir = path2.join(outDir, route.path);
-        await fs2.promises.mkdir(routeDir, { recursive: true });
-        await fs2.promises.writeFile(
-          path2.join(routeDir, "index.html"),
+        const routeDir = path3.join(outDir, route.path);
+        await fs3.promises.mkdir(routeDir, { recursive: true });
+        await fs3.promises.writeFile(
+          path3.join(routeDir, "index.html"),
           html,
           "utf-8"
         );
@@ -471,14 +512,14 @@ async function generateStaticPages(options) {
     routes.map((r) => r.path),
     config
   );
-  fs2.writeFileSync(path2.join(outDir, "sitemap.xml"), sitemap, "utf-8");
+  fs3.writeFileSync(path3.join(outDir, "sitemap.xml"), sitemap, "utf-8");
   console.log(
     `[boltdocs] Generated ${routes.length} static pages + sitemap.xml`
   );
 }
 
 // src/node/plugin/index.ts
-import path3 from "path";
+import path4 from "path";
 
 // src/node/plugin/entry.ts
 function generateEntryCode(options, config) {
@@ -489,8 +530,8 @@ function generateEntryCode(options, config) {
   const componentImports = pluginComponents.map(
     ([
       name,
-      path4
-    ]) => `import * as _comp_${name} from '${normalizePath(path4)}';
+      path5
+    ]) => `import * as _comp_${name} from '${normalizePath(path5)}';
 const ${name} = _comp_${name}.default || _comp_${name}['${name}'] || _comp_${name};`
   ).join("\n");
   const componentMap = pluginComponents.map(([name]) => name).join(", ");
@@ -560,7 +601,7 @@ ${themeScript}  </head>`);
 
 // src/node/plugin/index.ts
 function boltdocsPlugin(options = {}, passedConfig) {
-  const docsDir = path3.resolve(process.cwd(), options.docsDir || "docs");
+  const docsDir = path4.resolve(process.cwd(), options.docsDir || "docs");
   const normalizedDocsDir = normalizePath(docsDir);
   let config = passedConfig;
   let viteConfig;
@@ -590,7 +631,7 @@ function boltdocsPlugin(options = {}, passedConfig) {
       },
       configureServer(server) {
         const configPaths = CONFIG_FILES.map(
-          (c) => path3.resolve(process.cwd(), c)
+          (c) => path4.resolve(process.cwd(), c)
         );
         server.watcher.add(configPaths);
         const handleFileEvent = async (file, type) => {
@@ -653,7 +694,7 @@ function boltdocsPlugin(options = {}, passedConfig) {
       },
       async closeBundle() {
         if (!isBuild) return;
-        const outDir = viteConfig?.build?.outDir ? path3.resolve(viteConfig.root, viteConfig.build.outDir) : path3.resolve(process.cwd(), "dist");
+        const outDir = viteConfig?.build?.outDir ? path4.resolve(viteConfig.root, viteConfig.build.outDir) : path4.resolve(process.cwd(), "dist");
         await generateStaticPages({ docsDir, outDir, config });
       }
     },
@@ -707,7 +748,6 @@ function boltdocsMdxPlugin(config) {
 }
 
 // src/node/index.ts
-init_config();
 async function boltdocs(options) {
   const docsDir = options?.docsDir || "docs";
   const config = await resolveConfig(docsDir);

package/dist/{index-CRQKWAeo.d.mts → types-CvrzTbEX.d.mts}

@@ -1,10 +1,5 @@
 import React from 'react';
 
-declare global {
-    interface ImportMeta {
-        env: Record<string, any>;
-    }
-}
 /**
  * Metadata provided by the server for a specific route.
  * Maps closely to the `RouteMeta` type in the Node environment.
@@ -56,27 +51,5 @@ interface CreateBoltdocsAppOptions {
     /** Optional custom MDX components provided by plugins */
     components?: Record<string, React.ComponentType<any>>;
 }
-/**
- * Creates and mounts the Boltdocs documentation app.
- *
- * Usage:
- * ```tsx
- * import { createBoltdocsApp } from 'boltdocs/client'
- * import routes from 'virtual:boltdocs-routes'
- * import config from 'virtual:boltdocs-config'
- * import 'boltdocs/style.css'
- * import HomePage from './HomePage'
- *
- * createBoltdocsApp({
- *   target: '#root',
- *   routes,
- *   config,
- *   modules: import.meta.glob('/docs/**\/*.{md,mdx}'),
- *   hot: import.meta.hot,
- *   homePage: HomePage,
- * })
- * ```
- */
-declare function createBoltdocsApp(options: CreateBoltdocsAppOptions): void;
 
-export { type ComponentRoute as C, type CreateBoltdocsAppOptions as a, createBoltdocsApp as c };
+export type { CreateBoltdocsAppOptions as C, ComponentRoute as a };

package/dist/{index-CRQKWAeo.d.ts → types-CvrzTbEX.d.ts}

@@ -1,10 +1,5 @@
 import React from 'react';
 
-declare global {
-    interface ImportMeta {
-        env: Record<string, any>;
-    }
-}
 /**
  * Metadata provided by the server for a specific route.
  * Maps closely to the `RouteMeta` type in the Node environment.
@@ -56,27 +51,5 @@ interface CreateBoltdocsAppOptions {
     /** Optional custom MDX components provided by plugins */
     components?: Record<string, React.ComponentType<any>>;
 }
-/**
- * Creates and mounts the Boltdocs documentation app.
- *
- * Usage:
- * ```tsx
- * import { createBoltdocsApp } from 'boltdocs/client'
- * import routes from 'virtual:boltdocs-routes'
- * import config from 'virtual:boltdocs-config'
- * import 'boltdocs/style.css'
- * import HomePage from './HomePage'
- *
- * createBoltdocsApp({
- *   target: '#root',
- *   routes,
- *   config,
- *   modules: import.meta.glob('/docs/**\/*.{md,mdx}'),
- *   hot: import.meta.hot,
- *   homePage: HomePage,
- * })
- * ```
- */
-declare function createBoltdocsApp(options: CreateBoltdocsAppOptions): void;
 
-export { type ComponentRoute as C, type CreateBoltdocsAppOptions as a, createBoltdocsApp as c };
+export type { CreateBoltdocsAppOptions as C, ComponentRoute as a };

package/package.json

@@ -1,13 +1,10 @@
 {
   "name": "boltdocs",
-  "version": "1.0.0",
+  "version": "1.0.4",
   "description": "A lightweight documentation generator for React projects.",
   "main": "dist/node/index.js",
   "module": "dist/node/index.mjs",
   "types": "dist/node/index.d.ts",
-  "bin": {
-    "boltdocs": "./dist/node/cli/index.js"
-  },
   "publishConfig": {
     "access": "public"
   },
@@ -45,7 +42,6 @@
   "dependencies": {
     "@mdx-js/react": "^3.1.1",
     "@mdx-js/rollup": "^3.1.1",
-    "cac": "^7.0.0",
     "fast-glob": "^3.3.3",
     "github-slugger": "^2.0.0",
     "gray-matter": "^4.0.3",

package/src/client/app/index.tsx

@@ -11,6 +11,7 @@ import { ThemeLayout } from "../theme/ui/Layout";
 import { NotFound } from "../theme/ui/NotFound";
 import { Loading } from "../theme/ui/Loading";
 import { MDXProvider } from "@mdx-js/react";
+import { ComponentRoute, CreateBoltdocsAppOptions } from "../types";
 import {
   createContext,
   useContext,
@@ -134,55 +135,6 @@ const mdxComponents = {
   List,
 };
 
-/**
- * Metadata provided by the server for a specific route.
- * Maps closely to the `RouteMeta` type in the Node environment.
- */
-export interface ComponentRoute {
-  /** The final URL path */
-  path: string;
-  /** The absolute filesystem path of the source file */
-  componentPath: string;
-  /** The page title */
-  title: string;
-  /** Explicit order in the sidebar */
-  sidebarPosition?: number;
-  /** The relative path from the docs directory */
-  filePath: string;
-  /** The group directory name */
-  group?: string;
-  /** The display title of the group */
-  groupTitle?: string;
-  /** Explicit order of the group in the sidebar */
-  groupPosition?: number;
-  /** Extracted markdown headings for search indexing */
-  headings?: { level: number; text: string; id: string }[];
-  /** The locale this route belongs to, if i18n is configured */
-  locale?: string;
-  /** The version this route belongs to, if versioning is configured */
-  version?: string;
-}
-
-/**
- * Configuration options for initializing the Boltdocs client app.
- */
-export interface CreateBoltdocsAppOptions {
-  /** CSS selector for the DOM element where the app should mount (e.g. '#root') */
-  target: string;
-  /** Initial routes generated by the Vite plugin (`virtual:boltdocs-routes`) */
-  routes: ComponentRoute[];
-  /** Site configuration (`virtual:boltdocs-config`) */
-  config: any;
-  /** Dynamic import mapping from `import.meta.glob` for the documentation pages */
-  modules: Record<string, () => Promise<any>>;
-  /** The `import.meta.hot` instance necessary for fast refresh/HMR updates */
-  hot?: any;
-  /** Optional custom React component to render when visiting the root path ('/') */
-  homePage?: React.ComponentType;
-  /** Optional custom MDX components provided by plugins */
-  components?: Record<string, React.ComponentType<any>>;
-}
-
 export function AppShell({
   initialRoutes,
   initialConfig,
@@ -412,11 +364,10 @@ export function createBoltdocsApp(options: CreateBoltdocsAppOptions) {
     </React.StrictMode>
   );
 
-  // In production (built app), the HTML is pre-rendered by SSG, so we hydrate.
-  // In development, the root is empty, so we createRoot.
-  if (import.meta.env.PROD && container.innerHTML.trim() !== "") {
-    ReactDOM.hydrateRoot(container as HTMLElement, app);
-  } else {
-    ReactDOM.createRoot(container as HTMLElement).render(app);
-  }
+  // SSG pre-renders a shell with mock components for SEO crawlers.
+  // We always use createRoot because the SSG output doesn't match the
+  // real client-side component tree (components are lazy/dynamic).
+  // Clear any SSG placeholder content before mounting.
+  container.innerHTML = "";
+  ReactDOM.createRoot(container as HTMLElement).render(app);
 }

package/src/client/app/preload.tsx

@@ -1,5 +1,5 @@
 import React, { createContext, useContext, useCallback } from "react";
-import { ComponentRoute } from "./index";
+import { ComponentRoute } from "../types";
 
 interface PreloadContextType {
   preload: (path: string) => void;

package/src/client/index.ts

@@ -1,5 +1,5 @@
 export type { BoltdocsConfig, BoltdocsThemeConfig } from "../node/config";
-export type { ComponentRoute, CreateBoltdocsAppOptions } from "./app";
+export type { ComponentRoute, CreateBoltdocsAppOptions } from "./types";
 export { createBoltdocsApp } from "./app";
 export { ThemeLayout } from "./theme/ui/Layout";
 export { Navbar } from "./theme/ui/Navbar";

package/src/client/ssr.tsx

@@ -1,7 +1,8 @@
 import React from "react";
 import ReactDOMServer from "react-dom/server";
 import { StaticRouter } from "react-router-dom/server";
-import { AppShell, ComponentRoute } from "./app";
+import { AppShell } from "./app";
+import { ComponentRoute } from "./types";
 
 /**
  * Options for rendering the Boltdocs application on the server (SSG).

package/src/client/theme/components/Playground/Playground.tsx

@@ -7,17 +7,52 @@ interface PlaygroundProps {
   children?: string | React.ReactNode;
   scope?: Record<string, any>;
   readonly?: boolean;
+  noInline?: boolean;
+}
+
+/**
+ * Transforms code that uses `export default` into a format compatible
+ * with react-live's `noInline` mode by stripping the export and
+ * appending a `render(<ComponentName />)` call.
+ */
+function prepareCode(raw: string): { code: string; noInline: boolean } {
+  const trimmed = raw.trim();
+
+  // Match: export default function Name(...)
+  const fnMatch = trimmed.match(/export\s+default\s+function\s+(\w+)/);
+  if (fnMatch) {
+    const name = fnMatch[1];
+    const code =
+      trimmed.replace(/export\s+default\s+/, "") + `\n\nrender(<${name} />);`;
+    return { code, noInline: true };
+  }
+
+  // Match: export default ComponentName  (at the end)
+  const varMatch = trimmed.match(/export\s+default\s+(\w+)\s*;?\s*$/);
+  if (varMatch) {
+    const name = varMatch[1];
+    const code =
+      trimmed.replace(/export\s+default\s+\w+\s*;?\s*$/, "") +
+      `\nrender(<${name} />);`;
+    return { code, noInline: true };
+  }
+
+  // No export default — use inline mode (simple JSX expression)
+  return { code: trimmed, noInline: false };
 }
 
 /**
  * A live React playground component.
  * Features a split layout with a live editor and a preview section.
+ *
+ * Supports `export default function App()` style code out of the box.
  */
 export function Playground({
   code,
   children,
   scope = {},
   readonly = false,
+  noInline: forceNoInline,
 }: PlaygroundProps) {
   // Extract code from either `code` prop or `children`
   let initialCode = code || "";
@@ -25,8 +60,11 @@ export function Playground({
     initialCode = children;
   }
 
+  const prepared = prepareCode(initialCode);
+  const useNoInline = forceNoInline ?? prepared.noInline;
+
   const [copied, setCopied] = useState(false);
-  const [activeCode, setActiveCode] = useState(initialCode.trim());
+  const [activeCode, setActiveCode] = useState(prepared.code);
 
   const handleCopy = () => {
     navigator.clipboard.writeText(activeCode);
@@ -43,7 +81,7 @@ export function Playground({
         code={activeCode}
         scope={extendedScope}
         theme={undefined}
-        noInline={false}
+        noInline={useNoInline}
       >
         <div className="playground-split-container">
           {/* Editor Side */}

package/src/client/theme/styles/markdown.css

@@ -265,12 +265,12 @@
 }
 
 .code-block-wrapper pre > code {
-  padding: 1.25rem !important;
-  display: block !important;
+  display: grid !important;
+  padding: 1.25rem 1rem !important;
 }
 
 .code-block-wrapper pre > code .line {
-  padding: 0;
+  padding: 0 1.25rem;
 }
 
 /* Default pre (without wrapper) */

package/src/client/theme/ui/Breadcrumbs/Breadcrumbs.tsx

@@ -2,7 +2,7 @@ import React from "react";
 import { useLocation } from "react-router-dom";
 import { Link } from "../Link";
 import { Home, ChevronRight } from "lucide-react";
-import { ComponentRoute } from "../../../app";
+import { ComponentRoute } from "../../../types";
 import { BoltdocsConfig } from "../../../../node/config";
 
 export interface BreadcrumbsProps {

package/src/client/theme/ui/LanguageSwitcher/LanguageSwitcher.tsx

@@ -2,7 +2,7 @@ import React, { useState, useRef, useEffect } from "react";
 import { Globe, ChevronDown } from "lucide-react";
 import { useNavigate, useLocation } from "react-router-dom";
 import { BoltdocsI18nConfig } from "../../../../node/config";
-import { ComponentRoute } from "../../../app";
+import { ComponentRoute } from "../../../types";
 
 function getBaseFilePath(
   filePath: string,

package/src/client/theme/ui/Layout/Layout.tsx

@@ -4,7 +4,7 @@ import { Link } from "../Link";
 import { ChevronLeft, ChevronRight, Menu } from "lucide-react";
 import { usePreload } from "../../../app/preload";
 import { BoltdocsConfig } from "../../../../node/config";
-import { ComponentRoute } from "../../../app";
+import { ComponentRoute } from "../../../types";
 export { Navbar } from "../Navbar";
 export { Sidebar } from "../Sidebar";
 export { OnThisPage } from "../OnThisPage";

package/src/client/theme/ui/Navbar/Navbar.tsx

@@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react";
 import { Link } from "../Link";
 import { Book, ChevronDown } from "lucide-react";
 import { BoltdocsConfig } from "../../../../node/config";
-import { ComponentRoute } from "../../../app";
+import { ComponentRoute } from "../../../types";
 import { LanguageSwitcher } from "../LanguageSwitcher";
 import { VersionSwitcher } from "../VersionSwitcher";
 import { ThemeToggle } from "../ThemeToggle";

package/src/client/theme/ui/SearchDialog/SearchDialog.tsx

@@ -2,7 +2,7 @@ import React, { useState, useEffect, useRef } from "react";
 import { createPortal } from "react-dom";
 import { Link } from "../Link";
 import { Search } from "lucide-react";
-import { ComponentRoute } from "../../../app";
+import { ComponentRoute } from "../../../types";
 
 interface SearchResult {
   title: string;

package/src/client/theme/ui/VersionSwitcher/VersionSwitcher.tsx

@@ -2,7 +2,7 @@ import { useState, useRef, useEffect } from "react";
 import { Layers, ChevronDown } from "lucide-react";
 import { useNavigate, useLocation } from "react-router-dom";
 import { BoltdocsVersionsConfig } from "../../../../node/config";
-import { ComponentRoute } from "../../../app";
+import { ComponentRoute } from "../../../types";
 
 function getBaseFilePath(
   filePath: string,

package/src/client/types.ts

@@ -0,0 +1,50 @@
+import React from "react";
+
+/**
+ * Metadata provided by the server for a specific route.
+ * Maps closely to the `RouteMeta` type in the Node environment.
+ */
+export interface ComponentRoute {
+  /** The final URL path */
+  path: string;
+  /** The absolute filesystem path of the source file */
+  componentPath: string;
+  /** The page title */
+  title: string;
+  /** Explicit order in the sidebar */
+  sidebarPosition?: number;
+  /** The relative path from the docs directory */
+  filePath: string;
+  /** The group directory name */
+  group?: string;
+  /** The display title of the group */
+  groupTitle?: string;
+  /** Explicit order of the group in the sidebar */
+  groupPosition?: number;
+  /** Extracted markdown headings for search indexing */
+  headings?: { level: number; text: string; id: string }[];
+  /** The locale this route belongs to, if i18n is configured */
+  locale?: string;
+  /** The version this route belongs to, if versioning is configured */
+  version?: string;
+}
+
+/**
+ * Configuration options for initializing the Boltdocs client app.
+ */
+export interface CreateBoltdocsAppOptions {
+  /** CSS selector for the DOM element where the app should mount (e.g. '#root') */
+  target: string;
+  /** Initial routes generated by the Vite plugin (`virtual:boltdocs-routes`) */
+  routes: ComponentRoute[];
+  /** Site configuration (`virtual:boltdocs-config`) */
+  config: any;
+  /** Dynamic import mapping from `import.meta.glob` for the documentation pages */
+  modules: Record<string, () => Promise<any>>;
+  /** The `import.meta.hot` instance necessary for fast refresh/HMR updates */
+  hot?: any;
+  /** Optional custom React component to render when visiting the root path ('/') */
+  homePage?: React.ComponentType;
+  /** Optional custom MDX components provided by plugins */
+  components?: Record<string, React.ComponentType<any>>;
+}

package/tsconfig.json

@@ -16,5 +16,6 @@
     "exclude": [
         "node_modules",
         "dist",
+        "src/node/cli"
     ]
 }

package/dist/Playground-OE2OE6B6.mjs

@@ -1,7 +0,0 @@
-import {
-  Playground
-} from "./chunk-PN4GCTYG.mjs";
-import "./chunk-X6BYQHVC.mjs";
-export {
-  Playground
-};