stream-chat-react 11.17.0 → 11.18.1

package/dist/components/MessageInput/AttachmentPreviewList/VoiceRecordingPreview.js

@@ -0,0 +1,27 @@
+import React from 'react';
+import { PlayButton } from '../../Attachment';
+import { RecordingTimer } from '../../MediaRecorder';
+import { CloseIcon, LoadingIndicatorIcon, RetryIcon } from '../icons';
+import { FileIcon } from '../../ReactFileUtilities';
+import { useAudioController } from '../../Attachment/hooks/useAudioController';
+export var VoiceRecordingPreview = function (_a) {
+    var _b, _c, _d;
+    var attachment = _a.attachment, handleRetry = _a.handleRetry, removeAttachments = _a.removeAttachments;
+    var _e = useAudioController({
+        mimeType: attachment.mime_type,
+    }), audioRef = _e.audioRef, isPlaying = _e.isPlaying, secondsElapsed = _e.secondsElapsed, togglePlay = _e.togglePlay;
+    return (React.createElement("div", { className: 'str-chat__attachment-preview-voice-recording', "data-testid": 'attachment-preview-voice-recording' },
+        React.createElement("audio", { ref: audioRef },
+            React.createElement("source", { "data-testid": 'audio-source', src: attachment.asset_url, type: attachment.mime_type })),
+        React.createElement(PlayButton, { isPlaying: isPlaying, onClick: togglePlay }),
+        React.createElement("button", { className: 'str-chat__attachment-preview-delete', "data-testid": 'file-preview-item-delete-button', disabled: ((_b = attachment.localMetadata) === null || _b === void 0 ? void 0 : _b.uploadState) === 'uploading', onClick: function () { var _a; return ((_a = attachment.localMetadata) === null || _a === void 0 ? void 0 : _a.id) && removeAttachments([attachment.localMetadata.id]); } },
+            React.createElement(CloseIcon, null)),
+        ((_c = attachment.localMetadata) === null || _c === void 0 ? void 0 : _c.uploadState) === 'failed' && !!handleRetry && (React.createElement("button", { className: 'str-chat__attachment-preview-error str-chat__attachment-preview-error-file', "data-testid": 'file-preview-item-retry-button', onClick: function () { return handleRetry(attachment); } },
+            React.createElement(RetryIcon, null))),
+        React.createElement("div", { className: 'str-chat__attachment-preview-metadata' },
+            React.createElement("div", { className: 'str-chat__attachment-preview-file-name', title: attachment.title }, attachment.title),
+            typeof attachment.duration !== 'undefined' && (React.createElement(RecordingTimer, { durationSeconds: secondsElapsed || attachment.duration })),
+            ((_d = attachment.localMetadata) === null || _d === void 0 ? void 0 : _d.uploadState) === 'uploading' && (React.createElement(LoadingIndicatorIcon, { size: 17 }))),
+        React.createElement("div", { className: 'str-chat__attachment-preview-file-icon' },
+            React.createElement(FileIcon, { filename: attachment.title, mimeType: attachment.mime_type, version: '2' }))));
+};

package/dist/components/MessageInput/AttachmentPreviewList/index.d.ts

@@ -0,0 +1,7 @@
+export * from './AttachmentPreviewList';
+export type { FileAttachmentPreviewProps } from './FileAttachmentPreview';
+export type { ImageAttachmentPreviewProps } from './ImageAttachmentPreview';
+export type { AttachmentPreviewProps } from './types';
+export type { UnsupportedAttachmentPreviewProps } from './UnsupportedAttachmentPreview';
+export type { VoiceRecordingPreviewProps } from './VoiceRecordingPreview';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/MessageInput/AttachmentPreviewList/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/MessageInput/AttachmentPreviewList/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC;AACxC,YAAY,EAAE,0BAA0B,EAAE,MAAM,yBAAyB,CAAC;AAC1E,YAAY,EAAE,2BAA2B,EAAE,MAAM,0BAA0B,CAAC;AAC5E,YAAY,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAC;AACtD,YAAY,EAAE,iCAAiC,EAAE,MAAM,gCAAgC,CAAC;AACxF,YAAY,EAAE,0BAA0B,EAAE,MAAM,yBAAyB,CAAC"}

package/dist/components/MessageInput/AttachmentPreviewList/index.js

@@ -0,0 +1 @@
+export * from './AttachmentPreviewList';

package/dist/components/MessageInput/AttachmentPreviewList/types.d.ts

@@ -0,0 +1,8 @@
+import { LocalAttachment } from '../types';
+import type { DefaultStreamChatGenerics } from '../../../types';
+export type AttachmentPreviewProps<A extends LocalAttachment, StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = {
+    attachment: A;
+    handleRetry: (attachment: LocalAttachment<StreamChatGenerics>) => void | Promise<LocalAttachment<StreamChatGenerics> | undefined>;
+    removeAttachments: (ids: string[]) => void;
+};
+//# sourceMappingURL=types.d.ts.map

package/dist/components/MessageInput/AttachmentPreviewList/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/MessageInput/AttachmentPreviewList/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAC3C,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,gBAAgB,CAAC;AAEhE,MAAM,MAAM,sBAAsB,CAChC,CAAC,SAAS,eAAe,EACzB,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E;IACF,UAAU,EAAE,CAAC,CAAC;IACd,WAAW,EAAE,CACX,UAAU,EAAE,eAAe,CAAC,kBAAkB,CAAC,KAC5C,IAAI,GAAG,OAAO,CAAC,eAAe,CAAC,kBAAkB,CAAC,GAAG,SAAS,CAAC,CAAC;IACrE,iBAAiB,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CAC5C,CAAC"}

package/dist/components/MessageInput/AttachmentPreviewList/types.js

@@ -0,0 +1 @@
+export {};

package/dist/components/MessageInput/hooks/useAttachments.d.ts

@@ -1,3 +1,4 @@
+import type { Attachment } from 'stream-chat';
 import type { MessageInputReducerAction, MessageInputState } from './useMessageInputState';
 import type { MessageInputProps } from '../MessageInput';
 import type { LocalAttachment } from '../types';
@@ -6,12 +7,13 @@ import type { CustomTrigger, DefaultStreamChatGenerics } from '../../../types/ty
 export declare const useAttachments: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics, V extends CustomTrigger = CustomTrigger>(props: MessageInputProps<StreamChatGenerics, V>, state: MessageInputState<StreamChatGenerics>, dispatch: import("react").Dispatch<MessageInputReducerAction<StreamChatGenerics>>, textareaRef: React.MutableRefObject<HTMLTextAreaElement | undefined>) => {
     maxFilesLeft: number;
     numberOfUploads: number;
-    removeAttachment: (id: string) => void;
+    removeAttachments: (ids: string[]) => void;
     removeFile: (id: string) => void;
     removeImage: (id: string) => void;
-    uploadAttachment: (att: LocalAttachment<StreamChatGenerics>) => Promise<LocalAttachment<StreamChatGenerics>>;
+    uploadAttachment: (att: LocalAttachment<StreamChatGenerics>) => Promise<LocalAttachment<StreamChatGenerics> | undefined>;
     uploadFile: (id: string) => void;
     uploadImage: (id: string) => Promise<void>;
     uploadNewFiles: (files: FileList | File[] | FileLike[]) => void;
+    upsertAttachments: (attachments: (LocalAttachment<StreamChatGenerics> | Attachment<StreamChatGenerics>)[]) => void;
 };
 //# sourceMappingURL=useAttachments.d.ts.map

package/dist/components/MessageInput/hooks/useAttachments.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useAttachments.d.ts","sourceRoot":"","sources":["../../../../src/components/MessageInput/hooks/useAttachments.ts"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,yBAAyB,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3F,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AACzD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAChD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AACzD,OAAO,KAAK,EAAE,aAAa,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AAIrF,eAAO,MAAM,cAAc,6TAOZ,MAAM,gBAAgB,CAAC,mBAAmB,GAAG,SAAS,CAAC;;;2BA6DtC,MAAM;;;;;;4BA5B1B,QAAQ,GAAG,IAAI,EAAE,GAAG,QAAQ,EAAE;CAuIzC,CAAC"}
+{"version":3,"file":"useAttachments.d.ts","sourceRoot":"","sources":["../../../../src/components/MessageInput/hooks/useAttachments.ts"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,UAAU,EAAuB,MAAM,aAAa,CAAC;AACnE,OAAO,KAAK,EAAE,yBAAyB,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3F,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AACzD,OAAO,KAAK,EAGV,eAAe,EAChB,MAAM,UAAU,CAAC;AAClB,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AACzD,OAAO,KAAK,EAAE,aAAa,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AAsBrF,eAAO,MAAM,cAAc,6TAOZ,MAAM,gBAAgB,CAAC,mBAAmB,GAAG,SAAS,CAAC;;;6BA8D5D,MAAM,EAAE;;;;;;4BA7BN,QAAQ,GAAG,IAAI,EAAE,GAAG,QAAQ,EAAE;;CAgLzC,CAAC"}

package/dist/components/MessageInput/hooks/useAttachments.js

@@ -4,10 +4,18 @@ import { nanoid } from 'nanoid';
 import { useImageUploads } from './useImageUploads';
 import { useFileUploads } from './useFileUploads';
 import { checkUploadPermissions } from './utils';
+import { isLocalAttachment, isLocalImageAttachment, isUploadedImage } from '../../Attachment';
 import { useChannelActionContext, useChannelStateContext, useChatContext, useTranslationContext, } from '../../../context';
 var apiMaxNumberOfFiles = 10;
+var ensureIsLocalAttachment = function (attachment) {
+    if (isLocalAttachment(attachment)) {
+        return attachment;
+    }
+    var localMetadata = attachment.localMetadata, rest = __rest(attachment, ["localMetadata"]);
+    return __assign({ localMetadata: __assign(__assign({}, (localMetadata !== null && localMetadata !== void 0 ? localMetadata : {})), { id: (localMetadata === null || localMetadata === void 0 ? void 0 : localMetadata.id) || nanoid() }) }, rest);
+};
 export var useAttachments = function (props, state, dispatch, textareaRef) {
-    var doFileUploadRequest = props.doFileUploadRequest, errorHandler = props.errorHandler, noFiles = props.noFiles;
+    var doFileUploadRequest = props.doFileUploadRequest, doImageUploadRequest = props.doImageUploadRequest, errorHandler = props.errorHandler, noFiles = props.noFiles;
     var fileUploads = state.fileUploads, imageUploads = state.imageUploads;
     var getAppSettings = useChatContext('useAttachments').getAppSettings;
     var t = useTranslationContext('useAttachments').t;
@@ -55,26 +63,37 @@ export var useAttachments = function (props, state, dispatch, textareaRef) {
     }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [maxFilesLeft, noFiles]);
-    var removeAttachment = function (id) {
-        dispatch({ id: id, type: 'removeAttachment' });
-    };
+    var removeAttachments = useCallback(function (ids) {
+        if (!ids.length)
+            return;
+        dispatch({ ids: ids, type: 'removeAttachments' });
+    }, [dispatch]);
+    var upsertAttachments = useCallback(function (attachments) {
+        if (!attachments.length)
+            return;
+        dispatch({
+            attachments: attachments.map(ensureIsLocalAttachment),
+            type: 'upsertAttachments',
+        });
+    }, [dispatch]);
     var uploadAttachment = useCallback(function (att) { return __awaiter(void 0, void 0, void 0, function () {
-        var $internal, attachment, id, file, canUpload, notificationText, response, uploadedAttachment, error_1, finalError, failedAttachment;
+        var localMetadata, attachment, isImage, id, file, canUpload, notificationText, response, doUploadRequest, error_1, finalError, failedAttachment, uploadedAttachment;
         var _a;
         return __generator(this, function (_b) {
             switch (_b.label) {
                 case 0:
-                    $internal = att.$internal, attachment = __rest(att, ["$internal"]);
-                    if (!($internal === null || $internal === void 0 ? void 0 : $internal.file))
+                    localMetadata = att.localMetadata, attachment = __rest(att, ["localMetadata"]);
+                    if (!(localMetadata === null || localMetadata === void 0 ? void 0 : localMetadata.file))
                         return [2 /*return*/, att];
-                    id = (_a = $internal === null || $internal === void 0 ? void 0 : $internal.id) !== null && _a !== void 0 ? _a : nanoid();
-                    file = $internal.file;
+                    isImage = isUploadedImage(attachment);
+                    id = (_a = localMetadata === null || localMetadata === void 0 ? void 0 : localMetadata.id) !== null && _a !== void 0 ? _a : nanoid();
+                    file = localMetadata.file;
                     return [4 /*yield*/, checkUploadPermissions({
                             addNotification: addNotification,
                             file: file,
                             getAppSettings: getAppSettings,
                             t: t,
-                            uploadType: 'file',
+                            uploadType: isImage ? 'image' : 'file',
                         })];
                 case 1:
                     canUpload = _b.sent();
@@ -84,30 +103,23 @@ export var useAttachments = function (props, state, dispatch, textareaRef) {
                         addNotification(notificationText, 'error');
                         return [2 /*return*/, att];
                     }
-                    dispatch({
-                        attachment: __assign(__assign({}, attachment), { $internal: __assign(__assign({}, $internal), { id: id, uploadState: 'uploading' }) }),
-                        type: 'upsertAttachment',
-                    });
+                    upsertAttachments([
+                        __assign(__assign({}, attachment), { localMetadata: __assign(__assign({}, localMetadata), { id: id, uploadState: 'uploading' }) }),
+                    ]);
                     _b.label = 2;
                 case 2:
                     _b.trys.push([2, 7, , 8]);
-                    response = void 0;
-                    if (!doFileUploadRequest) return [3 /*break*/, 4];
-                    return [4 /*yield*/, doFileUploadRequest(file, channel)];
+                    doUploadRequest = isImage ? doImageUploadRequest : doFileUploadRequest;
+                    if (!doUploadRequest) return [3 /*break*/, 4];
+                    return [4 /*yield*/, doUploadRequest(file, channel)];
                 case 3:
                     response = _b.sent();
                     return [3 /*break*/, 6];
-                case 4: return [4 /*yield*/, channel.sendFile(file)];
+                case 4: return [4 /*yield*/, channel[isImage ? 'sendImage' : 'sendFile'](file)];
                 case 5:
                     response = _b.sent();
                     _b.label = 6;
-                case 6:
-                    uploadedAttachment = __assign(__assign({}, attachment), { $internal: __assign(__assign({}, $internal), { uploadState: 'finished' }), asset_url: response.file });
-                    dispatch({
-                        attachment: uploadedAttachment,
-                        type: 'upsertAttachment',
-                    });
-                    return [2 /*return*/, uploadedAttachment];
+                case 6: return [3 /*break*/, 8];
                 case 7:
                     error_1 = _b.sent();
                     finalError = { message: t('Error uploading attachment'), name: 'Error' };
@@ -119,28 +131,56 @@ export var useAttachments = function (props, state, dispatch, textareaRef) {
                     }
                     console.error(finalError);
                     addNotification(finalError.message, 'error');
-                    failedAttachment = __assign(__assign({}, attachment), { $internal: __assign(__assign({}, $internal), { uploadState: 'failed' }) });
-                    dispatch({
-                        attachment: failedAttachment,
-                        type: 'upsertAttachment',
-                    });
+                    failedAttachment = __assign(__assign({}, attachment), { localMetadata: __assign(__assign({}, localMetadata), { uploadState: 'failed' }) });
+                    upsertAttachments([failedAttachment]);
                     if (errorHandler) {
                         errorHandler(finalError, 'upload-attachment', file);
                     }
                     return [2 /*return*/, failedAttachment];
-                case 8: return [2 /*return*/];
+                case 8:
+                    if (!response) {
+                        // Copied this from useImageUpload / useFileUpload. Not sure how failure could be handled on app level.
+                        // If doUploadRequest returns any falsy value, then don't create the upload preview.
+                        // This is for the case if someone wants to handle failure on app level.
+                        removeAttachments([id]);
+                        return [2 /*return*/];
+                    }
+                    uploadedAttachment = __assign(__assign({}, attachment), { localMetadata: __assign(__assign({}, localMetadata), { uploadState: 'finished' }) });
+                    if (isLocalImageAttachment(uploadedAttachment)) {
+                        if (uploadedAttachment.localMetadata.previewUri) {
+                            URL.revokeObjectURL(uploadedAttachment.localMetadata.previewUri);
+                            delete uploadedAttachment.localMetadata.previewUri;
+                        }
+                        uploadedAttachment.image_url = response.file;
+                    }
+                    else {
+                        uploadedAttachment.asset_url = response.file;
+                    }
+                    upsertAttachments([uploadedAttachment]);
+                    return [2 /*return*/, uploadedAttachment];
             }
         });
-    }); }, [addNotification, channel, doFileUploadRequest, dispatch, errorHandler, getAppSettings, t]);
+    }); }, [
+        addNotification,
+        channel,
+        doFileUploadRequest,
+        doImageUploadRequest,
+        errorHandler,
+        getAppSettings,
+        removeAttachments,
+        t,
+        upsertAttachments,
+    ]);
     return {
         maxFilesLeft: maxFilesLeft,
         numberOfUploads: numberOfUploads,
-        removeAttachment: removeAttachment,
+        removeAttachments: removeAttachments,
         removeFile: removeFile,
         removeImage: removeImage,
         uploadAttachment: uploadAttachment,
         uploadFile: uploadFile,
         uploadImage: uploadImage,
         uploadNewFiles: uploadNewFiles,
+        upsertAttachments: upsertAttachments,
     };
 };

package/dist/components/MessageInput/hooks/useCreateMessageInputContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useCreateMessageInputContext.d.ts","sourceRoot":"","sources":["../../../../src/components/MessageInput/hooks/useCreateMessageInputContext.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,sCAAsC,CAAC;AACrF,OAAO,KAAK,EAAE,aAAa,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AAErF,eAAO,MAAM,4BAA4B,wOAmLxC,CAAC"}
+{"version":3,"file":"useCreateMessageInputContext.d.ts","sourceRoot":"","sources":["../../../../src/components/MessageInput/hooks/useCreateMessageInputContext.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,sCAAsC,CAAC;AACrF,OAAO,KAAK,EAAE,aAAa,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AAErF,eAAO,MAAM,4BAA4B,wOAsLxC,CAAC"}

package/dist/components/MessageInput/hooks/useCreateMessageInputContext.js

@@ -1,6 +1,6 @@
 import { useMemo } from 'react';
 export var useCreateMessageInputContext = function (value) {
-    var additionalTextareaProps = value.additionalTextareaProps, asyncMessagesMultiSendEnabled = value.asyncMessagesMultiSendEnabled, attachments = value.attachments, audioRecordingEnabled = value.audioRecordingEnabled, autocompleteTriggers = value.autocompleteTriggers, cancelURLEnrichment = value.cancelURLEnrichment, clearEditingState = value.clearEditingState, closeCommandsList = value.closeCommandsList, closeMentionsList = value.closeMentionsList, cooldownInterval = value.cooldownInterval, cooldownRemaining = value.cooldownRemaining, disabled = value.disabled, disableMentions = value.disableMentions, dismissLinkPreview = value.dismissLinkPreview, doFileUploadRequest = value.doFileUploadRequest, doImageUploadRequest = value.doImageUploadRequest, emojiSearchIndex = value.emojiSearchIndex, errorHandler = value.errorHandler, fileOrder = value.fileOrder, fileUploads = value.fileUploads, findAndEnqueueURLsToEnrich = value.findAndEnqueueURLsToEnrich, focus = value.focus, grow = value.grow, handleChange = value.handleChange, handleSubmit = value.handleSubmit, hideSendButton = value.hideSendButton, imageOrder = value.imageOrder, imageUploads = value.imageUploads, insertText = value.insertText, isUploadEnabled = value.isUploadEnabled, linkPreviews = value.linkPreviews, maxFilesLeft = value.maxFilesLeft, maxRows = value.maxRows, mentionAllAppUsers = value.mentionAllAppUsers, mentioned_users = value.mentioned_users, mentionQueryParams = value.mentionQueryParams, message = value.message, noFiles = value.noFiles, numberOfUploads = value.numberOfUploads, onPaste = value.onPaste, onSelectUser = value.onSelectUser, openCommandsList = value.openCommandsList, openMentionsList = value.openMentionsList, overrideSubmitHandler = value.overrideSubmitHandler, parent = value.parent, publishTypingEvent = value.publishTypingEvent, recordingController = value.recordingController, removeAttachment = value.removeAttachment, removeFile = value.removeFile, removeImage = value.removeImage, setCooldownRemaining = value.setCooldownRemaining, setText = value.setText, shouldSubmit = value.shouldSubmit, showCommandsList = value.showCommandsList, showMentionsList = value.showMentionsList, text = value.text, textareaRef = value.textareaRef, uploadAttachment = value.uploadAttachment, uploadFile = value.uploadFile, uploadImage = value.uploadImage, uploadNewFiles = value.uploadNewFiles, useMentionsTransliteration = value.useMentionsTransliteration;
+    var additionalTextareaProps = value.additionalTextareaProps, asyncMessagesMultiSendEnabled = value.asyncMessagesMultiSendEnabled, attachments = value.attachments, audioRecordingEnabled = value.audioRecordingEnabled, autocompleteTriggers = value.autocompleteTriggers, cancelURLEnrichment = value.cancelURLEnrichment, clearEditingState = value.clearEditingState, closeCommandsList = value.closeCommandsList, closeMentionsList = value.closeMentionsList, cooldownInterval = value.cooldownInterval, cooldownRemaining = value.cooldownRemaining, disabled = value.disabled, disableMentions = value.disableMentions, dismissLinkPreview = value.dismissLinkPreview, doFileUploadRequest = value.doFileUploadRequest, doImageUploadRequest = value.doImageUploadRequest, emojiSearchIndex = value.emojiSearchIndex, errorHandler = value.errorHandler, fileOrder = value.fileOrder, fileUploads = value.fileUploads, findAndEnqueueURLsToEnrich = value.findAndEnqueueURLsToEnrich, focus = value.focus, grow = value.grow, handleChange = value.handleChange, handleSubmit = value.handleSubmit, hideSendButton = value.hideSendButton, imageOrder = value.imageOrder, imageUploads = value.imageUploads, insertText = value.insertText, isUploadEnabled = value.isUploadEnabled, linkPreviews = value.linkPreviews, maxFilesLeft = value.maxFilesLeft, maxRows = value.maxRows, mentionAllAppUsers = value.mentionAllAppUsers, mentioned_users = value.mentioned_users, mentionQueryParams = value.mentionQueryParams, message = value.message, noFiles = value.noFiles, numberOfUploads = value.numberOfUploads, onPaste = value.onPaste, onSelectUser = value.onSelectUser, openCommandsList = value.openCommandsList, openMentionsList = value.openMentionsList, overrideSubmitHandler = value.overrideSubmitHandler, parent = value.parent, publishTypingEvent = value.publishTypingEvent, recordingController = value.recordingController, removeAttachments = value.removeAttachments, removeFile = value.removeFile, removeImage = value.removeImage, setCooldownRemaining = value.setCooldownRemaining, setText = value.setText, shouldSubmit = value.shouldSubmit, showCommandsList = value.showCommandsList, showMentionsList = value.showMentionsList, text = value.text, textareaRef = value.textareaRef, uploadAttachment = value.uploadAttachment, uploadFile = value.uploadFile, uploadImage = value.uploadImage, uploadNewFiles = value.uploadNewFiles, upsertAttachments = value.upsertAttachments, useMentionsTransliteration = value.useMentionsTransliteration;
     var editing = message === null || message === void 0 ? void 0 : message.editing;
     var fileUploadsValue = Object.entries(fileUploads)
         // eslint-disable-next-line
@@ -67,7 +67,7 @@ export var useCreateMessageInputContext = function (value) {
         parent: parent,
         publishTypingEvent: publishTypingEvent,
         recordingController: recordingController,
-        removeAttachment: removeAttachment,
+        removeAttachments: removeAttachments,
         removeFile: removeFile,
         removeImage: removeImage,
         setCooldownRemaining: setCooldownRemaining,
@@ -81,6 +81,7 @@ export var useCreateMessageInputContext = function (value) {
         uploadFile: uploadFile,
         uploadImage: uploadImage,
         uploadNewFiles: uploadNewFiles,
+        upsertAttachments: upsertAttachments,
         useMentionsTransliteration: useMentionsTransliteration,
     }); }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -104,11 +105,12 @@ export var useCreateMessageInputContext = function (value) {
         parentId,
         publishTypingEvent,
         recordingController,
-        removeAttachment,
+        removeAttachments,
         showCommandsList,
         showMentionsList,
         text,
         uploadAttachment,
+        upsertAttachments,
     ]);
     return messageInputContext;
 };

package/dist/components/MessageInput/hooks/useMessageInputState.d.ts

@@ -1,12 +1,12 @@
 import React from 'react';
 import { EnrichURLsController } from './useLinkPreviews';
 import { RecordingController } from '../../MediaRecorder/hooks/useMediaRecorder';
-import { LocalAttachment, SetLinkPreviewMode } from '../types';
+import { SetLinkPreviewMode } from '../types';
+import type { FileUpload, ImageUpload, LinkPreviewMap, LocalAttachment } from '../types';
 import type { FileLike } from '../../ReactFileUtilities';
-import type { Message, UserResponse } from 'stream-chat';
+import type { Attachment, Message, UserResponse } from 'stream-chat';
 import type { MessageInputProps } from '../MessageInput';
 import type { CustomTrigger, DefaultStreamChatGenerics, SendMessageOptions } from '../../../types/types';
-import type { FileUpload, ImageUpload, LinkPreviewMap } from '../types';
 export type MessageInputState<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = {
     attachments: LocalAttachment<StreamChatGenerics>[];
     fileOrder: string[];
@@ -18,13 +18,13 @@ export type MessageInputState<StreamChatGenerics extends DefaultStreamChatGeneri
     setText: (text: string) => void;
     text: string;
 };
-type UpsertAttachmentAction = {
-    attachment: LocalAttachment;
-    type: 'upsertAttachment';
+type UpsertAttachmentsAction<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = {
+    attachments: LocalAttachment<StreamChatGenerics>[];
+    type: 'upsertAttachments';
 };
-type RemoveAttachmentAction = {
-    id: string;
-    type: 'removeAttachment';
+type RemoveAttachmentsAction = {
+    ids: string[];
+    type: 'removeAttachments';
 };
 type SetTextAction = {
     getNewText: (currentStateText: string) => string;
@@ -66,7 +66,7 @@ type AddMentionedUserAction<StreamChatGenerics extends DefaultStreamChatGenerics
     type: 'addMentionedUser';
     user: UserResponse<StreamChatGenerics>;
 };
-export type MessageInputReducerAction<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = SetTextAction | ClearAction | SetImageUploadAction | SetFileUploadAction | SetLinkPreviewsAction | RemoveImageUploadAction | RemoveFileUploadAction | AddMentionedUserAction<StreamChatGenerics> | UpsertAttachmentAction | RemoveAttachmentAction;
+export type MessageInputReducerAction<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = SetTextAction | ClearAction | SetImageUploadAction | SetFileUploadAction | SetLinkPreviewsAction | RemoveImageUploadAction | RemoveFileUploadAction | AddMentionedUserAction<StreamChatGenerics> | UpsertAttachmentsAction | RemoveAttachmentsAction;
 export type MessageInputHookProps<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = EnrichURLsController & {
     handleChange: React.ChangeEventHandler<HTMLTextAreaElement>;
     handleSubmit: (event?: React.BaseSyntheticEvent, customMessageData?: Partial<Message<StreamChatGenerics>>, options?: SendMessageOptions) => void;
@@ -76,15 +76,16 @@ export type MessageInputHookProps<StreamChatGenerics extends DefaultStreamChatGe
     numberOfUploads: number;
     onPaste: (event: React.ClipboardEvent<HTMLTextAreaElement>) => void;
     onSelectUser: (item: UserResponse<StreamChatGenerics>) => void;
-    recordingController: RecordingController;
-    removeAttachment: (id: string) => void;
+    recordingController: RecordingController<StreamChatGenerics>;
+    removeAttachments: (ids: string[]) => void;
     removeFile: (id: string) => void;
     removeImage: (id: string) => void;
     textareaRef: React.MutableRefObject<HTMLTextAreaElement | null | undefined>;
-    uploadAttachment: (attachment: LocalAttachment<StreamChatGenerics>) => Promise<LocalAttachment<StreamChatGenerics>>;
+    uploadAttachment: (attachment: LocalAttachment<StreamChatGenerics>) => Promise<LocalAttachment<StreamChatGenerics> | undefined>;
     uploadFile: (id: string) => void;
     uploadImage: (id: string) => void;
     uploadNewFiles: (files: FileList | File[]) => void;
+    upsertAttachments: (attachments: (Attachment<StreamChatGenerics> | LocalAttachment<StreamChatGenerics>)[]) => void;
 };
 export type CommandsListState = {
     closeCommandsList: () => void;
@@ -108,15 +109,16 @@ export declare const useMessageInputState: <StreamChatGenerics extends DefaultSt
     numberOfUploads: number;
     onPaste: (event: React.ClipboardEvent<HTMLTextAreaElement>) => void;
     onSelectUser: (item: UserResponse<StreamChatGenerics>) => void;
-    recordingController: RecordingController;
-    removeAttachment: (id: string) => void;
+    recordingController: RecordingController<StreamChatGenerics>;
+    removeAttachments: (ids: string[]) => void;
     removeFile: (id: string) => void;
     removeImage: (id: string) => void;
     textareaRef: React.MutableRefObject<HTMLTextAreaElement | null | undefined>;
-    uploadAttachment: (attachment: LocalAttachment<StreamChatGenerics>) => Promise<LocalAttachment<StreamChatGenerics>>;
+    uploadAttachment: (attachment: LocalAttachment<StreamChatGenerics>) => Promise<LocalAttachment<StreamChatGenerics> | undefined>;
     uploadFile: (id: string) => void;
     uploadImage: (id: string) => void;
     uploadNewFiles: (files: FileList | File[]) => void;
+    upsertAttachments: (attachments: (Attachment<StreamChatGenerics> | LocalAttachment<StreamChatGenerics>)[]) => void;
 } & CommandsListState & MentionsListState;
 export {};
 //# sourceMappingURL=useMessageInputState.d.ts.map

package/dist/components/MessageInput/hooks/useMessageInputState.d.ts.map

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

package/dist/components/MessageInput/hooks/useMessageInputState.js

@@ -82,7 +82,7 @@ var initState = function (message) {
         var type = _a.type;
         return type !== 'file' && type !== 'image';
     }).map(function (att) {
-        return (__assign(__assign({}, att), { $internal: { id: nanoid(), uploadState: 'finished' } }));
+        return (__assign(__assign({}, att), { localMetadata: { id: nanoid() } }));
     })) || [];
     var mentioned_users = message.mentioned_users || [];
     return {
@@ -102,24 +102,28 @@ var initState = function (message) {
  */
 var messageInputReducer = function (state, action) {
     var _a, _b;
-    var _c;
     switch (action.type) {
         case 'setText':
             return __assign(__assign({}, state), { text: action.getNewText(state.text) });
         case 'clear':
             return makeEmptyMessageInputState();
-        case 'upsertAttachment': {
-            var attachmentIndex = state.attachments.findIndex(function (att) { var _a, _b, _c; return ((_a = att.$internal) === null || _a === void 0 ? void 0 : _a.id) && ((_b = att.$internal) === null || _b === void 0 ? void 0 : _b.id) === ((_c = action.attachment.$internal) === null || _c === void 0 ? void 0 : _c.id); });
-            var upsertedAttachment = mergeDeep((_c = state.attachments[attachmentIndex]) !== null && _c !== void 0 ? _c : {}, action.attachment);
-            var attachments = __spreadArray([], state.attachments, true);
-            attachments.splice(attachmentIndex, 1, upsertedAttachment);
-            return __assign(__assign({}, state), { attachments: attachments });
+        case 'upsertAttachments': {
+            var attachments_1 = __spreadArray([], state.attachments, true);
+            action.attachments.forEach(function (actionAttachment) {
+                var _a;
+                var attachmentIndex = state.attachments.findIndex(function (att) { var _a, _b, _c; return ((_a = att.localMetadata) === null || _a === void 0 ? void 0 : _a.id) && ((_b = att.localMetadata) === null || _b === void 0 ? void 0 : _b.id) === ((_c = actionAttachment.localMetadata) === null || _c === void 0 ? void 0 : _c.id); });
+                if (attachmentIndex === -1) {
+                    attachments_1.push(actionAttachment);
+                }
+                else {
+                    var upsertedAttachment = mergeDeep((_a = state.attachments[attachmentIndex]) !== null && _a !== void 0 ? _a : {}, actionAttachment);
+                    attachments_1.splice(attachmentIndex, 1, upsertedAttachment);
+                }
+            });
+            return __assign(__assign({}, state), { attachments: attachments_1 });
         }
-        case 'removeAttachment': {
-            var attachmentIndex = state.attachments.findIndex(function (att) { var _a, _b; return ((_a = att.$internal) === null || _a === void 0 ? void 0 : _a.id) && ((_b = att.$internal) === null || _b === void 0 ? void 0 : _b.id) === action.id; });
-            if (attachmentIndex === -1)
-                return state;
-            return __assign(__assign({}, state), { attachments: __spreadArray([], state.attachments.splice(attachmentIndex, 1), true) });
+        case 'removeAttachments': {
+            return __assign(__assign({}, state), { attachments: state.attachments.filter(function (att) { var _a; return !action.ids.includes((_a = att.localMetadata) === null || _a === void 0 ? void 0 : _a.id); }) });
         }
         case 'setImageUpload': {
             var imageAlreadyExists = state.imageUploads[action.id];
@@ -218,7 +222,7 @@ export var useMessageInputState = function (props) {
         setShowMentionsList(true);
     };
     var closeMentionsList = function () { return setShowMentionsList(false); };
-    var _h = useAttachments(props, state, dispatch, textareaRef), maxFilesLeft = _h.maxFilesLeft, numberOfUploads = _h.numberOfUploads, removeAttachment = _h.removeAttachment, removeFile = _h.removeFile, removeImage = _h.removeImage, uploadAttachment = _h.uploadAttachment, uploadFile = _h.uploadFile, uploadImage = _h.uploadImage, uploadNewFiles = _h.uploadNewFiles;
+    var _h = useAttachments(props, state, dispatch, textareaRef), maxFilesLeft = _h.maxFilesLeft, numberOfUploads = _h.numberOfUploads, removeAttachments = _h.removeAttachments, removeFile = _h.removeFile, removeImage = _h.removeImage, uploadAttachment = _h.uploadAttachment, uploadFile = _h.uploadFile, uploadImage = _h.uploadImage, uploadNewFiles = _h.uploadNewFiles, upsertAttachments = _h.upsertAttachments;
     var handleSubmit = useSubmitHandler(props, state, dispatch, numberOfUploads, enrichURLsController).handleSubmit;
     var recordingController = useMediaRecorder({
         asyncMessagesMultiSendEnabled: asyncMessagesMultiSendEnabled,
@@ -236,5 +240,5 @@ export var useMessageInputState = function (props) {
     var setText = useCallback(function (text) {
         dispatch({ getNewText: function () { return text; }, type: 'setText' });
     }, []);
-    return __assign(__assign(__assign({}, state), enrichURLsController), { closeCommandsList: closeCommandsList, closeMentionsList: closeMentionsList, handleChange: handleChange, handleSubmit: handleSubmit, insertText: insertText, isUploadEnabled: isUploadEnabled, maxFilesLeft: maxFilesLeft, numberOfUploads: numberOfUploads, onPaste: onPaste, onSelectUser: onSelectUser, openCommandsList: openCommandsList, openMentionsList: openMentionsList, recordingController: recordingController, removeAttachment: removeAttachment, removeFile: removeFile, removeImage: removeImage, setText: setText, showCommandsList: showCommandsList, showMentionsList: showMentionsList, textareaRef: textareaRef, uploadAttachment: uploadAttachment, uploadFile: uploadFile, uploadImage: uploadImage, uploadNewFiles: uploadNewFiles });
+    return __assign(__assign(__assign({}, state), enrichURLsController), { closeCommandsList: closeCommandsList, closeMentionsList: closeMentionsList, handleChange: handleChange, handleSubmit: handleSubmit, insertText: insertText, isUploadEnabled: isUploadEnabled, maxFilesLeft: maxFilesLeft, numberOfUploads: numberOfUploads, onPaste: onPaste, onSelectUser: onSelectUser, openCommandsList: openCommandsList, openMentionsList: openMentionsList, recordingController: recordingController, removeAttachments: removeAttachments, removeFile: removeFile, removeImage: removeImage, setText: setText, showCommandsList: showCommandsList, showMentionsList: showMentionsList, textareaRef: textareaRef, uploadAttachment: uploadAttachment, uploadFile: uploadFile, uploadImage: uploadImage, uploadNewFiles: uploadNewFiles, upsertAttachments: upsertAttachments });
 };

package/dist/components/MessageInput/hooks/useSubmitHandler.js

@@ -66,9 +66,9 @@ export var useSubmitHandler = function (props, state, dispatch, numberOfUploads,
             type: getAttachmentTypeFromMime(upload.file.type || ''),
         }); });
         var otherAttachments = attachments
-            .filter(function (att) { var _a; return ((_a = att.$internal) === null || _a === void 0 ? void 0 : _a.uploadState) !== 'failed'; })
+            .filter(function (att) { var _a; return ((_a = att.localMetadata) === null || _a === void 0 ? void 0 : _a.uploadState) !== 'failed'; })
             .map(function (localAttachment) {
-            var _ = localAttachment.$internal, attachment = __rest(localAttachment, ["$internal"]);
+            var _ = localAttachment.localMetadata, attachment = __rest(localAttachment, ["localMetadata"]);
             return attachment;
         });
         return __spreadArray(__spreadArray(__spreadArray([], otherAttachments, true), imageAttachments, true), fileAttachments, true);
@@ -92,7 +92,7 @@ export var useSubmitHandler = function (props, state, dispatch, numberOfUploads,
                         return [2 /*return*/];
                     someAttachmentsUploading = Object.values(imageUploads).some(function (upload) { return upload.state === 'uploading'; }) ||
                         Object.values(fileUploads).some(function (upload) { return upload.state === 'uploading'; }) ||
-                        attachments.some(function (att) { var _a; return ((_a = att.$internal) === null || _a === void 0 ? void 0 : _a.uploadState) === 'uploading'; });
+                        attachments.some(function (att) { var _a; return ((_a = att.localMetadata) === null || _a === void 0 ? void 0 : _a.uploadState) === 'uploading'; });
                     if (someAttachmentsUploading) {
                         return [2 /*return*/, addNotification(t('Wait until all attachments have uploaded'), 'error')];
                     }

package/dist/components/MessageInput/index.d.ts

@@ -1,4 +1,5 @@
 export { AttachmentPreviewList } from './AttachmentPreviewList';
+export type { AttachmentPreviewListProps, FileAttachmentPreviewProps, ImageAttachmentPreviewProps, AttachmentPreviewProps, UnsupportedAttachmentPreviewProps, VoiceRecordingPreviewProps, } from './AttachmentPreviewList';
 export * from './CooldownTimer';
 export * from './DefaultTriggerProvider';
 export * from './EditMessageForm';

package/dist/components/MessageInput/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/MessageInput/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,cAAc,iBAAiB,CAAC;AAChC,cAAc,0BAA0B,CAAC;AACzC,cAAc,mBAAmB,CAAC;AAClC,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,wBAAwB,CAAC;AACvC,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/MessageInput/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,YAAY,EACV,0BAA0B,EAC1B,0BAA0B,EAC1B,2BAA2B,EAC3B,sBAAsB,EACtB,iCAAiC,EACjC,0BAA0B,GAC3B,MAAM,yBAAyB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,0BAA0B,CAAC;AACzC,cAAc,mBAAmB,CAAC;AAClC,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,wBAAwB,CAAC;AACvC,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,SAAS,CAAC"}

package/dist/components/MessageInput/types.d.ts

@@ -1,6 +1,6 @@
 import type { Attachment, DefaultGenerics, ExtendableGenerics, OGAttachment } from 'stream-chat';
 import type { DefaultStreamChatGenerics } from '../../types/types';
-type AttachmentLoadingState = 'uploading' | 'finished' | 'failed';
+export type AttachmentLoadingState = 'uploading' | 'finished' | 'failed';
 export type FileUpload = {
     file: {
         name: string;
@@ -62,31 +62,54 @@ export type VoiceRecordingAttachment<StreamChatGenerics extends ExtendableGeneri
     title?: string;
     waveform_data?: Array<number>;
 };
+type FileAttachment<StreamChatGenerics extends ExtendableGenerics = DefaultGenerics> = Attachment<StreamChatGenerics> & {
+    type: 'file';
+    asset_url?: string;
+    file_size?: number;
+    mime_type?: string;
+    title?: string;
+};
 export type AudioAttachment<StreamChatGenerics extends ExtendableGenerics = DefaultGenerics> = Attachment<StreamChatGenerics> & {
-    asset_url: string;
     type: 'audio';
+    asset_url?: string;
     file_size?: number;
     mime_type?: string;
     title?: string;
 };
 export type VideoAttachment<StreamChatGenerics extends ExtendableGenerics = DefaultGenerics> = Attachment<StreamChatGenerics> & {
-    asset_url: string;
     type: 'video';
+    asset_url?: string;
     mime_type?: string;
     thumb_url?: string;
     title?: string;
 };
-export type AttachmentInternalMetadata = {
+type ImageAttachment<StreamChatGenerics extends ExtendableGenerics = DefaultGenerics> = Attachment<StreamChatGenerics> & {
+    type: 'image';
+    fallback?: string;
+    image_url?: string;
+    original_height?: number;
+    original_width?: number;
+};
+export type BaseLocalAttachmentMetadata = {
     id: string;
+};
+export type LocalAttachmentUploadMetadata = {
     file?: File;
     uploadState?: AttachmentLoadingState;
 };
-type LocalAttachmentCast<T> = T & {
-    $internal: AttachmentInternalMetadata;
+export type LocalImageAttachmentUploadMetadata = LocalAttachmentUploadMetadata & {
+    previewUri?: string;
+};
+export type LocalAttachmentCast<A, L = Record<string, unknown>> = A & {
+    localMetadata: L & BaseLocalAttachmentMetadata;
 };
-export type LocalVoiceRecordingAttachment<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = LocalAttachmentCast<VoiceRecordingAttachment<StreamChatGenerics>>;
-export type LocalAudioAttachment<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = LocalAttachmentCast<AudioAttachment<StreamChatGenerics>>;
-export type LocalVideoAttachment<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = LocalAttachmentCast<VideoAttachment<StreamChatGenerics>>;
-export type LocalAttachment<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = LocalAttachmentCast<Attachment<StreamChatGenerics>> | LocalAudioAttachment<StreamChatGenerics> | LocalVideoAttachment<StreamChatGenerics> | LocalVoiceRecordingAttachment<StreamChatGenerics>;
+export type LocalAttachmentMetadata<CustomLocalMetadata = Record<string, unknown>> = CustomLocalMetadata & BaseLocalAttachmentMetadata & LocalImageAttachmentUploadMetadata;
+export type LocalVoiceRecordingAttachment<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics, CustomLocalMetadata = Record<string, unknown>> = LocalAttachmentCast<VoiceRecordingAttachment<StreamChatGenerics>, LocalAttachmentUploadMetadata & CustomLocalMetadata>;
+export type LocalAudioAttachment<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics, CustomLocalMetadata = Record<string, unknown>> = LocalAttachmentCast<AudioAttachment<StreamChatGenerics>, LocalAttachmentUploadMetadata & CustomLocalMetadata>;
+export type LocalVideoAttachment<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics, CustomLocalMetadata = Record<string, unknown>> = LocalAttachmentCast<VideoAttachment<StreamChatGenerics>, LocalAttachmentUploadMetadata & CustomLocalMetadata>;
+export type LocalImageAttachment<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics, CustomLocalMetadata = Record<string, unknown>> = LocalAttachmentCast<ImageAttachment<StreamChatGenerics>, LocalImageAttachmentUploadMetadata & CustomLocalMetadata>;
+export type LocalFileAttachment<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics, CustomLocalMetadata = Record<string, unknown>> = LocalAttachmentCast<FileAttachment<StreamChatGenerics>, LocalAttachmentUploadMetadata & CustomLocalMetadata>;
+export type AnyLocalAttachment<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics, CustomLocalMetadata = Record<string, unknown>> = LocalAttachmentCast<Attachment<StreamChatGenerics>, LocalAttachmentMetadata<CustomLocalMetadata>>;
+export type LocalAttachment<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = AnyLocalAttachment<StreamChatGenerics> | LocalFileAttachment<StreamChatGenerics> | LocalImageAttachment<StreamChatGenerics> | LocalAudioAttachment<StreamChatGenerics> | LocalVideoAttachment<StreamChatGenerics> | LocalVoiceRecordingAttachment<StreamChatGenerics>;
 export {};
 //# sourceMappingURL=types.d.ts.map