sceyt-chat-react-uikit 1.6.7 → 1.6.8-beta.2

package/assets/svg/pin.svg

@@ -1,3 +1,3 @@
-<svg width="20" height="21" viewBox="0 0 20.01 21.01" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M7.4022 14.2166L3.04564 18.5732C2.31954 19.2993 1.2304 18.2102 1.95649 17.4841L6.31306 13.1275L2.80893 9.62337C2.39539 9.20982 2.39539 8.53934 2.80893 8.1258C2.98767 7.94705 3.22446 7.83815 3.4765 7.81876L7.73391 7.49127C7.82556 7.48422 7.91167 7.44461 7.97666 7.37962L10.6946 4.66169C10.7483 4.60793 10.785 4.53947 10.7999 4.46492L11.1397 2.76576C11.2604 2.1626 12.0045 1.93728 12.4395 2.37222L18.1575 8.09022C18.5924 8.52516 18.3671 9.26934 17.7639 9.38997L16.0648 9.72981C15.9902 9.74472 15.9218 9.78136 15.868 9.83511L13.1501 12.553C13.0851 12.618 13.0455 12.7041 13.0384 12.7958L12.7109 17.0532C12.6661 17.6363 12.157 18.0727 11.5739 18.0278C11.3219 18.0084 11.0851 17.8995 10.9063 17.7208L7.4022 14.2166ZM11.5027 12.6777C11.5379 12.2194 11.736 11.7889 12.0609 11.4639L14.7789 8.74597C15.0477 8.47719 15.39 8.29398 15.7627 8.21944L16.0508 8.16182L12.3679 4.47891L12.3103 4.76699C12.2357 5.13973 12.0525 5.48205 11.7837 5.75083L9.06581 8.46876C8.74082 8.79375 8.3103 8.99176 7.85205 9.02701L4.63808 9.27424L11.2555 15.8916L11.5027 12.6777Z" fill="CurrentColor"/>
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10.0694 1.33856C10.2 0.68593 11.0052 0.442133 11.4758 0.912749L17.0859 6.5229C17.5566 6.99351 17.3128 7.79872 16.6601 7.92924L14.993 8.26267C14.9349 8.27429 14.8816 8.30285 14.8397 8.34474L12.173 11.0114C12.1223 11.0621 12.0915 11.1292 12.086 11.2006L11.7647 15.3777C11.7174 15.9926 11.1805 16.4527 10.5657 16.4054C10.2999 16.385 10.0502 16.2702 9.8617 16.0817L6.47863 12.698L2.08659 17.0906C1.76117 17.416 1.23355 17.416 0.90813 17.0906C0.609825 16.7923 0.584967 16.3241 0.833554 15.9974L0.90813 15.9121L5.29998 11.5194L1.91701 8.13699C1.51 7.72998 1.48287 7.08695 1.83561 6.64847L1.91701 6.55781C2.10549 6.36932 2.35519 6.25448 2.62096 6.23404L6.79808 5.91272C6.86951 5.90722 6.93662 5.87636 6.98728 5.8257L9.65395 3.15903C9.69585 3.11714 9.72441 3.06377 9.73603 3.00567L10.0694 1.33856Z" fill="currentColor"/>
 </svg>

package/assets/svg/voicePreview.svg

@@ -1,5 +1,4 @@
 <svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
-<rect width="40" height="40" rx="8" fill="#F3F5F7"/>
-<circle cx="20" cy="20" r="14" fill="#0DBD8B"/>
-<path d="M25.0239 19.1307C25.6587 19.5145 25.6587 20.4839 25.0239 20.8676L18.4122 24.8653C17.7828 25.2459 17 24.7645 17 23.9969V16.0015C17 15.2338 17.7828 14.7525 18.4122 15.133L25.0239 19.1307Z" fill="white"/>
+<rect width="40" height="40" rx="20" fill="#5159F6"/>
+<path d="M27.5359 18.6961C28.488 19.2718 28.488 20.7258 27.5359 21.3015L17.6183 27.298C16.6742 27.8688 15.5 27.1467 15.5 25.9953V14.0022C15.5 12.8508 16.6742 12.1287 17.6183 12.6995L27.5359 18.6961Z" fill="white"/>
 </svg>

package/assets/svg/voicePreviewPause.svg

@@ -1,5 +1,4 @@
 <svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
-<rect width="40" height="40" rx="8" fill="#F3F5F7"/>
-<circle cx="20" cy="20" r="14" fill="#0DBD8B"/>
-<path d="M17.9744 15C18.3311 15 18.4604 15.0371 18.5907 15.1069C18.7211 15.1766 18.8234 15.2789 18.8931 15.4093C18.9629 15.5396 19 15.6689 19 16.0256V23.9744C19 24.3311 18.9629 24.4604 18.8931 24.5907C18.8234 24.7211 18.7211 24.8234 18.5907 24.8931C18.4604 24.9629 18.3311 25 17.9744 25H17.0256C16.6689 25 16.5396 24.9629 16.4093 24.8931C16.2789 24.8234 16.1766 24.7211 16.1069 24.5907C16.0371 24.4604 16 24.3311 16 23.9744V16.0256C16 15.6689 16.0371 15.5396 16.1069 15.4093C16.1766 15.2789 16.2789 15.1766 16.4093 15.1069C16.5396 15.0371 16.6689 15 17.0256 15H17.9744ZM22.9744 15C23.3311 15 23.4604 15.0371 23.5907 15.1069C23.7211 15.1766 23.8234 15.2789 23.8931 15.4093C23.9629 15.5396 24 15.6689 24 16.0256V23.9744C24 24.3311 23.9629 24.4604 23.8931 24.5907C23.8234 24.7211 23.7211 24.8234 23.5907 24.8931C23.4604 24.9629 23.3311 25 22.9744 25H22.0256C21.6689 25 21.5396 24.9629 21.4093 24.8931C21.2789 24.8234 21.1766 24.7211 21.1069 24.5907C21.0371 24.4604 21 24.3311 21 23.9744V16.0256C21 15.6689 21.0371 15.5396 21.1069 15.4093C21.1766 15.2789 21.2789 15.1766 21.4093 15.1069C21.5396 15.0371 21.6689 15 22.0256 15H22.9744Z" fill="white"/>
+<rect width="40" height="40" rx="20" fill="#5159F6"/>
+<path d="M16.9617 12.5C17.4966 12.5 17.6906 12.5557 17.8861 12.6603C18.0817 12.7649 18.2351 12.9183 18.3397 13.1139C18.4443 13.3094 18.5 13.5034 18.5 14.0383V25.9617C18.5 26.4966 18.4443 26.6906 18.3397 26.8861C18.2351 27.0817 18.0817 27.2351 17.8861 27.3397C17.6906 27.4443 17.4966 27.5 16.9617 27.5H15.5383C15.0034 27.5 14.8094 27.4443 14.6139 27.3397C14.4183 27.2351 14.2649 27.0817 14.1603 26.8861C14.0557 26.6906 14 26.4966 14 25.9617V14.0383C14 13.5034 14.0557 13.3094 14.1603 13.1139C14.2649 12.9183 14.4183 12.7649 14.6139 12.6603C14.8094 12.5557 15.0034 12.5 15.5383 12.5H16.9617ZM24.4617 12.5C24.9966 12.5 25.1906 12.5557 25.3861 12.6603C25.5817 12.7649 25.7351 12.9183 25.8397 13.1139C25.9443 13.3094 26 13.5034 26 14.0383V25.9617C26 26.4966 25.9443 26.6906 25.8397 26.8861C25.7351 27.0817 25.5817 27.2351 25.3861 27.3397C25.1906 27.4443 24.9966 27.5 24.4617 27.5H23.0383C22.5034 27.5 22.3094 27.4443 22.1139 27.3397C21.9183 27.2351 21.7649 27.0817 21.6603 26.8861C21.5557 26.6906 21.5 26.4966 21.5 25.9617V14.0383C21.5 13.5034 21.5557 13.3094 21.6603 13.1139C21.7649 12.9183 21.9183 12.7649 22.1139 12.6603C22.3094 12.5557 22.5034 12.5 23.0383 12.5H24.4617Z" fill="white"/>
 </svg>

package/components/Attachment/index.d.ts

@@ -24,7 +24,9 @@ interface AttachmentPops {
 }
 declare const _default: React.MemoExoticComponent<({ attachment, isPreview, removeSelected, isRepliedMessage, borderRadius, handleMediaItemClick, setVideoIsReadyToSend, selectedFileAttachmentsIcon, backgroundColor, selectedFileAttachmentsBoxBorder, selectedFileAttachmentsTitleColor, selectedFileAttachmentsSizeColor, isDetailsView, imageMinWidth, closeMessageActions, fileAttachmentWidth, imageAttachmentMaxWidth, imageAttachmentMaxHeight, videoAttachmentMaxWidth, videoAttachmentMaxHeight }: AttachmentPops) => React.JSX.Element>;
 export default _default;
-export declare const SizeProgress: import("styled-components").StyledComponent<"span", any, {}, never>;
+export declare const SizeProgress: import("styled-components").StyledComponent<"span", any, {
+    color: string;
+}, never>;
 export declare const AttachmentFile: import("styled-components").StyledComponent<"div", any, {
     isPreview?: boolean | undefined;
     isRepliedMessage?: boolean | undefined;
@@ -33,6 +35,7 @@ export declare const AttachmentFile: import("styled-components").StyledComponent
     background?: string | undefined;
     border?: string | undefined;
     width?: number | undefined;
+    borderColor: string;
 }, never>;
 export declare const AttachmentImg: import("styled-components").StyledComponent<"img", any, {
     absolute?: boolean | undefined;
@@ -43,7 +46,6 @@ export declare const AttachmentImg: import("styled-components").StyledComponent<
     hidden?: boolean | undefined;
     isRepliedMessage?: boolean | undefined;
     fitTheContainer?: boolean | undefined;
-    backgroundColor: string;
     imageMinWidth?: string | undefined;
     imageMaxHeight?: string | undefined;
 }, never>;

package/components/Avatar/index.d.ts

@@ -30,5 +30,9 @@ interface AvatarImageProps {
 }
 export declare const Container: import("styled-components").StyledComponent<"div", any, ContainerProps, never>;
 export declare const AvatarImage: import("styled-components").StyledComponent<"img", any, AvatarImageProps, never>;
-export declare const DefaultAvatarWrapper: import("styled-components").StyledComponent<any, any, object, string | number | symbol>;
-export declare const DeletedAvatarWrapper: import("styled-components").StyledComponent<any, any, object, string | number | symbol>;
+export declare const DefaultAvatarWrapper: import("styled-components").StyledComponent<any, any, object & {
+    color: string;
+}, string | number | symbol>;
+export declare const DeletedAvatarWrapper: import("styled-components").StyledComponent<any, any, object & {
+    color: string;
+}, string | number | symbol>;

package/components/Channel/index.d.ts

@@ -31,7 +31,7 @@ declare const Channel: React.FC<IChannelProps>;
 export default Channel;
 export interface UnreadCountProps {
     readonly isMuted: boolean;
-    readonly backgroundColor?: string;
+    readonly backgroundColor: string;
     readonly mutedBackgroundColor?: string;
     width?: string;
     height?: string;
@@ -49,7 +49,9 @@ export declare const ChannelInfo: import("styled-components").StyledComponent<"d
     subjectColor: string;
     avatarSize?: number | undefined;
 }, never>;
-export declare const MutedIcon: import("styled-components").StyledComponent<"span", any, {}, never>;
+export declare const MutedIcon: import("styled-components").StyledComponent<"span", any, {
+    color: string;
+}, never>;
 export declare const LastMessage: import("styled-components").StyledComponent<"div", any, {
     color: string;
     markedAsUnread?: boolean | undefined;
@@ -90,7 +92,7 @@ export declare const LastMessageDate: import("styled-components").StyledComponen
 }, never>;
 export declare const DeliveryIconCont: import("styled-components").StyledComponent<"span", any, {}, never>;
 export declare const UnreadMentionIconWrapper: import("styled-components").StyledComponent<"span", any, {
-    iconColor?: string | undefined;
+    iconColor: string;
     rightMargin?: boolean | undefined;
 }, never>;
 export declare const TypingIndicator: import("styled-components").StyledComponent<"span", any, {}, never>;

package/components/ChannelDetails/Actions/index.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import { IChannel, MuteTime } from '../../../types';
 interface IProps {
+    setActionsHeight?: (height: number) => void;
     channel: IChannel;
     theme?: string;
     actionMenuOpen?: () => void;
@@ -67,5 +68,5 @@ interface IProps {
     actionItemsFontSize?: string;
     borderColor?: string;
 }
-declare const Actions: ({ channel, actionMenuOpen, theme, menuIsOpen, toggleable, showMuteUnmuteNotifications, muteUnmuteNotificationsOrder, muteNotificationIcon, unmuteNotificationIcon, muteNotificationIconColor, unmuteNotificationIconColor, muteUnmuteNotificationTextColor, timeOptionsToMuteNotifications, showStarredMessages, starredMessagesOrder, staredMessagesIcon, staredMessagesIconColor, staredMessagesTextColor, showPinChannel, pinChannelOrder, pinChannelIcon, unpinChannelIcon, pinChannelIconColor, pinChannelTextColor, showMarkAsReadUnread, markAsReadUnreadOrder, markAsReadIcon, markAsUnreadIcon, markAsReadIconColor, markAsUnreadIconColor, markAsReadUnreadTextColor, showLeaveChannel, leaveChannelOrder, leaveChannelIcon, leaveChannelIconColor, leaveChannelTextColor, showReportChannel, reportChannelIcon, reportChannelOrder, reportChannelIconColor, reportChannelTextColor, showDeleteChannel, deleteChannelIcon, deleteChannelIconColor, deleteChannelTextColor, deleteChannelOrder, showBlockAndLeaveChannel, showBlockUser, blockAndLeaveChannelIcon, unblockUserIcon, blockAndLeaveChannelIconColor, blockAndLeaveChannelTextColor, unblockUserTextColor, showClearHistory, clearHistoryOrder, clearHistoryIcon, clearHistoryTextColor, deleteAllMessagesOrder, deleteAllMessagesIcon, deleteAllMessagesTextColor, actionItemsFontSize, borderColor }: IProps) => React.JSX.Element;
+declare const Actions: ({ setActionsHeight, channel, actionMenuOpen, theme, menuIsOpen, toggleable, showMuteUnmuteNotifications, muteUnmuteNotificationsOrder, muteNotificationIcon, unmuteNotificationIcon, muteNotificationIconColor, unmuteNotificationIconColor, muteUnmuteNotificationTextColor, timeOptionsToMuteNotifications, showStarredMessages, starredMessagesOrder, staredMessagesIcon, staredMessagesIconColor, staredMessagesTextColor, showPinChannel, pinChannelOrder, pinChannelIcon, unpinChannelIcon, pinChannelIconColor, pinChannelTextColor, showMarkAsReadUnread, markAsReadUnreadOrder, markAsReadIcon, markAsUnreadIcon, markAsReadIconColor, markAsUnreadIconColor, markAsReadUnreadTextColor, showLeaveChannel, leaveChannelOrder, leaveChannelIcon, leaveChannelIconColor, leaveChannelTextColor, showReportChannel, reportChannelIcon, reportChannelOrder, reportChannelIconColor, reportChannelTextColor, showDeleteChannel, deleteChannelIcon, deleteChannelIconColor, deleteChannelTextColor, deleteChannelOrder, showBlockAndLeaveChannel, showBlockUser, blockAndLeaveChannelIcon, unblockUserIcon, blockAndLeaveChannelIconColor, blockAndLeaveChannelTextColor, unblockUserTextColor, showClearHistory, clearHistoryOrder, clearHistoryIcon, clearHistoryTextColor, deleteAllMessagesOrder, deleteAllMessagesIcon, deleteAllMessagesTextColor, actionItemsFontSize, borderColor }: IProps) => React.JSX.Element;
 export default Actions;

package/components/ChannelDetails/DetailsTab/Files/index.d.ts

@@ -13,5 +13,5 @@ interface IProps {
     fileSizeFontSize?: string;
     fileSizeLineHeight?: string;
 }
-declare const Files: ({ channelId, theme, filePreviewIcon, filePreviewHoverIcon, filePreviewTitleColor, filePreviewSizeColor, filePreviewHoverBackgroundColor, filePreviewDownloadIcon, fileNameFontSize, fileNameLineHeight, fileSizeFontSize, fileSizeLineHeight }: IProps) => React.JSX.Element;
+declare const Files: ({ channelId, filePreviewIcon, filePreviewHoverIcon, filePreviewTitleColor, filePreviewSizeColor, filePreviewHoverBackgroundColor, filePreviewDownloadIcon, fileNameFontSize, fileNameLineHeight, fileSizeFontSize, fileSizeLineHeight }: IProps) => React.JSX.Element;
 export default Files;

package/components/ChannelList/ContactItem/index.d.ts

@@ -27,8 +27,7 @@ interface IChannelProps {
 declare const ContactItem: React.FC<IChannelProps>;
 export default ContactItem;
 export declare const ChannelInfo: import("styled-components").StyledComponent<"div", any, {
-    lightTextColor: string;
-    darkTextColor: string;
+    textColor: string;
     avatar?: boolean | undefined;
     theme?: string | undefined;
     subjectFontSize?: string | undefined;

package/components/ChatContainer/index.d.ts

@@ -18,16 +18,14 @@ export interface ICustomUploader {
     download: (uri: string, download: boolean, progressCallback?: (progress: any) => void) => Promise<any>;
     cancelRequest: (requestPromise: any) => void;
 }
-export declare type ThemeColors = 'accent' | 'background' | 'sectionBackground' | 'focusBackground' | 'hoverBackground' | 'textPrimary' | 'textSecondary' | 'textFootnote' | 'textOnPrimary' | 'border' | 'iconPrimary' | 'iconInactive' | 'surface1' | 'surface2' | 'overlayBackground' | 'overlayBackground2' | 'error';
+export declare type ThemeColors = 'accent' | 'avatarBrand1' | 'avatarBrand2' | 'avatarBrand3' | 'avatarBrand4' | 'textPrimary' | 'textSecondary' | 'textFootnote' | 'textOnPrimary' | 'border' | 'iconInactive' | 'iconPrimary' | 'background' | 'backgroundSections' | 'backgroundFocused' | 'backgroundHovered' | 'overlayBackground' | 'overlayBackground2' | 'surface1' | 'surface2' | 'surfaceX' | 'warning' | 'attention' | 'onlineStatus' | 'success' | 'outgoingMessageBackground' | 'outgoingMessageBackgroundX' | 'incomingMessageBackground' | 'incomingMessageBackgroundX' | 'linkColor' | 'highlightedBackground';
 export interface ThemeColor {
     light: string;
     dark?: string;
     [key: string]: string | undefined;
 }
 export interface SceytChatUIKitTheme {
-    colors: {
-        [key in ThemeColors]?: ThemeColor;
-    };
+    colors: Partial<Record<ThemeColors, ThemeColor>>;
 }
 export declare type ThemeMode = 'light' | 'dark' | string;
 export interface IChatClientProps {

package/components/Message/Message.types.d.ts

@@ -186,5 +186,6 @@ export interface IMessageProps {
     theme: string;
     messageTextFontSize?: string;
     messageTextLineHeight?: string;
+    messageTimeColorOnAttachment?: string;
 }
 export {};

package/components/Message/MessageBody/index.d.ts

@@ -83,6 +83,7 @@ interface IMessageBodyProps {
     messageTimeFontSize?: string;
     messageTimeColor?: string;
     messageStatusAndTimeLineHeight?: string;
+    messageTimeColorOnAttachment?: string;
     fileAttachmentsBoxWidth?: number;
     fileAttachmentsBoxBackground?: string;
     fileAttachmentsBoxBorder?: string;
@@ -125,5 +126,5 @@ interface IMessageBodyProps {
     handleCreateChat: (user?: IUser) => void;
     messageTextRef: React.RefObject<HTMLSpanElement>;
 }
-declare const _default: React.MemoExoticComponent<({ message, channel, MessageActionsMenu, handleScrollToRepliedMessage, handleMediaItemClick, isPendingMessage, prevMessage, nextMessage, isUnreadMessage, unreadMessageId, isThreadMessage, fontFamily, ownMessageOnRightSide, showSenderNameOnDirectChannel, showSenderNameOnGroupChannel, showSenderNameOnOwnMessages, messageStatusAndTimePosition, messageStatusDisplayingType, outgoingMessageStyles, incomingMessageStyles, ownRepliedMessageBackground, incomingRepliedMessageBackground, showMessageStatus, showMessageTimeAndStatusOnlyOnHover, showMessageTime, showMessageStatusForEachMessage, showMessageTimeForEachMessage, messageReaction, editMessage, copyMessage, replyMessage, replyMessageInThread, deleteMessage, selectMessage, allowEditDeleteIncomingMessage, forwardMessage, reportMessage, reactionIcon, editIcon, copyIcon, replyIcon, replyInThreadIcon, forwardIcon, deleteIcon, selectIcon, starIcon, staredIcon, reportIcon, reactionIconOrder, editIconOrder, copyIconOrder, replyIconOrder, replyInThreadIconOrder, forwardIconOrder, deleteIconOrder, selectIconOrder, starIconOrder, reportIconOrder, reactionIconTooltipText, editIconTooltipText, copyIconTooltipText, replyIconTooltipText, replyInThreadIconTooltipText, forwardIconTooltipText, deleteIconTooltipText, selectIconTooltipText, starIconTooltipText, reportIconTooltipText, messageActionIconsColor, messageStatusSize, messageStatusColor, messageReadStatusColor, messageStateFontSize, messageStateColor, messageTimeFontSize, messageTimeColor, messageStatusAndTimeLineHeight, fileAttachmentsIcon, fileAttachmentsBoxWidth, fileAttachmentsBoxBorder, fileAttachmentsTitleColor, fileAttachmentsSizeColor, imageAttachmentMaxWidth, imageAttachmentMaxHeight, videoAttachmentMaxWidth, videoAttachmentMaxHeight, emojisCategoryIconsPosition, emojisContainerBorderRadius, fixEmojiCategoriesTitleOnTop, selectedMessagesMap, contactsMap, theme, messageTextFontSize, messageTextLineHeight, handleToggleForwardMessagePopup, messageActionsShow, closeMessageActions, handleDeletePendingMessage, handleReplyMessage, handleToggleDeleteMessagePopup, handleToggleReportPopupOpen, handleResendMessage, handleOpenEmojis, emojisPopupOpen, setEmojisPopupOpen, emojisPopupPosition, frequentlyEmojisOpen, handleCopyMessage, toggleEditMode, handleSelectMessage, handleMouseEnter, handleMouseLeave, handleReactionAddDelete, handleCreateChat, messageTextRef }: IMessageBodyProps) => React.JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ message, channel, MessageActionsMenu, handleScrollToRepliedMessage, handleMediaItemClick, isPendingMessage, prevMessage, nextMessage, isUnreadMessage, unreadMessageId, isThreadMessage, fontFamily, ownMessageOnRightSide, showSenderNameOnDirectChannel, showSenderNameOnGroupChannel, showSenderNameOnOwnMessages, messageStatusAndTimePosition, messageStatusDisplayingType, outgoingMessageStyles, incomingMessageStyles, ownRepliedMessageBackground, incomingRepliedMessageBackground, showMessageStatus, showMessageTimeAndStatusOnlyOnHover, showMessageTime, showMessageStatusForEachMessage, showMessageTimeForEachMessage, messageReaction, editMessage, copyMessage, replyMessage, replyMessageInThread, deleteMessage, selectMessage, allowEditDeleteIncomingMessage, forwardMessage, reportMessage, reactionIcon, editIcon, copyIcon, replyIcon, replyInThreadIcon, forwardIcon, deleteIcon, selectIcon, starIcon, staredIcon, reportIcon, reactionIconOrder, editIconOrder, copyIconOrder, replyIconOrder, replyInThreadIconOrder, forwardIconOrder, deleteIconOrder, selectIconOrder, starIconOrder, reportIconOrder, reactionIconTooltipText, editIconTooltipText, copyIconTooltipText, replyIconTooltipText, replyInThreadIconTooltipText, forwardIconTooltipText, deleteIconTooltipText, selectIconTooltipText, starIconTooltipText, reportIconTooltipText, messageActionIconsColor, messageStatusSize, messageStatusColor, messageReadStatusColor, messageStateFontSize, messageStateColor, messageTimeFontSize, messageTimeColor, messageStatusAndTimeLineHeight, messageTimeColorOnAttachment, fileAttachmentsIcon, fileAttachmentsBoxWidth, fileAttachmentsBoxBorder, fileAttachmentsTitleColor, fileAttachmentsSizeColor, imageAttachmentMaxWidth, imageAttachmentMaxHeight, videoAttachmentMaxWidth, videoAttachmentMaxHeight, emojisCategoryIconsPosition, emojisContainerBorderRadius, fixEmojiCategoriesTitleOnTop, selectedMessagesMap, contactsMap, theme, messageTextFontSize, messageTextLineHeight, handleToggleForwardMessagePopup, messageActionsShow, closeMessageActions, handleDeletePendingMessage, handleReplyMessage, handleToggleDeleteMessagePopup, handleToggleReportPopupOpen, handleResendMessage, handleOpenEmojis, emojisPopupOpen, setEmojisPopupOpen, emojisPopupPosition, frequentlyEmojisOpen, handleCopyMessage, toggleEditMode, handleSelectMessage, handleMouseEnter, handleMouseLeave, handleReactionAddDelete, handleCreateChat, messageTextRef }: IMessageBodyProps) => React.JSX.Element>;
 export default _default;

package/components/Message/MessageStatusAndTime/index.d.ts

@@ -20,6 +20,7 @@ interface IMessageStatusAndTime {
     ownMessageOnRightSide?: boolean;
     bottomOfMessage?: boolean;
     marginBottom?: string;
+    messageTimeColorOnAttachment: string;
 }
-declare const _default: React.MemoExoticComponent<({ message, messageStatusDisplayingType, showMessageTimeAndStatusOnlyOnHover, messageStatusSize, messageStatusColor, messageReadStatusColor, messageStateFontSize, messageStateColor, messageTimeFontSize, messageTimeColor, messageStatusAndTimeLineHeight, messageTimeVisible, messageStatusVisible, withAttachment, fileAttachment, ownMessageOnRightSide, leftMargin, bottomOfMessage, marginBottom }: IMessageStatusAndTime) => React.JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ message, messageStatusDisplayingType, showMessageTimeAndStatusOnlyOnHover, messageStatusSize, messageStatusColor, messageReadStatusColor, messageStateFontSize, messageStateColor, messageTimeFontSize, messageTimeColor, messageStatusAndTimeLineHeight, messageTimeVisible, messageStatusVisible, withAttachment, fileAttachment, ownMessageOnRightSide, leftMargin, bottomOfMessage, marginBottom, messageTimeColorOnAttachment }: IMessageStatusAndTime) => React.JSX.Element>;
 export default _default;

package/components/Message/RepliedMessage/index.d.ts

@@ -26,5 +26,5 @@ interface IRepliedMessageProps {
         [key: string]: any;
     };
 }
-declare const _default: React.MemoExoticComponent<({ message, theme, handleScrollToRepliedMessage, ownMessageOnRightSide, ownRepliedMessageBackground, incomingRepliedMessageBackground, showMessageSenderName, borderRadius, fileAttachmentsIcon, fileAttachmentsBoxWidth, fileAttachmentsBoxBorder, fileAttachmentsTitleColor, fileAttachmentsSizeColor, imageAttachmentMaxWidth, imageAttachmentMaxHeight, videoAttachmentMaxWidth, videoAttachmentMaxHeight, selectionIsActive, notLinkAttachment, contactsMap }: IRepliedMessageProps) => React.JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ message, handleScrollToRepliedMessage, ownMessageOnRightSide, ownRepliedMessageBackground, incomingRepliedMessageBackground, showMessageSenderName, borderRadius, fileAttachmentsIcon, fileAttachmentsBoxWidth, fileAttachmentsBoxBorder, fileAttachmentsTitleColor, fileAttachmentsSizeColor, imageAttachmentMaxWidth, imageAttachmentMaxHeight, videoAttachmentMaxWidth, videoAttachmentMaxHeight, selectionIsActive, notLinkAttachment, contactsMap }: IRepliedMessageProps) => React.JSX.Element>;
 export default _default;

package/components/Message/index.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { IMessageProps } from './Message.types';
-declare const _default: React.MemoExoticComponent<({ message, channel, MessageActionsMenu, CustomMessageItem, handleScrollToRepliedMessage, handleMediaItemClick, stopScrolling, isPendingMessage, prevMessage, nextMessage, setLastVisibleMessageId, isUnreadMessage, unreadMessageId, isThreadMessage, fontFamily, ownMessageOnRightSide, messageWidthPercent, showSenderNameOnDirectChannel, showSenderNameOnGroupChannel, showSenderNameOnOwnMessages, messageStatusAndTimePosition, messageStatusDisplayingType, outgoingMessageStyles, incomingMessageStyles, ownRepliedMessageBackground, incomingRepliedMessageBackground, showOwnAvatar, showMessageStatus, showMessageTimeAndStatusOnlyOnHover, showMessageTime, showMessageStatusForEachMessage, showMessageTimeForEachMessage, hoverBackground, messageReaction, editMessage, copyMessage, replyMessage, replyMessageInThread, deleteMessage, selectMessage, allowEditDeleteIncomingMessage, forwardMessage, reportMessage, reactionIcon, editIcon, copyIcon, replyIcon, replyInThreadIcon, forwardIcon, deleteIcon, selectIcon, starIcon, staredIcon, reportIcon, reactionIconOrder, openFrequentlyUsedReactions, editIconOrder, copyIconOrder, replyIconOrder, replyInThreadIconOrder, forwardIconOrder, deleteIconOrder, selectIconOrder, starIconOrder, reportIconOrder, reactionIconTooltipText, editIconTooltipText, copyIconTooltipText, replyIconTooltipText, replyInThreadIconTooltipText, forwardIconTooltipText, deleteIconTooltipText, selectIconTooltipText, starIconTooltipText, reportIconTooltipText, messageActionIconsColor, messageStatusSize, messageStatusColor, messageReadStatusColor, messageStateFontSize, messageStateColor, messageTimeFontSize, messageTimeColor, messageStatusAndTimeLineHeight, fileAttachmentsIcon, reactionsDisplayCount, showEachReactionCount, showTotalReactionCount, reactionItemBorder, reactionItemBorderRadius, reactionItemBackground, reactionItemPadding, reactionItemMargin, reactionsFontSize, reactionsContainerBoxShadow, reactionsContainerBorder, reactionsContainerBorderRadius, reactionsContainerBackground, reactionsContainerPadding, reactionsContainerTopPosition, reactionsDetailsPopupBorderRadius, reactionsDetailsPopupHeaderItemsStyle, fileAttachmentsBoxWidth, fileAttachmentsBoxBorder, fileAttachmentsTitleColor, fileAttachmentsSizeColor, imageAttachmentMaxWidth, imageAttachmentMaxHeight, videoAttachmentMaxWidth, videoAttachmentMaxHeight, emojisCategoryIconsPosition, emojisContainerBorderRadius, fixEmojiCategoriesTitleOnTop, sameUserMessageSpacing, differentUserMessageSpacing, selectedMessagesMap, contactsMap, openedMessageMenuId, tabIsActive, connectionStatus, theme, messageTextFontSize, messageTextLineHeight }: IMessageProps) => React.JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ message, channel, MessageActionsMenu, CustomMessageItem, handleScrollToRepliedMessage, handleMediaItemClick, stopScrolling, isPendingMessage, prevMessage, nextMessage, setLastVisibleMessageId, isUnreadMessage, unreadMessageId, isThreadMessage, fontFamily, ownMessageOnRightSide, messageWidthPercent, showSenderNameOnDirectChannel, showSenderNameOnGroupChannel, showSenderNameOnOwnMessages, messageStatusAndTimePosition, messageStatusDisplayingType, outgoingMessageStyles, incomingMessageStyles, ownRepliedMessageBackground, incomingRepliedMessageBackground, showOwnAvatar, showMessageStatus, showMessageTimeAndStatusOnlyOnHover, showMessageTime, showMessageStatusForEachMessage, showMessageTimeForEachMessage, hoverBackground, messageReaction, editMessage, copyMessage, replyMessage, replyMessageInThread, deleteMessage, selectMessage, allowEditDeleteIncomingMessage, forwardMessage, reportMessage, reactionIcon, editIcon, copyIcon, replyIcon, replyInThreadIcon, forwardIcon, deleteIcon, selectIcon, starIcon, staredIcon, reportIcon, reactionIconOrder, openFrequentlyUsedReactions, editIconOrder, copyIconOrder, replyIconOrder, replyInThreadIconOrder, forwardIconOrder, deleteIconOrder, selectIconOrder, starIconOrder, reportIconOrder, reactionIconTooltipText, editIconTooltipText, copyIconTooltipText, replyIconTooltipText, replyInThreadIconTooltipText, forwardIconTooltipText, deleteIconTooltipText, selectIconTooltipText, starIconTooltipText, reportIconTooltipText, messageActionIconsColor, messageStatusSize, messageStatusColor, messageReadStatusColor, messageStateFontSize, messageStateColor, messageTimeFontSize, messageTimeColor, messageStatusAndTimeLineHeight, fileAttachmentsIcon, reactionsDisplayCount, showEachReactionCount, showTotalReactionCount, reactionItemBorder, reactionItemBorderRadius, reactionItemBackground, reactionItemPadding, reactionItemMargin, reactionsFontSize, reactionsContainerBoxShadow, reactionsContainerBorder, reactionsContainerBorderRadius, reactionsContainerBackground, reactionsContainerPadding, reactionsContainerTopPosition, reactionsDetailsPopupBorderRadius, reactionsDetailsPopupHeaderItemsStyle, fileAttachmentsBoxWidth, fileAttachmentsBoxBorder, fileAttachmentsTitleColor, fileAttachmentsSizeColor, imageAttachmentMaxWidth, imageAttachmentMaxHeight, videoAttachmentMaxWidth, videoAttachmentMaxHeight, emojisCategoryIconsPosition, emojisContainerBorderRadius, fixEmojiCategoriesTitleOnTop, sameUserMessageSpacing, differentUserMessageSpacing, selectedMessagesMap, contactsMap, openedMessageMenuId, tabIsActive, connectionStatus, theme, messageTextFontSize, messageTextLineHeight, messageTimeColorOnAttachment }: IMessageProps) => React.JSX.Element>;
 export default _default;

package/components/MessageDivider/index.d.ts

@@ -10,7 +10,7 @@ export declare const Container: import("styled-components").StyledComponent<"div
     dateDividerFontSize?: string | undefined;
     dateDividerTextColor?: string | undefined;
     dateDividerBackgroundColor?: string | undefined;
-    newMessagesSeparatorSpaceColor?: string | undefined;
+    newMessagesSeparatorSpaceColor: string;
     dateDividerBorderRadius?: string | undefined;
     newMessagesSeparatorLeftRightSpaceWidth?: string | undefined;
     height?: number | undefined;

package/components/Messages/MessageList/index.d.ts

@@ -179,6 +179,7 @@ export default MessageList;
 export declare const Container: import("styled-components").StyledComponent<"div", any, {
     stopScrolling?: boolean | undefined;
     backgroundColor?: string | undefined;
+    thumbColor: string;
 }, never>;
 export declare const EmptyDiv: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const MessageTopDate: import("styled-components").StyledComponent<"div", any, {
@@ -195,6 +196,7 @@ export declare const MessageTopDate: import("styled-components").StyledComponent
 export declare const DragAndDropContainer: import("styled-components").StyledComponent<"div", any, {
     topOffset?: number | undefined;
     height?: number | undefined;
+    backgroundColor?: string | undefined;
 }, never>;
 export declare const IconWrapper: import("styled-components").StyledComponent<"span", any, {
     backgroundColor: string;
@@ -204,6 +206,9 @@ export declare const DropAttachmentArea: import("styled-components").StyledCompo
     backgroundColor: string;
     color: string;
     margin?: string | undefined;
+    iconBackgroundColor: string;
+    borderColor: string;
+    draggedBorderColor: string;
 }, never>;
 export declare const MessageWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const NoMessagesContainer: import("styled-components").StyledComponent<"div", any, {

package/components/SendMessageInput/MentionsPlugin/index.d.ts

@@ -22,5 +22,5 @@ export declare const MentionsContainerWrapper: import("styled-components").Style
 }, never>;
 export declare const MemberItem: import("styled-components").StyledComponent<"li", any, {
     isActiveItem?: boolean | undefined;
-    activeBackgroundColor?: string | undefined;
+    activeBackgroundColor: string;
 }, never>;

package/components/SendMessageInput/RecordingAnimation.d.ts

@@ -1,3 +1,5 @@
 import React from 'react';
-declare const RecordingAnimation: React.FC;
+declare const RecordingAnimation: React.FC<{
+    borderColor: string;
+}>;
 export default RecordingAnimation;

package/components/VideoPreview/index.d.ts

@@ -22,6 +22,7 @@ export declare const AttachmentFile: import("styled-components").StyledComponent
     borderRadius?: string | undefined;
     background?: string | undefined;
     border?: string | undefined;
+    borderColor: string;
 }, never>;
 export declare const AttachmentImg: import("styled-components").StyledComponent<"img", any, {
     borderRadius?: string | undefined;