sceyt-chat-react-uikit 1.9.0-beta.8 → 1.9.0

package/assets/svg/chevron_right_circle.svg

@@ -0,0 +1,3 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M3.125 10C3.125 6.20304 6.20304 3.125 10 3.125C13.797 3.125 16.875 6.20304 16.875 10C16.875 13.797 13.797 16.875 10 16.875C6.20304 16.875 3.125 13.797 3.125 10ZM10 1.25C5.16751 1.25 1.25 5.16751 1.25 10C1.25 14.8325 5.16751 18.75 10 18.75C14.8325 18.75 18.75 14.8325 18.75 10C18.75 5.16751 14.8325 1.25 10 1.25ZM9.91291 6.52283C9.5468 6.15672 8.95321 6.15672 8.58709 6.52283C8.22097 6.88895 8.22097 7.48254 8.58709 7.84866L10.7384 9.99994L8.58709 12.1512C8.22097 12.5173 8.22097 13.1109 8.58709 13.477C8.95321 13.8432 9.5468 13.8432 9.91291 13.477L12.7271 10.6629C12.9029 10.487 13.0017 10.2486 13.0017 9.99994C13.0017 9.7513 12.9029 9.51284 12.7271 9.33703L9.91291 6.52283Z" fill="#818C99"/>
+</svg>

package/components/ChannelList/index.d.ts

@@ -32,6 +32,8 @@ interface IChannelListProps {
     searchInputBorderRadius?: string;
     searchChannelsPadding?: string;
     getSelectedChannel?: (channel: IChannel) => void;
+    /** Called whenever the raw channel-search input changes, including clear. */
+    onSearchValueChange?: (value: string) => void;
     filter?: {
         channelType?: string;
     };

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

@@ -74,6 +74,7 @@ interface ICustomMessageItem {
     isThreadMessage?: boolean;
     handleOpenUserProfile: (user: IUser) => void;
     unsupportedMessage: boolean;
+    isPinnedMessagesList?: boolean;
     onInviteLinkClick?: (key: string) => void;
     ifLatestAndHasNotPreview: boolean;
 }
@@ -90,6 +91,8 @@ export interface IMessageProps {
     queueReadMarker?: (channelId: string, messageId?: string) => void;
     queueDeliveredMarker?: (channelId: string, messageId?: string) => void;
     disableAutoReadTracking?: boolean;
+    /** The message is rendered inside the pinned-messages overlay, not #scrollableDiv. */
+    isPinnedMessagesList?: boolean;
     handleScrollToRepliedMessage: (msgId: string) => void;
     handleMediaItemClick?: (attachment: IAttachment) => void;
     unreadMessageId: string;

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

@@ -31,6 +31,7 @@ interface MessageReactionsProps {
     reactionsContainerPadding?: string;
     reactionsDetailsPopupBorderRadius?: string;
     reactionsDetailsPopupHeaderItemsStyle?: 'bubbles' | 'inline';
+    popupZIndex?: number;
     onToggleReactionsPopup: () => void;
     onReactionAddDelete: (selectedEmoji: string) => void;
     onOpenUserProfile: (user?: any) => void;

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, queueReadMarker, queueDeliveredMarker, disableAutoReadTracking, isUnreadMessage, nextMessageStartsUnreadSection, 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, showInfoMessage, allowEditDeleteIncomingMessage, forwardMessage, reportMessage, reactionIcon, editIcon, copyIcon, replyIcon, replyInThreadIcon, forwardIcon, deleteIcon, selectIcon, starIcon, staredIcon, reportIcon, retractVoteIcon, endVoteIcon, reactionIconOrder, openFrequentlyUsedReactions, editIconOrder, copyIconOrder, replyIconOrder, replyInThreadIconOrder, forwardIconOrder, deleteIconOrder, selectIconOrder, starIconOrder, reportIconOrder, infoIconOrder, reactionIconTooltipText, editIconTooltipText, copyIconTooltipText, replyIconTooltipText, replyInThreadIconTooltipText, forwardIconTooltipText, deleteIconTooltipText, selectIconTooltipText, starIconTooltipText, reportIconTooltipText, infoIconTooltipText, 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, tabIsActiveRef, connectionStatus, messageTextFontSize, messageTextLineHeight, messageTimeColorOnAttachment, shouldOpenUserProfileForMention, ogMetadataProps, showInfoMessageProps, collapsedLinesLimit, createChatOnAvatarTap, ifLatestAndHasNotPreview }: IMessageProps) => React.JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ message, channel, MessageActionsMenu, CustomMessageItem, handleScrollToRepliedMessage, handleMediaItemClick, stopScrolling, isPendingMessage, prevMessage, nextMessage, setLastVisibleMessageId, queueReadMarker, queueDeliveredMarker, disableAutoReadTracking, isUnreadMessage, nextMessageStartsUnreadSection, 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, showInfoMessage, allowEditDeleteIncomingMessage, forwardMessage, reportMessage, reactionIcon, editIcon, copyIcon, replyIcon, replyInThreadIcon, forwardIcon, deleteIcon, selectIcon, starIcon, staredIcon, reportIcon, retractVoteIcon, endVoteIcon, reactionIconOrder, openFrequentlyUsedReactions, editIconOrder, copyIconOrder, replyIconOrder, replyInThreadIconOrder, forwardIconOrder, deleteIconOrder, selectIconOrder, starIconOrder, reportIconOrder, infoIconOrder, reactionIconTooltipText, editIconTooltipText, copyIconTooltipText, replyIconTooltipText, replyInThreadIconTooltipText, forwardIconTooltipText, deleteIconTooltipText, selectIconTooltipText, starIconTooltipText, reportIconTooltipText, infoIconTooltipText, 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, tabIsActiveRef, connectionStatus, messageTextFontSize, messageTextLineHeight, messageTimeColorOnAttachment, shouldOpenUserProfileForMention, ogMetadataProps, showInfoMessageProps, collapsedLinesLimit, createChatOnAvatarTap, ifLatestAndHasNotPreview, isPinnedMessagesList }: IMessageProps) => React.JSX.Element>;
 export default _default;

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

@@ -106,6 +106,13 @@ interface MessagesProps {
     endVoteIcon?: JSX.Element;
     /** Replaces the default pin icon in the pinned-messages banner. */
     pinnedMessageIcon?: JSX.Element;
+    /**
+     * Replaces the compact pinned-message preview for app-specific message
+     * types. Return null or undefined to use the UIKit preview.
+     */
+    renderPinnedMessagePreview?: (message: IMessage, context: {
+        placement: 'banner' | 'system';
+    }) => React.ReactNode | null | undefined;
     messageStatusSize?: string;
     messageStatusColor?: string;
     messageReadStatusColor?: string;
@@ -224,6 +231,9 @@ export declare const Container: import("styled-components").StyledComponent<"div
     backgroundColor?: string | undefined;
     thumbColor: string;
 }, never>;
+export declare const MessagesBox: import("styled-components").StyledComponent<"div", any, {
+    $isJumping?: boolean | undefined;
+}, never>;
 export declare const DragAndDropContainer: import("styled-components").StyledComponent<"div", any, {
     topOffset?: number | undefined;
     height?: number | undefined;

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

@@ -48,6 +48,7 @@ export interface UseChatControllerParams {
     dispatch: (...args: any[]) => void;
     tabIsActive?: boolean;
 }
+export declare const formatMessageDateLabel: (message: IMessage) => string;
 export declare function useChatController({ messages, channel, hasPrevMessages, hasNextMessages, loadingPrevMessages, loadingNextMessages, connectionStatus, scrollToNewMessage, scrollToMentionedMessage, showScrollToNewMessageButton, unreadScrollTo, unreadMessageId, visibleMessagesMap, selectedMessagesMap, allowEditDeleteIncomingMessage, tabIsActive, dispatch }: UseChatControllerParams): {
     scrollRef: import("react").MutableRefObject<HTMLDivElement | null>;
     setLastVisibleMessageId: (message: IMessage) => void;

package/components/Messages/PinnedMessagesBanner.d.ts

@@ -1,6 +1,15 @@
 import React from 'react';
-declare const PinnedMessagesBanner: ({ channelId, pinIcon }: {
+import { IMessage } from '../../types';
+declare const PinnedMessagesBanner: ({ channelId, pinIcon, onOpenList, renderPinnedMessagePreview }: {
     channelId: string;
     pinIcon?: JSX.Element | undefined;
+    onOpenList?: (() => void) | undefined;
+    /**
+     * Lets an integrator replace the compact preview for app-specific message
+     * types. Return null or undefined to keep the UIKit preview.
+     */
+    renderPinnedMessagePreview?: ((message: IMessage, context: {
+        placement: 'banner' | 'system';
+    }) => React.ReactNode | null | undefined) | undefined;
 }) => React.JSX.Element | null;
 export default PinnedMessagesBanner;

package/components/Messages/PinnedMessagesList.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+import { IMessage } from '../../types';
+declare type RenderPinnedMessage = (args: {
+    message: IMessage;
+    prevMessage: IMessage | null;
+    nextMessage: IMessage | null;
+    index: number;
+}) => React.ReactNode;
+declare type ScrollContainerComponent = React.ComponentType<any>;
+declare type MessagesContainerComponent = React.ComponentType<{
+    children?: React.ReactNode;
+}>;
+declare const PinnedMessagesList: ({ channelId, onClose, closeRequested, renderMessage, ScrollContainer, MessagesContainer }: {
+    channelId: string;
+    onClose: () => void;
+    closeRequested?: boolean | undefined;
+    renderMessage: RenderPinnedMessage;
+    ScrollContainer: ScrollContainerComponent;
+    MessagesContainer: MessagesContainerComponent;
+}) => React.JSX.Element;
+export default PinnedMessagesList;

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

@@ -14,8 +14,12 @@ interface ISystemMessageProps {
     backgroundColor?: string;
     borderRadius?: string;
     setLastVisibleMessageId?: (message: IMessage) => void;
+    /** Replaces a PM source-message preview for app-specific message types. */
+    renderPinnedMessagePreview?: (message: IMessage, context: {
+        placement: 'banner' | 'system';
+    }) => React.ReactNode | null | undefined;
 }
-declare const _default: React.MemoExoticComponent<({ message, nextMessage, channel, differentUserMessageSpacing, fontSize, textColor, border, backgroundColor, borderRadius, contactsMap, setLastVisibleMessageId }: ISystemMessageProps) => React.JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ message, nextMessage, channel, differentUserMessageSpacing, fontSize, textColor, border, backgroundColor, borderRadius, contactsMap, setLastVisibleMessageId, renderPinnedMessagePreview }: ISystemMessageProps) => React.JSX.Element>;
 export default _default;
 export declare const Container: import("styled-components").StyledComponent<"div", any, {
     topOffset?: number | undefined;

package/components/Messages/index.d.ts

@@ -99,6 +99,13 @@ interface MessagesProps {
     endVoteIcon?: JSX.Element;
     /** Replaces the default pin icon in the pinned-messages banner. */
     pinnedMessageIcon?: JSX.Element;
+    /**
+     * Replaces the compact pinned-message preview for app-specific message
+     * types. Return null or undefined to use the UIKit preview.
+     */
+    renderPinnedMessagePreview?: (message: IMessage, context: {
+        placement: 'banner' | 'system';
+    }) => React.ReactNode | null | undefined;
     openFrequentlyUsedReactions?: boolean;
     fixEmojiCategoriesTitleOnTop?: boolean;
     emojisCategoryIconsPosition?: 'top' | 'bottom';

package/components/SendMessageInput/draftOwnership.d.ts

@@ -0,0 +1,24 @@
+export declare type ComposerDraft = {
+    text: string;
+    mentionedUsers: any[];
+    messageForReply: any;
+    editorState: any;
+    bodyAttributes: any;
+    attachments: any[];
+    viewOnce: boolean;
+};
+export declare type DraftHandoff = {
+    channelId: string;
+    draft: ComposerDraft;
+    persist: boolean;
+};
+declare type ComposerState = ComposerDraft & {
+    channelId: string;
+    nextChannelId: string;
+};
+/**
+ * Returns the only draft write allowed while the active chat changes. The
+ * composer values belong to `channelId`, never to `nextChannelId`.
+ */
+export declare const getDraftHandoff: ({ channelId, nextChannelId, text, mentionedUsers, messageForReply, editorState, bodyAttributes, attachments, viewOnce }: ComposerState) => DraftHandoff | null;
+export {};

package/components/SendMessageInput/sendMessageUtils.d.ts

@@ -1,6 +1,7 @@
 export declare const hasSendableTextOrPoll: (messageText: string, isPoll: boolean) => boolean;
 export declare const DEFAULT_MEDIA_EXTENSIONS: string[];
 export declare const isDefaultSupportedMediaMimeType: (mimeType: string) => boolean;
+export declare const getClipboardFiles: (clipboardData: Pick<DataTransfer, 'files' | 'items'>) => File[];
 declare type MediaAttachmentValidationOptions = {
     allowedExtensions?: string[];
     sizeLimitKb?: number;