fix: ripple not showing

example/src/Examples/IconButtonExample.tsx

@@ -137,7 +137,7 @@ const ButtonExample = () => {
             mode="contained"
             style={styles.slightlyRounded}
             size={24}
-            contentStyle={{ padding: 8 }}
+            contentStyle={styles.contentPadding}
             iconColor={MD3Colors.tertiary50}
             onPress={() => {}}
           />
@@ -190,6 +190,9 @@ const styles = StyleSheet.create({
     width: 48,
     height: 48,
   },
+  contentPadding: {
+    padding: 8,
+  },
   differentBorderRadius: {
     borderTopLeftRadius: 2,
     borderTopRightRadius: 4,

example/src/index.native.tsx

@@ -13,9 +13,9 @@ import { PaperProvider, MD3DarkTheme, MD3LightTheme } from 'react-native-paper';
 import { SafeAreaInsetsContext } from 'react-native-safe-area-context';
 
 import DrawerItems from './DrawerItems';
+import { PreferencesContext } from './PreferencesContext';
 import App from './RootNavigator';
 import { deviceColorsSupported } from '../utils';
-import { PreferencesContext } from './PreferencesContext';
 import {
   CombinedDefaultTheme,
   CombinedDarkTheme,

src/components/BottomNavigation/BottomNavigation.tsx

@@ -423,13 +423,11 @@ const BottomNavigation = <Route extends BaseRoute>({
       });
     },
     [
-      shifting,
       navigationState.routes,
       offsetsAnims,
       scale,
       tabsPositionAnims,
       sceneAnimationEasing,
-      theme,
     ]
   );
 

src/components/TouchableRipple/TouchableRipple.native.tsx

@@ -73,12 +73,13 @@ const TouchableRipple = (
       underlayColor,
     });
 
-  // A workaround for ripple on Android P is to use useForeground + overflow: 'hidden'
+  // Use foreground ripple on Android P+ to ensure visibility.
+  // Background ripple requires the view to have a background drawable,
+  // which isn't always present. Foreground ripple needs overflow: 'hidden'
+  // to stay within bounds.
   // https://github.com/facebook/react-native/issues/6480
   const useForeground =
-    Platform.OS === 'android' &&
-    Platform.Version >= ANDROID_VERSION_PIE &&
-    borderless;
+    Platform.OS === 'android' && Platform.Version >= ANDROID_VERSION_PIE;
 
   if (TouchableRipple.supported) {
     const androidRipple = rippleEffectEnabled
@@ -94,7 +95,7 @@ const TouchableRipple = (
         {...rest}
         ref={ref}
         disabled={disabled}
-        style={[borderless && styles.overflowHidden, style]}
+        style={[useForeground && styles.overflowHidden, style]}
         android_ripple={androidRipple}
       >
         {React.Children.only(children)}