[](https://clerk.com/discord)
-[](https://clerk.com/docs?utm_source=github&utm_medium=clerk_tanstack_start)
+[](https://clerk.com/docs?utm_source=github&utm_medium=clerk_tanstack_react_start)
[](https://twitter.com/intent/follow?screen_name=ClerkDev)
-[Changelog](https://github.com/clerk/javascript/blob/main/packages/tanstack-start/CHANGELOG.md)
+[Changelog](https://github.com/clerk/javascript/blob/main/packages/tanstack-react-start/CHANGELOG.md)
·
[Report a Bug](https://github.com/clerk/javascript/issues/new?assignees=&labels=needs-triage&projects=&template=BUG_REPORT.yml)
·
[Request a Feature](https://feedback.clerk.com/roadmap)
·
-[Get help](https://clerk.com/contact/support?utm_source=github&utm_medium=clerk_tanstack_start)
+[Get help](https://clerk.com/contact/support?utm_source=github&utm_medium=clerk_tanstack_react_start)
## Getting Started
-[Clerk](https://clerk.com/?utm_source=github&utm_medium=clerk_tanstack_start) is the easiest way to add authentication and user management to your Tanstack Start application. Add sign up, sign in, and profile management to your application in minutes.
+[Clerk](https://clerk.com/?utm_source=github&utm_medium=clerk_tanstack_react_start) is the easiest way to add authentication and user management to your Tanstack Start application. Add sign up, sign in, and profile management to your application in minutes.
-> [!WARNING] > `@clerk/tanstack-start` is currently in beta. It's not recommended to use it in production just yet, but it would be much appreciated if you give it a try.
+> [!WARNING] > `@clerk/tanstack-react-start` is currently in beta. It's not recommended to use it in production just yet, but it would be much appreciated if you give it a try.
### Prerequisites
@@ -37,12 +37,12 @@
- Tanstack Router `^1.49.1` or later
- React 18 or later
- Node.js `>=18.17.0` or later
-- An existing Clerk application. [Create your account for free](https://dashboard.clerk.com/sign-up?utm_source=github&utm_medium=clerk_tanstack_start).
+- An existing Clerk application. [Create your account for free](https://dashboard.clerk.com/sign-up?utm_source=github&utm_medium=clerk_tanstack_react_start).
### Installation
```sh
-npm install @clerk/tanstack-start
+npm install @clerk/tanstack-react-start
```
## Usage
@@ -59,9 +59,9 @@ You can get these from the [API Keys](https://dashboard.clerk.com/last-active?pa
To initialize Clerk with your TanStack Start application, you will need to make one modification to `app/routes/_root.tsx`. Wrap the children of the `RootComponent` with ``
```tsx
-import { ClerkProvider } from '@clerk/tanstack-start'
+import { ClerkProvider } from '@clerk/tanstack-react-start'
import { createRootRoute } from '@tanstack/react-router'
-import { Link, Outlet, ScrollRestoration } from '@tanstack/react-router'
+import { Link, Outlet } from '@tanstack/react-router'
import { TanStackRouterDevtools } from '@tanstack/router-devtools'
import { Body, Head, Html, Meta, Scripts } from '@tanstack/start'
import * as React from 'react'
@@ -112,7 +112,7 @@ You will also need to make on more modification to you SSR entrypoint (default:
import { createStartHandler, defaultStreamHandler } from '@tanstack/start/server';
import { getRouterManifest } from '@tanstack/start/router-manifest';
import { createRouter } from './router';
-import { createClerkHandler } from '@clerk/tanstack-start/server';
+import { createClerkHandler } from '@clerk/tanstack-react-start/server';
const handler = createStartHandler({
createRouter,
@@ -136,7 +136,7 @@ After those changes are made, you can use Clerk components in your routes.
For example, in `app/routes/index.tsx`:
```tsx
-import { SignIn, SignedIn, SignedOut, UserButton } from '@clerk/tanstack-start';
+import { SignIn, SignedIn, SignedOut, UserButton } from '@clerk/tanstack-react-start';
import { createFileRoute } from '@tanstack/react-router';
export const Route = createFileRoute('/')({
@@ -163,7 +163,7 @@ function Home() {
You can get in touch with us in any of the following ways:
- Join our official community [Discord server](https://clerk.com/discord)
-- On [our support page](https://clerk.com/contact/support?utm_source=github&utm_medium=clerk_tanstack_start)
+- On [our support page](https://clerk.com/contact/support?utm_source=github&utm_medium=clerk_tanstack_react_start)
## Contributing
@@ -171,9 +171,9 @@ We're open to all community contributions! If you'd like to contribute in any wa
## Security
-`@clerk/tanstack-start` follows good practices of security, but 100% security cannot be assured.
+`@clerk/tanstack-react-start` follows good practices of security, but 100% security cannot be assured.
-`@clerk/tanstack-start` is provided **"as is"** without any **warranty**. Use at your own risk.
+`@clerk/tanstack-react-start` is provided **"as is"** without any **warranty**. Use at your own risk.
_For more information and to report security issues, please refer to our [security documentation](https://github.com/clerk/javascript/blob/main/docs/SECURITY.md)._
@@ -181,4 +181,4 @@ _For more information and to report security issues, please refer to our [securi
This project is licensed under the **MIT license**.
-See [LICENSE](https://github.com/clerk/javascript/blob/main/packages/tanstack-start/LICENSE) for more information.
+See [LICENSE](https://github.com/clerk/javascript/blob/main/packages/tanstack-react-start/LICENSE) for more information.
diff --git a/packages/tanstack-start/errors/package.json b/packages/tanstack-react-start/errors/package.json
similarity index 100%
rename from packages/tanstack-start/errors/package.json
rename to packages/tanstack-react-start/errors/package.json
diff --git a/packages/tanstack-start/package.json b/packages/tanstack-react-start/package.json
similarity index 87%
rename from packages/tanstack-start/package.json
rename to packages/tanstack-react-start/package.json
index 4e25f0a26e2..d9ad1fe0da6 100644
--- a/packages/tanstack-start/package.json
+++ b/packages/tanstack-react-start/package.json
@@ -1,9 +1,10 @@
{
- "name": "@clerk/tanstack-start",
+ "name": "@clerk/tanstack-react-start",
"version": "0.11.5",
- "description": "Clerk SDK for TanStack Start",
+ "description": "Clerk SDK for TanStack React Start",
"keywords": [
"clerk",
+ "react",
"typescript",
"tanstack start",
"auth",
@@ -19,7 +20,7 @@
"repository": {
"type": "git",
"url": "git+https://github.com/clerk/javascript.git",
- "directory": "packages/tanstack-start"
+ "directory": "packages/tanstack-react-start"
},
"license": "MIT",
"author": "Clerk",
@@ -63,8 +64,7 @@
"@clerk/clerk-react": "workspace:^",
"@clerk/shared": "workspace:^",
"@clerk/types": "workspace:^",
- "tslib": "catalog:repo",
- "vinxi": "^0.5.3"
+ "tslib": "catalog:repo"
},
"devDependencies": {
"@tanstack/react-router": "^1.114.17",
@@ -72,8 +72,8 @@
"esbuild-plugin-file-path-extensions": "^2.1.4"
},
"peerDependencies": {
- "@tanstack/react-router": ">=1.111.7",
- "@tanstack/react-start": ">=1.111.10",
+ "@tanstack/react-router": ">=1.114.6",
+ "@tanstack/react-start": ">=1.114.6",
"react": "catalog:peer-react",
"react-dom": "catalog:peer-react"
},
diff --git a/packages/tanstack-start/server/package.json b/packages/tanstack-react-start/server/package.json
similarity index 100%
rename from packages/tanstack-start/server/package.json
rename to packages/tanstack-react-start/server/package.json
diff --git a/packages/tanstack-start/src/client/ClerkProvider.tsx b/packages/tanstack-react-start/src/client/ClerkProvider.tsx
similarity index 100%
rename from packages/tanstack-start/src/client/ClerkProvider.tsx
rename to packages/tanstack-react-start/src/client/ClerkProvider.tsx
diff --git a/packages/tanstack-start/src/client/OptionsContext.tsx b/packages/tanstack-react-start/src/client/OptionsContext.tsx
similarity index 100%
rename from packages/tanstack-start/src/client/OptionsContext.tsx
rename to packages/tanstack-react-start/src/client/OptionsContext.tsx
diff --git a/packages/tanstack-start/src/client/index.ts b/packages/tanstack-react-start/src/client/index.ts
similarity index 100%
rename from packages/tanstack-start/src/client/index.ts
rename to packages/tanstack-react-start/src/client/index.ts
diff --git a/packages/tanstack-start/src/client/types.ts b/packages/tanstack-react-start/src/client/types.ts
similarity index 100%
rename from packages/tanstack-start/src/client/types.ts
rename to packages/tanstack-react-start/src/client/types.ts
diff --git a/packages/tanstack-start/src/client/uiComponents.tsx b/packages/tanstack-react-start/src/client/uiComponents.tsx
similarity index 100%
rename from packages/tanstack-start/src/client/uiComponents.tsx
rename to packages/tanstack-react-start/src/client/uiComponents.tsx
diff --git a/packages/tanstack-start/src/client/useAwaitableNavigate.ts b/packages/tanstack-react-start/src/client/useAwaitableNavigate.ts
similarity index 100%
rename from packages/tanstack-start/src/client/useAwaitableNavigate.ts
rename to packages/tanstack-react-start/src/client/useAwaitableNavigate.ts
diff --git a/packages/tanstack-start/src/client/utils.ts b/packages/tanstack-react-start/src/client/utils.ts
similarity index 100%
rename from packages/tanstack-start/src/client/utils.ts
rename to packages/tanstack-react-start/src/client/utils.ts
diff --git a/packages/tanstack-start/src/errors.ts b/packages/tanstack-react-start/src/errors.ts
similarity index 72%
rename from packages/tanstack-start/src/errors.ts
rename to packages/tanstack-react-start/src/errors.ts
index 3f63231c48a..6699c2b5fc8 100644
--- a/packages/tanstack-start/src/errors.ts
+++ b/packages/tanstack-react-start/src/errors.ts
@@ -1,7 +1,3 @@
-import { warnPackageRenaming } from './utils/errors';
-
-warnPackageRenaming();
-
export {
isClerkAPIResponseError,
isEmailLinkError,
diff --git a/packages/tanstack-start/src/global.d.ts b/packages/tanstack-react-start/src/global.d.ts
similarity index 100%
rename from packages/tanstack-start/src/global.d.ts
rename to packages/tanstack-react-start/src/global.d.ts
diff --git a/packages/tanstack-start/src/index.ts b/packages/tanstack-react-start/src/index.ts
similarity index 67%
rename from packages/tanstack-start/src/index.ts
rename to packages/tanstack-react-start/src/index.ts
index f7b1a210c0a..cadd693ad6b 100644
--- a/packages/tanstack-start/src/index.ts
+++ b/packages/tanstack-react-start/src/index.ts
@@ -1,9 +1,5 @@
-import { warnPackageRenaming } from './utils/errors';
-
-warnPackageRenaming();
-
export * from './client/index';
-// Override Clerk React error thrower to show that errors come from @clerk/tanstack-start
+// Override Clerk React error thrower to show that errors come from @clerk/tanstack-react-start
import { setErrorThrowerOptions } from '@clerk/clerk-react/internal';
setErrorThrowerOptions({ packageName: PACKAGE_NAME });
diff --git a/packages/tanstack-start/src/server/authenticateRequest.ts b/packages/tanstack-react-start/src/server/authenticateRequest.ts
similarity index 100%
rename from packages/tanstack-start/src/server/authenticateRequest.ts
rename to packages/tanstack-react-start/src/server/authenticateRequest.ts
diff --git a/packages/tanstack-start/src/server/clerkClient.ts b/packages/tanstack-react-start/src/server/clerkClient.ts
similarity index 100%
rename from packages/tanstack-start/src/server/clerkClient.ts
rename to packages/tanstack-react-start/src/server/clerkClient.ts
diff --git a/packages/tanstack-start/src/server/constants.ts b/packages/tanstack-react-start/src/server/constants.ts
similarity index 96%
rename from packages/tanstack-start/src/server/constants.ts
rename to packages/tanstack-react-start/src/server/constants.ts
index ee90395c551..2ab44527ad0 100644
--- a/packages/tanstack-start/src/server/constants.ts
+++ b/packages/tanstack-react-start/src/server/constants.ts
@@ -1,6 +1,6 @@
import { apiUrlFromPublishableKey } from '@clerk/shared/apiUrlFromPublishableKey';
import { getEnvVariable } from '@clerk/shared/getEnvVariable';
-import { getEvent } from 'vinxi/http';
+import { getEvent } from '@tanstack/react-start/server';
import { getPublicEnvVariables } from '../utils/env';
diff --git a/packages/tanstack-start/src/server/getAuth.ts b/packages/tanstack-react-start/src/server/getAuth.ts
similarity index 100%
rename from packages/tanstack-start/src/server/getAuth.ts
rename to packages/tanstack-react-start/src/server/getAuth.ts
diff --git a/packages/tanstack-start/src/server/index.ts b/packages/tanstack-react-start/src/server/index.ts
similarity index 88%
rename from packages/tanstack-start/src/server/index.ts
rename to packages/tanstack-react-start/src/server/index.ts
index 28ec67a97cb..4a56c1e5c15 100644
--- a/packages/tanstack-start/src/server/index.ts
+++ b/packages/tanstack-react-start/src/server/index.ts
@@ -1,7 +1,3 @@
-import { warnPackageRenaming } from '../utils/errors';
-
-warnPackageRenaming();
-
export * from './middlewareHandler';
export * from './getAuth';
diff --git a/packages/tanstack-start/src/server/loadOptions.ts b/packages/tanstack-react-start/src/server/loadOptions.ts
similarity index 98%
rename from packages/tanstack-start/src/server/loadOptions.ts
rename to packages/tanstack-react-start/src/server/loadOptions.ts
index f45128334e1..5c879f6946c 100644
--- a/packages/tanstack-start/src/server/loadOptions.ts
+++ b/packages/tanstack-react-start/src/server/loadOptions.ts
@@ -4,7 +4,7 @@ import { getEnvVariable } from '@clerk/shared/getEnvVariable';
import { isDevelopmentFromSecretKey } from '@clerk/shared/keys';
import { isHttpOrHttps, isProxyUrlRelative } from '@clerk/shared/proxy';
import { handleValueOrFn } from '@clerk/shared/utils';
-import { getEvent } from 'vinxi/http';
+import { getEvent } from '@tanstack/react-start/server';
import { errorThrower } from '../utils';
import { getPublicEnvVariables } from '../utils/env';
diff --git a/packages/tanstack-start/src/server/middlewareHandler.ts b/packages/tanstack-react-start/src/server/middlewareHandler.ts
similarity index 96%
rename from packages/tanstack-start/src/server/middlewareHandler.ts
rename to packages/tanstack-react-start/src/server/middlewareHandler.ts
index 3faa31b9eae..6178ecd0313 100644
--- a/packages/tanstack-start/src/server/middlewareHandler.ts
+++ b/packages/tanstack-react-start/src/server/middlewareHandler.ts
@@ -1,5 +1,5 @@
import type { AnyRouter } from '@tanstack/react-router';
-import type { EventHandler } from 'vinxi/http';
+import type { EventHandler } from '@tanstack/react-start/server';
import { authenticateRequest } from './authenticateRequest';
import { loadOptions } from './loadOptions';
diff --git a/packages/tanstack-start/src/server/types.ts b/packages/tanstack-react-start/src/server/types.ts
similarity index 100%
rename from packages/tanstack-start/src/server/types.ts
rename to packages/tanstack-react-start/src/server/types.ts
diff --git a/packages/tanstack-start/src/server/utils/index.ts b/packages/tanstack-react-start/src/server/utils/index.ts
similarity index 98%
rename from packages/tanstack-start/src/server/utils/index.ts
rename to packages/tanstack-react-start/src/server/utils/index.ts
index e9b431bd644..b3e25fdd2b5 100644
--- a/packages/tanstack-start/src/server/utils/index.ts
+++ b/packages/tanstack-react-start/src/server/utils/index.ts
@@ -2,7 +2,7 @@ import type { RequestState } from '@clerk/backend/internal';
import { debugRequestState } from '@clerk/backend/internal';
import { getEnvVariable } from '@clerk/shared/getEnvVariable';
import { isTruthy } from '@clerk/shared/underscore';
-import { getEvent } from 'vinxi/http';
+import { getEvent } from '@tanstack/react-start/server';
import type { AdditionalStateOptions } from '../types';
diff --git a/packages/tanstack-start/src/utils/env.ts b/packages/tanstack-react-start/src/utils/env.ts
similarity index 94%
rename from packages/tanstack-start/src/utils/env.ts
rename to packages/tanstack-react-start/src/utils/env.ts
index 039a16c99ca..8c4c6d42dea 100644
--- a/packages/tanstack-start/src/utils/env.ts
+++ b/packages/tanstack-react-start/src/utils/env.ts
@@ -1,6 +1,6 @@
import { getEnvVariable } from '@clerk/shared/getEnvVariable';
import { isTruthy } from '@clerk/shared/underscore';
-import type { H3EventContext } from 'vinxi/http';
+import type { H3EventContext } from '@tanstack/react-start/server';
export const getPublicEnvVariables = (context?: H3EventContext) => {
const getValue = (name: string): string => {
diff --git a/packages/tanstack-start/src/utils/errors.ts b/packages/tanstack-react-start/src/utils/errors.ts
similarity index 71%
rename from packages/tanstack-start/src/utils/errors.ts
rename to packages/tanstack-react-start/src/utils/errors.ts
index 0ac9124ad9f..4b71ba3e9d1 100644
--- a/packages/tanstack-start/src/utils/errors.ts
+++ b/packages/tanstack-react-start/src/utils/errors.ts
@@ -22,11 +22,5 @@ It looks like you're trying to use Clerk without configuring the Clerk handler.
To fix this, make sure you have the \`clerkHandler()\` configure in you SSR entry file (example: app/ssr.tsx).
-For more info, check out the docs: https://github.com/clerk/javascript/tree/main/packages/tanstack-start#setup-clerkhandler-in-the-ssr-entrypoint,
+For more info, check out the docs: https://github.com/clerk/javascript/tree/main/packages/tanstack-react-start#setup-clerkhandler-in-the-ssr-entrypoint,
`);
-
-export const warnPackageRenaming = () => {
- console.warn(
- '[@clerk/tanstack-start] Warning: This package has moved to @clerk/tanstack-react-start. Please switch to the new package, as this is the last release under this package name.',
- );
-};
diff --git a/packages/tanstack-start/src/utils/index.ts b/packages/tanstack-react-start/src/utils/index.ts
similarity index 100%
rename from packages/tanstack-start/src/utils/index.ts
rename to packages/tanstack-react-start/src/utils/index.ts
diff --git a/packages/tanstack-start/tsconfig.declarations.json b/packages/tanstack-react-start/tsconfig.declarations.json
similarity index 100%
rename from packages/tanstack-start/tsconfig.declarations.json
rename to packages/tanstack-react-start/tsconfig.declarations.json
diff --git a/packages/tanstack-start/tsconfig.json b/packages/tanstack-react-start/tsconfig.json
similarity index 100%
rename from packages/tanstack-start/tsconfig.json
rename to packages/tanstack-react-start/tsconfig.json
diff --git a/packages/tanstack-start/tsup.config.ts b/packages/tanstack-react-start/tsup.config.ts
similarity index 100%
rename from packages/tanstack-start/tsup.config.ts
rename to packages/tanstack-react-start/tsup.config.ts
diff --git a/packages/tanstack-start/vite-env.d.ts b/packages/tanstack-react-start/vite-env.d.ts
similarity index 100%
rename from packages/tanstack-start/vite-env.d.ts
rename to packages/tanstack-react-start/vite-env.d.ts
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index b9c9e1e40e8..03ff7951988 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -920,7 +920,7 @@ importers:
specifier: 0.25.0
version: 0.25.0
- packages/tanstack-start:
+ packages/tanstack-react-start:
dependencies:
'@clerk/backend':
specifier: workspace:^
@@ -943,9 +943,6 @@ importers:
tslib:
specifier: catalog:repo
version: 2.8.1
- vinxi:
- specifier: ^0.5.3
- version: 0.5.3(@types/node@22.13.10)(db0@0.3.1)(ioredis@5.6.0)(jiti@2.4.2)(terser@5.37.0)(tsx@4.19.2)(typescript@5.8.2)(yaml@2.7.0)
devDependencies:
'@tanstack/react-router':
specifier: ^1.114.17
diff --git a/turbo.json b/turbo.json
index b233e4b350f..3b1856dcec3 100644
--- a/turbo.json
+++ b/turbo.json
@@ -217,14 +217,14 @@
"inputs": ["integration/**"],
"outputLogs": "new-only"
},
- "//#test:integration:tanstack-start": {
- "dependsOn": ["@clerk/clerk-js#build", "@clerk/tanstack-start#build", "@clerk/clerk-react#build"],
+ "//#test:integration:tanstack-react-start": {
+ "dependsOn": ["@clerk/clerk-js#build", "@clerk/tanstack-react-start#build", "@clerk/clerk-react#build"],
"env": ["CLEANUP", "DEBUG", "E2E_*", "INTEGRATION_INSTANCE_KEYS"],
"inputs": ["integration/**"],
"outputLogs": "new-only"
},
- "//#test:integration:tanstack-router": {
- "dependsOn": ["@clerk/clerk-js#build", "@clerk/tanstack-start#build", "@clerk/clerk-react#build"],
+ "//#test:integration:tanstack-react-router": {
+ "dependsOn": ["@clerk/clerk-js#build", "@clerk/tanstack-react-start#build", "@clerk/clerk-react#build"],
"env": ["CLEANUP", "DEBUG", "E2E_*", "INTEGRATION_INSTANCE_KEYS"],
"inputs": ["integration/**"],
"outputLogs": "new-only"
