content/docs/02-getting-started/02-nextjs-app-router.mdx

@@ -179,42 +179,37 @@ Depending on your use case, you may want to stream additional data alongside the
 
 Make the following changes to your Route Handler (`app/api/chat/route.ts`):
 
-```ts filename="app/api/chat/route.ts" highlight="2,15-25"
+```ts filename="app/api/chat/route.ts" highlight="2,10-11,16-18,21"
 import { openai } from '@ai-sdk/openai';
-import { StreamingTextResponse, streamText, StreamData } from 'ai';
+import { streamText, StreamData } from 'ai';
 
 // Allow streaming responses up to 30 seconds
 export const maxDuration = 30;
 
 export async function POST(req: Request) {
   const { messages } = await req.json();
 
-  const result = await streamText({
-    model: openai('gpt-4-turbo'),
-    messages,
-  });
-
   const data = new StreamData();
-
   data.append({ test: 'value' });
 
-  const stream = result.toAIStream({
-    onFinal(_) {
+  const result = await streamText({
+    model: openai('gpt-4-turbo'),
+    messages,
+    onFinish() {
       data.close();
     },
   });
 
-  return new StreamingTextResponse(stream, {}, data);
+  return result.toAIStreamResponse({ data });
 }
 ```
 
 In this code, you:
 
 1. Create a new instance of `StreamData`.
 2. Append the data you want to stream alongside the model's response.
-3. Create a new AI stream with the `toAIStream` method on the `StreamTextResult` object.
-4. Listen for the `onFinal` callback on the AI Stream created above.
-5. Pass the data alongside the stream to the new `StreamingTextResponse`.
+3. Listen for the `onFinish` callback on `streamText` and close the stream data.
+4. Pass the data into the `toAIStreamResponse` method.
 
 ### Update your frontend
 

content/docs/02-getting-started/03-nextjs-pages-router.mdx

@@ -178,42 +178,37 @@ Depending on your use case, you may want to stream additional data alongside the
 
 Make the following changes to your Route Handler (`app/api/chat/route.ts`)
 
-```ts filename="app/api/chat/route.ts" highlight="2,15-25"
+```ts filename="app/api/chat/route.ts" highlight="2,10-11,16-18,21"
 import { openai } from '@ai-sdk/openai';
-import { StreamingTextResponse, streamText, StreamData } from 'ai';
+import { streamText, StreamData } from 'ai';
 
 // Allow streaming responses up to 30 seconds
 export const maxDuration = 30;
 
 export async function POST(req: Request) {
   const { messages } = await req.json();
 
-  const result = await streamText({
-    model: openai('gpt-4-turbo'),
-    messages,
-  });
-
   const data = new StreamData();
-
   data.append({ test: 'value' });
 
-  const stream = result.toAIStream({
-    onFinal(_) {
+  const result = await streamText({
+    model: openai('gpt-4-turbo'),
+    messages,
+    onFinish() {
       data.close();
     },
   });
 
-  return new StreamingTextResponse(stream, {}, data);
+  return result.toAIStreamResponse({ data });
 }
 ```
 
 In this code, you:
 
 1. Create a new instance of `StreamData`.
 2. Append the data you want to stream alongside the model's response.
-3. Create a new AI stream with the `toAIStream` method on the `StreamTextResult` object.
-4. Listen for the `onFinal` callback on the AI Stream created above.
-5. Pass the data alongside the stream to the new `StreamingTextResponse`.
+3. Listen for the `onFinish` callback on `streamText` and close the stream data.
+4. Pass the data into the `toAIStreamResponse` method.
 
 ### Update your frontend
 

content/docs/02-getting-started/04-svelte.mdx

@@ -162,7 +162,7 @@ Depending on your use case, you may want to stream additional data alongside the
 
 Make the following changes to your POST endpoint (`src/routes/api/chat/+server.ts`)
 
-```ts filename="src/routes/api/chat/+server.ts" highlight="2,19-29"
+```ts filename="src/routes/api/chat/+server.ts" highlight="2,14-15,19-21,25"
 import { createOpenAI } from '@ai-sdk/openai';
 import { StreamData, StreamingTextResponse, streamText } from 'ai';
 import type { RequestHandler } from './$types';
@@ -176,32 +176,27 @@ const openai = createOpenAI({
 export const POST = (async ({ request }) => {
   const { messages } = await request.json();
 
-  const result = await streamText({
-    model: openai('gpt-3.5-turbo'),
-    messages,
-  });
-
   const data = new StreamData();
-
   data.append({ test: 'value' });
 
-  const stream = result.toAIStream({
-    onFinal(_) {
+  const result = await streamText({
+    model: openai('gpt-3.5-turbo'),
+    onFinish() {
       data.close();
     },
+    messages,
   });
 
-  return new StreamingTextResponse(stream, {}, data);
+  return result.toAIStreamResponse({ data });
 }) satisfies RequestHandler;
 ```
 
 In this code, you:
 
 1. Create a new instance of `StreamData`.
 2. Append the data you want to stream alongside the model's response.
-3. Create a new AI stream with the `toAIStream` method on the `StreamTextResult` object.
-4. Listen for the `onFinal` callback on the AI Stream created above.
-5. Pass the data alongside the stream to the new `StreamingTextResponse`
+3. Listen for the `onFinish` callback on `streamText` and close the stream data.
+4. Pass the data into the `toAIStreamResponse` method.
 
 ### Update your frontend
 

content/docs/02-getting-started/05-nuxt.mdx

@@ -109,7 +109,7 @@ export default defineLazyEventHandler(async () => {
       messages,
     });
 
-    return new StreamingTextResponse(result.toAIStream());
+    return result.toAIStreamResponse();
   });
 });
 ```
@@ -176,8 +176,8 @@ Depending on your use case, you may want to stream additional data alongside the
 
 Make the following changes to your API route (`pages/api/chat.ts`)
 
-```ts filename="server/api/chat.ts" highlight="1,19-29"
-import { StreamingTextResponse, streamText, StreamData } from 'ai';
+```ts filename="server/api/chat.ts"
+import { streamText, StreamData } from 'ai';
 import { createOpenAI } from '@ai-sdk/openai';
 
 export default defineLazyEventHandler(async () => {
@@ -190,22 +190,18 @@ export default defineLazyEventHandler(async () => {
   return defineEventHandler(async (event: any) => {
     const { messages } = await readBody(event);
 
-    const result = await streamText({
-      model: openai('gpt-4-turbo'),
-      messages,
-    });
-
     const data = new StreamData();
-
     data.append({ test: 'value' });
 
-    const stream = result.toAIStream({
-      onFinal(_) {
+    const result = await streamText({
+      model: openai('gpt-4-turbo'),
+      onFinish() {
         data.close();
       },
+      messages,
     });
 
-    return new StreamingTextResponse(stream, {}, data);
+    return result.toAIStreamResponse({ data });
   });
 });
 ```
@@ -214,9 +210,8 @@ In this code, you:
 
 1. Create a new instance of `StreamData`.
 2. Append the data you want to stream alongside the model's response.
-3. Create a new AI stream with the `toAIStream` method on the `StreamTextResult` object.
-4. Listen for the `onFinal` callback on the AI Stream created above.
-5. Pass the data alongside the stream to the new `StreamingTextResponse`
+3. Listen for the `onFinish` callback on `streamText` and close the stream data.
+4. Pass the data into the `toAIStreamResponse` method.
 
 ### Update your frontend
 

content/docs/05-ai-sdk-ui/05-completion.mdx

@@ -37,7 +37,7 @@ export default function Page() {
 ```
 
 ```ts filename='app/api/completion/route.ts'
-import { StreamingTextResponse, streamText } from 'ai';
+import { streamText } from 'ai';
 import { openai } from '@ai-sdk/openai';
 
 // Allow streaming responses up to 30 seconds
@@ -51,7 +51,7 @@ export async function POST(req: Request) {
     prompt,
   });
 
-  return new StreamingTextResponse(result.toAIStream());
+  return result.toAIStreamResponse();
 }
 ```
 

content/docs/05-ai-sdk-ui/20-streaming-data.mdx

@@ -5,15 +5,24 @@ description: Welcome to the Vercel AI SDK documentation!
 
 # Streaming Data
 
-Depending on your use case, you may want to stream additional data alongside the model's response. This can be achieved with [`StreamData`](/docs/reference/stream-helpers/stream-data).
+Depending on your use case, you may want to stream additional data alongside the model's response.
+This can be achieved with [`StreamData`](/docs/reference/stream-helpers/stream-data).
 
 ## What is StreamData
 
-The `StreamData` class allows you to stream arbitrary data to the client alongside your LLM response. This can be particularly useful in applications that need to augment AI responses with metadata, auxiliary information, or custom data structures that are relevant to the ongoing interaction.
+The `StreamData` class allows you to stream arbitrary data to the client alongside your LLM response.
+This can be particularly useful in applications that need to augment AI responses with metadata, auxiliary information,
+or custom data structures that are relevant to the ongoing interaction.
 
 ## How To Use StreamData
 
-To use `StreamData`, create a `StreamData` value on the server, append some data and then return it alongside the model response with [`StreamingTextResponse`](/docs/reference/stream-helpers/streaming-text-response). On the client, the [`useChat`](/docs/reference/ai-sdk-ui/use-chat) hook returns `data`, which will contain the additional data.
+To use `StreamData`, create a `StreamData` value on the server,
+append some data, and then include it in `toAIStreamResponse`.
+
+You need to call `close()` on the `StreamData` object to ensure the data is sent to the client.
+This can best be done in the `onFinish` callback of `streamText`.
+
+On the client, the [`useChat`](/docs/reference/ai-sdk-ui/use-chat) hook returns `data`, which will contain the additional data.
 
 ### On the server
 
@@ -22,9 +31,9 @@ To use `StreamData`, create a `StreamData` value on the server, append some data
   any framework.
 </Note>
 
-```tsx highlight="17-31"
+```tsx
 import { openai } from '@ai-sdk/openai';
-import { StreamingTextResponse, streamText, StreamData } from 'ai';
+import { streamText, StreamData } from 'ai';
 
 // Allow streaming responses up to 30 seconds
 export const maxDuration = 30;
@@ -33,27 +42,23 @@ export async function POST(req: Request) {
   // Extract the `messages` from the body of the request
   const { messages } = await req.json();
 
-  // Call the language model
-  const result = await streamText({
-    model: openai('gpt-4-turbo'),
-    messages,
-  });
-
   // Create a new StreamData
   const data = new StreamData();
 
   // Append additional data
   data.append({ test: 'value' });
 
-  // Convert the response into a friendly text-stream
-  const stream = result.toAIStream({
-    onFinal(_) {
+  // Call the language model
+  const result = await streamText({
+    model: openai('gpt-4-turbo'),
+    onFinish() {
       data.close();
     },
+    messages,
   });
 
   // Respond with the stream and additional StreamData
-  return new StreamingTextResponse(stream, {}, data);
+  return result.toAIStreamResponse({ data });
 }
 ```
 

content/docs/06-advanced/06-rate-limiting.mdx

@@ -19,7 +19,7 @@ and [Upstash Ratelimit](https://github.com/upstash/ratelimit).
 ```tsx filename='app/api/generate/route.ts'
 import kv from '@vercel/kv';
 import { openai } from '@ai-sdk/openai';
-import { OpenAIStream, StreamingTextResponse } from 'ai';
+import { StreamingTextResponse } from 'ai';
 import { Ratelimit } from '@upstash/ratelimit';
 import { NextRequest } from 'next/server';
 
@@ -49,7 +49,7 @@ export async function POST(req: NextRequest) {
     messages,
   });
 
-  return new StreamingTextResponse(result.toAIStream());
+  return result.toAIStreamResponse();
 }
 ```
 

content/docs/07-reference/ai-sdk-core/02-stream-text.mdx

@@ -761,9 +761,47 @@ for await (const textPart of textStream) {
     },
     {
       name: 'toAIStreamResponse',
-      type: '(init?: ResponseInit) => Response',
+      type: '(options?: ToAIStreamOptions) => Response',
       description:
         'Converts the result to a streamed response object with a stream data part stream. It can be used with the `useChat` and `useCompletion` hooks.',
+      properties: [
+        {
+          type: 'ToAIStreamOptions',
+          parameters: [
+            {
+              name: 'init',
+              type: 'ResponseInit',
+              optional: true,
+              description: 'The response init options.',
+              properties: [
+                {
+                  type: 'ResponseInit',
+                  parameters: [
+                    {
+                      name: 'status',
+                      type: 'number',
+                      optional: true,
+                      description: 'The response status code.',
+                    },
+                    {
+                      name: 'headers',
+                      type: 'Record<string, string>',
+                      optional: true,
+                      description: 'The response headers.',
+                    },
+                  ],
+                },
+              ],
+            },
+            {
+              name: 'data',
+              type: 'StreamData',
+              optional: true,
+              description: 'The stream data object.',
+            },
+          ],
+        },
+      ],
     },
     {
       name: 'toTextStreamResponse',