react-native-games 0.3.0 → 0.5.0

package/lib/module/games/{cat-popper → whack-a-mole}/components/GameHole.js

@@ -1,33 +1,40 @@
 "use strict";
 
-import React from 'react';
+import React, { useCallback, useMemo } from 'react';
 import { View, TouchableOpacity, StyleSheet } from 'react-native';
-import { useSharedValue, useAnimatedStyle, withSpring, withSequence, withTiming, interpolate, Extrapolation } from 'react-native-reanimated';
-import Animated from 'react-native-reanimated';
+import Animated, { useSharedValue, useAnimatedStyle, withSpring, withSequence, withTiming, interpolate, Extrapolation } from 'react-native-reanimated';
 import { Canvas as SkiaCanvas, Circle, Group } from '@shopify/react-native-skia';
-import { GAME_CONFIG, COLORS } from "../CatPopperService.js";
-import { CatCharacter } from "./CatCharacter.js";
+import { GAME_CONFIG, COLORS } from "../WhackAMoleService.js";
+import { MoleCharacter } from "./MoleCharacter.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export const GameHole = ({
+export const GameHole = /*#__PURE__*/React.memo(({
   hole,
-  catAnimation,
+  moleAnimation,
   hitAnimation,
-  onPress
+  onPress,
+  holeSize = GAME_CONFIG.HOLE_SIZE
 }) => {
   // Enhanced animation values for whack effect
   const whackScale = useSharedValue(1);
   const whackRotation = useSharedValue(0);
   const whackBounce = useSharedValue(0);
-  const catStyle = useAnimatedStyle(() => {
-    // Cat emerges from deep inside the hole
-    const translateY = interpolate(catAnimation.value, [0, 0.3, 1], [GAME_CONFIG.HOLE_SIZE * 0.3, GAME_CONFIG.HOLE_SIZE * 0.1, -GAME_CONFIG.HOLE_SIZE * 0.05], Extrapolation.CLAMP);
 
-    // Cat grows as it emerges from the hole
-    const emergenceScale = interpolate(catAnimation.value, [0, 0.4, 1], [0.3, 0.8, 1], Extrapolation.CLAMP);
+  // Memoize animation constants to prevent recalculation
+  const animationConstants = useMemo(() => ({
+    translateYRange: [holeSize * 0.3, holeSize * 0.1, -holeSize * 0.05],
+    scaleRange: [0.3, 0.8, 1],
+    maxTranslateY: -holeSize * 0.1
+  }), [holeSize]);
+  const moleStyle = useAnimatedStyle(() => {
+    // Mole emerges from deep inside the hole
+    const translateY = interpolate(moleAnimation.value, [0, 0.3, 1], animationConstants.translateYRange, Extrapolation.CLAMP);
 
-    // Constrained bounce - keep cat within hole area
+    // Mole grows as it emerges from the hole
+    const emergenceScale = interpolate(moleAnimation.value, [0, 0.4, 1], animationConstants.scaleRange, Extrapolation.CLAMP);
+
+    // Constrained bounce - keep mole within hole area
     const bounceY = whackBounce.value * -8;
-    const finalTranslateY = Math.max(translateY + bounceY, -GAME_CONFIG.HOLE_SIZE * 0.1);
+    const finalTranslateY = Math.max(translateY + bounceY, animationConstants.maxTranslateY);
     return {
       transform: [{
         translateY: finalTranslateY
@@ -36,9 +43,9 @@ export const GameHole = ({
       }, {
         rotate: `${whackRotation.value}deg`
       }],
-      opacity: catAnimation.value
+      opacity: moleAnimation.value
     };
-  });
+  }, [animationConstants]);
   const hitStyle = useAnimatedStyle(() => {
     const scale = 1 + hitAnimation.value * 0.5;
     return {
@@ -49,10 +56,28 @@ export const GameHole = ({
     };
   });
 
-  // Enhanced hit handler with coordinated whack animation
-  const handlePress = () => {
-    // Only trigger whack animation if cat is active
-    if (hole.isActive || catAnimation.value > 0) {
+  // Memoize style calculations to prevent re-computation on every render
+  const holeContainerStyle = useMemo(() => [styles.holeContainer, {
+    width: holeSize,
+    height: holeSize
+  }], [holeSize]);
+  const holeStyle = useMemo(() => [styles.hole, {
+    width: holeSize * 0.8,
+    height: holeSize * 0.8
+  }], [holeSize]);
+  const hitEffectContainerStyle = useMemo(() => [styles.hitEffectContainer, {
+    width: holeSize,
+    height: holeSize
+  }], [holeSize]);
+  const moleContainerStyle = useMemo(() => [styles.moleContainer, {
+    bottom: holeSize * 0.1,
+    zIndex: 10
+  }], [holeSize]);
+
+  // Optimized hit handler with memoized hole state check
+  const handlePress = useCallback(() => {
+    // Only trigger whack animation if mole is active (optimized check)
+    if (hole.isActive || moleAnimation.value > 0) {
       // Whack animation sequence - constrained to hole area
       whackScale.value = withSequence(withSpring(1.3, {
         damping: 8,
@@ -80,9 +105,9 @@ export const GameHole = ({
         stiffness: 300
       }));
 
-      // Delay hit effect to let cat animation show first
+      // Delay hit effect to let mole animation show first
       setTimeout(() => {
-        // Trigger hit effect after cat starts reacting
+        // Trigger hit effect after mole starts reacting
         onPress(hole.id);
       }, 150);
 
@@ -93,57 +118,45 @@ export const GameHole = ({
         whackBounce.value = 0;
       }, 800);
     } else {
-      // No cat present, just trigger normal hit
+      // No mole present, just trigger normal hit
       onPress(hole.id);
     }
-  };
+  }, [hole.id, hole.isActive, onPress, moleAnimation]);
   return /*#__PURE__*/_jsxs(TouchableOpacity, {
-    style: [styles.holeContainer, {
-      width: GAME_CONFIG.HOLE_SIZE,
-      height: GAME_CONFIG.HOLE_SIZE
-    }],
+    style: holeContainerStyle,
     onPress: handlePress,
     activeOpacity: 0.8,
     children: [/*#__PURE__*/_jsx(View, {
-      style: [styles.hole, {
-        width: GAME_CONFIG.HOLE_SIZE * 0.8,
-        height: GAME_CONFIG.HOLE_SIZE * 0.8
-      }]
+      style: holeStyle
     }), /*#__PURE__*/_jsx(Animated.View, {
-      style: [styles.hitEffectContainer, {
-        width: GAME_CONFIG.HOLE_SIZE,
-        height: GAME_CONFIG.HOLE_SIZE
-      }, hitStyle],
+      style: [hitEffectContainerStyle, hitStyle],
       children: /*#__PURE__*/_jsx(SkiaCanvas, {
         style: {
-          width: GAME_CONFIG.HOLE_SIZE,
-          height: GAME_CONFIG.HOLE_SIZE
+          width: holeSize,
+          height: holeSize
         },
         children: /*#__PURE__*/_jsxs(Group, {
           children: [/*#__PURE__*/_jsx(Circle, {
-            cx: GAME_CONFIG.HOLE_SIZE / 2,
-            cy: GAME_CONFIG.HOLE_SIZE / 2,
-            r: 30,
+            cx: holeSize / 2,
+            cy: holeSize / 2,
+            r: holeSize * 0.25,
             color: COLORS.HIT_EFFECT_OUTER
           }), /*#__PURE__*/_jsx(Circle, {
-            cx: GAME_CONFIG.HOLE_SIZE / 2,
-            cy: GAME_CONFIG.HOLE_SIZE / 2,
-            r: 20,
+            cx: holeSize / 2,
+            cy: holeSize / 2,
+            r: holeSize * 0.17,
             color: COLORS.HIT_EFFECT_INNER
           })]
         })
       })
-    }), (hole.isActive || catAnimation.value > 0 || whackScale.value !== 1) && /*#__PURE__*/_jsx(Animated.View, {
-      style: [styles.catContainer, {
-        bottom: GAME_CONFIG.HOLE_SIZE * 0.1,
-        zIndex: 10
-      }, catStyle],
-      children: /*#__PURE__*/_jsx(CatCharacter, {
-        size: GAME_CONFIG.HOLE_SIZE * 0.6
+    }), hole.isActive && /*#__PURE__*/_jsx(Animated.View, {
+      style: [moleContainerStyle, moleStyle],
+      children: /*#__PURE__*/_jsx(MoleCharacter, {
+        size: holeSize * 0.6
       })
     })]
   });
-};
+});
 const styles = StyleSheet.create({
   holeContainer: {
     justifyContent: 'center',
@@ -164,7 +177,7 @@ const styles = StyleSheet.create({
     shadowRadius: 3.84,
     elevation: 5
   },
-  catContainer: {
+  moleContainer: {
     position: 'absolute',
     justifyContent: 'center',
     alignItems: 'center',

package/lib/module/games/whack-a-mole/components/GameHole.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useCallback","useMemo","View","TouchableOpacity","StyleSheet","Animated","useSharedValue","useAnimatedStyle","withSpring","withSequence","withTiming","interpolate","Extrapolation","Canvas","SkiaCanvas","Circle","Group","GAME_CONFIG","COLORS","MoleCharacter","jsx","_jsx","jsxs","_jsxs","GameHole","memo","hole","moleAnimation","hitAnimation","onPress","holeSize","HOLE_SIZE","whackScale","whackRotation","whackBounce","animationConstants","translateYRange","scaleRange","maxTranslateY","moleStyle","translateY","value","CLAMP","emergenceScale","bounceY","finalTranslateY","Math","max","transform","scale","rotate","opacity","hitStyle","holeContainerStyle","styles","holeContainer","width","height","holeStyle","hitEffectContainerStyle","hitEffectContainer","moleContainerStyle","moleContainer","bottom","zIndex","handlePress","isActive","damping","stiffness","duration","setTimeout","id","style","activeOpacity","children","cx","cy","r","color","HIT_EFFECT_OUTER","HIT_EFFECT_INNER","size","create","justifyContent","alignItems","position","backgroundColor","borderWidth","borderColor","borderRadius","shadowColor","shadowOffset","shadowOpacity","shadowRadius","elevation","pointerEvents"],"sourceRoot":"../../../../../src","sources":["games/whack-a-mole/components/GameHole.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,OAAO,QAAQ,OAAO;AACnD,SAASC,IAAI,EAAEC,gBAAgB,EAAEC,UAAU,QAAQ,cAAc;AACjE,OAAOC,QAAQ,IACbC,cAAc,EACdC,gBAAgB,EAChBC,UAAU,EACVC,YAAY,EACZC,UAAU,EACVC,WAAW,EACXC,aAAa,QAER,yBAAyB;AAChC,SAASC,MAAM,IAAIC,UAAU,EAAEC,MAAM,EAAEC,KAAK,QAAQ,4BAA4B;AAChF,SAAoBC,WAAW,EAAEC,MAAM,QAAQ,yBAAsB;AACrE,SAASC,aAAa,QAAQ,oBAAiB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAUhD,OAAO,MAAMC,QAAiC,gBAAGzB,KAAK,CAAC0B,IAAI,CAAC,CAAC;EAAEC,IAAI;EAAEC,aAAa;EAAEC,YAAY;EAAEC,OAAO;EAAEC,QAAQ,GAAGb,WAAW,CAACc;AAAU,CAAC,KAAK;EAChJ;EACA,MAAMC,UAAU,GAAG1B,cAAc,CAAC,CAAC,CAAC;EACpC,MAAM2B,aAAa,GAAG3B,cAAc,CAAC,CAAC,CAAC;EACvC,MAAM4B,WAAW,GAAG5B,cAAc,CAAC,CAAC,CAAC;;EAErC;EACA,MAAM6B,kBAAkB,GAAGlC,OAAO,CAAC,OAAO;IACxCmC,eAAe,EAAE,CAACN,QAAQ,GAAG,GAAG,EAAEA,QAAQ,GAAG,GAAG,EAAE,CAACA,QAAQ,GAAG,IAAI,CAAC;IACnEO,UAAU,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;IACzBC,aAAa,EAAE,CAACR,QAAQ,GAAG;EAC7B,CAAC,CAAC,EAAE,CAACA,QAAQ,CAAC,CAAC;EAEf,MAAMS,SAAS,GAAGhC,gBAAgB,CAAC,MAAM;IACvC;IACA,MAAMiC,UAAU,GAAG7B,WAAW,CAC5BgB,aAAa,CAACc,KAAK,EACnB,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC,EACXN,kBAAkB,CAACC,eAAe,EAClCxB,aAAa,CAAC8B,KAChB,CAAC;;IAED;IACA,MAAMC,cAAc,GAAGhC,WAAW,CAChCgB,aAAa,CAACc,KAAK,EACnB,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC,EACXN,kBAAkB,CAACE,UAAU,EAC7BzB,aAAa,CAAC8B,KAChB,CAAC;;IAED;IACA,MAAME,OAAO,GAAGV,WAAW,CAACO,KAAK,GAAG,CAAC,CAAC;IACtC,MAAMI,eAAe,GAAGC,IAAI,CAACC,GAAG,CAACP,UAAU,GAAGI,OAAO,EAAET,kBAAkB,CAACG,aAAa,CAAC;IAExF,OAAO;MACLU,SAAS,EAAE,CACT;QAAER,UAAU,EAAEK;MAAgB,CAAC,EAC/B;QAAEI,KAAK,EAAEjB,UAAU,CAACS,KAAK,GAAGE;MAAe,CAAC,EAC5C;QAAEO,MAAM,EAAE,GAAGjB,aAAa,CAACQ,KAAK;MAAM,CAAC,CACxC;MACDU,OAAO,EAAExB,aAAa,CAACc;IACzB,CAAC;EACH,CAAC,EAAE,CAACN,kBAAkB,CAAC,CAAC;EAExB,MAAMiB,QAAQ,GAAG7C,gBAAgB,CAAC,MAAM;IACtC,MAAM0C,KAAK,GAAG,CAAC,GAAGrB,YAAY,CAACa,KAAK,GAAG,GAAG;IAC1C,OAAO;MACLO,SAAS,EAAE,CAAC;QAAEC;MAAM,CAAC,CAAC;MACtBE,OAAO,EAAEvB,YAAY,CAACa;IACxB,CAAC;EACH,CAAC,CAAC;;EAEF;EACA,MAAMY,kBAAkB,GAAGpD,OAAO,CAAC,MAAO,CACxCqD,MAAM,CAACC,aAAa,EACpB;IAAEC,KAAK,EAAE1B,QAAQ;IAAE2B,MAAM,EAAE3B;EAAS,CAAC,CACrC,EAAE,CAACA,QAAQ,CAAC,CAAC;EAEf,MAAM4B,SAAS,GAAGzD,OAAO,CAAC,MAAO,CAC/BqD,MAAM,CAAC5B,IAAI,EAAE;IACX8B,KAAK,EAAE1B,QAAQ,GAAG,GAAG;IACrB2B,MAAM,EAAE3B,QAAQ,GAAG;EACrB,CAAC,CACD,EAAE,CAACA,QAAQ,CAAC,CAAC;EAEf,MAAM6B,uBAAuB,GAAG1D,OAAO,CAAC,MAAO,CAC7CqD,MAAM,CAACM,kBAAkB,EACzB;IAAEJ,KAAK,EAAE1B,QAAQ;IAAE2B,MAAM,EAAE3B;EAAS,CAAC,CACrC,EAAE,CAACA,QAAQ,CAAC,CAAC;EAEf,MAAM+B,kBAAkB,GAAG5D,OAAO,CAAC,MAAO,CACxCqD,MAAM,CAACQ,aAAa,EACpB;IAAEC,MAAM,EAAEjC,QAAQ,GAAG,GAAG;IAAEkC,MAAM,EAAE;EAAG,CAAC,CACtC,EAAE,CAAClC,QAAQ,CAAC,CAAC;;EAEf;EACA,MAAMmC,WAAW,GAAGjE,WAAW,CAAC,MAAM;IACpC;IACA,IAAI0B,IAAI,CAACwC,QAAQ,IAAIvC,aAAa,CAACc,KAAK,GAAG,CAAC,EAAE;MAC5C;MACAT,UAAU,CAACS,KAAK,GAAGhC,YAAY,CAC7BD,UAAU,CAAC,GAAG,EAAE;QAAE2D,OAAO,EAAE,CAAC;QAAEC,SAAS,EAAE;MAAI,CAAC,CAAC,EAC/C5D,UAAU,CAAC,GAAG,EAAE;QAAE2D,OAAO,EAAE,EAAE;QAAEC,SAAS,EAAE;MAAI,CAAC,CAAC,EAChD1D,UAAU,CAAC,CAAC,EAAE;QAAE2D,QAAQ,EAAE;MAAI,CAAC,CACjC,CAAC;MAEDpC,aAAa,CAACQ,KAAK,GAAGhC,YAAY,CAChCD,UAAU,CAAC,EAAE,EAAE;QAAE2D,OAAO,EAAE,EAAE;QAAEC,SAAS,EAAE;MAAI,CAAC,CAAC,EAC/C5D,UAAU,CAAC,CAAC,CAAC,EAAE;QAAE2D,OAAO,EAAE,EAAE;QAAEC,SAAS,EAAE;MAAI,CAAC,CAAC,EAC/C1D,UAAU,CAAC,CAAC,EAAE;QAAE2D,QAAQ,EAAE;MAAI,CAAC,CACjC,CAAC;MAEDnC,WAAW,CAACO,KAAK,GAAGhC,YAAY,CAC9BD,UAAU,CAAC,CAAC,EAAE;QAAE2D,OAAO,EAAE,CAAC;QAAEC,SAAS,EAAE;MAAI,CAAC,CAAC,EAC7C5D,UAAU,CAAC,CAAC,EAAE;QAAE2D,OAAO,EAAE,EAAE;QAAEC,SAAS,EAAE;MAAI,CAAC,CAC/C,CAAC;;MAED;MACAE,UAAU,CAAC,MAAM;QACf;QACAzC,OAAO,CAACH,IAAI,CAAC6C,EAAE,CAAC;MAClB,CAAC,EAAE,GAAG,CAAC;;MAEP;MACAD,UAAU,CAAC,MAAM;QACftC,UAAU,CAACS,KAAK,GAAG,CAAC;QACpBR,aAAa,CAACQ,KAAK,GAAG,CAAC;QACvBP,WAAW,CAACO,KAAK,GAAG,CAAC;MACvB,CAAC,EAAE,GAAG,CAAC;IACT,CAAC,MAAM;MACL;MACAZ,OAAO,CAACH,IAAI,CAAC6C,EAAE,CAAC;IAClB;EACF,CAAC,EAAE,CAAC7C,IAAI,CAAC6C,EAAE,EAAE7C,IAAI,CAACwC,QAAQ,EAAErC,OAAO,EAAEF,aAAa,CAAC,CAAC;EAEpD,oBACEJ,KAAA,CAACpB,gBAAgB;IACfqE,KAAK,EAAEnB,kBAAmB;IAC1BxB,OAAO,EAAEoC,WAAY;IACrBQ,aAAa,EAAE,GAAI;IAAAC,QAAA,gBAEnBrD,IAAA,CAACnB,IAAI;MAACsE,KAAK,EAAEd;IAAU,CAAE,CAAC,eAE1BrC,IAAA,CAAChB,QAAQ,CAACH,IAAI;MAACsE,KAAK,EAAE,CAACb,uBAAuB,EAAEP,QAAQ,CAAE;MAAAsB,QAAA,eACxDrD,IAAA,CAACP,UAAU;QAAC0D,KAAK,EAAE;UAAEhB,KAAK,EAAE1B,QAAQ;UAAE2B,MAAM,EAAE3B;QAAS,CAAE;QAAA4C,QAAA,eACvDnD,KAAA,CAACP,KAAK;UAAA0D,QAAA,gBACJrD,IAAA,CAACN,MAAM;YAAC4D,EAAE,EAAE7C,QAAQ,GAAG,CAAE;YAAC8C,EAAE,EAAE9C,QAAQ,GAAG,CAAE;YAAC+C,CAAC,EAAE/C,QAAQ,GAAG,IAAK;YAACgD,KAAK,EAAE5D,MAAM,CAAC6D;UAAiB,CAAE,CAAC,eAClG1D,IAAA,CAACN,MAAM;YAAC4D,EAAE,EAAE7C,QAAQ,GAAG,CAAE;YAAC8C,EAAE,EAAE9C,QAAQ,GAAG,CAAE;YAAC+C,CAAC,EAAE/C,QAAQ,GAAG,IAAK;YAACgD,KAAK,EAAE5D,MAAM,CAAC8D;UAAiB,CAAE,CAAC;QAAA,CAC7F;MAAC,CACE;IAAC,CACA,CAAC,EAEftD,IAAI,CAACwC,QAAQ,iBACZ7C,IAAA,CAAChB,QAAQ,CAACH,IAAI;MAACsE,KAAK,EAAE,CAACX,kBAAkB,EAAEtB,SAAS,CAAE;MAAAmC,QAAA,eACpDrD,IAAA,CAACF,aAAa;QAAC8D,IAAI,EAAEnD,QAAQ,GAAG;MAAI,CAAE;IAAC,CAC1B,CAChB;EAAA,CACe,CAAC;AAEvB,CAAC,CAAC;AAEF,MAAMwB,MAAM,GAAGlD,UAAU,CAAC8E,MAAM,CAAC;EAC/B3B,aAAa,EAAE;IACb4B,cAAc,EAAE,QAAQ;IACxBC,UAAU,EAAE,QAAQ;IACpBC,QAAQ,EAAE;EACZ,CAAC;EACD3D,IAAI,EAAE;IACJ4D,eAAe,EAAE,SAAS;IAC1BC,WAAW,EAAE,CAAC;IACdC,WAAW,EAAE,SAAS;IACtBC,YAAY,EAAE,IAAI;IAClBC,WAAW,EAAE,MAAM;IACnBC,YAAY,EAAE;MAAEnC,KAAK,EAAE,CAAC;MAAEC,MAAM,EAAE;IAAE,CAAC;IACrCmC,aAAa,EAAE,IAAI;IACnBC,YAAY,EAAE,IAAI;IAClBC,SAAS,EAAE;EACb,CAAC;EACDhC,aAAa,EAAE;IACbuB,QAAQ,EAAE,UAAU;IACpBF,cAAc,EAAE,QAAQ;IACxBC,UAAU,EAAE,QAAQ;IACpBpB,MAAM,EAAE,EAAE;IACV8B,SAAS,EAAE;EACb,CAAC;EACDlC,kBAAkB,EAAE;IAClByB,QAAQ,EAAE,UAAU;IACpBF,cAAc,EAAE,QAAQ;IACxBC,UAAU,EAAE,QAAQ;IACpBW,aAAa,EAAE,MAAM;IACrB/B,MAAM,EAAE,CAAC;IACT8B,SAAS,EAAE;EACb;AACF,CAAC,CAAC","ignoreList":[]}

package/lib/module/games/{cat-popper/components/CatCharacter.js → whack-a-mole/components/MoleCharacter.js}

@@ -1,61 +1,21 @@
 "use strict";
 
-import React, { useEffect } from 'react';
+import React from 'react';
 import { View, StyleSheet } from 'react-native';
-import { useSharedValue, useAnimatedStyle, withRepeat, withTiming, withSequence } from 'react-native-reanimated';
-import Animated from 'react-native-reanimated';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export const CatCharacter = ({
+export const MoleCharacter = /*#__PURE__*/React.memo(({
   size
 }) => {
-  const catSize = size * 0.8;
-  const styles = createStyles(catSize);
+  const moleSize = size * 0.8;
+  const styles = createStyles(moleSize);
 
-  // Subtle breathing animation
-  const breathingScale = useSharedValue(1);
-  const blinkOpacity = useSharedValue(1);
-  useEffect(() => {
-    // Gentle breathing effect
-    breathingScale.value = withRepeat(withSequence(withTiming(1.02, {
-      duration: 1500
-    }), withTiming(1, {
-      duration: 1500
-    })), -1, false);
+  // Static mole - no animations for better performance
 
-    // Occasional blinking
-    const startBlinking = () => {
-      blinkOpacity.value = withSequence(withTiming(0.1, {
-        duration: 100
-      }), withTiming(1, {
-        duration: 100
-      }));
-    };
-
-    // Random blinking every 2-4 seconds
-    const blinkInterval = setInterval(() => {
-      if (Math.random() > 0.3) {
-        startBlinking();
-      }
-    }, 2000 + Math.random() * 2000);
-    return () => clearInterval(blinkInterval);
-  }, []);
-  const animatedStyle = useAnimatedStyle(() => {
-    return {
-      transform: [{
-        scale: breathingScale.value
-      }]
-    };
-  });
-  const eyeStyle = useAnimatedStyle(() => {
-    return {
-      opacity: blinkOpacity.value
-    };
-  });
-  return /*#__PURE__*/_jsx(Animated.View, {
+  return /*#__PURE__*/_jsx(View, {
     style: [styles.container, {
       width: size,
       height: size
-    }, animatedStyle],
+    }],
     children: /*#__PURE__*/_jsxs(View, {
       style: styles.body,
       children: [/*#__PURE__*/_jsxs(View, {
@@ -68,13 +28,13 @@ export const CatCharacter = ({
           style: styles.leftInnerEar
         }), /*#__PURE__*/_jsx(View, {
           style: styles.rightInnerEar
-        }), /*#__PURE__*/_jsx(Animated.View, {
-          style: [styles.leftEye, eyeStyle],
+        }), /*#__PURE__*/_jsx(View, {
+          style: styles.leftEye,
           children: /*#__PURE__*/_jsx(View, {
             style: styles.eyeHighlight
           })
-        }), /*#__PURE__*/_jsx(Animated.View, {
-          style: [styles.rightEye, eyeStyle],
+        }), /*#__PURE__*/_jsx(View, {
+          style: styles.rightEye,
           children: /*#__PURE__*/_jsx(View, {
             style: styles.eyeHighlight
           })
@@ -99,17 +59,17 @@ export const CatCharacter = ({
       })]
     })
   });
-};
-const createStyles = catSize => StyleSheet.create({
+});
+const createStyles = moleSize => StyleSheet.create({
   container: {
     justifyContent: 'center',
     alignItems: 'center'
   },
   body: {
-    width: catSize,
-    height: catSize * 0.9,
+    width: moleSize,
+    height: moleSize * 0.9,
     backgroundColor: '#FF8C42',
-    borderRadius: catSize * 0.4,
+    borderRadius: moleSize * 0.4,
     justifyContent: 'center',
     alignItems: 'center',
     shadowColor: '#000',
@@ -122,111 +82,111 @@ const createStyles = catSize => StyleSheet.create({
     elevation: 5
   },
   head: {
-    width: catSize * 0.8,
-    height: catSize * 0.7,
+    width: moleSize * 0.8,
+    height: moleSize * 0.7,
     backgroundColor: '#FFA366',
-    borderRadius: catSize * 0.35,
+    borderRadius: moleSize * 0.35,
     position: 'relative',
     justifyContent: 'center',
     alignItems: 'center',
-    marginTop: -catSize * 0.1
+    marginTop: -moleSize * 0.1
   },
   leftEar: {
     position: 'absolute',
-    top: -catSize * 0.15,
-    left: catSize * 0.15,
-    width: catSize * 0.25,
-    height: catSize * 0.25,
+    top: -moleSize * 0.15,
+    left: moleSize * 0.15,
+    width: moleSize * 0.25,
+    height: moleSize * 0.25,
     backgroundColor: '#FF8C42',
-    borderRadius: catSize * 0.125,
+    borderRadius: moleSize * 0.125,
     transform: [{
       rotate: '-30deg'
     }]
   },
   rightEar: {
     position: 'absolute',
-    top: -catSize * 0.15,
-    right: catSize * 0.15,
-    width: catSize * 0.25,
-    height: catSize * 0.25,
+    top: -moleSize * 0.15,
+    right: moleSize * 0.15,
+    width: moleSize * 0.25,
+    height: moleSize * 0.25,
     backgroundColor: '#FF8C42',
-    borderRadius: catSize * 0.125,
+    borderRadius: moleSize * 0.125,
     transform: [{
       rotate: '30deg'
     }]
   },
   leftInnerEar: {
     position: 'absolute',
-    top: -catSize * 0.12,
-    left: catSize * 0.18,
-    width: catSize * 0.15,
-    height: catSize * 0.15,
+    top: -moleSize * 0.12,
+    left: moleSize * 0.18,
+    width: moleSize * 0.15,
+    height: moleSize * 0.15,
     backgroundColor: '#FF6B1A',
-    borderRadius: catSize * 0.075,
+    borderRadius: moleSize * 0.075,
     transform: [{
       rotate: '-30deg'
     }]
   },
   rightInnerEar: {
     position: 'absolute',
-    top: -catSize * 0.12,
-    right: catSize * 0.18,
-    width: catSize * 0.15,
-    height: catSize * 0.15,
+    top: -moleSize * 0.12,
+    right: moleSize * 0.18,
+    width: moleSize * 0.15,
+    height: moleSize * 0.15,
     backgroundColor: '#FF6B1A',
-    borderRadius: catSize * 0.075,
+    borderRadius: moleSize * 0.075,
     transform: [{
       rotate: '30deg'
     }]
   },
   leftEye: {
     position: 'absolute',
-    top: catSize * 0.15,
-    left: catSize * 0.2,
-    width: catSize * 0.12,
-    height: catSize * 0.15,
+    top: moleSize * 0.15,
+    left: moleSize * 0.2,
+    width: moleSize * 0.12,
+    height: moleSize * 0.15,
     backgroundColor: '#000000',
-    borderRadius: catSize * 0.075,
+    borderRadius: moleSize * 0.075,
     justifyContent: 'center',
     alignItems: 'center'
   },
   rightEye: {
     position: 'absolute',
-    top: catSize * 0.15,
-    right: catSize * 0.2,
-    width: catSize * 0.12,
-    height: catSize * 0.15,
+    top: moleSize * 0.15,
+    right: moleSize * 0.2,
+    width: moleSize * 0.12,
+    height: moleSize * 0.15,
     backgroundColor: '#000000',
-    borderRadius: catSize * 0.075,
+    borderRadius: moleSize * 0.075,
     justifyContent: 'center',
     alignItems: 'center'
   },
   eyeHighlight: {
-    width: catSize * 0.04,
-    height: catSize * 0.06,
+    width: moleSize * 0.04,
+    height: moleSize * 0.06,
     backgroundColor: '#FFFFFF',
-    borderRadius: catSize * 0.02
+    borderRadius: moleSize * 0.02
   },
   nose: {
     position: 'absolute',
-    top: catSize * 0.28,
-    width: catSize * 0.08,
-    height: catSize * 0.06,
+    top: moleSize * 0.28,
+    width: moleSize * 0.08,
+    height: moleSize * 0.06,
     backgroundColor: '#FF1493',
-    borderRadius: catSize * 0.04
+    borderRadius: moleSize * 0.04
   },
   mouth: {
     position: 'absolute',
-    top: catSize * 0.35,
-    width: catSize * 0.2,
-    height: catSize * 0.1,
+    top: moleSize * 0.35,
+    width: moleSize * 0.2,
+    height: moleSize * 0.1,
     justifyContent: 'center',
     alignItems: 'center'
   },
   leftMouth: {
     position: 'absolute',
     left: 0,
-    width: catSize * 0.08,
+    width: moleSize * 0.08,
     height: 2,
     backgroundColor: '#000000',
     borderRadius: 1,
@@ -237,7 +197,7 @@ const createStyles = catSize => StyleSheet.create({
   rightMouth: {
     position: 'absolute',
     right: 0,
-    width: catSize * 0.08,
+    width: moleSize * 0.08,
     height: 2,
     backgroundColor: '#000000',
     borderRadius: 1,
@@ -247,35 +207,35 @@ const createStyles = catSize => StyleSheet.create({
   },
   leftWhisker1: {
     position: 'absolute',
-    top: catSize * 0.35,
-    left: -catSize * 0.15,
-    width: catSize * 0.2,
+    top: moleSize * 0.35,
+    left: -moleSize * 0.15,
+    width: moleSize * 0.2,
     height: 1,
     backgroundColor: '#000000'
   },
   leftWhisker2: {
     position: 'absolute',
-    top: catSize * 0.4,
-    left: -catSize * 0.15,
-    width: catSize * 0.18,
+    top: moleSize * 0.4,
+    left: -moleSize * 0.15,
+    width: moleSize * 0.18,
     height: 1,
     backgroundColor: '#000000'
   },
   rightWhisker1: {
     position: 'absolute',
-    top: catSize * 0.35,
-    right: -catSize * 0.15,
-    width: catSize * 0.2,
+    top: moleSize * 0.35,
+    right: -moleSize * 0.15,
+    width: moleSize * 0.2,
     height: 1,
     backgroundColor: '#000000'
   },
   rightWhisker2: {
     position: 'absolute',
-    top: catSize * 0.4,
-    right: -catSize * 0.15,
-    width: catSize * 0.18,
+    top: moleSize * 0.4,
+    right: -moleSize * 0.15,
+    width: moleSize * 0.18,
     height: 1,
     backgroundColor: '#000000'
   }
 });
-//# sourceMappingURL=CatCharacter.js.map
+//# sourceMappingURL=MoleCharacter.js.map

package/lib/module/games/whack-a-mole/components/MoleCharacter.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","StyleSheet","jsx","_jsx","jsxs","_jsxs","MoleCharacter","memo","size","moleSize","styles","createStyles","style","container","width","height","children","body","head","leftEar","rightEar","leftInnerEar","rightInnerEar","leftEye","eyeHighlight","rightEye","nose","mouth","leftMouth","rightMouth","leftWhisker1","leftWhisker2","rightWhisker1","rightWhisker2","create","justifyContent","alignItems","backgroundColor","borderRadius","shadowColor","shadowOffset","shadowOpacity","shadowRadius","elevation","position","marginTop","top","left","transform","rotate","right"],"sourceRoot":"../../../../../src","sources":["games/whack-a-mole/components/MoleCharacter.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/games/{cat-popper → whack-a-mole}/components/ScoreBoard.js

@@ -2,8 +2,9 @@
 
 import React from 'react';
 import { View, Text, StyleSheet } from 'react-native';
+import { RESPONSIVE_SCOREBOARD_CONTAINER, RESPONSIVE_SCOREBOARD_FONTS } from "../../../shared/helpers/index.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export const ScoreBoard = ({
+export const ScoreBoard = /*#__PURE__*/React.memo(({
   score,
   timeLeft
 }) => {
@@ -29,9 +30,15 @@ export const ScoreBoard = ({
       })]
     })]
   });
-};
+});
 const styles = StyleSheet.create({
   scoreBoard: {
+    ...RESPONSIVE_SCOREBOARD_CONTAINER,
+    position: 'absolute',
+    top: 0,
+    left: 20,
+    right: 20,
+    zIndex: 100,
     flexDirection: 'row',
     justifyContent: 'space-between',
     alignItems: 'center',
@@ -39,37 +46,26 @@ const styles = StyleSheet.create({
     // Semi-transparent green
     borderRadius: 16,
     padding: 20,
-    marginBottom: 20,
     borderWidth: 1,
-    borderColor: 'rgba(255, 255, 255, 0.3)',
-    // Subtle white border
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 2
-    },
-    shadowOpacity: 0.15,
-    // Reduced shadow opacity
-    shadowRadius: 3.84,
-    elevation: 3 // Reduced elevation
+    borderColor: 'rgba(255, 255, 255, 0.3)' // Subtle white border
   },
   scoreSection: {
     alignItems: 'center',
     flex: 1
   },
   scoreLabel: {
-    fontSize: 18,
+    fontSize: RESPONSIVE_SCOREBOARD_FONTS.labelSize,
     fontWeight: 'bold',
     color: '#ffffff',
     marginBottom: 4
   },
   scoreValue: {
-    fontSize: 30,
+    fontSize: RESPONSIVE_SCOREBOARD_FONTS.valueSize,
     fontWeight: 'bold',
     color: '#92400e'
   },
   timeValue: {
-    fontSize: 30,
+    fontSize: RESPONSIVE_SCOREBOARD_FONTS.timeSize,
     fontWeight: 'bold',
     color: '#92400e'
   }

package/lib/module/games/whack-a-mole/components/ScoreBoard.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","Text","StyleSheet","RESPONSIVE_SCOREBOARD_CONTAINER","RESPONSIVE_SCOREBOARD_FONTS","jsx","_jsx","jsxs","_jsxs","ScoreBoard","memo","score","timeLeft","style","styles","scoreBoard","children","scoreSection","scoreLabel","scoreValue","timeValue","create","position","top","left","right","zIndex","flexDirection","justifyContent","alignItems","backgroundColor","borderRadius","padding","borderWidth","borderColor","flex","fontSize","labelSize","fontWeight","color","marginBottom","valueSize","timeSize"],"sourceRoot":"../../../../../src","sources":["games/whack-a-mole/components/ScoreBoard.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,EAAEC,IAAI,EAAEC,UAAU,QAAQ,cAAc;AACrD,SAASC,+BAA+B,EAAEC,2BAA2B,QAAQ,kCAAyB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAOvG,OAAO,MAAMC,UAAqC,gBAAGV,KAAK,CAACW,IAAI,CAAC,CAAC;EAAEC,KAAK;EAAEC;AAAS,CAAC,KAAK;EACvF,oBACEJ,KAAA,CAACR,IAAI;IAACa,KAAK,EAAEC,MAAM,CAACC,UAAW;IAAAC,QAAA,gBAC7BR,KAAA,CAACR,IAAI;MAACa,KAAK,EAAEC,MAAM,CAACG,YAAa;MAAAD,QAAA,gBAC/BV,IAAA,CAACL,IAAI;QAACY,KAAK,EAAEC,MAAM,CAACI,UAAW;QAAAF,QAAA,EAAC;MAAK,CAAM,CAAC,eAC5CV,IAAA,CAACL,IAAI;QAACY,KAAK,EAAEC,MAAM,CAACK,UAAW;QAAAH,QAAA,EAAEL;MAAK,CAAO,CAAC;IAAA,CAC1C,CAAC,eACPH,KAAA,CAACR,IAAI;MAACa,KAAK,EAAEC,MAAM,CAACG,YAAa;MAAAD,QAAA,gBAC/BV,IAAA,CAACL,IAAI;QAACY,KAAK,EAAEC,MAAM,CAACI,UAAW;QAAAF,QAAA,EAAC;MAAI,CAAM,CAAC,eAC3CV,IAAA,CAACL,IAAI;QAACY,KAAK,EAAEC,MAAM,CAACM,SAAU;QAAAJ,QAAA,EAAEJ;MAAQ,CAAO,CAAC;IAAA,CAC5C,CAAC;EAAA,CACH,CAAC;AAEX,CAAC,CAAC;AAEF,MAAME,MAAM,GAAGZ,UAAU,CAACmB,MAAM,CAAC;EAC/BN,UAAU,EAAE;IACV,GAAGZ,+BAA+B;IAClCmB,QAAQ,EAAE,UAAU;IACpBC,GAAG,EAAE,CAAC;IACNC,IAAI,EAAE,EAAE;IACRC,KAAK,EAAE,EAAE;IACTC,MAAM,EAAE,GAAG;IACXC,aAAa,EAAE,KAAK;IACpBC,cAAc,EAAE,eAAe;IAC/BC,UAAU,EAAE,QAAQ;IACpBC,eAAe,EAAE,wBAAwB;IAAE;IAC3CC,YAAY,EAAE,EAAE;IAChBC,OAAO,EAAE,EAAE;IACXC,WAAW,EAAE,CAAC;IACdC,WAAW,EAAE,0BAA0B,CAAE;EAC3C,CAAC;EACDjB,YAAY,EAAE;IACZY,UAAU,EAAE,QAAQ;IACpBM,IAAI,EAAE;EACR,CAAC;EACDjB,UAAU,EAAE;IACVkB,QAAQ,EAAEhC,2BAA2B,CAACiC,SAAS;IAC/CC,UAAU,EAAE,MAAM;IAClBC,KAAK,EAAE,SAAS;IAChBC,YAAY,EAAE;EAChB,CAAC;EACDrB,UAAU,EAAE;IACViB,QAAQ,EAAEhC,2BAA2B,CAACqC,SAAS;IAC/CH,UAAU,EAAE,MAAM;IAClBC,KAAK,EAAE;EACT,CAAC;EACDnB,SAAS,EAAE;IACTgB,QAAQ,EAAEhC,2BAA2B,CAACsC,QAAQ;IAC9CJ,UAAU,EAAE,MAAM;IAClBC,KAAK,EAAE;EACT;AACF,CAAC,CAAC","ignoreList":[]}

package/lib/module/games/{cat-popper → whack-a-mole}/components/index.js

@@ -3,8 +3,6 @@
 export { ScoreBoard } from "./ScoreBoard.js";
 export { GameHole } from "./GameHole.js";
 export { GameGrid } from "./GameGrid.js";
-export { GameControls } from "./GameControls.js";
-export { GameOverModal } from "./GameOverModal.js";
-export { CatCharacter } from "./CatCharacter.js";
+export { MoleCharacter } from "./MoleCharacter.js";
 export { GameBackground } from "./GameBackground.js";
 //# sourceMappingURL=index.js.map

package/lib/module/games/whack-a-mole/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ScoreBoard","GameHole","GameGrid","MoleCharacter","GameBackground"],"sourceRoot":"../../../../../src","sources":["games/whack-a-mole/components/index.ts"],"mappings":";;AAAA,SAASA,UAAU,QAAQ,iBAAc;AACzC,SAASC,QAAQ,QAAQ,eAAY;AACrC,SAASC,QAAQ,QAAQ,eAAY;AACrC,SAASC,aAAa,QAAQ,oBAAiB;AAC/C,SAASC,cAAc,QAAQ,qBAAkB","ignoreList":[]}

package/lib/module/index.js

@@ -2,10 +2,11 @@
 
 // Games
 export * from "./games/balloon-blaster/BalloonBlaster.js";
-export * from "./games/fruit-slicer/FruitSlicer.js";
+export * from "./games/popit-fidget/PopitFidget.js";
+export * from "./games/whack-a-mole/WhackAMole.js";
+export * from "./games/fruit-ninja/FruitNinja.js";
 export * from "./games/maze-runner/MazeRunner.js";
-export * from "./games/space-traveller/SpaceTraveller.js";
-export * from "./games/cat-popper/CatPopper.js";
+export * from "./games/space-fighter/SpaceFighter.js";
 
 // Services
 export * from "./services/GamesService.js";