diff --git a/packages/rn-tester/js/components/RNTesterButton.js b/packages/rn-tester/js/components/RNTesterButton.js index 0bff3bf6da6..6f4ed2ad56e 100644 --- a/packages/rn-tester/js/components/RNTesterButton.js +++ b/packages/rn-tester/js/components/RNTesterButton.js @@ -12,7 +12,7 @@ const React = require('react'); -const {StyleSheet, Text, TouchableHighlight} = require('react-native'); +const {Pressable, StyleSheet, Text} = require('react-native'); import type {PressEvent} from 'react-native/Libraries/Types/CoreEventTypes'; @@ -26,13 +26,12 @@ type Props = $ReadOnly<{| class RNTesterButton extends React.Component { render(): React.Node { return ( - + style={({pressed}) => [styles.button, pressed && styles.pressed]}> {this.props.children} - + ); } } @@ -48,6 +47,9 @@ const styles = StyleSheet.create({ justifyContent: 'center', backgroundColor: '#d3d3d3', }, + pressed: { + backgroundColor: '#a9a9a9', + }, }); module.exports = RNTesterButton; diff --git a/packages/rn-tester/js/components/RNTesterPage.js b/packages/rn-tester/js/components/RNTesterPage.js index 3cda7355147..3beeb64f53f 100644 --- a/packages/rn-tester/js/components/RNTesterPage.js +++ b/packages/rn-tester/js/components/RNTesterPage.js @@ -10,7 +10,7 @@ const RNTesterTitle = require('./RNTesterTitle'); const React = require('react'); -const {ScrollView, StyleSheet, View} = require('react-native'); +const {SafeAreaView, ScrollView, StyleSheet, View} = require('react-native'); import {RNTesterThemeContext} from './RNTesterTheme'; type Props = $ReadOnly<{| @@ -44,7 +44,7 @@ class RNTesterPage extends React.Component { {theme => { return ( - { {this.props.children} {spacer} - + ); }}