Add codegen support for EdgeInsets

Summary: Add codegen support for `EdgeInsets`.

Reviewed By: rickhanlonii

Differential Revision: D17500509

fbshipit-source-id: b2909fe296c51d3a47cc961c45294eead7707853

Libraries/StyleSheet/StyleSheetTypes.js

@@ -18,6 +18,12 @@ export type PointValue = {|
   x: number,
   y: number,
 |};
+export type EdgeInsetsValue = {|
+  top: number,
+  left: number,
+  right: number,
+  bottom: number,
+|};
 export type DimensionValue = null | number | string | AnimatedNode;
 
 /**

packages/react-native-codegen/buck_tests/java/ArrayPropsNativeComponentViewManager.java

@@ -46,6 +46,9 @@ public class ArrayPropsNativeComponentViewManager extends SimpleViewManager<View
   @Override
   public void setPoints(ViewGroup view, ReadableArray value) {}
 
+  @Override
+  public void setEdgeInsets(ViewGroup view, ReadableArray value) {}
+
   @Override
   public void setSizes(ViewGroup view, ReadableArray value) {}
 

packages/react-native-codegen/buck_tests/java/EdgeInsetsPropNativeComponentViewManager.java

@@ -0,0 +1,31 @@
+package com.facebook.react.uimanager;
+
+import android.view.ViewGroup;
+import com.facebook.react.bridge.ReadableMap;
+import com.facebook.react.viewmanagers.EdgeInsetsPropNativeComponentViewManagerDelegate;
+import com.facebook.react.viewmanagers.EdgeInsetsPropNativeComponentViewManagerInterface;
+
+public class EdgeInsetsPropNativeComponentViewManager extends SimpleViewManager<ViewGroup>
+    implements EdgeInsetsPropNativeComponentViewManagerInterface<ViewGroup> {
+
+  public static final String REACT_CLASS = "EdgeInsetsPropNativeComponentView";
+
+  @Override
+  public String getName() {
+    return REACT_CLASS;
+  }
+
+  private void test() {
+    EdgeInsetsPropNativeComponentViewManagerDelegate<
+            ViewGroup, EdgeInsetsPropNativeComponentViewManager>
+        delegate = new EdgeInsetsPropNativeComponentViewManagerDelegate<>(this);
+  }
+
+  @Override
+  public ViewGroup createViewInstance(ThemedReactContext context) {
+    throw new IllegalStateException();
+  }
+
+  @Override
+  public void setContentInset(ViewGroup view, ReadableMap value) {}
+}

packages/react-native-codegen/e2e/__test_fixtures__/components/ArrayPropsNativeComponent.js

@@ -13,6 +13,7 @@
 import type {
   PointValue,
   ColorValue,
+  EdgeInsetsValue,
 } from '../../../../../Libraries/StyleSheet/StyleSheetTypes';
 import type {ImageSource} from '../../../../../Libraries/Image/ImageSource';
 import type {
@@ -35,6 +36,7 @@ type NativeProps = $ReadOnly<{|
   colors?: $ReadOnlyArray<ColorValue>,
   srcs?: $ReadOnlyArray<ImageSource>,
   points?: $ReadOnlyArray<PointValue>,
+  edgeInsets?: $ReadOnlyArray<EdgeInsetsValue>,
   sizes?: WithDefault<$ReadOnlyArray<'small' | 'large'>, 'small'>,
   object?: $ReadOnlyArray<$ReadOnly<{|prop: string|}>>,
 |}>;

packages/react-native-codegen/e2e/__test_fixtures__/components/EdgeInsetsPropNativeComponent.js

@@ -0,0 +1,27 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ * @flow
+ */
+
+'use strict';
+
+import type {EdgeInsetsValue} from '../../../../../Libraries/StyleSheet/StyleSheetTypes';
+import type {ViewProps} from '../../../../../Libraries/Components/View/ViewPropTypes';
+import codegenNativeComponent from '../../../../../Libraries/Utilities/codegenNativeComponent';
+import {type NativeComponentType} from '../../../../../Libraries/Utilities/codegenNativeComponent';
+
+type NativeProps = $ReadOnly<{|
+  ...ViewProps,
+
+  // Props
+  contentInset?: EdgeInsetsValue,
+|}>;
+
+export default (codegenNativeComponent<NativeProps>(
+  'EdgeInsetsPropNativeComponentView',
+): NativeComponentType<NativeProps>);

packages/react-native-codegen/src/CodegenSchema.js

@@ -125,7 +125,11 @@ type PropTypeTypeAnnotation =
     |}>
   | $ReadOnly<{|
       type: 'NativePrimitiveTypeAnnotation',
-      name: 'ColorPrimitive' | 'ImageSourcePrimitive' | 'PointPrimitive',
+      name:
+        | 'ColorPrimitive'
+        | 'ImageSourcePrimitive'
+        | 'PointPrimitive'
+        | 'EdgeInsetsPrimitive',
     |}>
   | $ReadOnly<{|
       type: 'ObjectTypeAnnotation',
@@ -162,7 +166,11 @@ type PropTypeTypeAnnotation =
           |}>
         | $ReadOnly<{|
             type: 'NativePrimitiveTypeAnnotation',
-            name: 'ColorPrimitive' | 'ImageSourcePrimitive' | 'PointPrimitive',
+            name:
+              | 'ColorPrimitive'
+              | 'ImageSourcePrimitive'
+              | 'PointPrimitive'
+              | 'EdgeInsetsPrimitive',
           |}>
         | $ReadOnly<{|
             type: 'ArrayTypeAnnotation',

packages/react-native-codegen/src/generators/components/CppHelpers.js

@@ -64,6 +64,8 @@ function getImports(properties: $ReadOnlyArray<PropTypeShape>): Set<string> {
         return;
       case 'PointPrimitive':
         return;
+      case 'EdgeInsetsPrimitive':
+        return;
       case 'ImageSourcePrimitive':
         imports.add('#include <react/components/image/conversions.h>');
         return;
@@ -152,6 +154,8 @@ function convertDefaultTypeToString(
           return '';
         case 'PointPrimitive':
           return '';
+        case 'EdgeInsetsPrimitive':
+          return '';
         default:
           (typeAnnotation.name: empty);
           throw new Error('Received unknown NativePrimitiveTypeAnnotation');

packages/react-native-codegen/src/generators/components/GeneratePropsH.js

@@ -229,6 +229,8 @@ function getNativeTypeFromAnnotation(
           return 'ImageSource';
         case 'PointPrimitive':
           return 'Point';
+        case 'EdgeInsetsPrimitive':
+          return 'EdgeInsets';
         default:
           (typeAnnotation.name: empty);
           throw new Error('Received unknown NativePrimitiveTypeAnnotation');
@@ -498,6 +500,9 @@ function getLocalImports(
       case 'PointPrimitive':
         imports.add('#include <react/graphics/Geometry.h>');
         return;
+      case 'EdgeInsetsPrimitive':
+        imports.add('#include <react/graphics/Geometry.h>');
+        return;
       default:
         (name: empty);
         throw new Error(

packages/react-native-codegen/src/generators/components/GeneratePropsJavaDelegate.js

@@ -111,6 +111,8 @@ function getJavaValueForProp(
           return '(ReadableMap) value';
         case 'PointPrimitive':
           return '(ReadableMap) value';
+        case 'EdgeInsetsPrimitive':
+          return '(ReadableMap) value';
         default:
           (typeAnnotation.name: empty);
           throw new Error('Received unknown NativePrimitiveTypeAnnotation');

packages/react-native-codegen/src/generators/components/GeneratePropsJavaInterface.js

@@ -83,6 +83,9 @@ function getJavaValueForProp(prop: PropTypeShape, imports): string {
         case 'PointPrimitive':
           addNullable(imports);
           return '@Nullable ReadableMap value';
+        case 'EdgeInsetsPrimitive':
+          addNullable(imports);
+          return '@Nullable ReadableMap value';
         default:
           (typeAnnotation.name: empty);
           throw new Error('Received unknown NativePrimitiveTypeAnnotation');

packages/react-native-codegen/src/generators/components/GenerateViewConfigJs.js

@@ -58,6 +58,8 @@ function getReactDiffProcessValue(typeAnnotation) {
             .expression`{ process: require('resolveAssetSource') }`;
         case 'PointPrimitive':
           return j.template.expression`{ diff: require('pointsDiffer') }`;
+        case 'EdgeInsetsPrimitive':
+          return j.template.expression`{ diff: require('insetsDiffer') }`;
         default:
           (typeAnnotation.name: empty);
           throw new Error(

packages/react-native-codegen/src/generators/components/JavaHelpers.js

@@ -67,6 +67,9 @@ function getImports(component: ComponentShape): Set<string> {
       case 'PointPrimitive':
         imports.add('import com.facebook.react.bridge.ReadableMap;');
         return;
+      case 'EdgeInsetsPrimitive':
+        imports.add('import com.facebook.react.bridge.ReadableMap;');
+        return;
       default:
         (name: empty);
         throw new Error(

packages/react-native-codegen/src/generators/components/__test_fixtures__/fixtures.js

@@ -479,6 +479,35 @@ const POINT_PROP: SchemaType = {
   },
 };
 
+const INSETS_PROP: SchemaType = {
+  modules: {
+    ScrollView: {
+      components: {
+        InsetsPropNativeComponent: {
+          extendsProps: [
+            {
+              type: 'ReactNativeBuiltInType',
+              knownTypeName: 'ReactNativeCoreViewProps',
+            },
+          ],
+          events: [],
+          props: [
+            {
+              name: 'contentInset',
+              optional: true,
+              typeAnnotation: {
+                type: 'NativePrimitiveTypeAnnotation',
+                name: 'EdgeInsetsPrimitive',
+              },
+            },
+          ],
+          commands: [],
+        },
+      },
+    },
+  },
+};
+
 const ARRAY_PROPS: SchemaType = {
   modules: {
     Slider: {
@@ -1485,6 +1514,7 @@ module.exports = {
   COLOR_PROP,
   IMAGE_PROP,
   POINT_PROP,
+  INSETS_PROP,
   ARRAY_PROPS,
   ARRAY_PROPS_WITH_NESTED_OBJECT,
   OBJECT_PROPS,

packages/react-native-codegen/src/generators/components/__tests__/__snapshots__/GenerateComponentDescriptorH-test.js.snap

@@ -312,6 +312,32 @@ using ImagePropNativeComponentComponentDescriptor = ConcreteComponentDescriptor<
 }
 `;
 
+exports[`GenerateComponentDescriptorH can generate fixture INSETS_PROP 1`] = `
+Map {
+  "ComponentDescriptors.h" => "
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#pragma once
+
+#include <react/components/INSETS_PROP/ShadowNodes.h>
+#include <react/core/ConcreteComponentDescriptor.h>
+
+namespace facebook {
+namespace react {
+
+using InsetsPropNativeComponentComponentDescriptor = ConcreteComponentDescriptor<InsetsPropNativeComponentShadowNode>;
+
+} // namespace react
+} // namespace facebook
+",
+}
+`;
+
 exports[`GenerateComponentDescriptorH can generate fixture INT32_ENUM_PROP 1`] = `
 Map {
   "ComponentDescriptors.h" => "

packages/react-native-codegen/src/generators/components/__tests__/__snapshots__/GenerateComponentHObjCpp-test.js.snap

@@ -391,6 +391,29 @@ NS_ASSUME_NONNULL_END",
 }
 `;
 
+exports[`GenerateComponentHObjCpp can generate fixture INSETS_PROP 1`] = `
+Map {
+  "RCTComponentViewHelpers.h" => "/**
+* Copyright (c) Facebook, Inc. and its affiliates.
+*
+* This source code is licensed under the MIT license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+
+#import <Foundation/Foundation.h>
+#import <React/RCTDefines.h>
+#import <React/RCTLog.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@protocol RCTInsetsPropNativeComponentViewProtocol <NSObject>
+
+@end
+
+NS_ASSUME_NONNULL_END",
+}
+`;
+
 exports[`GenerateComponentHObjCpp can generate fixture INT32_ENUM_PROP 1`] = `
 Map {
   "RCTComponentViewHelpers.h" => "/**

packages/react-native-codegen/src/generators/components/__tests__/__snapshots__/GenerateEventEmitterCpp-test.js.snap

@@ -327,6 +327,29 @@ namespace react {
 
 
 
+} // namespace react
+} // namespace facebook
+",
+}
+`;
+
+exports[`GenerateEventEmitterCpp can generate fixture INSETS_PROP 1`] = `
+Map {
+  "EventEmitters.cpp" => "
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#include <react/components/INSETS_PROP/EventEmitters.h>
+
+namespace facebook {
+namespace react {
+
+
+
 } // namespace react
 } // namespace facebook
 ",

packages/react-native-codegen/src/generators/components/__tests__/__snapshots__/GenerateEventEmitterH-test.js.snap

@@ -354,6 +354,30 @@ namespace react {
 
 
 
+} // namespace react
+} // namespace facebook
+",
+}
+`;
+
+exports[`GenerateEventEmitterH can generate fixture INSETS_PROP 1`] = `
+Map {
+  "EventEmitters.h" => "
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+#pragma once
+
+#include <react/components/view/ViewEventEmitter.h>
+
+namespace facebook {
+namespace react {
+
+
+
 } // namespace react
 } // namespace facebook
 ",

packages/react-native-codegen/src/generators/components/__tests__/__snapshots__/GeneratePropsCpp-test.js.snap

@@ -370,6 +370,35 @@ ImagePropNativeComponentProps::ImagePropNativeComponentProps(
 }
 `;
 
+exports[`GeneratePropsCpp can generate fixture INSETS_PROP 1`] = `
+Map {
+  "Props.cpp" => "
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#include <react/components/INSETS_PROP/Props.h>
+#include <react/core/propsConversions.h>
+
+namespace facebook {
+namespace react {
+
+InsetsPropNativeComponentProps::InsetsPropNativeComponentProps(
+    const InsetsPropNativeComponentProps &sourceProps,
+    const RawProps &rawProps): ViewProps(sourceProps, rawProps),
+
+    contentInset(convertRawProp(rawProps, \\"contentInset\\", sourceProps.contentInset, {}))
+      {}
+
+} // namespace react
+} // namespace facebook
+",
+}
+`;
+
 exports[`GeneratePropsCpp can generate fixture INT32_ENUM_PROP 1`] = `
 Map {
   "Props.cpp" => "

packages/react-native-codegen/src/generators/components/__tests__/__snapshots__/GeneratePropsH-test.js.snap

@@ -618,6 +618,39 @@ class ImagePropNativeComponentProps final : public ViewProps {
 }
 `;
 
+exports[`GeneratePropsH can generate fixture INSETS_PROP 1`] = `
+Map {
+  "Props.h" => "
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+#pragma once
+
+#include <react/components/view/ViewProps.h>
+#include <react/graphics/Geometry.h>
+
+namespace facebook {
+namespace react {
+
+class InsetsPropNativeComponentProps final : public ViewProps {
+ public:
+  InsetsPropNativeComponentProps() = default;
+  InsetsPropNativeComponentProps(const InsetsPropNativeComponentProps &sourceProps, const RawProps &rawProps);
+
+#pragma mark - Props
+
+  const EdgeInsets contentInset{};
+};
+
+} // namespace react
+} // namespace facebook
+",
+}
+`;
+
 exports[`GeneratePropsH can generate fixture INT32_ENUM_PROP 1`] = `
 Map {
   "Props.h" => "

packages/react-native-codegen/src/generators/components/__tests__/__snapshots__/GeneratePropsJavaDelegate-test.js.snap

@@ -528,6 +528,45 @@ public class ImagePropNativeComponentManagerDelegate<T extends View, U extends B
 }
 `;
 
+exports[`GeneratePropsJavaDelegate can generate fixture INSETS_PROP 1`] = `
+Map {
+  "InsetsPropNativeComponentManagerDelegate.java" => "/**
+* Copyright (c) Facebook, Inc. and its affiliates.
+*
+* This source code is licensed under the MIT license found in the
+* LICENSE file in the root directory of this source tree.
+*
+* @generated by codegen project: GeneratePropsJavaDelegate.js
+*/
+
+package com.facebook.react.viewmanagers;
+
+import android.view.View;
+import androidx.annotation.Nullable;
+import com.facebook.react.bridge.ReadableMap;
+import com.facebook.react.uimanager.BaseViewManagerDelegate;
+import com.facebook.react.uimanager.BaseViewManagerInterface;
+import com.facebook.react.uimanager.LayoutShadowNode;
+
+public class InsetsPropNativeComponentManagerDelegate<T extends View, U extends BaseViewManagerInterface<T> & InsetsPropNativeComponentManagerInterface<T>> extends BaseViewManagerDelegate<T, U> {
+  public InsetsPropNativeComponentManagerDelegate(U viewManager) {
+    super(viewManager);
+  }
+  @Override
+  public void setProperty(T view, String propName, @Nullable Object value) {
+    switch (propName) {
+      case \\"contentInset\\":
+        mViewManager.setContentInset(view, (ReadableMap) value);
+        break;
+      default:
+        super.setProperty(view, propName, value);
+    }
+  }
+}
+",
+}
+`;
+
 exports[`GeneratePropsJavaDelegate can generate fixture INT32_ENUM_PROP 1`] = `
 Map {
   "Int32EnumPropsNativeComponentManagerDelegate.java" => "/**

packages/react-native-codegen/src/generators/components/__tests__/__snapshots__/GeneratePropsJavaInterface-test.js.snap

@@ -295,6 +295,30 @@ public interface ImagePropNativeComponentManagerInterface<T extends View> {
 }
 `;
 
+exports[`GeneratePropsJavaInterface can generate fixture INSETS_PROP 1`] = `
+Map {
+  "InsetsPropNativeComponentManagerInterface.java" => "/**
+* Copyright (c) Facebook, Inc. and its affiliates.
+*
+* This source code is licensed under the MIT license found in the
+* LICENSE file in the root directory of this source tree.
+*
+* @generated by codegen project: GeneratePropsJavaInterface.js
+*/
+
+package com.facebook.react.viewmanagers;
+
+import android.view.View;
+import androidx.annotation.Nullable;
+import com.facebook.react.bridge.ReadableMap;
+
+public interface InsetsPropNativeComponentManagerInterface<T extends View> {
+  void setContentInset(T view, @Nullable ReadableMap value);
+}
+",
+}
+`;
+
 exports[`GeneratePropsJavaInterface can generate fixture INT32_ENUM_PROP 1`] = `
 Map {
   "Int32EnumPropsNativeComponentManagerInterface.java" => "/**

packages/react-native-codegen/src/generators/components/__tests__/__snapshots__/GenerateShadowNodeCpp-test.js.snap

@@ -276,6 +276,29 @@ extern const char ImagePropNativeComponentComponentName[] = \\"ImagePropNativeCo
 }
 `;
 
+exports[`GenerateShadowNodeCpp can generate fixture INSETS_PROP 1`] = `
+Map {
+  "ShadowNodes.cpp" => "
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#include <react/components/INSETS_PROP/ShadowNodes.h>
+
+namespace facebook {
+namespace react {
+
+extern const char InsetsPropNativeComponentComponentName[] = \\"InsetsPropNativeComponent\\";
+
+} // namespace react
+} // namespace facebook
+",
+}
+`;
+
 exports[`GenerateShadowNodeCpp can generate fixture INT32_ENUM_PROP 1`] = `
 Map {
   "ShadowNodes.cpp" => "

packages/react-native-codegen/src/generators/components/__tests__/__snapshots__/GenerateShadowNodeH-test.js.snap

@@ -393,6 +393,39 @@ using ImagePropNativeComponentShadowNode = ConcreteViewShadowNode<
 }
 `;
 
+exports[`GenerateShadowNodeH can generate fixture INSETS_PROP 1`] = `
+Map {
+  "ShadowNodes.h" => "
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#pragma once
+
+#include <react/components/INSETS_PROP/Props.h>
+#include <react/components/view/ConcreteViewShadowNode.h>
+
+namespace facebook {
+namespace react {
+
+extern const char InsetsPropNativeComponentComponentName[];
+
+/*
+ * \`ShadowNode\` for <InsetsPropNativeComponent> component.
+ */
+using InsetsPropNativeComponentShadowNode = ConcreteViewShadowNode<
+    InsetsPropNativeComponentComponentName,
+    InsetsPropNativeComponentProps>;
+
+} // namespace react
+} // namespace facebook
+",
+}
+`;
+
 exports[`GenerateShadowNodeH can generate fixture INT32_ENUM_PROP 1`] = `
 Map {
   "ShadowNodes.h" => "

packages/react-native-codegen/src/generators/components/__tests__/__snapshots__/GenerateTests-test.js.snap

@@ -446,6 +446,34 @@ TEST(ImagePropNativeComponentProps_thumbImage, etc) {
 }
 `;
 
+exports[`GenerateTests can generate fixture INSETS_PROP 1`] = `
+Map {
+  "Tests.cpp" => "/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#include <gtest/gtest.h>
+#include <react/components/INSETS_PROP/Props.h>
+#include <react/core/RawProps.h>
+#include <react/core/RawPropsParser.h>
+#include <react/core/propsConversions.h>
+
+using namespace facebook::react;
+
+TEST(InsetsPropNativeComponentProps_DoesNotDie, etc) {
+  auto propParser = RawPropsParser();
+  propParser.prepare<InsetsPropNativeComponentProps>();
+  auto const &sourceProps = InsetsPropNativeComponentProps();
+  auto const &rawProps = RawProps(folly::dynamic::object(\\"xx_invalid_xx\\", \\"xx_invalid_xx\\"));
+  rawProps.parse(propParser);
+  InsetsPropNativeComponentProps(sourceProps, rawProps);
+}",
+}
+`;
+
 exports[`GenerateTests can generate fixture INT32_ENUM_PROP 1`] = `
 Map {
   "Tests.cpp" => "/**

packages/react-native-codegen/src/generators/components/__tests__/__snapshots__/GenerateViewConfigJs-test.js.snap

@@ -522,6 +522,41 @@ export default nativeComponentName;
 }
 `;
 
+exports[`GenerateViewConfigJs can generate fixture INSETS_PROP 1`] = `
+Map {
+  "INSETS_PROPNativeViewConfig.js" => "
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+'use strict';
+
+const registerGeneratedViewConfig = require('registerGeneratedViewConfig');
+
+const InsetsPropNativeComponentViewConfig = {
+  uiViewClassName: 'InsetsPropNativeComponent',
+
+  validAttributes: {
+    contentInset: { diff: require('insetsDiffer') },
+  },
+};
+
+let nativeComponentName = 'InsetsPropNativeComponent';
+
+registerGeneratedViewConfig(nativeComponentName, InsetsPropNativeComponentViewConfig);
+
+export const __INTERNAL_VIEW_CONFIG = InsetsPropNativeComponentViewConfig;
+
+export default nativeComponentName;
+",
+}
+`;
+
 exports[`GenerateViewConfigJs can generate fixture INT32_ENUM_PROP 1`] = `
 Map {
   "INT32_ENUM_PROPNativeViewConfig.js" => "

packages/react-native-codegen/src/parsers/flow/components/__test_fixtures__/fixtures.js

@@ -192,7 +192,7 @@ const codegenNativeComponent = require('codegenNativeComponent');
 
 import type {Int32, Double, Float, WithDefault} from 'CodegenTypes';
 import type {ImageSource} from 'ImageSource';
-import type {ColorValue, ColorArrayValue, PointValue} from 'StyleSheetTypes';
+import type {ColorValue, ColorArrayValue, PointValue, EdgeInsetsValue} from 'StyleSheetTypes';
 import type {ViewProps} from 'ViewPropTypes';
 import type {NativeComponent} from 'codegenNativeComponent';
 
@@ -280,6 +280,12 @@ type ModuleProps = $ReadOnly<{|
   point_optional_key?: PointValue,
   point_optional_value: ?PointValue,
   point_optional_both?: ?PointValue,
+
+  // EdgeInsets props
+  insets_required: EdgeInsetsValue,
+  insets_optional_key?: EdgeInsetsValue,
+  insets_optional_value: ?EdgeInsetsValue,
+  insets_optional_both?: ?EdgeInsetsValue,
 |}>;
 
 export default (codegenNativeComponent<ModuleProps, Options>(
@@ -304,7 +310,7 @@ const codegenNativeComponent = require('codegenNativeComponent');
 
 import type {Int32, Double, Float, WithDefault} from 'CodegenTypes';
 import type {ImageSource} from 'ImageSource';
-import type {ColorValue, PointValue} from 'StyleSheetTypes';
+import type {ColorValue, PointValue, EdgeInsetsValue} from 'StyleSheetTypes';
 import type {ViewProps} from 'ViewPropTypes';
 import type {NativeComponent} from 'codegenNativeComponent';
 
@@ -373,6 +379,12 @@ type ModuleProps = $ReadOnly<{|
   array_point_optional_value: ?$ReadOnlyArray<PointValue>,
   array_point_optional_both?: ?$ReadOnlyArray<PointValue>,
 
+  // EdgeInsetsValue props
+  array_insets_required: $ReadOnlyArray<EdgeInsetsValue>,
+  array_insets_optional_key?: $ReadOnlyArray<EdgeInsetsValue>,
+  array_insets_optional_value: ?$ReadOnlyArray<EdgeInsetsValue>,
+  array_insets_optional_both?: ?$ReadOnlyArray<EdgeInsetsValue>,
+
   // Object props
   array_object_required: $ReadOnlyArray<$ReadOnly<{| prop: string |}>>,
   array_object_optional_key?: $ReadOnlyArray<$ReadOnly<{| prop: string |}>>,
@@ -451,7 +463,7 @@ const codegenNativeComponent = require('codegenNativeComponent');
 
 import type {Int32, Double, Float, WithDefault} from 'CodegenTypes';
 import type {ImageSource} from 'ImageSource';
-import type {ColorValue, PointValue} from 'StyleSheetTypes';
+import type {ColorValue, PointValue, EdgeInsetsValue} from 'StyleSheetTypes';
 import type {ViewProps} from 'ViewPropTypes';
 import type {NativeComponent} from 'codegenNativeComponent';
 
@@ -502,6 +514,12 @@ type ModuleProps = $ReadOnly<{|
   point_optional_value: $ReadOnly<{|prop: ?PointValue|}>,
   point_optional_both: $ReadOnly<{|prop?: ?PointValue|}>,
 
+  // EdgeInsetsValue props
+  insets_required: $ReadOnly<{|prop: EdgeInsetsValue|}>,
+  insets_optional_key: $ReadOnly<{|prop?: EdgeInsetsValue|}>,
+  insets_optional_value: $ReadOnly<{|prop: ?EdgeInsetsValue|}>,
+  insets_optional_both: $ReadOnly<{|prop?: ?EdgeInsetsValue|}>,
+
   // Nested object props
   object_required: $ReadOnly<{|prop: $ReadOnly<{nestedProp: string}>|}>,
   object_optional_key?: $ReadOnly<{|prop: $ReadOnly<{nestedProp: string}>|}>,

packages/react-native-codegen/src/parsers/flow/components/__tests__/__snapshots__/component-parser-test.js.snap

@@ -488,6 +488,38 @@ Object {
                 "type": "NativePrimitiveTypeAnnotation",
               },
             },
+            Object {
+              "name": "insets_required",
+              "optional": false,
+              "typeAnnotation": Object {
+                "name": "EdgeInsetsPrimitive",
+                "type": "NativePrimitiveTypeAnnotation",
+              },
+            },
+            Object {
+              "name": "insets_optional_key",
+              "optional": true,
+              "typeAnnotation": Object {
+                "name": "EdgeInsetsPrimitive",
+                "type": "NativePrimitiveTypeAnnotation",
+              },
+            },
+            Object {
+              "name": "insets_optional_value",
+              "optional": true,
+              "typeAnnotation": Object {
+                "name": "EdgeInsetsPrimitive",
+                "type": "NativePrimitiveTypeAnnotation",
+              },
+            },
+            Object {
+              "name": "insets_optional_both",
+              "optional": true,
+              "typeAnnotation": Object {
+                "name": "EdgeInsetsPrimitive",
+                "type": "NativePrimitiveTypeAnnotation",
+              },
+            },
           ],
         },
       },
@@ -881,6 +913,50 @@ Object {
                 "type": "ArrayTypeAnnotation",
               },
             },
+            Object {
+              "name": "array_insets_required",
+              "optional": false,
+              "typeAnnotation": Object {
+                "elementType": Object {
+                  "name": "EdgeInsetsPrimitive",
+                  "type": "NativePrimitiveTypeAnnotation",
+                },
+                "type": "ArrayTypeAnnotation",
+              },
+            },
+            Object {
+              "name": "array_insets_optional_key",
+              "optional": true,
+              "typeAnnotation": Object {
+                "elementType": Object {
+                  "name": "EdgeInsetsPrimitive",
+                  "type": "NativePrimitiveTypeAnnotation",
+                },
+                "type": "ArrayTypeAnnotation",
+              },
+            },
+            Object {
+              "name": "array_insets_optional_value",
+              "optional": true,
+              "typeAnnotation": Object {
+                "elementType": Object {
+                  "name": "EdgeInsetsPrimitive",
+                  "type": "NativePrimitiveTypeAnnotation",
+                },
+                "type": "ArrayTypeAnnotation",
+              },
+            },
+            Object {
+              "name": "array_insets_optional_both",
+              "optional": true,
+              "typeAnnotation": Object {
+                "elementType": Object {
+                  "name": "EdgeInsetsPrimitive",
+                  "type": "NativePrimitiveTypeAnnotation",
+                },
+                "type": "ArrayTypeAnnotation",
+              },
+            },
             Object {
               "name": "array_object_required",
               "optional": false,
@@ -5472,6 +5548,74 @@ Object {
                 "type": "ObjectTypeAnnotation",
               },
             },
+            Object {
+              "name": "insets_required",
+              "optional": false,
+              "typeAnnotation": Object {
+                "properties": Array [
+                  Object {
+                    "name": "prop",
+                    "optional": false,
+                    "typeAnnotation": Object {
+                      "name": "EdgeInsetsPrimitive",
+                      "type": "NativePrimitiveTypeAnnotation",
+                    },
+                  },
+                ],
+                "type": "ObjectTypeAnnotation",
+              },
+            },
+            Object {
+              "name": "insets_optional_key",
+              "optional": false,
+              "typeAnnotation": Object {
+                "properties": Array [
+                  Object {
+                    "name": "prop",
+                    "optional": true,
+                    "typeAnnotation": Object {
+                      "name": "EdgeInsetsPrimitive",
+                      "type": "NativePrimitiveTypeAnnotation",
+                    },
+                  },
+                ],
+                "type": "ObjectTypeAnnotation",
+              },
+            },
+            Object {
+              "name": "insets_optional_value",
+              "optional": false,
+              "typeAnnotation": Object {
+                "properties": Array [
+                  Object {
+                    "name": "prop",
+                    "optional": true,
+                    "typeAnnotation": Object {
+                      "name": "EdgeInsetsPrimitive",
+                      "type": "NativePrimitiveTypeAnnotation",
+                    },
+                  },
+                ],
+                "type": "ObjectTypeAnnotation",
+              },
+            },
+            Object {
+              "name": "insets_optional_both",
+              "optional": false,
+              "typeAnnotation": Object {
+                "properties": Array [
+                  Object {
+                    "name": "prop",
+                    "optional": true,
+                    "typeAnnotation": Object {
+                      "name": "EdgeInsetsPrimitive",
+                      "type": "NativePrimitiveTypeAnnotation",
+                    },
+                  },
+                ],
+                "type": "ObjectTypeAnnotation",
+              },
+            },
             Object {
               "name": "object_required",
               "optional": false,

packages/react-native-codegen/src/parsers/flow/components/props.js

@@ -103,6 +103,11 @@ function getTypeAnnotationForArray(name, typeAnnotation, defaultValue, types) {
         type: 'NativePrimitiveTypeAnnotation',
         name: 'PointPrimitive',
       };
+    case 'EdgeInsetsValue':
+      return {
+        type: 'NativePrimitiveTypeAnnotation',
+        name: 'EdgeInsetsPrimitive',
+      };
     case 'Stringish':
       return {
         type: 'StringTypeAnnotation',
@@ -229,6 +234,11 @@ function getTypeAnnotation(
         type: 'NativePrimitiveTypeAnnotation',
         name: 'PointPrimitive',
       };
+    case 'EdgeInsetsValue':
+      return {
+        type: 'NativePrimitiveTypeAnnotation',
+        name: 'EdgeInsetsPrimitive',
+      };
     case 'Int32':
       return {
         type: 'Int32TypeAnnotation',