animation

Use useSharedValue with withSpring inside onPressIn and onPressOut handlers, applying the value through useAnimatedStyle. Import SPRING_CONFIGS.press and MOTION.pressScale (0.97) from constants/motion.ts rather than hardcoding damping or stiffness values.

Use SPRING_CONFIGS.modal (damping 30, stiffness 380, mass 0.6) for custom sheet implementations. Note that @gorhom/bottom-sheet manages its own spring internally, so only apply this config to custom-built sheets.

Always use Animated from react-native-reanimated so animations run on the UI thread. The Animated API from react-native runs on the JS thread and is listed as an anti-pattern in this project.

Heavy Zustand updates, AsyncStorage writes, or analytics calls during router.push block the JS thread mid-animation. Wrap them in scheduleTransitionTask so they execute about 100ms after the transition completes.

Call measure() only inside onPressIn callbacks, never during render or onPress. Capturing layout in onPress is too late because navigation has already started, and measuring in render causes errors.

No, useAnimatedStyle worklets run on the UI thread and cannot call JS functions like store actions or console.log. If bridging is unavoidable, use runOnJS sparingly, batch updates, and add a comment explaining why it is needed.