Unread Divider

3 unread
About this piece

Unread Divider

Rose horizontal rule flanking an unread-count pill. Signals where new messages begin.

Usage

The import and the props worth knowing about, in one place.

import { Chat18 } from "@/components/beste/piece/chat18";

<Chat18
  count={3}
/>

More Chat pieces

View all Chat
Yesterday

Date Separator

Thin horizontal rule with a muted date pill in the middle, used to break up chat days.

09:42Read

Seen Receipt

Timestamp pill with double-check icon that colors sky when the message is read.

Thread Chip

Thread pill with a 3-avatar stack, a reply count in primary, and a last-reply timestamp.

AK
Ayşe and Merve are typing

Multi Typing

Typing indicator pill showing multiple avatar stack, summary text, and three pulsing dots.

AK
Ayşe Kaya09:42
Sure, sending the Figma link now3

Conversation Item

Inbox row with avatar, name, message preview, timestamp, and a primary unread count chip.

SB

Typing Indicator

Chat bubble with three staggered dots. Signals that the other side is typing.