stream-chat-react 13.13.3 → 13.13.5

package/dist/components/AIStateIndicator/hooks/useAIState.d.ts

@@ -4,6 +4,7 @@ export declare const AIStates: {
     ExternalSources: string;
     Generating: string;
     Idle: string;
+    Stop: string;
     Thinking: string;
 };
 /**

package/dist/components/AIStateIndicator/hooks/useAIState.js

@@ -4,6 +4,7 @@ export const AIStates = {
     ExternalSources: 'AI_STATE_EXTERNAL_SOURCES',
     Generating: 'AI_STATE_GENERATING',
     Idle: 'AI_STATE_IDLE',
+    Stop: 'AI_STATE_STOP',
     Thinking: 'AI_STATE_THINKING',
 };
 /**
@@ -30,9 +31,16 @@ export const useAIState = (channel) => {
                 setAiState(AIStates.Idle);
             }
         });
+        const indicatorStoppedListener = channel.on('ai_indicator.stop', (event) => {
+            const { cid } = event;
+            if (channel.cid === cid) {
+                setAiState(AIStates.Stop);
+            }
+        });
         return () => {
             indicatorChangedListener.unsubscribe();
             indicatorClearedListener.unsubscribe();
+            indicatorStoppedListener.unsubscribe();
         };
     }, [channel]);
     return { aiState };

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.13.3";
+        const version = "13.13.5";
         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/Message/StreamedMessageText.js

@@ -1,16 +1,22 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import { MessageText } from './MessageText';
-import { useMessageContext } from '../../context';
+import { useChannelStateContext, useMessageContext } from '../../context';
 import { useMessageTextStreaming } from './hooks';
 export const StreamedMessageText = (props) => {
     const { message: messageFromProps, renderingLetterCount, renderText, streamingLetterIntervalMs, } = props;
     const { message: messageFromContext } = useMessageContext('StreamedMessageText');
+    const { channel } = useChannelStateContext();
     const message = messageFromProps || messageFromContext;
     const { text = '' } = message;
-    const { streamedMessageText } = useMessageTextStreaming({
+    const { skipAnimation, streamedMessageText } = useMessageTextStreaming({
         renderingLetterCount,
         streamingLetterIntervalMs,
         text,
     });
+    useEffect(() => {
+        channel?.on('ai_indicator.stop', () => {
+            skipAnimation();
+        });
+    }, [channel, skipAnimation]);
     return (React.createElement(MessageText, { message: { ...message, text: streamedMessageText }, renderText: renderText }));
 };

package/dist/components/Message/hooks/useMessageTextStreaming.d.ts

@@ -11,5 +11,6 @@ export type UseMessageTextStreamingProps = Pick<StreamedMessageTextProps, 'strea
  * @returns {{ streamedMessageText: string }} - A substring of the text property, up until we've finished rendering the typewriter animation.
  */
 export declare const useMessageTextStreaming: ({ renderingLetterCount, streamingLetterIntervalMs, text, }: UseMessageTextStreamingProps) => {
-    streamedMessageText: string;
+    readonly skipAnimation: import("../../../utils/useStableCallback").StableCallback<[], void>;
+    readonly streamedMessageText: string;
 };

package/dist/components/Message/hooks/useMessageTextStreaming.js

@@ -1,4 +1,5 @@
 import { useEffect, useRef, useState } from 'react';
+import { useStableCallback } from '../../../utils/useStableCallback';
 const DEFAULT_LETTER_INTERVAL = 30;
 const DEFAULT_RENDERING_LETTER_COUNT = 2;
 /**
@@ -17,6 +18,7 @@ export const useMessageTextStreaming = ({ renderingLetterCount = DEFAULT_RENDERI
         const interval = setInterval(() => {
             if (!text || textCursor.current >= textLength) {
                 clearInterval(interval);
+                return;
             }
             const newCursorValue = textCursor.current + renderingLetterCount;
             const newText = text.substring(0, newCursorValue);
@@ -27,5 +29,9 @@ export const useMessageTextStreaming = ({ renderingLetterCount = DEFAULT_RENDERI
             clearInterval(interval);
         };
     }, [streamingLetterIntervalMs, renderingLetterCount, text]);
-    return { streamedMessageText };
+    const skipAnimation = useStableCallback(() => {
+        textCursor.current = text.length;
+        setStreamedMessageText(text);
+    });
+    return { skipAnimation, streamedMessageText };
 };

package/dist/components/MessageList/hooks/useMarkRead.js

@@ -19,6 +19,8 @@ export const useMarkRead = ({ isMessageListScrolledToBottom, messageListIsThread
     const { markRead, setChannelUnreadUiState } = useChannelActionContext('useMarkRead');
     const { channel } = useChannelStateContext('useMarkRead');
     useEffect(() => {
+        if (!channel.getConfig()?.read_events)
+            return;
         const shouldMarkRead = () => !document.hidden &&
             !wasMarkedUnread &&
             !messageListIsThread &&

package/dist/index.browser.cjs

@@ -729,6 +729,7 @@ var AIStates = {
   ExternalSources: "AI_STATE_EXTERNAL_SOURCES",
   Generating: "AI_STATE_GENERATING",
   Idle: "AI_STATE_IDLE",
+  Stop: "AI_STATE_STOP",
   Thinking: "AI_STATE_THINKING"
 };
 var useAIState = (channel) => {
@@ -750,9 +751,16 @@ var useAIState = (channel) => {
         setAiState(AIStates.Idle);
       }
     });
+    const indicatorStoppedListener = channel.on("ai_indicator.stop", (event) => {
+      const { cid } = event;
+      if (channel.cid === cid) {
+        setAiState(AIStates.Stop);
+      }
+    });
     return () => {
       indicatorChangedListener.unsubscribe();
       indicatorClearedListener.unsubscribe();
+      indicatorStoppedListener.unsubscribe();
     };
   }, [channel]);
   return { aiState };
@@ -16927,6 +16935,7 @@ var useMessageTextStreaming = ({
     const interval = setInterval(() => {
       if (!text8 || textCursor.current >= textLength) {
         clearInterval(interval);
+        return;
       }
       const newCursorValue = textCursor.current + renderingLetterCount;
       const newText = text8.substring(0, newCursorValue);
@@ -16937,7 +16946,11 @@ var useMessageTextStreaming = ({
       clearInterval(interval);
     };
   }, [streamingLetterIntervalMs, renderingLetterCount, text8]);
-  return { streamedMessageText };
+  const skipAnimation = useStableCallback(() => {
+    textCursor.current = text8.length;
+    setStreamedMessageText(text8);
+  });
+  return { skipAnimation, streamedMessageText };
 };
 
 // src/components/Message/hooks/useMessageReminder.ts
@@ -24077,13 +24090,19 @@ var StreamedMessageText = (props) => {
     streamingLetterIntervalMs
   } = props;
   const { message: messageFromContext } = useMessageContext("StreamedMessageText");
+  const { channel } = useChannelStateContext();
   const message = messageFromProps || messageFromContext;
   const { text: text8 = "" } = message;
-  const { streamedMessageText } = useMessageTextStreaming({
+  const { skipAnimation, streamedMessageText } = useMessageTextStreaming({
     renderingLetterCount,
     streamingLetterIntervalMs,
     text: text8
   });
+  (0, import_react160.useEffect)(() => {
+    channel?.on("ai_indicator.stop", () => {
+      skipAnimation();
+    });
+  }, [channel, skipAnimation]);
   return /* @__PURE__ */ import_react160.default.createElement(
     MessageText,
     {
@@ -28622,6 +28641,7 @@ var useMarkRead = ({
   const { markRead, setChannelUnreadUiState } = useChannelActionContext("useMarkRead");
   const { channel } = useChannelStateContext("useMarkRead");
   (0, import_react173.useEffect)(() => {
+    if (!channel.getConfig()?.read_events) return;
     const shouldMarkRead = () => !document.hidden && !wasMarkedUnread && !messageListIsThread && isMessageListScrolledToBottom && client.user?.id && !hasReadLastMessage(channel, client.user.id);
     const onVisibilityChange = () => {
       if (shouldMarkRead()) markRead();
@@ -37399,7 +37419,7 @@ var useChat = ({
   };
   (0, import_react289.useEffect)(() => {
     if (!client) return;
-    const version = "13.13.3";
+    const version = "13.13.5";
     const userAgent = client.getUserAgent();
     if (!userAgent.includes("stream-chat-react")) {
       client.setUserAgent(`stream-chat-react-${version}-${userAgent}`);