@tanstack/create 0.63.4 → 0.63.6

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # @tanstack/create
 
+## 0.63.6
+
+### Patch Changes
+
+- Auto-generated changeset from semantic commits on main.
+
+  - chore: update to TS6.0, fix deprecated tsconfig options (#421) (847b396)
+
+## 0.63.5
+
+### Patch Changes
+
+- Fix demo/example files leaking into projects when users opt out of demo pages. ([#434](https://github.com/TanStack/cli/pull/434))
+
+  - Strip add-on demo support files in `src/lib/`, `src/hooks/`, `src/data/`, `src/components/`, `src/store/`, and any `demo.*` / `demo-*` / `example.*` / `example-*` files.
+  - Strip example image assets under `public/`.
+  - Generate a minimal base starter (no Header, Footer, ThemeToggle, about page, or styled index page) when declining demo/example pages.
+  - Render Better Auth header-user component as `null` when its demo route is excluded, instead of linking to a non-existent route.
+
+  Closes #422, #409.
+
 ## 0.63.4
 
 ### Patch Changes

package/dist/create-app.js

@@ -9,14 +9,19 @@ import { createTemplateFile } from './template-file.js';
 import { installShadcnComponents } from './integrations/shadcn.js';
 import { setupGit } from './integrations/git.js';
 import { runSpecialSteps } from './special-steps/index.js';
-function isDemoRoutePath(path) {
+function isDemoFilePath(path) {
     if (!path)
         return false;
     const normalized = path.replace(/\\/g, '/');
-    return (normalized.includes('/routes/demo/') ||
-        normalized.includes('/routes/demo.') ||
-        normalized.includes('/routes/example/') ||
-        normalized.includes('/routes/example.'));
+    if (normalized.includes('/routes/demo/') ||
+        normalized.includes('/routes/example/')) {
+        return true;
+    }
+    const filename = normalized.split('/').pop() || '';
+    return (filename.startsWith('demo.') ||
+        filename.startsWith('demo-') ||
+        filename.startsWith('example.') ||
+        filename.startsWith('example-'));
 }
 function stripExamplesFromOptions(options) {
     if (options.includeExamples !== false) {
@@ -25,18 +30,20 @@ function stripExamplesFromOptions(options) {
     const chosenAddOns = options.chosenAddOns
         .filter((addOn) => addOn.type !== 'example')
         .map((addOn) => {
-        const filteredRoutes = (addOn.routes || []).filter((route) => !isDemoRoutePath(route.path) &&
+        const filteredRoutes = (addOn.routes || []).filter((route) => !isDemoFilePath(route.path) &&
             !(route.url && route.url.startsWith('/demo')));
+        const filteredIntegrations = (addOn.integrations || []).filter((integration) => !isDemoFilePath(integration.path));
         return {
             ...addOn,
             routes: filteredRoutes,
+            integrations: filteredIntegrations,
             getFiles: async () => {
                 const files = await addOn.getFiles();
-                return files.filter((file) => !isDemoRoutePath(file));
+                return files.filter((file) => !isDemoFilePath(file));
             },
             getDeletedFiles: async () => {
                 const deletedFiles = await addOn.getDeletedFiles();
-                return deletedFiles.filter((file) => !isDemoRoutePath(file));
+                return deletedFiles.filter((file) => !isDemoFilePath(file));
             },
         };
     });

package/dist/frameworks/react/add-ons/better-auth/assets/src/integrations/better-auth/{header-user.tsx → header-user.tsx.ejs}

@@ -1,5 +1,7 @@
 import { authClient } from "#/lib/auth-client";
+<%_ if (routes.some(r => r.url === '/demo/better-auth')) { _%>
 import { Link } from "@tanstack/react-router";
+<%_ } _%>
 
 export default function BetterAuthHeader() {
   const { data: session, isPending } = authClient.useSession();
@@ -34,6 +36,7 @@ export default function BetterAuthHeader() {
     );
   }
 
+<%_ if (routes.some(r => r.url === '/demo/better-auth')) { _%>
   return (
     <Link
       to="/demo/better-auth"
@@ -42,4 +45,7 @@ export default function BetterAuthHeader() {
       Sign in
     </Link>
   );
+<%_ } else { _%>
+  return null;
+<%_ } _%>
 }

package/dist/frameworks/react/project/base/package.json

@@ -30,7 +30,7 @@
     "@types/react-dom": "^19.2.0",
     "@vitejs/plugin-react": "^6.0.1",
     "jsdom": "^28.1.0",
-    "typescript": "^5.9.2",
+    "typescript": "^6.0.2",
     "vite": "^8.0.0",
     "vitest": "^3.0.5"
   },

package/dist/frameworks/react/project/base/src/components/Footer.tsx.ejs

@@ -1,3 +1,4 @@
+<% if (!includeExamples) { ignoreFile(); return; } %>
 export default function Footer() {
   const year = new Date().getFullYear()
 

package/dist/frameworks/react/project/base/src/components/Header.tsx.ejs

@@ -1,3 +1,4 @@
+<% if (!includeExamples) { ignoreFile(); return; } %>
 import { Link } from '@tanstack/react-router'
 <% for (const integration of integrations.filter((i) => i.type === 'header-user')) { %>import <%= integration.jsName %> from '<%= relativePath(integration.path) %>'
 <% } %>import ThemeToggle from './ThemeToggle'

package/dist/frameworks/react/project/base/src/components/ThemeToggle.tsx.ejs

@@ -1,3 +1,4 @@
+<% if (!includeExamples) { ignoreFile(); return; } %>
 import { useEffect, useState } from 'react'
 
 type ThemeMode = 'light' | 'dark' | 'auto'

package/dist/frameworks/react/project/base/src/routes/__root.tsx.ejs

@@ -27,6 +27,99 @@ function RootComponent() {
     </>
   )
 }
+<% } else if (!includeExamples) { %>
+<% let hasContext = addOnEnabled["apollo-client"] || addOnEnabled["tanstack-query"]; %>
+import {
+  HeadContent, Scripts, <% if (hasContext) { %>createRootRouteWithContext<% } else { %>createRootRoute<% } %> } from '@tanstack/react-router'
+import { TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools';
+import { TanStackDevtools } from '@tanstack/react-devtools'
+<% for(const integration of integrations.filter(i => i.type === 'layout' || i.type === 'provider' || i.type === 'devtools')) { %>
+import <%= integration.jsName %> from '<%= relativePath(integration.path, true) %>'
+<% } %><% if (addOnEnabled.paraglide) { %>
+import { getLocale } from '#/paraglide/runtime'
+<% } %>
+import appCss from '../styles.css?url'
+<% if (addOnEnabled["apollo-client"]) { %>
+import type { ApolloClientIntegration } from "@apollo/client-integration-tanstack-start";
+<% } %>
+<% if (addOnEnabled["tanstack-query"]) { %>
+import type { QueryClient } from '@tanstack/react-query'
+<% if (addOnEnabled.tRPC) { %>
+import type { TRPCRouter } from '#/integrations/trpc/router'
+import type { TRPCOptionsProxy } from '@trpc/tanstack-react-query'
+<% } %>
+<% } %>
+<% if (hasContext) { %>
+interface MyRouterContext <% if (addOnEnabled["apollo-client"]) {%> extends ApolloClientIntegration.RouterContext <%} %>{
+<% if (addOnEnabled["tanstack-query"]) { %>
+  queryClient: QueryClient
+  <% if (addOnEnabled.tRPC) { %>
+  trpc: TRPCOptionsProxy<TRPCRouter>
+  <% } %>
+<% } %>
+}<% } %>
+
+export const Route = <% if (hasContext) { %>createRootRouteWithContext<MyRouterContext>()<% } else { %>createRootRoute<% } %>({
+<% if (addOnEnabled.paraglide) { %>
+  beforeLoad: async () => {
+    // Other redirect strategies are possible; see
+    // https://github.com/TanStack/router/tree/main/examples/react/i18n-paraglide#offline-redirect
+    if (typeof document !== 'undefined') {
+      document.documentElement.setAttribute('lang', getLocale())
+    }
+  },
+<% } %>
+  head: () => ({
+    meta: [
+      {
+        charSet: 'utf-8',
+      },
+      {
+        name: 'viewport',
+        content: 'width=device-width, initial-scale=1',
+      },
+      {
+        title: 'TanStack Start Starter',
+      },
+    ],
+    links: [
+      {
+        rel: 'stylesheet',
+        href: appCss,
+      },
+    ],
+  }),
+  shellComponent: RootDocument
+})
+
+function RootDocument({ children }: { children: React.ReactNode }) {
+  return (
+      <% if (addOnEnabled.paraglide) { %><html lang={getLocale()}><% } else { %><html lang="en"><% } %>
+      <head>
+        <HeadContent />
+      </head>
+      <body>
+        <% for(const integration of integrations.filter(i => i.type === 'provider')) { %><<%= integration.jsName %>>
+        <% } %>{children}
+          <TanStackDevtools
+            config={{
+              position: 'bottom-right',
+            }}
+            plugins={[
+              {
+                name: 'Tanstack Router',
+                render: <TanStackRouterDevtoolsPanel />,
+              },
+              <% for(const integration of integrations.filter(i => i.type === 'devtools')) { %><%= integration.jsName %>,<% } %>
+            ]}
+          />
+          <% for(const integration of integrations.filter(i => i.type === 'layout')) { %><<%= integration.jsName %> />
+          <% } %><% for(const integration of integrations.filter(i => i.type === 'provider').reverse()) { %></<%= integration.jsName %>>
+        <% } %><Scripts />
+      </body>
+    </html>
+  )
+}
 <% } else { %>
 <% let hasContext = addOnEnabled["apollo-client"] || addOnEnabled["tanstack-query"]; %>
 import {

package/dist/frameworks/react/project/base/src/routes/about.tsx.ejs

@@ -1,3 +1,4 @@
+<% if (!includeExamples) { ignoreFile(); return; } %>
 import { createFileRoute } from '@tanstack/react-router'
 
 export const Route = createFileRoute('/about')({

package/dist/frameworks/react/project/base/src/routes/index.tsx.ejs

@@ -1,3 +1,19 @@
+<% if (!includeExamples) { %>
+import { createFileRoute } from "@tanstack/react-router";
+
+export const Route = createFileRoute("/")({ component: Home });
+
+function Home() {
+  return (
+    <div className="p-8">
+      <h1 className="text-4xl font-bold">Welcome to TanStack Start</h1>
+      <p className="mt-4 text-lg">
+        Edit <code>src/routes/index.tsx</code> to get started.
+      </p>
+    </div>
+  );
+}
+<% } else { %>
 import { createFileRoute } from "@tanstack/react-router";
 
 export const Route = createFileRoute("/")({ component: App });
@@ -70,3 +86,4 @@ function App() {
     </main>
   );
 }
+<% } %>

package/dist/frameworks/react/project/base/src/styles.css.ejs

@@ -1,3 +1,20 @@
+<% if (!includeExamples) { %>
+@import "tailwindcss";
+
+* {
+  box-sizing: border-box;
+}
+
+html,
+body,
+#app {
+  min-height: 100%;
+}
+
+body {
+  margin: 0;
+}
+<% } else { %>
 @import url("https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,700&family=Manrope:wght@400;500;600;700;800&display=swap");
 @import "tailwindcss";
 @plugin "@tailwindcss/typography";
@@ -257,3 +274,4 @@ a {
     transform: translateY(0);
   }
 }
+<% } %>

package/dist/frameworks/react/project/base/tsconfig.json.ejs

@@ -5,7 +5,6 @@
     "target": "ES2022",
     "jsx": "react-jsx",
     "module": "ESNext",
-    "baseUrl": ".",
     "paths": {
       "#/*": ["./src/*"],
       "@/*": ["./src/*"]

package/dist/frameworks/react/project/packages.json

@@ -4,7 +4,7 @@
       "@types/react": "^19.2.0",
       "@types/node": "^22.10.2",
       "@types/react-dom": "^19.2.0",
-      "typescript": "^5.7.2"
+      "typescript": "^6.0.2"
     }
   },
   "tailwindcss": {

package/dist/frameworks/solid/add-ons/better-auth/assets/src/integrations/better-auth/{header-user.tsx → header-user.tsx.ejs}

@@ -1,5 +1,7 @@
 import { Show } from "solid-js";
+<%_ if (routes.some(r => r.url === '/demo/better-auth')) { _%>
 import { Link } from "@tanstack/solid-router";
+<%_ } _%>
 import { authClient } from "../../lib/auth-client";
 
 export default function BetterAuthHeader() {
@@ -14,6 +16,7 @@ export default function BetterAuthHeader() {
     >
       <Show
         when={session().data?.user}
+<%_ if (routes.some(r => r.url === '/demo/better-auth')) { _%>
         fallback={
           <Link
             to="/demo/better-auth"
@@ -22,6 +25,7 @@ export default function BetterAuthHeader() {
             Sign in
           </Link>
         }
+<%_ } _%>
       >
         {(user) => (
           <div class="flex items-center gap-2">

package/dist/frameworks/solid/examples/tanchat/assets/ai-streaming-server/package.json

@@ -21,6 +21,6 @@
     "@types/express": "^5.0.3",
     "@types/node": "^24.6.0",
     "tsx": "^4.21.0",
-    "typescript": "^5.9.2"
+    "typescript": "^6.0.2"
   }
 }

package/dist/frameworks/solid/project/base/package.json

@@ -20,7 +20,7 @@
   "devDependencies": {
     "@tanstack/devtools-vite": "latest",
     "vite-plugin-solid": "^2.11.10",
-    "typescript": "^5.9.2",
+    "typescript": "^6.0.2",
     "vite": "^7.3.1"
   },
   "pnpm": {

package/dist/frameworks/solid/project/base/src/components/Header.tsx.ejs

@@ -1,3 +1,4 @@
+<% if (!includeExamples) { ignoreFile(); return; } %>
 import { Link } from '@tanstack/solid-router'
 <% for(const integration of integrations.filter(i => i.type === 'header-user')) { %>
 import <%= integration.jsName %> from '<%= relativePath(integration.path) %>'

package/dist/frameworks/solid/project/base/src/routes/__root.tsx.ejs

@@ -16,6 +16,51 @@ function RootComponent() {
     </>
   )
 }
+<% } else if (!includeExamples) { %>
+import { HeadContent, Outlet, Scripts, createRootRouteWithContext } from '@tanstack/solid-router'
+import { TanStackRouterDevtools } from '@tanstack/solid-router-devtools'
+
+<% if (addOnEnabled['solid-ui']) { %>
+import "@fontsource/inter/400.css"
+<% } %>
+
+import { HydrationScript } from 'solid-js/web'
+import { Suspense } from 'solid-js'
+
+<% for(const addOn of addOns) {
+  for(const init of addOn.main?.initialize || []) { %>
+  <%- init %>
+<% } } %>
+
+import styleCss from "../styles.css?url";
+
+export const Route = createRootRouteWithContext()({
+  head: () => ({
+    links: [{ rel: "stylesheet", href: styleCss }],
+  }),
+  shellComponent: RootComponent,
+})
+
+function RootComponent() {
+    return (
+      <html>
+        <head>
+          <HydrationScript />
+          <HeadContent />
+        </head>
+        <body>
+          <Suspense>
+            <Outlet />
+            <TanStackRouterDevtools />
+            <% for(const integration of integrations.filter(i => i.type === 'layout')) { %>
+              <<%= integration.jsName %> />
+            <% } %>
+            </Suspense>
+          <Scripts />
+        </body>
+      </html>
+    );
+}
 <% } else { %>
 import { HeadContent, Outlet, Scripts, createRootRouteWithContext } from '@tanstack/solid-router'
 import { TanStackRouterDevtools } from '@tanstack/solid-router-devtools'
@@ -47,9 +92,9 @@ function RootComponent() {
       <html>
         <head>
           <HydrationScript />
+          <HeadContent />
         </head>
         <body>
-          <HeadContent />
           <Suspense>
             <Header />
             <Outlet />

package/dist/frameworks/solid/project/base/src/routes/about.tsx.ejs

@@ -1,3 +1,4 @@
+<% if (!includeExamples) { ignoreFile(); return; } %>
 import { createFileRoute } from '@tanstack/solid-router'
 
 export const Route = createFileRoute('/about')({

package/dist/frameworks/solid/project/base/src/routes/index.tsx.ejs

@@ -1,3 +1,19 @@
+<% if (!includeExamples) { %>
+import { createFileRoute } from '@tanstack/solid-router'
+
+export const Route = createFileRoute('/')({ component: Home })
+
+function Home() {
+  return (
+    <div class="p-8">
+      <h1 class="text-4xl font-bold">Welcome to TanStack Start</h1>
+      <p class="mt-4 text-lg">
+        Edit <code>src/routes/index.tsx</code> to get started.
+      </p>
+    </div>
+  )
+}
+<% } else { %>
 import { createFileRoute } from '@tanstack/solid-router'
 
 export const Route = createFileRoute('/')({ component: App })
@@ -66,3 +82,4 @@ function App() {
     </main>
   )
 }
+<% } %>

package/dist/frameworks/solid/project/base/src/styles.css.ejs

@@ -1,3 +1,20 @@
+<% if (!includeExamples) { %>
+@import 'tailwindcss';
+
+* {
+  box-sizing: border-box;
+}
+
+html,
+body,
+#app {
+  min-height: 100%;
+}
+
+body {
+  margin: 0;
+}
+<% } else { %>
 @import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,700&family=Manrope:wght@400;500;600;700;800&display=swap');
 @import 'tailwindcss';
 
@@ -193,3 +210,4 @@ code {
     transform: translateY(0);
   }
 }
+<% } %>

package/dist/frameworks/solid/project/base/tsconfig.json.ejs

@@ -22,7 +22,6 @@
     "noUnusedParameters": true,
     "noFallthroughCasesInSwitch": true,
     "noUncheckedSideEffectImports": true<% if (addOnEnabled['solid-ui']) { %>,
-    "baseUrl": ".",
     "paths": {
       "~/*": ["./src/*"]
     }

package/dist/frameworks/solid/project/packages.json

@@ -1,7 +1,7 @@
 {
   "typescript": {
     "devDependencies": {
-      "typescript": "^5.7.2"
+      "typescript": "^6.0.2"
     }
   },
   "tailwindcss": {

package/dist/template-file.js

@@ -83,6 +83,7 @@ export function createTemplateFile(environment, options) {
             fileRouter: options.mode === 'file-router',
             codeRouter: options.mode === 'code-router',
             routerOnly: options.routerOnly === true,
+            includeExamples: options.includeExamples !== false,
             addOnEnabled,
             addOnOption: options.addOnOptions,
             addOns: options.chosenAddOns,

package/dist/types/custom-add-ons/add-on.d.ts

@@ -1,5 +1,5 @@
-import type { PersistedOptions } from '../config-file';
-import type { AddOn, AddOnInfo, Environment } from '../types';
+import type { PersistedOptions } from '../config-file.js';
+import type { AddOn, AddOnInfo, Environment } from '../types.js';
 export declare const ADD_ON_IGNORE_FILES: Array<string>;
 export declare function camelCase(str: string): string;
 export declare function templatize(routeCode: string, routeFile: string): {

package/dist/types/custom-add-ons/starter.d.ts

@@ -1,5 +1,5 @@
-import type { PersistedOptions } from '../config-file';
-import type { Environment, Starter, StarterInfo } from '../types';
+import type { PersistedOptions } from '../config-file.js';
+import type { Environment, Starter, StarterInfo } from '../types.js';
 export declare function readOrGenerateStarterInfo(options: PersistedOptions): Promise<StarterInfo>;
 export declare function updateStarterInfo(environment: Environment): Promise<void>;
 export declare function compileStarter(environment: Environment): Promise<void>;

package/dist/types/options.d.ts

@@ -1,2 +1,2 @@
-import type { Options, SerializedOptions } from './types';
+import type { Options, SerializedOptions } from './types.js';
 export declare const createSerializedOptions: (options: Options) => SerializedOptions;

package/dist/types/registry.d.ts

@@ -1,5 +1,5 @@
 import { z } from 'zod';
-import type { AddOn, Starter } from './types';
+import type { AddOn, Starter } from './types.js';
 declare const registrySchema: z.ZodObject<{
     templates: z.ZodOptional<z.ZodArray<z.ZodObject<{
         name: z.ZodString;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/create",
-  "version": "0.63.4",
+  "version": "0.63.6",
   "description": "TanStack Application Builder Engine",
   "type": "module",
   "main": "./dist/index.js",
@@ -38,7 +38,7 @@
     "@types/parse-gitignore": "^1.0.2",
     "@vitest/coverage-v8": "3.1.1",
     "eslint": "^9.20.0",
-    "typescript": "^5.6.3",
+    "typescript": "^6.0.2",
     "vitest": "^3.0.8",
     "vitest-fetch-mock": "^0.4.5"
   },

package/src/create-app.ts

@@ -17,14 +17,23 @@ import { runSpecialSteps } from './special-steps/index.js'
 
 import type { Environment, FileBundleHandler, Options } from './types.js'
 
-function isDemoRoutePath(path?: string) {
+function isDemoFilePath(path?: string) {
   if (!path) return false
   const normalized = path.replace(/\\/g, '/')
-  return (
+
+  if (
     normalized.includes('/routes/demo/') ||
-    normalized.includes('/routes/demo.') ||
-    normalized.includes('/routes/example/') ||
-    normalized.includes('/routes/example.')
+    normalized.includes('/routes/example/')
+  ) {
+    return true
+  }
+
+  const filename = normalized.split('/').pop() || ''
+  return (
+    filename.startsWith('demo.') ||
+    filename.startsWith('demo-') ||
+    filename.startsWith('example.') ||
+    filename.startsWith('example-')
   )
 }
 
@@ -38,20 +47,25 @@ function stripExamplesFromOptions(options: Options): Options {
     .map((addOn) => {
       const filteredRoutes = (addOn.routes || []).filter(
         (route) =>
-          !isDemoRoutePath(route.path) &&
+          !isDemoFilePath(route.path) &&
           !(route.url && route.url.startsWith('/demo')),
       )
+      
+      const filteredIntegrations = (addOn.integrations || []).filter(
+        (integration) => !isDemoFilePath(integration.path)
+      )
 
       return {
         ...addOn,
         routes: filteredRoutes,
+        integrations: filteredIntegrations,
         getFiles: async () => {
           const files = await addOn.getFiles()
-          return files.filter((file) => !isDemoRoutePath(file))
+          return files.filter((file) => !isDemoFilePath(file))
         },
         getDeletedFiles: async () => {
           const deletedFiles = await addOn.getDeletedFiles()
-          return deletedFiles.filter((file) => !isDemoRoutePath(file))
+          return deletedFiles.filter((file) => !isDemoFilePath(file))
         },
       }
     })

package/src/custom-add-ons/add-on.ts

@@ -12,14 +12,14 @@ import {
   runCreateApp,
 } from './shared.js'
 
-import type { PersistedOptions } from '../config-file'
+import type { PersistedOptions } from '../config-file.js'
 import type {
   AddOn,
   AddOnCompiled,
   AddOnInfo,
   Environment,
   Options,
-} from '../types'
+} from '../types.js'
 
 const ADD_ON_DIR = '.add-on'
 

package/src/custom-add-ons/starter.ts

@@ -12,14 +12,14 @@ import {
   runCreateApp,
 } from './shared.js'
 
-import type { PersistedOptions } from '../config-file'
+import type { PersistedOptions } from '../config-file.js'
 import type {
   Environment,
   Options,
   Starter,
   StarterCompiled,
   StarterInfo,
-} from '../types'
+} from '../types.js'
 
 const INFO_FILE = 'template-info.json'
 const LEGACY_INFO_FILE = 'starter-info.json'