Aspyn

Message

Chat rows with avatar, bubble, and metadata.

shadcn/ui · new-york-v4 · synced Aug 29, 2026shadcn/uinew-york-v4 · synced Aug 29, 2026
SourceMarkdown

Installation

import { Message, MessageAvatar, MessageContent, MessageFooter, MessageGroup } from "@aspyn-io/kit";

Chat thread

Message is the full row: avatar + content (Bubble). align="end" flips it for the current user.

AI
How can I help you today?
SQ
Summarize the registry diff and flag any stale routes.
Read 2:14 PM

Notes

  • Message owns row-level layout and alignment; Bubble owns the message surface. Put avatars, names, timestamps, and actions in MessageHeader/MessageFooter.
  • Set align on both Message and its Bubble so the row and the surface agree (Message flips the row; Bubble self-aligns its content).