create-fumadocs-app 15.2.0 → 15.2.2

package/dist/{chunk-R4Y2JVJN.js → chunk-ZA7GBGFG.js}

@@ -60,7 +60,7 @@ function tryGitInit(root) {
 }
 
 // src/versions.js
-var versions = { "fumadocs-core": "15.2.0", "fumadocs-ui": "15.2.0", "fumadocs-mdx": "11.5.7", "@fumadocs/mdx-remote": "1.3.0", "@fumadocs/content-collections": "1.1.8" };
+var versions = { "fumadocs-core": "15.2.2", "fumadocs-ui": "15.2.2", "fumadocs-mdx": "11.5.7", "@fumadocs/mdx-remote": "1.3.0", "@fumadocs/content-collections": "1.1.8" };
 
 // ../create-app-versions/package.json
 var package_default = {
@@ -78,10 +78,14 @@ var package_default = {
     "@react-router/serve": "^7.4.1",
     "@tailwindcss/postcss": "^4.0.17",
     "@tailwindcss/vite": "^4.0.17",
+    "@tanstack/react-router": "^1.114.29",
+    "@tanstack/react-start": "^1.114.31",
     "@types/mdx": "^2.0.13",
-    "@types/node": "22.13.14",
+    "@types/node": "22.13.16",
     "@types/react": "^19.0.12",
     "@types/react-dom": "^19.0.4",
+    "@vitejs/plugin-react": "^4.3.4",
+    "fast-glob": "^3.3.3",
     "gray-matter": "^4.0.3",
     isbot: "^5.1.17",
     next: "15.2.4",
@@ -93,7 +97,8 @@ var package_default = {
     shiki: "^3.2.1",
     tailwindcss: "^4.0.17",
     typescript: "^5.8.2",
-    vite: "^6.2.3",
+    vinxi: "^0.5.3",
+    vite: "^6.2.4",
     "vite-tsconfig-paths": "^5.1.4"
   }
 };
@@ -148,23 +153,16 @@ async function create(options) {
   } = options;
   const projectName = path.basename(options.outputDir);
   const dest = path.resolve(cwd, options.outputDir);
-  const isNext = options.template === "content-collections" || options.template === "fuma-docs-mdx";
+  const isNext = options.template.startsWith("+next");
   function defaultRename(file) {
     file = file.replace("example.gitignore", ".gitignore");
-    if (!options.useSrcDir) {
+    if (!options.useSrcDir || !isNext) {
       return file;
     }
-    if (isNext) {
-      for (const dir of ["app", "lib"]) {
-        const relative = path.relative(path.join(dest, dir), file);
-        if (!relative.startsWith(`..${path.sep}`)) {
-          return path.join(dest, "src", dir, relative);
-        }
-      }
-    } else if (options.template === "react-router") {
-      const relative = path.relative(path.join(dest, "app"), file);
+    for (const dir of ["app", "lib"]) {
+      const relative = path.relative(path.join(dest, dir), file);
       if (!relative.startsWith(`..${path.sep}`)) {
-        return path.join(dest, "src", relative);
+        return path.join(dest, "src", dir, relative);
       }
     }
     return file;
@@ -200,7 +198,7 @@ async function create(options) {
     );
     log("Configured ESLint");
   }
-  if (options.useSrcDir) {
+  if (isNext && options.useSrcDir) {
     const tsconfigPath = path.join(dest, "tsconfig.json");
     const content = (await fs.readFile(tsconfigPath)).toString();
     const config = JSON.parse(content);
@@ -289,6 +287,44 @@ function createPackageJson(projectName, options) {
       ])
     };
   }
+  if (options.template === "tanstack-start") {
+    return {
+      name: projectName,
+      type: "module",
+      scripts: {
+        dev: "vinxi dev",
+        build: "NODE_ENV=production vinxi build",
+        start: "vinxi start"
+      },
+      private: true,
+      dependencies: {
+        ...pick(versions, [
+          "@fumadocs/mdx-remote",
+          "fumadocs-ui",
+          "fumadocs-core"
+        ]),
+        ...pick(package_default.dependencies, [
+          "@tanstack/react-router",
+          "@tanstack/react-start",
+          "fast-glob",
+          "gray-matter",
+          "react",
+          "react-dom",
+          "vinxi"
+        ])
+      },
+      devDependencies: pick(package_default.dependencies, [
+        "@tailwindcss/vite",
+        "@types/react",
+        "@types/react-dom",
+        "@vitejs/plugin-react",
+        "tailwindcss",
+        "typescript",
+        "vite",
+        "vite-tsconfig-paths"
+      ])
+    };
+  }
   return {
     name: projectName,
     version: "0.0.0",
@@ -297,14 +333,14 @@ function createPackageJson(projectName, options) {
       build: "next build",
       dev: "next dev",
       start: "next start",
-      ...options.template === "fuma-docs-mdx" ? {
+      ...options.template === "+next+fuma-docs-mdx" ? {
         postinstall: "fumadocs-mdx"
       } : null
     },
     dependencies: {
       ...pick(package_default.dependencies, ["next", "react", "react-dom"]),
       ...pick(versions, ["fumadocs-ui", "fumadocs-core"]),
-      ...options.template === "content-collections" ? {
+      ...options.template === "+next+content-collections" ? {
         ...pick(package_default.dependencies, [
           "@content-collections/mdx",
           "@content-collections/core",
@@ -312,21 +348,21 @@ function createPackageJson(projectName, options) {
         ]),
         ...pick(versions, ["@fumadocs/content-collections"])
       } : null,
-      ...options.template === "fuma-docs-mdx" ? pick(versions, ["fumadocs-mdx"]) : null
+      ...options.template === "+next+fuma-docs-mdx" ? pick(versions, ["fumadocs-mdx"]) : null
     },
     devDependencies: {
       ...pick(package_default.dependencies, [
         "@types/node",
         "@types/react",
         "@types/react-dom",
-        "typescript"
+        "typescript",
+        "@types/mdx"
       ]),
       ...options.tailwindcss ? pick(package_default.dependencies, [
         "@tailwindcss/postcss",
         "tailwindcss",
         "postcss"
       ]) : null,
-      ...options.template === "fuma-docs-mdx" ? pick(package_default.dependencies, ["@types/mdx"]) : null,
       ...options.eslint ? {
         eslint: "^8",
         "eslint-config-next": package_default.dependencies.next

package/dist/create-app.js

@@ -1,6 +1,6 @@
 import {
   create
-} from "./chunk-R4Y2JVJN.js";
+} from "./chunk-ZA7GBGFG.js";
 export {
   create
 };

package/dist/index.js

@@ -3,7 +3,7 @@ import {
   create,
   cwd,
   getPackageManager
-} from "./chunk-R4Y2JVJN.js";
+} from "./chunk-ZA7GBGFG.js";
 
 // src/index.ts
 import fs from "node:fs/promises";
@@ -32,26 +32,37 @@ async function main() {
       }),
       template: () => select({
         message: "Choose a template",
-        initialValue: "fuma-docs-mdx",
+        initialValue: "+next+fuma-docs-mdx",
         options: [
           {
-            value: "fuma-docs-mdx",
+            value: "+next+fuma-docs-mdx",
             label: "Next.js: Fumadocs MDX",
             hint: "recommended"
           },
           {
-            value: "content-collections",
+            value: "+next+content-collections",
             label: "Next.js: Content Collections"
           },
           {
             value: "react-router",
             label: "React Router: MDX Remote"
+          },
+          {
+            value: "tanstack-start",
+            label: "Tanstack Start: MDX Remote",
+            hint: "Experimental"
           }
         ]
       }),
-      src: () => confirm({ message: "Use `/src` directory?", initialValue: false }),
+      src: (v) => {
+        if (!v.results.template?.startsWith("+next")) return;
+        return confirm({
+          message: "Use `/src` directory?",
+          initialValue: false
+        });
+      },
       eslint: (v) => {
-        if (v.results.template === "react-router") return;
+        if (!v.results.template?.startsWith("+next")) return;
         return confirm({
           message: "Add default ESLint configuration?",
           initialValue: false
@@ -102,7 +113,7 @@ async function main() {
     outputDir: dest,
     installDeps: options.installDeps,
     eslint: options.eslint === true,
-    useSrcDir: options.src,
+    useSrcDir: options.src === true,
     log: (message) => {
       info.message(message);
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-fumadocs-app",
-  "version": "15.2.0",
+  "version": "15.2.2",
   "description": "Create a new documentation site with Fumadocs",
   "keywords": [
     "NextJs",
@@ -25,7 +25,7 @@
   },
   "devDependencies": {
     "@types/cross-spawn": "^6.0.6",
-    "@types/node": "22.13.14",
+    "@types/node": "22.13.16",
     "fast-glob": "^3.3.3",
     "eslint-config-custom": "0.0.0",
     "tsconfig": "0.0.0"

package/template/react-router/app/docs/page.tsx

@@ -11,6 +11,7 @@ import defaultMdxComponents from 'fumadocs-ui/mdx';
 import { executeMdxSync } from '@fumadocs/mdx-remote/client';
 import type { PageTree } from 'fumadocs-core/server';
 import { createCompiler } from '@fumadocs/mdx-remote';
+import * as path from 'node:path';
 
 export function meta({}: Route.MetaArgs) {
   return [
@@ -27,15 +28,14 @@ export async function loader({ params }: Route.LoaderArgs) {
   const page = source.getPage(slugs);
   if (!page) throw new Error('Not found');
 
-  const compiled = String(
-    await compiler.compileFile({
-      value: page.data.content,
-    }),
-  );
+  const compiled = await compiler.compileFile({
+    path: path.resolve('content/docs', page.file.path),
+    value: page.data.content,
+  });
 
   return {
     page,
-    compiled,
+    compiled: compiled.toString(),
     tree: source.pageTree,
   };
 }

package/template/tanstack-start/README.md

@@ -0,0 +1,12 @@
+This is a Tanstack Start application generated with
+[Create Fumadocs](https://github.com/fuma-nama/fumadocs).
+
+Run development server:
+
+```bash
+npm run dev
+# or
+pnpm dev
+# or
+yarn dev
+```

package/template/tanstack-start/app/api.ts

@@ -0,0 +1,6 @@
+import {
+  createStartAPIHandler,
+  defaultAPIFileRouteHandler,
+} from '@tanstack/react-start/api';
+
+export default createStartAPIHandler(defaultAPIFileRouteHandler);

package/template/tanstack-start/app/app.css

@@ -0,0 +1,6 @@
+@import 'tailwindcss';
+@import 'fumadocs-ui/css/neutral.css';
+@import 'fumadocs-ui/css/preset.css';
+
+/* path of `fumadocs-ui` relative to the CSS file */
+@source '../node_modules/fumadocs-ui/dist/**/*.js';

package/template/tanstack-start/app/client.tsx

@@ -0,0 +1,7 @@
+import { hydrateRoot } from 'react-dom/client';
+import { StartClient } from '@tanstack/react-start';
+import { createRouter } from './router';
+
+const router = createRouter();
+
+hydrateRoot(document, <StartClient router={router} />);

package/template/tanstack-start/app/router.tsx

@@ -0,0 +1,15 @@
+import { createRouter as createTanStackRouter } from '@tanstack/react-router';
+import { routeTree } from './routeTree.gen';
+
+export function createRouter() {
+  return createTanStackRouter({
+    routeTree,
+    scrollRestoration: true,
+  });
+}
+
+declare module '@tanstack/react-router' {
+  interface Register {
+    router: ReturnType<typeof createRouter>;
+  }
+}

package/template/tanstack-start/app/routes/__root.tsx

@@ -0,0 +1,49 @@
+import { type ReactNode } from 'react';
+import { Outlet, createRootRoute, HeadContent } from '@tanstack/react-router';
+import { RootProvider } from 'fumadocs-ui/provider/base';
+import appCss from '../app.css?url';
+import { TanstackProvider } from 'fumadocs-core/framework/tanstack';
+import { Scripts } from '@tanstack/react-router';
+
+export const Route = createRootRoute({
+  head: () => ({
+    meta: [
+      {
+        charSet: 'utf-8',
+      },
+      {
+        name: 'viewport',
+        content: 'width=device-width, initial-scale=1',
+      },
+      {
+        title: 'Fumadocs on TanStack Start',
+      },
+    ],
+    links: [{ rel: 'stylesheet', href: appCss }],
+  }),
+  component: RootComponent,
+});
+
+function RootComponent() {
+  return (
+    <RootDocument>
+      <Outlet />
+    </RootDocument>
+  );
+}
+
+function RootDocument({ children }: Readonly<{ children: ReactNode }>) {
+  return (
+    <html suppressHydrationWarning>
+      <head>
+        <HeadContent />
+      </head>
+      <body>
+        <TanstackProvider>
+          <RootProvider>{children}</RootProvider>
+        </TanstackProvider>
+        <Scripts />
+      </body>
+    </html>
+  );
+}

package/template/tanstack-start/app/routes/api/search.ts

@@ -0,0 +1,20 @@
+import { createAPIFileRoute } from '@tanstack/react-start/api';
+import { createSearchAPI } from 'fumadocs-core/search/server';
+import { source } from '@/lib/source';
+import { structure } from 'fumadocs-core/mdx-plugins';
+
+const server = createSearchAPI('advanced', {
+  indexes: source.getPages().map((page) => ({
+    id: page.url,
+    url: page.url,
+    title: page.data.title ?? '',
+    description: page.data.description,
+    structuredData: structure(page.data.content),
+  })),
+});
+
+export const APIRoute = createAPIFileRoute('/api/search')({
+  GET: ({ request }) => {
+    return server.GET(request);
+  },
+});

package/template/tanstack-start/app/routes/docs/$.tsx

@@ -0,0 +1,71 @@
+import { createFileRoute, notFound } from '@tanstack/react-router';
+import { DocsLayout } from 'fumadocs-ui/layouts/docs';
+import { source } from '@/lib/source';
+import {
+  DocsBody,
+  DocsDescription,
+  DocsPage,
+  DocsTitle,
+} from 'fumadocs-ui/page';
+import { executeMdxSync } from '@fumadocs/mdx-remote/client';
+import defaultMdxComponents from 'fumadocs-ui/mdx';
+import { createServerFn } from '@tanstack/react-start';
+import type { PageTree } from 'fumadocs-core/server';
+import { createCompiler } from '@fumadocs/mdx-remote';
+import * as path from 'node:path';
+
+export const Route = createFileRoute('/docs/$')({
+  component: Page,
+  async loader({ params }) {
+    const slugs = (params._splat ?? '').split('/');
+
+    return loader({ data: slugs });
+  },
+});
+
+const compiler = createCompiler({
+  development: false,
+});
+
+const loader = createServerFn({
+  method: 'GET',
+})
+  .validator((slugs: string[]) => slugs)
+  .handler(async ({ data: slugs }) => {
+    const page = source.getPage(slugs);
+    if (!page) throw notFound();
+
+    const { content, ...rest } = page.data;
+    const compiled = await compiler.compileFile({
+      path: path.resolve('content/docs', page.file.path),
+      value: content,
+    });
+
+    return {
+      tree: source.pageTree as object,
+      ...rest,
+      compiled: compiled.toString(),
+    };
+  });
+
+function Page() {
+  const { tree, compiled, ...data } = Route.useLoaderData();
+  const { toc, default: MdxContent } = executeMdxSync(compiled);
+
+  return (
+    <DocsLayout
+      nav={{
+        title: 'Tanstack Start',
+      }}
+      tree={tree as PageTree.Root}
+    >
+      <DocsPage toc={toc}>
+        <DocsTitle>{data.title}</DocsTitle>
+        <DocsDescription>{data.title}</DocsDescription>
+        <DocsBody>
+          <MdxContent components={defaultMdxComponents} />
+        </DocsBody>
+      </DocsPage>
+    </DocsLayout>
+  );
+}

package/template/tanstack-start/app/routes/index.tsx

@@ -0,0 +1,25 @@
+import { createFileRoute, Link } from '@tanstack/react-router';
+import { HomeLayout } from 'fumadocs-ui/layouts/home';
+
+export const Route = createFileRoute('/')({
+  component: Home,
+});
+
+function Home() {
+  return (
+    <HomeLayout
+      nav={{
+        title: 'Tanstack Start',
+      }}
+      className="text-center py-32"
+    >
+      <h1 className="font-medium text-xl mb-4">Fumadocs on Tanstack Start.</h1>
+      <Link
+        to="/docs/$"
+        className="px-3 py-2 rounded-lg bg-fd-primary text-fd-primary-foreground font-medium text-sm mx-auto"
+      >
+        Open Docs
+      </Link>
+    </HomeLayout>
+  );
+}

package/template/tanstack-start/app/ssr.tsx

@@ -0,0 +1,13 @@
+// app/ssr.tsx
+import {
+  createStartHandler,
+  defaultStreamHandler,
+} from '@tanstack/react-start/server';
+import { getRouterManifest } from '@tanstack/react-start/router-manifest';
+
+import { createRouter } from './router';
+
+export default createStartHandler({
+  createRouter,
+  getRouterManifest,
+})(defaultStreamHandler);

package/template/tanstack-start/app.config.ts

@@ -0,0 +1,43 @@
+import { defineConfig } from '@tanstack/react-start/config';
+import tsConfigPaths from 'vite-tsconfig-paths';
+import tailwindcss from '@tailwindcss/vite';
+
+export default defineConfig({
+  server: {
+    hooks: {
+      'prerender:routes': async (routes) => {
+        const { source } = await import('./lib/source');
+        const pages = source.getPages();
+
+        for (const page of pages) {
+          routes.add(page.url);
+        }
+      },
+    },
+    prerender: {
+      routes: ['/'],
+      crawlLinks: true,
+    },
+  },
+  vite: {
+    build: {
+      rollupOptions: {
+        // Shiki results in a huge bundle because Rollup tries to bundle every language/theme
+        external: ['shiki'],
+        // most React.js libraries now include 'use client'
+        onwarn(warning, warn) {
+          if (warning.code === 'MODULE_LEVEL_DIRECTIVE') {
+            return;
+          }
+          warn(warning);
+        },
+      },
+    },
+    plugins: [
+      tsConfigPaths({
+        projects: ['./tsconfig.json'],
+      }),
+      tailwindcss(),
+    ],
+  },
+});

package/template/tanstack-start/content/docs/index.mdx

@@ -0,0 +1,35 @@
+---
+title: Hello World
+description: |
+  Your first `document`
+  You'll love it!
+---
+
+Hey there! Fumadocs is a docs framework built for Next.js, but do you know it also works on Tanstack Start?
+
+## Heading
+
+Hello World!
+
+<Cards>
+  <Card
+    title="Learn more about Tanstack Start"
+    href="https://tanstack.com/start"
+  />
+  <Card title="Learn more about Fumadocs" href="https://fumadocs.vercel.app" />
+</Cards>
+
+### CodeBlock
+
+```ts
+console.log('Hello World');
+```
+
+#### Table
+
+| Head                            | Description                         |
+| ------------------------------- | ----------------------------------- |
+| `hello`                         | Hello World                         |
+| very **important**              | Hey                                 |
+| _Surprisingly_                  | Fumadocs                            |
+| very long text that looks weird | hello world hello world hello world |

package/template/tanstack-start/example.gitignore

@@ -0,0 +1,4 @@
+routeTree.gen.ts
+node_modules
+.output
+.vinxi

package/template/tanstack-start/lib/source.ts

@@ -0,0 +1,70 @@
+import {
+  loader,
+  type MetaData,
+  type PageData,
+  type Source,
+  type VirtualFile,
+} from 'fumadocs-core/source';
+import matter from 'gray-matter';
+import * as path from 'node:path';
+import FastGlob from 'fast-glob';
+import * as fs from 'node:fs';
+
+let files: [string, string][];
+
+if (typeof import.meta.glob === 'function') {
+  files = Object.entries(
+    import.meta.glob<true, 'raw'>('/content/docs/**/*', {
+      eager: true,
+      query: '?raw',
+      import: 'default',
+    }),
+  );
+} else {
+  files = FastGlob.sync('content/docs/**/*').map((file) => {
+    return [file, fs.readFileSync(file).toString()];
+  });
+}
+
+const virtualFiles: VirtualFile[] = files.flatMap(([file, content]) => {
+  const ext = path.extname(file);
+  const virtualPath = path.relative(
+    'content/docs',
+    path.join(process.cwd(), file),
+  );
+
+  if (ext === '.mdx' || ext === '.md') {
+    const parsed = matter(content);
+
+    return {
+      type: 'page',
+      path: virtualPath,
+      data: {
+        ...parsed.data,
+        content: parsed.content,
+      },
+    };
+  }
+
+  if (ext === '.json') {
+    return {
+      type: 'meta',
+      path: virtualPath,
+      data: JSON.parse(content),
+    };
+  }
+
+  return [];
+});
+
+export const source = loader({
+  source: {
+    files: virtualFiles,
+  } as Source<{
+    pageData: PageData & {
+      content: string;
+    };
+    metaData: MetaData;
+  }>,
+  baseUrl: '/docs',
+});

package/template/tanstack-start/tsconfig.json

@@ -0,0 +1,15 @@
+{
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "moduleResolution": "Bundler",
+    "lib": ["DOM", "DOM.Iterable", "ESNext"],
+    "types": ["node", "vite/client"],
+    "module": "ESNext",
+    "target": "ESNext",
+    "skipLibCheck": true,
+    "strictNullChecks": true,
+    "paths": {
+      "@/*": ["./*"]
+    }
+  }
+}