chore: extract rsc to separate package (#5542)

Author: samdenty

.changeset/afraid-moles-cross.md

@@ -0,0 +1,6 @@
+---
+'@ai-sdk/rsc': major
+'ai': major
+---
+
+chore(@ai-sdk/rsc): extract to separate package

content/cookbook/20-rsc/20-stream-text.mdx

@@ -20,14 +20,14 @@ Text generation can sometimes take a long time to complete, especially when you'
 
 ## Client
 
-Let's create a simple React component that will call the `generate` function when a button is clicked. The `generate` function will call the `streamText` function, which will then generate text based on the input prompt. To consume the stream of text in the client, we will use the `readStreamableValue` function from the `ai/rsc` module.
+Let's create a simple React component that will call the `generate` function when a button is clicked. The `generate` function will call the `streamText` function, which will then generate text based on the input prompt. To consume the stream of text in the client, we will use the `readStreamableValue` function from the `@ai-sdk/rsc` module.
 
 ```tsx filename="app/page.tsx"
 'use client';
 
 import { useState } from 'react';
 import { generate } from './actions';
-import { readStreamableValue } from 'ai/rsc';
+import { readStreamableValue } from '@ai-sdk/rsc';
 
 // Allow streaming responses up to 30 seconds
 export const maxDuration = 30;
@@ -66,7 +66,7 @@ Using DevTools, we can see the text generation being streamed to the client in r
 
 import { streamText } from 'ai';
 import { openai } from '@ai-sdk/openai';
-import { createStreamableValue } from 'ai/rsc';
+import { createStreamableValue } from '@ai-sdk/rsc';
 
 export async function generate(input: string) {
   const stream = createStreamableValue('');

content/cookbook/20-rsc/21-stream-text-with-chat-prompt.mdx

@@ -32,7 +32,7 @@ Let's create a simple conversation between a user and a model, and place a butto
 
 import { useState } from 'react';
 import { Message, continueConversation } from './actions';
-import { readStreamableValue } from 'ai/rsc';
+import { readStreamableValue } from '@ai-sdk/rsc';
 
 // Allow streaming responses up to 30 seconds
 export const maxDuration = 30;
@@ -95,7 +95,7 @@ Now, let's implement the `continueConversation` function that will insert the us
 
 import { streamText } from 'ai';
 import { openai } from '@ai-sdk/openai';
-import { createStreamableValue } from 'ai/rsc';
+import { createStreamableValue } from '@ai-sdk/rsc';
 
 export interface Message {
   role: 'user' | 'assistant';

content/cookbook/20-rsc/40-stream-object.mdx

@@ -51,7 +51,7 @@ Let's create a simple React component that will call the `getNotifications` func
 
 import { useState } from 'react';
 import { generate } from './actions';
-import { readStreamableValue } from 'ai/rsc';
+import { readStreamableValue } from '@ai-sdk/rsc';
 
 // Allow streaming responses up to 30 seconds
 export const maxDuration = 30;
@@ -92,7 +92,7 @@ Now let's implement the `getNotifications` function. We'll use the `generateObje
 
 import { streamObject } from 'ai';
 import { openai } from '@ai-sdk/openai';
-import { createStreamableValue } from 'ai/rsc';
+import { createStreamableValue } from '@ai-sdk/rsc';
 import { z } from 'zod';
 
 export async function generate(input: string) {

content/cookbook/20-rsc/60-save-messages-to-database.mdx

@@ -41,7 +41,7 @@ export default function RootLayout({
 
 import { useState } from 'react';
 import { ClientMessage } from './actions';
-import { useActions, useUIState } from 'ai/rsc';
+import { useActions, useUIState } from '@ai-sdk/rsc';
 import { generateId } from 'ai';
 
 // Allow streaming responses up to 30 seconds
@@ -100,7 +100,7 @@ We will use the callback function to listen to state changes and save the conver
 ```tsx filename='app/actions.tsx'
 'use server';
 
-import { getAIState, getMutableAIState, streamUI } from 'ai/rsc';
+import { getAIState, getMutableAIState, streamUI } from '@ai-sdk/rsc';
 import { openai } from '@ai-sdk/openai';
 import { ReactNode } from 'react';
 import { z } from 'zod';
@@ -176,7 +176,7 @@ export async function continueConversation(
 ```
 
 ```ts filename='app/ai.ts'
-import { createAI } from 'ai/rsc';
+import { createAI } from '@ai-sdk/rsc';
 import { ServerMessage, ClientMessage, continueConversation } from './actions';
 
 export const AI = createAI<ServerMessage[], ClientMessage[]>({

content/cookbook/20-rsc/61-restore-messages-from-database.mdx

@@ -39,7 +39,7 @@ export default function RootLayout({
 
 import { useState, useEffect } from 'react';
 import { ClientMessage } from './actions';
-import { useActions, useUIState } from 'ai/rsc';
+import { useActions, useUIState } from '@ai-sdk/rsc';
 import { generateId } from 'ai';
 
 export default function Home() {
@@ -97,7 +97,7 @@ export default function Home() {
 The server-side implementation handles the restoration of messages and their transformation into the appropriate format for display.
 
 ```tsx filename='app/ai.ts'
-import { createAI } from 'ai/rsc';
+import { createAI } from '@ai-sdk/rsc';
 import { ServerMessage, ClientMessage, continueConversation } from './actions';
 import { Stock } from '@ai-studio/components/stock';
 import { generateId } from 'ai';
@@ -126,7 +126,7 @@ export const AI = createAI<ServerMessage[], ClientMessage[]>({
 ```tsx filename='app/actions.tsx'
 'use server';
 
-import { getAIState } from 'ai/rsc';
+import { getAIState } from '@ai-sdk/rsc';
 
 export interface ServerMessage {
   role: 'user' | 'assistant' | 'function';

content/cookbook/20-rsc/90-render-visual-interface-in-chat.mdx

@@ -17,7 +17,7 @@ When we define multiple functions in [`tools`](/docs/reference/ai-sdk-core/gener
 
 import { useState } from 'react';
 import { ClientMessage } from './actions';
-import { useActions, useUIState } from 'ai/rsc';
+import { useActions, useUIState } from '@ai-sdk/rsc';
 import { generateId } from 'ai';
 
 // Allow streaming responses up to 30 seconds
@@ -112,7 +112,7 @@ export async function Flight({ flightNumber }) {
 ```tsx filename='app/actions.tsx'
 'use server';
 
-import { getMutableAIState, streamUI } from 'ai/rsc';
+import { getMutableAIState, streamUI } from '@ai-sdk/rsc';
 import { openai } from '@ai-sdk/openai';
 import { ReactNode } from 'react';
 import { z } from 'zod';
@@ -206,7 +206,7 @@ export async function continueConversation(
 ```
 
 ```typescript filename='app/ai.ts'
-import { createAI } from 'ai/rsc';
+import { createAI } from '@ai-sdk/rsc';
 import { ServerMessage, ClientMessage, continueConversation } from './actions';
 
 export const AI = createAI<ServerMessage[], ClientMessage[]>({

content/cookbook/20-rsc/91-stream-updates-to-visual-interfaces.mdx

@@ -15,7 +15,7 @@ In our previous example we've been streaming react components from the server to
 
 import { useState } from 'react';
 import { ClientMessage } from './actions';
-import { useActions, useUIState } from 'ai/rsc';
+import { useActions, useUIState } from '@ai-sdk/rsc';
 import { generateId } from 'ai';
 
 // Allow streaming responses up to 30 seconds
@@ -72,7 +72,7 @@ export default function Home() {
 ```tsx filename='app/actions.tsx'
 'use server';
 
-import { getMutableAIState, streamUI } from 'ai/rsc';
+import { getMutableAIState, streamUI } from '@ai-sdk/rsc';
 import { openai } from '@ai-sdk/openai';
 import { ReactNode } from 'react';
 import { z } from 'zod';
@@ -137,7 +137,7 @@ export async function continueConversation(
 ```
 
 ```typescript filename='app/ai.ts'
-import { createAI } from 'ai/rsc';
+import { createAI } from '@ai-sdk/rsc';
 import { ServerMessage, ClientMessage, continueConversation } from './actions';
 
 export const AI = createAI<ServerMessage[], ClientMessage[]>({

content/cookbook/20-rsc/92-stream-ui-record-token-usage.mdx

@@ -19,7 +19,7 @@ It is called when the stream is finished.
 
 import { useState } from 'react';
 import { ClientMessage } from './actions';
-import { useActions, useUIState } from 'ai/rsc';
+import { useActions, useUIState } from '@ai-sdk/rsc';
 import { generateId } from 'ai';
 
 // Allow streaming responses up to 30 seconds
@@ -76,7 +76,7 @@ export default function Home() {
 ```tsx filename='app/actions.tsx' highlight={"57-63"}
 'use server';
 
-import { createAI, getMutableAIState, streamUI } from 'ai/rsc';
+import { createAI, getMutableAIState, streamUI } from '@ai-sdk/rsc';
 import { openai } from '@ai-sdk/openai';
 import { ReactNode } from 'react';
 import { z } from 'zod';
@@ -148,7 +148,7 @@ export async function continueConversation(
 ```
 
 ```typescript filename='app/ai.ts'
-import { createAI } from 'ai/rsc';
+import { createAI } from '@ai-sdk/rsc';
 import { ServerMessage, ClientMessage, continueConversation } from './actions';
 
 export const AI = createAI<ServerMessage[], ClientMessage[]>({

content/docs/02-guides/21-llama-3_1.mdx

@@ -254,7 +254,7 @@ First, create a Server Action.
 ```tsx filename="app/actions.tsx"
 'use server';
 
-import { streamUI } from 'ai/rsc';
+import { streamUI } from '@ai-sdk/rsc';
 import { deepinfra } from '@ai-sdk/deepinfra';
 import { z } from 'zod';