Refactor platform common TextInput tests

Summary:
Android and iOS have different RNTester examples even though they should be mostly the same. Pull out the common ones into their own file. This should also be useful for other platforms.

Changelog:
[Internal]

(Note: this ignores all push blocking failures!)

Reviewed By: JoshuaGross

Differential Revision: D18628890

fbshipit-source-id: 6f1312973aebcfc687fdd8807bf942e48172f216

RNTester/js/examples/TextInput/TextInputExample.android.js

@@ -21,6 +21,10 @@ const {
   Switch,
 } = require('react-native');
 
+const TextInputSharedExamples = require('./TextInputSharedExamples.js');
+
+import type {RNTesterExampleModuleItem} from '../../types/RNTesterTypes';
+
 class TextEventsExample extends React.Component<{...}, $FlowFixMeState> {
   state = {
     curText: '<No Event>',
@@ -82,41 +86,6 @@ class TextEventsExample extends React.Component<{...}, $FlowFixMeState> {
   }
 }
 
-class RewriteExample extends React.Component<$FlowFixMeProps, $FlowFixMeState> {
-  constructor(props) {
-    super(props);
-    this.state = {text: ''};
-  }
-  render() {
-    const limit = 20;
-    const remainder = limit - this.state.text.length;
-    const remainderColor = remainder > 5 ? 'blue' : 'red';
-    return (
-      /* $FlowFixMe(>=0.78.0 site=react_native_android_fb) This issue was found
-       * when making Flow check .android.js files. */
-      <View style={styles.rewriteContainer}>
-        <TextInput
-          multiline={false}
-          maxLength={limit}
-          onChangeText={text => {
-            text = text.replace(/ /g, '_');
-            this.setState({text});
-          }}
-          /* $FlowFixMe(>=0.78.0 site=react_native_android_fb) This issue was
-           * found when making Flow check .android.js files. */
-          style={styles.default}
-          value={this.state.text}
-        />
-        {/* $FlowFixMe(>=0.78.0 site=react_native_android_fb) This issue was
-         * found when making Flow check .android.js files. */}
-        <Text style={[styles.remainder, {color: remainderColor}]}>
-          {remainder}
-        </Text>
-      </View>
-    );
-  }
-}
-
 class TokenizedTextExample extends React.Component<
   $FlowFixMeProps,
   $FlowFixMeState,
@@ -443,86 +412,8 @@ const styles = StyleSheet.create({
 
 exports.title = '<TextInput>';
 exports.description = 'Single and multi-line text inputs.';
-exports.examples = [
-  {
-    title: 'Auto-focus',
-    render: function(): React.Node {
-      return (
-        <TextInput
-          autoFocus={true}
-          multiline={true}
-          /* $FlowFixMe(>=0.78.0 site=react_native_android_fb) This issue was
-           * found when making Flow check .android.js files. */
-          style={styles.input}
-          accessibilityLabel="I am the accessibility label for text input"
-        />
-      );
-    },
-  },
-  {
-    title: "Live Re-Write (<sp>  ->  '_')",
-    render: function(): React.Node {
-      return <RewriteExample />;
-    },
-  },
-  {
-    title: 'Auto-capitalize',
-    render: function(): React.Node {
-      const autoCapitalizeTypes = ['none', 'sentences', 'words', 'characters'];
-      const examples = autoCapitalizeTypes.map(type => {
-        return (
-          <TextInput
-            key={type}
-            autoCapitalize={type}
-            placeholder={'autoCapitalize: ' + type}
-            style={styles.singleLine}
-          />
-        );
-      });
-      return <View>{examples}</View>;
-    },
-  },
-  {
-    title: 'Auto-correct',
-    render: function(): React.Node {
-      return (
-        <View>
-          <TextInput
-            autoCorrect={true}
-            placeholder="This has autoCorrect"
-            style={styles.singleLine}
-          />
-          <TextInput
-            autoCorrect={false}
-            placeholder="This does not have autoCorrect"
-            style={styles.singleLine}
-          />
-        </View>
-      );
-    },
-  },
-  {
-    title: 'Keyboard types',
-    render: function(): React.Node {
-      const keyboardTypes = [
-        'default',
-        'email-address',
-        'numeric',
-        'phone-pad',
-      ];
-      const examples = keyboardTypes.map(type => {
-        return (
-          <TextInput
-            key={type}
-            keyboardType={type}
-            placeholder={'keyboardType: ' + type}
-            style={styles.singleLine}
-          />
-        );
-      });
-      return <View>{examples}</View>;
-    },
-  },
+exports.examples = ([
+  ...TextInputSharedExamples,
   {
     title: 'Blur on submit',
     render: function(): React.Element<any> {
@@ -873,4 +764,4 @@ exports.examples = [
       );
     },
   },
-];
+]: Array<RNTesterExampleModuleItem>);