stream-chat-react 11.22.0 → 11.23.0

package/dist/components/Attachment/components/WaveProgressBar.d.ts

@@ -9,7 +9,9 @@ type WaveProgressBarProps = {
     amplitudesCount?: number;
     /** Progress expressed in fractional number value btw 0 and 100. */
     progress?: number;
+    relativeAmplitudeBarWidth?: number;
+    relativeAmplitudeGap?: number;
 };
-export declare const WaveProgressBar: ({ amplitudesCount, progress, seek, waveformData, }: WaveProgressBarProps) => React.JSX.Element | null;
+export declare const WaveProgressBar: ({ amplitudesCount, progress, relativeAmplitudeBarWidth, relativeAmplitudeGap, seek, waveformData, }: WaveProgressBarProps) => React.JSX.Element | null;
 export {};
 //# sourceMappingURL=WaveProgressBar.d.ts.map

package/dist/components/Attachment/components/WaveProgressBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WaveProgressBar.d.ts","sourceRoot":"","sources":["../../../../src/components/Attachment/components/WaveProgressBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAON,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,6BAA6B,CAAC;AAE1D,KAAK,oBAAoB,GAAG;IAC1B,wDAAwD;IACxD,IAAI,EAAE,MAAM,CAAC;IACb,kGAAkG;IAClG,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,0GAA0G;IAC1G,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mEAAmE;IACnE,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,eAAe,uDAKzB,oBAAoB,6BA2EtB,CAAC"}
+{"version":3,"file":"WaveProgressBar.d.ts","sourceRoot":"","sources":["../../../../src/components/Attachment/components/WaveProgressBar.tsx"],"names":[],"mappings":"AACA,OAAO,KAQN,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,6BAA6B,CAAC;AAE1D,KAAK,oBAAoB,GAAG;IAC1B,wDAAwD;IACxD,IAAI,EAAE,MAAM,CAAC;IACb,kGAAkG;IAClG,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,0GAA0G;IAC1G,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mEAAmE;IACnE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,CAAC;AAEF,eAAO,MAAM,eAAe,wGAOzB,oBAAoB,6BAgItB,CAAC"}

package/dist/components/Attachment/components/WaveProgressBar.js

@@ -1,12 +1,15 @@
 import { __assign } from "tslib";
-import React, { useCallback, useEffect, useMemo, useRef, useState, } from 'react';
+import throttle from 'lodash.throttle';
+import React, { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState, } from 'react';
 import clsx from 'clsx';
 import { resampleWaveformData } from '../audioSampling';
 export var WaveProgressBar = function (_a) {
-    var _b = _a.amplitudesCount, amplitudesCount = _b === void 0 ? 40 : _b, _c = _a.progress, progress = _c === void 0 ? 0 : _c, seek = _a.seek, waveformData = _a.waveformData;
-    var _d = useState(null), progressIndicator = _d[0], setProgressIndicator = _d[1];
+    var _b = _a.amplitudesCount, amplitudesCount = _b === void 0 ? 40 : _b, _c = _a.progress, progress = _c === void 0 ? 0 : _c, _d = _a.relativeAmplitudeBarWidth, relativeAmplitudeBarWidth = _d === void 0 ? 2 : _d, _e = _a.relativeAmplitudeGap, relativeAmplitudeGap = _e === void 0 ? 1 : _e, seek = _a.seek, waveformData = _a.waveformData;
+    var _f = useState(null), progressIndicator = _f[0], setProgressIndicator = _f[1];
     var isDragging = useRef(false);
-    var rootRef = useRef(null);
+    var _g = useState(null), root = _g[0], setRoot = _g[1];
+    var _h = useState(), trackAxisX = _h[0], setTrackAxisX = _h[1];
+    var lastRootWidth = useRef();
     var handleDragStart = function (e) {
         e.preventDefault();
         if (!progressIndicator)
@@ -27,24 +30,59 @@ export var WaveProgressBar = function (_a) {
         isDragging.current = false;
         progressIndicator.style.removeProperty('cursor');
     }, [progressIndicator]);
-    var resampledWaveformData = useMemo(function () { return resampleWaveformData(waveformData, amplitudesCount); }, [
-        amplitudesCount,
-        waveformData,
-    ]);
+    var getTrackAxisX = useMemo(function () {
+        return throttle(function (rootWidth) {
+            if (rootWidth === lastRootWidth.current)
+                return;
+            lastRootWidth.current = rootWidth;
+            var possibleAmpCount = Math.floor(rootWidth / (relativeAmplitudeGap + relativeAmplitudeBarWidth));
+            var tooManyAmplitudesToRender = possibleAmpCount < amplitudesCount;
+            var barCount = tooManyAmplitudesToRender ? possibleAmpCount : amplitudesCount;
+            var amplitudeBarWidthToGapRatio = relativeAmplitudeBarWidth / (relativeAmplitudeBarWidth + relativeAmplitudeGap);
+            var barWidth = barCount && (rootWidth / barCount) * amplitudeBarWidthToGapRatio;
+            setTrackAxisX({
+                barCount: barCount,
+                barWidth: barWidth,
+                gap: barWidth * (relativeAmplitudeGap / relativeAmplitudeBarWidth),
+            });
+        }, 1);
+    }, [relativeAmplitudeBarWidth, relativeAmplitudeGap, amplitudesCount]);
+    var resampledWaveformData = useMemo(function () { return (trackAxisX ? resampleWaveformData(waveformData, trackAxisX.barCount) : []); }, [trackAxisX, waveformData]);
     useEffect(function () {
         document.addEventListener('pointerup', handleDragStop);
         return function () {
             document.removeEventListener('pointerup', handleDragStop);
         };
     }, [handleDragStop]);
-    if (!waveformData.length)
+    useEffect(function () {
+        if (!root || typeof ResizeObserver === 'undefined')
+            return;
+        var observer = new ResizeObserver(function (_a) {
+            var entry = _a[0];
+            getTrackAxisX(entry.contentRect.width);
+        });
+        observer.observe(root);
+        return function () {
+            observer.disconnect();
+        };
+    }, [getTrackAxisX, root]);
+    useLayoutEffect(function () {
+        if (!root)
+            return;
+        var rootWidth = root.getBoundingClientRect().width;
+        getTrackAxisX(rootWidth);
+    }, [getTrackAxisX, root]);
+    if (!waveformData.length || (trackAxisX === null || trackAxisX === void 0 ? void 0 : trackAxisX.barCount) === 0)
         return null;
-    return (React.createElement("div", { className: 'str-chat__wave-progress-bar__track', "data-testid": 'wave-progress-bar-track', onClick: seek, onPointerDown: handleDragStart, onPointerMove: handleDrag, onPointerUp: handleDragStop, ref: rootRef, role: 'progressbar' },
+    return (React.createElement("div", { className: 'str-chat__wave-progress-bar__track', "data-testid": 'wave-progress-bar-track', onClick: seek, onPointerDown: handleDragStart, onPointerMove: handleDrag, onPointerUp: handleDragStop, ref: setRoot, role: 'progressbar', style: {
+            '--str-chat__voice-recording-amplitude-bar-gap-width': (trackAxisX === null || trackAxisX === void 0 ? void 0 : trackAxisX.gap) + 'px',
+        } },
         resampledWaveformData.map(function (amplitude, i) {
             var _a;
             return (React.createElement("div", { className: clsx('str-chat__wave-progress-bar__amplitude-bar', (_a = {},
                     _a['str-chat__wave-progress-bar__amplitude-bar--active'] = progress > (i / resampledWaveformData.length) * 100,
                     _a)), "data-testid": 'amplitude-bar', key: "amplitude-".concat(i), style: {
+                    '--str-chat__voice-recording-amplitude-bar-width': (trackAxisX === null || trackAxisX === void 0 ? void 0 : trackAxisX.barWidth) + 'px',
                     '--str-chat__wave-progress-bar__amplitude-bar-height': amplitude
                         ? amplitude * 100 + '%'
                         : '0%',

package/dist/components/Channel/channelState.d.ts.map

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

package/dist/components/Channel/channelState.js

@@ -44,7 +44,7 @@ export var channelReducer = function (state, action) {
         }
         case 'openThread': {
             var channel = action.channel, message = action.message;
-            return __assign(__assign({}, state), { thread: message, threadMessages: message.id ? __assign({}, channel.state.threads)[message.id] || [] : [], threadSuppressAutoscroll: false });
+            return __assign(__assign({}, state), { thread: message, threadHasMore: true, threadMessages: message.id ? __assign({}, channel.state.threads)[message.id] || [] : [], threadSuppressAutoscroll: false });
         }
         case 'setError': {
             var error = action.error;

package/dist/components/Emojis/index.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Window = require('../../Window-b4032c33.js');
+var Window = require('../../Window-a963f22a.js');
 var React = require('react');
 var Picker = require('@emoji-mart/react');
 require('dayjs');
@@ -16,10 +16,10 @@ require('dayjs/plugin/utc');
 require('dayjs/plugin/timezone');
 require('react-player');
 require('@braintree/sanitize-url');
+require('lodash.throttle');
 require('prop-types');
 require('react-image-gallery');
 require('linkifyjs');
-require('lodash.throttle');
 require('emoji-regex');
 require('lodash.uniqby');
 require('@babel/runtime/helpers/extends');

package/dist/components/Message/Timestamp.js

@@ -17,7 +17,7 @@ export function Timestamp(props) {
             messageCreatedAt: normalizedTimestamp,
             t: t,
             tDateTimeParser: tDateTimeParser,
-            timestampTranslationKey: 'timestamp/Timestamp',
+            timestampTranslationKey: 'timestamp/MessageTimestamp',
         });
     }, [calendar, calendarFormats, format, formatDate, normalizedTimestamp, t, tDateTimeParser]);
     if (!when) {

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

@@ -11,7 +11,7 @@ export type MessageListProps<StreamChatGenerics extends DefaultStreamChatGeneric
     /** Disables the injection of date separator components in MessageList, defaults to `false` */
     disableDateSeparator?: boolean;
     /** Callback function to set group styles for each message */
-    groupStyles?: (message: StreamMessage<StreamChatGenerics>, previousMessage: StreamMessage<StreamChatGenerics>, nextMessage: StreamMessage<StreamChatGenerics>, noGroupByUser: boolean) => GroupStyle;
+    groupStyles?: (message: StreamMessage<StreamChatGenerics>, previousMessage: StreamMessage<StreamChatGenerics>, nextMessage: StreamMessage<StreamChatGenerics>, noGroupByUser: boolean, maxTimeBetweenGroupedMessages?: number) => GroupStyle;
     /** Whether the list has more items to load */
     hasMore?: boolean;
     /** Element to be rendered at the top of the thread message list. By default, these are the Message and ThreadStart components */
@@ -34,6 +34,8 @@ export type MessageListProps<StreamChatGenerics extends DefaultStreamChatGeneric
     loadMore?: ChannelActionContextValue['loadMore'] | (() => Promise<void>);
     /** Function called when newer messages are to be loaded, defaults to function stored in [ChannelActionContext](https://getstream.io/chat/docs/sdk/react/contexts/channel_action_context/) */
     loadMoreNewer?: ChannelActionContextValue['loadMoreNewer'] | (() => Promise<void>);
+    /** Maximum time in milliseconds that should occur between messages to still consider them grouped together */
+    maxTimeBetweenGroupedMessages?: number;
     /** The limit to use when paginating messages */
     messageLimit?: number;
     /** The messages to render in the list, defaults to messages stored in [ChannelStateContext](https://getstream.io/chat/docs/sdk/react/contexts/channel_state_context/) */

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

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

package/dist/components/MessageList/MessageList.js

@@ -20,7 +20,7 @@ import { defaultRenderMessages } from './renderMessages';
 import { DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD, DEFAULT_NEXT_CHANNEL_PAGE_SIZE, } from '../../constants/limits';
 var MessageListWithContext = function (props) {
     var _a;
-    var channel = props.channel, channelUnreadUiState = props.channelUnreadUiState, _b = props.disableDateSeparator, disableDateSeparator = _b === void 0 ? false : _b, groupStyles = props.groupStyles, _c = props.hideDeletedMessages, hideDeletedMessages = _c === void 0 ? false : _c, _d = props.hideNewMessageSeparator, hideNewMessageSeparator = _d === void 0 ? false : _d, _e = props.internalInfiniteScrollProps, _f = _e === void 0 ? {} : _e, _g = _f.threshold, loadMoreScrollThreshold = _g === void 0 ? DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD : _g, restInternalInfiniteScrollProps = __rest(_f, ["threshold"]), _h = props.messageActions, messageActions = _h === void 0 ? Object.keys(MESSAGE_ACTIONS) : _h, _j = props.messages, messages = _j === void 0 ? [] : _j, notifications = props.notifications, _k = props.noGroupByUser, noGroupByUser = _k === void 0 ? false : _k, _l = props.pinPermissions, pinPermissions = _l === void 0 ? defaultPinPermissions : _l, // @deprecated in favor of `channelCapabilities` - TODO: remove in next major release
+    var channel = props.channel, channelUnreadUiState = props.channelUnreadUiState, _b = props.disableDateSeparator, disableDateSeparator = _b === void 0 ? false : _b, groupStyles = props.groupStyles, _c = props.hideDeletedMessages, hideDeletedMessages = _c === void 0 ? false : _c, _d = props.hideNewMessageSeparator, hideNewMessageSeparator = _d === void 0 ? false : _d, _e = props.internalInfiniteScrollProps, _f = _e === void 0 ? {} : _e, _g = _f.threshold, loadMoreScrollThreshold = _g === void 0 ? DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD : _g, restInternalInfiniteScrollProps = __rest(_f, ["threshold"]), maxTimeBetweenGroupedMessages = props.maxTimeBetweenGroupedMessages, _h = props.messageActions, messageActions = _h === void 0 ? Object.keys(MESSAGE_ACTIONS) : _h, _j = props.messages, messages = _j === void 0 ? [] : _j, notifications = props.notifications, _k = props.noGroupByUser, noGroupByUser = _k === void 0 ? false : _k, _l = props.pinPermissions, pinPermissions = _l === void 0 ? defaultPinPermissions : _l, // @deprecated in favor of `channelCapabilities` - TODO: remove in next major release
     _m = props.returnAllReadData, // @deprecated in favor of `channelCapabilities` - TODO: remove in next major release
     returnAllReadData = _m === void 0 ? false : _m, _o = props.threadList, threadList = _o === void 0 ? false : _o, _p = props.unsafeHTML, unsafeHTML = _p === void 0 ? false : _p, headerPosition = props.headerPosition, read = props.read, _q = props.renderMessages, renderMessages = _q === void 0 ? defaultRenderMessages : _q, reviewProcessedMessage = props.reviewProcessedMessage, _r = props.messageLimit, messageLimit = _r === void 0 ? DEFAULT_NEXT_CHANNEL_PAGE_SIZE : _r, loadMoreCallback = props.loadMore, loadMoreNewerCallback = props.loadMoreNewer, _s = props.hasMoreNewer, hasMoreNewer = _s === void 0 ? false : _s, reactionDetailsSort = props.reactionDetailsSort, showUnreadNotificationAlways = props.showUnreadNotificationAlways, sortReactionDetails = props.sortReactionDetails, sortReactions = props.sortReactions, suppressAutoscroll = props.suppressAutoscroll, highlightedMessageId = props.highlightedMessageId, _t = props.jumpToLatestMessage, jumpToLatestMessage = _t === void 0 ? function () { return Promise.resolve(); } : _t;
     var _u = React.useState(null), listElement = _u[0], setListElement = _u[1];
@@ -53,6 +53,7 @@ var MessageListWithContext = function (props) {
         headerPosition: headerPosition,
         hideDeletedMessages: hideDeletedMessages,
         hideNewMessageSeparator: hideNewMessageSeparator,
+        maxTimeBetweenGroupedMessages: maxTimeBetweenGroupedMessages,
         messages: messages,
         noGroupByUser: noGroupByUser,
         reviewProcessedMessage: reviewProcessedMessage,

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

@@ -51,7 +51,7 @@ export type VirtualizedMessageListProps<StreamChatGenerics extends DefaultStream
     /** Disables the injection of date separator components in MessageList, defaults to `true` */
     disableDateSeparator?: boolean;
     /** Callback function to set group styles for each message */
-    groupStyles?: (message: StreamMessage<StreamChatGenerics>, previousMessage: StreamMessage<StreamChatGenerics>, nextMessage: StreamMessage<StreamChatGenerics>, noGroupByUser: boolean) => GroupStyle;
+    groupStyles?: (message: StreamMessage<StreamChatGenerics>, previousMessage: StreamMessage<StreamChatGenerics>, nextMessage: StreamMessage<StreamChatGenerics>, noGroupByUser: boolean, maxTimeBetweenGroupedMessages?: number) => GroupStyle;
     /** Whether or not the list has more items to load */
     hasMore?: boolean;
     /** Whether or not the list has newer items to load */
@@ -75,6 +75,8 @@ 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>);
+    /** Maximum time in milliseconds that should occur between messages to still consider them grouped together */
+    maxTimeBetweenGroupedMessages?: number;
     /** 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 */

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

@@ -48,7 +48,7 @@ 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, formatDate = props.formatDate, 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 ? DEFAULT_NEXT_CHANNEL_PAGE_SIZE : _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, formatDate = props.formatDate, 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, maxTimeBetweenGroupedMessages = props.maxTimeBetweenGroupedMessages, MessageUIComponentFromProps = props.Message, messageActions = props.messageActions, _g = props.messageLimit, messageLimit = _g === void 0 ? DEFAULT_NEXT_CHANNEL_PAGE_SIZE : _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
@@ -111,7 +111,7 @@ var VirtualizedMessageListWithContext = function (props) {
     var groupStylesFn = groupStyles || getGroupStyles;
     var messageGroupStyles = useMemo(function () {
         return processedMessages.reduce(function (acc, message, i) {
-            var style = groupStylesFn(message, processedMessages[i - 1], processedMessages[i + 1], !shouldGroupByUser);
+            var style = groupStylesFn(message, processedMessages[i - 1], processedMessages[i + 1], !shouldGroupByUser, maxTimeBetweenGroupedMessages);
             if (style)
                 acc[message.id] = style;
             return acc;
@@ -119,7 +119,7 @@ var VirtualizedMessageListWithContext = function (props) {
     }, 
     // processedMessages were incorrectly rebuilt with a new object identity at some point, hence the .length usage
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [processedMessages.length, shouldGroupByUser, groupStylesFn]);
+    [maxTimeBetweenGroupedMessages, processedMessages.length, shouldGroupByUser, groupStylesFn]);
     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,

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,EAAE,aAAa,EAAuB,MAAM,eAAe,CAAC;AAInE,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,mFAoHnB,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,EAAE,aAAa,EAAuB,MAAM,eAAe,CAAC;AAInE,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,mFAwHnB,CAAC"}

package/dist/components/MessageList/VirtualizedMessageListComponents.js

@@ -61,8 +61,8 @@ export var Footer = function () {
     return TypingIndicator ? React.createElement(TypingIndicator, { avatarSize: 24 }) : null;
 };
 export var messageRenderer = function (virtuosoIndex, _data, virtuosoContext) {
-    var _a, _b, _c, _d, _e, _f, _g;
-    var additionalMessageInputProps = virtuosoContext.additionalMessageInputProps, closeReactionSelectorOnClick = virtuosoContext.closeReactionSelectorOnClick, customMessageActions = virtuosoContext.customMessageActions, customMessageRenderer = virtuosoContext.customMessageRenderer, DateSeparator = virtuosoContext.DateSeparator, firstUnreadMessageId = virtuosoContext.firstUnreadMessageId, formatDate = virtuosoContext.formatDate, lastReadDate = virtuosoContext.lastReadDate, lastReadMessageId = virtuosoContext.lastReadMessageId, lastReceivedMessageId = virtuosoContext.lastReceivedMessageId, MessageUIComponent = virtuosoContext.Message, messageActions = virtuosoContext.messageActions, MessageSystem = virtuosoContext.MessageSystem, numItemsPrepended = virtuosoContext.numItemsPrepended, ownMessagesReadByOthers = virtuosoContext.ownMessagesReadByOthers, messageList = virtuosoContext.processedMessages, reactionDetailsSort = virtuosoContext.reactionDetailsSort, shouldGroupByUser = virtuosoContext.shouldGroupByUser, sortReactionDetails = virtuosoContext.sortReactionDetails, sortReactions = virtuosoContext.sortReactions, _h = virtuosoContext.unreadMessageCount, unreadMessageCount = _h === void 0 ? 0 : _h, UnreadMessagesSeparator = virtuosoContext.UnreadMessagesSeparator, virtuosoRef = virtuosoContext.virtuosoRef;
+    var _a, _b, _c, _d, _e, _f, _g, _h;
+    var additionalMessageInputProps = virtuosoContext.additionalMessageInputProps, closeReactionSelectorOnClick = virtuosoContext.closeReactionSelectorOnClick, customMessageActions = virtuosoContext.customMessageActions, customMessageRenderer = virtuosoContext.customMessageRenderer, DateSeparator = virtuosoContext.DateSeparator, firstUnreadMessageId = virtuosoContext.firstUnreadMessageId, formatDate = virtuosoContext.formatDate, lastReadDate = virtuosoContext.lastReadDate, lastReadMessageId = virtuosoContext.lastReadMessageId, lastReceivedMessageId = virtuosoContext.lastReceivedMessageId, MessageUIComponent = virtuosoContext.Message, messageActions = virtuosoContext.messageActions, messageGroupStyles = virtuosoContext.messageGroupStyles, MessageSystem = virtuosoContext.MessageSystem, numItemsPrepended = virtuosoContext.numItemsPrepended, ownMessagesReadByOthers = virtuosoContext.ownMessagesReadByOthers, messageList = virtuosoContext.processedMessages, reactionDetailsSort = virtuosoContext.reactionDetailsSort, shouldGroupByUser = virtuosoContext.shouldGroupByUser, sortReactionDetails = virtuosoContext.sortReactionDetails, sortReactions = virtuosoContext.sortReactions, _j = virtuosoContext.unreadMessageCount, unreadMessageCount = _j === void 0 ? 0 : _j, UnreadMessagesSeparator = virtuosoContext.UnreadMessagesSeparator, virtuosoRef = virtuosoContext.virtuosoRef;
     var streamMessageIndex = calculateItemIndex(virtuosoIndex, numItemsPrepended);
     if (customMessageRenderer) {
         return customMessageRenderer(messageList, streamMessageIndex);
@@ -81,6 +81,7 @@ export var messageRenderer = function (virtuosoIndex, _data, virtuosoContext) {
         ((_a = message.user) === null || _a === void 0 ? void 0 : _a.id) === ((_b = messageList[streamMessageIndex - 1].user) === null || _b === void 0 ? void 0 : _b.id);
     var maybePrevMessage = messageList[streamMessageIndex - 1];
     var maybeNextMessage = messageList[streamMessageIndex + 1];
+    // FIXME: firstOfGroup & endOfGroup should be derived from groupStyles which apply a more complex logic
     var firstOfGroup = shouldGroupByUser &&
         (((_c = message.user) === null || _c === void 0 ? void 0 : _c.id) !== ((_d = maybePrevMessage === null || maybePrevMessage === void 0 ? void 0 : maybePrevMessage.user) === null || _d === void 0 ? void 0 : _d.id) ||
             (maybePrevMessage && isMessageEdited(maybePrevMessage)));
@@ -103,7 +104,7 @@ export var messageRenderer = function (virtuosoIndex, _data, virtuosoContext) {
     return (React.createElement(React.Fragment, null,
         showUnreadSeparatorAbove && (React.createElement("div", { className: 'str-chat__unread-messages-separator-wrapper' },
             React.createElement(UnreadMessagesSeparator, { unreadCount: unreadMessageCount }))),
-        React.createElement(Message, { additionalMessageInputProps: additionalMessageInputProps, autoscrollToBottom: (_g = virtuosoRef.current) === null || _g === void 0 ? void 0 : _g.autoscrollToBottom, closeReactionSelectorOnClick: closeReactionSelectorOnClick, customMessageActions: customMessageActions, endOfGroup: endOfGroup, firstOfGroup: firstOfGroup, formatDate: formatDate, groupedByUser: groupedByUser, lastReceivedId: lastReceivedMessageId, message: message, Message: MessageUIComponent, messageActions: messageActions, reactionDetailsSort: reactionDetailsSort, readBy: ownMessagesReadByOthers[message.id] || [], sortReactionDetails: sortReactionDetails, sortReactions: sortReactions }),
+        React.createElement(Message, { additionalMessageInputProps: additionalMessageInputProps, autoscrollToBottom: (_g = virtuosoRef.current) === null || _g === void 0 ? void 0 : _g.autoscrollToBottom, closeReactionSelectorOnClick: closeReactionSelectorOnClick, customMessageActions: customMessageActions, endOfGroup: endOfGroup, firstOfGroup: firstOfGroup, formatDate: formatDate, groupedByUser: groupedByUser, groupStyles: [(_h = messageGroupStyles[message.id]) !== null && _h !== void 0 ? _h : ''], lastReceivedId: lastReceivedMessageId, message: message, Message: MessageUIComponent, messageActions: messageActions, reactionDetailsSort: reactionDetailsSort, readBy: ownMessagesReadByOthers[message.id] || [], sortReactionDetails: sortReactionDetails, sortReactions: sortReactions }),
         showUnreadSeparatorBelow && (React.createElement("div", { className: 'str-chat__unread-messages-separator-wrapper' },
             React.createElement(UnreadMessagesSeparator, { unreadCount: unreadMessageCount })))));
 };

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

@@ -9,8 +9,9 @@ export declare const useEnrichedMessages: <StreamChatGenerics extends DefaultStr
     hideNewMessageSeparator: boolean;
     messages: StreamMessage<StreamChatGenerics>[];
     noGroupByUser: boolean;
-    groupStyles?: ((message: StreamMessage<StreamChatGenerics>, previousMessage: StreamMessage<StreamChatGenerics>, nextMessage: StreamMessage<StreamChatGenerics>, noGroupByUser: boolean) => GroupStyle) | undefined;
+    groupStyles?: ((message: StreamMessage<StreamChatGenerics>, previousMessage: StreamMessage<StreamChatGenerics>, nextMessage: StreamMessage<StreamChatGenerics>, noGroupByUser: boolean, maxTimeBetweenGroupedMessages?: number) => GroupStyle) | undefined;
     headerPosition?: number | undefined;
+    maxTimeBetweenGroupedMessages?: number | undefined;
     reviewProcessedMessage?: ((params: {
         changes: StreamMessage<StreamChatGenerics>[];
         context: {

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

@@ -1 +1 @@
-{"version":3,"file":"useEnrichedMessages.d.ts","sourceRoot":"","sources":["../../../../../src/components/MessageList/hooks/MessageList/useEnrichedMessages.ts"],"names":[],"mappings":"AAEA,OAAO,EAEL,UAAU,EAGV,qBAAqB,EACtB,MAAM,aAAa,CAAC;AAKrB,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAE3C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yCAAyC,CAAC;AAE7E,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,yBAAyB,CAAC;AAEzE,eAAO,MAAM,mBAAmB;;0BAIR,OAAO;yBACR,OAAO;6BACH,OAAO;;mBAEjB,OAAO;mLAKL,OAAO,KACnB,UAAU;;;;;;;;;;;;;;;;;;CA0DhB,CAAC"}
+{"version":3,"file":"useEnrichedMessages.d.ts","sourceRoot":"","sources":["../../../../../src/components/MessageList/hooks/MessageList/useEnrichedMessages.ts"],"names":[],"mappings":"AAEA,OAAO,EAEL,UAAU,EAGV,qBAAqB,EACtB,MAAM,aAAa,CAAC;AAKrB,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAE3C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yCAAyC,CAAC;AAE7E,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,yBAAyB,CAAC;AAEzE,eAAO,MAAM,mBAAmB;;0BAIR,OAAO;yBACR,OAAO;6BACH,OAAO;;mBAEjB,OAAO;mLAKL,OAAO,kCACU,MAAM,KACnC,UAAU;;;;;;;;;;;;;;;;;;;CA6DhB,CAAC"}

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

@@ -3,7 +3,7 @@ import { getGroupStyles, insertIntro, processMessages, } from '../../utils';
 import { useChatContext } from '../../../../context/ChatContext';
 import { useComponentContext } from '../../../../context/ComponentContext';
 export var useEnrichedMessages = function (args) {
-    var channel = args.channel, disableDateSeparator = args.disableDateSeparator, groupStyles = args.groupStyles, headerPosition = args.headerPosition, hideDeletedMessages = args.hideDeletedMessages, hideNewMessageSeparator = args.hideNewMessageSeparator, messages = args.messages, noGroupByUser = args.noGroupByUser, reviewProcessedMessage = args.reviewProcessedMessage;
+    var channel = args.channel, disableDateSeparator = args.disableDateSeparator, groupStyles = args.groupStyles, headerPosition = args.headerPosition, hideDeletedMessages = args.hideDeletedMessages, hideNewMessageSeparator = args.hideNewMessageSeparator, maxTimeBetweenGroupedMessages = args.maxTimeBetweenGroupedMessages, messages = args.messages, noGroupByUser = args.noGroupByUser, reviewProcessedMessage = args.reviewProcessedMessage;
     var client = useChatContext('useEnrichedMessages').client;
     var HeaderComponent = useComponentContext('useEnrichedMessages').HeaderComponent;
     var lastRead = useMemo(function () { var _a; return (_a = channel.lastRead) === null || _a === void 0 ? void 0 : _a.call(channel); }, [channel]);
@@ -25,13 +25,13 @@ export var useEnrichedMessages = function (args) {
     var groupStylesFn = groupStyles || getGroupStyles;
     var messageGroupStyles = useMemo(function () {
         return messagesWithDates.reduce(function (acc, message, i) {
-            var style = groupStylesFn(message, messagesWithDates[i - 1], messagesWithDates[i + 1], noGroupByUser);
+            var style = groupStylesFn(message, messagesWithDates[i - 1], messagesWithDates[i + 1], noGroupByUser, maxTimeBetweenGroupedMessages);
             if (style)
                 acc[message.id] = style;
             return acc;
         }, {});
     }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [messagesWithDates, noGroupByUser]);
+    [maxTimeBetweenGroupedMessages, messagesWithDates, noGroupByUser]);
     return { messageGroupStyles: messageGroupStyles, messages: messagesWithDates };
 };

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

@@ -57,7 +57,7 @@ export declare const getReadStates: <StreamChatGenerics extends DefaultStreamCha
 }> | undefined, returnAllReadData: boolean) => Record<string, UserResponse<StreamChatGenerics>[]>;
 export declare const insertIntro: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(messages: StreamMessage<StreamChatGenerics>[], headerPosition?: number) => StreamMessage<StreamChatGenerics>[];
 export type GroupStyle = '' | 'middle' | 'top' | 'bottom' | 'single';
-export declare const getGroupStyles: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(message: StreamMessage<StreamChatGenerics>, previousMessage: StreamMessage<StreamChatGenerics>, nextMessage: StreamMessage<StreamChatGenerics>, noGroupByUser: boolean) => GroupStyle;
+export declare const getGroupStyles: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(message: StreamMessage<StreamChatGenerics>, previousMessage: StreamMessage<StreamChatGenerics>, nextMessage: StreamMessage<StreamChatGenerics>, noGroupByUser: boolean, maxTimeBetweenGroupedMessages?: number) => GroupStyle;
 export declare const hasMoreMessagesProbably: (returnedCountMessages: number, limit: number) => boolean;
 export declare const hasNotMoreMessages: (returnedCountMessages: number, limit: number) => boolean;
 type DateSeparatorMessage = {

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

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/MessageList/utils.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AAInE,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAC9D,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAGvE,KAAK,sBAAsB,GAAG;IAC5B,4BAA4B;IAC5B,MAAM,EAAE,MAAM,CAAC;IACf,4BAA4B;IAC5B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,2EAA2E;IAC3E,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,kEAAkE;IAClE,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,qBAAqB,CAC/B,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E,sBAAsB,GAAG;IAC3B,QAAQ,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAAE,CAAC;IAC9C,sBAAsB,CAAC,EAAE,CAAC,MAAM,EAAE;QAChC,0FAA0F;QAC1F,OAAO,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAAE,CAAC;QAC7C,4EAA4E;QAC5E,OAAO,EAAE,sBAAsB,CAAC;QAChC,oEAAoE;QACpE,KAAK,EAAE,MAAM,CAAC;QACd,oDAAoD;QACpD,QAAQ,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAAE,CAAC;QAC9C,yDAAyD;QACzD,iBAAiB,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAAE,CAAC;KACxD,KAAK,aAAa,CAAC,kBAAkB,CAAC,EAAE,CAAC;IAC1C,+FAA+F;IAC/F,sBAAsB,CAAC,EAAE,KAAK,CAAC,QAAQ,CACrC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,kBAAkB,CAAC,GAAG,SAAS,CAAC,CACpE,CAAC;CACH,CAAC;AAEF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,eAAe,8KAiG3B,CAAC;AAEF,eAAO,MAAM,iBAAiB,UAAW,MAAM,GAAG,IAAI,WAQrD,CAAC;AAGF,eAAO,MAAM,eAAe,oJAY3B,CAAC;AAEF,eAAO,MAAM,aAAa;eAIU,IAAI;;mCACnB,OAAO,uDAqC3B,CAAC;AAEF,eAAO,MAAM,WAAW,qJAIL,MAAM,wCAgDxB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,EAAE,GAAG,QAAQ,GAAG,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAErE,eAAO,MAAM,cAAc,oPAMV,OAAO,KACrB,UA2CF,CAAC;AAOF,eAAO,MAAM,uBAAuB,0BAA2B,MAAM,SAAS,MAAM,YACpD,CAAC;AAGjC,eAAO,MAAM,kBAAkB,0BAA2B,MAAM,SAAS,MAAM,YAChD,CAAC;AAEhC,KAAK,oBAAoB,GAAG;IAC1B,UAAU,EAAE,OAAO,mBAAmB,CAAC,IAAI,CAAC;IAC5C,IAAI,EAAE,IAAI,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,YAAY,CAAC;IACnB,MAAM,EAAE,OAAO,CAAC;CACjB,CAAC;AAEF,wBAAgB,sBAAsB,CACpC,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,EAEhF,OAAO,EAAE,aAAa,CAAC,kBAAkB,CAAC,GAAG,OAAO,IAAI,oBAAoB,CAE7E"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/MessageList/utils.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AAInE,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAC9D,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAGvE,KAAK,sBAAsB,GAAG;IAC5B,4BAA4B;IAC5B,MAAM,EAAE,MAAM,CAAC;IACf,4BAA4B;IAC5B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,2EAA2E;IAC3E,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,kEAAkE;IAClE,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,qBAAqB,CAC/B,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E,sBAAsB,GAAG;IAC3B,QAAQ,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAAE,CAAC;IAC9C,sBAAsB,CAAC,EAAE,CAAC,MAAM,EAAE;QAChC,0FAA0F;QAC1F,OAAO,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAAE,CAAC;QAC7C,4EAA4E;QAC5E,OAAO,EAAE,sBAAsB,CAAC;QAChC,oEAAoE;QACpE,KAAK,EAAE,MAAM,CAAC;QACd,oDAAoD;QACpD,QAAQ,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAAE,CAAC;QAC9C,yDAAyD;QACzD,iBAAiB,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAAE,CAAC;KACxD,KAAK,aAAa,CAAC,kBAAkB,CAAC,EAAE,CAAC;IAC1C,+FAA+F;IAC/F,sBAAsB,CAAC,EAAE,KAAK,CAAC,QAAQ,CACrC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,kBAAkB,CAAC,GAAG,SAAS,CAAC,CACpE,CAAC;CACH,CAAC;AAEF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,eAAe,8KAiG3B,CAAC;AAEF,eAAO,MAAM,iBAAiB,UAAW,MAAM,GAAG,IAAI,WAQrD,CAAC;AAGF,eAAO,MAAM,eAAe,oJAY3B,CAAC;AAEF,eAAO,MAAM,aAAa;eAIU,IAAI;;mCACnB,OAAO,uDAqC3B,CAAC;AAEF,eAAO,MAAM,WAAW,qJAIL,MAAM,wCAgDxB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,EAAE,GAAG,QAAQ,GAAG,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAErE,eAAO,MAAM,cAAc,oPAMV,OAAO,kCACU,MAAM,KACrC,UAqDF,CAAC;AAOF,eAAO,MAAM,uBAAuB,0BAA2B,MAAM,SAAS,MAAM,YACpD,CAAC;AAGjC,eAAO,MAAM,kBAAkB,0BAA2B,MAAM,SAAS,MAAM,YAChD,CAAC;AAEhC,KAAK,oBAAoB,GAAG;IAC1B,UAAU,EAAE,OAAO,mBAAmB,CAAC,IAAI,CAAC;IAC5C,IAAI,EAAE,IAAI,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,YAAY,CAAC;IACnB,MAAM,EAAE,OAAO,CAAC;CACjB,CAAC;AAEF,wBAAgB,sBAAsB,CACpC,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,EAEhF,OAAO,EAAE,aAAa,CAAC,kBAAkB,CAAC,GAAG,OAAO,IAAI,oBAAoB,CAE7E"}

package/dist/components/MessageList/utils.js

@@ -182,7 +182,7 @@ export var insertIntro = function (messages, headerPosition) {
     }
     return newMessages;
 };
-export var getGroupStyles = function (message, previousMessage, nextMessage, noGroupByUser) {
+export var getGroupStyles = function (message, previousMessage, nextMessage, noGroupByUser, maxTimeBetweenGroupedMessages) {
     var _a, _b, _c, _d, _e, _f, _g;
     if (message.customType === CUSTOM_MESSAGE_TYPE.date)
         return '';
@@ -194,22 +194,32 @@ export var getGroupStyles = function (message, previousMessage, nextMessage, noG
         previousMessage.customType === CUSTOM_MESSAGE_TYPE.intro ||
         previousMessage.customType === CUSTOM_MESSAGE_TYPE.date ||
         previousMessage.type === 'system' ||
+        previousMessage.type === 'error' ||
         ((_b = previousMessage.attachments) === null || _b === void 0 ? void 0 : _b.length) !== 0 ||
         ((_c = message.user) === null || _c === void 0 ? void 0 : _c.id) !== ((_d = previousMessage.user) === null || _d === void 0 ? void 0 : _d.id) ||
-        previousMessage.type === 'error' ||
         previousMessage.deleted_at ||
         (message.reaction_groups && Object.keys(message.reaction_groups).length > 0) ||
-        isMessageEdited(previousMessage);
+        isMessageEdited(previousMessage) ||
+        (maxTimeBetweenGroupedMessages !== undefined &&
+            previousMessage.created_at &&
+            message.created_at &&
+            new Date(message.created_at).getTime() - new Date(previousMessage.created_at).getTime() >
+                maxTimeBetweenGroupedMessages);
     var isBottomMessage = !nextMessage ||
+        nextMessage.customType === CUSTOM_MESSAGE_TYPE.intro ||
         nextMessage.customType === CUSTOM_MESSAGE_TYPE.date ||
         nextMessage.type === 'system' ||
-        nextMessage.customType === CUSTOM_MESSAGE_TYPE.intro ||
+        nextMessage.type === 'error' ||
         ((_e = nextMessage.attachments) === null || _e === void 0 ? void 0 : _e.length) !== 0 ||
         ((_f = message.user) === null || _f === void 0 ? void 0 : _f.id) !== ((_g = nextMessage.user) === null || _g === void 0 ? void 0 : _g.id) ||
-        nextMessage.type === 'error' ||
         nextMessage.deleted_at ||
         (nextMessage.reaction_groups && Object.keys(nextMessage.reaction_groups).length > 0) ||
-        isMessageEdited(message);
+        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';

package/dist/index.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Window = require('./Window-b4032c33.js');
+var Window = require('./Window-a963f22a.js');
 var React = require('react');
 var streamChat = require('stream-chat');
 var throttle = require('lodash.throttle');
@@ -117,7 +117,7 @@ var GiphyPreviewMessage = function (props) {
 };
 
 var useEnrichedMessages = function (args) {
-    var channel = args.channel, disableDateSeparator = args.disableDateSeparator, groupStyles = args.groupStyles, headerPosition = args.headerPosition, hideDeletedMessages = args.hideDeletedMessages, hideNewMessageSeparator = args.hideNewMessageSeparator, messages = args.messages, noGroupByUser = args.noGroupByUser, reviewProcessedMessage = args.reviewProcessedMessage;
+    var channel = args.channel, disableDateSeparator = args.disableDateSeparator, groupStyles = args.groupStyles, headerPosition = args.headerPosition, hideDeletedMessages = args.hideDeletedMessages, hideNewMessageSeparator = args.hideNewMessageSeparator, maxTimeBetweenGroupedMessages = args.maxTimeBetweenGroupedMessages, messages = args.messages, noGroupByUser = args.noGroupByUser, reviewProcessedMessage = args.reviewProcessedMessage;
     var client = Window.useChatContext('useEnrichedMessages').client;
     var HeaderComponent = Window.useComponentContext('useEnrichedMessages').HeaderComponent;
     var lastRead = React.useMemo(function () { var _a; return (_a = channel.lastRead) === null || _a === void 0 ? void 0 : _a.call(channel); }, [channel]);
@@ -139,14 +139,14 @@ var useEnrichedMessages = function (args) {
     var groupStylesFn = groupStyles || Window.getGroupStyles;
     var messageGroupStyles = React.useMemo(function () {
         return messagesWithDates.reduce(function (acc, message, i) {
-            var style = groupStylesFn(message, messagesWithDates[i - 1], messagesWithDates[i + 1], noGroupByUser);
+            var style = groupStylesFn(message, messagesWithDates[i - 1], messagesWithDates[i + 1], noGroupByUser, maxTimeBetweenGroupedMessages);
             if (style)
                 acc[message.id] = style;
             return acc;
         }, {});
     }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [messagesWithDates, noGroupByUser]);
+    [maxTimeBetweenGroupedMessages, messagesWithDates, noGroupByUser]);
     return { messageGroupStyles: messageGroupStyles, messages: messagesWithDates };
 };
 
@@ -657,7 +657,7 @@ function defaultRenderMessages(_a) {
 
 var MessageListWithContext = function (props) {
     var _a;
-    var channel = props.channel, channelUnreadUiState = props.channelUnreadUiState, _b = props.disableDateSeparator, disableDateSeparator = _b === void 0 ? false : _b, groupStyles = props.groupStyles, _c = props.hideDeletedMessages, hideDeletedMessages = _c === void 0 ? false : _c, _d = props.hideNewMessageSeparator, hideNewMessageSeparator = _d === void 0 ? false : _d, _e = props.internalInfiniteScrollProps, _f = _e === void 0 ? {} : _e, _g = _f.threshold, loadMoreScrollThreshold = _g === void 0 ? Window.DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD : _g, restInternalInfiniteScrollProps = Window.__rest(_f, ["threshold"]), _h = props.messageActions, messageActions = _h === void 0 ? Object.keys(Window.MESSAGE_ACTIONS) : _h, _j = props.messages, messages = _j === void 0 ? [] : _j, notifications = props.notifications, _k = props.noGroupByUser, noGroupByUser = _k === void 0 ? false : _k, _l = props.pinPermissions, pinPermissions = _l === void 0 ? Window.defaultPinPermissions : _l, // @deprecated in favor of `channelCapabilities` - TODO: remove in next major release
+    var channel = props.channel, channelUnreadUiState = props.channelUnreadUiState, _b = props.disableDateSeparator, disableDateSeparator = _b === void 0 ? false : _b, groupStyles = props.groupStyles, _c = props.hideDeletedMessages, hideDeletedMessages = _c === void 0 ? false : _c, _d = props.hideNewMessageSeparator, hideNewMessageSeparator = _d === void 0 ? false : _d, _e = props.internalInfiniteScrollProps, _f = _e === void 0 ? {} : _e, _g = _f.threshold, loadMoreScrollThreshold = _g === void 0 ? Window.DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD : _g, restInternalInfiniteScrollProps = Window.__rest(_f, ["threshold"]), maxTimeBetweenGroupedMessages = props.maxTimeBetweenGroupedMessages, _h = props.messageActions, messageActions = _h === void 0 ? Object.keys(Window.MESSAGE_ACTIONS) : _h, _j = props.messages, messages = _j === void 0 ? [] : _j, notifications = props.notifications, _k = props.noGroupByUser, noGroupByUser = _k === void 0 ? false : _k, _l = props.pinPermissions, pinPermissions = _l === void 0 ? Window.defaultPinPermissions : _l, // @deprecated in favor of `channelCapabilities` - TODO: remove in next major release
     _m = props.returnAllReadData, // @deprecated in favor of `channelCapabilities` - TODO: remove in next major release
     returnAllReadData = _m === void 0 ? false : _m, _o = props.threadList, threadList = _o === void 0 ? false : _o, _p = props.unsafeHTML, unsafeHTML = _p === void 0 ? false : _p, headerPosition = props.headerPosition, read = props.read, _q = props.renderMessages, renderMessages = _q === void 0 ? defaultRenderMessages : _q, reviewProcessedMessage = props.reviewProcessedMessage, _r = props.messageLimit, messageLimit = _r === void 0 ? Window.DEFAULT_NEXT_CHANNEL_PAGE_SIZE : _r, loadMoreCallback = props.loadMore, loadMoreNewerCallback = props.loadMoreNewer, _s = props.hasMoreNewer, hasMoreNewer = _s === void 0 ? false : _s, reactionDetailsSort = props.reactionDetailsSort, showUnreadNotificationAlways = props.showUnreadNotificationAlways, sortReactionDetails = props.sortReactionDetails, sortReactions = props.sortReactions, suppressAutoscroll = props.suppressAutoscroll, highlightedMessageId = props.highlightedMessageId, _t = props.jumpToLatestMessage, jumpToLatestMessage = _t === void 0 ? function () { return Promise.resolve(); } : _t;
     var _u = React__default["default"].useState(null), listElement = _u[0], setListElement = _u[1];
@@ -690,6 +690,7 @@ var MessageListWithContext = function (props) {
         headerPosition: headerPosition,
         hideDeletedMessages: hideDeletedMessages,
         hideNewMessageSeparator: hideNewMessageSeparator,
+        maxTimeBetweenGroupedMessages: maxTimeBetweenGroupedMessages,
         messages: messages,
         noGroupByUser: noGroupByUser,
         reviewProcessedMessage: reviewProcessedMessage,
@@ -1080,8 +1081,8 @@ var Footer = function () {
     return TypingIndicator ? React__default["default"].createElement(TypingIndicator, { avatarSize: 24 }) : null;
 };
 var messageRenderer = function (virtuosoIndex, _data, virtuosoContext) {
-    var _a, _b, _c, _d, _e, _f, _g;
-    var additionalMessageInputProps = virtuosoContext.additionalMessageInputProps, closeReactionSelectorOnClick = virtuosoContext.closeReactionSelectorOnClick, customMessageActions = virtuosoContext.customMessageActions, customMessageRenderer = virtuosoContext.customMessageRenderer, DateSeparator = virtuosoContext.DateSeparator, firstUnreadMessageId = virtuosoContext.firstUnreadMessageId, formatDate = virtuosoContext.formatDate, lastReadDate = virtuosoContext.lastReadDate, lastReadMessageId = virtuosoContext.lastReadMessageId, lastReceivedMessageId = virtuosoContext.lastReceivedMessageId, MessageUIComponent = virtuosoContext.Message, messageActions = virtuosoContext.messageActions, MessageSystem = virtuosoContext.MessageSystem, numItemsPrepended = virtuosoContext.numItemsPrepended, ownMessagesReadByOthers = virtuosoContext.ownMessagesReadByOthers, messageList = virtuosoContext.processedMessages, reactionDetailsSort = virtuosoContext.reactionDetailsSort, shouldGroupByUser = virtuosoContext.shouldGroupByUser, sortReactionDetails = virtuosoContext.sortReactionDetails, sortReactions = virtuosoContext.sortReactions, _h = virtuosoContext.unreadMessageCount, unreadMessageCount = _h === void 0 ? 0 : _h, UnreadMessagesSeparator = virtuosoContext.UnreadMessagesSeparator, virtuosoRef = virtuosoContext.virtuosoRef;
+    var _a, _b, _c, _d, _e, _f, _g, _h;
+    var additionalMessageInputProps = virtuosoContext.additionalMessageInputProps, closeReactionSelectorOnClick = virtuosoContext.closeReactionSelectorOnClick, customMessageActions = virtuosoContext.customMessageActions, customMessageRenderer = virtuosoContext.customMessageRenderer, DateSeparator = virtuosoContext.DateSeparator, firstUnreadMessageId = virtuosoContext.firstUnreadMessageId, formatDate = virtuosoContext.formatDate, lastReadDate = virtuosoContext.lastReadDate, lastReadMessageId = virtuosoContext.lastReadMessageId, lastReceivedMessageId = virtuosoContext.lastReceivedMessageId, MessageUIComponent = virtuosoContext.Message, messageActions = virtuosoContext.messageActions, messageGroupStyles = virtuosoContext.messageGroupStyles, MessageSystem = virtuosoContext.MessageSystem, numItemsPrepended = virtuosoContext.numItemsPrepended, ownMessagesReadByOthers = virtuosoContext.ownMessagesReadByOthers, messageList = virtuosoContext.processedMessages, reactionDetailsSort = virtuosoContext.reactionDetailsSort, shouldGroupByUser = virtuosoContext.shouldGroupByUser, sortReactionDetails = virtuosoContext.sortReactionDetails, sortReactions = virtuosoContext.sortReactions, _j = virtuosoContext.unreadMessageCount, unreadMessageCount = _j === void 0 ? 0 : _j, UnreadMessagesSeparator = virtuosoContext.UnreadMessagesSeparator, virtuosoRef = virtuosoContext.virtuosoRef;
     var streamMessageIndex = calculateItemIndex(virtuosoIndex, numItemsPrepended);
     if (customMessageRenderer) {
         return customMessageRenderer(messageList, streamMessageIndex);
@@ -1100,6 +1101,7 @@ var messageRenderer = function (virtuosoIndex, _data, virtuosoContext) {
         ((_a = message.user) === null || _a === void 0 ? void 0 : _a.id) === ((_b = messageList[streamMessageIndex - 1].user) === null || _b === void 0 ? void 0 : _b.id);
     var maybePrevMessage = messageList[streamMessageIndex - 1];
     var maybeNextMessage = messageList[streamMessageIndex + 1];
+    // FIXME: firstOfGroup & endOfGroup should be derived from groupStyles which apply a more complex logic
     var firstOfGroup = shouldGroupByUser &&
         (((_c = message.user) === null || _c === void 0 ? void 0 : _c.id) !== ((_d = maybePrevMessage === null || maybePrevMessage === void 0 ? void 0 : maybePrevMessage.user) === null || _d === void 0 ? void 0 : _d.id) ||
             (maybePrevMessage && Window.isMessageEdited(maybePrevMessage)));
@@ -1122,7 +1124,7 @@ var messageRenderer = function (virtuosoIndex, _data, virtuosoContext) {
     return (React__default["default"].createElement(React__default["default"].Fragment, null,
         showUnreadSeparatorAbove && (React__default["default"].createElement("div", { className: 'str-chat__unread-messages-separator-wrapper' },
             React__default["default"].createElement(UnreadMessagesSeparator, { unreadCount: unreadMessageCount }))),
-        React__default["default"].createElement(Window.Message, { additionalMessageInputProps: additionalMessageInputProps, autoscrollToBottom: (_g = virtuosoRef.current) === null || _g === void 0 ? void 0 : _g.autoscrollToBottom, closeReactionSelectorOnClick: closeReactionSelectorOnClick, customMessageActions: customMessageActions, endOfGroup: endOfGroup, firstOfGroup: firstOfGroup, formatDate: formatDate, groupedByUser: groupedByUser, lastReceivedId: lastReceivedMessageId, message: message, Message: MessageUIComponent, messageActions: messageActions, reactionDetailsSort: reactionDetailsSort, readBy: ownMessagesReadByOthers[message.id] || [], sortReactionDetails: sortReactionDetails, sortReactions: sortReactions }),
+        React__default["default"].createElement(Window.Message, { additionalMessageInputProps: additionalMessageInputProps, autoscrollToBottom: (_g = virtuosoRef.current) === null || _g === void 0 ? void 0 : _g.autoscrollToBottom, closeReactionSelectorOnClick: closeReactionSelectorOnClick, customMessageActions: customMessageActions, endOfGroup: endOfGroup, firstOfGroup: firstOfGroup, formatDate: formatDate, groupedByUser: groupedByUser, groupStyles: [(_h = messageGroupStyles[message.id]) !== null && _h !== void 0 ? _h : ''], lastReceivedId: lastReceivedMessageId, message: message, Message: MessageUIComponent, messageActions: messageActions, reactionDetailsSort: reactionDetailsSort, readBy: ownMessagesReadByOthers[message.id] || [], sortReactionDetails: sortReactionDetails, sortReactions: sortReactions }),
         showUnreadSeparatorBelow && (React__default["default"].createElement("div", { className: 'str-chat__unread-messages-separator-wrapper' },
             React__default["default"].createElement(UnreadMessagesSeparator, { unreadCount: unreadMessageCount })))));
 };
@@ -1158,7 +1160,7 @@ 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, formatDate = props.formatDate, 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 ? Window.DEFAULT_NEXT_CHANNEL_PAGE_SIZE : _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, formatDate = props.formatDate, 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, maxTimeBetweenGroupedMessages = props.maxTimeBetweenGroupedMessages, MessageUIComponentFromProps = props.Message, messageActions = props.messageActions, _g = props.messageLimit, messageLimit = _g === void 0 ? Window.DEFAULT_NEXT_CHANNEL_PAGE_SIZE : _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
@@ -1221,7 +1223,7 @@ var VirtualizedMessageListWithContext = function (props) {
     var groupStylesFn = groupStyles || Window.getGroupStyles;
     var messageGroupStyles = React.useMemo(function () {
         return processedMessages.reduce(function (acc, message, i) {
-            var style = groupStylesFn(message, processedMessages[i - 1], processedMessages[i + 1], !shouldGroupByUser);
+            var style = groupStylesFn(message, processedMessages[i - 1], processedMessages[i + 1], !shouldGroupByUser, maxTimeBetweenGroupedMessages);
             if (style)
                 acc[message.id] = style;
             return acc;
@@ -1229,7 +1231,7 @@ var VirtualizedMessageListWithContext = function (props) {
     }, 
     // processedMessages were incorrectly rebuilt with a new object identity at some point, hence the .length usage
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [processedMessages.length, shouldGroupByUser, groupStylesFn]);
+    [maxTimeBetweenGroupedMessages, processedMessages.length, shouldGroupByUser, groupStylesFn]);
     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,
@@ -1360,7 +1362,7 @@ function VirtualizedMessageList(props) {
     return (React__default["default"].createElement(VirtualizedMessageListWithContext, Window.__assign({ channel: channel, channelUnreadUiState: channelUnreadUiState, hasMore: !!hasMore, hasMoreNewer: !!hasMoreNewer, highlightedMessageId: highlightedMessageId, jumpToLatestMessage: jumpToLatestMessage, loadingMore: !!loadingMore, loadingMoreNewer: !!loadingMoreNewer, loadMore: loadMore, loadMoreNewer: loadMoreNewer, messages: messages, notifications: notifications, read: read, suppressAutoscroll: suppressAutoscroll }, props)));
 }
 
-var version = '11.22.0';
+var version = '11.23.0';
 
 var useChat = function (_a) {
     var _b, _c;

package/dist/version.d.ts

@@ -1,2 +1,2 @@
-export declare const version = "11.22.0";
+export declare const version = "11.23.0";
 //# sourceMappingURL=version.d.ts.map

package/dist/version.js

@@ -1 +1 @@
-export var version = '11.22.0';
+export var version = '11.23.0';