> ## Documentation Index
> Fetch the complete documentation index at: https://cometchat-22654f5b-docs-audit-mechanical-fixes.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Core Features

> Comprehensive guide to CometChat's core messaging features including instant messaging, media sharing, read receipts, and more

<Accordion title="AI Agent Component Spec">
  | Field          | Value                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    |
  | -------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
  | Package        | `cometchat_chat_uikit`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   |
  | Required setup | `CometChatUIKit.init(uiKitSettings: UIKitSettings)` then `CometChatUIKit.login(uid)` — must complete before rendering any component                                                                                                                                                                                                                                                                                                                                                                                      |
  | Core features  | Instant Messaging, Media Sharing, Read Receipts, Mark as Unread, Typing Indicator, User Presence, Reactions, Mentions, Rich Text Formatting, Quoted Reply, Search, Threaded Conversations, Moderation, Report Message, Group Chat                                                                                                                                                                                                                                                                                        |
  | Key components | `CometChatConversations` → [Conversations](/ui-kit/flutter/v5/conversations), `CometChatMessageList` → [Message List](/ui-kit/flutter/v5/message-list), `CometChatMessageComposer` → [Message Composer](/ui-kit/flutter/v5/message-composer), `CometChatMessageHeader` → [Message Header](/ui-kit/flutter/v5/message-header), `CometChatUsers` → [Users](/ui-kit/flutter/v5/users), `CometChatGroups` → [Groups](/ui-kit/flutter/v5/groups), `CometChatGroupMembers` → [Group Members](/ui-kit/flutter/v5/group-members) |
</Accordion>

The UI Kit comprises a variety of widgets, each designed to work seamlessly with one another to deliver a comprehensive and intuitive chat experience.

Here's how different UI Kit widgets work together to achieve CometChat's Core features:

***

## Instant Messaging

At the heart of CometChat's functionality is the ability to support real-time text messaging. Users can send and receive instant messages, fostering quick and efficient communication.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-audit-mechanical-fixes/VZsUD1BhmDvn_t8v/images/c8d76132-instant_messaging-153acaaca304981d6d2deccedb0b5a64.png?fit=max&auto=format&n=VZsUD1BhmDvn_t8v&q=85&s=b2ca4e5337f2b1c1122a414347d83d9a" width="2880" height="1666" data-path="images/c8d76132-instant_messaging-153acaaca304981d6d2deccedb0b5a64.png" />
</Frame>

| Widgets                                                | Functionality                                                                                                                                                                                    |
| ------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| [MessageComposer](/ui-kit/flutter/v5/message-composer) | [MessageComposer](/ui-kit/flutter/v5/message-composer) is a Widget that enables users to write and send a variety of messages.                                                                   |
| [MessageList](/ui-kit/flutter/v5/message-list)         | [MessageList](/ui-kit/flutter/v5/message-list) is a Widget that renders a list of messages sent and messages received using [TextBubble](/ui-kit/flutter/v5/message-bubble-styling#text-bubble). |

***

## Media Sharing

Beyond text, CometChat allows users to share various media types within their conversations. This includes images, videos, audio files, and documents, enriching the chat experience and enabling more comprehensive communication.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-audit-mechanical-fixes/lGTe4SBrdnJKJDoJ/images/72b09eff-media_sharing-d3477aebf258102446bd6b75d48d179f.png?fit=max&auto=format&n=lGTe4SBrdnJKJDoJ&q=85&s=61d3065d7bb5ef023598d335f3521323" width="2880" height="1666" data-path="images/72b09eff-media_sharing-d3477aebf258102446bd6b75d48d179f.png" />
</Frame>

| Widgets                                                | Functionality                                                                                                                                                                                                                                                                                                                                                                                             |
| ------------------------------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [MessageComposer](/ui-kit/flutter/v5/message-composer) | [MessageComposer](/ui-kit/flutter/v5/message-composer) is a Widget that has ActionSheet, ActionSheet is a menu that appears over the context of the app, providing multiple options for sharing media files.                                                                                                                                                                                              |
| [MessageList](/ui-kit/flutter/v5/message-list)         | [MessageList](/ui-kit/flutter/v5/message-list) is a Widget that renders different Media Message bubbles like [Image Bubble](/ui-kit/flutter/v5/message-bubble-styling#image-bubble), [File Bubble](/ui-kit/flutter/v5/message-bubble-styling#file-bubble), [Audio Bubble](/ui-kit/flutter/v5/message-bubble-styling#audio-bubble), [Video Bubble](/ui-kit/flutter/v5/message-bubble-styling#video-bubble) |

***

## Read Receipts

CometChat's Read Receipts feature provides visibility into the message status, letting users know when a message has been delivered and read. This brings clarity to the communication and ensures users are informed about the status of their messages.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-audit-mechanical-fixes/0Dzaagp0tKHyO4xb/images/56e7b43d-read_receipts-431ca6bda14a9fa0c5da29024b50b44d.png?fit=max&auto=format&n=0Dzaagp0tKHyO4xb&q=85&s=4514955f49e6c76889e519326ff6255a" width="2880" height="1666" data-path="images/56e7b43d-read_receipts-431ca6bda14a9fa0c5da29024b50b44d.png" />
</Frame>

| Widgets                                           | Functionality                                                                                                                                                                                                                                                   |
| ------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [Conversations](/ui-kit/flutter/v5/conversations) | [Conversations](/ui-kit/flutter/v5/conversations) is a Widget that renders Conversations item List, Conversation item also displays the delivery status of the last message providing users with real-time updates on the status of their messages.             |
| [MessageList](/ui-kit/flutter/v5/message-list)    | [MessageList](/ui-kit/flutter/v5/message-list) is a Widget that renders different types of Message bubbles, Read Receipt status is an integral part of all message bubbles, no matter the type, and provides real-time updates about the status of the message. |

***

## Mark As Unread

Mark as Unread feature allows users to manually mark messages as unread, helping them keep track of important conversations they want to revisit later. When enabled, the message list can automatically start from the first unread message, making it easier to pick up where you left off.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-audit-mechanical-fixes/MMfRg9nrn91d-s2I/images/mark-as-unread.png?fit=max&auto=format&n=MMfRg9nrn91d-s2I&q=85&s=bbbc04201b1a3537d6052cdf5b2f686e" width="2560" height="1670" data-path="images/mark-as-unread.png" />
</Frame>

| Widgets                                           | Functionality                                                                                                                                                             |
| ------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [Message List](/ui-kit/flutter/v5/message-list)   | [Message List](/ui-kit/flutter/v5/message-list) provides the "Mark as unread" option in message actions and supports starting from the first unread message when enabled. |
| [Conversations](/ui-kit/flutter/v5/conversations) | [Conversations](/ui-kit/flutter/v5/conversations) widget listens to conversation updates and reflects the updated unread count in real-time.                              |

***

## Typing Indicator

The Typing Indicator feature in CometChat shows when a user is typing a response in real-time, fostering a more interactive and engaging chat environment. This feature enhances the real-time communication experience, making conversations feel more natural and fluid.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-audit-mechanical-fixes/axXRyft3PU-ANo3t/images/8eb4a244-typing_indicator-267cbb99cf579b0f4dea0fd32a23ee2c.png?fit=max&auto=format&n=axXRyft3PU-ANo3t&q=85&s=e56426abbb567c628a3ff9b7569d634e" width="2880" height="1666" data-path="images/8eb4a244-typing_indicator-267cbb99cf579b0f4dea0fd32a23ee2c.png" />
</Frame>

| Widgets                                             | Functionality                                                                                                                                                                                                                                                                                               |
| --------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [Conversations](/ui-kit/flutter/v5/conversations)   | [Conversations](/ui-kit/flutter/v5/conversations) is a Widget that renders Conversations item List, Conversations item also shows real-time typing status indicators. This means that if a user in a one-on-one chat or a participant in a group chat is currently typing a message                         |
| [Message Header](/ui-kit/flutter/v5/message-header) | [Message Header](/ui-kit/flutter/v5/message-header) that renders details of User or Groups in ToolBar. The MessageHeader also handles the Typing Indicator functionality. When a user or a member in a group is typing, the MessageHeader dynamically updates to display a 'typing...' status in real-time. |

***

## User Presence

CometChat's User Presence feature allows users to see whether their contacts are online, offline. This helps users know the best time to initiate a conversation and sets expectations about response times.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-audit-mechanical-fixes/QwHcmaEPnUSXDSGB/images/af01bedd-user_presence-efd73539d116d43b00812aa7d9bd394a.png?fit=max&auto=format&n=QwHcmaEPnUSXDSGB&q=85&s=f3cd3d72dd68abb9ed4a412adf92214f" width="2880" height="1666" data-path="images/af01bedd-user_presence-efd73539d116d43b00812aa7d9bd394a.png" />
</Frame>

| Widgets                                             | Functionality                                                                                                                                                    |
| --------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [Conversations](/ui-kit/flutter/v5/conversations)   | [Conversations](/ui-kit/flutter/v5/conversations) is a Widget that renders Conversations item List, Conversations item also shows user presence information.     |
| [Message Header](/ui-kit/flutter/v5/message-header) | [Message Header](/ui-kit/flutter/v5/message-header) that renders details of User or Groups in ToolBar. The MessageHeader also handles user Presence information. |
| [Users](/ui-kit/flutter/v5/users)                   | [Users](/ui-kit/flutter/v5/users) renders list of users available in your app. It also responsible to render users Presence information.                         |
| [Group Members](/ui-kit/flutter/v5/group-members)   | [Group Members](/ui-kit/flutter/v5/group-members) renders list of users available in the group. The Group Members widget also handles user Presence information. |

***

## Reactions

CometChat's Reactions feature adds a layer of expressiveness to your chat application by allowing users to react to messages. With Reactions, users can convey a range of emotions or express their thoughts on a particular message without typing out a full response, enhancing their user experience and fostering greater engagement.

The number of reactions displayed depends on the width of the view. For instance, if a message contains 5 reactions but the width of the CometChatReactions view can only accommodate 4 reactions at a time, the first three reactions will be shown along with an additional UI element at the end of the row. This element indicates the number of other unique reactions that are not immediately visible, informing users of the total count of different reactions.

In the example, tapping on this element (depicted as "+2" in the provided image) will by default trigger the CometChatReactionList widget. This action opens a modal sheet from the bottom of the screen, displaying all reactions received by the message.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-audit-mechanical-fixes/srME33EnKhmYa0iF/images/8141ced2-reactions-807aa18e4532b4d9897e9725a9282710.png?fit=max&auto=format&n=srME33EnKhmYa0iF&q=85&s=bf4b3bf3114fa698127cdd13ad773295" width="2880" height="1666" data-path="images/8141ced2-reactions-807aa18e4532b4d9897e9725a9282710.png" />
</Frame>

| Widgets                                        | Functionality                                                                                                                                                                                                                                                      |
| ---------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| [MessageList](/ui-kit/flutter/v5/message-list) | [MessageList](/ui-kit/flutter/v5/message-list) is a Widget that renders different types of Message bubbles, Irrespective of the type of message bubble, Reactions are an integral part and offer a more engaging, expressive way for users to respond to messages. |

***

## Mentions

Mentions is a robust feature provided by CometChat that enhances the interactivity and clarity of group or 1-1 chats by allowing users to directly address or refer to specific individuals in a conversation. The feature also supports group mentions like @all, enabling users to quickly notify all members in a group chat simultaneously.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-audit-mechanical-fixes/tu3JK9T7iskLt8fa/images/4a0524b9-mentions-2899a43124b75d286a849e651e0d31a1.png?fit=max&auto=format&n=tu3JK9T7iskLt8fa&q=85&s=e75b017c4c0f5bc58b1797bd241ac6fa" width="2880" height="1128" data-path="images/4a0524b9-mentions-2899a43124b75d286a849e651e0d31a1.png" />
</Frame>

| Widgets                                                | Functionality                                                                                                                                                                                                                                                    |
| ------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [Conversations](/ui-kit/flutter/v5/conversations)      | [Conversations](/ui-kit/flutter/v5/conversations) widget provides an enhanced user experience by integrating the Mentions feature. This means that from the conversation list itself, users can see where they or someone else have been specifically mentioned. |
| [MessageComposer](/ui-kit/flutter/v5/message-composer) | [MessageComposer](/ui-kit/flutter/v5/message-composer) is a widget that allows users to craft and send various types of messages, including the usage of the Mentions feature for direct addressing within the conversation.                                     |
| [MessageList](/ui-kit/flutter/v5/message-list)         | [MessageList](/ui-kit/flutter/v5/message-list) is a widget that displays a list of sent and received messages. It also supports the rendering of Mentions, enhancing the readability and interactivity of conversations.                                         |

***

## Rich Text Formatting

Rich Text Formatting allows users to style their messages with bold, italic, strikethrough, code, code blocks, blockquotes, ordered/unordered lists, and links. This brings richer expression to conversations and helps users emphasize key points.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-audit-mechanical-fixes/QwHcmaEPnUSXDSGB/images/android-rich-text-formatting.png?fit=max&auto=format&n=QwHcmaEPnUSXDSGB&q=85&s=a696874e01817172294319544365782a" width="1680" height="972" data-path="images/android-rich-text-formatting.png" />
</Frame>

| Widgets                                                                                    | Functionality                                                                                                                                                                                                                                                            |
| ------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| [CompactMessageComposer](/ui-kit/flutter/v5/compact-message-composer#rich-text-formatting) | [CompactMessageComposer](/ui-kit/flutter/v5/compact-message-composer#rich-text-formatting) provides a built-in rich text editor with formatting toolbar and text selection menu items for bold, italic, strikethrough, code, links, lists, blockquotes, and code blocks. |
| [MessageList](/ui-kit/flutter/v5/message-list)                                             | [MessageList](/ui-kit/flutter/v5/message-list) renders formatted messages with the appropriate styling automatically applied, ensuring that rich text formatting is displayed exactly as intended by the sender.                                                         |

***

## Quoted Reply

Quoted Reply is a robust feature provided by CometChat that enables users to quickly reply to specific messages by selecting the "Reply" option from a message's action menu. This enhances context, keeps conversations organized, and improves overall chat experience in both 1-1 and group chats.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-audit-mechanical-fixes/SS5z-0d3JRPfFXXj/images/quotes_reply_flutter.png?fit=max&auto=format&n=SS5z-0d3JRPfFXXj&q=85&s=ef11da732afa60eb5adbcb51c91cacb2" width="2560" height="1670" data-path="images/quotes_reply_flutter.png" />
</Frame>

| Widgets                                                | Functionality                                                                                                                                                                                                          |
| ------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [MessageList](/ui-kit/flutter/v5/message-list)         | [MessageList](/ui-kit/flutter/v5/message-list) supports replying to messages via the "Reply" option. Users can select "Reply" on a message to open the composer with the quoted reply pre-filled, maintaining context. |
| [MessageComposer](/ui-kit/flutter/v5/message-composer) | [MessageComposer](/ui-kit/flutter/v5/message-composer) works seamlessly with Quoted Message by showing the quoted reply above the input field, letting users compose their response in proper context.                 |

***

## Conversation and Advanced Search

Conversation and Advanced Search is a powerful feature provided by CometChat that enables users to quickly find conversations, messages, and media across chats in real time. It supports filters, scopes, and custom actions, allowing users to locate content efficiently while keeping the chat experience smooth and intuitive.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-audit-mechanical-fixes/SS5z-0d3JRPfFXXj/images/search_overview_flutter.png?fit=max&auto=format&n=SS5z-0d3JRPfFXXj&q=85&s=fdc3c9a78d68ab8d3f8dfe3fa09c0906" width="2560" height="1670" data-path="images/search_overview_flutter.png" />
</Frame>

| Widgets                                                | Functionality                                                                                                                                                                                           |
| ------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [Search](/ui-kit/flutter/v5/search)                    | [Search](/ui-kit/flutter/v5/search) allows users to search across conversations and messages in real time. Users can click on a result to open the conversation or jump directly to a specific message. |
| [Message Header](/ui-kit/flutter/v5/message-header)    | [Message Header](/ui-kit/flutter/v5/message-header) shows the search button in the chat header, allowing users to search within a conversation.                                                         |
| [MessageList](/ui-kit/flutter/v5/message-list)         | [MessageList](/ui-kit/flutter/v5/message-list) shows the selected message when clicked from search results and highlights it in the message list.                                                       |
| [MessageComposer](/ui-kit/flutter/v5/message-composer) | [MessageComposer](/ui-kit/flutter/v5/message-composer) displays the search input.                                                                                                                       |

***

## Moderation

CometChat's Message Moderation feature helps maintain a safe and respectful chat environment by automatically filtering and managing inappropriate content. Messages can be automatically blocked or flagged based on predefined rules, ensuring harmful content is handled before it reaches users.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-audit-mechanical-fixes/MMfRg9nrn91d-s2I/images/mobile-uikit-moderation-overview.png?fit=max&auto=format&n=MMfRg9nrn91d-s2I&q=85&s=dbf7aea825217c447644435435b0bac8" width="1680" height="972" data-path="images/mobile-uikit-moderation-overview.png" />
</Frame>

<Note>
  Learn more about setting up moderation rules and managing content in the [Moderation](/moderation/overview) documentation.
</Note>

| Widgets                                         | Functionality                                                                                                                                                         |
| ----------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [Message List](/ui-kit/flutter/v5/message-list) | [Message List](/ui-kit/flutter/v5/message-list) automatically handles moderated messages, displaying blocked content appropriately based on your moderation settings. |

After implementing moderation rules, users can report messages they find inappropriate or harmful. As a next step, you can enable the **[Report Message](#report-message)** feature to allow users to flag messages for review by moderators.

***

## Report Message

The Report Message feature allows users to report inappropriate or harmful messages within the chat. Users can choose from predefined reasons and provide additional remarks for detailed context. This feature helps maintain a safe and respectful chat environment.

<Note>
  Learn more about how flagged messages are handled, reviewed, and moderated in the [Flagged Messages](/moderation/flagged-messages) documentation.
</Note>

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-audit-mechanical-fixes/SS5z-0d3JRPfFXXj/images/report_message_flutter.png?fit=max&auto=format&n=SS5z-0d3JRPfFXXj&q=85&s=7107b5804ec38b49164fe1ec292340bf" width="2518" height="1704" data-path="images/report_message_flutter.png" />
</Frame>

| Widgets                                        | Functionality                                                                                                                                                                                 |
| ---------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [MessageList](/ui-kit/flutter/v5/message-list) | [MessageList](/ui-kit/flutter/v5/message-list) provides the "Report Message" option in the message actions menu, allowing users to initiate the reporting process for inappropriate messages. |

***

## Threaded Conversations

The Threaded Conversations feature enables users to respond directly to a specific message in a chat. This keeps conversations organized and enhances the user experience by maintaining context, especially in group chats.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-audit-mechanical-fixes/Kgc1yhSJ8H43ZuSx/images/5aa62407-threads-5135ef6e5653ead9c01c9d9156f19108.png?fit=max&auto=format&n=Kgc1yhSJ8H43ZuSx&q=85&s=3279d3d6557b959aa87198c0b4b0432f" width="2880" height="2256" data-path="images/5aa62407-threads-5135ef6e5653ead9c01c9d9156f19108.png" />
</Frame>

| Widgets                                                          | Functionality                                                                                                                              |
| ---------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------ |
| [Threaded Messages](/ui-kit/flutter/v5/threaded-messages-header) | [Threaded Messages](/ui-kit/flutter/v5/threaded-messages-header) that displays all replies made to a particular message in a conversation. |

***

## Group Chat

CometChat facilitates Group Chats, allowing users to have conversations with multiple participants simultaneously. This feature is crucial for team collaborations, group discussions, social communities, and more.

<Frame>
  <img src="https://mintcdn.com/cometchat-22654f5b-docs-audit-mechanical-fixes/MMfRg9nrn91d-s2I/images/ffe2f315-group_conversation-f76a00f56455ac91e1531ccd718fb487.png?fit=max&auto=format&n=MMfRg9nrn91d-s2I&q=85&s=4b36ae20dc793631de1439952d29a0ed" width="2880" height="1666" data-path="images/ffe2f315-group_conversation-f76a00f56455ac91e1531ccd718fb487.png" />
</Frame>

For a comprehensive understanding and guide on implementing and using the Groups feature in CometChat, you should refer to our detailed guide on [Groups](/ui-kit/flutter/v5/groups).

***

## Next Steps

<CardGroup cols={2}>
  <Card title="Message Composer" icon="pen" href="/ui-kit/flutter/v5/message-composer">
    Learn how to send text, media, and custom messages
  </Card>

  <Card title="Message List" icon="list" href="/ui-kit/flutter/v5/message-list">
    Display and manage messages with real-time updates
  </Card>

  <Card title="Conversations" icon="comments" href="/ui-kit/flutter/v5/conversations">
    Show conversation lists with typing indicators and receipts
  </Card>

  <Card title="Groups" icon="users" href="/ui-kit/flutter/v5/groups">
    Create and manage group conversations
  </Card>
</CardGroup>

***
