@threadplane/chatClassv0.3.4

ChatComponent

Composes an agent conversation with message input, streaming content, tool views, and customizable activity templates.

import { ChatComponent } from '@threadplane/chat';

Declaration

export declare class ChatComponent  {
  constructor();
  readonly activeThreadId: import("@angular/core").InputSignal<string>;
  readonly activityTemplate: import("@angular/core").Signal<ChatActivityTemplateDirective | undefined>;
  readonly agent: import("@angular/core").InputSignal<Agent<unknown>>;
  classifyMessage(content: string, message: Pick<Message, 'id' | 'delivery'>): ContentClassifier;
  clearClassifiers(): void;
  clearThread(): void;
  readonly clientToolContinuationLimit: import("@angular/core").OutputEmitterRef<ClientToolContinuationLimitEvent>;
  readonly clientToolContinuationPolicy: import("@angular/core").InputSignal<ClientToolContinuationPolicy | undefined>;
  readonly clientToolExecutionGuard: import("@angular/core").InputSignal<ClientToolExecutionGuard | undefined>;
  readonly clientTools: import("@angular/core").InputSignal<Readonly<Record<string, import("../../client-tools/tool-def").ClientToolDef>> | undefined>;
  readonly excludedToolNames: import("@angular/core").Signal<readonly string[]>;
  readonly genuiToolNames: import("@angular/core").InputSignal<readonly string[]>;
  readonly handlers: import("@angular/core").InputSignal<Record<string, (params: Record<string, unknown>) => unknown | Promise<unknown>>>;
  readonly interruptTemplate: import("@angular/core").Signal<ChatInterruptTemplateDirective | undefined>;
  readonly messageContent: typeof messageContent;
  readonly messageCopy: import("@angular/core").OutputEmitterRef<{
        messageIndex: number;
        content: string;
    }>;
  readonly modelOptions: import("@angular/core").InputSignal<readonly ChatSelectOption[]>;
  readonly modelPickerPlaceholder: import("@angular/core").InputSignal<string>;
  onA2uiAction(message: A2uiActionMessage): void;
  onA2uiEvent(event: RenderEvent, messageIndex: number, surfaceId: string): void;
  onCopy(message: unknown, content: string): void;
  onRate(message: unknown, value: 'up' | 'down'): void;
  onRegenerate(messageIndex: number): void;
  onSpecEvent(event: RenderEvent, messageIndex: number): void;
  prevRole(index: number): ChatMessageRole | undefined;
  readonly rate: import("@angular/core").OutputEmitterRef<{
        messageIndex: number;
        rating: "up" | "down";
    }>;
  readonly regenerate: import("@angular/core").OutputEmitterRef<void>;
  readonly renderEvent: import("@angular/core").OutputEmitterRef<ChatRenderEvent>;
  readonly renderRegistry: import("@angular/core").Signal<import("@threadplane/render").AngularRegistry | undefined>;
  readonly resolvedStore: import("@angular/core").Signal<StateStore | undefined>;
  readonly runActivityTemplate: import("@angular/core").Signal<ChatRunActivityTemplateDirective | undefined>;
  scrollToBottom(): void;
  readonly selectedModel: import("@angular/core").ModelSignal<string>;
  readonly showModelPicker: import("@angular/core").InputSignal<boolean>;
  readonly showWelcome: import("@angular/core").Signal<boolean>;
  readonly store: import("@angular/core").InputSignal<StateStore | undefined>;
  submitMessage(text: string): void;
  readonly threads: import("@angular/core").InputSignal<Thread[]>;
  readonly threadSelected: import("@angular/core").OutputEmitterRef<string>;
  readonly toolCallTemplates: import("@angular/core").Signal<readonly ChatToolCallTemplateDirective[]>;
  readonly views: import("@angular/core").InputSignal<Readonly<Record<string, import("@threadplane/render").RenderViewEntry | import("@angular/core").Type<unknown>>> | undefined>;
  readonly viewToolNames: import("@angular/core").Signal<readonly string[]>;
  readonly welcomeDisabled: import("@angular/core").InputSignal<boolean>;
}

Angular template API

Selector: chat

Inputs

activeThreadId: string
agent · required: Agent<unknown>
clientToolContinuationPolicy: ClientToolContinuationPolicy | undefined
clientToolExecutionGuard: ClientToolExecutionGuard | undefined
clientTools: Readonly<Record<string, ClientToolDef>> | undefined
genuiToolNames: readonly string[]
handlers: Record<string, (params: Record<string, unknown>) => unknown>
modelOptions: readonly ChatSelectOption[]
modelPickerPlaceholder: string
selectedModel: string
showModelPicker: boolean
store: StateStore | undefined
threads: Thread[]
views: Readonly<Record<string, RenderViewEntry | Type<unknown>>> | undefined
welcomeDisabled: boolean

Outputs

clientToolContinuationLimit: ClientToolContinuationLimitEvent
messageCopy: { messageIndex: number; content: string; }
rate: { messageIndex: number; rating: "up" | "down"; }
regenerate: void
renderEvent: ChatRenderEvent
selectedModelChange: string
threadSelected: string

Members

Constructor · overload 1

Constructs a new instance of the ChatComponent class

constructor();

activeThreadId

readonly activeThreadId: import("@angular/core").InputSignal<string>;

activityTemplate

Optional per-message activity renderer projected as <ng-template chatActivityTemplate>. When present it replaces the reasoning pill and the tool-call region of every assistant message, and takes precedence over any projected chatToolCallTemplate.

readonly activityTemplate: import("@angular/core").Signal<ChatActivityTemplateDirective | undefined>;

agent

readonly agent: import("@angular/core").InputSignal<Agent<unknown>>;

classifyMessage · overload 1

classifyMessage(content: string, message: Pick<Message, 'id' | 'delivery'>): ContentClassifier;

Parameters

content · required: string
message · required: Pick<Message, 'id' | 'delivery'>

Returns

ContentClassifier

clearClassifiers · overload 1

clearClassifiers(): void;

Returns

void

clearThread · overload 1

Clears local view state (classifiers, surface store, lifecycle counters) for a new thread.

Resets messageCount to 0 and inputSubmittedAt to null. componentReady and firstMessageSent are NOT reset (sticky for the chat instance lifetime).

clearThread(): void;

Returns

void

clientToolContinuationLimit

readonly clientToolContinuationLimit: import("@angular/core").OutputEmitterRef<ClientToolContinuationLimitEvent>;

clientToolContinuationPolicy

readonly clientToolContinuationPolicy: import("@angular/core").InputSignal<ClientToolContinuationPolicy | undefined>;

clientToolExecutionGuard

readonly clientToolExecutionGuard: import("@angular/core").InputSignal<ClientToolExecutionGuard | undefined>;

clientTools

Client-declared tools (view/ask/function) the model may call. When provided, a coordinator ships their catalog to the agent, runs function tools in the browser, and renders/resolves view/ask tools through the same tool-views pipeline as views. Additive — leave undefined for the classic server-tools-only experience.

readonly clientTools: import("@angular/core").InputSignal<Readonly<Record<string, import("../../client-tools/tool-def").ClientToolDef>> | undefined>;

excludedToolNames

Union of GenUI dispatcher tool names and registered view tool names.

readonly excludedToolNames: import("@angular/core").Signal<readonly string[]>;

genuiToolNames

Tool names whose calls produce a rendered GenUI surface rather than visible text. Used to (a) filter <chat-tool-calls> so internal dispatchers don't render args JSON as cards, and (b) detect "this is a GenUI turn" for the building-UI skeleton. Default covers the canonical A2UI + json-render schema tools.

readonly genuiToolNames: import("@angular/core").InputSignal<readonly string[]>;

handlers

readonly handlers: import("@angular/core").InputSignal<Record<string, (params: Record<string, unknown>) => unknown | Promise<unknown>>>;

interruptTemplate

Optional interrupt renderer projected as <ng-template chatInterruptTemplate>. Rendered at the end of the transcript while agent.interrupt() is defined.

readonly interruptTemplate: import("@angular/core").Signal<ChatInterruptTemplateDirective | undefined>;

messageContent

readonly messageContent: typeof messageContent;

messageCopy

Emitted when the user copies an assistant message.

readonly messageCopy: import("@angular/core").OutputEmitterRef<{
        messageIndex: number;
        content: string;
    }>;

modelOptions

High-level model-picker API. When modelOptions is non-empty, the chat composition renders a <chat-select> inside the input pill (in BOTH welcome and conversation modes), wired to the two-way selectedModel model. Consumers who want full control should leave modelOptions empty and project a <chat-select chatInputModelSelect> themselves.

readonly modelOptions: import("@angular/core").InputSignal<readonly ChatSelectOption[]>;

modelPickerPlaceholder

readonly modelPickerPlaceholder: import("@angular/core").InputSignal<string>;

onA2uiAction · overload 1

onA2uiAction(message: A2uiActionMessage): void;

Parameters

message · required: A2uiActionMessage

Returns

void

onA2uiEvent · overload 1

onA2uiEvent(event: RenderEvent, messageIndex: number, surfaceId: string): void;

Parameters

event · required: RenderEvent
messageIndex · required: number
surfaceId · required: string

Returns

void

onCopy · overload 1

onCopy(message: unknown, content: string): void;

Parameters

message · required: unknown
content · required: string

Returns

void

onRate · overload 1

onRate(message: unknown, value: 'up' | 'down'): void;

Parameters

message · required: unknown
value · required: 'up' | 'down'

Returns

void

onRegenerate · overload 1

Regenerate the assistant response at the given message index.

onRegenerate(messageIndex: number): void;

Parameters

messageIndex · required: number

Returns

void

onSpecEvent · overload 1

onSpecEvent(event: RenderEvent, messageIndex: number): void;

Parameters

event · required: RenderEvent
messageIndex · required: number

Returns

void

prevRole · overload 1

prevRole(index: number): ChatMessageRole | undefined;

Parameters

index · required: number

Returns

ChatMessageRole | undefined

rate

Emitted when the user rates an assistant message.

readonly rate: import("@angular/core").OutputEmitterRef<{
        messageIndex: number;
        rating: "up" | "down";
    }>;

regenerate

Emitted when the user clicks the regenerate button on an assistant message.

readonly regenerate: import("@angular/core").OutputEmitterRef<void>;

renderEvent

readonly renderEvent: import("@angular/core").OutputEmitterRef<ChatRenderEvent>;

renderRegistry

readonly renderRegistry: import("@angular/core").Signal<import("@threadplane/render").AngularRegistry | undefined>;

resolvedStore

readonly resolvedStore: import("@angular/core").Signal<StateStore | undefined>;

runActivityTemplate

Optional turn-level run renderer projected as <ng-template chatRunActivityTemplate>. Rendered after the last message while a run is active and has no assistant message yet, in place of the typing indicator.

readonly runActivityTemplate: import("@angular/core").Signal<ChatRunActivityTemplateDirective | undefined>;

scrollToBottom · overload 1

Scrolls the transcript to its newest content and re-pins it, exactly as the scroll-to-bottom bubble does. Hosts that apply many messages in one pass (a replay seeking to a recorded time, a restored thread rendered after tool views mount) call this once their layout has settled: the chat's own pin runs when messages change, which can be before the views that follow them have rendered. The write is counted as programmatic so the scroll event it raises does not read as the user unpinning.

scrollToBottom(): void;

Returns

void

selectedModel

readonly selectedModel: import("@angular/core").ModelSignal<string>;

showModelPicker

When false, hide the auto-rendered model picker even when modelOptions is non-empty. Useful in cramped surfaces (popup, sidebar) where the picker crowds the input. Defaults to true. Has no effect when consumers project their own <chat-select chatInputModelSelect> via content projection.

readonly showModelPicker: import("@angular/core").InputSignal<boolean>;

showWelcome

readonly showWelcome: import("@angular/core").Signal<boolean>;

store

readonly store: import("@angular/core").InputSignal<StateStore | undefined>;

submitMessage · overload 1

Programmatic submit. Calls agent.submit({ message: text }) and updates the CHAT_LIFECYCLE signals. Trimmed-empty text is a no-op.

submitMessage(text: string): void;

Parameters

text · required: string

Returns

void

threads

readonly threads: import("@angular/core").InputSignal<Thread[]>;

threadSelected

readonly threadSelected: import("@angular/core").OutputEmitterRef<string>;

toolCallTemplates

Per-tool-name templates projected as <ng-template chatToolCallTemplate>. Collected here and passed to each message's <chat-tool-calls>, which cannot query templates re-projected through <chat>. Unused while an activityTemplate is present.

readonly toolCallTemplates: import("@angular/core").Signal<readonly ChatToolCallTemplateDirective[]>;

views

readonly views: import("@angular/core").InputSignal<Readonly<Record<string, import("@threadplane/render").RenderViewEntry | import("@angular/core").Type<unknown>>> | undefined>;

viewToolNames

Tool names that have a registered view (keys of the effective view registry, including client-declared view/ask tools). These render as inline tool-views and are excluded from the default tool-call card so they don't render twice.

readonly viewToolNames: import("@angular/core").Signal<readonly string[]>;

welcomeDisabled

readonly welcomeDisabled: import("@angular/core").InputSignal<boolean>;