Receipt
This element renders the read receipts such as sending, sent, delivered and error state indicator of a sent message.
Properties
Name | Type | Description |
---|---|---|
waitIcon | string | Asset URL for the wait icon |
sentIcon | string | Asset URL for the sent icon |
deliveredIcon | string | Asset URL for the delivered icon |
readIcon | string | Asset URL for the read icon |
errorIcon | string | Asset URL for the error icon |
receipt | Receipts | Group of constants representing the various receipt status |
ReceiptStyle
Name | Description |
---|---|
waitIconTint | Sets the color applied to the wait icon |
sentIconTint | Sets the color applied to the sent icon |
deliveredIconTint | Sets the color applied to the delivered icon |
readIconTint | Sets the color applied to the read icon |
errorIconTint | Sets the color applied to the error icon |
Usage
- Javascript
import '@cometchat/uikit-elements'; //import the web elements package
import { receipts } from '@cometchat/uikit-elements'; //import the receipts enum constant
//display the wait status icon
//use the element
<cometchat-receipt
waitIcon="https://cdn-icons-png.flaticon.com/24/661/661562.png"
sentIcon="https://cdn-icons-png.flaticon.com/24/1443/1443000.png" deliveredIcon="https://cdn-icons-png.flaticon.com/24/10728/10728652.png" readIcon="https://cdn-icons-png.flaticon.com/24/10728/10728588.png"
receipt={receipts.wait}
errorIcon="https://cdn-icons-png.flaticon.com/24/10207/10207468.png"></cometchat-receipt>