Message

Builds structured conversations with avatars, content, and metadata.

Oros UI

The investment memo is ready for review.

Just now

Share it with the deal team.

Delivered

Installation

Install Message from Oros with shadcn CLI 4.13.0.

pnpm dlx shadcn@4.13.0 add @oros/message

Usage

import {
  MessageGroup,
  Message,
  MessageAvatar,
  MessageContent,
  MessageFooter,
  MessageHeader,
} from "@/components/ui/message"

Open the Source tab in the preview for a complete working example.

Anatomy

Export	Responsibility
MessageGroup	Groups related items into one logical set.
Message	A composable part of the component anatomy.
MessageAvatar	A composable part of the component anatomy.
MessageContent	Contains the primary visible content.
MessageFooter	Groups supporting actions or metadata.
MessageHeader	Groups heading and introductory content.

API Reference

Message exports 6 named entries. Component exports accept the props of their underlying HTML element or Base UI component, plus an optional className, unless the source defines a more focused type.

MessageGroup Component
Message Component
MessageAvatar Component
MessageContent Component
MessageFooter Component
MessageHeader Component

Accessibility

Message adds no application-specific accessible name by itself; use semantic content and label any interactive descendants.
Do not communicate state or meaning through color alone, and verify the composed result at text zoom and with keyboard navigation.

Source

Message uses the standard shadcn API and is distributed through Oros. Installing it adds the component source and required dependencies to your app. The Source tab above shows a complete usage example.

Menubar Message Scroller