@cometchat/chat-uikit-react 6.0.3 → 6.0.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (45) hide show
  1. package/dist/index.d.ts +55 -54
  2. package/dist/index.js +1 -1
  3. package/dist/index.js.map +1 -1
  4. package/dist/styles/CometChatAudioBubble.css +4 -4
  5. package/dist/styles/CometChatConversationSummary.css +2 -2
  6. package/dist/styles/CometChatEditPreview.css +3 -0
  7. package/dist/styles/CometChatFileBubble.css +4 -4
  8. package/dist/styles/CometChatFullScreenViewer.css +2 -2
  9. package/dist/styles/CometChatMessageComposer.css +8 -1
  10. package/dist/styles/CometChatMessageInformation.css +2 -2
  11. package/dist/styles/CometChatMessageList.css +26 -18
  12. package/dist/styles/CometChatPopover.css +19 -0
  13. package/dist/styles/CometChatReactionInfo.css +0 -15
  14. package/dist/styles/CometChatReactionList.css +1 -1
  15. package/dist/styles/CometChatSmartReplies.css +2 -2
  16. package/dist/styles/CreatePolls.css +8 -1
  17. package/dist/styles/StickersKeyboard.css +2 -2
  18. package/dist/styles/components/CometChatAudioBubble.css +4 -4
  19. package/dist/styles/components/CometChatConversationSummary.css +2 -2
  20. package/dist/styles/components/CometChatEditPreview.css +3 -0
  21. package/dist/styles/components/CometChatFileBubble.css +4 -4
  22. package/dist/styles/components/CometChatFullScreenViewer.css +2 -2
  23. package/dist/styles/components/CometChatMessageComposer.css +8 -1
  24. package/dist/styles/components/CometChatMessageInformation.css +2 -2
  25. package/dist/styles/components/CometChatMessageList.css +26 -18
  26. package/dist/styles/components/CometChatPopover.css +19 -0
  27. package/dist/styles/components/CometChatReactionInfo.css +0 -15
  28. package/dist/styles/components/CometChatReactionList.css +1 -1
  29. package/dist/styles/components/CometChatSmartReplies.css +2 -2
  30. package/dist/styles/components/CreatePolls.css +8 -1
  31. package/dist/styles/components/StickersKeyboard.css +2 -2
  32. package/dist/types/components/BaseComponents/CometChatPopover/CometChatPopover.d.ts +1 -0
  33. package/dist/types/components/CometChatMessageComposer/useCometChatMessageComposer.d.ts +1 -0
  34. package/dist/types/components/CometChatMessageInformation/CometChatMessageInformation.d.ts +15 -0
  35. package/dist/types/components/CometChatThreadHeader/CometChatThreadHeader.d.ts +10 -0
  36. package/dist/types/events/CometChatUIEvents.d.ts +2 -0
  37. package/dist/types/modals/CometChatMessageTemplate.d.ts +3 -2
  38. package/dist/types/utils/DataSource.d.ts +1 -1
  39. package/dist/types/utils/DataSourceDecorator.d.ts +1 -1
  40. package/dist/types/utils/MessageReceiptUtils.d.ts +3 -30
  41. package/dist/types/utils/MessageUtils.d.ts +4 -3
  42. package/dist/types/utils/MessagesDataSource.d.ts +2 -2
  43. package/dist/types/utils/Storage.d.ts +3 -0
  44. package/dist/types/utils/util.d.ts +1 -0
  45. package/package.json +6 -2
@@ -15,8 +15,8 @@
15
15
 
16
16
  /* Download icon for the tail view (right side of the audio bubble) */
17
17
  .cometchat-audio-bubble__tail-view-download {
18
- mask: url("../../assets/download.svg");
19
- -webkit-mask: url("../../assets/download.svg");
18
+ mask: url("../../assets/download.svg") center center no-repeat;
19
+ -webkit-mask: url("../../assets/download.svg") center center no-repeat;
20
20
  display: flex;
21
21
  width: 24px;
22
22
  height: 24px;
@@ -54,8 +54,8 @@
54
54
 
55
55
  /* Close/stop icon inside the progress view (positioned in the center) */
56
56
  .cometchat-audio-bubble__tail-view-download-stop {
57
- mask: url("../../assets/close.svg");
58
- -webkit-mask: url("../../assets/close.svg");
57
+ mask: url("../../assets/close.svg") center center no-repeat;
58
+ -webkit-mask: url("../../assets/close.svg") center center no-repeat;
59
59
  background: var(--cometchat-static-white);
60
60
  display: flex;
61
61
  width: 15px;
@@ -34,8 +34,8 @@
34
34
  }
35
35
 
36
36
  .cometchat-conversation-summary__header-close-button {
37
- mask: url("../../assets/close.svg");
38
- -webkit-mask: url("../../assets/close.svg");
37
+ mask: url("../../assets/close.svg") center center no-repeat;
38
+ -webkit-mask: url("../../assets/close.svg") center center no-repeat;
39
39
  background-color: var(--cometchat-icon-color-primary, #141414);
40
40
  width: 20px;
41
41
  height: 20px;
@@ -56,4 +56,7 @@
56
56
  text-align: left;
57
57
  color: var(--cometchat-text-color-secondary);
58
58
  font: var(--cometchat-font-caption1-regular);
59
+ word-break: break-word;
60
+ width: 100%;
61
+ overflow: hidden;
59
62
  }
@@ -65,8 +65,8 @@
65
65
 
66
66
  /* Download icon for the tail view (right side of the file bubble) */
67
67
  .cometchat-file-bubble__tail-view-download {
68
- mask: url("../../assets/download.svg");
69
- -webkit-mask: url("../../assets/download.svg");
68
+ mask: url("../../assets/download.svg") center center no-repeat;
69
+ -webkit-mask: url("../../assets/download.svg") center center no-repeat;
70
70
  display: flex;
71
71
  width: 20px;
72
72
  height: 20px;
@@ -125,8 +125,8 @@
125
125
 
126
126
  /* Close icon in the progress view to stop/cancel download */
127
127
  .cometchat-file-bubble__tail-view-download-stop {
128
- mask: url("../../assets/close.svg");
129
- -webkit-mask: url("../../assets/close.svg");
128
+ mask: url("../../assets/close.svg") center center no-repeat;
129
+ -webkit-mask: url("../../assets/close.svg") center center no-repeat;
130
130
  background: var(--cometchat-primary-color);
131
131
  display: flex;
132
132
  width: 12px;
@@ -61,8 +61,8 @@
61
61
  background-color: var(--cometchat-primary-button-icon, #FFFFFF);
62
62
  height: 32px;
63
63
  width: 32px;
64
- -webkit-mask: url("../../assets/close.svg");
65
- mask: url("../../assets/close.svg");
64
+ -webkit-mask: url("../../assets/close.svg") center center no-repeat;
65
+ mask: url("../../assets/close.svg") center center no-repeat;
66
66
  -webkit-mask-size: 100%;
67
67
  mask-size: 100%;
68
68
  }
@@ -149,7 +149,7 @@
149
149
  }
150
150
 
151
151
  .cometchat-message-composer__header-error-state-icon {
152
- -webkit-mask: url("../../assets/error_info.svg");
152
+ -webkit-mask: url("../../assets/error_info.svg") center center no-repeat;
153
153
  width: 20px;
154
154
  height: 20px;
155
155
  -webkit-mask-size: contain;
@@ -319,4 +319,11 @@ height: 58px;
319
319
  }
320
320
  .cometchat-message-composer__secondary-button-view-attachment-button-5 .cometchat-popover__content{
321
321
  height: 285px;
322
+ }
323
+ .cometchat-message-composer .cometchat-edit-preview__subtitle{
324
+ height: fit-content;
325
+ max-height: 100px;
326
+ overflow: hidden;
327
+ text-overflow: ellipsis;
328
+ white-space: nowrap;
322
329
  }
@@ -98,7 +98,7 @@
98
98
  padding: 0px;
99
99
  flex-direction: column;
100
100
  align-items: flex-start;
101
- max-height: 300px;
101
+ height: 260px;
102
102
  overflow: hidden auto;
103
103
  }
104
104
 
@@ -160,7 +160,7 @@
160
160
 
161
161
  .cometchat-message-information__shimmer {
162
162
  width: 100%;
163
- height: 100%;
163
+ height: 260px;
164
164
  background: var(--cometchat-background-color-01, #FFF);
165
165
 
166
166
  }
@@ -554,96 +554,96 @@ width: fit-content;
554
554
  }
555
555
 
556
556
  .cometchat-message-bubble__video-call .cometchat-message-bubble__missed-call .cometchat-action-bubble__icon {
557
- -webkit-mask: url("../../assets/missed_video_call_no_fill.svg");
557
+ -webkit-mask: url("../../assets/missed_video_call_no_fill.svg") center center no-repeat;
558
558
  -webkit-mask-size: contain;
559
559
  background: var(--cometchat-error-color);
560
560
  }
561
561
 
562
562
  .cometchat-message-bubble__video-call .cometchat-message-bubble__ended-call .cometchat-action-bubble__icon {
563
- -webkit-mask: url("../../assets/call_end_no_fill.svg");
563
+ -webkit-mask: url("../../assets/call_end_no_fill.svg") center center no-repeat;
564
564
  -webkit-mask-size: contain;
565
565
  }
566
566
 
567
567
  .cometchat-message-bubble__video-call .cometchat-message-bubble__outgoing-call .cometchat-action-bubble__icon {
568
- -webkit-mask: url("../../assets/outgoing_video_no_fill.svg");
568
+ -webkit-mask: url("../../assets/outgoing_video_no_fill.svg") center center no-repeat;
569
569
  -webkit-mask-size: contain;
570
570
  }
571
571
 
572
572
  .cometchat-message-bubble__video-call .cometchat-message-bubble__incoming-call .cometchat-action-bubble__icon {
573
- -webkit-mask: url("../../assets/incoming_video_no_fill.svg");
573
+ -webkit-mask: url("../../assets/incoming_video_no_fill.svg") center center no-repeat;
574
574
  -webkit-mask-size: contain;
575
575
  }
576
576
 
577
577
  .cometchat-message-bubble__video-call .cometchat-message-bubble__busy-call .cometchat-action-bubble__icon {
578
- -webkit-mask: url("../../assets/video_call_button.svg");
578
+ -webkit-mask: url("../../assets/video_call_button.svg") center center no-repeat;
579
579
  -webkit-mask-size: contain;
580
580
  }
581
581
 
582
582
  .cometchat-message-bubble__video-call .cometchat-message-bubble__answered-call .cometchat-action-bubble__icon {
583
- -webkit-mask: url("../../assets/video_call_button.svg");
583
+ -webkit-mask: url("../../assets/video_call_button.svg") center center no-repeat;
584
584
  -webkit-mask-size: contain;
585
585
  }
586
586
 
587
587
  .cometchat-message-bubble__video-call .cometchat-message-bubble__unanswered-call .cometchat-action-bubble__icon {
588
- -webkit-mask: url("../../assets/video_call_button.svg");
588
+ -webkit-mask: url("../../assets/video_call_button.svg") center center no-repeat;
589
589
  -webkit-mask-size: contain;
590
590
  }
591
591
 
592
592
  .cometchat-message-bubble__video-call .cometchat-message-bubble__cancelled-call .cometchat-action-bubble__icon {
593
- -webkit-mask: url("../../assets/video_call_button.svg");
593
+ -webkit-mask: url("../../assets/video_call_button.svg") center center no-repeat;
594
594
  -webkit-mask-size: contain;
595
595
  }
596
596
 
597
597
  .cometchat-message-bubble__video-call .cometchat-message-bubble__rejected-call .cometchat-action-bubble__icon {
598
- -webkit-mask: url("../../assets/video_call_button.svg");
598
+ -webkit-mask: url("../../assets/video_call_button.svg") center center no-repeat;
599
599
  -webkit-mask-size: contain;
600
600
  }
601
601
 
602
602
 
603
603
  .cometchat-message-bubble__audio-call .cometchat-message-bubble__missed-call .cometchat-action-bubble__icon {
604
- -webkit-mask: url("../../assets/phone_missed_no_fill.svg");
604
+ -webkit-mask: url("../../assets/phone_missed_no_fill.svg") center center no-repeat;
605
605
  -webkit-mask-size: contain;
606
606
  background: var(--cometchat-error-color);
607
607
 
608
608
  }
609
609
 
610
610
  .cometchat-message-bubble__audio-call .cometchat-message-bubble__ended-call .cometchat-action-bubble__icon {
611
- -webkit-mask: url("../../assets/call_end_no_fill.svg");
611
+ -webkit-mask: url("../../assets/call_end_no_fill.svg") center center no-repeat;
612
612
  -webkit-mask-size: contain;
613
613
  }
614
614
 
615
615
  .cometchat-message-bubble__audio-call .cometchat-message-bubble__outgoing-call .cometchat-action-bubble__icon {
616
- -webkit-mask: url("../../assets/phone_outgoing_no_fill.svg");
616
+ -webkit-mask: url("../../assets/phone_outgoing_no_fill.svg") center center no-repeat;
617
617
  -webkit-mask-size: contain;
618
618
  }
619
619
 
620
620
  .cometchat-message-bubble__audio-call .cometchat-message-bubble__incoming-call .cometchat-action-bubble__icon {
621
- -webkit-mask: url("../../assets/phone_incoming_no_fill.svg");
621
+ -webkit-mask: url("../../assets/phone_incoming_no_fill.svg") center center no-repeat;
622
622
  -webkit-mask-size: contain;
623
623
  }
624
624
 
625
625
  .cometchat-message-bubble__audio-call .cometchat-message-bubble__busy-call .cometchat-action-bubble__icon {
626
- -webkit-mask: url("../../assets/audio_call_button.svg");
626
+ -webkit-mask: url("../../assets/audio_call_button.svg") center center no-repeat;
627
627
  -webkit-mask-size: contain;
628
628
  }
629
629
 
630
630
  .cometchat-message-bubble__audio-call .cometchat-message-bubble__answered-call .cometchat-action-bubble__icon {
631
- -webkit-mask: url("../../assets/audio_call_button.svg");
631
+ -webkit-mask: url("../../assets/audio_call_button.svg") center center no-repeat;
632
632
  -webkit-mask-size: contain;
633
633
  }
634
634
 
635
635
  .cometchat-message-bubble__audio-call .cometchat-message-bubble__unanswered-call .cometchat-action-bubble__icon {
636
- -webkit-mask: url("../../assets/audio_call_button.svg");
636
+ -webkit-mask: url("../../assets/audio_call_button.svg") center center no-repeat;
637
637
  -webkit-mask-size: contain;
638
638
  }
639
639
 
640
640
  .cometchat-message-bubble__audio-call .cometchat-message-bubble__cancelled-call .cometchat-action-bubble__icon {
641
- -webkit-mask: url("../../assets/audio_call_button.svg");
641
+ -webkit-mask: url("../../assets/audio_call_button.svg") center center no-repeat;
642
642
  -webkit-mask-size: contain;
643
643
  }
644
644
 
645
645
  .cometchat-message-bubble__audio-call .cometchat-message-bubble__rejected-call .cometchat-action-bubble__icon {
646
- -webkit-mask: url("../../assets/audio_call_button.svg");
646
+ -webkit-mask: url("../../assets/audio_call_button.svg") center center no-repeat;
647
647
  -webkit-mask-size: contain;
648
648
  }
649
649
 
@@ -681,6 +681,14 @@ width: fit-content;
681
681
  */
682
682
  .cometchat-message-bubble__sticker-message .cometchat-message-bubble__status-info-view {
683
683
  background: rgba(20, 20, 20, 0.60);
684
+ align-items: center;
685
+ }
686
+
687
+ .cometchat-message-bubble__sticker-message .cometchat-message-bubble__status-info-view > .cometchat{
688
+ box-sizing: border-box;
689
+ align-items: center;
690
+ justify-content: center;
691
+ display: flex;
684
692
  }
685
693
 
686
694
  /**
@@ -7,4 +7,23 @@
7
7
  border: 1px solid var(--cometchat-border-color-light, #F5F5F5);
8
8
  background: var(--cometchat-background-color-01, #FFF);
9
9
  box-shadow: 0px 12px 16px -4px rgba(16, 24, 40, 0.08), 0px 4px 6px -2px rgba(16, 24, 40, 0.03);
10
+ }
11
+
12
+ .cometchat-popover__content-tooltip-top,
13
+ .cometchat-popover__content-tooltip-bottom {
14
+ position: absolute;
15
+ width: 100%;
16
+ height: 6px;
17
+ background: var(--cometchat-static-black, #141414);
18
+ -webkit-mask: url("../../assets/tooltip.svg") center center no-repeat;
19
+ -webkit-mask-size: contain;
20
+ }
21
+
22
+ .cometchat-popover__content-tooltip-top {
23
+ bottom: -7px;
24
+ }
25
+
26
+ .cometchat-popover__content-tooltip-bottom {
27
+ transform: rotate(180deg);
28
+ top: -7px;
10
29
  }
@@ -19,21 +19,6 @@
19
19
  justify-content: center;
20
20
  }
21
21
 
22
- .cometchat-reaction-info__tooltip {
23
- width: 32px;
24
- height: 6px;
25
- background: var(--cometchat-static-black, #141414);
26
- -webkit-mask: url("../../assets/tooltip.svg") center center no-repeat;
27
- -webkit-mask-size: contain;
28
- }
29
-
30
- .cometchat-reaction-info__tooltip-side {
31
- width: 6px;
32
- height: 32px;
33
- background: var(--cometchat-static-black, #141414);
34
- -webkit-mask: url("../../assets/tooltip-side.svg") center center no-repeat;
35
- -webkit-mask-size: contain;
36
- }
37
22
 
38
23
  .cometchat-reaction-info__emoji-text {
39
24
  display: flex;
@@ -119,7 +119,7 @@
119
119
  .cometchat-reaction-list__shimmer {
120
120
  display: flex;
121
121
  width: 280px;
122
- max-height: 300px;
122
+ height: 200px;
123
123
  flex-direction: column;
124
124
  align-items: flex-start;
125
125
  align-self: stretch;
@@ -34,8 +34,8 @@
34
34
  }
35
35
 
36
36
  .cometchat-smart-replies__header-close-button {
37
- mask: url("../../assets/close.svg");
38
- -webkit-mask: url("../../assets/close.svg");
37
+ mask: url("../../assets/close.svg") center center no-repeat;
38
+ -webkit-mask: url("../../assets/close.svg") center center no-repeat;
39
39
  background-color: var(--cometchat-icon-color-primary, #141414);
40
40
  width: 20px;
41
41
  height: 20px;
@@ -173,7 +173,7 @@
173
173
  }
174
174
 
175
175
  .cometchat-create-poll__button {
176
- width: 388px;
176
+ width: 100%;
177
177
  height: 40px;
178
178
  }
179
179
 
@@ -236,6 +236,7 @@
236
236
  bottom: 0px;
237
237
  border-top: 1px solid var(--cometchat-border-color-light, #F5F5F5);
238
238
  padding: var(--cometchat-padding-3, 12px) var(--cometchat-padding-4, 16px) var(--cometchat-padding-5) var(--cometchat-padding-4, 16px);
239
+ width: 100%;
239
240
 
240
241
  }
241
242
 
@@ -290,4 +291,10 @@
290
291
  .cometchat-create-poll__body-options-add-button-disabled{
291
292
  color: var(--cometchat-text-color-disabled, #DCDCDC);
292
293
  font: var(--cometchat-font-caption1-medium);
294
+ }
295
+
296
+ @media (max-width: 768px) {
297
+ .cometchat-create-poll{
298
+ width: 360px;
299
+ }
293
300
  }
@@ -168,8 +168,8 @@
168
168
  .cometchat-sticker-keyboard__empty-view-icon {
169
169
  width: 60px;
170
170
  height: 60px;
171
- -webkit-mask-image: url("../../assets/sticker.svg");
172
- mask-image: url("../../assets/sticker.svg");
171
+ -webkit-mask-image: url("../../assets/sticker.svg") center center no-repeat;
172
+ mask-image: url("../../assets/sticker.svg") center center no-repeat;
173
173
  -webkit-mask-size: 100%;
174
174
  mask-size: 100%;
175
175
  -webkit-mask-repeat: no-repeat;
@@ -15,8 +15,8 @@
15
15
 
16
16
  /* Download icon for the tail view (right side of the audio bubble) */
17
17
  .cometchat-audio-bubble__tail-view-download {
18
- mask: url("../../assets/download.svg");
19
- -webkit-mask: url("../../assets/download.svg");
18
+ mask: url("../../assets/download.svg") center center no-repeat;
19
+ -webkit-mask: url("../../assets/download.svg") center center no-repeat;
20
20
  display: flex;
21
21
  width: 24px;
22
22
  height: 24px;
@@ -54,8 +54,8 @@
54
54
 
55
55
  /* Close/stop icon inside the progress view (positioned in the center) */
56
56
  .cometchat-audio-bubble__tail-view-download-stop {
57
- mask: url("../../assets/close.svg");
58
- -webkit-mask: url("../../assets/close.svg");
57
+ mask: url("../../assets/close.svg") center center no-repeat;
58
+ -webkit-mask: url("../../assets/close.svg") center center no-repeat;
59
59
  background: var(--cometchat-static-white);
60
60
  display: flex;
61
61
  width: 15px;
@@ -34,8 +34,8 @@
34
34
  }
35
35
 
36
36
  .cometchat-conversation-summary__header-close-button {
37
- mask: url("../../assets/close.svg");
38
- -webkit-mask: url("../../assets/close.svg");
37
+ mask: url("../../assets/close.svg") center center no-repeat;
38
+ -webkit-mask: url("../../assets/close.svg") center center no-repeat;
39
39
  background-color: var(--cometchat-icon-color-primary, #141414);
40
40
  width: 20px;
41
41
  height: 20px;
@@ -56,4 +56,7 @@
56
56
  text-align: left;
57
57
  color: var(--cometchat-text-color-secondary);
58
58
  font: var(--cometchat-font-caption1-regular);
59
+ word-break: break-word;
60
+ width: 100%;
61
+ overflow: hidden;
59
62
  }
@@ -65,8 +65,8 @@
65
65
 
66
66
  /* Download icon for the tail view (right side of the file bubble) */
67
67
  .cometchat-file-bubble__tail-view-download {
68
- mask: url("../../assets/download.svg");
69
- -webkit-mask: url("../../assets/download.svg");
68
+ mask: url("../../assets/download.svg") center center no-repeat;
69
+ -webkit-mask: url("../../assets/download.svg") center center no-repeat;
70
70
  display: flex;
71
71
  width: 20px;
72
72
  height: 20px;
@@ -125,8 +125,8 @@
125
125
 
126
126
  /* Close icon in the progress view to stop/cancel download */
127
127
  .cometchat-file-bubble__tail-view-download-stop {
128
- mask: url("../../assets/close.svg");
129
- -webkit-mask: url("../../assets/close.svg");
128
+ mask: url("../../assets/close.svg") center center no-repeat;
129
+ -webkit-mask: url("../../assets/close.svg") center center no-repeat;
130
130
  background: var(--cometchat-primary-color);
131
131
  display: flex;
132
132
  width: 12px;
@@ -61,8 +61,8 @@
61
61
  background-color: var(--cometchat-primary-button-icon, #FFFFFF);
62
62
  height: 32px;
63
63
  width: 32px;
64
- -webkit-mask: url("../../assets/close.svg");
65
- mask: url("../../assets/close.svg");
64
+ -webkit-mask: url("../../assets/close.svg") center center no-repeat;
65
+ mask: url("../../assets/close.svg") center center no-repeat;
66
66
  -webkit-mask-size: 100%;
67
67
  mask-size: 100%;
68
68
  }
@@ -149,7 +149,7 @@
149
149
  }
150
150
 
151
151
  .cometchat-message-composer__header-error-state-icon {
152
- -webkit-mask: url("../../assets/error_info.svg");
152
+ -webkit-mask: url("../../assets/error_info.svg") center center no-repeat;
153
153
  width: 20px;
154
154
  height: 20px;
155
155
  -webkit-mask-size: contain;
@@ -319,4 +319,11 @@ height: 58px;
319
319
  }
320
320
  .cometchat-message-composer__secondary-button-view-attachment-button-5 .cometchat-popover__content{
321
321
  height: 285px;
322
+ }
323
+ .cometchat-message-composer .cometchat-edit-preview__subtitle{
324
+ height: fit-content;
325
+ max-height: 100px;
326
+ overflow: hidden;
327
+ text-overflow: ellipsis;
328
+ white-space: nowrap;
322
329
  }
@@ -98,7 +98,7 @@
98
98
  padding: 0px;
99
99
  flex-direction: column;
100
100
  align-items: flex-start;
101
- max-height: 300px;
101
+ height: 260px;
102
102
  overflow: hidden auto;
103
103
  }
104
104
 
@@ -160,7 +160,7 @@
160
160
 
161
161
  .cometchat-message-information__shimmer {
162
162
  width: 100%;
163
- height: 100%;
163
+ height: 260px;
164
164
  background: var(--cometchat-background-color-01, #FFF);
165
165
 
166
166
  }
@@ -554,96 +554,96 @@ width: fit-content;
554
554
  }
555
555
 
556
556
  .cometchat-message-bubble__video-call .cometchat-message-bubble__missed-call .cometchat-action-bubble__icon {
557
- -webkit-mask: url("../../assets/missed_video_call_no_fill.svg");
557
+ -webkit-mask: url("../../assets/missed_video_call_no_fill.svg") center center no-repeat;
558
558
  -webkit-mask-size: contain;
559
559
  background: var(--cometchat-error-color);
560
560
  }
561
561
 
562
562
  .cometchat-message-bubble__video-call .cometchat-message-bubble__ended-call .cometchat-action-bubble__icon {
563
- -webkit-mask: url("../../assets/call_end_no_fill.svg");
563
+ -webkit-mask: url("../../assets/call_end_no_fill.svg") center center no-repeat;
564
564
  -webkit-mask-size: contain;
565
565
  }
566
566
 
567
567
  .cometchat-message-bubble__video-call .cometchat-message-bubble__outgoing-call .cometchat-action-bubble__icon {
568
- -webkit-mask: url("../../assets/outgoing_video_no_fill.svg");
568
+ -webkit-mask: url("../../assets/outgoing_video_no_fill.svg") center center no-repeat;
569
569
  -webkit-mask-size: contain;
570
570
  }
571
571
 
572
572
  .cometchat-message-bubble__video-call .cometchat-message-bubble__incoming-call .cometchat-action-bubble__icon {
573
- -webkit-mask: url("../../assets/incoming_video_no_fill.svg");
573
+ -webkit-mask: url("../../assets/incoming_video_no_fill.svg") center center no-repeat;
574
574
  -webkit-mask-size: contain;
575
575
  }
576
576
 
577
577
  .cometchat-message-bubble__video-call .cometchat-message-bubble__busy-call .cometchat-action-bubble__icon {
578
- -webkit-mask: url("../../assets/video_call_button.svg");
578
+ -webkit-mask: url("../../assets/video_call_button.svg") center center no-repeat;
579
579
  -webkit-mask-size: contain;
580
580
  }
581
581
 
582
582
  .cometchat-message-bubble__video-call .cometchat-message-bubble__answered-call .cometchat-action-bubble__icon {
583
- -webkit-mask: url("../../assets/video_call_button.svg");
583
+ -webkit-mask: url("../../assets/video_call_button.svg") center center no-repeat;
584
584
  -webkit-mask-size: contain;
585
585
  }
586
586
 
587
587
  .cometchat-message-bubble__video-call .cometchat-message-bubble__unanswered-call .cometchat-action-bubble__icon {
588
- -webkit-mask: url("../../assets/video_call_button.svg");
588
+ -webkit-mask: url("../../assets/video_call_button.svg") center center no-repeat;
589
589
  -webkit-mask-size: contain;
590
590
  }
591
591
 
592
592
  .cometchat-message-bubble__video-call .cometchat-message-bubble__cancelled-call .cometchat-action-bubble__icon {
593
- -webkit-mask: url("../../assets/video_call_button.svg");
593
+ -webkit-mask: url("../../assets/video_call_button.svg") center center no-repeat;
594
594
  -webkit-mask-size: contain;
595
595
  }
596
596
 
597
597
  .cometchat-message-bubble__video-call .cometchat-message-bubble__rejected-call .cometchat-action-bubble__icon {
598
- -webkit-mask: url("../../assets/video_call_button.svg");
598
+ -webkit-mask: url("../../assets/video_call_button.svg") center center no-repeat;
599
599
  -webkit-mask-size: contain;
600
600
  }
601
601
 
602
602
 
603
603
  .cometchat-message-bubble__audio-call .cometchat-message-bubble__missed-call .cometchat-action-bubble__icon {
604
- -webkit-mask: url("../../assets/phone_missed_no_fill.svg");
604
+ -webkit-mask: url("../../assets/phone_missed_no_fill.svg") center center no-repeat;
605
605
  -webkit-mask-size: contain;
606
606
  background: var(--cometchat-error-color);
607
607
 
608
608
  }
609
609
 
610
610
  .cometchat-message-bubble__audio-call .cometchat-message-bubble__ended-call .cometchat-action-bubble__icon {
611
- -webkit-mask: url("../../assets/call_end_no_fill.svg");
611
+ -webkit-mask: url("../../assets/call_end_no_fill.svg") center center no-repeat;
612
612
  -webkit-mask-size: contain;
613
613
  }
614
614
 
615
615
  .cometchat-message-bubble__audio-call .cometchat-message-bubble__outgoing-call .cometchat-action-bubble__icon {
616
- -webkit-mask: url("../../assets/phone_outgoing_no_fill.svg");
616
+ -webkit-mask: url("../../assets/phone_outgoing_no_fill.svg") center center no-repeat;
617
617
  -webkit-mask-size: contain;
618
618
  }
619
619
 
620
620
  .cometchat-message-bubble__audio-call .cometchat-message-bubble__incoming-call .cometchat-action-bubble__icon {
621
- -webkit-mask: url("../../assets/phone_incoming_no_fill.svg");
621
+ -webkit-mask: url("../../assets/phone_incoming_no_fill.svg") center center no-repeat;
622
622
  -webkit-mask-size: contain;
623
623
  }
624
624
 
625
625
  .cometchat-message-bubble__audio-call .cometchat-message-bubble__busy-call .cometchat-action-bubble__icon {
626
- -webkit-mask: url("../../assets/audio_call_button.svg");
626
+ -webkit-mask: url("../../assets/audio_call_button.svg") center center no-repeat;
627
627
  -webkit-mask-size: contain;
628
628
  }
629
629
 
630
630
  .cometchat-message-bubble__audio-call .cometchat-message-bubble__answered-call .cometchat-action-bubble__icon {
631
- -webkit-mask: url("../../assets/audio_call_button.svg");
631
+ -webkit-mask: url("../../assets/audio_call_button.svg") center center no-repeat;
632
632
  -webkit-mask-size: contain;
633
633
  }
634
634
 
635
635
  .cometchat-message-bubble__audio-call .cometchat-message-bubble__unanswered-call .cometchat-action-bubble__icon {
636
- -webkit-mask: url("../../assets/audio_call_button.svg");
636
+ -webkit-mask: url("../../assets/audio_call_button.svg") center center no-repeat;
637
637
  -webkit-mask-size: contain;
638
638
  }
639
639
 
640
640
  .cometchat-message-bubble__audio-call .cometchat-message-bubble__cancelled-call .cometchat-action-bubble__icon {
641
- -webkit-mask: url("../../assets/audio_call_button.svg");
641
+ -webkit-mask: url("../../assets/audio_call_button.svg") center center no-repeat;
642
642
  -webkit-mask-size: contain;
643
643
  }
644
644
 
645
645
  .cometchat-message-bubble__audio-call .cometchat-message-bubble__rejected-call .cometchat-action-bubble__icon {
646
- -webkit-mask: url("../../assets/audio_call_button.svg");
646
+ -webkit-mask: url("../../assets/audio_call_button.svg") center center no-repeat;
647
647
  -webkit-mask-size: contain;
648
648
  }
649
649
 
@@ -681,6 +681,14 @@ width: fit-content;
681
681
  */
682
682
  .cometchat-message-bubble__sticker-message .cometchat-message-bubble__status-info-view {
683
683
  background: rgba(20, 20, 20, 0.60);
684
+ align-items: center;
685
+ }
686
+
687
+ .cometchat-message-bubble__sticker-message .cometchat-message-bubble__status-info-view > .cometchat{
688
+ box-sizing: border-box;
689
+ align-items: center;
690
+ justify-content: center;
691
+ display: flex;
684
692
  }
685
693
 
686
694
  /**
@@ -7,4 +7,23 @@
7
7
  border: 1px solid var(--cometchat-border-color-light, #F5F5F5);
8
8
  background: var(--cometchat-background-color-01, #FFF);
9
9
  box-shadow: 0px 12px 16px -4px rgba(16, 24, 40, 0.08), 0px 4px 6px -2px rgba(16, 24, 40, 0.03);
10
+ }
11
+
12
+ .cometchat-popover__content-tooltip-top,
13
+ .cometchat-popover__content-tooltip-bottom {
14
+ position: absolute;
15
+ width: 100%;
16
+ height: 6px;
17
+ background: var(--cometchat-static-black, #141414);
18
+ -webkit-mask: url("../../assets/tooltip.svg") center center no-repeat;
19
+ -webkit-mask-size: contain;
20
+ }
21
+
22
+ .cometchat-popover__content-tooltip-top {
23
+ bottom: -7px;
24
+ }
25
+
26
+ .cometchat-popover__content-tooltip-bottom {
27
+ transform: rotate(180deg);
28
+ top: -7px;
10
29
  }
@@ -19,21 +19,6 @@
19
19
  justify-content: center;
20
20
  }
21
21
 
22
- .cometchat-reaction-info__tooltip {
23
- width: 32px;
24
- height: 6px;
25
- background: var(--cometchat-static-black, #141414);
26
- -webkit-mask: url("../../assets/tooltip.svg") center center no-repeat;
27
- -webkit-mask-size: contain;
28
- }
29
-
30
- .cometchat-reaction-info__tooltip-side {
31
- width: 6px;
32
- height: 32px;
33
- background: var(--cometchat-static-black, #141414);
34
- -webkit-mask: url("../../assets/tooltip-side.svg") center center no-repeat;
35
- -webkit-mask-size: contain;
36
- }
37
22
 
38
23
  .cometchat-reaction-info__emoji-text {
39
24
  display: flex;