@office-iss/react-native-win32 0.66.4 → 0.66.5

package/.flowconfig

@@ -26,6 +26,8 @@
 <PROJECT_ROOT>/Libraries/Pressability/Pressability.js
 <PROJECT_ROOT>/Libraries/Pressability/HoverState.js
 <PROJECT_ROOT>/Libraries/StyleSheet/StyleSheet.js
+<PROJECT_ROOT>/Libraries/Text/Text.js
+<PROJECT_ROOT>/Libraries/Text/TextNativeComponent.js
 <PROJECT_ROOT>/Libraries/Types/CoreEventTypes.js
 <PROJECT_ROOT>/Libraries/Utilities/DeviceInfo.js
 <PROJECT_ROOT>/Libraries/Utilities/Dimensions.js

package/CHANGELOG.json

@@ -2,7 +2,22 @@
   "name": "@office-iss/react-native-win32",
   "entries": [
     {
-      "date": "Mon, 24 Jan 2022 16:10:41 GMT",
+      "date": "Mon, 21 Feb 2022 16:09:24 GMT",
+      "tag": "@office-iss/react-native-win32_v0.66.5",
+      "version": "0.66.5",
+      "comments": {
+        "patch": [
+          {
+            "comment": "forward isPressble to native text component",
+            "author": "30809111+acoates-ms@users.noreply.github.com",
+            "commit": "12e82b184f7f78aa1fcfbe3dd700daef70257356",
+            "package": "@office-iss/react-native-win32"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Mon, 24 Jan 2022 16:11:33 GMT",
       "tag": "@office-iss/react-native-win32_v0.66.4",
       "version": "0.66.4",
       "comments": {

package/CHANGELOG.md

@@ -1,17 +1,25 @@
 # Change Log - @office-iss/react-native-win32
 
-This log was last generated on Mon, 24 Jan 2022 16:10:41 GMT and should not be manually modified.
+This log was last generated on Mon, 21 Feb 2022 16:09:24 GMT and should not be manually modified.
 
 <!-- Start content -->
 
-## 0.66.4
+## 0.66.5
 
-Mon, 24 Jan 2022 16:10:41 GMT
+Mon, 21 Feb 2022 16:09:24 GMT
 
 ### Patches
 
-- Promote 0.66 to legacy (ngerlem@microsoft.com)
+- forward isPressble to native text component (30809111+acoates-ms@users.noreply.github.com)
 
+## 0.66.4
+
+Mon, 24 Jan 2022 16:11:33 GMT
+
+### Patches
+
+- Promote 0.66 to legacy (ngerlem@microsoft.com)
+
 ## 0.66.3
 
 Mon, 17 Jan 2022 16:12:35 GMT

package/Libraries/Text/Text.win32.js

@@ -0,0 +1,214 @@
+/**
+ * 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.
+ *
+ * @flow strict-local
+ * @format
+ */
+
+import DeprecatedTextPropTypes from '../DeprecatedPropTypes/DeprecatedTextPropTypes';
+import * as PressabilityDebug from '../Pressability/PressabilityDebug';
+import usePressability from '../Pressability/usePressability';
+import StyleSheet from '../StyleSheet/StyleSheet';
+import processColor from '../StyleSheet/processColor';
+import TextAncestor from './TextAncestor';
+import {NativeText, NativeVirtualText} from './TextNativeComponent';
+import {type TextProps} from './TextProps';
+import * as React from 'react';
+import {useContext, useMemo, useState} from 'react';
+import invariant from 'invariant';
+
+/**
+ * Text is the fundamental component for displaying text.
+ *
+ * @see https://reactnative.dev/docs/text.html
+ */
+const Text: React.AbstractComponent<
+  TextProps,
+  React.ElementRef<typeof NativeText | typeof NativeVirtualText>,
+> = React.forwardRef((props: TextProps, forwardedRef) => {
+  const {
+    accessible,
+    allowFontScaling,
+    ellipsizeMode,
+    onLongPress,
+    onPress,
+    onPressIn,
+    onPressOut,
+    onResponderGrant,
+    onResponderMove,
+    onResponderRelease,
+    onResponderTerminate,
+    onResponderTerminationRequest,
+    onStartShouldSetResponder,
+    pressRetentionOffset,
+    suppressHighlighting,
+    ...restProps
+  } = props;
+
+  const [isHighlighted, setHighlighted] = useState(false);
+
+  const isPressable =
+    (onPress != null ||
+      onLongPress != null ||
+      onStartShouldSetResponder != null) &&
+    restProps.disabled !== true;
+
+  const initialized = useLazyInitialization(isPressable);
+  const config = useMemo(
+    () =>
+      initialized
+        ? {
+            disabled: !isPressable,
+            pressRectOffset: pressRetentionOffset,
+            onLongPress,
+            onPress,
+            onPressIn(event) {
+              setHighlighted(!suppressHighlighting);
+              onPressIn?.(event);
+            },
+            onPressOut(event) {
+              setHighlighted(false);
+              onPressOut?.(event);
+            },
+            onResponderTerminationRequest_DEPRECATED: onResponderTerminationRequest,
+            onStartShouldSetResponder_DEPRECATED: onStartShouldSetResponder,
+          }
+        : null,
+    [
+      initialized,
+      isPressable,
+      pressRetentionOffset,
+      onLongPress,
+      onPress,
+      onPressIn,
+      onPressOut,
+      onResponderTerminationRequest,
+      onStartShouldSetResponder,
+      suppressHighlighting,
+    ],
+  );
+
+  const eventHandlers = usePressability(config);
+  const eventHandlersForText = useMemo(
+    () =>
+      eventHandlers == null
+        ? null
+        : {
+            onResponderGrant(event) {
+              eventHandlers.onResponderGrant(event);
+              if (onResponderGrant != null) {
+                onResponderGrant(event);
+              }
+            },
+            onResponderMove(event) {
+              eventHandlers.onResponderMove(event);
+              if (onResponderMove != null) {
+                onResponderMove(event);
+              }
+            },
+            onResponderRelease(event) {
+              eventHandlers.onResponderRelease(event);
+              if (onResponderRelease != null) {
+                onResponderRelease(event);
+              }
+            },
+            onResponderTerminate(event) {
+              eventHandlers.onResponderTerminate(event);
+              if (onResponderTerminate != null) {
+                onResponderTerminate(event);
+              }
+            },
+            onResponderTerminationRequest:
+              eventHandlers.onResponderTerminationRequest,
+            onStartShouldSetResponder: eventHandlers.onStartShouldSetResponder,
+          },
+    [
+      eventHandlers,
+      onResponderGrant,
+      onResponderMove,
+      onResponderRelease,
+      onResponderTerminate,
+    ],
+  );
+
+  // TODO: Move this processing to the view configuration.
+  const selectionColor =
+    restProps.selectionColor == null
+      ? null
+      : processColor(restProps.selectionColor);
+
+  let style = restProps.style;
+  if (__DEV__) {
+    if (PressabilityDebug.isEnabled() && onPress != null) {
+      style = StyleSheet.compose(restProps.style, {
+        color: 'magenta',
+      });
+    }
+  }
+
+  let numberOfLines = restProps.numberOfLines;
+  if (numberOfLines != null && !(numberOfLines >= 0)) {
+    console.error(
+      `'numberOfLines' in <Text> must be a non-negative number, received: ${numberOfLines}. The value will be set to 0.`,
+    );
+    numberOfLines = 0;
+  }
+
+  const hasTextAncestor = useContext(TextAncestor);
+
+  return hasTextAncestor ? (
+    <NativeVirtualText
+      {...restProps}
+      {...eventHandlersForText}
+      isHighlighted={isHighlighted}
+      isPressable={isPressable} // This was added upstream in https://github.com/facebook/react-native/commit/f3bf2e4f51897f1bb71e37002c288ebf3b23cf78
+      numberOfLines={numberOfLines}
+      selectionColor={selectionColor}
+      style={style}
+      ref={forwardedRef}
+    />
+  ) : (
+    <TextAncestor.Provider value={true}>
+      <NativeText
+        {...restProps}
+        {...eventHandlersForText}
+        accessible={accessible !== false}
+        allowFontScaling={allowFontScaling !== false}
+        ellipsizeMode={ellipsizeMode ?? 'tail'}
+        isHighlighted={isHighlighted}
+        isPressable={isPressable} // [Win32] - We use this to optimize text hit testing
+        numberOfLines={numberOfLines}
+        selectionColor={selectionColor}
+        style={style}
+        ref={forwardedRef}
+      />
+    </TextAncestor.Provider>
+  );
+});
+
+Text.displayName = 'Text';
+
+// TODO: Delete this.
+Text.propTypes = DeprecatedTextPropTypes;
+
+/**
+ * Returns false until the first time `newValue` is true, after which this will
+ * always return true. This is necessary to lazily initialize `Pressability` so
+ * we do not eagerly create one for every pressable `Text` component.
+ */
+function useLazyInitialization(newValue: boolean): boolean {
+  const [oldValue, setValue] = useState(newValue);
+  if (!oldValue && newValue) {
+    setValue(newValue);
+  }
+  return oldValue;
+}
+
+// $FlowFixMe[incompatible-cast] - No good way to type a React.AbstractComponent with statics.
+module.exports = (Text: typeof Text &
+  $ReadOnly<{
+    propTypes: typeof DeprecatedTextPropTypes,
+  }>);

package/Libraries/Text/TextNativeComponent.win32.js

@@ -1,3 +1,13 @@
+/**
+ * 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.
+ *
+ * @flow
+ * @format
+ */
+
 import ReactNativeViewAttributes from '../Components/View/ReactNativeViewAttributes';
 import UIManager from '../ReactNative/UIManager';
 import {type HostComponent} from '../Renderer/shims/ReactNativeTypes';
@@ -9,6 +19,10 @@ type NativeTextProps = $ReadOnly<{
   ...TextProps,
   isHighlighted?: ?boolean,
   selectionColor?: ?ProcessedColorValue,
+  // This is only needed for platforms that optimize text hit testing, e.g.,
+  // react-native-windows. It can be used to only hit test virtual text spans
+  // that have pressable events attached to them.
+  isPressable?: ?boolean,
 }>;
 
 export const NativeText: HostComponent<NativeTextProps> = (createReactNativeComponentClass(
@@ -18,6 +32,7 @@ export const NativeText: HostComponent<NativeTextProps> = (createReactNativeComp
     validAttributes: {
       ...ReactNativeViewAttributes.UIView,
       isHighlighted: true,
+      isPressable: true,
       numberOfLines: true,
       ellipsizeMode: true,
       allowFontScaling: true,
@@ -53,14 +68,14 @@ export const NativeText: HostComponent<NativeTextProps> = (createReactNativeComp
 ): any);
 
 export const NativeVirtualText: HostComponent<NativeTextProps> =
-  !global.RN$Bridgeless &&
-  UIManager.getViewManagerConfig('RCTVirtualText') == null
+  !global.RN$Bridgeless && !UIManager.hasViewManagerConfig('RCTVirtualText')
     ? NativeText
     : (createReactNativeComponentClass('RCTVirtualText', () => ({
         // $FlowFixMe[incompatible-call]
         validAttributes: {
           ...ReactNativeViewAttributes.UIView,
           isHighlighted: true,
+          isPressable: true,
           maxFontSizeMultiplier: true,
         },
         uiViewClassName: 'RCTVirtualText',

package/overrides.json

@@ -445,7 +445,14 @@
       "baseHash": "afe4fc1e9aa91d08a7a1098e3bbd3b17a73b4a65"
     },
     {
-      "type": "derived",
+      "type": "patch",
+      "file": "src/Libraries/Text/Text.win32.js",
+      "baseFile": "Libraries/Text/Text.js",
+      "baseHash": "8b90eb090dcfed88a40a38bbb51cbbd1e0d9ca9e",
+      "issue": 7074
+    },
+    {
+      "type": "patch",
       "file": "src/Libraries/Text/TextNativeComponent.win32.js",
       "baseFile": "Libraries/Text/TextNativeComponent.js",
       "baseHash": "1a196691fb0e9b656c348b7d42427c1c6163c9bb",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@office-iss/react-native-win32",
-  "version": "0.66.4",
+  "version": "0.66.5",
   "description": "Implementation of react native on top of Office's Win32 platform.",
   "license": "MIT",
   "main": "./index.win32.js",