RN: Prepare More Touchable Experiments

Summary:
Expands `TouchableWithoutFeedbackInjection` as `TouchableInjection` for use in testing out new implementations of all five `Touchable.Mixin` components.

Changelog:
[Internal]

Reviewed By: TheSavior

Differential Revision: D18278876

fbshipit-source-id: d511bdecefe38579f03a9d5ad52011f7cd71f4c0

Libraries/Components/Touchable/TouchableBounce.js

@@ -10,6 +10,8 @@
 
 'use strict';
 
+import TouchableInjection from './TouchableInjection';
+
 const Animated = require('../../Animated/src/Animated');
 const DeprecatedViewPropTypes = require('../../DeprecatedPropTypes/DeprecatedViewPropTypes');
 const DeprecatedEdgeInsetsPropType = require('../../DeprecatedPropTypes/DeprecatedEdgeInsetsPropType');
@@ -52,7 +54,7 @@ type Props = $ReadOnly<{|
  * `TouchableMixin` expects us to implement some abstract methods to handle
  * interesting interactions such as `handleTouchablePress`.
  */
-const TouchableBounce = ((createReactClass({
+const TouchableBounceImpl = ((createReactClass({
   displayName: 'TouchableBounce',
   mixins: [Touchable.Mixin.withoutDefaultFocusAndBlur, NativeMethodsMixin],
 
@@ -212,4 +214,9 @@ const TouchableBounce = ((createReactClass({
   },
 }): any): React.ComponentType<Props>);
 
+const TouchableBounce: React.ComponentType<Props> =
+  TouchableInjection.unstable_TouchableBounce == null
+    ? TouchableBounceImpl
+    : TouchableInjection.unstable_TouchableBounce;
+
 module.exports = TouchableBounce;

Libraries/Components/Touchable/TouchableHighlight.js

@@ -10,6 +10,8 @@
 
 'use strict';
 
+import TouchableInjection from './TouchableInjection';
+
 const DeprecatedColorPropType = require('../../DeprecatedPropTypes/DeprecatedColorPropType');
 const DeprecatedViewPropTypes = require('../../DeprecatedPropTypes/DeprecatedViewPropTypes');
 const NativeMethodsMixin = require('../../Renderer/shims/NativeMethodsMixin');
@@ -160,7 +162,7 @@ export type Props = $ReadOnly<{|
  *
  */
 
-const TouchableHighlight = ((createReactClass({
+const TouchableHighlightImpl = ((createReactClass({
   displayName: 'TouchableHighlight',
   propTypes: {
     /* $FlowFixMe(>=0.89.0 site=react_native_fb) This comment suppresses an
@@ -436,4 +438,9 @@ const TouchableHighlight = ((createReactClass({
   },
 }): any): React.ComponentType<Props>);
 
+const TouchableHighlight: React.ComponentType<Props> =
+  TouchableInjection.unstable_TouchableHighlight == null
+    ? TouchableHighlightImpl
+    : TouchableInjection.unstable_TouchableHighlight;
+
 module.exports = TouchableHighlight;

Libraries/Components/Touchable/TouchableInjection.js

@@ -0,0 +1,25 @@
+/**
+ * Copyright (c) Facebook, Inc. and its 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
+ */
+
+'use strict';
+
+import typeof TouchableBounce from './TouchableBounce';
+import typeof TouchableHighlight from './TouchableHighlight';
+import typeof TouchableNativeFeedback from './TouchableNativeFeedback';
+import typeof TouchableOpacity from './TouchableOpacity';
+import typeof TouchableWithoutFeedback from './TouchableWithoutFeedback';
+
+export default {
+  unstable_TouchableBounce: (null: ?TouchableBounce),
+  unstable_TouchableHighlight: (null: ?TouchableHighlight),
+  unstable_TouchableNativeFeedback: (null: ?TouchableNativeFeedback),
+  unstable_TouchableOpacity: (null: ?TouchableOpacity),
+  unstable_TouchableWithoutFeedback: (null: ?TouchableWithoutFeedback),
+};

Libraries/Components/Touchable/TouchableNativeFeedback.android.js

@@ -10,6 +10,8 @@
 
 'use strict';
 
+import TouchableInjection from './TouchableInjection';
+
 const Platform = require('../../Utilities/Platform');
 const PropTypes = require('prop-types');
 const React = require('react');
@@ -23,6 +25,7 @@ const createReactClass = require('create-react-class');
 const ensurePositiveDelayProps = require('./ensurePositiveDelayProps');
 const processColor = require('../../StyleSheet/processColor');
 
+import type {Props as TouchableWithoutFeedbackProps} from './TouchableWithoutFeedback';
 import type {PressEvent} from '../../Types/CoreEventTypes';
 
 const rippleBackgroundPropType = PropTypes.shape({
@@ -43,6 +46,31 @@ const backgroundPropType = PropTypes.oneOfType([
 
 const PRESS_RETENTION_OFFSET = {top: 20, left: 20, right: 20, bottom: 30};
 
+export type Props = $ReadOnly<{|
+  ...TouchableWithoutFeedbackProps,
+
+  background?: ?(
+    | $ReadOnly<{|
+        type: 'ThemeAttrAndroid',
+        attribute:
+          | 'selectableItemBackground'
+          | 'selectableItemBackgroundBorderless',
+      |}>
+    | $ReadOnly<{|
+        type: 'RippleAndroid',
+        color: ?number,
+        borderless: boolean,
+      |}>
+  ),
+  hasTVPreferredFocus?: ?boolean,
+  nextFocusDown?: ?number,
+  nextFocusForward?: ?number,
+  nextFocusLeft?: ?number,
+  nextFocusRight?: ?number,
+  nextFocusUp?: ?number,
+  useForeground?: ?boolean,
+|}>;
+
 /**
  * A wrapper for making views respond properly to touches (Android only).
  * On Android this component uses native state drawable to display touch
@@ -72,7 +100,7 @@ const PRESS_RETENTION_OFFSET = {top: 20, left: 20, right: 20, bottom: 30};
  * ```
  */
 
-const TouchableNativeFeedback = createReactClass({
+const TouchableNativeFeedbackImpl = createReactClass({
   displayName: 'TouchableNativeFeedback',
   propTypes: {
     /* $FlowFixMe(>=0.89.0 site=react_native_android_fb) This comment
@@ -294,7 +322,7 @@ const TouchableNativeFeedback = createReactClass({
     }
     if (
       this.props.useForeground &&
-      !TouchableNativeFeedback.canUseNativeForeground()
+      !TouchableNativeFeedbackImpl.canUseNativeForeground()
     ) {
       console.warn(
         'Requested foreground ripple, but it is not available on this version of Android. ' +
@@ -304,7 +332,7 @@ const TouchableNativeFeedback = createReactClass({
     }
     const drawableProp =
       this.props.useForeground &&
-      TouchableNativeFeedback.canUseNativeForeground()
+      TouchableNativeFeedbackImpl.canUseNativeForeground()
         ? 'nativeForegroundAndroid'
         : 'nativeBackgroundAndroid';
     const childProps = {
@@ -348,4 +376,9 @@ const TouchableNativeFeedback = createReactClass({
   },
 });
 
+const TouchableNativeFeedback: React.ComponentType<Props> =
+  TouchableInjection.unstable_TouchableNativeFeedback == null
+    ? TouchableNativeFeedbackImpl
+    : TouchableInjection.unstable_TouchableNativeFeedback;
+
 module.exports = (TouchableNativeFeedback: $FlowFixMe);

Libraries/Components/Touchable/TouchableOpacity.js

@@ -10,6 +10,8 @@
 
 'use strict';
 
+import TouchableInjection from './TouchableInjection';
+
 const Animated = require('../../Animated/src/Animated');
 const Easing = require('../../Animated/src/Easing');
 const NativeMethodsMixin = require('../../Renderer/shims/NativeMethodsMixin');
@@ -133,7 +135,7 @@ export type Props = $ReadOnly<{|
  * ```
  *
  */
-const TouchableOpacity = ((createReactClass({
+const TouchableOpacityImpl = ((createReactClass({
   displayName: 'TouchableOpacity',
   mixins: [Touchable.Mixin.withoutDefaultFocusAndBlur, NativeMethodsMixin],
 
@@ -341,4 +343,9 @@ const TouchableOpacity = ((createReactClass({
   },
 }): any): React.ComponentType<Props>);
 
+const TouchableOpacity: React.ComponentType<Props> =
+  TouchableInjection.unstable_TouchableOpacity == null
+    ? TouchableOpacityImpl
+    : TouchableInjection.unstable_TouchableOpacity;
+
 module.exports = TouchableOpacity;

Libraries/Components/Touchable/TouchableWithoutFeedback.js

@@ -10,7 +10,7 @@
 
 'use strict';
 
-import TouchableWithoutFeedbackInjection from './TouchableWithoutFeedbackInjection';
+import TouchableInjection from './TouchableInjection';
 
 const DeprecatedEdgeInsetsPropType = require('../../DeprecatedPropTypes/DeprecatedEdgeInsetsPropType');
 const React = require('react');
@@ -281,8 +281,8 @@ const TouchableWithoutFeedbackImpl = ((createReactClass({
 }): any): React.ComponentType<Props>);
 
 const TouchableWithoutFeedback: React.ComponentType<Props> =
-  TouchableWithoutFeedbackInjection.unstable_Override == null
+  TouchableInjection.unstable_TouchableWithoutFeedback == null
     ? TouchableWithoutFeedbackImpl
-    : TouchableWithoutFeedbackInjection.unstable_Override;
+    : TouchableInjection.unstable_TouchableWithoutFeedback;
 
 module.exports = TouchableWithoutFeedback;

Libraries/Components/Touchable/TouchableWithoutFeedbackInjection.js

@@ -1,18 +0,0 @@
-/**
- * Copyright (c) Facebook, Inc. and its 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
- */
-
-'use strict';
-
-import type {Props} from './TouchableWithoutFeedback';
-import * as React from 'react';
-
-export default {
-  unstable_Override: (null: ?React.ComponentType<Props>),
-};