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

# Card Message

> Card Message — CometChat documentation.

The `CardMessage` class is used to create a card message for CometChat. It extends the `InteractiveMessage` class from CometChat.

### Constructor

| Name         | Type                                       | Description                                                  |
| ------------ | ------------------------------------------ | ------------------------------------------------------------ |
| receiverId   | string                                     | The ID of the receiver                                       |
| receiverType | string                                     | The type of the receiver                                     |
| text         | string                                     | The text to be displayed on the card                         |
| cardActions  | [ButtonElement](/ui-kit/flutter/v4/button) | The actions to be performed when the card is interacted with |

***

### Class Usage

How to create an instance of the `CardMessage` class:

<Tabs>
  <Tab title="Dart">
    ```dart theme={null}
    CardMessage cardMessage = CardMessage(
        allowSenderInteraction: true,
        imageUrl: "https://www.wati.io/wp-content/uploads/2021/01/32-WhatsApp-Interactive-Messages-WhatsApp-List-Messages-and-Reply-Buttons-%E2%80%93-1.png",
        muid: DateTime.now().millisecondsSinceEpoch.toString(),
        text:"Hello jey how are you what's up",
        cardActions: [
            ButtonElement(
                elementId: "OpenLink",
                buttonText: "Open link",
                action: URLNavigationAction(
                    type: ActionTypeConstants.urlNavigation ,
                    url: "https://www.cometchat.com/"
                ),
            ),
            ButtonElement(
                elementId: "OpenLink2",
                buttonText: "Open link 2",
                action:URLNavigationAction(
                    type: ActionTypeConstants.urlNavigation ,
                    url: "https://www.cometchat.com/docs/home/welcome"
                ),
                disableAfterInteracted: true
            ),
        ],
        receiverUid: "cometchat-uid-2",//Replace this with the receiver's id
        receiverType: "user",//Replace this with the receiver's type
        sender: loggedInUser //Replace this with logged in user instance
    );
    ```
  </Tab>
</Tabs>

***

### Send Card Message

<Tabs>
  <Tab title="Dart">
    ```dart theme={null}
    CometChatUIKit.sendCardMessage(cardMessage, onSuccess: (CardMessage message){
        // TODO("Not yet implemented")
    }, onError: (e){
        // TODO("Not yet implemented")
    });
    ```
  </Tab>
</Tabs>
