> ## 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.

# Receipt

> Receipt — CometChat documentation.

The `CometChatReceipt` component renders the receipts such as sending, sent, delivered, read, and error state indicators of a message.

## How to integrate CometChatReceipt?

Since `CometChatReceipt` is a widget, it can be added directly in the build method. `CometChatReceipt` includes various attributes and methods to customize its UI.

<Tabs>
  <Tab title="Dart">
    ```dart theme={null}
    CometChatReceipt(
      status: ReceiptStatus.read,
      waitIcon: Image.asset(
        "<image_url>",
      ),
      sentIcon: Image.asset(
        "<image_url>",
      ),
      deliveredIcon: Image.asset(
        "<image_url>",
      ),
      readIcon: Image.asset(
        "<image_url>",
      ),
      errorIcon: Image.asset(
        "<image_url>",
      ),
    );
    ```
  </Tab>
</Tabs>

***

## Properties

To style or customize the `CometChatReceipt`, you can use the available parameters.

| Attributes        | Type          | Description                                                                                                          |
| ----------------- | ------------- | -------------------------------------------------------------------------------------------------------------------- |
| **status**        | ReceiptStatus | Receipt status from which `sentAt` and `readAt` will be read to get the receipts                                     |
| **waitIcon**      | Widget        | It is used to pass a user-defined image into the `MessageReceipt`, to change the icon while sending the message.     |
| **sentIcon**      | Widget        | It is used to pass a user-defined image into the `MessageReceipt`, to change the icon when the message is sent.      |
| **deliveredIcon** | Widget        | It is used to pass a user-defined image into the `MessageReceipt`, to change the icon when the message is delivered. |
| **readIcon**      | Widget        | It is used to pass a user-defined image into the `MessageReceipt`, to change the icon when the message is read.      |
| **errorIcon**     | Widget        | It is used to pass a user-defined image into the `MessageReceipt`, to change the icon when an error occurs.          |

***

## ReceiptStyle

Custom style for receipts.

| Attributes            | Type   | Description                                                                           |
| --------------------- | ------ | ------------------------------------------------------------------------------------- |
| **sentIconTint**      | Widget | It is used to change the icon color of the receipt when `ReceiptStatus` is sent.      |
| **deliveredIconTint** | Widget | It is used to change the icon color of the receipt when `ReceiptStatus` is delivered. |
| **readIconTint**      | Widget | It is used to change the icon color of the receipt when `ReceiptStatus` is read.      |

***

## Usage

<Tabs>
  <Tab title="Dart">
    ```dart theme={null}
    CometChatReceipt(
      status: ReceiptStatus.read,
    )
    ```
  </Tab>
</Tabs>
