stream-chat-react 11.10.0 → 11.12.0

package/dist/i18n/ko.json

@@ -12,6 +12,7 @@
     "Drag your files here to add to your post": "게시물에 추가하려면 파일을 여기로 끌어다 놓으세요",
     "Edit Message": "메시지 수정",
     "Edit message request failed": "메시지 수정 요청 실패",
+    "Edited": "편집됨",
     "Emoji matching": "이모티콘 매칭",
     "Empty message...": "빈 메시지...",
     "Error adding flag": "플래그를 추가하는 동안 오류가 발생했습니다.",
@@ -22,6 +23,7 @@
     "Error muting a user ...": "사용자를 음소거하는 중에 오류가 발생했습니다...",
     "Error pinning message": "메시지를 핀하는 중에 오류가 발생했습니다.",
     "Error removing message pin": "메시지 핀을 제거하는 중에 오류가 발생했습니다.",
+    "Error reproducing the recording": "녹음 재생 중 오류 발생",
     "Error unmuting a user ...": "사용자 음소거 해제 중 오류 발생...",
     "Error uploading file": "파일 업로드 오류",
     "Error uploading image": "이미지를 업로드하는 동안 오류가 발생했습니다.",
@@ -70,6 +72,7 @@
     "Unread messages": "읽지 않은 메시지",
     "Upload type: \"{{ type }}\" is not allowed": "업로드 유형: \"{{ type }}\"은(는) 허용되지 않습니다.",
     "User uploaded content": "사용자 업로드 콘텐츠",
+    "Voice message": "음성 메시지",
     "Wait until all attachments have uploaded": "모든 첨부 파일이 업로드될 때까지 기다립니다.",
     "You have no channels currently": "현재 채널이 없습니다.",
     "You've reached the maximum number of files": "최대 파일 수에 도달했습니다.",

package/dist/i18n/nl.json

@@ -12,6 +12,7 @@
     "Drag your files here to add to your post": "Sleep je bestanden hier naartoe om aan je bericht toe te voegen",
     "Edit Message": "Pas bericht aan",
     "Edit message request failed": "Verzoek om bericht bewerken mislukt",
+    "Edited": "Bewerkt",
     "Emoji matching": "Emoji-overeenkomsten",
     "Empty message...": "Leeg bericht...",
     "Error adding flag": "Fout bij toevoegen van vlag",
@@ -22,6 +23,7 @@
     "Error muting a user ...": "Fout bij het muten van de gebruiker",
     "Error pinning message": "Fout bij vastzetten van bericht",
     "Error removing message pin": "Fout bij verwijderen van berichtpin",
+    "Error reproducing the recording": "Fout bij het afspelen van de opname",
     "Error unmuting a user ...": "Fout bij het unmuten van de gebruiker",
     "Error uploading file": "Fout bij uploaden bestand",
     "Error uploading image": "Fout bij uploaden afbeelding",
@@ -70,6 +72,7 @@
     "Unread messages": "Ongelezen berichten",
     "Upload type: \"{{ type }}\" is not allowed": "Uploadtype: \"{{ type }}\" is niet toegestaan",
     "User uploaded content": "Gebruikersgeüploade inhoud",
+    "Voice message": "Voicemail",
     "Wait until all attachments have uploaded": "Wacht tot alle bijlagen zijn geüpload",
     "You have no channels currently": "Er zijn geen chats beschikbaar",
     "You've reached the maximum number of files": "Je hebt het maximale aantal bestanden bereikt",

package/dist/i18n/pt.json

@@ -12,6 +12,7 @@
     "Drag your files here to add to your post": "Arraste seus arquivos aqui para adicionar ao seu post",
     "Edit Message": "Editar Mensagem",
     "Edit message request failed": "O pedido de edição da mensagem falhou",
+    "Edited": "Editada",
     "Emoji matching": "Emoji correspondente",
     "Empty message...": "Mensagem vazia...",
     "Error adding flag": "Erro ao reportar",
@@ -22,6 +23,7 @@
     "Error muting a user ...": "Erro ao silenciar um usuário...",
     "Error pinning message": "Erro ao fixar mensagem",
     "Error removing message pin": "Erro ao remover o PIN da mensagem",
+    "Error reproducing the recording": "Erro ao reproduzir a gravação",
     "Error unmuting a user ...": "Erro ao ativar o som de um usuário...",
     "Error uploading file": "Erro ao enviar arquivo",
     "Error uploading image": "Erro ao carregar a imagem",
@@ -70,6 +72,7 @@
     "Unread messages": "Mensagens não lidas",
     "Upload type: \"{{ type }}\" is not allowed": "Tipo de upload: \"{{ type }}\" não é permitido",
     "User uploaded content": "Conteúdo enviado pelo usuário",
+    "Voice message": "Mensagem de voz",
     "Wait until all attachments have uploaded": "Espere até que todos os anexos tenham sido carregados",
     "You have no channels currently": "Você não tem canais atualmente",
     "You've reached the maximum number of files": "Você atingiu o número máximo de arquivos",

package/dist/i18n/ru.json

@@ -12,6 +12,7 @@
     "Drag your files here to add to your post": "Перетащите ваши файлы сюда, чтобы добавить их в ваш пост",
     "Edit Message": "Редактировать сообщение",
     "Edit message request failed": "Не удалось изменить запрос сообщения",
+    "Edited": "Отредактировано",
     "Emoji matching": "Соответствие эмодзи",
     "Empty message...": "Пустое сообщение...",
     "Error adding flag": "Ошибка добавления флага",
@@ -22,6 +23,7 @@
     "Error muting a user ...": "Ошибка отключения уведомлений от пользователя...",
     "Error pinning message": "Сообщение об ошибке при закреплении",
     "Error removing message pin": "Ошибка при удалении булавки сообщения",
+    "Error reproducing the recording": "Ошибка воспроизведения записи",
     "Error unmuting a user ...": "Ошибка включения уведомлений...",
     "Error uploading file": "Ошибка при загрузке файла",
     "Error uploading image": "Ошибка загрузки изображения",
@@ -70,6 +72,7 @@
     "Unread messages": "Непрочитанные сообщения",
     "Upload type: \"{{ type }}\" is not allowed": "Тип загрузки: \"{{ type }}\" не разрешен",
     "User uploaded content": "Пользователь загрузил контент",
+    "Voice message": "Голосовое сообщение",
     "Wait until all attachments have uploaded": "Подождите, пока все вложения загрузятся",
     "You have no channels currently": "У вас нет каналов в данный момент",
     "You've reached the maximum number of files": "Вы достигли максимального количества файлов",

package/dist/i18n/tr.json

@@ -12,6 +12,7 @@
     "Drag your files here to add to your post": "Gönderinize eklemek için dosyalarınızı buraya sürükleyin",
     "Edit Message": "Mesajı Düzenle",
     "Edit message request failed": "Mesaj düzenleme isteği başarısız oldu",
+    "Edited": "Düzenlendi",
     "Emoji matching": "Emoji eşleştirme",
     "Empty message...": "Boş mesaj...",
     "Error adding flag": "Bayrak eklenirken hata oluştu",
@@ -22,6 +23,7 @@
     "Error muting a user ...": "Kullanıcıyı sessize alırken hata oluştu ...",
     "Error pinning message": "Mesaj sabitlenirken hata oluştu",
     "Error removing message pin": "Mesaj PIN'i kaldırılırken hata oluştu",
+    "Error reproducing the recording": "Kaydı yeniden üretme hatası",
     "Error unmuting a user ...": "Kullanıcının sesini açarken hata oluştu ...",
     "Error uploading file": "Dosya yüklenirken hata oluştu",
     "Error uploading image": "Resmi yüklerken hata",
@@ -70,6 +72,7 @@
     "Unread messages": "Okunmamış mesajlar",
     "Upload type: \"{{ type }}\" is not allowed": "Yükleme türü: \"{{ type }}\" izin verilmez",
     "User uploaded content": "Kullanıcı tarafından yüklenen içerik",
+    "Voice message": "Sesli mesaj",
     "Wait until all attachments have uploaded": "Tüm ekler yüklenene kadar bekleyin",
     "You have no channels currently": "Henüz kanalınız yok",
     "You've reached the maximum number of files": "Maksimum dosya sayısına ulaştınız",

package/dist/index.cjs.js

@@ -2,8 +2,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Window = require('./Window-7d524c3b.js');
+var Window = require('./Window-e8323a54.js');
 var React = require('react');
+var streamChat = require('stream-chat');
 var reactVirtuoso = require('react-virtuoso');
 var throttle = require('lodash.throttle');
 require('emoji-regex');
@@ -13,7 +14,6 @@ require('@braintree/sanitize-url');
 require('react-image-gallery');
 require('react-dom');
 require('react-fast-compare');
-require('stream-chat');
 require('lodash.debounce');
 require('dayjs');
 require('dayjs/plugin/calendar');
@@ -521,7 +521,7 @@ var mousewheelListener = function (event) {
     }
 };
 var InfiniteScroll = function (props) {
-    var children = props.children, _a = props.element, element = _a === void 0 ? 'div' : _a, hasMore = props.hasMore, hasMoreNewer = props.hasMoreNewer, hasNextPage = props.hasNextPage, hasPreviousPage = props.hasPreviousPage, head = props.head, _b = props.initialLoad, initialLoad = _b === void 0 ? true : _b, isLoading = props.isLoading, listenToScroll = props.listenToScroll, loader = props.loader, loadMore = props.loadMore, loadMoreNewer = props.loadMoreNewer, loadNextPage = props.loadNextPage, loadPreviousPage = props.loadPreviousPage, _c = props.threshold, threshold = _c === void 0 ? 250 : _c, _d = props.useCapture, useCapture = _d === void 0 ? false : _d, elementProps = Window.__rest(props, ["children", "element", "hasMore", "hasMoreNewer", "hasNextPage", "hasPreviousPage", "head", "initialLoad", "isLoading", "listenToScroll", "loader", "loadMore", "loadMoreNewer", "loadNextPage", "loadPreviousPage", "threshold", "useCapture"]);
+    var children = props.children, _a = props.element, element = _a === void 0 ? 'div' : _a, hasMore = props.hasMore, hasMoreNewer = props.hasMoreNewer, hasNextPage = props.hasNextPage, hasPreviousPage = props.hasPreviousPage, head = props.head, _b = props.initialLoad, initialLoad = _b === void 0 ? true : _b, isLoading = props.isLoading, listenToScroll = props.listenToScroll, loader = props.loader, loadMore = props.loadMore, loadMoreNewer = props.loadMoreNewer, loadNextPage = props.loadNextPage, loadPreviousPage = props.loadPreviousPage, _c = props.threshold, threshold = _c === void 0 ? Window.DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD : _c, _d = props.useCapture, useCapture = _d === void 0 ? false : _d, elementProps = Window.__rest(props, ["children", "element", "hasMore", "hasMoreNewer", "hasNextPage", "hasPreviousPage", "head", "initialLoad", "isLoading", "listenToScroll", "loader", "loadMore", "loadMoreNewer", "loadNextPage", "loadPreviousPage", "threshold", "useCapture"]);
     var loadNextPageFn = loadNextPage || loadMoreNewer;
     var loadPreviousPageFn = loadPreviousPage || loadMore;
     var hasNextPageFlag = hasNextPage || hasMoreNewer;
@@ -630,22 +630,21 @@ 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, internalInfiniteScrollProps = props.internalInfiniteScrollProps, _e = props.messageActions, messageActions = _e === void 0 ? Object.keys(Window.MESSAGE_ACTIONS) : _e, _f = props.messages, messages = _f === void 0 ? [] : _f, notifications = props.notifications, _g = props.noGroupByUser, noGroupByUser = _g === void 0 ? false : _g, _h = props.pinPermissions, pinPermissions = _h === void 0 ? Window.defaultPinPermissions : _h, // @deprecated in favor of `channelCapabilities` - TODO: remove in next major release
-    _j = props.returnAllReadData, // @deprecated in favor of `channelCapabilities` - TODO: remove in next major release
-    returnAllReadData = _j === void 0 ? false : _j, _k = props.threadList, threadList = _k === void 0 ? false : _k, _l = props.unsafeHTML, unsafeHTML = _l === void 0 ? false : _l, headerPosition = props.headerPosition, read = props.read, _m = props.renderMessages, renderMessages = _m === void 0 ? defaultRenderMessages : _m, _o = props.messageLimit, messageLimit = _o === void 0 ? Window.DEFAULT_NEXT_CHANNEL_PAGE_SIZE : _o, loadMoreCallback = props.loadMore, loadMoreNewerCallback = props.loadMoreNewer, _p = props.hasMoreNewer, hasMoreNewer = _p === void 0 ? false : _p, showUnreadNotificationAlways = props.showUnreadNotificationAlways, suppressAutoscroll = props.suppressAutoscroll, highlightedMessageId = props.highlightedMessageId, _q = props.jumpToLatestMessage, jumpToLatestMessage = _q === void 0 ? function () { return Promise.resolve(); } : _q;
-    var _r = React__default["default"].useState(null), listElement = _r[0], setListElement = _r[1];
-    var _s = React__default["default"].useState(null), ulElement = _s[0], setUlElement = _s[1];
+    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
+    _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, _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, showUnreadNotificationAlways = props.showUnreadNotificationAlways, 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];
+    var _v = React__default["default"].useState(null), ulElement = _v[0], setUlElement = _v[1];
     var customClasses = Window.useChatContext('MessageList').customClasses;
-    var _t = Window.useComponentContext('MessageList'), _u = _t.EmptyStateIndicator, EmptyStateIndicator = _u === void 0 ? Window.EmptyStateIndicator : _u, _v = _t.LoadingIndicator, LoadingIndicator = _v === void 0 ? Window.LoadingIndicator : _v, _w = _t.MessageListNotifications, MessageListNotifications$1 = _w === void 0 ? MessageListNotifications : _w, _x = _t.MessageNotification, MessageNotification = _x === void 0 ? Window.MessageNotification : _x, _y = _t.TypingIndicator, TypingIndicator = _y === void 0 ? Window.TypingIndicator : _y, _z = _t.UnreadMessagesNotification, UnreadMessagesNotification$1 = _z === void 0 ? UnreadMessagesNotification : _z;
-    var loadMoreScrollThreshold = (internalInfiniteScrollProps === null || internalInfiniteScrollProps === void 0 ? void 0 : internalInfiniteScrollProps.threshold) || 250;
-    var _0 = useScrollLocationLogic({
+    var _w = Window.useComponentContext('MessageList'), _x = _w.EmptyStateIndicator, EmptyStateIndicator = _x === void 0 ? Window.EmptyStateIndicator : _x, _y = _w.LoadingIndicator, LoadingIndicator = _y === void 0 ? Window.LoadingIndicator : _y, _z = _w.MessageListNotifications, MessageListNotifications$1 = _z === void 0 ? MessageListNotifications : _z, _0 = _w.MessageNotification, MessageNotification = _0 === void 0 ? Window.MessageNotification : _0, _1 = _w.TypingIndicator, TypingIndicator = _1 === void 0 ? Window.TypingIndicator : _1, _2 = _w.UnreadMessagesNotification, UnreadMessagesNotification$1 = _2 === void 0 ? UnreadMessagesNotification : _2;
+    var _3 = useScrollLocationLogic({
         hasMoreNewer: hasMoreNewer,
         listElement: listElement,
         loadMoreScrollThreshold: loadMoreScrollThreshold,
         messages: messages,
         scrolledUpThreshold: props.scrolledUpThreshold,
         suppressAutoscroll: suppressAutoscroll,
-    }), hasNewMessages = _0.hasNewMessages, isMessageListScrolledToBottom = _0.isMessageListScrolledToBottom, onScroll = _0.onScroll, scrollToBottom = _0.scrollToBottom, wrapperRect = _0.wrapperRect;
+    }), hasNewMessages = _3.hasNewMessages, isMessageListScrolledToBottom = _3.isMessageListScrolledToBottom, onScroll = _3.onScroll, scrollToBottom = _3.scrollToBottom, wrapperRect = _3.wrapperRect;
     var showUnreadMessagesNotification = useUnreadMessagesNotification({
         isMessageListScrolledToBottom: isMessageListScrolledToBottom,
         showAlways: !!showUnreadNotificationAlways,
@@ -657,7 +656,7 @@ var MessageListWithContext = function (props) {
         unreadCount: (_a = channelUnreadUiState === null || channelUnreadUiState === void 0 ? void 0 : channelUnreadUiState.unread_messages) !== null && _a !== void 0 ? _a : 0,
         wasMarkedUnread: !!(channelUnreadUiState === null || channelUnreadUiState === void 0 ? void 0 : channelUnreadUiState.first_unread_message_id),
     });
-    var _1 = useEnrichedMessages({
+    var _4 = useEnrichedMessages({
         channel: channel,
         disableDateSeparator: disableDateSeparator,
         groupStyles: groupStyles,
@@ -666,7 +665,7 @@ var MessageListWithContext = function (props) {
         hideNewMessageSeparator: hideNewMessageSeparator,
         messages: messages,
         noGroupByUser: noGroupByUser,
-    }), messageGroupStyles = _1.messageGroupStyles, enrichedMessages = _1.messages;
+    }), messageGroupStyles = _4.messageGroupStyles, enrichedMessages = _4.messages;
     var elements = useMessageListElements({
         channelUnreadUiState: channelUnreadUiState,
         enrichedMessages: enrichedMessages,
@@ -745,7 +744,7 @@ var MessageListWithContext = function (props) {
     return (React__default["default"].createElement(Window.MessageListContextProvider, { value: { listElement: listElement, scrollToBottom: scrollToBottom } },
         React__default["default"].createElement(MessageListMainPanel, null,
             !threadList && showUnreadMessagesNotification && (React__default["default"].createElement(UnreadMessagesNotification$1, { unreadCount: channelUnreadUiState === null || channelUnreadUiState === void 0 ? void 0 : channelUnreadUiState.unread_messages })),
-            React__default["default"].createElement("div", { className: "".concat(messageListClass, " ").concat(threadListClass), onScroll: onScroll, ref: setListElement, tabIndex: 0 }, showEmptyStateIndicator ? (React__default["default"].createElement(EmptyStateIndicator, { key: 'empty-state-indicator', listType: threadList ? 'thread' : 'message' })) : (React__default["default"].createElement(InfiniteScroll, Window.__assign({ className: 'str-chat__reverse-infinite-scroll  str-chat__message-list-scroll', "data-testid": 'reverse-infinite-scroll', hasNextPage: props.hasMoreNewer, hasPreviousPage: props.hasMore, head: props.head, isLoading: props.loadingMore, loader: React__default["default"].createElement("div", { className: 'str-chat__list__loading', key: 'loading-indicator' }, props.loadingMore && React__default["default"].createElement(LoadingIndicator, { size: 20 })), loadNextPage: loadMoreNewer, loadPreviousPage: loadMore }, props.internalInfiniteScrollProps, { threshold: loadMoreScrollThreshold }),
+            React__default["default"].createElement("div", { className: "".concat(messageListClass, " ").concat(threadListClass), onScroll: onScroll, ref: setListElement, tabIndex: 0 }, showEmptyStateIndicator ? (React__default["default"].createElement(EmptyStateIndicator, { key: 'empty-state-indicator', listType: threadList ? 'thread' : 'message' })) : (React__default["default"].createElement(InfiniteScroll, Window.__assign({ className: 'str-chat__reverse-infinite-scroll  str-chat__message-list-scroll', "data-testid": 'reverse-infinite-scroll', hasNextPage: props.hasMoreNewer, hasPreviousPage: props.hasMore, head: props.head, isLoading: props.loadingMore, loader: React__default["default"].createElement("div", { className: 'str-chat__list__loading', key: 'loading-indicator' }, props.loadingMore && React__default["default"].createElement(LoadingIndicator, { size: 20 })), loadNextPage: loadMoreNewer, loadPreviousPage: loadMore, threshold: loadMoreScrollThreshold }, restInternalInfiniteScrollProps),
                 React__default["default"].createElement("ul", { className: 'str-chat__ul', ref: setUlElement }, elements),
                 React__default["default"].createElement(TypingIndicator, { threadList: threadList }),
                 React__default["default"].createElement("div", { key: 'bottom' }))))),
@@ -1048,8 +1047,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, _h, _j;
-    var additionalMessageInputProps = virtuosoContext.additionalMessageInputProps, closeReactionSelectorOnClick = virtuosoContext.closeReactionSelectorOnClick, customMessageActions = virtuosoContext.customMessageActions, customMessageRenderer = virtuosoContext.customMessageRenderer, DateSeparator = virtuosoContext.DateSeparator, firstUnreadMessageId = virtuosoContext.firstUnreadMessageId, lastReadMessageId = virtuosoContext.lastReadMessageId, lastReceivedMessageId = virtuosoContext.lastReceivedMessageId, MessageUIComponent = virtuosoContext.Message, messageActions = virtuosoContext.messageActions, MessageSystem = virtuosoContext.MessageSystem, numItemsPrepended = virtuosoContext.numItemsPrepended, ownMessagesReadByOthers = virtuosoContext.ownMessagesReadByOthers, messageList = virtuosoContext.processedMessages, shouldGroupByUser = virtuosoContext.shouldGroupByUser, sortReactionDetails = virtuosoContext.sortReactionDetails, sortReactions = virtuosoContext.sortReactions, _k = virtuosoContext.unreadMessageCount, unreadMessageCount = _k === void 0 ? 0 : _k, UnreadMessagesSeparator = virtuosoContext.UnreadMessagesSeparator, virtuosoRef = virtuosoContext.virtuosoRef;
+    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, lastReadMessageId = virtuosoContext.lastReadMessageId, lastReceivedMessageId = virtuosoContext.lastReceivedMessageId, MessageUIComponent = virtuosoContext.Message, messageActions = virtuosoContext.messageActions, MessageSystem = virtuosoContext.MessageSystem, numItemsPrepended = virtuosoContext.numItemsPrepended, ownMessagesReadByOthers = virtuosoContext.ownMessagesReadByOthers, messageList = virtuosoContext.processedMessages, 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 streamMessageIndex = calculateItemIndex(virtuosoIndex, numItemsPrepended);
     if (customMessageRenderer) {
         return customMessageRenderer(messageList, streamMessageIndex);
@@ -1066,13 +1065,18 @@ var messageRenderer = function (virtuosoIndex, _data, virtuosoContext) {
     var groupedByUser = shouldGroupByUser &&
         streamMessageIndex > 0 &&
         ((_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 firstOfGroup = shouldGroupByUser && ((_c = message.user) === null || _c === void 0 ? void 0 : _c.id) !== ((_e = (_d = messageList[streamMessageIndex - 1]) === null || _d === void 0 ? void 0 : _d.user) === null || _e === void 0 ? void 0 : _e.id);
-    var endOfGroup = shouldGroupByUser && ((_f = message.user) === null || _f === void 0 ? void 0 : _f.id) !== ((_h = (_g = messageList[streamMessageIndex + 1]) === null || _g === void 0 ? void 0 : _g.user) === null || _h === void 0 ? void 0 : _h.id);
+    var maybePrevMessage = messageList[streamMessageIndex - 1];
+    var maybeNextMessage = messageList[streamMessageIndex + 1];
+    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)));
+    var endOfGroup = shouldGroupByUser &&
+        (((_e = message.user) === null || _e === void 0 ? void 0 : _e.id) !== ((_f = maybeNextMessage === null || maybeNextMessage === void 0 ? void 0 : maybeNextMessage.user) === null || _f === void 0 ? void 0 : _f.id) || Window.isMessageEdited(message));
     var isNewestMessage = lastReadMessageId === lastReceivedMessageId;
     var isLastReadMessage = message.id === lastReadMessageId;
     var showUnreadSeparator = isLastReadMessage && !isNewestMessage && (firstUnreadMessageId || unreadMessageCount > 0); // unread count can be 0 if the user marks unread only own messages
     return (React__default["default"].createElement(React__default["default"].Fragment, null,
-        React__default["default"].createElement(Window.Message, { additionalMessageInputProps: additionalMessageInputProps, autoscrollToBottom: (_j = virtuosoRef.current) === null || _j === void 0 ? void 0 : _j.autoscrollToBottom, closeReactionSelectorOnClick: closeReactionSelectorOnClick, customMessageActions: customMessageActions, endOfGroup: endOfGroup, firstOfGroup: firstOfGroup, groupedByUser: groupedByUser, lastReceivedId: lastReceivedMessageId, message: message, Message: MessageUIComponent, messageActions: messageActions, 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, groupedByUser: groupedByUser, lastReceivedId: lastReceivedMessageId, message: message, Message: MessageUIComponent, messageActions: messageActions, readBy: ownMessagesReadByOthers[message.id] || [], sortReactionDetails: sortReactionDetails, sortReactions: sortReactions }),
         showUnreadSeparator && (React__default["default"].createElement("div", { className: 'str-chat__unread-messages-separator-wrapper' },
             React__default["default"].createElement(UnreadMessagesSeparator, { unreadCount: unreadMessageCount })))));
 };
@@ -1306,7 +1310,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.10.0';
+var version = '11.12.0';
 
 var useChat = function (_a) {
     var _b, _c;
@@ -1525,6 +1529,36 @@ var Chat = function (props) {
         React__default["default"].createElement(Window.TranslationProvider, { value: translators }, children)));
 };
 
+/**
+ * React hook to create, connect and return `StreamChat` client.
+ */
+var useCreateChatClient = function (_a) {
+    var apiKey = _a.apiKey, tokenOrProvider = _a.tokenOrProvider, userData = _a.userData;
+    var _b = React.useState(null), chatClient = _b[0], setChatClient = _b[1];
+    var _c = React.useState(userData), cachedUserData = _c[0], setCachedUserData = _c[1];
+    if (userData.id !== cachedUserData.id) {
+        setCachedUserData(userData);
+    }
+    React.useEffect(function () {
+        var client = new streamChat.StreamChat(apiKey);
+        var didUserConnectInterrupt = false;
+        var connectionPromise = client.connectUser(cachedUserData, tokenOrProvider).then(function () {
+            if (!didUserConnectInterrupt)
+                setChatClient(client);
+        });
+        return function () {
+            didUserConnectInterrupt = true;
+            setChatClient(null);
+            connectionPromise
+                .then(function () { return client.disconnectUser(); })
+                .then(function () {
+                console.log("Connection for user \"".concat(cachedUserData.id, "\" has been closed"));
+            });
+        };
+    }, [apiKey, cachedUserData, tokenOrProvider]);
+    return chatClient;
+};
+
 var CloseIcon = function (_a) {
     var title = _a.title;
     var t = Window.useTranslationContext('CloseIcon').t;
@@ -1654,6 +1688,7 @@ exports.DefaultSuggestionListHeader = Window.DefaultSuggestionListHeader;
 exports.DefaultSuggestionListItem = Window.Item;
 exports.DefaultTriggerProvider = Window.DefaultTriggerProvider;
 exports.DeliveredCheckIcon = Window.DeliveredCheckIcon;
+exports.DownloadButton = Window.DownloadButton;
 exports.DownloadIcon = Window.DownloadIcon;
 exports.EditMessageForm = Window.EditMessageForm;
 exports.EmojiIconLarge = Window.EmojiIconLarge;
@@ -1665,6 +1700,7 @@ exports.ErrorIcon = Window.ErrorIcon;
 exports.EventComponent = Window.EventComponent;
 exports.FileAttachment = Window.FileAttachment;
 exports.FileContainer = Window.FileContainer;
+exports.FileSizeIndicator = Window.FileSizeIndicator;
 exports.FileUploadIcon = Window.FileUploadIcon;
 exports.FileUploadIconFlat = Window.FileUploadIconFlat;
 exports.FixedHeightMessage = Window.FixedHeightMessage;
@@ -1721,6 +1757,7 @@ exports.NullComponent = Window.NullComponent;
 exports.PinIcon = Window.PinIcon;
 exports.PinIndicator = Window.PinIndicator;
 exports.PlayButton = Window.PlayButton;
+exports.PlaybackRateButton = Window.PlaybackRateButton;
 exports.PopperTooltip = Window.PopperTooltip;
 exports.ProgressBar = Window.ProgressBar;
 exports.QuotedMessage = Window.QuotedMessage;
@@ -1764,6 +1801,8 @@ exports.UploadButton = Window.UploadButton;
 exports.UploadIcon = Window.UploadIcon;
 exports.UploadsPreview = Window.UploadsPreview;
 exports.UserItem = Window.UserItem;
+exports.VoiceRecordingContainer = Window.VoiceRecordingContainer;
+exports.WaveProgressBar = Window.WaveProgressBar;
 exports.Window = Window.Window;
 exports.areMessagePropsEqual = Window.areMessagePropsEqual;
 exports.areMessageUIPropsEqual = Window.areMessageUIPropsEqual;
@@ -1775,6 +1814,9 @@ exports.defaultReactionOptions = Window.defaultReactionOptions;
 exports.defaultScrollToItem = Window.defaultScrollToItem;
 exports.defaultTimestampFormat = Window.defaultTimestampFormat;
 exports.defaultTranslatorFunction = Window.defaultTranslatorFunction;
+exports.displayDuration = Window.displayDuration;
+exports.divMod = Window.divMod;
+exports.downSample = Window.downSample;
 exports.emojiMarkdownPlugin = Window.emojiMarkdownPlugin;
 exports.enTranslations = Window.enTranslations;
 exports.esTranslations = Window.esTranslations;
@@ -1808,12 +1850,14 @@ exports.isGalleryAttachmentType = Window.isGalleryAttachmentType;
 exports.isLanguageSupported = Window.isLanguageSupported;
 exports.isMediaAttachment = Window.isMediaAttachment;
 exports.isMessageBounced = Window.isMessageBounced;
+exports.isMessageEdited = Window.isMessageEdited;
 exports.isNumberOrString = Window.isNumberOrString;
 exports.isOnlyEmojis = Window.isOnlyEmojis;
 exports.isScrapedContent = Window.isScrapedContent;
 exports.isSvgAttachment = Window.isSvgAttachment;
 exports.isUploadedImage = Window.isUploadedImage;
 exports.isUserMuted = Window.isUserMuted;
+exports.isVoiceRecordingAttachment = Window.isVoiceRecordingAttachment;
 exports.itTranslations = Window.itTranslations;
 exports.jaTranslations = Window.jaTranslations;
 exports.keepLineBreaksPlugin = Window.keepLineBreaksPlugin;
@@ -1846,6 +1890,7 @@ exports.renderText = Window.renderText;
 exports.ruTranslations = Window.ruTranslations;
 exports.showMessageActionsBox = Window.showMessageActionsBox;
 exports.trTranslations = Window.trTranslations;
+exports.upSample = Window.upSample;
 exports.useActionHandler = Window.useActionHandler;
 exports.useChannelActionContext = Window.useChannelActionContext;
 exports.useChannelDeletedListener = Window.useChannelDeletedListener;
@@ -1912,6 +1957,7 @@ exports.VirtualizedMessageList = VirtualizedMessageList;
 exports.darkModeTheme = darkModeTheme;
 exports.defaultRenderMessages = defaultRenderMessages;
 exports.useChat = useChat;
+exports.useCreateChatClient = useCreateChatClient;
 exports.useCustomStyles = useCustomStyles;
 exports.useEnrichedMessages = useEnrichedMessages;
 exports.useLastReadData = useLastReadData;

package/dist/scss/Message.scss

@@ -83,7 +83,7 @@
   /* group styling */
   &--top,
   &--single {
-    padding-top: calc(var(--md-p)/2);
+    padding-top: calc(var(--md-p) / 2);
 
     .str-chat__message {
       &-attachment--img,
@@ -176,7 +176,7 @@
   }
 
   &--bottom {
-    padding-bottom: calc(var(--md-p)/2);
+    padding-bottom: calc(var(--md-p) / 2);
 
     .str-chat__message {
       &-attachment--img,
@@ -217,7 +217,7 @@
   }
 
   &--single {
-    padding-bottom: calc(var(--md-m)/2);
+    padding-bottom: calc(var(--md-m) / 2);
   }
 
   &--top,
@@ -233,14 +233,16 @@
     .str-chat__message {
       &-text {
         &-inner {
-          border-radius: var(--border-radius) var(--border-radius) var(--border-radius) calc(var(--border-radius-sm) / 2);
+          border-radius: var(--border-radius) var(--border-radius) var(--border-radius)
+            calc(var(--border-radius-sm) / 2);
         }
       }
 
       &--me {
         .str-chat__message-text {
           &-inner {
-            border-radius: var(--border-radius) var(--border-radius) calc(var(--border-radius-sm) / 2) var(--border-radius);
+            border-radius: var(--border-radius) var(--border-radius)
+              calc(var(--border-radius-sm) / 2) var(--border-radius);
           }
         }
       }
@@ -251,10 +253,12 @@
     .str-chat__message {
       &-text {
         &-inner {
-          border-radius: var(--border-radius) var(--border-radius) var(--border-radius) calc(var(--border-radius-sm) / 2);
+          border-radius: var(--border-radius) var(--border-radius) var(--border-radius)
+            calc(var(--border-radius-sm) / 2);
 
           &--has-attachment {
-            border-radius: calc(var(--border-radius-sm) / 2) var(--border-radius) var(--border-radius) calc(var(--border-radius-sm) / 2);
+            border-radius: calc(var(--border-radius-sm) / 2) var(--border-radius)
+              var(--border-radius) calc(var(--border-radius-sm) / 2);
           }
         }
       }
@@ -262,10 +266,12 @@
       &--me {
         .str-chat__message-text {
           &-inner {
-            border-radius: var(--border-radius) var(--border-radius) calc(var(--border-radius-sm) / 2) var(--border-radius);
+            border-radius: var(--border-radius) var(--border-radius)
+              calc(var(--border-radius-sm) / 2) var(--border-radius);
 
             &--has-attachment {
-              border-radius: var(--border-radius) calc(var(--border-radius-sm) / 2) calc(var(--border-radius-sm) / 2) var(--border-radius);
+              border-radius: var(--border-radius) calc(var(--border-radius-sm) / 2)
+                calc(var(--border-radius-sm) / 2) var(--border-radius);
             }
           }
         }
@@ -278,14 +284,16 @@
     .str-chat__message {
       &-text {
         &-inner {
-          border-radius: calc(var(--border-radius-sm) / 2) var(--border-radius) var(--border-radius) calc(var(--border-radius-sm) / 2);
+          border-radius: calc(var(--border-radius-sm) / 2) var(--border-radius) var(--border-radius)
+            calc(var(--border-radius-sm) / 2);
         }
       }
 
       &--me {
         .str-chat__message-text {
           &-inner {
-            border-radius: var(--border-radius) calc(var(--border-radius-sm) / 2) calc(var(--border-radius-sm) / 2) var(--border-radius);
+            border-radius: var(--border-radius) calc(var(--border-radius-sm) / 2)
+              calc(var(--border-radius-sm) / 2) var(--border-radius);
 
             &--has-attachment {
               margin: 0;
@@ -296,7 +304,8 @@
         .str-chat__message-attachment-card {
           margin: 0;
           padding: 0;
-          border-radius: var(--border-radius) calc(var(--border-radius-sm) / 2) calc(var(--border-radius-sm) / 2) var(--border-radius);
+          border-radius: var(--border-radius) calc(var(--border-radius-sm) / 2)
+            calc(var(--border-radius-sm) / 2) var(--border-radius);
         }
       }
     }
@@ -741,11 +750,6 @@
             padding: 3px 0;
           }
         }
-
-        &--options.str-chat-angular__message-simple__actions__action--options--editing {
-          position: relative;
-          display: flex;
-        }
       }
     }
 

package/dist/scss/MessageActions.scss

@@ -135,12 +135,3 @@
     }
   }
 }
-
-// Used by Angular SDK to display edit message modal
-.str-chat__message-edit-in-progress {
-  .ngxp__container {
-    transform: initial !important;
-    will-change: initial !important;
-    z-index: 2;
-  }
-}

package/dist/scss/_base.scss

@@ -31,12 +31,19 @@
         bottom: 0;
         opacity: 0;
 
-        &[aria-hidden="true"] {
+        &[aria-hidden='true'] {
           visibility: hidden;
         }
       }
     }
   }
+
+  // New features are not implemented in theme-v1, corresponding HTML code is hidden
+  .str-chat__unread-messages-notification,
+  .str-chat__unread-messages-separator-wrapper,
+  .str-chat__message-bounce-prompt {
+    display: none;
+  }
 }
 
 .clearfix {

package/dist/scss/v2/AttachmentList/AttachmentList-layout.scss

@@ -341,6 +341,71 @@
     }
   }
 
+  .str-chat__message-attachment__voice-recording-widget {
+    display: grid;
+    grid-template-columns: 36px auto 55px;
+    align-items: center;
+    justify-content: center;
+    gap: calc(var(--str-chat__spacing-px) * 14);
+    padding: var(--str-chat__spacing-2);
+    margin: var(--str-chat__attachment-margin);
+
+    .str-chat__message-attachment__voice-recording-widget__metadata {
+      flex: 1;
+      min-width: 0;
+      display: flex;
+      flex-direction: column;
+      gap: var(--str-chat__spacing-2);
+
+      .str-chat__message-attachment__voice-recording-widget__audio-state {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: var(--str-chat__spacing-1_5);
+        height: 100%;
+      }
+    }
+
+    .str-chat__message-attachment__voice-recording-widget__right-section {
+      justify-self: center;
+    }
+
+    .str-chat__message-attachment__voice-recording-widget__timer {
+      min-width: calc(var(--str-chat__spacing-px) * 45);
+      width: calc(var(--str-chat__spacing-px) * 45);
+    }
+
+    .str-chat__wave-progress-bar__track {
+      $min_amplitude_height: 2px;
+      position: relative;
+      flex: 1;
+      width: 120px;
+      height: calc(var(--str-chat__spacing-px) * 25);
+      display: flex;
+      align-items: center;
+      gap: var(--str-chat__spacing-px);
+
+      .str-chat__wave-progress-bar__amplitude-bar {
+        width: 2px;
+        min-width: 2px;
+        height: calc(var(--str-chat__wave-progress-bar__amplitude-bar-height) + $min_amplitude_height); // variable set dynamically on element
+      }
+
+      .str-chat__wave-progress-bar__progress-indicator {
+        position: absolute;
+        left: 0;
+        height: calc(100% + $min_amplitude_height + 2px);
+        width: calc(var(--str-chat__spacing-px) * 6);
+      }
+    }
+  }
+
+  .str-chat__message_attachment__playback-rate-button {
+    @include utils.flex-row-center;
+    @include utils.button-reset;
+    padding: var(--str-chat__spacing-1_5) var(--str-chat__spacing-2_5);
+  }
+
   .str-chat__message-attachment-card {
     min-width: 0;
     max-width: var(--str-chat__attachment-max-width);
@@ -396,6 +461,12 @@
       }
     }
   }
+
+  /* Angular has different UI here, the download icon is too small to use on mobile */
+  .str-chat-angular__message-attachment-file-single {
+    cursor: pointer;
+    text-decoration: none;
+  }
 }
 
 .str-chat__quoted-message-preview {
@@ -413,6 +484,19 @@
     }
   }
 
+  .str-chat__message-attachment__voice-recording-widget {
+    display: flex;
+    justify-content: space-between;
+
+    .str-chat__wave-progress-bar__track {
+      display: none;
+    }
+
+    .str-chat__message-attachment-audio-widget--play-button {
+      display: none;
+    }
+  }
+
   .str-chat__message-attachment-file--item-download {
     display: none;
   }