Fabric: Support for uniformed borders of <View>

Summary:
@public
For now we only support trivial uniformed (all sides are equal) border rendering (which can be direclty mapped to CALayer features).
Support of the more complex and fancy borders is comming soon.

Reviewed By: mdvacca

Differential Revision: D8528923

fbshipit-source-id: 0883cdc2b855fc63d399e1a93010f259f0628f48

React/Fabric/Mounting/ComponentViews/View/RCTViewComponentView.mm

@@ -15,6 +15,10 @@
 using namespace facebook::react;
 
 @implementation RCTViewComponentView
+{
+  BOOL _isCoreAnimationBorderRenderingEnabled;
+}
+
 - (void)setContentView:(UIView *)contentView
 {
   if (_contentView) {
@@ -116,7 +120,6 @@ using namespace facebook::react;
     self.layer.allowsEdgeAntialiasing = newViewProps.transform != Transform::Identity();
   }
 
-  // TODO: Implement all sutable non-layout <View> props.
   // `hitSlop`
   if (oldViewProps.hitSlop != newViewProps.hitSlop) {
     self.hitTestEdgeInsets = RCTUIEdgeInsetsFromEdgeInsets(newViewProps.hitSlop);
@@ -127,6 +130,16 @@ using namespace facebook::react;
     self.layer.zPosition = (CGFloat)newViewProps.zIndex;
   }
 
+  // `border`
+  if (
+    oldViewProps.borderWidth != newViewProps.borderWidth ||
+    oldViewProps.borderStyle != newViewProps.borderStyle ||
+    oldViewProps.borderRadius != newViewProps.borderRadius ||
+    oldViewProps.borderColor != newViewProps.borderColor
+  ) {
+    [self invalidateBorder];
+  }
+
   // `nativeId`
   if (oldViewProps.nativeId != newViewProps.nativeId) {
     self.nativeId = RCTNSStringFromString(newViewProps.nativeId);
@@ -158,8 +171,8 @@ using namespace facebook::react;
 
   bool useCoreAnimationBorderRendering =
     props.borderStyle == BorderStyle::Solid &&
-    props.borderWidth.isUniformed() &&
-    props.borderRadius.isUniformed();
+    props.borderWidth.isUniform() &&
+    props.borderRadius.isUniform();
 
   CALayer *layer = self.layer;
   if (_isCoreAnimationBorderRenderingEnabled != useCoreAnimationBorderRendering) {

ReactCommon/fabric/graphics/Geometry.h

@@ -123,6 +123,12 @@ struct EdgeInsets {
   bool operator !=(const EdgeInsets& rhs) const {
     return !(*this == rhs);
   }
+
+  bool isUniform() const {
+    return left == top &&
+      left == right &&
+      left == bottom;
+  }
 };
 
 /*
@@ -143,6 +149,12 @@ struct CornerInsets {
   bool operator !=(const CornerInsets& rhs) const {
     return !(*this == rhs);
   }
+
+  bool isUniform() const {
+    return topLeft == topRight &&
+      topLeft == bottomLeft &&
+      topLeft == bottomRight;
+  }
 };
 
 } // namespace react