stream-chat-react 13.14.1 → 14.0.0-beta.1

package/dist/components/MessageList/hooks/useMarkRead.js

@@ -1,87 +0,0 @@
-import { useEffect } from 'react';
-import { useChannelActionContext, useChannelStateContext, useChatContext, } from '../../../context';
-const hasReadLastMessage = (channel, userId) => {
-    const latestMessageIdInChannel = channel.state.latestMessages.slice(-1)[0]?.id;
-    const lastReadMessageIdServer = channel.state.read[userId]?.last_read_message_id;
-    return latestMessageIdInChannel === lastReadMessageIdServer;
-};
-/**
- * Takes care of marking a channel read. The channel is read only if all the following applies:
- * 1. the message list is not rendered in a thread
- * 2. the message list is scrolled to the bottom
- * 3. the channel was not marked unread by the user
- * @param isMessageListScrolledToBottom
- * @param messageListIsThread
- * @param wasChannelMarkedUnread
- */
-export const useMarkRead = ({ isMessageListScrolledToBottom, messageListIsThread, wasMarkedUnread, }) => {
-    const { client } = useChatContext('useMarkRead');
-    const { markRead, setChannelUnreadUiState } = useChannelActionContext('useMarkRead');
-    const { channel } = useChannelStateContext('useMarkRead');
-    useEffect(() => {
-        if (!channel.getConfig()?.read_events)
-            return;
-        const shouldMarkRead = () => !document.hidden &&
-            !wasMarkedUnread &&
-            !messageListIsThread &&
-            isMessageListScrolledToBottom &&
-            client.user?.id &&
-            !hasReadLastMessage(channel, client.user.id);
-        const onVisibilityChange = () => {
-            if (shouldMarkRead())
-                markRead();
-        };
-        const handleMessageNew = (event) => {
-            const mainChannelUpdated = !event.message?.parent_id || event.message?.show_in_channel;
-            if (!isMessageListScrolledToBottom || wasMarkedUnread || document.hidden) {
-                setChannelUnreadUiState((prev) => {
-                    const previousUnreadCount = prev?.unread_messages ?? 0;
-                    const previousLastMessage = getPreviousLastMessage(channel.state.messages, event.message);
-                    return {
-                        ...(prev || {}),
-                        last_read: prev?.last_read ??
-                            (previousUnreadCount === 0 && previousLastMessage?.created_at
-                                ? new Date(previousLastMessage.created_at)
-                                : new Date(0)), // not having information about the last read message means the whole channel is unread,
-                        unread_messages: previousUnreadCount + 1,
-                    };
-                });
-            }
-            else if (mainChannelUpdated && shouldMarkRead()) {
-                markRead();
-            }
-        };
-        channel.on('message.new', handleMessageNew);
-        document.addEventListener('visibilitychange', onVisibilityChange);
-        if (shouldMarkRead()) {
-            markRead();
-        }
-        return () => {
-            channel.off('message.new', handleMessageNew);
-            document.removeEventListener('visibilitychange', onVisibilityChange);
-        };
-    }, [
-        channel,
-        client,
-        isMessageListScrolledToBottom,
-        markRead,
-        messageListIsThread,
-        setChannelUnreadUiState,
-        wasMarkedUnread,
-    ]);
-};
-function getPreviousLastMessage(messages, newMessage) {
-    if (!newMessage)
-        return;
-    let previousLastMessage;
-    for (let i = messages.length - 1; i >= 0; i--) {
-        const msg = messages[i];
-        if (!msg?.id)
-            break;
-        if (msg.id !== newMessage.id) {
-            previousLastMessage = msg;
-            break;
-        }
-    }
-    return previousLastMessage;
-}

package/dist/components/MessageList/icons.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-interface ArrowProps {
-    className?: string;
-    color?: string;
-}
-export declare const ArrowUp: ({ className, color }: ArrowProps) => React.JSX.Element;
-export declare const ArrowDown: ({ className, color }: ArrowProps) => React.JSX.Element;
-export declare const CloseIcon: () => React.JSX.Element;
-export {};

package/dist/components/MessageList/icons.js

@@ -1,7 +0,0 @@
-import React from 'react';
-export const ArrowUp = ({ className, color }) => (React.createElement("svg", { className: className, "data-testid": 'arrow-up', fill: 'none', height: '24', viewBox: '0 0 24 24', width: '24', xmlns: 'http://www.w3.org/2000/svg' },
-    React.createElement("path", { d: 'M16.59 15.7051L12 11.1251L7.41 15.7051L6 14.2951L12 8.29508L18 14.2951L16.59 15.7051Z', fill: color || 'var(--primary-color)' })));
-export const ArrowDown = ({ className, color }) => (React.createElement("svg", { className: className, "data-testid": 'arrow-down', fill: 'none', height: '24', viewBox: '0 0 24 24', width: '24', xmlns: 'http://www.w3.org/2000/svg' },
-    React.createElement("path", { d: 'M7.41 8.29504L12 12.875L16.59 8.29504L18 9.70504L12 15.705L6 9.70504L7.41 8.29504Z', fill: color || 'var(--primary-color)' })));
-export const CloseIcon = () => (React.createElement("svg", { fill: 'currentColor', viewBox: '0 0 14 13', xmlns: 'http://www.w3.org/2000/svg' },
-    React.createElement("path", { d: 'M1.32227 12.3408C0.944336 11.9629 0.953125 11.3213 1.32227 10.9521L5.60254 6.66309L1.32227 2.38281C0.953125 2.01367 0.944336 1.37207 1.32227 0.994141C1.7002 0.616211 2.3418 0.625 2.71094 0.985352L7 5.27441L11.2803 0.994141C11.6494 0.625 12.291 0.616211 12.6689 0.994141C13.0469 1.37207 13.0381 2.01367 12.6689 2.38281L8.38867 6.66309L12.6689 10.9521C13.0381 11.3213 13.0469 11.9629 12.6689 12.3408C12.291 12.7188 11.6494 12.71 11.2803 12.3408L7 8.06055L2.71094 12.3408C2.3418 12.71 1.7002 12.7188 1.32227 12.3408Z' })));

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

@@ -1,12 +0,0 @@
-export * from './ConnectionStatus';
-export * from './GiphyPreviewMessage';
-export * from './MessageList';
-export * from './MessageListNotifications';
-export * from './MessageNotification';
-export * from './ScrollToBottomButton';
-export * from './UnreadMessagesNotification';
-export * from './UnreadMessagesSeparator';
-export * from './VirtualizedMessageList';
-export * from './hooks';
-export * from './renderMessages';
-export * from './utils';

package/dist/components/MessageList/index.js

@@ -1,12 +0,0 @@
-export * from './ConnectionStatus'; // TODO: export this under its own folder
-export * from './GiphyPreviewMessage';
-export * from './MessageList';
-export * from './MessageListNotifications';
-export * from './MessageNotification';
-export * from './ScrollToBottomButton';
-export * from './UnreadMessagesNotification';
-export * from './UnreadMessagesSeparator';
-export * from './VirtualizedMessageList';
-export * from './hooks';
-export * from './renderMessages';
-export * from './utils';

package/dist/components/MessageList/renderMessages.d.ts

@@ -1,36 +0,0 @@
-import type { ReactNode } from 'react';
-import React from 'react';
-import type { GroupStyle, RenderedMessage } from './utils';
-import type { MessageProps } from '../Message';
-import type { LocalMessage, UserResponse } from 'stream-chat';
-import type { ComponentContextValue, CustomClasses } from '../../context';
-import type { ChannelUnreadUiState } from '../../types';
-export interface RenderMessagesOptions {
-    components: ComponentContextValue;
-    lastReceivedMessageId: string | null;
-    messageGroupStyles: Record<string, GroupStyle>;
-    messages: Array<RenderedMessage>;
-    ownMessagesDeliveredToOthers: Record<string, UserResponse[]>;
-    /**
-     * Object mapping message IDs of own messages to the users who read those messages.
-     */
-    readData: Record<string, Array<UserResponse>>;
-    /**
-     * Props forwarded to the Message component.
-     */
-    sharedMessageProps: SharedMessageProps;
-    /** Latest own message in currently displayed message set. */
-    lastOwnMessage?: LocalMessage;
-    /**
-     * Current user's channel read state used to render components reflecting unread state.
-     * It does not reflect the back-end state if a channel is marked read on mount.
-     * This is in order to keep the unread UI when an unread channel is open.
-     */
-    channelUnreadUiState?: ChannelUnreadUiState;
-    customClasses?: CustomClasses;
-}
-export type SharedMessageProps = Omit<MessageProps, MessagePropsToOmit>;
-export type MessageRenderer = (options: RenderMessagesOptions) => Array<ReactNode>;
-type MessagePropsToOmit = 'channel' | 'deliveredTo' | 'groupStyles' | 'initialMessage' | 'lastReceivedId' | 'message' | 'readBy';
-export declare function defaultRenderMessages({ channelUnreadUiState, components, customClasses, lastOwnMessage, lastReceivedMessageId: lastReceivedId, messageGroupStyles, messages, ownMessagesDeliveredToOthers, readData, sharedMessageProps: messageProps, }: RenderMessagesOptions): React.JSX.Element[];
-export {};

package/dist/components/MessageList/renderMessages.js

@@ -1,52 +0,0 @@
-import React, { Fragment } from 'react';
-import { getIsFirstUnreadMessage, isDateSeparatorMessage, isIntroMessage } from './utils';
-import { Message } from '../Message';
-import { DateSeparator as DefaultDateSeparator } from '../DateSeparator';
-import { EventComponent as DefaultMessageSystem } from '../EventComponent';
-import { UnreadMessagesSeparator as DefaultUnreadMessagesSeparator } from './UnreadMessagesSeparator';
-export function defaultRenderMessages({ channelUnreadUiState, components, customClasses, lastOwnMessage, lastReceivedMessageId: lastReceivedId, messageGroupStyles, messages, ownMessagesDeliveredToOthers, readData, sharedMessageProps: messageProps, }) {
-    const { DateSeparator = DefaultDateSeparator, HeaderComponent, MessageListItem = 'li', MessageSystem = DefaultMessageSystem, UnreadMessagesSeparator = DefaultUnreadMessagesSeparator, } = components;
-    const renderedMessages = [];
-    let firstMessage;
-    let previousMessage = undefined;
-    for (let index = 0; index < messages.length; index++) {
-        const message = messages[index];
-        if (isDateSeparatorMessage(message)) {
-            renderedMessages.push(React.createElement(MessageListItem, { "data-index": index, key: `${message.date.toISOString()}-i` },
-                React.createElement(DateSeparator, { date: message.date, formatDate: messageProps.formatDate, unread: message.unread })));
-        }
-        else if (isIntroMessage(message)) {
-            if (HeaderComponent) {
-                renderedMessages.push(React.createElement(MessageListItem, { "data-index": index, key: 'intro' },
-                    React.createElement(HeaderComponent, null)));
-            }
-        }
-        else if (message.type === 'system') {
-            renderedMessages.push(React.createElement(MessageListItem, { "data-index": index, "data-message-id": message.id, key: message.id || message.created_at.toISOString() },
-                React.createElement(MessageSystem, { message: message })));
-        }
-        else {
-            if (!firstMessage) {
-                firstMessage = message;
-            }
-            const groupStyles = messageGroupStyles[message.id] || '';
-            const messageClass = customClasses?.message || `str-chat__li str-chat__li--${groupStyles}`;
-            const isFirstUnreadMessage = getIsFirstUnreadMessage({
-                firstUnreadMessageId: channelUnreadUiState?.first_unread_message_id,
-                isFirstMessage: !!firstMessage?.id && firstMessage.id === message.id,
-                lastReadDate: channelUnreadUiState?.last_read,
-                lastReadMessageId: channelUnreadUiState?.last_read_message_id,
-                message,
-                previousMessage,
-                unreadMessageCount: channelUnreadUiState?.unread_messages,
-            });
-            renderedMessages.push(React.createElement(Fragment, { key: message.id || message.created_at.toISOString() },
-                isFirstUnreadMessage && UnreadMessagesSeparator && (React.createElement(MessageListItem, { className: 'str-chat__li str-chat__unread-messages-separator-wrapper' },
-                    React.createElement(UnreadMessagesSeparator, { unreadCount: channelUnreadUiState?.unread_messages }))),
-                React.createElement(MessageListItem, { className: messageClass, "data-index": index, "data-message-id": message.id, "data-testid": messageClass },
-                    React.createElement(Message, { deliveredTo: ownMessagesDeliveredToOthers[message.id] || [], groupStyles: [groupStyles], lastOwnMessage: lastOwnMessage, lastReceivedId: lastReceivedId, message: message, readBy: readData[message.id] || [], ...messageProps }))));
-            previousMessage = message;
-        }
-    }
-    return renderedMessages;
-}

package/dist/components/MessageList/utils.d.ts

@@ -1,82 +0,0 @@
-/// <reference types="react" />
-import { CUSTOM_MESSAGE_TYPE } from '../../constants/messageTypes';
-import type { LocalMessage, MessageLabel } from 'stream-chat';
-type IntroMessage = {
-    customType: typeof CUSTOM_MESSAGE_TYPE.intro;
-    id: string;
-};
-type DateSeparatorMessage = {
-    customType: typeof CUSTOM_MESSAGE_TYPE.date;
-    date: Date;
-    id: string;
-    type: MessageLabel;
-    unread: boolean;
-};
-export type RenderedMessage = LocalMessage | DateSeparatorMessage | IntroMessage;
-type ProcessMessagesContext = {
-    /** the connected user ID */
-    userId: string;
-    /** Enable date separator */
-    enableDateSeparator?: boolean;
-    /** Enable deleted messages to be filtered out of resulting message list */
-    hideDeletedMessages?: boolean;
-    /** Disable date separator display for unread incoming messages */
-    hideNewMessageSeparator?: boolean;
-    /** Sets the threshold after everything is considered unread */
-    lastRead?: Date | null;
-};
-export type ProcessMessagesParams = ProcessMessagesContext & {
-    messages: LocalMessage[];
-    reviewProcessedMessage?: (params: {
-        /** array of messages representing the changes applied around a given processed message */
-        changes: RenderedMessage[];
-        /** configuration params and information forwarded from `processMessages` */
-        context: ProcessMessagesContext;
-        /** index of the processed message in the original messages array */
-        index: number;
-        /** array of messages retrieved from the back-end */
-        messages: LocalMessage[];
-        /** newly built array of messages to be later rendered */
-        processedMessages: RenderedMessage[];
-    }) => LocalMessage[];
-    /** Signals whether to separate giphy preview as well as used to set the giphy preview state */
-    setGiphyPreviewMessage?: React.Dispatch<React.SetStateAction<LocalMessage | undefined>>;
-};
-/**
- * processMessages - Transform the input message list according to config parameters
- *
- * Inserts date separators btw. messages created on different dates or before unread incoming messages. By default:
- * - enabled in main message list
- * - disabled in virtualized message list
- * - disabled in thread
- *
- * Allows to filter out deleted messages, contolled by hideDeletedMessages param. This is disabled by default.
- *
- * Sets Giphy preview message for VirtualizedMessageList
- *
- * The only required params are messages and userId, the rest are config params:
- *
- * @return {LocalMessage[]} Transformed list of messages
- */
-export declare const processMessages: (params: ProcessMessagesParams) => RenderedMessage[];
-export declare const makeIntroMessage: () => IntroMessage;
-export declare const makeDateMessageId: (date?: string | Date) => string;
-export declare const getLastReceived: (messages: RenderedMessage[]) => string | null;
-export declare const insertIntro: (messages: RenderedMessage[], headerPosition?: number) => RenderedMessage[];
-export type GroupStyle = '' | 'middle' | 'top' | 'bottom' | 'single';
-export declare const getGroupStyles: (message: RenderedMessage, previousMessage: RenderedMessage, nextMessage: RenderedMessage, noGroupByUser: boolean, maxTimeBetweenGroupedMessages?: number) => GroupStyle;
-export declare const hasMoreMessagesProbably: (returnedCountMessages: number, limit: number) => boolean;
-export declare const hasNotMoreMessages: (returnedCountMessages: number, limit: number) => boolean;
-export declare function isIntroMessage(message: unknown): message is IntroMessage;
-export declare function isDateSeparatorMessage(message: unknown): message is DateSeparatorMessage;
-export declare function isLocalMessage(message: unknown): message is LocalMessage;
-export declare const getIsFirstUnreadMessage: ({ firstUnreadMessageId, isFirstMessage, lastReadDate, lastReadMessageId, message, previousMessage, unreadMessageCount, }: {
-    isFirstMessage: boolean;
-    message: LocalMessage;
-    firstUnreadMessageId?: string;
-    lastReadDate?: Date;
-    lastReadMessageId?: string;
-    previousMessage?: RenderedMessage;
-    unreadMessageCount?: number;
-}) => boolean;
-export {};

package/dist/components/MessageList/utils.js

@@ -1,246 +0,0 @@
-import { nanoid } from 'nanoid';
-import { CUSTOM_MESSAGE_TYPE } from '../../constants/messageTypes';
-import { isMessageEdited } from '../Message/utils';
-import { isDate } from '../../i18n';
-/**
- * processMessages - Transform the input message list according to config parameters
- *
- * Inserts date separators btw. messages created on different dates or before unread incoming messages. By default:
- * - enabled in main message list
- * - disabled in virtualized message list
- * - disabled in thread
- *
- * Allows to filter out deleted messages, contolled by hideDeletedMessages param. This is disabled by default.
- *
- * Sets Giphy preview message for VirtualizedMessageList
- *
- * The only required params are messages and userId, the rest are config params:
- *
- * @return {LocalMessage[]} Transformed list of messages
- */
-export const processMessages = (params) => {
-    const { messages, reviewProcessedMessage, setGiphyPreviewMessage, ...context } = params;
-    const { enableDateSeparator, hideDeletedMessages, hideNewMessageSeparator, lastRead, userId, } = context;
-    let unread = false;
-    let ephemeralMessagePresent = false;
-    let lastDateSeparator;
-    const newMessages = [];
-    for (let i = 0; i < messages.length; i += 1) {
-        const message = messages[i];
-        if (hideDeletedMessages && message.type === 'deleted') {
-            continue;
-        }
-        if (setGiphyPreviewMessage &&
-            message.type === 'ephemeral' &&
-            message.command === 'giphy') {
-            ephemeralMessagePresent = true;
-            setGiphyPreviewMessage(message);
-            continue;
-        }
-        const changes = [];
-        const messageDate = (message.created_at &&
-            isDate(message.created_at) &&
-            message.created_at.toDateString()) ||
-            '';
-        const previousMessage = messages[i - 1];
-        let prevMessageDate = messageDate;
-        if (enableDateSeparator &&
-            previousMessage?.created_at &&
-            isDate(previousMessage.created_at)) {
-            prevMessageDate = previousMessage.created_at.toDateString();
-        }
-        if (!unread && !hideNewMessageSeparator) {
-            unread =
-                (lastRead && message.created_at && new Date(lastRead) < message.created_at) ||
-                    false;
-            // do not show date separator for current user's messages
-            if (enableDateSeparator && unread && message.user?.id !== userId) {
-                changes.push({
-                    customType: CUSTOM_MESSAGE_TYPE.date,
-                    date: message.created_at,
-                    id: makeDateMessageId(message.created_at),
-                    unread,
-                });
-            }
-        }
-        if (enableDateSeparator &&
-            (i === 0 || // always put date separator before the first message
-                messageDate !== prevMessageDate || // add date separator btw. 2 messages created on different date
-                // if hiding deleted messages replace the previous deleted message(s) with A separator if the last rendered message was created on different date
-                (hideDeletedMessages &&
-                    previousMessage?.type === 'deleted' &&
-                    lastDateSeparator !== messageDate)) &&
-            !isDateSeparatorMessage(changes[changes.length - 1]) // do not show two date separators in a row)
-        ) {
-            lastDateSeparator = messageDate;
-            changes.push({
-                customType: CUSTOM_MESSAGE_TYPE.date,
-                date: message.created_at,
-                id: makeDateMessageId(message.created_at),
-            }, message);
-        }
-        else {
-            changes.push(message);
-        }
-        newMessages.push(...(reviewProcessedMessage?.({
-            changes,
-            context,
-            index: i,
-            messages,
-            processedMessages: newMessages,
-        }) || changes));
-    }
-    // clean up the giphy preview component state after a Cancel action
-    if (setGiphyPreviewMessage && !ephemeralMessagePresent) {
-        setGiphyPreviewMessage(undefined);
-    }
-    return newMessages;
-};
-export const makeIntroMessage = () => ({
-    customType: CUSTOM_MESSAGE_TYPE.intro,
-    id: nanoid(),
-});
-export const makeDateMessageId = (date) => {
-    let idSuffix;
-    try {
-        idSuffix = !date ? nanoid() : date instanceof Date ? date.toISOString() : date;
-    }
-    catch (e) {
-        idSuffix = nanoid();
-    }
-    return `${CUSTOM_MESSAGE_TYPE.date}-${idSuffix}`;
-};
-// fast since it usually iterates just the last few messages
-export const getLastReceived = (messages) => {
-    for (let i = messages.length - 1; i > 0; i -= 1) {
-        if (messages[i].status === 'received') {
-            return messages[i].id;
-        }
-    }
-    return null;
-};
-export const insertIntro = (messages, headerPosition) => {
-    const newMessages = messages;
-    const intro = makeIntroMessage();
-    // if no headerPosition is set, HeaderComponent will go at the top
-    if (!headerPosition) {
-        newMessages.unshift(intro);
-        return newMessages;
-    }
-    // if no messages, intro gets inserted
-    if (!newMessages.length) {
-        newMessages.unshift(intro);
-        return newMessages;
-    }
-    // else loop over the messages
-    for (let i = 0; i < messages.length; i += 1) {
-        const messageTime = isDate(messages[i].created_at)
-            ? messages[i].created_at.getTime()
-            : null;
-        const nextMessageTime = isDate(messages[i + 1].created_at)
-            ? messages[i + 1].created_at.getTime()
-            : null;
-        // header position is smaller than message time so comes after;
-        if (messageTime && messageTime < headerPosition) {
-            // if header position is also smaller than message time continue;
-            if (nextMessageTime && nextMessageTime < headerPosition) {
-                if (messages[i + 1] && isDateSeparatorMessage(messages[i + 1]))
-                    continue;
-                if (!nextMessageTime) {
-                    newMessages.push(intro);
-                    return newMessages;
-                }
-            }
-            else {
-                newMessages.splice(i + 1, 0, intro);
-                return newMessages;
-            }
-        }
-    }
-    return newMessages;
-};
-export const getGroupStyles = (message, previousMessage, nextMessage, noGroupByUser, maxTimeBetweenGroupedMessages) => {
-    if (isDateSeparatorMessage(message) || isIntroMessage(message))
-        return '';
-    if (noGroupByUser || message.attachments?.length !== 0)
-        return 'single';
-    const isTopMessage = !previousMessage ||
-        isIntroMessage(previousMessage) ||
-        isDateSeparatorMessage(previousMessage) ||
-        previousMessage.type === 'system' ||
-        previousMessage.type === 'error' ||
-        previousMessage.attachments?.length !== 0 ||
-        message.user?.id !== previousMessage.user?.id ||
-        previousMessage.deleted_at ||
-        (message.reaction_groups && Object.keys(message.reaction_groups).length > 0) ||
-        isMessageEdited(previousMessage) ||
-        (maxTimeBetweenGroupedMessages !== undefined &&
-            previousMessage.created_at &&
-            message.created_at &&
-            new Date(message.created_at).getTime() -
-                new Date(previousMessage.created_at).getTime() >
-                maxTimeBetweenGroupedMessages);
-    const isBottomMessage = !nextMessage ||
-        isIntroMessage(nextMessage) ||
-        isDateSeparatorMessage(nextMessage) ||
-        nextMessage.type === 'system' ||
-        nextMessage.type === 'error' ||
-        nextMessage.attachments?.length !== 0 ||
-        message.user?.id !== nextMessage.user?.id ||
-        nextMessage.deleted_at ||
-        (nextMessage.reaction_groups &&
-            Object.keys(nextMessage.reaction_groups).length > 0) ||
-        isMessageEdited(message) ||
-        (maxTimeBetweenGroupedMessages !== undefined &&
-            nextMessage.created_at &&
-            message.created_at &&
-            new Date(nextMessage.created_at).getTime() -
-                new Date(message.created_at).getTime() >
-                maxTimeBetweenGroupedMessages);
-    if (!isTopMessage && !isBottomMessage) {
-        if (message.deleted_at || message.type === 'error')
-            return 'single';
-        return 'middle';
-    }
-    if (isBottomMessage) {
-        if (isTopMessage || message.deleted_at || message.type === 'error')
-            return 'single';
-        return 'bottom';
-    }
-    if (isTopMessage)
-        return 'top';
-    return '';
-};
-// "Probably" included, because it may happen that the last page was returned and it has exactly the size of the limit
-// but the back-end cannot provide us with information on whether it has still more messages in the DB
-// FIXME: once the pagination state is moved from Channel to MessageList, these should be moved as well.
-//  The MessageList should have configurable the limit for performing the requests.
-//  This parameter would then be used within these functions
-export const hasMoreMessagesProbably = (returnedCountMessages, limit) => returnedCountMessages >= limit;
-// @deprecated
-export const hasNotMoreMessages = (returnedCountMessages, limit) => returnedCountMessages < limit;
-export function isIntroMessage(message) {
-    return message.customType === CUSTOM_MESSAGE_TYPE.intro;
-}
-export function isDateSeparatorMessage(message) {
-    return (message !== null &&
-        typeof message === 'object' &&
-        message.customType === CUSTOM_MESSAGE_TYPE.date &&
-        isDate(message.date));
-}
-export function isLocalMessage(message) {
-    return !isDateSeparatorMessage(message) && !isIntroMessage(message);
-}
-export const getIsFirstUnreadMessage = ({ firstUnreadMessageId, isFirstMessage, lastReadDate, lastReadMessageId, message, previousMessage, unreadMessageCount = 0, }) => {
-    // prevent showing unread indicator in threads
-    if (message.parent_id)
-        return false;
-    const createdAtTimestamp = message.created_at && new Date(message.created_at).getTime();
-    const lastReadTimestamp = lastReadDate?.getTime();
-    const messageIsUnread = !!createdAtTimestamp && !!lastReadTimestamp && createdAtTimestamp > lastReadTimestamp;
-    const previousMessageIsLastRead = !!lastReadMessageId && lastReadMessageId === previousMessage?.id;
-    return (firstUnreadMessageId === message.id ||
-        (!!unreadMessageCount &&
-            messageIsUnread &&
-            (isFirstMessage || previousMessageIsLastRead)));
-};

package/dist/components/Modal/GlobalModal.d.ts

@@ -1,4 +0,0 @@
-import type { PropsWithChildren } from 'react';
-import React from 'react';
-import type { ModalProps } from './Modal';
-export declare const GlobalModal: ({ children, className, onClose, onCloseAttempt, open, }: PropsWithChildren<ModalProps>) => React.JSX.Element | null;

package/dist/components/Modal/GlobalModal.js

@@ -1,57 +0,0 @@
-import clsx from 'clsx';
-import { useCallback } from 'react';
-import React, { useEffect, useRef } from 'react';
-import { FocusScope } from '@react-aria/focus';
-import { CloseIconRound } from './icons';
-import { modalDialogManagerId, useTranslationContext } from '../../context';
-import { DialogPortalEntry, modalDialogId, useModalDialog, useModalDialogIsOpen, } from '../Dialog';
-export const GlobalModal = ({ children, className, onClose, onCloseAttempt, open, }) => {
-    const { t } = useTranslationContext('Modal');
-    const dialog = useModalDialog();
-    const isOpen = useModalDialogIsOpen();
-    const innerRef = useRef(null);
-    const closeButtonRef = useRef(null);
-    const maybeClose = useCallback((source, event) => {
-        const allow = onCloseAttempt?.(source, event);
-        if (allow !== false) {
-            onClose?.(event);
-            dialog.close();
-        }
-    }, [dialog, onClose, onCloseAttempt]);
-    const handleClick = (event) => {
-        const target = event.target;
-        if (!innerRef.current || !closeButtonRef.current)
-            return;
-        if (innerRef.current?.contains(target))
-            return;
-        if (closeButtonRef.current.contains(target)) {
-            maybeClose('button', event);
-        }
-        else if (!innerRef.current.contains(target)) {
-            maybeClose('overlay', event);
-        }
-    };
-    useEffect(() => {
-        if (!isOpen)
-            return;
-        const handleKeyDown = (event) => {
-            if (event.key === 'Escape')
-                maybeClose('escape', event);
-        };
-        document.addEventListener('keydown', handleKeyDown);
-        return () => document.removeEventListener('keydown', handleKeyDown);
-    }, [isOpen, maybeClose]);
-    useEffect(() => {
-        if (open && !dialog.isOpen) {
-            dialog.open();
-        }
-    }, [dialog, open]);
-    if (!open || !isOpen)
-        return null;
-    return (React.createElement(DialogPortalEntry, { dialogId: modalDialogId, dialogManagerId: modalDialogManagerId },
-        React.createElement("div", { className: clsx('str-chat str-chat__modal str-chat-react__modal str-chat__modal--open', className), onClick: handleClick },
-            React.createElement(FocusScope, { autoFocus: true, contain: true },
-                React.createElement("button", { className: 'str-chat__modal__close-button', ref: closeButtonRef, title: t('Close'), type: 'button' },
-                    React.createElement(CloseIconRound, null)),
-                React.createElement("div", { className: 'str-chat__modal__inner str-chat-react__modal__inner', ref: innerRef }, children)))));
-};

package/dist/components/Modal/Modal.d.ts

@@ -1,15 +0,0 @@
-import { type PropsWithChildren } from 'react';
-import React from 'react';
-export type ModalCloseEvent = KeyboardEvent | React.KeyboardEvent | React.MouseEvent<HTMLButtonElement | HTMLDivElement>;
-export type ModalCloseSource = 'overlay' | 'button' | 'escape';
-export type ModalProps = {
-    /** If true, modal is opened or visible. */
-    open: boolean;
-    /** Custom class to be applied to the modal root div */
-    className?: string;
-    /** Callback handler for closing of modal. */
-    onClose?: (event: ModalCloseEvent) => void;
-    /** Optional handler to intercept closing logic. Return false to prevent onClose. */
-    onCloseAttempt?: (source: ModalCloseSource, event: ModalCloseEvent) => boolean;
-};
-export declare const Modal: ({ children, className, onClose, onCloseAttempt, open, }: PropsWithChildren<ModalProps>) => React.JSX.Element | null;