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

# Group Chat

> Build CometChat Flutter UI Kit group chats with group lists, members, headers, message lists, and composers.

<Accordion title="AI Integration Quick Reference">
  | Field | Value |
  | - | - |
  | Package | `cometchat_chat_uikit` |
  | Import | `import 'package:cometchat_chat_uikit/cometchat_chat_uikit.dart';` |
  | Purpose | Build CometChat Flutter UI Kit group chats with group lists, members, headers, message lists, and composers. |
  | Key widgets | `CometChatGroupMembers` · `CometChatGroups` · `CometChatMessageComposer` · `CometChatMessageHeader` · `CometChatMessageList` |
  | Prerequisites | `CometChatUIKit` initialised and a user logged in. |
  | Related | [Groups](/ui-kit/flutter/groups) · [Group Members](/ui-kit/flutter/group-members) · [Message List](/ui-kit/flutter/message-list) |
</Accordion>

Build group chat functionality in your Flutter app using CometChat V6 UIKit. Create/join groups, view members, manage roles, and moderate participation.

## Overview

V6 provides `CometChatGroups` and `CometChatGroupMembers` widgets powered by BLoC for group management.

## Components

| Component | Role |
| :- | :- |
| `CometChatGroups` | Lists available groups |
| `CometChatGroupMembers` | Displays and manages group members |
| `CometChatMessageHeader` | Shows group info in chat header |
| `CometChatMessageList` | Displays group messages |
| `CometChatMessageComposer` | Sends messages to group |

## Integration

### Display Groups List

<Tabs>
  <Tab title="Dart">
    ```dart theme={null}
    CometChatGroups(
      onItemTap: (context, group) {
        Navigator.push(
          context,
          MaterialPageRoute(
            builder: (_) => Scaffold(
              appBar: CometChatMessageHeader(group: group),
              body: SafeArea(
                child: Column(
                  children: [
                    Expanded(child: CometChatMessageList(group: group)),
                    CometChatMessageComposer(group: group),
                  ],
                ),
              ),
            ),
          ),
        );
      },
    )
    ```
  </Tab>
</Tabs>

### Display Group Members

<Tabs>
  <Tab title="Dart">
    ```dart theme={null}
    CometChatGroupMembers(
      group: group,
      onItemTap: (groupMember) {
        // Handle member tap
      },
    )
    ```
  </Tab>
</Tabs>

### Manage Members

V6 provides built-in options for member management:

<Tabs>
  <Tab title="Dart">
    ```dart theme={null}
    CometChatGroupMembers(
      group: group,
      hideKickMemberOption: false,
      hideBanMemberOption: false,
      hideScopeChangeOption: false,
    )
    ```
  </Tab>
</Tabs>

## Key V6 Differences

| Aspect | V5 | V6 |
| - | - | - |
| Composite widget | `CometChatGroupsWithMessages` | Not available — compose manually |
| State management | GetX | BLoC (`GroupsBloc`) |
| Member management | Via configuration objects | Direct widget properties |


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.