@react-native-ohos/react-native-reanimated 4.0.2-beta.1 → 4.1.0-beta.1

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/core/CSSLoopAnimation.cpp

@@ -0,0 +1,100 @@
+#include <reanimated/CSS/core/CSSLoopAnimation.h>
+
+#include <memory>
+
+namespace reanimated::css {
+
+CSSLoopAnimation::CSSLoopAnimation(
+    const Tag viewTag,
+    const std::shared_ptr<AnimationStyleInterpolator> &interpolator,
+    const std::shared_ptr<CSSAnimationSettings> &settings,
+    const std::shared_ptr<KeyframeEasingConfigs> &keyframeEasingConfigs,
+    CSSAnimation::Observer &observer,
+    const double timestamp)
+    : viewTag_(viewTag),
+      settings_(settings),
+      interpolator_(interpolator),
+      progressProvider_(std::make_shared<AnimationProgressProvider>(
+          timestamp,
+          settings->duration,
+          settings->delay,
+          settings->iterationCount,
+          settings->direction,
+          getEasingFunctionFromConfig(settings->easingConfig),
+          keyframeEasingConfigs)),
+      observer_(observer) {
+  if (settings->playState == AnimationPlayState::Paused) {
+    progressProvider_->pause(timestamp);
+  }
+}
+
+folly::dynamic CSSLoopAnimation::getCurrentInterpolationStyle(
+    const std::shared_ptr<const ShadowNode> &shadowNode) const {
+  return interpolator_->interpolate(shadowNode, progressProvider_, FALLBACK_INTERPOLATION_THRESHOLD);
+}
+
+bool CSSLoopAnimation::update(const double timestamp, OperationsLoop & /*loop*/) {
+  progressProvider_->update(timestamp);
+  observer_.onAnimationUpdate(viewTag_);
+
+  if (progressProvider_->getState() == AnimationProgressState::Finished && !settings_->hasForwardsFillMode()) {
+    observer_.onAnimationNeedsRevert(viewTag_);
+  }
+
+  return progressProvider_->getState() == AnimationProgressState::Running;
+}
+
+void CSSLoopAnimation::schedule(OperationsLoop &loop) {
+  if (progressProvider_->getState() != AnimationProgressState::Paused) {
+    const auto timestamp = loop.resolveTimestamp();
+    loop.schedule(shared_from_this(), progressProvider_->getStartTimestamp(timestamp));
+  }
+}
+
+void CSSLoopAnimation::unschedule(OperationsLoop &loop) {
+  loop.remove(shared_from_this());
+}
+
+void CSSLoopAnimation::setAnimatedProperties(const std::unordered_set<std::string> &loopDrivenProperties) {
+  interpolator_->setActiveProperties(loopDrivenProperties);
+}
+
+void CSSLoopAnimation::updateSettings(const PartialCSSAnimationSettings &updatedSettings, const double timestamp) {
+  progressProvider_->resetProgress();
+
+  if (updatedSettings.duration.has_value()) {
+    settings_->duration = updatedSettings.duration.value();
+    progressProvider_->setDuration(updatedSettings.duration.value());
+  }
+  if (updatedSettings.easingConfig.has_value()) {
+    settings_->easingConfig = updatedSettings.easingConfig.value();
+    progressProvider_->setEasingFunction(getEasingFunctionFromConfig(updatedSettings.easingConfig.value()));
+  }
+  if (updatedSettings.delay.has_value()) {
+    settings_->delay = updatedSettings.delay.value();
+    progressProvider_->setDelay(updatedSettings.delay.value());
+  }
+  if (updatedSettings.iterationCount.has_value()) {
+    settings_->iterationCount = updatedSettings.iterationCount.value();
+    progressProvider_->setIterationCount(updatedSettings.iterationCount.value());
+  }
+  if (updatedSettings.direction.has_value()) {
+    settings_->direction = updatedSettings.direction.value();
+    progressProvider_->setDirection(updatedSettings.direction.value());
+  }
+  if (updatedSettings.fillMode.has_value()) {
+    settings_->fillMode = updatedSettings.fillMode.value();
+  }
+  if (updatedSettings.playState.has_value()) {
+    settings_->playState = updatedSettings.playState.value();
+    if (updatedSettings.playState.value() == AnimationPlayState::Paused) {
+      progressProvider_->pause(timestamp);
+    } else {
+      progressProvider_->play(timestamp);
+    }
+  }
+
+  progressProvider_->update(timestamp);
+}
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/core/CSSLoopAnimation.h

@@ -0,0 +1,49 @@
+#pragma once
+
+#include <reanimated/CSS/configs/CSSAnimationConfig.h>
+#include <reanimated/CSS/core/CSSAnimation.h>
+#include <reanimated/CSS/interpolation/styles/AnimationStyleInterpolator.h>
+#include <reanimated/CSS/progress/AnimationProgressProvider.h>
+#include <reanimated/Fabric/updates/OperationsLoop.h>
+
+#include <memory>
+#include <string>
+#include <unordered_set>
+
+namespace reanimated::css {
+
+class CSSLoopAnimation : public OperationsLoop::LoopOperation, public std::enable_shared_from_this<CSSLoopAnimation> {
+ public:
+  CSSLoopAnimation(
+      Tag viewTag,
+      const std::shared_ptr<AnimationStyleInterpolator> &interpolator,
+      const std::shared_ptr<CSSAnimationSettings> &settings,
+      const std::shared_ptr<KeyframeEasingConfigs> &keyframeEasingConfigs,
+      CSSAnimation::Observer &observer,
+      double timestamp);
+
+  AnimationProgressState getState() const {
+    return progressProvider_->getState();
+  }
+
+  folly::dynamic getCurrentInterpolationStyle(const std::shared_ptr<const ShadowNode> &shadowNode) const;
+
+  bool update(double timestamp, OperationsLoop &loop) override;
+
+  void schedule(OperationsLoop &loop);
+  void unschedule(OperationsLoop &loop);
+
+  void setAnimatedProperties(const std::unordered_set<std::string> &loopDrivenProperties);
+  void updateSettings(const PartialCSSAnimationSettings &updatedSettings, double timestamp);
+
+ private:
+  static constexpr double FALLBACK_INTERPOLATION_THRESHOLD = 0.5;
+
+  const Tag viewTag_;
+  const std::shared_ptr<CSSAnimationSettings> settings_;
+  const std::shared_ptr<AnimationStyleInterpolator> interpolator_;
+  const std::shared_ptr<AnimationProgressProvider> progressProvider_;
+  CSSAnimation::Observer &observer_;
+};
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/core/CSSPlatformAnimation.h

@@ -0,0 +1,13 @@
+#pragma once
+
+namespace reanimated::css {
+
+class CSSPlatformAnimation {
+ public:
+  virtual ~CSSPlatformAnimation() = default;
+
+  virtual void schedule(double startTimestamp) = 0;
+  virtual void unschedule() = 0;
+};
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/core/CSSPlatformAnimationFactory.h

@@ -0,0 +1,32 @@
+#pragma once
+
+#include <reanimated/CSS/configs/CSSAnimationConfig.h>
+#include <reanimated/CSS/configs/CSSKeyframesConfig.h>
+#include <reanimated/CSS/core/CSSPlatformAnimation.h>
+
+#include <react/renderer/core/ReactPrimitives.h>
+
+#include <memory>
+#include <string>
+#include <unordered_set>
+
+namespace reanimated::css {
+
+struct PlatformRoutingResult {
+  std::shared_ptr<CSSPlatformAnimation> animation;
+  std::unordered_set<std::string> remainingProperties;
+};
+
+class CSSPlatformAnimationFactory {
+ public:
+  virtual ~CSSPlatformAnimationFactory() = default;
+
+  virtual PlatformRoutingResult resolve(
+      Tag viewTag,
+      const std::string &animationName,
+      const std::unordered_set<std::string> &allProperties,
+      const CSSKeyframesConfig &keyframesConfig,
+      const std::shared_ptr<CSSAnimationSettings> &settings) = 0;
+};
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/core/transition/CSSLoopTransition.cpp

@@ -0,0 +1,156 @@
+#include <reanimated/CSS/core/transition/CSSLoopTransition.h>
+
+#include <jsi/JSIDynamic.h>
+
+#include <memory>
+#include <string>
+#include <utility>
+#include <vector>
+
+namespace reanimated::css {
+
+CSSLoopTransition::CSSLoopTransition(
+    const Tag viewTag,
+    const std::string &componentName,
+    const std::shared_ptr<ViewStylesRepository> &viewStylesRepository,
+    OnUpdateCallback onUpdate)
+    : viewTag_(viewTag),
+      componentName_(componentName),
+      onUpdate_(std::move(onUpdate)),
+      styleInterpolator_(TransitionStyleInterpolator(componentName_, viewStylesRepository)),
+      progressProvider_(TransitionProgressProvider()) {}
+
+double CSSLoopTransition::getMinDelay(double timestamp) const {
+  return progressProvider_.getMinDelay(timestamp);
+}
+
+bool CSSLoopTransition::update(const double timestamp, OperationsLoop &loop) {
+  progressProvider_.update(timestamp);
+  onUpdate_(viewTag_);
+
+  if (progressProvider_.getState() == TransitionProgressState::Pending) {
+    loop.schedule(shared_from_this(), timestamp + progressProvider_.getMinDelay(timestamp));
+  }
+
+  return progressProvider_.getState() == TransitionProgressState::Running;
+}
+
+folly::dynamic CSSLoopTransition::run(
+    jsi::Runtime &rt,
+    const std::shared_ptr<const ShadowNode> &shadowNode,
+    const PropertyValueDiffsMap &propertiesDiffs,
+    const folly::dynamic &lastUpdateValue,
+    const double timestamp) {
+  // Update interpolators and progress providers for changed properties
+  handleChangedProperties(
+      rt, propertiesDiffs, lastUpdateValue.empty() ? folly::dynamic::object() : lastUpdateValue, timestamp);
+  // Advance progress and return the first transition frame
+  progressProvider_.update(timestamp);
+  return computeCurrentStyle(shadowNode);
+}
+
+folly::dynamic CSSLoopTransition::run(
+    const std::shared_ptr<const ShadowNode> &shadowNode,
+    const PropertyValueDynamicDiffsMap &propertiesDiffs,
+    const folly::dynamic &lastUpdateValue,
+    const double timestamp) {
+  handleChangedProperties(
+      propertiesDiffs, lastUpdateValue.empty() ? folly::dynamic::object() : lastUpdateValue, timestamp);
+  progressProvider_.update(timestamp);
+  return computeCurrentStyle(shadowNode);
+}
+
+void CSSLoopTransition::updateSettings(
+    const PropertiesSettingsMap &changedPropertiesSettings,
+    const std::vector<std::string> &removedProperties) {
+
+  // Remove interpolators and progress providers for no longer transitioned props
+  removeProperties(removedProperties);
+
+  // Update the settings saved in progress provider
+  progressProvider_.setPropertySettings(changedPropertiesSettings);
+}
+
+folly::dynamic CSSLoopTransition::computeCurrentStyle(const std::shared_ptr<const ShadowNode> &shadowNode) {
+  auto result = styleInterpolator_.interpolate(shadowNode, progressProvider_);
+  // Remove interpolators for which interpolation has finished
+  // (we won't need them anymore in the current transition)
+  styleInterpolator_.discardFinishedInterpolators(progressProvider_);
+  // And remove finished progress providers after they were used to calculate
+  // the last frame of the transition
+  progressProvider_.discardFinishedProgressProviders();
+  return result;
+}
+
+void CSSLoopTransition::handleChangedProperties(
+    jsi::Runtime &rt,
+    const PropertyValueDiffsMap &propertiesDiffs,
+    const folly::dynamic &lastUpdateValue,
+    const double timestamp) {
+  const auto null = folly::dynamic();
+
+  for (const auto &[propertyName, propertyDiff] : propertiesDiffs) {
+    const auto allowDiscrete = progressProvider_.getPropertySettings(propertyName).allowDiscrete;
+
+    if (!allowDiscrete && isDiscreteProperty(propertyName, componentName_)) {
+      removeProperty(propertyName);
+      continue;
+    }
+
+    // Update the transition style interpolator
+    bool isReversed;
+    if (lastUpdateValue.count(propertyName)) {
+      // TODO - get rid of lastValue dynamic in the future
+      isReversed = styleInterpolator_.createOrUpdateInterpolator(
+          rt, propertyName, jsi::valueFromDynamic(rt, lastUpdateValue.at(propertyName)), propertyDiff.second);
+    } else {
+      isReversed =
+          styleInterpolator_.createOrUpdateInterpolator(rt, propertyName, propertyDiff.first, propertyDiff.second);
+    }
+
+    // We still pass allowDiscrete to use correct threshold for interpolation between incompatible values
+    // (e.g. when someone passes a keyword and a numeric value - in this case we interpolate them as discrete values)
+    styleInterpolator_.setAllowDiscrete(propertyName, allowDiscrete);
+
+    // Update the transition progress provider
+    progressProvider_.runProgressProvider(propertyName, isReversed, timestamp);
+  }
+}
+
+void CSSLoopTransition::handleChangedProperties(
+    const PropertyValueDynamicDiffsMap &propertiesDiffs,
+    const folly::dynamic &lastUpdateValue,
+    const double timestamp) {
+  for (const auto &[propertyName, propertyDiff] : propertiesDiffs) {
+    const auto allowDiscrete = progressProvider_.getPropertySettings(propertyName).allowDiscrete;
+
+    if (!allowDiscrete && isDiscreteProperty(propertyName, componentName_)) {
+      removeProperty(propertyName);
+      continue;
+    }
+
+    bool isReversed;
+    if (lastUpdateValue.count(propertyName)) {
+      isReversed = styleInterpolator_.createOrUpdateInterpolator(
+          propertyName, lastUpdateValue.at(propertyName), propertyDiff.second);
+    } else {
+      isReversed = styleInterpolator_.createOrUpdateInterpolator(propertyName, propertyDiff.first, propertyDiff.second);
+    }
+
+    styleInterpolator_.setAllowDiscrete(propertyName, allowDiscrete);
+
+    progressProvider_.runProgressProvider(propertyName, isReversed, timestamp);
+  }
+}
+
+void CSSLoopTransition::removeProperties(const std::vector<std::string> &propertyNames) {
+  styleInterpolator_.removeProperties(propertyNames);
+  progressProvider_.removeProperties(propertyNames);
+}
+
+void CSSLoopTransition::removeProperty(const std::string &propertyName) {
+  styleInterpolator_.removeProperty(propertyName);
+  progressProvider_.removeProperty(propertyName);
+}
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/core/transition/CSSLoopTransition.h

@@ -0,0 +1,71 @@
+#pragma once
+
+#include <reanimated/CSS/configs/CSSTransitionConfig.h>
+#include <reanimated/CSS/interpolation/styles/TransitionStyleInterpolator.h>
+#include <reanimated/CSS/progress/TransitionProgressProvider.h>
+#include <reanimated/Fabric/updates/OperationsLoop.h>
+
+#include <folly/dynamic.h>
+#include <jsi/jsi.h>
+#include <functional>
+#include <memory>
+#include <string>
+#include <vector>
+
+namespace reanimated::css {
+
+class CSSLoopTransition : public OperationsLoop::LoopOperation, public std::enable_shared_from_this<CSSLoopTransition> {
+ public:
+  using OnUpdateCallback = std::function<void(Tag)>;
+
+  CSSLoopTransition(
+      Tag viewTag,
+      const std::string &componentName,
+      const std::shared_ptr<ViewStylesRepository> &viewStylesRepository,
+      OnUpdateCallback onUpdate);
+
+  double getMinDelay(double timestamp) const;
+
+  bool update(double timestamp, OperationsLoop &loop) override;
+
+  folly::dynamic run(
+      jsi::Runtime &rt,
+      const std::shared_ptr<const ShadowNode> &shadowNode,
+      const PropertyValueDiffsMap &propertiesDiffs,
+      const folly::dynamic &lastUpdateValue,
+      double timestamp);
+  /** TODO: unify folly::dynamic and jsi::value versions */
+  folly::dynamic run(
+      const std::shared_ptr<const ShadowNode> &shadowNode,
+      const PropertyValueDynamicDiffsMap &propertiesDiffs,
+      const folly::dynamic &lastUpdateValue,
+      double timestamp);
+  void updateSettings(
+      const PropertiesSettingsMap &changedPropertiesSettings,
+      const std::vector<std::string> &removedProperties);
+
+  folly::dynamic computeCurrentStyle(const std::shared_ptr<const ShadowNode> &shadowNode);
+
+ private:
+  const Tag viewTag_;
+  const std::string componentName_;
+  OnUpdateCallback onUpdate_;
+
+  TransitionStyleInterpolator styleInterpolator_;
+  TransitionProgressProvider progressProvider_;
+
+  void handleChangedProperties(
+      jsi::Runtime &rt,
+      const PropertyValueDiffsMap &propertiesDiffs,
+      const folly::dynamic &lastUpdateValue,
+      double timestamp);
+  /** TODO: unify folly::dynamic and jsi::value versions */
+  void handleChangedProperties(
+      const PropertyValueDynamicDiffsMap &propertiesDiffs,
+      const folly::dynamic &lastUpdateValue,
+      double timestamp);
+  void removeProperties(const std::vector<std::string> &propertyNames);
+  void removeProperty(const std::string &propertyName);
+};
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/core/transition/CSSPlatformTransitionProxy.cpp

@@ -0,0 +1,141 @@
+#include <reanimated/CSS/core/transition/CSSPlatformTransitionProxy.h>
+
+#include <react/debug/react_native_assert.h>
+
+#include <utility>
+
+namespace reanimated::css {
+
+CSSPlatformTransitionProxy::CSSPlatformTransitionProxy(
+    CSSCanRoutePropertyFunction canRoute,
+    CSSApplyTransitionJSIFunction applyJSI,
+    CSSApplyTransitionDynamicFunction applyDynamic,
+    CSSRemoveTransitionFunction removeTransition)
+    : canRoute_(std::move(canRoute)),
+      applyJSI_(std::move(applyJSI)),
+      applyDynamic_(std::move(applyDynamic)),
+      removeTransition_(std::move(removeTransition)) {}
+
+bool CSSPlatformTransitionProxy::canRoute(const std::string &propertyName, const EasingConfig &easing) const {
+  return canRoute_ && canRoute_(propertyName, easing);
+}
+
+bool CSSPlatformTransitionProxy::apply(
+    jsi::Runtime &rt,
+    const Tag viewTag,
+    const std::string &propertyName,
+    const jsi::Value &fromValue,
+    const jsi::Value &toValue,
+    const CSSTransitionPropertySettings &settings,
+    const double timestamp) const {
+  return applyJSI_ && applyJSI_(rt, viewTag, propertyName, fromValue, toValue, settings, timestamp);
+}
+
+bool CSSPlatformTransitionProxy::apply(
+    const Tag viewTag,
+    const std::string &propertyName,
+    const folly::dynamic &fromValue,
+    const folly::dynamic &toValue,
+    const double timestamp) const {
+  return applyDynamic_ && applyDynamic_(viewTag, propertyName, fromValue, toValue, timestamp);
+}
+
+void CSSPlatformTransitionProxy::remove(const Tag viewTag, const std::string &propertyName) const {
+  if (removeTransition_) {
+    removeTransition_(viewTag, propertyName);
+  }
+}
+
+CSSTransitionConfig CSSPlatformTransitionProxy::processConfig(
+    jsi::Runtime &rt,
+    const Tag viewTag,
+    const CSSTransitionConfig &config,
+    CSSTransitionRouting &routing,
+    const double timestamp) const {
+  CSSTransitionConfig loopConfig;
+#ifndef NDEBUG
+  size_t matchedValues = 0;
+#endif // NDEBUG
+
+  for (const auto &[propertyName, settings] : config.changedPropertiesSettings) {
+    const auto valueIt = config.changedProperties.find(propertyName);
+    const bool hasValue = valueIt != config.changedProperties.end();
+#ifndef NDEBUG
+    if (hasValue) {
+      ++matchedValues;
+    }
+#endif // NDEBUG
+
+    bool routable = canRoute(propertyName, settings.easingConfig);
+    if (routable && hasValue) {
+      routable = apply(rt, viewTag, propertyName, valueIt->second.first, valueIt->second.second, settings, timestamp);
+    } else if (routable) {
+      // Settings-only: stay on the platform only if already animating there.
+      routable = routing.platform.contains(propertyName);
+    }
+
+    if (routable) {
+      // loop -> platform migration cancels on the loop side.
+      if (routing.loop.erase(propertyName) > 0) {
+        loopConfig.removedProperties.push_back(propertyName);
+      }
+      routing.platform.insert(propertyName);
+    } else {
+      // platform -> loop migration cancels on the platform side.
+      if (routing.platform.erase(propertyName) > 0) {
+        remove(viewTag, propertyName);
+      }
+      routing.loop.insert(propertyName);
+      if (hasValue) {
+        loopConfig.changedProperties.emplace(
+            propertyName,
+            std::make_pair(jsi::Value(rt, valueIt->second.first), jsi::Value(rt, valueIt->second.second)));
+      }
+      loopConfig.changedPropertiesSettings.emplace(propertyName, settings);
+    }
+  }
+
+  // The parser pairs every value diff with settings, so all must have matched one.
+  react_native_assert(
+      matchedValues == config.changedProperties.size() && "[Reanimated] CSS transition value diff without settings");
+
+  for (const auto &propertyName : config.removedProperties) {
+    if (routing.platform.erase(propertyName) > 0) {
+      remove(viewTag, propertyName);
+    } else if (routing.loop.erase(propertyName) > 0) {
+      loopConfig.removedProperties.push_back(propertyName);
+    }
+  }
+
+  return loopConfig;
+}
+
+PropertyValueDynamicDiffsMap CSSPlatformTransitionProxy::processDynamicDiffs(
+    const Tag viewTag,
+    const PropertyValueDynamicDiffsMap &propertyDiffs,
+    CSSTransitionRouting &routing,
+    const double timestamp) const {
+  PropertyValueDynamicDiffsMap loopDiffs;
+  for (const auto &[propertyName, propertyDiff] : propertyDiffs) {
+    // A platform-routed property keeps animating natively while the platform can
+    // still express the toggled value; otherwise it migrates to the loop.
+    if (routing.platform.contains(propertyName)) {
+      if (apply(viewTag, propertyName, propertyDiff.first, propertyDiff.second, timestamp)) {
+        continue;
+      }
+      routing.platform.erase(propertyName);
+      remove(viewTag, propertyName);
+      routing.loop.insert(propertyName);
+    }
+    loopDiffs.emplace(propertyName, propertyDiff);
+  }
+  return loopDiffs;
+}
+
+void CSSPlatformTransitionProxy::cancelAll(const Tag viewTag, const TransitionProperties &properties) const {
+  for (const auto &propertyName : properties) {
+    remove(viewTag, propertyName);
+  }
+}
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/core/transition/CSSPlatformTransitionProxy.h

@@ -0,0 +1,104 @@
+#pragma once
+
+#include <reanimated/CSS/common/definitions.h>
+#include <reanimated/CSS/configs/CSSTransitionConfig.h>
+#include <reanimated/CSS/easing/EasingConfigs.h>
+
+#include <folly/dynamic.h>
+#include <jsi/jsi.h>
+#include <react/renderer/core/ReactPrimitives.h>
+
+#include <functional>
+#include <string>
+
+namespace reanimated::css {
+
+using namespace facebook;
+using namespace react;
+
+/// Whether the platform can animate the property natively for the given easing.
+using CSSCanRoutePropertyFunction = std::function<bool(const std::string &propertyName, const EasingConfig &easing)>;
+/// Animates a routed property natively; a false (no-op) return means the platform
+/// can't express the value, so it falls back to the loop. The jsi overload is the
+/// config path (carries a runtime + settings); the folly overload, the toggle path.
+using CSSApplyTransitionJSIFunction = std::function<bool(
+    jsi::Runtime &rt,
+    Tag viewTag,
+    const std::string &propertyName,
+    const jsi::Value &fromValue,
+    const jsi::Value &toValue,
+    const CSSTransitionPropertySettings &settings,
+    double timestamp)>;
+using CSSApplyTransitionDynamicFunction = std::function<bool(
+    Tag viewTag,
+    const std::string &propertyName,
+    const folly::dynamic &fromValue,
+    const folly::dynamic &toValue,
+    double timestamp)>;
+/// Cancels the property's native transition and drops its platform-side state.
+using CSSRemoveTransitionFunction = std::function<void(Tag viewTag, const std::string &propertyName)>;
+
+/// A view's transition partition: which properties animate on the platform vs the
+/// C++ loop. Owned per-view by CSSTransition; updated by the proxy on migrations.
+struct CSSTransitionRouting {
+  TransitionProperties platform;
+  TransitionProperties loop;
+};
+
+/// Stateless, shared routing engine: per property it routes a view's CSS transition
+/// to the platform (animated natively via the hooks above) or the C++ loop, never
+/// seeing the value - it forwards the raw JS source to the platform. Per-view routing
+/// state is passed in; an absent hook keeps that property on the loop.
+class CSSPlatformTransitionProxy {
+ public:
+  CSSPlatformTransitionProxy(
+      CSSCanRoutePropertyFunction canRoute,
+      CSSApplyTransitionJSIFunction applyJSI,
+      CSSApplyTransitionDynamicFunction applyDynamic,
+      CSSRemoveTransitionFunction removeTransition);
+
+  /// Routes the config between platform and loop, updating `routing` and returning
+  /// the loop-routed remainder to run.
+  CSSTransitionConfig processConfig(
+      jsi::Runtime &rt,
+      Tag viewTag,
+      const CSSTransitionConfig &config,
+      CSSTransitionRouting &routing,
+      double timestamp) const;
+
+  /// Re-routes pseudo-selector toggle diffs: a property the platform can no longer
+  /// express migrates to the loop. Updates `routing`, returns the loop diffs.
+  PropertyValueDynamicDiffsMap processDynamicDiffs(
+      Tag viewTag,
+      const PropertyValueDynamicDiffsMap &propertyDiffs,
+      CSSTransitionRouting &routing,
+      double timestamp) const;
+
+  /// Cancels the native transition of every given property (teardown).
+  void cancelAll(Tag viewTag, const TransitionProperties &properties) const;
+
+ private:
+  bool canRoute(const std::string &propertyName, const EasingConfig &easing) const;
+  bool apply(
+      jsi::Runtime &rt,
+      Tag viewTag,
+      const std::string &propertyName,
+      const jsi::Value &fromValue,
+      const jsi::Value &toValue,
+      const CSSTransitionPropertySettings &settings,
+      double timestamp) const;
+  bool apply(
+      Tag viewTag,
+      const std::string &propertyName,
+      const folly::dynamic &fromValue,
+      const folly::dynamic &toValue,
+      double timestamp) const;
+  void remove(Tag viewTag, const std::string &propertyName) const;
+
+  CSSCanRoutePropertyFunction canRoute_;
+  CSSApplyTransitionJSIFunction applyJSI_;
+  CSSApplyTransitionDynamicFunction applyDynamic_;
+  CSSRemoveTransitionFunction removeTransition_;
+};
+
+} // namespace reanimated::css