Local and simple APIs

Start with plain data or a maintained text transport; add no extra conversation engine.

Choose the actual wire

For a local view or a JSON endpoint already returning canonical messages, use the plain-data example. Keep data and callbacks in your existing React/application store. The external-store example adds guarded commands without a model dependency.

For an endpoint that streams plain UTF-8 text, use the maintained AI SDK TextStreamChatTransport. Install the checked Vercel packages and view peers. This transport does not imply tool, file or structured UI-data support.

simple-text-api.tsx

123456789101112131415161718192021222324import { useState } from "react";
import { Button } from "@ghost-ui/core/components/button";
import { useChat } from "@ai-sdk/react";
import { TextStreamChatTransport } from "ai";
import { createAiSdkAdapter } from "@ghost-ui/core/chat-adapter-ai-sdk";
import { useChatAdapter } from "@ghost-ui/core/chat-runtime-react";
import { Message, MessageBody } from "@ghost-ui/core/components/message";
import { MessageParts } from "@ghost-ui/core/components/message-parts";
const adapter = createAiSdkAdapter();
export function SimpleTextApi({ endpoint, threadId, revision }: { endpoint: string; threadId: string; revision: number }) {
  const chat = useChat({ transport: new TextStreamChatTransport({ api: endpoint }) });
  const runtime = useChatAdapter(adapter, chat, { identity: { threadId, revision } });
  const [error, setError] = useState<unknown>();
  return <>
    {runtime.messages.map(message => <Message key={message.id} actor={message.actor}><MessageBody>
      <MessageParts parts={message.parts} />
    </MessageBody></Message>)}
    <Button disabled={runtime.capabilities.send.support !== "supported" || !runtime.capabilities.send.available}
      onClick={() => { setError(undefined); void Promise.resolve().then(() => runtime.controller.send({ text: "Review the brief", attachments: [] })).catch(setError); }}>Review brief</Button>
    {runtime.capabilities.stop.support === "supported" && runtime.capabilities.stop.available &&
      <Button onClick={() => { void Promise.resolve().then(() => runtime.controller.stop?.()).catch(setError); }}>Stop</Button>}
    {(error || runtime.controller.error) ? <p role="alert">The request could not complete.</p> : null}
  </>;
}

Connect a Composer or application input to runtime.controller.send({ text, attachments: [] }); use its guarded stop command and handle rejected commands. The SDK supplies message assembly and cancellation. Supply custom transport request options for authentication and request-body policy rather than hiding them in Ghost.

Upgrade only when needed

Plain text has no tool or artifact schema. Move to current UI-message SSE, AG-UI or full agent state when those contracts solve an actual need. Do not guess a stream format from a successful response or copy a bespoke parser into the view.