@react-native-ohos/react-native-reanimated 3.18.2-rc.2 → 4.0.0-rc.1

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/interpolation/transforms/operations/scale.cpp

@@ -0,0 +1,28 @@
+#include <reanimated/CSS/interpolation/transforms/operations/scale.h>
+
+#include <memory>
+
+namespace reanimated::css {
+
+template <TransformOp TOperation>
+ScaleOperationBase<TOperation>::ScaleOperationBase(const double value)
+    : TransformOperationBase<TOperation, CSSDouble>(CSSDouble(value)) {}
+
+bool ScaleOperation::canConvertTo(TransformOp type) const {
+  return type == TransformOp::ScaleX || type == TransformOp::ScaleY;
+}
+
+TransformOperations ScaleOperation::convertTo(TransformOp type) const {
+  assertCanConvertTo(type);
+  if (type == TransformOp::ScaleX) {
+    return {std::make_shared<ScaleXOperation>(value), std::make_shared<ScaleYOperation>(value)};
+  } else {
+    return {std::make_shared<ScaleYOperation>(value), std::make_shared<ScaleXOperation>(value)};
+  }
+}
+
+template struct ScaleOperationBase<TransformOp::ScaleX>;
+template struct ScaleOperationBase<TransformOp::ScaleY>;
+template struct ScaleOperationBase<TransformOp::Scale>;
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/interpolation/transforms/operations/scale.h

@@ -0,0 +1,25 @@
+#pragma once
+
+#include <reanimated/CSS/common/values/CSSNumber.h>
+#include <reanimated/CSS/interpolation/transforms/TransformOperation.h>
+
+namespace reanimated::css {
+
+template <TransformOp TOperation>
+struct ScaleOperationBase : public TransformOperationBase<TOperation, CSSDouble> {
+  using TransformOperationBase<TOperation, CSSDouble>::TransformOperationBase;
+
+  explicit ScaleOperationBase(const double value);
+};
+
+using ScaleXOperation = ScaleOperationBase<TransformOp::ScaleX>;
+using ScaleYOperation = ScaleOperationBase<TransformOp::ScaleY>;
+
+struct ScaleOperation final : public ScaleOperationBase<TransformOp::Scale> {
+  using ScaleOperationBase<TransformOp::Scale>::ScaleOperationBase;
+
+  bool canConvertTo(TransformOp type) const override;
+  TransformOperations convertTo(TransformOp type) const override;
+};
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/interpolation/transforms/operations/skew.cpp

@@ -0,0 +1,14 @@
+#include <reanimated/CSS/interpolation/transforms/operations/skew.h>
+
+#include <string>
+
+namespace reanimated::css {
+
+template <TransformOp TOperation>
+SkewOperationBase<TOperation>::SkewOperationBase(const std::string &value)
+    : TransformOperationBase<TOperation, CSSAngle>(CSSAngle(value)) {}
+
+template struct SkewOperationBase<TransformOp::SkewX>;
+template struct SkewOperationBase<TransformOp::SkewY>;
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/interpolation/transforms/operations/skew.h

@@ -0,0 +1,20 @@
+#pragma once
+
+#include <reanimated/CSS/common/values/CSSAngle.h>
+#include <reanimated/CSS/interpolation/transforms/TransformOperation.h>
+
+#include <string>
+
+namespace reanimated::css {
+
+template <TransformOp TOperation>
+struct SkewOperationBase : public TransformOperationBase<TOperation, CSSAngle> {
+  using TransformOperationBase<TOperation, CSSAngle>::TransformOperationBase;
+
+  explicit SkewOperationBase(const std::string &value);
+};
+
+using SkewXOperation = SkewOperationBase<TransformOp::SkewX>;
+using SkewYOperation = SkewOperationBase<TransformOp::SkewY>;
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/interpolation/transforms/operations/translate.cpp

@@ -0,0 +1,39 @@
+#include <reanimated/CSS/common/transforms/TransformMatrix2D.h>
+#include <reanimated/CSS/common/transforms/TransformMatrix3D.h>
+#include <reanimated/CSS/interpolation/transforms/operations/translate.h>
+
+#include <memory>
+#include <string>
+
+namespace reanimated::css {
+
+template <TransformOp TOperation>
+TranslateOperationBase<TOperation>::TranslateOperationBase(double value)
+    : TransformOperationBase<TOperation, CSSLength>(CSSLength(value)) {}
+
+template <TransformOp TOperation>
+TranslateOperationBase<TOperation>::TranslateOperationBase(const std::string &value)
+    : TransformOperationBase<TOperation, CSSLength>(CSSLength(value)) {}
+
+template <TransformOp TOperation>
+bool TranslateOperationBase<TOperation>::shouldResolve() const {
+  return this->value.isRelative;
+}
+
+template <TransformOp TOperation>
+TransformMatrix::Shared TranslateOperationBase<TOperation>::toMatrix(bool force3D) const {
+  if (shouldResolve()) {
+    throw std::runtime_error(
+        "[Reanimated] Cannot convert unresolved relative translate value to matrix: " + this->value.toString());
+  }
+
+  if (force3D) {
+    return std::make_shared<TransformMatrix3D>(TransformMatrix3D::create<TOperation>(this->value.value));
+  }
+  return std::make_shared<TransformMatrix2D>(TransformMatrix2D::create<TOperation>(this->value.value));
+}
+
+template struct TranslateOperationBase<TransformOp::TranslateX>;
+template struct TranslateOperationBase<TransformOp::TranslateY>;
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/interpolation/transforms/operations/translate.h

@@ -0,0 +1,25 @@
+#pragma once
+
+#include <reanimated/CSS/common/values/CSSLength.h>
+#include <reanimated/CSS/interpolation/transforms/TransformOperation.h>
+
+#include <memory>
+#include <string>
+
+namespace reanimated::css {
+
+template <TransformOp TOperation>
+struct TranslateOperationBase : public TransformOperationBase<TOperation, CSSLength> {
+  using TransformOperationBase<TOperation, CSSLength>::TransformOperationBase;
+
+  explicit TranslateOperationBase(double value);
+  explicit TranslateOperationBase(const std::string &value);
+
+  bool shouldResolve() const override;
+  TransformMatrix::Shared toMatrix(bool force3D) const override;
+};
+
+using TranslateXOperation = TranslateOperationBase<TransformOp::TranslateX>;
+using TranslateYOperation = TranslateOperationBase<TransformOp::TranslateY>;
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/interpolation/values/ResolvableValueInterpolator.cpp

@@ -0,0 +1,47 @@
+#include <reanimated/CSS/interpolation/values/ResolvableValueInterpolator.h>
+
+#include <folly/dynamic.h>
+#include <jsi/jsi.h>
+
+#include <reanimated/CSS/common/values/CSSAngle.h>
+#include <reanimated/CSS/common/values/CSSKeyword.h>
+#include <reanimated/CSS/common/values/CSSLength.h>
+#include <reanimated/CSS/common/values/CSSNumber.h>
+
+#include <memory>
+
+namespace reanimated::css {
+
+template <typename... AllowedTypes>
+ResolvableValueInterpolator<AllowedTypes...>::ResolvableValueInterpolator(
+    const PropertyPath &propertyPath,
+    const ValueType &defaultStyleValue,
+    const std::shared_ptr<ViewStylesRepository> &viewStylesRepository,
+    const ResolvableValueInterpolatorConfig &config)
+    : SimpleValueInterpolator<AllowedTypes...>(propertyPath, defaultStyleValue, viewStylesRepository),
+      config_(config) {}
+
+template <typename... AllowedTypes>
+folly::dynamic ResolvableValueInterpolator<AllowedTypes...>::interpolateValue(
+    double progress,
+    const std::shared_ptr<CSSValue> &fromValue,
+    const std::shared_ptr<CSSValue> &toValue,
+    const ValueInterpolationContext &context) const {
+  const auto &from = std::static_pointer_cast<ValueType>(fromValue);
+  const auto &to = std::static_pointer_cast<ValueType>(toValue);
+  return from
+      ->interpolate(
+          progress,
+          *to,
+          {.node = context.node,
+           .fallbackInterpolateThreshold = context.fallbackInterpolateThreshold,
+           .viewStylesRepository = this->viewStylesRepository_,
+           .relativeProperty = config_.relativeProperty,
+           .relativeTo = config_.relativeTo})
+      .toDynamic();
+}
+
+template class ResolvableValueInterpolator<CSSLength>;
+template class ResolvableValueInterpolator<CSSLength, CSSKeyword>;
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/interpolation/values/ResolvableValueInterpolator.h

@@ -0,0 +1,43 @@
+#pragma once
+
+#include <reanimated/CSS/interpolation/configs.h>
+#include <reanimated/CSS/interpolation/values/SimpleValueInterpolator.h>
+
+#include <memory>
+
+namespace reanimated::css {
+
+/**
+ * Concrete implementation of ValueInterpolator for CSS values that require
+ * resolution before interpolation. This class handles interpolation of relative
+ * values (e.g., percentage length values) that need to be resolved to absolute
+ * values using the context describing the ShadowNode before the interpolation
+ * can occur.
+ */
+template <typename... AllowedTypes>
+class ResolvableValueInterpolator final : public SimpleValueInterpolator<AllowedTypes...> {
+  static_assert(
+      (... && std::is_base_of<CSSValue, AllowedTypes>::value),
+      "[Reanimated] ResolvableValueInterpolator: All interpolated types must inherit from CSSValue");
+
+ public:
+  using ValueType = typename SimpleValueInterpolator<AllowedTypes...>::ValueType;
+
+  explicit ResolvableValueInterpolator(
+      const PropertyPath &propertyPath,
+      const ValueType &defaultStyleValue,
+      const std::shared_ptr<ViewStylesRepository> &viewStylesRepository,
+      const ResolvableValueInterpolatorConfig &config);
+
+ protected:
+  folly::dynamic interpolateValue(
+      double progress,
+      const std::shared_ptr<CSSValue> &fromValue,
+      const std::shared_ptr<CSSValue> &toValue,
+      const ValueInterpolationContext &context) const override;
+
+ private:
+  const ResolvableValueInterpolatorConfig &config_;
+};
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/interpolation/values/SimpleValueInterpolator.cpp

@@ -0,0 +1,70 @@
+#include <reanimated/CSS/interpolation/values/SimpleValueInterpolator.h>
+
+#include <folly/dynamic.h>
+#include <jsi/jsi.h>
+
+#include <reanimated/CSS/common/values/CSSAngle.h>
+#include <reanimated/CSS/common/values/CSSBoolean.h>
+#include <reanimated/CSS/common/values/CSSColor.h>
+#include <reanimated/CSS/common/values/CSSDiscreteArray.h>
+#include <reanimated/CSS/common/values/CSSKeyword.h>
+#include <reanimated/CSS/common/values/CSSLength.h>
+#include <reanimated/CSS/common/values/CSSNumber.h>
+#include <reanimated/CSS/common/values/complex/CSSBoxShadow.h>
+#include <reanimated/CSS/svg/values/SVGBrush.h>
+#include <reanimated/CSS/svg/values/SVGLength.h>
+#include <reanimated/CSS/svg/values/SVGStrokeDashArray.h>
+
+#include <memory>
+
+namespace reanimated::css {
+
+template <typename... AllowedTypes>
+SimpleValueInterpolator<AllowedTypes...>::SimpleValueInterpolator(
+    const PropertyPath &propertyPath,
+    const ValueType &defaultStyleValue,
+    const std::shared_ptr<ViewStylesRepository> &viewStylesRepository)
+    : ValueInterpolator(propertyPath, std::make_shared<ValueType>(defaultStyleValue), viewStylesRepository) {}
+
+template <typename... AllowedTypes>
+std::shared_ptr<CSSValue> SimpleValueInterpolator<AllowedTypes...>::createValue(
+    jsi::Runtime &rt,
+    const jsi::Value &value) const {
+  return std::make_shared<ValueType>(rt, value);
+}
+
+template <typename... AllowedTypes>
+std::shared_ptr<CSSValue> SimpleValueInterpolator<AllowedTypes...>::createValue(const folly::dynamic &value) const {
+  return std::make_shared<ValueType>(value);
+}
+
+template <typename... AllowedTypes>
+folly::dynamic SimpleValueInterpolator<AllowedTypes...>::interpolateValue(
+    double progress,
+    const std::shared_ptr<CSSValue> &fromValue,
+    const std::shared_ptr<CSSValue> &toValue,
+    const ValueInterpolationContext &context) const {
+  const auto &from = std::static_pointer_cast<ValueType>(fromValue);
+  const auto &to = std::static_pointer_cast<ValueType>(toValue);
+  return from->interpolate(progress, *to, context).toDynamic();
+}
+
+template class SimpleValueInterpolator<CSSLength>;
+template class SimpleValueInterpolator<CSSLength, CSSKeyword>;
+template class SimpleValueInterpolator<CSSDouble>;
+template class SimpleValueInterpolator<CSSDouble, CSSKeyword>;
+template class SimpleValueInterpolator<CSSInteger>;
+template class SimpleValueInterpolator<CSSAngle>;
+template class SimpleValueInterpolator<CSSColor>;
+template class SimpleValueInterpolator<CSSBoolean>;
+template class SimpleValueInterpolator<CSSDisplay>;
+template class SimpleValueInterpolator<CSSKeyword>;
+template class SimpleValueInterpolator<CSSBoxShadow>;
+template class SimpleValueInterpolator<CSSDiscreteArray<CSSKeyword>>;
+
+template class SimpleValueInterpolator<SVGLength>;
+template class SimpleValueInterpolator<SVGLength, CSSKeyword>;
+template class SimpleValueInterpolator<SVGStrokeDashArray, CSSKeyword>;
+template class SimpleValueInterpolator<SVGBrush>;
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/interpolation/values/SimpleValueInterpolator.h

@@ -0,0 +1,40 @@
+#pragma once
+
+#include <reanimated/CSS/interpolation/values/ValueInterpolator.h>
+
+#include <memory>
+
+namespace reanimated::css {
+
+/**
+ * Concrete implementation of ValueInterpolator for simple CSS values that don't
+ * require resolution before interpolation. This class handles direct
+ * interpolation between values without any additional processing or resolution.
+ */
+template <typename... AllowedTypes>
+class SimpleValueInterpolator : public ValueInterpolator {
+  static_assert(
+      (... && std::is_base_of<CSSValue, AllowedTypes>::value),
+      "[Reanimated] SimpleValueInterpolator: All interpolated types must inherit from CSSValue");
+
+ public:
+  using ValueType = CSSValueVariant<AllowedTypes...>;
+
+  explicit SimpleValueInterpolator(
+      const PropertyPath &propertyPath,
+      const ValueType &defaultStyleValue,
+      const std::shared_ptr<ViewStylesRepository> &viewStylesRepository);
+
+ protected:
+  std::shared_ptr<CSSValue> createValue(jsi::Runtime &rt, const jsi::Value &value) const override;
+
+  std::shared_ptr<CSSValue> createValue(const folly::dynamic &value) const override;
+
+  folly::dynamic interpolateValue(
+      double progress,
+      const std::shared_ptr<CSSValue> &fromValue,
+      const std::shared_ptr<CSSValue> &toValue,
+      const ValueInterpolationContext &context) const override;
+};
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/interpolation/values/ValueInterpolator.cpp

@@ -0,0 +1,146 @@
+#include <reanimated/CSS/interpolation/values/ValueInterpolator.h>
+
+#include <memory>
+#include <utility>
+
+namespace reanimated::css {
+
+ValueInterpolator::ValueInterpolator(
+    const PropertyPath &propertyPath,
+    const std::shared_ptr<CSSValue> &defaultValue,
+    const std::shared_ptr<ViewStylesRepository> &viewStylesRepository)
+    : PropertyInterpolator(propertyPath, viewStylesRepository),
+      defaultStyleValue_(defaultValue),
+      defaultStyleValueDynamic_(defaultValue->toDynamic()) {}
+
+folly::dynamic ValueInterpolator::getStyleValue(const std::shared_ptr<const ShadowNode> &shadowNode) const {
+  return viewStylesRepository_->getStyleProp(shadowNode->getTag(), propertyPath_);
+}
+
+folly::dynamic ValueInterpolator::getResetStyle(const std::shared_ptr<const ShadowNode> &shadowNode) const {
+  auto styleValue = getStyleValue(shadowNode);
+
+  if (styleValue.isNull()) {
+    return defaultStyleValueDynamic_;
+  }
+
+  return styleValue;
+}
+
+folly::dynamic ValueInterpolator::getFirstKeyframeValue() const {
+  return convertOptionalToDynamic(keyframes_.front().value);
+}
+
+folly::dynamic ValueInterpolator::getLastKeyframeValue() const {
+  return convertOptionalToDynamic(keyframes_.back().value);
+}
+
+bool ValueInterpolator::equalsReversingAdjustedStartValue(const folly::dynamic &propertyValue) const {
+  if (reversingAdjustedStartValue_.isNull()) {
+    return propertyValue.isNull();
+  }
+  return reversingAdjustedStartValue_ == propertyValue;
+}
+
+void ValueInterpolator::updateKeyframes(jsi::Runtime &rt, const jsi::Value &keyframes) {
+  const auto parsedKeyframes = parseJSIKeyframes(rt, keyframes);
+
+  keyframes_.clear();
+  keyframes_.reserve(parsedKeyframes.size());
+
+  for (const auto &[offset, value] : parsedKeyframes) {
+    if (value.isUndefined()) {
+      keyframes_.emplace_back(offset, std::nullopt);
+    } else {
+      keyframes_.emplace_back(offset, std::make_optional(createValue(rt, value)));
+    }
+  }
+}
+
+void ValueInterpolator::updateKeyframesFromStyleChange(
+    const folly::dynamic &oldStyleValue,
+    const folly::dynamic &newStyleValue,
+    const folly::dynamic &lastUpdateValue) {
+  ValueKeyframe firstKeyframe, lastKeyframe;
+
+  if (!lastUpdateValue.isNull()) {
+    firstKeyframe = ValueKeyframe{0, createValue(lastUpdateValue)};
+  } else if (!oldStyleValue.isNull()) {
+    firstKeyframe = ValueKeyframe{0, createValue(oldStyleValue)};
+  } else {
+    firstKeyframe = ValueKeyframe{0, defaultStyleValue_};
+  }
+
+  if (newStyleValue.isNull()) {
+    lastKeyframe = ValueKeyframe{1, defaultStyleValue_};
+  } else {
+    lastKeyframe = ValueKeyframe{1, createValue(newStyleValue)};
+  }
+
+  keyframes_ = {std::move(firstKeyframe), std::move(lastKeyframe)};
+  reversingAdjustedStartValue_ = oldStyleValue;
+}
+
+folly::dynamic ValueInterpolator::interpolate(
+    const std::shared_ptr<const ShadowNode> &shadowNode,
+    const std::shared_ptr<KeyframeProgressProvider> &progressProvider,
+    const double fallbackInterpolateThreshold) const {
+  const auto toIndex = getToKeyframeIndex(progressProvider);
+  const auto fromIndex = toIndex - 1;
+
+  const auto &fromKeyframe = keyframes_[fromIndex];
+  const auto &toKeyframe = keyframes_[toIndex];
+
+  // clang-format off
+  const auto &fromValue = fromKeyframe.value
+      ? fromKeyframe.value.value()
+      : getFallbackValue(shadowNode);
+  const auto &toValue = toKeyframe.value
+      ? toKeyframe.value.value()
+      : getFallbackValue(shadowNode);
+  // clang-format on
+
+  const auto keyframeProgress = progressProvider->getKeyframeProgress(fromKeyframe.offset, toKeyframe.offset);
+
+  if (keyframeProgress == 1.0) {
+    return toValue->toDynamic();
+  }
+  if (keyframeProgress == 0.0) {
+    return fromValue->toDynamic();
+  }
+
+  return interpolateValue(
+      keyframeProgress,
+      fromValue,
+      toValue,
+      {.node = shadowNode, .fallbackInterpolateThreshold = fallbackInterpolateThreshold});
+}
+
+folly::dynamic ValueInterpolator::convertOptionalToDynamic(
+    const std::optional<std::shared_ptr<CSSValue>> &value) const {
+  return value ? value.value()->toDynamic() : folly::dynamic();
+}
+
+std::shared_ptr<CSSValue> ValueInterpolator::getFallbackValue(
+    const std::shared_ptr<const ShadowNode> &shadowNode) const {
+  const auto styleValue = getStyleValue(shadowNode);
+  return styleValue.isNull() ? defaultStyleValue_ : createValue(styleValue);
+}
+
+size_t ValueInterpolator::getToKeyframeIndex(const std::shared_ptr<KeyframeProgressProvider> &progressProvider) const {
+  const auto progress = progressProvider->getGlobalProgress();
+
+  const auto it = std::upper_bound(
+      keyframes_.begin(), keyframes_.end(), progress, [](double progress, const ValueKeyframe &keyframe) {
+        return progress < keyframe.offset;
+      });
+
+  // If we're at the end, return the last valid keyframe index
+  if (it == keyframes_.end()) {
+    return keyframes_.size() - 1;
+  }
+
+  return std::distance(keyframes_.begin(), it);
+}
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/interpolation/values/ValueInterpolator.h

@@ -0,0 +1,71 @@
+#pragma once
+
+#include <reanimated/CSS/common/values/CSSValueVariant.h>
+#include <reanimated/CSS/interpolation/PropertyInterpolator.h>
+
+#include <memory>
+#include <optional>
+#include <vector>
+
+namespace reanimated::css {
+
+struct ValueKeyframe {
+  double offset;
+  std::optional<std::shared_ptr<CSSValue>> value;
+  ValueKeyframe() : offset(0.0), value(std::nullopt) {}      
+  ValueKeyframe(double offset, std::optional<std::shared_ptr<CSSValue>> value = std::nullopt)
+    : offset(offset), value(std::move(value)) {}            
+};
+
+/**
+ * Base class for CSS value interpolators that provides common functionality
+ * for interpolating CSS values during animations. This class should be extended
+ * by concrete implementations for specific CSS value types to provide
+ * type-specific interpolation logic.
+ */
+class ValueInterpolator : public PropertyInterpolator {
+ public:
+  explicit ValueInterpolator(
+      const PropertyPath &propertyPath,
+      const std::shared_ptr<CSSValue> &defaultValue,
+      const std::shared_ptr<ViewStylesRepository> &viewStylesRepository);
+  virtual ~ValueInterpolator() = default;
+
+  folly::dynamic getStyleValue(const std::shared_ptr<const ShadowNode> &shadowNode) const override;
+  folly::dynamic getResetStyle(const std::shared_ptr<const ShadowNode> &shadowNode) const override;
+  folly::dynamic getFirstKeyframeValue() const override;
+  folly::dynamic getLastKeyframeValue() const override;
+  bool equalsReversingAdjustedStartValue(const folly::dynamic &propertyValue) const override;
+
+  void updateKeyframes(jsi::Runtime &rt, const jsi::Value &keyframes) override;
+  void updateKeyframesFromStyleChange(
+      const folly::dynamic &oldStyleValue,
+      const folly::dynamic &newStyleValue,
+      const folly::dynamic &lastUpdateValue) override;
+
+  folly::dynamic interpolate(
+      const std::shared_ptr<const ShadowNode> &shadowNode,
+      const std::shared_ptr<KeyframeProgressProvider> &progressProvider,
+      double fallbackInterpolateThreshold) const override;
+
+ protected:
+  std::vector<ValueKeyframe> keyframes_;
+  std::shared_ptr<CSSValue> defaultStyleValue_;
+  folly::dynamic defaultStyleValueDynamic_;
+  folly::dynamic reversingAdjustedStartValue_;
+
+  virtual std::shared_ptr<CSSValue> createValue(jsi::Runtime &rt, const jsi::Value &value) const = 0;
+  virtual std::shared_ptr<CSSValue> createValue(const folly::dynamic &value) const = 0;
+  virtual folly::dynamic interpolateValue(
+      double progress,
+      const std::shared_ptr<CSSValue> &fromValue,
+      const std::shared_ptr<CSSValue> &toValue,
+      const ValueInterpolationContext &context) const = 0;
+
+ private:
+  folly::dynamic convertOptionalToDynamic(const std::optional<std::shared_ptr<CSSValue>> &value) const;
+  std::shared_ptr<CSSValue> getFallbackValue(const std::shared_ptr<const ShadowNode> &shadowNode) const;
+  size_t getToKeyframeIndex(const std::shared_ptr<KeyframeProgressProvider> &progressProvider) const;
+};
+
+} // namespace reanimated::css