@cometchat/chat-uikit-react 6.0.0 → 6.0.2

package/dist/styles/CometChatAudioBubble.css

@@ -35,6 +35,7 @@
     display: flex;
     align-items: center;
     justify-content: center;
+    z-index: 1;
 }
 
 /* Container for download progress circle (24x24 size) */

package/dist/styles/CometChatCallLogs.css

@@ -92,8 +92,8 @@
 }
 
 .cometchat-call-logs__list-item-subtitle-icon-incoming-call {
-  -webkit-mask: url("../../assets/call_received.svg") center center no-repeat;
-  mask: url("../../assets/call_received.svg") center center no-repeat;
+  -webkit-mask: url("../../assets/missedCallIcon.svg") center center no-repeat;
+  mask: url("../../assets/missedCallIcon.svg") center center no-repeat;
   background-color: var(--cometchat-success-color,#09C26F);
 
 }

package/dist/styles/CometChatMessageInformation.css

@@ -1,6 +1,8 @@
 .cometchat-message-information {
-    width: 420px;
+    max-width: 420px;
+    width: 100%;
     height: fit-content;
+    max-height: 100%;
     flex-shrink: 0;
     border-radius: var(--cometchat-radius-5, 20px);
     border: 1px solid var(--cometchat-border-color-light, #F5F5F5);

package/dist/styles/CometChatMessageList.css

@@ -173,7 +173,7 @@ width: fit-content;
 .cometchat-message-list__date-header {
     position: absolute;
     top: 12px;
-    z-index: 1;
+    z-index: 2;
 }
 .cometchat-message-list__bubble-date-header{
     margin: auto;
@@ -490,7 +490,10 @@ width: fit-content;
     align-items: center;
     align-self: center;
     border-radius: var(--cometchat-radius-2, 8px);
+    margin: auto;
     margin-top: 10px;
+    z-index: 1;
+    position: relative;
 
 
 }
@@ -707,5 +710,5 @@ width: fit-content;
     justify-content: center;
     align-items: center;
     overflow: auto;
-    background-color: rgba(0, 0, 0, 0.4);
+    background-color: rgba(0, 0, 0, 0.6);
 }

package/dist/styles/CometChatOutgoingCall.css

@@ -89,7 +89,7 @@
     }
 
     /* Avatar size adjustment for smaller screens */
-    .cometchat-outgoing-call__avatar .cometchat-avatar {
+    .cometchat-outgoing-call .cometchat-outgoing-call__avatar .cometchat .cometchat-avatar {
         width: 120px;
         height: 120px;
     }

package/dist/styles/PollsBubble.css

@@ -8,7 +8,11 @@
   width: 240px;
   max-width: 240px;
 }
-
+.cometchat-polls-bubble  * {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
 .cometchat-polls-bubble-incoming {
   background: var(--cometchat-neutral-color-300, #E8E8E8);
 }

package/dist/styles/StickersKeyboard.css

@@ -1,8 +1,5 @@
-* {
-  box-sizing: border-box;
-  margin: 0;
-  padding: 0;
-}
+
+
 
 .cometchat-sticker-keyboard {
   display: flex;

package/dist/styles/components/CometChatAudioBubble.css

@@ -35,6 +35,7 @@
     display: flex;
     align-items: center;
     justify-content: center;
+    z-index: 1;
 }
 
 /* Container for download progress circle (24x24 size) */

package/dist/styles/components/CometChatCallLogs.css

@@ -92,8 +92,8 @@
 }
 
 .cometchat-call-logs__list-item-subtitle-icon-incoming-call {
-  -webkit-mask: url("../../assets/call_received.svg") center center no-repeat;
-  mask: url("../../assets/call_received.svg") center center no-repeat;
+  -webkit-mask: url("../../assets/missedCallIcon.svg") center center no-repeat;
+  mask: url("../../assets/missedCallIcon.svg") center center no-repeat;
   background-color: var(--cometchat-success-color,#09C26F);
 
 }

package/dist/styles/components/CometChatMessageInformation.css

@@ -1,6 +1,8 @@
 .cometchat-message-information {
-    width: 420px;
+    max-width: 420px;
+    width: 100%;
     height: fit-content;
+    max-height: 100%;
     flex-shrink: 0;
     border-radius: var(--cometchat-radius-5, 20px);
     border: 1px solid var(--cometchat-border-color-light, #F5F5F5);

package/dist/styles/components/CometChatMessageList.css

@@ -173,7 +173,7 @@ width: fit-content;
 .cometchat-message-list__date-header {
     position: absolute;
     top: 12px;
-    z-index: 1;
+    z-index: 2;
 }
 .cometchat-message-list__bubble-date-header{
     margin: auto;
@@ -490,7 +490,10 @@ width: fit-content;
     align-items: center;
     align-self: center;
     border-radius: var(--cometchat-radius-2, 8px);
+    margin: auto;
     margin-top: 10px;
+    z-index: 1;
+    position: relative;
 
 
 }
@@ -707,5 +710,5 @@ width: fit-content;
     justify-content: center;
     align-items: center;
     overflow: auto;
-    background-color: rgba(0, 0, 0, 0.4);
+    background-color: rgba(0, 0, 0, 0.6);
 }

package/dist/styles/components/CometChatOutgoingCall.css

@@ -89,7 +89,7 @@
     }
 
     /* Avatar size adjustment for smaller screens */
-    .cometchat-outgoing-call__avatar .cometchat-avatar {
+    .cometchat-outgoing-call .cometchat-outgoing-call__avatar .cometchat .cometchat-avatar {
         width: 120px;
         height: 120px;
     }

package/dist/styles/components/PollsBubble.css

@@ -8,7 +8,11 @@
   width: 240px;
   max-width: 240px;
 }
-
+.cometchat-polls-bubble  * {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
 .cometchat-polls-bubble-incoming {
   background: var(--cometchat-neutral-color-300, #E8E8E8);
 }

package/dist/styles/components/StickersKeyboard.css

@@ -1,8 +1,5 @@
-* {
-  box-sizing: border-box;
-  margin: 0;
-  padding: 0;
-}
+
+
 
 .cometchat-sticker-keyboard {
   display: flex;

package/dist/styles/components/index.css

@@ -55,7 +55,9 @@
 @import url('./CometChatThreadHeader.css');
 @import url('./CometChatToast.css');
 
-
+.cometchat * {
+    box-sizing: border-box;
+}
 
 
 .cometchat-mentions > span{

package/dist/styles/index.css

@@ -55,7 +55,9 @@
 @import url('./CometChatThreadHeader.css');
 @import url('./CometChatToast.css');
 
-
+.cometchat * {
+    box-sizing: border-box;
+}
 
 
 .cometchat-mentions > span{

package/dist/types/CometChatUIKit/CometChatUIKitUtility.d.ts

@@ -1,4 +1,3 @@
-import { BaseMessage, CometChat } from "@cometchat/chat-sdk-javascript";
 interface MessageExtensionType {
     hasXSS?: string;
     sanitized_text?: string;

package/dist/types/components/BaseComponents/CometChatAudioBubble/src/webaudio.d.ts

@@ -31,8 +31,8 @@ declare class WebAudioPlayer extends EventEmitter<WebAudioPlayerEvents> {
     constructor(audioContext?: AudioContext);
     /** Subscribe to an event. Returns an unsubscribe function. */
     addEventListener: <EventName extends keyof WebAudioPlayerEvents>(event: EventName, listener: (...args: WebAudioPlayerEvents[EventName]) => void, options?: {
-        once?: boolean | undefined;
-    } | undefined) => () => void;
+        once?: boolean;
+    }) => () => void;
     /** Unsubscribe from an event */
     removeEventListener: <EventName extends keyof WebAudioPlayerEvents>(event: EventName, listener: (...args: WebAudioPlayerEvents[EventName]) => void) => void;
     load(): Promise<void>;

package/dist/types/components/BaseComponents/CometChatContextMenu/CometChatContextMenu.d.ts

@@ -7,6 +7,8 @@ interface ContextMenuProps {
     onOptionClicked?: (option: CometChatActionsIcon | CometChatActionsView | CometChatOption) => void;
     placement?: Placement;
     closeOnOutsideClick?: boolean;
+    disableBackgroundInteraction?: boolean;
+    useParentContainer?: boolean;
 }
 /**
  * CometChatContextMenu is a composite component used to display menu data in required format.

package/dist/types/components/BaseComponents/CometChatEmojiKeyboard/useCometChatEmojiKeyboard.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { CometChatEmoji, CometChatEmojiCategory } from "./CometChatEmoji";
 export declare const useCometChatEmojiKeyboard: ({ emojiData, }: {
     emojiData: CometChatEmojiCategory[];

package/dist/types/components/BaseComponents/CometChatListItem/useCometChatListItem.d.ts

@@ -1,12 +1,15 @@
 import { MouseEvent } from "react";
-export declare const useCometChatListItem: ({ id, onListItemClicked }: {
-    id?: string | undefined;
-    onListItemClicked?: (({ id: string }: {
-        id?: string | undefined;
-    }) => void) | undefined;
-}) => {
+interface ICometChatListItem {
+    id?: string;
+    onListItemClicked?: (input: {
+        id: string;
+    }) => void;
+    menuRef: React.RefObject<HTMLDivElement>;
+}
+export declare const useCometChatListItem: ({ id, onListItemClicked, menuRef, }: ICometChatListItem) => {
     listItemClick: (event: MouseEvent<HTMLDivElement>) => void;
     isHovering: boolean;
     showTail: () => void;
     hideTail: () => void;
 };
+export {};

package/dist/types/components/BaseComponents/CometChatMessageBubble/CometChatMessageBubble.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { CometChatActionsIcon, CometChatActionsView } from "../../../modals";
 import { MessageBubbleAlignment } from "../../../Enums/Enums";
 /**Interface defining the structure for MessageBubbleProps */

package/dist/types/components/BaseComponents/CometChatPopover/CometChatPopover.d.ts

@@ -14,6 +14,8 @@ interface PopoverProps {
     content: ReactNode;
     childClickHandler?: (openContent: Function, event: Event) => void;
     onOutsideClick?: () => void;
+    disableBackgroundInteraction?: boolean;
+    useParentContainer?: boolean;
 }
 declare const CometChatPopover: import("react").ForwardRefExoticComponent<PopoverProps & import("react").RefAttributes<{
     openPopover: () => void;

package/dist/types/components/Calling/CometChatCallLogs/CometChatCallLogs.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { CalendarObject } from "../../../utils/CalendarObject";
 interface CallLogsProps {
     /**

package/dist/types/components/Calling/CometChatIncomingCall/CometChatIncomingCall.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { CometChatUIKitCalls } from "../../../CometChatUIKit/CometChatCalls";
 interface IncomingCallProps {
     /**

package/dist/types/components/Calling/CometChatOutgoingCall/CometChatOutgoingCall.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 /**
  * Props interface for the outgoing call component
  */

package/dist/types/components/Calling/OutgoingCallConfiguration.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare class OutgoingCallConfiguration {
     disableSoundForCalls?: boolean;
     customSoundForCalls?: string;

package/dist/types/components/CometChatConversations/controller.d.ts

@@ -1,4 +1,3 @@
-import { CometChat } from '@cometchat/chat-sdk-javascript';
 type Args = {
     conversationsRequestBuilder: CometChat.ConversationsRequestBuilder | null;
     errorHandler: (error: unknown, source?: string) => void;

package/dist/types/components/CometChatMessageList/CometChatMessageList.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { CometChatMessageTemplate } from "../../modals";
 import { MessageListAlignment } from "../../Enums/Enums";
 import { CometChatTextFormatter } from "../../formatters/CometChatFormatters/CometChatTextFormatter";

package/dist/types/components/CometChatThreadHeader/CometChatThreadHeader.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { CometChatMessageTemplate } from "../../modals";
 import { CalendarObject } from "../../utils/CalendarObject";
 interface CometChatThreadHeaderProps {

package/dist/types/components/CometChatUserMemberWrapper/CometChatUserMemberWrapper.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { UserMemberListType } from '../../Enums/Enums';
 export interface MentionsProps {
     userMemberListType?: UserMemberListType;

package/dist/types/components/CometChatUsers/controller.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 type Args = {
     searchText: string;
     usersRequestBuilder: CometChat.UsersRequestBuilder | null;

package/dist/types/components/Extensions/Stickers/StickersExtensionDecorator.d.ts

@@ -1,4 +1,3 @@
-import { CometChat } from "@cometchat/chat-sdk-javascript";
 import { DataSource } from "../../../utils/DataSource";
 import { DataSourceDecorator } from "../../../utils/DataSourceDecorator";
 import { ComposerId } from "../../../utils/MessagesDataSource";

package/dist/types/components/Extensions/ThumbnailGeneration/ThumbnailGenerationExtensionDecorator.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { DataSourceDecorator } from "../../../utils/DataSourceDecorator";
 /**
  * Class representing a Thumbnail Generation extension decorator.

package/dist/types/constants/CometChatUIKitConstants.d.ts

@@ -4,6 +4,7 @@ export declare class CometChatUIKitConstants {
         custom: string;
         action: string;
         call: string;
+        interactive: string;
     }>;
     static MessageTypes: Readonly<{
         text: string;
@@ -14,6 +15,10 @@ export declare class CometChatUIKitConstants {
         delete: "delete";
         edited: "edited";
         groupMember: "groupMember";
+        form: "form";
+        card: "card";
+        customInteractive: "customInteractive";
+        scheduler: "scheduler";
     }>;
     static groupMemberAction: Readonly<{
         ROLE: "role";
@@ -96,7 +101,6 @@ export declare class CometChatUIKitConstants {
         CUSTOM_MESSAGE_RECEIVED: "onCustomMessageReceived";
         TRANSIENT_MESSAGE_RECEIVED: "onTransientMessageReceived";
         INTERACTIVE_MESSAGE_RECEIVED: "onInteractiveMessageReceived";
-        INTERACTION_GOAL_COMPLETED: "onInteractionGoalCompleted";
         DELIVERY: "delivery";
         READ: "read";
         APP_SYSTEM: "app_system";

package/dist/types/events/CometChatMessageEvents.d.ts

@@ -31,6 +31,10 @@ export declare class CometChatMessageEvents {
     static onMessageDeleted: Subject<CometChat.BaseMessage>;
     static onMessageReactionAdded: Subject<CometChat.ReactionEvent>;
     static onMessageReactionRemoved: Subject<CometChat.ReactionEvent>;
+    static onCustomInteractiveMessageReceived: Subject<CometChat.InteractiveMessage>;
+    static onFormMessageReceived: Subject<CometChat.InteractiveMessage>;
+    static onCardMessageReceived: Subject<CometChat.InteractiveMessage>;
+    static onSchedulerMessageReceived: Subject<CometChat.InteractiveMessage>;
 }
 /**
 * Interface for message-related events

package/dist/types/modals/CometChatActionsView.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { CometChatActions } from "./CometChatActions";
 /**
  * CometChatActionsView is a pre-defined structure for creating actions

package/dist/types/modals/CometChatMessageTemplate.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { CometChatMessageOption } from "./CometChatMessageOption";
 import { MessageBubbleAlignment } from "../Enums/Enums";
 import { CalendarObject } from "../utils/CalendarObject";

package/dist/types/resources/CometChatLocalize/cometchat-localize.d.ts

@@ -34,6 +34,7 @@ declare class CometChatLocalize {
      * @returns {string} Localized string.
      */
     static getLocalizedString: (str: string) => any;
+    private static getDefaultTimeZone;
     /**
      * Initializes localization settings (v2).
      * @param {LocalizationSettings} settings - Localization settings.
@@ -71,6 +72,7 @@ declare class CometChatLocalize {
      * @returns {string} Formatted date string.
      */
     static formatDate(timestamp: number, calendarObject: CalendarObject): string;
+    private static isYesterday;
 }
 declare const getLocalizedString: (str: string) => any;
 export { CometChatLocalize, getLocalizedString };

package/dist/types/utils/DataSource.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { CometChatMentionsFormatter } from "../formatters/CometChatFormatters/CometChatMentionsFormatter/CometChatMentionsFormatter";
 import { CometChatTextFormatter } from "../formatters/CometChatFormatters/CometChatTextFormatter";
 import { CometChatUrlsFormatter } from "../formatters/CometChatFormatters/CometChatUrlsFormatter/CometChatUrlsFormatter";
@@ -52,4 +51,13 @@ export declare abstract class DataSource {
     abstract getMentionsTextFormatter(params: Object): CometChatMentionsFormatter;
     abstract getUrlTextFormatter(params: Object): CometChatUrlsFormatter;
     abstract getMentionsFormattedText(message: CometChat.TextMessage, subtitle: string, additionalConfigurations?: Object | undefined): string;
+    abstract getFormMessageContentView(message: CometChat.InteractiveMessage, alignment: MessageBubbleAlignment): Element | JSX.Element;
+    abstract getSchedulerMessageContentView(message: CometChat.InteractiveMessage, alignment: MessageBubbleAlignment): Element | JSX.Element;
+    abstract getCardMessageContentView(message: CometChat.InteractiveMessage, alignment: MessageBubbleAlignment): Element | JSX.Element;
+    abstract getFormMessageTemplate(): CometChatMessageTemplate;
+    abstract getSchedulerMessageTemplate(): CometChatMessageTemplate;
+    abstract getCardMessageTemplate(): CometChatMessageTemplate;
+    abstract getFormMessageBubble(message: CometChat.InteractiveMessage, alignment: MessageBubbleAlignment): Element | JSX.Element;
+    abstract getSchedulerMessageBubble(message: CometChat.InteractiveMessage, alignment: MessageBubbleAlignment): Element | JSX.Element;
+    abstract getCardMessageBubble(message: CometChat.InteractiveMessage, alignment: MessageBubbleAlignment): Element | JSX.Element;
 }

package/dist/types/utils/DataSourceDecorator.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { DataSource } from "./DataSource";
 import { ComposerId } from "./MessagesDataSource";
 import { CometChatUrlsFormatter } from "../formatters/CometChatFormatters/CometChatUrlsFormatter/CometChatUrlsFormatter";
@@ -54,4 +53,13 @@ export declare abstract class DataSourceDecorator implements DataSource {
     getMentionsTextFormatter(params?: Object): CometChatMentionsFormatter;
     getUrlTextFormatter(params?: Object): CometChatUrlsFormatter;
     getMentionsFormattedText(message: CometChat.TextMessage, subtitle: string, additionalConfigurations: Object): string;
+    getFormMessageContentView(message: CometChat.InteractiveMessage, alignment: MessageBubbleAlignment): JSX.Element | Element;
+    getSchedulerMessageContentView(message: CometChat.InteractiveMessage, alignment: MessageBubbleAlignment): JSX.Element | Element;
+    getCardMessageContentView(message: CometChat.InteractiveMessage, alignment: MessageBubbleAlignment): JSX.Element | Element;
+    getFormMessageTemplate(): CometChatMessageTemplate;
+    getSchedulerMessageTemplate(): CometChatMessageTemplate;
+    getCardMessageTemplate(): CometChatMessageTemplate;
+    getFormMessageBubble(message: CometChat.InteractiveMessage, alignment: MessageBubbleAlignment): JSX.Element | Element;
+    getSchedulerMessageBubble(message: CometChat.InteractiveMessage, alignment: MessageBubbleAlignment): JSX.Element | Element;
+    getCardMessageBubble(message: CometChat.InteractiveMessage, alignment: MessageBubbleAlignment): JSX.Element | Element;
 }

package/dist/types/utils/MessagesDataSource.d.ts

@@ -1,5 +1,3 @@
-/// <reference types="react" />
-import { CometChat } from "@cometchat/chat-sdk-javascript";
 import { DataSource } from "./DataSource";
 import { additionalParams } from "./ConversationUtils";
 import { CometChatMentionsFormatter } from "../formatters/CometChatFormatters/CometChatMentionsFormatter/CometChatMentionsFormatter";
@@ -42,7 +40,7 @@ export declare class MessagesDataSource implements DataSource {
     getVideoMessageOptions(loggedInUser: CometChat.User, messageObject: CometChat.BaseMessage, group?: CometChat.Group, additionalParams?: Object | undefined): Array<CometChatActionsIcon | CometChatActionsView>;
     getAudioMessageOptions(loggedInUser: CometChat.User, messageObject: CometChat.BaseMessage, group?: CometChat.Group, additionalParams?: Object | undefined): Array<CometChatActionsIcon | CometChatActionsView>;
     getFileMessageOptions(loggedInUser: CometChat.User, messageObject: CometChat.BaseMessage, group?: CometChat.Group, additionalParams?: Object | undefined): Array<CometChatActionsIcon | CometChatActionsView>;
-    getReceiptClass(status?: number): "wait" | "error" | "read" | "delivered" | "sent" | undefined;
+    getReceiptClass(status?: number): "error" | "wait" | "read" | "delivered" | "sent" | undefined;
     /**
   * Function to get receipt for message bubble
   * @param {CometChat.BaseMessage} item - The message bubble for which the receipt needs to be fetched
@@ -56,14 +54,14 @@ export declare class MessagesDataSource implements DataSource {
     getMessageSentAtDateFormat(messageSentAtDateTimeFormat?: CalendarObject): {
         today: string;
         yesterday: string;
-        lastWeek?: string | undefined;
+        lastWeek?: string;
         otherDays: string;
         relativeTime?: {
-            minute?: string | undefined;
-            minutes?: string | undefined;
-            hour?: string | undefined;
-            hours?: string | undefined;
-        } | undefined;
+            minute?: string;
+            minutes?: string;
+            hour?: string;
+            hours?: string;
+        };
     };
     /**
   * Function to get status and date for message bubble
@@ -137,4 +135,13 @@ export declare class MessagesDataSource implements DataSource {
     getAllTextFormatters(formatterParams: additionalParams): CometChatTextFormatter[];
     getMentionsTextFormatter(params: additionalParams): CometChatMentionsFormatter;
     getUrlTextFormatter(params?: additionalParams): CometChatUrlsFormatter;
+    getFormMessageBubble(message: CometChat.InteractiveMessage, alignment: MessageBubbleAlignment): Element | JSX.Element;
+    getSchedulerMessageBubble(message: CometChat.InteractiveMessage, alignment: MessageBubbleAlignment): Element | JSX.Element;
+    getCardMessageBubble(message: CometChat.InteractiveMessage, alignment: MessageBubbleAlignment): Element | JSX.Element;
+    getFormMessageTemplate(): CometChatMessageTemplate;
+    getSchedulerMessageTemplate(): CometChatMessageTemplate;
+    getCardMessageTemplate(): CometChatMessageTemplate;
+    getFormMessageContentView(message: CometChat.InteractiveMessage, _alignment: MessageBubbleAlignment): Element | JSX.Element;
+    getSchedulerMessageContentView(message: CometChat.InteractiveMessage, _alignment: MessageBubbleAlignment): Element | JSX.Element;
+    getCardMessageContentView(message: CometChat.InteractiveMessage, _alignment: MessageBubbleAlignment): Element | JSX.Element;
 }

package/dist/types/utils/util.d.ts

@@ -50,4 +50,5 @@ export declare function isMobileDevice(): boolean;
 export declare function sanitizeCalendarObject(calendarObject?: CalendarObject): {
     [k: string]: any;
 };
+export declare function fireClickEvent(): void;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cometchat/chat-uikit-react",
-  "version": "6.0.0",
+  "version": "6.0.2",
   "description": "Ready-to-use Chat UI Components for React(Javascript/Web)",
   "author": "CometChat",
   "dependencies": {
@@ -40,6 +40,11 @@
     "webpack-cli": "^4.9.2",
     "webpack-dev-server": "^4.7.4"
   },
+  "peerDependencies": {
+    "@types/react": ">=18.0.0 <20.0.0",
+    "@types/react-dom": ">=18.0.0 <20.0.0",
+    "rxjs": "^7.8.1"
+  },
   "homepage": "https://www.cometchat.com",
   "repository": "https://github.com/cometchat/cometchat-uikit-react/tree/v6",
   "main": "dist/index.js",