refactor: point assistant consumers (e2e, docs, skill) at the /assistant subpaths

Author: AlemTuzlak

docs/assistant/index.md

@@ -22,6 +22,11 @@ single typed client, keyed by whichever capabilities you declared, so you can
 compose them: generate an image, then hand its URL straight to the model as
 the next chat turn, all through one connection.
 
+Both live on the `/assistant` subpath of their packages —
+`@tanstack/ai/assistant` for `defineAssistant()` and
+`@tanstack/ai-react/assistant` for `useAssistant()` (Solid, Vue, and Svelte
+follow the same pattern) — rather than the package root.
+
 ## Defining the Assistant (Server)
 
 Each capability is a plain callback: `(req) => <activity call>`. The `chat`
@@ -35,12 +40,8 @@ adapter is constructed, until a request actually reaches
 
 ```ts
 // api/assistant.ts
-import {
-  chat,
-  defineAssistant,
-  generateImage,
-  generateSpeech,
-} from '@tanstack/ai'
+import { chat, generateImage, generateSpeech } from '@tanstack/ai'
+import { defineAssistant } from '@tanstack/ai/assistant'
 import { openaiImage, openaiSpeech, openaiText } from '@tanstack/ai-openai'
 
 export const blogAssistant = defineAssistant({
@@ -89,13 +90,10 @@ object with a property per declared capability: `assistant.chat` looks like
 
 ```tsx
 // components/Assistant.tsx
-import { useAssistant, fetchServerSentEvents } from '@tanstack/ai-react'
-import {
-  chat,
-  defineAssistant,
-  generateImage,
-  generateSpeech,
-} from '@tanstack/ai'
+import { fetchServerSentEvents } from '@tanstack/ai-react'
+import { useAssistant } from '@tanstack/ai-react/assistant'
+import { chat, generateImage, generateSpeech } from '@tanstack/ai'
+import { defineAssistant } from '@tanstack/ai/assistant'
 import { openaiImage, openaiSpeech, openaiText } from '@tanstack/ai-openai'
 
 // The same object your server route exports — share it from one module in a
@@ -172,8 +170,10 @@ Generate an image, then hand its URL to the model as multimodal input
 alongside a follow-up instruction:
 
 ```tsx
-import { useAssistant, fetchServerSentEvents } from '@tanstack/ai-react'
-import { chat, defineAssistant, generateImage } from '@tanstack/ai'
+import { fetchServerSentEvents } from '@tanstack/ai-react'
+import { useAssistant } from '@tanstack/ai-react/assistant'
+import { chat, generateImage } from '@tanstack/ai'
+import { defineAssistant } from '@tanstack/ai/assistant'
 import { openaiImage, openaiText } from '@tanstack/ai-openai'
 
 // The same object your server route exports — share it from one module in a
@@ -233,8 +233,10 @@ The reverse works too — read the model's latest reply out of
 narrating it with `assistant.speech.generate`:
 
 ```tsx
-import { useAssistant, fetchServerSentEvents } from '@tanstack/ai-react'
-import { chat, defineAssistant, generateSpeech } from '@tanstack/ai'
+import { fetchServerSentEvents } from '@tanstack/ai-react'
+import { useAssistant } from '@tanstack/ai-react/assistant'
+import { chat, generateSpeech } from '@tanstack/ai'
+import { defineAssistant } from '@tanstack/ai/assistant'
 import { openaiSpeech, openaiText } from '@tanstack/ai-openai'
 
 // The same object your server route exports — share it from one module in a
@@ -283,8 +285,10 @@ re-declare on the client to get typed tool-call parts:
 
 ```tsx
 // components/WeatherChat.tsx
-import { useAssistant, fetchServerSentEvents } from '@tanstack/ai-react'
-import { chat, defineAssistant, toolDefinition } from '@tanstack/ai'
+import { fetchServerSentEvents } from '@tanstack/ai-react'
+import { useAssistant } from '@tanstack/ai-react/assistant'
+import { chat, toolDefinition } from '@tanstack/ai'
+import { defineAssistant } from '@tanstack/ai/assistant'
 import { openaiText } from '@tanstack/ai-openai'
 import { z } from 'zod'
 
@@ -372,8 +376,10 @@ export const showToast = showToastDef.client((input) => {
 ```
 
 ```tsx
-import { useAssistant, fetchServerSentEvents } from '@tanstack/ai-react'
-import { chat, defineAssistant } from '@tanstack/ai'
+import { fetchServerSentEvents } from '@tanstack/ai-react'
+import { useAssistant } from '@tanstack/ai-react/assistant'
+import { chat } from '@tanstack/ai'
+import { defineAssistant } from '@tanstack/ai/assistant'
 import { openaiText } from '@tanstack/ai-openai'
 import { showToastDef, showToast } from './tools'
 
@@ -407,8 +413,10 @@ terminal object) fields — the same inference
 
 ```tsx
 // components/BlogOutlineForm.tsx
-import { useAssistant, fetchServerSentEvents } from '@tanstack/ai-react'
-import { chat, defineAssistant } from '@tanstack/ai'
+import { fetchServerSentEvents } from '@tanstack/ai-react'
+import { useAssistant } from '@tanstack/ai-react/assistant'
+import { chat } from '@tanstack/ai'
+import { defineAssistant } from '@tanstack/ai/assistant'
 import { openaiText } from '@tanstack/ai-openai'
 import { z } from 'zod'
 

docs/config.json

@@ -315,7 +315,7 @@
           "label": "Assistant",
           "to": "assistant/index",
           "addedAt": "2026-07-13",
-          "updatedAt": "2026-07-13"
+          "updatedAt": "2026-07-14"
         }
       ]
     },

packages/ai/skills/ai-core/assistant/SKILL.md

@@ -43,12 +43,8 @@ it's safe to import into an isomorphic module shared with the client.
 
 ```typescript
 // src/lib/assistant.ts — shared/isomorphic module
-import {
-  chat,
-  defineAssistant,
-  generateImage,
-  generateSpeech,
-} from '@tanstack/ai'
+import { chat, generateImage, generateSpeech } from '@tanstack/ai'
+import { defineAssistant } from '@tanstack/ai/assistant'
 import {
   openaiText,
   openaiImage,
@@ -107,7 +103,8 @@ capabilities get a `400` before any callback runs.
 ### Client: `useAssistant`
 
 ```tsx
-import { useAssistant, fetchServerSentEvents } from '@tanstack/ai-react'
+import { fetchServerSentEvents } from '@tanstack/ai-react'
+import { useAssistant } from '@tanstack/ai-react/assistant'
 import { assistant } from '../lib/assistant'
 
 function AssistantPanel() {
@@ -155,7 +152,7 @@ is the full `useChat` return (`messages`, `sendMessage`, `isLoading`,
 `status`, `stop`, `reset`).
 
 Vue/Solid/Svelte have identical patterns with different hook imports
-(e.g. `import { useAssistant } from '@tanstack/ai-solid'`).
+(e.g. `import { useAssistant } from '@tanstack/ai-solid/assistant'`).
 
 ## Core Patterns
 
@@ -167,7 +164,8 @@ narrowed by tool name, input, and output — with **no** client-side
 re-declaration needed for typing:
 
 ```typescript
-import { useAssistant, fetchServerSentEvents } from '@tanstack/ai-react'
+import { fetchServerSentEvents } from '@tanstack/ai-react'
+import { useAssistant } from '@tanstack/ai-react/assistant'
 import { blogAssistant } from '../lib/assistant' // chat callback passed tools: [getWeather]
 
 const assistant = useAssistant(blogAssistant, {
@@ -186,7 +184,8 @@ tool's _definition_ (for the model and for typing). Pass the client
 implementation there to register its runtime:
 
 ```typescript
-import { useAssistant, fetchServerSentEvents } from '@tanstack/ai-react'
+import { fetchServerSentEvents } from '@tanstack/ai-react'
+import { useAssistant } from '@tanstack/ai-react/assistant'
 import { blogAssistant } from '../lib/assistant' // chat callback passed tools: [showToastDef]
 import { showToast } from '../lib/tools' // showToastDef.client((input) => ...)
 
@@ -208,7 +207,8 @@ outputSchema })` returns. Omit `outputSchema` and neither field is present on
 the type.
 
 ```typescript
-import { useAssistant, fetchServerSentEvents } from '@tanstack/ai-react'
+import { fetchServerSentEvents } from '@tanstack/ai-react'
+import { useAssistant } from '@tanstack/ai-react/assistant'
 import { blogAssistant } from '../lib/assistant' // chat callback passed outputSchema: BlogOutlineSchema
 
 const assistant = useAssistant(blogAssistant, {

testing/e2e/src/routes/api.assistant.ts

@@ -1,10 +1,6 @@
 import { createFileRoute } from '@tanstack/react-router'
-import {
-  chat,
-  defineAssistant,
-  generateImage,
-  maxIterations,
-} from '@tanstack/ai'
+import { chat, generateImage, maxIterations } from '@tanstack/ai'
+import { defineAssistant } from '@tanstack/ai/assistant'
 import type { Provider } from '@/lib/types'
 import { createTextAdapter } from '@/lib/providers'
 import { createImageAdapter } from '@/lib/media-providers'

testing/e2e/src/routes/assistant.tsx

@@ -1,11 +1,8 @@
 import { createFileRoute } from '@tanstack/react-router'
-import {
-  chat,
-  defineAssistant,
-  generateImage,
-  maxIterations,
-} from '@tanstack/ai'
-import { fetchServerSentEvents, useAssistant } from '@tanstack/ai-react'
+import { chat, generateImage, maxIterations } from '@tanstack/ai'
+import { defineAssistant } from '@tanstack/ai/assistant'
+import { fetchServerSentEvents } from '@tanstack/ai-react'
+import { useAssistant } from '@tanstack/ai-react/assistant'
 import { openaiImage, openaiText } from '@tanstack/ai-openai'
 import { ChatUI } from '@/components/ChatUI'
 import type { Provider } from '@/lib/types'