SuperAPI AI Directory

ai-sdk-ui-v7

Frontend & websites

View repository

Updated 10-15 14:19

About this skill

Skill: ai-sdk-ui

Scope

  • Applies to: @ai-sdk/react useChat and DefaultChatTransport from ai
  • Does NOT cover: Backend generation (see ai-sdk-core)

Assumptions

  • SDK major is ai ^7; @ai-sdk/react is a separate package major. Folder follows ai
  • Never write useChat from memory. Grep node_modules/@ai-sdk/react/docs/ and node_modules/ai/docs/, else https://ai-sdk.dev/docs/ai-sdk-ui/chatbot
  • Chat HTTP may be Fastify; pass transport when the URL is not /api/chat

Principles

  • useChat from @ai-sdk/react; DefaultChatTransport from ai
  • Local input state; sendMessage({ text }); status not isLoading; render message.parts
  • Server: see ai-sdk-core. Handlers use createUIMessageStreamResponse + toUIMessageStream({ stream: result.stream }). Leave deprecated toUIMessageStreamResponse() only when the task is unrelated to streaming or the SDK

Constraints

MUST

  • DefaultChatTransport({ api }) when the endpoint is not /api/chat
  • Disable send while status !== 'ready'

AVOID

  • import { useChat } from 'ai/react'
  • toDataStreamResponse / pipeDataStreamToResponse
  • Pre-v5 handleInputChange / handleSubmit / useAssistant

Interactions

Templates