Remove RN fiber createClass wrapper around View

Reviewed By: spicyj

Differential Revision: D5241527

fbshipit-source-id: 9209004544e83cc0f03fcaa27c9b1acf8db09930

Libraries/Components/ScrollView/ScrollView.js

@@ -33,6 +33,8 @@ const invariant = require('fbjs/lib/invariant');
 const processDecelerationRate = require('processDecelerationRate');
 const requireNativeComponent = require('requireNativeComponent');
 
+import type {NativeMethodsMixinType} from 'ReactNativeTypes';
+
 /**
  * Component that wraps platform ScrollView while providing
  * integration with touch locking "responder" system.
@@ -592,8 +594,8 @@ const ScrollView = React.createClass({
     this._scrollViewRef = ref;
   },
 
-  _innerViewRef: (null: ?View),
+  _innerViewRef: (null: ?NativeMethodsMixinType),
-  _setInnerViewRef: function(ref: ?View) {
+  _setInnerViewRef: function(ref: ?NativeMethodsMixinType) {
     this._innerViewRef = ref;
   },
 
@@ -825,6 +827,7 @@ if (Platform.OS === 'android') {
     (ScrollView: ReactClass<any>),
     nativeOnlyProps,
   );
+  // $FlowFixMe (bvaughn) Update ComponentInterface in ViewPropTypes to include a string type (for Fiber host components) in a follow-up.
   RCTScrollContentView = requireNativeComponent('RCTScrollContentView', View);
 }
 

Libraries/Components/View/View.js

@@ -12,26 +12,15 @@
 'use strict';
 
 const NativeMethodsMixin = require('NativeMethodsMixin');
-const NativeModules = require('NativeModules');
 const Platform = require('Platform');
 const PropTypes = require('prop-types');
 const React = require('React');
-const ReactNativeFeatureFlags = require('ReactNativeFeatureFlags');
 const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes');
 const ReactNativeViewAttributes = require('ReactNativeViewAttributes');
 const ViewPropTypes = require('ViewPropTypes');
 
 const invariant = require('fbjs/lib/invariant');
 const requireNativeComponent = require('requireNativeComponent');
-const warning = require('fbjs/lib/warning');
-
-const {
-  AccessibilityComponentTypes,
-  AccessibilityTraits,
-} = require('ViewAccessibility');
-
-const forceTouchAvailable = (NativeModules.PlatformConstants &&
-  NativeModules.PlatformConstants.forceTouchAvailable) || false;
 
 import type {ViewProps} from 'ViewPropTypes';
 
@@ -94,18 +83,9 @@ const View = React.createClass({
   // `propTypes` should not be accessed directly on View since this wrapper only
   // exists for DEV mode. However it's important for them to be declared.
   // If the object passed to `createClass` specifies `propTypes`, Flow will
-  // create a static type from it. This property will be over-written below with
+  // create a static type from it.
-  // a warn-on-use getter though.
-  // TODO (bvaughn) Remove the warn-on-use comment after April 1.
   propTypes: ViewPropTypes,
 
-  // ReactElementValidator will (temporarily) use this private accessor when
-  // detected to avoid triggering the warning message.
-  // TODO (bvaughn) Remove this after April 1 ReactNative RC is tagged.
-  statics: {
-    __propTypesSecretDontUseThesePlease: ViewPropTypes
-  },
-
   /**
    * `NativeMethodsMixin` will look for this when invoking `setNativeProps`. We
    * make `this` look like an actual native component class.
@@ -132,70 +112,6 @@ const View = React.createClass({
   },
 });
 
-// Warn about unsupported use of View static properties as these will no longer
-// be supported with React fiber. This warning message will go away in the next
-// ReactNative release. Use defineProperty() rather than createClass() statics
-// because the mixin process auto-triggers the 1-time warning message.
-// TODO (bvaughn) Remove this after April 1 ReactNative RC is tagged.
-function mixinStatics (target) {
-  let warnedAboutAccessibilityTraits = false;
-  let warnedAboutAccessibilityComponentType = false;
-  let warnedAboutForceTouchAvailable = false;
-  let warnedAboutPropTypes = false;
-
-  // $FlowFixMe https://github.com/facebook/flow/issues/285
-  Object.defineProperty(target, 'AccessibilityTraits', {
-    get: function() {
-      warning(
-        warnedAboutAccessibilityTraits,
-        'View.AccessibilityTraits has been deprecated and will be ' +
-        'removed in a future version of ReactNative. Use ' +
-        'ViewAccessibility.AccessibilityTraits instead.'
-      );
-      warnedAboutAccessibilityTraits = true;
-      return AccessibilityTraits;
-    }
-  });
-  // $FlowFixMe https://github.com/facebook/flow/issues/285
-  Object.defineProperty(target, 'AccessibilityComponentType', {
-    get: function() {
-      warning(
-        warnedAboutAccessibilityComponentType,
-        'View.AccessibilityComponentType has been deprecated and will be ' +
-        'removed in a future version of ReactNative. Use ' +
-        'ViewAccessibility.AccessibilityComponentTypes instead.'
-      );
-      warnedAboutAccessibilityComponentType = true;
-      return AccessibilityComponentTypes;
-    }
-  });
-  // $FlowFixMe https://github.com/facebook/flow/issues/285
-  Object.defineProperty(target, 'forceTouchAvailable', {
-    get: function() {
-      warning(
-        warnedAboutForceTouchAvailable,
-        'View.forceTouchAvailable has been deprecated and will be removed ' +
-        'in a future version of ReactNative. Use ' +
-        'NativeModules.PlatformConstants.forceTouchAvailable instead.'
-      );
-      warnedAboutForceTouchAvailable = true;
-      return forceTouchAvailable;
-    }
-  });
-  // $FlowFixMe https://github.com/facebook/flow/issues/285
-  Object.defineProperty(target, 'propTypes', {
-    get: function() {
-      warning(
-        warnedAboutPropTypes,
-        'View.propTypes has been deprecated and will be removed in a future ' +
-        'version of ReactNative. Use ViewPropTypes instead.'
-      );
-      warnedAboutPropTypes = true;
-      return ViewPropTypes;
-    }
-  });
-}
-
 const RCTView = requireNativeComponent('RCTView', View, {
   nativeOnly: {
     nativeBackgroundAndroid: true,
@@ -216,21 +132,10 @@ if (__DEV__) {
   }
 }
 
-// TODO (bvaughn) Remove feature flags once all static View accessors are gone.
-// We temporarily wrap fiber native views with the create-class View above,
-// Because external code sometimes accesses static properties of this view.
 let ViewToExport = RCTView;
-if (
+if (__DEV__) {
-  __DEV__ ||
-  ReactNativeFeatureFlags.useFiber
-) {
-  mixinStatics(View);
   ViewToExport = View;
-} else {
-  // TODO (bvaughn) Remove this mixin once all static View accessors are gone.
-  mixinStatics((RCTView : any));
 }
 
-// TODO (bvaughn) Temporarily mask Flow warnings for View property accesses.
+// No one should depend on the DEV-mode createClass View wrapper.
-// We're wrapping the string type (Fiber) for now to avoid any actual problems.
+module.exports = ((ViewToExport : any) : typeof RCTView);
-module.exports = ((ViewToExport : any) : typeof View);

Libraries/Experimental/SwipeableRow/SwipeableQuickActionButton.js

@@ -12,12 +12,11 @@
 'use strict';
 
 const Image = require('Image');
-const React = require('React');
 const PropTypes = require('prop-types');
+const React = require('React');
 const Text = require('Text');
 const TouchableHighlight = require('TouchableHighlight');
 const View = require('View');
-
 const ViewPropTypes = require('ViewPropTypes');
 
 import type {ImageSource} from 'ImageSource';
@@ -31,12 +30,12 @@ class SwipeableQuickActionButton extends React.Component {
   props: {
     accessibilityLabel?: string,
     imageSource: ImageSource | number,
-    imageStyle?: ?View.propTypes.style,
+    imageStyle?: ?ViewPropTypes.style,
     onPress?: Function,
-    style?: ?View.propTypes.style,
+    style?: ?ViewPropTypes.style,
     testID?: string,
     text?: ?(string | Object | Array<string | Object>),
-    textStyle?: ?View.propTypes.style,
+    textStyle?: ?ViewPropTypes.style,
   };
 
   static propTypes = {

Libraries/Experimental/WindowedListView.js

@@ -27,6 +27,8 @@ const infoLog = require('infoLog');
 const invariant = require('fbjs/lib/invariant');
 const nullthrows = require('fbjs/lib/nullthrows');
 
+import type {NativeMethodsMixinType} from 'ReactNativeTypes';
+
 const DEBUG = false;
 
 /**
@@ -613,7 +615,7 @@ type CellProps = {
 };
 class CellRenderer extends React.Component {
   props: CellProps;
-  _containerRef: View;
+  _containerRef: NativeMethodsMixinType;
   _offscreenRenderDone = false;
   _timeout = 0;
   _lastLayout: ?Object = null;

RNTester/js/RNTesterPage.js

@@ -11,8 +11,8 @@
  */
 'use strict';
 
-var React = require('react');
 var PropTypes = require('prop-types');
+var React = require('react');
 var ReactNative = require('react-native');
 var {
   ScrollView,
@@ -37,7 +37,7 @@ class RNTesterPage extends React.Component {
     var ContentWrapper;
     var wrapperProps = {};
     if (this.props.noScroll) {
-      ContentWrapper = (View: ReactClass<any>);
+      ContentWrapper = ((View: any): ReactClass<any>);
     } else {
       ContentWrapper = (ScrollView: ReactClass<any>);
       // $FlowFixMe found when converting React.createClass to ES6