@sage-rsc/talking-head-react 1.0.26 → 1.0.28

package/dist/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("./index-BAyfuKmk.cjs");exports.CurriculumLearning=i.CurriculumLearning;exports.TalkingHeadAvatar=i.TalkingHeadAvatar;exports.TalkingHeadComponent=i.TalkingHeadComponent;exports.animations=i.animations;exports.getActiveTTSConfig=i.getActiveTTSConfig;exports.getAnimation=i.getAnimation;exports.getVoiceOptions=i.getVoiceOptions;exports.hasAnimation=i.hasAnimation;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("./index-Dx7mDKJm.cjs");exports.CurriculumLearning=i.CurriculumLearning;exports.TalkingHeadAvatar=i.TalkingHeadAvatar;exports.TalkingHeadComponent=i.TalkingHeadComponent;exports.animations=i.animations;exports.getActiveTTSConfig=i.getActiveTTSConfig;exports.getAnimation=i.getAnimation;exports.getVoiceOptions=i.getVoiceOptions;exports.hasAnimation=i.hasAnimation;

package/dist/index.js

@@ -1,4 +1,4 @@
-import { C as n, T as s, a as t, d as e, b as o, g, c as m, h as r } from "./index-R68Q6EcC.js";
+import { C as n, T as s, a as t, d as e, b as o, g, c as m, h as r } from "./index-zMY6cyU2.js";
 export {
   n as CurriculumLearning,
   s as TalkingHeadAvatar,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sage-rsc/talking-head-react",
-  "version": "1.0.26",
+  "version": "1.0.28",
   "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/CurriculumLearning.jsx

@@ -51,6 +51,11 @@ const CurriculumLearning = forwardRef(({
     onCustomAction
   });
 
+  // Refs for functions to avoid circular dependencies
+  const startTeachingRef = useRef(null);
+  const nextLessonRef = useRef(null);
+  const completeLessonRef = useRef(null);
+
   // Update callbacks ref when they change
   useEffect(() => {
     callbacksRef.current = {
@@ -111,13 +116,20 @@ const CurriculumLearning = forwardRef(({
     return false;
   }, []);
 
-  // Complete current lesson
+  // Complete current lesson - defined before it's used to avoid circular dependency
   const completeLesson = useCallback(() => {
     stateRef.current.lessonCompleted = true;
     stateRef.current.isQuestionMode = false;
     
-    const percentage = Math.round((stateRef.current.score / stateRef.current.totalQuestions) * 100);
-    let feedbackMessage = `Congratulations! You've completed this lesson with a score of ${stateRef.current.score} out of ${stateRef.current.totalQuestions} (${percentage}%). `;
+    const percentage = stateRef.current.totalQuestions > 0 
+      ? Math.round((stateRef.current.score / stateRef.current.totalQuestions) * 100)
+      : 100;
+    let feedbackMessage = `Congratulations! You've completed this lesson`;
+    if (stateRef.current.totalQuestions > 0) {
+      feedbackMessage += ` with a score of ${stateRef.current.score} out of ${stateRef.current.totalQuestions} (${percentage}%). `;
+    } else {
+      feedbackMessage += `! `;
+    }
     
     if (percentage >= 80) {
       feedbackMessage += "Excellent work! You have a great understanding of this topic.";
@@ -135,6 +147,16 @@ const CurriculumLearning = forwardRef(({
       percentage: percentage
     });
     
+    // Trigger custom action for lesson completion
+    callbacksRef.current.onCustomAction({
+      type: 'lessonComplete',
+      moduleIndex: stateRef.current.currentModuleIndex,
+      lessonIndex: stateRef.current.currentLessonIndex,
+      score: stateRef.current.score,
+      totalQuestions: stateRef.current.totalQuestions,
+      percentage: percentage
+    });
+    
     if (avatarRef.current) {
         avatarRef.current.setMood("happy");
       if (animations.lessonComplete) {
@@ -144,9 +166,39 @@ const CurriculumLearning = forwardRef(({
         avatarRef.current.playCelebration();
         }
       }
-      avatarRef.current.speakText(feedbackMessage, { lipsyncLang: defaultAvatarConfig.lipsyncLang });
+      
+      // Check if there's a next lesson available
+      const currentModule = curriculum.modules[stateRef.current.currentModuleIndex];
+      const hasNextLesson = stateRef.current.currentLessonIndex < (currentModule?.lessons?.length || 0) - 1;
+      
+      if (hasNextLesson) {
+        // Wait for speech to finish, then automatically move to next lesson
+        avatarRef.current.speakText(feedbackMessage, { 
+          lipsyncLang: defaultAvatarConfig.lipsyncLang,
+          onSpeechEnd: () => {
+            // Add a small delay after speech ends for natural flow
+            setTimeout(() => {
+              // Use ref to avoid circular dependency
+              if (nextLessonRef.current) {
+                nextLessonRef.current();
+              }
+            }, 1000);
+          }
+        });
+      } else {
+        // This is the last lesson, complete curriculum instead
+        avatarRef.current.speakText(feedbackMessage, { 
+          lipsyncLang: defaultAvatarConfig.lipsyncLang,
+          onSpeechEnd: () => {
+            // Add a small delay after speech ends for natural flow
+            setTimeout(() => {
+              completeCurriculum();
+            }, 1000);
+          }
+        });
+      }
     }
-  }, [animations.lessonComplete, defaultAvatarConfig]);
+  }, [animations.lessonComplete, curriculum, completeCurriculum, defaultAvatarConfig]);
 
   // Complete entire curriculum
   const completeCurriculum = useCallback(() => {
@@ -246,7 +298,7 @@ const CurriculumLearning = forwardRef(({
         if (animations.nextQuestion) {
           try {
             avatarRef.current.playAnimation(animations.nextQuestion, true);
-          } catch (error) {
+        } catch (error) {
             console.warn('Failed to play nextQuestion animation:', error);
           }
         }
@@ -282,16 +334,33 @@ const CurriculumLearning = forwardRef(({
       stateRef.current.currentLessonIndex += 1;
       stateRef.current.currentQuestionIndex = 0;
       stateRef.current.lessonCompleted = false;
+      stateRef.current.isQuestionMode = false;
+      stateRef.current.isTeaching = false;
       stateRef.current.score = 0;
       stateRef.current.totalQuestions = 0;
       
+      // Clear current question in UI
+      callbacksRef.current.onCustomAction({
+        type: 'lessonStart',
+        moduleIndex: stateRef.current.currentModuleIndex,
+        lessonIndex: stateRef.current.currentLessonIndex
+      });
+      
       if (avatarRef.current) {
-        avatarRef.current.speakText("Let's move on to the next lesson!", { lipsyncLang: defaultAvatarConfig.lipsyncLang });
+      avatarRef.current.setMood("happy");
+        avatarRef.current.setBodyMovement("idle");
+        
+        // Automatically start teaching the next lesson after a brief pause
+        setTimeout(() => {
+          if (startTeachingRef.current) {
+            startTeachingRef.current();
+          }
+        }, 500);
       }
     } else {
       completeCurriculum();
     }
-  }, [curriculum, completeCurriculum, defaultAvatarConfig]);
+  }, [curriculum, completeCurriculum]);
 
   // Start teaching the lesson
   const startTeaching = useCallback(() => {
@@ -339,11 +408,14 @@ const CurriculumLearning = forwardRef(({
         if (currentLesson.questions && currentLesson.questions.length > 0) {
           startQuestions();
     } else {
-          completeLesson();
+          // No questions, complete the lesson using ref to avoid circular dependency
+          if (completeLessonRef.current) {
+            completeLessonRef.current();
+          }
         }
       }, 8000);
     }
-  }, [animations.teaching, getCurrentLesson, startQuestions, completeLesson, defaultAvatarConfig]);
+  }, [animations.teaching, getCurrentLesson, startQuestions, defaultAvatarConfig]);
 
   // Handle answer selection
   const handleAnswerSelect = useCallback((answer) => {
@@ -365,9 +437,9 @@ const CurriculumLearning = forwardRef(({
     
     if (avatarRef.current) {
       if (isCorrect) {
-        avatarRef.current.setMood("happy");
+      avatarRef.current.setMood("happy");
         if (animations.correct) {
-          try {
+      try {
             avatarRef.current.playReaction("happy");
       } catch (error) {
             avatarRef.current.setBodyMovement("happy");
@@ -388,7 +460,7 @@ const CurriculumLearning = forwardRef(({
             }, 500);
           }
         });
-      } else {
+    } else {
         avatarRef.current.setMood("sad");
         if (animations.incorrect) {
           try {
@@ -485,6 +557,13 @@ const CurriculumLearning = forwardRef(({
     }
   }, [autoStart, getCurrentLesson, startTeaching]);
 
+  // Update refs after all functions are defined to avoid circular dependency issues
+  useEffect(() => {
+    startTeachingRef.current = startTeaching;
+    nextLessonRef.current = nextLesson;
+    completeLessonRef.current = completeLesson;
+  }, [startTeaching, nextLesson, completeLesson]);
+
   // Expose methods via ref (for external control)
   useImperativeHandle(ref, () => ({
     // Curriculum control methods