@react-native/codegen 0.72.1 → 0.72.2

package/lib/generators/components/ComponentsGeneratorUtils.js.flow

@@ -25,11 +25,12 @@ import type {
 const {
   getCppTypeForAnnotation,
   getEnumMaskName,
-  getEnumName,
   generateStructName,
   getImports,
 } = require('./CppHelpers.js');
 
+const {getEnumName} = require('../Utils');
+
 function getNativeTypeFromAnnotation(
   componentName: string,
   prop:
@@ -78,6 +79,8 @@ function getNativeTypeFromAnnotation(
           return 'Point';
         case 'EdgeInsetsPrimitive':
           return 'EdgeInsets';
+        case 'DimensionPrimitive':
+          return 'YGValue';
         default:
           (typeAnnotation.name: empty);
           throw new Error('Received unknown ReservedPropTypeAnnotation');
@@ -221,7 +224,8 @@ function getLocalImports(
       | 'EdgeInsetsPrimitive'
       | 'ImageSourcePrimitive'
       | 'PointPrimitive'
-      | 'ImageRequestPrimitive',
+      | 'ImageRequestPrimitive'
+      | 'DimensionPrimitive',
   ) {
     switch (name) {
       case 'ColorPrimitive':
@@ -239,6 +243,9 @@ function getLocalImports(
       case 'EdgeInsetsPrimitive':
         imports.add('#include <react/renderer/graphics/RectangleEdges.h>');
         return;
+      case 'DimensionPrimitive':
+        imports.add('#include <yoga/Yoga.h>');
+        return;
       default:
         (name: empty);
         throw new Error(`Invalid ReservedPropTypeAnnotation name, got ${name}`);
@@ -270,8 +277,11 @@ function getLocalImports(
       typeAnnotation.type === 'ArrayTypeAnnotation' &&
       typeAnnotation.elementType.type === 'ObjectTypeAnnotation'
     ) {
+      imports.add('#include <react/renderer/core/propsConversions.h>');
       const objectProps = typeAnnotation.elementType.properties;
+      // $FlowFixMe[incompatible-call] the type is guaranteed to be ObjectTypeAnnotation<PropTypeAnnotation>
       const objectImports = getImports(objectProps);
+      // $FlowFixMe[incompatible-call] the type is guaranteed to be ObjectTypeAnnotation<PropTypeAnnotation>
       const localImports = getLocalImports(objectProps);
       // $FlowFixMe[method-unbinding] added when improving typing for this parameters
       objectImports.forEach(imports.add, imports);

package/lib/generators/components/CppHelpers.js

@@ -10,15 +10,9 @@
 
 'use strict';
 
-function upperCaseFirst(inString) {
-  if (inString.length === 0) {
-    return inString;
-  }
-  return inString[0].toUpperCase() + inString.slice(1);
-}
-function toSafeCppString(input) {
-  return input.split('-').map(upperCaseFirst).join('');
-}
+const _require = require('../Utils'),
+  getEnumName = _require.getEnumName,
+  toSafeCppString = _require.toSafeCppString;
 function toIntEnumValueName(propName, value) {
   return `${toSafeCppString(propName)}${value}`;
 }
@@ -54,6 +48,9 @@ function getImports(properties) {
       case 'ImageSourcePrimitive':
         imports.add('#include <react/renderer/components/image/conversions.h>');
         return;
+      case 'DimensionPrimitive':
+        imports.add('#include <react/renderer/components/view/conversions.h>');
+        return;
       default:
         name;
         throw new Error(`Invalid name, got ${name}`);
@@ -86,10 +83,6 @@ function generateStructName(componentName, parts = []) {
   const additional = parts.map(toSafeCppString).join('');
   return `${componentName}${additional}Struct`;
 }
-function getEnumName(componentName, propName) {
-  const uppercasedPropName = toSafeCppString(propName);
-  return `${componentName}${uppercasedPropName}`;
-}
 function getEnumMaskName(enumName) {
   return `${enumName}Mask`;
 }
@@ -133,6 +126,8 @@ function convertDefaultTypeToString(componentName, prop) {
           return '';
         case 'EdgeInsetsPrimitive':
           return '';
+        case 'DimensionPrimitive':
+          return '';
         default:
           typeAnnotation.name;
           throw new Error(
@@ -178,10 +173,8 @@ function convertDefaultTypeToString(componentName, prop) {
 module.exports = {
   convertDefaultTypeToString,
   getCppTypeForAnnotation,
-  getEnumName,
   getEnumMaskName,
   getImports,
-  toSafeCppString,
   toIntEnumValueName,
   generateStructName,
   generateEventStructName,

package/lib/generators/components/CppHelpers.js.flow

@@ -11,17 +11,7 @@
 'use strict';
 import type {NamedShape, PropTypeAnnotation} from '../../CodegenSchema';
 
-function upperCaseFirst(inString: string): string {
-  if (inString.length === 0) {
-    return inString;
-  }
-
-  return inString[0].toUpperCase() + inString.slice(1);
-}
-
-function toSafeCppString(input: string): string {
-  return input.split('-').map(upperCaseFirst).join('');
-}
+const {getEnumName, toSafeCppString} = require('../Utils');
 
 function toIntEnumValueName(propName: string, value: number): string {
   return `${toSafeCppString(propName)}${value}`;
@@ -63,7 +53,8 @@ function getImports(
       | 'EdgeInsetsPrimitive'
       | 'ImageRequestPrimitive'
       | 'ImageSourcePrimitive'
-      | 'PointPrimitive',
+      | 'PointPrimitive'
+      | 'DimensionPrimitive',
   ) {
     switch (name) {
       case 'ColorPrimitive':
@@ -77,6 +68,9 @@ function getImports(
       case 'ImageSourcePrimitive':
         imports.add('#include <react/renderer/components/image/conversions.h>');
         return;
+      case 'DimensionPrimitive':
+        imports.add('#include <react/renderer/components/view/conversions.h>');
+        return;
       default:
         (name: empty);
         throw new Error(`Invalid name, got ${name}`);
@@ -120,11 +114,6 @@ function generateStructName(
   return `${componentName}${additional}Struct`;
 }
 
-function getEnumName(componentName: string, propName: string): string {
-  const uppercasedPropName = toSafeCppString(propName);
-  return `${componentName}${uppercasedPropName}`;
-}
-
 function getEnumMaskName(enumName: string): string {
   return `${enumName}Mask`;
 }
@@ -172,6 +161,8 @@ function convertDefaultTypeToString(
           return '';
         case 'EdgeInsetsPrimitive':
           return '';
+        case 'DimensionPrimitive':
+          return '';
         default:
           (typeAnnotation.name: empty);
           throw new Error(
@@ -218,10 +209,8 @@ function convertDefaultTypeToString(
 module.exports = {
   convertDefaultTypeToString,
   getCppTypeForAnnotation,
-  getEnumName,
   getEnumMaskName,
   getImports,
-  toSafeCppString,
   toIntEnumValueName,
   generateStructName,
   generateEventStructName,

package/lib/generators/components/GenerateEventEmitterCpp.js

@@ -38,14 +38,18 @@ const ComponentTemplate = ({
   structName,
   dispatchEventName,
   implementation,
-}) =>
-  `
+}) => {
+  const capture = implementation.includes('event')
+    ? 'event=std::move(event)'
+    : '';
+  return `
 void ${className}EventEmitter::${eventName}(${structName} event) const {
-  dispatchEvent("${dispatchEventName}", [event=std::move(event)](jsi::Runtime &runtime) {
+  dispatchEvent("${dispatchEventName}", [${capture}](jsi::Runtime &runtime) {
     ${implementation}
   });
 }
 `.trim();
+};
 const BasicComponentTemplate = ({className, eventName, dispatchEventName}) =>
   `
 void ${className}EventEmitter::${eventName}() const {

package/lib/generators/components/GenerateEventEmitterCpp.js.flow

@@ -67,14 +67,18 @@ const ComponentTemplate = ({
   structName: string,
   dispatchEventName: string,
   implementation: string,
-}) =>
-  `
+}) => {
+  const capture = implementation.includes('event')
+    ? 'event=std::move(event)'
+    : '';
+  return `
 void ${className}EventEmitter::${eventName}(${structName} event) const {
-  dispatchEvent("${dispatchEventName}", [event=std::move(event)](jsi::Runtime &runtime) {
+  dispatchEvent("${dispatchEventName}", [${capture}](jsi::Runtime &runtime) {
     ${implementation}
   });
 }
 `.trim();
+};
 
 const BasicComponentTemplate = ({
   className,

package/lib/generators/components/GenerateEventEmitterH.js

@@ -13,10 +13,10 @@
 const nullthrows = require('nullthrows');
 const _require = require('./CppHelpers'),
   getCppTypeForAnnotation = _require.getCppTypeForAnnotation,
-  toSafeCppString = _require.toSafeCppString,
   generateEventStructName = _require.generateEventStructName;
 const _require2 = require('../Utils'),
-  indent = _require2.indent;
+  indent = _require2.indent,
+  toSafeCppString = _require2.toSafeCppString;
 const FileTemplate = ({componentEmitters}) => `
 /**
  * This code was generated by [react-native-codegen](https://www.npmjs.com/package/react-native-codegen).

package/lib/generators/components/GenerateEventEmitterH.js.flow

@@ -14,10 +14,9 @@ const nullthrows = require('nullthrows');
 
 const {
   getCppTypeForAnnotation,
-  toSafeCppString,
   generateEventStructName,
 } = require('./CppHelpers');
-const {indent} = require('../Utils');
+const {indent, toSafeCppString} = require('../Utils');
 
 import type {
   ComponentShape,

package/lib/generators/components/GeneratePropsH.js

@@ -16,10 +16,11 @@ const _require = require('./ComponentsGeneratorUtils.js'),
 const _require2 = require('./CppHelpers.js'),
   convertDefaultTypeToString = _require2.convertDefaultTypeToString,
   getEnumMaskName = _require2.getEnumMaskName,
-  getEnumName = _require2.getEnumName,
-  toSafeCppString = _require2.toSafeCppString,
   generateStructName = _require2.generateStructName,
   toIntEnumValueName = _require2.toIntEnumValueName;
+const _require3 = require('../Utils'),
+  getEnumName = _require3.getEnumName,
+  toSafeCppString = _require3.toSafeCppString;
 const FileTemplate = ({imports, componentClasses}) => `
 /**
  * This code was generated by [react-native-codegen](https://www.npmjs.com/package/react-native-codegen).
@@ -512,8 +513,6 @@ function generateStruct(structs, componentName, nameParts, properties) {
         return;
       case 'Int32EnumTypeAnnotation':
         return;
-      case 'DoubleTypeAnnotation':
-        return;
       case 'ObjectTypeAnnotation':
         const props = property.typeAnnotation.properties;
         if (props == null) {

package/lib/generators/components/GeneratePropsH.js.flow

@@ -19,12 +19,12 @@ const {
 const {
   convertDefaultTypeToString,
   getEnumMaskName,
-  getEnumName,
-  toSafeCppString,
   generateStructName,
   toIntEnumValueName,
 } = require('./CppHelpers.js');
 
+const {getEnumName, toSafeCppString} = require('../Utils');
+
 import type {
   ExtendsPropsShape,
   NamedShape,
@@ -667,8 +667,6 @@ function generateStruct(
         return;
       case 'Int32EnumTypeAnnotation':
         return;
-      case 'DoubleTypeAnnotation':
-        return;
       case 'ObjectTypeAnnotation':
         const props = property.typeAnnotation.properties;
         if (props == null) {

package/lib/generators/components/GeneratePropsJavaDelegate.js

@@ -104,6 +104,8 @@ function getJavaValueForProp(prop, componentName) {
           return '(ReadableMap) value';
         case 'EdgeInsetsPrimitive':
           return '(ReadableMap) value';
+        case 'DimensionPrimitive':
+          return 'DimensionPropConverter.getDimension(value)';
         default:
           typeAnnotation.name;
           throw new Error('Received unknown ReservedPropTypeAnnotation');

package/lib/generators/components/GeneratePropsJavaDelegate.js.flow

@@ -128,6 +128,8 @@ function getJavaValueForProp(
           return '(ReadableMap) value';
         case 'EdgeInsetsPrimitive':
           return '(ReadableMap) value';
+        case 'DimensionPrimitive':
+          return 'DimensionPropConverter.getDimension(value)';
         default:
           (typeAnnotation.name: empty);
           throw new Error('Received unknown ReservedPropTypeAnnotation');

package/lib/generators/components/GeneratePropsJavaInterface.js

@@ -84,6 +84,9 @@ function getJavaValueForProp(prop, imports) {
         case 'EdgeInsetsPrimitive':
           addNullable(imports);
           return '@Nullable ReadableMap value';
+        case 'DimensionPrimitive':
+          addNullable(imports);
+          return '@Nullable YogaValue value';
         default:
           typeAnnotation.name;
           throw new Error('Received unknown ReservedPropTypeAnnotation');

package/lib/generators/components/GeneratePropsJavaInterface.js.flow

@@ -106,6 +106,9 @@ function getJavaValueForProp(
         case 'EdgeInsetsPrimitive':
           addNullable(imports);
           return '@Nullable ReadableMap value';
+        case 'DimensionPrimitive':
+          addNullable(imports);
+          return '@Nullable YogaValue value';
         default:
           (typeAnnotation.name: empty);
           throw new Error('Received unknown ReservedPropTypeAnnotation');

package/lib/generators/components/GeneratePropsJavaPojo/serializePojo.js

@@ -17,6 +17,7 @@ function toJavaType(typeAnnotation, addImport) {
   const importReadableMap = () =>
     addImport('com.facebook.react.bridge.ReadableMap');
   const importArrayList = () => addImport('java.util.ArrayList');
+  const importYogaValue = () => addImport('com.facebook.yoga.YogaValue');
   switch (typeAnnotation.type) {
     /**
      * Primitives
@@ -92,6 +93,10 @@ function toJavaType(typeAnnotation, addImport) {
           importNullable();
           importReadableMap();
           return '@Nullable ReadableMap';
+        case 'DimensionPrimitive':
+          importNullable();
+          importYogaValue();
+          return '@Nullable YogaValue';
         default:
           typeAnnotation.name;
           throw new Error(
@@ -175,6 +180,9 @@ function toJavaType(typeAnnotation, addImport) {
               case 'EdgeInsetsPrimitive':
                 importReadableMap();
                 return 'ReadableMap';
+              case 'DimensionPrimitive':
+                importYogaValue();
+                return 'YogaValue';
               default:
                 elementType.name;
                 throw new Error(

package/lib/generators/components/GeneratePropsJavaPojo/serializePojo.js.flow

@@ -23,6 +23,7 @@ function toJavaType(
   const importReadableMap = () =>
     addImport('com.facebook.react.bridge.ReadableMap');
   const importArrayList = () => addImport('java.util.ArrayList');
+  const importYogaValue = () => addImport('com.facebook.yoga.YogaValue');
   switch (typeAnnotation.type) {
     /**
      * Primitives
@@ -98,6 +99,12 @@ function toJavaType(
           importNullable();
           importReadableMap();
           return '@Nullable ReadableMap';
+
+        case 'DimensionPrimitive':
+          importNullable();
+          importYogaValue();
+          return '@Nullable YogaValue';
+
         default:
           (typeAnnotation.name: empty);
           throw new Error(
@@ -182,6 +189,11 @@ function toJavaType(
               case 'EdgeInsetsPrimitive':
                 importReadableMap();
                 return 'ReadableMap';
+
+              case 'DimensionPrimitive':
+                importYogaValue();
+                return 'YogaValue';
+
               default:
                 (elementType.name: empty);
                 throw new Error(

package/lib/generators/components/GenerateTests.js

@@ -11,8 +11,9 @@
 'use strict';
 
 const _require = require('./CppHelpers'),
-  getImports = _require.getImports,
-  toSafeCppString = _require.toSafeCppString;
+  getImports = _require.getImports;
+const _require2 = require('../Utils'),
+  toSafeCppString = _require2.toSafeCppString;
 const FileTemplate = ({libraryName, imports, componentTests}) =>
   `
 /**

package/lib/generators/components/GenerateTests.js.flow

@@ -12,7 +12,9 @@
 import type {ComponentShape, PropTypeAnnotation} from '../../CodegenSchema';
 import type {SchemaType} from '../../CodegenSchema';
 
-const {getImports, toSafeCppString} = require('./CppHelpers');
+const {getImports} = require('./CppHelpers');
+
+const {toSafeCppString} = require('../Utils');
 
 type FilesOutput = Map<string, string>;
 type PropValueType = string | number | boolean;

package/lib/generators/components/GenerateViewConfigJs.js

@@ -51,7 +51,7 @@ function getReactDiffProcessValue(typeAnnotation) {
       switch (typeAnnotation.name) {
         case 'ColorPrimitive':
           return j.template
-            .expression`{ process: require('react-native/Libraries/StyleSheet/processColor') }`;
+            .expression`{ process: require('react-native/Libraries/StyleSheet/processColor').default }`;
         case 'ImageSourcePrimitive':
           return j.template
             .expression`{ process: require('react-native/Libraries/Image/resolveAssetSource') }`;
@@ -63,6 +63,8 @@ function getReactDiffProcessValue(typeAnnotation) {
         case 'EdgeInsetsPrimitive':
           return j.template
             .expression`{ diff: require('react-native/Libraries/Utilities/differ/insetsDiffer') }`;
+        case 'DimensionPrimitive':
+          return j.literal(true);
         default:
           typeAnnotation.name;
           throw new Error(
@@ -76,8 +78,9 @@ function getReactDiffProcessValue(typeAnnotation) {
             return j.template
               .expression`{ process: require('react-native/Libraries/StyleSheet/processColorArray') }`;
           case 'ImageSourcePrimitive':
-            return j.literal(true);
           case 'PointPrimitive':
+          case 'EdgeInsetsPrimitive':
+          case 'DimensionPrimitive':
             return j.literal(true);
           default:
             throw new Error(

package/lib/generators/components/GenerateViewConfigJs.js.flow

@@ -65,7 +65,7 @@ function getReactDiffProcessValue(typeAnnotation: PropTypeAnnotation) {
       switch (typeAnnotation.name) {
         case 'ColorPrimitive':
           return j.template
-            .expression`{ process: require('react-native/Libraries/StyleSheet/processColor') }`;
+            .expression`{ process: require('react-native/Libraries/StyleSheet/processColor').default }`;
         case 'ImageSourcePrimitive':
           return j.template
             .expression`{ process: require('react-native/Libraries/Image/resolveAssetSource') }`;
@@ -77,6 +77,8 @@ function getReactDiffProcessValue(typeAnnotation: PropTypeAnnotation) {
         case 'EdgeInsetsPrimitive':
           return j.template
             .expression`{ diff: require('react-native/Libraries/Utilities/differ/insetsDiffer') }`;
+        case 'DimensionPrimitive':
+          return j.literal(true);
         default:
           (typeAnnotation.name: empty);
           throw new Error(
@@ -90,8 +92,9 @@ function getReactDiffProcessValue(typeAnnotation: PropTypeAnnotation) {
             return j.template
               .expression`{ process: require('react-native/Libraries/StyleSheet/processColorArray') }`;
           case 'ImageSourcePrimitive':
-            return j.literal(true);
           case 'PointPrimitive':
+          case 'EdgeInsetsPrimitive':
+          case 'DimensionPrimitive':
             return j.literal(true);
           default:
             throw new Error(

package/lib/generators/components/JavaHelpers.js

@@ -60,6 +60,15 @@ function getImports(component, type) {
       case 'EdgeInsetsPrimitive':
         imports.add('import com.facebook.react.bridge.ReadableMap;');
         return;
+      case 'DimensionPrimitive':
+        if (type === 'delegate') {
+          imports.add(
+            'import com.facebook.react.bridge.DimensionPropConverter;',
+          );
+        } else {
+          imports.add('import com.facebook.yoga.YogaValue;');
+        }
+        return;
       default:
         name;
         throw new Error(`Invalid ReservedPropTypeAnnotation name, got ${name}`);

package/lib/generators/components/JavaHelpers.js.flow

@@ -66,10 +66,12 @@ function getImports(
       | 'EdgeInsetsPrimitive'
       | 'ImageSourcePrimitive'
       | 'PointPrimitive'
+      | 'DimensionPrimitive'
       | $TEMPORARY$string<'ColorPrimitive'>
       | $TEMPORARY$string<'EdgeInsetsPrimitive'>
       | $TEMPORARY$string<'ImageSourcePrimitive'>
-      | $TEMPORARY$string<'PointPrimitive'>,
+      | $TEMPORARY$string<'PointPrimitive'>
+      | $TEMPORARY$string<'DimensionPrimitive'>,
   ) {
     switch (name) {
       case 'ColorPrimitive':
@@ -86,6 +88,15 @@ function getImports(
       case 'EdgeInsetsPrimitive':
         imports.add('import com.facebook.react.bridge.ReadableMap;');
         return;
+      case 'DimensionPrimitive':
+        if (type === 'delegate') {
+          imports.add(
+            'import com.facebook.react.bridge.DimensionPropConverter;',
+          );
+        } else {
+          imports.add('import com.facebook.yoga.YogaValue;');
+        }
+        return;
       default:
         (name: empty);
         throw new Error(`Invalid ReservedPropTypeAnnotation name, got ${name}`);

package/lib/generators/components/__test_fixtures__/fixtures.js

@@ -512,6 +512,35 @@ const INSETS_PROP = {
     },
   },
 };
+const DIMENSION_PROP = {
+  modules: {
+    CustomView: {
+      type: 'Component',
+      components: {
+        DimensionPropNativeComponent: {
+          extendsProps: [
+            {
+              type: 'ReactNativeBuiltInType',
+              knownTypeName: 'ReactNativeCoreViewProps',
+            },
+          ],
+          events: [],
+          props: [
+            {
+              name: 'marginBack',
+              optional: true,
+              typeAnnotation: {
+                type: 'ReservedPropTypeAnnotation',
+                name: 'DimensionPrimitive',
+              },
+            },
+          ],
+          commands: [],
+        },
+      },
+    },
+  },
+};
 const ARRAY_PROPS = {
   modules: {
     Slider: {
@@ -599,6 +628,17 @@ const ARRAY_PROPS = {
                 },
               },
             },
+            {
+              name: 'dimensions',
+              optional: true,
+              typeAnnotation: {
+                type: 'ArrayTypeAnnotation',
+                elementType: {
+                  type: 'ReservedPropTypeAnnotation',
+                  name: 'DimensionPrimitive',
+                },
+              },
+            },
             {
               name: 'sizes',
               optional: true,
@@ -1622,6 +1662,7 @@ module.exports = {
   IMAGE_PROP,
   POINT_PROP,
   INSETS_PROP,
+  DIMENSION_PROP,
   ARRAY_PROPS,
   ARRAY_PROPS_WITH_NESTED_OBJECT,
   OBJECT_PROPS,

package/lib/generators/components/__test_fixtures__/fixtures.js.flow

@@ -526,6 +526,36 @@ const INSETS_PROP: SchemaType = {
   },
 };
 
+const DIMENSION_PROP: SchemaType = {
+  modules: {
+    CustomView: {
+      type: 'Component',
+      components: {
+        DimensionPropNativeComponent: {
+          extendsProps: [
+            {
+              type: 'ReactNativeBuiltInType',
+              knownTypeName: 'ReactNativeCoreViewProps',
+            },
+          ],
+          events: [],
+          props: [
+            {
+              name: 'marginBack',
+              optional: true,
+              typeAnnotation: {
+                type: 'ReservedPropTypeAnnotation',
+                name: 'DimensionPrimitive',
+              },
+            },
+          ],
+          commands: [],
+        },
+      },
+    },
+  },
+};
+
 const ARRAY_PROPS: SchemaType = {
   modules: {
     Slider: {
@@ -613,6 +643,17 @@ const ARRAY_PROPS: SchemaType = {
                 },
               },
             },
+            {
+              name: 'dimensions',
+              optional: true,
+              typeAnnotation: {
+                type: 'ArrayTypeAnnotation',
+                elementType: {
+                  type: 'ReservedPropTypeAnnotation',
+                  name: 'DimensionPrimitive',
+                },
+              },
+            },
             {
               name: 'sizes',
               optional: true,
@@ -1653,6 +1694,7 @@ module.exports = {
   IMAGE_PROP,
   POINT_PROP,
   INSETS_PROP,
+  DIMENSION_PROP,
   ARRAY_PROPS,
   ARRAY_PROPS_WITH_NESTED_OBJECT,
   OBJECT_PROPS,