├── .DS_Store ├── .gitignore ├── CONTRIBUTING.md ├── CometChatWorkspace ├── CONSTS.js ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── CometChatWidgetEvent.js │ ├── CometChatWidgetLaunch.js │ ├── cometchat-pro-react-ui-kit │ │ ├── .DS_Store │ │ ├── .gitignore │ │ ├── CONTRIBUTING.md │ │ ├── CometChatWorkspace │ │ │ ├── .babelrc.json │ │ │ ├── package.json │ │ │ └── src │ │ │ │ ├── components │ │ │ │ ├── Calls │ │ │ │ │ ├── CometChatCallScreen │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── increase-size.svg │ │ │ │ │ │ │ └── reduce-size.svg │ │ │ │ │ │ ├── strings.js │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatIncomingCall │ │ │ │ │ │ ├── controller.js │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── incoming-call.svg │ │ │ │ │ │ │ └── incoming-video-call.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatIncomingDirectCall │ │ │ │ │ │ ├── controller.js │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── incoming-video-call.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatOutgoingCall │ │ │ │ │ │ ├── controller.js │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── end-call.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatOutgoingDirectCall │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ └── index.js │ │ │ │ ├── Chats │ │ │ │ │ ├── CometChatConversationList │ │ │ │ │ │ ├── controller.js │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── back.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatConversationListActions │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── delete.svg │ │ │ │ │ │ │ └── progress.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatConversationListItem │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── style.js │ │ │ │ │ │ └── test.js │ │ │ │ │ ├── CometChatConversationListWithMessages │ │ │ │ │ │ ├── controller.js │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ └── index.js │ │ │ │ ├── CometChatUI │ │ │ │ │ ├── CometChatNavBar │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── calls.svg │ │ │ │ │ │ │ ├── chats.svg │ │ │ │ │ │ │ ├── groups.svg │ │ │ │ │ │ │ ├── more.svg │ │ │ │ │ │ │ └── users.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── controller.js │ │ │ │ │ ├── index.js │ │ │ │ │ └── style.js │ │ │ │ ├── Groups │ │ │ │ │ ├── CometChatAddGroupMemberList │ │ │ │ │ │ ├── controller.js │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── adding.svg │ │ │ │ │ │ │ ├── close.svg │ │ │ │ │ │ │ └── search.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatAddGroupMemberListItem │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── group-member-select.svg │ │ │ │ │ │ │ └── group-member-unselect.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatBanGroupMemberList │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── close.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatBanGroupMemberListItem │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── ban-member.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatCreateGroup │ │ │ │ │ │ ├── controller.js │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── close.svg │ │ │ │ │ │ │ └── creating.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatGroupDetails │ │ │ │ │ │ ├── context.js │ │ │ │ │ │ ├── controller.js │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── back.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatGroupList │ │ │ │ │ │ ├── controller.js │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── back.svg │ │ │ │ │ │ │ ├── create.svg │ │ │ │ │ │ │ └── search.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatGroupListItem │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── password-protected-group.svg │ │ │ │ │ │ │ └── private-group.svg │ │ │ │ │ │ ├── style.js │ │ │ │ │ │ └── test.js │ │ │ │ │ ├── CometChatGroupListWithMessages │ │ │ │ │ │ ├── controller.js │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatTransferOwnershipMemberList │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── close.svg │ │ │ │ │ │ │ └── transferring.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatTransferOwnershipMemberListItem │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── group-member-select.svg │ │ │ │ │ │ │ └── group-member-unselect.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatViewGroupMemberList │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── close.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatViewGroupMemberListItem │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── ban-member.svg │ │ │ │ │ │ │ ├── close.svg │ │ │ │ │ │ │ ├── delete.svg │ │ │ │ │ │ │ ├── done.svg │ │ │ │ │ │ │ └── edit.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ └── index.js │ │ │ │ ├── Messages │ │ │ │ │ ├── CometChatActionMessageBubble │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatBlockedUser │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatDeleteMessageBubble │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatEmojiKeyboard │ │ │ │ │ │ ├── Emoji.js │ │ │ │ │ │ ├── EmojiCategory.js │ │ │ │ │ │ ├── emojis.js │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── activity.svg │ │ │ │ │ │ │ ├── animals.svg │ │ │ │ │ │ │ ├── flags.svg │ │ │ │ │ │ │ ├── food.svg │ │ │ │ │ │ │ ├── objects.svg │ │ │ │ │ │ │ ├── smileys.svg │ │ │ │ │ │ │ ├── symbols.svg │ │ │ │ │ │ │ └── travel.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatImageViewer │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── close.svg │ │ │ │ │ │ │ └── ring.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatLinkPreview │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatLiveReactions │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── heart.png │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatMessageActions │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── delete.svg │ │ │ │ │ │ │ ├── edit.svg │ │ │ │ │ │ │ ├── message-translate.svg │ │ │ │ │ │ │ ├── reactions.svg │ │ │ │ │ │ │ ├── send-message-in-private.svg │ │ │ │ │ │ │ └── threaded-message.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatMessageComposer │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── Plus-1.svg │ │ │ │ │ │ │ ├── add-circle-filled.svg │ │ │ │ │ │ │ ├── attach.svg │ │ │ │ │ │ │ ├── audio-file.svg │ │ │ │ │ │ │ ├── close.svg │ │ │ │ │ │ │ ├── collaborative-document.svg │ │ │ │ │ │ │ ├── collaborative-whiteboard.svg │ │ │ │ │ │ │ ├── emoji.svg │ │ │ │ │ │ │ ├── file-upload.svg │ │ │ │ │ │ │ ├── heart.png │ │ │ │ │ │ │ ├── image.svg │ │ │ │ │ │ │ ├── polls.svg │ │ │ │ │ │ │ ├── send-message.svg │ │ │ │ │ │ │ ├── stickers.svg │ │ │ │ │ │ │ ├── video-upload.svg │ │ │ │ │ │ │ └── video.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatMessageHeader │ │ │ │ │ │ ├── controller.js │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── audio-call.svg │ │ │ │ │ │ │ ├── info.svg │ │ │ │ │ │ │ ├── menu.svg │ │ │ │ │ │ │ └── video-call.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatMessageList │ │ │ │ │ │ ├── MessageFilter.js │ │ │ │ │ │ ├── controller.js │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatMessageThread │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── close.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatMessages │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatReadReceipt │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── message-delivered.svg │ │ │ │ │ │ │ ├── message-read.svg │ │ │ │ │ │ │ ├── message-sent.svg │ │ │ │ │ │ │ ├── wait.svg │ │ │ │ │ │ │ └── warning-small.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatReceiverAudioMessageBubble │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatReceiverDirectCallBubble │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── video-call.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatReceiverFileMessageBubble │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── file-upload.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatReceiverImageMessageBubble │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── 1px.png │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatReceiverTextMessageBubble │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatReceiverVideoMessageBubble │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── image_placeholder.png │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatSenderAudioMessageBubble │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatSenderDirectCallBubble │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── video-call.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatSenderFileMessageBubble │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── file-upload.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatSenderImageMessageBubble │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── 1px.png │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatSenderTextMessageBubble │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatSenderVideoMessageBubble │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── image_placeholder.png │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatThreadedMessageReplyCount │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── Extensions │ │ │ │ │ │ ├── CometChatCreatePoll │ │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ │ ├── add-circle-filled.svg │ │ │ │ │ │ │ │ ├── close.svg │ │ │ │ │ │ │ │ └── creating.svg │ │ │ │ │ │ │ └── style.js │ │ │ │ │ │ ├── CometChatCreatePollOptions │ │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ │ └── remove.svg │ │ │ │ │ │ │ └── style.js │ │ │ │ │ │ ├── CometChatMessageReactions │ │ │ │ │ │ │ ├── EmojiMapping.js │ │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ │ └── reactions.svg │ │ │ │ │ │ │ └── style.js │ │ │ │ │ │ ├── CometChatReceiverDocumentBubble │ │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ │ └── collaborative-document.svg │ │ │ │ │ │ │ └── style.js │ │ │ │ │ │ ├── CometChatReceiverPollMessageBubble │ │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ │ ├── check.svg │ │ │ │ │ │ │ │ └── checkmark.svg │ │ │ │ │ │ │ └── style.js │ │ │ │ │ │ ├── CometChatReceiverStickerMessageBubble │ │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ │ └── style.js │ │ │ │ │ │ ├── CometChatReceiverWhiteboardBubble │ │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ │ └── collaborative-whiteboard.svg │ │ │ │ │ │ │ └── style.js │ │ │ │ │ │ ├── CometChatSenderDocumentBubble │ │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ │ └── collaborative-document.svg │ │ │ │ │ │ │ └── style.js │ │ │ │ │ │ ├── CometChatSenderPollMessageBubble │ │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ │ └── style.js │ │ │ │ │ │ ├── CometChatSenderStickerBubble │ │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ │ └── style.js │ │ │ │ │ │ ├── CometChatSenderWhiteboardBubble │ │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ │ └── collaborative-whiteboard.svg │ │ │ │ │ │ │ └── style.js │ │ │ │ │ │ ├── CometChatSmartReplyPreview │ │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ │ └── close.svg │ │ │ │ │ │ │ └── style.js │ │ │ │ │ │ ├── CometChatStickerKeyboard │ │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ │ └── close.svg │ │ │ │ │ │ │ └── style.js │ │ │ │ │ │ └── index.js │ │ │ │ │ └── index.js │ │ │ │ ├── Shared │ │ │ │ │ ├── CometChatAvatar │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── 1px.png │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatBackdrop │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatBadgeCount │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatConfirmDialog │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatErrorBoundary │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatListItem │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatSharedMediaView │ │ │ │ │ │ ├── controller.js │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── 1px.png │ │ │ │ │ │ │ └── file-upload.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatToastNotification │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── checkmark-filled.svg │ │ │ │ │ │ │ ├── close-circle-filled.svg │ │ │ │ │ │ │ ├── info-filled.svg │ │ │ │ │ │ │ ├── info.svg │ │ │ │ │ │ │ └── warning-filled.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatUserPresence │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ └── index.js │ │ │ │ ├── UserProfile │ │ │ │ │ ├── CometChatUserProfile │ │ │ │ │ │ ├── controller.js │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── chats.svg │ │ │ │ │ │ │ ├── help.svg │ │ │ │ │ │ │ ├── notify.svg │ │ │ │ │ │ │ ├── privacy.svg │ │ │ │ │ │ │ └── warning.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ └── index.js │ │ │ │ ├── Users │ │ │ │ │ ├── CometChatUserDetails │ │ │ │ │ │ ├── controller.js │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ └── back.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatUserList │ │ │ │ │ │ ├── controller.js │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── resources │ │ │ │ │ │ │ ├── back.svg │ │ │ │ │ │ │ └── search.svg │ │ │ │ │ │ └── style.js │ │ │ │ │ ├── CometChatUserListItem │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ ├── style.js │ │ │ │ │ │ └── test.js │ │ │ │ │ ├── CometChatUserListWithMessages │ │ │ │ │ │ ├── controller.js │ │ │ │ │ │ ├── index.js │ │ │ │ │ │ └── style.js │ │ │ │ │ └── index.js │ │ │ │ └── index.js │ │ │ │ ├── index.js │ │ │ │ ├── resources │ │ │ │ ├── __mocks__ │ │ │ │ │ ├── consts.js │ │ │ │ │ ├── fileMock.js │ │ │ │ │ └── windowMock.js │ │ │ │ ├── audio │ │ │ │ │ ├── incomingcall.wav │ │ │ │ │ ├── incomingmessage.wav │ │ │ │ │ ├── incomingothermessage.wav │ │ │ │ │ ├── index.js │ │ │ │ │ ├── outgoingcall.wav │ │ │ │ │ └── outgoingmessage.wav │ │ │ │ ├── localization │ │ │ │ │ ├── locales │ │ │ │ │ │ ├── ar │ │ │ │ │ │ │ └── translation.json │ │ │ │ │ │ ├── de │ │ │ │ │ │ │ └── translation.json │ │ │ │ │ │ ├── en │ │ │ │ │ │ │ └── translation.json │ │ │ │ │ │ ├── es │ │ │ │ │ │ │ └── translation.json │ │ │ │ │ │ ├── fr │ │ │ │ │ │ │ └── translation.json │ │ │ │ │ │ ├── hi │ │ │ │ │ │ │ └── translation.json │ │ │ │ │ │ ├── hu │ │ │ │ │ │ │ └── translation.json │ │ │ │ │ │ ├── lt │ │ │ │ │ │ │ └── translation.json │ │ │ │ │ │ ├── ms │ │ │ │ │ │ │ └── translation.json │ │ │ │ │ │ ├── pt │ │ │ │ │ │ │ └── translation.json │ │ │ │ │ │ ├── ru │ │ │ │ │ │ │ └── translation.json │ │ │ │ │ │ ├── sv │ │ │ │ │ │ │ └── translation.json │ │ │ │ │ │ ├── zh-tw │ │ │ │ │ │ │ └── translation.json │ │ │ │ │ │ └── zh │ │ │ │ │ │ │ └── translation.json │ │ │ │ │ └── translator.js │ │ │ │ ├── tabs.json │ │ │ │ └── theme.js │ │ │ │ └── util │ │ │ │ ├── CometChatAuthentication.js │ │ │ │ ├── CometChatContext.js │ │ │ │ ├── CometChatEvent.js │ │ │ │ ├── FeatureRestriction │ │ │ │ └── index.js │ │ │ │ ├── SoundManager.js │ │ │ │ ├── Storage.js │ │ │ │ ├── UIKitSettings.js │ │ │ │ ├── common.js │ │ │ │ ├── controller.js │ │ │ │ └── enums.js │ │ ├── LICENSE │ │ ├── README.md │ │ ├── SECURITY.md │ │ ├── SUPPORT.md │ │ └── Screenshots │ │ │ ├── add-ui-kit.png │ │ │ ├── logo.png │ │ │ ├── main.png │ │ │ └── package-dependencies.png │ ├── components │ │ └── App │ │ │ ├── DockedLauncher │ │ │ ├── index.js │ │ │ ├── resources │ │ │ │ ├── chat_bubble.svg │ │ │ │ ├── chat_close.svg │ │ │ │ └── core.scss │ │ │ ├── style.js │ │ │ └── style.module.css │ │ │ ├── EmbedFrame │ │ │ ├── index.js │ │ │ └── style.js │ │ │ ├── Embedded │ │ │ ├── controller.js │ │ │ ├── globalStyle.js │ │ │ ├── index.js │ │ │ └── style.js │ │ │ ├── controller.js │ │ │ ├── index.js │ │ │ ├── style.js │ │ │ └── utils.js │ ├── hoc │ │ ├── FrameProvider.js │ │ ├── ScopeProvider.js │ │ └── asyncComponent.js │ ├── index.js │ ├── public │ │ ├── changelanguage.html │ │ ├── chat.html │ │ ├── creategroup.html │ │ ├── createuser.html │ │ └── version.txt │ ├── resources │ │ ├── tabs.js │ │ └── theme.js │ └── util │ │ ├── enums.js │ │ └── index.js ├── webpack.common.js ├── webpack.dev.js └── webpack.prod.js ├── LICENSE ├── README.md ├── SECURITY.md ├── SUPPORT.md └── Screenshots ├── chatwidget.png ├── chatwidgetsettings.png ├── constants.png ├── logo.png └── newchatwidget.png /.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/.DS_Store -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | /v2 2 | /v3 3 | CometChatWorkspace/build/ 4 | CometChatWorkspace/node_modules/ 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/CONSTS.js: -------------------------------------------------------------------------------- 1 | // Eg: If URL is set as https://your_domain.com/widget 2 | // cometchatwidget.js will be available at https://your_domain.com/widget/cometchatwidget.js 3 | module.exports = { 4 | URL: "https://your_domain.com/widget", 5 | }; -------------------------------------------------------------------------------- /CometChatWorkspace/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "chat-widget", 3 | "version": "3.0.6-2", 4 | "devDependencies": { 5 | "@babel/core": "7.7.7", 6 | "@babel/plugin-proposal-class-properties": "7.7.4", 7 | "@babel/plugin-proposal-object-rest-spread": "^7.8.3", 8 | "@babel/plugin-transform-react-jsx": "^7.10.4", 9 | "@babel/polyfill": "^7.8.3", 10 | "@babel/preset-env": "^7.8.3", 11 | "babel-loader": "^8.0.6", 12 | "buffer": "^6.0.3", 13 | "clean-webpack-plugin": "^3.0.0", 14 | "copy-webpack-plugin": "^7.0.0", 15 | "css-loader": "^3.4.1", 16 | "file-loader": "^6.0.0", 17 | "mini-css-extract-plugin": "^0.10.0", 18 | "sass-loader": "^8.0.0", 19 | "style-loader": "^1.1.2", 20 | "webpack": "^5.0.0", 21 | "webpack-cli": "^4.5.0", 22 | "webpack-dev-server": "^3.10.1", 23 | "webpack-merge": "^5.1.2" 24 | }, 25 | "dependencies": { 26 | "@cometchat-pro/chat": "3.0.12", 27 | "@emotion/cache": "^11.10.5", 28 | "@emotion/react": "^11.0.0", 29 | "@twemoji/api": "^14.1.0", 30 | "buffer": "^6.0.3", 31 | "classnames": "^2.2.6", 32 | "dateformat": "^4.0.0", 33 | "html-react-parser": "^1.4.5", 34 | "react": "^17.0.2", 35 | "react-dom": "^17.0.2", 36 | "react-frame-component": "^4.1.3", 37 | "react-router-dom": "^5.2.0", 38 | "sass": "^1.57.1", 39 | "stylis-plugin-extra-scope": "^0.2.1" 40 | }, 41 | "scripts": { 42 | "start": "webpack serve --config webpack.dev.js", 43 | "build:local": "NODE_ENV=local webpack --config webpack.dev.js", 44 | "build:dev": "NODE_ENV=development webpack --config webpack.dev.js", 45 | "build": "NODE_ENV=production webpack --config webpack.prod.js", 46 | "build:custom": "NODE_ENV=custom webpack --config webpack.prod.js" 47 | }, 48 | "serve": { 49 | "content": [ 50 | "./v3" 51 | ] 52 | }, 53 | "homepage": "." 54 | } 55 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/CometChatWidgetEvent.js: -------------------------------------------------------------------------------- 1 | export default class CometChatWidgetEvent { 2 | 3 | static _triggers = {}; 4 | 5 | static on(event, callback) { 6 | if (!CometChatWidgetEvent._triggers[event]) 7 | CometChatWidgetEvent._triggers[event] = []; 8 | CometChatWidgetEvent._triggers[event].push(callback); 9 | } 10 | 11 | static triggerHandler(event, params) { 12 | if (CometChatWidgetEvent._triggers[event]) { 13 | for (const i in CometChatWidgetEvent._triggers[event]) 14 | CometChatWidgetEvent._triggers[event][i](params); 15 | } 16 | } 17 | 18 | static remove(event) { 19 | if (CometChatWidgetEvent._triggers[event]) { 20 | delete CometChatWidgetEvent._triggers[event]; 21 | } 22 | } 23 | } -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/.DS_Store -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/.babelrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["@babel/preset-env", "@babel/preset-react"], 3 | "plugins": [ 4 | "@babel/plugin-proposal-class-properties", 5 | "@babel/plugin-transform-react-jsx", 6 | "@babel/plugin-transform-runtime" 7 | ] 8 | } 9 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "cometchat-pro-react-ui-kit", 3 | "version": "3.0.11-2", 4 | "description": "CometChat UI Kit for React App", 5 | "author": "CometChat", 6 | "dependencies": { 7 | "react": "^17.0.2", 8 | "react-dom": "^17.0.2", 9 | "react-scripts": "^4.0.3", 10 | "@cometchat-pro/chat": "3.0.11", 11 | "@emotion/react": "^11", 12 | "dateformat": "^4.0.0", 13 | "html-react-parser": "^1.4.5", 14 | "@twemoji/api": "^14.1.0" 15 | }, 16 | "devDependencies": { 17 | "web-vitals": "^3.0.4", 18 | "jest": "26.6.0", 19 | "jest-canvas-mock": "^2.3.1", 20 | "babel-jest": "26.6.0" 21 | }, 22 | "scripts": { 23 | "test": "jest" 24 | }, 25 | "jest": { 26 | "moduleNameMapper": { 27 | "\\.(css|scss|png|svg|pdf|jpg|jpeg|wav)$": "/src/resources/__mocks__/fileMock.js" 28 | } 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Calls/CometChatCallScreen/resources/increase-size.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Calls/CometChatCallScreen/resources/reduce-size.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Calls/CometChatIncomingCall/controller.js: -------------------------------------------------------------------------------- 1 | import { CometChat } from "@cometchat-pro/chat"; 2 | 3 | import * as enums from "../../../util/enums.js"; 4 | 5 | export class CallAlertManager { 6 | callListenerId = "incoming_call_" + new Date().getTime(); 7 | 8 | attachListeners(callback) { 9 | CometChat.addCallListener( 10 | this.callListenerId, 11 | new CometChat.CallListener({ 12 | onIncomingCallReceived: (call) => { 13 | callback(enums.INCOMING_CALL_RECEIVED, call); 14 | }, 15 | onIncomingCallCancelled: (call) => { 16 | callback(enums.INCOMING_CALL_CANCELLED, call); 17 | }, 18 | onOutgoingCallAccepted: (call) => { 19 | callback(enums.OUTGOING_CALL_ACCEPTED, call); 20 | }, 21 | }) 22 | ); 23 | } 24 | 25 | removeListeners() { 26 | CometChat.removeCallListener(this.callListenerId); 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Calls/CometChatIncomingCall/resources/incoming-call.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Calls/CometChatIncomingCall/resources/incoming-video-call.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Calls/CometChatIncomingDirectCall/controller.js: -------------------------------------------------------------------------------- 1 | import { CometChat } from "@cometchat-pro/chat"; 2 | 3 | import * as enums from "../../../util/enums.js"; 4 | 5 | export class messageAlertManager { 6 | msgListenerId = "incoming_message_" + new Date().getTime(); 7 | 8 | attachListeners(callback) { 9 | CometChat.addMessageListener( 10 | this.msgListenerId, 11 | new CometChat.MessageListener({ 12 | onCustomMessageReceived: (customMessage) => { 13 | callback(enums.CUSTOM_MESSAGE_RECEIVED, customMessage); 14 | }, 15 | }) 16 | ); 17 | } 18 | 19 | removeListeners() { 20 | CometChat.removeMessageListener(this.msgListenerId); 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Calls/CometChatIncomingDirectCall/resources/incoming-video-call.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Calls/CometChatOutgoingCall/controller.js: -------------------------------------------------------------------------------- 1 | import { CometChat } from "@cometchat-pro/chat"; 2 | 3 | import * as enums from "../../../util/enums.js"; 4 | 5 | export class CallScreenManager { 6 | callListenerId = "callscreen_" + new Date().getTime(); 7 | 8 | attachListeners(callback) { 9 | CometChat.addCallListener( 10 | this.callListenerId, 11 | new CometChat.CallListener({ 12 | onOutgoingCallAccepted: (call) => { 13 | callback(enums.OUTGOING_CALL_ACCEPTED, call); 14 | }, 15 | onOutgoingCallRejected: (call) => { 16 | callback(enums.OUTGOING_CALL_REJECTED, call); 17 | }, 18 | onIncomingCallCancelled: (call) => { 19 | callback(enums.INCOMING_CALL_CANCELLED, call); 20 | }, 21 | }) 22 | ); 23 | } 24 | 25 | removeListeners() { 26 | CometChat.removeCallListener(this.callListenerId); 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Calls/CometChatOutgoingCall/resources/end-call.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Calls/CometChatOutgoingDirectCall/style.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Calls/CometChatOutgoingDirectCall/style.js -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Calls/index.js: -------------------------------------------------------------------------------- 1 | export { CometChatIncomingCall } from "./CometChatIncomingCall"; 2 | export { CometChatOutgoingCall } from "./CometChatOutgoingCall"; 3 | export { CometChatIncomingDirectCall } from "./CometChatIncomingDirectCall"; 4 | export { CometChatOutgoingDirectCall } from "./CometChatOutgoingDirectCall"; 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Chats/CometChatConversationList/resources/back.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Chats/CometChatConversationListActions/resources/delete.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Chats/CometChatConversationListActions/style.js: -------------------------------------------------------------------------------- 1 | export const conversationActionStyle = (context) => { 2 | return { 3 | display: "flex", 4 | listStyleType: "none", 5 | padding: "8px", 6 | margin: "0", 7 | width: "72px", 8 | backgroundColor: `${context.theme.backgroundColor.primary}`, 9 | borderRadius: "4px", 10 | alignItems: "center", 11 | justifyContent: "flex-end", 12 | position: "absolute", 13 | right: "16px", 14 | height: "100%", 15 | }; 16 | }; 17 | 18 | export const groupButtonStyle = ( 19 | actionInProgress, 20 | progressIcon, 21 | actionIcon 22 | ) => { 23 | const backgroundImage = actionInProgress ? progressIcon : actionIcon; 24 | 25 | return { 26 | outline: "0", 27 | border: "0", 28 | height: "24px", 29 | width: "24px", 30 | borderRadius: "4px", 31 | alignItems: "center", 32 | display: "inline-flex", 33 | justifyContent: "center", 34 | position: "relative", 35 | background: `url(${backgroundImage}) center center no-repeat`, 36 | }; 37 | }; 38 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Chats/CometChatConversationListItem/test.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import ReactDOM from "react-dom"; 3 | import { act } from "react-dom/test-utils"; 4 | import "jest-canvas-mock"; 5 | 6 | import { CometChatContextProvider } from "../../../util/CometChatContext"; 7 | import { CometChatConversationListItem } from "./"; 8 | 9 | describe("CometChatConversationListItem", () => { 10 | let container = null; 11 | 12 | it("renders without crashing", () => { 13 | container = document.createElement("div"); 14 | ReactDOM.render( 15 | 16 | 17 | , 18 | container 19 | ); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Chats/CometChatConversationListWithMessages/controller.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Chats/CometChatConversationListWithMessages/controller.js -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Chats/CometChatConversationListWithMessages/style.js: -------------------------------------------------------------------------------- 1 | export const chatScreenStyle = (props) => { 2 | return { 3 | display: "flex", 4 | height: "100%", 5 | width: "100%", 6 | boxSizing: "border-box", 7 | position: "relative", 8 | fontFamily: `${props.theme.fontFamily}`, 9 | border: `1px solid ${props.theme.borderColor.primary}`, 10 | "*": { 11 | boxSizing: "border-box", 12 | fontFamily: `${props.theme.fontFamily}`, 13 | "::-webkit-scrollbar": { 14 | width: "8px", 15 | height: "4px", 16 | }, 17 | "::-webkit-scrollbar-track": { 18 | background: "#ffffff00", 19 | }, 20 | "::-webkit-scrollbar-thumb": { 21 | background: "#ccc", 22 | "&:hover": { 23 | background: "#aaa", 24 | }, 25 | }, 26 | }, 27 | }; 28 | }; 29 | 30 | export const chatScreenSidebarStyle = (state, props) => { 31 | const sidebarView = state.sidebarview 32 | ? { 33 | left: "0", 34 | boxShadow: "rgba(0, 0, 0, .4) -30px 0 30px 30px", 35 | } 36 | : {}; 37 | 38 | const mq = [...props.theme.breakPoints]; 39 | 40 | return { 41 | width: "280px", 42 | borderRight: `1px solid ${props.theme.borderColor.primary}`, 43 | height: "100%", 44 | position: "relative", 45 | display: "flex", 46 | flexDirection: "column", 47 | "> .chats": { 48 | height: "calc(100% - 5px)", 49 | }, 50 | [`@media ${mq[0]}`]: { 51 | position: "absolute!important", 52 | left: "-100%", 53 | top: "0", 54 | bottom: "0", 55 | width: "100%!important", 56 | zIndex: "2", 57 | backgroundColor: `${props.theme.backgroundColor.white}`, 58 | transition: "all .3s ease-out", 59 | ...sidebarView, 60 | }, 61 | }; 62 | }; 63 | 64 | export const chatScreenMainStyle = (state, props) => { 65 | const mq = [...props.theme.breakPoints]; 66 | 67 | return { 68 | width: "calc(100% - 280px)", 69 | height: "100%", 70 | order: "2", 71 | display: "flex", 72 | flexDirection: "row", 73 | [`@media ${mq[1]}, ${mq[2]}`]: { 74 | width: "100%", 75 | }, 76 | }; 77 | }; 78 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Chats/index.js: -------------------------------------------------------------------------------- 1 | export { CometChatConversationList } from "./CometChatConversationList"; 2 | export { CometChatConversationListItem } from "./CometChatConversationListItem"; 3 | export { CometChatConversationListWithMessages } from "./CometChatConversationListWithMessages"; 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/CometChatUI/CometChatNavBar/resources/calls.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/CometChatUI/CometChatNavBar/resources/chats.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/CometChatUI/CometChatNavBar/resources/groups.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/CometChatUI/CometChatNavBar/resources/more.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/CometChatUI/CometChatNavBar/resources/users.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/CometChatUI/CometChatNavBar/style.js: -------------------------------------------------------------------------------- 1 | export const footerStyle = () => { 2 | return { 3 | width: "100%", 4 | zIndex: "1", 5 | height: "64px", 6 | }; 7 | }; 8 | 9 | export const navbarStyle = () => { 10 | return { 11 | display: "flex", 12 | flexDirection: "row", 13 | alignItems: "center", 14 | justifyContent: "space-around", 15 | width: "100%", 16 | height: "100%", 17 | }; 18 | }; 19 | 20 | export const itemStyle = (props) => { 21 | return { 22 | padding: "8px", 23 | cursor: "pointer", 24 | display: "flex", 25 | flexDirection: "column", 26 | justifyContent: "center", 27 | alignItems: "center", 28 | fontSize: "12px", 29 | color: `${props.theme.color.helpText}`, 30 | }; 31 | }; 32 | 33 | export const itemLinkStyle = (icon, isActive, context) => { 34 | let activeStateBg = isActive 35 | ? { 36 | backgroundColor: `${context.theme.primaryColor}`, 37 | } 38 | : { 39 | backgroundColor: `${context.theme.secondaryTextColor}`, 40 | }; 41 | 42 | return { 43 | height: "24px", 44 | width: "24px", 45 | display: "inline-block", 46 | mask: `url(${icon}) no-repeat center center`, 47 | ...activeStateBg, 48 | }; 49 | }; 50 | 51 | export const itemLinkTextStyle = (isActive, context) => { 52 | const colorProp = isActive 53 | ? { 54 | color: `${context.theme.primaryColor}`, 55 | } 56 | : { 57 | color: `${context.theme.secondaryTextColor}`, 58 | }; 59 | 60 | return { 61 | ...colorProp, 62 | paddingTop: "2px", 63 | }; 64 | }; 65 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/CometChatUI/controller.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/CometChatUI/controller.js -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/CometChatUI/style.js: -------------------------------------------------------------------------------- 1 | export const unifiedStyle = (props) => { 2 | return { 3 | display: "flex", 4 | height: "100%", 5 | width: "100%", 6 | boxSizing: "border-box", 7 | fontFamily: `${props.theme.fontFamily}`, 8 | border: `1px solid ${props.theme.borderColor.primary}`, 9 | position: "relative", 10 | "*": { 11 | boxSizing: "border-box", 12 | fontFamily: `${props.theme.fontFamily}`, 13 | "::-webkit-scrollbar": { 14 | width: "8px", 15 | height: "4px", 16 | }, 17 | "::-webkit-scrollbar-track": { 18 | background: "#ffffff00", 19 | }, 20 | "::-webkit-scrollbar-thumb": { 21 | background: "#ccc", 22 | "&:hover": { 23 | background: "#aaa", 24 | }, 25 | }, 26 | }, 27 | }; 28 | }; 29 | 30 | export const unifiedSidebarStyle = (state, props) => { 31 | const sidebarView = state.sidebarview 32 | ? { 33 | left: "0", 34 | boxShadow: "rgba(0, 0, 0, .4) -30px 0 30px 30px", 35 | } 36 | : {}; 37 | 38 | const mq = [...props.theme.breakPoints]; 39 | 40 | return { 41 | width: "280px", 42 | borderRight: `1px solid ${props.theme.borderColor.primary}`, 43 | height: "100%", 44 | position: "relative", 45 | display: "flex", 46 | flexDirection: "column", 47 | "> .contacts, .chats, .groups, .userinfo": { 48 | height: "calc(100% - 64px)", 49 | }, 50 | [`@media ${mq[0]}`]: { 51 | position: "absolute!important", 52 | left: "-100%", 53 | top: "0", 54 | bottom: "0", 55 | width: "100%!important", 56 | zIndex: "2", 57 | backgroundColor: `${props.theme.backgroundColor.white}`, 58 | transition: "all .3s ease-out", 59 | ...sidebarView, 60 | }, 61 | }; 62 | }; 63 | 64 | export const unifiedMainStyle = (state, props) => { 65 | const mq = [...props.theme.breakPoints]; 66 | 67 | return { 68 | width: "calc(100% - 280px)", 69 | height: "100%", 70 | order: "2", 71 | display: "flex", 72 | flexDirection: "row", 73 | [`@media ${mq[1]}, ${mq[2]}`]: { 74 | width: "100%", 75 | }, 76 | }; 77 | }; 78 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatAddGroupMemberList/resources/close.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatAddGroupMemberList/resources/search.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatAddGroupMemberListItem/resources/group-member-select.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatAddGroupMemberListItem/resources/group-member-unselect.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatAddGroupMemberListItem/style.js: -------------------------------------------------------------------------------- 1 | export const modalRowStyle = (theme) => { 2 | return { 3 | border: `1px solid ${theme.borderColor.primary}`, 4 | display: "flex", 5 | width: "100%", 6 | fontSize: "14px", 7 | flexDirection: "row", 8 | justifyContent: "flex-start", 9 | alignItems: "center", 10 | "&:not(:last-child)": { 11 | borderBottom: "none", 12 | }, 13 | }; 14 | }; 15 | 16 | export const modalColumnStyle = () => { 17 | return { 18 | padding: "8px", 19 | width: "calc(100% - 50px)", 20 | }; 21 | }; 22 | 23 | export const avatarStyle = () => { 24 | return { 25 | display: "inline-block", 26 | float: "left", 27 | width: "36px", 28 | height: "36px", 29 | marginRight: "8px", 30 | }; 31 | }; 32 | 33 | export const nameStyle = () => { 34 | return { 35 | margin: "10px", 36 | width: "calc(100% - 50px)", 37 | overflow: "hidden", 38 | textOverflow: "ellipsis", 39 | whiteSpace: "nowrap", 40 | }; 41 | }; 42 | 43 | export const selectionColumnStyle = () => { 44 | return { 45 | padding: "8px", 46 | width: "50px", 47 | display: "flex", 48 | justifyContent: "center", 49 | alignItems: "center", 50 | }; 51 | }; 52 | 53 | export const selectionBoxStyle = (inactiveStateImg, activeStateImg, theme) => { 54 | return { 55 | display: "none", 56 | " + label": { 57 | display: "block", 58 | cursor: "pointer", 59 | userSelect: "none", 60 | padding: "8px", 61 | width: "100%", 62 | mask: `url(${inactiveStateImg}) center center no-repeat`, 63 | backgroundColor: `${theme.secondaryTextColor}`, 64 | }, 65 | "&:checked + label": { 66 | width: "100%", 67 | mask: `url(${activeStateImg}) center center no-repeat`, 68 | backgroundColor: `${theme.secondaryTextColor}`, 69 | }, 70 | }; 71 | }; 72 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatBanGroupMemberList/resources/close.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatBanGroupMemberListItem/resources/ban-member.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatBanGroupMemberListItem/style.js: -------------------------------------------------------------------------------- 1 | export const modalRowStyle = (context) => { 2 | return { 3 | borderLeft: `1px solid ${context.theme.borderColor.primary}`, 4 | borderRight: `1px solid ${context.theme.borderColor.primary}`, 5 | borderBottom: `1px solid ${context.theme.borderColor.primary}`, 6 | display: "flex", 7 | width: "100%", 8 | fontSize: "14px", 9 | flexDirection: "row", 10 | justifyContent: "flex-start", 11 | alignItems: "center", 12 | padding: "8px", 13 | }; 14 | }; 15 | 16 | export const userStyle = (context) => { 17 | const mq = context.theme.breakPoints.map((x) => `@media ${x}`); 18 | 19 | return { 20 | width: "calc(100% - 220px)", 21 | [mq[0]]: { 22 | width: "calc(100% - 185px)", 23 | }, 24 | [mq[1]]: { 25 | width: "calc(100% - 185px)", 26 | }, 27 | [mq[2]]: { 28 | width: "calc(100% - 185px)", 29 | }, 30 | }; 31 | }; 32 | 33 | export const avatarStyle = () => { 34 | return { 35 | display: "inline-block", 36 | float: "left", 37 | width: "36px", 38 | height: "36px", 39 | marginRight: "8px", 40 | }; 41 | }; 42 | 43 | export const nameStyle = () => { 44 | return { 45 | margin: "10px 0 0 0", 46 | width: "calc(100% - 50px)", 47 | overflow: "hidden", 48 | textOverflow: "ellipsis", 49 | whiteSpace: "nowrap", 50 | }; 51 | }; 52 | 53 | export const roleStyle = (context) => { 54 | const mq = context.theme.breakPoints.map((x) => `${x}`); 55 | 56 | return { 57 | width: "150px", 58 | fontSize: "12px", 59 | [`@media ${mq[1]}, ${mq[2]}`]: { 60 | width: "115px", 61 | }, 62 | }; 63 | }; 64 | 65 | export const actionStyle = (img, context) => { 66 | return { 67 | width: "70px", 68 | i: { 69 | width: "24px", 70 | height: "24px", 71 | cursor: "pointer", 72 | mask: `url(${img}) center center no-repeat`, 73 | backgroundColor: `${context.theme.secondaryTextColor}`, 74 | display: "inline-block", 75 | }, 76 | }; 77 | }; 78 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatCreateGroup/controller.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatCreateGroup/controller.js -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatCreateGroup/resources/close.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatGroupDetails/context.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | const GroupDetailContext = React.createContext({ 4 | memberlist: [], 5 | bannedmemberlist: [], 6 | administratorslist: [], 7 | moderatorslist: [], 8 | }); 9 | 10 | export default GroupDetailContext; 11 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatGroupDetails/resources/back.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatGroupList/resources/back.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatGroupList/resources/create.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatGroupList/resources/search.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatGroupListItem/resources/password-protected-group.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatGroupListItem/test.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import ReactDOM from "react-dom"; 3 | import { act } from "react-dom/test-utils"; 4 | import "jest-canvas-mock"; 5 | 6 | import { CometChatContextProvider } from "../../../util/CometChatContext"; 7 | import { CometChatGroupListItem } from "./"; 8 | 9 | describe("CometChatGroupListItem", () => { 10 | let container = null; 11 | 12 | it("renders without crashing", () => { 13 | container = document.createElement("div"); 14 | ReactDOM.render( 15 | 16 | 17 | , 18 | container 19 | ); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatGroupListWithMessages/controller.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatGroupListWithMessages/controller.js -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatGroupListWithMessages/style.js: -------------------------------------------------------------------------------- 1 | export const groupScreenStyle = (props) => { 2 | return { 3 | display: "flex", 4 | height: "100%", 5 | width: "100%", 6 | boxSizing: "border-box", 7 | fontFamily: `${props.theme.fontFamily}`, 8 | border: `1px solid ${props.theme.borderColor.primary}`, 9 | "*": { 10 | boxSizing: "border-box", 11 | fontFamily: `${props.theme.fontFamily}`, 12 | "::-webkit-scrollbar": { 13 | width: "8px", 14 | height: "4px", 15 | }, 16 | "::-webkit-scrollbar-track": { 17 | background: "#ffffff00", 18 | }, 19 | "::-webkit-scrollbar-thumb": { 20 | background: "#ccc", 21 | "&:hover": { 22 | background: "#aaa", 23 | }, 24 | }, 25 | }, 26 | }; 27 | }; 28 | 29 | export const groupScreenSidebarStyle = (state, props) => { 30 | const sidebarView = state.sidebarview 31 | ? { 32 | left: "0", 33 | boxShadow: "rgba(0, 0, 0, .4) -30px 0 30px 30px", 34 | } 35 | : {}; 36 | 37 | const mq = [...props.theme.breakPoints]; 38 | 39 | return { 40 | width: "280px", 41 | borderRight: `1px solid ${props.theme.borderColor.primary}`, 42 | height: "100%", 43 | position: "relative", 44 | display: "flex", 45 | flexDirection: "column", 46 | ".groups": { 47 | height: "calc(100% - 5px)", 48 | }, 49 | [`@media ${mq[0]}`]: { 50 | position: "absolute!important", 51 | left: "-100%", 52 | top: "0", 53 | bottom: "0", 54 | width: "100%!important", 55 | zIndex: "2", 56 | backgroundColor: `${props.theme.backgroundColor.white}`, 57 | transition: "all .3s ease-out", 58 | ...sidebarView, 59 | }, 60 | }; 61 | }; 62 | 63 | export const groupScreenMainStyle = (state, props) => { 64 | const mq = [...props.theme.breakPoints]; 65 | 66 | return { 67 | width: "calc(100% - 280px)", 68 | height: "100%", 69 | order: "2", 70 | display: "flex", 71 | flexDirection: "row", 72 | [`@media ${mq[1]}, ${mq[2]}`]: { 73 | width: "100%", 74 | }, 75 | }; 76 | }; 77 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatTransferOwnershipMemberList/resources/close.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatTransferOwnershipMemberListItem/resources/group-member-select.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatTransferOwnershipMemberListItem/resources/group-member-unselect.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatViewGroupMemberList/resources/close.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatViewGroupMemberListItem/resources/ban-member.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatViewGroupMemberListItem/resources/close.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatViewGroupMemberListItem/resources/delete.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatViewGroupMemberListItem/resources/done.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/CometChatViewGroupMemberListItem/resources/edit.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Groups/index.js: -------------------------------------------------------------------------------- 1 | export { CometChatCreateGroup } from "./CometChatCreateGroup"; 2 | export { CometChatGroupDetails } from "./CometChatGroupDetails"; 3 | export { CometChatGroupList } from "./CometChatGroupList"; 4 | export { CometChatGroupListItem } from "./CometChatGroupListItem"; 5 | export { CometChatViewGroupMemberList } from "./CometChatViewGroupMemberList"; 6 | export { CometChatViewGroupMemberListItem } from "./CometChatViewGroupMemberListItem"; 7 | export { CometChatAddGroupMemberList } from "./CometChatAddGroupMemberList"; 8 | export { CometChatAddGroupMemberListItem } from "./CometChatAddGroupMemberListItem"; 9 | export { CometChatBanGroupMemberList } from "./CometChatBanGroupMemberList"; 10 | export { CometChatBanGroupMemberListItem } from "./CometChatBanGroupMemberListItem"; 11 | export { CometChatGroupListWithMessages } from "./CometChatGroupListWithMessages"; 12 | export { CometChatTransferOwnershipMemberList } from "./CometChatTransferOwnershipMemberList"; 13 | export { CometChatTransferOwnershipMemberListItem } from "./CometChatTransferOwnershipMemberListItem"; 14 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatActionMessageBubble/style.js: -------------------------------------------------------------------------------- 1 | export const actionMessageStyle = () => { 2 | return { 3 | padding: "8px 16px", 4 | marginBottom: "16px", 5 | textAlign: "center", 6 | height: "36px", 7 | }; 8 | }; 9 | 10 | export const actionMessageTxtStyle = () => { 11 | return { 12 | fontSize: "13.5px", 13 | margin: "0", 14 | lineHeight: "20px", 15 | }; 16 | }; 17 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatBlockedUser/style.js: -------------------------------------------------------------------------------- 1 | export const blockedMessageWrapperStyle = () => { 2 | return { 3 | padding: "16px", 4 | display: "flex", 5 | flexDirection: "column", 6 | alignItems: "center", 7 | justifyContent: "center", 8 | backgroundColor: "#fff", 9 | zIndex: "1", 10 | order: "3", 11 | position: "relative", 12 | flex: "none", 13 | minHeight: "105px", 14 | width: "100%", 15 | margin: "auto", 16 | }; 17 | }; 18 | 19 | export const blockedMessageContainerStyle = () => { 20 | return { 21 | display: "flex", 22 | flexDirection: "column", 23 | alignItems: "center", 24 | justifyContent: "center", 25 | }; 26 | }; 27 | 28 | export const blockedTitleStyle = () => { 29 | return { 30 | fontSize: "20px", 31 | fontWeight: "700", 32 | textAlign: "center", 33 | }; 34 | }; 35 | 36 | export const bockedSubTitleStyle = (context) => { 37 | return { 38 | margin: "16px 0", 39 | textAlign: "center", 40 | color: context.theme.color.helpText, 41 | }; 42 | }; 43 | 44 | export const unblockButtonStyle = (context) => { 45 | const mq = [...context.theme.breakPoints]; 46 | 47 | const widthProp = { 48 | width: "15%", 49 | [`@media ${mq[1]}`]: { 50 | width: "70%", 51 | }, 52 | [`@media ${mq[2]}`]: { 53 | width: "50%", 54 | }, 55 | [`@media ${mq[3]}`]: { 56 | width: "30%", 57 | }, 58 | [`@media ${mq[4]}`]: { 59 | width: "20%", 60 | }, 61 | }; 62 | 63 | return { 64 | ...widthProp, 65 | padding: "8px 16px", 66 | margin: "0", 67 | borderRadius: "12px", 68 | backgroundColor: `${context.theme.primaryColor}!important`, 69 | color: `${context.theme.color.white}`, 70 | }; 71 | }; 72 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatEmojiKeyboard/Emoji.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @class CometChatEmoji 3 | * @description CometChatEmoji class is used for defining the emoji. 4 | * 5 | * @param {String} char 6 | * @param {Array} keywords 7 | */ 8 | class CometChatEmoji { 9 | char = ""; 10 | keywords = []; 11 | constructor({ char, keywords }) { 12 | this.char = char; 13 | this.keywords = keywords; 14 | } 15 | } 16 | 17 | export { CometChatEmoji }; 18 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatEmojiKeyboard/EmojiCategory.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @class CometChatEmojiCategory 3 | * @description CometChatEmojiCategory class is used for defining the category. 4 | * @param {String} id 5 | * @param {String} name 6 | * @param {String} symbol 7 | * @param {Object} emojis 8 | */ 9 | class CometChatEmojiCategory { 10 | id = ""; 11 | name = ""; 12 | symbol = ""; 13 | emojis = {}; 14 | constructor({ id, name, emojis, symbol }) { 15 | this.id = id; 16 | this.name = name; 17 | this.emojis = emojis; 18 | this.symbol = symbol; 19 | } 20 | } 21 | 22 | export { CometChatEmojiCategory }; 23 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatEmojiKeyboard/resources/flags.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | Icons/24 Emoji/Flags 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatEmojiKeyboard/style.js: -------------------------------------------------------------------------------- 1 | export const emojiContainerStyle = (props) => { 2 | return { 3 | padding: "0px", 4 | overflowY: "scroll", 5 | position: "relative", 6 | width: props.style.width, 7 | height: props.style.height, 8 | background: props?.style?.background, 9 | boxShadow: "0px 0px 10px #ddd", 10 | zIndex: "9", 11 | }; 12 | }; 13 | 14 | export const emojiListStyle = () => { 15 | return { 16 | display: "flex", 17 | flexWrap: "wrap", 18 | justifyContent: "space-evenly", 19 | }; 20 | }; 21 | 22 | export const emojiCategoryWrapper = () => { 23 | return { 24 | justifyContent: "center", 25 | alignItems: "center", 26 | }; 27 | }; 28 | 29 | export const emojiCategoryTitle = (props) => { 30 | return { 31 | textAlign: "left", 32 | paddingLeft: "16px", 33 | paddingTop: "8px", 34 | font: props.style.sectionHeaderFont, 35 | color: props.style.sectionHeaderColor, 36 | }; 37 | }; 38 | 39 | export const emojiTabLsitStyle = (props) => { 40 | return { 41 | width: "100%", 42 | zIndex: "9", 43 | display: "flex", 44 | flexWrap: "wrap", 45 | padding: "15px 8px", 46 | position: "sticky", 47 | bottom: "0px", 48 | alignItems: "center", 49 | justifyContent: "space-around", 50 | background: props?.style?.background, 51 | }; 52 | }; 53 | 54 | /**Child props style */ 55 | export const getListStyle = () => { 56 | return { 57 | width: "24px", 58 | height: "24px", 59 | cursor: "pointer", 60 | alignItems: "center", 61 | justifyContent: "center", 62 | iconTint: "#3399ff", 63 | iconBackground: "rgba(20, 20, 20, 0.58)", 64 | }; 65 | }; 66 | 67 | export const listStyle = (props) => { 68 | return { 69 | padding: "10px", 70 | display: "flex", 71 | cursor: "pointer", 72 | borderRadius: "3px", 73 | alignItems: "center", 74 | justifyContent: "center", 75 | textFont: "700 22px Inter,sand-serif", 76 | background: props.style?.background, 77 | }; 78 | }; 79 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatImageViewer/index.js: -------------------------------------------------------------------------------- 1 | import React, { useContext } from "react"; 2 | /** @jsxRuntime classic */ 3 | /** @jsx jsx */ 4 | import { jsx } from "@emotion/react"; 5 | import PropTypes from "prop-types"; 6 | 7 | import { CometChatBackdrop } from "../../Shared"; 8 | import { CometChatContext } from "../../../util/CometChatContext"; 9 | 10 | import { imageWrapperStyle, imgStyle } from "./style"; 11 | 12 | import loadingIcon from "./resources/ring.svg"; 13 | import closeIcon from "./resources/close.svg"; 14 | 15 | const CometChatImageViewer = (props) => { 16 | const context = useContext(CometChatContext); 17 | const [image, setImage] = React.useState(null); 18 | 19 | let img = new Image(); 20 | img.src = props.message?.data?.attachments[0].url; 21 | 22 | img.onload = () => { 23 | setImage(img.src); 24 | }; 25 | 26 | let imageIcon = null; 27 | if (image) { 28 | imageIcon = image; 29 | } else { 30 | imageIcon = loadingIcon; 31 | } 32 | 33 | return ( 34 | 35 | 36 |
41 | {imageIcon} 42 |
43 | 44 | ); 45 | }; 46 | 47 | // Specifies the default values for props: 48 | CometChatImageViewer.defaultProps = { 49 | count: 0, 50 | close: () => {}, 51 | }; 52 | 53 | CometChatImageViewer.propTypes = { 54 | show: PropTypes.bool, 55 | close: PropTypes.func, 56 | message: PropTypes.object.isRequired, 57 | }; 58 | 59 | export { CometChatImageViewer }; 60 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatImageViewer/resources/close.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatImageViewer/resources/ring.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatImageViewer/style.js: -------------------------------------------------------------------------------- 1 | export const imageWrapperStyle = (context, closeIcon, img) => { 2 | const heightProps = img 3 | ? { 4 | height: "auto", 5 | } 6 | : { 7 | height: "100%", 8 | }; 9 | 10 | const mq = [...context.theme.breakPoints]; 11 | 12 | return { 13 | position: "absolute", 14 | top: "0", 15 | left: "0", 16 | bottom: "0", 17 | right: "0", 18 | width: "100%", 19 | padding: "1.8% 2.3%", 20 | zIndex: "9999", 21 | display: "flex", 22 | justifyContent: "center", 23 | alignItems: "center", 24 | background: `url(${closeIcon}) no-repeat 99% 0.8% #fff`, 25 | cursor: "pointer", 26 | paddingTop:"26px", 27 | ...heightProps, 28 | [`@media ${mq[1]}, ${mq[2]}`]: { 29 | height: "100%", 30 | }, 31 | }; 32 | }; 33 | 34 | export const imgStyle = (image) => { 35 | const sizeProps = !image 36 | ? { 37 | width: "24px", 38 | height: "24px", 39 | } 40 | : { 41 | maxHeight: "100%", 42 | }; 43 | 44 | return { 45 | objectFit: "contain", 46 | ...sizeProps, 47 | }; 48 | }; 49 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatLiveReactions/resources/heart.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatLiveReactions/resources/heart.png -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatLiveReactions/style.js: -------------------------------------------------------------------------------- 1 | export const reactionContainerStyle = () => { 2 | return { 3 | width: "100px", 4 | height: "calc(100% - 120px)", 5 | overflow: "hidden", 6 | position: "absolute", 7 | top: "70px", 8 | right: "0", 9 | }; 10 | }; 11 | 12 | export const reactionEmojiStyle = () => { 13 | return { 14 | position: "absolute", 15 | color: "#DD4144", 16 | visibility: "hidden", 17 | width: "20px", 18 | height: "20px", 19 | opacity: "1", 20 | transition: "opacity 3s", 21 | "&.fade": { 22 | opacity: "0", 23 | }, 24 | }; 25 | }; 26 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageActions/resources/delete.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageActions/resources/edit.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageActions/resources/send-message-in-private.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageActions/resources/threaded-message.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageComposer/resources/Plus-1.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | Icons/24/Plus 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageComposer/resources/add-circle-filled.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageComposer/resources/attach.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageComposer/resources/audio-file.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageComposer/resources/close.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageComposer/resources/collaborative-document.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageComposer/resources/collaborative-whiteboard.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageComposer/resources/emoji.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageComposer/resources/file-upload.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageComposer/resources/heart.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageComposer/resources/heart.png -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageComposer/resources/image.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageComposer/resources/polls.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageComposer/resources/send-message.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageComposer/resources/stickers.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageComposer/resources/video-upload.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageComposer/resources/video.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageHeader/resources/audio-call.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageHeader/resources/info.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageHeader/resources/menu.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageHeader/resources/video-call.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageList/style.js: -------------------------------------------------------------------------------- 1 | export const chatListStyle = (context) => { 2 | return { 3 | backgroundColor: `${context.theme.backgroundColor.white}`, 4 | zIndex: "1", 5 | width: "100%", 6 | flex: "1 1 0", 7 | order: "2", 8 | position: "relative", 9 | }; 10 | }; 11 | 12 | export const listWrapperStyle = () => { 13 | return { 14 | boxSizing: "border-box", 15 | display: "flex", 16 | flexDirection: "column", 17 | height: "100%", 18 | overflowX: "hidden", 19 | overflowY: "scroll", 20 | position: "absolute", 21 | top: "0", 22 | transition: "background .3s ease-out .1s", 23 | width: "100%", 24 | zIndex: "100", 25 | paddingTop: "16px", 26 | }; 27 | }; 28 | 29 | export const messageDateContainerStyle = () => { 30 | return { 31 | marginBottom: "16px", 32 | display: "flex", 33 | alignItems: "center", 34 | justifyContent: "center", 35 | height: "35px", 36 | }; 37 | }; 38 | 39 | export const messageDateStyle = (context) => { 40 | return { 41 | padding: "8px 12px", 42 | backgroundColor: `${context.theme.backgroundColor.secondary}`, 43 | color: `${context.theme.color.primary}`, 44 | borderRadius: "10px", 45 | }; 46 | }; 47 | 48 | export const decoratorMessageStyle = () => { 49 | return { 50 | overflow: "hidden", 51 | width: "100%", 52 | display: "flex", 53 | justifyContent: "center", 54 | alignItems: "center", 55 | position: "absolute", 56 | top: "50%", 57 | }; 58 | }; 59 | 60 | export const decoratorMessageTxtStyle = (context) => { 61 | return { 62 | margin: "0", 63 | height: "36px", 64 | color: `${context.theme.color.secondary}`, 65 | fontSize: "20px!important", 66 | fontWeight: "600", 67 | lineHeight: "30px", 68 | }; 69 | }; 70 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatMessageThread/resources/close.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatReadReceipt/resources/message-delivered.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatReadReceipt/resources/message-read.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatReadReceipt/resources/message-sent.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatReadReceipt/resources/wait.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatReadReceipt/resources/warning-small.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatReadReceipt/style.js: -------------------------------------------------------------------------------- 1 | export const msgTimestampStyle = (context, props, loggedInUser) => { 2 | return { 3 | display: "flex", 4 | fontSize: "11px", 5 | fontWeight: "500", 6 | lineHeight: "12px", 7 | textTransform: "uppercase", 8 | color: `${context.theme.color.search}`, 9 | }; 10 | }; 11 | 12 | export const iconStyle = (img, color) => { 13 | return { 14 | mask: `url(${img}) center center no-repeat`, 15 | backgroundColor: `${color}`, 16 | display: "inline-block", 17 | width: "24px", 18 | height: "24px", 19 | }; 20 | }; 21 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatReceiverDirectCallBubble/resources/video-call.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatReceiverFileMessageBubble/resources/file-upload.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatReceiverImageMessageBubble/resources/1px.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatReceiverImageMessageBubble/resources/1px.png -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatReceiverVideoMessageBubble/resources/image_placeholder.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatReceiverVideoMessageBubble/resources/image_placeholder.png -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatSenderAudioMessageBubble/style.js: -------------------------------------------------------------------------------- 1 | export const messageContainerStyle = () => { 2 | return { 3 | alignSelf: "flex-end", 4 | marginBottom: "16px", 5 | paddingLeft: "16px", 6 | paddingRight: "16px", 7 | maxWidth: "65%", 8 | clear: "both", 9 | position: "relative", 10 | display: "flex", 11 | flexDirection: "column", 12 | flexShrink: "0", 13 | }; 14 | }; 15 | 16 | export const messageWrapperStyle = () => { 17 | return { 18 | width: "auto", 19 | flex: "1 1", 20 | alignSelf: "flex-end", 21 | display: "flex", 22 | }; 23 | }; 24 | 25 | export const messageAudioWrapperStyle = () => { 26 | return { 27 | display: "inline-block", 28 | borderRadius: "12px", 29 | alignSelf: "flex-end", 30 | " > audio": { 31 | maxWidth: "250px", 32 | display: "inherit", 33 | outline: "none", 34 | }, 35 | }; 36 | }; 37 | 38 | export const messageInfoWrapperStyle = () => { 39 | return { 40 | alignSelf: "flex-end", 41 | display: "flex", 42 | justifyContent: "flex-end", 43 | alignItems: "center", 44 | height: "25px", 45 | }; 46 | }; 47 | 48 | export const messageReactionsWrapperStyle = () => { 49 | return { 50 | display: "flex", 51 | alignSelf: "flex-end", 52 | width: "100%", 53 | flexWrap: "wrap", 54 | justifyContent: "flex-end", 55 | minHeight: "36px", 56 | }; 57 | }; 58 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatSenderDirectCallBubble/resources/video-call.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatSenderFileMessageBubble/resources/file-upload.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatSenderImageMessageBubble/resources/1px.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatSenderImageMessageBubble/resources/1px.png -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatSenderImageMessageBubble/style.js: -------------------------------------------------------------------------------- 1 | export const messageContainerStyle = () => { 2 | return { 3 | alignSelf: "flex-end", 4 | marginBottom: "16px", 5 | paddingLeft: "16px", 6 | paddingRight: "16px", 7 | maxWidth: "65%", 8 | clear: "both", 9 | position: "relative", 10 | display: "flex", 11 | flexDirection: "column", 12 | flexShrink: "0", 13 | }; 14 | }; 15 | 16 | export const messageWrapperStyle = () => { 17 | return { 18 | width: "auto", 19 | flex: "1 1", 20 | alignSelf: "flex-end", 21 | display: "flex", 22 | }; 23 | }; 24 | 25 | export const messageImgWrapper = (context) => { 26 | const mq = [...context.theme.breakPoints]; 27 | 28 | return { 29 | display: "inline-block", 30 | alignSelf: "flex-end", 31 | maxWidth: "300px", 32 | height: "200px", 33 | cursor: "pointer", 34 | flexShrink: "0", 35 | img: { 36 | borderRadius: "8px", 37 | height: "100%", 38 | }, 39 | [`@media ${mq[1]}, ${mq[2]}`]: { 40 | minWidth: "50px", 41 | maxWidth: "150px", 42 | height: "100px", 43 | padding: "2px 2px", 44 | }, 45 | }; 46 | }; 47 | 48 | export const messageInfoWrapperStyle = () => { 49 | return { 50 | alignSelf: "flex-end", 51 | display: "flex", 52 | justifyContent: "flex-end", 53 | alignItems: "center", 54 | height: "25px", 55 | padding: "4px 8px", 56 | }; 57 | }; 58 | 59 | export const messageReactionsWrapperStyle = () => { 60 | return { 61 | display: "flex", 62 | alignSelf: "flex-end", 63 | width: "100%", 64 | flexWrap: "wrap", 65 | justifyContent: "flex-end", 66 | minHeight: "36px", 67 | }; 68 | }; 69 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatSenderVideoMessageBubble/resources/image_placeholder.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatSenderVideoMessageBubble/resources/image_placeholder.png -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatSenderVideoMessageBubble/style.js: -------------------------------------------------------------------------------- 1 | export const messageContainerStyle = () => { 2 | return { 3 | alignSelf: "flex-end", 4 | marginBottom: "16px", 5 | paddingLeft: "16px", 6 | paddingRight: "16px", 7 | maxWidth: "65%", 8 | clear: "both", 9 | position: "relative", 10 | display: "flex", 11 | flexDirection: "column", 12 | flexShrink: "0", 13 | }; 14 | }; 15 | 16 | export const messageWrapperStyle = () => { 17 | return { 18 | width: "auto", 19 | flex: "1 1", 20 | alignSelf: "flex-end", 21 | display: "flex", 22 | }; 23 | }; 24 | 25 | export const messageVideoWrapperStyle = () => { 26 | return { 27 | display: "inline-block", 28 | alignSelf: "flex-end", 29 | " > video": { 30 | maxWidth: "250px", 31 | borderRadius: "12px", 32 | display: "inherit", 33 | }, 34 | }; 35 | }; 36 | 37 | export const messageInfoWrapperStyle = () => { 38 | return { 39 | alignSelf: "flex-end", 40 | display: "flex", 41 | justifyContent: "flex-end", 42 | alignItems: "center", 43 | height: "25px", 44 | padding: "4px 8px", 45 | }; 46 | }; 47 | 48 | export const messageReactionsWrapperStyle = () => { 49 | return { 50 | display: "flex", 51 | alignSelf: "flex-end", 52 | width: "100%", 53 | flexWrap: "wrap", 54 | justifyContent: "flex-end", 55 | minHeight: "36px", 56 | }; 57 | }; 58 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/CometChatThreadedMessageReplyCount/style.js: -------------------------------------------------------------------------------- 1 | export const replyCountStyle = (context) => { 2 | return { 3 | display: "inline-block", 4 | fontSize: "11px", 5 | fontWeight: "500", 6 | lineHeight: "12px", 7 | textTransform: "lowercase", 8 | padding: "0 10px", 9 | cursor: "pointer", 10 | color: context.theme.color.blue, 11 | "&:hover": { 12 | textDecoration: "underline", 13 | }, 14 | }; 15 | }; 16 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/Extensions/CometChatCreatePoll/resources/add-circle-filled.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/Extensions/CometChatCreatePoll/resources/close.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/Extensions/CometChatCreatePollOptions/index.js: -------------------------------------------------------------------------------- 1 | import { useContext } from "react"; 2 | /** @jsxRuntime classic */ 3 | /** @jsx jsx */ 4 | import { jsx } from "@emotion/react"; 5 | 6 | import { CometChatContext } from "../../../../util/CometChatContext"; 7 | 8 | import { iconWrapperStyle } from "../CometChatCreatePoll/style"; 9 | 10 | import Translator from "../../../../resources/localization/translator"; 11 | 12 | import { removeOptionIconStyle } from "./style"; 13 | import removeIcon from "./resources/remove.svg"; 14 | 15 | const CometChatCreatePollOptions = (props) => { 16 | const context = useContext(CometChatContext); 17 | 18 | return ( 19 | 20 |   21 | 22 | props.optionChangeHandler(event, props.option)} 33 | /> 34 | 35 | 36 | props.removePollOption(props.option)} 39 | > 40 | 41 | 42 | ); 43 | }; 44 | 45 | export { CometChatCreatePollOptions }; 46 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/Extensions/CometChatCreatePollOptions/resources/remove.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/Extensions/CometChatCreatePollOptions/style.js: -------------------------------------------------------------------------------- 1 | export const removeOptionIconStyle = (img, context) => { 2 | return { 3 | mask: `url(${img}) center center no-repeat`, 4 | backgroundColor: `${context.theme.color.red}`, 5 | cursor: "pointer", 6 | display: "block", 7 | height: "24px", 8 | width: "24px", 9 | }; 10 | }; 11 | 12 | export const iconWrapperStyle = () => { 13 | return { 14 | width: "50px", 15 | }; 16 | }; 17 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/Extensions/CometChatMessageReactions/style.js: -------------------------------------------------------------------------------- 1 | export const messageReactionsStyle = ( 2 | props, 3 | reactionData, 4 | context, 5 | loggedInUser 6 | ) => { 7 | const uid = loggedInUser?.uid; 8 | let borderStyle = {}; 9 | let hoveredBorderStyle = {}; 10 | 11 | if (reactionData.hasOwnProperty(uid)) { 12 | borderStyle = { 13 | border: `1px solid ${context.theme.primaryColor}`, 14 | }; 15 | 16 | hoveredBorderStyle = { ...borderStyle }; 17 | } else { 18 | borderStyle = { 19 | border: "1px solid transparent", 20 | }; 21 | 22 | hoveredBorderStyle = { 23 | border: `1px solid ${context.theme.borderColor.primary}`, 24 | }; 25 | } 26 | 27 | return { 28 | fontSize: "11px", 29 | padding: "2px 6px", 30 | display: "inline-flex", 31 | alignItems: "center", 32 | verticalAlign: "top", 33 | backgroundColor: `${context.theme.backgroundColor.secondary}`, 34 | borderRadius: "12px", 35 | margin: "4px 4px 0 0", 36 | cursor: "pointer", 37 | ...borderStyle, 38 | ".emoji": { 39 | display: "inline-flex", 40 | alignItems: "center", 41 | justifyContent: "center", 42 | cursor: "pointer", 43 | fontSize: "16px", 44 | }, 45 | "&:hover": { 46 | ...hoveredBorderStyle, 47 | }, 48 | }; 49 | }; 50 | 51 | export const emojiButtonStyle = (img, context) => { 52 | return { 53 | outline: "0", 54 | border: "0", 55 | borderRadius: "4px", 56 | alignItems: "center", 57 | display: "inline-flex", 58 | justifyContent: "center", 59 | position: "relative", 60 | i: { 61 | height: "24px", 62 | width: "24px", 63 | mask: `url(${img}) center center no-repeat`, 64 | backgroundColor: `${context.theme.secondaryTextColor}`, 65 | }, 66 | }; 67 | }; 68 | 69 | export const reactionCountStyle = (context) => { 70 | return { 71 | color: `${context.theme.color.primary}`, 72 | padding: "0 1px 0 3px", 73 | }; 74 | }; 75 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/Extensions/CometChatReceiverDocumentBubble/resources/collaborative-document.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/Extensions/CometChatReceiverPollMessageBubble/resources/check.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/Extensions/CometChatReceiverPollMessageBubble/resources/checkmark.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/Extensions/CometChatReceiverWhiteboardBubble/resources/collaborative-whiteboard.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/Extensions/CometChatSenderDocumentBubble/resources/collaborative-document.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/Extensions/CometChatSenderStickerBubble/style.js: -------------------------------------------------------------------------------- 1 | export const messageContainerStyle = () => { 2 | return { 3 | alignSelf: "flex-end", 4 | marginBottom: "16px", 5 | paddingLeft: "16px", 6 | paddingRight: "16px", 7 | maxWidth: "65%", 8 | clear: "both", 9 | position: "relative", 10 | display: "flex", 11 | flexDirection: "column", 12 | flexShrink: "0", 13 | }; 14 | }; 15 | 16 | export const messageWrapperStyle = () => { 17 | return { 18 | width: "auto", 19 | flex: "1 1", 20 | alignSelf: "flex-end", 21 | display: "flex", 22 | }; 23 | }; 24 | 25 | export const messageImgWrapper = (context) => { 26 | const mq = [...context.theme.breakPoints]; 27 | 28 | return { 29 | display: "inline-block", 30 | alignSelf: "flex-end", 31 | maxWidth: "128px", 32 | height: "128px", 33 | cursor: "pointer", 34 | flexShrink: "0", 35 | [`@media ${mq[1]}, ${mq[2]}`]: { 36 | maxWidth: "128px", 37 | height: "128px", 38 | padding: "2px 2px", 39 | }, 40 | }; 41 | }; 42 | 43 | export const messageInfoWrapperStyle = () => { 44 | return { 45 | alignSelf: "flex-end", 46 | display: "flex", 47 | justifyContent: "flex-end", 48 | alignItems: "center", 49 | padding: "4px 8px", 50 | height: "25px", 51 | }; 52 | }; 53 | 54 | export const messageReactionsWrapperStyle = () => { 55 | return { 56 | display: "flex", 57 | alignSelf: "flex-end", 58 | width: "100%", 59 | flexWrap: "wrap", 60 | justifyContent: "flex-end", 61 | minHeight: "36px", 62 | }; 63 | }; 64 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/Extensions/CometChatSenderWhiteboardBubble/resources/collaborative-whiteboard.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/Extensions/CometChatSmartReplyPreview/index.js: -------------------------------------------------------------------------------- 1 | import { useContext } from "react"; 2 | 3 | /** @jsxRuntime classic */ 4 | /** @jsx jsx */ 5 | import { jsx, keyframes } from "@emotion/react"; 6 | import PropTypes from "prop-types"; 7 | 8 | import { CometChatContext } from "../../../../util/CometChatContext"; 9 | 10 | import { theme } from "../../../../resources/theme"; 11 | 12 | import { 13 | previewWrapperStyle, 14 | previewHeadingStyle, 15 | previewCloseStyle, 16 | previewOptionsWrapperStyle, 17 | previewOptionStyle, 18 | } from "./style"; 19 | 20 | import closeIcon from "./resources/close.svg"; 21 | 22 | const CometChatSmartReplyPreview = (props) => { 23 | const context = useContext(CometChatContext); 24 | 25 | const options = props.options.map((option, key) => { 26 | return ( 27 |
props.clicked(option)} 32 | > 33 | {option} 34 |
35 | ); 36 | }); 37 | 38 | return ( 39 |
43 |
44 |
49 |
50 |
51 | {options} 52 |
53 |
54 | ); 55 | }; 56 | 57 | // Specifies the default values for props: 58 | CometChatSmartReplyPreview.defaultProps = { 59 | theme: theme, 60 | }; 61 | 62 | CometChatSmartReplyPreview.propTypes = { 63 | theme: PropTypes.object, 64 | }; 65 | 66 | export { CometChatSmartReplyPreview }; 67 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/Extensions/CometChatSmartReplyPreview/resources/close.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/Extensions/CometChatSmartReplyPreview/style.js: -------------------------------------------------------------------------------- 1 | export const previewWrapperStyle = (context, keyframes) => { 2 | const slideAnimation = keyframes` 3 | from { 4 | bottom: -55px 5 | } 6 | to { 7 | bottom: 0px 8 | }`; 9 | 10 | return { 11 | padding: "8px 8px 16px 8px", 12 | marginBottom: "-8px", 13 | backgroundColor: `${context.theme.backgroundColor.white}`, 14 | border: `1px solid ${context.theme.borderColor.primary}`, 15 | fontSize: "13px", 16 | display: "flex", 17 | flexDirection: "row-reverse", 18 | justifyContent: "space-between", 19 | animation: `${slideAnimation} 0.5s ease-out`, 20 | position: "relative", 21 | }; 22 | }; 23 | 24 | export const previewHeadingStyle = () => { 25 | return { 26 | alignSelf: "flex-start", 27 | display: "flex", 28 | alignItems: "baseline", 29 | justifyContent: "space-between", 30 | }; 31 | }; 32 | 33 | export const previewCloseStyle = (img, context) => { 34 | return { 35 | width: "24px", 36 | height: "24px", 37 | borderRadius: "50%", 38 | mask: `url(${img}) center center no-repeat`, 39 | backgroundColor: `${context.theme.primaryColor}`, 40 | cursor: "pointer", 41 | }; 42 | }; 43 | 44 | export const previewOptionsWrapperStyle = () => { 45 | return { 46 | display: "flex", 47 | alignItems: "center", 48 | justifyContent: "space-around", 49 | width: "100%", 50 | }; 51 | }; 52 | 53 | export const previewOptionStyle = (context) => { 54 | return { 55 | padding: "8px", 56 | margin: "0 8px", 57 | backgroundColor: `${context.theme.backgroundColor.grey}`, 58 | border: `1px solid ${context.theme.borderColor.primary}`, 59 | borderRadius: "10px", 60 | cursor: "pointer", 61 | height: "100%", 62 | textAlign: "center", 63 | }; 64 | }; 65 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/Extensions/CometChatStickerKeyboard/resources/close.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Messages/Extensions/index.js: -------------------------------------------------------------------------------- 1 | export { CometChatSmartReplyPreview } from "./CometChatSmartReplyPreview"; 2 | export { CometChatStickerKeyboard } from "./CometChatStickerKeyboard"; 3 | export { CometChatMessageReactions } from "./CometChatMessageReactions"; 4 | 5 | export { CometChatCreatePoll } from "./CometChatCreatePoll"; 6 | export { CometChatCreatePollOptions } from "./CometChatCreatePollOptions"; 7 | 8 | export { CometChatReceiverDocumentBubble } from "./CometChatReceiverDocumentBubble"; 9 | export { CometChatReceiverPollMessageBubble } from "./CometChatReceiverPollMessageBubble"; 10 | export { CometChatReceiverStickerMessageBubble } from "./CometChatReceiverStickerMessageBubble"; 11 | export { CometChatReceiverWhiteboardBubble } from "./CometChatReceiverWhiteboardBubble"; 12 | 13 | export { CometChatSenderDocumentBubble } from "./CometChatSenderDocumentBubble"; 14 | export { CometChatSenderPollMessageBubble } from "./CometChatSenderPollMessageBubble"; 15 | export { CometChatSenderStickerBubble } from "./CometChatSenderStickerBubble"; 16 | export { CometChatSenderWhiteboardBubble } from "./CometChatSenderWhiteboardBubble"; 17 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatAvatar/resources/1px.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatAvatar/resources/1px.png -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatAvatar/style.js: -------------------------------------------------------------------------------- 1 | export const imgStyle = () => { 2 | return { 3 | overflow: "hidden", 4 | display: "inherit", 5 | width: "100%", 6 | height: "100%", 7 | }; 8 | }; 9 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatBackdrop/index.js: -------------------------------------------------------------------------------- 1 | /** @jsxRuntime classic */ 2 | /** @jsx jsx */ 3 | import { jsx } from "@emotion/react"; 4 | import PropTypes from "prop-types"; 5 | 6 | import { backdropStyle } from "./style"; 7 | 8 | const CometChatBackdrop = (props) => 9 | props.show ? ( 10 |
15 | ) : null; 16 | 17 | // Specifies the default values for props: 18 | CometChatBackdrop.defaultProps = { 19 | show: false, 20 | style: {}, 21 | clicked: () => {}, 22 | }; 23 | 24 | CometChatBackdrop.propTypes = { 25 | show: PropTypes.bool, 26 | style: PropTypes.object, 27 | clicked: PropTypes.func, 28 | }; 29 | 30 | export { CometChatBackdrop }; 31 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatBackdrop/style.js: -------------------------------------------------------------------------------- 1 | export const backdropStyle = (props) => { 2 | return { 3 | zIndex: "3", 4 | backgroundColor: "#000", 5 | opacity: ".3", 6 | position: "fixed", 7 | width: "100%", 8 | height: "100%", 9 | top: "0", 10 | left: "0", 11 | cursor: "pointer", 12 | transition: "background .3s ease-out 0", 13 | ...props.style, 14 | }; 15 | }; 16 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatBadgeCount/index.js: -------------------------------------------------------------------------------- 1 | /** @jsxRuntime classic */ 2 | /** @jsx jsx */ 3 | import { jsx } from "@emotion/react"; 4 | import PropTypes from "prop-types"; 5 | 6 | import { theme } from "../../../resources/theme"; 7 | import { badgeStyle } from "./style"; 8 | 9 | const CometChatBadgeCount = (props) => { 10 | let badgeCount = null; 11 | 12 | if (props.count) { 13 | badgeCount = ( 14 | 15 | {props.count} 16 | 17 | ); 18 | } 19 | 20 | return badgeCount; 21 | }; 22 | 23 | // Specifies the default values for props: 24 | CometChatBadgeCount.defaultProps = { 25 | count: 0, 26 | theme: theme, 27 | }; 28 | 29 | CometChatBadgeCount.propTypes = { 30 | count: PropTypes.number, 31 | theme: PropTypes.object, 32 | }; 33 | 34 | export { CometChatBadgeCount }; 35 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatBadgeCount/style.js: -------------------------------------------------------------------------------- 1 | export const badgeStyle = (props) => { 2 | return { 3 | display: "block", 4 | fontSize: "12px", 5 | width: "auto", 6 | height: "18px", 7 | borderRadius: "16px", 8 | backgroundColor: `${props.theme.primaryColor}`, 9 | color: `${props.theme.color.white}`, 10 | textAlign: "center", 11 | fontWeight: "700", 12 | lineHeight: "18px", 13 | marginLeft: "4px", 14 | padding: "0 9px", 15 | marginRight: "2px", 16 | opacity: "1", 17 | transition: "opacity .1s", 18 | }; 19 | }; 20 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatConfirmDialog/index.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | /** @jsxRuntime classic */ 3 | /** @jsx jsx */ 4 | import { jsx } from "@emotion/react"; 5 | 6 | import { CometChatBackdrop } from "../"; 7 | import Translator from "../../../resources/localization/translator"; 8 | 9 | import { 10 | alertWrapperStyle, 11 | alertMessageStyle, 12 | alertButtonStyle, 13 | } from "./style"; 14 | 15 | class CometChatConfirmDialog extends React.Component { 16 | render() { 17 | const confirmButtonText = this.props?.confirmButtonText 18 | ? this.props.confirmButtonText 19 | : Translator.translate("YES", this.context.language); 20 | const cancelButtonText = this.props?.cancelButtonText 21 | ? this.props.cancelButtonText 22 | : Translator.translate("NO", this.getContext().language); 23 | 24 | return ( 25 | 26 | 31 |
32 |
33 | {this.props?.message} 34 |
35 |
36 | 39 | 42 |
43 |
44 | 45 | ); 46 | } 47 | } 48 | 49 | export { CometChatConfirmDialog }; 50 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatConfirmDialog/style.js: -------------------------------------------------------------------------------- 1 | export const alertWrapperStyle = (props) => { 2 | return { 3 | width: "calc(100% - 32px)", 4 | height: "auto", 5 | backgroundColor: `${props.theme.backgroundColor.white}`, 6 | position: "absolute", 7 | margin: "0 auto", 8 | padding: "16px", 9 | fontSize: "13px", 10 | borderRadius: "8px", 11 | border: "1px solid #eee", 12 | zIndex: "4", 13 | top: "50%", 14 | left: "0", 15 | right: "0", 16 | transform: "translateY(-50%)", 17 | }; 18 | }; 19 | 20 | export const alertMessageStyle = () => { 21 | return { 22 | textAlign: "center", 23 | }; 24 | }; 25 | 26 | export const alertButtonStyle = (props) => { 27 | return { 28 | display: "flex", 29 | flexDirection: "row", 30 | justifyContent: "center", 31 | alignItems: "center", 32 | margin: "24px 0 0 0", 33 | "> button": { 34 | padding: "5px 24px", 35 | margin: "0 8px", 36 | borderRadius: "4px", 37 | fontSize: "12px", 38 | fontWeight: "600", 39 | border: `1px solid ${props.theme.primaryColor}`, 40 | }, 41 | "> button[value=yes]": { 42 | backgroundColor: `${props.theme.primaryColor}`, 43 | color: `${props.theme.color.white}`, 44 | }, 45 | "> button[value=no]": { 46 | backgroundColor: `${props.theme.backgroundColor.secondary}`, 47 | }, 48 | }; 49 | }; 50 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatErrorBoundary/index.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | /** @jsxRuntime classic */ 3 | /** @jsx jsx */ 4 | import { jsx } from "@emotion/react"; 5 | import PropTypes from "prop-types"; 6 | 7 | import Translator from "../../../resources/localization/translator"; 8 | 9 | import { errorContainerStyle } from "./style"; 10 | 11 | export class CometChatErrorBoundary extends React.Component { 12 | constructor(props) { 13 | super(props); 14 | this.state = { hasError: false }; 15 | } 16 | 17 | static getDerivedStateFromError(error) { 18 | // Update state so the next render will show the fallback UI. 19 | return { hasError: true }; 20 | } 21 | 22 | componentDidCatch(error, errorInfo) { 23 | // You can also log the error to an error reporting service 24 | this.logErrorToMyService(error, errorInfo); 25 | } 26 | 27 | logErrorToMyService = console.log; 28 | 29 | render() { 30 | if (this.state.hasError) { 31 | // You can render any custom fallback UI 32 | return ( 33 |
34 | {Translator.translate("USER_NOT_LOGGED_IN", this.props.lang)} 35 |
36 | ); 37 | } 38 | 39 | return this.props.children; 40 | } 41 | } 42 | 43 | CometChatErrorBoundary.defaultProps = { 44 | lang: Translator.getDefaultLanguage(), 45 | }; 46 | 47 | CometChatErrorBoundary.propTypes = { 48 | lang: PropTypes.string, 49 | }; 50 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatErrorBoundary/style.js: -------------------------------------------------------------------------------- 1 | export const errorContainerStyle = () => { 2 | return { 3 | position: "absolute", 4 | top: "0", 5 | left: "0", 6 | width: "100%", 7 | height: "auto", 8 | padding: "16px", 9 | zIndex: "2", 10 | display: "flex", 11 | justifyContent: "center", 12 | backgroundColor: "#F35051", 13 | color: "#fff", 14 | }; 15 | }; 16 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatListItem/index.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import PropTypes from "prop-types"; 3 | 4 | import { listItem, listTitle, listItemIconStyle } from "./style"; 5 | 6 | const CometChatListItem = (props) => { 7 | let listIcon = null; 8 | if (props.iconURL) { 9 | listIcon = ( 10 |
11 | ); 12 | } 13 | 14 | return ( 15 |
21 | {listIcon} 22 |
23 | {props.text} 24 |
25 | {props.tail} 26 |
27 | ); 28 | }; 29 | 30 | export { CometChatListItem }; 31 | 32 | CometChatListItem.defaultProps = { 33 | id: "", 34 | text: "", 35 | tail: "", 36 | iconURL: "", 37 | style: { 38 | width: "", 39 | height: "", 40 | iconTint: "red", 41 | borderRadius: "8px", 42 | iconBackground: "white", 43 | textColor: "rgb(51,153,255)", 44 | border: "1px solid #141414", 45 | background: "rgba(255,255,255, 0.6)", 46 | textFont: "600 15px Inter, sans-serif", 47 | }, 48 | onItemClick: () => {}, 49 | }; 50 | 51 | CometChatListItem.propTypes = { 52 | id: PropTypes.string, 53 | text: PropTypes.string, 54 | tail: PropTypes.string, 55 | iconURL: PropTypes.string, 56 | style: PropTypes.object, 57 | onItemClick: PropTypes.func, 58 | }; 59 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatListItem/style.js: -------------------------------------------------------------------------------- 1 | export const listItem = (props) => { 2 | return { 3 | ...props.style, 4 | }; 5 | }; 6 | 7 | export const listTitle = (props) => { 8 | return { 9 | margin: "0 6px", 10 | background: "transparent", 11 | textTransform: "capitalize", 12 | font: props.style.textFont, 13 | color: props.style.textColor, 14 | wordWrap: "break-word", 15 | }; 16 | }; 17 | 18 | export const listItemIconStyle = (props) => { 19 | return { 20 | WebkitMask: `url(${props.iconURL}) center center no-repeat`, 21 | background: props.style.iconBackground, 22 | transform: props.style.iconTransform, 23 | color: props.style.iconTint, 24 | marginLeft: "0px", 25 | width: "24px", 26 | height: "24px", 27 | }; 28 | }; 29 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatSharedMediaView/controller.js: -------------------------------------------------------------------------------- 1 | import { CometChat } from "@cometchat-pro/chat"; 2 | 3 | import * as enums from "../../../util/enums.js"; 4 | 5 | export class SharedMediaManager { 6 | mediaMessageListenerId = new Date().getTime(); 7 | mediaMessageRequest = null; 8 | 9 | constructor(item, type, messagetype) { 10 | if (type === "user") { 11 | this.mediaMessageRequest = new CometChat.MessagesRequestBuilder() 12 | .setUID(item.uid) 13 | .setLimit(10) 14 | .setCategory("message") 15 | .setType(messagetype) 16 | .build(); 17 | } else { 18 | this.mediaMessageRequest = new CometChat.MessagesRequestBuilder() 19 | .setGUID(item.guid) 20 | .setLimit(10) 21 | .setCategory("message") 22 | .setType(messagetype) 23 | .build(); 24 | } 25 | } 26 | 27 | fetchPreviousMessages() { 28 | return this.mediaMessageRequest.fetchPrevious(); 29 | } 30 | 31 | attachListeners(callback) { 32 | CometChat.addMessageListener( 33 | this.msgListenerId, 34 | new CometChat.MessageListener({ 35 | onMediaMessageReceived: (mediaMessage) => { 36 | callback(enums.MEDIA_MESSAGE_RECEIVED, mediaMessage); 37 | }, 38 | onMessageDeleted: (deletedMessage) => { 39 | callback(enums.MESSAGE_DELETED, deletedMessage); 40 | }, 41 | }) 42 | ); 43 | } 44 | 45 | removeListeners() { 46 | CometChat.removeMessageListener(this.mediaMessageListenerId); 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatSharedMediaView/resources/1px.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatSharedMediaView/resources/1px.png -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatSharedMediaView/resources/file-upload.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatToastNotification/resources/checkmark-filled.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatToastNotification/resources/close-circle-filled.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatToastNotification/resources/info.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatToastNotification/resources/warning-filled.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatUserPresence/index.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | /** @jsxRuntime classic */ 3 | /** @jsx jsx */ 4 | import { jsx } from "@emotion/react"; 5 | import PropTypes from "prop-types"; 6 | 7 | import { CometChatContext } from "../../../util/CometChatContext"; 8 | 9 | import { presenceStyle } from "./style"; 10 | 11 | const CometChatUserPresence = (props) => { 12 | const context = React.useContext(CometChatContext); 13 | const [presence, setPresence] = React.useState(false); 14 | 15 | const togglePresence = () => { 16 | context.FeatureRestriction.isUserPresenceEnabled() 17 | .then((response) => { 18 | if (response !== presence) { 19 | setPresence(response); 20 | } 21 | }) 22 | .catch((error) => { 23 | if (presence !== false) { 24 | setPresence(false); 25 | } 26 | }); 27 | }; 28 | 29 | React.useEffect(togglePresence); 30 | 31 | //if user presence feature is disabled 32 | if (presence === false) { 33 | return null; 34 | } 35 | 36 | const borderWidth = props.borderWidth; 37 | const borderColor = props.borderColor; 38 | const cornerRadius = props.cornerRadius; 39 | 40 | const getStyle = () => ({ 41 | borderWidth: borderWidth, 42 | borderStyle: "solid", 43 | borderColor: borderColor, 44 | borderRadius: cornerRadius, 45 | }); 46 | 47 | return ( 48 | 53 | ); 54 | }; 55 | 56 | // Specifies the default values for props: 57 | CometChatUserPresence.defaultProps = { 58 | borderWidth: "1px", 59 | borderColor: "#eaeaea", 60 | cornerRadius: "50%", 61 | }; 62 | 63 | CometChatUserPresence.propTypes = { 64 | borderWidth: PropTypes.string, 65 | borderColor: PropTypes.string, 66 | cornerRadius: PropTypes.string, 67 | }; 68 | 69 | export { CometChatUserPresence }; 70 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/CometChatUserPresence/style.js: -------------------------------------------------------------------------------- 1 | export const presenceStyle = (props) => { 2 | let presenceStatus = { 3 | backgroundColor: "#C4C4C4", 4 | }; 5 | 6 | if (props.status === "online" || props.status === "available") { 7 | presenceStatus = { 8 | backgroundColor: "#3BDF2F", 9 | }; 10 | } 11 | 12 | return { 13 | width: "9px", 14 | height: "9px", 15 | top: "-12px", 16 | float: "right", 17 | position: "relative", 18 | ...presenceStatus, 19 | }; 20 | }; 21 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Shared/index.js: -------------------------------------------------------------------------------- 1 | export { CometChatAvatar } from "./CometChatAvatar"; 2 | export { CometChatBackdrop } from "./CometChatBackdrop"; 3 | export { CometChatBadgeCount } from "./CometChatBadgeCount"; 4 | export { CometChatUserPresence } from "./CometChatUserPresence"; 5 | export { CometChatToastNotification } from "./CometChatToastNotification"; 6 | export { CometChatConfirmDialog } from "./CometChatConfirmDialog"; 7 | export { CometChatListItem } from "./CometChatListItem"; 8 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/UserProfile/CometChatUserProfile/controller.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/UserProfile/CometChatUserProfile/controller.js -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/UserProfile/CometChatUserProfile/resources/chats.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/UserProfile/CometChatUserProfile/resources/help.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/UserProfile/CometChatUserProfile/resources/notify.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/UserProfile/CometChatUserProfile/resources/privacy.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/UserProfile/CometChatUserProfile/resources/warning.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/UserProfile/index.js: -------------------------------------------------------------------------------- 1 | export { CometChatUserProfile } from "./CometChatUserProfile"; 2 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Users/CometChatUserDetails/controller.js: -------------------------------------------------------------------------------- 1 | import { CometChat } from "@cometchat-pro/chat"; 2 | 3 | import * as enums from "../../../util/enums.js"; 4 | 5 | export class UserDetailManager { 6 | userListenerId = "user_detail_" + new Date().getTime(); 7 | 8 | attachListeners(callback) { 9 | CometChat.addUserListener( 10 | this.userListenerId, 11 | new CometChat.UserListener({ 12 | onUserOnline: (onlineUser) => { 13 | /* when someuser/friend comes online, user will be received here */ 14 | callback(enums.USER_ONLINE, onlineUser); 15 | }, 16 | onUserOffline: (offlineUser) => { 17 | /* when someuser/friend went offline, user will be received here */ 18 | callback(enums.USER_OFFLINE, offlineUser); 19 | }, 20 | }) 21 | ); 22 | } 23 | 24 | removeListeners() { 25 | CometChat.removeUserListener(this.userListenerId); 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Users/CometChatUserDetails/resources/back.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Users/CometChatUserList/resources/back.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Users/CometChatUserList/resources/search.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Users/CometChatUserListItem/style.js: -------------------------------------------------------------------------------- 1 | export const listItem = (props, context) => { 2 | const selectedState = 3 | props.selectedUser && props.selectedUser.uid === props.user.uid 4 | ? { 5 | backgroundColor: `${context.theme.backgroundColor.primary}`, 6 | } 7 | : {}; 8 | 9 | return { 10 | display: "flex", 11 | flexDirection: "row", 12 | justifyContent: "left", 13 | alignItems: "center", 14 | cursor: "pointer", 15 | width: "100%", 16 | padding: "8px 16px", 17 | ...selectedState, 18 | "&:hover": { 19 | backgroundColor: `${context.theme.backgroundColor.primary}`, 20 | }, 21 | }; 22 | }; 23 | 24 | export const itemThumbnailStyle = () => { 25 | return { 26 | display: "inline-block", 27 | width: "36px", 28 | height: "36px", 29 | flexShrink: "0", 30 | }; 31 | }; 32 | 33 | export const itemDetailStyle = () => { 34 | return { 35 | width: "calc(100% - 45px)", 36 | flexGrow: 1, 37 | paddingLeft: "16px", 38 | "&[dir=rtl]": { 39 | paddingRight: "16px", 40 | paddingLeft: "0", 41 | }, 42 | }; 43 | }; 44 | 45 | export const itemNameStyle = (context) => { 46 | return { 47 | fontSize: "15px", 48 | fontWeight: "600", 49 | overflow: "hidden", 50 | textOverflow: "ellipsis", 51 | whiteSpace: "nowrap", 52 | width: "100%", 53 | margin: "5px 0 0 0", 54 | lineHeight: "22px", 55 | color: `${context.theme.color.primary}`, 56 | }; 57 | }; 58 | 59 | export const itemDescStyle = (context) => { 60 | return { 61 | marginTop: "10px", 62 | borderBottom: `1px solid ${context.theme.borderColor.primary}`, 63 | }; 64 | }; 65 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Users/CometChatUserListItem/test.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import ReactDOM from "react-dom"; 3 | import { act } from "react-dom/test-utils"; 4 | import "jest-canvas-mock"; 5 | 6 | import { CometChatContextProvider } from "../../../util/CometChatContext"; 7 | import { CometChatUserListItem } from "./"; 8 | 9 | describe("CometChatUserListItem", () => { 10 | let container = null; 11 | 12 | it("renders without crashing", () => { 13 | container = document.createElement("div"); 14 | ReactDOM.render( 15 | 16 | 17 | , 18 | container 19 | ); 20 | }); 21 | }); 22 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Users/CometChatUserListWithMessages/controller.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Users/CometChatUserListWithMessages/controller.js -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Users/CometChatUserListWithMessages/style.js: -------------------------------------------------------------------------------- 1 | export const userScreenStyle = (props) => { 2 | return { 3 | display: "flex", 4 | height: "100%", 5 | width: "100%", 6 | boxSizing: "border-box", 7 | fontFamily: `${props.theme.fontFamily}`, 8 | border: `1px solid ${props.theme.borderColor.primary}`, 9 | "*": { 10 | boxSizing: "border-box", 11 | fontFamily: `${props.theme.fontFamily}`, 12 | "::-webkit-scrollbar": { 13 | width: "8px", 14 | height: "4px", 15 | }, 16 | "::-webkit-scrollbar-track": { 17 | background: "#ffffff00", 18 | }, 19 | "::-webkit-scrollbar-thumb": { 20 | background: "#ccc", 21 | "&:hover": { 22 | background: "#aaa", 23 | }, 24 | }, 25 | }, 26 | }; 27 | }; 28 | 29 | export const userScreenSidebarStyle = (state, props) => { 30 | const sidebarView = state.sidebarview 31 | ? { 32 | left: "0", 33 | boxShadow: "rgba(0, 0, 0, .4) -30px 0 30px 30px", 34 | } 35 | : {}; 36 | 37 | const mq = [...props.theme.breakPoints]; 38 | 39 | return { 40 | width: "280px", 41 | borderRight: `1px solid ${props.theme.borderColor.primary}`, 42 | height: "100%", 43 | position: "relative", 44 | display: "flex", 45 | flexDirection: "column", 46 | "> .contacts": { 47 | height: "calc(100% - 5px)", 48 | }, 49 | [`@media ${mq[0]}`]: { 50 | position: "absolute!important", 51 | left: "-100%", 52 | top: "0", 53 | bottom: "0", 54 | width: "100%!important", 55 | zIndex: "2", 56 | backgroundColor: `${props.theme.backgroundColor.white}`, 57 | transition: "all .3s ease-out", 58 | ...sidebarView, 59 | }, 60 | }; 61 | }; 62 | 63 | export const userScreenMainStyle = (state, props) => { 64 | const mq = [...props.theme.breakPoints]; 65 | 66 | return { 67 | width: "calc(100% - 280px)", 68 | height: "100%", 69 | order: "2", 70 | display: "flex", 71 | flexDirection: "row", 72 | [`@media ${mq[1]}, ${mq[2]}`]: { 73 | width: "100%!important", 74 | }, 75 | }; 76 | }; 77 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/components/Users/index.js: -------------------------------------------------------------------------------- 1 | export { CometChatUserDetails } from "./CometChatUserDetails"; 2 | export { CometChatUserList } from "./CometChatUserList"; 3 | export { CometChatUserListItem } from "./CometChatUserListItem"; 4 | export { CometChatUserListWithMessages } from "./CometChatUserListWithMessages"; 5 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/resources/__mocks__/consts.js: -------------------------------------------------------------------------------- 1 | export const COMETCHAT_CONSTANTS = { 2 | APP_ID: "2434873961f4ce2", 3 | REGION: "us", 4 | AUTH_KEY: "c8eb8f3f27a37b9b218e20f36772fd86c79c7e16", 5 | UID: "SUPERHERO1", 6 | }; 7 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/resources/__mocks__/fileMock.js: -------------------------------------------------------------------------------- 1 | module.exports = "test-file-stub"; 2 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/resources/__mocks__/windowMock.js: -------------------------------------------------------------------------------- 1 | export const mockWindowProperty = (property, value) => { 2 | const { [property]: originalProperty } = window; 3 | delete window[property]; 4 | beforeAll(() => { 5 | Object.defineProperty(window, property, { 6 | configurable: true, 7 | writable: true, 8 | value, 9 | }); 10 | }); 11 | afterAll(() => { 12 | window[property] = originalProperty; 13 | }); 14 | }; 15 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/resources/audio/incomingcall.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/resources/audio/incomingcall.wav -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/resources/audio/incomingmessage.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/resources/audio/incomingmessage.wav -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/resources/audio/incomingothermessage.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/resources/audio/incomingothermessage.wav -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/resources/audio/index.js: -------------------------------------------------------------------------------- 1 | export { default as incomingMessageAlert } from "./incomingmessage.wav"; 2 | export { default as incomingOtherMessageAlert } from "./incomingothermessage.wav"; 3 | export { default as outgoingMessageAlert } from "./outgoingmessage.wav"; 4 | export { default as incomingCallAlert } from "./incomingcall.wav"; 5 | export { default as outgoingCallAlert } from "./outgoingcall.wav"; 6 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/resources/audio/outgoingcall.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/resources/audio/outgoingcall.wav -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/resources/audio/outgoingmessage.wav: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/resources/audio/outgoingmessage.wav -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/resources/tabs.json: -------------------------------------------------------------------------------- 1 | { 2 | "SIDEBAR_CHATS": "chats", 3 | "SIDEBAR_USERS": "users", 4 | "SIDEBAR_GROUPS": "groups", 5 | "SIDEBAR_CALLS": "calls", 6 | "SIDEBAR_MOREINFO": "user_settings" 7 | } 8 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/resources/theme.js: -------------------------------------------------------------------------------- 1 | export const theme = { 2 | fontFamily: "Inter, sans-serif", 3 | fontSize: "14px", 4 | primaryColor: "#39f", 5 | secondaryTextColor: "#808080", 6 | color: { 7 | primary: "#141414", 8 | secondary: "#cccccc", 9 | darkSecondary: "#eaeaea", 10 | search: "rgba(20, 20, 20, 0.4)", 11 | tertiary: "rgba(20, 20, 20, 0.5)", 12 | grey: "rgba(20,20,20,0.04)", 13 | helpText: "rgba(20, 20, 20, 0.6)", 14 | blue: "#39f", 15 | white: "#fff", 16 | red: "#ff3b30", 17 | }, 18 | borderColor: { 19 | primary: "#eaeaea", 20 | secondary: "#cccccc", 21 | darkSecondary: "#eaeaea", 22 | white: "#fff", 23 | blue: "#39f", 24 | }, 25 | backgroundColor: { 26 | white: "#fff", 27 | primary: "#E6E6E6", 28 | secondary: "#f6f6f6", 29 | blue: "#39f", 30 | red: "#ff3b30", 31 | grey: "rgba(20,20,20,0.04)", 32 | lightGrey: "rgba(20, 20, 20, 0.08)", 33 | darkGrey: "rgba(20,20,20,0.9)", 34 | callScreenGrey: "#444444", 35 | silver: "#c4c4c4", 36 | }, 37 | breakPoints: [ 38 | "(min-width: 320px) and (max-width: 767px)", 39 | "(min-width: 320px) and (max-width: 480px)", 40 | "(min-width: 481px) and (max-width: 768px)", 41 | "(min-width: 769px) and (max-width: 1024px)", 42 | "(min-width: 1025px) and (max-width: 1200px)", 43 | ], 44 | }; 45 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/util/CometChatAuthentication.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { CometChatContext } from "../../../util/CometChatContext"; 3 | 4 | function CometChatAuthentication(WrappedComponent) { 5 | return class AuthenticatedComponent extends React.Component { 6 | static contextType = CometChatContext; 7 | 8 | constructor(props, context) { 9 | super(props, context); 10 | 11 | this.state = { 12 | loggedInUser: null, 13 | }; 14 | } 15 | 16 | componentDidMount() { 17 | this.context.getLoggedinUser().then((user) => { 18 | this.setState({ loggedInUser: { ...user } }); 19 | }); 20 | } 21 | /** 22 | * Check if the user is authenticated, this.props.isAuthenticated 23 | * has to be set from your application logic (or use react-redux to retrieve it from global state). 24 | */ 25 | isAuthenticated() { 26 | return this.props.isAuthenticated; 27 | } 28 | 29 | /** 30 | * Render 31 | */ 32 | render() { 33 | return ( 34 |
35 | {this.state.loggedInUser === null ? null : ( 36 | 40 | )} 41 |
42 | ); 43 | } 44 | }; 45 | } 46 | 47 | export { CometChatAuthentication }; 48 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/util/CometChatEvent.js: -------------------------------------------------------------------------------- 1 | class CometChatEvent { 2 | static _triggers = {}; 3 | 4 | static on(event, callback) { 5 | if (!CometChatEvent._triggers[event]) CometChatEvent._triggers[event] = []; 6 | CometChatEvent._triggers[event].push(callback); 7 | } 8 | 9 | static triggerHandler(event, params) { 10 | if (CometChatEvent._triggers[event]) { 11 | for (const i in CometChatEvent._triggers[event]) 12 | CometChatEvent._triggers[event][i](params); 13 | } 14 | } 15 | } 16 | 17 | export { CometChatEvent }; 18 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/CometChatWorkspace/src/util/Storage.js: -------------------------------------------------------------------------------- 1 | export class Storage { 2 | static attachChangeDetection = (callback) => { 3 | window.addEventListener("storage", callback); 4 | }; 5 | 6 | static detachChangeDetection = (callback) => { 7 | window.removeEventListener("storage", callback); 8 | }; 9 | 10 | static setItem = (storageKey, storageValue) => { 11 | localStorage.setItem(storageKey, JSON.stringify(storageValue)); 12 | }; 13 | 14 | static getItem = (storageKey) => { 15 | return JSON.parse(localStorage.getItem(storageKey)); 16 | }; 17 | 18 | static removeItem = (storageKey) => { 19 | localStorage.removeItem(storageKey); 20 | }; 21 | 22 | static clear = () => {}; 23 | } 24 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2020 CometChat Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/SECURITY.md: -------------------------------------------------------------------------------- 1 | # Security Policy 2 | 3 | This document outlines the Responsible Disclosure Program for CometChat Pro 4 | 5 | ## Responsible Disclosure Policy 6 | 7 | At CometChat we take security seriously and consider it a top priority. Since a 8 | public disclosure of a security vulnerability could put the entire 9 | community at risk, we require that potential vulnerabilities are kept 10 | confidential until they are confirmed and fixed. We appreciate your efforts in 11 | keeping CometChat Pro and its users safe by responsibly disclosing any security 12 | vulnerability. Rest assured we will make every effort to acknowledge your 13 | contributions. 14 | 15 | ## Reporting a vulnerability 16 | 17 | To report any security related issues, please communicate with the CometChat Pro security team by sending an email to security@cometchat.com 18 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/SUPPORT.md: -------------------------------------------------------------------------------- 1 | # Getting Support 2 | 3 | The quickest way to get support is to contact us via your CometChat Pro Dashboard. 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/Screenshots/add-ui-kit.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/Screenshots/add-ui-kit.png -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/Screenshots/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/Screenshots/logo.png -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/Screenshots/main.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/Screenshots/main.png -------------------------------------------------------------------------------- /CometChatWorkspace/src/cometchat-pro-react-ui-kit/Screenshots/package-dependencies.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/CometChatWorkspace/src/cometchat-pro-react-ui-kit/Screenshots/package-dependencies.png -------------------------------------------------------------------------------- /CometChatWorkspace/src/components/App/DockedLauncher/resources/chat_bubble.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/components/App/DockedLauncher/resources/chat_close.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/components/App/DockedLauncher/resources/core.scss: -------------------------------------------------------------------------------- 1 | @import "./mixins"; 2 | 3 | * { 4 | box-sizing: border-box; 5 | } 6 | 7 | html { 8 | text-size-adjust:100%; 9 | font-size: 10px; 10 | } 11 | 12 | body{ 13 | margin:0; 14 | padding:0; 15 | font-family: $base_font_family; 16 | font-size: $base_font_size; 17 | overflow-x: hidden; 18 | background-color:$white; 19 | color: $primary-text; 20 | box-sizing:border-box 21 | } 22 | 23 | a { 24 | background:0 0; 25 | text-decoration:none; 26 | background-color:transparent; 27 | color:inherit; 28 | } 29 | 30 | img { 31 | border:0; 32 | border-style:none; 33 | max-width:100%; 34 | display:inherit; 35 | } 36 | 37 | button, 38 | input, 39 | select, 40 | textarea { 41 | font-family:inherit; 42 | font-size:100%; 43 | margin:0; 44 | font:inherit; 45 | } 46 | 47 | button,input { 48 | line-height:normal; 49 | overflow:visible; 50 | } 51 | 52 | button, 53 | html input[type="button"], 54 | input[type="reset"], 55 | input[type="submit"], 56 | html [type="button"], 57 | [type="reset"], 58 | [type="submit"] { 59 | -webkit-appearance:button; 60 | cursor:pointer; 61 | outline:0; 62 | border:0; 63 | background-color:transparent; 64 | } 65 | 66 | *:focus { 67 | outline: none; 68 | } 69 | 70 | h1,h2,h3,h4,h5,h6 { 71 | font-family: $base_font_family; 72 | font-stretch:normal; 73 | font-weight:400; 74 | } 75 | 76 | h4 { 77 | font-size: 2.2rem; 78 | line-height:27px; 79 | } 80 | 81 | p {font-size: 1.4rem; 82 | line-height:19px; 83 | } 84 | 85 | .clearfix::after, 86 | .clearfix::before { 87 | content:" "; 88 | display:table; 89 | } 90 | 91 | .clearfix, 92 | .clearfix::after { 93 | clear:both; 94 | } -------------------------------------------------------------------------------- /CometChatWorkspace/src/components/App/DockedLauncher/style.module.css: -------------------------------------------------------------------------------- 1 | .widget__launcher { 2 | position: absolute; 3 | top: 0px; 4 | left: 0px; 5 | width: 60px; 6 | height: 60px; 7 | cursor: pointer; 8 | transform-origin: center center 0px; 9 | border-radius: 50%; 10 | overflow: hidden; 11 | background: #03a9f4; 12 | opacity: 1; 13 | } 14 | 15 | .widget__launcher.widget__launcher--active{ 16 | background: #03a9f4; 17 | } 18 | 19 | .icon__open { 20 | opacity: 0; 21 | transform: rotate(30deg) scale(0); 22 | transition: transform 0.16s linear, opacity 0.08s linear; 23 | } 24 | 25 | .icon__close { 26 | opacity: 1; 27 | transform: rotate(0deg); 28 | transition: transform 0.16s linear, opacity 0.08s linear; 29 | } 30 | 31 | .launcher__icon { 32 | display: flex; 33 | align-items: center; 34 | justify-content: center; 35 | position: absolute; 36 | top: 0px; 37 | bottom: 0px; 38 | width: 100%; 39 | } 40 | 41 | .launcher__icon.icon__open { 42 | opacity: 1; 43 | transform: rotate(0deg) scale(1); 44 | transition: transform 0.16s linear, opacity 0.08s linear; 45 | background: url('./resources/chat_bubble.svg') no-repeat center center #03a9f4; 46 | } 47 | 48 | .launcher__icon.icon__close { 49 | opacity: 0; 50 | transform: rotate(-60deg); 51 | transition: transform 0.16s linear, opacity 0.08s linear; 52 | background: url('./resources/chat_close.svg') no-repeat center center #03a9f4; 53 | } -------------------------------------------------------------------------------- /CometChatWorkspace/src/components/App/EmbedFrame/index.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import PropTypes from 'prop-types'; 3 | 4 | import asyncComponent from '../../../hoc/asyncComponent'; 5 | 6 | const Embedded = asyncComponent("Embedded", () => { 7 | // Pass the component which you want to load dynamically. 8 | return import("../Embedded/index.js"); 9 | }); 10 | 11 | export class EmbedFrame extends React.Component { 12 | 13 | render() { 14 | 15 | let embedView = null; 16 | if (this.props.launched === true) { 17 | embedView = (); 18 | } 19 | 20 | return (embedView); 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/components/App/EmbedFrame/style.js: -------------------------------------------------------------------------------- 1 | import { getResponsiveData, minHeight, minWidth } from "../utils"; 2 | 3 | export const embedWrapperStyle = (props) => { 4 | 5 | const responsiveData = getResponsiveData() 6 | 7 | let roundedCornerStyle = {}; 8 | if (props.hasOwnProperty("roundedCorners") && (props.roundedCorners === true || props.roundedCorners === "true")) { 9 | roundedCornerStyle = { 10 | borderRadius: "20px" 11 | } 12 | } 13 | 14 | let alignmentStyle = {}; 15 | if (props.hasOwnProperty("alignment") && props.alignment === "left") { 16 | alignmentStyle = { 17 | left: `${responsiveData.dockedHorizontalPadding}px`, 18 | right: "unset", 19 | } 20 | } 21 | 22 | let dockedStyle = {}; 23 | if (props.docked && (props.docked === true || props.docked === "true")) { 24 | dockedStyle = { 25 | position: "fixed", 26 | bottom: `${responsiveData.dockedIconHeight + (responsiveData.dockedBottomPadding * 2)}px`, 27 | right: `${responsiveData.dockedHorizontalPadding}px`, 28 | zIndex: "2147483000", 29 | boxShadow: "rgba(0, 0, 0, 0.11) 0px 5px 40px", 30 | } 31 | } 32 | 33 | const launchedStyle = (props.launched) ? { opacity: "1" } : { opacity: "0", display: "none" }; 34 | 35 | return { 36 | opacity: "0", 37 | overflow: "hidden", 38 | boxSizing: "border-box", 39 | border: "2px solid #eaeaea", 40 | opacity: ".2s linear", 41 | position: "relative", 42 | ...launchedStyle, 43 | ...roundedCornerStyle, 44 | ...alignmentStyle, 45 | ...dockedStyle 46 | } 47 | } -------------------------------------------------------------------------------- /CometChatWorkspace/src/components/App/Embedded/controller.js: -------------------------------------------------------------------------------- 1 | import { CometChat } from "@cometchat-pro/chat"; 2 | 3 | import * as enums from "UIKit/CometChat/util/enums.js"; 4 | 5 | export class EmbedManager { 6 | 7 | msgListenerId = "embed_" + new Date().getTime(); 8 | 9 | constructor() { 10 | 11 | } 12 | 13 | attachListeners(callback) { 14 | 15 | CometChat.addMessageListener( 16 | this.msgListenerId, 17 | new CometChat.MessageListener({ 18 | onTextMessageReceived: textMessage => { 19 | callback(enums.TEXT_MESSAGE_RECEIVED, textMessage); 20 | }, 21 | onMediaMessageReceived: mediaMessage => { 22 | callback(enums.MEDIA_MESSAGE_RECEIVED, mediaMessage); 23 | }, 24 | onCustomMessageReceived: customMessage => { 25 | callback(enums.CUSTOM_MESSAGE_RECEIVED, customMessage); 26 | }, 27 | onMessagesRead: messageReceipt => { 28 | callback(enums.MESSAGE_READ, messageReceipt); 29 | } 30 | }) 31 | ); 32 | } 33 | 34 | removeListeners() { 35 | CometChat.removeMessageListener(this.msgListenerId); 36 | } 37 | } 38 | 39 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/components/App/controller.js: -------------------------------------------------------------------------------- 1 | import { CometChat } from "@cometchat-pro/chat"; 2 | 3 | import * as enums from "UIKit/CometChatWorkspace/src/util/enums.js"; 4 | 5 | export class AppManager { 6 | 7 | msgListenerId = "embed_msg_" + new Date().getTime(); 8 | callListenerId = "embed_call_" + new Date().getTime(); 9 | 10 | constructor() { 11 | 12 | } 13 | 14 | attachListeners(callback) { 15 | 16 | CometChat.addMessageListener( 17 | this.msgListenerId, 18 | new CometChat.MessageListener({ 19 | onTextMessageReceived: textMessage => { 20 | callback(enums.TEXT_MESSAGE_RECEIVED, textMessage); 21 | }, 22 | onMediaMessageReceived: mediaMessage => { 23 | callback(enums.MEDIA_MESSAGE_RECEIVED, mediaMessage); 24 | }, 25 | onCustomMessageReceived: customMessage => { 26 | callback(enums.CUSTOM_MESSAGE_RECEIVED, customMessage); 27 | }, 28 | onMessagesRead: messageReceipt => { 29 | callback(enums.MESSAGE_READ, messageReceipt); 30 | } 31 | }) 32 | ); 33 | } 34 | 35 | removeListeners() { 36 | CometChat.removeMessageListener(this.msgListenerId); 37 | CometChat.removeCallListener(this.callListenerId); 38 | } 39 | } 40 | 41 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/components/App/style.js: -------------------------------------------------------------------------------- 1 | export const AppStyle = (props) => { 2 | 3 | let alignmentStyle = {}; 4 | if (props.docked && (props.docked === true || props.docked === "true")) { 5 | 6 | if (props.hasOwnProperty("alignment") && props.alignment === "right") { 7 | 8 | alignmentStyle = { 9 | bottom: "390px", 10 | right: "40px", 11 | left: "unset" 12 | } 13 | 14 | } else if (props.hasOwnProperty("alignment") && props.alignment === "left") { 15 | 16 | alignmentStyle = { 17 | bottom: "390px", 18 | left: "40px", 19 | right: "unset" 20 | } 21 | } 22 | 23 | } else { 24 | 25 | alignmentStyle = { 26 | position: "absolute", 27 | top: "12px", 28 | right: "12px", 29 | } 30 | } 31 | 32 | return { 33 | position: "relative", 34 | boxSizing: "border-box", 35 | fontFamily: `${props.theme.fontFamily}`, 36 | fontSize: "14px", 37 | width: "inherit", 38 | height: "inherit", 39 | ".toast__notification": { 40 | zIndex: "2147483001", 41 | position: "fixed", 42 | top: "unset", 43 | ...alignmentStyle 44 | } 45 | } 46 | } 47 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/components/App/utils.js: -------------------------------------------------------------------------------- 1 | export const minWidth = "100%"; 2 | export const minHeight = "100%"; 3 | export const smallScreenWidth = 450; 4 | 5 | export const getResponsiveData = () => { 6 | let data = { 7 | dockedIconWidth: 60, 8 | dockedIconHeight: 60, 9 | dockedBottomPadding: 20, 10 | dockedHorizontalPadding: 20, 11 | dockedIconHorizontalPadding: 20, 12 | } 13 | 14 | const availWidth = window.innerWidth; 15 | if(availWidth <= smallScreenWidth) { 16 | data.dockedIconWidth = 40; 17 | data.dockedIconHeight = 40; 18 | data.dockedBottomPadding = 5; 19 | data.dockedHorizontalPadding = 0; 20 | data.dockedIconHorizontalPadding = 5; 21 | } 22 | 23 | return data; 24 | } 25 | 26 | export const getCallingPopUpOrigin = (width) => { 27 | const availWidth = window.innerWidth; 28 | if(availWidth <= smallScreenWidth) { 29 | /**Small screens */ 30 | return availWidth 31 | } else { 32 | return width 33 | } 34 | } -------------------------------------------------------------------------------- /CometChatWorkspace/src/hoc/FrameProvider.js: -------------------------------------------------------------------------------- 1 | import * as React from "react"; 2 | import { CacheProvider } from "@emotion/react"; 3 | import createCache from "@emotion/cache"; 4 | import weakMemoize from "@emotion/weak-memoize"; 5 | import { FrameContextConsumer } from "react-frame-component"; 6 | 7 | let memoizedCreateCacheWithContainer = weakMemoize(container => { 8 | let newCache = createCache({ container,key:"frameprovider" }); 9 | return newCache; 10 | }); 11 | 12 | export const FrameProvider = props => ( 13 | 14 | {({ document }) => { 15 | return ( 16 | 17 | {props.children} 18 | 19 | ); 20 | }} 21 | 22 | ); 23 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/hoc/ScopeProvider.js: -------------------------------------------------------------------------------- 1 | import * as React from "react"; 2 | import createCache from "@emotion/cache"; 3 | import { CacheProvider } from "@emotion/react"; 4 | import memoize from "@emotion/memoize"; 5 | import stylisPluginExtraScope from "stylis-plugin-extra-scope"; 6 | 7 | let memoizedCreateCacheWithScope = memoize(scope => { 8 | return createCache({ 9 | stylisPlugins: [stylisPluginExtraScope(scope)] 10 | }); 11 | }); 12 | 13 | export const ScopeProvider = props => { 14 | return ( 15 | 16 | {props.children} 17 | 18 | ); 19 | }; 20 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/hoc/asyncComponent.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | 3 | const asyncComponent = (componentName, importComponent) => { 4 | return class extends Component { 5 | state = { 6 | component: null 7 | }; 8 | 9 | componentDidMount() { 10 | // import component should be function refererce. 11 | // it returns promise 12 | importComponent().then(cpm => { 13 | // it has default property to load component dynamically (cpm.default) 14 | this.setState({ component: (componentName) ? cpm[componentName] : cpm.default }); 15 | }).catch(error => { 16 | 17 | console.log("asyncComponent error", error); 18 | }); 19 | } 20 | render() { 21 | // render method renders the component dynamically. 22 | const C = this.state.component; //console.log("C", C); 23 | return C ? : null; 24 | 25 | } 26 | } 27 | } 28 | 29 | export default asyncComponent; 30 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/public/version.txt: -------------------------------------------------------------------------------- 1 | 3.0.11-1 -------------------------------------------------------------------------------- /CometChatWorkspace/src/resources/tabs.js: -------------------------------------------------------------------------------- 1 | export const tabs = { 2 | SIDEBAR_CHATS: "chats", 3 | SIDEBAR_USERS: "users", 4 | SIDEBAR_GROUPS: "groups" 5 | } -------------------------------------------------------------------------------- /CometChatWorkspace/src/resources/theme.js: -------------------------------------------------------------------------------- 1 | export const theme = { 2 | fontFamily: "Inter, sans-serif", 3 | fontSize: "14px", 4 | primaryColor: "#39f", 5 | secondaryTextColor: "#808080", 6 | color: { 7 | primary: "#141414", 8 | secondary: "#cccccc", 9 | darkSecondary: "#eaeaea", 10 | search: "rgba(20, 20, 20, 0.4)", 11 | tertiary: "rgba(20, 20, 20, 0.5)", 12 | grey: "rgba(20,20,20,0.04)", 13 | helpText: "rgba(20, 20, 20, 0.6)", 14 | blue: "#39f", 15 | white: "#fff", 16 | red: "#ff3b30" 17 | }, 18 | borderColor: { 19 | primary: "#eaeaea", 20 | white: "#fff", 21 | blue: "#39f", 22 | }, 23 | backgroundColor: { 24 | white: "#fff", 25 | primary: "#E6E6E6", 26 | secondary: "#f6f6f6", 27 | blue: "#39f", 28 | red: "#ff3b30", 29 | grey: "rgba(20,20,20,0.04)", 30 | lightGrey: "rgba(20, 20, 20, 0.08)", 31 | darkGrey: "rgba(20,20,20,0.9)", 32 | callScreenGrey: "#444444", 33 | silver: "#c4c4c4" 34 | }, 35 | breakPoints: [ 36 | "(min-width: 1px) and (max-width: 767px)", 37 | "(min-width: 1px) and (max-width: 480px)", 38 | "(min-width: 481px) and (max-width: 768px)", 39 | "(min-width: 769px) and (max-width: 1024px)", 40 | "(min-width: 1025px) and (max-width: 1200px)", 41 | ] 42 | }; 43 | -------------------------------------------------------------------------------- /CometChatWorkspace/src/util/enums.js: -------------------------------------------------------------------------------- 1 | export const EVENTS = { 2 | OPEN_CHAT: "openChat", 3 | CLOSE_CHAT: "closeChat" 4 | } 5 | 6 | export const CONSTANTS = { 7 | WIDGET_SETTINGS: { 8 | STYLE: "style", 9 | SIDEBAR: "sidebar", 10 | MAIN: "main", 11 | }, 12 | }; -------------------------------------------------------------------------------- /CometChatWorkspace/src/util/index.js: -------------------------------------------------------------------------------- 1 | export const validateWidgetSettings = (wSettings, section, checkAgainst) => { 2 | 3 | let output = null; 4 | 5 | if (wSettings && wSettings.hasOwnProperty(section)) { 6 | 7 | if (wSettings[section].hasOwnProperty(checkAgainst)) { 8 | output = wSettings[section][checkAgainst]; 9 | } else { 10 | output = false; 11 | } 12 | } 13 | 14 | return output; 15 | } -------------------------------------------------------------------------------- /CometChatWorkspace/webpack.dev.js: -------------------------------------------------------------------------------- 1 | const { merge } = require('webpack-merge'); 2 | const common = require('./webpack.common.js'); 3 | 4 | const bundleOutputDir = "./v3"; 5 | 6 | module.exports = merge(common, { 7 | mode: 'development', 8 | devtool: 'inline-source-map', 9 | devServer: { 10 | contentBase: bundleOutputDir, 11 | port: 9000, 12 | }, 13 | }); -------------------------------------------------------------------------------- /CometChatWorkspace/webpack.prod.js: -------------------------------------------------------------------------------- 1 | const { merge } = require('webpack-merge'); 2 | const common = require('./webpack.common.js'); 3 | 4 | module.exports = merge(common, { 5 | mode: 'production', 6 | devtool: 'source-map', 7 | }); -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2020 CometChat Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /SECURITY.md: -------------------------------------------------------------------------------- 1 | # Security Policy 2 | 3 | This document outlines the Responsible Disclosure Program for CometChat Pro 4 | 5 | ## Responsible Disclosure Policy 6 | 7 | At CometChat we take security seriously and consider it a top priority. Since a 8 | public disclosure of a security vulnerability could put the entire 9 | community at risk, we require that potential vulnerabilities are kept 10 | confidential until they are confirmed and fixed. We appreciate your efforts in 11 | keeping CometChat Pro and its users safe by responsibly disclosing any security 12 | vulnerability. Rest assured we will make every effort to acknowledge your 13 | contributions. 14 | 15 | ## Reporting a vulnerability 16 | 17 | To report any security related issues, please communicate with the CometChat Pro security team by sending an email to security@cometchat.com 18 | -------------------------------------------------------------------------------- /SUPPORT.md: -------------------------------------------------------------------------------- 1 | # Getting Support 2 | 3 | The quickest way to get support is to contact us via your CometChat Pro Dashboard. 4 | -------------------------------------------------------------------------------- /Screenshots/chatwidget.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/Screenshots/chatwidget.png -------------------------------------------------------------------------------- /Screenshots/chatwidgetsettings.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/Screenshots/chatwidgetsettings.png -------------------------------------------------------------------------------- /Screenshots/constants.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/Screenshots/constants.png -------------------------------------------------------------------------------- /Screenshots/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/Screenshots/logo.png -------------------------------------------------------------------------------- /Screenshots/newchatwidget.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/cometchat/cometchat-widget-web/12602c957118b32fbc2fadb93de0b7b651b1d0db/Screenshots/newchatwidget.png --------------------------------------------------------------------------------