@sage-rsc/talking-head-react 1.0.63 → 1.0.65

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sage-rsc/talking-head-react",
-  "version": "1.0.63",
+  "version": "1.0.65",
   "description": "A reusable React component for 3D talking avatars with lip-sync and text-to-speech",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",

package/src/components/TalkingHeadAvatar.jsx

@@ -442,22 +442,30 @@ const TalkingHeadAvatar = forwardRef(({
         
         // Save remaining text from speechQueue before clearing it
         let remainingText = '';
-        if (talkingHead.speechQueue && talkingHead.speechQueue.length > 0) {
+        if (talkingHead.speechQueue && talkingHead.speechQueue.length > 0 && pausedSpeechRef.current) {
           // Extract text from remaining queue items
+          // Note: item.text is an array of objects like [{mark: 0, word: "Hello"}, {mark: 1, word: "world"}]
           const remainingParts = talkingHead.speechQueue
-            .filter(item => item.text) // Only get items with text
-            .map(item => item.text)
+            .filter(item => item && item.text && Array.isArray(item.text) && item.text.length > 0)
+            .map(item => {
+              // Extract words from the text array
+              return item.text
+                .map(wordObj => wordObj.word || '')
+                .filter(word => word.length > 0)
+                .join(' ');
+            })
+            .filter(text => text.length > 0)
             .join(' ');
           
-          if (remainingParts) {
+          if (remainingParts && remainingParts.trim()) {
             remainingText = remainingParts.trim();
           }
         }
         
-        // If we have remaining text, save it for resume
-        if (remainingText && pausedSpeechRef.current) {
+        // Always save progress for resume (even if no remaining text, we'll resume from beginning)
+        if (pausedSpeechRef.current) {
           speechProgressRef.current = {
-            remainingText: remainingText,
+            remainingText: remainingText || null,
             originalText: pausedSpeechRef.current.text,
             options: pausedSpeechRef.current.options
           };
@@ -477,49 +485,55 @@ const TalkingHeadAvatar = forwardRef(({
   }, []);
 
   const resumeSpeaking = useCallback(async () => {
-    if (talkingHeadRef.current && isPaused) {
-      // Clear pause state first
+    if (!talkingHeadRef.current || !isPaused) {
+      return;
+    }
+    
+    // Determine what text to speak - use remaining text if available, otherwise full text
+    let textToSpeak = '';
+    let optionsToUse = {};
+    
+    if (speechProgressRef.current && speechProgressRef.current.remainingText) {
+      // Resume from where we paused - speak only the remaining text
+      textToSpeak = speechProgressRef.current.remainingText;
+      optionsToUse = speechProgressRef.current.options || {};
+      // Clear progress after using it
+      speechProgressRef.current = { remainingText: null, originalText: null, options: null };
+    } else if (pausedSpeechRef.current && pausedSpeechRef.current.text) {
+      // Fallback: if no progress tracked, resume from beginning
+      textToSpeak = pausedSpeechRef.current.text;
+      optionsToUse = pausedSpeechRef.current.options || {};
+    } else {
+      // Nothing to resume
+      console.warn('Resume called but no paused speech found');
+      setIsPaused(false);
+      isPausedRef.current = false;
+      return;
+    }
+    
+    // Clear pause state before speaking
+    setIsPaused(false);
+    isPausedRef.current = false;
+    
+    // Resume audio context
+    await resumeAudioContext();
+    
+    // Prepare speak options
+    const speakOptions = {
+      ...optionsToUse,
+      lipsyncLang: optionsToUse.lipsyncLang || defaultAvatarConfig.lipsyncLang || 'en'
+    };
+    
+    // Use speakText method which will set up the onSpeechEnd callback again
+    try {
+      await speakText(textToSpeak, speakOptions);
+    } catch (error) {
+      console.error('Error resuming speech:', error);
+      // Reset pause state on error
       setIsPaused(false);
       isPausedRef.current = false;
-      
-      // Resume audio context
-      await resumeAudioContext();
-      
-      // Determine what text to speak - use remaining text if available, otherwise full text
-      let textToSpeak = '';
-      let optionsToUse = {};
-      
-      if (speechProgressRef.current && speechProgressRef.current.remainingText) {
-        // Resume from where we paused - speak only the remaining text
-        textToSpeak = speechProgressRef.current.remainingText;
-        optionsToUse = speechProgressRef.current.options || {};
-        // Clear progress after using it
-        speechProgressRef.current = { remainingText: null, originalText: null, options: null };
-      } else if (pausedSpeechRef.current && pausedSpeechRef.current.text) {
-        // Fallback: if no progress tracked, resume from beginning
-        textToSpeak = pausedSpeechRef.current.text;
-        optionsToUse = pausedSpeechRef.current.options || {};
-      } else {
-        // Nothing to resume
-        return;
-      }
-      
-      // Prepare speak options
-      const speakOptions = {
-        ...optionsToUse,
-        lipsyncLang: optionsToUse.lipsyncLang || defaultAvatarConfig.lipsyncLang || 'en'
-      };
-      
-      // Use speakText method which will set up the onSpeechEnd callback again
-      if (talkingHeadRef.current.lipsync && Object.keys(talkingHeadRef.current.lipsync).length > 0) {
-        if (talkingHeadRef.current.setSlowdownRate) {
-          talkingHeadRef.current.setSlowdownRate(1.05);
-        }
-        // Call speakText which will handle everything including onSpeechEnd
-        await speakText(textToSpeak, speakOptions);
-      }
     }
-  }, [resumeAudioContext, isPaused, speakText]);
+  }, [resumeAudioContext, isPaused, speakText, defaultAvatarConfig]);
 
   const setMood = useCallback((mood) => {
     if (talkingHeadRef.current) {