@tanstack/cta-framework-react-cra 0.24.0 → 0.25.0

package/ADD-ON-AUTHORING.md

@@ -136,6 +136,32 @@ Configuration in `info.json`:
 ]
 ```
 
+## vite-plugin
+
+The code is integrated into `src/vite.config.ts`
+
+### Examples
+
+Code in `assets/vite-plugins/netlify.ts`:
+
+```ts
+import netlify from '@netlify/vite-plugin-tanstack-start'
+
+export default netlify()
+```
+
+Configuration in `info.json`:
+
+```json
+"integrations": [
+  {
+    "type": "vite-plugin",
+    "jsName": "netlify",
+    "path": "vite-plugins/netlify.ts"
+  },
+]
+```
+
 # Routes
 
 If your add-on creates routes you need to specify those in the `info.json` file.

package/add-ons/convex/assets/convex/_generated/api.d.ts

@@ -0,0 +1,36 @@
+/* eslint-disable */
+/**
+ * Generated `api` utility.
+ *
+ * THIS CODE IS AUTOMATICALLY GENERATED.
+ *
+ * To regenerate, run `npx convex dev`.
+ * @module
+ */
+
+import type {
+  ApiFromModules,
+  FilterApi,
+  FunctionReference,
+} from "convex/server";
+import type * as todos from "../todos.js";
+
+/**
+ * A utility for referencing Convex functions in your app's API.
+ *
+ * Usage:
+ * ```js
+ * const myFunctionReference = api.myModule.myFunction;
+ * ```
+ */
+declare const fullApi: ApiFromModules<{
+  todos: typeof todos;
+}>;
+export declare const api: FilterApi<
+  typeof fullApi,
+  FunctionReference<any, "public">
+>;
+export declare const internal: FilterApi<
+  typeof fullApi,
+  FunctionReference<any, "internal">
+>;

package/add-ons/convex/assets/convex/_generated/api.js

@@ -0,0 +1,22 @@
+/* eslint-disable */
+/**
+ * Generated `api` utility.
+ *
+ * THIS CODE IS AUTOMATICALLY GENERATED.
+ *
+ * To regenerate, run `npx convex dev`.
+ * @module
+ */
+
+import { anyApi } from "convex/server";
+
+/**
+ * A utility for referencing Convex functions in your app's API.
+ *
+ * Usage:
+ * ```js
+ * const myFunctionReference = api.myModule.myFunction;
+ * ```
+ */
+export const api = anyApi;
+export const internal = anyApi;

package/add-ons/convex/assets/convex/_generated/dataModel.d.ts

@@ -0,0 +1,60 @@
+/* eslint-disable */
+/**
+ * Generated data model types.
+ *
+ * THIS CODE IS AUTOMATICALLY GENERATED.
+ *
+ * To regenerate, run `npx convex dev`.
+ * @module
+ */
+
+import type {
+  DataModelFromSchemaDefinition,
+  DocumentByName,
+  TableNamesInDataModel,
+  SystemTableNames,
+} from "convex/server";
+import type { GenericId } from "convex/values";
+import schema from "../schema.js";
+
+/**
+ * The names of all of your Convex tables.
+ */
+export type TableNames = TableNamesInDataModel<DataModel>;
+
+/**
+ * The type of a document stored in Convex.
+ *
+ * @typeParam TableName - A string literal type of the table name (like "users").
+ */
+export type Doc<TableName extends TableNames> = DocumentByName<
+  DataModel,
+  TableName
+>;
+
+/**
+ * An identifier for a document in Convex.
+ *
+ * Convex documents are uniquely identified by their `Id`, which is accessible
+ * on the `_id` field. To learn more, see [Document IDs](https://docs.convex.dev/using/document-ids).
+ *
+ * Documents can be loaded using `db.get(id)` in query and mutation functions.
+ *
+ * IDs are just strings at runtime, but this type can be used to distinguish them from other
+ * strings when type checking.
+ *
+ * @typeParam TableName - A string literal type of the table name (like "users").
+ */
+export type Id<TableName extends TableNames | SystemTableNames> =
+  GenericId<TableName>;
+
+/**
+ * A type describing your Convex data model.
+ *
+ * This type includes information about what tables you have, the type of
+ * documents stored in those tables, and the indexes defined on them.
+ *
+ * This type is used to parameterize methods like `queryGeneric` and
+ * `mutationGeneric` to make them type-safe.
+ */
+export type DataModel = DataModelFromSchemaDefinition<typeof schema>;

package/add-ons/convex/assets/convex/_generated/server.d.ts

@@ -0,0 +1,142 @@
+/* eslint-disable */
+/**
+ * Generated utilities for implementing server-side Convex query and mutation functions.
+ *
+ * THIS CODE IS AUTOMATICALLY GENERATED.
+ *
+ * To regenerate, run `npx convex dev`.
+ * @module
+ */
+
+import {
+  ActionBuilder,
+  HttpActionBuilder,
+  MutationBuilder,
+  QueryBuilder,
+  GenericActionCtx,
+  GenericMutationCtx,
+  GenericQueryCtx,
+  GenericDatabaseReader,
+  GenericDatabaseWriter,
+} from "convex/server";
+import type { DataModel } from "./dataModel.js";
+
+/**
+ * Define a query in this Convex app's public API.
+ *
+ * This function will be allowed to read your Convex database and will be accessible from the client.
+ *
+ * @param func - The query function. It receives a {@link QueryCtx} as its first argument.
+ * @returns The wrapped query. Include this as an `export` to name it and make it accessible.
+ */
+export declare const query: QueryBuilder<DataModel, "public">;
+
+/**
+ * Define a query that is only accessible from other Convex functions (but not from the client).
+ *
+ * This function will be allowed to read from your Convex database. It will not be accessible from the client.
+ *
+ * @param func - The query function. It receives a {@link QueryCtx} as its first argument.
+ * @returns The wrapped query. Include this as an `export` to name it and make it accessible.
+ */
+export declare const internalQuery: QueryBuilder<DataModel, "internal">;
+
+/**
+ * Define a mutation in this Convex app's public API.
+ *
+ * This function will be allowed to modify your Convex database and will be accessible from the client.
+ *
+ * @param func - The mutation function. It receives a {@link MutationCtx} as its first argument.
+ * @returns The wrapped mutation. Include this as an `export` to name it and make it accessible.
+ */
+export declare const mutation: MutationBuilder<DataModel, "public">;
+
+/**
+ * Define a mutation that is only accessible from other Convex functions (but not from the client).
+ *
+ * This function will be allowed to modify your Convex database. It will not be accessible from the client.
+ *
+ * @param func - The mutation function. It receives a {@link MutationCtx} as its first argument.
+ * @returns The wrapped mutation. Include this as an `export` to name it and make it accessible.
+ */
+export declare const internalMutation: MutationBuilder<DataModel, "internal">;
+
+/**
+ * Define an action in this Convex app's public API.
+ *
+ * An action is a function which can execute any JavaScript code, including non-deterministic
+ * code and code with side-effects, like calling third-party services.
+ * They can be run in Convex's JavaScript environment or in Node.js using the "use node" directive.
+ * They can interact with the database indirectly by calling queries and mutations using the {@link ActionCtx}.
+ *
+ * @param func - The action. It receives an {@link ActionCtx} as its first argument.
+ * @returns The wrapped action. Include this as an `export` to name it and make it accessible.
+ */
+export declare const action: ActionBuilder<DataModel, "public">;
+
+/**
+ * Define an action that is only accessible from other Convex functions (but not from the client).
+ *
+ * @param func - The function. It receives an {@link ActionCtx} as its first argument.
+ * @returns The wrapped function. Include this as an `export` to name it and make it accessible.
+ */
+export declare const internalAction: ActionBuilder<DataModel, "internal">;
+
+/**
+ * Define an HTTP action.
+ *
+ * This function will be used to respond to HTTP requests received by a Convex
+ * deployment if the requests matches the path and method where this action
+ * is routed. Be sure to route your action in `convex/http.js`.
+ *
+ * @param func - The function. It receives an {@link ActionCtx} as its first argument.
+ * @returns The wrapped function. Import this function from `convex/http.js` and route it to hook it up.
+ */
+export declare const httpAction: HttpActionBuilder;
+
+/**
+ * A set of services for use within Convex query functions.
+ *
+ * The query context is passed as the first argument to any Convex query
+ * function run on the server.
+ *
+ * This differs from the {@link MutationCtx} because all of the services are
+ * read-only.
+ */
+export type QueryCtx = GenericQueryCtx<DataModel>;
+
+/**
+ * A set of services for use within Convex mutation functions.
+ *
+ * The mutation context is passed as the first argument to any Convex mutation
+ * function run on the server.
+ */
+export type MutationCtx = GenericMutationCtx<DataModel>;
+
+/**
+ * A set of services for use within Convex action functions.
+ *
+ * The action context is passed as the first argument to any Convex action
+ * function run on the server.
+ */
+export type ActionCtx = GenericActionCtx<DataModel>;
+
+/**
+ * An interface to read from the database within Convex query functions.
+ *
+ * The two entry points are {@link DatabaseReader.get}, which fetches a single
+ * document by its {@link Id}, or {@link DatabaseReader.query}, which starts
+ * building a query.
+ */
+export type DatabaseReader = GenericDatabaseReader<DataModel>;
+
+/**
+ * An interface to read from and write to the database within Convex mutation
+ * functions.
+ *
+ * Convex guarantees that all writes within a single mutation are
+ * executed atomically, so you never have to worry about partial writes leaving
+ * your data in an inconsistent state. See [the Convex Guide](https://docs.convex.dev/understanding/convex-fundamentals/functions#atomicity-and-optimistic-concurrency-control)
+ * for the guarantees Convex provides your functions.
+ */
+export type DatabaseWriter = GenericDatabaseWriter<DataModel>;

package/add-ons/convex/assets/convex/_generated/server.js

@@ -0,0 +1,89 @@
+/* eslint-disable */
+/**
+ * Generated utilities for implementing server-side Convex query and mutation functions.
+ *
+ * THIS CODE IS AUTOMATICALLY GENERATED.
+ *
+ * To regenerate, run `npx convex dev`.
+ * @module
+ */
+
+import {
+  actionGeneric,
+  httpActionGeneric,
+  queryGeneric,
+  mutationGeneric,
+  internalActionGeneric,
+  internalMutationGeneric,
+  internalQueryGeneric,
+} from "convex/server";
+
+/**
+ * Define a query in this Convex app's public API.
+ *
+ * This function will be allowed to read your Convex database and will be accessible from the client.
+ *
+ * @param func - The query function. It receives a {@link QueryCtx} as its first argument.
+ * @returns The wrapped query. Include this as an `export` to name it and make it accessible.
+ */
+export const query = queryGeneric;
+
+/**
+ * Define a query that is only accessible from other Convex functions (but not from the client).
+ *
+ * This function will be allowed to read from your Convex database. It will not be accessible from the client.
+ *
+ * @param func - The query function. It receives a {@link QueryCtx} as its first argument.
+ * @returns The wrapped query. Include this as an `export` to name it and make it accessible.
+ */
+export const internalQuery = internalQueryGeneric;
+
+/**
+ * Define a mutation in this Convex app's public API.
+ *
+ * This function will be allowed to modify your Convex database and will be accessible from the client.
+ *
+ * @param func - The mutation function. It receives a {@link MutationCtx} as its first argument.
+ * @returns The wrapped mutation. Include this as an `export` to name it and make it accessible.
+ */
+export const mutation = mutationGeneric;
+
+/**
+ * Define a mutation that is only accessible from other Convex functions (but not from the client).
+ *
+ * This function will be allowed to modify your Convex database. It will not be accessible from the client.
+ *
+ * @param func - The mutation function. It receives a {@link MutationCtx} as its first argument.
+ * @returns The wrapped mutation. Include this as an `export` to name it and make it accessible.
+ */
+export const internalMutation = internalMutationGeneric;
+
+/**
+ * Define an action in this Convex app's public API.
+ *
+ * An action is a function which can execute any JavaScript code, including non-deterministic
+ * code and code with side-effects, like calling third-party services.
+ * They can be run in Convex's JavaScript environment or in Node.js using the "use node" directive.
+ * They can interact with the database indirectly by calling queries and mutations using the {@link ActionCtx}.
+ *
+ * @param func - The action. It receives an {@link ActionCtx} as its first argument.
+ * @returns The wrapped action. Include this as an `export` to name it and make it accessible.
+ */
+export const action = actionGeneric;
+
+/**
+ * Define an action that is only accessible from other Convex functions (but not from the client).
+ *
+ * @param func - The function. It receives an {@link ActionCtx} as its first argument.
+ * @returns The wrapped function. Include this as an `export` to name it and make it accessible.
+ */
+export const internalAction = internalActionGeneric;
+
+/**
+ * Define a Convex HTTP action.
+ *
+ * @param func - The function. It receives an {@link ActionCtx} as its first argument, and a `Request` object
+ * as its second.
+ * @returns The wrapped endpoint function. Route a URL path to this function in `convex/http.js`.
+ */
+export const httpAction = httpActionGeneric;

package/add-ons/convex/assets/convex/tsconfig.json

@@ -0,0 +1,25 @@
+{
+  /* This TypeScript project config describes the environment that
+   * Convex functions run in and is used to typecheck them.
+   * You can modify it, but some settings are required to use Convex.
+   */
+  "compilerOptions": {
+    /* These settings are not required by Convex and can be modified. */
+    "allowJs": true,
+    "strict": true,
+    "moduleResolution": "Bundler",
+    "jsx": "react-jsx",
+    "skipLibCheck": true,
+    "allowSyntheticDefaultImports": true,
+
+    /* These compiler options are required by Convex */
+    "target": "ESNext",
+    "lib": ["ES2021", "dom"],
+    "forceConsistentCasingInFileNames": true,
+    "module": "ESNext",
+    "isolatedModules": true,
+    "noEmit": true
+  },
+  "include": ["./**/*"],
+  "exclude": ["./_generated"]
+}

package/add-ons/convex/assets/src/routes/demo.convex.tsx

@@ -4,6 +4,7 @@ import { useQuery, useMutation } from 'convex/react'
 import { Trash2, Plus, Check, Circle } from 'lucide-react'
 
 import { api } from '../../convex/_generated/api'
+import { Id } from '../../convex/_generated/dataModel'
 
 export const Route = createFileRoute('/demo/convex')({
   ssr: false,
@@ -26,14 +27,14 @@ function ConvexTodos() {
   }, [addTodo, newTodo])
 
   const handleToggleTodo = useCallback(
-    async (id: string) => {
+    async (id: Id<'todos'>) => {
       await toggleTodo({ id })
     },
     [toggleTodo],
   )
 
   const handleRemoveTodo = useCallback(
-    async (id: string) => {
+    async (id: Id<'todos'>) => {
       await removeTodo({ id })
     },
     [removeTodo],

package/add-ons/convex/package.json

@@ -1,6 +1,6 @@
 {
   "dependencies": {
-    "@convex-dev/react-query": "0.0.0-alpha.8",
+    "@convex-dev/react-query": "0.0.0-alpha.11",
     "convex": "^1.27.3",
     "lucide-react": "^0.544.0"
   }

package/add-ons/db/package.json

@@ -1,6 +1,6 @@
 {
   "dependencies": {
-    "@tanstack/db": "^0.1.1",
+    "@tanstack/db": "^0.4.3",
     "@tanstack/query-db-collection": "^0.2.0",
     "@tanstack/react-db": "^0.1.1",
     "zod": "^4.0.14"

package/add-ons/form/package.json

@@ -1,6 +1,6 @@
 {
   "dependencies": {
     "@tanstack/react-form": "^1.0.0",
-    "zod": "^3.24.2"
+    "zod": "^4.1.11"
   }
 }

package/add-ons/mcp/package.json

@@ -1,6 +1,6 @@
 {
   "dependencies": {
     "@modelcontextprotocol/sdk": "^1.17.0",
-    "zod": "3.25.76"
+    "zod": "4.1.11"
   }
 }

package/add-ons/neon/assets/vite-plugins/neon.ts

@@ -0,0 +1,10 @@
+import postgresPlugin from '@neondatabase/vite-plugin-postgres'
+
+export default postgresPlugin({
+  seed: {
+    type: 'sql-script',
+    path: 'db/init.sql',
+  },
+  referrer: 'create-tanstack',
+  dotEnvKey: 'VITE_DATABASE_URL',
+})

package/add-ons/neon/info.json

@@ -13,5 +13,12 @@
       "jsName": "NeonDemo"
     }
   ],
+  "integrations": [
+    {
+      "type": "vite-plugin",
+      "jsName": "neon",
+      "path": "vite-plugins/neon.ts"
+    }
+  ],
   "dependsOn": ["start"]
 }

package/add-ons/sentry/package.json

@@ -1,5 +1,5 @@
 {
   "dependencies": {
-    "@sentry/tanstackstart-react": "^9.12.0"
+    "@sentry/tanstackstart-react": "^10.17.0"
   }
 }

package/add-ons/shadcn/package.json

@@ -2,7 +2,7 @@
   "dependencies": {
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
-    "lucide-react": "^0.476.0",
+    "lucide-react": "^0.544.0",
     "tailwind-merge": "^3.0.2",
     "tw-animate-css": "^1.3.6"
   }

package/add-ons/start/assets/vite.config.ts.ejs

@@ -5,29 +5,19 @@ import viteTsConfigPaths from 'vite-tsconfig-paths'<% if (tailwind) { %>
 import tailwindcss from "@tailwindcss/vite"
 <% } %><% if (addOnEnabled.sentry) { %>
 import { wrapVinxiConfigWithSentry } from "@sentry/tanstackstart-react";
-<% } %><% if (addOnEnabled.neon) { %>
-import postgresPlugin from "@neondatabase/vite-plugin-postgres";
+<% } %><% for(const integration of integrations.filter(i => i.type === 'vite-plugin')) { %>import <%= integration.jsName %> from "<%= relativePath(integration.path) %>";
 <% } %>
 const config = defineConfig({
-    plugins: [
-      <% if (addOnEnabled.neon) { %>
-        postgresPlugin({
-          seed: {
-            type: "sql-script",
-            path: "db/init.sql"
-          },
-          referrer: 'create-tanstack',
-          dotEnvKey: 'VITE_DATABASE_URL',
-        }),
-      <% } %>
-      // this is the plugin that enables path aliases
-      viteTsConfigPaths({
-        projects: ['./tsconfig.json'],
-      }),
-      <% if (tailwind) { %>tailwindcss(),<% } %>
-      tanstackStart(),
-      viteReact(),
-    ],
+  plugins: [<% for(const integration of integrations.filter(i => i.type === 'vite-plugin')) { %>
+    <%= integration.jsName %>,<% } %>
+    // this is the plugin that enables path aliases
+    viteTsConfigPaths({
+      projects: ['./tsconfig.json'],
+    }),
+    <% if (tailwind) { %>tailwindcss(),<% } %>
+    tanstackStart(),
+    viteReact(),
+  ],
 })
 
 <% if (addOnEnabled.sentry) { %>

package/add-ons/start/info.json

@@ -5,7 +5,6 @@
   "link": "https://tanstack.com/start/latest",
   "modes": ["file-router"],
   "type": "add-on",
-  "warning": "TanStack Start is not yet at 1.0 and may change significantly or not be compatible with other add-ons.\nMigrating to Start might require deleting node_modules and re-installing.",
   "routes": [
     {
       "url": "/demo/start/server-funcs",
@@ -20,10 +19,6 @@
       "jsName": "StartApiRequestDemo"
     }
   ],
-  "deletedFiles": [
-    "./index.html",
-    "./src/main.tsx",
-    "./src/App.css"
-  ],
+  "deletedFiles": ["./index.html", "./src/main.tsx", "./src/App.css"],
   "addOnSpecialSteps": ["rimraf-node-modules"]
 }

package/add-ons/start/package.json

@@ -1,8 +1,7 @@
 {
   "scripts": {
     "dev": "vite dev --port 3000",
-    "build": "vite build",
-    "start": "node .output/server/index.mjs"
+    "build": "vite build"
   },
   "dependencies": {
     "@tanstack/react-router-ssr-query": "^1.131.7",

package/add-ons/store/package.json

@@ -4,6 +4,6 @@
     "@tanstack/react-store": "^0.7.0"
   },
   "devDependencies": {
-    "@tanstack/devtools-event-client": "^0.2.1"
+    "@tanstack/devtools-event-client": "^0.3.2"
   }
 }

package/add-ons/t3env/package.json

@@ -1,6 +1,6 @@
 {
   "dependencies": {
-    "zod": "^3.24.2",
-    "@t3-oss/env-core": "^0.12.0"
+    "zod": "^4.1.11",
+    "@t3-oss/env-core": "^0.13.8"
   }
-}
+}

package/add-ons/tRPC/package.json

@@ -4,6 +4,6 @@
     "@trpc/server": "^11.4.3",
     "@trpc/tanstack-react-query": "^11.4.3",
     "superjson": "^2.2.2",
-    "zod": "^3.24.2"
+    "zod": "^4.1.11"
   }
 }

package/add-ons/table/package.json

@@ -1,6 +1,6 @@
 {
   "dependencies": {
-    "@faker-js/faker": "^9.6.0",
+    "@faker-js/faker": "^10.0.0",
     "@tanstack/match-sorter-utils": "^8.19.4",
     "@tanstack/react-table": "^8.21.2"
   }

package/dist/index.js

@@ -7,6 +7,7 @@ export function createFrameworkDefinition() {
         join(baseDirectory, 'add-ons'),
         join(baseDirectory, 'toolchains'),
         join(baseDirectory, 'examples'),
+        join(baseDirectory, 'hosts'),
     ]);
     const { files, basePackageJSON, optionalPackages } = scanProjectDirectory(join(baseDirectory, 'project'), join(baseDirectory, 'project/base'));
     return {

package/examples/tanchat/package.json

@@ -5,12 +5,12 @@
     "@modelcontextprotocol/sdk": "^1.8.0",
     "ai": "^5.0.8",
     "highlight.js": "^11.11.1",
-    "react-markdown": "^9.0.1",
+    "react-markdown": "^10.1.0",
     "rehype-highlight": "^7.0.0",
     "rehype-raw": "^7.0.0",
     "rehype-sanitize": "^6.0.0",
     "remark-gfm": "^4.0.1",
-    "lucide-react": "^0.475.0",
-    "zod": "^3.24.2"
+    "lucide-react": "^0.544.0",
+    "zod": "^4.1.11"
   }
 }

package/hosts/cloudflare/assets/vite-plugins/cloudflare.ts

@@ -0,0 +1,3 @@
+import { cloudflare } from '@cloudflare/vite-plugin'
+
+export default cloudflare({ viteEnvironment: { name: 'ssr' } })

package/hosts/cloudflare/assets/wrangler.json

@@ -0,0 +1,10 @@
+{
+  "$schema": "node_modules/wrangler/config-schema.json",
+  "name": "tanstack-start-app",
+  "compatibility_date": "2025-09-02",
+  "compatibility_flags": ["nodejs_compat"],
+  "main": "@tanstack/react-start/server-entry",
+  "vars": {
+    "MY_VAR": "Hello from Cloudflare"
+  }
+}