More react 16 compatible

Libraries/ActivityIndicator/ActivityIndicator.web.js

@@ -9,7 +9,8 @@
  */
 'use strict';
 
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import View from 'ReactView';
 import StyleSheet from 'ReactStyleSheet';
 import assign from 'domkit/appendVendorPrefix';

Libraries/Animated/Animated.web.js

@@ -11,7 +11,7 @@
 'use strict';
 
 import Animated from 'animated';
-import CSSPropertyOperations from 'react-dom/lib/CSSPropertyOperations';
+import setValueForStyles from '../Utilties/setValueForStyles.web';
 
 import flattenStyle from 'ReactFlattenStyle';
 import Image from 'ReactImage';
@@ -40,7 +40,7 @@ function ApplyAnimatedValues(instance, props) {
   if (instance.setNativeProps) {
     instance.setNativeProps(props);
   } else if (instance.nodeType && instance.setAttribute !== undefined) {
-    CSSPropertyOperations.setValueForStyles(instance, mapStyle(props.style));
+    setValueForStyles(instance, mapStyle(props.style));
   } else {
     return false;
   }

Libraries/DrawerLayout/DrawerLayout.web.js

@@ -6,7 +6,8 @@
  */
 'use strict';
 
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import StyleSheet from 'ReactStyleSheet';
 import View from 'ReactView';
 import Animated from 'ReactAnimated';

Libraries/Image/Image.web.js

@@ -6,7 +6,8 @@
  */
 'use strict';
 
-import React, {Component, PropTypes} from 'react';
+import React, {Component} from 'react';
+import PropTypes from 'prop-types';
 import View from 'ReactView';
 import { Mixin as LayoutMixin } from 'ReactLayoutMixin';
 import ImageResizeMode from './ImageResizeMode';
@@ -34,7 +35,7 @@ class Image extends Component {
   }
 
   static contextTypes = {
-    isInAParentText: React.PropTypes.bool
+    isInAParentText: PropTypes.bool
   }
 
   static getSize = function(

Libraries/ListView/ListView.web.js

@@ -8,7 +8,8 @@
  */
 'use strict';
 
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import ReactDOM from 'react-dom';
 import ListViewDataSource from 'ReactListViewDataSource';
 import ScrollView from 'ReactScrollView';
@@ -159,12 +160,12 @@ class ListView extends Component {
      * A function that returns the scrollable component in which the list rows
      * are rendered. Defaults to returning a ScrollView with the given props.
      */
-    renderScrollComponent: React.PropTypes.func.isRequired,
+    renderScrollComponent: PropTypes.func.isRequired,
     /**
      * How early to start rendering rows before they come on screen, in
      * pixels.
      */
-    scrollRenderAheadDistance: React.PropTypes.number,
+    scrollRenderAheadDistance: PropTypes.number,
     /**
      * (visibleRows, changedRows) => void
      *
@@ -174,13 +175,13 @@ class ListView extends Component {
      * that have changed their visibility, with true indicating visible, and
      * false indicating the view has moved out of view.
      */
-    onChangeVisibleRows: React.PropTypes.func,
+    onChangeVisibleRows: PropTypes.func,
     /**
      * A performance optimization for improving scroll perf of
      * large lists, used in conjunction with overflow: 'hidden' on the row
      * containers.  This is enabled by default.
      */
-    removeClippedSubviews: React.PropTypes.bool,
+    removeClippedSubviews: PropTypes.bool,
     /**
      * An array of child indices determining which children get docked to the
      * top of the screen when scrolling. For example, passing

Libraries/ListView/StaticRenderer.web.js

@@ -6,7 +6,8 @@
  */
 'use strict';
 
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 
 class StaticRenderer extends Component {
   static propTypes = {

Libraries/Modal/Modal.web.js

@@ -6,7 +6,8 @@
  */
 'use strict';
 
-import React, { PropTypes, Component } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import StyleSheet from 'ReactStyleSheet';
 import View from 'ReactView';
 

Libraries/Navigator/Navigator.web.js

@@ -9,7 +9,8 @@
  /* eslint-disable no-extra-boolean-cast*/
 'use strict';
 
-import React, { PropTypes } from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import Dimensions from 'ReactDimensions';
 import InteractionMixin from 'ReactInteractionMixin';
 import Map from 'core-js/library/fn/map';

Libraries/Navigator/NavigatorBreadcrumbNavigationBar.js

@@ -9,7 +9,8 @@
  */
 'use strict';
 
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import NavigatorBreadcrumbNavigationBarStyles from 'ReactNavigatorBreadcrumbNavigationBarStyles';
 import NavigatorNavigationBarStylesAndroid from 'ReactNavigatorNavigationBarStylesAndroid';
 import NavigatorNavigationBarStylesIOS from 'ReactNavigatorNavigationBarStylesIOS';
@@ -70,9 +71,9 @@ class NavigatorBreadcrumbNavigationBar extends Component {
       titleContentForRoute: PropTypes.func,
       iconForRoute: PropTypes.func,
     }),
-    navState: React.PropTypes.shape({
-      routeStack: React.PropTypes.arrayOf(React.PropTypes.object),
-      presentedIndex: React.PropTypes.number,
+    navState: PropTypes.shape({
+      routeStack: PropTypes.arrayOf(PropTypes.object),
+      presentedIndex: PropTypes.number,
     }),
     style: View.propTypes.style,
   }

Libraries/Navigator/NavigatorNavigationBar.js

@@ -9,7 +9,8 @@
  */
 'use strict';
 
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import NavigatorNavigationBarStylesAndroid from 'ReactNavigatorNavigationBarStylesAndroid';
 import NavigatorNavigationBarStylesIOS from 'ReactNavigatorNavigationBarStylesIOS';
 import Platform from 'ReactStyleSheet';

Libraries/Picker/Picker.web.js

@@ -6,7 +6,8 @@
  */
 'use strict';
 
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import autobind from 'autobind-decorator';
 
 const PICKER = 'picker';

Libraries/ScrollView/ScrollView.web.js

@@ -8,7 +8,8 @@
  */
 'use strict';
 
-import React, { PropTypes, Component} from 'react';
+import React, { Component} from 'react';
+import PropTypes from 'prop-types';
 import ReactDOM from 'react-dom';
 import ScrollResponder from 'ReactScrollResponder';
 import StyleSheet from 'ReactStyleSheet';

Libraries/SegmentedControl/SegmentedControl.web.js

@@ -8,7 +8,8 @@
  */
 'use strict';
 
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import View from 'ReactView';
 import Text from 'ReactText';
 import StyleSheet from 'ReactStyleSheet';

Libraries/Slider/Slider.web.js

@@ -9,7 +9,8 @@
  */
 'use strict';
 
-import React, { PropTypes, Component } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import ReactDOM from 'react-dom';
 import StyleSheet from 'ReactStyleSheet';
 import View from 'ReactView';

Libraries/Switch/Switch.web.js

@@ -6,7 +6,8 @@
  */
 'use strict';
 
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { Mixin as NativeMethodsMixin } from 'NativeMethodsMixin';
 import StyleSheet from 'ReactStyleSheet';
 import mixin from 'react-mixin';

Libraries/TabBar/TabBar.web.js

@@ -7,6 +7,7 @@
 'use strict';
 
 import React from 'react';
+import PropTypes from 'prop-types';
 import View from 'ReactView';
 import TabBarItem from './TabBarItem.web';
 import TabBarContents from './TabBarContents.web';
@@ -25,17 +26,17 @@ let TabBar = React.createClass({
   },
 
   propTypes: {
-    style: React.PropTypes.object,
+    style: PropTypes.object,
     /**
      * Color of the currently selected tab icon
      */
-    tintColor: React.PropTypes.string,
+    tintColor: PropTypes.string,
     /**
      * Background color of the tab bar
      */
-    barTintColor: React.PropTypes.string,
+    barTintColor: PropTypes.string,
 
-    clientHeight: React.PropTypes.number
+    clientHeight: PropTypes.number
   },
 
   getStyles() {

Libraries/TabBar/TabBarItem.web.js

@@ -5,7 +5,8 @@
  */
 'use strict';
 
-import React, { PropTypes } from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import Image from 'ReactImage';
 import Text from 'ReactText';
 import View from 'ReactView';

Libraries/Text/Text.web.js

@@ -9,6 +9,7 @@
 'use strict';
 
 import React from 'react';
+import PropTypes from 'prop-types';
 import { Mixin as TouchableMixin } from 'ReactTouchable';
 import { Mixin as LayoutMixin } from 'ReactLayoutMixin';
 import { Mixin as NativeMethodsMixin } from 'NativeMethodsMixin';
@@ -56,31 +57,31 @@ let Text = React.createClass({
      * layout, including line wrapping, such that the total number of lines
      * does not exceed this number.
      */
-    numberOfLines: React.PropTypes.number,
+    numberOfLines: PropTypes.number,
     /**
      * Invoked on mount and layout changes with
      *
      *   `{nativeEvent: {layout: {x, y, width, height}}}`
      */
-    onLayout: React.PropTypes.func,
+    onLayout: PropTypes.func,
     /**
      * This function is called on press.
      */
-    onPress: React.PropTypes.func,
+    onPress: PropTypes.func,
     /**
      * When true, no visual change is made when text is pressed down. By
      * default, a gray oval highlights the text on press down.
      * @platform ios
      */
-    suppressHighlighting: React.PropTypes.bool,
+    suppressHighlighting: PropTypes.bool,
     /**
      * Used to locate this view in end-to-end tests.
      */
-    testID: React.PropTypes.string,
+    testID: PropTypes.string,
     /**
      * Specifies should fonts scale to respect Text Size accessibility setting on iOS.
      */
-    allowFontScaling: React.PropTypes.bool,
+    allowFontScaling: PropTypes.bool,
   },
 
   getInitialState(): Object {
@@ -177,11 +178,11 @@ let Text = React.createClass({
   },
 
   contextTypes: {
-    isInAParentText: React.PropTypes.bool
+    isInAParentText: PropTypes.bool
   },
 
   childContextTypes: {
-    isInAParentText: React.PropTypes.bool
+    isInAParentText: PropTypes.bool
   },
 
   render() {

Libraries/TextInput/TextInput.web.js

@@ -8,7 +8,8 @@
  */
 'use strict';
 
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import ReactDOM from 'react-dom';
 import View from 'ReactView';
 import autobind from 'autobind-decorator';

Libraries/Touchable/TouchableBounce.web.js

@@ -10,6 +10,7 @@
 
 import Animated from 'ReactAnimated';
 import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import { Mixin as TouchableMixin } from 'ReactTouchable';
 import mixin from 'react-mixin';
 import autobind from 'autobind-decorator';
@@ -36,15 +37,15 @@ var PRESS_RECT_OFFSET = {top: 20, left: 20, right: 20, bottom: 30};
 class TouchableBounce extends Component {
 
   static propTypes = {
-    onPress: React.PropTypes.func,
-    onPressIn: React.PropTypes.func,
-    onPressOut: React.PropTypes.func,
+    onPress: PropTypes.func,
+    onPressIn: PropTypes.func,
+    onPressOut: PropTypes.func,
     // The function passed takes a callback to start the animation which should
     // be run after this onPress handler is done. You can use this (for example)
     // to update UI before starting the animation.
-    onPressWithCompletion: React.PropTypes.func,
+    onPressWithCompletion: PropTypes.func,
     // the function passed is called after the animation is complete
-    onPressAnimationComplete: React.PropTypes.func,
+    onPressAnimationComplete: PropTypes.func,
   }
 
   state = {

Libraries/Touchable/TouchableHighlight.web.js

@@ -9,6 +9,7 @@
 'use strict';
 
 import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import View from 'ReactView';
 import TimerMixin from 'react-timer-mixin';
 import TouchableWithoutFeedback from 'ReactTouchableWithoutFeedback';
@@ -51,20 +52,20 @@ class TouchableHighlight extends Component {
      * Determines what the opacity of the wrapped view should be when touch is
      * active.
      */
-    activeOpacity: React.PropTypes.number,
+    activeOpacity: PropTypes.number,
     /**
      * The color of the underlay that will show through when the touch is
      * active.
      */
-    underlayColor: React.PropTypes.string,
+    underlayColor: PropTypes.string,
     /**
      * Called immediately after the underlay is shown
      */
-    onShowUnderlay: React.PropTypes.func,
+    onShowUnderlay: PropTypes.func,
     /**
      * Called immediately after the underlay is hidden
      */
-    onHideUnderlay: React.PropTypes.func,
+    onHideUnderlay: PropTypes.func,
   }
 
   static defaultProps = DEFAULT_PROPS

Libraries/Touchable/TouchableOpacity.web.js

@@ -10,6 +10,7 @@
 
 import Animated from 'ReactAnimated';
 import React from 'react';
+import PropTypes from 'prop-types';
 import TimerMixin from 'react-timer-mixin';
 import { Mixin as TouchableMixin } from 'ReactTouchable';
 import TouchableWithoutFeedback from 'ReactTouchableWithoutFeedback';
@@ -60,7 +61,7 @@ class TouchableOpacity extends React.Component {
      * Determines what the opacity of the wrapped view should be when touch is
      * active.
      */
-    activeOpacity: React.PropTypes.number,
+    activeOpacity: PropTypes.number,
   };
 
   static defaultProps = DEFAULT_PROPS;