stream-chat-react 11.23.8 → 11.23.10

package/dist/components/Channel/hooks/useCreateChannelStateContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useCreateChannelStateContext.d.ts","sourceRoot":"","sources":["../../../../src/components/Channel/hooks/useCreateChannelStateContext.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,sCAAsC,CAAC;AAErF,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AAEtE,eAAO,MAAM,4BAA4B;8BAIX,MAAM,EAAE;;kDAkKrC,CAAC"}
+{"version":3,"file":"useCreateChannelStateContext.d.ts","sourceRoot":"","sources":["../../../../src/components/Channel/hooks/useCreateChannelStateContext.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,sCAAsC,CAAC;AAErF,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AAEtE,eAAO,MAAM,4BAA4B;8BAIX,MAAM,EAAE;;kDAmKrC,CAAC"}

package/dist/components/Channel/hooks/useCreateChannelStateContext.js

@@ -1,8 +1,8 @@
 import { useMemo } from 'react';
 import { isDate, isDayOrMoment } from '../../../context/TranslationContext';
 export var useCreateChannelStateContext = function (value) {
-    var _a;
-    var acceptedFiles = value.acceptedFiles, channel = value.channel, _b = value.channelCapabilitiesArray, channelCapabilitiesArray = _b === void 0 ? [] : _b, channelConfig = value.channelConfig, debounceURLEnrichmentMs = value.debounceURLEnrichmentMs, dragAndDropWindow = value.dragAndDropWindow, enrichURLForPreview = value.enrichURLForPreview, giphyVersion = value.giphyVersion, error = value.error, findURLFn = value.findURLFn, hasMore = value.hasMore, hasMoreNewer = value.hasMoreNewer, imageAttachmentSizeHandler = value.imageAttachmentSizeHandler, suppressAutoscroll = value.suppressAutoscroll, highlightedMessageId = value.highlightedMessageId, loading = value.loading, loadingMore = value.loadingMore, maxNumberOfFiles = value.maxNumberOfFiles, members = value.members, _c = value.messages, messages = _c === void 0 ? [] : _c, multipleUploads = value.multipleUploads, mutes = value.mutes, notifications = value.notifications, onLinkPreviewDismissed = value.onLinkPreviewDismissed, pinnedMessages = value.pinnedMessages, quotedMessage = value.quotedMessage, _d = value.read, read = _d === void 0 ? {} : _d, shouldGenerateVideoThumbnail = value.shouldGenerateVideoThumbnail, skipMessageDataMemoization = value.skipMessageDataMemoization, thread = value.thread, threadHasMore = value.threadHasMore, threadLoadingMore = value.threadLoadingMore, _e = value.threadMessages, threadMessages = _e === void 0 ? [] : _e, channelUnreadUiState = value.channelUnreadUiState, videoAttachmentSizeHandler = value.videoAttachmentSizeHandler, watcherCount = value.watcherCount, watcher_count = value.watcher_count, watchers = value.watchers;
+    var _a, _b;
+    var acceptedFiles = value.acceptedFiles, channel = value.channel, _c = value.channelCapabilitiesArray, channelCapabilitiesArray = _c === void 0 ? [] : _c, channelConfig = value.channelConfig, debounceURLEnrichmentMs = value.debounceURLEnrichmentMs, dragAndDropWindow = value.dragAndDropWindow, enrichURLForPreview = value.enrichURLForPreview, giphyVersion = value.giphyVersion, error = value.error, findURLFn = value.findURLFn, hasMore = value.hasMore, hasMoreNewer = value.hasMoreNewer, imageAttachmentSizeHandler = value.imageAttachmentSizeHandler, suppressAutoscroll = value.suppressAutoscroll, highlightedMessageId = value.highlightedMessageId, loading = value.loading, loadingMore = value.loadingMore, maxNumberOfFiles = value.maxNumberOfFiles, members = value.members, _d = value.messages, messages = _d === void 0 ? [] : _d, multipleUploads = value.multipleUploads, mutes = value.mutes, notifications = value.notifications, onLinkPreviewDismissed = value.onLinkPreviewDismissed, pinnedMessages = value.pinnedMessages, quotedMessage = value.quotedMessage, _e = value.read, read = _e === void 0 ? {} : _e, shouldGenerateVideoThumbnail = value.shouldGenerateVideoThumbnail, skipMessageDataMemoization = value.skipMessageDataMemoization, thread = value.thread, threadHasMore = value.threadHasMore, threadLoadingMore = value.threadLoadingMore, _f = value.threadMessages, threadMessages = _f === void 0 ? [] : _f, channelUnreadUiState = value.channelUnreadUiState, videoAttachmentSizeHandler = value.videoAttachmentSizeHandler, watcherCount = value.watcherCount, watcher_count = value.watcher_count, watchers = value.watchers;
     var channelId = channel.cid;
     var lastRead = channel.initialized && ((_a = channel.lastRead()) === null || _a === void 0 ? void 0 : _a.getTime());
     var membersLength = Object.keys(members || []).length;
@@ -83,6 +83,7 @@ export var useCreateChannelStateContext = function (value) {
     }); }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [
+        (_b = channel.data) === null || _b === void 0 ? void 0 : _b.name,
         channelId,
         channelUnreadUiState,
         debounceURLEnrichmentMs,

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

@@ -1 +1 @@
-{"version":3,"file":"ChannelHeader.d.ts","sourceRoot":"","sources":["../../../src/components/ChannelHeader/ChannelHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,WAAW,EAA2B,MAAM,WAAW,CAAC;AAOjE,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAEnE,MAAM,MAAM,kBAAkB,GAAG;IAC/B,4LAA4L;IAC5L,MAAM,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;IAC1C,sEAAsE;IACtE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iEAAiE;IACjE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,0KAA0K;IAC1K,QAAQ,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC/B,yBAAyB;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAiEF;;GAEG;AACH,eAAO,MAAM,aAAa,4FA/DjB,kBAAkB,sBA+DuE,CAAC"}
+{"version":3,"file":"ChannelHeader.d.ts","sourceRoot":"","sources":["../../../src/components/ChannelHeader/ChannelHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,WAAW,EAA2B,MAAM,WAAW,CAAC;AAOjE,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAEnE,MAAM,MAAM,kBAAkB,GAAG;IAC/B,4LAA4L;IAC5L,MAAM,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;IAC1C,sEAAsE;IACtE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iEAAiE;IACjE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,0KAA0K;IAC1K,QAAQ,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC/B,yBAAyB;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,aAAa,4FAGjB,kBAAkB,sBA0D1B,CAAC"}

package/dist/components/ChannelHeader/ChannelHeader.js

@@ -5,7 +5,10 @@ import { useChannelPreviewInfo } from '../ChannelPreview/hooks/useChannelPreview
 import { useChannelStateContext } from '../../context/ChannelStateContext';
 import { useChatContext } from '../../context/ChatContext';
 import { useTranslationContext } from '../../context/TranslationContext';
-var UnMemoizedChannelHeader = function (props) {
+/**
+ * The ChannelHeader component renders some basic information about a Channel.
+ */
+export var ChannelHeader = function (props) {
     var _a = props.Avatar, Avatar = _a === void 0 ? DefaultAvatar : _a, _b = props.MenuIcon, MenuIcon = _b === void 0 ? DefaultMenuIcon : _b, overrideImage = props.image, live = props.live, overrideTitle = props.title;
     var _c = useChannelStateContext('ChannelHeader'), channel = _c.channel, watcher_count = _c.watcher_count;
     var openMobileNav = useChatContext('ChannelHeader').openMobileNav;
@@ -35,7 +38,3 @@ var UnMemoizedChannelHeader = function (props) {
                     ' ')),
                 t('{{ watcherCount }} online', { watcherCount: watcher_count })))));
 };
-/**
- * The ChannelHeader component renders some basic information about a Channel.
- */
-export var ChannelHeader = React.memo(UnMemoizedChannelHeader);

package/dist/components/ChannelPreview/hooks/useChannelPreviewInfo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useChannelPreviewInfo.d.ts","sourceRoot":"","sources":["../../../../src/components/ChannelPreview/hooks/useChannelPreviewInfo.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAG3C,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AAItE,MAAM,MAAM,wBAAwB,CAAC,kBAAkB,SAAS,yBAAyB,IAAI;IAC3F,OAAO,EAAE,OAAO,CAAC,kBAAkB,CAAC,CAAC;IACrC,sEAAsE;IACtE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,yBAAyB;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,eAAO,MAAM,qBAAqB;;;CAkCjC,CAAC"}
+{"version":3,"file":"useChannelPreviewInfo.d.ts","sourceRoot":"","sources":["../../../../src/components/ChannelPreview/hooks/useChannelPreviewInfo.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAG3C,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AAItE,MAAM,MAAM,wBAAwB,CAAC,kBAAkB,SAAS,yBAAyB,IAAI;IAC3F,OAAO,EAAE,OAAO,CAAC,kBAAkB,CAAC,CAAC;IACrC,sEAAsE;IACtE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,yBAAyB;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,eAAO,MAAM,qBAAqB;;;CAmCjC,CAAC"}

package/dist/components/ChannelPreview/hooks/useChannelPreviewInfo.js

@@ -3,26 +3,24 @@ import { getDisplayImage, getDisplayTitle } from '../utils';
 import { useChatContext } from '../../../context';
 export var useChannelPreviewInfo = function (props) {
     var channel = props.channel, overrideImage = props.overrideImage, overrideTitle = props.overrideTitle;
-    var client = useChatContext('ChannelPreview').client;
-    var _a = useState(getDisplayTitle(channel, client.user)), displayTitle = _a[0], setDisplayTitle = _a[1];
-    var _b = useState(getDisplayImage(channel, client.user)), displayImage = _b[0], setDisplayImage = _b[1];
+    var client = useChatContext('useChannelPreviewInfo').client;
+    var _a = useState(function () { return overrideTitle || getDisplayTitle(channel, client.user); }), displayTitle = _a[0], setDisplayTitle = _a[1];
+    var _b = useState(function () { return overrideImage || getDisplayImage(channel, client.user); }), displayImage = _b[0], setDisplayImage = _b[1];
     useEffect(function () {
-        var handleEvent = function () {
-            setDisplayTitle(function (displayTitle) {
-                var newDisplayTitle = getDisplayTitle(channel, client.user);
-                return displayTitle !== newDisplayTitle ? newDisplayTitle : displayTitle;
-            });
-            setDisplayImage(function (displayImage) {
-                var newDisplayImage = getDisplayImage(channel, client.user);
-                return displayImage !== newDisplayImage ? newDisplayImage : displayImage;
-            });
+        if (overrideTitle && overrideImage)
+            return;
+        var updateTitles = function () {
+            if (!overrideTitle)
+                setDisplayTitle(getDisplayTitle(channel, client.user));
+            if (!overrideImage)
+                setDisplayImage(getDisplayImage(channel, client.user));
         };
-        client.on('user.updated', handleEvent);
+        updateTitles();
+        client.on('user.updated', updateTitles);
         return function () {
-            client.off('user.updated', handleEvent);
+            client.off('user.updated', updateTitles);
         };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
+    }, [channel, channel.data, client, overrideImage, overrideTitle]);
     return {
         displayImage: overrideImage || displayImage,
         displayTitle: overrideTitle || displayTitle,

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

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/ChannelPreview/utils.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,OAAO,EAAwB,YAAY,EAAE,MAAM,aAAa,CAAC;AAE/E,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,kCAAkC,CAAC;AAEhF,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAEnE,eAAO,MAAM,iBAAiB,SAAU,MAAM,sBAAmD,CAAC;AAElG,eAAO,MAAM,uBAAuB,8HAI/B,uBAAuB,CAAC,GAAG,CAAC,iBACjB,uBAAuB,CAAC,cAAc,CAAC,KACpD,MAAM,GAAG,WA6BX,CAAC;AAEF,eAAO,MAAM,eAAe,4MAiB3B,CAAC;AAEF,eAAO,MAAM,eAAe,4MAiB3B,CAAC"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/ChannelPreview/utils.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,OAAO,EAAwB,YAAY,EAAE,MAAM,aAAa,CAAC;AAE/E,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,kCAAkC,CAAC;AAEhF,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAEnE,eAAO,MAAM,iBAAiB,SAAU,MAAM,sBAAmD,CAAC;AAElG,eAAO,MAAM,uBAAuB,8HAI/B,uBAAuB,CAAC,GAAG,CAAC,iBACjB,uBAAuB,CAAC,cAAc,CAAC,KACpD,MAAM,GAAG,WA6BX,CAAC;AAgBF,eAAO,MAAM,eAAe,4MAK4B,CAAC;AAEzD,eAAO,MAAM,eAAe,4MAK6B,CAAC"}

package/dist/components/ChannelPreview/utils.js

@@ -25,27 +25,15 @@ export var getLatestMessagePreview = function (channel, t, userLanguage) {
     }
     return t('Empty message...');
 };
-export var getDisplayTitle = function (channel, currentUser) {
+var getChannelDisplayInfo = function (info, channel, currentUser) {
     var _a, _b;
-    var title = (_a = channel.data) === null || _a === void 0 ? void 0 : _a.name;
+    if ((_a = channel.data) === null || _a === void 0 ? void 0 : _a[info])
+        return channel.data[info];
     var members = Object.values(channel.state.members);
-    if (!title && members.length === 2) {
-        var otherMember = members.find(function (member) { var _a; return ((_a = member.user) === null || _a === void 0 ? void 0 : _a.id) !== (currentUser === null || currentUser === void 0 ? void 0 : currentUser.id); });
-        if ((_b = otherMember === null || otherMember === void 0 ? void 0 : otherMember.user) === null || _b === void 0 ? void 0 : _b.name) {
-            title = otherMember.user.name;
-        }
-    }
-    return title;
-};
-export var getDisplayImage = function (channel, currentUser) {
-    var _a, _b;
-    var image = (_a = channel.data) === null || _a === void 0 ? void 0 : _a.image;
-    var members = Object.values(channel.state.members);
-    if (!image && members.length === 2) {
-        var otherMember = members.find(function (member) { var _a; return ((_a = member.user) === null || _a === void 0 ? void 0 : _a.id) !== (currentUser === null || currentUser === void 0 ? void 0 : currentUser.id); });
-        if ((_b = otherMember === null || otherMember === void 0 ? void 0 : otherMember.user) === null || _b === void 0 ? void 0 : _b.image) {
-            image = otherMember.user.image;
-        }
-    }
-    return image;
+    if (members.length !== 2)
+        return;
+    var otherMember = members.find(function (member) { var _a; return ((_a = member.user) === null || _a === void 0 ? void 0 : _a.id) !== (currentUser === null || currentUser === void 0 ? void 0 : currentUser.id); });
+    return (_b = otherMember === null || otherMember === void 0 ? void 0 : otherMember.user) === null || _b === void 0 ? void 0 : _b[info];
 };
+export var getDisplayTitle = function (channel, currentUser) { return getChannelDisplayInfo('name', channel, currentUser); };
+export var getDisplayImage = function (channel, currentUser) { return getChannelDisplayInfo('image', channel, currentUser); };

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Window = require('../../Window-60c672e3.js');
+var Window = require('../../Window-2ad58fe5.js');
 var React = require('react');
 var Picker = require('@emoji-mart/react');
 require('dayjs');

package/dist/components/Message/MessageOptions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MessageOptions.d.ts","sourceRoot":"","sources":["../../../src/components/Message/MessageOptions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,OAAO,EAAE,mBAAmB,EAAqB,MAAM,8BAA8B,CAAC;AAEtF,OAAO,KAAK,EAAE,yBAAyB,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAG9E,MAAM,MAAM,mBAAmB,CAC7B,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E,OAAO,CAAC,IAAI,CAAC,mBAAmB,CAAC,kBAAkB,CAAC,EAAE,kBAAkB,CAAC,CAAC,GAAG;IAE/E,WAAW,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;IAE7C,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAEpD,YAAY,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;IAE9C,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,UAAU,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;CAC7C,CAAC;AAoFF,eAAO,MAAM,cAAc,gKAES,CAAC"}
+{"version":3,"file":"MessageOptions.d.ts","sourceRoot":"","sources":["../../../src/components/Message/MessageOptions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,OAAO,EAAE,mBAAmB,EAAqB,MAAM,8BAA8B,CAAC;AAEtF,OAAO,KAAK,EAAE,yBAAyB,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAG9E,MAAM,MAAM,mBAAmB,CAC7B,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E,OAAO,CAAC,IAAI,CAAC,mBAAmB,CAAC,kBAAkB,CAAC,EAAE,kBAAkB,CAAC,CAAC,GAAG;IAE/E,WAAW,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;IAE7C,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAEpD,YAAY,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;IAE9C,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,UAAU,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;CAC7C,CAAC;AA+EF,eAAO,MAAM,cAAc,gKAES,CAAC"}

package/dist/components/Message/MessageOptions.js

@@ -1,16 +1,15 @@
 import React from 'react';
 import { ActionsIcon as DefaultActionsIcon, ReactionIcon as DefaultReactionIcon, ThreadIcon as DefaultThreadIcon, } from './icons';
-import { MESSAGE_ACTIONS, showMessageActionsBox } from './utils';
+import { MESSAGE_ACTIONS } from './utils';
 import { MessageActions } from '../MessageActions';
 import { useMessageContext } from '../../context/MessageContext';
 import { useTranslationContext } from '../../context';
 var UnMemoizedMessageOptions = function (props) {
     var _a = props.ActionsIcon, ActionsIcon = _a === void 0 ? DefaultActionsIcon : _a, _b = props.displayReplies, displayReplies = _b === void 0 ? true : _b, propHandleOpenThread = props.handleOpenThread, messageWrapperRef = props.messageWrapperRef, _c = props.ReactionIcon, ReactionIcon = _c === void 0 ? DefaultReactionIcon : _c, _d = props.theme, theme = _d === void 0 ? 'simple' : _d, _e = props.ThreadIcon, ThreadIcon = _e === void 0 ? DefaultThreadIcon : _e;
-    var _f = useMessageContext('MessageOptions'), customMessageActions = _f.customMessageActions, getMessageActions = _f.getMessageActions, contextHandleOpenThread = _f.handleOpenThread, initialMessage = _f.initialMessage, message = _f.message, onReactionListClick = _f.onReactionListClick, showDetailedReactions = _f.showDetailedReactions, threadList = _f.threadList;
+    var _f = useMessageContext('MessageOptions'), getMessageActions = _f.getMessageActions, contextHandleOpenThread = _f.handleOpenThread, initialMessage = _f.initialMessage, message = _f.message, onReactionListClick = _f.onReactionListClick, showDetailedReactions = _f.showDetailedReactions, threadList = _f.threadList;
     var t = useTranslationContext('MessageOptions').t;
     var handleOpenThread = propHandleOpenThread || contextHandleOpenThread;
     var messageActions = getMessageActions();
-    var showActionsBox = showMessageActionsBox(messageActions, threadList) || !!customMessageActions;
     var shouldShowReactions = messageActions.indexOf(MESSAGE_ACTIONS.react) > -1;
     var shouldShowReplies = messageActions.indexOf(MESSAGE_ACTIONS.reply) > -1 && displayReplies && !threadList;
     if (!message.type ||
@@ -24,7 +23,7 @@ var UnMemoizedMessageOptions = function (props) {
     }
     var rootClassName = "str-chat__message-".concat(theme, "__actions str-chat__message-options");
     return (React.createElement("div", { className: rootClassName, "data-testid": 'message-options' },
-        showActionsBox && (React.createElement(MessageActions, { ActionsIcon: ActionsIcon, messageWrapperRef: messageWrapperRef })),
+        React.createElement(MessageActions, { ActionsIcon: ActionsIcon, messageWrapperRef: messageWrapperRef }),
         shouldShowReplies && (React.createElement("button", { "aria-label": t('aria/Open Thread'), className: "str-chat__message-".concat(theme, "__actions__action str-chat__message-").concat(theme, "__actions__action--thread str-chat__message-reply-in-thread-button"), "data-testid": 'thread-action', onClick: handleOpenThread },
             React.createElement(ThreadIcon, { className: 'str-chat__message-action-icon' }))),
         shouldShowReactions && (React.createElement("button", { "aria-expanded": showDetailedReactions, "aria-label": t('aria/Open Reaction Selector'), className: "str-chat__message-".concat(theme, "__actions__action str-chat__message-").concat(theme, "__actions__action--reactions str-chat__message-reactions-button"), "data-testid": 'message-reaction-action', onClick: onReactionListClick },

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

@@ -2,7 +2,7 @@ import type { TFunction } from 'i18next';
 import type { MessageResponse, Mute, StreamChat, UserResponse } from 'stream-chat';
 import type { PinPermissions } from './hooks';
 import type { MessageProps } from './types';
-import type { MessageContextValue, StreamMessage } from '../../context';
+import type { ComponentContextValue, CustomMessageActions, MessageContextValue, StreamMessage } from '../../context';
 import type { DefaultStreamChatGenerics } from '../../types/types';
 /**
  * Following function validates a function which returns notification message.
@@ -39,7 +39,16 @@ export type Capabilities = {
 };
 export declare const getMessageActions: (actions: MessageActionsArray | boolean, { canDelete, canEdit, canFlag, canMarkUnread, canMute, canPin, canQuote, canReact, canReply, }: Capabilities) => MessageActionsArray<string>;
 export declare const ACTIONS_NOT_WORKING_IN_THREAD: string[];
+/**
+ * @deprecated use `shouldRenderMessageActions` instead
+ */
 export declare const showMessageActionsBox: (actions: MessageActionsArray<string>, inThread?: boolean | undefined) => boolean;
+export declare const shouldRenderMessageActions: <SCG extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ customMessageActions, CustomMessageActionsList, inThread, messageActions, }: {
+    messageActions: MessageActionsArray<string>;
+    customMessageActions?: CustomMessageActions<SCG> | undefined;
+    CustomMessageActionsList?: import("react").ComponentType<import("..").CustomMessageActionsListProps<SCG>> | undefined;
+    inThread?: boolean | undefined;
+}) => boolean;
 export declare const areMessagePropsEqual: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(prevProps: MessageProps<StreamChatGenerics, import("../../types/types").CustomTrigger> & {
     mutes?: Mute<StreamChatGenerics>[] | undefined;
     showDetailedReactions?: boolean | undefined;

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

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/Message/utils.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACzC,OAAO,KAAK,EAAE,eAAe,EAAE,IAAI,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AACnF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC5C,OAAO,KAAK,EAAE,mBAAmB,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AACxE,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAEnE;;;GAGG;AACH,eAAO,MAAM,qBAAqB,8CACV,OAAO,2BAiB9B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,WAAW,2LAUvB,CAAC;AAEF,eAAO,MAAM,eAAe;;;;;;;;;;CAU3B,CAAC;AAEF,MAAM,MAAM,mBAAmB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,IAAI,KAAK,CAChE,QAAQ,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,KAAK,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,CAAC,CAC9E,CAAC;AAGF,eAAO,MAAM,qBAAqB,EAAE,cAwDnC,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,iBAAiB,YACnB,mBAAmB,GAAG,OAAO,kGAWnC,YAAY,gCAmDhB,CAAC;AAEF,eAAO,MAAM,6BAA6B,UAKzC,CAAC;AAEF,eAAO,MAAM,qBAAqB,oDAErB,OAAO,GAAG,SAAS,YAsB/B,CAAC;AA4BF,eAAO,MAAM,oBAAoB;;;;;;aAsChC,CAAC;AAEF,eAAO,MAAM,sBAAsB;;;;aAgClC,CAAC;AAEF,eAAO,MAAM,mBAAmB,wJAIiD,CAAC;AAElF,eAAO,MAAM,qBAAqB,wJAIyB,CAAC;AAE5D,eAAO,MAAM,SAAS,yMASrB,CAAC;AAEF,eAAO,MAAM,sBAAsB,yMASlC,CAAC;AAEF,MAAM,WAAW,qBAAqB;IACpC,CAAC,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,EAC/E,IAAI,EAAE,YAAY,CAAC,kBAAkB,CAAC,GACrC,MAAM,CAAC;CACX;AAED;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,EAAE,qBAAsD,CAAC;AAEvF,eAAO,MAAM,oBAAoB,mIAI5B,SAAS,iEAEW,qBAAqB,WAiD7C,CAAC;AAEF,eAAO,MAAM,YAAY,UAAW,MAAM,YAOzC,CAAC;AAEF,eAAO,MAAM,gBAAgB,gLAM4C,CAAC;AAE1E,eAAO,MAAM,eAAe,4KAIU,CAAC"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/Message/utils.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACzC,OAAO,KAAK,EAAE,eAAe,EAAE,IAAI,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AACnF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC5C,OAAO,KAAK,EACV,qBAAqB,EACrB,oBAAoB,EACpB,mBAAmB,EACnB,aAAa,EACd,MAAM,eAAe,CAAC;AACvB,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAEnE;;;GAGG;AACH,eAAO,MAAM,qBAAqB,8CACV,OAAO,2BAiB9B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,WAAW,2LAUvB,CAAC;AAEF,eAAO,MAAM,eAAe;;;;;;;;;;CAU3B,CAAC;AAEF,MAAM,MAAM,mBAAmB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,IAAI,KAAK,CAChE,QAAQ,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,KAAK,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,CAAC,CAC9E,CAAC;AAGF,eAAO,MAAM,qBAAqB,EAAE,cAwDnC,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,iBAAiB,YACnB,mBAAmB,GAAG,OAAO,kGAWnC,YAAY,gCAmDhB,CAAC;AAEF,eAAO,MAAM,6BAA6B,UAKzC,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,qBAAqB,oDAErB,OAAO,GAAG,SAAS,YACsC,CAAC;AAEvE,eAAO,MAAM,0BAA0B;;;;;aA6CtC,CAAC;AA4BF,eAAO,MAAM,oBAAoB;;;;;;aAsChC,CAAC;AAEF,eAAO,MAAM,sBAAsB;;;;aAgClC,CAAC;AAEF,eAAO,MAAM,mBAAmB,wJAIiD,CAAC;AAElF,eAAO,MAAM,qBAAqB,wJAIyB,CAAC;AAE5D,eAAO,MAAM,SAAS,yMASrB,CAAC;AAEF,eAAO,MAAM,sBAAsB,yMASlC,CAAC;AAEF,MAAM,WAAW,qBAAqB;IACpC,CAAC,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,EAC/E,IAAI,EAAE,YAAY,CAAC,kBAAkB,CAAC,GACrC,MAAM,CAAC;CACX;AAED;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,EAAE,qBAAsD,CAAC;AAEvF,eAAO,MAAM,oBAAoB,mIAI5B,SAAS,iEAEW,qBAAqB,WAiD7C,CAAC;AAEF,eAAO,MAAM,YAAY,UAAW,MAAM,YAOzC,CAAC;AAEF,eAAO,MAAM,gBAAgB,gLAM4C,CAAC;AAE1E,eAAO,MAAM,eAAe,4KAIU,CAAC"}

package/dist/components/Message/utils.js

@@ -146,18 +146,29 @@ export var ACTIONS_NOT_WORKING_IN_THREAD = [
     MESSAGE_ACTIONS.reply,
     MESSAGE_ACTIONS.markUnread,
 ];
-export var showMessageActionsBox = function (actions, inThread) {
-    if (actions.length === 0) {
+/**
+ * @deprecated use `shouldRenderMessageActions` instead
+ */
+export var showMessageActionsBox = function (actions, inThread) { return shouldRenderMessageActions({ inThread: inThread, messageActions: actions }); };
+export var shouldRenderMessageActions = function (_a) {
+    var customMessageActions = _a.customMessageActions, CustomMessageActionsList = _a.CustomMessageActionsList, inThread = _a.inThread, messageActions = _a.messageActions;
+    if (typeof CustomMessageActionsList !== 'undefined' ||
+        typeof customMessageActions !== 'undefined')
+        return true;
+    if (!messageActions.length)
         return false;
-    }
     if (inThread &&
-        actions.filter(function (action) { return !ACTIONS_NOT_WORKING_IN_THREAD.includes(action); }).length === 0) {
+        messageActions.filter(function (action) { return !ACTIONS_NOT_WORKING_IN_THREAD.includes(action); }).length === 0) {
         return false;
     }
-    if (actions.length === 1 && (actions.includes('react') || actions.includes('reply'))) {
+    if (messageActions.length === 1 &&
+        (messageActions.includes(MESSAGE_ACTIONS.react) ||
+            messageActions.includes(MESSAGE_ACTIONS.reply))) {
         return false;
     }
-    if (actions.length === 2 && actions.includes('react') && actions.includes('reply')) {
+    if (messageActions.length === 2 &&
+        messageActions.includes(MESSAGE_ACTIONS.react) &&
+        messageActions.includes(MESSAGE_ACTIONS.reply)) {
         return false;
     }
     return true;

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

@@ -1 +1 @@
-{"version":3,"file":"MessageActions.d.ts","sourceRoot":"","sources":["../../../src/components/MessageActions/MessageActions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAON,MAAM,OAAO,CAAC;AAQf,OAAO,EAAE,mBAAmB,EAAqB,MAAM,8BAA8B,CAAC;AAEtF,OAAO,KAAK,EAAE,yBAAyB,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAI9E,KAAK,yBAAyB,GAC1B,mBAAmB,GACnB,cAAc,GACd,YAAY,GACZ,kBAAkB,GAClB,YAAY,GACZ,WAAW,GACX,SAAS,CAAC;AAEd,MAAM,MAAM,mBAAmB,CAC7B,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E,OAAO,CAAC,IAAI,CAAC,mBAAmB,CAAC,kBAAkB,CAAC,EAAE,yBAAyB,CAAC,CAAC,GAAG;IAEtF,WAAW,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;IAE7C,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAEpD,IAAI,CAAC,EAAE,MAAM,OAAO,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,cAAc,gKA4H1B,CAAC;AAEF,MAAM,MAAM,0BAA0B,GAAG;IACvC,iBAAiB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACjE,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC"}
+{"version":3,"file":"MessageActions.d.ts","sourceRoot":"","sources":["../../../src/components/MessageActions/MessageActions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAON,MAAM,OAAO,CAAC;AASf,OAAO,EAAE,mBAAmB,EAAqB,MAAM,8BAA8B,CAAC;AAEtF,OAAO,KAAK,EAAE,yBAAyB,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAI9E,KAAK,yBAAyB,GAC1B,mBAAmB,GACnB,cAAc,GACd,YAAY,GACZ,kBAAkB,GAClB,YAAY,GACZ,WAAW,GACX,SAAS,CAAC;AAEd,MAAM,MAAM,mBAAmB,CAC7B,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E,OAAO,CAAC,IAAI,CAAC,mBAAmB,CAAC,kBAAkB,CAAC,EAAE,yBAAyB,CAAC,CAAC,GAAG;IAEtF,WAAW,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;IAE7C,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB,iBAAiB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAEpD,IAAI,CAAC,EAAE,MAAM,OAAO,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,cAAc,gKAwI1B,CAAC;AAEF,MAAM,MAAM,0BAA0B,GAAG;IACvC,iBAAiB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACjE,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC"}

package/dist/components/MessageActions/MessageActions.js

@@ -1,16 +1,18 @@
 import { __assign } from "tslib";
 import React, { useCallback, useEffect, useRef, useState, } from 'react';
+import clsx from 'clsx';
 import { MessageActionsBox } from './MessageActionsBox';
 import { ActionsIcon as DefaultActionsIcon } from '../Message/icons';
-import { isUserMuted } from '../Message/utils';
+import { isUserMuted, shouldRenderMessageActions } from '../Message/utils';
 import { useChatContext } from '../../context/ChatContext';
 import { useMessageContext } from '../../context/MessageContext';
 import { useMessageActionsBoxPopper } from './hooks';
-import { useTranslationContext } from '../../context';
+import { useComponentContext, useTranslationContext } from '../../context';
 export var MessageActions = function (props) {
     var _a = props.ActionsIcon, ActionsIcon = _a === void 0 ? DefaultActionsIcon : _a, _b = props.customWrapperClass, customWrapperClass = _b === void 0 ? '' : _b, propGetMessageActions = props.getMessageActions, propHandleDelete = props.handleDelete, propHandleFlag = props.handleFlag, propHandleMarkUnread = props.handleMarkUnread, propHandleMute = props.handleMute, propHandlePin = props.handlePin, inline = props.inline, propMessage = props.message, messageWrapperRef = props.messageWrapperRef, mine = props.mine;
     var mutes = useChatContext('MessageActions').mutes;
-    var _c = useMessageContext('MessageActions'), customMessageActions = _c.customMessageActions, contextGetMessageActions = _c.getMessageActions, contextHandleDelete = _c.handleDelete, contextHandleFlag = _c.handleFlag, contextHandleMarkUnread = _c.handleMarkUnread, contextHandleMute = _c.handleMute, contextHandlePin = _c.handlePin, isMyMessage = _c.isMyMessage, contextMessage = _c.message, setEditingState = _c.setEditingState;
+    var _c = useMessageContext('MessageActions'), customMessageActions = _c.customMessageActions, contextGetMessageActions = _c.getMessageActions, contextHandleDelete = _c.handleDelete, contextHandleFlag = _c.handleFlag, contextHandleMarkUnread = _c.handleMarkUnread, contextHandleMute = _c.handleMute, contextHandlePin = _c.handlePin, isMyMessage = _c.isMyMessage, contextMessage = _c.message, setEditingState = _c.setEditingState, threadList = _c.threadList;
+    var CustomMessageActionsList = useComponentContext('MessageActions').CustomMessageActionsList;
     var t = useTranslationContext('MessageActions').t;
     var getMessageActions = propGetMessageActions || contextGetMessageActions;
     var handleDelete = propHandleDelete || contextHandleDelete;
@@ -22,13 +24,19 @@ export var MessageActions = function (props) {
     var isMine = mine ? mine() : isMyMessage();
     var _d = useState(false), actionsBoxOpen = _d[0], setActionsBoxOpen = _d[1];
     var isMuted = useCallback(function () { return isUserMuted(message, mutes); }, [message, mutes]);
+    var messageActions = getMessageActions();
+    var renderMessageActions = shouldRenderMessageActions({
+        customMessageActions: customMessageActions,
+        CustomMessageActionsList: CustomMessageActionsList,
+        inThread: threadList,
+        messageActions: messageActions,
+    });
     var hideOptions = useCallback(function (event) {
         if (event instanceof KeyboardEvent && event.key !== 'Escape') {
             return;
         }
         setActionsBoxOpen(false);
     }, []);
-    var messageActions = getMessageActions();
     var messageDeletedAt = !!(message === null || message === void 0 ? void 0 : message.deleted_at);
     useEffect(function () {
         if (messageWrapperRef === null || messageWrapperRef === void 0 ? void 0 : messageWrapperRef.current) {
@@ -56,7 +64,7 @@ export var MessageActions = function (props) {
         placement: isMine ? 'top-end' : 'top-start',
         referenceElement: actionsBoxButtonRef.current,
     }), attributes = _e.attributes, popperElementRef = _e.popperElementRef, styles = _e.styles;
-    if (!messageActions.length && !customMessageActions)
+    if (!renderMessageActions)
         return null;
     return (React.createElement(MessageActionsWrapper, { customWrapperClass: customWrapperClass, inline: inline, setActionsBoxOpen: setActionsBoxOpen },
         React.createElement(MessageActionsBox, __assign({}, attributes.popper, { getMessageActions: getMessageActions, handleDelete: handleDelete, handleEdit: setEditingState, handleFlag: handleFlag, handleMarkUnread: handleMarkUnread, handleMute: handleMute, handlePin: handlePin, isUserMuted: isMuted, mine: isMine, open: actionsBoxOpen, ref: popperElementRef, style: styles.popper })),
@@ -65,7 +73,7 @@ export var MessageActions = function (props) {
 };
 var MessageActionsWrapper = function (props) {
     var children = props.children, customWrapperClass = props.customWrapperClass, inline = props.inline, setActionsBoxOpen = props.setActionsBoxOpen;
-    var defaultWrapperClass = "\n  str-chat__message-simple__actions__action\n  str-chat__message-simple__actions__action--options\n  str-chat__message-actions-container";
+    var defaultWrapperClass = clsx('str-chat__message-simple__actions__action', 'str-chat__message-simple__actions__action--options', 'str-chat__message-actions-container');
     var wrapperClass = customWrapperClass || defaultWrapperClass;
     var onClickOptionsAction = function (event) {
         event.stopPropagation();

package/dist/index.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Window = require('./Window-60c672e3.js');
+var Window = require('./Window-2ad58fe5.js');
 var React = require('react');
 var streamChat = require('stream-chat');
 var throttle = require('lodash.throttle');
@@ -1362,7 +1362,49 @@ 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.23.8';
+var MenuIcon = function (_a) {
+    var title = _a.title;
+    var t = Window.useTranslationContext('MenuIcon').t;
+    return (React__default["default"].createElement("svg", { "data-testid": 'menu-icon', viewBox: '0 0 448 512', xmlns: 'http://www.w3.org/2000/svg' },
+        React__default["default"].createElement("title", null, title !== null && title !== void 0 ? title : t('Menu')),
+        React__default["default"].createElement("path", { d: 'M0 88C0 74.75 10.75 64 24 64H424C437.3 64 448 74.75 448 88C448 101.3 437.3 112 424 112H24C10.75 112 0 101.3 0 88zM0 248C0 234.7 10.75 224 24 224H424C437.3 224 448 234.7 448 248C448 261.3 437.3 272 424 272H24C10.75 272 0 261.3 0 248zM424 432H24C10.75 432 0 421.3 0 408C0 394.7 10.75 384 24 384H424C437.3 384 448 394.7 448 408C448 421.3 437.3 432 424 432z', fill: 'currentColor' })));
+};
+
+/**
+ * The ChannelHeader component renders some basic information about a Channel.
+ */
+var ChannelHeader = function (props) {
+    var _a = props.Avatar, Avatar = _a === void 0 ? Window.Avatar : _a, _b = props.MenuIcon, MenuIcon$1 = _b === void 0 ? MenuIcon : _b, overrideImage = props.image, live = props.live, overrideTitle = props.title;
+    var _c = Window.useChannelStateContext('ChannelHeader'), channel = _c.channel, watcher_count = _c.watcher_count;
+    var openMobileNav = Window.useChatContext('ChannelHeader').openMobileNav;
+    var t = Window.useTranslationContext('ChannelHeader').t;
+    var _d = Window.useChannelPreviewInfo({
+        channel: channel,
+        overrideImage: overrideImage,
+        overrideTitle: overrideTitle,
+    }), displayImage = _d.displayImage, displayTitle = _d.displayTitle;
+    var _e = (channel === null || channel === void 0 ? void 0 : channel.data) || {}, member_count = _e.member_count, subtitle = _e.subtitle;
+    return (React__default["default"].createElement("div", { className: 'str-chat__header-livestream str-chat__channel-header' },
+        React__default["default"].createElement("button", { "aria-label": t('aria/Menu'), className: 'str-chat__header-hamburger', onClick: openMobileNav },
+            React__default["default"].createElement(MenuIcon$1, null)),
+        React__default["default"].createElement(Avatar, { image: displayImage, name: displayTitle, shape: 'rounded', size: (channel === null || channel === void 0 ? void 0 : channel.type) === 'commerce' ? 60 : 40 }),
+        React__default["default"].createElement("div", { className: 'str-chat__header-livestream-left str-chat__channel-header-end' },
+            React__default["default"].createElement("p", { className: 'str-chat__header-livestream-left--title str-chat__channel-header-title' },
+                displayTitle,
+                ' ',
+                live && (React__default["default"].createElement("span", { className: 'str-chat__header-livestream-left--livelabel' }, t('live')))),
+            subtitle && React__default["default"].createElement("p", { className: 'str-chat__header-livestream-left--subtitle' }, subtitle),
+            React__default["default"].createElement("p", { className: 'str-chat__header-livestream-left--members str-chat__channel-header-info' },
+                !live && !!member_count && member_count > 0 && (React__default["default"].createElement(React__default["default"].Fragment, null,
+                    t('{{ memberCount }} members', {
+                        memberCount: member_count,
+                    }),
+                    ",",
+                    ' ')),
+                t('{{ watcherCount }} online', { watcherCount: watcher_count })))));
+};
+
+var version = '11.23.10';
 
 var useChat = function (_a) {
     var _b, _c;
@@ -1716,7 +1758,6 @@ exports.CardContainer = Window.CardContainer;
 exports.Channel = Window.Channel;
 exports.ChannelActionContext = Window.ChannelActionContext;
 exports.ChannelActionProvider = Window.ChannelActionProvider;
-exports.ChannelHeader = Window.ChannelHeader;
 exports.ChannelList = Window.ChannelList;
 exports.ChannelListContext = Window.ChannelListContext;
 exports.ChannelListContextProvider = Window.ChannelListContextProvider;
@@ -1966,6 +2007,7 @@ exports.renderPreviewText = Window.renderPreviewText;
 exports.renderText = Window.renderText;
 exports.resampleWaveformData = Window.resampleWaveformData;
 exports.ruTranslations = Window.ruTranslations;
+exports.shouldRenderMessageActions = Window.shouldRenderMessageActions;
 exports.showMessageActionsBox = Window.showMessageActionsBox;
 exports.trTranslations = Window.trTranslations;
 exports.upSample = Window.upSample;
@@ -2021,6 +2063,7 @@ exports.withComponentContext = Window.withComponentContext;
 exports.withMessageContext = Window.withMessageContext;
 exports.withTranslationContext = Window.withTranslationContext;
 exports.withTypingContext = Window.withTypingContext;
+exports.ChannelHeader = ChannelHeader;
 exports.Chat = Chat;
 exports.GiphyPreviewMessage = GiphyPreviewMessage;
 exports.InfiniteScroll = InfiniteScroll;

package/dist/version.d.ts

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

package/dist/version.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"version.d.ts","sourceRoot":"","sources":["../src/version.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO,YAAY,CAAC"}
+{"version":3,"file":"version.d.ts","sourceRoot":"","sources":["../src/version.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO,aAAa,CAAC"}

package/dist/version.js

@@ -1 +1 @@
-export var version = '11.23.8';
+export var version = '11.23.10';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "stream-chat-react",
-  "version": "11.23.8",
+  "version": "11.23.10",
   "description": "React components to create chat conversations or livestream style chat",
   "author": "GetStream",
   "homepage": "https://getstream.io/chat/",