|
2 | 2 | title: Grok (xAI) |
3 | 3 | id: grok-adapter |
4 | 4 | order: 5 |
5 | | -description: "Use xAI Grok models with TanStack AI — Grok 4.1, Grok 4, Grok 3, and Grok 2 Image generation via @tanstack/ai-grok." |
| 5 | +description: "Use xAI Grok models with TanStack AI — Grok 4.1, Grok 4, Grok 3, Grok 2 Image generation, and Grok Imagine video generation via @tanstack/ai-grok." |
6 | 6 | keywords: |
7 | 7 | - tanstack ai |
8 | 8 | - grok |
9 | 9 | - xai |
10 | 10 | - grok 4 |
11 | 11 | - grok 4.1 |
12 | 12 | - image generation |
| 13 | + - video generation |
| 14 | + - grok imagine |
13 | 15 | - adapter |
14 | 16 | --- |
15 | 17 |
|
16 | | -The Grok adapter provides access to xAI's Grok models, including Grok 4.1, Grok 4, Grok 3, and image generation with Grok 2 Image. |
| 18 | +The Grok adapter provides access to xAI's Grok models, including Grok 4.1, Grok 4, Grok 3, image generation with Grok 2 Image, and video generation with the Grok Imagine video models. |
17 | 19 |
|
18 | 20 | ## Installation |
19 | 21 |
|
@@ -205,6 +207,67 @@ reachable; use a `data` source for private images. `grok-2-image-1212` is |
205 | 207 | text-to-image only — image prompt parts are a compile-time type error and |
206 | 208 | throw at runtime. |
207 | 209 |
|
| 210 | +## Video Generation (Experimental) |
| 211 | + |
| 212 | +Generate short video clips (1–15 seconds, with audio) with the Grok Imagine video models via xAI's asynchronous jobs/polling API: |
| 213 | + |
| 214 | +```typescript |
| 215 | +import { generateVideo, getVideoJobStatus } from "@tanstack/ai"; |
| 216 | +import { grokVideo } from "@tanstack/ai-grok"; |
| 217 | + |
| 218 | +const adapter = grokVideo("grok-imagine-video"); |
| 219 | + |
| 220 | +// 1. Create the job |
| 221 | +const { jobId } = await generateVideo({ |
| 222 | + adapter, |
| 223 | + prompt: "A red panda balancing on a bamboo stalk in the rain", |
| 224 | + size: "16:9_720p", // "aspectRatio" or "aspectRatio_resolution" |
| 225 | + duration: 5, // integer seconds, 1–15 |
| 226 | +}); |
| 227 | + |
| 228 | +// 2. Poll until complete, then read the video URL |
| 229 | +let status = await getVideoJobStatus({ adapter, jobId }); |
| 230 | +while (status.status !== "completed" && status.status !== "failed") { |
| 231 | + await new Promise((r) => setTimeout(r, 5000)); |
| 232 | + status = await getVideoJobStatus({ adapter, jobId }); |
| 233 | +} |
| 234 | + |
| 235 | +console.log(status.url); // hosted .mp4 URL |
| 236 | +``` |
| 237 | + |
| 238 | +Available models: |
| 239 | + |
| 240 | +- `grok-imagine-video` — text-to-video and image-to-video, $0.05 per second of video |
| 241 | +- `grok-imagine-video-1.5-preview` — preview of the next model generation, $0.08 per second |
| 242 | + |
| 243 | +Like the Grok Imagine image models, sizing is aspect-ratio based: the `size` option takes an `aspectRatio_resolution` template. Supported aspect ratios are `1:1`, `16:9`, `9:16`, `4:3`, `3:4`, `3:2`, and `2:3`; supported resolutions are `480p`, `720p`, and `1080p` (e.g. `"9:16_1080p"`). The resolution suffix is optional. |
| 244 | + |
| 245 | +For image-to-video, include an `image` prompt part as the starting frame and |
| 246 | +describe the desired motion in the text part. URL sources are fetched by xAI's |
| 247 | +servers (so they must be publicly reachable); use a `data` source for a base64 |
| 248 | +starting frame: |
| 249 | + |
| 250 | +```typescript |
| 251 | +const { jobId } = await generateVideo({ |
| 252 | + adapter: grokVideo("grok-imagine-video"), |
| 253 | + prompt: [ |
| 254 | + { |
| 255 | + type: "text", |
| 256 | + content: "Make the waterfall crash down and slowly pan out the camera", |
| 257 | + }, |
| 258 | + { |
| 259 | + type: "image", |
| 260 | + source: { type: "url", value: "https://example.com/waterfall-still.png" }, |
| 261 | + }, |
| 262 | + ], |
| 263 | + duration: 10, |
| 264 | +}); |
| 265 | +``` |
| 266 | + |
| 267 | +When the job completes, the adapter reports usage on the result: `usage.unitsBilled` carries the billed seconds of video and `usage.cost` the exact cost in USD, both as returned by the xAI API. |
| 268 | + |
| 269 | +See [Video Generation](../media/video-generation) for the full jobs/polling flow, streaming mode, and the `useGenerateVideo` hook. |
| 270 | + |
208 | 271 | ## Text-to-Speech |
209 | 272 |
|
210 | 273 | Generate speech with Grok TTS: |
@@ -308,6 +371,10 @@ Creates a Grok summarization adapter with an explicit API key. |
308 | 371 |
|
309 | 372 | Creates a Grok image generation adapter. |
310 | 373 |
|
| 374 | +### `grokVideo(model, config?)` / `createGrokVideo(model, apiKey, config?)` |
| 375 | + |
| 376 | +Creates a Grok video generation adapter (experimental) for the Grok Imagine video models (`'grok-imagine-video'`, `'grok-imagine-video-1.5-preview'`). |
| 377 | + |
311 | 378 | ### `grokSpeech(model, config?)` / `createGrokSpeech(model, apiKey, config?)` |
312 | 379 |
|
313 | 380 | Creates a Grok text-to-speech adapter. |
|
0 commit comments