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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sage-rsc/talking-head-react",
-  "version": "1.0.62",
+  "version": "1.0.63",
   "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

@@ -53,6 +53,7 @@ const TalkingHeadAvatar = forwardRef(({
   const pausedSpeechRef = useRef(null); // Track paused speech for resume
   const speechEndIntervalRef = useRef(null); // Track onSpeechEnd polling interval
   const isPausedRef = useRef(false); // Track pause state for interval checks
+  const speechProgressRef = useRef({ remainingText: null, originalText: null, options: null }); // Track speech progress for resume
   const [isLoading, setIsLoading] = useState(true);
   const [error, setError] = useState(null);
   const [isReady, setIsReady] = useState(false);
@@ -292,7 +293,10 @@ const TalkingHeadAvatar = forwardRef(({
         
         // Store speech for potential pause/resume
         pausedSpeechRef.current = { text: textToSpeak, options };
+        // Reset progress tracking when starting new speech
+        speechProgressRef.current = { remainingText: null, originalText: null, options: null };
         setIsPaused(false);
+        isPausedRef.current = false;
         
         // Always resume audio context first (required for user interaction)
         await resumeAudioContext();
@@ -436,6 +440,29 @@ const TalkingHeadAvatar = forwardRef(({
           speechEndIntervalRef.current = null;
         }
         
+        // Save remaining text from speechQueue before clearing it
+        let remainingText = '';
+        if (talkingHead.speechQueue && talkingHead.speechQueue.length > 0) {
+          // Extract text from remaining queue items
+          const remainingParts = talkingHead.speechQueue
+            .filter(item => item.text) // Only get items with text
+            .map(item => item.text)
+            .join(' ');
+          
+          if (remainingParts) {
+            remainingText = remainingParts.trim();
+          }
+        }
+        
+        // If we have remaining text, save it for resume
+        if (remainingText && pausedSpeechRef.current) {
+          speechProgressRef.current = {
+            remainingText: remainingText,
+            originalText: pausedSpeechRef.current.text,
+            options: pausedSpeechRef.current.options
+          };
+        }
+        
         // Clear speech queue to prevent next statements from playing
         if (talkingHead.speechQueue) {
           talkingHead.speechQueue.length = 0;
@@ -450,20 +477,37 @@ const TalkingHeadAvatar = forwardRef(({
   }, []);
 
   const resumeSpeaking = useCallback(async () => {
-    if (talkingHeadRef.current && isPaused && pausedSpeechRef.current && pausedSpeechRef.current.text) {
-      const pausedSpeech = pausedSpeechRef.current;
-      const pausedOptions = pausedSpeech.options || {};
-      
+    if (talkingHeadRef.current && isPaused) {
       // Clear pause state first
       setIsPaused(false);
+      isPausedRef.current = false;
       
       // Resume audio context
       await resumeAudioContext();
       
-      // Re-speak the paused text with original options (including onSpeechEnd callback)
+      // 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 = {
-        ...pausedOptions,
-        lipsyncLang: pausedOptions.lipsyncLang || defaultAvatarConfig.lipsyncLang || 'en'
+        ...optionsToUse,
+        lipsyncLang: optionsToUse.lipsyncLang || defaultAvatarConfig.lipsyncLang || 'en'
       };
       
       // Use speakText method which will set up the onSpeechEnd callback again
@@ -472,10 +516,8 @@ const TalkingHeadAvatar = forwardRef(({
           talkingHeadRef.current.setSlowdownRate(1.05);
         }
         // Call speakText which will handle everything including onSpeechEnd
-        await speakText(pausedSpeech.text, speakOptions);
+        await speakText(textToSpeak, speakOptions);
       }
-      
-      // Don't clear pausedSpeechRef here - speakText will handle it
     }
   }, [resumeAudioContext, isPaused, speakText]);