Delete Bubble

A presentational bubble that renders a ‘This message was deleted’ placeholder.

AI Integration Quick Reference

{
  "component": "CometChatDeleteBubble",
  "package": "@cometchat/chat-uikit-react",
  "import": "import { CometChatDeleteBubble } from \"@cometchat/chat-uikit-react\";",
  "description": "Presentational placeholder bubble for deleted messages.",
  "cssRootClass": ".cometchat-delete-bubble",
  "props": {
    "data": {
      "isSentByMe": { "type": "boolean", "note": "Affects sent vs received styling." },
      "text": { "type": "string", "note": "Defaults to localized \"This message was deleted\"." },
      "className": { "type": "string" }
    }
  }
}

Overview

CometChatDeleteBubble renders the placeholder shown in place of a deleted message — italic, muted text reading “This message was deleted”. It is a presentational component: pass isSentByMe for sent-vs-received styling and an optional text override. The Delete Plugin renders it automatically for any message whose getDeletedAt() is non-null.

Live Preview — interact with the delete bubble.

Open in Storybook ↗

---

Usage

import { CometChatDeleteBubble } from "@cometchat/chat-uikit-react";

function DeletedMessage() {
  return <CometChatDeleteBubble isSentByMe={false} />;
}

---

Props

isSentByMe

Whether the deleted message was sent by the logged-in user. Affects styling.

Type	boolean
Default	undefined

---

text

Optional custom text override. Defaults to the localized “This message was deleted”.

Type	string
Default	localized default

---

className

Additional CSS class applied to the root element.

Type	string
Default	undefined

---

CSS Selectors

Target	Selector
Root	.cometchat-delete-bubble
Sender / receiver	.cometchat-delete-bubble--sender / .cometchat-delete-bubble--receiver
Icon	.cometchat-delete-bubble__icon
Placeholder text	.cometchat-delete-bubble__text

---

Next Steps

Delete Plugin

How deleted messages are resolved and rendered

Message Bubble

The wrapper that hosts bubble content

Theming

Customize colors, fonts, and spacing