Component · Messaging

Conversation row

an inbox/thread list row — leading avatar, title + preview, time and an unread count.

Example

Where available

✓ React
✓ Angular
✓ Web Components
✓ Blazor
✓ Tokens

Using it

the same component, named idiomatically per target. one CSS contract underneath, so they render identically.

TargetReferencePackage
React <ConversationRow> @design-foundry/lucent-react
Angular <lucent-conversation-row> @design-foundry/lucent
Web Components <lucent-conversation-row> @design-foundry/lucent-wc
Blazor <LucentConversationRow> DesignFoundry.Lucent

API

PropTypeDefaultDescription
title string — primary line.
preview string — secondary preview line.
time string — timestamp.
unread number 0 unread count badge.
active boolean false current conversation.
(children) slotted — leading avatar.