Message

Renders one chat message. User messages are right-aligned bubbles; assistant messages render text as markdown, reasoning and tool parts inline, file parts as thumbnails/chips, and a hover action row (copy / regenerate).

Source

Import

import { Message } from "@flanksource/clicky-ui/chat";

Demos

User Message · Open in Storybook

Assistant With Tool Call · Open in Storybook

The props table documents the component-specific surface. Standard DOM attributes inherited from React, such as className, event handlers, and accessibility attributes, may also be accepted when the component’s prop type extends a native element.

Props

Prop	Type	Default	Description
className	string	—	—
message*	UIMessage<unknown, UIDataTypes, UITools>	—	—
onApprove	(…) => …	—	Respond to a tool approval request.
onRegenerate	(…) => …	—	Re-generate the assistant message with the given id.
renderToolResult	ToolResultRenderer	—	Optional host renderer for recognized completed tool outputs.