stream-chat-react 11.8.0 → 11.9.0

package/dist/components/MessageList/UnreadMessagesNotification.js

@@ -2,11 +2,13 @@ import React from 'react';
 import { CloseIcon } from './icons';
 import { useChannelActionContext, useTranslationContext } from '../../context';
 export var UnreadMessagesNotification = function (_a) {
-    var queryMessageLimit = _a.queryMessageLimit, unreadCount = _a.unreadCount;
+    var queryMessageLimit = _a.queryMessageLimit, showCount = _a.showCount, unreadCount = _a.unreadCount;
     var _b = useChannelActionContext('UnreadMessagesNotification'), jumpToFirstUnreadMessage = _b.jumpToFirstUnreadMessage, markRead = _b.markRead;
     var t = useTranslationContext('UnreadMessagesNotification').t;
     return (React.createElement("div", { className: 'str-chat__unread-messages-notification', "data-testid": 'unread-messages-notification' },
-        React.createElement("button", { onClick: function () { return jumpToFirstUnreadMessage(queryMessageLimit); } }, t('{{count}} unread', { count: unreadCount !== null && unreadCount !== void 0 ? unreadCount : 0 })),
+        React.createElement("button", { onClick: function () { return jumpToFirstUnreadMessage(queryMessageLimit); } }, unreadCount && showCount
+            ? t('{{count}} unread', { count: unreadCount !== null && unreadCount !== void 0 ? unreadCount : 0 })
+            : t('Unread messages')),
         React.createElement("button", { onClick: function () { return markRead(); } },
             React.createElement(CloseIcon, null))));
 };

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

@@ -1,6 +1,14 @@
+import React from 'react';
 export declare const UNREAD_MESSAGE_SEPARATOR_CLASS = "str-chat__unread-messages-separator";
 export type UnreadMessagesSeparatorProps = {
+    /**
+     * Configuration parameter to determine, whether the unread count is to be shown on the component. Disabled by default.
+     */
+    showCount?: boolean;
+    /**
+     * The count of unread messages to be displayed if enabled.
+     */
     unreadCount?: number;
 };
-export declare const UnreadMessagesSeparator: ({ unreadCount }: UnreadMessagesSeparatorProps) => JSX.Element;
+export declare const UnreadMessagesSeparator: ({ showCount, unreadCount, }: UnreadMessagesSeparatorProps) => React.JSX.Element;
 //# sourceMappingURL=UnreadMessagesSeparator.d.ts.map

package/dist/components/MessageList/UnreadMessagesSeparator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UnreadMessagesSeparator.d.ts","sourceRoot":"","sources":["../../../src/components/MessageList/UnreadMessagesSeparator.tsx"],"names":[],"mappings":"AAGA,eAAO,MAAM,8BAA8B,wCAAwC,CAAC;AAEpF,MAAM,MAAM,4BAA4B,GAAG;IACzC,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,uBAAuB,oBAAqB,4BAA4B,gBASpF,CAAC"}
+{"version":3,"file":"UnreadMessagesSeparator.d.ts","sourceRoot":"","sources":["../../../src/components/MessageList/UnreadMessagesSeparator.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,eAAO,MAAM,8BAA8B,wCAAwC,CAAC;AAEpF,MAAM,MAAM,4BAA4B,GAAG;IACzC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,uBAAuB,gCAGjC,4BAA4B,sBAS9B,CAAC"}

package/dist/components/MessageList/UnreadMessagesSeparator.js

@@ -2,9 +2,9 @@ import React from 'react';
 import { useTranslationContext } from '../../context';
 export var UNREAD_MESSAGE_SEPARATOR_CLASS = 'str-chat__unread-messages-separator';
 export var UnreadMessagesSeparator = function (_a) {
-    var unreadCount = _a.unreadCount;
+    var showCount = _a.showCount, unreadCount = _a.unreadCount;
     var t = useTranslationContext('UnreadMessagesSeparator').t;
-    return (React.createElement("div", { className: UNREAD_MESSAGE_SEPARATOR_CLASS, "data-testid": 'unread-messages-separator' }, unreadCount
+    return (React.createElement("div", { className: UNREAD_MESSAGE_SEPARATOR_CLASS, "data-testid": 'unread-messages-separator' }, unreadCount && showCount
         ? t('unreadMessagesSeparatorText', { count: unreadCount })
         : t('Unread messages')));
 };

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

@@ -74,8 +74,6 @@ export type VirtualizedMessageListProps<StreamChatGenerics extends DefaultStream
     loadMore?: ChannelActionContextValue['loadMore'] | (() => Promise<void>);
     /** Function called when new messages are to be loaded, defaults to function stored in [ChannelActionContext](https://getstream.io/chat/docs/sdk/react/contexts/channel_action_context/) */
     loadMoreNewer?: ChannelActionContextValue['loadMore'] | (() => Promise<void>);
-    /** When enabled, the channel will be marked read when a user scrolls to the bottom. Ignored when scrolled to the bottom of a thread message list. */
-    markReadOnScrolledToBottom?: boolean;
     /** Custom UI component to display a message, defaults to and accepts same props as [MessageSimple](https://github.com/GetStream/stream-chat-react/blob/master/src/components/Message/MessageSimple.tsx) */
     Message?: React.ComponentType<MessageUIComponentProps<StreamChatGenerics>>;
     /** The limit to use when paginating messages */
@@ -111,6 +109,12 @@ export type VirtualizedMessageListProps<StreamChatGenerics extends DefaultStream
     separateGiphyPreview?: boolean;
     /** If true, group messages belonging to the same user, otherwise show each message individually */
     shouldGroupByUser?: boolean;
+    /**
+     * The floating notification informing about unread messages will be shown when the
+     * UnreadMessagesSeparator is not visible. The default is false, that means the notification
+     * is shown only when viewing unread messages.
+     */
+    showUnreadNotificationAlways?: boolean;
     /** The scrollTo behavior when new messages appear. Use `"smooth"` for regular chat channels, and `"auto"` (which results in instant scroll to bottom) if you expect high throughput. */
     stickToBottomScrollBehavior?: 'smooth' | 'auto';
     /** stops the list from autoscrolling when new messages are loaded */
@@ -122,6 +126,6 @@ export type VirtualizedMessageListProps<StreamChatGenerics extends DefaultStream
  * The VirtualizedMessageList component renders a list of messages in a virtualized list.
  * It is a consumer of the React contexts set in [Channel](https://github.com/GetStream/stream-chat-react/blob/master/src/components/Channel/Channel.tsx).
  */
-export declare function VirtualizedMessageList<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(props: VirtualizedMessageListProps<StreamChatGenerics>): JSX.Element;
+export declare function VirtualizedMessageList<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(props: VirtualizedMessageListProps<StreamChatGenerics>): React.JSX.Element;
 export {};
 //# sourceMappingURL=VirtualizedMessageList.d.ts.map

package/dist/components/MessageList/VirtualizedMessageList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VirtualizedMessageList.d.ts","sourceRoot":"","sources":["../../../src/components/MessageList/VirtualizedMessageList.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"VirtualizedMessageList.d.ts","sourceRoot":"","sources":["../../../src/components/MessageList/VirtualizedMessageList.tsx"],"names":[],"mappings":"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"}

package/dist/components/MessageList/VirtualizedMessageList.js

@@ -47,11 +47,11 @@ function calculateInitialTopMostItemIndex(messages, highlightedMessageId) {
 }
 var VirtualizedMessageListWithContext = function (props) {
     var _a, _b;
-    var additionalMessageInputProps = props.additionalMessageInputProps, _c = props.additionalVirtuosoProps, additionalVirtuosoProps = _c === void 0 ? {} : _c, channel = props.channel, channelUnreadUiState = props.channelUnreadUiState, closeReactionSelectorOnClick = props.closeReactionSelectorOnClick, customMessageActions = props.customMessageActions, customMessageRenderer = props.customMessageRenderer, defaultItemHeight = props.defaultItemHeight, _d = props.disableDateSeparator, disableDateSeparator = _d === void 0 ? true : _d, groupStyles = props.groupStyles, hasMoreNewer = props.hasMoreNewer, head = props.head, _e = props.hideDeletedMessages, hideDeletedMessages = _e === void 0 ? false : _e, _f = props.hideNewMessageSeparator, hideNewMessageSeparator = _f === void 0 ? false : _f, highlightedMessageId = props.highlightedMessageId, jumpToLatestMessage = props.jumpToLatestMessage, loadingMore = props.loadingMore, loadMore = props.loadMore, loadMoreNewer = props.loadMoreNewer, markReadOnScrolledToBottom = props.markReadOnScrolledToBottom, MessageUIComponentFromProps = props.Message, messageActions = props.messageActions, _g = props.messageLimit, messageLimit = _g === void 0 ? 100 : _g, messages = props.messages, notifications = props.notifications, 
+    var additionalMessageInputProps = props.additionalMessageInputProps, _c = props.additionalVirtuosoProps, additionalVirtuosoProps = _c === void 0 ? {} : _c, channel = props.channel, channelUnreadUiState = props.channelUnreadUiState, closeReactionSelectorOnClick = props.closeReactionSelectorOnClick, customMessageActions = props.customMessageActions, customMessageRenderer = props.customMessageRenderer, defaultItemHeight = props.defaultItemHeight, _d = props.disableDateSeparator, disableDateSeparator = _d === void 0 ? true : _d, groupStyles = props.groupStyles, hasMoreNewer = props.hasMoreNewer, head = props.head, _e = props.hideDeletedMessages, hideDeletedMessages = _e === void 0 ? false : _e, _f = props.hideNewMessageSeparator, hideNewMessageSeparator = _f === void 0 ? false : _f, highlightedMessageId = props.highlightedMessageId, jumpToLatestMessage = props.jumpToLatestMessage, loadingMore = props.loadingMore, loadMore = props.loadMore, loadMoreNewer = props.loadMoreNewer, MessageUIComponentFromProps = props.Message, messageActions = props.messageActions, _g = props.messageLimit, messageLimit = _g === void 0 ? 100 : _g, messages = props.messages, notifications = props.notifications, 
     // TODO: refactor to scrollSeekPlaceHolderConfiguration and components.ScrollSeekPlaceholder, like the Virtuoso Component
     _h = props.overscan, 
     // TODO: refactor to scrollSeekPlaceHolderConfiguration and components.ScrollSeekPlaceholder, like the Virtuoso Component
-    overscan = _h === void 0 ? 0 : _h, read = props.read, _j = props.returnAllReadData, returnAllReadData = _j === void 0 ? false : _j, scrollSeekPlaceHolder = props.scrollSeekPlaceHolder, _k = props.scrollToLatestMessageOnFocus, scrollToLatestMessageOnFocus = _k === void 0 ? false : _k, _l = props.separateGiphyPreview, separateGiphyPreview = _l === void 0 ? false : _l, _m = props.shouldGroupByUser, shouldGroupByUser = _m === void 0 ? false : _m, _o = props.stickToBottomScrollBehavior, stickToBottomScrollBehavior = _o === void 0 ? 'smooth' : _o, suppressAutoscroll = props.suppressAutoscroll, threadList = props.threadList;
+    overscan = _h === void 0 ? 0 : _h, read = props.read, _j = props.returnAllReadData, returnAllReadData = _j === void 0 ? false : _j, scrollSeekPlaceHolder = props.scrollSeekPlaceHolder, _k = props.scrollToLatestMessageOnFocus, scrollToLatestMessageOnFocus = _k === void 0 ? false : _k, _l = props.separateGiphyPreview, separateGiphyPreview = _l === void 0 ? false : _l, _m = props.shouldGroupByUser, shouldGroupByUser = _m === void 0 ? false : _m, showUnreadNotificationAlways = props.showUnreadNotificationAlways, _o = props.stickToBottomScrollBehavior, stickToBottomScrollBehavior = _o === void 0 ? 'smooth' : _o, suppressAutoscroll = props.suppressAutoscroll, threadList = props.threadList;
     var virtuosoComponentsFromProps = additionalVirtuosoProps.components, overridingVirtuosoProps = __rest(additionalVirtuosoProps, ["components"]);
     // Stops errors generated from react-virtuoso to bubble up
     // to Sentry or other tracking tools.
@@ -63,6 +63,7 @@ var VirtualizedMessageListWithContext = function (props) {
     var lastRead = useMemo(function () { var _a; return (_a = channel.lastRead) === null || _a === void 0 ? void 0 : _a.call(channel); }, [channel]);
     var _w = useUnreadMessagesNotificationVirtualized({
         lastRead: channelUnreadUiState === null || channelUnreadUiState === void 0 ? void 0 : channelUnreadUiState.last_read,
+        showAlways: !!showUnreadNotificationAlways,
         unreadCount: (_a = channelUnreadUiState === null || channelUnreadUiState === void 0 ? void 0 : channelUnreadUiState.unread_messages) !== null && _a !== void 0 ? _a : 0,
     }), showUnreadMessagesNotification = _w.show, toggleShowUnreadMessagesNotification = _w.toggleShowUnreadMessagesNotification;
     var _x = useGiphyPreview(separateGiphyPreview), giphyPreviewMessage = _x.giphyPreviewMessage, setGiphyPreviewMessage = _x.setGiphyPreviewMessage;
@@ -120,9 +121,9 @@ var VirtualizedMessageListWithContext = function (props) {
     var _y = useNewMessageNotification(processedMessages, client.userID, hasMoreNewer), atBottom = _y.atBottom, isMessageListScrolledToBottom = _y.isMessageListScrolledToBottom, newMessagesNotification = _y.newMessagesNotification, setIsMessageListScrolledToBottom = _y.setIsMessageListScrolledToBottom, setNewMessagesNotification = _y.setNewMessagesNotification;
     useMarkRead({
         isMessageListScrolledToBottom: isMessageListScrolledToBottom,
-        markReadOnScrolledToBottom: markReadOnScrolledToBottom,
         messageListIsThread: !!threadList,
         unreadCount: (_b = channelUnreadUiState === null || channelUnreadUiState === void 0 ? void 0 : channelUnreadUiState.unread_messages) !== null && _b !== void 0 ? _b : 0,
+        wasMarkedUnread: !!(channelUnreadUiState === null || channelUnreadUiState === void 0 ? void 0 : channelUnreadUiState.first_unread_message_id),
     });
     var scrollToBottom = useCallback(function () { return __awaiter(void 0, void 0, void 0, function () {
         return __generator(this, function (_a) {

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

@@ -9,17 +9,17 @@ export declare const makeItemsRenderedHandler: <StreamChatGenerics extends Defau
 type CommonVirtuosoComponentProps<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = {
     context?: VirtuosoContext<StreamChatGenerics>;
 };
-export declare const Item: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ context, ...props }: Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+export declare const Item: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ context, ...props }: Pick<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, "style" | "children"> & {
     'data-index': number;
     'data-item-index': number;
     'data-item-group-index'?: number | undefined;
     'data-known-size': number;
-} & CommonVirtuosoComponentProps<StreamChatGenerics>) => JSX.Element;
-export declare const Header: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ context, }: CommonVirtuosoComponentProps<StreamChatGenerics>) => JSX.Element | null;
-export declare const EmptyPlaceholder: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ context, }: CommonVirtuosoComponentProps<StreamChatGenerics>) => JSX.Element;
-export declare const Footer: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>() => JSX.Element | null;
-export declare const messageRenderer: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(virtuosoIndex: number, _data: UnknownType, virtuosoContext: VirtuosoContext<StreamChatGenerics>) => JSX.Element | null;
+} & CommonVirtuosoComponentProps<StreamChatGenerics>) => React.JSX.Element;
+export declare const Header: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ context, }: CommonVirtuosoComponentProps<StreamChatGenerics>) => React.JSX.Element | null;
+export declare const EmptyPlaceholder: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ context, }: CommonVirtuosoComponentProps<StreamChatGenerics>) => React.JSX.Element;
+export declare const Footer: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>() => React.JSX.Element | null;
+export declare const messageRenderer: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(virtuosoIndex: number, _data: UnknownType, virtuosoContext: VirtuosoContext<StreamChatGenerics>) => React.JSX.Element | null;
 export {};
 //# sourceMappingURL=VirtualizedMessageListComponents.d.ts.map

package/dist/components/MessageList/VirtualizedMessageListComponents.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VirtualizedMessageListComponents.d.ts","sourceRoot":"","sources":["../../../src/components/MessageList/VirtualizedMessageListComponents.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAMrD,OAAO,EAAU,aAAa,EAAuB,MAAM,eAAe,CAAC;AAI3E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAChE,OAAO,KAAK,EAAE,yBAAyB,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAIhF,wBAAgB,kBAAkB,CAAC,aAAa,EAAE,MAAM,EAAE,iBAAiB,EAAE,MAAM,UAElF;AAED,wBAAgB,uBAAuB,CAAC,iBAAiB,EAAE,MAAM,UAEhE;AAED,eAAO,MAAM,wBAAwB,0JAGuC,IAAI,uGAG7D,SAAS,WAAW,CAAC,EAAE,UAUjC,CAAC;AAEV,KAAK,4BAA4B,CAC/B,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E;IACF,OAAO,CAAC,EAAE,eAAe,CAAC,kBAAkB,CAAC,CAAC;CAC/C,CAAC;AAGF,eAAO,MAAM,IAAI;;;;;;;oEAyBhB,CAAC;AACF,eAAO,MAAM,MAAM,0KAgBlB,CAAC;AACF,eAAO,MAAM,gBAAgB,mKAe5B,CAAC;AACF,eAAO,MAAM,MAAM,4GAKlB,CAAC;AACF,eAAO,MAAM,eAAe,oGAGX,MAAM,SACd,WAAW,6EA+EnB,CAAC"}
+{"version":3,"file":"VirtualizedMessageListComponents.d.ts","sourceRoot":"","sources":["../../../src/components/MessageList/VirtualizedMessageListComponents.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAMrD,OAAO,EAAU,aAAa,EAAuB,MAAM,eAAe,CAAC;AAI3E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAChE,OAAO,KAAK,EAAE,yBAAyB,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAIhF,wBAAgB,kBAAkB,CAAC,aAAa,EAAE,MAAM,EAAE,iBAAiB,EAAE,MAAM,UAElF;AAED,wBAAgB,uBAAuB,CAAC,iBAAiB,EAAE,MAAM,UAEhE;AAED,eAAO,MAAM,wBAAwB,0JAGuC,IAAI,uGAG7D,SAAS,WAAW,CAAC,EAAE,UAUjC,CAAC;AAEV,KAAK,4BAA4B,CAC/B,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E;IACF,OAAO,CAAC,EAAE,eAAe,CAAC,kBAAkB,CAAC,CAAC;CAC/C,CAAC;AAGF,eAAO,MAAM,IAAI;;;;;;;0EAyBhB,CAAC;AACF,eAAO,MAAM,MAAM,gLAgBlB,CAAC;AACF,eAAO,MAAM,gBAAgB,yKAe5B,CAAC;AACF,eAAO,MAAM,MAAM,kHAKlB,CAAC;AACF,eAAO,MAAM,eAAe,oGAGX,MAAM,SACd,WAAW,mFA+EnB,CAAC"}

package/dist/components/MessageList/hooks/MessageList/useUnreadMessagesNotification.d.ts

@@ -1,8 +1,9 @@
 export type UseUnreadMessagesNotificationParams = {
     isMessageListScrolledToBottom: boolean;
+    showAlways: boolean;
     unreadCount?: number;
 };
-export declare const useUnreadMessagesNotification: ({ isMessageListScrolledToBottom, unreadCount, }: UseUnreadMessagesNotificationParams) => {
+export declare const useUnreadMessagesNotification: ({ isMessageListScrolledToBottom, showAlways, unreadCount, }: UseUnreadMessagesNotificationParams) => {
     show: boolean;
 };
 //# sourceMappingURL=useUnreadMessagesNotification.d.ts.map

package/dist/components/MessageList/hooks/MessageList/useUnreadMessagesNotification.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useUnreadMessagesNotification.d.ts","sourceRoot":"","sources":["../../../../../src/components/MessageList/hooks/MessageList/useUnreadMessagesNotification.ts"],"names":[],"mappings":"AAWA,MAAM,MAAM,mCAAmC,GAAG;IAChD,6BAA6B,EAAE,OAAO,CAAC;IACvC,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,6BAA6B,oDAGvC,mCAAmC;;CA0DrC,CAAC"}
+{"version":3,"file":"useUnreadMessagesNotification.d.ts","sourceRoot":"","sources":["../../../../../src/components/MessageList/hooks/MessageList/useUnreadMessagesNotification.ts"],"names":[],"mappings":"AAgBA,MAAM,MAAM,mCAAmC,GAAG;IAChD,6BAA6B,EAAE,OAAO,CAAC;IACvC,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,6BAA6B,gEAIvC,mCAAmC;;CAsErC,CAAC"}

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

@@ -2,13 +2,17 @@ import { useChannelStateContext } from '../../../../context';
 import { useEffect, useRef, useState } from 'react';
 import { MESSAGE_LIST_MAIN_PANEL_CLASS } from '../../MessageListMainPanel';
 import { UNREAD_MESSAGE_SEPARATOR_CLASS } from '../../UnreadMessagesSeparator';
-var targetIsVisibleInContainer = function (element, container) {
-    var msgListHeight = container.getBoundingClientRect().height;
-    var targetMessageY = element.getBoundingClientRect().y;
-    return 0 <= targetMessageY && targetMessageY <= msgListHeight;
+var targetScrolledAboveVisibleContainerArea = function (element) {
+    var targetBottom = element.getBoundingClientRect().bottom;
+    return targetBottom < 0;
+};
+var targetScrolledBelowVisibleContainerArea = function (element, container) {
+    var targetTop = element.getBoundingClientRect().top;
+    var containerBottom = container.getBoundingClientRect().top;
+    return targetTop > containerBottom;
 };
 export var useUnreadMessagesNotification = function (_a) {
-    var isMessageListScrolledToBottom = _a.isMessageListScrolledToBottom, unreadCount = _a.unreadCount;
+    var isMessageListScrolledToBottom = _a.isMessageListScrolledToBottom, showAlways = _a.showAlways, unreadCount = _a.unreadCount;
     var messages = useChannelStateContext('UnreadMessagesNotification').messages;
     var _b = useState(false), show = _b[0], setShow = _b[1];
     var isScrolledAboveTargetTop = useRef(false);
@@ -26,22 +30,32 @@ export var useUnreadMessagesNotification = function (_a) {
             setShow(true);
             return;
         }
-        setShow(!targetIsVisibleInContainer(observedTarget, msgListPanel));
+        var scrolledBelowSeparator = targetScrolledAboveVisibleContainerArea(observedTarget);
+        var scrolledAboveSeparator = targetScrolledBelowVisibleContainerArea(observedTarget, msgListPanel);
+        setShow(showAlways ? scrolledBelowSeparator || scrolledAboveSeparator : scrolledBelowSeparator);
         var observer = new IntersectionObserver(function (elements) {
             if (!elements.length)
                 return;
-            var _a = elements[0], boundingClientRect = _a.boundingClientRect, isIntersecting = _a.isIntersecting, rootBounds = _a.rootBounds;
-            var isScrolledAboveTargetTopCurrent = !!(rootBounds &&
-                boundingClientRect &&
-                rootBounds.bottom < boundingClientRect.top);
-            setShow(!isIntersecting && !isScrolledAboveTargetTopCurrent);
-            isScrolledAboveTargetTop.current = isScrolledAboveTargetTopCurrent;
+            var _a = elements[0], boundingClientRect = _a.boundingClientRect, isIntersecting = _a.isIntersecting;
+            if (isIntersecting) {
+                setShow(false);
+                return;
+            }
+            var separatorIsAboveContainerTop = boundingClientRect.bottom < 0;
+            setShow(showAlways || separatorIsAboveContainerTop);
+            isScrolledAboveTargetTop.current = separatorIsAboveContainerTop;
         }, { root: msgListPanel });
         observer.observe(observedTarget);
         return function () {
             observer.disconnect();
         };
-    }, [intersectionObserverIsSupported, messages, unreadCount]);
+    }, [
+        intersectionObserverIsSupported,
+        isMessageListScrolledToBottom,
+        messages,
+        showAlways,
+        unreadCount,
+    ]);
     useEffect(function () {
         /**
          * Handle situation when scrollToBottom is called from another component when the msg list is scrolled above the observed target (unread separator).

package/dist/components/MessageList/hooks/VirtualizedMessageList/useUnreadMessagesNotificationVirtualized.d.ts

@@ -1,6 +1,7 @@
 import { StreamMessage } from '../../../../context';
 import type { DefaultStreamChatGenerics } from '../../../../types/types';
 export type UseUnreadMessagesNotificationParams = {
+    showAlways: boolean;
     unreadCount: number;
     lastRead?: Date | null;
 };
@@ -13,9 +14,10 @@ export type UseUnreadMessagesNotificationParams = {
  * `UnreadMessagesNotification` component is rendered. This is an approximate equivalent to being
  * scrolled below the `UnreadMessagesNotification` component.
  * @param lastRead
+ * @param showAlways
  * @param unreadCount
  */
-export declare const useUnreadMessagesNotificationVirtualized: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ lastRead, unreadCount, }: UseUnreadMessagesNotificationParams) => {
+export declare const useUnreadMessagesNotificationVirtualized: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ lastRead, showAlways, unreadCount, }: UseUnreadMessagesNotificationParams) => {
     show: boolean;
     toggleShowUnreadMessagesNotification: (renderedMessages: StreamMessage<StreamChatGenerics>[]) => void;
 };

package/dist/components/MessageList/hooks/VirtualizedMessageList/useUnreadMessagesNotificationVirtualized.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useUnreadMessagesNotificationVirtualized.d.ts","sourceRoot":"","sources":["../../../../../src/components/MessageList/hooks/VirtualizedMessageList/useUnreadMessagesNotificationVirtualized.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,yBAAyB,CAAC;AAEzE,MAAM,MAAM,mCAAmC,GAAG;IAChD,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACxB,CAAC;AAEF;;;;;;;;;;GAUG;AACH,eAAO,MAAM,wCAAwC,iHAKlD,mCAAmC;;;CAmBrC,CAAC"}
+{"version":3,"file":"useUnreadMessagesNotificationVirtualized.d.ts","sourceRoot":"","sources":["../../../../../src/components/MessageList/hooks/VirtualizedMessageList/useUnreadMessagesNotificationVirtualized.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,yBAAyB,CAAC;AAEzE,MAAM,MAAM,mCAAmC,GAAG;IAChD,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACxB,CAAC;AAEF;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,wCAAwC,6HAMlD,mCAAmC;;;CA4BrC,CAAC"}

package/dist/components/MessageList/hooks/VirtualizedMessageList/useUnreadMessagesNotificationVirtualized.js

@@ -8,19 +8,25 @@ import { useCallback, useEffect, useState } from 'react';
  * `UnreadMessagesNotification` component is rendered. This is an approximate equivalent to being
  * scrolled below the `UnreadMessagesNotification` component.
  * @param lastRead
+ * @param showAlways
  * @param unreadCount
  */
 export var useUnreadMessagesNotificationVirtualized = function (_a) {
-    var lastRead = _a.lastRead, unreadCount = _a.unreadCount;
+    var lastRead = _a.lastRead, showAlways = _a.showAlways, unreadCount = _a.unreadCount;
     var _b = useState(false), show = _b[0], setShow = _b[1];
     var toggleShowUnreadMessagesNotification = useCallback(function (renderedMessages) {
-        if (!renderedMessages.length)
+        if (!unreadCount)
+            return;
+        var firstRenderedMessage = renderedMessages[0];
+        var lastRenderedMessage = renderedMessages.slice(-1)[0];
+        if (!(firstRenderedMessage && lastRenderedMessage))
             return;
-        var firstRenderedMessageTimestamp = renderedMessages[0].created_at
-            ? new Date(renderedMessages[0].created_at).getTime()
-            : 0;
-        setShow(unreadCount > 0 && !!lastRead && firstRenderedMessageTimestamp > lastRead.getTime());
-    }, [unreadCount, lastRead]);
+        var scrolledBelowSeparator = !!lastRead &&
+            new Date(firstRenderedMessage.created_at).getTime() > lastRead.getTime();
+        var scrolledAboveSeparator = !!lastRead &&
+            new Date(lastRenderedMessage.created_at).getTime() < lastRead.getTime();
+        setShow(showAlways ? scrolledBelowSeparator || scrolledAboveSeparator : scrolledBelowSeparator);
+    }, [lastRead, showAlways, unreadCount]);
     useEffect(function () {
         if (!unreadCount)
             setShow(false);

package/dist/components/MessageList/hooks/useMarkRead.d.ts

@@ -1,8 +1,9 @@
+import { DefaultStreamChatGenerics } from '../../../types';
 type UseMarkReadParams = {
     isMessageListScrolledToBottom: boolean;
     messageListIsThread: boolean;
     unreadCount: number;
-    markReadOnScrolledToBottom?: boolean;
+    wasMarkedUnread?: boolean;
 };
 /**
  * Takes care of marking a channel read. The channel is read only if all the following applies:
@@ -14,6 +15,6 @@ type UseMarkReadParams = {
  * @param unreadCount
  * @param wasChannelMarkedUnread
  */
-export declare const useMarkRead: ({ isMessageListScrolledToBottom, markReadOnScrolledToBottom, messageListIsThread, unreadCount, }: UseMarkReadParams) => void;
+export declare const useMarkRead: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ isMessageListScrolledToBottom, messageListIsThread, unreadCount, wasMarkedUnread, }: UseMarkReadParams) => void;
 export {};
 //# sourceMappingURL=useMarkRead.d.ts.map

package/dist/components/MessageList/hooks/useMarkRead.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useMarkRead.d.ts","sourceRoot":"","sources":["../../../../src/components/MessageList/hooks/useMarkRead.ts"],"names":[],"mappings":"AAGA,KAAK,iBAAiB,GAAG;IACvB,6BAA6B,EAAE,OAAO,CAAC;IACvC,mBAAmB,EAAE,OAAO,CAAC;IAC7B,WAAW,EAAE,MAAM,CAAC;IACpB,0BAA0B,CAAC,EAAE,OAAO,CAAC;CACtC,CAAC;AAEF;;;;;;;;;GASG;AACH,eAAO,MAAM,WAAW,qGAKrB,iBAAiB,SA4BnB,CAAC"}
+{"version":3,"file":"useMarkRead.d.ts","sourceRoot":"","sources":["../../../../src/components/MessageList/hooks/useMarkRead.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,yBAAyB,EAAE,MAAM,gBAAgB,CAAC;AAE3D,KAAK,iBAAiB,GAAG;IACvB,6BAA6B,EAAE,OAAO,CAAC;IACvC,mBAAmB,EAAE,OAAO,CAAC;IAC7B,WAAW,EAAE,MAAM,CAAC;IACpB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AAEF;;;;;;;;;GASG;AACH,eAAO,MAAM,WAAW,4KAOrB,iBAAiB,SAyEnB,CAAC"}

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

@@ -1,5 +1,6 @@
-import { useEffect } from 'react';
-import { useChannelActionContext } from '../../../context';
+import { __assign } from "tslib";
+import { useEffect, useRef } from 'react';
+import { useChannelActionContext, useChannelStateContext, useChatContext, } from '../../../context';
 /**
  * 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
@@ -11,28 +12,81 @@ import { useChannelActionContext } from '../../../context';
  * @param wasChannelMarkedUnread
  */
 export var useMarkRead = function (_a) {
-    var isMessageListScrolledToBottom = _a.isMessageListScrolledToBottom, markReadOnScrolledToBottom = _a.markReadOnScrolledToBottom, messageListIsThread = _a.messageListIsThread, unreadCount = _a.unreadCount;
-    var markRead = useChannelActionContext('useMarkRead').markRead;
+    var isMessageListScrolledToBottom = _a.isMessageListScrolledToBottom, messageListIsThread = _a.messageListIsThread, unreadCount = _a.unreadCount, wasMarkedUnread = _a.wasMarkedUnread;
+    var client = useChatContext('useMarkRead').client;
+    var _b = useChannelActionContext('useMarkRead'), markRead = _b.markRead, setChannelUnreadUiState = _b.setChannelUnreadUiState;
+    var channel = useChannelStateContext('useMarkRead').channel;
+    var previousRenderMessageListScrolledToBottom = useRef(isMessageListScrolledToBottom);
     useEffect(function () {
-        var shouldMarkRead = !messageListIsThread &&
-            isMessageListScrolledToBottom &&
-            markReadOnScrolledToBottom &&
-            unreadCount > 0;
+        var shouldMarkRead = function (unreadMessages) {
+            return !document.hidden &&
+                !wasMarkedUnread &&
+                !messageListIsThread &&
+                isMessageListScrolledToBottom &&
+                unreadMessages > 0;
+        };
         var onVisibilityChange = function () {
-            if (!document.hidden && shouldMarkRead)
+            if (shouldMarkRead(unreadCount))
+                markRead();
+        };
+        var handleMessageNew = function (event) {
+            var _a, _b, _c, _d;
+            var newMessageToCurrentChannel = event.cid === channel.cid;
+            var isOwnMessage = ((_a = event.user) === null || _a === void 0 ? void 0 : _a.id) && event.user.id === ((_b = client.user) === null || _b === void 0 ? void 0 : _b.id);
+            var mainChannelUpdated = !((_c = event.message) === null || _c === void 0 ? void 0 : _c.parent_id) || ((_d = event.message) === null || _d === void 0 ? void 0 : _d.show_in_channel);
+            if (isOwnMessage)
+                return;
+            if (!isMessageListScrolledToBottom || wasMarkedUnread || document.hidden) {
+                setChannelUnreadUiState(function (prev) {
+                    var _a, _b;
+                    var previousUnreadCount = (_a = prev === null || prev === void 0 ? void 0 : prev.unread_messages) !== null && _a !== void 0 ? _a : 0;
+                    var previousLastMessage = getPreviousLastMessage(channel.state.messages, event.message);
+                    return __assign(__assign({}, (prev || {})), { last_read: (_b = prev === null || prev === void 0 ? void 0 : prev.last_read) !== null && _b !== void 0 ? _b : (previousUnreadCount === 0 && (previousLastMessage === null || previousLastMessage === void 0 ? void 0 : previousLastMessage.created_at)
+                            ? new Date(previousLastMessage.created_at)
+                            : new Date(0)), unread_messages: previousUnreadCount + 1 });
+                });
+            }
+            else if (newMessageToCurrentChannel &&
+                mainChannelUpdated &&
+                !isOwnMessage &&
+                shouldMarkRead(channel.countUnread())) {
                 markRead();
+            }
         };
+        client.on('message.new', handleMessageNew);
         document.addEventListener('visibilitychange', onVisibilityChange);
-        if (shouldMarkRead)
+        var hasScrolledToBottom = previousRenderMessageListScrolledToBottom.current !== isMessageListScrolledToBottom &&
+            isMessageListScrolledToBottom;
+        if (shouldMarkRead(hasScrolledToBottom ? channel.countUnread() : unreadCount))
             markRead();
+        previousRenderMessageListScrolledToBottom.current = isMessageListScrolledToBottom;
         return function () {
+            client.off('message.new', handleMessageNew);
             document.removeEventListener('visibilitychange', onVisibilityChange);
         };
     }, [
+        channel,
+        client,
         isMessageListScrolledToBottom,
         markRead,
         messageListIsThread,
+        setChannelUnreadUiState,
         unreadCount,
-        markReadOnScrolledToBottom,
+        wasMarkedUnread,
     ]);
 };
+function getPreviousLastMessage(messages, newMessage) {
+    if (!newMessage)
+        return;
+    var previousLastMessage;
+    for (var i = messages.length - 1; i >= 0; i--) {
+        var msg = messages[i];
+        if (!(msg === null || msg === void 0 ? void 0 : msg.id))
+            break;
+        if (msg.id !== newMessage.id) {
+            previousLastMessage = msg;
+            break;
+        }
+    }
+    return previousLastMessage;
+}

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

@@ -1,9 +1,10 @@
+import React from 'react';
 interface ArrowProps {
     className?: string;
     color?: string;
 }
-export declare const ArrowUp: ({ className, color }: ArrowProps) => JSX.Element;
-export declare const ArrowDown: ({ className, color }: ArrowProps) => JSX.Element;
-export declare const CloseIcon: () => JSX.Element;
+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 {};
 //# sourceMappingURL=icons.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"icons.d.ts","sourceRoot":"","sources":["../../../src/components/MessageList/icons.tsx"],"names":[],"mappings":"AAEA,UAAU,UAAU;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,OAAO,yBAA0B,UAAU,gBAevD,CAAC;AAEF,eAAO,MAAM,SAAS,yBAA0B,UAAU,gBAezD,CAAC;AAEF,eAAO,MAAM,SAAS,mBAIrB,CAAC"}
+{"version":3,"file":"icons.d.ts","sourceRoot":"","sources":["../../../src/components/MessageList/icons.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,UAAU,UAAU;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,OAAO,yBAA0B,UAAU,sBAevD,CAAC;AAEF,eAAO,MAAM,SAAS,yBAA0B,UAAU,sBAezD,CAAC;AAEF,eAAO,MAAM,SAAS,yBAIrB,CAAC"}

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

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import React, { ReactNode } from 'react';
 import { MessageProps } from '../Message/types';
 import { StreamMessage } from '../../context/ChannelStateContext';
 import { ChannelUnreadUiState, DefaultStreamChatGenerics } from '../../types/types';
@@ -29,6 +29,6 @@ export interface RenderMessagesOptions<StreamChatGenerics extends DefaultStreamC
 export type SharedMessageProps<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = Omit<MessageProps<StreamChatGenerics>, MessagePropsToOmit>;
 export type MessageRenderer<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = (options: RenderMessagesOptions<StreamChatGenerics>) => Array<ReactNode>;
 type MessagePropsToOmit = 'channel' | 'groupStyles' | 'initialMessage' | 'lastReceivedId' | 'message' | 'readBy';
-export declare function defaultRenderMessages<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ channelUnreadUiState, components, customClasses, lastReceivedMessageId: lastReceivedId, messageGroupStyles, messages, readData, sharedMessageProps: messageProps, }: RenderMessagesOptions<StreamChatGenerics>): JSX.Element[];
+export declare function defaultRenderMessages<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ channelUnreadUiState, components, customClasses, lastReceivedMessageId: lastReceivedId, messageGroupStyles, messages, readData, sharedMessageProps: messageProps, }: RenderMessagesOptions<StreamChatGenerics>): React.JSX.Element[];
 export {};
 //# sourceMappingURL=renderMessages.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"renderMessages.d.ts","sourceRoot":"","sources":["../../../src/components/MessageList/renderMessages.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAY,SAAS,EAAE,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAClE,OAAO,EAAE,oBAAoB,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AACpF,OAAO,EAAE,qBAAqB,EAAE,aAAa,EAAU,MAAM,eAAe,CAAC;AAE7E,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAErC,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAE3C,MAAM,WAAW,qBAAqB,CACpC,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB;IAEhF,UAAU,EAAE,qBAAqB,CAAC,kBAAkB,CAAC,CAAC;IACtD,qBAAqB,EAAE,MAAM,GAAG,IAAI,CAAC;IACrC,kBAAkB,EAAE,MAAM,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IAC/C,QAAQ,EAAE,KAAK,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC,CAAC;IACnD;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,YAAY,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC;IAClE;;OAEG;IACH,kBAAkB,EAAE,kBAAkB,CAAC,kBAAkB,CAAC,CAAC;IAC3D;;;;OAIG;IACH,oBAAoB,CAAC,EAAE,oBAAoB,CAAC,kBAAkB,CAAC,CAAC;IAChE,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B;AAED,MAAM,MAAM,kBAAkB,CAC5B,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E,IAAI,CAAC,YAAY,CAAC,kBAAkB,CAAC,EAAE,kBAAkB,CAAC,CAAC;AAE/D,MAAM,MAAM,eAAe,CACzB,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E,CAAC,OAAO,EAAE,qBAAqB,CAAC,kBAAkB,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;AAE7E,KAAK,kBAAkB,GACnB,SAAS,GACT,aAAa,GACb,gBAAgB,GAChB,gBAAgB,GAChB,SAAS,GACT,QAAQ,CAAC;AAEb,wBAAgB,qBAAqB,CACnC,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,EAChF,EACA,oBAAoB,EACpB,UAAU,EACV,aAAa,EACb,qBAAqB,EAAE,cAAc,EACrC,kBAAkB,EAClB,QAAQ,EACR,QAAQ,EACR,kBAAkB,EAAE,YAAY,GACjC,EAAE,qBAAqB,CAAC,kBAAkB,CAAC,iBA6D3C"}
+{"version":3,"file":"renderMessages.d.ts","sourceRoot":"","sources":["../../../src/components/MessageList/renderMessages.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAY,SAAS,EAAE,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAClE,OAAO,EAAE,oBAAoB,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AACpF,OAAO,EAAE,qBAAqB,EAAE,aAAa,EAAU,MAAM,eAAe,CAAC;AAE7E,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAErC,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAE3C,MAAM,WAAW,qBAAqB,CACpC,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB;IAEhF,UAAU,EAAE,qBAAqB,CAAC,kBAAkB,CAAC,CAAC;IACtD,qBAAqB,EAAE,MAAM,GAAG,IAAI,CAAC;IACrC,kBAAkB,EAAE,MAAM,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;IAC/C,QAAQ,EAAE,KAAK,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC,CAAC;IACnD;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,YAAY,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC;IAClE;;OAEG;IACH,kBAAkB,EAAE,kBAAkB,CAAC,kBAAkB,CAAC,CAAC;IAC3D;;;;OAIG;IACH,oBAAoB,CAAC,EAAE,oBAAoB,CAAC,kBAAkB,CAAC,CAAC;IAChE,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B;AAED,MAAM,MAAM,kBAAkB,CAC5B,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E,IAAI,CAAC,YAAY,CAAC,kBAAkB,CAAC,EAAE,kBAAkB,CAAC,CAAC;AAE/D,MAAM,MAAM,eAAe,CACzB,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E,CAAC,OAAO,EAAE,qBAAqB,CAAC,kBAAkB,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,CAAC;AAE7E,KAAK,kBAAkB,GACnB,SAAS,GACT,aAAa,GACb,gBAAgB,GAChB,gBAAgB,GAChB,SAAS,GACT,QAAQ,CAAC;AAEb,wBAAgB,qBAAqB,CACnC,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,EAChF,EACA,oBAAoB,EACpB,UAAU,EACV,aAAa,EACb,qBAAqB,EAAE,cAAc,EACrC,kBAAkB,EAClB,QAAQ,EACR,QAAQ,EACR,kBAAkB,EAAE,YAAY,GACjC,EAAE,qBAAqB,CAAC,kBAAkB,CAAC,uBA6D3C"}

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

@@ -5,5 +5,5 @@ export type ModalProps = {
     /** Callback handler for closing of modal. */
     onClose?: (event: React.KeyboardEvent | React.MouseEvent<HTMLButtonElement | HTMLDivElement>) => void;
 };
-export declare const Modal: ({ children, onClose, open }: PropsWithChildren<ModalProps>) => JSX.Element | null;
+export declare const Modal: ({ children, onClose, open }: PropsWithChildren<ModalProps>) => React.JSX.Element | null;
 //# sourceMappingURL=Modal.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAAqB,MAAM,OAAO,CAAC;AAMpE,MAAM,MAAM,UAAU,GAAG;IACvB,2CAA2C;IAC3C,IAAI,EAAE,OAAO,CAAC;IACd,6CAA6C;IAC7C,OAAO,CAAC,EAAE,CACR,KAAK,EAAE,KAAK,CAAC,aAAa,GAAG,KAAK,CAAC,UAAU,CAAC,iBAAiB,GAAG,cAAc,CAAC,KAC9E,IAAI,CAAC;CACX,CAAC;AAEF,eAAO,MAAM,KAAK,gCAAiC,kBAAkB,UAAU,CAAC,uBAiD/E,CAAC"}
+{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAAqB,MAAM,OAAO,CAAC;AAOpE,MAAM,MAAM,UAAU,GAAG;IACvB,2CAA2C;IAC3C,IAAI,EAAE,OAAO,CAAC;IACd,6CAA6C;IAC7C,OAAO,CAAC,EAAE,CACR,KAAK,EAAE,KAAK,CAAC,aAAa,GAAG,KAAK,CAAC,UAAU,CAAC,iBAAiB,GAAG,cAAc,CAAC,KAC9E,IAAI,CAAC;CACX,CAAC;AAEF,eAAO,MAAM,KAAK,gCAAiC,kBAAkB,UAAU,CAAC,6BAmD/E,CAAC"}

package/dist/components/Modal/Modal.js

@@ -1,4 +1,5 @@
 import React, { useEffect, useRef } from 'react';
+import { FocusScope } from '@react-aria/focus';
 import { CloseIconRound } from './icons';
 import { useChatContext, useTranslationContext } from '../../context';
 export var Modal = function (_a) {
@@ -27,11 +28,12 @@ export var Modal = function (_a) {
     if (!open)
         return null;
     return (React.createElement("div", { className: 'str-chat__modal str-chat__modal--open', onClick: handleClick },
-        React.createElement("button", { className: 'str-chat__modal__close-button', ref: closeRef, title: t('Close') },
-            themeVersion === '2' && React.createElement(CloseIconRound, null),
-            themeVersion === '1' && (React.createElement(React.Fragment, null,
-                t('Close'),
-                React.createElement("svg", { height: '10', width: '10', xmlns: 'http://www.w3.org/2000/svg' },
-                    React.createElement("path", { d: 'M9.916 1.027L8.973.084 5 4.058 1.027.084l-.943.943L4.058 5 .084 8.973l.943.943L5 5.942l3.973 3.974.943-.943L5.942 5z', fillRule: 'evenodd' }))))),
-        React.createElement("div", { className: 'str-chat__modal__inner str-chat-react__modal__inner', ref: innerRef }, children)));
+        React.createElement(FocusScope, { autoFocus: true, contain: true },
+            React.createElement("button", { className: 'str-chat__modal__close-button', ref: closeRef, title: t('Close') },
+                themeVersion === '2' && React.createElement(CloseIconRound, null),
+                themeVersion === '1' && (React.createElement(React.Fragment, null,
+                    t('Close'),
+                    React.createElement("svg", { height: '10', width: '10', xmlns: 'http://www.w3.org/2000/svg' },
+                        React.createElement("path", { d: 'M9.916 1.027L8.973.084 5 4.058 1.027.084l-.943.943L4.058 5 .084 8.973l.943.943L5 5.942l3.973 3.974.943-.943L5.942 5z', fillRule: 'evenodd' }))))),
+            React.createElement("div", { className: 'str-chat__modal__inner str-chat-react__modal__inner', ref: innerRef }, children))));
 };

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

@@ -1,2 +1,3 @@
-export declare const CloseIconRound: () => JSX.Element;
+import React from 'react';
+export declare const CloseIconRound: () => React.JSX.Element;
 //# sourceMappingURL=icons.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"icons.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/icons.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,mBAkB1B,CAAC"}
+{"version":3,"file":"icons.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/icons.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,cAAc,yBAkB1B,CAAC"}

package/dist/components/ReactFileUtilities/FileIcon/FileIcon.d.ts

@@ -11,5 +11,5 @@ export type FileIconProps = {
     version?: IconVersion;
 };
 export declare function mimeTypeToIcon(type?: IconType, version?: IconVersion, mimeType?: string): React.ComponentType<import("./FileIconSet/v1").IconPropsV1> | React.ComponentType<import("./FileIconSet/v2").IconPropsV2>;
-export declare const FileIcon: (props: FileIconProps) => JSX.Element;
+export declare const FileIcon: (props: FileIconProps) => React.JSX.Element;
 //# sourceMappingURL=FileIcon.d.ts.map

package/dist/components/ReactFileUtilities/FileIcon/FileIcon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FileIcon.d.ts","sourceRoot":"","sources":["../../../../src/components/ReactFileUtilities/FileIcon/FileIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAW,QAAQ,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAE3D,MAAM,MAAM,aAAa,GAAG;IAC1B,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,OAAO,CAAC,EAAE,WAAW,CAAC;CACvB,CAAC;AAEF,wBAAgB,cAAc,CAC5B,IAAI,GAAE,QAAqB,EAC3B,OAAO,GAAE,WAAiB,EAC1B,QAAQ,CAAC,EAAE,MAAM,6HAelB;AAED,eAAO,MAAM,QAAQ,UAAW,aAAa,gBAc5C,CAAC"}
+{"version":3,"file":"FileIcon.d.ts","sourceRoot":"","sources":["../../../../src/components/ReactFileUtilities/FileIcon/FileIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAW,QAAQ,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAE3D,MAAM,MAAM,aAAa,GAAG;IAC1B,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,OAAO,CAAC,EAAE,WAAW,CAAC;CACvB,CAAC;AAEF,wBAAgB,cAAc,CAC5B,IAAI,GAAE,QAAqB,EAC3B,OAAO,GAAE,WAAiB,EAC1B,QAAQ,CAAC,EAAE,MAAM,6HAelB;AAED,eAAO,MAAM,QAAQ,UAAW,aAAa,sBAc5C,CAAC"}