Choose how the Vue primitives get their messages: the AI SDK, assistant-cloud, or your own store.
A runtime fills the threads key of AuiConfig. The AuiProvider makes its messages and actions available to Vue primitives. Choose the runtime by where conversations and messages need to live.
| Runtime | Threads | Messages | Guide |
|---|---|---|---|
AISDKChat | One thread | One client-side AI SDK chat | AI SDK |
AISDKThreads | A thread list in memory | One client-side AI SDK chat per thread | AI SDK |
AISDKThreads with cloud | A thread list backed by assistant-cloud | One AI SDK chat per thread, with cloud-backed history | Cloud |
RuntimeAdapter | Supplied by your runtime | Your external store | External store |
AISDKChat
AISDKChat creates one thread. Its default AssistantChatTransport sends to /api/chat.
<script setup lang="ts">
import { AuiConfig, AuiProvider } from "@assistant-ui/vue";
import { AISDKChat } from "@assistant-ui/ai-sdk";
const config = AuiConfig({
threads: AISDKChat(),
});
</script>
<template>
<AuiProvider :config="config">
<slot />
</AuiProvider>
</template>See AISDKChat for transport options and the server route.
AISDKThreads
AISDKThreads creates a list with one AI SDK chat per thread. Without cloud, the list and chat histories stay in memory for the lifetime of the client.
<script setup lang="ts">
import { AuiConfig, AuiProvider } from "@assistant-ui/vue";
import { AISDKThreads } from "@assistant-ui/ai-sdk";
const config = AuiConfig({
threads: AISDKThreads(),
});
</script>
<template>
<AuiProvider :config="config">
<slot />
</AuiProvider>
</template>See AISDKThreads for the runtime setup and Thread list for the controls that switch between conversations.
assistant-cloud
Pass an AssistantCloud instance as the cloud option to AISDKThreads for a remote thread list and cloud-backed message history. The Cloud guide covers setup and persistence.
External store
Use RuntimeAdapter when your own store supplies message state and actions. The External store guide shows how to connect it to AuiConfig.