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

# Date

> Date — CometChat documentation.

`CometChatDate` is a widget which is used to show the date and time. You can also customize the appearance of this widget by modifying its logic.

## How to integrate CometChatDate ?

<Tabs>
  <Tab title="TypeScript">
    ```tsx theme={null}
    <CometChatDate
        timeStamp={timestamp}
        style={messageBubbleDateStyle}
        pattern={"timeFormat"}
        customDateString={datePattern}
      />
    ```
  </Tab>
</Tabs>

## Properties

| Parameters       | Type                                                   | Description                                                                            |
| ---------------- | ------------------------------------------------------ | -------------------------------------------------------------------------------------- |
| timeStamp        | number                                                 | Used to set the date                                                                   |
| pattern          | 'timeFormat' \| 'dayDateFormat' \| 'dayDateTimeFormat' | Used to set pattern with different logics timeFormat, dayDateFormat, dayDateTimeFormat |
| customDateString | string                                                 | text to show instead of date from DateTime object                                      |
| style            | DateStyleInterface                                     | used to customize the appearance of this view                                          |

## DateStyleInterface

| Parameters      | Type                 | Description               |
| --------------- | -------------------- | ------------------------- |
| textColor       | string               | colour of date text       |
| textFont        | FontStyleInterface   | font style of text        |
| border          | BorderStyleInterface | border for date           |
| borderRadius    | number               | border radius for date    |
| height          | number \| string     | height of the date        |
| width           | number \| string     | width of the date         |
| backgroundColor | string               | background colour to date |
