diff --git a/packages/rn-tester/js/examples/Pressable/PressableExample.js b/packages/rn-tester/js/examples/Pressable/PressableExample.js index fc7ba7bb8005..46867959fd8c 100644 --- a/packages/rn-tester/js/examples/Pressable/PressableExample.js +++ b/packages/rn-tester/js/examples/Pressable/PressableExample.js @@ -312,6 +312,23 @@ function PressableDisabled() { ); } +function RoundedPressableExample() { + return ( + + + Background Ripple + + + Foreground Ripple + + + ); +} + const styles = StyleSheet.create({ row: { justifyContent: 'center', @@ -397,6 +414,12 @@ const styles = StyleSheet.create({ height: 100, width: 100, }, + roundedPressable: { + backgroundColor: '#eee', + borderRadius: 100, + padding: 16, + marginTop: 10, + }, }); const examples = [ @@ -714,6 +737,15 @@ const examples = [ ); }, }, + { + title: 'Rounded Pressable with Ripple', + description: + 'Ripple should clip to the border radius of the Pressable' as string, + platform: 'android', + render: function (): React.Node { + return ; + }, + }, ...PressableExampleFbInternal.examples, ];