stream-chat-react 13.6.1 → 13.6.2

package/dist/components/Chat/hooks/useChat.js

@@ -24,7 +24,7 @@ export const useChat = ({ client, defaultLanguage = 'en', i18nInstance, initialN
     useEffect(() => {
         if (!client)
             return;
-        const version = "13.6.1";
+        const version = "13.6.2";
         const userAgent = client.getUserAgent();
         if (!userAgent.includes('stream-chat-react')) {
             // result looks like: 'stream-chat-react-2.3.2-stream-chat-javascript-client-browser-2.2.2'

package/dist/components/TextareaComposer/TextareaComposer.js

@@ -160,6 +160,16 @@ export const TextareaComposer = ({ className, closeSuggestionsOnClickOutside, co
         const textarea = textareaRef.current;
         if (!textarea || isComposing)
             return;
+        /**
+         * The textarea value has to be overridden outside the render cycle so that the events like compositionend can be triggered.
+         * If we have overridden the value during the component rendering, the compositionend event would not be triggered, and
+         * it would not be possible to type composed characters (ô).
+         * On the other hand, just removing the value override via prop (value={text}) would not allow us to change the text based on
+         * middleware results (e.g. replace characters with emojis)
+         */
+        if (textarea.value !== text) {
+            textarea.value = text;
+        }
         const length = textarea.value.length;
         const start = Math.max(0, Math.min(selection.start, length));
         const end = Math.max(start, Math.min(selection.end, length));
@@ -172,6 +182,6 @@ export const TextareaComposer = ({ className, closeSuggestionsOnClickOutside, co
         }), ref: containerRef },
         React.createElement(Textarea, { ...additionalTextareaProps, ...restTextareaProps, "aria-label": cooldownRemaining ? t('Slow Mode ON') : placeholder, className: clsx('rta__textarea', 'str-chat__textarea__textarea str-chat__message-textarea', className), "data-testid": 'message-input', disabled: !enabled || !!cooldownRemaining, maxRows: maxRows, minRows: minRows, onBlur: onBlur, onChange: changeHandler, onCompositionEnd: onCompositionEnd, onCompositionStart: onCompositionStart, onKeyDown: keyDownHandler, onPaste: onPaste, onScroll: scrollHandler, onSelect: setSelection, placeholder: placeholder || t('Type your message'), ref: (ref) => {
                 textareaRef.current = ref;
-            }, value: text }),
+            } }),
         !isComposing && (React.createElement(AutocompleteSuggestionList, { className: listClassName, closeOnClickOutside: closeSuggestionsOnClickOutside, focusedItemIndex: focusedItemIndex, setFocusedItemIndex: setFocusedItemIndex }))));
 };

package/dist/index.browser.cjs

@@ -33454,6 +33454,9 @@ var TextareaComposer = ({
   (0, import_react255.useLayoutEffect)(() => {
     const textarea = textareaRef.current;
     if (!textarea || isComposing) return;
+    if (textarea.value !== text7) {
+      textarea.value = text7;
+    }
     const length = textarea.value.length;
     const start2 = Math.max(0, Math.min(selection.start, length));
     const end = Math.max(start2, Math.min(selection.end, length));
@@ -33498,8 +33501,7 @@ var TextareaComposer = ({
         placeholder: placeholder || t("Type your message"),
         ref: (ref) => {
           textareaRef.current = ref;
-        },
-        value: text7
+        }
       }
     ),
     !isComposing && /* @__PURE__ */ import_react255.default.createElement(
@@ -36115,7 +36117,7 @@ var useChat = ({
   };
   (0, import_react282.useEffect)(() => {
     if (!client) return;
-    const version = "13.6.1";
+    const version = "13.6.2";
     const userAgent = client.getUserAgent();
     if (!userAgent.includes("stream-chat-react")) {
       client.setUserAgent(`stream-chat-react-${version}-${userAgent}`);