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

package/index.js

@@ -341,6 +341,9 @@ module.exports = {
   get useColorScheme() {
     return require('./Libraries/Utilities/useColorScheme').default;
   },
+  get usePressability() {
+    return require('./Libraries/Pressability/usePressability').default;
+  },
   get useWindowDimensions() {
     return require('./Libraries/Utilities/useWindowDimensions').default;
   },

package/index.windows.js

@@ -341,6 +341,9 @@ module.exports = {
   get useColorScheme() {
     return require('./Libraries/Utilities/useColorScheme').default;
   },
+  get usePressability() {
+    return require('./Libraries/Pressability/usePressability').default;
+  },
   get useWindowDimensions() {
     return require('./Libraries/Utilities/useWindowDimensions').default;
   },

package/jest/mock.js

@@ -16,7 +16,7 @@
  * If `factoryRef` is provided, it is expected to reference a module that
  * exports the same type signature as the module referenced by `moduleRef`.
  */
-export default function mock<TModuleRef: $Flow$ModuleRef<mixed>>(
+export default function mock<TModuleRef: $Flow$ModuleRef<unknown>>(
   moduleRef: TModuleRef,
   factoryRef?: NoInfer<TModuleRef>,
 ): void {
@@ -33,7 +33,7 @@ export default function mock<TModuleRef: $Flow$ModuleRef<mixed>>(
   }
 }
 
-function deref(ref: $Flow$ModuleRef<mixed>): string {
+function deref(ref: $Flow$ModuleRef<unknown>): string {
   // $FlowFixMe[incompatible-type]
   return (ref as string).substring(2);
 }

package/jest/mockComponent.js

@@ -39,7 +39,7 @@ export default function mockComponent<
 
   const SuperClass: typeof React.Component<{...}> =
     typeof RealComponent === 'function' &&
-    RealComponent.prototype.constructor instanceof React.Component
+    RealComponent.prototype?.constructor instanceof React.Component
       ? RealComponent
       : React.Component;
 

package/jest/setup.js

@@ -51,7 +51,7 @@ Object.defineProperties(global, {
   regeneratorRuntime: {
     configurable: true,
     enumerable: true,
-    value: jest.requireActual<mixed>('regenerator-runtime/runtime'),
+    value: jest.requireActual<unknown>('regenerator-runtime/runtime'),
     writable: true,
   },
   requestAnimationFrame: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-windows",
-  "version": "0.83.0-preview.2",
+  "version": "0.84.0-preview.2",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -26,16 +26,16 @@
     "@react-native-community/cli": "20.0.0",
     "@react-native-community/cli-platform-android": "20.0.0",
     "@react-native-community/cli-platform-ios": "20.0.0",
-    "@react-native-windows/cli": "0.83.0-preview.1",
+    "@react-native-windows/cli": "0.84.0-preview.1",
     "@react-native/assets": "1.0.0",
-    "@react-native/assets-registry": "0.83.0-rc.5",
-    "@react-native/codegen": "0.83.0-rc.5",
-    "@react-native/community-cli-plugin": "0.83.0-rc.5",
-    "@react-native/gradle-plugin": "0.83.0-rc.5",
-    "@react-native/js-polyfills": "0.83.0-rc.5",
-    "@react-native/new-app-screen": "0.83.0-rc.5",
-    "@react-native/normalize-colors": "0.83.0-rc.5",
-    "@react-native/virtualized-lists": "0.83.0-rc.5",
+    "@react-native/assets-registry": "0.84.1",
+    "@react-native/codegen": "0.84.1",
+    "@react-native/community-cli-plugin": "0.84.1",
+    "@react-native/gradle-plugin": "0.84.1",
+    "@react-native/js-polyfills": "0.84.1",
+    "@react-native/new-app-screen": "0.84.1",
+    "@react-native/normalize-colors": "0.84.1",
+    "@react-native/virtualized-lists": "0.84.1",
     "abort-controller": "^3.0.0",
     "anser": "^1.4.9",
     "ansi-regex": "^5.0.0",
@@ -47,7 +47,7 @@
     "event-target-shim": "^5.0.1",
     "flow-enums-runtime": "^0.0.6",
     "glob": "^7.1.1",
-    "hermes-compiler": "0.14.0",
+    "hermes-compiler": "250829098.0.9",
     "invariant": "^2.2.4",
     "jest-environment-node": "^29.7.0",
     "memoize-one": "^5.0.0",
@@ -64,13 +64,14 @@
     "semver": "^7.1.3",
     "source-map-support": "^0.5.19",
     "stacktrace-parser": "^0.1.10",
+    "tinyglobby": "^0.2.15",
     "whatwg-fetch": "^3.0.0",
     "ws": "^7.5.10",
     "yargs": "^17.6.2"
   },
   "devDependencies": {
-    "@react-native-windows/codegen": "0.83.0-preview.1",
-    "@react-native/metro-config": "0.83.0-rc.5",
+    "@react-native-windows/codegen": "0.84.0-preview.1",
+    "@react-native/metro-config": "0.84.1",
     "@rnw-scripts/babel-react-native-config": "0.0.0",
     "@rnw-scripts/eslint-config": "1.2.38",
     "@rnw-scripts/jest-out-of-tree-snapshot-resolver": "^1.1.42",
@@ -78,22 +79,22 @@
     "@rnw-scripts/metro-dev-config": "0.0.0",
     "@rnx-kit/jest-preset": "^0.3.1",
     "@types/node": "^22.14.0",
-    "@types/react": "^19.2.0",
+    "@types/react": "^19.2.3",
     "eslint": "^8.19.0",
-    "flow-bin": "^0.289.0",
+    "flow-bin": "^0.295.0",
     "jscodeshift": "^0.14.0",
     "just-scripts": "^1.3.3",
-    "prettier": "2.8.8",
-    "react": "19.2.0",
-    "react-native": "0.83.0-rc.5",
-    "react-native-platform-override": "0.83.0-preview.1",
+    "prettier": "^3.6.2",
+    "react": "19.2.3",
+    "react-native": "0.84.1",
+    "react-native-platform-override": "0.84.0-preview.1",
     "react-refresh": "^0.14.0",
     "typescript": "5.0.4"
   },
   "peerDependencies": {
     "@types/react": "^19.1.1",
-    "react": "^19.2.0",
-    "react-native": "0.83.0-rc.5"
+    "react": "^19.2.3",
+    "react-native": "0.84.1"
   },
   "beachball": {
     "defaultNpmTag": "preview",

package/src/private/animated/NativeAnimatedHelper.js

@@ -17,6 +17,8 @@ import type {
   AnimatedNodeConfig,
   EventMapping,
 } from '../../../Libraries/Animated/NativeAnimatedModule';
+import type {Spec as NativeAnimatedTurboModuleSpec} from '../../../Libraries/Animated/NativeAnimatedTurboModule';
+import type {Node} from '../../../Libraries/Renderer/shims/ReactNativeTypes';
 import type {EventSubscription} from '../../../Libraries/vendor/emitter/EventEmitter';
 
 import NativeAnimatedNonTurboModule from '../../../Libraries/Animated/NativeAnimatedModule';
@@ -28,8 +30,17 @@ import * as ReactNativeFeatureFlags from '../featureflags/ReactNativeFeatureFlag
 import invariant from 'invariant';
 import nullthrows from 'nullthrows';
 
+interface NativeAnimatedModuleSpec extends NativeAnimatedTurboModuleSpec {
+  // connectAnimatedNodeToShadowNodeFamily is available only in NativeAnimatedNonTurboModule
+  +connectAnimatedNodeToShadowNodeFamily?: (
+    nodeTag: number,
+    // $FlowExpectedError[unclear-type].
+    shadowNode: Object,
+  ) => void;
+}
+
 // TODO T69437152 @petetheheat - Delete this fork when Fabric ships to 100%.
-const NativeAnimatedModule: typeof NativeAnimatedTurboModule =
+const NativeAnimatedModule: ?NativeAnimatedModuleSpec =
   NativeAnimatedNonTurboModule ?? NativeAnimatedTurboModule;
 
 let __nativeAnimatedNodeTagCount = 1; /* used for animated nodes */
@@ -37,10 +48,10 @@ let __nativeAnimationIdCount = 1; /* used for started animations */
 
 let nativeEventEmitter;
 
-let waitingForQueuedOperations = new Set<string>();
+const waitingForQueuedOperations = new Set<string>();
 let queueOperations = false;
-let queue: Array<() => void> = [];
-let singleOpQueue: Array<mixed> = [];
+const queue: Array<() => void> = [];
+const singleOpQueue: Array<unknown> = [];
 
 const isSingleOpBatching =
   Platform.OS === 'android' &&
@@ -60,7 +71,7 @@ let globalEventEmitterAnimationFinishedListener: ?EventSubscription = null;
 const shouldSignalBatch: boolean =
   ReactNativeFeatureFlags.cxxNativeAnimatedEnabled();
 
-function createNativeOperations(): $NonMaybeType<typeof NativeAnimatedModule> {
+function createNativeOperations(): NonNullable<typeof NativeAnimatedModule> {
   const methodNames = [
     'createAnimatedNode', // 1
     'updateAnimatedNodeConfig', // 2
@@ -84,8 +95,15 @@ function createNativeOperations(): $NonMaybeType<typeof NativeAnimatedModule> {
     'addListener', // 20
     'removeListener', // 21
   ];
+  if (
+    ReactNativeFeatureFlags.cxxNativeAnimatedEnabled() &&
+    //eslint-disable-next-line
+    ReactNativeFeatureFlags.useSharedAnimatedBackend()
+  ) {
+    methodNames.push('connectAnimatedNodeToShadowNodeFamily');
+  }
   const nativeOperations: {
-    [$Values<typeof methodNames>]: (...$ReadOnlyArray<mixed>) => void,
+    [$Values<typeof methodNames>]: (...$ReadOnlyArray<unknown>) => void,
   } = {};
   if (isSingleOpBatching) {
     for (let ii = 0, length = methodNames.length; ii < length; ii++) {
@@ -138,49 +156,35 @@ const NativeOperations = createNativeOperations();
  * the native module methods, and automatic queue management on Android
  */
 const API = {
-  getValue: (isSingleOpBatching
-    ? (tag, saveValueCallback) => {
-        /* $FlowFixMe[constant-condition] Error discovered during Constant
-         * Condition roll out. See https://fburl.com/workplace/1v97vimq. */
-        if (saveValueCallback) {
-          eventListenerGetValueCallbacks[tag] = saveValueCallback;
-        }
-        /* $FlowExpectedError[incompatible-type] - `saveValueCallback` is handled
-            differently when `isSingleOpBatching` is enabled. */
-        NativeOperations.getValue(tag);
-      }
-    : (tag, saveValueCallback) => {
-        NativeOperations.getValue(tag, saveValueCallback);
-      }) as $NonMaybeType<typeof NativeAnimatedModule>['getValue'],
-
-  setWaitingForIdentifier(id: string): void {
-    if (shouldSignalBatch) {
-      return;
-    }
-
-    waitingForQueuedOperations.add(id);
-    queueOperations = true;
-    if (
-      ReactNativeFeatureFlags.animatedShouldDebounceQueueFlush() &&
-      flushQueueImmediate
-    ) {
-      clearImmediate(flushQueueImmediate);
-    }
+  addAnimatedEventToView(
+    viewTag: number,
+    eventName: string,
+    eventMapping: EventMapping,
+  ) {
+    NativeOperations.addAnimatedEventToView(viewTag, eventName, eventMapping);
   },
-
-  unsetWaitingForIdentifier(id: string): void {
-    if (shouldSignalBatch) {
-      return;
-    }
-
-    waitingForQueuedOperations.delete(id);
-
-    if (waitingForQueuedOperations.size === 0) {
-      queueOperations = false;
-      API.disableQueue();
+  connectAnimatedNodes(parentTag: number, childTag: number): void {
+    NativeOperations.connectAnimatedNodes(parentTag, childTag);
+  },
+  connectAnimatedNodeToShadowNodeFamily(
+    nodeTag: number,
+    shadowNode: Node,
+  ): void {
+    NativeOperations.connectAnimatedNodeToShadowNodeFamily?.(
+      nodeTag,
+      shadowNode,
+    );
+  },
+  connectAnimatedNodeToView(nodeTag: number, viewTag: number): void {
+    NativeOperations.connectAnimatedNodeToView(nodeTag, viewTag);
+  },
+  createAnimatedNode(tag: number, config: AnimatedNodeConfig): void {
+    if (config.disableBatchingForNativeCreate) {
+      NativeAnimatedModule?.createAnimatedNode(tag, config);
+    } else {
+      NativeOperations.createAnimatedNode(tag, config);
     }
   },
-
   disableQueue(): void {
     invariant(NativeAnimatedModule, 'Native animated module is not available');
 
@@ -192,7 +196,21 @@ const API = {
       API.flushQueue();
     }
   },
-
+  disconnectAnimatedNodeFromView(nodeTag: number, viewTag: number): void {
+    NativeOperations.disconnectAnimatedNodeFromView(nodeTag, viewTag);
+  },
+  disconnectAnimatedNodes(parentTag: number, childTag: number): void {
+    NativeOperations.disconnectAnimatedNodes(parentTag, childTag);
+  },
+  dropAnimatedNode(tag: number): void {
+    NativeOperations.dropAnimatedNode(tag);
+  },
+  extractAnimatedNodeOffset(nodeTag: number): void {
+    NativeOperations.extractAnimatedNodeOffset(nodeTag);
+  },
+  flattenAnimatedNodeOffset(nodeTag: number): void {
+    NativeOperations.flattenAnimatedNodeOffset(nodeTag);
+  },
   flushQueue: (isSingleOpBatching
     ? (): void => {
         invariant(
@@ -239,35 +257,54 @@ const API = {
           NativeAnimatedModule?.finishOperationBatch?.();
         }
       }) as () => void,
-
-  createAnimatedNode(tag: number, config: AnimatedNodeConfig): void {
-    if (config.disableBatchingForNativeCreate) {
-      NativeAnimatedModule?.createAnimatedNode(tag, config);
-    } else {
-      NativeOperations.createAnimatedNode(tag, config);
-    }
-  },
-
-  updateAnimatedNodeConfig(tag: number, config: AnimatedNodeConfig): void {
-    NativeOperations.updateAnimatedNodeConfig?.(tag, config);
+  getValue: (isSingleOpBatching
+    ? (tag, saveValueCallback) => {
+        /* $FlowFixMe[constant-condition] Error discovered during Constant
+         * Condition roll out. See https://fburl.com/workplace/1v97vimq. */
+        if (saveValueCallback) {
+          eventListenerGetValueCallbacks[tag] = saveValueCallback;
+        }
+        /* $FlowExpectedError[incompatible-type] - `saveValueCallback` is handled
+            differently when `isSingleOpBatching` is enabled. */
+        NativeOperations.getValue(tag);
+      }
+    : (tag, saveValueCallback) => {
+        NativeOperations.getValue(tag, saveValueCallback);
+      }) as NonNullable<typeof NativeAnimatedModule>['getValue'],
+  removeAnimatedEventFromView(
+    viewTag: number,
+    eventName: string,
+    animatedNodeTag: number,
+  ) {
+    NativeOperations.removeAnimatedEventFromView(
+      viewTag,
+      eventName,
+      animatedNodeTag,
+    );
   },
-
-  startListeningToAnimatedNodeValue(tag: number): void {
-    NativeOperations.startListeningToAnimatedNodeValue(tag);
+  restoreDefaultValues(nodeTag: number): void {
+    NativeOperations.restoreDefaultValues?.(nodeTag);
   },
-
-  stopListeningToAnimatedNodeValue(tag: number): void {
-    NativeOperations.stopListeningToAnimatedNodeValue(tag);
+  setAnimatedNodeOffset(nodeTag: number, offset: number): void {
+    NativeOperations.setAnimatedNodeOffset(nodeTag, offset);
   },
-
-  connectAnimatedNodes(parentTag: number, childTag: number): void {
-    NativeOperations.connectAnimatedNodes(parentTag, childTag);
+  setAnimatedNodeValue(nodeTag: number, value: number): void {
+    NativeOperations.setAnimatedNodeValue(nodeTag, value);
   },
+  setWaitingForIdentifier(id: string): void {
+    if (shouldSignalBatch) {
+      return;
+    }
 
-  disconnectAnimatedNodes(parentTag: number, childTag: number): void {
-    NativeOperations.disconnectAnimatedNodes(parentTag, childTag);
+    waitingForQueuedOperations.add(id);
+    queueOperations = true;
+    if (
+      ReactNativeFeatureFlags.animatedShouldDebounceQueueFlush() &&
+      flushQueueImmediate
+    ) {
+      clearImmediate(flushQueueImmediate);
+    }
   },
-
   startAnimatingNode: (isSingleOpBatching
     ? (animationId, nodeTag, config, endCallback) => {
         /* $FlowFixMe[constant-condition] Error discovered during Constant
@@ -286,62 +323,30 @@ const API = {
           config,
           endCallback,
         );
-      }) as $NonMaybeType<typeof NativeAnimatedModule>['startAnimatingNode'],
-
+      }) as NonNullable<typeof NativeAnimatedModule>['startAnimatingNode'],
+  startListeningToAnimatedNodeValue(tag: number): void {
+    NativeOperations.startListeningToAnimatedNodeValue(tag);
+  },
   stopAnimation(animationId: number) {
     NativeOperations.stopAnimation(animationId);
   },
-
-  setAnimatedNodeValue(nodeTag: number, value: number): void {
-    NativeOperations.setAnimatedNodeValue(nodeTag, value);
-  },
-
-  setAnimatedNodeOffset(nodeTag: number, offset: number): void {
-    NativeOperations.setAnimatedNodeOffset(nodeTag, offset);
-  },
-
-  flattenAnimatedNodeOffset(nodeTag: number): void {
-    NativeOperations.flattenAnimatedNodeOffset(nodeTag);
-  },
-
-  extractAnimatedNodeOffset(nodeTag: number): void {
-    NativeOperations.extractAnimatedNodeOffset(nodeTag);
-  },
-
-  connectAnimatedNodeToView(nodeTag: number, viewTag: number): void {
-    NativeOperations.connectAnimatedNodeToView(nodeTag, viewTag);
-  },
-
-  disconnectAnimatedNodeFromView(nodeTag: number, viewTag: number): void {
-    NativeOperations.disconnectAnimatedNodeFromView(nodeTag, viewTag);
-  },
-
-  restoreDefaultValues(nodeTag: number): void {
-    NativeOperations.restoreDefaultValues?.(nodeTag);
+  stopListeningToAnimatedNodeValue(tag: number): void {
+    NativeOperations.stopListeningToAnimatedNodeValue(tag);
   },
+  unsetWaitingForIdentifier(id: string): void {
+    if (shouldSignalBatch) {
+      return;
+    }
 
-  dropAnimatedNode(tag: number): void {
-    NativeOperations.dropAnimatedNode(tag);
-  },
+    waitingForQueuedOperations.delete(id);
 
-  addAnimatedEventToView(
-    viewTag: number,
-    eventName: string,
-    eventMapping: EventMapping,
-  ) {
-    NativeOperations.addAnimatedEventToView(viewTag, eventName, eventMapping);
+    if (waitingForQueuedOperations.size === 0) {
+      queueOperations = false;
+      API.disableQueue();
+    }
   },
-
-  removeAnimatedEventFromView(
-    viewTag: number,
-    eventName: string,
-    animatedNodeTag: number,
-  ) {
-    NativeOperations.removeAnimatedEventFromView(
-      viewTag,
-      eventName,
-      animatedNodeTag,
-    );
+  updateAnimatedNodeConfig(tag: number, config: AnimatedNodeConfig): void {
+    NativeOperations.updateAnimatedNodeConfig?.(tag, config);
   },
 };
 
@@ -401,7 +406,7 @@ function assertNativeAnimatedModule(): void {
 let _warnedMissingNativeAnimated = false;
 
 function shouldUseNativeDriver(
-  config: $ReadOnly<{...AnimationConfig, ...}> | EventConfig<mixed>,
+  config: $ReadOnly<{...AnimationConfig, ...}> | EventConfig<unknown>,
 ): boolean {
   if (config.useNativeDriver == null) {
     console.warn(
@@ -449,12 +454,9 @@ function transformDataType(value: number | string): number | string {
 
 export default {
   API,
-  generateNewNodeTag,
-  generateNewAnimationId,
   assertNativeAnimatedModule,
-  shouldUseNativeDriver,
-  shouldSignalBatch,
-  transformDataType,
+  generateNewAnimationId,
+  generateNewNodeTag,
   // $FlowExpectedError[unsafe-getters-setters] - unsafe getter lint suppression
   // $FlowExpectedError[missing-type-arg] - unsafe getter lint suppression
   get nativeEventEmitter(): NativeEventEmitter {
@@ -468,4 +470,7 @@ export default {
     }
     return nativeEventEmitter;
   },
+  shouldSignalBatch,
+  shouldUseNativeDriver,
+  transformDataType,
 };

package/src/private/animated/NativeAnimatedValidation.js

@@ -8,7 +8,10 @@
  * @format
  */
 
-import type {InterpolationConfigType} from '../../../Libraries/Animated/nodes/AnimatedInterpolation';
+import type {
+  InterpolationConfigSupportedOutputType,
+  InterpolationConfigType,
+} from '../../../Libraries/Animated/nodes/AnimatedInterpolation';
 
 import {
   isSupportedInterpolationParam,
@@ -16,9 +19,9 @@ import {
   isSupportedTransformProp,
 } from '../../../Libraries/Animated/NativeAnimatedAllowlist';
 
-export function validateInterpolation<OutputT: number | string>(
-  config: InterpolationConfigType<OutputT>,
-): void {
+export function validateInterpolation<
+  OutputT: InterpolationConfigSupportedOutputType,
+>(config: InterpolationConfigType<OutputT>): void {
   for (const key in config) {
     if (key !== 'debugID' && !isSupportedInterpolationParam(key)) {
       console.error(

package/src/private/animated/createAnimatedPropsHook.js

@@ -15,12 +15,14 @@ import AnimatedNode from '../../../Libraries/Animated/nodes/AnimatedNode';
 import AnimatedProps from '../../../Libraries/Animated/nodes/AnimatedProps';
 import AnimatedValue from '../../../Libraries/Animated/nodes/AnimatedValue';
 import {isPublicInstance as isFabricPublicInstance} from '../../../Libraries/ReactNative/ReactFabricPublicInstance/ReactFabricPublicInstanceUtils';
+import {RootTagContext} from '../../../Libraries/ReactNative/RootTag';
 import useRefEffect from '../../../Libraries/Utilities/useRefEffect';
 import * as ReactNativeFeatureFlags from '../featureflags/ReactNativeFeatureFlags';
 import {createAnimatedPropsMemoHook} from './createAnimatedPropsMemoHook';
 import NativeAnimatedHelper from './NativeAnimatedHelper';
 import {
   useCallback,
+  useContext,
   useEffect,
   useInsertionEffect,
   useReducer,
@@ -32,7 +34,7 @@ type ReducedProps<TProps> = {
   collapsable: boolean,
   ...
 };
-type CallbackRef<T> = T => mixed;
+type CallbackRef<T> = T => unknown;
 
 export type AnimatedPropsHook = <TProps: {...}, TInstance>(
   props: TProps,
@@ -60,8 +62,16 @@ export default function createAnimatedPropsHook(
     const onUpdateRef = useRef<UpdateCallback | null>(null);
     const timerRef = useRef<TimeoutID | null>(null);
 
+    const rootTag = useContext(RootTagContext);
+
     const node = useAnimatedPropsMemo(
-      () => new AnimatedProps(props, () => onUpdateRef.current?.(), allowlist),
+      () =>
+        new AnimatedProps(
+          props,
+          () => onUpdateRef.current?.(),
+          allowlist,
+          rootTag,
+        ),
       props,
     );
 
@@ -126,9 +136,7 @@ export default function createAnimatedPropsHook(
             // Check 2: this is an animation driven by native.
             // In native driven animations, this callback is only called once the animation completes.
             const shouldRemoveJsSync =
-              ReactNativeFeatureFlags.cxxNativeAnimatedEnabled() &&
-              !ReactNativeFeatureFlags.disableFabricCommitInCXXAnimated() &&
-              ReactNativeFeatureFlags.cxxNativeAnimatedRemoveJsSync();
+              ReactNativeFeatureFlags.cxxNativeAnimatedEnabled();
             if (isFabricNode && !shouldRemoveJsSync) {
               // Call `scheduleUpdate` to synchronise Fiber and Shadow tree.
               // Must not be called in Paper.

package/src/private/animated/createAnimatedPropsMemoHook.js

@@ -24,8 +24,8 @@ type CompositeKey = {
   [string]:
     | CompositeKeyComponent
     | AnimatedEvent
-    | $ReadOnlyArray<mixed>
-    | $ReadOnly<{[string]: mixed}>,
+    | $ReadOnlyArray<unknown>
+    | $ReadOnly<{[string]: unknown}>,
 };
 
 type CompositeKeyComponent =
@@ -38,8 +38,8 @@ type $ReadOnlyCompositeKey = $ReadOnly<{
   [string]:
     | $ReadOnlyCompositeKeyComponent
     | AnimatedEvent
-    | $ReadOnlyArray<mixed>
-    | $ReadOnly<{[string]: mixed}>,
+    | $ReadOnlyArray<unknown>
+    | $ReadOnly<{[string]: unknown}>,
 }>;
 
 type $ReadOnlyCompositeKeyComponent =
@@ -49,7 +49,7 @@ type $ReadOnlyCompositeKeyComponent =
 
 type AnimatedPropsMemoHook = (
   () => AnimatedProps,
-  props: $ReadOnly<{[string]: mixed}>,
+  props: $ReadOnly<{[string]: unknown}>,
 ) => AnimatedProps;
 
 /**
@@ -62,7 +62,7 @@ export function createAnimatedPropsMemoHook(
 ): AnimatedPropsMemoHook {
   return function useAnimatedPropsMemo(
     create: () => AnimatedProps,
-    props: $ReadOnly<{[string]: mixed}>,
+    props: $ReadOnly<{[string]: unknown}>,
   ): AnimatedProps {
     const compositeKey = useMemo(
       () => createCompositeKeyForProps(props, allowlist),
@@ -107,7 +107,7 @@ export function createAnimatedPropsMemoHook(
  * returns null.
  */
 export function createCompositeKeyForProps(
-  props: $ReadOnly<{[string]: mixed}>,
+  props: $ReadOnly<{[string]: unknown}>,
   allowlist: ?AnimatedPropsAllowlist,
 ): $ReadOnlyCompositeKey | null {
   let compositeKey: CompositeKey | null = null;
@@ -122,7 +122,7 @@ export function createCompositeKeyForProps(
       if (key === 'style') {
         // $FlowFixMe[incompatible-call] - `style` is a valid argument.
         // $FlowFixMe[incompatible-type] - `flattenStyle` returns an object.
-        const flatStyle: ?{[string]: mixed} = flattenStyle(value);
+        const flatStyle: ?{[string]: unknown} = flattenStyle(value);
         if (flatStyle != null) {
           compositeKeyComponent = createCompositeKeyForObject(
             flatStyle,
@@ -160,7 +160,7 @@ export function createCompositeKeyForProps(
  * If `array` contains no `AnimatedNode` instances, this returns null.
  */
 function createCompositeKeyForArray(
-  array: $ReadOnlyArray<mixed>,
+  array: $ReadOnlyArray<unknown>,
 ): $ReadOnlyArray<$ReadOnlyCompositeKeyComponent | null> | null {
   let compositeKey: Array<$ReadOnlyCompositeKeyComponent | null> | null = null;
 
@@ -200,7 +200,7 @@ function createCompositeKeyForArray(
  * If `object` contains no `AnimatedNode` instances, this returns null.
  */
 function createCompositeKeyForObject(
-  object: $ReadOnly<{[string]: mixed}>,
+  object: $ReadOnly<{[string]: unknown}>,
   allowlist?: ?AnimatedStyleAllowlist,
 ): $ReadOnly<{[string]: $ReadOnlyCompositeKeyComponent}> | null {
   let compositeKey: {[string]: $ReadOnlyCompositeKeyComponent} | null = null;