@sage-rsc/talking-head-react 1.1.9 → 1.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sage-rsc/talking-head-react",
-  "version": "1.1.9",
+  "version": "1.2.0",
   "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/lib/talkinghead.mjs

@@ -5664,8 +5664,14 @@ class TalkingHead {
             newTrack.name = newTrackName;
             
             // Fix rotations for Ready Player Me arm bones (coordinate system correction)
+            // Ready Player Me uses a different coordinate system, so we need to adjust rotations
             const isArmBone = mappedBoneName.includes('Arm') || mappedBoneName.includes('Hand') || mappedBoneName.includes('Shoulder');
-            const isLeftArm = mappedBoneName.includes('Left');
+            const isLeftSide = mappedBoneName.includes('Left');
+            const isRightSide = mappedBoneName.includes('Right');
+            const isForearm = mappedBoneName.includes('ForeArm') || mappedBoneName.includes('Forearm');
+            const isHand = mappedBoneName.includes('Hand') && !mappedBoneName.includes('Index') && 
+                          !mappedBoneName.includes('Thumb') && !mappedBoneName.includes('Middle') &&
+                          !mappedBoneName.includes('Ring') && !mappedBoneName.includes('Pinky');
             
             if (isArmBone && (property === 'quaternion' || property === 'rotation')) {
               if (property === 'quaternion' && newTrack.values && newTrack.values.length >= 4) {
@@ -5679,23 +5685,26 @@ class TalkingHead {
                     let z = newTrack.values[baseIdx + 2];
                     let w = newTrack.values[baseIdx + 3];
                     
-                    // For Ready Player Me, we may need to flip certain axes
-                    // Try rotating 180 degrees around Y axis for left arm
-                    if (isLeftArm && mappedBoneName.includes('ForeArm')) {
-                      // Left forearm might need Y-axis flip
+                    const q = new THREE.Quaternion(x, y, z, w);
+                    
+                    // For Ready Player Me, hands may need coordinate system correction
+                    // Hands folding behind suggests we need to rotate around Y axis
+                    if (isHand) {
+                      // Rotate 180 degrees around Y axis to fix hands folding behind
                       const flipY = new THREE.Quaternion().setFromAxisAngle(new THREE.Vector3(0, 1, 0), Math.PI);
-                      const q = new THREE.Quaternion(x, y, z, w);
+                      // Apply rotation: q_result = q_original * q_flip (post-multiply)
                       q.multiply(flipY);
-                      x = q.x;
-                      y = q.y;
-                      z = q.z;
-                      w = q.w;
+                    } else if (isForearm) {
+                      // For forearms, try a smaller correction - rotate 90 degrees around Z axis
+                      // This might help with the twisting
+                      const adjustZ = new THREE.Quaternion().setFromAxisAngle(new THREE.Vector3(0, 0, 1), Math.PI / 2);
+                      q.multiply(adjustZ);
                     }
                     
-                    newTrack.values[baseIdx] = x;
-                    newTrack.values[baseIdx + 1] = y;
-                    newTrack.values[baseIdx + 2] = z;
-                    newTrack.values[baseIdx + 3] = w;
+                    newTrack.values[baseIdx] = q.x;
+                    newTrack.values[baseIdx + 1] = q.y;
+                    newTrack.values[baseIdx + 2] = q.z;
+                    newTrack.values[baseIdx + 3] = q.w;
                   }
                 }
               }