@depup/react-native 0.85.0-depup.0 → 0.86.0-depup.49

package/Libraries/Components/ToastAndroid/ToastAndroidFallback.js

@@ -12,12 +12,12 @@
 
 const ToastAndroid = {
   // Dummy fallback toast duration constants
-  SHORT: (0: number),
-  LONG: (0: number),
+  SHORT: 0 as number,
+  LONG: 0 as number,
   // Dummy fallback toast gravity constants
-  TOP: (0: number),
-  BOTTOM: (0: number),
-  CENTER: (0: number),
+  TOP: 0 as number,
+  BOTTOM: 0 as number,
+  CENTER: 0 as number,
 
   show: function (message: string, duration: number): void {
     console.warn('ToastAndroid is not supported on this platform.');

package/Libraries/Components/Touchable/PooledClass.js

@@ -124,10 +124,10 @@ const addPoolingTo = function <T>(
 
 const PooledClass = {
   addPoolingTo: addPoolingTo,
-  oneArgumentPooler: (oneArgumentPooler: Pooler),
-  twoArgumentPooler: (twoArgumentPooler: Pooler),
-  threeArgumentPooler: (threeArgumentPooler: Pooler),
-  fourArgumentPooler: (fourArgumentPooler: Pooler),
+  oneArgumentPooler: oneArgumentPooler as Pooler,
+  twoArgumentPooler: twoArgumentPooler as Pooler,
+  threeArgumentPooler: threeArgumentPooler as Pooler,
+  fourArgumentPooler: fourArgumentPooler as Pooler,
 };
 
 export default PooledClass;

package/Libraries/Components/Touchable/Touchable.js

@@ -947,7 +947,7 @@ const TouchableMixinImpl = {
     }
   },
 
-  withoutDefaultFocusAndBlur: ({}: {...}),
+  withoutDefaultFocusAndBlur: {} as {...},
 };
 
 /**

package/Libraries/Components/Touchable/TouchableNativeFeedback.js

@@ -8,6 +8,8 @@
  * @format
  */
 
+import type {ProcessedColorValue} from '../../StyleSheet/processColor';
+import type {ColorValue} from '../../StyleSheet/StyleSheet';
 import type {GestureResponderEvent} from '../../Types/CoreEventTypes';
 import type {TouchableWithoutFeedbackProps} from './TouchableWithoutFeedback';
 
@@ -20,7 +22,6 @@ import {findHostInstance_DEPRECATED} from '../../ReactNative/RendererProxy';
 import processColor from '../../StyleSheet/processColor';
 import Platform from '../../Utilities/Platform';
 import {Commands} from '../View/ViewNativeComponent';
-import invariant from 'invariant';
 import * as React from 'react';
 import {cloneElement} from 'react';
 
@@ -96,7 +97,7 @@ export type TouchableNativeFeedbackProps = Readonly<{
       }>
     | Readonly<{
         type: 'RippleAndroid',
-        color: ?number,
+        color: ?ProcessedColorValue,
         borderless: boolean,
         rippleRadius: ?number,
       }>
@@ -177,23 +178,18 @@ class TouchableNativeFeedback extends React.Component<
    * @param rippleRadius The radius of ripple effect
    */
   static Ripple: (
-    color: string,
+    color: ColorValue,
     borderless: boolean,
     rippleRadius?: ?number,
   ) => Readonly<{
     borderless: boolean,
-    color: ?number,
+    color: ?ProcessedColorValue,
     rippleRadius: ?number,
     type: 'RippleAndroid',
-  }> = (color: string, borderless: boolean, rippleRadius?: ?number) => {
+  }> = (color: ColorValue, borderless: boolean, rippleRadius?: ?number) => {
     const processedColor = processColor(color);
-    invariant(
-      processedColor == null || typeof processedColor === 'number',
-      'Unexpected color given for Ripple color',
-    );
     return {
       type: 'RippleAndroid',
-      // $FlowFixMe[incompatible-type]
       color: processedColor,
       borderless,
       rippleRadius,

package/Libraries/Components/View/ReactNativeStyleAttributes.js

@@ -67,6 +67,14 @@ export const transformOriginAttribute: AnyAttributeType = nativeCSSParsing
   ? true
   : {process: processTransformOrigin};
 
+export const fontVariantAttribute: AnyAttributeType = nativeCSSParsing
+  ? true
+  : {process: processFontVariant};
+
+export const aspectRatioAttribute: AnyAttributeType = nativeCSSParsing
+  ? true
+  : {process: processAspectRatio};
+
 const ReactNativeStyleAttributes: {[string]: AnyAttributeType, ...} = {
   /**
    * Layout
@@ -74,7 +82,7 @@ const ReactNativeStyleAttributes: {[string]: AnyAttributeType, ...} = {
   alignContent: true,
   alignItems: true,
   alignSelf: true,
-  aspectRatio: {process: processAspectRatio},
+  aspectRatio: aspectRatioAttribute,
   borderBottomWidth: true,
   borderEndWidth: true,
   borderLeftWidth: true,
@@ -248,7 +256,7 @@ const ReactNativeStyleAttributes: {[string]: AnyAttributeType, ...} = {
   fontFamily: true,
   fontSize: true,
   fontStyle: true,
-  fontVariant: {process: processFontVariant},
+  fontVariant: fontVariantAttribute,
   fontWeight: true,
   includeFontPadding: true,
   letterSpacing: true,

package/Libraries/Components/View/View.js

@@ -10,6 +10,7 @@
 
 import type {ViewProps} from './ViewPropTypes';
 
+import * as ReactNativeFeatureFlags from '../../../src/private/featureflags/ReactNativeFeatureFlags';
 import TextAncestorContext from '../../Text/TextAncestorContext';
 import ViewNativeComponent from './ViewNativeComponent';
 import * as React from 'react';
@@ -28,96 +29,100 @@ component View(
 ) {
   const hasTextAncestor = use(TextAncestorContext);
 
-  const {
-    accessibilityState,
-    accessibilityValue,
-    'aria-busy': ariaBusy,
-    'aria-checked': ariaChecked,
-    'aria-disabled': ariaDisabled,
-    'aria-expanded': ariaExpanded,
-    'aria-hidden': ariaHidden,
-    'aria-label': ariaLabel,
-    'aria-labelledby': ariaLabelledBy,
-    'aria-live': ariaLive,
-    'aria-selected': ariaSelected,
-    'aria-valuemax': ariaValueMax,
-    'aria-valuemin': ariaValueMin,
-    'aria-valuenow': ariaValueNow,
-    'aria-valuetext': ariaValueText,
-    id,
-    tabIndex,
-    ...otherProps
-  } = props;
-
-  // Since we destructured props, we can now treat it as mutable
-  const processedProps = otherProps as {...ViewProps};
-
-  const parsedAriaLabelledBy = ariaLabelledBy?.split(/\s*,\s*/g);
-  if (parsedAriaLabelledBy !== undefined) {
-    processedProps.accessibilityLabelledBy = parsedAriaLabelledBy;
-  }
+  let resolvedProps = props;
+  if (!ReactNativeFeatureFlags.enableNativeViewPropTransformations()) {
+    const {
+      accessibilityState,
+      accessibilityValue,
+      'aria-busy': ariaBusy,
+      'aria-checked': ariaChecked,
+      'aria-disabled': ariaDisabled,
+      'aria-expanded': ariaExpanded,
+      'aria-hidden': ariaHidden,
+      'aria-label': ariaLabel,
+      'aria-labelledby': ariaLabelledBy,
+      'aria-live': ariaLive,
+      'aria-selected': ariaSelected,
+      'aria-valuemax': ariaValueMax,
+      'aria-valuemin': ariaValueMin,
+      'aria-valuenow': ariaValueNow,
+      'aria-valuetext': ariaValueText,
+      id,
+      tabIndex,
+      ...otherProps
+    } = props;
+
+    const processedProps = otherProps as {...ViewProps};
+
+    const parsedAriaLabelledBy = ariaLabelledBy?.split(/\s*,\s*/g);
+    if (parsedAriaLabelledBy !== undefined) {
+      processedProps.accessibilityLabelledBy = parsedAriaLabelledBy;
+    }
 
-  if (ariaLabel !== undefined) {
-    processedProps.accessibilityLabel = ariaLabel;
-  }
+    if (ariaLabel !== undefined) {
+      processedProps.accessibilityLabel = ariaLabel;
+    }
 
-  if (ariaLive !== undefined) {
-    processedProps.accessibilityLiveRegion =
-      ariaLive === 'off' ? 'none' : ariaLive;
-  }
+    if (ariaLive !== undefined) {
+      processedProps.accessibilityLiveRegion =
+        ariaLive === 'off' ? 'none' : ariaLive;
+    }
 
-  if (ariaHidden !== undefined) {
-    processedProps.accessibilityElementsHidden = ariaHidden;
-    if (ariaHidden === true) {
-      processedProps.importantForAccessibility = 'no-hide-descendants';
+    if (ariaHidden !== undefined) {
+      processedProps.accessibilityElementsHidden = ariaHidden;
+      if (ariaHidden === true) {
+        processedProps.importantForAccessibility = 'no-hide-descendants';
+      }
     }
-  }
 
-  if (id !== undefined) {
-    processedProps.nativeID = id;
-  }
+    if (id !== undefined) {
+      processedProps.nativeID = id;
+    }
 
-  if (tabIndex !== undefined) {
-    processedProps.focusable = !tabIndex;
-  }
+    if (tabIndex !== undefined) {
+      processedProps.focusable = !tabIndex;
+    }
 
-  if (
-    accessibilityState != null ||
-    ariaBusy != null ||
-    ariaChecked != null ||
-    ariaDisabled != null ||
-    ariaExpanded != null ||
-    ariaSelected != null
-  ) {
-    processedProps.accessibilityState = {
-      busy: ariaBusy ?? accessibilityState?.busy,
-      checked: ariaChecked ?? accessibilityState?.checked,
-      disabled: ariaDisabled ?? accessibilityState?.disabled,
-      expanded: ariaExpanded ?? accessibilityState?.expanded,
-      selected: ariaSelected ?? accessibilityState?.selected,
-    };
-  }
+    if (
+      accessibilityState != null ||
+      ariaBusy != null ||
+      ariaChecked != null ||
+      ariaDisabled != null ||
+      ariaExpanded != null ||
+      ariaSelected != null
+    ) {
+      processedProps.accessibilityState = {
+        busy: ariaBusy ?? accessibilityState?.busy,
+        checked: ariaChecked ?? accessibilityState?.checked,
+        disabled: ariaDisabled ?? accessibilityState?.disabled,
+        expanded: ariaExpanded ?? accessibilityState?.expanded,
+        selected: ariaSelected ?? accessibilityState?.selected,
+      };
+    }
+
+    if (
+      accessibilityValue != null ||
+      ariaValueMax != null ||
+      ariaValueMin != null ||
+      ariaValueNow != null ||
+      ariaValueText != null
+    ) {
+      processedProps.accessibilityValue = {
+        max: ariaValueMax ?? accessibilityValue?.max,
+        min: ariaValueMin ?? accessibilityValue?.min,
+        now: ariaValueNow ?? accessibilityValue?.now,
+        text: ariaValueText ?? accessibilityValue?.text,
+      };
+    }
 
-  if (
-    accessibilityValue != null ||
-    ariaValueMax != null ||
-    ariaValueMin != null ||
-    ariaValueNow != null ||
-    ariaValueText != null
-  ) {
-    processedProps.accessibilityValue = {
-      max: ariaValueMax ?? accessibilityValue?.max,
-      min: ariaValueMin ?? accessibilityValue?.min,
-      now: ariaValueNow ?? accessibilityValue?.now,
-      text: ariaValueText ?? accessibilityValue?.text,
-    };
+    resolvedProps = processedProps;
   }
 
   const actualView =
     ref == null ? (
-      <ViewNativeComponent {...processedProps} />
+      <ViewNativeComponent {...resolvedProps} />
     ) : (
-      <ViewNativeComponent {...processedProps} ref={ref} />
+      <ViewNativeComponent {...resolvedProps} ref={ref} />
     );
 
   if (hasTextAncestor) {

package/Libraries/Components/View/ViewPropTypes.js

@@ -11,6 +11,7 @@
 'use strict';
 
 import type {EdgeInsetsOrSizeProp} from '../../StyleSheet/EdgeInsetsPropType';
+import type {ProcessedColorValue} from '../../StyleSheet/processColor';
 import type {ViewStyleProp} from '../../StyleSheet/StyleSheet';
 import type {
   BlurEvent,
@@ -264,9 +265,10 @@ type AndroidDrawableThemeAttr = Readonly<{
 
 type AndroidDrawableRipple = Readonly<{
   type: 'RippleAndroid',
-  color?: ?number,
+  color?: ?ProcessedColorValue,
   borderless?: ?boolean,
   rippleRadius?: ?number,
+  alpha?: ?number,
 }>;
 
 type AndroidDrawable = AndroidDrawableThemeAttr | AndroidDrawableRipple;

package/Libraries/Core/Devtools/loadBundleFromServer.js

@@ -15,6 +15,11 @@ import getDevServer from './getDevServer';
 
 declare var global: {
   globalEvalWithSourceUrl?: (string, string) => unknown,
+  __BUNDLE_LOADER_REPORTER__?: {
+    onStart: (url: string | URL) => void,
+    onSuccess: (url: string | URL) => void,
+    onError: (url: string | URL, error: Error) => void,
+  },
   ...
 };
 
@@ -153,6 +158,7 @@ export default function loadBundleFromServer(
   }
   DevLoadingView.showMessage('Downloading...', 'load');
   ++pendingRequests;
+  global.__BUNDLE_LOADER_REPORTER__?.onStart(requestUrl);
 
   loadPromise = asyncRequest(requestUrl)
     .then<void>(({body, headers}) => {
@@ -183,9 +189,11 @@ export default function loadBundleFromServer(
         // eslint-disable-next-line no-eval
         eval(body);
       }
+      global.__BUNDLE_LOADER_REPORTER__?.onSuccess(requestUrl);
     })
     .catch<void>(e => {
       cachedPromisesByUrl.delete(requestUrl);
+      global.__BUNDLE_LOADER_REPORTER__?.onError(requestUrl, e);
       throw e;
     })
     .finally(() => {

package/Libraries/Core/ExceptionsManager.js

@@ -137,7 +137,7 @@ function reportException(
 declare var console: {
   error: (...data: ReadonlyArray<unknown>) => void,
   _errorOriginal: (...data: ReadonlyArray<unknown>) => void,
-  reportErrorsAsExceptions: boolean,
+  reportErrorsAsExceptions?: boolean,
   ...
 };
 
@@ -182,7 +182,7 @@ function handleException(e: unknown, isFatal: boolean) {
 function reactConsoleErrorHandler(...args) {
   // bubble up to any original handlers
   console._errorOriginal(...args);
-  if (!console.reportErrorsAsExceptions) {
+  if (console.reportErrorsAsExceptions === false) {
     return;
   }
   if (inExceptionHandler || global.RN$inExceptionHandler?.()) {
@@ -272,18 +272,12 @@ function reactConsoleErrorHandler(...args) {
  * setting `console.reportErrorsAsExceptions = false;` in your app.
  */
 function installConsoleErrorReporter() {
-  // Enable reportErrorsAsExceptions
   if (console._errorOriginal) {
     return; // already installed
   }
   // Flow doesn't like it when you set arbitrary values on a global object
   console._errorOriginal = console.error.bind(console);
   console.error = reactConsoleErrorHandler;
-  if (console.reportErrorsAsExceptions === undefined) {
-    // Individual apps can disable this
-    // Flow doesn't like it when you set arbitrary values on a global object
-    console.reportErrorsAsExceptions = true;
-  }
 }
 
 const ExceptionsManager = {

package/Libraries/Core/InitializeCore.js

@@ -26,17 +26,4 @@
 
 'use strict';
 
-const start = Date.now();
-
 require('../../src/private/setup/setUpDefaultReactNativeEnvironment').default();
-
-const GlobalPerformanceLogger =
-  require('../Utilities/GlobalPerformanceLogger').default;
-// We could just call GlobalPerformanceLogger.markPoint at the top of the file,
-// but then we'd be excluding the time it took to require the logger.
-// Instead, we just use Date.now and backdate the timestamp.
-GlobalPerformanceLogger.markPoint(
-  'initializeCore_start',
-  GlobalPerformanceLogger.currentTimestamp() - (Date.now() - start),
-);
-GlobalPerformanceLogger.markPoint('initializeCore_end');

package/Libraries/Core/ReactFiberErrorDialog.js

@@ -33,17 +33,17 @@ const ReactFiberErrorDialog = {
       /* $FlowFixMe[class-object-subtyping] added when improving typing for
        * this parameters */
       // $FlowFixMe[incompatible-type]
-      error = (errorValue: ExtendedError);
+      error = errorValue as ExtendedError;
     } else if (typeof errorValue === 'string') {
       /* $FlowFixMe[class-object-subtyping] added when improving typing for
        * this parameters */
       // $FlowFixMe[incompatible-type]
-      error = (new SyntheticError(errorValue): ExtendedError);
+      error = new SyntheticError(errorValue) as ExtendedError;
     } else {
       /* $FlowFixMe[class-object-subtyping] added when improving typing for
        * this parameters */
       // $FlowFixMe[incompatible-type]
-      error = (new SyntheticError('Unspecified error'): ExtendedError);
+      error = new SyntheticError('Unspecified error') as ExtendedError;
     }
     try {
       error.componentStack = componentStack;

package/Libraries/Core/ReactNativeVersion.js

@@ -27,7 +27,7 @@
  */
 export default class ReactNativeVersion {
   static major: number = 0;
-  static minor: number = 85;
+  static minor: number = 86;
   static patch: number = 0;
   static prerelease: string | null = null;
 

package/Libraries/Core/ReactNativeVersionCheck.js

@@ -29,7 +29,7 @@ export function checkVersions(): void {
   ) {
     console.error(
       `React Native version mismatch.\n\nJavaScript version: ${_formatVersion(
-        (ReactNativeVersion.version: $FlowFixMe),
+        ReactNativeVersion.version as $FlowFixMe,
       )}\n` +
         `Native version: ${_formatVersion(nativeVersion)}\n\n` +
         'Make sure that you have rebuilt the native code. If the problem ' +

package/Libraries/Core/Timers/JSTimers.js

@@ -476,11 +476,11 @@ let ExportedJSTimers: {
 if (!NativeTiming) {
   console.warn("Timing native module is not available, can't set timers.");
   // $FlowFixMe[incompatible-type] : we can assume timers are generally available
-  ExportedJSTimers = ({
+  ExportedJSTimers = {
     callReactNativeMicrotasks: JSTimers.callReactNativeMicrotasks,
     queueReactNativeMicrotask: JSTimers.queueReactNativeMicrotask,
     // $FlowFixMe[incompatible-variance]
-  }: typeof JSTimers);
+  } as typeof JSTimers;
 } else {
   // $FlowFixMe[incompatible-variance]
   ExportedJSTimers = JSTimers;

package/Libraries/Core/Timers/immediateShim.js

@@ -55,7 +55,7 @@ export function setImmediate(callback: Function, ...args: any): number {
 }
 
 /**
- * @param {number} immediateID The ID of the immediate to be clearred.
+ * @param {number} immediateID The ID of the immediate to be cleared.
  */
 export function clearImmediate(immediateID: number) {
   clearedImmediates.add(immediateID);

package/Libraries/Core/setUpBatchedBridge.js

@@ -27,7 +27,7 @@ registerModule(
 );
 registerModule(
   'GlobalPerformanceLogger',
-  () => require('../Utilities/GlobalPerformanceLogger').default,
+  () => require('../ReactNative/DeprecatedPerformanceLoggerStub').default,
 );
 
 if (__DEV__) {

package/Libraries/Core/setUpSegmentFetcher.js

@@ -40,7 +40,7 @@ function __fetchSegment(
     ) => {
       if (errorObject) {
         const error = new Error(errorObject.message);
-        (error: any).code = errorObject.code; // flowlint-line unclear-type: off
+        (error as any).code = errorObject.code; // flowlint-line unclear-type: off
         callback(error);
         return;
       }

package/Libraries/Debugging/DebuggingOverlayRegistry.js

@@ -34,7 +34,7 @@ import processColor from '../StyleSheet/processColor';
 
 // TODO(T171193075): __REACT_DEVTOOLS_GLOBAL_HOOK__ is always injected in dev-bundles,
 // but it is not mocked in some Jest tests. We should update Jest tests setup, so it would be the same as expected testing environment.
-const reactDevToolsHook: ?ReactDevToolsGlobalHook = (window: $FlowFixMe)
+const reactDevToolsHook: ?ReactDevToolsGlobalHook = (window as $FlowFixMe)
   .__REACT_DEVTOOLS_GLOBAL_HOOK__;
 
 export type DebuggingOverlayRegistrySubscriberProtocol = {

package/Libraries/EventEmitter/NativeEventEmitter.js

@@ -45,7 +45,7 @@ type UnsafeNativeEventObject = Object;
  * can theoretically listen to `RCTDeviceEventEmitter` (although discouraged).
  */
 export default class NativeEventEmitter<
-  TEventToArgsMap: Readonly<
+  TEventToArgsMap extends Readonly<
     Record<string, ReadonlyArray<UnsafeNativeEventObject>>,
   > = Readonly<Record<string, ReadonlyArray<UnsafeNativeEventObject>>>,
 > implements IEventEmitter<TEventToArgsMap>
@@ -83,7 +83,7 @@ export default class NativeEventEmitter<
     }
   }
 
-  addListener<TEvent: keyof TEventToArgsMap>(
+  addListener<TEvent extends keyof TEventToArgsMap>(
     eventType: TEvent,
     listener: (...args: TEventToArgsMap[TEvent]) => unknown,
     context?: unknown,
@@ -107,7 +107,7 @@ export default class NativeEventEmitter<
     };
   }
 
-  emit<TEvent: keyof TEventToArgsMap>(
+  emit<TEvent extends keyof TEventToArgsMap>(
     eventType: TEvent,
     ...args: TEventToArgsMap[TEvent]
   ): void {
@@ -116,7 +116,9 @@ export default class NativeEventEmitter<
     RCTDeviceEventEmitter.emit(eventType, ...args);
   }
 
-  removeAllListeners<TEvent: keyof TEventToArgsMap>(eventType?: ?TEvent): void {
+  removeAllListeners<TEvent extends keyof TEventToArgsMap>(
+    eventType?: ?TEvent,
+  ): void {
     invariant(
       eventType != null,
       '`NativeEventEmitter.removeAllListener()` requires a non-null argument.',
@@ -125,7 +127,9 @@ export default class NativeEventEmitter<
     RCTDeviceEventEmitter.removeAllListeners(eventType);
   }
 
-  listenerCount<TEvent: keyof TEventToArgsMap>(eventType: TEvent): number {
+  listenerCount<TEvent extends keyof TEventToArgsMap>(
+    eventType: TEvent,
+  ): number {
     return RCTDeviceEventEmitter.listenerCount(eventType);
   }
 }

package/Libraries/EventEmitter/RCTDeviceEventEmitter.js

@@ -25,7 +25,7 @@ type RCTDeviceEventDefinitions = {[name: string]: Array<any>};
  */
 class RCTDeviceEventEmitterImpl extends EventEmitter<RCTDeviceEventDefinitions> {
   // Add systrace to RCTDeviceEventEmitter.emit method for debugging
-  emit<TEvent: keyof RCTDeviceEventDefinitions>(
+  emit<TEvent extends keyof RCTDeviceEventDefinitions>(
     eventType: TEvent,
     ...args: RCTDeviceEventDefinitions[TEvent]
   ): void {
@@ -45,4 +45,4 @@ Object.defineProperty(global, '__rctDeviceEventEmitter', {
   value: RCTDeviceEventEmitter,
 });
 
-export default (RCTDeviceEventEmitter: IEventEmitter<RCTDeviceEventDefinitions>);
+export default RCTDeviceEventEmitter as IEventEmitter<RCTDeviceEventDefinitions>;