@cometchat/chat-uikit-react 6.2.0 → 6.2.1

package/dist/styles/CometChatAIAssistantChat.css

@@ -5,9 +5,16 @@
     width: 100%;
     overflow: hidden;
     background: var(--cometchat-background-color-02);
+    align-items: center;
 
 }
-
+.cometchat-ai-assistant-chat  .cometchat-message-bubble-incoming{
+    overflow: hidden;
+    max-width: 100%;
+    box-sizing: border-box;
+    align-self: flex-start;
+    padding-top: 3px;
+}
 .cometchat-ai-assistant-chat__wrapper {
     height: 100%;
     width: 100%;
@@ -56,7 +63,7 @@
     display: flex;
     align-items: center;
     justify-content: space-between;
-    gap: var(--cometchat-spacing-3);
+    gap: var(--cometchat-spacing-2);
 
 }
 
@@ -68,7 +75,7 @@
     padding: 0;
     margin: 0;
     box-sizing: border-box;
-        padding: 6px;
+    padding: 6px;
 
 }
 
@@ -337,7 +344,6 @@ padding-bottom: var(--cometchat-padding-2);
     z-index: 1000;
     display: flex;
     flex-direction: column;
-    box-shadow: -2px 0 8px rgba(0, 0, 0, 0.1);
 }
 
 .cometchat-ai-assistant-chat__sidebar--open {
@@ -358,6 +364,9 @@ padding-bottom: var(--cometchat-padding-2);
     overflow: hidden;
     background: var(--cometchat-background-color-02);
 }
+.cometchat-ai-assistant-chat__message-composer-view{
+    width: 100%;
+}
 .cometchat-ai-assistant-chat__message-composer-view--disabled {
 cursor: not-allowed ;
 caret-color: transparent ;

package/dist/styles/CometChatAIAssistantMessageBubble.css

@@ -54,27 +54,12 @@
 
 .cometchat-ai-assistant-message-bubble__code-block {
   max-height: 300px;
-  overflow: scroll;
+  overflow: auto;
   border: 1px solid var(--cometchat-border-color-default);
+  width: 100%;
 }
 
-@media (min-width: 620px) and (max-width: 780px) {
-  .cometchat-ai-assistant-message-bubble__code-block {
-    max-width: 600px;
-  }
-}
-
-@media (min-width: 480px) and (max-width: 619px) {
-  .cometchat-ai-assistant-message-bubble__code-block {
-    max-width: 400px;
-  }
-}
 
-@media (min-width: 320px) and (max-width: 479px) {
-  .cometchat-ai-assistant-message-bubble__code-block {
-    max-width: 320px;
-  }
-}
 
 .cometchat-ai-assistant-message-bubble *:not(pre *) {
   color: var(--cometchat-text-color-primary);
@@ -83,4 +68,51 @@
 }
 .cometchat-ai-assistant-message-bubble .cometchat-ai-assistant-message-bubble__code-block,.cometchat-ai-assistant-message-bubble .cometchat-ai-assistant-message-bubble__code-block *{
   font-size: 14px;
+}
+
+.cometchat-ai-assistant-message-bubble__code-block::-webkit-scrollbar {
+  width: 0px;
+  height: 8px;
+  background: transparent;
+}
+
+.cometchat-ai-assistant-message-bubble__code-block::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.cometchat-ai-assistant-message-bubble__code-block::-webkit-scrollbar-thumb {
+  background: var(--cometchat-icon-color-secondary);
+  border-radius: var(--cometchat-radius-2);
+}
+
+.cometchat-ai-assistant-message-bubble table {
+  width: 100%;
+  border-collapse: collapse;
+  table-layout: auto;
+  display: block;
+  overflow-x: auto;
+}
+
+.cometchat-ai-assistant-message-bubble th,
+.cometchat-ai-assistant-message-bubble td {
+  padding: var(--cometchat-padding-2);
+  border: 1px solid var(--cometchat-border-color-light);
+  text-align: left;
+  word-break: break-word; /* prevents text overflow in cells */
+  min-width: 100px;
+}
+
+.cometchat-ai-assistant-message-bubble table::-webkit-scrollbar {
+  width: 0px;
+  height: 8px;
+  background: transparent;
+}
+
+.cometchat-ai-assistant-message-bubble table::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.cometchat-ai-assistant-message-bubble table::-webkit-scrollbar-thumb {
+  background: var(--cometchat-icon-color-secondary);
+  border-radius: var(--cometchat-radius-2);
 }

package/dist/styles/CometChatConversations.css

@@ -56,6 +56,22 @@
   mask-size: contain;
 }
 
+
+.cometchat-conversations__subtitle-receipts-wait{
+  -webkit-mask: url("../../assets/status_sending.svg") center center no-repeat;
+  mask: url("../../assets/status_sending.svg") center center no-repeat;
+  -webkit-mask-size: contain;
+  mask-size: contain;
+}
+
+.cometchat-conversations__subtitle-receipts-error{
+  -webkit-mask: url("../../assets/error_icon.svg") center center no-repeat;
+  mask: url("../../assets/error_icon.svg") center center no-repeat;
+  -webkit-mask-size: contain;
+  mask-size: contain;
+  background-color: var(--cometchat-error-color);
+}
+
 .cometchat-conversations__subtitle-receipts-delivered{
   -webkit-mask: url("../../assets/conversations_delivered.svg") center center no-repeat;
   mask: url("../../assets/conversations_delivered.svg") center center no-repeat;

package/dist/styles/CometChatMessageList.css

@@ -144,31 +144,32 @@
     padding: var(--cometchat-padding-2, 8px) var(--cometchat-padding-2, 8px) var(--cometchat-padding-3, 12px) var(--cometchat-padding-2, 8px);
     ;
 }
-.cometchat-fullscreen-viewer .cometchat-fullscreen-viewer__body-image{
-   max-width: 100%;
-   max-height: 84vh;
-   object-fit: contain;
+.cometchat-fullscreen-viewer .cometchat-fullscreen-viewer__body-image {
+    max-width: 100%;
+    max-height: 84vh;
+    object-fit: contain;
 }
 
 .cometchat-message-bubble__audio-call .cometchat-call-bubble .cometchat-call-bubble__body {
     padding: 0;
 }
-.cometchat-message-bubble__thread-view-replies .cometchat-button{
+.cometchat-message-bubble__thread-view-replies .cometchat-button {
     align-items: flex-end;
-    
+
 }
-.cometchat-reactions-info-wrapper > .cometchat{
-    width:fit-content;
+.cometchat-reactions-info-wrapper>.cometchat {
+    width: fit-content;
 }
-.cometchat-message-bubble__thread-view-replies .cometchat-button .cometchat-button__text{
+.cometchat-message-bubble__thread-view-replies .cometchat-button .cometchat-button__text {
     margin-bottom: -2px;
 }
-.cometchat-message-bubble__body-footer-view .cometchat-reactions  .cometchat{
+.cometchat-message-bubble__body-footer-view .cometchat-reactions .cometchat {
     width: fit-content;
 }
-.cometchat-reactions  .cometchat-popover,.cometchat-reactions  .cometchat-popover__button{
-width: fit-content;
+.cometchat-reactions .cometchat-popover, .cometchat-reactions .cometchat-popover__button{
+    width: fit-content;
 }
+
 /* Date header inside message list */
 .cometchat-message-list__date-header {
     position: absolute;
@@ -416,6 +417,20 @@ width: fit-content;
 
 }
 
+.cometchat-message-list__bubble-moderation-disapproved .cometchat-message-bubble__body {
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+}
+
+
+.cometchat-message-list__bubble-moderation-disapproved .cometchat-message-bubble__body-content-view .cometchat-video-bubble{
+    min-width: 240px;
+}
+
+.cometchat-message-list__bubble-moderation-disapproved .cometchat-message-bubble__body-content-view .cometchat-image-bubble{
+    min-width: 240px;
+}
+
 /* Status view for "delivered" receipt inside message bubble */
 .cometchat-message-bubble__status-info-view-receipts-delivered .cometchat-message-list__receipt {
     -webkit-mask: url("../../assets/status_delivered.svg") center center no-repeat;
@@ -429,7 +444,7 @@ width: fit-content;
     -webkit-mask: url("../../assets/status_read.svg") center center no-repeat;
     -webkit-mask-size: contain;
     background: var(--cometchat-message-seen-color,#56E8A7);
-    
+
 
 }
 
@@ -665,7 +680,7 @@ width: fit-content;
 
 }
 
- /**
+/**
  * Setting transparent background and gap for sticker message bubble
  */
 .cometchat-message-bubble__body-wrapper .cometchat-message-bubble__sticker-message {
@@ -709,7 +724,7 @@ width: fit-content;
 .cometchat-message-information__popup-wrapper {
     display: flex;
     position: fixed;
-    z-index: 2;
+    z-index: 3;
     left: 0;
     top: 0;
     width: 100%;

package/dist/styles/CometChatModerationView.css

@@ -0,0 +1,25 @@
+/* Bottom view for "blocked" messages inside message bubble */
+.cometchat-moderation-status__icon{
+    min-width: 16px;
+    min-height: 16px;
+    -webkit-mask: url("../../assets/message_blocked.svg") center center no-repeat;
+    -webkit-mask-size: contain;
+    background-color: var(--cometchat-error-color);
+    display: inline-block;
+}
+
+.cometchat-moderation-status {
+    display: flex;
+    flex-direction: row;
+    align-items: flex-start;
+    background-color: var(--cometchat-error-color-100);
+    padding: var(--cometchat-padding-1) var(--cometchat-padding-2);
+    gap: var(--cometchat-spacing-1, 4px);
+    border-radius: 0 0 var(--cometchat-radius-3, 12px) var(--cometchat-radius-3, 12px);
+}
+
+.cometchat-moderation-status .cometchat-moderation-status__message {
+    color: var(--cometchat-error-color, #F44649);
+    text-align: left;
+    font: var(--cometchat-font-body-regular);
+}

package/dist/styles/CometChatSearch.css

@@ -231,6 +231,12 @@
   -webkit-mask-size: contain;
   mask-size: contain;
 }
+.cometchat-search__conversations-subtitle-receipts-wait{
+  -webkit-mask: url("../../assets/status_sending.svg") center center no-repeat;
+  mask: url("../../assets/status_sending.svg") center center no-repeat;
+  -webkit-mask-size: contain;
+  mask-size: contain;
+}
 
 .cometchat-search__conversations-subtitle-receipts-delivered {
   -webkit-mask: url("../../assets/conversations_delivered.svg") center center no-repeat;
@@ -239,6 +245,13 @@
   mask-size: contain;
 }
 
+.cometchat-search__conversations-subtitle-receipts-error{
+  -webkit-mask: url("../../assets/error_icon.svg") center center no-repeat;
+  mask: url("../../assets/error_icon.svg") center center no-repeat;
+  -webkit-mask-size: contain;
+  mask-size: contain;
+  background-color: var(--cometchat-error-color);
+}
 
 .cometchat-search__conversations-subtitle-receipts-read {
   -webkit-mask: url("../../assets/conversations_read.svg") center center no-repeat;

package/dist/styles/CometChatStreamMessageBubble.css

@@ -64,28 +64,12 @@
 
 }
 
-.cometchat-stream-message-bubble pre>div {
+.cometchat-stream-message-bubble__code-block {
   max-height: 300px;
-  overflow: scroll;
+  overflow: auto;
   border: 1px solid var(--cometchat-border-color-default);
-}
+  width: 100%;
 
-@media (min-width: 620px) and (max-width: 780px) {
-  .cometchat-stream-message-bubble pre>div {
-    /* max-width: 600px; */
-  }
-}
-
-@media (min-width: 480px) and (max-width: 619px) {
-  .cometchat-stream-message-bubble pre>div {
-    /* max-width: 400px; */
-  }
-}
-
-@media (min-width: 320px) and (max-width: 479px) {
-  .cometchat-stream-message-bubble pre>div {
-    /* max-width: 300px; */
-  }
 }
 
 .cometchat-stream-message-bubble *:not(pre *) {
@@ -142,7 +126,52 @@
   border-radius: 0px;
   color: var(--cometchat-text-color-secondary);
 }
+.cometchat-stream-message-bubble__code-block::-webkit-scrollbar {
+  width: 0px;
+  height: 8px;
+  background: transparent;
+}
+
+.cometchat-stream-message-bubble__code-block::-webkit-scrollbar-track {
+  background: transparent;
+}
 
+.cometchat-stream-message-bubble__code-block::-webkit-scrollbar-thumb {
+  background: var(--cometchat-icon-color-secondary);
+  border-radius: 4px;
+}
+
+.cometchat-stream-message-bubble table {
+  width: 100%;
+  border-collapse: collapse;
+  table-layout: auto;
+  display: block;
+  overflow-x: auto;
+}
+
+.cometchat-stream-message-bubble th,
+.cometchat-stream-message-bubble td {
+  padding: var(--cometchat-padding-2);
+  border: 1px solid var(--cometchat-border-color-light);
+  text-align: left;
+  word-break: break-word; /* prevents text overflow in cells */
+  min-width: 100px;
+}
+
+.cometchat-stream-message-bubble table::-webkit-scrollbar {
+  width: 0px;
+  height: 8px;
+  background: transparent;
+}
+
+.cometchat-stream-message-bubble table::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.cometchat-stream-message-bubble table::-webkit-scrollbar-thumb {
+  background: var(--cometchat-icon-color-secondary);
+  border-radius: var(--cometchat-radius-2);
+}
 @keyframes shimmer {
   0% {
     left: -60%;

package/dist/styles/components/CometChatAIAssistantChat.css

@@ -5,9 +5,16 @@
     width: 100%;
     overflow: hidden;
     background: var(--cometchat-background-color-02);
+    align-items: center;
 
 }
-
+.cometchat-ai-assistant-chat  .cometchat-message-bubble-incoming{
+    overflow: hidden;
+    max-width: 100%;
+    box-sizing: border-box;
+    align-self: flex-start;
+    padding-top: 3px;
+}
 .cometchat-ai-assistant-chat__wrapper {
     height: 100%;
     width: 100%;
@@ -56,7 +63,7 @@
     display: flex;
     align-items: center;
     justify-content: space-between;
-    gap: var(--cometchat-spacing-3);
+    gap: var(--cometchat-spacing-2);
 
 }
 
@@ -68,7 +75,7 @@
     padding: 0;
     margin: 0;
     box-sizing: border-box;
-        padding: 6px;
+    padding: 6px;
 
 }
 
@@ -337,7 +344,6 @@ padding-bottom: var(--cometchat-padding-2);
     z-index: 1000;
     display: flex;
     flex-direction: column;
-    box-shadow: -2px 0 8px rgba(0, 0, 0, 0.1);
 }
 
 .cometchat-ai-assistant-chat__sidebar--open {
@@ -358,6 +364,9 @@ padding-bottom: var(--cometchat-padding-2);
     overflow: hidden;
     background: var(--cometchat-background-color-02);
 }
+.cometchat-ai-assistant-chat__message-composer-view{
+    width: 100%;
+}
 .cometchat-ai-assistant-chat__message-composer-view--disabled {
 cursor: not-allowed ;
 caret-color: transparent ;

package/dist/styles/components/CometChatAIAssistantMessageBubble.css

@@ -54,27 +54,12 @@
 
 .cometchat-ai-assistant-message-bubble__code-block {
   max-height: 300px;
-  overflow: scroll;
+  overflow: auto;
   border: 1px solid var(--cometchat-border-color-default);
+  width: 100%;
 }
 
-@media (min-width: 620px) and (max-width: 780px) {
-  .cometchat-ai-assistant-message-bubble__code-block {
-    max-width: 600px;
-  }
-}
-
-@media (min-width: 480px) and (max-width: 619px) {
-  .cometchat-ai-assistant-message-bubble__code-block {
-    max-width: 400px;
-  }
-}
 
-@media (min-width: 320px) and (max-width: 479px) {
-  .cometchat-ai-assistant-message-bubble__code-block {
-    max-width: 320px;
-  }
-}
 
 .cometchat-ai-assistant-message-bubble *:not(pre *) {
   color: var(--cometchat-text-color-primary);
@@ -83,4 +68,51 @@
 }
 .cometchat-ai-assistant-message-bubble .cometchat-ai-assistant-message-bubble__code-block,.cometchat-ai-assistant-message-bubble .cometchat-ai-assistant-message-bubble__code-block *{
   font-size: 14px;
+}
+
+.cometchat-ai-assistant-message-bubble__code-block::-webkit-scrollbar {
+  width: 0px;
+  height: 8px;
+  background: transparent;
+}
+
+.cometchat-ai-assistant-message-bubble__code-block::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.cometchat-ai-assistant-message-bubble__code-block::-webkit-scrollbar-thumb {
+  background: var(--cometchat-icon-color-secondary);
+  border-radius: var(--cometchat-radius-2);
+}
+
+.cometchat-ai-assistant-message-bubble table {
+  width: 100%;
+  border-collapse: collapse;
+  table-layout: auto;
+  display: block;
+  overflow-x: auto;
+}
+
+.cometchat-ai-assistant-message-bubble th,
+.cometchat-ai-assistant-message-bubble td {
+  padding: var(--cometchat-padding-2);
+  border: 1px solid var(--cometchat-border-color-light);
+  text-align: left;
+  word-break: break-word; /* prevents text overflow in cells */
+  min-width: 100px;
+}
+
+.cometchat-ai-assistant-message-bubble table::-webkit-scrollbar {
+  width: 0px;
+  height: 8px;
+  background: transparent;
+}
+
+.cometchat-ai-assistant-message-bubble table::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.cometchat-ai-assistant-message-bubble table::-webkit-scrollbar-thumb {
+  background: var(--cometchat-icon-color-secondary);
+  border-radius: var(--cometchat-radius-2);
 }

package/dist/styles/components/CometChatConversations.css

@@ -56,6 +56,22 @@
   mask-size: contain;
 }
 
+
+.cometchat-conversations__subtitle-receipts-wait{
+  -webkit-mask: url("../../assets/status_sending.svg") center center no-repeat;
+  mask: url("../../assets/status_sending.svg") center center no-repeat;
+  -webkit-mask-size: contain;
+  mask-size: contain;
+}
+
+.cometchat-conversations__subtitle-receipts-error{
+  -webkit-mask: url("../../assets/error_icon.svg") center center no-repeat;
+  mask: url("../../assets/error_icon.svg") center center no-repeat;
+  -webkit-mask-size: contain;
+  mask-size: contain;
+  background-color: var(--cometchat-error-color);
+}
+
 .cometchat-conversations__subtitle-receipts-delivered{
   -webkit-mask: url("../../assets/conversations_delivered.svg") center center no-repeat;
   mask: url("../../assets/conversations_delivered.svg") center center no-repeat;

package/dist/styles/components/CometChatMessageList.css

@@ -144,31 +144,32 @@
     padding: var(--cometchat-padding-2, 8px) var(--cometchat-padding-2, 8px) var(--cometchat-padding-3, 12px) var(--cometchat-padding-2, 8px);
     ;
 }
-.cometchat-fullscreen-viewer .cometchat-fullscreen-viewer__body-image{
-   max-width: 100%;
-   max-height: 84vh;
-   object-fit: contain;
+.cometchat-fullscreen-viewer .cometchat-fullscreen-viewer__body-image {
+    max-width: 100%;
+    max-height: 84vh;
+    object-fit: contain;
 }
 
 .cometchat-message-bubble__audio-call .cometchat-call-bubble .cometchat-call-bubble__body {
     padding: 0;
 }
-.cometchat-message-bubble__thread-view-replies .cometchat-button{
+.cometchat-message-bubble__thread-view-replies .cometchat-button {
     align-items: flex-end;
-    
+
 }
-.cometchat-reactions-info-wrapper > .cometchat{
-    width:fit-content;
+.cometchat-reactions-info-wrapper>.cometchat {
+    width: fit-content;
 }
-.cometchat-message-bubble__thread-view-replies .cometchat-button .cometchat-button__text{
+.cometchat-message-bubble__thread-view-replies .cometchat-button .cometchat-button__text {
     margin-bottom: -2px;
 }
-.cometchat-message-bubble__body-footer-view .cometchat-reactions  .cometchat{
+.cometchat-message-bubble__body-footer-view .cometchat-reactions .cometchat {
     width: fit-content;
 }
-.cometchat-reactions  .cometchat-popover,.cometchat-reactions  .cometchat-popover__button{
-width: fit-content;
+.cometchat-reactions .cometchat-popover, .cometchat-reactions .cometchat-popover__button{
+    width: fit-content;
 }
+
 /* Date header inside message list */
 .cometchat-message-list__date-header {
     position: absolute;
@@ -416,6 +417,20 @@ width: fit-content;
 
 }
 
+.cometchat-message-list__bubble-moderation-disapproved .cometchat-message-bubble__body {
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+}
+
+
+.cometchat-message-list__bubble-moderation-disapproved .cometchat-message-bubble__body-content-view .cometchat-video-bubble{
+    min-width: 240px;
+}
+
+.cometchat-message-list__bubble-moderation-disapproved .cometchat-message-bubble__body-content-view .cometchat-image-bubble{
+    min-width: 240px;
+}
+
 /* Status view for "delivered" receipt inside message bubble */
 .cometchat-message-bubble__status-info-view-receipts-delivered .cometchat-message-list__receipt {
     -webkit-mask: url("../../assets/status_delivered.svg") center center no-repeat;
@@ -429,7 +444,7 @@ width: fit-content;
     -webkit-mask: url("../../assets/status_read.svg") center center no-repeat;
     -webkit-mask-size: contain;
     background: var(--cometchat-message-seen-color,#56E8A7);
-    
+
 
 }
 
@@ -665,7 +680,7 @@ width: fit-content;
 
 }
 
- /**
+/**
  * Setting transparent background and gap for sticker message bubble
  */
 .cometchat-message-bubble__body-wrapper .cometchat-message-bubble__sticker-message {
@@ -709,7 +724,7 @@ width: fit-content;
 .cometchat-message-information__popup-wrapper {
     display: flex;
     position: fixed;
-    z-index: 2;
+    z-index: 3;
     left: 0;
     top: 0;
     width: 100%;

package/dist/styles/components/CometChatModerationView.css

@@ -0,0 +1,25 @@
+/* Bottom view for "blocked" messages inside message bubble */
+.cometchat-moderation-status__icon{
+    min-width: 16px;
+    min-height: 16px;
+    -webkit-mask: url("../../assets/message_blocked.svg") center center no-repeat;
+    -webkit-mask-size: contain;
+    background-color: var(--cometchat-error-color);
+    display: inline-block;
+}
+
+.cometchat-moderation-status {
+    display: flex;
+    flex-direction: row;
+    align-items: flex-start;
+    background-color: var(--cometchat-error-color-100);
+    padding: var(--cometchat-padding-1) var(--cometchat-padding-2);
+    gap: var(--cometchat-spacing-1, 4px);
+    border-radius: 0 0 var(--cometchat-radius-3, 12px) var(--cometchat-radius-3, 12px);
+}
+
+.cometchat-moderation-status .cometchat-moderation-status__message {
+    color: var(--cometchat-error-color, #F44649);
+    text-align: left;
+    font: var(--cometchat-font-body-regular);
+}

package/dist/styles/components/CometChatSearch.css

@@ -231,6 +231,12 @@
   -webkit-mask-size: contain;
   mask-size: contain;
 }
+.cometchat-search__conversations-subtitle-receipts-wait{
+  -webkit-mask: url("../../assets/status_sending.svg") center center no-repeat;
+  mask: url("../../assets/status_sending.svg") center center no-repeat;
+  -webkit-mask-size: contain;
+  mask-size: contain;
+}
 
 .cometchat-search__conversations-subtitle-receipts-delivered {
   -webkit-mask: url("../../assets/conversations_delivered.svg") center center no-repeat;
@@ -239,6 +245,13 @@
   mask-size: contain;
 }
 
+.cometchat-search__conversations-subtitle-receipts-error{
+  -webkit-mask: url("../../assets/error_icon.svg") center center no-repeat;
+  mask: url("../../assets/error_icon.svg") center center no-repeat;
+  -webkit-mask-size: contain;
+  mask-size: contain;
+  background-color: var(--cometchat-error-color);
+}
 
 .cometchat-search__conversations-subtitle-receipts-read {
   -webkit-mask: url("../../assets/conversations_read.svg") center center no-repeat;