Vercel AI SDK

Use AICredits with the Vercel AI SDK. Stream responses in Next.js, SvelteKit, and other frameworks using createOpenAI.

The Vercel AI SDK (ai package) works with AICredits via the createOpenAI provider. Stream to the browser, use tool calls, and generate structured data with full TypeScript support.

Overview

The Vercel AI SDK is ideal for building streaming chat interfaces in Next.js, SvelteKit, Nuxt, and other frameworks. It handles SSE streaming, abort signals, and React hooks out of the box — and AICredits is a drop-in for any OpenAI-based model.

Setup

npm install ai @ai-sdk/openai

lib/aicredits.ts

import { createOpenAI } from "@ai-sdk/openai";

export const aicredits = createOpenAI({
  baseURL: "https://api.aicredits.in/v1",
  apiKey: process.env.AICREDITS_API_KEY!,
});

// Usage: aicredits("openai/gpt-4o-mini")
// Usage: aicredits("anthropic/claude-sonnet-4.5")

Generate Text

import { generateText } from "ai";
import { aicredits } from "@/lib/aicredits";

const { text } = await generateText({
  model: aicredits("openai/gpt-4o-mini"),
  prompt: "What are the top 3 places to visit in Rajasthan?",
});

console.log(text);

Stream Text

import { streamText } from "ai";
import { aicredits } from "@/lib/aicredits";

const result = streamText({
  model: aicredits("anthropic/claude-sonnet-4.5"),
  messages: [
    { role: "system", content: "You are a helpful travel guide for India." },
    { role: "user", content: "Tell me about Varanasi." },
  ],
});

for await (const chunk of result.textStream) {
  process.stdout.write(chunk);
}

Next.js Route Handler

Stream AI responses directly to the browser from a Next.js App Router route handler:

app/api/chat/route.ts

import { streamText } from "ai";
import { aicredits } from "@/lib/aicredits";

export async function POST(req: Request) {
  const { messages } = await req.json();

  const result = streamText({
    model: aicredits("openai/gpt-4o-mini"),
    system: "You are a helpful assistant.",
    messages,
  });

  return result.toDataStreamResponse();
}

app/page.tsx

"use client";

import { useChat } from "ai/react";

export default function Chat() {
  const { messages, input, handleInputChange, handleSubmit } = useChat();

  return (
    <div>
      {messages.map((m) => (
        <div key={m.id}>
          <strong>{m.role}:</strong> {m.content}
        </div>
      ))}
      <form onSubmit={handleSubmit}>
        <input value={input} onChange={handleInputChange} placeholder="Ask something..." />
        <button type="submit">Send</button>
      </form>
    </div>
  );
}

Structured Output

import { generateObject } from "ai";
import { aicredits } from "@/lib/aicredits";
import { z } from "zod";

const { object } = await generateObject({
  model: aicredits("openai/gpt-4o-mini"),
  schema: z.object({
    city: z.string(),
    country: z.string(),
    population: z.number(),
    famousFor: z.array(z.string()).max(3),
  }),
  prompt: "Describe Mumbai as a city.",
});

console.log(object.city);       // Mumbai
console.log(object.famousFor);  // ["Bollywood", "Finance", "Street food"]

Tool Calls

import { streamText, tool } from "ai";
import { aicredits } from "@/lib/aicredits";
import { z } from "zod";

const result = streamText({
  model: aicredits("openai/gpt-4o-mini"),
  prompt: "What is the weather in Mumbai?",
  tools: {
    getWeather: tool({
      description: "Get the current weather for a city",
      parameters: z.object({
        city: z.string().describe("The city name"),
      }),
      execute: async ({ city }) => {
        return { city, temperature: 32, condition: "Sunny" };
      },
    }),
  },
});

for await (const chunk of result.fullStream) {
  if (chunk.type === "text-delta") {
    process.stdout.write(chunk.textDelta);
  }
  if (chunk.type === "tool-result") {
    console.log("Tool result:", chunk.result);
  }
}

The Vercel AI SDK handles the full tool-calling loop automatically when maxSteps is set — no manual loop needed.