CHAT

A streaming AI conversation component. Handles the full loop — input composer, streaming assistant response, STOP to cancel mid-stream, CLR to reset the transcript. Wraps whatever CathodeAIProvider your app supplies; Cathode UI doesn't ship one.

Live demo

Below runs against a mock provider defined in the docs site itself, so it works offline. In your app you'd swap makeMockProvider() for an adapter that streams from your real LLM.

Usage

import { CathodeProvider, Chat } from '@cathode-ui/react';
import { myProvider } from './my-ai-provider';

export function ChatScreen() {
  return (
    <CathodeProvider ai={myProvider}>
      <Chat title="SUPPORT" maxHeight={480} />
    </CathodeProvider>
  );
}

Provider interface

Your provider implements three verbs:

interface CathodeAIProvider {
  suggest(prefix: string, signal?: AbortSignal): AsyncIterable<string>;
  chat(messages: ChatMessage[], signal?: AbortSignal): AsyncIterable<string>;
  act(intent: string, context?: unknown, signal?: AbortSignal): Promise<string>;
}

suggest powers TextField ghost-text, chat powers Chat, act powers Button AI actions and SearchBar semantic ranking. One provider, all four surfaces — or implement just the ones you need.

Props

Name	Type	Default	Description
`provider`	`CathodeAIProvider`	—	Overrides the provider supplied via CathodeProvider.
`systemPrompt`	`string`	—	Injected before the first user turn.
`placeholder`	`string`	"TYPE A MESSAGE…"	Composer placeholder.
`title`	`string`	"CHAT"	Title rendered on the TerminalFrame.
`maxHeight`	`number`	320	Scroll cap in px.