@cometchat/chat-uikit-angular 5.0.2 → 5.0.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cometchat/chat-uikit-angular",
-  "version": "5.0.2",
+  "version": "5.0.4",
   "license": "https://www.cometchat.com/legal-terms-of-service",
   "homepage": "https://www.cometchat.com",
   "repository": "https://github.com/cometchat/cometchat-uikit-angular",
@@ -26,8 +26,9 @@
   "peerDependencies": {
     "@angular/common": ">=17.0.0 <22.0.0",
     "@angular/core": ">=17.0.0 <22.0.0",
-    "@cometchat/chat-sdk-javascript": "^4.1.8",
+    "@cometchat/chat-sdk-javascript": "^4.1.12",
     "@cometchat/calls-sdk-javascript": "^5.0.0",
+    "@cometchat/cards-angular": "^1.0.0",
     "dompurify": "^3.0.0"
   },
   "peerDependenciesMeta": {

package/src/lib/assets/notifications_empty_state.svg

@@ -0,0 +1,8 @@
+<svg preserveAspectRatio="none" width="100%" height="100%" overflow="visible" style="display: block;" viewBox="0 0 100 97" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="empty inox">
+<path id="Vector" fill-rule="evenodd" clip-rule="evenodd" d="M80.668 29.5988C79.9126 28.5923 78.7274 28 77.4689 28H22.5311C21.2726 28 20.0874 28.5923 19.332 29.5988L5.84197 47.5713C5.29692 48.2974 5.01514 49.1874 5.04293 50.0949L6.07625 83.8355C6.14241 85.9959 7.91291 87.713 10.0744 87.713H89.9265C92.088 87.713 93.8585 85.9958 93.9247 83.8353L94.9571 50.0949C94.9849 49.1874 94.7031 48.2974 94.1581 47.5713L80.668 29.5988ZM63.361 48.693C61.1519 48.693 59.4382 50.5634 58.5213 52.5732C57.0466 55.8059 53.786 58.052 50.001 58.052C46.2153 58.052 42.9545 55.8059 41.4797 52.5732C40.5628 50.5634 38.8491 48.693 36.64 48.693H18.978C15.6811 48.693 13.7998 44.9285 15.779 42.2917L21.495 34.6767C22.2504 33.6703 23.4355 33.078 24.694 33.078H32.851H67.168H75.325C76.5835 33.078 77.7686 33.6703 78.524 34.6767L84.24 42.2917C86.2192 44.9285 84.3379 48.693 81.041 48.693H63.361Z" fill="var(--fill-0, #A4A7AE)"/>
+<path id="bar" d="M49 1C49 0.447716 49.4477 0 50 0V0C50.5523 0 51 0.447715 51 1V23C51 23.5523 50.5523 24 50 24V24C49.4477 24 49 23.5523 49 23V1Z" fill="var(--fill-0, #A4A7AE)"/>
+<path id="bar_2" d="M19.7071 8.12129C19.3166 7.73077 19.3166 7.0976 19.7071 6.70708V6.70708C20.0976 6.31655 20.7308 6.31655 21.1213 6.70708L36.6777 22.2634C37.0682 22.654 37.0682 23.2871 36.6777 23.6776V23.6776C36.2871 24.0682 35.654 24.0682 35.2635 23.6776L19.7071 8.12129Z" fill="var(--fill-0, #A4A7AE)"/>
+<path id="bar_3" d="M80.6777 8.12129C81.0682 7.73077 81.0682 7.0976 80.6777 6.70708V6.70708C80.2871 6.31655 79.654 6.31655 79.2634 6.70708L63.7071 22.2634C63.3166 22.654 63.3166 23.2871 63.7071 23.6776V23.6776C64.0976 24.0682 64.7308 24.0682 65.1213 23.6776L80.6777 8.12129Z" fill="var(--fill-0, #A4A7AE)"/>
+</g>
+</svg>

package/styles/rich-text-styles.css

@@ -12,7 +12,21 @@ code.cometchat-rich-text__code {
   padding: var(--cometchat-spacing) var(--cometchat-spacing-1);
   border-radius: var(--cometchat-radius-1);
 }
+/* Nested ordered list cycling: decimal → lower-alpha → lower-roman */
+.cometchat-text-bubble__content ol ol {
+  list-style-type: lower-alpha;
+}
+.cometchat-text-bubble__content ol ol ol {
+  list-style-type: lower-roman;
+}
 
+/* Nested unordered list cycling: disc → circle → square */
+.cometchat-text-bubble__content ul ul {
+  list-style-type: circle;
+}
+.cometchat-text-bubble__content ul ul ul {
+  list-style-type: square;
+}
 /* Reset rich text element spacing inside subtitle preview */
 .cometchat-message-composer__reply-preview p,
 .cometchat-message-composer__reply-preview blockquote,
@@ -51,6 +65,9 @@ code.cometchat-rich-text__code {
   scrollbar-width: none; /* Firefox */
   -ms-overflow-style: none; /* IE/Edge */
 }
+.cometchat-rich-text-editor__content p{
+  margin: 0;
+}
 .cometchat-rich-text-editor__content::-webkit-scrollbar {
   display: none; /* Chrome/Safari */
 }
@@ -61,7 +78,20 @@ code.cometchat-rich-text__code {
 .cometchat-rich-text__code-block{
     background: var(--cometchat-neutral-color-100);
     margin: 0;
+    padding: var(--cometchat-spacing-2) var(--cometchat-spacing-3);
+    display: block;
+    line-height: 1.5;
+}
+
+/* Reset inline code styles when <code> is inside a <pre> code block */
+.cometchat-rich-text__code-block .cometchat-rich-text__code,
+.cometchat-rich-text__code-block code {
+    background: transparent;
+    color: inherit;
     padding: 0;
+    border-radius: 0;
+    font-size: inherit;
+    vertical-align: baseline;
 }
 .cometchat-rich-text-editor__content:focus-visible{
     outline: none;
@@ -70,11 +100,28 @@ code.cometchat-rich-text__code {
     padding-left: var(--cometchat-padding-8);
     margin: 0;
 }
+/* Nested ordered list cycling in composer: decimal → lower-alpha → lower-roman */
+.cometchat-rich-text-editor__content ol ol {
+    list-style-type: lower-alpha;
+}
+.cometchat-rich-text-editor__content ol ol ol {
+    list-style-type: lower-roman;
+}
+/* Nested unordered list cycling in composer: disc → circle → square */
+.cometchat-rich-text-editor__content ul ul {
+    list-style-type: circle;
+}
+.cometchat-rich-text-editor__content ul ul ul {
+    list-style-type: square;
+}
 .cometchat-rich-text__blockquote{
-    margin: var(--cometchat-rich-text-blockquote-margin, 0 var(--cometchat-spacing-2));
-    padding: var(--cometchat-rich-text-blockquote-padding, 0 var(--cometchat-spacing-3));
+    display: block;
+    margin: var(--cometchat-rich-text-blockquote-margin, var(--cometchat-spacing-1) 0);
+    padding: var(--cometchat-rich-text-blockquote-padding, var(--cometchat-spacing-2) var(--cometchat-spacing-3));
     border-left: var(--cometchat-rich-text-blockquote-border-left, 4px solid var(--cometchat-neutral-color-400));
     color: var(--cometchat-rich-text-blockquote-color, var(--cometchat-text-color-secondary));
+    background: var(--cometchat-background-color-02, rgba(0,0,0,0.04));
+    border-radius: 0 var(--cometchat-radius-1) var(--cometchat-radius-1) 0;
 }
 
 /* ============================================
@@ -92,20 +139,34 @@ code.cometchat-rich-text__code {
   border-radius: var(--cometchat-radius-1);
 }
 
+/* Inline code in incoming messages — exclude code inside pre (code blocks) */
+.cometchat-text-bubble-incoming .cometchat-text-bubble__content code:not(pre code),
+.cometchat-text-bubble.cometchat-text-bubble-incoming .cometchat-text-bubble__content code:not(pre code) {
+  background: var(--cometchat-extended-primary-color-100);
+  color: var(--cometchat-primary-color);
+}
+
+/* Inline code in outgoing messages — exclude code inside pre (code blocks) */
+.cometchat-text-bubble-outgoing .cometchat-text-bubble__content code:not(pre code),
+.cometchat-text-bubble.cometchat-text-bubble-outgoing .cometchat-text-bubble__content code:not(pre code) {
+  background: rgba(255, 255, 255, 0.2);
+  color: var(--cometchat-static-white);
+}
 
 
+.cometchat-message-composer__edit-preview-subtitle * {
+margin: 0;
+}
 /**
  * Code blocks
  */
 .cometchat-text-bubble__content pre {
-  padding: var(--cometchat-spacing-3);
   border-radius: var(--cometchat-radius-2);
   overflow-x: auto;
   max-width: 100%;
-  margin: var(--cometchat-spacing-2) 0;
+  margin: var(--cometchat-spacing-1) 0;
+  padding: var(--cometchat-spacing-2) var(--cometchat-spacing-3);
   white-space: pre;
-  margin: 0;
-  padding: 0;
 }
 
 /* Code blocks in incoming messages */
@@ -126,33 +187,36 @@ code.cometchat-rich-text__code {
   background: transparent;
   padding: 0;
   border-radius: 0;
-  display: inline-block;
-  height: fit-content;
-  width: fit-content;
+  display: block;
+  color: inherit;
 }
 
 /**
  * Blockquote
  */
 .cometchat-text-bubble__content blockquote {
-  margin: var(--cometchat-spacing-2) 0;
-  padding-left: var(--cometchat-spacing-3);
-  border-left: 3px solid;
-  font-style: italic;
+  display: block;
+  margin: var(--cometchat-spacing-1) 0;
+  padding: var(--cometchat-spacing-2) var(--cometchat-spacing-3);
+  border-left: 4px solid;
+  border-radius: 0 var(--cometchat-radius-1) var(--cometchat-radius-1) 0;
+  font-style: normal;
 }
 
 /* Blockquote in incoming messages */
 .cometchat-text-bubble-incoming .cometchat-text-bubble__content blockquote,
 .cometchat-text-bubble.cometchat-text-bubble-incoming .cometchat-text-bubble__content blockquote {
-  border-left-color: var(--cometchat-neutral-color-600);
-  color: var(--cometchat-neutral-color-700);
+  border-left-color: var(--cometchat-neutral-color-400);
+  color: var(--cometchat-text-color-secondary);
+  background: var(--cometchat-background-color-02);
 }
 
 /* Blockquote in outgoing messages */
 .cometchat-text-bubble-outgoing .cometchat-text-bubble__content blockquote,
 .cometchat-text-bubble.cometchat-text-bubble-outgoing .cometchat-text-bubble__content blockquote {
-  border-left-color: rgba(255, 255, 255, 0.5);
+  border-left-color: rgba(255, 255, 255, 0.6);
   color: rgba(255, 255, 255, 0.9);
+  background: rgba(255, 255, 255, 0.15);
 }
 
 /**