# TanStack Router (https://session-kit.pages.dev/docs/reference/tanstack-router)

```ts
import { … } from "@monarcode/session-kit/tanstack-router";
```

Guide: [TanStack Router](https://session-kit.pages.dev/docs/setups/tanstack-router).

## Functions

### connectAuth

Starts auth for a Router whose context holds the client as `auth`. It restores the session, runs expiry timers, follows other tabs, and runs guards such as `requireSession` again when the session changes. Call it once, beside the Router.

### redirectIfSignedIn

Guards your sign-in page in `beforeLoad`, so a signed-in user goes straight to `redirectTo`, made safe with `safeReturnTo`.

### requireSession

Guards a route in `beforeLoad`, so only signed-in users get through. They get `{ session }` in route context, typed and never `null`, with no tokens in it.

### useAuth

Reads the current auth state of the client in Router context, or the part `selector` picks, and re-renders when it changes. With a selector, it re-renders only when that part changes.

### useAuthClient

Returns the auth client from Router context, where it's `auth`, for actions such as `signIn` and `signOut`. It needs no `AuthProvider`: `connectAuth` mounts the client.

## Components

### SessionOutlet

Renders the child routes of a route guarded by `requireSession`, but only while the session it accepted is still the signed-in one.

## Types

### AuthRouter

What [`connectAuth`](#connectauth) needs from a TanStack Router: the client in its context as `auth`, and the methods that run guards again and clear cached route data. A Router made by `createRouter` with `context: { auth }` fits.

### RedirectIfSignedInOptions

Options for [`redirectIfSignedIn`](#redirectifsignedin).

### RedirectIfSignedInOptions

Options for redirectIfSignedIn.

| Prop         | Type      | Description                                                                                              |
| ------------ | --------- | -------------------------------------------------------------------------------------------------------- |
| `redirectTo` | `unknown` | Where to send a signed-in user, usually the `redirectTo` search param. It's checked with `safeReturnTo`. |
| `loginPath?` | `union`   | Your sign-in page's path, or several. `redirectTo` never sends the user back to one. Default: `"/login"` |

### RequireSessionOptions

Options for [`requireSession`](#requiresession).

### RequireSessionOptions

Options for requireSession.

| Prop         | Type     | Description                                                                                              |
| ------------ | -------- | -------------------------------------------------------------------------------------------------------- |
| `location`   | `object` | The route's location, from `beforeLoad`'s `location`. Signed-out users come back to it after signing in. |
| `loginPath?` | `string` | Your sign-in page's path, starting with `/`. Default: `"/login"`                                         |

### RouterAuth

The auth client type in your registered Router's context, as `auth`, which [`useAuthClient`](#useauthclient) returns. It's `never` until the Router is registered.

### SessionOutletProps

Props for [`SessionOutlet`](#sessionoutlet).

### SessionOutletProps

Props for SessionOutlet.

| Prop       | Type         | Description                                                                                |
| ---------- | ------------ | ------------------------------------------------------------------------------------------ |
| `pending?` | `ReactNode`  | Shown while the guard checks the session again, such as after a sign-out.                  |
| `client?`  | `AuthSource` | The client to watch. Default: the nearest `AuthProvider`'s, then `auth` in Router context. |