Clean up files and add a Text example (#12)

* clean up files

* adding text example

example/src/AndroidPatch.js

@@ -0,0 +1,39 @@
+import * as React from 'react';
+import { View, StyleSheet, Text, TextInput } from 'react-native';
+export function AndroidPatch() {
+  const email =
+    'From [email protected]  From [email protected]';
+  return (
+    <>
+      <View style={styles.container}>
+        <View style={styles.flexBrokenStyle}>
+          <Text
+            textBreakStrategy="simple"
+            style={styles.parentText}
+            numberOfLines={1}
+          >
+            {email}
+          </Text>
+        </View>
+        <TextInput style={styles.input} />
+        <Text>Normal Text</Text>
+      </View>
+    </>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: 'center',
+    padding: 8,
+    backgroundColor: 'yellow',
+  },
+  flexBrokenStyle: {
+    flexDirection: 'row',
+  },
+  parentText: {
+    backgroundColor: 'red',
+  },
+  input: { borderWidth: 1 },
+});

example/src/App.tsx

@@ -1,42 +1,16 @@
 import * as React from 'react';
 
-import { View, StyleSheet, Text, TextInput } from 'react-native';
-import { TextImproved } from 'react-native-improved';
+import { ScrollView, View, StyleSheet, Text, TextInput } from 'react-native';
+import { TextScreen } from './TextScreen';
 
 export default function App() {
   const email =
     'From [email protected]  From [email protected]';
-  return (
-    <>
-      <View style={styles.container}>
-        <View style={styles.flexBrokenStyle}>
-          <Text
-            textBreakStrategy="simple"
-            style={styles.parentText}
-            numberOfLines={1}
-          >
-            {email}
-          </Text>
-        </View>
-        <TextInput style={styles.input} />
-        <Text>Normal Text</Text>
-      </View>
-    </>
-  );
+  return <CurrentScreen />;
 }
 
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    justifyContent: 'center',
-    padding: 8,
-    backgroundColor: 'yellow',
-  },
-  flexBrokenStyle: {
-    flexDirection: 'row',
-  },
-  parentText: {
-    backgroundColor: 'red',
-  },
-  input: { borderWidth: 1 },
-});
+function CurrentScreen() {
+  return <TextScreen />;
+}
+
+const styles = StyleSheet.create({});

example/src/RNTOption.js

@@ -0,0 +1,86 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ * @flow strict-local
+ */
+
+'use strict';
+
+import * as React from 'react';
+import {Text, Pressable, StyleSheet, View} from 'react-native';
+import type {PressEvent} from 'react-native/Libraries/Types/CoreEventTypes';
+import type {ViewStyleProp} from 'react-native/Libraries/StyleSheet/StyleSheet';
+
+type Props = $ReadOnly<{|
+  testID?: ?string,
+  label: string,
+  onPress?: ?(event: PressEvent) => mixed,
+  selected?: ?boolean,
+  multiSelect?: ?boolean,
+  disabled?: ?boolean,
+  style?: ViewStyleProp,
+|}>;
+
+/**
+ * A reusable toggle button component for RNTester. Highlights when selected.
+ */
+export default function RNTOption(props: Props): React.Node {
+  const [pressed, setPressed] = React.useState(false);
+
+  return (
+    <Pressable
+      accessibilityState={{selected: !!props.selected}}
+      disabled={
+        props.disabled === false || props.multiSelect === true
+          ? false
+          : props.selected
+      }
+      hitSlop={4}
+      onPress={props.disabled === true ? undefined : props.onPress}
+      onPressIn={() => setPressed(true)}
+      onPressOut={() => setPressed(false)}
+      testID={props.testID}>
+      <View
+        style={[
+          styles.container,
+          props.selected === true ? styles.selected : null,
+          pressed && props.selected !== true ? styles.pressed : null,
+          props.disabled === true
+            ? [
+                styles.disabled,
+                {backgroundColor: "white"},
+              ]
+            : null,
+          props.style,
+        ]}>
+        <Text style={styles.label}>{props.label}</Text>
+      </View>
+    </Pressable>
+  );
+}
+
+const styles = StyleSheet.create({
+  pressed: {
+    backgroundColor: 'rgba(100,215,255,.3)',
+  },
+  label: {
+    color: 'black',
+  },
+  selected: {
+    backgroundColor: 'rgba(100,215,255,.3)',
+    borderColor: 'rgba(100,215,255,.3)',
+  },
+  disabled: {borderWidth: 0},
+  container: {
+    borderColor: 'rgba(0,0,0, 0.1)',
+    borderWidth: 1,
+    borderRadius: 16,
+    padding: 6,
+    paddingHorizontal: 10,
+    alignItems: 'center',
+  },
+});