Chat Screen

Streamdown

Thread list, message log and reply bar, wired to Stream Response.

assistant

What changed in the refund policy this quarter?

Assistant

Three things. Late refunds need approval, split shipments can be refunded in parts, and store credit is instant.

Install

$ npx shadcn@latest add https://spotcheckui.com/r/chat-screen.json

No motion engine needed.

Usage

import { ChatScreen } from "@/components/spotcheck/chat-screen"

<ChatScreen api="/api/chat" threads={threads} />

It posts the whole conversation as { messages } to api and reads the reply with useStream. Each finished reply is saved to its thread with its sources. Threads live in component state, so connect them to your own storage.

Props

api * RequiredstringDefault —The endpoint that streams replies. It receives { messages } as JSON.
threads * RequiredChatThread[]Default —
classNamestringDefault —

Keyboard

Tab	Move between threads, the log and the reply bar
Enter	Send the reply

Reduced motion

Follows Stream Response: text streams, and the caret stays still.