stream-chat-react 13.0.0-rc.2 → 13.0.0

package/dist/index.browser.cjs

@@ -17666,11 +17666,11 @@ __export(src_exports, {
 module.exports = __toCommonJS(src_exports);
 
 // src/components/Attachment/Attachment.tsx
-var import_react254 = __toESM(require("react"));
+var import_react255 = __toESM(require("react"));
 var import_stream_chat10 = require("stream-chat");
 
 // src/components/Attachment/AttachmentContainer.tsx
-var import_react253 = __toESM(require("react"));
+var import_react254 = __toESM(require("react"));
 var import_react_player2 = __toESM(require("react-player"));
 var import_clsx65 = __toESM(require("clsx"));
 var linkify = __toESM(require("linkifyjs"));
@@ -18915,7 +18915,7 @@ var UnMemoizedAudio = (props) => {
 var Audio = import_react29.default.memo(UnMemoizedAudio);
 
 // src/components/Attachment/VoiceRecording.tsx
-var import_react249 = __toESM(require("react"));
+var import_react250 = __toESM(require("react"));
 
 // src/components/ReactFileUtilities/FileIcon/FileIcon.tsx
 var import_react31 = __toESM(require("react"));
@@ -19878,7 +19878,7 @@ var FileIcon = (props) => {
 // src/components/ReactFileUtilities/UploadButton.tsx
 var import_clsx63 = __toESM(require("clsx"));
 var import_nanoid5 = require("nanoid");
-var import_react248 = __toESM(require("react"));
+var import_react249 = __toESM(require("react"));
 
 // src/components/ReactFileUtilities/utils.ts
 var import_react32 = require("react");
@@ -47796,49 +47796,17 @@ var useCooldownTimer = () => {
   };
 };
 
-// src/components/MessageInput/hooks/useMessageInputText.ts
+// src/components/MessageInput/hooks/useTextareaRef.ts
 var import_react224 = require("react");
-var messageComposerStateSelector = (state) => ({
-  text: state.text
-});
-var useMessageInputText = (props) => {
+var useTextareaRef = (props) => {
   const { focus } = props;
-  const messageComposer = useMessageComposer();
   const textareaRef = (0, import_react224.useRef)(void 0);
-  const { text: text8 } = useStateStore(
-    messageComposer.textComposer.state,
-    messageComposerStateSelector
-  );
   (0, import_react224.useEffect)(() => {
     if (focus && textareaRef.current) {
       textareaRef.current.focus();
     }
   }, [focus]);
-  const newCursorPosition = (0, import_react224.useRef)(void 0);
-  const insertText = (0, import_react224.useCallback)(
-    (textToInsert) => {
-      const selection = textareaRef?.current && {
-        end: textareaRef.current.selectionEnd,
-        start: textareaRef.current.selectionStart
-      };
-      messageComposer.textComposer.insertText({
-        selection,
-        text: textToInsert
-      });
-      if (selection) newCursorPosition.current = selection.start + textToInsert.length;
-    },
-    [messageComposer, newCursorPosition, textareaRef]
-  );
-  (0, import_react224.useEffect)(() => {
-    const textareaElement = textareaRef.current;
-    if (textareaElement && newCursorPosition.current !== void 0) {
-      textareaElement.selectionStart = newCursorPosition.current;
-      textareaElement.selectionEnd = newCursorPosition.current;
-      newCursorPosition.current = void 0;
-    }
-  }, [text8, newCursorPosition]);
   return {
-    insertText,
     textareaRef
   };
 };
@@ -47898,8 +47866,8 @@ var useSubmitHandler = (props) => {
 
 // src/components/MessageInput/hooks/usePasteHandler.ts
 var import_react226 = require("react");
-var usePasteHandler = (insertText) => {
-  const { attachmentManager } = useMessageComposer();
+var usePasteHandler = () => {
+  const { attachmentManager, textComposer } = useMessageComposer();
   const onPaste = (0, import_react226.useCallback)(
     (clipboardEvent) => {
       (async (event) => {
@@ -47920,13 +47888,13 @@ var usePasteHandler = (insertText) => {
         const fileLikes = await dataTransferItemsToFiles(Array.from(items));
         if (plainTextPromise) {
           const pastedText = await plainTextPromise;
-          insertText(pastedText);
+          textComposer.insertText({ text: pastedText });
         } else {
           attachmentManager.uploadFiles(fileLikes);
         }
       })(clipboardEvent);
     },
-    [attachmentManager, insertText]
+    [attachmentManager, textComposer]
   );
   return { onPaste };
 };
@@ -47995,7 +47963,7 @@ var useMediaRecorder = ({
 // src/components/MessageInput/hooks/useMessageInputControls.ts
 var useMessageInputControls = (props) => {
   const { asyncMessagesMultiSendEnabled, audioRecordingConfig, audioRecordingEnabled } = props;
-  const { insertText, textareaRef } = useMessageInputText(props);
+  const { textareaRef } = useTextareaRef(props);
   const { handleSubmit } = useSubmitHandler(props);
   const recordingController = useMediaRecorder({
     asyncMessagesMultiSendEnabled,
@@ -48003,10 +47971,9 @@ var useMessageInputControls = (props) => {
     handleSubmit,
     recordingConfig: audioRecordingConfig
   });
-  const { onPaste } = usePasteHandler(insertText);
+  const { onPaste } = usePasteHandler();
   return {
     handleSubmit,
-    insertText,
     onPaste,
     recordingController,
     textareaRef
@@ -48138,13 +48105,13 @@ var CooldownTimer = ({ cooldownInterval }) => {
 };
 
 // src/components/MessageInput/EditMessageForm.tsx
-var import_react247 = __toESM(require("react"));
+var import_react248 = __toESM(require("react"));
 
 // src/components/MessageInput/MessageInput.tsx
-var import_react246 = __toESM(require("react"));
+var import_react247 = __toESM(require("react"));
 
 // src/components/MessageInput/MessageInputFlat.tsx
-var import_react244 = __toESM(require("react"));
+var import_react245 = __toESM(require("react"));
 
 // src/components/MessageInput/SendButton.tsx
 var import_react231 = __toESM(require("react"));
@@ -48267,7 +48234,7 @@ var linkPreviewsManagerStateSelector = (state) => ({
     (preview) => import_stream_chat9.LinkPreviewsManager.previewIsLoaded(preview) || import_stream_chat9.LinkPreviewsManager.previewIsLoading(preview)
   )
 });
-var messageComposerStateSelector2 = (state) => ({
+var messageComposerStateSelector = (state) => ({
   quotedMessage: state.quotedMessage
 });
 var LinkPreviewList = () => {
@@ -48275,7 +48242,7 @@ var LinkPreviewList = () => {
   const { linkPreviewsManager } = messageComposer;
   const { quotedMessage } = useStateStore(
     messageComposer.state,
-    messageComposerStateSelector2
+    messageComposerStateSelector
   );
   const { linkPreviews } = useStateStore(
     linkPreviewsManager.state,
@@ -48501,8 +48468,10 @@ var SuggestionList = ({
 };
 
 // src/components/TextareaComposer/TextareaComposer.tsx
+var import_lodash19 = __toESM(require("lodash.debounce"));
 var import_clsx61 = __toESM(require("clsx"));
-var import_react240 = __toESM(require("react"));
+var import_react240 = require("react");
+var import_react241 = __toESM(require("react"));
 var import_react_textarea_autosize = __toESM(require("react-textarea-autosize"));
 var textComposerStateSelector2 = (state) => ({
   selection: state.selection,
@@ -48521,33 +48490,32 @@ var TextareaComposer = ({
   className,
   closeSuggestionsOnClickOutside,
   containerClassName,
-  // dropdownClassName, // todo: X find a different way to prevent prop drilling
-  grow: growProp,
-  // itemClassName, // todo: X find a different way to prevent prop drilling
   listClassName,
   maxRows: maxRowsProp = 1,
+  minRows: minRowsProp,
   onBlur,
   onChange,
   onKeyDown,
   onScroll,
+  onSelect,
   placeholder: placeholderProp,
   shouldSubmit: shouldSubmitProp,
-  ...restProps
+  ...restTextareaProps
 }) => {
   const { t } = useTranslationContext();
   const { AutocompleteSuggestionList = SuggestionList } = useComponentContext();
   const {
     additionalTextareaProps,
     cooldownRemaining,
-    grow: growContext,
     handleSubmit,
     maxRows: maxRowsContext,
+    minRows: minRowsContext,
     onPaste,
     shouldSubmit: shouldSubmitContext,
     textareaRef
   } = useMessageInputContext();
-  const grow = growProp ?? growContext;
   const maxRows = maxRowsProp ?? maxRowsContext;
+  const minRows = minRowsProp ?? minRowsContext;
   const placeholder = placeholderProp ?? additionalTextareaProps?.placeholder;
   const shouldSubmit = shouldSubmitProp ?? shouldSubmitContext ?? defaultShouldSubmit;
   const messageComposer = useMessageComposer();
@@ -48558,10 +48526,10 @@ var TextareaComposer = ({
   );
   const { enabled } = useStateStore(messageComposer.configState, configStateSelector);
   const { isLoadingItems } = useStateStore(suggestions?.searchSource.state, searchSourceStateSelector2) ?? {};
-  const containerRef = (0, import_react240.useRef)(null);
-  const [focusedItemIndex, setFocusedItemIndex] = (0, import_react240.useState)(0);
-  const [isComposing, setIsComposing] = (0, import_react240.useState)(false);
-  const changeHandler = (0, import_react240.useCallback)(
+  const containerRef = (0, import_react241.useRef)(null);
+  const [focusedItemIndex, setFocusedItemIndex] = (0, import_react241.useState)(0);
+  const [isComposing, setIsComposing] = (0, import_react241.useState)(false);
+  const changeHandler = (0, import_react241.useCallback)(
     (e) => {
       if (onChange) {
         onChange(e);
@@ -48578,13 +48546,13 @@ var TextareaComposer = ({
     },
     [onChange, textComposer, textareaRef]
   );
-  const onCompositionEnd = (0, import_react240.useCallback)(() => {
+  const onCompositionEnd = (0, import_react241.useCallback)(() => {
     setIsComposing(false);
   }, []);
-  const onCompositionStart = (0, import_react240.useCallback)(() => {
+  const onCompositionStart = (0, import_react241.useCallback)(() => {
     setIsComposing(true);
   }, []);
-  const keyDownHandler = (0, import_react240.useCallback)(
+  const keyDownHandler = (0, import_react241.useCallback)(
     (event) => {
       if (onKeyDown) {
         onKeyDown(event);
@@ -48638,7 +48606,7 @@ var TextareaComposer = ({
       textareaRef
     ]
   );
-  const scrollHandler = (0, import_react240.useCallback)(
+  const scrollHandler = (0, import_react241.useCallback)(
     (event) => {
       if (onScroll) {
         onScroll(event);
@@ -48648,18 +48616,32 @@ var TextareaComposer = ({
     },
     [onScroll, textComposer]
   );
-  (0, import_react240.useEffect)(() => {
+  const setSelectionDebounced = (0, import_react240.useMemo)(
+    () => (0, import_lodash19.default)(
+      (e) => {
+        onSelect?.(e);
+        textComposer.setSelection({
+          end: e.target.selectionEnd,
+          start: e.target.selectionStart
+        });
+      },
+      100,
+      { leading: false, trailing: true }
+    ),
+    [onSelect, textComposer]
+  );
+  (0, import_react241.useEffect)(() => {
     if (textareaRef.current && !isComposing) {
       textareaRef.current.selectionStart = selection.start;
       textareaRef.current.selectionEnd = selection.end;
     }
   }, [text8, textareaRef, selection.start, selection.end, isComposing]);
-  (0, import_react240.useEffect)(() => {
+  (0, import_react241.useEffect)(() => {
     if (textComposer.suggestions) {
       setFocusedItemIndex(0);
     }
   }, [textComposer.suggestions]);
-  return /* @__PURE__ */ import_react240.default.createElement(
+  return /* @__PURE__ */ import_react241.default.createElement(
     "div",
     {
       className: (0, import_clsx61.default)(
@@ -48672,10 +48654,10 @@ var TextareaComposer = ({
       ),
       ref: containerRef
     },
-    /* @__PURE__ */ import_react240.default.createElement(
+    /* @__PURE__ */ import_react241.default.createElement(
       import_react_textarea_autosize.default,
       {
-        ...restProps,
+        ...{ ...additionalTextareaProps, ...restTextareaProps },
         "aria-label": cooldownRemaining ? t("Slow Mode ON") : placeholder,
         className: (0, import_clsx61.default)(
           "rta__textarea",
@@ -48684,7 +48666,8 @@ var TextareaComposer = ({
         ),
         "data-testid": "message-input",
         disabled: !enabled || !!cooldownRemaining,
-        maxRows: grow ? maxRows : 1,
+        maxRows,
+        minRows,
         onBlur,
         onChange: changeHandler,
         onCompositionEnd,
@@ -48692,6 +48675,7 @@ var TextareaComposer = ({
         onKeyDown: keyDownHandler,
         onPaste,
         onScroll: scrollHandler,
+        onSelect: setSelectionDebounced,
         placeholder: placeholder || t("Type your message"),
         ref: (ref) => {
           textareaRef.current = ref;
@@ -48699,7 +48683,7 @@ var TextareaComposer = ({
         value: text8
       }
     ),
-    !isComposing && /* @__PURE__ */ import_react240.default.createElement(
+    !isComposing && /* @__PURE__ */ import_react241.default.createElement(
       AutocompleteSuggestionList,
       {
         className: listClassName,
@@ -48712,10 +48696,10 @@ var TextareaComposer = ({
 };
 
 // src/components/AIStateIndicator/AIStateIndicator.tsx
-var import_react242 = __toESM(require("react"));
+var import_react243 = __toESM(require("react"));
 
 // src/components/AIStateIndicator/hooks/useAIState.ts
-var import_react241 = require("react");
+var import_react242 = require("react");
 var AIStates = {
   Error: "AI_STATE_ERROR",
   ExternalSources: "AI_STATE_EXTERNAL_SOURCES",
@@ -48724,8 +48708,8 @@ var AIStates = {
   Thinking: "AI_STATE_THINKING"
 };
 var useAIState = (channel) => {
-  const [aiState, setAiState] = (0, import_react241.useState)(AIStates.Idle);
-  (0, import_react241.useEffect)(() => {
+  const [aiState, setAiState] = (0, import_react242.useState)(AIStates.Idle);
+  (0, import_react242.useEffect)(() => {
     if (!channel) {
       return;
     }
@@ -48762,21 +48746,21 @@ var AIStateIndicator = ({
     [AIStates.Thinking]: t("Thinking..."),
     [AIStates.Generating]: t("Generating...")
   };
-  return aiState in allowedStates ? /* @__PURE__ */ import_react242.default.createElement("div", { className: "str-chat__ai-state-indicator-container" }, /* @__PURE__ */ import_react242.default.createElement("p", { className: "str-chat__ai-state-indicator-text" }, allowedStates[aiState])) : null;
+  return aiState in allowedStates ? /* @__PURE__ */ import_react243.default.createElement("div", { className: "str-chat__ai-state-indicator-container" }, /* @__PURE__ */ import_react243.default.createElement("p", { className: "str-chat__ai-state-indicator-text" }, allowedStates[aiState])) : null;
 };
 
 // src/components/MessageInput/WithDragAndDropUpload.tsx
-var import_react243 = __toESM(require("react"));
+var import_react244 = __toESM(require("react"));
 var import_react_dropzone = require("react-dropzone");
 var import_clsx62 = __toESM(require("clsx"));
-var DragAndDropUploadContext = import_react243.default.createContext({
+var DragAndDropUploadContext = import_react244.default.createContext({
   subscribeToDrop: null
 });
-var useDragAndDropUploadContext = () => (0, import_react243.useContext)(DragAndDropUploadContext);
+var useDragAndDropUploadContext = () => (0, import_react244.useContext)(DragAndDropUploadContext);
 var useRegisterDropHandlers = () => {
   const { subscribeToDrop } = useDragAndDropUploadContext();
   const messageComposer = useMessageComposer();
-  (0, import_react243.useEffect)(() => {
+  (0, import_react244.useEffect)(() => {
     const unsubscribe = subscribeToDrop?.(messageComposer.attachmentManager.uploadFiles);
     return unsubscribe;
   }, [subscribeToDrop, messageComposer]);
@@ -48791,7 +48775,7 @@ var WithDragAndDropUpload = ({
   component: Component2 = "div",
   style
 }) => {
-  const dropHandlersRef = (0, import_react243.useRef)(/* @__PURE__ */ new Set());
+  const dropHandlersRef = (0, import_react244.useRef)(/* @__PURE__ */ new Set());
   const { t } = useTranslationContext();
   const messageInputContext = useMessageInputContext();
   const dragAndDropUploadContext = useDragAndDropUploadContext();
@@ -48802,20 +48786,20 @@ var WithDragAndDropUpload = ({
     attachmentManagerConfigStateSelector
   );
   const isWithinMessageInputContext = Object.keys(messageInputContext).length > 0;
-  const accept = (0, import_react243.useMemo)(
+  const accept = (0, import_react244.useMemo)(
     () => acceptedFiles.reduce((mediaTypeMap, mediaType) => {
       mediaTypeMap[mediaType] ?? (mediaTypeMap[mediaType] = []);
       return mediaTypeMap;
     }, {}),
     [acceptedFiles]
   );
-  const subscribeToDrop = (0, import_react243.useCallback)((fn) => {
+  const subscribeToDrop = (0, import_react244.useCallback)((fn) => {
     dropHandlersRef.current.add(fn);
     return () => {
       dropHandlersRef.current.delete(fn);
     };
   }, []);
-  const handleDrop = (0, import_react243.useCallback)((files) => {
+  const handleDrop = (0, import_react244.useCallback)((files) => {
     dropHandlersRef.current.forEach((fn) => fn(files));
   }, []);
   const { getRootProps, isDragActive, isDragReject } = (0, import_react_dropzone.useDropzone)({
@@ -48828,24 +48812,24 @@ var WithDragAndDropUpload = ({
     onDrop: isWithinMessageInputContext ? messageComposer.attachmentManager.uploadFiles : handleDrop
   });
   if (dragAndDropUploadContext.subscribeToDrop !== null) {
-    return /* @__PURE__ */ import_react243.default.createElement(Component2, { className }, children);
+    return /* @__PURE__ */ import_react244.default.createElement(Component2, { className }, children);
   }
-  return /* @__PURE__ */ import_react243.default.createElement(
+  return /* @__PURE__ */ import_react244.default.createElement(
     DragAndDropUploadContext.Provider,
     {
       value: {
         subscribeToDrop
       }
     },
-    /* @__PURE__ */ import_react243.default.createElement(Component2, { ...getRootProps({ className, style }) }, isDragActive && /* @__PURE__ */ import_react243.default.createElement(
+    /* @__PURE__ */ import_react244.default.createElement(Component2, { ...getRootProps({ className, style }) }, isDragActive && /* @__PURE__ */ import_react244.default.createElement(
       "div",
       {
         className: (0, import_clsx62.default)("str-chat__dropzone-container", {
           "str-chat__dropzone-container--not-accepted": isDragReject
         })
       },
-      !isDragReject && /* @__PURE__ */ import_react243.default.createElement("p", null, t("Drag your files here")),
-      isDragReject && /* @__PURE__ */ import_react243.default.createElement("p", null, t("Some of the files will not be accepted"))
+      !isDragReject && /* @__PURE__ */ import_react244.default.createElement("p", null, t("Drag your files here")),
+      isDragReject && /* @__PURE__ */ import_react244.default.createElement("p", null, t("Some of the files will not be accepted"))
     ), children)
   );
 };
@@ -48872,37 +48856,38 @@ var MessageInputFlat = () => {
     RecordingPermissionDeniedNotification: RecordingPermissionDeniedNotification2 = RecordingPermissionDeniedNotification,
     SendButton: SendButton2 = SendButton,
     StartRecordingAudioButton: StartRecordingAudioButton2 = StartRecordingAudioButton,
-    StopAIGenerationButton: StopAIGenerationButtonOverride
-  } = useComponentContext("MessageInputFlat");
+    StopAIGenerationButton: StopAIGenerationButtonOverride,
+    TextareaComposer: TextareaComposer2 = TextareaComposer
+  } = useComponentContext();
   const { channel } = useChatContext("MessageInputFlat");
   const { aiState } = useAIState(channel);
-  const stopGenerating = (0, import_react244.useCallback)(() => channel?.stopAIResponse(), [channel]);
+  const stopGenerating = (0, import_react245.useCallback)(() => channel?.stopAIResponse(), [channel]);
   const [
     showRecordingPermissionDeniedNotification,
     setShowRecordingPermissionDeniedNotification
-  ] = (0, import_react244.useState)(false);
-  const closePermissionDeniedNotification = (0, import_react244.useCallback)(() => {
+  ] = (0, import_react245.useState)(false);
+  const closePermissionDeniedNotification = (0, import_react245.useCallback)(() => {
     setShowRecordingPermissionDeniedNotification(false);
   }, []);
   const { attachments } = useAttachmentManagerState();
-  if (recordingController.recordingState) return /* @__PURE__ */ import_react244.default.createElement(AudioRecorder2, null);
+  if (recordingController.recordingState) return /* @__PURE__ */ import_react245.default.createElement(AudioRecorder2, null);
   const recordingEnabled = !!(recordingController.recorder && navigator.mediaDevices);
   const isRecording = !!recordingController.recordingState;
   const StopAIGenerationButton2 = StopAIGenerationButtonOverride === void 0 ? StopAIGenerationButton : StopAIGenerationButtonOverride;
   const shouldDisplayStopAIGeneration = [AIStates.Thinking, AIStates.Generating].includes(aiState) && !!StopAIGenerationButton2;
-  return /* @__PURE__ */ import_react244.default.createElement(WithDragAndDropUpload, { className: "str-chat__message-input", component: "div" }, recordingEnabled && recordingController.permissionState === "denied" && showRecordingPermissionDeniedNotification && /* @__PURE__ */ import_react244.default.createElement(
+  return /* @__PURE__ */ import_react245.default.createElement(WithDragAndDropUpload, { className: "str-chat__message-input", component: "div" }, recordingEnabled && recordingController.permissionState === "denied" && showRecordingPermissionDeniedNotification && /* @__PURE__ */ import_react245.default.createElement(
     RecordingPermissionDeniedNotification2,
     {
       onClose: closePermissionDeniedNotification,
       permissionName: "microphone" /* MIC */
     }
-  ), /* @__PURE__ */ import_react244.default.createElement(LinkPreviewList2, null), /* @__PURE__ */ import_react244.default.createElement(QuotedMessagePreviewHeader, null), /* @__PURE__ */ import_react244.default.createElement("div", { className: "str-chat__message-input-inner" }, /* @__PURE__ */ import_react244.default.createElement(AttachmentSelector2, null), /* @__PURE__ */ import_react244.default.createElement("div", { className: "str-chat__message-textarea-container" }, /* @__PURE__ */ import_react244.default.createElement(QuotedMessagePreview2, null), /* @__PURE__ */ import_react244.default.createElement(AttachmentPreviewList2, null), /* @__PURE__ */ import_react244.default.createElement("div", { className: "str-chat__message-textarea-with-emoji-picker" }, /* @__PURE__ */ import_react244.default.createElement(TextareaComposer, null), EmojiPicker && /* @__PURE__ */ import_react244.default.createElement(EmojiPicker, null))), shouldDisplayStopAIGeneration ? /* @__PURE__ */ import_react244.default.createElement(StopAIGenerationButton2, { onClick: stopGenerating }) : !hideSendButton && /* @__PURE__ */ import_react244.default.createElement(import_react244.default.Fragment, null, cooldownRemaining ? /* @__PURE__ */ import_react244.default.createElement(
+  ), /* @__PURE__ */ import_react245.default.createElement(LinkPreviewList2, null), /* @__PURE__ */ import_react245.default.createElement(QuotedMessagePreviewHeader, null), /* @__PURE__ */ import_react245.default.createElement("div", { className: "str-chat__message-input-inner" }, /* @__PURE__ */ import_react245.default.createElement(AttachmentSelector2, null), /* @__PURE__ */ import_react245.default.createElement("div", { className: "str-chat__message-textarea-container" }, /* @__PURE__ */ import_react245.default.createElement(QuotedMessagePreview2, null), /* @__PURE__ */ import_react245.default.createElement(AttachmentPreviewList2, null), /* @__PURE__ */ import_react245.default.createElement("div", { className: "str-chat__message-textarea-with-emoji-picker" }, /* @__PURE__ */ import_react245.default.createElement(TextareaComposer2, null), EmojiPicker && /* @__PURE__ */ import_react245.default.createElement(EmojiPicker, null))), shouldDisplayStopAIGeneration ? /* @__PURE__ */ import_react245.default.createElement(StopAIGenerationButton2, { onClick: stopGenerating }) : !hideSendButton && /* @__PURE__ */ import_react245.default.createElement(import_react245.default.Fragment, null, cooldownRemaining ? /* @__PURE__ */ import_react245.default.createElement(
     CooldownTimer2,
     {
       cooldownInterval: cooldownRemaining,
       setCooldownRemaining
     }
-  ) : /* @__PURE__ */ import_react244.default.createElement(import_react244.default.Fragment, null, /* @__PURE__ */ import_react244.default.createElement(SendButton2, { sendMessage: handleSubmit }), recordingEnabled && /* @__PURE__ */ import_react244.default.createElement(
+  ) : /* @__PURE__ */ import_react245.default.createElement(import_react245.default.Fragment, null, /* @__PURE__ */ import_react245.default.createElement(SendButton2, { sendMessage: handleSubmit }), recordingEnabled && /* @__PURE__ */ import_react245.default.createElement(
     StartRecordingAudioButton2,
     {
       disabled: isRecording || !asyncMessagesMultiSendEnabled && attachments.some(
@@ -48917,7 +48902,7 @@ var MessageInputFlat = () => {
 };
 
 // src/components/MessageInput/hooks/useCreateMessageInputContext.ts
-var import_react245 = require("react");
+var import_react246 = require("react");
 var useCreateMessageInputContext = (value) => {
   const {
     additionalTextareaProps,
@@ -48928,10 +48913,8 @@ var useCreateMessageInputContext = (value) => {
     cooldownRemaining,
     emojiSearchIndex,
     focus,
-    grow,
     handleSubmit,
     hideSendButton,
-    insertText,
     isThreadInput,
     maxRows,
     minRows,
@@ -48943,7 +48926,7 @@ var useCreateMessageInputContext = (value) => {
     textareaRef
   } = value;
   const parentId = parent?.id;
-  const messageInputContext = (0, import_react245.useMemo)(
+  const messageInputContext = (0, import_react246.useMemo)(
     () => ({
       additionalTextareaProps,
       asyncMessagesMultiSendEnabled,
@@ -48953,10 +48936,8 @@ var useCreateMessageInputContext = (value) => {
       cooldownRemaining,
       emojiSearchIndex,
       focus,
-      grow,
       handleSubmit,
       hideSendButton,
-      insertText,
       isThreadInput,
       maxRows,
       minRows,
@@ -48997,13 +48978,13 @@ var MessageInputProvider = (props) => {
     emojiSearchIndex: props.emojiSearchIndex ?? emojiSearchIndex
   });
   const messageComposer = useMessageComposer();
-  (0, import_react246.useEffect)(
+  (0, import_react247.useEffect)(
     () => () => {
       messageComposer.createDraft();
     },
     [messageComposer]
   );
-  (0, import_react246.useEffect)(() => {
+  (0, import_react247.useEffect)(() => {
     const threadId = messageComposer.threadId;
     if (!threadId || !messageComposer.channel || !messageComposer.compositionIsEmpty)
       return;
@@ -49014,16 +48995,16 @@ var MessageInputProvider = (props) => {
     });
   }, [messageComposer]);
   useRegisterDropHandlers();
-  return /* @__PURE__ */ import_react246.default.createElement(MessageInputContextProvider, { value: messageInputContextValue }, props.children);
+  return /* @__PURE__ */ import_react247.default.createElement(MessageInputContextProvider, { value: messageInputContextValue }, props.children);
 };
 var UnMemoizedMessageInput = (props) => {
   const { Input: PropInput } = props;
   const { Input: ContextInput } = useComponentContext("MessageInput");
   const Input3 = PropInput || ContextInput || MessageInputFlat;
   const dialogManagerId = props.isThreadInput ? "message-input-dialog-manager-thread" : "message-input-dialog-manager";
-  return /* @__PURE__ */ import_react246.default.createElement(DialogManagerProvider, { id: dialogManagerId }, /* @__PURE__ */ import_react246.default.createElement(MessageInputProvider, { ...props }, /* @__PURE__ */ import_react246.default.createElement(Input3, null)));
+  return /* @__PURE__ */ import_react247.default.createElement(DialogManagerProvider, { id: dialogManagerId }, /* @__PURE__ */ import_react247.default.createElement(MessageInputProvider, { ...props }, /* @__PURE__ */ import_react247.default.createElement(Input3, null)));
 };
-var MessageInput = import_react246.default.memo(
+var MessageInput = import_react247.default.memo(
   UnMemoizedMessageInput
 );
 
@@ -49031,7 +49012,7 @@ var MessageInput = import_react246.default.memo(
 var EditMessageFormSendButton = () => {
   const { t } = useTranslationContext();
   const hasSendableData = useMessageComposerHasSendableData();
-  return /* @__PURE__ */ import_react247.default.createElement(
+  return /* @__PURE__ */ import_react248.default.createElement(
     "button",
     {
       className: "str-chat__edit-message-send",
@@ -49046,26 +49027,26 @@ var EditMessageForm = () => {
   const { t } = useTranslationContext("EditMessageForm");
   const messageComposer = useMessageComposer();
   const { clearEditingState, handleSubmit } = useMessageInputContext("EditMessageForm");
-  const cancel = (0, import_react247.useCallback)(() => {
+  const cancel = (0, import_react248.useCallback)(() => {
     clearEditingState?.();
     messageComposer.restore();
   }, [clearEditingState, messageComposer]);
-  (0, import_react247.useEffect)(() => {
+  (0, import_react248.useEffect)(() => {
     const onKeyDown = (event) => {
       if (event.key === "Escape") cancel();
     };
     document.addEventListener("keydown", onKeyDown);
     return () => document.removeEventListener("keydown", onKeyDown);
   }, [cancel]);
-  return /* @__PURE__ */ import_react247.default.createElement(
+  return /* @__PURE__ */ import_react248.default.createElement(
     "form",
     {
       autoComplete: "off",
       className: "str-chat__edit-message-form",
       onSubmit: handleSubmit
     },
-    /* @__PURE__ */ import_react247.default.createElement(MessageInputFlat, null),
-    /* @__PURE__ */ import_react247.default.createElement("div", { className: "str-chat__edit-message-form-options" }, /* @__PURE__ */ import_react247.default.createElement(
+    /* @__PURE__ */ import_react248.default.createElement(MessageInputFlat, null),
+    /* @__PURE__ */ import_react248.default.createElement("div", { className: "str-chat__edit-message-form-options" }, /* @__PURE__ */ import_react248.default.createElement(
       "button",
       {
         className: "str-chat__edit-message-cancel",
@@ -49073,7 +49054,7 @@ var EditMessageForm = () => {
         onClick: cancel
       },
       t("Cancel")
-    ), /* @__PURE__ */ import_react247.default.createElement(EditMessageFormSendButton, null))
+    ), /* @__PURE__ */ import_react248.default.createElement(EditMessageFormSendButton, null))
   );
 };
 var EditMessageModal = ({
@@ -49082,22 +49063,21 @@ var EditMessageModal = ({
   const { EditMessageInput = EditMessageForm } = useComponentContext();
   const { clearEditingState } = useMessageContext();
   const messageComposer = useMessageComposer();
-  const onEditModalClose = (0, import_react247.useCallback)(() => {
+  const onEditModalClose = (0, import_react248.useCallback)(() => {
     clearEditingState();
     messageComposer.restore();
   }, [clearEditingState, messageComposer]);
-  return /* @__PURE__ */ import_react247.default.createElement(
+  return /* @__PURE__ */ import_react248.default.createElement(
     Modal,
     {
       className: "str-chat__edit-message-modal",
       onClose: onEditModalClose,
       open: true
     },
-    /* @__PURE__ */ import_react247.default.createElement(
+    /* @__PURE__ */ import_react248.default.createElement(
       MessageInput,
       {
         clearEditingState,
-        grow: true,
         hideSendButton: true,
         Input: EditMessageInput,
         ...additionalMessageInputProps
@@ -49111,12 +49091,12 @@ var attachmentManagerConfigStateSelector2 = (state) => ({
   acceptedFiles: state.attachments.acceptedFiles,
   maxNumberOfFilesPerMessage: state.attachments.maxNumberOfFilesPerMessage
 });
-var UploadButton = (0, import_react248.forwardRef)(function UploadButton2({ onFileChange, resetOnChange = true, ...rest }, ref) {
+var UploadButton = (0, import_react249.forwardRef)(function UploadButton2({ onFileChange, resetOnChange = true, ...rest }, ref) {
   const handleInputChange = useHandleFileChangeWrapper(resetOnChange, onFileChange);
-  return /* @__PURE__ */ import_react248.default.createElement("input", { onChange: handleInputChange, ref, type: "file", ...rest });
+  return /* @__PURE__ */ import_react249.default.createElement("input", { onChange: handleInputChange, ref, type: "file", ...rest });
 });
 var FileInput = UploadButton;
-var UploadFileInput = (0, import_react248.forwardRef)(function UploadFileInput2({
+var UploadFileInput = (0, import_react249.forwardRef)(function UploadFileInput2({
   className,
   onFileChange: onFileChangeCustom,
   ...props
@@ -49130,15 +49110,15 @@ var UploadFileInput = (0, import_react248.forwardRef)(function UploadFileInput2(
     messageComposer.configState,
     attachmentManagerConfigStateSelector2
   );
-  const id = (0, import_react248.useMemo)(() => (0, import_nanoid5.nanoid)(), []);
-  const onFileChange = (0, import_react248.useCallback)(
+  const id = (0, import_react249.useMemo)(() => (0, import_nanoid5.nanoid)(), []);
+  const onFileChange = (0, import_react249.useCallback)(
     (files) => {
       attachmentManager.uploadFiles(files);
       onFileChangeCustom?.(files);
     },
     [onFileChangeCustom, attachmentManager]
   );
-  return /* @__PURE__ */ import_react248.default.createElement(
+  return /* @__PURE__ */ import_react249.default.createElement(
     FileInput,
     {
       accept: acceptedFiles?.join(","),
@@ -49185,7 +49165,7 @@ var VoiceRecordingPlayer = ({
   });
   if (!asset_url) return null;
   const displayedDuration = secondsElapsed || duration;
-  return /* @__PURE__ */ import_react249.default.createElement("div", { className: rootClassName, "data-testid": "voice-recording-widget" }, /* @__PURE__ */ import_react249.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react249.default.createElement("source", { "data-testid": "audio-source", src: asset_url, type: mime_type })), /* @__PURE__ */ import_react249.default.createElement(PlayButton, { isPlaying, onClick: togglePlay }), /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__metadata" }, /* @__PURE__ */ import_react249.default.createElement(
+  return /* @__PURE__ */ import_react250.default.createElement("div", { className: rootClassName, "data-testid": "voice-recording-widget" }, /* @__PURE__ */ import_react250.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react250.default.createElement("source", { "data-testid": "audio-source", src: asset_url, type: mime_type })), /* @__PURE__ */ import_react250.default.createElement(PlayButton, { isPlaying, onClick: togglePlay }), /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__metadata" }, /* @__PURE__ */ import_react250.default.createElement(
     "div",
     {
       className: "str-chat__message-attachment__voice-recording-widget__title",
@@ -49193,25 +49173,25 @@ var VoiceRecordingPlayer = ({
       title
     },
     title
-  ), /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__audio-state" }, /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__timer" }, attachment.duration ? displayDuration(displayedDuration) : /* @__PURE__ */ import_react249.default.createElement(
+  ), /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__audio-state" }, /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__timer" }, attachment.duration ? displayDuration(displayedDuration) : /* @__PURE__ */ import_react250.default.createElement(
     FileSizeIndicator,
     {
       fileSize: attachment.file_size,
       maximumFractionDigits: 0
     }
-  )), /* @__PURE__ */ import_react249.default.createElement(
+  )), /* @__PURE__ */ import_react250.default.createElement(
     WaveProgressBar,
     {
       progress,
       seek,
       waveformData: waveform_data || []
     }
-  ))), /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__right-section" }, isPlaying ? /* @__PURE__ */ import_react249.default.createElement(PlaybackRateButton, { disabled: !audioRef.current, onClick: increasePlaybackRate }, playbackRate.toFixed(1), "x") : /* @__PURE__ */ import_react249.default.createElement(FileIcon, { big: true, mimeType: mime_type, size: 40 })));
+  ))), /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__right-section" }, isPlaying ? /* @__PURE__ */ import_react250.default.createElement(PlaybackRateButton, { disabled: !audioRef.current, onClick: increasePlaybackRate }, playbackRate.toFixed(1), "x") : /* @__PURE__ */ import_react250.default.createElement(FileIcon, { big: true, mimeType: mime_type, size: 40 })));
 };
 var QuotedVoiceRecording = ({ attachment }) => {
   const { t } = useTranslationContext();
   const title = attachment.title || t("Voice message");
-  return /* @__PURE__ */ import_react249.default.createElement("div", { className: rootClassName, "data-testid": "quoted-voice-recording-widget" }, /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__metadata" }, title && /* @__PURE__ */ import_react249.default.createElement(
+  return /* @__PURE__ */ import_react250.default.createElement("div", { className: rootClassName, "data-testid": "quoted-voice-recording-widget" }, /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__metadata" }, title && /* @__PURE__ */ import_react250.default.createElement(
     "div",
     {
       className: "str-chat__message-attachment__voice-recording-widget__title",
@@ -49219,18 +49199,18 @@ var QuotedVoiceRecording = ({ attachment }) => {
       title
     },
     title
-  ), /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__audio-state" }, /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__timer" }, attachment.duration ? displayDuration(attachment.duration) : /* @__PURE__ */ import_react249.default.createElement(
+  ), /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__audio-state" }, /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__timer" }, attachment.duration ? displayDuration(attachment.duration) : /* @__PURE__ */ import_react250.default.createElement(
     FileSizeIndicator,
     {
       fileSize: attachment.file_size,
       maximumFractionDigits: 0
     }
-  )))), /* @__PURE__ */ import_react249.default.createElement(FileIcon, { big: true, mimeType: attachment.mime_type, size: 34 }));
+  )))), /* @__PURE__ */ import_react250.default.createElement(FileIcon, { big: true, mimeType: attachment.mime_type, size: 34 }));
 };
-var VoiceRecording = ({ attachment, isQuoted }) => isQuoted ? /* @__PURE__ */ import_react249.default.createElement(QuotedVoiceRecording, { attachment }) : /* @__PURE__ */ import_react249.default.createElement(VoiceRecordingPlayer, { attachment });
+var VoiceRecording = ({ attachment, isQuoted }) => isQuoted ? /* @__PURE__ */ import_react250.default.createElement(QuotedVoiceRecording, { attachment }) : /* @__PURE__ */ import_react250.default.createElement(VoiceRecordingPlayer, { attachment });
 
 // src/components/Attachment/Card.tsx
-var import_react250 = __toESM(require("react"));
+var import_react251 = __toESM(require("react"));
 var import_clsx64 = __toESM(require("clsx"));
 var import_react_player = __toESM(require("react-player"));
 var getHostFromURL = (url) => {
@@ -49242,26 +49222,26 @@ var getHostFromURL = (url) => {
 };
 var UnableToRenderCard = ({ type }) => {
   const { t } = useTranslationContext("Card");
-  return /* @__PURE__ */ import_react250.default.createElement(
+  return /* @__PURE__ */ import_react251.default.createElement(
     "div",
     {
       className: (0, import_clsx64.default)("str-chat__message-attachment-card", {
         [`str-chat__message-attachment-card--${type}`]: type
       })
     },
-    /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card--content" }, /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card--text" }, t("this content could not be displayed")))
+    /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-card--content" }, /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-card--text" }, t("this content could not be displayed")))
   );
 };
 var SourceLink = ({
   author_name,
   url
-}) => /* @__PURE__ */ import_react250.default.createElement(
+}) => /* @__PURE__ */ import_react251.default.createElement(
   "div",
   {
     className: "str-chat__message-attachment-card--source-link",
     "data-testid": "card-source-link"
   },
-  /* @__PURE__ */ import_react250.default.createElement(
+  /* @__PURE__ */ import_react251.default.createElement(
     SafeAnchor,
     {
       className: "str-chat__message-attachment-card--url",
@@ -49276,7 +49256,7 @@ var CardHeader3 = (props) => {
   const { asset_url, dimensions, image: image4, image_url, thumb_url, title, type } = props;
   let visual = null;
   if (asset_url && type === "video") {
-    visual = /* @__PURE__ */ import_react250.default.createElement(
+    visual = /* @__PURE__ */ import_react251.default.createElement(
       import_react_player.default,
       {
         className: "react-player",
@@ -49287,7 +49267,7 @@ var CardHeader3 = (props) => {
       }
     );
   } else if (image4) {
-    visual = /* @__PURE__ */ import_react250.default.createElement(
+    visual = /* @__PURE__ */ import_react251.default.createElement(
       ImageComponent,
       {
         dimensions,
@@ -49297,7 +49277,7 @@ var CardHeader3 = (props) => {
       }
     );
   }
-  return visual ? /* @__PURE__ */ import_react250.default.createElement(
+  return visual ? /* @__PURE__ */ import_react251.default.createElement(
     "div",
     {
       className: "str-chat__message-attachment-card--header str-chat__message-attachment-card-react--header",
@@ -49309,7 +49289,7 @@ var CardHeader3 = (props) => {
 var CardContent = (props) => {
   const { author_name, og_scrape_url, text: text8, title, title_link, type } = props;
   const url = title_link || og_scrape_url;
-  return /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card--content" }, type === "audio" ? /* @__PURE__ */ import_react250.default.createElement(CardAudio, { og: props }) : /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card--flex" }, url && /* @__PURE__ */ import_react250.default.createElement(SourceLink, { author_name, url }), title && /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card--title" }, title), text8 && /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card--text" }, text8)));
+  return /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-card--content" }, type === "audio" ? /* @__PURE__ */ import_react251.default.createElement(CardAudio, { og: props }) : /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-card--flex" }, url && /* @__PURE__ */ import_react251.default.createElement(SourceLink, { author_name, url }), title && /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-card--title" }, title), text8 && /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-card--text" }, text8)));
 };
 var CardAudio = ({
   og: { asset_url, author_name, mime_type, og_scrape_url, text: text8, title, title_link }
@@ -49320,7 +49300,7 @@ var CardAudio = ({
   const url = title_link || og_scrape_url;
   const dataTestId = "card-audio-widget";
   const rootClassName2 = "str-chat__message-attachment-card-audio-widget";
-  return /* @__PURE__ */ import_react250.default.createElement("div", { className: rootClassName2, "data-testid": dataTestId }, asset_url && /* @__PURE__ */ import_react250.default.createElement(import_react250.default.Fragment, null, /* @__PURE__ */ import_react250.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react250.default.createElement("source", { "data-testid": "audio-source", src: asset_url, type: "audio/mp3" })), /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card-audio-widget--first-row" }, /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--play-controls" }, /* @__PURE__ */ import_react250.default.createElement(PlayButton, { isPlaying, onClick: togglePlay })), /* @__PURE__ */ import_react250.default.createElement(ProgressBar, { onClick: seek, progress }))), /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--second-row" }, url && /* @__PURE__ */ import_react250.default.createElement(SourceLink, { author_name, url }), title && /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--title" }, title), text8 && /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--description" }, text8)));
+  return /* @__PURE__ */ import_react251.default.createElement("div", { className: rootClassName2, "data-testid": dataTestId }, asset_url && /* @__PURE__ */ import_react251.default.createElement(import_react251.default.Fragment, null, /* @__PURE__ */ import_react251.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react251.default.createElement("source", { "data-testid": "audio-source", src: asset_url, type: "audio/mp3" })), /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-card-audio-widget--first-row" }, /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--play-controls" }, /* @__PURE__ */ import_react251.default.createElement(PlayButton, { isPlaying, onClick: togglePlay })), /* @__PURE__ */ import_react251.default.createElement(ProgressBar, { onClick: seek, progress }))), /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--second-row" }, url && /* @__PURE__ */ import_react251.default.createElement(SourceLink, { author_name, url }), title && /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--title" }, title), text8 && /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--description" }, text8)));
 };
 var UnMemoizedCard = (props) => {
   const { asset_url, giphy, image_url, thumb_url, title, title_link, type } = props;
@@ -49334,45 +49314,45 @@ var UnMemoizedCard = (props) => {
     dimensions.width = giphyVersion.width;
   }
   if (!title && !title_link && !asset_url && !image4) {
-    return /* @__PURE__ */ import_react250.default.createElement(UnableToRenderCard, null);
+    return /* @__PURE__ */ import_react251.default.createElement(UnableToRenderCard, null);
   }
-  return /* @__PURE__ */ import_react250.default.createElement(
+  return /* @__PURE__ */ import_react251.default.createElement(
     "div",
     {
       className: `str-chat__message-attachment-card str-chat__message-attachment-card--${type}`
     },
-    /* @__PURE__ */ import_react250.default.createElement(CardHeader3, { ...props, dimensions, image: image4 }),
-    /* @__PURE__ */ import_react250.default.createElement(CardContent, { ...props })
+    /* @__PURE__ */ import_react251.default.createElement(CardHeader3, { ...props, dimensions, image: image4 }),
+    /* @__PURE__ */ import_react251.default.createElement(CardContent, { ...props })
   );
 };
-var Card3 = import_react250.default.memo(UnMemoizedCard);
+var Card3 = import_react251.default.memo(UnMemoizedCard);
 
 // src/components/Attachment/FileAttachment.tsx
-var import_react251 = __toESM(require("react"));
-var UnMemoizedFileAttachment = ({ attachment }) => /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-file--item", "data-testid": "attachment-file" }, /* @__PURE__ */ import_react251.default.createElement(FileIcon, { className: "str-chat__file-icon", mimeType: attachment.mime_type }), /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-file--item-text" }, /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-file--item-first-row" }, /* @__PURE__ */ import_react251.default.createElement(
+var import_react252 = __toESM(require("react"));
+var UnMemoizedFileAttachment = ({ attachment }) => /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-file--item", "data-testid": "attachment-file" }, /* @__PURE__ */ import_react252.default.createElement(FileIcon, { className: "str-chat__file-icon", mimeType: attachment.mime_type }), /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-file--item-text" }, /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-file--item-first-row" }, /* @__PURE__ */ import_react252.default.createElement(
   "div",
   {
     className: "str-chat__message-attachment-file--item-name",
     "data-testid": "file-title"
   },
   attachment.title
-), /* @__PURE__ */ import_react251.default.createElement(DownloadButton, { assetUrl: attachment.asset_url })), /* @__PURE__ */ import_react251.default.createElement(FileSizeIndicator, { fileSize: attachment.file_size })));
-var FileAttachment = import_react251.default.memo(
+), /* @__PURE__ */ import_react252.default.createElement(DownloadButton, { assetUrl: attachment.asset_url })), /* @__PURE__ */ import_react252.default.createElement(FileSizeIndicator, { fileSize: attachment.file_size })));
+var FileAttachment = import_react252.default.memo(
   UnMemoizedFileAttachment
 );
 
 // src/components/Attachment/UnsupportedAttachment.tsx
-var import_react252 = __toESM(require("react"));
+var import_react253 = __toESM(require("react"));
 var UnsupportedAttachment = ({ attachment }) => {
   const { t } = useTranslationContext("UnsupportedAttachment");
-  return /* @__PURE__ */ import_react252.default.createElement(
+  return /* @__PURE__ */ import_react253.default.createElement(
     "div",
     {
       className: "str-chat__message-attachment-unsupported",
       "data-testid": "attachment-unsupported"
     },
-    /* @__PURE__ */ import_react252.default.createElement(FileIcon, { className: "str-chat__file-icon" }),
-    /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-unsupported__metadata" }, /* @__PURE__ */ import_react252.default.createElement(
+    /* @__PURE__ */ import_react253.default.createElement(FileIcon, { className: "str-chat__file-icon" }),
+    /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__message-attachment-unsupported__metadata" }, /* @__PURE__ */ import_react253.default.createElement(
       "div",
       {
         className: "str-chat__message-attachment-unsupported__title",
@@ -49404,7 +49384,7 @@ var AttachmentWithinContainer = ({
       "str-chat__message-attachment-with-actions": extra === "actions"
     }
   );
-  return /* @__PURE__ */ import_react253.default.createElement("div", { className: classNames }, children);
+  return /* @__PURE__ */ import_react254.default.createElement("div", { className: classNames }, children);
 };
 var AttachmentActionsContainer = ({
   actionHandler,
@@ -49412,7 +49392,7 @@ var AttachmentActionsContainer = ({
   AttachmentActions: AttachmentActions2 = AttachmentActions
 }) => {
   if (!attachment.actions?.length) return null;
-  return /* @__PURE__ */ import_react253.default.createElement(
+  return /* @__PURE__ */ import_react254.default.createElement(
     AttachmentActions2,
     {
       ...attachment,
@@ -49443,10 +49423,10 @@ var GalleryContainer = ({
   attachment,
   Gallery: Gallery2 = Gallery
 }) => {
-  const imageElements = (0, import_react253.useRef)([]);
+  const imageElements = (0, import_react254.useRef)([]);
   const { imageAttachmentSizeHandler } = useChannelStateContext();
-  const [attachmentConfigurations, setAttachmentConfigurations] = (0, import_react253.useState)([]);
-  (0, import_react253.useLayoutEffect)(() => {
+  const [attachmentConfigurations, setAttachmentConfigurations] = (0, import_react254.useState)([]);
+  (0, import_react254.useLayoutEffect)(() => {
     if (imageElements.current && imageElements.current.every((element4) => !!element4) && imageAttachmentSizeHandler) {
       const newConfigurations = [];
       imageElements.current.forEach((element4, i) => {
@@ -49463,15 +49443,15 @@ var GalleryContainer = ({
       attachment.images[i]?.image_url || attachment.images[i]?.thumb_url || ""
     )
   }));
-  return /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType: "gallery" }, /* @__PURE__ */ import_react253.default.createElement(Gallery2, { images: images || [], innerRefs: imageElements, key: "gallery" }));
+  return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType: "gallery" }, /* @__PURE__ */ import_react254.default.createElement(Gallery2, { images: images || [], innerRefs: imageElements, key: "gallery" }));
 };
 var ImageContainer = (props) => {
   const { attachment, Image: Image4 = ImageComponent } = props;
   const componentType = "image";
-  const imageElement = (0, import_react253.useRef)(null);
+  const imageElement = (0, import_react254.useRef)(null);
   const { imageAttachmentSizeHandler } = useChannelStateContext();
-  const [attachmentConfiguration, setAttachmentConfiguration] = (0, import_react253.useState)(void 0);
-  (0, import_react253.useLayoutEffect)(() => {
+  const [attachmentConfiguration, setAttachmentConfiguration] = (0, import_react254.useState)(void 0);
+  (0, import_react254.useLayoutEffect)(() => {
     if (imageElement.current && imageAttachmentSizeHandler) {
       const config = imageAttachmentSizeHandler(attachment, imageElement.current);
       setAttachmentConfiguration(config);
@@ -49483,41 +49463,41 @@ var ImageContainer = (props) => {
     style: getCssDimensionsVariables(attachment.image_url || attachment.thumb_url || "")
   };
   if (attachment.actions && attachment.actions.length) {
-    return /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react253.default.createElement(Image4, { ...imageConfig, innerRef: imageElement }), /* @__PURE__ */ import_react253.default.createElement(AttachmentActionsContainer, { ...props })));
+    return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react254.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react254.default.createElement(Image4, { ...imageConfig, innerRef: imageElement }), /* @__PURE__ */ import_react254.default.createElement(AttachmentActionsContainer, { ...props })));
   }
-  return /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react253.default.createElement(Image4, { ...imageConfig, innerRef: imageElement }));
+  return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react254.default.createElement(Image4, { ...imageConfig, innerRef: imageElement }));
 };
 var CardContainer = (props) => {
   const { attachment, Card: Card4 = Card3 } = props;
   const componentType = "card";
   if (attachment.actions && attachment.actions.length) {
-    return /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react253.default.createElement(Card4, { ...attachment }), /* @__PURE__ */ import_react253.default.createElement(AttachmentActionsContainer, { ...props })));
+    return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react254.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react254.default.createElement(Card4, { ...attachment }), /* @__PURE__ */ import_react254.default.createElement(AttachmentActionsContainer, { ...props })));
   }
-  return /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react253.default.createElement(Card4, { ...attachment }));
+  return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react254.default.createElement(Card4, { ...attachment }));
 };
 var FileContainer = ({
   attachment,
   File: File2 = FileAttachment
 }) => {
   if (!attachment.asset_url) return null;
-  return /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType: "file" }, /* @__PURE__ */ import_react253.default.createElement(File2, { attachment }));
+  return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType: "file" }, /* @__PURE__ */ import_react254.default.createElement(File2, { attachment }));
 };
 var AudioContainer = ({
   attachment,
   Audio: Audio2 = Audio
-}) => /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType: "audio" }, /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react253.default.createElement(Audio2, { og: attachment })));
+}) => /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType: "audio" }, /* @__PURE__ */ import_react254.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react254.default.createElement(Audio2, { og: attachment })));
 var VoiceRecordingContainer = ({
   attachment,
   isQuoted,
   VoiceRecording: VoiceRecording2 = VoiceRecording
-}) => /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType: "voiceRecording" }, /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react253.default.createElement(VoiceRecording2, { attachment, isQuoted })));
+}) => /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType: "voiceRecording" }, /* @__PURE__ */ import_react254.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react254.default.createElement(VoiceRecording2, { attachment, isQuoted })));
 var MediaContainer = (props) => {
   const { attachment, Media = import_react_player2.default } = props;
   const componentType = "media";
   const { shouldGenerateVideoThumbnail, videoAttachmentSizeHandler } = useChannelStateContext();
-  const videoElement = (0, import_react253.useRef)(null);
-  const [attachmentConfiguration, setAttachmentConfiguration] = (0, import_react253.useState)();
-  (0, import_react253.useLayoutEffect)(() => {
+  const videoElement = (0, import_react254.useRef)(null);
+  const [attachmentConfiguration, setAttachmentConfiguration] = (0, import_react254.useState)();
+  (0, import_react254.useLayoutEffect)(() => {
     if (videoElement.current && videoAttachmentSizeHandler) {
       const config = videoAttachmentSizeHandler(
         attachment,
@@ -49527,7 +49507,7 @@ var MediaContainer = (props) => {
       setAttachmentConfiguration(config);
     }
   }, [videoElement, videoAttachmentSizeHandler, attachment]);
-  const content3 = /* @__PURE__ */ import_react253.default.createElement(
+  const content3 = /* @__PURE__ */ import_react254.default.createElement(
     "div",
     {
       className: "str-chat__player-wrapper",
@@ -49535,7 +49515,7 @@ var MediaContainer = (props) => {
       ref: videoElement,
       style: getCssDimensionsVariables(attachment.thumb_url || "")
     },
-    /* @__PURE__ */ import_react253.default.createElement(
+    /* @__PURE__ */ import_react254.default.createElement(
       Media,
       {
         className: "react-player",
@@ -49547,12 +49527,12 @@ var MediaContainer = (props) => {
       }
     )
   );
-  return attachment.actions?.length ? /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__attachment" }, content3, /* @__PURE__ */ import_react253.default.createElement(AttachmentActionsContainer, { ...props }))) : /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType }, content3);
+  return attachment.actions?.length ? /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react254.default.createElement("div", { className: "str-chat__attachment" }, content3, /* @__PURE__ */ import_react254.default.createElement(AttachmentActionsContainer, { ...props }))) : /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType }, content3);
 };
 var UnsupportedAttachmentContainer = ({
   attachment,
   UnsupportedAttachment: UnsupportedAttachment2 = UnsupportedAttachment
-}) => /* @__PURE__ */ import_react253.default.createElement(import_react253.default.Fragment, null, /* @__PURE__ */ import_react253.default.createElement(UnsupportedAttachment2, { attachment }));
+}) => /* @__PURE__ */ import_react254.default.createElement(import_react254.default.Fragment, null, /* @__PURE__ */ import_react254.default.createElement(UnsupportedAttachment2, { attachment }));
 
 // src/components/Attachment/Attachment.tsx
 var CONTAINER_MAP = {
@@ -49575,12 +49555,12 @@ var ATTACHMENT_GROUPS_ORDER = [
 ];
 var Attachment = (props) => {
   const { attachments } = props;
-  const groupedAttachments = (0, import_react254.useMemo)(
+  const groupedAttachments = (0, import_react255.useMemo)(
     () => renderGroupedAttachments(props),
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [attachments]
   );
-  return /* @__PURE__ */ import_react254.default.createElement("div", { className: "str-chat__attachment-list" }, ATTACHMENT_GROUPS_ORDER.reduce(
+  return /* @__PURE__ */ import_react255.default.createElement("div", { className: "str-chat__attachment-list" }, ATTACHMENT_GROUPS_ORDER.reduce(
     (acc, groupName) => [...acc, ...groupedAttachments[groupName]],
     []
   ));
@@ -49597,7 +49577,7 @@ var renderGroupedAttachments = ({
       const attachmentType = getAttachmentType(attachment);
       const Container = CONTAINER_MAP[attachmentType];
       typeMap[attachmentType].push(
-        /* @__PURE__ */ import_react254.default.createElement(
+        /* @__PURE__ */ import_react255.default.createElement(
           Container,
           {
             key: `${attachmentType}-${typeMap[attachmentType].length}`,
@@ -49624,7 +49604,7 @@ var renderGroupedAttachments = ({
   );
   if (uploadedImages.length > 1) {
     containers["gallery"] = [
-      /* @__PURE__ */ import_react254.default.createElement(
+      /* @__PURE__ */ import_react255.default.createElement(
         GalleryContainer,
         {
           key: "gallery-container",
@@ -49638,7 +49618,7 @@ var renderGroupedAttachments = ({
     ];
   } else if (uploadedImages.length === 1) {
     containers["image"] = [
-      /* @__PURE__ */ import_react254.default.createElement(ImageContainer, { key: "image-container", ...rest, attachment: uploadedImages[0] })
+      /* @__PURE__ */ import_react255.default.createElement(ImageContainer, { key: "image-container", ...rest, attachment: uploadedImages[0] })
     ];
   }
   return containers;
@@ -49659,11 +49639,11 @@ var getAttachmentType = (attachment) => {
 };
 
 // src/components/Channel/Channel.tsx
-var import_react260 = __toESM(require("react"));
+var import_react261 = __toESM(require("react"));
 var import_clsx66 = __toESM(require("clsx"));
-var import_lodash19 = __toESM(require("lodash.debounce"));
-var import_lodash20 = __toESM(require("lodash.defaultsdeep"));
-var import_lodash21 = __toESM(require("lodash.throttle"));
+var import_lodash20 = __toESM(require("lodash.debounce"));
+var import_lodash21 = __toESM(require("lodash.defaultsdeep"));
+var import_lodash22 = __toESM(require("lodash.throttle"));
 var import_stream_chat11 = require("stream-chat");
 
 // src/components/Channel/channelState.ts
@@ -49840,7 +49820,7 @@ var initialState = {
 };
 
 // src/components/Channel/hooks/useCreateChannelStateContext.ts
-var import_react255 = require("react");
+var import_react256 = require("react");
 var useCreateChannelStateContext = (value) => {
   const {
     channel,
@@ -49899,7 +49879,7 @@ var useCreateChannelStateContext = (value) => {
   const memoizedThreadMessageData = threadMessages.map(
     ({ deleted_at, latest_reactions, pinned, status, updated_at, user }) => `${deleted_at}${latest_reactions ? latest_reactions.map(({ type }) => type).join() : ""}${pinned}${status}${updated_at && (isDayOrMoment(updated_at) || isDate(updated_at)) ? updated_at.toISOString() : updated_at || ""}${user?.updated_at}`
   ).join();
-  const channelStateContext = (0, import_react255.useMemo)(
+  const channelStateContext = (0, import_react256.useMemo)(
     () => ({
       channel,
       channelCapabilities,
@@ -49963,11 +49943,11 @@ var useCreateChannelStateContext = (value) => {
 };
 
 // src/components/Channel/hooks/useCreateTypingContext.ts
-var import_react256 = require("react");
+var import_react257 = require("react");
 var useCreateTypingContext = (value) => {
   const { typing } = value;
   const typingValue = Object.keys(typing || {}).join();
-  const typingContext = (0, import_react256.useMemo)(
+  const typingContext = (0, import_react257.useMemo)(
     () => ({
       typing
     }),
@@ -49991,10 +49971,10 @@ var useEditMessageHandler = (doUpdateMessageRequest) => {
 };
 
 // src/components/Channel/hooks/useIsMounted.ts
-var import_react257 = require("react");
+var import_react258 = require("react");
 var useIsMounted = () => {
-  const isMounted = (0, import_react257.useRef)(false);
-  (0, import_react257.useEffect)(() => {
+  const isMounted = (0, import_react258.useRef)(false);
+  (0, import_react258.useEffect)(() => {
     isMounted.current = true;
     return () => {
       isMounted.current = false;
@@ -50004,8 +49984,8 @@ var useIsMounted = () => {
 };
 
 // src/components/Channel/hooks/useMentionsHandlers.ts
-var import_react258 = require("react");
-var useMentionsHandlers = (onMentionsHover, onMentionsClick) => (0, import_react258.useCallback)(
+var import_react259 = require("react");
+var useMentionsHandlers = (onMentionsHover, onMentionsClick) => (0, import_react259.useCallback)(
   (event, mentioned_users) => {
     if (!onMentionsHover && !onMentionsClick || !(event.target instanceof HTMLElement)) {
       return;
@@ -50029,11 +50009,11 @@ var useMentionsHandlers = (onMentionsHover, onMentionsClick) => (0, import_react
 );
 
 // src/components/Channel/LoadingChannel.tsx
-var import_react259 = __toESM(require("react"));
-var LoadingMessage = () => /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message" }, /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-avatar" }), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-end" }, /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-sender" }), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-last-row" }, /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-text" }), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-date" }))));
-var LoadingMessageInput = () => /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-input-row" }, /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-input" }), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-send" }));
-var LoadingChannelHeader = () => /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-header" }, /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-header-avatar" }), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-header-end" }, /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-header-name" }), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-header-info" })));
-var LoadingChannel = () => /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel" }, /* @__PURE__ */ import_react259.default.createElement(LoadingChannelHeader, null), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-list" }, Array.from(Array(3)).map((_, i) => /* @__PURE__ */ import_react259.default.createElement(LoadingMessage, { key: `loading-message-${i}` }))), /* @__PURE__ */ import_react259.default.createElement(LoadingMessageInput, null));
+var import_react260 = __toESM(require("react"));
+var LoadingMessage = () => /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message" }, /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-avatar" }), /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-end" }, /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-sender" }), /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-last-row" }, /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-text" }), /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-date" }))));
+var LoadingMessageInput = () => /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-input-row" }, /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-input" }), /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-send" }));
+var LoadingChannelHeader = () => /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-header" }, /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-header-avatar" }), /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-header-end" }, /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-header-name" }), /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-header-info" })));
+var LoadingChannel = () => /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel" }, /* @__PURE__ */ import_react260.default.createElement(LoadingChannelHeader, null), /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-list" }, Array.from(Array(3)).map((_, i) => /* @__PURE__ */ import_react260.default.createElement(LoadingMessage, { key: `loading-message-${i}` }))), /* @__PURE__ */ import_react260.default.createElement(LoadingMessageInput, null));
 
 // src/components/Channel/hooks/useChannelContainerClasses.ts
 var useImageFlagEmojisOnWindowsClass = () => {
@@ -50220,7 +50200,7 @@ var ChannelContainer = ({
     customClasses
   });
   const className = (0, import_clsx66.default)(chatClass, theme, channelClass, additionalClassName);
-  return /* @__PURE__ */ import_react260.default.createElement("div", { id: CHANNEL_CONTAINER_ID, ...props, className }, children);
+  return /* @__PURE__ */ import_react261.default.createElement("div", { id: CHANNEL_CONTAINER_ID, ...props, className }, children);
 };
 var UnMemoizedChannel = (props) => {
   const {
@@ -50232,15 +50212,15 @@ var UnMemoizedChannel = (props) => {
   const { channel: contextChannel, channelsQueryState } = useChatContext("Channel");
   const channel = propsChannel || contextChannel;
   if (channelsQueryState.queryInProgress === "reload" && LoadingIndicator2) {
-    return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react260.default.createElement(LoadingIndicator2, null));
+    return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement(LoadingIndicator2, null));
   }
   if (channelsQueryState.error && LoadingErrorIndicator2) {
-    return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react260.default.createElement(LoadingErrorIndicator2, { error: channelsQueryState.error }));
+    return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement(LoadingErrorIndicator2, { error: channelsQueryState.error }));
   }
   if (!channel?.cid) {
-    return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, null, EmptyPlaceholder2);
+    return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, EmptyPlaceholder2);
   }
-  return /* @__PURE__ */ import_react260.default.createElement(ChannelInner, { ...props, channel, key: channel.cid });
+  return /* @__PURE__ */ import_react261.default.createElement(ChannelInner, { ...props, channel, key: channel.cid });
 };
 var ChannelInner = (props) => {
   const {
@@ -50260,8 +50240,8 @@ var ChannelInner = (props) => {
     onMentionsHover,
     skipMessageDataMemoization
   } = props;
-  const channelQueryOptions = (0, import_react260.useMemo)(
-    () => (0, import_lodash20.default)(propChannelQueryOptions, {
+  const channelQueryOptions = (0, import_react261.useMemo)(
+    () => (0, import_lodash21.default)(propChannelQueryOptions, {
       messages: { limit: DEFAULT_INITIAL_CHANNEL_PAGE_SIZE }
     }),
     [propChannelQueryOptions]
@@ -50271,12 +50251,12 @@ var ChannelInner = (props) => {
   const chatContainerClass = getChatContainerClass(customClasses?.chatContainer);
   const windowsEmojiClass = useImageFlagEmojisOnWindowsClass();
   const thread = useThreadContext();
-  const [channelConfig, setChannelConfig] = (0, import_react260.useState)(channel.getConfig());
-  const [notifications, setNotifications] = (0, import_react260.useState)([]);
-  const notificationTimeouts = (0, import_react260.useRef)([]);
-  const [channelUnreadUiState, _setChannelUnreadUiState] = (0, import_react260.useState)();
-  const channelReducer = (0, import_react260.useMemo)(() => makeChannelReducer(), []);
-  const [state, dispatch] = (0, import_react260.useReducer)(
+  const [channelConfig, setChannelConfig] = (0, import_react261.useState)(channel.getConfig());
+  const [notifications, setNotifications] = (0, import_react261.useState)([]);
+  const notificationTimeouts = (0, import_react261.useRef)([]);
+  const [channelUnreadUiState, _setChannelUnreadUiState] = (0, import_react261.useState)();
+  const channelReducer = (0, import_react261.useMemo)(() => makeChannelReducer(), []);
+  const [state, dispatch] = (0, import_react261.useReducer)(
     channelReducer,
     // channel.initialized === false if client.channel().query() was not called, e.g. ChannelList is not used
     // => Channel will call channel.watch() in useLayoutEffect => state.loading is used to signal the watch() call state
@@ -50288,14 +50268,14 @@ var ChannelInner = (props) => {
   );
   const jumpToMessageFromSearch = useSearchFocusedMessage();
   const isMounted = useIsMounted();
-  const originalTitle = (0, import_react260.useRef)("");
-  const lastRead = (0, import_react260.useRef)(void 0);
-  const online = (0, import_react260.useRef)(true);
-  const clearHighlightedMessageTimeoutId = (0, import_react260.useRef)(
+  const originalTitle = (0, import_react261.useRef)("");
+  const lastRead = (0, import_react261.useRef)(void 0);
+  const online = (0, import_react261.useRef)(true);
+  const clearHighlightedMessageTimeoutId = (0, import_react261.useRef)(
     null
   );
   const channelCapabilitiesArray = channel.data?.own_capabilities;
-  const throttledCopyStateFromChannel = (0, import_lodash21.default)(
+  const throttledCopyStateFromChannel = (0, import_lodash22.default)(
     () => dispatch({ channel, type: "copyStateFromChannelOnEvent" }),
     500,
     {
@@ -50303,15 +50283,15 @@ var ChannelInner = (props) => {
       trailing: true
     }
   );
-  const setChannelUnreadUiState = (0, import_react260.useMemo)(
-    () => (0, import_lodash21.default)(_setChannelUnreadUiState, 200, {
+  const setChannelUnreadUiState = (0, import_react261.useMemo)(
+    () => (0, import_lodash22.default)(_setChannelUnreadUiState, 200, {
       leading: true,
       trailing: false
     }),
     []
   );
-  const markRead = (0, import_react260.useMemo)(
-    () => (0, import_lodash21.default)(
+  const markRead = (0, import_react261.useMemo)(
+    () => (0, import_lodash22.default)(
       async (options) => {
         const { updateChannelUiUnreadState = true } = options ?? {};
         if (channel.disconnected || !channelConfig?.read_events) {
@@ -50413,7 +50393,7 @@ var ChannelInner = (props) => {
     }
     throttledCopyStateFromChannel();
   };
-  (0, import_react260.useLayoutEffect)(() => {
+  (0, import_react261.useLayoutEffect)(() => {
     let errored = false;
     let done = false;
     (async () => {
@@ -50479,12 +50459,12 @@ var ChannelInner = (props) => {
     channelConfig?.read_events,
     initializeOnMount
   ]);
-  (0, import_react260.useEffect)(() => {
+  (0, import_react261.useEffect)(() => {
     if (!state.thread) return;
     const message = state.messages?.find((m) => m.id === state.thread?.id);
     if (message) dispatch({ message, type: "setThread" });
   }, [state.messages, state.thread]);
-  const handleHighlightedMessageChange = (0, import_react260.useCallback)(
+  const handleHighlightedMessageChange = (0, import_react261.useCallback)(
     ({
       highlightDuration,
       highlightedMessageId
@@ -50507,16 +50487,16 @@ var ChannelInner = (props) => {
     },
     [channel, searchController]
   );
-  (0, import_react260.useEffect)(() => {
+  (0, import_react261.useEffect)(() => {
     if (!jumpToMessageFromSearch?.id) return;
     handleHighlightedMessageChange({ highlightedMessageId: jumpToMessageFromSearch.id });
   }, [jumpToMessageFromSearch, handleHighlightedMessageChange]);
-  const addNotification = (0, import_react260.useMemo)(
+  const addNotification = (0, import_react261.useMemo)(
     () => makeAddNotifications(setNotifications, notificationTimeouts.current),
     []
   );
-  const loadMoreFinished = (0, import_react260.useCallback)(
-    (0, import_lodash19.default)(
+  const loadMoreFinished = (0, import_react261.useCallback)(
+    (0, import_lodash20.default)(
       (hasMore, messages) => {
         if (!isMounted.current) return;
         dispatch({ hasMore, messages, type: "loadMoreFinished" });
@@ -50576,7 +50556,7 @@ var ChannelInner = (props) => {
     });
     return queryResponse.messages.length;
   };
-  const jumpToMessage = (0, import_react260.useCallback)(
+  const jumpToMessage = (0, import_react261.useCallback)(
     async (messageId, messageLimit = DEFAULT_JUMP_TO_PAGE_SIZE, highlightDuration = DEFAULT_HIGHLIGHT_DURATION) => {
       dispatch({ loadingMore: true, type: "setLoadingMore" });
       await channel.state.loadMessageIntoState(messageId, void 0, messageLimit);
@@ -50588,14 +50568,14 @@ var ChannelInner = (props) => {
     },
     [channel, handleHighlightedMessageChange, loadMoreFinished]
   );
-  const jumpToLatestMessage = (0, import_react260.useCallback)(async () => {
+  const jumpToLatestMessage = (0, import_react261.useCallback)(async () => {
     await channel.state.loadMessageIntoState("latest");
     loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
     dispatch({
       type: "jumpToLatestMessage"
     });
   }, [channel, loadMoreFinished]);
-  const jumpToFirstUnreadMessage = (0, import_react260.useCallback)(
+  const jumpToFirstUnreadMessage = (0, import_react261.useCallback)(
     async (queryMessageLimit = DEFAULT_JUMP_TO_PAGE_SIZE, highlightDuration = DEFAULT_HIGHLIGHT_DURATION) => {
       if (!channelUnreadUiState?.unread_messages) return;
       let lastReadMessageId = channelUnreadUiState?.last_read_message_id;
@@ -50718,7 +50698,7 @@ var ChannelInner = (props) => {
       channelUnreadUiState
     ]
   );
-  const deleteMessage = (0, import_react260.useCallback)(
+  const deleteMessage = (0, import_react261.useCallback)(
     async (message) => {
       if (!message?.id) {
         throw new Error("Cannot delete a message - missing message ID.");
@@ -50836,8 +50816,8 @@ var ChannelInner = (props) => {
     event?.preventDefault();
     dispatch({ type: "closeThread" });
   };
-  const loadMoreThreadFinished = (0, import_react260.useCallback)(
-    (0, import_lodash19.default)(
+  const loadMoreThreadFinished = (0, import_react261.useCallback)(
+    (0, import_lodash20.default)(
       (threadHasMore, threadMessages) => {
         dispatch({
           threadHasMore,
@@ -50891,7 +50871,7 @@ var ChannelInner = (props) => {
     videoAttachmentSizeHandler: props.videoAttachmentSizeHandler || getVideoAttachmentConfiguration,
     watcher_count: state.watcherCount
   });
-  const channelActionContextValue = (0, import_react260.useMemo)(
+  const channelActionContextValue = (0, import_react261.useMemo)(
     () => ({
       addNotification,
       closeThread,
@@ -50928,7 +50908,7 @@ var ChannelInner = (props) => {
       setChannelUnreadUiState
     ]
   );
-  const componentContextValue = (0, import_react260.useMemo)(
+  const componentContextValue = (0, import_react261.useMemo)(
     () => ({
       Attachment: props.Attachment,
       AttachmentPreviewList: props.AttachmentPreviewList,
@@ -50982,6 +50962,7 @@ var ChannelInner = (props) => {
       StartRecordingAudioButton: props.StartRecordingAudioButton,
       StopAIGenerationButton: props.StopAIGenerationButton,
       StreamedMessageText: props.StreamedMessageText,
+      TextareaComposer: props.TextareaComposer,
       ThreadHead: props.ThreadHead,
       ThreadHeader: props.ThreadHeader,
       ThreadStart: props.ThreadStart,
@@ -51044,6 +51025,7 @@ var ChannelInner = (props) => {
       props.StartRecordingAudioButton,
       props.StopAIGenerationButton,
       props.StreamedMessageText,
+      props.TextareaComposer,
       props.ThreadHead,
       props.ThreadHeader,
       props.ThreadStart,
@@ -51058,26 +51040,26 @@ var ChannelInner = (props) => {
     typing
   });
   if (state.error) {
-    return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react260.default.createElement(LoadingErrorIndicator2, { error: state.error }));
+    return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement(LoadingErrorIndicator2, { error: state.error }));
   }
   if (state.loading) {
-    return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react260.default.createElement(LoadingIndicator2, null));
+    return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement(LoadingIndicator2, null));
   }
   if (!channel.watch) {
-    return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react260.default.createElement("div", null, t("Channel Missing")));
+    return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement("div", null, t("Channel Missing")));
   }
-  return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, { className: windowsEmojiClass }, /* @__PURE__ */ import_react260.default.createElement(ChannelStateProvider, { value: channelStateContextValue }, /* @__PURE__ */ import_react260.default.createElement(ChannelActionProvider, { value: channelActionContextValue }, /* @__PURE__ */ import_react260.default.createElement(WithComponents, { overrides: componentContextValue }, /* @__PURE__ */ import_react260.default.createElement(TypingProvider, { value: typingContextValue }, /* @__PURE__ */ import_react260.default.createElement("div", { className: (0, import_clsx66.default)(chatContainerClass) }, children))))));
+  return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, { className: windowsEmojiClass }, /* @__PURE__ */ import_react261.default.createElement(ChannelStateProvider, { value: channelStateContextValue }, /* @__PURE__ */ import_react261.default.createElement(ChannelActionProvider, { value: channelActionContextValue }, /* @__PURE__ */ import_react261.default.createElement(WithComponents, { overrides: componentContextValue }, /* @__PURE__ */ import_react261.default.createElement(TypingProvider, { value: typingContextValue }, /* @__PURE__ */ import_react261.default.createElement("div", { className: (0, import_clsx66.default)(chatContainerClass) }, children))))));
 };
-var Channel = import_react260.default.memo(UnMemoizedChannel);
+var Channel = import_react261.default.memo(UnMemoizedChannel);
 
 // src/components/ChannelHeader/ChannelHeader.tsx
-var import_react262 = __toESM(require("react"));
+var import_react263 = __toESM(require("react"));
 
 // src/components/ChannelHeader/icons.tsx
-var import_react261 = __toESM(require("react"));
+var import_react262 = __toESM(require("react"));
 var MenuIcon2 = ({ title }) => {
   const { t } = useTranslationContext("MenuIcon");
-  return /* @__PURE__ */ import_react261.default.createElement("svg", { "data-testid": "menu-icon", viewBox: "0 0 448 512", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react261.default.createElement("title", null, title ?? t("Menu")), /* @__PURE__ */ import_react261.default.createElement(
+  return /* @__PURE__ */ import_react262.default.createElement("svg", { "data-testid": "menu-icon", viewBox: "0 0 448 512", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react262.default.createElement("title", null, title ?? t("Menu")), /* @__PURE__ */ import_react262.default.createElement(
     "path",
     {
       d: "M0 88C0 74.75 10.75 64 24 64H424C437.3 64 448 74.75 448 88C448 101.3 437.3 112 424 112H24C10.75 112 0 101.3 0 88zM0 248C0 234.7 10.75 224 24 224H424C437.3 224 448 234.7 448 248C448 261.3 437.3 272 424 272H24C10.75 272 0 261.3 0 248zM424 432H24C10.75 432 0 421.3 0 408C0 394.7 10.75 384 24 384H424C437.3 384 448 394.7 448 408C448 421.3 437.3 432 424 432z",
@@ -51104,15 +51086,15 @@ var ChannelHeader = (props) => {
     overrideTitle
   });
   const { member_count, subtitle } = channel?.data || {};
-  return /* @__PURE__ */ import_react262.default.createElement("div", { className: "str-chat__channel-header" }, /* @__PURE__ */ import_react262.default.createElement(
+  return /* @__PURE__ */ import_react263.default.createElement("div", { className: "str-chat__channel-header" }, /* @__PURE__ */ import_react263.default.createElement(
     "button",
     {
       "aria-label": t("aria/Menu"),
       className: "str-chat__header-hamburger",
       onClick: openMobileNav
     },
-    /* @__PURE__ */ import_react262.default.createElement(MenuIcon3, null)
-  ), /* @__PURE__ */ import_react262.default.createElement(
+    /* @__PURE__ */ import_react263.default.createElement(MenuIcon3, null)
+  ), /* @__PURE__ */ import_react263.default.createElement(
     Avatar2,
     {
       className: "str-chat__avatar--channel-header",
@@ -51120,36 +51102,36 @@ var ChannelHeader = (props) => {
       image: displayImage,
       name: displayTitle
     }
-  ), /* @__PURE__ */ import_react262.default.createElement("div", { className: "str-chat__channel-header-end" }, /* @__PURE__ */ import_react262.default.createElement("p", { className: "str-chat__channel-header-title" }, displayTitle, " ", live && /* @__PURE__ */ import_react262.default.createElement("span", { className: "str-chat__header-livestream-livelabel" }, t("live"))), subtitle && /* @__PURE__ */ import_react262.default.createElement("p", { className: "str-chat__channel-header-subtitle" }, subtitle), /* @__PURE__ */ import_react262.default.createElement("p", { className: "str-chat__channel-header-info" }, !live && !!member_count && member_count > 0 && /* @__PURE__ */ import_react262.default.createElement(import_react262.default.Fragment, null, t("{{ memberCount }} members", {
+  ), /* @__PURE__ */ import_react263.default.createElement("div", { className: "str-chat__channel-header-end" }, /* @__PURE__ */ import_react263.default.createElement("p", { className: "str-chat__channel-header-title" }, displayTitle, " ", live && /* @__PURE__ */ import_react263.default.createElement("span", { className: "str-chat__header-livestream-livelabel" }, t("live"))), subtitle && /* @__PURE__ */ import_react263.default.createElement("p", { className: "str-chat__channel-header-subtitle" }, subtitle), /* @__PURE__ */ import_react263.default.createElement("p", { className: "str-chat__channel-header-info" }, !live && !!member_count && member_count > 0 && /* @__PURE__ */ import_react263.default.createElement(import_react263.default.Fragment, null, t("{{ memberCount }} members", {
     memberCount: member_count
   }), ",", " "), t("{{ watcherCount }} online", { watcherCount: watcher_count }))));
 };
 
 // src/components/Chat/Chat.tsx
-var import_react266 = __toESM(require("react"));
+var import_react267 = __toESM(require("react"));
 var import_stream_chat12 = require("stream-chat");
 
 // src/components/Chat/hooks/useChat.ts
-var import_react263 = require("react");
+var import_react264 = require("react");
 var useChat = ({
   client,
   defaultLanguage = "en",
   i18nInstance,
   initialNavOpen
 }) => {
-  const [translators, setTranslators] = (0, import_react263.useState)({
+  const [translators, setTranslators] = (0, import_react264.useState)({
     t: (key) => key,
     tDateTimeParser: defaultDateTimeParser,
     userLanguage: "en"
   });
-  const [channel, setChannel] = (0, import_react263.useState)();
-  const [mutes, setMutes] = (0, import_react263.useState)([]);
-  const [navOpen, setNavOpen] = (0, import_react263.useState)(initialNavOpen);
-  const [latestMessageDatesByChannels, setLatestMessageDatesByChannels] = (0, import_react263.useState)({});
+  const [channel, setChannel] = (0, import_react264.useState)();
+  const [mutes, setMutes] = (0, import_react264.useState)([]);
+  const [navOpen, setNavOpen] = (0, import_react264.useState)(initialNavOpen);
+  const [latestMessageDatesByChannels, setLatestMessageDatesByChannels] = (0, import_react264.useState)({});
   const clientMutes = client.user?.mutes ?? [];
   const closeMobileNav = () => setNavOpen(false);
   const openMobileNav = () => setTimeout(() => setNavOpen(true), 100);
-  const appSettings = (0, import_react263.useRef)(null);
+  const appSettings = (0, import_react264.useRef)(null);
   const getAppSettings = () => {
     if (appSettings.current) {
       return appSettings.current;
@@ -51157,9 +51139,9 @@ var useChat = ({
     appSettings.current = client.getAppSettings();
     return appSettings.current;
   };
-  (0, import_react263.useEffect)(() => {
+  (0, import_react264.useEffect)(() => {
     if (!client) return;
-    const version = "13.0.0-rc.2";
+    const version = "13.0.0";
     const userAgent = client.getUserAgent();
     if (!userAgent.includes("stream-chat-react")) {
       client.setUserAgent(`stream-chat-react-${version}-${userAgent}`);
@@ -51171,7 +51153,7 @@ var useChat = ({
       client.polls.unregisterSubscriptions();
     };
   }, [client]);
-  (0, import_react263.useEffect)(() => {
+  (0, import_react264.useEffect)(() => {
     setMutes(clientMutes);
     const handleEvent = (event) => {
       setMutes(event.me?.mutes || []);
@@ -51179,7 +51161,7 @@ var useChat = ({
     client.on("notification.mutes_updated", handleEvent);
     return () => client.off("notification.mutes_updated", handleEvent);
   }, [clientMutes?.length]);
-  (0, import_react263.useEffect)(() => {
+  (0, import_react264.useEffect)(() => {
     let userLanguage = client.user?.language;
     if (!userLanguage) {
       const browserLanguage = window.navigator.language.slice(0, 2);
@@ -51196,7 +51178,7 @@ var useChat = ({
       });
     });
   }, [i18nInstance]);
-  const setActiveChannel = (0, import_react263.useCallback)(
+  const setActiveChannel = (0, import_react264.useCallback)(
     async (activeChannel, watchers = {}, event) => {
       if (event && event.preventDefault) event.preventDefault();
       if (activeChannel && Object.keys(watchers).length) {
@@ -51207,7 +51189,7 @@ var useChat = ({
     },
     []
   );
-  (0, import_react263.useEffect)(() => {
+  (0, import_react264.useEffect)(() => {
     setLatestMessageDatesByChannels({});
   }, [client.user?.id]);
   return {
@@ -51224,7 +51206,7 @@ var useChat = ({
 };
 
 // src/components/Chat/hooks/useCreateChatContext.ts
-var import_react264 = require("react");
+var import_react265 = require("react");
 var useCreateChatContext = (value) => {
   const {
     channel,
@@ -51249,7 +51231,7 @@ var useCreateChatContext = (value) => {
   const clientValues = `${client.clientID}${Object.keys(client.activeChannels).length}${Object.keys(client.listeners).length}${client.mutedChannels.length}
   ${client.user?.id}`;
   const mutedUsersLength = mutes.length;
-  const chatContext = (0, import_react264.useMemo)(
+  const chatContext = (0, import_react265.useMemo)(
     () => ({
       channel,
       channelsQueryState,
@@ -51284,10 +51266,10 @@ var useCreateChatContext = (value) => {
 };
 
 // src/components/Chat/hooks/useChannelsQueryState.ts
-var import_react265 = require("react");
+var import_react266 = require("react");
 var useChannelsQueryState = () => {
-  const [error, setError] = (0, import_react265.useState)(null);
-  const [queryInProgress, setQueryInProgress] = (0, import_react265.useState)("uninitialized");
+  const [error, setError] = (0, import_react266.useState)(null);
+  const [queryInProgress, setQueryInProgress] = (0, import_react266.useState)("uninitialized");
   return {
     error,
     queryInProgress,
@@ -51322,7 +51304,7 @@ var Chat = (props) => {
     translators
   } = useChat({ client, defaultLanguage, i18nInstance, initialNavOpen });
   const channelsQueryState = useChannelsQueryState();
-  const searchController = (0, import_react266.useMemo)(
+  const searchController = (0, import_react267.useMemo)(
     () => customChannelSearchController ?? new import_stream_chat12.SearchController({
       sources: [
         new import_stream_chat12.ChannelSearchSource(client),
@@ -51350,11 +51332,11 @@ var Chat = (props) => {
     useImageFlagEmojisOnWindows
   });
   if (!translators.t) return null;
-  return /* @__PURE__ */ import_react266.default.createElement(ChatProvider, { value: chatContextValue }, /* @__PURE__ */ import_react266.default.createElement(TranslationProvider, { value: translators }, children));
+  return /* @__PURE__ */ import_react267.default.createElement(ChatProvider, { value: chatContextValue }, /* @__PURE__ */ import_react267.default.createElement(TranslationProvider, { value: translators }, children));
 };
 
 // src/components/Chat/hooks/useCreateChatClient.ts
-var import_react267 = require("react");
+var import_react268 = require("react");
 var import_stream_chat13 = require("stream-chat");
 var useCreateChatClient = ({
   apiKey,
@@ -51362,13 +51344,13 @@ var useCreateChatClient = ({
   tokenOrProvider,
   userData
 }) => {
-  const [chatClient, setChatClient] = (0, import_react267.useState)(null);
-  const [cachedUserData, setCachedUserData] = (0, import_react267.useState)(userData);
+  const [chatClient, setChatClient] = (0, import_react268.useState)(null);
+  const [cachedUserData, setCachedUserData] = (0, import_react268.useState)(userData);
   if (userData.id !== cachedUserData.id) {
     setCachedUserData(userData);
   }
-  const [cachedOptions] = (0, import_react267.useState)(options);
-  (0, import_react267.useEffect)(() => {
+  const [cachedOptions] = (0, import_react268.useState)(options);
+  (0, import_react268.useEffect)(() => {
     const client = new import_stream_chat13.StreamChat(apiKey, void 0, cachedOptions);
     let didUserConnectInterrupt = false;
     const connectionPromise = client.connectUser(cachedUserData, tokenOrProvider).then(() => {
@@ -51386,12 +51368,12 @@ var useCreateChatClient = ({
 };
 
 // src/components/Window/Window.tsx
-var import_react268 = __toESM(require("react"));
+var import_react269 = __toESM(require("react"));
 var import_clsx67 = __toESM(require("clsx"));
 var UnMemoizedWindow = (props) => {
   const { children, thread: propThread } = props;
   const { thread: contextThread } = useChannelStateContext("Window");
-  return /* @__PURE__ */ import_react268.default.createElement(
+  return /* @__PURE__ */ import_react269.default.createElement(
     "div",
     {
       className: (0, import_clsx67.default)("str-chat__main-panel", {
@@ -51401,7 +51383,7 @@ var UnMemoizedWindow = (props) => {
     children
   );
 };
-var Window = import_react268.default.memo(UnMemoizedWindow);
+var Window = import_react269.default.memo(UnMemoizedWindow);
 /*! Bundled license information:
 
 is-buffer/index.js: