react-native-windows 0.83.0-preview.2 → 0.84.0-preview.2

package/.flowconfig

@@ -143,7 +143,7 @@ module.name_mapper='^react-native-windows$' -> '<PROJECT_ROOT>/index.windows.js'
 module.name_mapper='^react-native/\(.*\)$' -> '<PROJECT_ROOT>/\1'
 module.name_mapper='^react-native-windows/\(.*\)$' -> '<PROJECT_ROOT>/\1'
 module.name_mapper='^@react-native/dev-middleware$' -> '<PROJECT_ROOT>/\1'
-module.name_mapper='^@?[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\|xml\|ktx\)$' -> '<PROJECT_ROOT>/Libraries/Image/RelativeImageStub'
+module.name_mapper='^@?[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\|xml\|ktx\|heic\|heif\)$' -> '<PROJECT_ROOT>/Libraries/Image/RelativeImageStub'
 
 module.system.haste.module_ref_prefix=m#
 
@@ -173,4 +173,4 @@ untyped-import
 untyped-type-import
 
 [version]
-^0.289.0
+^0.295.0

package/Folly/Folly.vcxproj

@@ -77,6 +77,8 @@
     <ClCompile Include="$(FollyDir)\folly\ScopeGuard.cpp" />
     <ClCompile Include="$(FollyDir)\folly\Unicode.cpp" />
     <ClCompile Include="$(FollyDir)\folly\memory\detail\MallocImpl.cpp" />
+    <ClCompile Include="$(FollyDir)\folly\memory\SanitizeLeak.cpp" />
+    <ClCompile Include="$(FollyDir)\folly\lang\Exception.cpp" />
     <ClCompile Include="pch.cpp">
       <PrecompiledHeader>Create</PrecompiledHeader>
     </ClCompile>

package/Libraries/Animated/AnimatedEvent.js

@@ -25,7 +25,7 @@ export type Mapping =
   | AnimatedValue
   | AnimatedValueXY;
 export type EventConfig<T> = {
-  listener?: ?(NativeSyntheticEvent<T>) => mixed,
+  listener?: ?(NativeSyntheticEvent<T>) => unknown,
   useNativeDriver: boolean,
   platformConfig?: PlatformConfig,
 };
@@ -40,7 +40,7 @@ export function attachNativeEventImpl(
   // key path inside the `nativeEvent` object. Ex.: ['contentOffset', 'x'].
   const eventMappings: Array<EventMapping> = [];
 
-  const traverse = (value: mixed, path: Array<string>) => {
+  const traverse = (value: unknown, path: Array<string>) => {
     if (value instanceof AnimatedValue) {
       value.__makeNative(platformConfig);
 

package/Libraries/Animated/animations/Animation.js

@@ -151,9 +151,7 @@ export default class Animation {
             animatedValue.__onAnimatedValueUpdateReceived(value, offset);
 
             const isJsSyncRemoved =
-              ReactNativeFeatureFlags.cxxNativeAnimatedEnabled() &&
-              !ReactNativeFeatureFlags.disableFabricCommitInCXXAnimated() &&
-              ReactNativeFeatureFlags.cxxNativeAnimatedRemoveJsSync();
+              ReactNativeFeatureFlags.cxxNativeAnimatedEnabled();
             if (!isJsSyncRemoved) {
               if (this.__isLooping === true) {
                 return;

package/Libraries/Animated/createAnimatedComponent.js

@@ -8,6 +8,7 @@
  * @format
  */
 
+import type {NativeColorValue} from '../StyleSheet/StyleSheetTypes';
 import type AnimatedAddition from './nodes/AnimatedAddition';
 import type AnimatedDiffClamp from './nodes/AnimatedDiffClamp';
 import type AnimatedDivision from './nodes/AnimatedDivision';
@@ -28,7 +29,7 @@ import {useMemo} from 'react';
 
 type Nullable = void | null;
 type Primitive = string | number | boolean | symbol | void;
-type Builtin = (...$ReadOnlyArray<empty>) => mixed | Date | Error | RegExp;
+type Builtin = (...$ReadOnlyArray<empty>) => unknown | Date | Error | RegExp;
 
 export type WithAnimatedValue<+T> = T extends Builtin | Nullable
   ? T
@@ -46,6 +47,7 @@ export type WithAnimatedValue<+T> = T extends Builtin | Nullable
         | AnimatedInterpolation<number | string>
         | AnimatedInterpolation<number>
         | AnimatedInterpolation<string>
+        | AnimatedInterpolation<NativeColorValue>
     : T extends $ReadOnlyArray<infer P>
       ? $ReadOnlyArray<WithAnimatedValue<P>>
       : T extends {...}
@@ -87,10 +89,10 @@ export type AnimatedBaseProps<Props: {...}> = LooseOmit<
   'ref',
 >;
 
-export type AnimatedComponentType<Props: {...}, +Instance = mixed> = component(
-  ref?: React.RefSetter<Instance>,
-  ...AnimatedProps<Props>
-);
+export type AnimatedComponentType<
+  Props: {...},
+  +Instance = unknown,
+> = component(ref?: React.RefSetter<Instance>, ...AnimatedProps<Props>);
 
 export default function createAnimatedComponent<
   TInstance: React.ComponentType<any>,
@@ -125,6 +127,7 @@ export function unstable_createAnimatedComponentWithAllowlist<
     const [reducedProps, callbackRef] = useAnimatedProps<
       TProps,
       React.ElementRef<TInstance>,
+      // $FlowFixMe[incompatible-type]
     >(props);
     const ref = useMergeRefs<React.ElementRef<TInstance>>(
       callbackRef,

package/Libraries/Animated/nodes/AnimatedColor.js

@@ -27,7 +27,7 @@ export type AnimatedColorConfig = $ReadOnly<{
   useNativeDriver: boolean,
 }>;
 
-type ColorListenerCallback = (value: ColorValue) => mixed;
+type ColorListenerCallback = (value: ColorValue) => unknown;
 
 export type RgbaValue = {
   +r: number,

package/Libraries/Animated/nodes/AnimatedInterpolation.js

@@ -12,6 +12,7 @@
 
 'use strict';
 
+import type {NativeColorValue} from '../../StyleSheet/StyleSheetTypes';
 import type {PlatformConfig} from '../AnimatedPlatformConfig';
 import type AnimatedNode from './AnimatedNode';
 import type {AnimatedNodeConfig} from './AnimatedNode';
@@ -26,7 +27,14 @@ import invariant from 'invariant';
 
 type ExtrapolateType = 'extend' | 'identity' | 'clamp';
 
-export type InterpolationConfigType<OutputT: number | string> = $ReadOnly<{
+export type InterpolationConfigSupportedOutputType =
+  | number
+  | string
+  | NativeColorValue;
+
+export type InterpolationConfigType<
+  OutputT: InterpolationConfigSupportedOutputType,
+> = $ReadOnly<{
   ...AnimatedNodeConfig,
   inputRange: $ReadOnlyArray<number>,
   outputRange: $ReadOnlyArray<OutputT>,
@@ -82,6 +90,28 @@ function createNumericInterpolation(
   };
 }
 
+function createPlatformColorInterpolation(
+  config: InterpolationConfigType<NativeColorValue>,
+): (input: number) => NativeColorValue {
+  const outputRange = config.outputRange;
+  const outputRangeIndices = Array.from(Array(outputRange.length).keys());
+  const interpolateIndex = createNumericInterpolation({
+    ...config,
+    inputRange: config.inputRange,
+    outputRange: outputRangeIndices,
+  });
+
+  return input => {
+    const interpolateResult = interpolateIndex(input);
+    if (!Number.isInteger(interpolateResult)) {
+      console.warn(
+        'PlatformColor interpolation should happen natively, here we fallback to the closest color',
+      );
+    }
+    return outputRange[Math.floor(interpolateResult)];
+  };
+}
+
 function interpolate(
   input: number,
   inputMin: number,
@@ -277,7 +307,7 @@ function findRange(input: number, inputRange: $ReadOnlyArray<number>) {
   return i - 1;
 }
 
-function checkValidRanges<OutputT: number | string>(
+function checkValidRanges<OutputT: InterpolationConfigSupportedOutputType>(
   inputRange: $ReadOnlyArray<number>,
   outputRange: $ReadOnlyArray<OutputT>,
 ) {
@@ -304,7 +334,7 @@ function checkValidInputRange(arr: $ReadOnlyArray<number>) {
   }
 }
 
-function checkInfiniteRange<OutputT: number | string>(
+function checkInfiniteRange<OutputT: InterpolationConfigSupportedOutputType>(
   name: string,
   arr: $ReadOnlyArray<OutputT>,
 ) {
@@ -322,7 +352,7 @@ function checkInfiniteRange<OutputT: number | string>(
 }
 
 export default class AnimatedInterpolation<
-  OutputT: number | string,
+  OutputT: InterpolationConfigSupportedOutputType,
 > extends AnimatedWithChildren {
   _parent: AnimatedNode;
   _config: InterpolationConfigType<OutputT>;
@@ -347,6 +377,10 @@ export default class AnimatedInterpolation<
       const config = this._config;
       if (config.outputRange && typeof config.outputRange[0] === 'string') {
         this._interpolation = (createStringInterpolation((config: any)): any);
+      } else if (typeof config.outputRange[0] === 'object') {
+        this._interpolation = (createPlatformColorInterpolation(
+          (config: any),
+        ): any);
       } else {
         this._interpolation = (createNumericInterpolation((config: any)): any);
       }
@@ -403,6 +437,8 @@ export default class AnimatedInterpolation<
           return NativeAnimatedHelper.transformDataType(value);
         }
       }): any);
+    } else if (typeof outputRange[0] === 'object') {
+      outputType = 'platform_color';
     }
 
     return {

package/Libraries/Animated/nodes/AnimatedNode.js

@@ -13,7 +13,7 @@ import type {PlatformConfig} from '../AnimatedPlatformConfig';
 import NativeAnimatedHelper from '../../../src/private/animated/NativeAnimatedHelper';
 import invariant from 'invariant';
 
-type ValueListenerCallback = (state: {value: number, ...}) => mixed;
+type ValueListenerCallback = (state: {value: number, ...}) => unknown;
 
 export type AnimatedNodeConfig = $ReadOnly<{
   debugID?: string,
@@ -87,7 +87,7 @@ export default class AnimatedNode {
    *
    * See https://reactnative.dev/docs/animatedvalue#addlistener
    */
-  addListener(callback: (value: any) => mixed): string {
+  addListener(callback: (value: any) => unknown): string {
     const id = String(_uniqueId++);
     this._listeners.set(id, callback);
     return id;
@@ -172,7 +172,7 @@ export default class AnimatedNode {
    * NOTE: This is intended to prevent `JSON.stringify` from throwing "cyclic
    * structure" errors in React DevTools. Avoid depending on this!
    */
-  toJSON(): mixed {
+  toJSON(): unknown {
     return this.__getValue();
   }
 

package/Libraries/Animated/nodes/AnimatedObject.js

@@ -20,21 +20,26 @@ import {isValidElement} from 'react';
 const MAX_DEPTH = 5;
 
 export function isPlainObject(
-  value: mixed,
+  value: unknown,
   /* $FlowFixMe[incompatible-type-guard] - Flow does not know that the prototype
      and ReactElement checks preserve the type refinement of `value`. */
-): value is $ReadOnly<{[string]: mixed}> {
+): value is $ReadOnly<{[string]: unknown}> {
+  const proto =
+    value !== null && typeof value === 'object'
+      ? Object.getPrototypeOf(value)
+      : undefined;
+  if (proto === undefined) {
+    // $FlowFixMe[incompatible-type-guard]
+    return false;
+  }
   return (
     // $FlowFixMe[incompatible-type-guard]
-    value !== null &&
-    typeof value === 'object' &&
-    Object.getPrototypeOf(value).isPrototypeOf(Object) &&
-    !isValidElement(value)
+    (proto == null || proto.isPrototypeOf(Object)) && !isValidElement(value)
   );
 }
 
 function flatAnimatedNodes(
-  value: mixed,
+  value: unknown,
   nodes: Array<AnimatedNode> = [],
   depth: number = 0,
 ): Array<AnimatedNode> {
@@ -83,13 +88,13 @@ function mapAnimatedNodes(value: any, fn: any => any, depth: number = 0): any {
 
 export default class AnimatedObject extends AnimatedWithChildren {
   _nodes: $ReadOnlyArray<AnimatedNode>;
-  _value: mixed;
+  _value: unknown;
 
   /**
    * Creates an `AnimatedObject` if `value` contains `AnimatedNode` instances.
    * Otherwise, returns `null`.
    */
-  static from(value: mixed): ?AnimatedObject {
+  static from(value: unknown): ?AnimatedObject {
     const nodes = flatAnimatedNodes(value);
     if (nodes.length === 0) {
       return null;
@@ -102,7 +107,7 @@ export default class AnimatedObject extends AnimatedWithChildren {
    */
   constructor(
     nodes: $ReadOnlyArray<AnimatedNode>,
-    value: mixed,
+    value: unknown,
     config?: ?AnimatedNodeConfig,
   ) {
     super(config);
@@ -116,7 +121,7 @@ export default class AnimatedObject extends AnimatedWithChildren {
     });
   }
 
-  __getValueWithStaticObject(staticObject: mixed): any {
+  __getValueWithStaticObject(staticObject: unknown): any {
     const nodes = this._nodes;
     let index = 0;
     // NOTE: We can depend on `this._value` and `staticObject` sharing a

package/Libraries/Animated/nodes/AnimatedProps.js

@@ -8,12 +8,15 @@
  * @format
  */
 
+import type {RootTag} from '../../Types/RootTagTypes';
 import type {PlatformConfig} from '../AnimatedPlatformConfig';
 import type {AnimatedNodeConfig} from './AnimatedNode';
 import type {AnimatedStyleAllowlist} from './AnimatedStyle';
 
 import NativeAnimatedHelper from '../../../src/private/animated/NativeAnimatedHelper';
+import * as ReactNativeFeatureFlags from '../../../src/private/featureflags/ReactNativeFeatureFlags';
 import {findNodeHandle} from '../../ReactNative/RendererProxy';
+import {getNodeFromPublicInstance} from '../../ReactPrivate/ReactNativePrivateInterface';
 import flattenStyle from '../../StyleSheet/flattenStyle';
 import {AnimatedEvent} from '../AnimatedEvent';
 import AnimatedNode from './AnimatedNode';
@@ -33,12 +36,12 @@ type TargetView = {
 type TargetViewInstance = React.ElementRef<React.ElementType>;
 
 function createAnimatedProps(
-  inputProps: {[string]: mixed},
+  inputProps: {[string]: unknown},
   allowlist: ?AnimatedPropsAllowlist,
-): [$ReadOnlyArray<string>, $ReadOnlyArray<AnimatedNode>, {[string]: mixed}] {
+): [$ReadOnlyArray<string>, $ReadOnlyArray<AnimatedNode>, {[string]: unknown}] {
   const nodeKeys: Array<string> = [];
   const nodes: Array<AnimatedNode> = [];
-  const props: {[string]: mixed} = {};
+  const props: {[string]: unknown} = {};
 
   const keys = Object.keys(inputProps);
   for (let ii = 0, length = keys.length; ii < length; ii++) {
@@ -95,13 +98,15 @@ export default class AnimatedProps extends AnimatedNode {
   _callback: () => void;
   _nodeKeys: $ReadOnlyArray<string>;
   _nodes: $ReadOnlyArray<AnimatedNode>;
-  _props: {[string]: mixed};
+  _props: {[string]: unknown};
   _target: ?TargetView = null;
+  _rootTag: ?RootTag = undefined;
 
   constructor(
-    inputProps: {[string]: mixed},
+    inputProps: {[string]: unknown},
     callback: () => void,
     allowlist?: ?AnimatedPropsAllowlist,
+    rootTag?: RootTag,
     config?: ?AnimatedNodeConfig,
   ) {
     super(config);
@@ -110,10 +115,11 @@ export default class AnimatedProps extends AnimatedNode {
     this._nodes = nodes;
     this._props = props;
     this._callback = callback;
+    this._rootTag = rootTag;
   }
 
   __getValue(): Object {
-    const props: {[string]: mixed} = {};
+    const props: {[string]: unknown} = {};
 
     const keys = Object.keys(this._props);
     for (let ii = 0, length = keys.length; ii < length; ii++) {
@@ -138,7 +144,7 @@ export default class AnimatedProps extends AnimatedNode {
    * created by this `AnimatedProps` instance.
    */
   __getValueWithStaticProps(staticProps: Object): Object {
-    const props: {[string]: mixed} = {...staticProps};
+    const props: {[string]: unknown} = {...staticProps};
 
     const keys = Object.keys(staticProps);
     for (let ii = 0, length = keys.length; ii < length; ii++) {
@@ -149,7 +155,7 @@ export default class AnimatedProps extends AnimatedNode {
         const staticStyle = staticProps.style;
         const flatStaticStyle = flattenStyle(staticStyle);
         if (maybeNode instanceof AnimatedStyle) {
-          const mutableStyle: {[string]: mixed} =
+          const mutableStyle: {[string]: unknown} =
             flatStaticStyle == null
               ? {}
               : flatStaticStyle === staticStyle
@@ -190,7 +196,7 @@ export default class AnimatedProps extends AnimatedNode {
   }
 
   __getAnimatedValue(): Object {
-    const props: {[string]: mixed} = {};
+    const props: {[string]: unknown} = {};
 
     const nodeKeys = this._nodeKeys;
     const nodes = this._nodes;
@@ -247,7 +253,9 @@ export default class AnimatedProps extends AnimatedNode {
       super.__setPlatformConfig(platformConfig);
 
       if (this._target != null) {
-        this.#connectAnimatedView(this._target);
+        const target = this._target;
+        this.#connectAnimatedView(target);
+        this.#connectShadowNode(target);
       }
     }
   }
@@ -256,9 +264,10 @@ export default class AnimatedProps extends AnimatedNode {
     if (this._target?.instance === instance) {
       return;
     }
-    this._target = {instance, connectedViewTag: null};
+    const target = (this._target = {instance, connectedViewTag: null});
     if (this.__isNative) {
-      this.#connectAnimatedView(this._target);
+      this.#connectAnimatedView(target);
+      this.#connectShadowNode(target);
     }
   }
 
@@ -279,6 +288,27 @@ export default class AnimatedProps extends AnimatedNode {
     target.connectedViewTag = viewTag;
   }
 
+  #connectShadowNode(target: TargetView): void {
+    if (
+      !ReactNativeFeatureFlags.cxxNativeAnimatedEnabled() ||
+      //eslint-disable-next-line
+      !ReactNativeFeatureFlags.useSharedAnimatedBackend()
+    ) {
+      return;
+    }
+
+    invariant(this.__isNative, 'Expected node to be marked as "native"');
+    // $FlowExpectedError[incompatible-type] - target.instance may be an HTMLElement but we need ReactNativeElement for Fabric
+    const shadowNode = getNodeFromPublicInstance(target.instance);
+    if (shadowNode == null) {
+      return;
+    }
+    NativeAnimatedHelper.API.connectAnimatedNodeToShadowNodeFamily(
+      this.__getNativeTag(),
+      shadowNode,
+    );
+  }
+
   #disconnectAnimatedView(target: TargetView): void {
     invariant(this.__isNative, 'Expected node to be marked as "native"');
     const viewTag = target.connectedViewTag;
@@ -318,6 +348,7 @@ export default class AnimatedProps extends AnimatedNode {
     return {
       type: 'props',
       props: propsConfig,
+      rootTag: this._rootTag ?? undefined,
       debugID: this.__getDebugID(),
     };
   }

package/Libraries/Animated/nodes/AnimatedStyle.js

@@ -21,17 +21,17 @@ import AnimatedWithChildren from './AnimatedWithChildren';
 
 export type AnimatedStyleAllowlist = $ReadOnly<{[string]: true}>;
 
-type FlatStyle = {[string]: mixed};
-type FlatStyleForWeb<TStyle: FlatStyle> = [mixed, TStyle];
+type FlatStyle = {[string]: unknown};
+type FlatStyleForWeb<TStyle: FlatStyle> = [unknown, TStyle];
 
 function createAnimatedStyle(
   flatStyle: FlatStyle,
   allowlist: ?AnimatedStyleAllowlist,
   keepUnanimatedValues: boolean,
-): [$ReadOnlyArray<string>, $ReadOnlyArray<AnimatedNode>, {[string]: mixed}] {
+): [$ReadOnlyArray<string>, $ReadOnlyArray<AnimatedNode>, {[string]: unknown}] {
   const nodeKeys: Array<string> = [];
   const nodes: Array<AnimatedNode> = [];
-  const style: {[string]: mixed} = {};
+  const style: {[string]: unknown} = {};
 
   const keys = Object.keys(flatStyle);
   for (let ii = 0, length = keys.length; ii < length; ii++) {
@@ -82,10 +82,10 @@ function createAnimatedStyle(
 }
 
 export default class AnimatedStyle extends AnimatedWithChildren {
-  _originalStyleForWeb: ?mixed;
+  _originalStyleForWeb: ?unknown;
   _nodeKeys: $ReadOnlyArray<string>;
   _nodes: $ReadOnlyArray<AnimatedNode>;
-  _style: {[string]: mixed};
+  _style: {[string]: unknown};
 
   /**
    * Creates an `AnimatedStyle` if `value` contains `AnimatedNode` instances.
@@ -94,7 +94,7 @@ export default class AnimatedStyle extends AnimatedWithChildren {
   static from(
     flatStyle: ?FlatStyle,
     allowlist: ?AnimatedStyleAllowlist,
-    originalStyleForWeb: ?mixed,
+    originalStyleForWeb: ?unknown,
   ): ?AnimatedStyle {
     if (flatStyle == null) {
       return null;
@@ -115,8 +115,8 @@ export default class AnimatedStyle extends AnimatedWithChildren {
   constructor(
     nodeKeys: $ReadOnlyArray<string>,
     nodes: $ReadOnlyArray<AnimatedNode>,
-    style: {[string]: mixed},
-    originalStyleForWeb: ?mixed,
+    style: {[string]: unknown},
+    originalStyleForWeb: ?unknown,
     config?: ?AnimatedNodeConfig,
   ) {
     super(config);
@@ -134,7 +134,7 @@ export default class AnimatedStyle extends AnimatedWithChildren {
   }
 
   __getValue(): FlatStyleForWeb<FlatStyle> | FlatStyle {
-    const style: {[string]: mixed} = {};
+    const style: {[string]: unknown} = {};
 
     const keys = Object.keys(this._style);
     for (let ii = 0, length = keys.length; ii < length; ii++) {
@@ -164,7 +164,7 @@ export default class AnimatedStyle extends AnimatedWithChildren {
    * Mutates the supplied `style` object such that animated nodes are replaced
    * with rasterized values.
    */
-  __replaceAnimatedNodeWithValues(style: {[string]: mixed}): void {
+  __replaceAnimatedNodeWithValues(style: {[string]: unknown}): void {
     const keys = Object.keys(style);
     for (let ii = 0, length = keys.length; ii < length; ii++) {
       const key = keys[ii];
@@ -185,7 +185,7 @@ export default class AnimatedStyle extends AnimatedWithChildren {
   }
 
   __getAnimatedValue(): Object {
-    const style: {[string]: mixed} = {};
+    const style: {[string]: unknown} = {};
 
     const nodeKeys = this._nodeKeys;
     const nodes = this._nodes;

package/Libraries/Animated/nodes/AnimatedValue.js

@@ -12,7 +12,10 @@ import type {EventSubscription} from '../../vendor/emitter/EventEmitter';
 import type {PlatformConfig} from '../AnimatedPlatformConfig';
 import type Animation from '../animations/Animation';
 import type {EndCallback} from '../animations/Animation';
-import type {InterpolationConfigType} from './AnimatedInterpolation';
+import type {
+  InterpolationConfigSupportedOutputType,
+  InterpolationConfigType,
+} from './AnimatedInterpolation';
 import type AnimatedNode from './AnimatedNode';
 import type {AnimatedNodeConfig} from './AnimatedNode';
 import type AnimatedTracking from './AnimatedTracking';
@@ -131,7 +134,7 @@ export default class AnimatedValue extends AnimatedWithChildren {
     }
   }
 
-  addListener(callback: (value: any) => mixed): string {
+  addListener(callback: (value: any) => unknown): string {
     const id = super.addListener(callback);
     this._listenerCount++;
     if (this.__isNative) {
@@ -298,7 +301,7 @@ export default class AnimatedValue extends AnimatedWithChildren {
    * Interpolates the value before updating the property, e.g. mapping 0-1 to
    * 0-10.
    */
-  interpolate<OutputT: number | string>(
+  interpolate<OutputT: InterpolationConfigSupportedOutputType>(
     config: InterpolationConfigType<OutputT>,
   ): AnimatedInterpolation<OutputT> {
     return new AnimatedInterpolation(this, config);

package/Libraries/Animated/nodes/AnimatedValueXY.js

@@ -21,7 +21,7 @@ export type AnimatedValueXYConfig = $ReadOnly<{
   ...AnimatedNodeConfig,
   useNativeDriver: boolean,
 }>;
-type ValueXYListenerCallback = (value: {x: number, y: number, ...}) => mixed;
+type ValueXYListenerCallback = (value: {x: number, y: number, ...}) => unknown;
 
 let _uniqueId = 1;