@cometchat/chat-uikit-angular 5.0.0-beta.2 → 5.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cometchat/chat-uikit-angular",
-  "version": "5.0.0-beta.2",
+  "version": "5.0.0",
   "license": "https://www.cometchat.com/legal-terms-of-service",
   "homepage": "https://www.cometchat.com",
   "repository": "https://github.com/cometchat/cometchat-uikit-angular",
@@ -26,7 +26,14 @@
   "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.8",
+    "@cometchat/calls-sdk-javascript": "^5.0.0",
+    "dompurify": "^3.0.0"
+  },
+  "peerDependenciesMeta": {
+    "@cometchat/calls-sdk-javascript": {
+      "optional": true
+    }
   },
   "dependencies": {
     "tslib": "^2.3.0"
@@ -44,5 +51,6 @@
       "types": "./types/cometchat-chat-uikit-angular.d.ts",
       "default": "./fesm2022/cometchat-chat-uikit-angular.mjs"
     }
-  }
+  },
+  "type": "module"
 }

package/src/lib/assets/mark_as_unread.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 -960 960 960" width="24" fill="black">
+  <path d="M80-80v-720q0-33 23.5-56.5T160-880h404q-4 20-4 40t4 40H160v480l46-40h514v-253q21-3 40-11t40-21v285q0 33-23.5 56.5T720-280H240L80-80Zm80-280v-400h404 0H160Zm600-280q-50 0-85-35t-35-85q0-50 35-85t85-35q50 0 85 35t35 85q0 50-35 85t-85 35Z"/>
+</svg>

package/styles/css-variables.css

@@ -7,72 +7,92 @@
 
 @font-face {
   font-family: 'Roboto';
-  src: url('./fonts/Roboto/Roboto-Black.ttf') format('truetype');
+  src: url('./fonts/Roboto/Roboto-Black.woff2') format('woff2'),
+       url('./fonts/Roboto/Roboto-Black.ttf') format('truetype');
   font-weight: 900;
   font-style: normal;
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Roboto';
-  src: url('./fonts/Roboto/Roboto-BlackItalic.ttf') format('truetype');
+  src: url('./fonts/Roboto/Roboto-BlackItalic.woff2') format('woff2'),
+       url('./fonts/Roboto/Roboto-BlackItalic.ttf') format('truetype');
   font-weight: 900;
   font-style: italic;
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Roboto';
-  src: url('./fonts/Roboto/Roboto-Bold.ttf') format('truetype');
+  src: url('./fonts/Roboto/Roboto-Bold.woff2') format('woff2'),
+       url('./fonts/Roboto/Roboto-Bold.ttf') format('truetype');
   font-weight: 700;
   font-style: normal;
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Roboto';
-  src: url('./fonts/Roboto/Roboto-BoldItalic.ttf') format('truetype');
+  src: url('./fonts/Roboto/Roboto-BoldItalic.woff2') format('woff2'),
+       url('./fonts/Roboto/Roboto-BoldItalic.ttf') format('truetype');
   font-weight: 700;
   font-style: italic;
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Roboto';
-  src: url('./fonts/Roboto/Roboto-Regular.ttf') format('truetype');
+  src: url('./fonts/Roboto/Roboto-Regular.woff2') format('woff2'),
+       url('./fonts/Roboto/Roboto-Regular.ttf') format('truetype');
   font-weight: 400;
   font-style: normal;
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Roboto';
-  src: url('./fonts/Roboto/Roboto-Italic.ttf') format('truetype');
+  src: url('./fonts/Roboto/Roboto-Italic.woff2') format('woff2'),
+       url('./fonts/Roboto/Roboto-Italic.ttf') format('truetype');
   font-weight: 400;
   font-style: italic;
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Roboto';
-  src: url('./fonts/Roboto/Roboto-Light.ttf') format('truetype');
+  src: url('./fonts/Roboto/Roboto-Light.woff2') format('woff2'),
+       url('./fonts/Roboto/Roboto-Light.ttf') format('truetype');
   font-weight: 300;
   font-style: normal;
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Roboto';
-  src: url('./fonts/Roboto/Roboto-LightItalic.ttf') format('truetype');
+  src: url('./fonts/Roboto/Roboto-LightItalic.woff2') format('woff2'),
+       url('./fonts/Roboto/Roboto-LightItalic.ttf') format('truetype');
   font-weight: 300;
   font-style: italic;
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Roboto';
-  src: url('./fonts/Roboto/Roboto-Medium.ttf') format('truetype');
+  src: url('./fonts/Roboto/Roboto-Medium.woff2') format('woff2'),
+       url('./fonts/Roboto/Roboto-Medium.ttf') format('truetype');
   font-weight: 500;
   font-style: normal;
+  font-display: swap;
 }
 
 @font-face {
   font-family: 'Roboto';
-  src: url('./fonts/Roboto/Roboto-MediumItalic.ttf') format('truetype');
+  src: url('./fonts/Roboto/Roboto-MediumItalic.woff2') format('woff2'),
+       url('./fonts/Roboto/Roboto-MediumItalic.ttf') format('truetype');
   font-weight: 500;
   font-style: italic;
+  font-display: swap;
 }
 /* Links in subtitle */
 .cometchat-link{
@@ -230,7 +250,7 @@
   --cometchat-neutral-color-200: #F5F5F5;
   --cometchat-neutral-color-300: #E8E8E8;
   --cometchat-neutral-color-400: #DCDCDC;
-  --cometchat-neutral-color-500: #A1A1A1;
+  --cometchat-neutral-color-500: #707070;
   --cometchat-neutral-color-600: #727272;
   --cometchat-neutral-color-700: #5B5B5B;
   --cometchat-neutral-color-800: #434343;
@@ -420,7 +440,7 @@ Define border colors for UI elements,
   --cometchat-neutral-color-200: #272727;
   --cometchat-neutral-color-300: #383838;
   --cometchat-neutral-color-400: #4C4C4C;
-  --cometchat-neutral-color-500: #858585;
+  --cometchat-neutral-color-500: #9E9E9E;
   --cometchat-neutral-color-600: #989898;
   --cometchat-neutral-color-700: #A8A8A8;
   --cometchat-neutral-color-800: #C8C8C8;

package/styles/rich-text-styles.css

@@ -12,6 +12,30 @@ code.cometchat-rich-text__code {
   padding: var(--cometchat-spacing) var(--cometchat-spacing-1);
   border-radius: var(--cometchat-radius-1);
 }
+
+/* Reset rich text element spacing inside subtitle preview */
+.cometchat-message-composer__reply-preview p,
+.cometchat-message-composer__reply-preview blockquote,
+.cometchat-message-composer__reply-preview pre,
+.cometchat-message-composer__reply-preview code,
+.cometchat-message-composer__reply-preview ul,
+.cometchat-message-composer__reply-preview ol,
+.cometchat-message-composer__reply-preview li,
+.cometchat-message-composer__reply-preview h1,
+.cometchat-message-composer__reply-preview h2,
+.cometchat-message-composer__reply-preview h3,
+.cometchat-message-composer__reply-preview h4,
+.cometchat-message-composer__reply-preview h5,
+.cometchat-message-composer__reply-preview h6 {
+  margin: 0;
+  padding: 0;
+  display: inline;
+  font: inherit;
+  color: inherit;
+  border: none;
+  background: none;
+  white-space: nowrap;
+}
 .cometchat-conversation-item__subtitle-text ol , .cometchat-conversation-item__subtitle-text ul{
   margin: 0;
   padding: 0;