# XWUIMessageBubble

A single Telegram-class chat message bubble that renders one `message` (`content`, `timestamp`, `senderId`/`senderName`/`senderAvatar`). It aligns to the sender via `isOwn`, paints the sender name and reply accent from a deterministic per-sender palette (`peerColor`), and optionally draws the signature appendix tail (`showTail`) with the timestamp and own-message read-receipt ticks overlapping the bottom-right corner. The message can carry a `replyTo` quote, inline image/video `attachments` with a caption, a `reactions` strip (pills fire `onReactionClick`), and a send `status`; long text past `maxLength` collapses behind a "Show more" toggle. Avatar, timestamp, and sender name are gated by `showAvatar`, `showTimestamp`, and `showSenderName`.

## Basic Usage

A minimal bubble constructed with a single `message`, using the default peer styling, avatar, timestamp, and tail.

```example
file: examples/BasicUsage.ts
html: examples/BasicUsage.html
title: Basic Usage
description: A single chat bubble rendered from one message with default sender alignment, timestamp, and tail.
```

## Own Message, Read, With Reactions

An outgoing bubble with a read receipt and a reactions strip.

```example
file: examples/OwnMessageRead.ts
title: Own Message, Read, With Reactions
description: A right-aligned own bubble in the read state with a two-emoji reactions strip.
```

## Quoted Reply With an Inline Image

An incoming bubble that quotes an earlier message and attaches a photo.

```example
file: examples/ReplyWithImage.ts
title: Quoted Reply With an Inline Image
description: An incoming bubble with a replyTo quote and an inline image attachment.
```

```api
```