veryfront/chat

Import

import {
  Chat,
  useChat,
  useAgent,
  AgentCard,
  Message,
  buildChatStreamChunkMessageMetadata,
} from "veryfront/chat";

Examples

Basic chat (preset)

import { Chat, useChat } from "veryfront/chat";

export default function Page() {
  const chat = useChat();
  return (
    <Chat
      messages={chat.messages}
      input={chat.input}
      onChange={chat.handleInputChange}
      onSubmit={chat.handleSubmit}
    />
  );
}

Custom layout (composition)

import { Chat, useChat } from "veryfront/chat";

export default function Page() {
  const chat = useChat();
  return (
    <Chat.Root messages={chat.messages} input={chat.input}>
      <Chat.Empty title="Ask me anything" />
      <Chat.MessageList messages={chat.messages} />
      <Chat.Composer input={chat.input} onChange={chat.handleInputChange} onSubmit={chat.handleSubmit} />
    </Chat.Root>
  );
}

Per-message control (compound)

import { Message } from "veryfront/chat";

<Message.Root message={msg}>
  <Message.Avatar />
  <Message.Content />
  <Message.Actions />
</Message.Root>

Type Reference

`UseChatOptions`

Options accepted by use chat.

Property	Type	Description	Source
`api?`	`string`	AG-UI endpoint. Defaults to “/api/ag-ui”.	source
`transport?`	`"ag-ui"`	Streaming response protocol used by the endpoint. AG-UI is the default.	source
`initialMessages?`	`ChatMessage[]`	Pre-populated messages	source
`body?`	`Record<string, unknown>`	Extra body fields sent with each request	source
`headers?`	`Record<string, string>`	Custom request headers	source
`credentials?`	`RequestCredentials`	Fetch credentials mode	source
`model?`	`string`	Override model at runtime (e.g. “openai/gpt-4o”, “Anthropic/claude-sonnet-4-5-20250929”)	source
`onResponse?`	`(response: Response) => void`	Raw response callback	source
`onFinish?`	`(message: ChatMessage) => void`	Completion callback	source
`onError?`	`(error: Error) => void`	Error callback	source
`onToolCall?`	`(arg: OnToolCallArg) => void \| Promise<void>`	Tool call handler for client-side execution	source

`UseChatResult`

Result returned from use chat.

Property	Type	Description	Source
`messages`	`ChatMessage[]`	All messages in the conversation	source
`input`	`string`	Current input value	source
`isLoading`	`boolean`	Whether a request is in flight	source
`error`	`Error \| null`	Last error (if any)	source
`model`	`string \| undefined`	Current model override (undefined = use agent default)	source
`activeModel`	`string \| undefined`	The actual model being used after auto-upgrade (e.g. “Anthropic/claude-sonnet-4-20250514”)	source
`inferenceMode`	`InferenceMode`	Where inference is currently happening	source
`setInput`	`(input: string) => void`	Set input value	source
`setModel`	`(model: string \| undefined) => void`	Change the model for subsequent requests	source
`sendMessage`	`(message: { text: string }) => Promise<void>`	Send a message programmatically	source
`editMessage`	`(messageId: string, newText: string) => Promise<void>`	Edit a user message and resubmit - truncates history to that point	source
`getBranches`	`(messageId: string) => BranchInfo`	Get branch info for a message (returns ; total=1 if no branches)	source
`switchBranch`	`(messageId: string, branchIndex: number) => void`	Switch to a different branch at a given message	source
`reload`	`() => Promise<void>`	Re-send last user message	source
`stop`	`() => void`	Abort current request	source
`setMessages`	`(messages: ChatMessage[]) => void`	Replace message history	source
`addToolOutput`	`(output: ToolOutput) => void`	Submit client-side tool result	source
`data?`	`unknown`	Extra data from server response	source
`handleInputChange`	`(e: React.ChangeEvent<HTMLInputElement \| HTMLTextAreaElement>) => void`	Bind to input onChange	source
`handleSubmit`	`(e?: React.FormEvent) => Promise<void>`	Submit current input	source
`onChange`	`(e: React.ChangeEvent<HTMLInputElement \| HTMLTextAreaElement>) => void`	Alias for `handleInputChange` - matches `ChatProps.onChange` for easy spreading	source
`onSubmit`	`(e?: React.FormEvent) => Promise<void>`	Alias for `handleSubmit` - matches `ChatProps.onSubmit` for easy spreading	source
`onModelChange`	`(model: string \| undefined) => void`	Alias for `setModel` - matches `ChatProps.onModelChange` for easy spreading	source

`UseAgentOptions`

Options accepted by use agent.

Property	Type	Description	Source
`agent`	`string`	Agent ID or endpoint	source
`onToolCall?`	`(toolCall: ToolCall) => void`	Callback when tool is called	source
`onToolResult?`	`(toolCall: ToolCall, result: unknown) => void`	Callback when tool result received	source
`onError?`	`(error: Error) => void`	Callback when error occurs	source

`UseAgentResult`

Result returned from use agent.

Property	Type	Description	Source
`messages`	`AgentMessage[]`	Message history	source
`toolCalls`	`ToolCall[]`	Active tool calls	source
`status`	`AgentStatus`	Agent status	source
`thinking?`	`string`	Thinking/reasoning text	source
`invoke`	`(input: string) => Promise<void>`	Invoke the agent	source
`stop`	`() => void`	Stop agent execution	source
`isLoading`	`boolean`	Loading state	source
`error`	`Error \| null`	Error state	source

Exports

Components

Name	Description	Source
`AgentCard`	Render agent card.	source
`AttachmentPill`	Render attachment pill.	source
`BranchPicker`	Render branch picker.	source
`Chat`	Render chat.	source
`ChatComponents`	Render chat components.	source
`ChatComposer`	Render chat composer.	source
`ChatContextProvider`	Render chat context provider.	source
`ChatEmpty`	Render chat empty.	source
`ChatIf`	Render chat if.	source
`ChatMessageList`	Render chat message list.	source
`ChatRoot`	Render chat root.	source
`ChatSidebar`	Render chat sidebar.	source
`ChatWithSidebar`	Render chat with sidebar.	source
`ComposerContextProvider`	Render composer context provider.	source
`ConversationEmptyState`	State for conversation empty.	source
`ConversationScrollButton`	Render conversation scroll button.	source
`DEFAULT_CHAT_STREAM_IDLE_TIMEOUT_MS`	Default value for chat stream idle timeout ms.	source
`DEFAULT_CHAT_STREAM_TOOL_RUNNING_TIMEOUT_MS`	Default value for chat stream tool running timeout ms.	source
`DropZoneOverlay`	Render drop zone overlay.	source
`ErrorBanner`	Render error banner.	source
`FadeIn`	Render fade in.	source
`InferenceBadge`	Render inference badge.	source
`InlineCitation`	Render inline citation.	source
`Loader`	Render loader.	source
`Message`	Message shape for message.	source
`MessageActions`	Render message actions.	source
`MessageContextProvider`	Render message context provider.	source
`MessageEditForm`	Render message edit form.	source
`MessageFeedback`	Render message feedback.	source
`ModelAvatar`	Render model avatar.	source
`ModelSelector`	Render model selector.	source
`QuickActions`	Render quick actions.	source
`ReasoningCard`	Render reasoning card.	source
`RichCodeBlock`	Render rich code block.	source
`Shimmer`	Render shimmer.	source
`SkillBadge`	Render skill badge.	source
`Sources`	Render sources.	source
`StandaloneMessage`	Render a standalone chat message.	source
`StepIndicator`	Render step indicator.	source
`StreamingMessage`	Message shape for streaming.	source
`Suggestion`	Render suggestion.	source
`Suggestions`	Render suggestions.	source
`TabSwitcher`	Render tab switcher.	source
`ThreadListContextProvider`	Render thread list context provider.	source
`ToolCallCard`	Tool call card component - renders tool invocations with parameters and results Styled to match AI Elements (https://ai-sdk.dev/elements)	source
`ToolStatusBadge`	Render tool status badge.	source
`UploadsPanel`	Render uploads panel.	source

Functions

Name	Description	Source
`buildChatStreamChunkMessageMetadata`	Builds chat stream chunk message metadata.	source
`createChatStreamWatchdog`	Create chat stream watchdog.	source
`createChatStreamWatchdogState`	State for create chat stream watchdog.	source
`dedupeChatUiMessageChunks`	Dedupe chat UI message chunks.	source
`downloadMarkdown`	Download messages as a .md file.	source
`exportAsMarkdown`	Convert chat messages to a markdown string.	source
`extractChatMessageMetadata`	Extract chat message metadata.	source
`extractSourcesFromParts`	Extract sources from tool result parts. Looks for `documents` arrays in tool outputs and maps them to Source[].	source
`getNextChatStreamWatchdogState`	State for get next chat stream watchdog.	source
`getTextContent`	Get text content from chat message parts	source
`groupPartsInOrder`	Group consecutive parts for ordered rendering Returns an array of groups, each containing either consecutive text parts, a tool part, or a reasoning part	source
`isHeartbeatOnlyMetadataChunk`	Check whether a chunk only carries heartbeat metadata.	source
`isLongRunningToolRunning`	Check whether a long-running tool is active.	source
`isReasoningPart`	Check if a part is a reasoning part	source
`isSkillToolPart`	Check if a tool part is a skill-related tool.	source
`isToolPart`	Check if a part is a tool part	source
`mapHostedStreamPartToChatUiChunks`	Map hosted stream part to chat UI chunks.	source
`normalizeChatMessageMetadata`	Normalizes chat message metadata.	source
`normalizeChatUiMessageChunk`	Normalizes chat UI message chunk.	source
`normalizeChatUiMessageStream`	Normalizes chat UI message stream.	source
`useAgent`	React hook for agent.	source
`useChat`		source
`useChatContext`	Context for use chat.	source
`useChatContextOptional`	React hook for chat context optional.	source
`useChatErrorHandler`	Handler for use chat error.	source
`useCompletion`	useCompletion hook for single text generation	source
`useComposerContext`	Context for use composer.	source
`useComposerContextOptional`	React hook for composer context optional.	source
`useMessageContext`	Context for use message.	source
`useMessageContextOptional`	React hook for message context optional.	source
`useStreaming`	React hook for streaming.	source
`useThreadListContext`	Context for use thread list.	source
`useThreadListContextOptional`	React hook for thread list context optional.	source
`useThreads`	React hook for threads.	source
`useVoiceInput`	Input payload for use voice.	source

Classes

Name	Description	Source
`ChatErrorBoundary`	Implement chat error boundary.	source
`ChatStreamIdleTimeoutError`	Error shape for chat stream idle timeout.	source

Types

Name	Description	Source
`AgentCardProps`	Props accepted by agent card.	source
`AgentTheme`	Public API contract for agent theme.	source
`AttachmentInfo`	Public API contract for attachment info.	source
`AttachmentPillProps`	Props accepted by attachment pill.	source
`BranchInfo`	Public API contract for branch info.	source
`BranchPickerProps`	Props accepted by branch picker.	source
`BuildChatStreamChunkMessageMetadataInput`	Input payload for build chat stream chunk message metadata.	source
`ChatComposerProps`	Props accepted by chat composer.	source
`ChatContextValue`	Public API contract for chat context value.	source
`ChatDynamicToolPart`	Public API contract for chat dynamic tool part.	source
`ChatEmptyProps`	Props accepted by chat empty.	source
`ChatErrorBoundaryProps`	Props accepted by chat error boundary.	source
`ChatFinishReason`	Public API contract for chat finish reason.	source
`ChatIfProps`	Props accepted by chat if.	source
`ChatMessage`	Message shape for chat.	source
`ChatMessageListProps`	Props accepted by chat message list.	source
`ChatMessageMetadata`	Public API contract for chat message metadata.	source
`ChatMessageMetadataUsage`	Public API contract for chat message metadata usage.	source
`ChatMessagePart`	Public API contract for chat message part.	source
`ChatProps`	Props accepted by chat.	source
`ChatReasoningPart`	Chat message part that carries reasoning text.	source
`ChatRootProps`	Props accepted by chat root.	source
`ChatSidebarProps`	Props accepted by chat sidebar.	source
`ChatStepPart`	Public API contract for chat step part.	source
`ChatStreamEvent`	Event emitted for chat stream.	source
`ChatStreamWatchdogOptions`	Options accepted by chat stream watchdog.	source
`ChatStreamWatchdogPhase`	Public API contract for chat stream watchdog phase.	source
`ChatStreamWatchdogState`	State for chat stream watchdog.	source
`ChatTab`	Public API contract for chat tab.	source
`ChatTextPart`	Chat message part that carries text.	source
`ChatTheme`	Public API contract for chat theme.	source
`ChatToolPart`	Public API contract for chat tool part.	source
`ChatToolResultPart`	Chat message part that carries a tool result.	source
`ChatToolState`	State for chat tool.	source
`ChatUiMessageChunk`	Public API contract for chat UI message chunk.	source
`ChatWithSidebarAttachmentConfig`	Configuration used by chat with sidebar attachment.	source
`ChatWithSidebarChatController`	Public API contract for chat with sidebar chat controller.	source
`ChatWithSidebarFeatureConfig`	Configuration used by chat with sidebar feature.	source
`ChatWithSidebarGroupedProps`	Props accepted by chat with sidebar grouped.	source
`ChatWithSidebarMessageConfig`	Configuration used by chat with sidebar message.	source
`ChatWithSidebarModelConfig`	Configuration used by chat with sidebar model.	source
`ChatWithSidebarProps`	Props accepted by chat with sidebar.	source
`ChatWithSidebarQuickActionsConfig`	Configuration used by chat with sidebar quick actions.	source
`ChatWithSidebarSidebarConfig`	Configuration used by chat with sidebar sidebar.	source
`ChatWithSidebarTabsConfig`	Configuration used by chat with sidebar tabs.	source
`ChatWithSidebarVoiceConfig`	Configuration used by chat with sidebar voice.	source
`ChildRunAudit`	Public API contract for child run audit.	source
`ChildRunAuditToolCall`	Public API contract for child run audit tool call.	source
`ChildRunAuditToolResult`	Result returned from child run audit tool.	source
`CodeBlockProps`	Props accepted by code block.	source
`ComposerContextValue`	Public API contract for composer context value.	source
`ConversationEmptyStateProps`	Props accepted by conversation empty state.	source
`ConversationScrollButtonProps`	Props accepted by conversation scroll button.	source
`DropZoneOverlayProps`	Props accepted by drop zone overlay.	source
`ErrorBannerProps`	Props accepted by error banner.	source
`FeedbackValue`	Public API contract for feedback value.	source
`HostedStreamPartForUiChunkMapping`	Public API contract for hosted stream part for UI chunk mapping.	source
`HostedUiChunkMappingOptions`	Options accepted by hosted UI chunk mapping.	source
`InferenceBadgeProps`	Props accepted by inference badge.	source
`InferenceMode`	Where inference is happening.	source
`InlineCitationProps`	Props accepted by inline citation.	source
`MessageActionsProps`	Props accepted by message actions.	source
`MessageContextValue`	Public API contract for message context value.	source
`MessageEditFormProps`	Props accepted by message edit form.	source
`MessageFeedbackProps`	Props accepted by message feedback.	source
`MessageProps`	Props accepted by message.	source
`MessageRootProps`	Props accepted by message root.	source
`ModelAvatarProps`	Props accepted by model avatar.	source
`ModelOption`	A “provider/model” value and its display label.	source
`ModelSelectorProps`	Props accepted by `<ModelSelector>`.	source
`OnToolCallArg`	Public API contract for on tool call arg.	source
`PartGroup`	Part group types for ordered rendering	source
`QuickAction`	Public API contract for quick action.	source
`QuickActionsProps`	Props accepted by quick actions.	source
`SkillBadgeProps`	Props accepted by skill badge.	source
`Source`	Public API contract for source.	source
`SourcesProps`	Props accepted by sources.	source
`StepIndicatorProps`	Props accepted by step indicator.	source
`StreamingMessageProps`	Props accepted by streaming message.	source
`SuggestionProps`	Props accepted by suggestion.	source
`SuggestionsProps`	Props accepted by suggestions.	source
`TabSwitcherProps`	Props accepted by tab switcher.	source
`Thread`	Public API contract for thread.	source
`ThreadListContextValue`	Public API contract for thread list context value.	source
`ToolOutput`	Output from tool.	source
`UploadedFile`	Public API contract for uploaded file.	source
`UploadsPanelProps`	Props accepted by uploads panel.	source
`UseAgentOptions`	Options accepted by use agent.	source
`UseAgentResult`	Result returned from use agent.	source
`UseChatOptions`	Options accepted by use chat.	source
`UseChatResult`	Result returned from use chat.	source
`UseCompletionOptions`	Options accepted by use completion.	source
`UseCompletionResult`	Result returned from use completion.	source
`UseStreamingOptions`	Options accepted by use streaming.	source
`UseStreamingResult`	Result returned from use streaming.	source
`UseThreadsOptions`	Options accepted by use threads.	source
`UseThreadsResult`	Result returned from use threads.	source
`UseVoiceInputOptions`	Options accepted by use voice input.	source
`UseVoiceInputResult`	Result returned from use voice input.	source

Deep imports

These import paths group focused functionality under this module. Each is a separate barrel; import only what you need.

`veryfront/chat/message-prep`

import { compactForStep, compressTurn, dedupeToolHistory } from "veryfront/chat/message-prep";

Functions

Name	Description	Source
`compactForStep`	Compact for step.	source
`compressTurn`	Compress turn.	source
`dedupeToolHistory`	Dedupe tool history.	source
`enforceTokenBudget`	Enforce token budget.	source
`enforceTokenBudgetWithTurnCompression`	Enforce token budget with turn compression.	source
`ensureToolCallInputs`	Ensure tool call inputs helper.	source
`estimateOverhead`	Estimate overhead.	source
`estimateTokens`	Estimate tokens.	source
`isModelSupportedFileMediaType`	Check whether the model supports the file media type.	source
`maskOldToolOutputs`	Mask old tool outputs.	source
`normalizeMessageFilePartMediaTypes`	Normalizes message file part media types.	source
`prepareProviderModelMessagesFromUiMessages`	Prepare provider model messages from UI messages.	source
`repairToolPairs`	Repair tool pairs.	source
`rewriteUnsupportedFilePartsAsAnnotations`	Rewrite unsupported file parts as annotations.	source
`sanitizeProviderModelMessages`	Sanitize provider model messages.	source
`stripPendingToolParts`	Strip pending tool parts.	source

Types

Name	Description	Source
`PrepareProviderModelMessagesFromUiMessagesOptions`	Options accepted by prepare provider model messages from UI messages.	source

`veryfront/chat/types`

import { buildDataFileAnnotation, isImageFile, isTextPreviewFile } from "veryfront/chat/types";

Functions

Name	Description	Source
`buildDataFileAnnotation`	Builds data file annotation.	source
`isImageFile`	Check whether a file is an image.	source
`isTextPreviewFile`	Check whether a file supports text preview.	source
`isValidImageFile`	Check whether a file is a supported image upload.	source
`normalizeInlineAttachmentMediaType`	Normalizes inline attachment media type.	source

Types

Name	Description	Source
`ChatAssistantContentPart`	Public API contract for chat assistant content part.	source
`ChatAssistantMessage`	Message shape for chat assistant.	source
`ChatDataUiPart`	Chat UI part that carries custom data chunks.	source
`ChatDynamicToolUiPart`	Tool UI part for a runtime-selected tool name.	source
`ChatFileUiPart`	Public API contract for chat file UI part.	source
`ChatMessageMetadata`	Public API contract for chat message metadata.	source
`ChatMessageMetadataUsage`	Public API contract for chat message metadata usage.	source
`ChatModelFilePart`	Public API contract for chat model file part.	source
`ChatModelReasoningPart`	Provider model message part that carries reasoning text.	source
`ChatModelTextPart`	Provider model message part that carries text.	source
`ChatNamedToolUiPart`	Tool UI part keyed by a static tool type.	source
`ChatReasoningUiPart`	Public API contract for chat reasoning UI part.	source
`ChatRequestContext`	Context for chat request.	source
`ChatRuntimeOverrides`	Public API contract for chat runtime overrides.	source
`ChatSourceDocumentUiPart`	Public API contract for chat source document UI part.	source
`ChatSourceUrlUiPart`	Public API contract for chat source URL UI part.	source
`ChatStepStartUiPart`	Public API contract for chat step start UI part.	source
`ChatSystemMessage`	Message shape for chat system.	source
`ChatTextUiPart`	Public API contract for chat text UI part.	source
`ChatToolCallPart`	Provider model message part that carries a tool call.	source
`ChatToolMessage`	Message shape for chat tool.	source
`ChatToolPartState`	State for chat tool part.	source
`ChatToolResultOutput`	Output from chat tool result.	source
`ChatToolResultPart`	Provider model message part that carries a tool result.	source
`ChatUiMessage`	Message shape for chat UI.	source
`ChatUiMessageChunk`	Public API contract for chat UI message chunk.	source
`ChatUiMessagePart`	Public API contract for chat UI message part.	source
`ChatUiMessageRole`	Public API contract for chat UI message role.	source
`ChatUserContentPart`	Public API contract for chat user content part.	source
`ChatUserMessage`	Message shape for chat user.	source
`ChildRunAudit`	Public API contract for child run audit.	source
`ChildRunAuditToolCall`	Public API contract for child run audit tool call.	source
`ChildRunAuditToolResult`	Result returned from child run audit tool.	source
`DurableRootRunDescriptor`	Public API contract for durable root run descriptor.	source
`FileUIPartWithUpload`	File UI part enriched with upload metadata.	source
`MessageMetadata`	Public API contract for chat message metadata.	source
`ProjectFile`	Public API contract for project file.	source
`ProjectFileListItem`	Public API contract for project file list item.	source
`ProviderModelMessage`	Message shape for provider model.	source
`UploadedFileReference`	Public API contract for uploaded file reference.	source

Constants

Name	Description	Source
`getChatRequestContextSchema`	Zod schema for get chat request context.	source
`getChatToolPartStateSchema`	Zod schema for get chat tool part state.	source
`getChatUiMessagePartSchema`	Zod schema for get chat UI message part.	source
`getChatUiMessageRoleSchema`	Zod schema for get chat UI message role.	source
`getChatUiMessageSchema`	Zod schema for get chat UI message.	source
`getChatUiMessagesSchema`	Zod schema for get chat UI messages.	source
`getMessageMetadataSchema`	Zod schema for get message metadata.	source
`imageFileTypes`	Image media types that chat uploads can display natively.	source
`textFileExtensions`	File extensions that chat uploads can inline as text.	source

Getting Started

Concepts

Guides

API Reference

Import

Examples

Basic chat (preset)

Custom layout (composition)

Per-message control (compound)

Type Reference

`UseChatOptions`

`UseChatResult`

`UseAgentOptions`

`UseAgentResult`

Exports

Components

Functions

Classes

Types

Deep imports

`veryfront/chat/message-prep`

Functions

Types

`veryfront/chat/types`

Functions

Types

Constants

​Import

​Examples

​Basic chat (preset)

​Custom layout (composition)

​Per-message control (compound)

​Type Reference

​UseChatOptions

​UseChatResult

​UseAgentOptions

​UseAgentResult

​Exports

​Components

​Functions

​Classes

​Types

​Deep imports

​veryfront/chat/message-prep

​Functions

​Types

​veryfront/chat/types

​Functions

​Types

​Constants

Import

Examples

Basic chat (preset)

Custom layout (composition)

Per-message control (compound)

Type Reference

`UseChatOptions`

`UseChatResult`

`UseAgentOptions`

`UseAgentResult`

Exports

Components

Functions

Classes

Types

Deep imports

`veryfront/chat/message-prep`

Functions

Types

`veryfront/chat/types`

Functions

Types

Constants