Replace contextType with createContext for isInAParentText

.flowconfig

@@ -1,5 +1,5 @@
 [version]
-^0.63.0
+^0.78.0
 
 [ignore]
 <PROJECT_ROOT>/.*/__tests__/.*

package.json

@@ -46,7 +46,7 @@
     "eslint-config-prettier": "^2.9.0",
     "eslint-plugin-promise": "^3.7.0",
     "eslint-plugin-react": "^7.7.0",
-    "flow-bin": "^0.63.1",
+    "flow-bin": "^0.78.0",
     "glob": "^7.1.2",
     "husky": "^0.14.3",
     "jest": "^22.4.3",

packages/react-native-web/src/exports/Clipboard/index.js

@@ -14,6 +14,7 @@ export default class Clipboard {
   static isAvailable() {
     if (clipboardAvailable === undefined) {
       clipboardAvailable =
+        /* $FlowFixMe(<0.93.0) */
         typeof document.queryCommandSupported === 'function' &&
         document.queryCommandSupported('copy');
     }

packages/react-native-web/src/exports/Image/index.js

@@ -19,6 +19,7 @@ import ImageStylePropTypes from './ImageStylePropTypes';
 import ImageUriCache from './ImageUriCache';
 import StyleSheet from '../StyleSheet';
 import StyleSheetPropType from '../../modules/StyleSheetPropType';
+import TextAncestor from '../TextAncestor';
 import View from '../View';
 import ViewPropTypes from '../ViewPropTypes';
 import { bool, func, number, oneOf, shape } from 'prop-types';
@@ -96,10 +97,6 @@ type State = {
 class Image extends Component<*, State> {
   static displayName = 'Image';
 
-  static contextTypes = {
-    isInAParentText: bool
-  };
-
   static propTypes = {
     ...ViewPropTypes,
     blurRadius: number,
@@ -179,7 +176,7 @@ class Image extends Component<*, State> {
     this._isMounted = false;
   }
 
-  render() {
+  renderInner(hasTextAncestor) {
     const { shouldDisplaySource } = this.state;
     const {
       accessibilityLabel,
@@ -267,12 +264,7 @@ class Image extends Component<*, State> {
         accessibilityLabel={accessibilityLabel}
         accessible={accessible}
         onLayout={this._createLayoutHandler(finalResizeMode)}
-        style={[
-          styles.root,
-          this.context.isInAParentText && styles.inline,
-          imageSizeStyle,
-          flatStyle
-        ]}
+        style={[styles.root, hasTextAncestor && styles.inline, imageSizeStyle, flatStyle]}
         testID={testID}
       >
         <View
@@ -290,6 +282,12 @@ class Image extends Component<*, State> {
     );
   }
 
+  render() {
+    return createElement(TextAncestor.Consumer, null, hasTextAncestor => {
+      return this.renderInner(hasTextAncestor);
+    });
+  }
+
   _createImageLoader() {
     const { source } = this.props;
     this._destroyImageLoader();

packages/react-native-web/src/exports/Text/index.js

@@ -10,30 +10,18 @@
 
 import applyLayout from '../../modules/applyLayout';
 import applyNativeMethods from '../../modules/applyNativeMethods';
-import { bool } from 'prop-types';
 import { Component } from 'react';
 import createElement from '../createElement';
 import StyleSheet from '../StyleSheet';
+import TextAncestor from '../TextAncestor';
 import TextPropTypes from './TextPropTypes';
 
 class Text extends Component<*> {
   static displayName = 'Text';
 
   static propTypes = TextPropTypes;
 
-  static childContextTypes = {
-    isInAParentText: bool
-  };
-
-  static contextTypes = {
-    isInAParentText: bool
-  };
-
-  getChildContext() {
-    return { isInAParentText: true };
-  }
-
-  render() {
+  renderInner(isInAParentText) {
     const {
       dir,
       numberOfLines,
@@ -57,8 +45,6 @@ class Text extends Component<*> {
       ...otherProps
     } = this.props;
 
-    const { isInAParentText } = this.context;
-
     if (onPress) {
       otherProps.accessible = true;
       otherProps.onClick = this._createPressHandler(onPress);
@@ -69,7 +55,7 @@ class Text extends Component<*> {
     otherProps.dir = dir !== undefined ? dir : 'auto';
     otherProps.style = [
       styles.initial,
-      this.context.isInAParentText === true && styles.isInAParentText,
+      isInAParentText === true && styles.isInAParentText,
       style,
       selectable === false && styles.notSelectable,
       numberOfLines === 1 && styles.singleLineStyle,
@@ -81,6 +67,14 @@ class Text extends Component<*> {
     return createElement(component, otherProps);
   }
 
+  render() {
+    return createElement(TextAncestor.Consumer, null, hasTextAncestor => {
+      return hasTextAncestor
+        ? this.renderInner(hasTextAncestor)
+        : createElement(TextAncestor.Provider, { value: true }, this.renderInner(hasTextAncestor));
+    });
+  }
+
   _createEnterHandler(fn) {
     return e => {
       if (e.keyCode === 13) {

packages/react-native-web/src/exports/TextAncestor/index.js

@@ -0,0 +1,19 @@
+/**
+ * Copyright (c) 2015-present, Nicolas Gallagher.
+ * Copyright (c) 2015-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+import { createContext } from 'react';
+
+/**
+ * Whether the current element is the descendant of a <Text> element.
+ **/
+/* $FlowFixMe(>=0.85.0 site=react_native_fb) This comment suppresses an error
+ * found when Flow v0.85 was deployed. To see the error, delete this comment
+ * and run Flow. */
+export default createContext(false);

packages/react-native-web/src/exports/View/index.js

@@ -8,11 +8,11 @@
 
 import applyLayout from '../../modules/applyLayout';
 import applyNativeMethods from '../../modules/applyNativeMethods';
-import { bool } from 'prop-types';
 import createElement from '../createElement';
 import filterSupportedProps from './filterSupportedProps';
 import invariant from 'fbjs/lib/invariant';
 import StyleSheet from '../StyleSheet';
+import TextAncestor from '../TextAncestor';
 import ViewPropTypes, { type ViewProps } from './ViewPropTypes';
 import React, { Component } from 'react';
 
@@ -30,13 +30,9 @@ const calculateHitSlopStyle = hitSlop => {
 class View extends Component<ViewProps> {
   static displayName = 'View';
 
-  static contextTypes = {
-    isInAParentText: bool
-  };
-
   static propTypes = ViewPropTypes;
 
-  render() {
+  renderInner(hasTextAncestor) {
     const hitSlop = this.props.hitSlop;
     const supportedProps = filterSupportedProps(this.props);
 
@@ -49,11 +45,12 @@ class View extends Component<ViewProps> {
       });
     }
 
-    const { isInAParentText } = this.context;
-
     supportedProps.style = StyleSheet.compose(
       styles.initial,
-      StyleSheet.compose(isInAParentText && styles.inline, this.props.style)
+      StyleSheet.compose(
+        hasTextAncestor && styles.inline,
+        this.props.style
+      )
     );
 
     if (hitSlop) {
@@ -64,6 +61,12 @@ class View extends Component<ViewProps> {
 
     return createElement('div', supportedProps);
   }
+
+  render() {
+    return createElement(TextAncestor.Consumer, null, hasTextAncestor => {
+      return this.renderInner(hasTextAncestor);
+    });
+  }
 }
 
 const styles = StyleSheet.create({

packages/react-native-web/src/modules/normalizeNativeEvent/index.js

@@ -25,6 +25,7 @@ const normalizeTouches = touches => {
     return emptyArray;
   }
 
+  // $FlowFixMe
   return Array.prototype.slice.call(touches).map(touch => {
     const identifier = touch.identifier > 20 ? touch.identifier % 20 : touch.identifier;
     let rect;

yarn.lock

@@ -4678,9 +4678,10 @@ flatten@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/flatten/-/flatten-1.0.2.tgz#dae46a9d78fbe25292258cc1e780a41d95c03782"
 
-flow-bin@^0.63.1:
-  version "0.63.1"
-  resolved "https://registry.yarnpkg.com/flow-bin/-/flow-bin-0.63.1.tgz#ab00067c197169a5fb5b4996c8f6927b06694828"
+flow-bin@^0.78.0:
+  version "0.78.0"
+  resolved "https://registry.yarnpkg.com/flow-bin/-/flow-bin-0.78.0.tgz#df9fe7f9c9a2dfaff39083949fe2d831b41627b7"
+  integrity sha512-LV55tE+ItkC9HQAbEK+VxpBe54Ryp/dj4q9KmqDIfhV7mtP+hbvc/1AUf/AaWFIve3eURO0cxoGN4ZQQ3o2HTg==
 
 flow-parser@^0.*:
   version "0.76.0"