@office-iss/react-native-win32 0.0.0-canary.284 → 0.0.0-canary.286

package/Libraries/Components/Touchable/Touchable.js

@@ -10,7 +10,7 @@
 
 import type {EdgeInsetsProp} from '../../StyleSheet/EdgeInsetsPropType';
 import type {ColorValue} from '../../StyleSheet/StyleSheet';
-import type {PressEvent} from '../../Types/CoreEventTypes';
+import type {GestureResponderEvent} from '../../Types/CoreEventTypes';
 
 import {PressabilityDebugView} from '../../Pressability/PressabilityDebug';
 import UIManager from '../../ReactNative/UIManager';
@@ -21,7 +21,7 @@ import Position from './Position';
 import * as React from 'react';
 
 const extractSingleTouch = (nativeEvent: {
-  +changedTouches: $ReadOnlyArray<PressEvent['nativeEvent']>,
+  +changedTouches: $ReadOnlyArray<GestureResponderEvent['nativeEvent']>,
   +force?: number,
   +identifier: number,
   +locationX: number,
@@ -30,7 +30,7 @@ const extractSingleTouch = (nativeEvent: {
   +pageY: number,
   +target: ?number,
   +timestamp: number,
-  +touches: $ReadOnlyArray<PressEvent['nativeEvent']>,
+  +touches: $ReadOnlyArray<GestureResponderEvent['nativeEvent']>,
 }) => {
   const touches = nativeEvent.touches;
   const changedTouches = nativeEvent.changedTouches;
@@ -398,7 +398,7 @@ const TouchableMixin = {
   touchableGetInitialState: function (): {
     touchable: {
       touchState: ?State,
-      responderID: ?PressEvent['currentTarget'],
+      responderID: ?GestureResponderEvent['currentTarget'],
     },
   } {
     return {
@@ -434,12 +434,12 @@ const TouchableMixin = {
 
   /**
    * Place as callback for a DOM element's `onResponderGrant` event.
-   * @param {SyntheticEvent} e Synthetic event from event system.
+   * @param {NativeSyntheticEvent} e Synthetic event from event system.
    *
    */
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  touchableHandleResponderGrant: function (e: PressEvent) {
+  touchableHandleResponderGrant: function (e: GestureResponderEvent) {
     const dispatchID = e.currentTarget;
     // Since e is used in a callback invoked on another event loop
     // (as in setTimeout etc), we need to call e.persist() on the
@@ -482,7 +482,7 @@ const TouchableMixin = {
    */
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  touchableHandleResponderRelease: function (e: PressEvent) {
+  touchableHandleResponderRelease: function (e: GestureResponderEvent) {
     this.pressInLocation = null;
     this._receiveSignal(Signals.RESPONDER_RELEASE, e);
   },
@@ -492,7 +492,7 @@ const TouchableMixin = {
    */
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  touchableHandleResponderTerminate: function (e: PressEvent) {
+  touchableHandleResponderTerminate: function (e: GestureResponderEvent) {
     this.pressInLocation = null;
     this._receiveSignal(Signals.RESPONDER_TERMINATED, e);
   },
@@ -502,7 +502,7 @@ const TouchableMixin = {
    */
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  touchableHandleResponderMove: function (e: PressEvent) {
+  touchableHandleResponderMove: function (e: GestureResponderEvent) {
     // Measurement may not have returned yet.
     if (!this.state.touchable.positionOnActivate) {
       return;
@@ -732,14 +732,14 @@ const TouchableMixin = {
 
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  _handleDelay: function (e: PressEvent) {
+  _handleDelay: function (e: GestureResponderEvent) {
     this.touchableDelayTimeout = null;
     this._receiveSignal(Signals.DELAY, e);
   },
 
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  _handleLongDelay: function (e: PressEvent) {
+  _handleLongDelay: function (e: GestureResponderEvent) {
     this.longPressDelayTimeout = null;
     const curState = this.state.touchable.touchState;
     if (
@@ -760,7 +760,7 @@ const TouchableMixin = {
    */
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  _receiveSignal: function (signal: Signal, e: PressEvent) {
+  _receiveSignal: function (signal: Signal, e: GestureResponderEvent) {
     const responderID = this.state.touchable.responderID;
     const curState = this.state.touchable.touchState;
     const nextState = Transitions[curState] && Transitions[curState][signal];
@@ -815,7 +815,7 @@ const TouchableMixin = {
 
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  _savePressInLocation: function (e: PressEvent) {
+  _savePressInLocation: function (e: GestureResponderEvent) {
     const touch = extractSingleTouch(e.nativeEvent);
     const pageX = touch && touch.pageX;
     const pageY = touch && touch.pageY;
@@ -852,7 +852,7 @@ const TouchableMixin = {
     curState: State,
     nextState: State,
     signal: Signal,
-    e: PressEvent,
+    e: GestureResponderEvent,
   ) {
     const curIsHighlight = this._isHighlight(curState);
     const newIsHighlight = this._isHighlight(nextState);
@@ -911,14 +911,14 @@ const TouchableMixin = {
 
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  _startHighlight: function (e: PressEvent) {
+  _startHighlight: function (e: GestureResponderEvent) {
     this._savePressInLocation(e);
     this.touchableHandleActivePressIn && this.touchableHandleActivePressIn(e);
   },
 
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  _endHighlight: function (e: PressEvent) {
+  _endHighlight: function (e: GestureResponderEvent) {
     if (this.touchableHandleActivePressOut) {
       if (
         this.touchableGetPressOutDelayMS &&

package/Libraries/Components/Touchable/Touchable.win32.js

@@ -10,7 +10,7 @@
 
 import type {EdgeInsetsProp} from '../../StyleSheet/EdgeInsetsPropType';
 import type {ColorValue} from '../../StyleSheet/StyleSheet';
-import type {PressEvent} from '../../Types/CoreEventTypes';
+import type {GestureResponderEvent} from '../../Types/CoreEventTypes';
 
 import {PressabilityDebugView} from '../../Pressability/PressabilityDebug';
 import UIManager from '../../ReactNative/UIManager';
@@ -21,9 +21,9 @@ import Position from './Position';
 import * as React from 'react';
 
 const extractSingleTouch = (nativeEvent: {
+  +changedTouches: $ReadOnlyArray<GestureResponderEvent['nativeEvent']>,
   +altKey: ?boolean,
   +button: ?number,
-  +changedTouches: $ReadOnlyArray<PressEvent['nativeEvent']>,
   +ctrlKey: ?boolean,
   +force?: number,
   +identifier: number,
@@ -35,7 +35,7 @@ const extractSingleTouch = (nativeEvent: {
   +shiftKey: ?boolean,
   +target: ?number,
   +timestamp: number,
-  +touches: $ReadOnlyArray<PressEvent['nativeEvent']>,
+  +touches: $ReadOnlyArray<GestureResponderEvent['nativeEvent']>,
 }) => {
   const touches = nativeEvent.touches;
   const changedTouches = nativeEvent.changedTouches;
@@ -403,7 +403,7 @@ const TouchableMixin = {
   touchableGetInitialState: function (): {
     touchable: {
       touchState: ?State,
-      responderID: ?PressEvent['currentTarget'],
+      responderID: ?GestureResponderEvent['currentTarget'],
     },
   } {
     return {
@@ -439,12 +439,12 @@ const TouchableMixin = {
 
   /**
    * Place as callback for a DOM element's `onResponderGrant` event.
-   * @param {SyntheticEvent} e Synthetic event from event system.
+   * @param {NativeSyntheticEvent} e Synthetic event from event system.
    *
    */
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  touchableHandleResponderGrant: function (e: PressEvent) {
+  touchableHandleResponderGrant: function (e: GestureResponderEvent) {
     const dispatchID = e.currentTarget;
     // Since e is used in a callback invoked on another event loop
     // (as in setTimeout etc), we need to call e.persist() on the
@@ -487,7 +487,7 @@ const TouchableMixin = {
    */
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  touchableHandleResponderRelease: function (e: PressEvent) {
+  touchableHandleResponderRelease: function (e: GestureResponderEvent) {
     this.pressInLocation = null;
     this._receiveSignal(Signals.RESPONDER_RELEASE, e);
   },
@@ -497,7 +497,7 @@ const TouchableMixin = {
    */
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  touchableHandleResponderTerminate: function (e: PressEvent) {
+  touchableHandleResponderTerminate: function (e: GestureResponderEvent) {
     this.pressInLocation = null;
     this._receiveSignal(Signals.RESPONDER_TERMINATED, e);
   },
@@ -507,7 +507,7 @@ const TouchableMixin = {
    */
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  touchableHandleResponderMove: function (e: PressEvent) {
+  touchableHandleResponderMove: function (e: GestureResponderEvent) {
     // Measurement may not have returned yet.
     if (!this.state.touchable.positionOnActivate) {
       return;
@@ -737,14 +737,14 @@ const TouchableMixin = {
 
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  _handleDelay: function (e: PressEvent) {
+  _handleDelay: function (e: GestureResponderEvent) {
     this.touchableDelayTimeout = null;
     this._receiveSignal(Signals.DELAY, e);
   },
 
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  _handleLongDelay: function (e: PressEvent) {
+  _handleLongDelay: function (e: GestureResponderEvent) {
     this.longPressDelayTimeout = null;
     const curState = this.state.touchable.touchState;
     if (
@@ -765,7 +765,7 @@ const TouchableMixin = {
    */
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  _receiveSignal: function (signal: Signal, e: PressEvent) {
+  _receiveSignal: function (signal: Signal, e: GestureResponderEvent) {
     const responderID = this.state.touchable.responderID;
     const curState = this.state.touchable.touchState;
     const nextState = Transitions[curState] && Transitions[curState][signal];
@@ -820,7 +820,7 @@ const TouchableMixin = {
 
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  _savePressInLocation: function (e: PressEvent) {
+  _savePressInLocation: function (e: GestureResponderEvent) {
     const touch = extractSingleTouch(e.nativeEvent);
     const pageX = touch && touch.pageX;
     const pageY = touch && touch.pageY;
@@ -857,7 +857,7 @@ const TouchableMixin = {
     curState: State,
     nextState: State,
     signal: Signal,
-    e: PressEvent,
+    e: GestureResponderEvent,
   ) {
     const curIsHighlight = this._isHighlight(curState);
     const newIsHighlight = this._isHighlight(nextState);
@@ -916,14 +916,14 @@ const TouchableMixin = {
 
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  _startHighlight: function (e: PressEvent) {
+  _startHighlight: function (e: GestureResponderEvent) {
     this._savePressInLocation(e);
     this.touchableHandleActivePressIn && this.touchableHandleActivePressIn(e);
   },
 
   /* $FlowFixMe[missing-this-annot] The 'this' type annotation(s) required by
    * Flow's LTI update could not be added via codemod */
-  _endHighlight: function (e: PressEvent) {
+  _endHighlight: function (e: GestureResponderEvent) {
     if (this.touchableHandleActivePressOut) {
       if (
         this.touchableGetPressOutDelayMS &&

package/Libraries/Components/Touchable/TouchableBounce.js

@@ -214,7 +214,7 @@ class TouchableBounce extends React.Component<Props, State> {
   }
 }
 
-module.exports = (React.forwardRef((props, hostRef) => (
+export default (React.forwardRef((props, hostRef) => (
   <TouchableBounce {...props} hostRef={hostRef} />
 )): component(
   ref: React.RefSetter<mixed>,

package/Libraries/Components/Touchable/TouchableHighlight.js

@@ -390,4 +390,4 @@ const Touchable: component(
 
 Touchable.displayName = 'TouchableHighlight';
 
-module.exports = Touchable;
+export default Touchable;

package/Libraries/Components/Touchable/TouchableNativeFeedback.js

@@ -8,7 +8,7 @@
  * @format
  */
 
-import type {PressEvent} from '../../Types/CoreEventTypes';
+import type {GestureResponderEvent} from '../../Types/CoreEventTypes';
 import typeof TouchableWithoutFeedback from './TouchableWithoutFeedback';
 
 import View from '../../Components/View/View';
@@ -220,7 +220,7 @@ class TouchableNativeFeedback extends React.Component<Props, State> {
     }
   }
 
-  _dispatchHotspotUpdate(event: PressEvent): void {
+  _dispatchHotspotUpdate(event: GestureResponderEvent): void {
     if (Platform.OS === 'android') {
       const {locationX, locationY} = event.nativeEvent;
       const hostComponentRef = findHostInstance_DEPRECATED(this);
@@ -363,4 +363,4 @@ const getBackgroundProp =
 
 TouchableNativeFeedback.displayName = 'TouchableNativeFeedback';
 
-module.exports = TouchableNativeFeedback;
+export default TouchableNativeFeedback;

package/Libraries/Components/Touchable/TouchableNativeFeedback.win32.js

@@ -96,4 +96,4 @@ class TouchableNativeFeedback extends React.Component<Props, {}> {
   }
 }
 
-module.exports = TouchableNativeFeedback;
+export default TouchableNativeFeedback;

package/Libraries/Components/Touchable/TouchableOpacity.js

@@ -336,4 +336,4 @@ const Touchable: component(
 
 Touchable.displayName = 'TouchableOpacity';
 
-module.exports = Touchable;
+export default Touchable;

package/Libraries/Components/Touchable/TouchableWithoutFeedback.js

@@ -19,8 +19,8 @@ import type {EdgeInsetsOrSizeProp} from '../../StyleSheet/EdgeInsetsPropType';
 import type {
   BlurEvent,
   FocusEvent,
-  LayoutEvent,
-  PressEvent,
+  LayoutChangeEvent,
+  GestureResponderEvent,
 } from '../../Types/CoreEventTypes';
 
 import View from '../../Components/View/View';
@@ -73,11 +73,11 @@ type Props = $ReadOnly<{
   onAccessibilityAction?: ?(event: AccessibilityActionEvent) => mixed,
   onBlur?: ?(event: BlurEvent) => mixed,
   onFocus?: ?(event: FocusEvent) => mixed,
-  onLayout?: ?(event: LayoutEvent) => mixed,
-  onLongPress?: ?(event: PressEvent) => mixed,
-  onPress?: ?(event: PressEvent) => mixed,
-  onPressIn?: ?(event: PressEvent) => mixed,
-  onPressOut?: ?(event: PressEvent) => mixed,
+  onLayout?: ?(event: LayoutChangeEvent) => mixed,
+  onLongPress?: ?(event: GestureResponderEvent) => mixed,
+  onPress?: ?(event: GestureResponderEvent) => mixed,
+  onPressIn?: ?(event: GestureResponderEvent) => mixed,
+  onPressOut?: ?(event: GestureResponderEvent) => mixed,
   pressRetentionOffset?: ?EdgeInsetsOrSizeProp,
   rejectResponderTermination?: ?boolean,
   testID?: ?string,
@@ -110,7 +110,7 @@ const PASSTHROUGH_PROPS = [
   'testID',
 ];
 
-module.exports = function TouchableWithoutFeedback(props: Props): React.Node {
+export default function TouchableWithoutFeedback(props: Props): React.Node {
   const {
     disabled,
     rejectResponderTermination,
@@ -231,4 +231,4 @@ module.exports = function TouchableWithoutFeedback(props: Props): React.Node {
 
   // $FlowFixMe[incompatible-call]
   return React.cloneElement(element, elementProps, ...children);
-};
+}

package/Libraries/Components/UnimplementedViews/UnimplementedNativeViewNativeComponent.js

@@ -8,6 +8,6 @@
  * @flow strict-local
  */
 
-export * from '../../../src/private/specs/components/UnimplementedNativeViewNativeComponent';
-import UnimplementedNativeViewNativeComponent from '../../../src/private/specs/components/UnimplementedNativeViewNativeComponent';
+export * from '../../../src/private/specs_DEPRECATED/components/UnimplementedNativeViewNativeComponent';
+import UnimplementedNativeViewNativeComponent from '../../../src/private/specs_DEPRECATED/components/UnimplementedNativeViewNativeComponent';
 export default UnimplementedNativeViewNativeComponent;

package/Libraries/Components/UnimplementedViews/UnimplementedView.js

@@ -27,7 +27,7 @@ type Props = $ReadOnly<{
 class UnimplementedView extends React.Component<Props> {
   render(): React.Node {
     // Workaround require cycle from requireNativeComponent
-    const View = require('../View/View');
+    const View = require('../View/View').default;
     return (
       <View style={[styles.unimplementedView, this.props.style]}>
         {this.props.children}
@@ -46,4 +46,4 @@ const styles = StyleSheet.create({
     : {},
 });
 
-module.exports = UnimplementedView;
+export default UnimplementedView;

package/Libraries/Components/View/ReactNativeStyleAttributes.js

@@ -10,6 +10,8 @@
 
 import type {AnyAttributeType} from '../../Renderer/shims/ReactNativeTypes';
 
+import * as ReactNativeFeatureFlags from '../../../src/private/featureflags/ReactNativeFeatureFlags';
+import NativeReactNativeFeatureFlags from '../../../src/private/featureflags/specs/NativeReactNativeFeatureFlags';
 import processAspectRatio from '../../StyleSheet/processAspectRatio';
 import processBackgroundImage from '../../StyleSheet/processBackgroundImage';
 import processBoxShadow from '../../StyleSheet/processBoxShadow';
@@ -121,7 +123,13 @@ const ReactNativeStyleAttributes: {[string]: AnyAttributeType, ...} = {
   /**
    * Filter
    */
-  filter: {process: processFilter},
+  filter:
+    NativeReactNativeFeatureFlags != null &&
+    ReactNativeFeatureFlags.enableNativeCSSParsing()
+      ? true
+      : {
+          process: processFilter,
+        },
 
   /**
    * MixBlendMode
@@ -136,7 +144,13 @@ const ReactNativeStyleAttributes: {[string]: AnyAttributeType, ...} = {
   /*
    * BoxShadow
    */
-  boxShadow: {process: processBoxShadow},
+  boxShadow:
+    NativeReactNativeFeatureFlags != null &&
+    ReactNativeFeatureFlags.enableNativeCSSParsing()
+      ? true
+      : {
+          process: processBoxShadow,
+        },
 
   /**
    * Linear Gradient
@@ -215,4 +229,4 @@ const ReactNativeStyleAttributes: {[string]: AnyAttributeType, ...} = {
   objectFit: true,
 };
 
-module.exports = ReactNativeStyleAttributes;
+export default ReactNativeStyleAttributes;

package/Libraries/Components/View/ReactNativeViewAttributes.js

@@ -57,4 +57,4 @@ const ReactNativeViewAttributes = {
   RCTView: RCTView,
 };
 
-module.exports = ReactNativeViewAttributes;
+export default ReactNativeViewAttributes;

package/Libraries/Components/View/ReactNativeViewAttributes.win32.js

@@ -91,4 +91,4 @@ const ReactNativeViewAttributes = {
   RCTView: RCTView,
 };
 
-module.exports = ReactNativeViewAttributes;
+export default ReactNativeViewAttributes;

package/Libraries/Components/View/View.js

@@ -130,4 +130,4 @@ const View: component(
 
 View.displayName = 'View';
 
-module.exports = View;
+export default View;

package/Libraries/Components/View/View.win32.js

@@ -273,4 +273,4 @@ const View: component(
 
 View.displayName = 'View';
 
-module.exports = View;
+export default View;