diff --git a/src/components/player/NowPlayingOverlay.tsx b/src/components/player/NowPlayingOverlay.tsx
index 08863cb..4d2f687 100644
--- a/src/components/player/NowPlayingOverlay.tsx
+++ b/src/components/player/NowPlayingOverlay.tsx
@@ -69,7 +69,10 @@ import {
ScopedPaletteProvider,
useColors,
} from '@/theme/themed';
-import { AppPressable } from '@/components/AppPressable';
+import {
+ AppPressable,
+ AppPressableGestureScope,
+} from '@/components/AppPressable';
import { motion } from '@/theme/motion';
import { paletteWithAccent } from '@/theme/scopedAccent';
import { useNowPlayingArtworkAccent } from '@/theme/useNowPlayingArtworkAccent';
@@ -1078,6 +1081,7 @@ export function NowPlayingOverlay({
},
]}
>
+
+
{menuOpen && menuItems.length > 0 && (
diff --git a/src/components/player/TactilePressable.tsx b/src/components/player/TactilePressable.tsx
index a5e3461..6ab29a3 100644
--- a/src/components/player/TactilePressable.tsx
+++ b/src/components/player/TactilePressable.tsx
@@ -1,11 +1,14 @@
/* eslint-disable react-hooks/immutability -- Reanimated shared values are mutable press state. */
-import type { ReactNode } from 'react';
+import { forwardRef, type ReactNode } from 'react';
import {
- Pressable,
- type PressableProps,
type StyleProp,
+ type View as NativeView,
type ViewStyle,
} from 'react-native';
+import {
+ Pressable as GesturePressable,
+ type PressableProps as GesturePressableProps,
+} from 'react-native-gesture-handler';
import Animated, {
useAnimatedStyle,
useSharedValue,
@@ -15,12 +18,17 @@ import Animated, {
import { playHaptic, type HapticEvent } from '@/lib/haptics';
import { motion } from '@/theme/motion';
-const AnimatedPressable = Animated.createAnimatedComponent(Pressable);
+const GesturePressableWithRef = forwardRef(
+ function GesturePressableWithRef(props, ref) {
+ return ;
+ }
+);
+const AnimatedPressable = Animated.createAnimatedComponent(GesturePressableWithRef);
type HapticFeedback = HapticEvent | 'none';
interface TactilePressableProps
- extends Omit {
+ extends Omit {
children: ReactNode;
style?: StyleProp;
pressedScale?: number;
@@ -49,17 +57,17 @@ export function TactilePressable({
transform: [{ scale: scale.value }],
}));
- const handlePressIn: NonNullable = (event) => {
+ const handlePressIn: NonNullable = (event) => {
scale.value = withTiming(pressedScale, motion.quick);
onPressIn?.(event);
};
- const handlePressOut: NonNullable = (event) => {
+ const handlePressOut: NonNullable = (event) => {
scale.value = withTiming(1, motion.quick);
onPressOut?.(event);
};
- const handlePress: NonNullable = (event) => {
+ const handlePress: NonNullable = (event) => {
if (haptic !== 'none') playHaptic(haptic);
if (confirmationScale) {
scale.value = withSequence(