Confirm Dialog
OverView
This element is a type of modal window that appears in front of app content to ask for a decision. It require users to explicitly confirm their choice before an option is committed.
Clicking on "Cancel" cancels the action, discards any changes, and closes the dialog.
Properties
Name | Type | Description |
---|---|---|
title | string | Heading text of the element |
messageText | string | Description text of the element |
confirmButtonText | string | Text on the confirm button |
cancelButtonText | string | Text on the cancel button |
confirmButtonIconURL | string | Asset URL for the icon that appears on the confirm button |
cancelButtonIconURL | string | Asset URL for the icon that appears on the cancel button |
confirmDialogStyle | ConfirmDialogStyle | Styling properties and values of the element |
Events
Events triggered by the element
Name | Description |
---|---|
cc-confirm-clicked | Triggered when user clicks on the confirm button |
cc-cancel-clicked | Triggered when user clicks on the cancel button |
ConfirmDialogStyle
Styling properties and values of the element
Name | Description |
---|---|
width | Sets the width of the element |
height | Sets the height of the element |
border | Sets the border of the element |
borderRadius | Sets the border radius of the element |
background | Sets all background style properties at once, such as color, image, origin and size, or repeat method of the element. Reference link |
boxShadow | Sets shadow effects around the element |
titleFont | Sets all the different properties of font for the heading text. Reference link |
titleColor | Sets the foreground color of heading text. |
messageTextFont | Sets all the different properties of font for the description text. Reference link |
messageTextColor | Sets the foreground color of description text. |
confirmButtonTextFont | Sets all the different properties of font for the confirm button text. Reference link |
confirmButtonTextColor | Sets the foreground color of confirm button text. |
confirmButtonBackground | Sets all background style properties at once, such as color, image, origin and size, or repeat method of the confirm button. Reference link |
confirmButtonIconTint | Sets the tint or color applied to the icon displayed on the confirm button |
cancelButtonTextFont | Sets all the different properties of font for the cancel button text. Reference link |
cancelButtonTextColor | Sets the foreground color of cancel button text. |
cancelButtonBackground | Sets all background style properties at once, such as color, image, origin and size, or repeat method of the cancel button. Reference link |
cancelButtonIconTint | Sets the tint or color applied to the icon displayed on the cancel button |
Usage
- HTML
<cometchat-confirm-dialog
[title]="'title'"
[messageText]="'messageText'">
</cometchat-confirm-dialog>