@office-iss/react-native-win32 0.68.0 → 0.69.0-preview.3

package/Libraries/NativeComponent/BaseViewConfig.win32.js

@@ -0,0 +1,334 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ * @flow strict-local
+ */
+
+import {
+  DynamicallyInjectedByGestureHandler,
+  ConditionallyIgnoredEventHandlers,
+} from './ViewConfigIgnore';
+import ReactNativeStyleAttributes from '../Components/View/ReactNativeStyleAttributes';
+import type {PartialViewConfigWithoutName} from './PlatformBaseViewConfig';
+
+const bubblingEventTypes = {
+  // Generic Events
+  topPress: {
+    phasedRegistrationNames: {
+      bubbled: 'onPress',
+      captured: 'onPressCapture',
+    },
+  },
+  topChange: {
+    phasedRegistrationNames: {
+      bubbled: 'onChange',
+      captured: 'onChangeCapture',
+    },
+  },
+  topFocus: {
+    phasedRegistrationNames: {
+      bubbled: 'onFocus',
+      captured: 'onFocusCapture',
+    },
+  },
+  topBlur: {
+    phasedRegistrationNames: {
+      bubbled: 'onBlur',
+      captured: 'onBlurCapture',
+    },
+  },
+  topSubmitEditing: {
+    phasedRegistrationNames: {
+      bubbled: 'onSubmitEditing',
+      captured: 'onSubmitEditingCapture',
+    },
+  },
+  topEndEditing: {
+    phasedRegistrationNames: {
+      bubbled: 'onEndEditing',
+      captured: 'onEndEditingCapture',
+    },
+  },
+  topKeyPress: {
+    phasedRegistrationNames: {
+      bubbled: 'onKeyPress',
+      captured: 'onKeyPressCapture',
+    },
+  },
+
+  // Touch Events
+  topTouchStart: {
+    phasedRegistrationNames: {
+      bubbled: 'onTouchStart',
+      captured: 'onTouchStartCapture',
+    },
+  },
+  topTouchMove: {
+    phasedRegistrationNames: {
+      bubbled: 'onTouchMove',
+      captured: 'onTouchMoveCapture',
+    },
+  },
+  topTouchCancel: {
+    phasedRegistrationNames: {
+      bubbled: 'onTouchCancel',
+      captured: 'onTouchCancelCapture',
+    },
+  },
+  topTouchEnd: {
+    phasedRegistrationNames: {
+      bubbled: 'onTouchEnd',
+      captured: 'onTouchEndCapture',
+    },
+  },
+
+  // Experimental/Work in Progress Pointer Events (not yet ready for use)
+  topPointerCancel: {
+    phasedRegistrationNames: {
+      captured: 'onPointerCancelCapture',
+      bubbled: 'onPointerCancel',
+    },
+  },
+  topPointerDown: {
+    phasedRegistrationNames: {
+      captured: 'onPointerDownCapture',
+      bubbled: 'onPointerDown',
+    },
+  },
+  topPointerMove2: {
+    phasedRegistrationNames: {
+      captured: 'onPointerMove2Capture',
+      bubbled: 'onPointerMove2',
+    },
+  },
+  topPointerUp: {
+    phasedRegistrationNames: {
+      captured: 'onPointerUpCapture',
+      bubbled: 'onPointerUp',
+    },
+  },
+  topPointerEnter2: {
+    phasedRegistrationNames: {
+      captured: 'onPointerEnter2Capture',
+      bubbled: 'onPointerEnter2',
+      skipBubbling: true,
+    },
+  },
+  topPointerLeave2: {
+    phasedRegistrationNames: {
+      captured: 'onPointerLeave2Capture',
+      bubbled: 'onPointerLeave2',
+      skipBubbling: true,
+    },
+  },
+};
+
+const directEventTypes = {
+  topAccessibilityAction: {
+    registrationName: 'onAccessibilityAction',
+  },
+  topAccessibilityTap: {
+    registrationName: 'onAccessibilityTap',
+  },
+  topMagicTap: {
+    registrationName: 'onMagicTap',
+  },
+  topAccessibilityEscape: {
+    registrationName: 'onAccessibilityEscape',
+  },
+  topLayout: {
+    registrationName: 'onLayout',
+  },
+  onGestureHandlerEvent: DynamicallyInjectedByGestureHandler({
+    registrationName: 'onGestureHandlerEvent',
+  }),
+  onGestureHandlerStateChange: DynamicallyInjectedByGestureHandler({
+    registrationName: 'onGestureHandlerStateChange',
+  }),
+};
+
+const validAttributesForNonEventProps = {
+  // View Props
+  accessible: true,
+  accessibilityActions: true,
+  accessibilityLabel: true,
+  accessibilityHint: true,
+  accessibilityLanguage: true,
+  accessibilityValue: true,
+  accessibilityViewIsModal: true,
+  accessibilityElementsHidden: true,
+  accessibilityIgnoresInvertColors: true,
+  testID: true,
+  backgroundColor: {process: require('../StyleSheet/processColor')},
+  backfaceVisibility: true,
+  opacity: true,
+  shadowColor: {process: require('../StyleSheet/processColor')},
+  shadowOffset: {diff: require('../Utilities/differ/sizesDiffer')},
+  shadowOpacity: true,
+  shadowRadius: true,
+  needsOffscreenAlphaCompositing: true,
+  overflow: true,
+  shouldRasterizeIOS: true,
+  transform: {diff: require('../Utilities/differ/matricesDiffer')},
+  accessibilityRole: true,
+  accessibilityState: true,
+  nativeID: true,
+  pointerEvents: true,
+  removeClippedSubviews: true,
+  borderRadius: true,
+  borderColor: {process: require('../StyleSheet/processColor')},
+  borderWidth: true,
+  borderStyle: true,
+  hitSlop: {diff: require('../Utilities/differ/insetsDiffer')},
+  collapsable: true,
+
+  borderTopWidth: true,
+  borderTopColor: {process: require('../StyleSheet/processColor')},
+  borderRightWidth: true,
+  borderRightColor: {process: require('../StyleSheet/processColor')},
+  borderBottomWidth: true,
+  borderBottomColor: {process: require('../StyleSheet/processColor')},
+  borderLeftWidth: true,
+  borderLeftColor: {process: require('../StyleSheet/processColor')},
+  borderStartWidth: true,
+  borderStartColor: {process: require('../StyleSheet/processColor')},
+  borderEndWidth: true,
+  borderEndColor: {process: require('../StyleSheet/processColor')},
+
+  borderTopLeftRadius: true,
+  borderTopRightRadius: true,
+  borderTopStartRadius: true,
+  borderTopEndRadius: true,
+  borderBottomLeftRadius: true,
+  borderBottomRightRadius: true,
+  borderBottomStartRadius: true,
+  borderBottomEndRadius: true,
+  display: true,
+  zIndex: true,
+
+  // ShadowView properties
+  top: true,
+  right: true,
+  start: true,
+  end: true,
+  bottom: true,
+  left: true,
+
+  width: true,
+  height: true,
+
+  minWidth: true,
+  maxWidth: true,
+  minHeight: true,
+  maxHeight: true,
+
+  // Also declared as ViewProps
+  // borderTopWidth: true,
+  // borderRightWidth: true,
+  // borderBottomWidth: true,
+  // borderLeftWidth: true,
+  // borderStartWidth: true,
+  // borderEndWidth: true,
+  // borderWidth: true,
+
+  marginTop: true,
+  marginRight: true,
+  marginBottom: true,
+  marginLeft: true,
+  marginStart: true,
+  marginEnd: true,
+  marginVertical: true,
+  marginHorizontal: true,
+  margin: true,
+
+  paddingTop: true,
+  paddingRight: true,
+  paddingBottom: true,
+  paddingLeft: true,
+  paddingStart: true,
+  paddingEnd: true,
+  paddingVertical: true,
+  paddingHorizontal: true,
+  padding: true,
+
+  flex: true,
+  flexGrow: true,
+  flexShrink: true,
+  flexBasis: true,
+  flexDirection: true,
+  flexWrap: true,
+  justifyContent: true,
+  alignItems: true,
+  alignSelf: true,
+  alignContent: true,
+  position: true,
+  aspectRatio: true,
+
+  // Also declared as ViewProps
+  // overflow: true,
+  // display: true,
+
+  direction: true,
+
+  style: ReactNativeStyleAttributes,
+};
+
+// Props for bubbling and direct events
+const validAttributesForEventProps = ConditionallyIgnoredEventHandlers({
+  onLayout: true,
+  onMagicTap: true,
+
+  // Accessibility
+  onAccessibilityAction: true,
+  onAccessibilityEscape: true,
+  onAccessibilityTap: true,
+
+  // PanResponder handlers
+  onMoveShouldSetResponder: true,
+  onMoveShouldSetResponderCapture: true,
+  onStartShouldSetResponder: true,
+  onStartShouldSetResponderCapture: true,
+  onResponderGrant: true,
+  onResponderReject: true,
+  onResponderStart: true,
+  onResponderEnd: true,
+  onResponderRelease: true,
+  onResponderMove: true,
+  onResponderTerminate: true,
+  onResponderTerminationRequest: true,
+  onShouldBlockNativeResponder: true,
+
+  // Touch events
+  onTouchStart: true,
+  onTouchMove: true,
+  onTouchEnd: true,
+  onTouchCancel: true,
+
+  // Pointer events
+  onPointerUp: true,
+  onPointerDown: true,
+  onPointerCancel: true,
+  onPointerEnter2: true,
+  onPointerMove2: true,
+  onPointerLeave2: true,
+});
+
+/**
+ * On iOS, view managers define all of a component's props.
+ * All view managers extend RCTViewManager, and RCTViewManager declares these props.
+ */
+const PlatformBaseViewConfigWindows: PartialViewConfigWithoutName = {
+  bubblingEventTypes,
+  directEventTypes,
+  validAttributes: {
+    ...validAttributesForNonEventProps,
+    ...validAttributesForEventProps,
+  },
+};
+// [Windows
+export default PlatformBaseViewConfigWindows;
+// Windows]

package/Libraries/NativeComponent/NativeComponentRegistry.js

@@ -23,8 +23,6 @@ import * as React from 'react';
 
 let getRuntimeConfig;
 
-let componentNameToExists: Map<string, boolean> = new Map();
-
 /**
  * Configures a function that is called to determine whether a given component
  * should be registered using reflection of the native component at runtime.

package/Libraries/NativeComponent/PlatformBaseViewConfig.js

@@ -0,0 +1,24 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ * @flow strict-local
+ */
+
+import type {PartialViewConfig} from '../Renderer/shims/ReactNativeTypes';
+import BaseViewConfig from './BaseViewConfig';
+
+export type PartialViewConfigWithoutName = $Rest<
+  PartialViewConfig,
+  {uiViewClassName: string},
+>;
+
+const PlatformBaseViewConfig: PartialViewConfigWithoutName = BaseViewConfig;
+
+// In Wilde/FB4A, use RNHostComponentListRoute in Bridge mode to verify
+// whether the JS props defined here match the native props defined
+// in RCTViewManagers in iOS, and ViewManagers in Android.
+export default PlatformBaseViewConfig;

package/Libraries/NativeComponent/StaticViewConfigValidator.js

@@ -9,12 +9,9 @@
  */
 
 import {type ViewConfig} from '../Renderer/shims/ReactNativeTypes';
-// $FlowFixMe[nonstrict-import]
-import getNativeComponentAttributes from '../ReactNative/getNativeComponentAttributes';
-// $FlowFixMe[nonstrict-import]
-import {createViewConfig} from './ViewConfig';
+import {isIgnored} from './ViewConfigIgnore';
 
-type Difference =
+export type Difference =
   | {
       type: 'missing',
       path: Array<string>,
@@ -32,7 +29,7 @@ type Difference =
       staticValue: mixed,
     };
 
-type ValidationResult = ValidResult | InvalidResult;
+export type ValidationResult = ValidResult | InvalidResult;
 type ValidResult = {
   type: 'valid',
 };
@@ -41,41 +38,6 @@ type InvalidResult = {
   differences: Array<Difference>,
 };
 
-type ViewConfigValidationResult = {
-  componentName: string,
-  nativeViewConfig?: ?ViewConfig,
-  staticViewConfig?: ?ViewConfig,
-  validationResult?: ?ValidationResult,
-};
-
-// e.g. require('MyNativeComponent') where MyNativeComponent.js exports a HostComponent
-type JSModule = $FlowFixMe;
-
-export function validateStaticViewConfigs(
-  nativeComponent: JSModule,
-): ViewConfigValidationResult {
-  const nativeViewConfig = getNativeComponentAttributes(
-    nativeComponent.default || nativeComponent,
-  );
-
-  const generatedPartialViewConfig = nativeComponent.__INTERNAL_VIEW_CONFIG;
-  const staticViewConfig: ?ViewConfig =
-    generatedPartialViewConfig && createViewConfig(generatedPartialViewConfig);
-
-  const componentName: string = nativeComponent.default || nativeComponent;
-  const validationResult: ?ValidationResult =
-    nativeViewConfig &&
-    staticViewConfig &&
-    validate(componentName, nativeViewConfig, staticViewConfig);
-
-  return {
-    componentName,
-    nativeViewConfig,
-    staticViewConfig,
-    validationResult,
-  };
-}
-
 /**
  * During the migration from native view configs to static view configs, this is
  * used to validate that the two are equivalent.
@@ -183,7 +145,10 @@ function accumulateDifferences(
   }
 
   for (const staticKey in staticObject) {
-    if (!nativeObject.hasOwnProperty(staticKey)) {
+    if (
+      !nativeObject.hasOwnProperty(staticKey) &&
+      !isIgnored(staticObject[staticKey])
+    ) {
       differences.push({
         path: [...path, staticKey],
         type: 'unexpected',

package/Libraries/NativeComponent/ViewConfig.js

@@ -8,11 +8,11 @@
  * @format
  */
 
-import ReactNativeViewViewConfig from '../Components/View/ReactNativeViewViewConfig';
 import type {
   PartialViewConfig,
   ViewConfig,
 } from '../Renderer/shims/ReactNativeTypes';
+import PlatformBaseViewConfig from './PlatformBaseViewConfig';
 
 /**
  * Creates a complete `ViewConfig` from a `PartialViewConfig`.
@@ -24,16 +24,16 @@ export function createViewConfig(
     uiViewClassName: partialViewConfig.uiViewClassName,
     Commands: {},
     bubblingEventTypes: composeIndexers(
-      ReactNativeViewViewConfig.bubblingEventTypes,
+      PlatformBaseViewConfig.bubblingEventTypes,
       partialViewConfig.bubblingEventTypes,
     ),
     directEventTypes: composeIndexers(
-      ReactNativeViewViewConfig.directEventTypes,
+      PlatformBaseViewConfig.directEventTypes,
       partialViewConfig.directEventTypes,
     ),
     validAttributes: composeIndexers(
       // $FlowFixMe[incompatible-call] `style` property confuses Flow.
-      ReactNativeViewViewConfig.validAttributes,
+      PlatformBaseViewConfig.validAttributes,
       // $FlowFixMe[incompatible-call] `style` property confuses Flow.
       partialViewConfig.validAttributes,
     ),

package/Libraries/NativeComponent/ViewConfigIgnore.js

@@ -0,0 +1,54 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and 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
+ * @format
+ */
+
+import Platform from '../Utilities/Platform';
+
+const ignoredViewConfigProps = new WeakSet<{...}>();
+
+/**
+ * Decorates ViewConfig values that are dynamically injected by the library,
+ * react-native-gesture-handler. (T45765076)
+ */
+export function DynamicallyInjectedByGestureHandler<T: {...}>(object: T): T {
+  ignoredViewConfigProps.add(object);
+  return object;
+}
+
+/**
+ * On iOS, ViewManager event declarations generate {eventName}: true entries
+ * in ViewConfig valueAttributes. These entries aren't generated for Android.
+ * This annotation allows Static ViewConfigs to insert these entries into
+ * iOS but not Android.
+ *
+ * In the future, we want to remove this platform-inconsistency. We want
+ * to set RN$ViewConfigEventValidAttributesDisabled = true server-side,
+ * so that iOS does not generate validAttributes from event props in iOS RCTViewManager,
+ * since Android does not generate validAttributes from events props in Android ViewManager.
+ *
+ * TODO(T110872225): Remove this logic, after achieving platform-consistency
+ */
+export function ConditionallyIgnoredEventHandlers<T: {[name: string]: true}>(
+  value: T,
+): T | void {
+  if (
+    Platform.OS === 'ios' &&
+    !(global.RN$ViewConfigEventValidAttributesDisabled === true)
+  ) {
+    return value;
+  }
+  return undefined;
+}
+
+export function isIgnored(value: mixed): boolean {
+  if (typeof value === 'object' && value != null) {
+    return ignoredViewConfigProps.has(value);
+  }
+  return false;
+}

package/Libraries/Network/FormData.js

@@ -64,6 +64,12 @@ class FormData {
     this._parts.push([key, value]);
   }
 
+  getAll(key: string): Array<FormDataValue> {
+    return this._parts
+      .filter(([name]) => name === key)
+      .map(([, value]) => value);
+  }
+
   getParts(): Array<FormDataPart> {
     return this._parts.map(([name, value]) => {
       const contentDisposition = 'form-data; name="' + name + '"';
@@ -74,7 +80,7 @@ class FormData {
       // an object with a `uri` attribute. Optionally, it can also
       // have a `name` and `type` attribute to specify filename and
       // content type (cf. web Blob interface.)
-      if (typeof value === 'object' && value) {
+      if (typeof value === 'object' && !Array.isArray(value) && value) {
         if (typeof value.name === 'string') {
           headers['content-disposition'] += '; filename="' + value.name + '"';
         }

package/Libraries/Network/RCTNetworking.win32.js

@@ -60,7 +60,7 @@ class RCTNetworking extends NativeEventEmitter<$FlowFixMe> {
   ) {
     const body = convertRequestBody(data);
     if (body && body.formData) {
-      body.formData = body.formData.map((part) => ({
+      body.formData = body.formData.map(part => ({
         ...part,
         headers: convertHeadersMapToArray(part.headers),
       }));