@memori.ai/memori-react 7.15.2 → 7.16.0

package/src/components/Avatar/AvatarView/AvatarComponent/Shadow/DynamicShadow.tsx

@@ -0,0 +1,96 @@
+import React, { useEffect, useState } from 'react';
+import { Canvas } from '@react-three/fiber';
+import { ContactShadows, PerspectiveCamera } from '@react-three/drei';
+
+const DynamicShadow = ({
+  currentBaseAction,
+  avatarPosition,
+}: {
+  currentBaseAction: any;
+  avatarPosition: any;
+}) => {
+  // Calculate shadow properties based on animation
+  const getShadowProps = () => {
+    const baseProps = {
+      width: 10,
+      height: 10,
+      blur: 2.5,
+      scale: 10,
+      far: 5,
+      resolution: 1024,
+      color: '#000000',
+    };
+
+    // Adjust shadow based on animation type
+    if (currentBaseAction.action.startsWith('Loading')) {
+      return {
+        ...baseProps,
+        opacity: 0.85,
+        blur: 3,
+        width: 12,
+        height: 12,
+      };
+    } else if (
+      currentBaseAction.action.includes('Gioia') ||
+      currentBaseAction.action.includes('Joy')
+    ) {
+      return {
+        ...baseProps,
+        opacity: 0.9,
+        blur: 2,
+        width: 11,
+        height: 11,
+      };
+    } else if (
+      currentBaseAction.action.includes('Rabbia') ||
+      currentBaseAction.action.includes('Anger')
+    ) {
+      return {
+        ...baseProps,
+        opacity: 0.95,
+        blur: 1.8,
+        width: 12,
+        height: 12,
+      };
+    }
+
+    // Default idle state
+    return {
+      ...baseProps,
+      opacity: 0.9,
+      blur: 2.2,
+    };
+  };
+
+  const shadowProps = getShadowProps();
+
+  return (
+    <>
+      {/* Main body shadow */}
+      <ContactShadows
+        opacity={shadowProps.opacity}
+        scale={shadowProps.scale}
+        blur={shadowProps.blur}
+        far={shadowProps.far}
+        resolution={shadowProps.resolution}
+        color={shadowProps.color}
+        frames={Infinity}
+        position={[0, avatarPosition.y, 0]}
+      />
+
+      {/* Foot shadow - smaller and sharper */}
+      <ContactShadows
+         opacity={1}
+         width={5}
+         height={5}
+         blur={1}
+         far={2}
+         resolution={1024}
+         color="#000000"
+        position={[0, -0.98, 0]}
+      />
+    </>
+  );
+};
+
+export default DynamicShadow;

package/src/components/Avatar/AvatarView/AvatarComponent/components/FullbodyAvatar/fullbodyAvatar.tsx

@@ -4,6 +4,7 @@ import {
   SkinnedMesh,
   Object3D,
   AnimationAction,
+  Vector3
 } from 'three';
 import { useAnimations, useGLTF } from '@react-three/drei';
 import { useFrame } from '@react-three/fiber';
@@ -19,6 +20,7 @@ import {
   DEFAULT_CONFIG,
   SCALE_LERP_FACTOR,
 } from '../../constants';
+import DynamicShadow from '../../Shadow/DynamicShadow';
 
 export function FullbodyAvatar({
   url,
@@ -44,6 +46,10 @@ export function FullbodyAvatar({
   const animationControllerRef = useRef<AnimationController>();
   const morphTargetControllerRef = useRef<MorphTargetController>();
   const positionControllerRef = useRef<AvatarPositionController>();
+  const lastPositionRef = useRef<Vector3>(AVATAR_POSITION.clone());
+  const positionUpdateThrottleRef = useRef<number>(0);
+  const POSITION_UPDATE_INTERVAL = 1; // ~1000fps for more frequent updates
+  const POSITION_THRESHOLD = 0.000001; // Much smaller threshold for more sensitive detection
   
   const blinkStateRef = useRef({
     isBlinking: false,
@@ -68,19 +74,23 @@ export function FullbodyAvatar({
     );
 
     if (headMesh) {
-      // console.log('[FullbodyAvatar] Head mesh found:', headMesh.name);
       morphTargetControllerRef.current = new MorphTargetController(headMesh);
 
       if (headMesh.morphTargetDictionary && headMesh.morphTargetInfluences) {
-        // console.log('[FullbodyAvatar] Setting morph target dictionary and influences', headMesh.morphTargetDictionary, headMesh.morphTargetInfluences);
         setMorphTargetDictionary(headMesh.morphTargetDictionary);
         const initialInfluences = Object.keys(headMesh.morphTargetDictionary)
           .reduce((acc, key) => ({ ...acc, [key]: 0 }), {});
-        // console.log('[FullbodyAvatar] Setting initial influences', initialInfluences);
         setMorphTargetInfluences(initialInfluences);
       }
     }
+
+    // Initialize position tracking with high precision
+    const initialPosition = AVATAR_POSITION.clone();
+    initialPosition.setX(Number(initialPosition.x.toFixed(6)));
+    initialPosition.setY(Number(initialPosition.y.toFixed(6)));
+    initialPosition.setZ(Number(initialPosition.z.toFixed(6)));
   }, [actions, scene]);
+
   useEffect(() => {
     if (positionControllerRef.current) {
       positionControllerRef.current.updateHeight(avatarHeight, false);
@@ -113,36 +123,6 @@ export function FullbodyAvatar({
     return foundMesh;
   }, [scene]);
 
-   // Initialize controllers
-   useEffect(() => {
-    if (!actions || !headMesh) return;
-
-    const mixer = new AnimationMixer(scene);
-    animationControllerRef.current = new AnimationController(
-      mixer,
-      actions as Record<string, AnimationAction>,
-      { ...DEFAULT_CONFIG }
-    );
-
-    morphTargetControllerRef.current = new MorphTargetController(headMesh);
-
-    // Initialize morph target dictionary and influences
-    if (headMesh.morphTargetDictionary && headMesh.morphTargetInfluences) {
-      setMorphTargetDictionary(headMesh.morphTargetDictionary);
-      const initialInfluences = Object.keys(
-        headMesh.morphTargetDictionary
-      ).reduce((acc, key) => ({ ...acc, [key]: 0 }), {});
-      setMorphTargetInfluences(initialInfluences);
-    }
-  }, [
-    actions,
-    headMesh,
-    scene,
-    setMorphTargetDictionary,
-    setMorphTargetInfluences,
-    timeScale,
-  ]);
-
   // Handle animation state changes
   useEffect(() => {
     if (!animationControllerRef.current) return;
@@ -153,7 +133,7 @@ export function FullbodyAvatar({
         AnimationState.LOADING,
         currentBaseAction.action
       );
-    }  else if (currentBaseAction.action.includes('->')) {
+    } else if (currentBaseAction.action.includes('->')) {
       animationControllerRef.current.playSequence(currentBaseAction.action);
     } else if (currentBaseAction.action.startsWith('Idle')) {
       animationControllerRef.current.transitionTo(AnimationState.IDLE);
@@ -170,8 +150,7 @@ export function FullbodyAvatar({
     animationControllerRef.current?.setTimeScale(timeScale);
   }, [timeScale]);
 
-
-  // Animation and scaling update loop
+  // Animation and scaling update loop with high precision position tracking
   useFrame((state, delta) => {
     const currentTime = state.clock.elapsedTime * 1000;
 
@@ -190,22 +169,46 @@ export function FullbodyAvatar({
       );
     }
 
-    // Update scale with smooth transition
+    // Update scale and check position changes with high precision
     if (scene && positionControllerRef.current) {
       const newScale = positionControllerRef.current.updateScale(SCALE_LERP_FACTOR);
       scene.scale.copy(newScale);
+
+      // High frequency position update check
+      if (currentTime - positionUpdateThrottleRef.current >= POSITION_UPDATE_INTERVAL) {
+        const currentPosition = positionControllerRef.current.getPosition();
+        
+        // Round to 6 decimal places for high precision
+        currentPosition.setX(Number(currentPosition.x.toFixed(6)));
+        currentPosition.setY(Number(currentPosition.y.toFixed(6)));
+        currentPosition.setZ(Number(currentPosition.z.toFixed(6)));
+        
+        const positionDelta = currentPosition.distanceTo(lastPositionRef.current);
+        
+        lastPositionRef.current.copy(currentPosition);
+        
+        positionUpdateThrottleRef.current = currentTime;
+      }
     }
   });
 
-  // Get current position from controller
-  const position = positionControllerRef.current?.getPosition() || AVATAR_POSITION;
+  // Get current position from controller with fallback
+  const position = useMemo(() => {
+    return positionControllerRef.current?.getPosition() || AVATAR_POSITION.clone();
+  }, [positionControllerRef.current]);
 
   return (
+    <>
+    <DynamicShadow
+      currentBaseAction={currentBaseAction}
+      avatarPosition={position}
+    />
     <group
       position={position}
       rotation={AVATAR_ROTATION}
     >
       <primitive object={scene} />
     </group>
+    </>
   );
 }

package/src/components/Chat/__snapshots__/Chat.test.tsx.snap

@@ -479,6 +479,7 @@ exports[`renders Chat unchanged 1`] = `
         >
           <textarea
             class="memori-chat-textarea--input"
+            maxlength="100000"
           />
           <div
             class="memori-chat-textarea--expand"
@@ -1041,6 +1042,7 @@ exports[`renders Chat with context vars unchanged 1`] = `
         >
           <textarea
             class="memori-chat-textarea--input"
+            maxlength="100000"
           />
           <div
             class="memori-chat-textarea--expand"
@@ -1549,6 +1551,7 @@ exports[`renders Chat with custom user avatar as react element unchanged 1`] = `
         >
           <textarea
             class="memori-chat-textarea--input"
+            maxlength="100000"
           />
           <div
             class="memori-chat-textarea--expand"
@@ -2063,6 +2066,7 @@ exports[`renders Chat with custom user avatar unchanged 1`] = `
         >
           <textarea
             class="memori-chat-textarea--input"
+            maxlength="100000"
           />
           <div
             class="memori-chat-textarea--expand"
@@ -2630,6 +2634,7 @@ exports[`renders Chat with dates unchanged 1`] = `
         >
           <textarea
             class="memori-chat-textarea--input"
+            maxlength="100000"
           />
           <div
             class="memori-chat-textarea--expand"
@@ -3188,6 +3193,7 @@ exports[`renders Chat with hints unchanged 1`] = `
         >
           <textarea
             class="memori-chat-textarea--input"
+            maxlength="100000"
           />
           <div
             class="memori-chat-textarea--expand"
@@ -4121,6 +4127,7 @@ exports[`renders Chat with media unchanged 1`] = `
         >
           <textarea
             class="memori-chat-textarea--input"
+            maxlength="100000"
           />
           <div
             class="memori-chat-textarea--expand"
@@ -4674,6 +4681,7 @@ exports[`renders Chat with memori typing unchanged 1`] = `
         >
           <textarea
             class="memori-chat-textarea--input"
+            maxlength="100000"
           />
           <div
             class="memori-chat-textarea--expand"
@@ -5188,6 +5196,7 @@ exports[`renders Chat with user unchanged 1`] = `
         >
           <textarea
             class="memori-chat-textarea--input"
+            maxlength="100000"
           />
           <div
             class="memori-chat-textarea--expand"

package/src/components/ChatInputs/__snapshots__/ChatInputs.test.tsx.snap

@@ -17,6 +17,7 @@ exports[`renders ChatInputs disabled unchanged 1`] = `
         <textarea
           class="memori-chat-textarea--input"
           disabled=""
+          maxlength="100000"
         >
           Lorem ipsum
         </textarea>
@@ -120,6 +121,7 @@ exports[`renders ChatInputs listening unchanged 1`] = `
       >
         <textarea
           class="memori-chat-textarea--input"
+          maxlength="100000"
         >
           Lorem ipsum
         </textarea>
@@ -223,6 +225,7 @@ exports[`renders ChatInputs on instruct unchanged 1`] = `
       >
         <textarea
           class="memori-chat-textarea--input"
+          maxlength="100000"
         >
           Lorem ipsum
         </textarea>
@@ -326,6 +329,7 @@ exports[`renders ChatInputs unchanged 1`] = `
       >
         <textarea
           class="memori-chat-textarea--input"
+          maxlength="100000"
         />
         <div
           class="memori-chat-textarea--expand"
@@ -428,6 +432,7 @@ exports[`renders ChatInputs with user message unchanged 1`] = `
       >
         <textarea
           class="memori-chat-textarea--input"
+          maxlength="100000"
         >
           Lorem ipsum
         </textarea>
@@ -531,6 +536,7 @@ exports[`renders ChatInputs without microphone button unchanged 1`] = `
       >
         <textarea
           class="memori-chat-textarea--input"
+          maxlength="100000"
         >
           Lorem ipsum
         </textarea>

package/src/components/ChatTextArea/ChatTextArea.tsx

@@ -48,6 +48,7 @@ const ChatTextArea: React.FC<Props> = ({
           }}
           onFocus={onFocus}
           onBlur={onBlur}
+          maxLength={100000}
         />
         <div className="memori-chat-textarea--expand">
           <Button

package/src/components/ChatTextArea/__snapshots__/ChatTextArea.test.tsx.snap

@@ -11,6 +11,7 @@ exports[`renders ChatTextArea unchanged 1`] = `
     >
       <textarea
         class="memori-chat-textarea--input"
+        maxlength="100000"
       />
       <div
         class="memori-chat-textarea--expand"
@@ -52,6 +53,7 @@ exports[`renders ChatTextArea with long text unchanged 1`] = `
     >
       <textarea
         class="memori-chat-textarea--input"
+        maxlength="100000"
       >
         Suspendisse sit amet volutpat velit. Nunc at commodo tortor, id rutrum nunc. Vivamus condimentum vel nunc et congue. Ut laoreet imperdiet nisi ac finibus. Suspendisse molestie risus a justo sagittis efficitur. Suspendisse sit amet volutpat velit. Nunc at commodo tortor, id rutrum nunc. Vivamus condimentum vel nunc et congue. Ut laoreet imperdiet nisi ac finibus. Suspendisse molestie risus a justo sagittis efficitur.
       </textarea>
@@ -95,6 +97,7 @@ exports[`renders ChatTextArea with value unchanged 1`] = `
     >
       <textarea
         class="memori-chat-textarea--input"
+        maxlength="100000"
       >
         Proin libero ante, dignissim sit amet turpis a, pretium condimentum dolor.
       </textarea>

package/src/components/UploadButton/UploadButton.css

@@ -36,3 +36,10 @@
     transition: fill 0.2s ease;
 }
 
+.memori--error-message-container {
+    position: absolute;
+    z-index: 1000;
+    right: 0;
+    bottom: 50%;
+    width: 100%;
+}