Add transformOrigin prop support to the AnimationBackend. (#55203)

Summary:
Pull Request resolved: #55203

Adds `transformOrigin` prop support to the `AnimationBackend`.

## Changelog:
[General][Added] - Added `transformOrigin` prop support to the `AnimationBackend`.

Reviewed By: zeyap

Differential Revision: D90851823

fbshipit-source-id: bd1ca8807ad695182879bfb2615a3ff417bba608

Author: coado

packages/react-native/ReactCommon/react/renderer/animationbackend/AnimatedPropSerializer.cpp

@@ -74,6 +74,34 @@ void packTransform(folly::dynamic& dyn, const AnimatedPropBase& animatedProp) {
       folly::dynamic::array(folly::dynamic::object("matrix", matrixArray)));
 }
 
+std::string unitTypeToString(UnitType unit) {
+  switch (unit) {
+    case UnitType::Undefined:
+      return "undefined";
+    case UnitType::Point:
+      return "point";
+    case UnitType::Percent:
+      return "percent";
+    default:
+      throw std::runtime_error("Unknown unit type");
+  }
+}
+
+void packTransformOrigin(
+    folly::dynamic& dyn,
+    const AnimatedPropBase& animatedProp) {
+  const auto& transformOrigin = get<TransformOrigin>(animatedProp);
+  auto originArray = folly::dynamic::array();
+  for (const auto& xyValue : transformOrigin.xy) {
+    folly::dynamic valueObj = folly::dynamic::object();
+    valueObj["value"] = xyValue.value;
+    valueObj["unit"] = unitTypeToString(xyValue.unit);
+    originArray.push_back(valueObj);
+  }
+  originArray.push_back(transformOrigin.z);
+  dyn.insert("transformOrigin", originArray);
+}
+
 void packBackgroundColor(
     folly::dynamic& dyn,
     const AnimatedPropBase& animatedProp) {
@@ -550,6 +578,10 @@ void packAnimatedProp(
       packTransform(dyn, *animatedProp);
       break;
 
+    case TRANSFORM_ORIGIN:
+      packTransformOrigin(dyn, *animatedProp);
+      break;
+
     case BACKGROUND_COLOR:
       packBackgroundColor(dyn, *animatedProp);
       break;

packages/react-native/ReactCommon/react/renderer/animationbackend/AnimatedProps.h

@@ -24,6 +24,7 @@ enum PropName {
   POSITION,
   FLEX,
   TRANSFORM,
+  TRANSFORM_ORIGIN,
   BACKGROUND_COLOR,
   SHADOW_COLOR,
   SHADOW_OFFSET,
@@ -255,6 +256,10 @@ inline void cloneProp(BaseViewProps &viewProps, const AnimatedPropBase &animated
       viewProps.transform = get<Transform>(animatedProp);
       break;
 
+    case TRANSFORM_ORIGIN:
+      viewProps.transformOrigin = get<TransformOrigin>(animatedProp);
+      break;
+
     case BACKGROUND_COLOR:
       viewProps.backgroundColor = get<SharedColor>(animatedProp);
       break;

packages/react-native/ReactCommon/react/renderer/animationbackend/AnimatedPropsBuilder.h

@@ -56,9 +56,13 @@ struct AnimatedPropsBuilder {
   {
     props.push_back(std::make_unique<AnimatedProp<yoga::FloatOptional>>(FLEX, value));
   }
-  void setTransform(Transform &t)
+  void setTransform(const Transform &t)
   {
-    props.push_back(std::make_unique<AnimatedProp<Transform>>(TRANSFORM, std::move(t)));
+    props.push_back(std::make_unique<AnimatedProp<Transform>>(TRANSFORM, t));
+  }
+  void setTransformOrigin(const TransformOrigin &value)
+  {
+    props.push_back(std::make_unique<AnimatedProp<TransformOrigin>>(TRANSFORM_ORIGIN, value));
   }
   void setBackgroundColor(SharedColor value)
   {

packages/react-native/ReactCommon/react/renderer/animationbackend/AnimatedPropsRegistry.h

@@ -68,6 +68,10 @@ inline void updateProp(const PropName propName, BaseViewProps &viewProps, const
       viewProps.transform = snapshot.props.transform;
       break;
 
+    case TRANSFORM_ORIGIN:
+      viewProps.transformOrigin = snapshot.props.transformOrigin;
+      break;
+
     case BORDER_RADII:
       viewProps.borderRadii = snapshot.props.borderRadii;
       break;