Events in the CometChat Flutter UI Kit

Handle CometChat Flutter UI Kit events for users, groups, messages, conversations, calls, and UI-level interactions with a decoupled event architecture.

Overview

Events allow for a decoupled, flexible architecture where different parts of the application can interact without having to directly reference each other. This makes it easier to create complex, interactive experiences, as well as to extend and customize the functionality provided by the CometChat UI Kit.

The event system is identical between V5 and V6. All event classes, listeners, and APIs work the same way.

User Events

CometChatUserEvents emit events when the logged-in user executes actions on another user.

1. ccUserBlocked: Triggered when the logged-in user blocks another user.
2. ccUserUnblocked: Triggered when the logged-in user unblocks another user.

Dart

import 'package:cometchat_chat_uikit/cometchat_chat_uikit.dart';

class _YourScreenState extends State<YourScreen> with CometChatUserEventListener {
  @override
  void initState() {
    super.initState();
    CometChatUserEvents.addUsersListener("listenerId", this);
  }

  @override
  void dispose() {
    super.dispose();
    CometChatUserEvents.removeUsersListener("listenerId");
  }

  @override
  void ccUserBlocked(User user) {
    // Handle user blocked
  }

  @override
  void ccUserUnblocked(User user) {
    // Handle user unblocked
  }

  @override
  Widget build(BuildContext context) {
    return const Placeholder();
  }
}

---

Group Events

CometChatGroupEvents emits events when the logged-in user performs actions related to groups.

1. ccGroupCreated: Triggered when the logged-in user creates a group.
2. ccGroupDeleted: Triggered when the logged-in user deletes a group.
3. ccGroupLeft: Triggered when the logged-in user leaves a group.
4. ccGroupMemberScopeChanged: Triggered when the logged-in user changes the scope of another group member.
5. ccGroupMemberBanned: Triggered when the logged-in user bans a group member.
6. ccGroupMemberKicked: Triggered when the logged-in user kicks a group member.
7. ccGroupMemberUnbanned: Triggered when the logged-in user unbans a user.
8. ccGroupMemberJoined: Triggered when the logged-in user joins a group.
9. ccGroupMemberAdded: Triggered when the logged-in user adds new members.
10. ccOwnershipChanged: Triggered when the logged-in user transfers ownership.

Dart

import 'package:cometchat_chat_uikit/cometchat_chat_uikit.dart';

class _YourScreenState extends State<YourScreen> with CometChatGroupEventListener {
  @override
  void initState() {
    super.initState();
    CometChatGroupEvents.addGroupsListener("listenerId", this);
  }

  @override
  void dispose() {
    super.dispose();
    CometChatGroupEvents.removeGroupsListener("listenerId");
  }

  @override
  void ccGroupCreated(Group group) {
    // Handle group created
  }

  @override
  void ccGroupDeleted(Group group) {
    // Handle group deleted
  }

  @override
  Widget build(BuildContext context) {
    return const Placeholder();
  }
}

---

Message Events

CometChatMessageEvents emits events related to messages.

Dart

import 'package:cometchat_chat_uikit/cometchat_chat_uikit.dart';

class _YourScreenState extends State<YourScreen> with CometChatMessageEventListener {
  @override
  void initState() {
    super.initState();
    CometChatMessageEvents.addMessagesListener("listenerId", this);
  }

  @override
  void dispose() {
    super.dispose();
    CometChatMessageEvents.removeMessagesListener("listenerId");
  }

  @override
  Widget build(BuildContext context) {
    return const Placeholder();
  }
}

---

Conversation Events

CometChatConversationEvents emits events related to conversations.

1. ccConversationDeleted: Triggered when a conversation is deleted.

Dart

import 'package:cometchat_chat_uikit/cometchat_chat_uikit.dart';

class _YourScreenState extends State<YourScreen> with CometChatConversationEventListener {
  @override
  void initState() {
    super.initState();
    CometChatConversationEvents.addConversationListListener("listenerId", this);
  }

  @override
  void dispose() {
    super.dispose();
    CometChatConversationEvents.removeConversationListListener("listenerId");
  }

  @override
  void ccConversationDeleted(Conversation conversation) {
    // Handle conversation deleted
  }

  @override
  Widget build(BuildContext context) {
    return const Placeholder();
  }
}

---

UI Events

CometChatUIEvents emits CometChatUIEventListener callbacks for UI-level actions such as panel visibility, active chat changes, and card action taps. Add a listener with CometChatUIEvents.addUiListener(listenerId, this) and remove it in dispose().

Event types:

Event	Description
showPanel(id, uiPosition, child)	Triggered to show an additional UI panel with custom elements.
hidePanel(id, uiPosition)	Triggered to hide a previously shown UI panel.
ccActiveChatChanged(id, lastMessage, user, group, unreadMessageCount)	Triggered when the active chat changes.
openChat(user, group)	Triggered to open a chat with a specific user or group.
ccComposeMessage(text, status)	Triggered when composing a message with a specific text and status.
onAiFeatureTapped(user, group)	Triggered when an AI feature is tapped for a specific user or group.
ccCardActionClicked(message, action)	Triggered when a user taps an interactive element (button/link) inside a card message (CardMessage) or an AI agent card (AIAssistantMessage). action is typed dynamic; cast it to CometChatCardActionEvent.

Dart

class _YourScreenState extends State<YourScreen> with CometChatUIEventListener {
  final String listenerId = "unique_listener_id";

  @override
  void initState() {
    super.initState();
    CometChatUIEvents.addUiListener(listenerId, this);
  }

  @override
  void dispose() {
    CometChatUIEvents.removeUiListener(listenerId);
    super.dispose();
  }

  @override
  void ccCardActionClicked(BaseMessage message, dynamic action) {
    // message -> CardMessage (standalone) or AIAssistantMessage (agent card)
    if (action is CometChatCardActionEvent) {
      debugPrint("Action: ${action.action}");
      debugPrint("Element ID: ${action.elementId}");
      debugPrint("Card JSON: ${action.cardJson}");
      // Handle navigation, API calls, etc.
    }
  }

  @override
  Widget build(BuildContext context) => const Placeholder();
}

The UI Kit renders card bubbles automatically (CometChatCardBubble) and emits ccCardActionClicked when a user taps an action inside one — so a single subscriber handles every card action across your app. message is a CardMessage for standalone card messages and an AIAssistantMessage for cards embedded in AI agent replies. Cast action to CometChatCardActionEvent to read its action, elementId, and cardJson. See also Methods → UI Events — Card Actions.