@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/common/values/CSSValue.h

@@ -0,0 +1,118 @@
+#pragma once
+
+#include <reanimated/CSS/misc/ViewStylesRepository.h>
+
+#include <memory>
+#include <string>
+#include <type_traits>
+
+namespace reanimated::css {
+
+using namespace facebook;
+
+enum class RelativeTo : std::uint8_t {
+  Parent,
+  Self,
+};
+
+struct ValueInterpolationContext {
+  const std::shared_ptr<const ShadowNode> &node;
+  const double fallbackInterpolateThreshold;
+};
+
+struct ResolvableValueInterpolationContext {
+  const std::shared_ptr<const ShadowNode> &node;
+  const double fallbackInterpolateThreshold;
+  const std::shared_ptr<ViewStylesRepository> &viewStylesRepository;
+  const std::string &relativeProperty;
+  const RelativeTo relativeTo;
+};
+
+struct CSSValue {
+  // This field should be overridden in discrete value types
+  static constexpr bool is_discrete_value = false;
+
+  virtual ~CSSValue() = default;
+
+  virtual folly::dynamic toDynamic() const = 0;
+  virtual std::string toString() const = 0;
+};
+
+// Base for leaf values that can be interpolated without resolution
+template <typename TDerived>
+struct CSSSimpleValue : public CSSValue {
+  static constexpr bool is_resolvable_value = false;
+
+  virtual TDerived interpolate(double progress, const TDerived &to) const = 0;
+  virtual bool canInterpolateTo(const TDerived &to) const {
+    return true;
+  }
+};
+
+// Base for leaf values that need resolution before interpolation
+template <typename TDerived, typename TResolved = TDerived>
+struct CSSResolvableValue : public CSSValue {
+  static constexpr bool is_resolvable_value = true;
+
+  virtual TDerived interpolate(double progress, const TDerived &to, const ResolvableValueInterpolationContext &context)
+      const = 0;
+  virtual std::optional<TResolved> resolve(const ResolvableValueInterpolationContext &context) const = 0;
+  virtual bool canInterpolateTo(const TDerived &to) const {
+    return true;
+  }
+};
+
+// Checks if a type is a resolvable value that needs resolution before
+// interpolation
+//template <typename TCSSValue>
+//concept Resolvable = requires {
+//  { TCSSValue::is_resolvable_value } -> std::convertible_to<bool>;
+//  requires TCSSValue::is_resolvable_value == true;
+//};
+//TODO        
+namespace detail {
+    template <typename T>
+    auto test_resolvable(int) -> std::enable_if_t<
+        std::is_convertible_v<decltype(T::is_resolvable_value), bool> && 
+        T::is_resolvable_value == true,
+        std::true_type
+    >;
+    template <typename>
+    auto test_resolvable(...) -> std::false_type;
+}
+
+template <typename TCSSValue>
+constexpr bool Resolvable = decltype(detail::test_resolvable<TCSSValue>(0))::value;
+    
+    
+    
+// Checks if a type is a discrete value
+//template <typename TCSSValue>
+//concept Discrete = requires {
+//  { TCSSValue::is_discrete_value } -> std::convertible_to<bool>;
+//  requires TCSSValue::is_discrete_value == true;
+//};
+//TODO    
+namespace detail {
+    template <typename T>
+    auto test_discrete(int) -> std::enable_if_t<
+        std::is_convertible_v<decltype(T::is_discrete_value), bool> && 
+        T::is_discrete_value == true,
+        std::true_type
+    >;
+    template <typename>
+    auto test_discrete(...) -> std::false_type;
+}
+
+template <typename TCSSValue>
+constexpr bool Discrete = decltype(detail::test_discrete<TCSSValue>(0))::value;
+
+
+// Check if a type is derived from CSSValue
+//template <typename TCSSValue>
+//concept CSSValueDerived = std::is_base_of_v<CSSValue, TCSSValue>;
+//TODO        
+template<typename TCSSValue>
+constexpr bool CSSValueDerived = std::is_base_of_v<CSSValue, TCSSValue>;
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/common/values/CSSValueVariant.cpp

@@ -0,0 +1,174 @@
+#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/CSSValueVariant.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 <worklets/Tools/JSISerializer.h>
+
+#include <string>
+#include <utility>
+#include <vector>
+
+namespace reanimated::css {
+
+template <typename... AllowedTypes>
+CSSValueVariant<AllowedTypes...>::CSSValueVariant(std::variant<AllowedTypes...> &&storage)
+    : storage_(std::move(storage)) {}
+
+template <typename... AllowedTypes>
+CSSValueVariant<AllowedTypes...>::CSSValueVariant(jsi::Runtime &rt, const jsi::Value &jsiValue) {
+  auto tryOne = [&]<typename TCSSValue>() -> bool {
+    // We have to check in a runtime if the type can be constructed from the
+    // provided jsi::Value. The first match will be used to construct the
+    // CSS value.
+    if (!TCSSValue::canConstruct(rt, jsiValue)) {
+      return false;
+    }
+    storage_ = TCSSValue(rt, jsiValue);
+    return true;
+  };
+
+  // Try constructing with each allowed type until one succeeds
+  if (!(tryOne.template operator()<AllowedTypes>() || ...)) {
+    throw std::runtime_error(
+        "[Reanimated] No compatible type found for construction from: " + worklets::stringifyJSIValue(rt, jsiValue));
+  }
+}
+
+template <typename... AllowedTypes>
+CSSValueVariant<AllowedTypes...>::CSSValueVariant(const folly::dynamic &value) {
+  auto tryOne = [&]<typename TCSSValue>() -> bool {
+    // We have to check in a runtime if the type can be constructed from the
+    // provided folly::dynamic. The first match will be used to construct the
+    // CSS value.
+    if (!TCSSValue::canConstruct(value)) {
+      return false;
+    }
+    storage_ = TCSSValue(value);
+    return true;
+  };
+
+  // Try constructing with each allowed type until one succeeds
+  if (!(tryOne.template operator()<AllowedTypes>() || ...)) {
+    throw std::runtime_error("[Reanimated] No compatible type found for construction from: " + folly::toJson(value));
+  }
+}
+
+template <typename... AllowedTypes>
+bool CSSValueVariant<AllowedTypes...>::operator==(const CSSValueVariant &other) const {
+  if (storage_.index() != other.storage_.index()) {
+    return false;
+  }
+
+  return std::visit(
+      [](const auto &lhs, const auto &rhs) {
+        REA_IF_SAME_TYPE(lhs, rhs) {
+          return lhs == rhs;
+        }
+        return false;
+      },
+      storage_,
+      other.storage_);
+}
+
+template <typename... AllowedTypes>
+bool CSSValueVariant<AllowedTypes...>::operator==(const CSSValue &other) const {
+  if (auto *o = dynamic_cast<const CSSValueVariant *>(&other)) {
+    return *this == *o;
+  }
+  return false;
+}
+
+template <typename... AllowedTypes>
+folly::dynamic CSSValueVariant<AllowedTypes...>::toDynamic() const {
+  return std::visit([](const auto &v) { return v.toDynamic(); }, storage_);
+}
+
+template <typename... AllowedTypes>
+std::string CSSValueVariant<AllowedTypes...>::toString() const {
+  return std::visit([](const auto &v) { return v.toString(); }, storage_);
+}
+
+template <typename... AllowedTypes>
+CSSValueVariant<AllowedTypes...> CSSValueVariant<AllowedTypes...>::interpolate(
+    const double progress,
+    const CSSValueVariant &to,
+    const ValueInterpolationContext &context) const {
+  if (storage_.index() != to.storage_.index()) {
+    return fallbackInterpolate(progress, to, context.fallbackInterpolateThreshold);
+  }
+
+  return std::visit(
+      [&](const auto &fromValue, const auto &toValue) -> CSSValueVariant {
+        REA_IF_SAME_TYPE(fromValue, toValue) {
+          if constexpr (Resolvable<L>) {
+            throw std::runtime_error("[Reanimated] Resolvable value cannot be interpolated as non-resolvable");
+          } else if (fromValue.canInterpolateTo(toValue)) {
+            return CSSValueVariant(fromValue.interpolate(progress, toValue));
+          }
+        }
+        return fallbackInterpolate(progress, to, context.fallbackInterpolateThreshold);
+      },
+      storage_,
+      to.storage_);
+}
+
+template <typename... AllowedTypes>
+CSSValueVariant<AllowedTypes...> CSSValueVariant<AllowedTypes...>::interpolate(
+    const double progress,
+    const CSSValueVariant &to,
+    const ResolvableValueInterpolationContext &context) const {
+  if (storage_.index() != to.storage_.index()) {
+    return fallbackInterpolate(progress, to, context.fallbackInterpolateThreshold);
+  }
+
+  return std::visit(
+      [&](const auto &fromValue, const auto &toValue) -> CSSValueVariant {
+        REA_IF_SAME_TYPE(fromValue, toValue) {
+          if constexpr (!Resolvable<L>) {
+            throw std::runtime_error("[Reanimated] Non-resolvable value cannot be interpolated as resolvable");
+          } else if (fromValue.canInterpolateTo(toValue)) {
+            return CSSValueVariant(fromValue.interpolate(progress, toValue, context));
+          }
+        }
+        return fallbackInterpolate(progress, to, context.fallbackInterpolateThreshold);
+      },
+      storage_,
+      to.storage_);
+}
+
+template <typename... AllowedTypes>
+CSSValueVariant<AllowedTypes...> CSSValueVariant<AllowedTypes...>::fallbackInterpolate(
+    const double progress,
+    const CSSValueVariant &to,
+    const double fallbackInterpolateThreshold) const {
+  return (progress < fallbackInterpolateThreshold) ? *this : to;
+}
+
+template class CSSValueVariant<CSSLength>;
+template class CSSValueVariant<CSSLength, CSSKeyword>;
+template class CSSValueVariant<CSSDouble>;
+template class CSSValueVariant<CSSDouble, CSSKeyword>;
+template class CSSValueVariant<CSSInteger>;
+template class CSSValueVariant<CSSKeyword>;
+template class CSSValueVariant<CSSAngle>;
+template class CSSValueVariant<CSSBoolean>;
+template class CSSValueVariant<CSSColor>;
+template class CSSValueVariant<CSSDisplay>;
+template class CSSValueVariant<CSSBoxShadow>;
+template class CSSValueVariant<CSSDiscreteArray<CSSKeyword>>;
+
+template class CSSValueVariant<SVGLength>;
+template class CSSValueVariant<SVGLength, CSSKeyword>;
+template class CSSValueVariant<SVGStrokeDashArray, CSSKeyword>;
+template class CSSValueVariant<SVGBrush>;
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/common/values/CSSValueVariant.h

@@ -0,0 +1,111 @@
+#pragma once
+
+#include <reanimated/CSS/common/values/CSSValue.h>
+
+#include <folly/json.h>
+
+#include <stdexcept>
+#include <string>
+#include <type_traits>
+#include <utility>
+#include <variant>
+
+namespace reanimated::css {
+
+/**
+ * Macro to check if two lambda parameters have the same reference-removed type.
+ *
+ * Usage:
+ *   REA_IF_SAME_TYPE(lhs, rhs) {
+ *     // same-type block
+ *   } else {
+ *     // mismatch block
+ *   }
+ */
+#define REA_IF_SAME_TYPE(lhs, rhs) \
+  using L = std::remove_reference_t<decltype(lhs)>; \
+  using R = std::remove_reference_t<decltype(rhs)>; \
+  if constexpr (std::is_same_v<L, R>) // NOLINT(readability/braces)
+
+// Checks whether a type has canConstruct(...) for a generic value
+template <typename TCSSValue, typename TValue>
+concept ValueConstructibleCSSValue = requires(TValue &&value) {
+  { TCSSValue::canConstruct(std::forward<TValue>(value)) } -> std::same_as<bool>;
+}; // NOLINT(readability/braces)
+
+// Checks whether a type can be constructed from a jsi::Value
+template <typename TCSSValue>
+concept JSIConstructibleCSSValue = requires(jsi::Runtime &rt, const jsi::Value &value) {
+  { TCSSValue::canConstruct(rt, value) } -> std::same_as<bool>;
+  { TCSSValue(rt, value) } -> std::same_as<TCSSValue>;
+}; // NOLINT(readability/braces)
+
+// Checks whether a type can be constructed from a folly::dynamic
+template <typename TCSSValue>
+concept DynamicConstructibleCSSValue = requires(const folly::dynamic &value) {
+  { TCSSValue::canConstruct(value) } -> std::same_as<bool>;
+  { TCSSValue(value) } -> std::same_as<TCSSValue>;
+}; // NOLINT(readability/braces)
+
+/**
+ * CSSValueVariant
+ *
+ * A std::variant-based container for multiple CSSValue-derived types.
+ */
+template <typename... AllowedTypes>
+class CSSValueVariant final : public CSSValue {
+  static_assert(
+      (JSIConstructibleCSSValue<AllowedTypes> && ...),
+      "CSSValueVariant accepts only types that can be constructed from a jsi::Value");
+  static_assert(
+      (DynamicConstructibleCSSValue<AllowedTypes> && ...),
+      "CSSValueVariant accepts only types that can be constructed from a folly::dynamic");
+
+ public:
+  CSSValueVariant() = default;
+
+  /**
+   * Construct from std::variant storage directly
+   */
+  explicit CSSValueVariant(std::variant<AllowedTypes...> &&storage);
+
+  /**
+   * Construct from jsi::Value if it matches any AllowedType's constructor
+   * (chooses the first one that matches)
+   */
+  explicit CSSValueVariant(jsi::Runtime &rt, const jsi::Value &jsiValue);
+
+  /**
+   * Construct from folly::dynamic if it matches any AllowedType's constructor
+   * (chooses the first one that matches)
+   */
+  explicit CSSValueVariant(const folly::dynamic &value);
+
+  bool operator==(const CSSValueVariant &other) const;
+  bool operator==(const CSSValue &other) const;
+
+  folly::dynamic toDynamic() const override;
+  std::string toString() const override;
+
+  /**
+   * Interpolate (non-resolvable)
+   */
+  CSSValueVariant
+  interpolate(const double progress, const CSSValueVariant &to, const ValueInterpolationContext &context) const;
+
+  /**
+   * Interpolate (resolvable)
+   */
+  CSSValueVariant interpolate(
+      const double progress,
+      const CSSValueVariant &to,
+      const ResolvableValueInterpolationContext &context) const;
+
+ private:
+  std::variant<AllowedTypes...> storage_;
+
+  CSSValueVariant
+  fallbackInterpolate(const double progress, const CSSValueVariant &to, double fallbackInterpolateThreshold) const;
+};
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/common/values/complex/CSSBoxShadow.cpp

@@ -0,0 +1,196 @@
+#include <reanimated/CSS/common/values/complex/CSSBoxShadow.h>
+
+#include <string>
+#include <utility>
+#include <vector>
+
+namespace reanimated::css {
+
+CSSBoxShadow::CSSBoxShadow(
+    CSSDouble offsetX,
+    CSSDouble offsetY,
+#ifdef ANDROID
+    CSSShadowRadiusAndroid blurRadius,
+#else
+    CSSDouble blurRadius,
+#endif
+    CSSDouble spreadDistance,
+    CSSColor color,
+    std::optional<CSSBoolean> inset)
+    : offsetX(std::move(offsetX)),
+      offsetY(std::move(offsetY)),
+      blurRadius(std::move(blurRadius)),
+      spreadDistance(std::move(spreadDistance)),
+      color(std::move(color)),
+      inset(std::move(inset)) {
+}
+
+CSSBoxShadow::CSSBoxShadow(jsi::Runtime &rt, const jsi::Value &jsiValue) {
+  const auto &obj = jsiValue.asObject(rt);
+
+  // Only assign fields that exist in the object and keep default values for
+  // others
+  if (obj.hasProperty(rt, "offsetX")) {
+    offsetX = CSSDouble(rt, obj.getProperty(rt, "offsetX"));
+  }
+  if (obj.hasProperty(rt, "offsetY")) {
+    offsetY = CSSDouble(rt, obj.getProperty(rt, "offsetY"));
+  }
+  if (obj.hasProperty(rt, "blurRadius")) {
+#ifdef ANDROID
+    blurRadius = CSSShadowRadiusAndroid(rt, obj.getProperty(rt, "blurRadius"));
+#else
+    blurRadius = CSSDouble(rt, obj.getProperty(rt, "blurRadius"));
+#endif
+  }
+  if (obj.hasProperty(rt, "spreadDistance")) {
+    spreadDistance = CSSDouble(rt, obj.getProperty(rt, "spreadDistance"));
+  }
+  if (obj.hasProperty(rt, "color")) {
+    color = CSSColor(rt, obj.getProperty(rt, "color"));
+  }
+  // Every non-default (not empty) shadow must have an inset
+  inset = CSSBoolean(rt, obj.hasProperty(rt, "inset") ? obj.getProperty(rt, "inset") : false);
+}
+
+CSSBoxShadow::CSSBoxShadow(const folly::dynamic &value) {
+  // Only assign fields that exist in the object and keep default values for
+  // others
+  if (value.count("offsetX") > 0) {
+    offsetX = CSSDouble(value["offsetX"]);
+  }
+  if (value.count("offsetY") > 0) {
+    offsetY = CSSDouble(value["offsetY"]);
+  }
+  if (value.count("blurRadius") > 0) {
+#ifdef ANDROID
+    blurRadius = CSSShadowRadiusAndroid(value["blurRadius"]);
+#else
+    blurRadius = CSSDouble(value["blurRadius"]);
+#endif
+  }
+  if (value.count("spreadDistance") > 0) {
+    spreadDistance = CSSDouble(value["spreadDistance"]);
+  }
+  if (value.count("color") > 0) {
+    color = CSSColor(value["color"]);
+  }
+  // Every non-default (not empty) shadow must have an inset
+  inset = CSSBoolean(value.count("inset") > 0 ? value["inset"] : false);
+}
+
+bool CSSBoxShadow::canConstruct(const folly::dynamic &value) {
+  if (!value.isObject()) {
+    return false;
+  }
+
+  for (const auto &validator : fieldValidators) {
+    if (value.count(validator.fieldName) > 0 && !validator.validateDynamic(value[validator.fieldName])) {
+      return false;
+    }
+  }
+
+  return true;
+}
+
+bool CSSBoxShadow::canConstruct(jsi::Runtime &rt, const jsi::Value &jsiValue) {
+  if (!jsiValue.isObject()) {
+    return false;
+  }
+
+  const auto &obj = jsiValue.asObject(rt);
+
+  for (const auto &validator : fieldValidators) {
+    const auto &fieldName = validator.fieldName.c_str();
+    if (obj.hasProperty(rt, fieldName) && !validator.validateJSI(rt, obj.getProperty(rt, fieldName))) {
+      return false;
+    }
+  }
+
+  return true;
+}
+
+folly::dynamic CSSBoxShadow::toDynamic() const {
+  folly::dynamic obj = folly::dynamic::object();
+
+  obj["offsetX"] = offsetX.toDynamic();
+  obj["offsetY"] = offsetY.toDynamic();
+  obj["blurRadius"] = blurRadius.toDynamic();
+  obj["spreadDistance"] = spreadDistance.toDynamic();
+  obj["color"] = color.toDynamic();
+  if (inset.has_value()) {
+    obj["inset"] = inset->toDynamic();
+  }
+
+  return obj;
+}
+
+std::string CSSBoxShadow::toString() const {
+  return (inset.has_value() && inset.value().value ? "inset " : "") + offsetX.toString() + " " + offsetY.toString() +
+      " " + blurRadius.toString() + " " + spreadDistance.toString() + " " + color.toString();
+}
+
+CSSBoxShadow CSSBoxShadow::interpolate(double progress, const CSSBoxShadow &to) const {
+  const auto &fromInset = inset.value_or(to.inset.value_or(CSSBoolean(false)));
+  const auto &toInset = to.inset.value_or(inset.value_or(CSSBoolean(false)));
+
+  return CSSBoxShadow(
+      offsetX.interpolate(progress, to.offsetX),
+      offsetY.interpolate(progress, to.offsetY),
+      blurRadius.interpolate(progress, to.blurRadius),
+      spreadDistance.interpolate(progress, to.spreadDistance),
+      color.interpolate(progress, to.color),
+      fromInset.interpolate(progress, toInset));
+}
+
+bool CSSBoxShadow::canInterpolateTo(const CSSBoxShadow &to) const {
+  return !inset.has_value() || !to.inset.has_value() || inset.value() == to.inset.value();
+}
+
+bool CSSBoxShadow::operator==(const CSSBoxShadow &other) const {
+  return offsetX == other.offsetX && offsetY == other.offsetY && blurRadius == other.blurRadius &&
+      spreadDistance == other.spreadDistance && color == other.color && inset == other.inset;
+}
+
+#ifndef NDEBUG
+
+std::ostream &operator<<(std::ostream &os, const CSSBoxShadow &shadowValue) {
+  os << "CSSBoxShadow(" << shadowValue.toString() << ")";
+  return os;
+}
+
+#endif // NDEBUG
+
+const std::vector<FieldValidator> CSSBoxShadow::fieldValidators = {
+    {"offsetX",
+     [](const folly::dynamic &val) { return CSSDouble::canConstruct(val); },
+     [](jsi::Runtime &rt, const jsi::Value &val) {
+       return CSSDouble::canConstruct(rt, val);
+     }},
+    {"offsetY",
+     [](const folly::dynamic &val) { return CSSDouble::canConstruct(val); },
+     [](jsi::Runtime &rt, const jsi::Value &val) {
+       return CSSDouble::canConstruct(rt, val);
+     }},
+    {"blurRadius",
+     [](const folly::dynamic &val) { return CSSDouble::canConstruct(val); },
+     [](jsi::Runtime &rt, const jsi::Value &val) {
+       return CSSDouble::canConstruct(rt, val);
+     }},
+    {"spreadDistance",
+     [](const folly::dynamic &val) { return CSSDouble::canConstruct(val); },
+     [](jsi::Runtime &rt, const jsi::Value &val) {
+       return CSSDouble::canConstruct(rt, val);
+     }},
+    {"color",
+     [](const folly::dynamic &val) { return CSSColor::canConstruct(val); },
+     [](jsi::Runtime &rt, const jsi::Value &val) {
+       return CSSColor::canConstruct(rt, val);
+     }},
+    {"inset",
+     [](const folly::dynamic &val) { return CSSBoolean::canConstruct(val); },
+     [](jsi::Runtime &rt, const jsi::Value &val) {
+       return CSSBoolean::canConstruct(rt, val);
+     }}};
+
+} // namespace reanimated::css

package/harmony/reanimated/src/main/cpp/Common/cpp/reanimated/CSS/common/values/complex/CSSBoxShadow.h

@@ -0,0 +1,66 @@
+#pragma once
+
+#include <reanimated/CSS/common/definitions.h>
+#include <reanimated/CSS/common/values/CSSBoolean.h>
+#include <reanimated/CSS/common/values/CSSColor.h>
+#include <reanimated/CSS/common/values/CSSNumber.h>
+
+#include <folly/json.h>
+#include <functional>
+#include <optional>
+#include <string>
+#include <vector>
+
+namespace reanimated::css {
+
+struct CSSBoxShadow : public CSSSimpleValue<CSSBoxShadow> {
+  CSSDouble offsetX;
+  CSSDouble offsetY;
+#ifdef ANDROID
+  // For some reason Android crashes when blurRadius is smaller
+  // than 1, so we use a custom value type that will never be
+  // smaller than 1
+  CSSShadowRadiusAndroid blurRadius;
+#else
+  CSSDouble blurRadius;
+#endif
+  CSSDouble spreadDistance;
+  CSSColor color;
+  // inset has no default value - it must be the same as in the other
+  // keyframe if it's not set
+  std::optional<CSSBoolean> inset;
+
+  CSSBoxShadow() = default;
+  explicit CSSBoxShadow(
+      CSSDouble offsetX,
+      CSSDouble offsetY,
+#ifdef ANDROID
+      CSSShadowRadiusAndroid blurRadius,
+#else
+      CSSDouble blurRadius,
+#endif
+      CSSDouble spreadDistance,
+      CSSColor color,
+      std::optional<CSSBoolean> inset);
+  explicit CSSBoxShadow(jsi::Runtime &rt, const jsi::Value &jsiValue);
+  explicit CSSBoxShadow(const folly::dynamic &value);
+
+  static bool canConstruct(jsi::Runtime &rt, const jsi::Value &jsiValue);
+  static bool canConstruct(const folly::dynamic &value);
+
+  folly::dynamic toDynamic() const override;
+  std::string toString() const override;
+  CSSBoxShadow interpolate(double progress, const CSSBoxShadow &to) const override;
+  bool canInterpolateTo(const CSSBoxShadow &to) const override;
+
+  bool operator==(const CSSBoxShadow &other) const;
+
+#ifndef NDEBUG
+  friend std::ostream &operator<<(std::ostream &os, const CSSBoxShadow &shadowValue);
+#endif // NDEBUG
+
+ private:
+  static const std::vector<FieldValidator> fieldValidators;
+};
+
+} // namespace reanimated::css