@ai-sdk/devtools 1.0.0-canary.28 → 1.0.0-canary.29

package/README.md

@@ -14,20 +14,46 @@ pnpm add @ai-sdk/devtools
 
 ## Requirements
 
-- AI SDK v6 beta (`ai@^6.0.0-beta.0`)
+- AI SDK v7 canary (`ai@canary`)
 - Node.js compatible runtime
 
 ## Usage
 
-### 1. Add the middleware to your model
+### 1. Register the telemetry integration
+
+Register `DevToolsTelemetry` globally so it captures all AI SDK calls:
+
+```typescript
+import { registerTelemetry } from 'ai';
+import { DevToolsTelemetry } from '@ai-sdk/devtools';
+
+registerTelemetry(DevToolsTelemetry());
+```
+
+Telemetry is enabled automatically once an integration is registered:
+
+```typescript
+import { generateText } from 'ai';
+
+const result = await generateText({
+  model: yourModel,
+  prompt: 'What cities are in the United States?',
+});
+```
+
+You can also pass the integration to individual calls instead of registering it
+globally:
 
 ```typescript
-import { wrapLanguageModel } from 'ai';
-import { devToolsMiddleware } from '@ai-sdk/devtools';
+import { streamText } from 'ai';
+import { DevToolsTelemetry } from '@ai-sdk/devtools';
 
-const model = wrapLanguageModel({
-  middleware: devToolsMiddleware(),
+const result = streamText({
   model: yourModel,
+  prompt: 'Hello!',
+  telemetry: {
+    integrations: [DevToolsTelemetry()],
+  },
 });
 ```
 
@@ -39,21 +65,26 @@ npx @ai-sdk/devtools
 
 Open http://localhost:4983 to view your AI SDK interactions.
 
+If you are using a monorepo, start DevTools from the same workspace where your
+AI SDK code runs.
+
 ## How it works
 
-The middleware intercepts all `generateText` and `streamText` calls, capturing:
+The `DevToolsTelemetry` integration hooks into the AI SDK telemetry lifecycle to
+capture `generateText`, `streamText`, `generateObject`, and `streamObject` calls.
+It captures:
 
 - Input parameters and prompts
 - Output content and tool calls
 - Token usage and timing
-- Raw provider request/response data
+- Raw provider data
 
 Data is stored locally in a JSON file (`.devtools/generations.json`) and served through a web UI.
 
 ### Data flow
 
 ```
-AI SDK call → devToolsMiddleware → JSON file → Hono API → React UI
+AI SDK call -> DevToolsTelemetry -> JSON file -> Hono API -> React UI
 ```
 
 ### Key concepts

package/dist/index.js

@@ -596,7 +596,7 @@ function DevToolsTelemetry() {
       });
       state.stepStates.delete(stepResult.stepNumber);
     },
-    onObjectStepFinish: async (event) => {
+    onObjectStepEnd: async (event) => {
       const stepResult = event;
       const state = callStates.get(stepResult.callId);
       if (!state) return;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ai-sdk/devtools",
-  "version": "1.0.0-canary.28",
+  "version": "1.0.0-canary.29",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -56,7 +56,7 @@
     "vite": "^6.4.2",
     "vitest": "^4.1.6",
     "zod": "3.25.76",
-    "ai": "7.0.0-canary.166"
+    "ai": "7.0.0-canary.167"
   },
   "publishConfig": {
     "access": "public",

package/src/integration.ts

@@ -350,7 +350,7 @@ export function DevToolsTelemetry(): Telemetry {
       state.stepStates.delete(stepResult.stepNumber);
     },
 
-    onObjectStepFinish: async event => {
+    onObjectStepEnd: async event => {
       const stepResult = event as GenerateObjectStepEndEvent;
 
       const state = callStates.get(stepResult.callId);