UNPKG

@assistant-ui/react

Version:

TypeScript/React library for AI Chat

64 lines 3.09 kB
import { type ComponentType, type FC } from "react"; import type { Unstable_AudioContentPartComponent, EmptyContentPartComponent, TextContentPartComponent, ImageContentPartComponent, SourceContentPartComponent, ToolCallContentPartComponent, ToolCallContentPartProps, FileContentPartComponent, ReasoningContentPartComponent } from "../../types/ContentPartComponentTypes"; export declare namespace MessagePrimitiveContent { type Props = { /** * Component configuration for rendering different types of message content. * * You can provide custom components for each content type (text, image, file, etc.) * and configure tool rendering behavior. If not provided, default components will be used. */ components?: { /** Component for rendering empty messages */ Empty?: EmptyContentPartComponent | undefined; /** Component for rendering text content */ Text?: TextContentPartComponent | undefined; /** Component for rendering reasoning content (typically hidden) */ Reasoning?: ReasoningContentPartComponent | undefined; /** Component for rendering source content */ Source?: SourceContentPartComponent | undefined; /** Component for rendering image content */ Image?: ImageContentPartComponent | undefined; /** Component for rendering file content */ File?: FileContentPartComponent | undefined; /** Component for rendering audio content (experimental) */ Unstable_Audio?: Unstable_AudioContentPartComponent | undefined; /** Configuration for tool call rendering */ tools?: { /** Map of tool names to their specific components */ by_name?: Record<string, ToolCallContentPartComponent | undefined> | undefined; /** Fallback component for unregistered tools */ Fallback?: ComponentType<ToolCallContentPartProps> | undefined; } | { /** Override component that handles all tool calls */ Override: ComponentType<ToolCallContentPartProps>; } | undefined; } | undefined; }; } /** * Renders the content of a message with support for multiple content types. * * This component automatically handles different types of message content including * text, images, files, tool calls, and more. It provides a flexible component * system for customizing how each content type is rendered. * * @example * ```tsx * <MessagePrimitive.Content * components={{ * Text: ({ text }) => <p className="message-text">{text}</p>, * Image: ({ image }) => <img src={image} alt="Message image" />, * tools: { * by_name: { * calculator: CalculatorTool, * weather: WeatherTool, * }, * Fallback: DefaultToolComponent * } * }} * /> * ``` */ export declare const MessagePrimitiveContent: FC<MessagePrimitiveContent.Props>; //# sourceMappingURL=MessageContent.d.ts.map