Skill

ai-python-ui-adapter

Name: ai-python-ui-adapter
Author: Vercel Labs

connect AI SDK Python streams to UI

Published by Vercel Labs Updated Jul 29

Covers Python AI SDK Frontend

Description

Use when connecting AI SDK for Python streams to AI SDK UI useChat clients.

SKILL.md

ai-python-ui-adapter

Frontend:

const chat = useChat({
  transport: new DefaultChatTransport({ api: "/api/chat" }),
  sendAutomaticallyWhen: lastAssistantMessageIsCompleteWithApprovalResponses,
});

Use chat.sendMessage(...) to send user input. Use chat.addToolApprovalResponse(...) from approval buttons.

Backend request:

class ChatRequest(pydantic.BaseModel):
    messages: list[ai.ui.ai_sdk.UIMessage]

messages, approvals = ai.ui.ai_sdk.to_messages(request.messages)
ai.ui.ai_sdk.apply_approvals(approvals)

Backend stream:

async def body():
    async with agent.run(model, messages) as stream:
        async def events():
            async for event in stream:
                if (
                    isinstance(event, ai.events.HookEvent)
                    and event.hook.status == "pending"
                ):
                    ai.defer_hook(event.hook)
                yield event

        async for chunk in ai.ui.ai_sdk.to_sse(events()):
            yield chunk

return StreamingResponse(
    body(),
    headers=ai.ui.ai_sdk.UI_MESSAGE_STREAM_HEADERS,
)

The adapter handles UIMessage parsing, message IDs, tool state, approvals, subagent MessageBundle values, and AI SDK UI stream events.

You handle the HTTP route, auth, storage, session lookup, frontend rendering, and when to defer hooks.

For saved UI history, use:

ui_messages = ai.ui.ai_sdk.to_ui_messages(messages)

More skills from the ai-python repository

View all 9 skills

SkillTagsUpdated

More from Vercel Labs

View publisher

SkillTagsUpdated