stream-chat-react 11.21.0 → 12.0.0-rc.1

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

@@ -1,22 +1,19 @@
-import { __assign, __rest } from "tslib";
 import { find } from 'linkifyjs';
 import { useCallback, useEffect, useRef } from 'react';
 import debounce from 'lodash.debounce';
 import { useChannelStateContext, useChatContext } from '../../../context';
 import { LinkPreviewState, SetLinkPreviewMode } from '../types';
-export var useLinkPreviews = function (_a) {
-    var _b;
-    var debounceURLEnrichmentMsInputContext = _a.debounceURLEnrichmentMs, dispatch = _a.dispatch, _c = _a.enrichURLForPreview, enrichURLForPreview = _c === void 0 ? false : _c, findURLFnInputContext = _a.findURLFn, linkPreviews = _a.linkPreviews, onLinkPreviewDismissedInputContext = _a.onLinkPreviewDismissed;
-    var client = useChatContext().client;
+export const useLinkPreviews = ({ debounceURLEnrichmentMs: debounceURLEnrichmentMsInputContext, dispatch, enrichURLForPreview = false, findURLFn: findURLFnInputContext, linkPreviews, onLinkPreviewDismissed: onLinkPreviewDismissedInputContext, }) => {
+    const { client } = useChatContext();
     // FIXME: the value of channelConfig is stale due to omitting it from the memoization deps in useCreateChannelStateContext
-    var _d = useChannelStateContext(), channelConfig = _d.channelConfig, debounceURLEnrichmentMsChannelContext = _d.debounceURLEnrichmentMs, findURLFnChannelContext = _d.findURLFn, onLinkPreviewDismissedChannelContext = _d.onLinkPreviewDismissed;
-    var shouldDiscardEnrichQueries = useRef(false);
-    var findURLFn = findURLFnInputContext !== null && findURLFnInputContext !== void 0 ? findURLFnInputContext : findURLFnChannelContext;
-    var onLinkPreviewDismissed = onLinkPreviewDismissedInputContext !== null && onLinkPreviewDismissedInputContext !== void 0 ? onLinkPreviewDismissedInputContext : onLinkPreviewDismissedChannelContext;
-    var debounceURLEnrichmentMs = (_b = debounceURLEnrichmentMsInputContext !== null && debounceURLEnrichmentMsInputContext !== void 0 ? debounceURLEnrichmentMsInputContext : debounceURLEnrichmentMsChannelContext) !== null && _b !== void 0 ? _b : 1500;
-    var dismissLinkPreview = useCallback(function (linkPreview) {
-        onLinkPreviewDismissed === null || onLinkPreviewDismissed === void 0 ? void 0 : onLinkPreviewDismissed(linkPreview);
-        var previewToRemoveMap = new Map();
+    const { channelConfig, debounceURLEnrichmentMs: debounceURLEnrichmentMsChannelContext, findURLFn: findURLFnChannelContext, onLinkPreviewDismissed: onLinkPreviewDismissedChannelContext, } = useChannelStateContext();
+    const shouldDiscardEnrichQueries = useRef(false);
+    const findURLFn = findURLFnInputContext ?? findURLFnChannelContext;
+    const onLinkPreviewDismissed = onLinkPreviewDismissedInputContext ?? onLinkPreviewDismissedChannelContext;
+    const debounceURLEnrichmentMs = debounceURLEnrichmentMsInputContext ?? debounceURLEnrichmentMsChannelContext ?? 1500;
+    const dismissLinkPreview = useCallback((linkPreview) => {
+        onLinkPreviewDismissed?.(linkPreview);
+        const previewToRemoveMap = new Map();
         linkPreview.state = LinkPreviewState.DISMISSED;
         previewToRemoveMap.set(linkPreview.og_scrape_url, linkPreview);
         dispatch({
@@ -28,34 +25,36 @@ export var useLinkPreviews = function (_a) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [onLinkPreviewDismissed]);
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    var findAndEnqueueURLsToEnrich = useCallback(debounce(function (text, mode) {
-        if (mode === void 0) { mode = SetLinkPreviewMode.SET; }
-        var urls = findURLFn
+    const findAndEnqueueURLsToEnrich = useCallback(debounce((text, mode = SetLinkPreviewMode.SET) => {
+        const urls = findURLFn
             ? findURLFn(text)
-            : find(text, 'url').reduce(function (acc, link) {
+            : find(text, 'url').reduce((acc, link) => {
                 if (link.isLink)
                     acc.push(link.href);
                 return acc;
             }, []);
         shouldDiscardEnrichQueries.current = urls.length === 0;
         dispatch({
-            linkPreviews: urls.reduce(function (acc, url) {
+            linkPreviews: urls.reduce((acc, url) => {
                 acc.set(url, { og_scrape_url: url, state: LinkPreviewState.QUEUED });
                 return acc;
             }, new Map()),
-            mode: mode,
+            mode,
             type: 'setLinkPreviews',
         });
     }, debounceURLEnrichmentMs, { leading: false, trailing: true }), [debounceURLEnrichmentMs, shouldDiscardEnrichQueries, findURLFn]);
-    var cancelURLEnrichment = useCallback(function () {
+    const cancelURLEnrichment = useCallback(() => {
         findAndEnqueueURLsToEnrich.cancel();
         findAndEnqueueURLsToEnrich('');
         findAndEnqueueURLsToEnrich.flush();
     }, [findAndEnqueueURLsToEnrich]);
-    useEffect(function () {
-        var enqueuedLinks = Array.from(linkPreviews.values()).reduce(function (acc, linkPreview) {
+    useEffect(() => {
+        const enqueuedLinks = Array.from(linkPreviews.values()).reduce((acc, linkPreview) => {
             if (linkPreview.state === 'queued') {
-                var loadingLinkPreview = __assign(__assign({}, linkPreview), { state: LinkPreviewState.LOADING });
+                const loadingLinkPreview = {
+                    ...linkPreview,
+                    state: LinkPreviewState.LOADING,
+                };
                 acc.set(linkPreview.og_scrape_url, loadingLinkPreview);
             }
             return acc;
@@ -67,25 +66,30 @@ export var useLinkPreviews = function (_a) {
             mode: SetLinkPreviewMode.UPSERT,
             type: 'setLinkPreviews',
         });
-        enqueuedLinks.forEach(function (linkPreview) {
+        enqueuedLinks.forEach((linkPreview) => {
             client
                 .enrichURL(linkPreview.og_scrape_url)
                 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                .then(function (_a) {
-                var duration = _a.duration, ogAttachment = __rest(_a, ["duration"]);
+                .then(({ duration, ...ogAttachment }) => {
                 if (shouldDiscardEnrichQueries.current)
                     return;
-                var linkPreviewsMap = new Map();
-                linkPreviewsMap.set(linkPreview.og_scrape_url, __assign(__assign({}, ogAttachment), { state: LinkPreviewState.LOADED }));
+                const linkPreviewsMap = new Map();
+                linkPreviewsMap.set(linkPreview.og_scrape_url, {
+                    ...ogAttachment,
+                    state: LinkPreviewState.LOADED,
+                });
                 dispatch({
                     linkPreviews: linkPreviewsMap,
                     mode: SetLinkPreviewMode.UPSERT,
                     type: 'setLinkPreviews',
                 });
             })
-                .catch(function () {
-                var linkPreviewsMap = new Map();
-                linkPreviewsMap.set(linkPreview.og_scrape_url, __assign(__assign({}, linkPreview), { state: LinkPreviewState.FAILED }));
+                .catch(() => {
+                const linkPreviewsMap = new Map();
+                linkPreviewsMap.set(linkPreview.og_scrape_url, {
+                    ...linkPreview,
+                    state: LinkPreviewState.FAILED,
+                });
                 dispatch({
                     linkPreviews: linkPreviewsMap,
                     mode: SetLinkPreviewMode.UPSERT,
@@ -96,8 +100,8 @@ export var useLinkPreviews = function (_a) {
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [shouldDiscardEnrichQueries, linkPreviews]);
     return {
-        cancelURLEnrichment: cancelURLEnrichment,
-        dismissLinkPreview: dismissLinkPreview,
-        findAndEnqueueURLsToEnrich: (channelConfig === null || channelConfig === void 0 ? void 0 : channelConfig.url_enrichment) && enrichURLForPreview ? findAndEnqueueURLsToEnrich : undefined,
+        cancelURLEnrichment,
+        dismissLinkPreview,
+        findAndEnqueueURLsToEnrich: channelConfig?.url_enrichment && enrichURLForPreview ? findAndEnqueueURLsToEnrich : undefined,
     };
 };

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

@@ -100,25 +100,5 @@ export type MentionsListState = {
 /**
  * hook for MessageInput state
  */
-export declare const useMessageInputState: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics, V extends CustomTrigger = CustomTrigger>(props: MessageInputProps<StreamChatGenerics, V>) => MessageInputState<StreamChatGenerics> & EnrichURLsController & {
-    handleChange: React.ChangeEventHandler<HTMLTextAreaElement>;
-    handleSubmit: (event?: React.BaseSyntheticEvent, customMessageData?: Partial<Message<StreamChatGenerics>> | undefined, options?: SendMessageOptions) => void;
-    insertText: (textToInsert: string) => void;
-    isUploadEnabled: boolean;
-    maxFilesLeft: number;
-    numberOfUploads: number;
-    onPaste: (event: React.ClipboardEvent<HTMLTextAreaElement>) => void;
-    onSelectUser: (item: UserResponse<StreamChatGenerics>) => 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> | undefined>;
-    uploadFile: (id: string) => void;
-    uploadImage: (id: string) => void;
-    uploadNewFiles: (files: FileList | File[]) => void;
-    upsertAttachments: (attachments: (Attachment<StreamChatGenerics> | LocalAttachment<StreamChatGenerics>)[]) => void;
-} & CommandsListState & MentionsListState;
+export declare const useMessageInputState: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics, V extends CustomTrigger = CustomTrigger>(props: MessageInputProps<StreamChatGenerics, V>) => MessageInputState<StreamChatGenerics> & MessageInputHookProps<StreamChatGenerics> & CommandsListState & MentionsListState;
 export {};
-//# sourceMappingURL=useMessageInputState.d.ts.map

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

@@ -1,4 +1,3 @@
-import { __assign, __spreadArray } from "tslib";
 import { useCallback, useReducer, useState } from 'react';
 import { nanoid } from 'nanoid';
 import { useChannelStateContext } from '../../../context/ChannelStateContext';
@@ -10,7 +9,7 @@ import { usePasteHandler } from './usePasteHandler';
 import { useMediaRecorder } from '../../MediaRecorder/hooks/useMediaRecorder';
 import { LinkPreviewState, SetLinkPreviewMode } from '../types';
 import { mergeDeep } from '../../../utils/mergeDeep';
-var makeEmptyMessageInputState = function () { return ({
+const makeEmptyMessageInputState = () => ({
     attachments: [],
     fileOrder: [],
     fileUploads: {},
@@ -18,173 +17,203 @@ var makeEmptyMessageInputState = function () { return ({
     imageUploads: {},
     linkPreviews: new Map(),
     mentioned_users: [],
-    setText: function () { return null; },
+    setText: () => null,
     text: '',
-}); };
+});
 /**
  * Initializes the state. Empty if the message prop is falsy.
  */
-var initState = function (message) {
-    var _a, _b, _c, _d, _e, _f, _g;
+const initState = (message) => {
     if (!message) {
         return makeEmptyMessageInputState();
     }
     // if message prop is defined, get image uploads, file uploads, text, etc.
-    var imageUploads = (_b = (_a = message.attachments) === null || _a === void 0 ? void 0 : _a.filter(function (_a) {
-        var type = _a.type;
-        return type === 'image';
-    }).reduce(function (acc, _a) {
-        var author_name = _a.author_name, _b = _a.fallback, fallback = _b === void 0 ? '' : _b, image_url = _a.image_url, og_scrape_url = _a.og_scrape_url, text = _a.text, title = _a.title, title_link = _a.title_link;
-        var id = nanoid();
+    const imageUploads = message.attachments
+        ?.filter(({ type }) => type === 'image')
+        .reduce((acc, { author_name, fallback = '', image_url, og_scrape_url, text, title, title_link }) => {
+        const id = nanoid();
         acc[id] = {
-            author_name: author_name,
+            author_name,
             file: {
                 name: fallback,
             },
-            id: id,
-            og_scrape_url: og_scrape_url,
+            id,
+            og_scrape_url, // fixme: why scraped content is mixed with uploaded content?
             state: 'finished',
-            text: text,
-            title: title,
-            title_link: title_link,
+            text,
+            title,
+            title_link,
             url: image_url,
         };
         return acc;
-    }, {})) !== null && _b !== void 0 ? _b : {};
-    var fileUploads = (_d = (_c = message.attachments) === null || _c === void 0 ? void 0 : _c.filter(function (_a) {
-        var type = _a.type;
-        return type === 'file';
-    }).reduce(function (acc, _a) {
-        var asset_url = _a.asset_url, file_size = _a.file_size, mime_type = _a.mime_type, thumb_url = _a.thumb_url, _b = _a.title, title = _b === void 0 ? '' : _b;
-        var id = nanoid();
+    }, {}) ?? {};
+    const fileUploads = message.attachments
+        ?.filter(({ type }) => type === 'file')
+        .reduce((acc, { asset_url, file_size, mime_type, thumb_url, title = '' }) => {
+        const id = nanoid();
         acc[id] = {
             file: {
                 name: title,
                 size: file_size,
                 type: mime_type,
             },
-            id: id,
+            id,
             state: 'finished',
-            thumb_url: thumb_url,
+            thumb_url,
             url: asset_url,
         };
         return acc;
-    }, {})) !== null && _d !== void 0 ? _d : {};
-    var linkPreviews = (_f = (_e = message.attachments) === null || _e === void 0 ? void 0 : _e.reduce(function (acc, attachment) {
+    }, {}) ?? {};
+    const linkPreviews = message.attachments?.reduce((acc, attachment) => {
         if (!attachment.og_scrape_url)
             return acc;
-        acc.set(attachment.og_scrape_url, __assign(__assign({}, attachment), { state: LinkPreviewState.LOADED }));
+        acc.set(attachment.og_scrape_url, {
+            ...attachment,
+            state: LinkPreviewState.LOADED,
+        });
         return acc;
-    }, new Map())) !== null && _f !== void 0 ? _f : new Map();
-    var imageOrder = Object.keys(imageUploads);
-    var fileOrder = Object.keys(fileUploads);
-    var attachments = ((_g = message.attachments) === null || _g === void 0 ? void 0 : _g.filter(function (_a) {
-        var type = _a.type;
-        return type !== 'file' && type !== 'image';
-    }).map(function (att) {
-        return (__assign(__assign({}, att), { localMetadata: { id: nanoid() } }));
+    }, new Map()) ?? new Map();
+    const imageOrder = Object.keys(imageUploads);
+    const fileOrder = Object.keys(fileUploads);
+    const attachments = message.attachments
+        ?.filter(({ type }) => type !== 'file' && type !== 'image')
+        .map((att) => ({
+        ...att,
+        localMetadata: { id: nanoid() },
     })) || [];
-    var mentioned_users = message.mentioned_users || [];
+    const mentioned_users = message.mentioned_users || [];
     return {
-        attachments: attachments,
-        fileOrder: fileOrder,
-        fileUploads: fileUploads,
-        imageOrder: imageOrder,
-        imageUploads: imageUploads,
-        linkPreviews: linkPreviews,
-        mentioned_users: mentioned_users,
-        setText: function () { return null; },
+        attachments,
+        fileOrder,
+        fileUploads,
+        imageOrder,
+        imageUploads,
+        linkPreviews,
+        mentioned_users,
+        setText: () => null,
         text: message.text || '',
     };
 };
 /**
  * MessageInput state reducer
  */
-var messageInputReducer = function (state, action) {
-    var _a, _b;
+const messageInputReducer = (state, action) => {
     switch (action.type) {
         case 'setText':
-            return __assign(__assign({}, state), { text: action.getNewText(state.text) });
+            return { ...state, text: action.getNewText(state.text) };
         case 'clear':
             return makeEmptyMessageInputState();
         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); });
+            const attachments = [...state.attachments];
+            action.attachments.forEach((actionAttachment) => {
+                const attachmentIndex = state.attachments.findIndex((att) => att.localMetadata?.id && att.localMetadata?.id === actionAttachment.localMetadata?.id);
                 if (attachmentIndex === -1) {
-                    attachments_1.push(actionAttachment);
+                    attachments.push(actionAttachment);
                 }
                 else {
-                    var upsertedAttachment = mergeDeep((_a = state.attachments[attachmentIndex]) !== null && _a !== void 0 ? _a : {}, actionAttachment);
-                    attachments_1.splice(attachmentIndex, 1, upsertedAttachment);
+                    const upsertedAttachment = mergeDeep(state.attachments[attachmentIndex] ?? {}, actionAttachment);
+                    attachments.splice(attachmentIndex, 1, upsertedAttachment);
                 }
             });
-            return __assign(__assign({}, state), { attachments: attachments_1 });
+            return {
+                ...state,
+                attachments,
+            };
         }
         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); }) });
+            return {
+                ...state,
+                attachments: state.attachments.filter((att) => !action.ids.includes(att.localMetadata?.id)),
+            };
         }
         case 'setImageUpload': {
-            var imageAlreadyExists = state.imageUploads[action.id];
+            const imageAlreadyExists = state.imageUploads[action.id];
             if (!imageAlreadyExists && !action.file)
                 return state;
-            var imageOrder = imageAlreadyExists ? state.imageOrder : state.imageOrder.concat(action.id);
-            var newUploadFields = __assign({}, action);
+            const imageOrder = imageAlreadyExists ? state.imageOrder : state.imageOrder.concat(action.id);
+            const newUploadFields = { ...action };
             delete newUploadFields.type;
-            return __assign(__assign({}, state), { imageOrder: imageOrder, imageUploads: __assign(__assign({}, state.imageUploads), (_a = {}, _a[action.id] = __assign(__assign({}, state.imageUploads[action.id]), newUploadFields), _a)) });
+            return {
+                ...state,
+                imageOrder,
+                imageUploads: {
+                    ...state.imageUploads,
+                    [action.id]: { ...state.imageUploads[action.id], ...newUploadFields },
+                },
+            };
         }
         case 'setFileUpload': {
-            var fileAlreadyExists = state.fileUploads[action.id];
+            const fileAlreadyExists = state.fileUploads[action.id];
             if (!fileAlreadyExists && !action.file)
                 return state;
-            var fileOrder = fileAlreadyExists ? state.fileOrder : state.fileOrder.concat(action.id);
-            var newUploadFields = __assign({}, action);
+            const fileOrder = fileAlreadyExists ? state.fileOrder : state.fileOrder.concat(action.id);
+            const newUploadFields = { ...action };
             delete newUploadFields.type;
-            return __assign(__assign({}, state), { fileOrder: fileOrder, fileUploads: __assign(__assign({}, state.fileUploads), (_b = {}, _b[action.id] = __assign(__assign({}, state.fileUploads[action.id]), newUploadFields), _b)) });
+            return {
+                ...state,
+                fileOrder,
+                fileUploads: {
+                    ...state.fileUploads,
+                    [action.id]: { ...state.fileUploads[action.id], ...newUploadFields },
+                },
+            };
         }
         case 'setLinkPreviews': {
-            var linkPreviews_1 = new Map(state.linkPreviews);
+            const linkPreviews = new Map(state.linkPreviews);
             if (action.mode === SetLinkPreviewMode.REMOVE) {
-                Array.from(action.linkPreviews.keys()).forEach(function (key) {
-                    linkPreviews_1.delete(key);
+                Array.from(action.linkPreviews.keys()).forEach((key) => {
+                    linkPreviews.delete(key);
                 });
             }
             else {
-                Array.from(action.linkPreviews.values()).reduce(function (acc, linkPreview) {
-                    var existingPreview = acc.get(linkPreview.og_scrape_url);
-                    var alreadyEnqueued = linkPreview.state === LinkPreviewState.QUEUED &&
-                        (existingPreview === null || existingPreview === void 0 ? void 0 : existingPreview.state) !== LinkPreviewState.FAILED;
+                Array.from(action.linkPreviews.values()).reduce((acc, linkPreview) => {
+                    const existingPreview = acc.get(linkPreview.og_scrape_url);
+                    const alreadyEnqueued = linkPreview.state === LinkPreviewState.QUEUED &&
+                        existingPreview?.state !== LinkPreviewState.FAILED;
                     if (existingPreview && alreadyEnqueued)
                         return acc;
                     acc.set(linkPreview.og_scrape_url, linkPreview);
                     return acc;
-                }, linkPreviews_1);
+                }, linkPreviews);
                 if (action.mode === SetLinkPreviewMode.SET) {
-                    Array.from(state.linkPreviews.keys()).forEach(function (key) {
+                    Array.from(state.linkPreviews.keys()).forEach((key) => {
                         if (!action.linkPreviews.get(key))
-                            linkPreviews_1.delete(key);
+                            linkPreviews.delete(key);
                     });
                 }
             }
-            return __assign(__assign({}, state), { linkPreviews: linkPreviews_1 });
+            return {
+                ...state,
+                linkPreviews,
+            };
         }
         case 'removeImageUpload': {
             if (!state.imageUploads[action.id])
                 return state; // cannot remove anything
-            var newImageUploads = __assign({}, state.imageUploads);
+            const newImageUploads = { ...state.imageUploads };
             delete newImageUploads[action.id];
-            return __assign(__assign({}, state), { imageOrder: state.imageOrder.filter(function (_id) { return _id !== action.id; }), imageUploads: newImageUploads });
+            return {
+                ...state,
+                imageOrder: state.imageOrder.filter((_id) => _id !== action.id),
+                imageUploads: newImageUploads,
+            };
         }
         case 'removeFileUpload': {
             if (!state.fileUploads[action.id])
                 return state; // cannot remove anything
-            var newFileUploads = __assign({}, state.fileUploads);
+            const newFileUploads = { ...state.fileUploads };
             delete newFileUploads[action.id];
-            return __assign(__assign({}, state), { fileOrder: state.fileOrder.filter(function (_id) { return _id !== action.id; }), fileUploads: newFileUploads });
+            return {
+                ...state,
+                fileOrder: state.fileOrder.filter((_id) => _id !== action.id),
+                fileUploads: newFileUploads,
+            };
         }
         case 'addMentionedUser':
-            return __assign(__assign({}, state), { mentioned_users: state.mentioned_users.concat(action.user) });
+            return {
+                ...state,
+                mentioned_users: state.mentioned_users.concat(action.user),
+            };
         default:
             return state;
     }
@@ -192,53 +221,84 @@ var messageInputReducer = function (state, action) {
 /**
  * hook for MessageInput state
  */
-export var useMessageInputState = function (props) {
-    var _a;
-    var additionalTextareaProps = props.additionalTextareaProps, asyncMessagesMultiSendEnabled = props.asyncMessagesMultiSendEnabled, audioRecordingConfig = props.audioRecordingConfig, audioRecordingEnabled = props.audioRecordingEnabled, getDefaultValue = props.getDefaultValue, message = props.message, urlEnrichmentConfig = props.urlEnrichmentConfig;
-    var _b = useChannelStateContext('useMessageInputState'), _c = _b.channelCapabilities, channelCapabilities = _c === void 0 ? {} : _c, channelConfig = _b.channelConfig, enrichURLForPreviewChannelContext = _b.enrichURLForPreview;
-    var defaultValue = (getDefaultValue === null || getDefaultValue === void 0 ? void 0 : getDefaultValue()) || (additionalTextareaProps === null || additionalTextareaProps === void 0 ? void 0 : additionalTextareaProps.defaultValue);
-    var initialStateValue = message ||
+export const useMessageInputState = (props) => {
+    const { additionalTextareaProps, asyncMessagesMultiSendEnabled, audioRecordingConfig, audioRecordingEnabled, getDefaultValue, message, urlEnrichmentConfig, } = props;
+    const { channelCapabilities = {}, enrichURLForPreview: enrichURLForPreviewChannelContext, } = useChannelStateContext('useMessageInputState');
+    const defaultValue = getDefaultValue?.() || additionalTextareaProps?.defaultValue;
+    const initialStateValue = message ||
         (Array.isArray(defaultValue)
             ? { text: defaultValue.join('') }
-            : { text: defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.toString() });
-    var _d = useReducer(messageInputReducer, initialStateValue, initState), state = _d[0], dispatch = _d[1];
-    var enrichURLsController = useLinkPreviews(__assign(__assign({ dispatch: dispatch, linkPreviews: state.linkPreviews }, urlEnrichmentConfig), { enrichURLForPreview: (_a = urlEnrichmentConfig === null || urlEnrichmentConfig === void 0 ? void 0 : urlEnrichmentConfig.enrichURLForPreview) !== null && _a !== void 0 ? _a : enrichURLForPreviewChannelContext }));
-    var _e = useMessageInputText(props, state, dispatch, enrichURLsController.findAndEnqueueURLsToEnrich), handleChange = _e.handleChange, insertText = _e.insertText, textareaRef = _e.textareaRef;
-    var _f = useState(false), showCommandsList = _f[0], setShowCommandsList = _f[1];
-    var _g = useState(false), showMentionsList = _g[0], setShowMentionsList = _g[1];
-    var openCommandsList = function () {
+            : { text: defaultValue?.toString() });
+    const [state, dispatch] = useReducer(messageInputReducer, initialStateValue, initState);
+    const enrichURLsController = useLinkPreviews({
+        dispatch,
+        linkPreviews: state.linkPreviews,
+        ...urlEnrichmentConfig,
+        enrichURLForPreview: urlEnrichmentConfig?.enrichURLForPreview ?? enrichURLForPreviewChannelContext,
+    });
+    const { handleChange, insertText, textareaRef } = useMessageInputText(props, state, dispatch, enrichURLsController.findAndEnqueueURLsToEnrich);
+    const [showCommandsList, setShowCommandsList] = useState(false);
+    const [showMentionsList, setShowMentionsList] = useState(false);
+    const openCommandsList = () => {
         dispatch({
-            getNewText: function () { return '/'; },
+            getNewText: () => '/',
             type: 'setText',
         });
         setShowCommandsList(true);
     };
-    var closeCommandsList = function () { return setShowCommandsList(false); };
-    var openMentionsList = function () {
+    const closeCommandsList = () => setShowCommandsList(false);
+    const openMentionsList = () => {
         dispatch({
-            getNewText: function (currentText) { return currentText + '@'; },
+            getNewText: (currentText) => currentText + '@',
             type: 'setText',
         });
         setShowMentionsList(true);
     };
-    var closeMentionsList = function () { return setShowMentionsList(false); };
-    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,
+    const closeMentionsList = () => setShowMentionsList(false);
+    const { maxFilesLeft, numberOfUploads, removeAttachments, removeFile, removeImage, uploadAttachment, uploadFile, uploadImage, uploadNewFiles, upsertAttachments, } = useAttachments(props, state, dispatch, textareaRef);
+    const { handleSubmit } = useSubmitHandler(props, state, dispatch, numberOfUploads, enrichURLsController);
+    const recordingController = useMediaRecorder({
+        asyncMessagesMultiSendEnabled,
         enabled: !!audioRecordingEnabled,
-        handleSubmit: handleSubmit,
+        handleSubmit,
         recordingConfig: audioRecordingConfig,
-        uploadAttachment: uploadAttachment,
+        uploadAttachment,
     });
-    // todo: remove the check for channelConfig?.uploads
-    var isUploadEnabled = (channelConfig === null || channelConfig === void 0 ? void 0 : channelConfig.uploads) !== false && channelCapabilities['upload-file'] !== false;
-    var onPaste = usePasteHandler(uploadNewFiles, insertText, isUploadEnabled, enrichURLsController.findAndEnqueueURLsToEnrich).onPaste;
-    var onSelectUser = useCallback(function (item) {
+    const isUploadEnabled = !!channelCapabilities['upload-file'];
+    const { onPaste } = usePasteHandler(uploadNewFiles, insertText, isUploadEnabled, enrichURLsController.findAndEnqueueURLsToEnrich);
+    const onSelectUser = useCallback((item) => {
         dispatch({ type: 'addMentionedUser', user: item });
     }, []);
-    var setText = useCallback(function (text) {
-        dispatch({ getNewText: function () { return text; }, type: 'setText' });
+    const setText = useCallback((text) => {
+        dispatch({ getNewText: () => 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, removeAttachments: removeAttachments, removeFile: removeFile, removeImage: removeImage, setText: setText, showCommandsList: showCommandsList, showMentionsList: showMentionsList, textareaRef: textareaRef, uploadAttachment: uploadAttachment, uploadFile: uploadFile, uploadImage: uploadImage, uploadNewFiles: uploadNewFiles, upsertAttachments: upsertAttachments });
+    return {
+        ...state,
+        ...enrichURLsController,
+        closeCommandsList,
+        closeMentionsList,
+        handleChange,
+        handleSubmit,
+        insertText,
+        isUploadEnabled,
+        maxFilesLeft,
+        numberOfUploads,
+        onPaste,
+        onSelectUser,
+        openCommandsList,
+        openMentionsList,
+        recordingController,
+        removeAttachments,
+        removeFile,
+        removeImage,
+        setText,
+        showCommandsList,
+        showMentionsList,
+        textareaRef,
+        uploadAttachment,
+        uploadFile,
+        uploadImage,
+        uploadNewFiles,
+        upsertAttachments,
+    };
 };

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

@@ -1,10 +1,10 @@
+/// <reference types="react" />
 import type { MessageInputReducerAction, MessageInputState } from './useMessageInputState';
 import type { MessageInputProps } from '../MessageInput';
 import type { CustomTrigger, DefaultStreamChatGenerics } from '../../../types/types';
 import type { EnrichURLsController } from './useLinkPreviews';
-export declare const useMessageInputText: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics, V extends CustomTrigger = CustomTrigger>(props: MessageInputProps<StreamChatGenerics, V>, state: MessageInputState<StreamChatGenerics>, dispatch: import("react").Dispatch<MessageInputReducerAction<StreamChatGenerics>>, findAndEnqueueURLsToEnrich?: EnrichURLsController['findAndEnqueueURLsToEnrich']) => {
+export declare const useMessageInputText: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics, V extends CustomTrigger = CustomTrigger>(props: MessageInputProps<StreamChatGenerics, V>, state: MessageInputState<StreamChatGenerics>, dispatch: React.Dispatch<MessageInputReducerAction<StreamChatGenerics>>, findAndEnqueueURLsToEnrich?: EnrichURLsController['findAndEnqueueURLsToEnrich']) => {
     handleChange: import("react").ChangeEventHandler<HTMLTextAreaElement>;
     insertText: (textToInsert: string) => void;
     textareaRef: import("react").MutableRefObject<HTMLTextAreaElement | undefined>;
 };
-//# sourceMappingURL=useMessageInputText.d.ts.map