Expose overflow prop to layout engine

Summary:
The overflow prop needs to be set on the shadow view so that it can make its way into the layout engine. In some situations, the value of the overflow prop affects the calculations of the layout engine.

**Test plan (required)**

Verified in a test app that the `overflow` prop makes its way into the layout engine. Also, my team's app is currently using this change.

Adam Comella
Microsoft Corp.
Closes https://github.com/facebook/react-native/pull/9659

Differential Revision: D3790552

fbshipit-source-id: 61513ece63ae214f48c6cb6f40fb29757a0ac706

React/Base/RCTConvert.h

@@ -104,8 +104,8 @@ typedef NSArray CGColorArray;
 typedef id NSPropertyList;
 + (NSPropertyList)NSPropertyList:(id)json;
 
-typedef BOOL css_clip_t, css_backface_visibility_t;
-+ (css_clip_t)css_clip_t:(id)json;
+typedef BOOL css_backface_visibility_t;
++ (CSSOverflow)CSSOverflow:(id)json;
 + (css_backface_visibility_t)css_backface_visibility_t:(id)json;
 + (CSSFlexDirection)CSSFlexDirection:(id)json;
 + (CSSJustify)CSSJustify:(id)json;

React/Base/RCTConvert.m

@@ -601,10 +601,10 @@ RCT_ENUM_CONVERTER(css_backface_visibility_t, (@{
   @"visible": @YES
 }), YES, boolValue)
 
-RCT_ENUM_CONVERTER(css_clip_t, (@{
-  @"hidden": @YES,
-  @"visible": @NO
-}), NO, boolValue)
+RCT_ENUM_CONVERTER(CSSOverflow, (@{
+  @"hidden": @(CSSOverflowHidden),
+  @"visible": @(CSSOverflowVisible)
+}), CSSOverflowVisible, intValue)
 
 RCT_ENUM_CONVERTER(CSSFlexDirection, (@{
   @"row": @(CSSFlexDirectionRow),

React/Views/RCTShadowView.h

@@ -139,6 +139,11 @@ typedef void (^RCTApplierBlock)(NSDictionary<NSNumber *, UIView *> *viewRegistry
  */
 @property (nonatomic, assign) NSInteger zIndex;
 
+/**
+ * Clipping properties
+ */
+@property (nonatomic, assign) CSSOverflow overflow;
+
 /**
  * Calculate property changes that need to be propagated to the view.
  * The applierBlocks set contains RCTApplierBlock functions that must be applied

React/Views/RCTShadowView.m

@@ -632,6 +632,7 @@ RCT_STYLE_PROPERTY(AlignSelf, alignSelf, AlignSelf, CSSAlign)
 RCT_STYLE_PROPERTY(AlignItems, alignItems, AlignItems, CSSAlign)
 RCT_STYLE_PROPERTY(Position, position, PositionType, CSSPositionType)
 RCT_STYLE_PROPERTY(FlexWrap, flexWrap, FlexWrap, CSSWrapType)
+RCT_STYLE_PROPERTY(Overflow, overflow, Overflow, CSSOverflow)
 
 - (void)setBackgroundColor:(UIColor *)color
 {

React/Views/RCTViewManager.m

@@ -119,7 +119,14 @@ RCT_REMAP_VIEW_PROPERTY(shadowColor, layer.shadowColor, CGColor)
 RCT_REMAP_VIEW_PROPERTY(shadowOffset, layer.shadowOffset, CGSize)
 RCT_REMAP_VIEW_PROPERTY(shadowOpacity, layer.shadowOpacity, float)
 RCT_REMAP_VIEW_PROPERTY(shadowRadius, layer.shadowRadius, CGFloat)
-RCT_REMAP_VIEW_PROPERTY(overflow, clipsToBounds, css_clip_t)
+RCT_CUSTOM_VIEW_PROPERTY(overflow, CSSOverflow, RCTView)
+{
+  if (json) {
+    view.clipsToBounds = [RCTConvert CSSOverflow:json] == CSSOverflowHidden;
+  } else {
+    view.clipsToBounds = defaultView.clipsToBounds;
+  }
+}
 RCT_CUSTOM_VIEW_PROPERTY(shouldRasterizeIOS, BOOL, RCTView)
 {
   view.layer.shouldRasterize = json ? [RCTConvert BOOL:json] : defaultView.layer.shouldRasterize;
@@ -295,6 +302,8 @@ RCT_EXPORT_SHADOW_PROPERTY(alignItems, CSSAlign)
 RCT_EXPORT_SHADOW_PROPERTY(alignSelf, CSSAlign)
 RCT_EXPORT_SHADOW_PROPERTY(position, CSSPositionType)
 
+RCT_EXPORT_SHADOW_PROPERTY(overflow, CSSOverflow)
+
 RCT_EXPORT_SHADOW_PROPERTY(onLayout, RCTDirectEventBlock)
 
 RCT_EXPORT_SHADOW_PROPERTY(zIndex, NSInteger)