View.propTypes -> ViewPropTypes

fbshipit-source-id: 1073f21
expo · May 18, 2017 · cc2e593 · cc2e593
1 parent f1012f6
commit cc2e593
Show file tree

Hide file tree

Showing 4 changed files with 73 additions and 80 deletions.
diff --git a/src/ExNavigationBar.js b/src/ExNavigationBar.js
@@ -7,6 +7,7 @@ import {
   Text,
   TouchableOpacity,
   View,
+  ViewPropTypes,
 } from 'react-native';
 import PureComponent from './utils/PureComponent';
 import { unsupportedNativeView } from './ExUnsupportedNativeView';
@@ -179,7 +180,7 @@ export default class ExNavigationBar extends PureComponent {
     renderBackgroundComponent: PropTypes.func,
     barHeight: PropTypes.number.isRequired,
     statusBarHeight: PropTypes.number.isRequired,
-    style: View.propTypes.style,
+    style: ViewPropTypes.style,
   };
 
   constructor(props, context) {

diff --git a/src/navigation-experimental/NavigationCardStack.js b/src/navigation-experimental/NavigationCardStack.js
@@ -37,11 +37,16 @@ const NavigationCardStackStyleInterpolator = require('./NavigationCardStackStyle
 const NavigationPropTypes = require('./NavigationPropTypes');
 const NavigationTransitioner = require('./NavigationTransitioner');
 const React = require('react');
-const {NativeModules, StyleSheet, View} = require('react-native');
+const {
+  NativeModules,
+  StyleSheet,
+  View,
+  ViewPropTypes,
+} = require('react-native');
 
-const {NativeAnimatedModule} = NativeModules;
-const {PropTypes} = React;
-const {Directions} = NavigationCardStackPanResponder;
+const { NativeAnimatedModule } = NativeModules;
+const { PropTypes } = React;
+const { Directions } = NavigationCardStackPanResponder;
 
 import type {
   NavigationState,
@@ -125,8 +130,8 @@ type DefaultProps = {
  * ```
  */
 class NavigationCardStack extends React.Component<DefaultProps, Props, void> {
-  _render : NavigationSceneRenderer;
-  _renderScene : NavigationSceneRenderer;
+  _render: NavigationSceneRenderer;
+  _renderScene: NavigationSceneRenderer;
 
   static propTypes = {
     /**
@@ -200,12 +205,12 @@ class NavigationCardStack extends React.Component<DefaultProps, Props, void> {
     /**
      * Custom style applied to the cards stack.
      */
-    style: View.propTypes.style,
+    style: ViewPropTypes.style,
 
     /**
      * Custom style applied to the scenes stack.
      */
-    scenesStyle: View.propTypes.style,
+    scenesStyle: ViewPropTypes.style,
   };
 
   static defaultProps: DefaultProps = {
@@ -237,38 +242,33 @@ class NavigationCardStack extends React.Component<DefaultProps, Props, void> {
     const isVertical = this.props.direction === 'vertical';
     const animationConfig = {};
     if (
-      !!NativeAnimatedModule
-
+      !!NativeAnimatedModule &&
       // Gestures do not work with the current iteration of native animation
       // driving. When gestures are disabled, we can drive natively.
-      && !this.props.enableGestures
-
+      !this.props.enableGestures &&
       // Native animation support also depends on the transforms used:
-      && NavigationCardStackStyleInterpolator.canUseNativeDriver(isVertical)
+      NavigationCardStackStyleInterpolator.canUseNativeDriver(isVertical)
     ) {
       animationConfig.useNativeDriver = true;
     }
     return animationConfig;
-  }
+  };
 
   _render(props: NavigationTransitionProps): React.Element<any> {
-    const {
-      renderHeader,
-    } = this.props;
+    const { renderHeader } = this.props;
 
     const header = renderHeader ? <View>{renderHeader(props)}</View> : null;
 
-    const scenes = props.scenes.map(
-     scene => this._renderScene({
-       ...props,
-       scene,
-     })
+    const scenes = props.scenes.map(scene =>
+      this._renderScene({
+        ...props,
+        scene,
+      })
     );
 
     return (
       <View style={styles.container}>
-        <View
-          style={[styles.scenes, this.props.scenesStyle]}>
+        <View style={[styles.scenes, this.props.scenesStyle]}>
           {scenes}
         </View>
         {header}
@@ -279,9 +279,11 @@ class NavigationCardStack extends React.Component<DefaultProps, Props, void> {
   _renderScene(props: NavigationSceneRendererProps): React.Element<any> {
     const isVertical = this.props.direction === 'vertical';
 
-    const interpolator = this.props.cardStyleInterpolator || (isVertical ?
-      NavigationCardStackStyleInterpolator.forVertical :
-      NavigationCardStackStyleInterpolator.forHorizontal);
+    const interpolator =
+      this.props.cardStyleInterpolator ||
+      (isVertical
+        ? NavigationCardStackStyleInterpolator.forVertical
+        : NavigationCardStackStyleInterpolator.forHorizontal);
 
     const style = interpolator(props);
 
@@ -293,9 +295,9 @@ class NavigationCardStack extends React.Component<DefaultProps, Props, void> {
         onNavigateBack: this.props.onNavigateBack,
         gestureResponseDistance: this.props.gestureResponseDistance,
       };
-      panHandlers = isVertical ?
-        NavigationCardStackPanResponder.forVertical(panHandlersProps) :
-        NavigationCardStackPanResponder.forHorizontal(panHandlersProps);
+      panHandlers = isVertical
+        ? NavigationCardStackPanResponder.forVertical(panHandlersProps)
+        : NavigationCardStackPanResponder.forHorizontal(panHandlersProps);
     }
 
     return (

diff --git a/src/navigation-experimental/NavigationHeader.js b/src/navigation-experimental/NavigationHeader.js
@@ -45,9 +45,10 @@ const {
   StyleSheet,
   TVEventHandler,
   View,
+  ViewPropTypes,
 } = ReactNative;
 
-import type  {
+import type {
   NavigationSceneRendererProps,
   NavigationStyleInterpolator,
 } from './NavigationTypeDefinition';
@@ -79,13 +80,12 @@ type SubViewName = 'left' | 'title' | 'right';
 
 const APPBAR_HEIGHT = Platform.OS === 'ios' ? 44 : 56;
 const STATUSBAR_HEIGHT = Platform.OS === 'ios' ? 20 : 0;
-const {PropTypes} = React;
+const { PropTypes } = React;
 
 class NavigationHeader extends React.Component<DefaultProps, Props, any> {
   props: Props;
 
   static defaultProps = {
-
     renderTitleComponent: (props: SubViewProps) => {
       const title = String(props.scene.route.title || '');
       return <NavigationHeaderTitle>{title}</NavigationHeaderTitle>;
@@ -95,11 +95,7 @@ class NavigationHeader extends React.Component<DefaultProps, Props, any> {
       if (props.scene.index === 0 || !props.onNavigateBack) {
         return null;
       }
-      return (
-        <NavigationHeaderBackButton
-          onPress={props.onNavigateBack}
-        />
-      );
+      return <NavigationHeaderBackButton onPress={props.onNavigateBack} />;
     },
 
     renderRightComponent: (props: SubViewProps) => {
@@ -115,9 +111,9 @@ class NavigationHeader extends React.Component<DefaultProps, Props, any> {
     renderLeftComponent: PropTypes.func,
     renderRightComponent: PropTypes.func,
     renderTitleComponent: PropTypes.func,
-    style: View.propTypes.style,
+    style: ViewPropTypes.style,
     statusBarHeight: PropTypes.number,
-    viewProps: PropTypes.shape(View.propTypes),
+    viewProps: PropTypes.shape(ViewPropTypes),
   };
 
   shouldComponentUpdate(nextProps: Props, nextState: any): boolean {
@@ -155,18 +151,17 @@ class NavigationHeader extends React.Component<DefaultProps, Props, any> {
       return props;
     });
 
-    const barHeight = (this.props.statusBarHeight instanceof Animated.Value)
-      ? Animated.add(this.props.statusBarHeight, new Animated.Value(APPBAR_HEIGHT))
+    const barHeight = this.props.statusBarHeight instanceof Animated.Value
+      ? Animated.add(
+          this.props.statusBarHeight,
+          new Animated.Value(APPBAR_HEIGHT)
+        )
       : APPBAR_HEIGHT + this.props.statusBarHeight;
 
     return (
-      <Animated.View style={[
-          styles.appbar,
-          { height: barHeight },
-          style
-        ]}
-        {...viewProps}
-      >
+      <Animated.View
+        style={[styles.appbar, { height: barHeight }, style]}
+        {...viewProps}>
         {scenesProps.map(this._renderLeft, this)}
         {scenesProps.map(this._renderTitle, this)}
         {scenesProps.map(this._renderRight, this)}
@@ -179,7 +174,7 @@ class NavigationHeader extends React.Component<DefaultProps, Props, any> {
       props,
       'left',
       this.props.renderLeftComponent,
-      NavigationHeaderStyleInterpolator.forLeft,
+      NavigationHeaderStyleInterpolator.forLeft
     );
   };
 
@@ -188,7 +183,7 @@ class NavigationHeader extends React.Component<DefaultProps, Props, any> {
       props,
       'title',
       this.props.renderTitleComponent,
-      NavigationHeaderStyleInterpolator.forCenter,
+      NavigationHeaderStyleInterpolator.forCenter
     );
   };
 
@@ -197,26 +192,19 @@ class NavigationHeader extends React.Component<DefaultProps, Props, any> {
       props,
       'right',
       this.props.renderRightComponent,
-      NavigationHeaderStyleInterpolator.forRight,
+      NavigationHeaderStyleInterpolator.forRight
     );
   };
 
   _renderSubView(
     props: NavigationSceneRendererProps,
     name: SubViewName,
     renderer: SubViewRenderer,
-    styleInterpolator: NavigationStyleInterpolator,
+    styleInterpolator: NavigationStyleInterpolator
   ): ?React.Element<any> {
-    const {
-      scene,
-      navigationState,
-    } = props;
+    const { scene, navigationState } = props;
 
-    const {
-      index,
-      isStale,
-      key,
-    } = scene;
+    const { index, isStale, key } = scene;
 
     const offset = navigationState.index - index;
 
@@ -226,7 +214,10 @@ class NavigationHeader extends React.Component<DefaultProps, Props, any> {
       return null;
     }
 
-    const subViewProps = {...props, onNavigateBack: this.props.onNavigateBack};
+    const subViewProps = {
+      ...props,
+      onNavigateBack: this.props.onNavigateBack,
+    };
     const subView = renderer(subViewProps);
     if (subView === null) {
       return null;
@@ -250,7 +241,6 @@ class NavigationHeader extends React.Component<DefaultProps, Props, any> {
   static HEIGHT = APPBAR_HEIGHT + STATUSBAR_HEIGHT;
   static Title = NavigationHeaderTitle;
   static BackButton = NavigationHeaderBackButton;
-
 }
 
 const styles = StyleSheet.create({

diff --git a/src/navigation-experimental/NavigationHeaderTitle.js b/src/navigation-experimental/NavigationHeaderTitle.js
@@ -34,23 +34,23 @@
 const React = require('react');
 const ReactNative = require('react-native');
 
-const {
-  Platform,
-  StyleSheet,
-  View,
-  Text,
-} = ReactNative;
+const { Platform, StyleSheet, View, Text, ViewPropTypes } = ReactNative;
 
 type Props = {
   children?: React.Element<any>,
   style?: any,
   textStyle?: any,
   viewProps?: any,
-}
+};
 
-const NavigationHeaderTitle = ({ children, style, textStyle, viewProps }: Props) => (
-  <View style={[ styles.title, style ]} {...viewProps}>
-    <Text style={[ styles.titleText, textStyle ]}>{children}</Text>
+const NavigationHeaderTitle = ({
+  children,
+  style,
+  textStyle,
+  viewProps,
+}: Props) => (
+  <View style={[styles.title, style]} {...viewProps}>
+    <Text style={[styles.titleText, textStyle]}>{children}</Text>
   </View>
 );
 
@@ -59,22 +59,22 @@ const styles = StyleSheet.create({
     flex: 1,
     flexDirection: 'row',
     alignItems: 'center',
-    marginHorizontal: 16
+    marginHorizontal: 16,
   },
 
   titleText: {
     flex: 1,
     fontSize: 18,
     fontWeight: '500',
     color: 'rgba(0, 0, 0, .9)',
-    textAlign: Platform.OS === 'ios' ? 'center' : 'left'
-  }
+    textAlign: Platform.OS === 'ios' ? 'center' : 'left',
+  },
 });
 
 NavigationHeaderTitle.propTypes = {
   children: React.PropTypes.node.isRequired,
-  style: View.propTypes.style,
-  textStyle: Text.propTypes.style
+  style: ViewPropTypes.style,
+  textStyle: Text.propTypes.style,
 };
 
 module.exports = NavigationHeaderTitle;