react-native 0.84.0-nightly-20251116-d52b9d2f8 → 0.84.0-nightly-20251118-d314e5f4e

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';
@@ -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 {...}

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/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';
@@ -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/Core/ReactNativeVersion.js

@@ -29,7 +29,7 @@ export default class ReactNativeVersion {
   static major: number = 0;
   static minor: number = 84;
   static patch: number = 0;
-  static prerelease: string | null = 'nightly-20251116-d52b9d2f8';
+  static prerelease: string | null = 'nightly-20251118-d314e5f4e';
 
   static getVersionString(): string {
     return `${this.major}.${this.minor}.${this.patch}${this.prerelease != null ? `-${this.prerelease}` : ''}`;

package/React/Base/RCTVersion.m

@@ -24,7 +24,7 @@ NSDictionary* RCTGetReactNativeVersion(void)
                   RCTVersionMajor: @(0),
                   RCTVersionMinor: @(84),
                   RCTVersionPatch: @(0),
-                  RCTVersionPrerelease: @"nightly-20251116-d52b9d2f8",
+                  RCTVersionPrerelease: @"nightly-20251118-d314e5f4e",
                   };
   });
   return __rnVersion;

package/React/CoreModules/RCTExceptionsManager.mm

@@ -77,8 +77,11 @@ RCT_EXPORT_MODULE()
     RCTTriggerReloadCommandListeners(@"JS Crash Reload");
   } else if (!RCT_DEV) {
     NSString *description = [@"Unhandled JS Exception: " stringByAppendingString:message];
-    NSDictionary *errorInfo =
-        @{NSLocalizedDescriptionKey : description, RCTJSStackTraceKey : stack, RCTJSExtraDataKey : extraDataAsJSON};
+    NSDictionary *errorInfo = @{
+      NSLocalizedDescriptionKey : description,
+      RCTJSStackTraceKey : stack == nil ? (id)kCFNull : stack,
+      RCTJSExtraDataKey : extraDataAsJSON == nil ? (id)kCFNull : extraDataAsJSON
+    };
     RCTFatal([NSError errorWithDomain:RCTErrorDomain code:0 userInfo:errorInfo]);
   }
 }

package/ReactAndroid/gradle.properties

@@ -1,4 +1,4 @@
-VERSION_NAME=0.84.0-nightly-20251116-d52b9d2f8
+VERSION_NAME=0.84.0-nightly-20251118-d314e5f4e
 react.internal.publishingGroup=com.facebook.react
 react.internal.hermesPublishingGroup=com.facebook.hermes
 

package/ReactAndroid/src/main/java/com/facebook/react/modules/systeminfo/ReactNativeVersion.kt

@@ -15,6 +15,6 @@ public object ReactNativeVersion {
     "major" to 0,
     "minor" to 84,
     "patch" to 0,
-    "prerelease" to "nightly-20251116-d52b9d2f8"
+    "prerelease" to "nightly-20251118-d314e5f4e"
   )
 }

package/ReactAndroid/src/main/jni/react/fabric/FabricMountingManager.cpp

@@ -24,9 +24,9 @@
 #include <fbjni/fbjni.h>
 #include <glog/logging.h>
 
+#include <algorithm>
 #include <cfenv>
 #include <cmath>
-#include <unordered_set>
 #include <vector>
 
 namespace facebook::react {
@@ -54,6 +54,80 @@ void FabricMountingManager::onSurfaceStop(SurfaceId surfaceId) {
 
 namespace {
 
+#ifdef REACT_NATIVE_DEBUG
+// List of layout-only props extracted from ViewProps.kt used to filter out
+// component props from Props 1.5 to validate the Props 2.0 output
+inline bool isLayoutOnlyProp(const std::string& propName) {
+  static const std::vector<std::string> layoutOnlyProps = {
+      // Flexbox Alignment
+      "alignItems",
+      "alignSelf",
+      "alignContent",
+
+      // Flexbox Properties
+      "flex",
+      "flexBasis",
+      "flexDirection",
+      "flexGrow",
+      "flexShrink",
+      "flexWrap",
+      "justifyContent",
+
+      // Gaps
+      "rowGap",
+      "columnGap",
+      "gap",
+
+      // Display & Position
+      "display",
+      "position",
+
+      // Positioning
+      "right",
+      "top",
+      "bottom",
+      "left",
+      "start",
+      "end",
+
+      // Dimensions
+      "width",
+      "height",
+      "minWidth",
+      "maxWidth",
+      "minHeight",
+      "maxHeight",
+
+      // Margins
+      "margin",
+      "marginVertical",
+      "marginHorizontal",
+      "marginLeft",
+      "marginRight",
+      "marginTop",
+      "marginBottom",
+      "marginStart",
+      "marginEnd",
+
+      // Paddings
+      "padding",
+      "paddingVertical",
+      "paddingHorizontal",
+      "paddingLeft",
+      "paddingRight",
+      "paddingTop",
+      "paddingBottom",
+      "paddingStart",
+      "paddingEnd",
+
+      // Other
+      "collapsable",
+  };
+  return std::find(layoutOnlyProps.begin(), layoutOnlyProps.end(), propName) !=
+      layoutOnlyProps.end();
+}
+#endif
+
 inline int getIntBufferSizeForType(CppMountItem::Type mountItemType) {
   switch (mountItemType) {
     case CppMountItem::Type::Create:
@@ -232,8 +306,29 @@ jni::local_ref<jobject> getProps(
       strcmp(
           newShadowView.componentName,
           newProps->getDiffPropsImplementationTarget()) == 0) {
-    return ReadableNativeMap::newObjectCxxArgs(
-        newProps->getDiffProps(oldProps));
+    auto diff = newProps->getDiffProps(oldProps);
+
+#ifdef REACT_NATIVE_DEBUG
+    if (oldProps != nullptr) {
+      auto controlDiff =
+          diffDynamicProps(oldProps->rawProps, newProps->rawProps);
+
+      for (const auto& [prop, value] : controlDiff.items()) {
+        if (diff.count(prop) == 0) {
+          // Skip layout-only props since they are not included in Props 2.0
+          if (!isLayoutOnlyProp(prop.asString())) {
+            LOG(ERROR) << "Props diff validation failed: Props 1.5 has prop '"
+                       << prop.asString()
+                       << "' = " << (value != nullptr ? value : "NULL")
+                       << " that Props 2.0 doesn't have for component "
+                       << newShadowView.componentName;
+          }
+        }
+      }
+    }
+#endif
+
+    return ReadableNativeMap::newObjectCxxArgs(std::move(diff));
   }
   if (ReactNativeFeatureFlags::enableAccumulatedUpdatesInRawPropsAndroid()) {
     if (oldProps == nullptr) {

package/ReactAndroid/src/main/res/devsupport/layout/fps_view.xml

@@ -8,9 +8,9 @@
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_margin="3dp"
+      android:layout_gravity="top|right"
       android:background="#a4141823"
       android:gravity="right"
-      android:layout_gravity="top|right"
       android:padding="3dp"
       android:textColor="@android:color/white"
       android:textSize="11sp"

package/ReactCommon/cxxreact/ReactNativeVersion.h

@@ -22,7 +22,7 @@ constexpr struct {
   int32_t Major = 0;
   int32_t Minor = 84;
   int32_t Patch = 0;
-  std::string_view Prerelease = "nightly-20251116-d52b9d2f8";
+  std::string_view Prerelease = "nightly-20251118-d314e5f4e";
 } ReactNativeVersion;
 
 } // namespace facebook::react

package/ReactCommon/react/renderer/animated/AnimatedModule.cpp

@@ -27,17 +27,18 @@ void AnimatedModule::finishOperationBatch(jsi::Runtime& /*rt*/) {
   std::swap(preOperations_, preOperations);
   std::swap(operations_, operations);
 
-  if (nodesManager_) {
+  if (auto nodesManager = nodesManager_.lock()) {
     // TODO: nodesManager_ must exist at all times. But without this check
     // AnimatedProps-itest.js fails.
-    nodesManager_->scheduleOnUI([this,
-                                 preOperations = std::move(preOperations),
-                                 operations = std::move(operations)]() {
+    nodesManager->scheduleOnUI([this,
+                                preOperations = std::move(preOperations),
+                                operations = std::move(operations),
+                                nodesManager = nodesManager_]() {
       for (auto& preOperation : preOperations) {
-        executeOperation(preOperation);
+        executeOperation(preOperation, nodesManager);
       }
       for (auto& operation : operations) {
-        executeOperation(operation);
+        executeOperation(operation, nodesManager);
       }
     });
   }
@@ -50,8 +51,8 @@ void AnimatedModule::createAnimatedNode(
   auto configDynamic = dynamicFromValue(rt, jsi::Value(rt, config));
   if (auto it = configDynamic.find("disableBatchingForNativeCreate");
       it != configDynamic.items().end() && it->second == true) {
-    if (nodesManager_) {
-      nodesManager_->createAnimatedNodeAsync(tag, configDynamic);
+    if (auto nodesManager = nodesManager_.lock()) {
+      nodesManager->createAnimatedNodeAsync(tag, configDynamic);
     }
   } else {
     operations_.emplace_back(
@@ -220,79 +221,83 @@ void AnimatedModule::queueAndExecuteBatchedOperations(
   // TODO(T225953475): missing implementation
 }
 
-void AnimatedModule::executeOperation(const Operation& operation) {
-  if (nodesManager_ == nullptr) {
-    return;
-  }
-  std::visit(
-      [&](const auto& op) {
-        using T = std::decay_t<decltype(op)>;
-
-        if constexpr (std::is_same_v<T, CreateAnimatedNodeOp>) {
-          nodesManager_->createAnimatedNode(op.tag, op.config);
-        } else if constexpr (std::is_same_v<T, GetValueOp>) {
-          auto animValue = nodesManager_->getValue(op.tag);
-          if (animValue) {
-            op.callback.call(animValue.value());
+void AnimatedModule::executeOperation(
+    const Operation& operation,
+    std::weak_ptr<NativeAnimatedNodesManager> nodesManagerWeak) {
+  if (auto nodesManager = nodesManagerWeak.lock()) {
+    std::visit(
+        [&](const auto& op) {
+          using T = std::decay_t<decltype(op)>;
+
+          if constexpr (std::is_same_v<T, CreateAnimatedNodeOp>) {
+            nodesManager->createAnimatedNode(op.tag, op.config);
+          } else if constexpr (std::is_same_v<T, GetValueOp>) {
+            auto animValue = nodesManager->getValue(op.tag);
+            if (animValue) {
+              op.callback.call(animValue.value());
+            }
+          } else if constexpr (std::is_same_v<
+                                   T,
+                                   StartListeningToAnimatedNodeValueOp>) {
+            nodesManager->startListeningToAnimatedNodeValue(
+                op.tag, [this, tag = op.tag](double value) {
+                  emitDeviceEvent(
+                      "onAnimatedValueUpdate",
+                      [tag, value](
+                          jsi::Runtime& rt, std::vector<jsi::Value>& args) {
+                        auto arg = jsi::Object(rt);
+                        arg.setProperty(rt, "tag", jsi::Value(tag));
+                        arg.setProperty(rt, "value", jsi::Value(value));
+                        args.emplace_back(rt, arg);
+                      });
+                });
+          } else if constexpr (std::is_same_v<
+                                   T,
+                                   StopListeningToAnimatedNodeValueOp>) {
+            nodesManager->stopListeningToAnimatedNodeValue(op.tag);
+          } else if constexpr (std::is_same_v<T, ConnectAnimatedNodesOp>) {
+            nodesManager->connectAnimatedNodes(op.parentTag, op.childTag);
+          } else if constexpr (std::is_same_v<T, DisconnectAnimatedNodesOp>) {
+            nodesManager->disconnectAnimatedNodes(op.parentTag, op.childTag);
+          } else if constexpr (std::is_same_v<T, StartAnimatingNodeOp>) {
+            nodesManager->startAnimatingNode(
+                op.animationId,
+                op.nodeTag,
+                std::move(op.config),
+                std::move(op.endCallback));
+          } else if constexpr (std::is_same_v<T, StopAnimationOp>) {
+            nodesManager->stopAnimation(op.animationId, false);
+          } else if constexpr (std::is_same_v<T, SetAnimatedNodeValueOp>) {
+            nodesManager->setAnimatedNodeValue(op.nodeTag, op.value);
+          } else if constexpr (std::is_same_v<T, SetAnimatedNodeOffsetOp>) {
+            nodesManager->setAnimatedNodeOffset(op.nodeTag, op.offset);
+          } else if constexpr (std::is_same_v<T, FlattenAnimatedNodeOffsetOp>) {
+            nodesManager->flattenAnimatedNodeOffset(op.nodeTag);
+          } else if constexpr (std::is_same_v<T, ExtractAnimatedNodeOffsetOp>) {
+            nodesManager->extractAnimatedNodeOffsetOp(op.nodeTag);
+          } else if constexpr (std::is_same_v<T, ConnectAnimatedNodeToViewOp>) {
+            nodesManager->connectAnimatedNodeToView(op.nodeTag, op.viewTag);
+          } else if constexpr (std::is_same_v<
+                                   T,
+                                   DisconnectAnimatedNodeFromViewOp>) {
+            nodesManager->disconnectAnimatedNodeFromView(
+                op.nodeTag, op.viewTag);
+          } else if constexpr (std::is_same_v<T, RestoreDefaultValuesOp>) {
+            nodesManager->restoreDefaultValues(op.nodeTag);
+          } else if constexpr (std::is_same_v<T, DropAnimatedNodeOp>) {
+            nodesManager->dropAnimatedNode(op.tag);
+          } else if constexpr (std::is_same_v<T, AddAnimatedEventToViewOp>) {
+            nodesManager->addAnimatedEventToView(
+                op.viewTag, op.eventName, op.eventMapping);
+          } else if constexpr (std::is_same_v<
+                                   T,
+                                   RemoveAnimatedEventFromViewOp>) {
+            nodesManager->removeAnimatedEventFromView(
+                op.viewTag, op.eventName, op.animatedNodeTag);
           }
-        } else if constexpr (std::is_same_v<
-                                 T,
-                                 StartListeningToAnimatedNodeValueOp>) {
-          nodesManager_->startListeningToAnimatedNodeValue(
-              op.tag, [this, tag = op.tag](double value) {
-                emitDeviceEvent(
-                    "onAnimatedValueUpdate",
-                    [tag, value](
-                        jsi::Runtime& rt, std::vector<jsi::Value>& args) {
-                      auto arg = jsi::Object(rt);
-                      arg.setProperty(rt, "tag", jsi::Value(tag));
-                      arg.setProperty(rt, "value", jsi::Value(value));
-                      args.emplace_back(rt, arg);
-                    });
-              });
-        } else if constexpr (std::is_same_v<
-                                 T,
-                                 StopListeningToAnimatedNodeValueOp>) {
-          nodesManager_->stopListeningToAnimatedNodeValue(op.tag);
-        } else if constexpr (std::is_same_v<T, ConnectAnimatedNodesOp>) {
-          nodesManager_->connectAnimatedNodes(op.parentTag, op.childTag);
-        } else if constexpr (std::is_same_v<T, DisconnectAnimatedNodesOp>) {
-          nodesManager_->disconnectAnimatedNodes(op.parentTag, op.childTag);
-        } else if constexpr (std::is_same_v<T, StartAnimatingNodeOp>) {
-          nodesManager_->startAnimatingNode(
-              op.animationId,
-              op.nodeTag,
-              std::move(op.config),
-              std::move(op.endCallback));
-        } else if constexpr (std::is_same_v<T, StopAnimationOp>) {
-          nodesManager_->stopAnimation(op.animationId, false);
-        } else if constexpr (std::is_same_v<T, SetAnimatedNodeValueOp>) {
-          nodesManager_->setAnimatedNodeValue(op.nodeTag, op.value);
-        } else if constexpr (std::is_same_v<T, SetAnimatedNodeOffsetOp>) {
-          nodesManager_->setAnimatedNodeOffset(op.nodeTag, op.offset);
-        } else if constexpr (std::is_same_v<T, FlattenAnimatedNodeOffsetOp>) {
-          nodesManager_->flattenAnimatedNodeOffset(op.nodeTag);
-        } else if constexpr (std::is_same_v<T, ExtractAnimatedNodeOffsetOp>) {
-          nodesManager_->extractAnimatedNodeOffsetOp(op.nodeTag);
-        } else if constexpr (std::is_same_v<T, ConnectAnimatedNodeToViewOp>) {
-          nodesManager_->connectAnimatedNodeToView(op.nodeTag, op.viewTag);
-        } else if constexpr (std::is_same_v<
-                                 T,
-                                 DisconnectAnimatedNodeFromViewOp>) {
-          nodesManager_->disconnectAnimatedNodeFromView(op.nodeTag, op.viewTag);
-        } else if constexpr (std::is_same_v<T, RestoreDefaultValuesOp>) {
-          nodesManager_->restoreDefaultValues(op.nodeTag);
-        } else if constexpr (std::is_same_v<T, DropAnimatedNodeOp>) {
-          nodesManager_->dropAnimatedNode(op.tag);
-        } else if constexpr (std::is_same_v<T, AddAnimatedEventToViewOp>) {
-          nodesManager_->addAnimatedEventToView(
-              op.viewTag, op.eventName, op.eventMapping);
-        } else if constexpr (std::is_same_v<T, RemoveAnimatedEventFromViewOp>) {
-          nodesManager_->removeAnimatedEventFromView(
-              op.viewTag, op.eventName, op.animatedNodeTag);
-        }
-      },
-      operation);
+        },
+        operation);
+  }
 }
 
 void AnimatedModule::installJSIBindingsWithRuntime(jsi::Runtime& runtime) {

package/ReactCommon/react/renderer/animated/AnimatedModule.h

@@ -194,11 +194,11 @@ class AnimatedModule : public NativeAnimatedModuleCxxSpec<AnimatedModule>, publi
 
  private:
   std::shared_ptr<NativeAnimatedNodesManagerProvider> nodesManagerProvider_;
-  std::shared_ptr<NativeAnimatedNodesManager> nodesManager_;
+  std::weak_ptr<NativeAnimatedNodesManager> nodesManager_;
   std::vector<Operation> preOperations_;
   std::vector<Operation> operations_;
 
-  void executeOperation(const Operation &operation);
+  void executeOperation(const Operation &operation, std::weak_ptr<NativeAnimatedNodesManager> nodesManagerWeak);
   void installJSIBindingsWithRuntime(jsi::Runtime &runtime) override;
 };
 

package/ReactCommon/react/renderer/animated/NativeAnimatedNodesManager.cpp

@@ -73,11 +73,13 @@ thread_local bool NativeAnimatedNodesManager::isOnRenderThread_{false};
 NativeAnimatedNodesManager::NativeAnimatedNodesManager(
     DirectManipulationCallback&& directManipulationCallback,
     FabricCommitCallback&& fabricCommitCallback,
+    ResolvePlatformColor&& resolvePlatformColor,
     StartOnRenderCallback&& startOnRenderCallback,
     StopOnRenderCallback&& stopOnRenderCallback,
     FrameRateListenerCallback&& frameRateListenerCallback) noexcept
     : directManipulationCallback_(std::move(directManipulationCallback)),
       fabricCommitCallback_(std::move(fabricCommitCallback)),
+      resolvePlatformColor_(std::move(resolvePlatformColor)),
       startOnRenderCallback_(std::move(startOnRenderCallback)),
       stopOnRenderCallback_(std::move(stopOnRenderCallback)),
       frameRateListenerCallback_(std::move(frameRateListenerCallback)) {
@@ -847,6 +849,15 @@ bool NativeAnimatedNodesManager::isOnRenderThread() const noexcept {
   return isOnRenderThread_;
 }
 
+void NativeAnimatedNodesManager::resolvePlatformColor(
+    SurfaceId surfaceId,
+    const RawValue& value,
+    SharedColor& result) const {
+  if (resolvePlatformColor_) {
+    resolvePlatformColor_(surfaceId, value, result);
+  }
+}
+
 #pragma mark - Listeners
 
 void NativeAnimatedNodesManager::startListeningToAnimatedNodeValue(

package/ReactCommon/react/renderer/animated/NativeAnimatedNodesManager.h

@@ -58,10 +58,12 @@ class NativeAnimatedNodesManager {
   using StartOnRenderCallback = std::function<void(std::function<void()> &&, bool isAsync)>;
   using StopOnRenderCallback = std::function<void(bool isAsync)>;
   using FrameRateListenerCallback = std::function<void(bool /* shouldEnableListener */)>;
+  using ResolvePlatformColor = std::function<void(SurfaceId surfaceId, const RawValue &value, SharedColor &result)>;
 
   explicit NativeAnimatedNodesManager(
       DirectManipulationCallback &&directManipulationCallback,
       FabricCommitCallback &&fabricCommitCallback,
+      ResolvePlatformColor &&resolvePlatformColor,
       StartOnRenderCallback &&startOnRenderCallback = nullptr,
       StopOnRenderCallback &&stopOnRenderCallback = nullptr,
       FrameRateListenerCallback &&frameRateListenerCallback = nullptr) noexcept;
@@ -185,6 +187,8 @@ class NativeAnimatedNodesManager {
 
   bool isOnRenderThread() const noexcept;
 
+  void resolvePlatformColor(SurfaceId surfaceId, const RawValue &value, SharedColor &result) const;
+
  private:
   void stopRenderCallbackIfNeeded(bool isAsync) noexcept;
 
@@ -233,6 +237,8 @@ class NativeAnimatedNodesManager {
   const DirectManipulationCallback directManipulationCallback_;
   const FabricCommitCallback fabricCommitCallback_;
 
+  const ResolvePlatformColor resolvePlatformColor_;
+
   /*
    * Tracks whether the render callback loop for animations is currently active.
    */

package/ReactCommon/react/renderer/animated/NativeAnimatedNodesManagerProvider.cpp

@@ -14,6 +14,9 @@
 #ifdef RN_USE_ANIMATION_BACKEND
 #include <react/renderer/animationbackend/AnimationBackend.h>
 #endif
+#include <react/renderer/animated/internal/primitives.h>
+#include <react/renderer/components/view/conversions.h>
+#include <react/renderer/scheduler/Scheduler.h>
 #include <react/renderer/uimanager/UIManagerBinding.h>
 
 namespace facebook::react {
@@ -70,6 +73,24 @@ NativeAnimatedNodesManagerProvider::getOrCreate(
           uiManager->synchronouslyUpdateViewOnUIThread(viewTag, props);
         };
 
+    // TODO: remove force casting.
+    auto* scheduler = (Scheduler*)uiManager->getDelegate();
+    auto resolvePlatformColor = [scheduler, uiManager](
+                                    SurfaceId surfaceId,
+                                    const RawValue& value,
+                                    SharedColor& result) {
+      if (uiManager) {
+        if (surfaceId != animated::undefinedAnimatedNodeIdentifier) {
+          PropsParserContext propsParserContext{
+              surfaceId, *scheduler->getContextContainer()};
+          fromRawValue(propsParserContext, value, result);
+        } else {
+          LOG(ERROR)
+              << "Cannot resolve platformColor because surfaceId is unavailable.";
+        }
+      }
+    };
+
     if (ReactNativeFeatureFlags::useSharedAnimatedBackend()) {
 #ifdef RN_USE_ANIMATION_BACKEND
       // TODO: this should be initialized outside of animated, but for now it
@@ -95,6 +116,7 @@ NativeAnimatedNodesManagerProvider::getOrCreate(
           std::make_shared<NativeAnimatedNodesManager>(
               std::move(directManipulationCallback),
               std::move(fabricCommitCallback),
+              std::move(resolvePlatformColor),
               std::move(startOnRenderCallback_),
               std::move(stopOnRenderCallback_),
               std::move(frameRateListenerCallback_));
@@ -128,8 +150,6 @@ NativeAnimatedNodesManagerProvider::getOrCreate(
 
     uiManager->setNativeAnimatedDelegate(nativeAnimatedDelegate_);
 
-    // TODO: remove force casting.
-    auto* scheduler = (Scheduler*)uiManager->getDelegate();
     animatedMountingOverrideDelegate_ =
         std::make_shared<AnimatedMountingOverrideDelegate>(
             *nativeAnimatedNodesManager_, *scheduler);

package/ReactCommon/react/renderer/animated/nodes/InterpolationAnimatedNode.cpp

@@ -29,13 +29,19 @@ InterpolationAnimatedNode::InterpolationAnimatedNode(
     inputRanges_.push_back(rangeValue.asDouble());
   }
 
-  const bool isColorOutput = nodeConfig["outputType"].isString() &&
-      nodeConfig["outputType"].asString() == "color";
-  if (isColorOutput) {
+  const auto outputType = nodeConfig["outputType"].isString()
+      ? nodeConfig["outputType"].asString()
+      : "";
+  outputType_ = outputType;
+  if (outputType == "color") {
     isColorValue_ = true;
     for (const auto& rangeValue : nodeConfig["outputRange"]) {
       colorOutputRanges_.push_back(static_cast<int>(rangeValue.asInt()));
     }
+  } else if (outputType == "platform_color") {
+    for (const auto& rangeValue : nodeConfig["outputRange"]) {
+      platformColorOutputRanges_.push_back(rangeValue);
+    }
   } else {
     for (const auto& rangeValue : nodeConfig["outputRange"]) {
       defaultOutputRanges_.push_back(rangeValue.asDouble());
@@ -53,8 +59,10 @@ void InterpolationAnimatedNode::update() {
 
   if (const auto node =
           manager_->getAnimatedNode<ValueAnimatedNode>(parentTag_)) {
-    if (isColorValue_) {
+    if (outputType_ == "color") {
       setRawValue(interpolateColor(node->getValue()));
+    } else if (outputType_ == "platform_color") {
+      setRawValue(interpolatePlatformColor(node->getValue()));
     } else {
       setRawValue(interpolateValue(node->getValue()));
     }
@@ -141,4 +149,66 @@ double InterpolationAnimatedNode::interpolateColor(double value) {
       static_cast<uint8_t>(outputValueA)));
 }
 
+double InterpolationAnimatedNode::interpolatePlatformColor(double value) {
+  // Compute range index
+  size_t index = 1;
+  for (; index < inputRanges_.size() - 1; ++index) {
+    if (inputRanges_[index] >= value) {
+      break;
+    }
+  }
+  index--;
+  SharedColor outputMinSharedColor;
+  SharedColor outputMaxSharedColor;
+  if (manager_ != nullptr) {
+    manager_->resolvePlatformColor(
+        connectedRootTag_,
+        RawValue(platformColorOutputRanges_[index]),
+        outputMinSharedColor);
+    manager_->resolvePlatformColor(
+        connectedRootTag_,
+        RawValue(platformColorOutputRanges_[index + 1]),
+        outputMaxSharedColor);
+  }
+  auto outputMin = *outputMinSharedColor;
+  auto outputMax = *outputMaxSharedColor;
+
+  if (outputMin == outputMax) {
+    return outputMin;
+  }
+
+  const auto inputMin = inputRanges_[index];
+  const auto inputMax = inputRanges_[index + 1];
+  if (inputMin == inputMax) {
+    if (value <= inputMin) {
+      return static_cast<int32_t>(outputMin);
+    } else {
+      return static_cast<int32_t>(outputMax);
+    }
+  }
+
+  auto ratio = (value - inputMin) / (inputMax - inputMin);
+
+  auto outputMinA = alphaFromHostPlatformColor(outputMin);
+  auto outputMinR = redFromHostPlatformColor(outputMin);
+  auto outputMinG = greenFromHostPlatformColor(outputMin);
+  auto outputMinB = blueFromHostPlatformColor(outputMin);
+
+  auto outputMaxA = alphaFromHostPlatformColor(outputMax);
+  auto outputMaxR = redFromHostPlatformColor(outputMax);
+  auto outputMaxG = greenFromHostPlatformColor(outputMax);
+  auto outputMaxB = blueFromHostPlatformColor(outputMax);
+
+  auto outputValueA = ratio * (outputMaxA - outputMinA) + outputMinA;
+  auto outputValueR = ratio * (outputMaxR - outputMinR) + outputMinR;
+  auto outputValueG = ratio * (outputMaxG - outputMinG) + outputMinG;
+  auto outputValueB = ratio * (outputMaxB - outputMinB) + outputMinB;
+
+  return static_cast<int32_t>(hostPlatformColorFromRGBA(
+      static_cast<uint8_t>(outputValueR),
+      static_cast<uint8_t>(outputValueG),
+      static_cast<uint8_t>(outputValueB),
+      static_cast<uint8_t>(outputValueA)));
+}
+
 } // namespace facebook::react

package/ReactCommon/react/renderer/animated/nodes/InterpolationAnimatedNode.h

@@ -29,13 +29,20 @@ class InterpolationAnimatedNode final : public ValueAnimatedNode {
  private:
   double interpolateValue(double value);
   double interpolateColor(double value);
+  double interpolatePlatformColor(double value);
 
   std::vector<double> inputRanges_;
   std::vector<double> defaultOutputRanges_;
   std::vector<Color> colorOutputRanges_;
+  std::vector<folly::dynamic> platformColorOutputRanges_;
   std::string extrapolateLeft_;
   std::string extrapolateRight_;
 
+  std::string outputType_;
+
   Tag parentTag_{animated::undefinedAnimatedNodeIdentifier};
+
+  // Needed for PlatformColor resolver
+  SurfaceId connectedRootTag_{animated::undefinedAnimatedNodeIdentifier};
 };
 } // namespace facebook::react

package/ReactCommon/react/renderer/animated/tests/AnimationTestsBase.h

@@ -35,7 +35,8 @@ class AnimationTestsBase : public testing::Test {
             lastUpdatedNodeTag = nodesProps.begin()->first;
             lastCommittedProps = nodesProps.begin()->second;
           }
-        });
+        },
+        nullptr);
     NativeAnimatedNodesManager::isOnRenderThread_ = true;
   }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native",
-  "version": "0.84.0-nightly-20251116-d52b9d2f8",
+  "version": "0.84.0-nightly-20251118-d314e5f4e",
   "description": "A framework for building native apps using React",
   "license": "MIT",
   "repository": {
@@ -160,13 +160,13 @@
   },
   "dependencies": {
     "@jest/create-cache-key-function": "^29.7.0",
-    "@react-native/assets-registry": "0.84.0-nightly-20251116-d52b9d2f8",
-    "@react-native/codegen": "0.84.0-nightly-20251116-d52b9d2f8",
-    "@react-native/community-cli-plugin": "0.84.0-nightly-20251116-d52b9d2f8",
-    "@react-native/gradle-plugin": "0.84.0-nightly-20251116-d52b9d2f8",
-    "@react-native/js-polyfills": "0.84.0-nightly-20251116-d52b9d2f8",
-    "@react-native/normalize-colors": "0.84.0-nightly-20251116-d52b9d2f8",
-    "@react-native/virtualized-lists": "0.84.0-nightly-20251116-d52b9d2f8",
+    "@react-native/assets-registry": "0.84.0-nightly-20251118-d314e5f4e",
+    "@react-native/codegen": "0.84.0-nightly-20251118-d314e5f4e",
+    "@react-native/community-cli-plugin": "0.84.0-nightly-20251118-d314e5f4e",
+    "@react-native/gradle-plugin": "0.84.0-nightly-20251118-d314e5f4e",
+    "@react-native/js-polyfills": "0.84.0-nightly-20251118-d314e5f4e",
+    "@react-native/normalize-colors": "0.84.0-nightly-20251118-d314e5f4e",
+    "@react-native/virtualized-lists": "0.84.0-nightly-20251118-d314e5f4e",
     "abort-controller": "^3.0.0",
     "anser": "^1.4.9",
     "ansi-regex": "^5.0.0",

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/types_generated/Libraries/Animated/createAnimatedComponent.d.ts

@@ -4,12 +4,13 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<008486b075d25ce1531e33736e20f9f9>>
+ * @generated SignedSource<<e8e5c16b1838a7cb9e45118d291d537a>>
  *
  * This file was translated from Flow by scripts/js-api/build-types/index.js.
  * Original file: packages/react-native/Libraries/Animated/createAnimatedComponent.js
  */
 
+import type { NativeColorValue } from "../StyleSheet/StyleSheetTypes";
 import type AnimatedAddition from "./nodes/AnimatedAddition";
 import type AnimatedDiffClamp from "./nodes/AnimatedDiffClamp";
 import type AnimatedDivision from "./nodes/AnimatedDivision";
@@ -25,7 +26,7 @@ import * as React from "react";
 type Nullable = void | null;
 type Primitive = string | number | boolean | symbol | void;
 type Builtin = (...$$REST$$: ReadonlyArray<never>) => unknown | Date | Error | RegExp;
-export type WithAnimatedValue<T> = T extends Builtin | Nullable ? T : T extends Primitive ? T | AnimatedNode | AnimatedAddition | AnimatedSubtraction | AnimatedDivision | AnimatedMultiplication | AnimatedModulo | AnimatedDiffClamp | AnimatedValue | AnimatedInterpolation<number | string> | AnimatedInterpolation<number> | AnimatedInterpolation<string> : T extends ReadonlyArray<infer P> ? ReadonlyArray<WithAnimatedValue<P>> : T extends {} ? { readonly [K in keyof T]: WithAnimatedValue<T[K]> } : T;
+export type WithAnimatedValue<T> = T extends Builtin | Nullable ? T : T extends Primitive ? T | AnimatedNode | AnimatedAddition | AnimatedSubtraction | AnimatedDivision | AnimatedMultiplication | AnimatedModulo | AnimatedDiffClamp | AnimatedValue | AnimatedInterpolation<number | string> | AnimatedInterpolation<number> | AnimatedInterpolation<string> | AnimatedInterpolation<NativeColorValue> : T extends ReadonlyArray<infer P> ? ReadonlyArray<WithAnimatedValue<P>> : T extends {} ? { readonly [K in keyof T]: WithAnimatedValue<T[K]> } : T;
 type NonAnimatedProps = "ref" | "innerViewRef" | "scrollViewRef" | "testID" | "disabled" | "accessibilityLabel";
 type PassThroughProps = Readonly<{
   passthroughAnimatedPropExplicitValues?: ViewProps | null;

package/types_generated/Libraries/Animated/nodes/AnimatedInterpolation.d.ts

@@ -4,17 +4,19 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<8004cbd7a5bde7225d523c5cf91c7139>>
+ * @generated SignedSource<<b3b35ccf34137c8b1fafd02a35fcd5df>>
  *
  * This file was translated from Flow by scripts/js-api/build-types/index.js.
  * Original file: packages/react-native/Libraries/Animated/nodes/AnimatedInterpolation.js
  */
 
+import type { NativeColorValue } from "../../StyleSheet/StyleSheetTypes";
 import type AnimatedNode from "./AnimatedNode";
 import type { AnimatedNodeConfig } from "./AnimatedNode";
 import AnimatedWithChildren from "./AnimatedWithChildren";
 type ExtrapolateType = "extend" | "identity" | "clamp";
-export type InterpolationConfigType<OutputT extends number | string> = Readonly<Omit<AnimatedNodeConfig, keyof {
+export type InterpolationConfigSupportedOutputType = number | string | NativeColorValue;
+export type InterpolationConfigType<OutputT extends InterpolationConfigSupportedOutputType> = Readonly<Omit<AnimatedNodeConfig, keyof {
   inputRange: ReadonlyArray<number>;
   outputRange: ReadonlyArray<OutputT>;
   easing?: (input: number) => number;
@@ -29,7 +31,7 @@ export type InterpolationConfigType<OutputT extends number | string> = Readonly<
   extrapolateLeft?: ExtrapolateType;
   extrapolateRight?: ExtrapolateType;
 }>;
-declare class AnimatedInterpolation<OutputT extends number | string> extends AnimatedWithChildren {
+declare class AnimatedInterpolation<OutputT extends InterpolationConfigSupportedOutputType> extends AnimatedWithChildren {
   constructor(parent: AnimatedNode, config: InterpolationConfigType<OutputT>);
   interpolate<NewOutputT extends number | string>(config: InterpolationConfigType<NewOutputT>): AnimatedInterpolation<NewOutputT>;
 }

package/types_generated/Libraries/Animated/nodes/AnimatedValue.d.ts

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<6fab0eee6ece82d62f97bc6a633c866a>>
+ * @generated SignedSource<<86c68bbde8f6c0e6e87b258087714ffc>>
  *
  * This file was translated from Flow by scripts/js-api/build-types/index.js.
  * Original file: packages/react-native/Libraries/Animated/nodes/AnimatedValue.js
@@ -12,7 +12,7 @@
 
 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";
@@ -106,7 +106,7 @@ declare class AnimatedValue extends AnimatedWithChildren {
    * Interpolates the value before updating the property, e.g. mapping 0-1 to
    * 0-10.
    */
-  interpolate<OutputT extends number | string>(config: InterpolationConfigType<OutputT>): AnimatedInterpolation<OutputT>;
+  interpolate<OutputT extends InterpolationConfigSupportedOutputType>(config: InterpolationConfigType<OutputT>): AnimatedInterpolation<OutputT>;
   /**
    * Typically only used internally, but could be used by a custom Animation
    * class.