stream-chat-react 10.1.1 → 10.1.2

package/dist/browser.full-bundle.js

@@ -43181,6 +43181,159 @@ var StreamChatReact = (function (exports, React, streamChat, ReactDOM) {
         intro: 'channel.intro',
     };
 
+    window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};var useFileState = function (file) {
+        return React.useMemo(function () { return ({
+            failed: file.state === 'failed',
+            finished: file.state === 'finished',
+            uploading: file.state === 'uploading',
+        }); }, [file.state]);
+    };
+
+    window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};var EmojiIconLarge = function () {
+        var t = useTranslationContext('EmojiIconLarge').t;
+        return (React__default["default"].createElement("svg", { height: '28', width: '28', xmlns: 'http://www.w3.org/2000/svg' },
+            React__default["default"].createElement("title", null, t('Open emoji picker')),
+            React__default["default"].createElement("g", { clipRule: 'evenodd', fillRule: 'evenodd' },
+                React__default["default"].createElement("path", { d: 'M14 4.4C8.6 4.4 4.4 8.6 4.4 14c0 5.4 4.2 9.6 9.6 9.6c5.4 0 9.6-4.2 9.6-9.6c0-5.4-4.2-9.6-9.6-9.6zM2 14c0-6.6 5.4-12 12-12s12 5.4 12 12s-5.4 12-12 12s-12-5.4-12-12zM12.8 11c0 1-.8 1.8-1.8 1.8s-1.8-.8-1.8-1.8s.8-1.8 1.8-1.8s1.8.8 1.8 1.8zM18.8 11c0 1-.8 1.8-1.8 1.8s-1.8-.8-1.8-1.8s.8-1.8 1.8-1.8s1.8.8 1.8 1.8zM8.6 15.4c.6-.4 1.2-.2 1.6.2c.6.8 1.6 1.8 3 2c1.2.4 2.8.2 4.8-2c.4-.4 1.2-.6 1.6 0c.4.4.6 1.2 0 1.6c-2.2 2.6-4.8 3.4-7 3c-2-.4-3.6-1.8-4.4-3c-.4-.6-.2-1.2.4-1.8z' }))));
+    };
+    var EmojiIconSmall = function () {
+        var t = useTranslationContext('EmojiIconSmall').t;
+        return (React__default["default"].createElement("svg", { height: '14', width: '14', xmlns: 'http://www.w3.org/2000/svg' },
+            React__default["default"].createElement("title", null, t('Open emoji picker')),
+            React__default["default"].createElement("g", { clipRule: 'evenodd', fillRule: 'evenodd' },
+                React__default["default"].createElement("path", { d: 'M6.7 1.42C3.73 1.42 1.42 3.73 1.42 6.7c0 2.97 2.31 5.28 5.28 5.28c2.97 0 5.28-2.31 5.28-5.28c0-2.97-2.31-5.28-5.28-5.28zM.1 6.7c0-3.63 2.97-6.6 6.6-6.6s6.6 2.97 6.6 6.6s-2.97 6.6-6.6 6.6s-6.6-2.97-6.6-6.6zM6.04 5.05c0 .55-.44.99-.99.99s-.99-.44-.99-.99s.44-.99.99-.99s.99.44.99.99zM9.34 5.05c0 .55-.44.99-.99.99s-.99-.44-.99-.99s.44-.99.99-.99s.99.44.99.99zM3.73 7.47c.33-.22.66-.11.88.11c.33.44.88.99 1.65 1.1c.66.22 1.54.11 2.64-1.1c.22-.22.66-.33.88 0c.22.22.33.66 0 .88c-1.21 1.43-2.64 1.87-3.85 1.65c-1.1-.22-1.98-.99-2.42-1.65c-.22-.33-.11-.66.22-.99z' }))));
+    };
+    // ThemingV2 icon
+    var EmojiPickerIcon = function () { return (React__default["default"].createElement("svg", { preserveAspectRatio: 'xMinYMin', viewBox: '0 0 28 28', width: '100%', xmlns: 'http://www.w3.org/2000/svg' },
+        React__default["default"].createElement("g", { clipRule: 'evenodd', fillRule: 'evenodd' },
+            React__default["default"].createElement("path", { d: 'M14 4.4C8.6 4.4 4.4 8.6 4.4 14c0 5.4 4.2 9.6 9.6 9.6c5.4 0 9.6-4.2 9.6-9.6c0-5.4-4.2-9.6-9.6-9.6zM2 14c0-6.6 5.4-12 12-12s12 5.4 12 12s-5.4 12-12 12s-12-5.4-12-12zM12.8 11c0 1-.8 1.8-1.8 1.8s-1.8-.8-1.8-1.8s.8-1.8 1.8-1.8s1.8.8 1.8 1.8zM18.8 11c0 1-.8 1.8-1.8 1.8s-1.8-.8-1.8-1.8s.8-1.8 1.8-1.8s1.8.8 1.8 1.8zM8.6 15.4c.6-.4 1.2-.2 1.6.2c.6.8 1.6 1.8 3 2c1.2.4 2.8.2 4.8-2c.4-.4 1.2-.6 1.6 0c.4.4.6 1.2 0 1.6c-2.2 2.6-4.8 3.4-7 3c-2-.4-3.6-1.8-4.4-3c-.4-.6-.2-1.2.4-1.8z' })))); };
+    var FileUploadIcon = function () {
+        var t = useTranslationContext('FileUploadIcon').t;
+        return (React__default["default"].createElement("svg", { height: '14', width: '14', xmlns: 'http://www.w3.org/2000/svg' },
+            React__default["default"].createElement("title", null, t('Attach files')),
+            React__default["default"].createElement("path", { d: 'M7 .5c3.59 0 6.5 2.91 6.5 6.5s-2.91 6.5-6.5 6.5S.5 10.59.5 7 3.41.5 7 .5zm0 12c3.031 0 5.5-2.469 5.5-5.5S10.031 1.5 7 1.5A5.506 5.506 0 0 0 1.5 7c0 3.034 2.469 5.5 5.5 5.5zM7.506 3v3.494H11v1.05H7.506V11h-1.05V7.544H3v-1.05h3.456V3h1.05z', fillRule: 'nonzero' })));
+    };
+    var FileUploadIconFlat = function () {
+        var t = useTranslationContext('FileUploadIconFlat').t;
+        return (React__default["default"].createElement("svg", { height: '14', width: '14', xmlns: 'http://www.w3.org/2000/svg' },
+            React__default["default"].createElement("title", null, t('Attach files')),
+            React__default["default"].createElement("path", { d: 'M1.667.333h10.666c.737 0 1.334.597 1.334 1.334v10.666c0 .737-.597 1.334-1.334 1.334H1.667a1.333 1.333 0 0 1-1.334-1.334V1.667C.333.93.93.333 1.667.333zm2 1.334a1.667 1.667 0 1 0 0 3.333 1.667 1.667 0 0 0 0-3.333zm-2 9.333v1.333h10.666v-4l-2-2-4 4-2-2L1.667 11z', fillRule: 'nonzero' })));
+    };
+    var LoadingIndicatorIcon = function (_a) {
+        var _b = _a.size, size = _b === void 0 ? 20 : _b;
+        var id = React.useMemo(function () { return nanoid(); }, []);
+        return (React__default["default"].createElement("div", { className: 'str-chat__loading-indicator' },
+            React__default["default"].createElement("svg", { "data-testid": 'loading-indicator', height: size, viewBox: '0 0 30 30', width: size, xmlns: 'http://www.w3.org/2000/svg' },
+                React__default["default"].createElement("defs", null,
+                    React__default["default"].createElement("linearGradient", { id: "".concat(id, "-linear-gradient"), x1: '50%', x2: '50%', y1: '0%', y2: '100%' },
+                        React__default["default"].createElement("stop", { offset: '0%', stopColor: '#FFF', stopOpacity: '0' }),
+                        React__default["default"].createElement("stop", { "data-testid": 'stop-color', offset: '100%', stopOpacity: '1' }))),
+                React__default["default"].createElement("path", { d: 'M2.518 23.321l1.664-1.11A12.988 12.988 0 0 0 15 28c7.18 0 13-5.82 13-13S22.18 2 15 2V0c8.284 0 15 6.716 15 15 0 8.284-6.716 15-15 15-5.206 0-9.792-2.652-12.482-6.679z', fill: "url(#".concat(id, "-linear-gradient)"), fillRule: 'evenodd' }))));
+    };
+    // ThemingV2 icon
+    var UploadIcon = function () { return (React__default["default"].createElement("svg", { "data-testid": 'attach', fill: 'none', height: '24', viewBox: '0 0 24 24', width: '24', xmlns: 'http://www.w3.org/2000/svg' },
+        React__default["default"].createElement("g", { clipPath: 'url(#clip0_10878_5)' },
+            React__default["default"].createElement("path", { d: 'M12.9997 6.99993L10.9997 6.99993L10.9997 10.9999L6.99972 10.9999L6.99972 12.9999L10.9997 12.9999L10.9997 16.9999L12.9997 16.9999L12.9997 12.9999L16.9997 12.9999L16.9997 10.9999L12.9997 10.9999L12.9997 6.99993ZM11.9997 1.99992C6.47972 1.99992 1.99972 6.47993 1.99972 11.9999C1.99972 17.5199 6.47972 21.9999 11.9997 21.9999C17.5197 21.9999 21.9997 17.5199 21.9997 11.9999C21.9997 6.47993 17.5197 1.99992 11.9997 1.99992ZM11.9997 19.9999C7.58972 19.9999 3.99972 16.4099 3.99972 11.9999C3.99972 7.58993 7.58972 3.99993 11.9997 3.99993C16.4097 3.99993 19.9997 7.58993 19.9997 11.9999C19.9997 16.4099 16.4097 19.9999 11.9997 19.9999Z', fill: 'black' })),
+        React__default["default"].createElement("defs", null,
+            React__default["default"].createElement("clipPath", { id: 'clip0_10878_5' },
+                React__default["default"].createElement("rect", { fill: 'white', height: '24', width: '24' }))))); };
+    var CloseIcon$1 = function () { return (React__default["default"].createElement("svg", { "data-testid": 'close-no-outline', fill: 'none', height: '24', viewBox: '0 0 24 24', width: '24', xmlns: 'http://www.w3.org/2000/svg' },
+        React__default["default"].createElement("path", { d: 'M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12L19 6.41Z', fill: 'black' }))); };
+    var RetryIcon = function () { return (React__default["default"].createElement("svg", { "data-testid": 'retry', fill: 'none', height: '24', viewBox: '0 0 24 24', width: '24', xmlns: 'http://www.w3.org/2000/svg' },
+        React__default["default"].createElement("path", { d: 'M17.6449 6.35C16.1949 4.9 14.2049 4 11.9949 4C7.57488 4 4.00488 7.58 4.00488 12C4.00488 16.42 7.57488 20 11.9949 20C15.7249 20 18.8349 17.45 19.7249 14H17.6449C16.8249 16.33 14.6049 18 11.9949 18C8.68488 18 5.99488 15.31 5.99488 12C5.99488 8.69 8.68488 6 11.9949 6C13.6549 6 15.1349 6.69 16.2149 7.78L12.9949 11H19.9949V4L17.6449 6.35Z', fill: 'black' }))); };
+    var DownloadIcon = function () { return (React__default["default"].createElement("svg", { "data-testid": 'download', fill: 'none', height: '24', viewBox: '0 0 24 24', width: '24', xmlns: 'http://www.w3.org/2000/svg' },
+        React__default["default"].createElement("path", { d: 'M19.35 10.04C18.67 6.59 15.64 4 12 4C9.11 4 6.6 5.64 5.35 8.04C2.34 8.36 0 10.91 0 14C0 17.31 2.69 20 6 20H19C21.76 20 24 17.76 24 15C24 12.36 21.95 10.22 19.35 10.04ZM19 18H6C3.79 18 2 16.21 2 14C2 11.95 3.53 10.24 5.56 10.03L6.63 9.92L7.13 8.97C8.08 7.14 9.94 6 12 6C14.62 6 16.88 7.86 17.39 10.43L17.69 11.93L19.22 12.04C20.78 12.14 22 13.45 22 15C22 16.65 20.65 18 19 18ZM13.45 10H10.55V13H8L12 17L16 13H13.45V10Z', fill: 'black' }))); };
+    var SendIconV1 = function () {
+        var t = useTranslationContext('SendButton').t;
+        return (React__default["default"].createElement("svg", { height: '17', viewBox: '0 0 18 17', width: '18', xmlns: 'http://www.w3.org/2000/svg' },
+            React__default["default"].createElement("title", null, t('Send')),
+            React__default["default"].createElement("path", { d: 'M0 17.015l17.333-8.508L0 0v6.617l12.417 1.89L0 10.397z', fill: '#006cff', fillRule: 'evenodd' })));
+    };
+    var SendIconV2 = function () {
+        var t = useTranslationContext('SendButton').t;
+        return (React__default["default"].createElement("svg", { "data-testid": 'send', fill: 'none', height: '24', viewBox: '0 0 24 24', width: '24', xmlns: 'http://www.w3.org/2000/svg' },
+            React__default["default"].createElement("title", null, t('Send')),
+            React__default["default"].createElement("path", { d: 'M4.00952 22L24 12L4.00952 2L4 9.77778L18.2857 12L4 14.2222L4.00952 22Z', fill: 'black' })));
+    };
+    var SendButton = function (_a) {
+        var sendMessage = _a.sendMessage, rest = __rest$4(_a, ["sendMessage"]);
+        var themeVersion = useChatContext('SendButton').themeVersion;
+        return (React__default["default"].createElement("button", __assign$8({ "aria-label": 'Send', className: 'str-chat__send-button', "data-testid": 'send-button', onClick: sendMessage, type: 'button' }, rest), themeVersion === '2' ? React__default["default"].createElement(SendIconV2, null) : React__default["default"].createElement(SendIconV1, null)));
+    };
+
+    window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};var AttachmentPreviewList = function () {
+        var _a = useMessageInputContext('AttachmentPreviewList'), fileOrder = _a.fileOrder, imageOrder = _a.imageOrder;
+        return (React__default["default"].createElement("div", { className: 'str-chat__attachment-preview-list' },
+            React__default["default"].createElement("div", { className: 'str-chat__attachment-list-scroll-container', "data-testid": 'attachment-list-scroll-container' },
+                imageOrder.map(function (id) { return (React__default["default"].createElement(ImagePreviewItem, { id: id, key: id })); }),
+                fileOrder.map(function (id) { return (React__default["default"].createElement(FilePreviewItem, { id: id, key: id })); }))));
+    };
+    var ImagePreviewItem = function (_a) {
+        var _b;
+        var id = _a.id;
+        var _c = useMessageInputContext('ImagePreviewItem'), imageUploads = _c.imageUploads, removeImage = _c.removeImage, uploadImage = _c.uploadImage;
+        var handleRemove = React.useCallback(function (e) {
+            e.stopPropagation();
+            removeImage(id);
+        }, [removeImage, id]);
+        var handleRetry = React.useCallback(function () { return uploadImage(id); }, [uploadImage, id]);
+        var image = imageUploads[id];
+        var state = useFileState(image);
+        // do not display scraped attachments
+        if (!image || image.og_scrape_url)
+            return null;
+        return (React__default["default"].createElement("div", { className: 'str-chat__attachment-preview-image', "data-testid": 'attachment-preview-image' },
+            React__default["default"].createElement("button", { className: 'str-chat__attachment-preview-delete', "data-testid": 'image-preview-item-delete-button', disabled: state.uploading, onClick: handleRemove },
+                React__default["default"].createElement(CloseIcon$1, null)),
+            state.failed && (React__default["default"].createElement("button", { className: 'str-chat__attachment-preview-error str-chat__attachment-preview-error-image', "data-testid": 'image-preview-item-retry-button', onClick: handleRetry },
+                React__default["default"].createElement(RetryIcon, null))),
+            state.uploading && (React__default["default"].createElement("div", { className: 'str-chat__attachment-preview-image-loading' },
+                React__default["default"].createElement(LoadingIndicatorIcon, { size: 17 }))),
+            (image.previewUri || image.url) && (React__default["default"].createElement("img", { alt: image.file.name, className: 'str-chat__attachment-preview-thumbnail', src: (_b = image.previewUri) !== null && _b !== void 0 ? _b : image.url }))));
+    };
+    var FilePreviewItem = function (_a) {
+        var id = _a.id;
+        var _b = useMessageInputContext('FilePreviewItem'), fileUploads = _b.fileUploads, removeFile = _b.removeFile, uploadFile = _b.uploadFile;
+        var handleRemove = React.useCallback(function (e) {
+            e.stopPropagation();
+            removeFile(id);
+        }, [removeFile, id]);
+        var handleRetry = React.useCallback(function () { return uploadFile(id); }, [uploadFile, id]);
+        var file = fileUploads[id];
+        var state = useFileState(file);
+        if (!file)
+            return null;
+        return (React__default["default"].createElement("div", { className: 'str-chat__attachment-preview-file', "data-testid": 'attachment-preview-file' },
+            React__default["default"].createElement("div", { className: 'str-chat__attachment-preview-file-icon' },
+                React__default["default"].createElement(FileIcon, { filename: file.file.name, mimeType: file.file.type, version: '2' })),
+            React__default["default"].createElement("button", { className: 'str-chat__attachment-preview-delete', "data-testid": 'file-preview-item-delete-button', disabled: state.uploading, onClick: handleRemove },
+                React__default["default"].createElement(CloseIcon$1, null)),
+            state.failed && (React__default["default"].createElement("button", { className: 'str-chat__attachment-preview-error str-chat__attachment-preview-error-file', "data-testid": 'file-preview-item-retry-button', onClick: handleRetry },
+                React__default["default"].createElement(RetryIcon, null))),
+            React__default["default"].createElement("div", { className: 'str-chat__attachment-preview-file-end' },
+                React__default["default"].createElement("div", { className: 'str-chat__attachment-preview-file-name' }, file.file.name),
+                state.finished && (React__default["default"].createElement("a", { className: 'str-chat__attachment-preview-file-download', download: true, href: file.url, rel: 'noreferrer', target: '_blank' },
+                    React__default["default"].createElement(DownloadIcon, null))),
+                state.uploading && React__default["default"].createElement(LoadingIndicatorIcon, { size: 17 }))));
+    };
+
+    window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};var CooldownTimer = function (_a) {
+        var cooldownInterval = _a.cooldownInterval, setCooldownRemaining = _a.setCooldownRemaining;
+        var _b = React.useState(cooldownInterval), seconds = _b[0], setSeconds = _b[1];
+        React.useEffect(function () {
+            var countdownInterval = setInterval(function () {
+                if (seconds > 0) {
+                    setSeconds(seconds - 1);
+                }
+                else {
+                    setCooldownRemaining(0);
+                }
+            }, 1000);
+            return function () { return clearInterval(countdownInterval); };
+        });
+        return (React__default["default"].createElement("div", { className: 'str-chat__message-input-cooldown', "data-testid": 'cooldown-timer' }, seconds === 0 ? null : seconds));
+    };
+
     window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};var useCommandTrigger = function () {
         var themeVersion = useChatContext('useCommandTrigger').themeVersion;
         var channelConfig = useChannelStateContext('useCommandTrigger').channelConfig;
@@ -43585,78 +43738,6 @@ var StreamChatReact = (function (exports, React, streamChat, ReactDOM) {
                 React__default["default"].createElement(EmojiPickerComponent, { color: '#006CFF', data: emojiData, emoji: 'point_up', emojisToShowFilter: filterEmoji, native: true, onSelect: onSelectEmoji, set: 'facebook', showPreview: false, showSkinTones: false, title: t('Pick your emoji'), useButton: true }))));
     };
 
-    window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};var EmojiIconLarge = function () {
-        var t = useTranslationContext('EmojiIconLarge').t;
-        return (React__default["default"].createElement("svg", { height: '28', width: '28', xmlns: 'http://www.w3.org/2000/svg' },
-            React__default["default"].createElement("title", null, t('Open emoji picker')),
-            React__default["default"].createElement("g", { clipRule: 'evenodd', fillRule: 'evenodd' },
-                React__default["default"].createElement("path", { d: 'M14 4.4C8.6 4.4 4.4 8.6 4.4 14c0 5.4 4.2 9.6 9.6 9.6c5.4 0 9.6-4.2 9.6-9.6c0-5.4-4.2-9.6-9.6-9.6zM2 14c0-6.6 5.4-12 12-12s12 5.4 12 12s-5.4 12-12 12s-12-5.4-12-12zM12.8 11c0 1-.8 1.8-1.8 1.8s-1.8-.8-1.8-1.8s.8-1.8 1.8-1.8s1.8.8 1.8 1.8zM18.8 11c0 1-.8 1.8-1.8 1.8s-1.8-.8-1.8-1.8s.8-1.8 1.8-1.8s1.8.8 1.8 1.8zM8.6 15.4c.6-.4 1.2-.2 1.6.2c.6.8 1.6 1.8 3 2c1.2.4 2.8.2 4.8-2c.4-.4 1.2-.6 1.6 0c.4.4.6 1.2 0 1.6c-2.2 2.6-4.8 3.4-7 3c-2-.4-3.6-1.8-4.4-3c-.4-.6-.2-1.2.4-1.8z' }))));
-    };
-    var EmojiIconSmall = function () {
-        var t = useTranslationContext('EmojiIconSmall').t;
-        return (React__default["default"].createElement("svg", { height: '14', width: '14', xmlns: 'http://www.w3.org/2000/svg' },
-            React__default["default"].createElement("title", null, t('Open emoji picker')),
-            React__default["default"].createElement("g", { clipRule: 'evenodd', fillRule: 'evenodd' },
-                React__default["default"].createElement("path", { d: 'M6.7 1.42C3.73 1.42 1.42 3.73 1.42 6.7c0 2.97 2.31 5.28 5.28 5.28c2.97 0 5.28-2.31 5.28-5.28c0-2.97-2.31-5.28-5.28-5.28zM.1 6.7c0-3.63 2.97-6.6 6.6-6.6s6.6 2.97 6.6 6.6s-2.97 6.6-6.6 6.6s-6.6-2.97-6.6-6.6zM6.04 5.05c0 .55-.44.99-.99.99s-.99-.44-.99-.99s.44-.99.99-.99s.99.44.99.99zM9.34 5.05c0 .55-.44.99-.99.99s-.99-.44-.99-.99s.44-.99.99-.99s.99.44.99.99zM3.73 7.47c.33-.22.66-.11.88.11c.33.44.88.99 1.65 1.1c.66.22 1.54.11 2.64-1.1c.22-.22.66-.33.88 0c.22.22.33.66 0 .88c-1.21 1.43-2.64 1.87-3.85 1.65c-1.1-.22-1.98-.99-2.42-1.65c-.22-.33-.11-.66.22-.99z' }))));
-    };
-    // ThemingV2 icon
-    var EmojiPickerIcon = function () { return (React__default["default"].createElement("svg", { preserveAspectRatio: 'xMinYMin', viewBox: '0 0 28 28', width: '100%', xmlns: 'http://www.w3.org/2000/svg' },
-        React__default["default"].createElement("g", { clipRule: 'evenodd', fillRule: 'evenodd' },
-            React__default["default"].createElement("path", { d: 'M14 4.4C8.6 4.4 4.4 8.6 4.4 14c0 5.4 4.2 9.6 9.6 9.6c5.4 0 9.6-4.2 9.6-9.6c0-5.4-4.2-9.6-9.6-9.6zM2 14c0-6.6 5.4-12 12-12s12 5.4 12 12s-5.4 12-12 12s-12-5.4-12-12zM12.8 11c0 1-.8 1.8-1.8 1.8s-1.8-.8-1.8-1.8s.8-1.8 1.8-1.8s1.8.8 1.8 1.8zM18.8 11c0 1-.8 1.8-1.8 1.8s-1.8-.8-1.8-1.8s.8-1.8 1.8-1.8s1.8.8 1.8 1.8zM8.6 15.4c.6-.4 1.2-.2 1.6.2c.6.8 1.6 1.8 3 2c1.2.4 2.8.2 4.8-2c.4-.4 1.2-.6 1.6 0c.4.4.6 1.2 0 1.6c-2.2 2.6-4.8 3.4-7 3c-2-.4-3.6-1.8-4.4-3c-.4-.6-.2-1.2.4-1.8z' })))); };
-    var FileUploadIcon = function () {
-        var t = useTranslationContext('FileUploadIcon').t;
-        return (React__default["default"].createElement("svg", { height: '14', width: '14', xmlns: 'http://www.w3.org/2000/svg' },
-            React__default["default"].createElement("title", null, t('Attach files')),
-            React__default["default"].createElement("path", { d: 'M7 .5c3.59 0 6.5 2.91 6.5 6.5s-2.91 6.5-6.5 6.5S.5 10.59.5 7 3.41.5 7 .5zm0 12c3.031 0 5.5-2.469 5.5-5.5S10.031 1.5 7 1.5A5.506 5.506 0 0 0 1.5 7c0 3.034 2.469 5.5 5.5 5.5zM7.506 3v3.494H11v1.05H7.506V11h-1.05V7.544H3v-1.05h3.456V3h1.05z', fillRule: 'nonzero' })));
-    };
-    var FileUploadIconFlat = function () {
-        var t = useTranslationContext('FileUploadIconFlat').t;
-        return (React__default["default"].createElement("svg", { height: '14', width: '14', xmlns: 'http://www.w3.org/2000/svg' },
-            React__default["default"].createElement("title", null, t('Attach files')),
-            React__default["default"].createElement("path", { d: 'M1.667.333h10.666c.737 0 1.334.597 1.334 1.334v10.666c0 .737-.597 1.334-1.334 1.334H1.667a1.333 1.333 0 0 1-1.334-1.334V1.667C.333.93.93.333 1.667.333zm2 1.334a1.667 1.667 0 1 0 0 3.333 1.667 1.667 0 0 0 0-3.333zm-2 9.333v1.333h10.666v-4l-2-2-4 4-2-2L1.667 11z', fillRule: 'nonzero' })));
-    };
-    var LoadingIndicatorIcon = function (_a) {
-        var _b = _a.size, size = _b === void 0 ? 20 : _b;
-        var id = React.useMemo(function () { return nanoid(); }, []);
-        return (React__default["default"].createElement("div", { className: 'str-chat__loading-indicator' },
-            React__default["default"].createElement("svg", { "data-testid": 'loading-indicator', height: size, viewBox: '0 0 30 30', width: size, xmlns: 'http://www.w3.org/2000/svg' },
-                React__default["default"].createElement("defs", null,
-                    React__default["default"].createElement("linearGradient", { id: "".concat(id, "-linear-gradient"), x1: '50%', x2: '50%', y1: '0%', y2: '100%' },
-                        React__default["default"].createElement("stop", { offset: '0%', stopColor: '#FFF', stopOpacity: '0' }),
-                        React__default["default"].createElement("stop", { "data-testid": 'stop-color', offset: '100%', stopOpacity: '1' }))),
-                React__default["default"].createElement("path", { d: 'M2.518 23.321l1.664-1.11A12.988 12.988 0 0 0 15 28c7.18 0 13-5.82 13-13S22.18 2 15 2V0c8.284 0 15 6.716 15 15 0 8.284-6.716 15-15 15-5.206 0-9.792-2.652-12.482-6.679z', fill: "url(#".concat(id, "-linear-gradient)"), fillRule: 'evenodd' }))));
-    };
-    // ThemingV2 icon
-    var UploadIcon = function () { return (React__default["default"].createElement("svg", { "data-testid": 'attach', fill: 'none', height: '24', viewBox: '0 0 24 24', width: '24', xmlns: 'http://www.w3.org/2000/svg' },
-        React__default["default"].createElement("g", { clipPath: 'url(#clip0_10878_5)' },
-            React__default["default"].createElement("path", { d: 'M12.9997 6.99993L10.9997 6.99993L10.9997 10.9999L6.99972 10.9999L6.99972 12.9999L10.9997 12.9999L10.9997 16.9999L12.9997 16.9999L12.9997 12.9999L16.9997 12.9999L16.9997 10.9999L12.9997 10.9999L12.9997 6.99993ZM11.9997 1.99992C6.47972 1.99992 1.99972 6.47993 1.99972 11.9999C1.99972 17.5199 6.47972 21.9999 11.9997 21.9999C17.5197 21.9999 21.9997 17.5199 21.9997 11.9999C21.9997 6.47993 17.5197 1.99992 11.9997 1.99992ZM11.9997 19.9999C7.58972 19.9999 3.99972 16.4099 3.99972 11.9999C3.99972 7.58993 7.58972 3.99993 11.9997 3.99993C16.4097 3.99993 19.9997 7.58993 19.9997 11.9999C19.9997 16.4099 16.4097 19.9999 11.9997 19.9999Z', fill: 'black' })),
-        React__default["default"].createElement("defs", null,
-            React__default["default"].createElement("clipPath", { id: 'clip0_10878_5' },
-                React__default["default"].createElement("rect", { fill: 'white', height: '24', width: '24' }))))); };
-    var CloseIcon$1 = function () { return (React__default["default"].createElement("svg", { "data-testid": 'close-no-outline', fill: 'none', height: '24', viewBox: '0 0 24 24', width: '24', xmlns: 'http://www.w3.org/2000/svg' },
-        React__default["default"].createElement("path", { d: 'M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12L19 6.41Z', fill: 'black' }))); };
-    var RetryIcon = function () { return (React__default["default"].createElement("svg", { "data-testid": 'retry', fill: 'none', height: '24', viewBox: '0 0 24 24', width: '24', xmlns: 'http://www.w3.org/2000/svg' },
-        React__default["default"].createElement("path", { d: 'M17.6449 6.35C16.1949 4.9 14.2049 4 11.9949 4C7.57488 4 4.00488 7.58 4.00488 12C4.00488 16.42 7.57488 20 11.9949 20C15.7249 20 18.8349 17.45 19.7249 14H17.6449C16.8249 16.33 14.6049 18 11.9949 18C8.68488 18 5.99488 15.31 5.99488 12C5.99488 8.69 8.68488 6 11.9949 6C13.6549 6 15.1349 6.69 16.2149 7.78L12.9949 11H19.9949V4L17.6449 6.35Z', fill: 'black' }))); };
-    var DownloadIcon = function () { return (React__default["default"].createElement("svg", { "data-testid": 'download', fill: 'none', height: '24', viewBox: '0 0 24 24', width: '24', xmlns: 'http://www.w3.org/2000/svg' },
-        React__default["default"].createElement("path", { d: 'M19.35 10.04C18.67 6.59 15.64 4 12 4C9.11 4 6.6 5.64 5.35 8.04C2.34 8.36 0 10.91 0 14C0 17.31 2.69 20 6 20H19C21.76 20 24 17.76 24 15C24 12.36 21.95 10.22 19.35 10.04ZM19 18H6C3.79 18 2 16.21 2 14C2 11.95 3.53 10.24 5.56 10.03L6.63 9.92L7.13 8.97C8.08 7.14 9.94 6 12 6C14.62 6 16.88 7.86 17.39 10.43L17.69 11.93L19.22 12.04C20.78 12.14 22 13.45 22 15C22 16.65 20.65 18 19 18ZM13.45 10H10.55V13H8L12 17L16 13H13.45V10Z', fill: 'black' }))); };
-    var SendIconV1 = function () {
-        var t = useTranslationContext('SendButton').t;
-        return (React__default["default"].createElement("svg", { height: '17', viewBox: '0 0 18 17', width: '18', xmlns: 'http://www.w3.org/2000/svg' },
-            React__default["default"].createElement("title", null, t('Send')),
-            React__default["default"].createElement("path", { d: 'M0 17.015l17.333-8.508L0 0v6.617l12.417 1.89L0 10.397z', fill: '#006cff', fillRule: 'evenodd' })));
-    };
-    var SendIconV2 = function () {
-        var t = useTranslationContext('SendButton').t;
-        return (React__default["default"].createElement("svg", { "data-testid": 'send', fill: 'none', height: '24', viewBox: '0 0 24 24', width: '24', xmlns: 'http://www.w3.org/2000/svg' },
-            React__default["default"].createElement("title", null, t('Send')),
-            React__default["default"].createElement("path", { d: 'M4.00952 22L24 12L4.00952 2L4 9.77778L18.2857 12L4 14.2222L4.00952 22Z', fill: 'black' })));
-    };
-    var SendButton = function (_a) {
-        var sendMessage = _a.sendMessage, rest = __rest$4(_a, ["sendMessage"]);
-        var themeVersion = useChatContext('SendButton').themeVersion;
-        return (React__default["default"].createElement("button", __assign$8({ "aria-label": 'Send', className: 'str-chat__send-button', "data-testid": 'send-button', onClick: sendMessage, type: 'button' }, rest), themeVersion === '2' ? React__default["default"].createElement(SendIconV2, null) : React__default["default"].createElement(SendIconV1, null)));
-    };
-
     window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};/**
      * @deprecated This component has been deprecated in favor of `AttachmentPreviewList` as this component
      * utilises outdated components from the package [`react-file-utils`](https://github.com/GetStream/react-file-utils)
@@ -45422,87 +45503,6 @@ var StreamChatReact = (function (exports, React, streamChat, ReactDOM) {
                         themeVersion === '1' && React__default["default"].createElement(React__default["default"].Fragment, null, quotedMessageText))))));
     };
 
-    window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};var useFileState = function (file) {
-        return React.useMemo(function () { return ({
-            failed: file.state === 'failed',
-            finished: file.state === 'finished',
-            uploading: file.state === 'uploading',
-        }); }, [file.state]);
-    };
-
-    window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};var AttachmentPreviewList = function () {
-        var _a = useMessageInputContext('AttachmentPreviewList'), fileOrder = _a.fileOrder, imageOrder = _a.imageOrder;
-        return (React__default["default"].createElement("div", { className: 'str-chat__attachment-preview-list' },
-            React__default["default"].createElement("div", { className: 'str-chat__attachment-list-scroll-container', "data-testid": 'attachment-list-scroll-container' },
-                imageOrder.map(function (id) { return (React__default["default"].createElement(ImagePreviewItem, { id: id, key: id })); }),
-                fileOrder.map(function (id) { return (React__default["default"].createElement(FilePreviewItem, { id: id, key: id })); }))));
-    };
-    var ImagePreviewItem = function (_a) {
-        var _b;
-        var id = _a.id;
-        var _c = useMessageInputContext('ImagePreviewItem'), imageUploads = _c.imageUploads, removeImage = _c.removeImage, uploadImage = _c.uploadImage;
-        var handleRemove = React.useCallback(function (e) {
-            e.stopPropagation();
-            removeImage(id);
-        }, [removeImage, id]);
-        var handleRetry = React.useCallback(function () { return uploadImage(id); }, [uploadImage, id]);
-        var image = imageUploads[id];
-        var state = useFileState(image);
-        // do not display scraped attachments
-        if (!image || image.og_scrape_url)
-            return null;
-        return (React__default["default"].createElement("div", { className: 'str-chat__attachment-preview-image', "data-testid": 'attachment-preview-image' },
-            React__default["default"].createElement("button", { className: 'str-chat__attachment-preview-delete', "data-testid": 'image-preview-item-delete-button', disabled: state.uploading, onClick: handleRemove },
-                React__default["default"].createElement(CloseIcon$1, null)),
-            state.failed && (React__default["default"].createElement("button", { className: 'str-chat__attachment-preview-error str-chat__attachment-preview-error-image', "data-testid": 'image-preview-item-retry-button', onClick: handleRetry },
-                React__default["default"].createElement(RetryIcon, null))),
-            state.uploading && (React__default["default"].createElement("div", { className: 'str-chat__attachment-preview-image-loading' },
-                React__default["default"].createElement(LoadingIndicatorIcon, { size: 17 }))),
-            (image.previewUri || image.url) && (React__default["default"].createElement("img", { alt: image.file.name, className: 'str-chat__attachment-preview-thumbnail', src: (_b = image.previewUri) !== null && _b !== void 0 ? _b : image.url }))));
-    };
-    var FilePreviewItem = function (_a) {
-        var id = _a.id;
-        var _b = useMessageInputContext('FilePreviewItem'), fileUploads = _b.fileUploads, removeFile = _b.removeFile, uploadFile = _b.uploadFile;
-        var handleRemove = React.useCallback(function (e) {
-            e.stopPropagation();
-            removeFile(id);
-        }, [removeFile, id]);
-        var handleRetry = React.useCallback(function () { return uploadFile(id); }, [uploadFile, id]);
-        var file = fileUploads[id];
-        var state = useFileState(file);
-        if (!file)
-            return null;
-        return (React__default["default"].createElement("div", { className: 'str-chat__attachment-preview-file', "data-testid": 'attachment-preview-file' },
-            React__default["default"].createElement("div", { className: 'str-chat__attachment-preview-file-icon' },
-                React__default["default"].createElement(FileIcon, { filename: file.file.name, mimeType: file.file.type, version: '2' })),
-            React__default["default"].createElement("button", { className: 'str-chat__attachment-preview-delete', "data-testid": 'file-preview-item-delete-button', disabled: state.uploading, onClick: handleRemove },
-                React__default["default"].createElement(CloseIcon$1, null)),
-            state.failed && (React__default["default"].createElement("button", { className: 'str-chat__attachment-preview-error str-chat__attachment-preview-error-file', "data-testid": 'file-preview-item-retry-button', onClick: handleRetry },
-                React__default["default"].createElement(RetryIcon, null))),
-            React__default["default"].createElement("div", { className: 'str-chat__attachment-preview-file-end' },
-                React__default["default"].createElement("div", { className: 'str-chat__attachment-preview-file-name' }, file.file.name),
-                state.finished && (React__default["default"].createElement("a", { className: 'str-chat__attachment-preview-file-download', download: true, href: file.url, rel: 'noreferrer', target: '_blank' },
-                    React__default["default"].createElement(DownloadIcon, null))),
-                state.uploading && React__default["default"].createElement(LoadingIndicatorIcon, { size: 17 }))));
-    };
-
-    window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};var CooldownTimer = function (_a) {
-        var cooldownInterval = _a.cooldownInterval, setCooldownRemaining = _a.setCooldownRemaining;
-        var _b = React.useState(cooldownInterval), seconds = _b[0], setSeconds = _b[1];
-        React.useEffect(function () {
-            var countdownInterval = setInterval(function () {
-                if (seconds > 0) {
-                    setSeconds(seconds - 1);
-                }
-                else {
-                    setCooldownRemaining(0);
-                }
-            }, 1000);
-            return function () { return clearInterval(countdownInterval); };
-        });
-        return (React__default["default"].createElement("div", { className: 'str-chat__message-input-cooldown', "data-testid": 'cooldown-timer' }, seconds === 0 ? null : seconds));
-    };
-
     window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};var MessageInputFlat = function () {
         var quotedMessage = useChannelStateContext('MessageInputFlat').quotedMessage;
         var setQuotedMessage = useChannelActionContext('MessageInputFlat').setQuotedMessage;
@@ -48708,6 +48708,8 @@ var StreamChatReact = (function (exports, React, streamChat, ReactDOM) {
 
     window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};
 
+    window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};
+
     window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};var DefaultSearchEmpty = function () {
         var t = useTranslationContext('SearchResults').t;
         return (React__default["default"].createElement("div", { "aria-live": 'polite', className: 'str-chat__channel-search-container-empty' },
@@ -48983,7 +48985,7 @@ var StreamChatReact = (function (exports, React, streamChat, ReactDOM) {
 
     window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};
 
-    window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};var version = '10.1.1';
+    window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};var version = '10.1.2';
 
     window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};var useChat = function (_a) {
         var _b, _c;
@@ -49201,6 +49203,8 @@ var StreamChatReact = (function (exports, React, streamChat, ReactDOM) {
 
     window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};
 
+    window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};
+
     window.StreamChat.StreamChat=StreamChat;window.StreamChat.logChatPromiseExecution=logChatPromiseExecution;window.StreamChat.Channel=Channel;window.ICAL=window.ICAL||{};var UnMemoizedDateSeparator = function (props) {
         var messageCreatedAt = props.date, formatDate = props.formatDate, _a = props.position, position = _a === void 0 ? 'right' : _a, unread = props.unread;
         var _b = useTranslationContext('DateSeparator'), t = _b.t, tDateTimeParser = _b.tDateTimeParser;
@@ -49575,7 +49579,7 @@ var StreamChatReact = (function (exports, React, streamChat, ReactDOM) {
         var t = useTranslationContext('usePinHandler').t;
         var canPin = !!channelCapabilities['pin-message'];
         var handlePin = function (event) { return __awaiter$3(void 0, void 0, void 0, function () {
-            var optimisticMessage, messageResponse, errorMessage, optimisticMessage, messageResponse, errorMessage;
+            var optimisticMessage, errorMessage, optimisticMessage, errorMessage;
             return __generator$3(this, function (_a) {
                 switch (_a.label) {
                     case 0:
@@ -49590,8 +49594,7 @@ var StreamChatReact = (function (exports, React, streamChat, ReactDOM) {
                         updateMessage(optimisticMessage);
                         return [4 /*yield*/, client.pinMessage(message)];
                     case 2:
-                        messageResponse = _a.sent();
-                        updateMessage(messageResponse.message);
+                        _a.sent();
                         return [3 /*break*/, 4];
                     case 3:
                         _a.sent();
@@ -49607,8 +49610,7 @@ var StreamChatReact = (function (exports, React, streamChat, ReactDOM) {
                         updateMessage(optimisticMessage);
                         return [4 /*yield*/, client.unpinMessage(message)];
                     case 6:
-                        messageResponse = _a.sent();
-                        updateMessage(messageResponse.message);
+                        _a.sent();
                         return [3 /*break*/, 8];
                     case 7:
                         _a.sent();
@@ -68727,6 +68729,7 @@ var StreamChatReact = (function (exports, React, streamChat, ReactDOM) {
     exports.Attachment = Attachment;
     exports.AttachmentActions = AttachmentActions;
     exports.AttachmentActionsContainer = AttachmentActionsContainer;
+    exports.AttachmentPreviewList = AttachmentPreviewList;
     exports.AttachmentWithinContainer = AttachmentWithinContainer;
     exports.Audio = Audio;
     exports.AudioContainer = AudioContainer;
@@ -68941,6 +68944,7 @@ var StreamChatReact = (function (exports, React, streamChat, ReactDOM) {
     exports.useChannelEditMessageHandler = useEditMessageHandler;
     exports.useChannelHiddenListener = useChannelHiddenListener;
     exports.useChannelMentionsHandler = useMentionsHandlers;
+    exports.useChannelPreviewInfo = useChannelPreviewInfo;
     exports.useChannelStateContext = useChannelStateContext;
     exports.useChannelTruncatedListener = useChannelTruncatedListener;
     exports.useChannelUpdatedListener = useChannelUpdatedListener;