From 1aca74586f4f4f2cb534e511e06f945a17c20140 Mon Sep 17 00:00:00 2001 From: Rick Hanlon Date: Thu, 16 May 2019 10:45:54 -0700 Subject: [PATCH] Update view configs handle view props/events Summary: This diff adds support for spreading view props into the generated viewconfig (currently hardcoded the view viewconfig but soon that will also be generated) Results in a generated view config such as: ``` const ReactNativeViewConfig = require('ReactNativeViewConfig'); const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry'); const BooleanPropNativeComponentViewConfig = { uiViewClassName: 'BooleanPropNativeComponent', Commands: {}, bubblingEventTypes: { ...ReactNativeViewConfig.bubblingEventTypes }, directEventTypes: { ...ReactNativeViewConfig.directEventTypes }, validAttributes: { ...ReactNativeViewConfig.validAttributes, disabled: true } }; ReactNativeViewConfigRegistry.register( 'BooleanPropNativeComponent', () => BooleanPropNativeComponentViewConfig, ); module.exports = 'BooleanPropNativeComponent'; ``` Reviewed By: TheSavior Differential Revision: D15258778 fbshipit-source-id: 2c70d20dc366f32a8114d42e0e15b5f1e359d11f --- .../View/ReactNativeViewViewConfig.js | 317 ++++++++++++++++++ .../src/generators/GenerateViewConfigJs.js | 61 +++- .../GenerateViewConfigJs-test.js.snap | 281 ++++++++++++---- 3 files changed, 578 insertions(+), 81 deletions(-) create mode 100644 Libraries/Components/View/ReactNativeViewViewConfig.js diff --git a/Libraries/Components/View/ReactNativeViewViewConfig.js b/Libraries/Components/View/ReactNativeViewViewConfig.js new file mode 100644 index 00000000000..c3998f3e6ca --- /dev/null +++ b/Libraries/Components/View/ReactNativeViewViewConfig.js @@ -0,0 +1,317 @@ +/** + * 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 + * @format + */ + +'use strict'; + +const ReactNativeViewConfig = { + uiViewClassName: 'RCTView', + baseModuleName: null, + Manager: 'ViewManager', + Commands: {}, + Constants: {}, + bubblingEventTypes: { + topBlur: { + phasedRegistrationNames: { + bubbled: 'onBlur', + captured: 'onBlurCapture', + }, + }, + topChange: { + phasedRegistrationNames: { + bubbled: 'onChange', + captured: 'onChangeCapture', + }, + }, + topEndEditing: { + phasedRegistrationNames: { + bubbled: 'onEndEditing', + captured: 'onEndEditingCapture', + }, + }, + topFocus: { + phasedRegistrationNames: { + bubbled: 'onFocus', + captured: 'onFocusCapture', + }, + }, + topKeyPress: { + phasedRegistrationNames: { + bubbled: 'onKeyPress', + captured: 'onKeyPressCapture', + }, + }, + topPress: { + phasedRegistrationNames: { + bubbled: 'onPress', + captured: 'onPressCapture', + }, + }, + topSubmitEditing: { + phasedRegistrationNames: { + bubbled: 'onSubmitEditing', + captured: 'onSubmitEditingCapture', + }, + }, + topTouchCancel: { + phasedRegistrationNames: { + bubbled: 'onTouchCancel', + captured: 'onTouchCancelCapture', + }, + }, + topTouchEnd: { + phasedRegistrationNames: { + bubbled: 'onTouchEnd', + captured: 'onTouchEndCapture', + }, + }, + topTouchMove: { + phasedRegistrationNames: { + bubbled: 'onTouchMove', + captured: 'onTouchMoveCapture', + }, + }, + topTouchStart: { + phasedRegistrationNames: { + bubbled: 'onTouchStart', + captured: 'onTouchStartCapture', + }, + }, + }, + directEventTypes: { + topAccessibilityAction: { + registrationName: 'onAccessibilityAction', + }, + topAccessibilityEscape: { + registrationName: 'onAccessibilityEscape', + }, + topAccessibilityTap: { + registrationName: 'onAccessibilityTap', + }, + topLayout: { + registrationName: 'onLayout', + }, + topMagicTap: { + registrationName: 'onMagicTap', + }, + }, + validAttributes: { + accessibilityActions: true, + accessibilityElementsHidden: true, + accessibilityHint: true, + accessibilityIgnoresInvertColors: true, + accessibilityLabel: true, + accessibilityRole: true, + accessibilityStates: true, + accessibilityViewIsModal: true, + accessible: true, + alignContent: true, + alignItems: true, + alignSelf: true, + aspectRatio: true, + backfaceVisibility: true, + backgroundColor: {process: require('processColor')}, + borderBottomColor: {process: require('processColor')}, + borderBottomEndRadius: true, + borderBottomLeftRadius: true, + borderBottomRightRadius: true, + borderBottomStartRadius: true, + borderBottomWidth: true, + borderColor: {process: require('processColor')}, + borderEndColor: {process: require('processColor')}, + borderEndWidth: true, + borderLeftColor: {process: require('processColor')}, + borderLeftWidth: true, + borderRadius: true, + borderRightColor: {process: require('processColor')}, + borderRightWidth: true, + borderStartColor: {process: require('processColor')}, + borderStartWidth: true, + borderStyle: true, + borderTopColor: {process: require('processColor')}, + borderTopEndRadius: true, + borderTopLeftRadius: true, + borderTopRightRadius: true, + borderTopStartRadius: true, + borderTopWidth: true, + borderWidth: true, + bottom: true, + direction: true, + display: true, + end: true, + flex: true, + flexBasis: true, + flexDirection: true, + flexGrow: true, + flexShrink: true, + flexWrap: true, + height: true, + hitSlop: {diff: require('insetsDiffer')}, + justifyContent: true, + left: true, + margin: true, + marginBottom: true, + marginEnd: true, + marginHorizontal: true, + marginLeft: true, + marginRight: true, + marginStart: true, + marginTop: true, + marginVertical: true, + maxHeight: true, + maxWidth: true, + minHeight: true, + minWidth: true, + nativeID: true, + needsOffscreenAlphaCompositing: true, + onAccessibilityAction: true, + onAccessibilityEscape: true, + onAccessibilityTap: true, + onLayout: true, + onMagicTap: true, + opacity: true, + overflow: true, + padding: true, + paddingBottom: true, + paddingEnd: true, + paddingHorizontal: true, + paddingLeft: true, + paddingRight: true, + paddingStart: true, + paddingTop: true, + paddingVertical: true, + pointerEvents: true, + position: true, + removeClippedSubviews: true, + right: true, + shadowColor: {process: require('processColor')}, + shadowOffset: {diff: require('sizesDiffer')}, + shadowOpacity: true, + shadowRadius: true, + shouldRasterizeIOS: true, + start: true, + style: { + alignContent: true, + alignItems: true, + alignSelf: true, + aspectRatio: true, + backfaceVisibility: true, + backgroundColor: {process: require('processColor')}, + borderBottomColor: {process: require('processColor')}, + borderBottomEndRadius: true, + borderBottomLeftRadius: true, + borderBottomRightRadius: true, + borderBottomStartRadius: true, + borderBottomWidth: true, + borderColor: {process: require('processColor')}, + borderEndColor: {process: require('processColor')}, + borderEndWidth: true, + borderLeftColor: {process: require('processColor')}, + borderLeftWidth: true, + borderRadius: true, + borderRightColor: {process: require('processColor')}, + borderRightWidth: true, + borderStartColor: {process: require('processColor')}, + borderStartWidth: true, + borderStyle: true, + borderTopColor: {process: require('processColor')}, + borderTopEndRadius: true, + borderTopLeftRadius: true, + borderTopRightRadius: true, + borderTopStartRadius: true, + borderTopWidth: true, + borderWidth: true, + bottom: true, + color: {process: require('processColor')}, + decomposedMatrix: true, + direction: true, + display: true, + elevation: true, + end: true, + flex: true, + flexBasis: true, + flexDirection: true, + flexGrow: true, + flexShrink: true, + flexWrap: true, + fontFamily: true, + fontSize: true, + fontStyle: true, + fontVariant: true, + fontWeight: true, + height: true, + includeFontPadding: true, + justifyContent: true, + left: true, + letterSpacing: true, + lineHeight: true, + margin: true, + marginBottom: true, + marginEnd: true, + marginHorizontal: true, + marginLeft: true, + marginRight: true, + marginStart: true, + marginTop: true, + marginVertical: true, + maxHeight: true, + maxWidth: true, + minHeight: true, + minWidth: true, + opacity: true, + overflow: true, + overlayColor: {process: require('processColor')}, + padding: true, + paddingBottom: true, + paddingEnd: true, + paddingHorizontal: true, + paddingLeft: true, + paddingRight: true, + paddingStart: true, + paddingTop: true, + paddingVertical: true, + position: true, + resizeMode: true, + right: true, + rotation: true, + scaleX: true, + scaleY: true, + shadowColor: {process: require('processColor')}, + shadowOffset: {diff: require('sizesDiffer')}, + shadowOpacity: true, + shadowRadius: true, + start: true, + textAlign: true, + textAlignVertical: true, + textDecorationColor: {process: require('processColor')}, + textDecorationLine: true, + textDecorationStyle: true, + textShadowColor: {process: require('processColor')}, + textShadowOffset: true, + textShadowRadius: true, + textTransform: true, + tintColor: {process: require('processColor')}, + top: true, + transform: {diff: require('matricesDiffer')}, + transformMatrix: true, + translateX: true, + translateY: true, + width: true, + writingDirection: true, + zIndex: true, + }, + testID: true, + top: true, + transform: {diff: require('matricesDiffer')}, + width: true, + zIndex: true, + }, +}; + +module.exports = ReactNativeViewConfig; diff --git a/packages/react-native-codegen/src/generators/GenerateViewConfigJs.js b/packages/react-native-codegen/src/generators/GenerateViewConfigJs.js index 03d700c4ec8..f7fdb72c843 100644 --- a/packages/react-native-codegen/src/generators/GenerateViewConfigJs.js +++ b/packages/react-native-codegen/src/generators/GenerateViewConfigJs.js @@ -72,12 +72,23 @@ ReactNativeViewConfigRegistry.register( '::_COMPONENT_NAME_::', () => ::_COMPONENT_NAME_::ViewConfig, ); + +module.exports = '::_COMPONENT_NAME_::'; `.trim(); +function normalizeInputEventName(name) { + if (name.startsWith('on')) { + return name.replace(/^on/, 'top'); + } else if (!name.startsWith('top')) { + return `top${name[0].toUpperCase()}${name.slice(1)}`; + } + + return name; +} function generateBubblingEventInfo(event) { return j.property( 'init', - j.identifier(event.name), + j.identifier(normalizeInputEventName(event.name)), j.objectExpression([ j.property( 'init', @@ -116,8 +127,11 @@ function buildViewConfig( imports, ) { const componentProps = component.props; + const componentEvents = component.events; - let styleAttribute = null; + let viewAttributes = null; + let viewEvents = null; + let viewDirectEvents = null; component.extendsProps.forEach(extendProps => { switch (extendProps.type) { @@ -125,13 +139,30 @@ function buildViewConfig( switch (extendProps.knownTypeName) { case 'ReactNativeCoreViewProps': imports.add( - "const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes');", + "const ReactNativeViewViewConfig = require('ReactNativeViewViewConfig');", ); - styleAttribute = j.property( - 'init', - j.identifier('style'), - j.identifier('ReactNativeStyleAttributes'), + + viewAttributes = j.spreadProperty( + j.memberExpression( + j.identifier('ReactNativeViewViewConfig'), + j.identifier('validAttributes'), + ), ); + + viewEvents = j.spreadProperty( + j.memberExpression( + j.identifier('ReactNativeViewViewConfig'), + j.identifier('bubblingEventTypes'), + ), + ); + + viewDirectEvents = j.spreadProperty( + j.memberExpression( + j.identifier('ReactNativeViewViewConfig'), + j.identifier('directEventTypes'), + ), + ); + return; default: (extendProps.knownTypeName: empty); @@ -144,6 +175,7 @@ function buildViewConfig( }); const validAttributes = j.objectExpression([ + viewAttributes, ...componentProps.map(schemaProp => { return j.property( 'init', @@ -151,13 +183,17 @@ function buildViewConfig( getReactDiffProcessValue(schemaProp), ); }), - styleAttribute, + ...componentEvents.map(eventType => { + return j.property('init', j.identifier(eventType.name), j.literal(true)); + }), ]); const bubblingEventNames = component.events .filter(event => event.bubblingType === 'bubble') .map(generateBubblingEventInfo); + bubblingEventNames.unshift(viewEvents); + const bubblingEvents = bubblingEventNames.length > 0 ? j.property( @@ -171,6 +207,8 @@ function buildViewConfig( .filter(event => event.bubblingType === 'direct') .map(generateDirectEventInfo); + directEventNames.unshift(viewDirectEvents); + const directEvents = directEventNames.length > 0 ? j.property( @@ -186,12 +224,6 @@ function buildViewConfig( j.objectExpression([]), ); - const constants = j.property( - 'init', - j.identifier('Constants'), - j.objectExpression([]), - ); - const properties = [ j.property( 'init', @@ -199,7 +231,6 @@ function buildViewConfig( j.literal(componentName), ), commands, - constants, bubblingEvents, directEvents, j.property('init', j.identifier('validAttributes'), validAttributes), diff --git a/packages/react-native-codegen/src/generators/__tests__/__snapshots__/GenerateViewConfigJs-test.js.snap b/packages/react-native-codegen/src/generators/__tests__/__snapshots__/GenerateViewConfigJs-test.js.snap index 0531ad8d392..b853d6c7ca4 100644 --- a/packages/react-native-codegen/src/generators/__tests__/__snapshots__/GenerateViewConfigJs-test.js.snap +++ b/packages/react-native-codegen/src/generators/__tests__/__snapshots__/GenerateViewConfigJs-test.js.snap @@ -15,23 +15,30 @@ Map { 'use strict'; -const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes'); const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry'); +const ReactNativeViewViewConfig = require('ReactNativeViewViewConfig'); const ArrayPropsNativeComponentViewConfig = { uiViewClassName: 'ArrayPropsNativeComponent', Commands: {}, - Constants: {}, + + bubblingEventTypes: { + ...ReactNativeViewViewConfig.bubblingEventTypes + }, + + directEventTypes: { + ...ReactNativeViewViewConfig.directEventTypes + }, validAttributes: { + ...ReactNativeViewViewConfig.validAttributes, names: true, disableds: true, progress: true, radii: true, colors: true, srcs: true, - points: true, - style: ReactNativeStyleAttributes + points: true } }; @@ -39,6 +46,8 @@ ReactNativeViewConfigRegistry.register( 'ArrayPropsNativeComponent', () => ArrayPropsNativeComponentViewConfig, ); + +module.exports = 'ArrayPropsNativeComponent'; ", } `; @@ -58,17 +67,24 @@ Map { 'use strict'; -const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes'); const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry'); +const ReactNativeViewViewConfig = require('ReactNativeViewViewConfig'); const BooleanPropNativeComponentViewConfig = { uiViewClassName: 'BooleanPropNativeComponent', Commands: {}, - Constants: {}, + + bubblingEventTypes: { + ...ReactNativeViewViewConfig.bubblingEventTypes + }, + + directEventTypes: { + ...ReactNativeViewViewConfig.directEventTypes + }, validAttributes: { - disabled: true, - style: ReactNativeStyleAttributes + ...ReactNativeViewViewConfig.validAttributes, + disabled: true } }; @@ -76,6 +92,8 @@ ReactNativeViewConfigRegistry.register( 'BooleanPropNativeComponent', () => BooleanPropNativeComponentViewConfig, ); + +module.exports = 'BooleanPropNativeComponent'; ", } `; @@ -95,17 +113,24 @@ Map { 'use strict'; -const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes'); const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry'); +const ReactNativeViewViewConfig = require('ReactNativeViewViewConfig'); const ColorPropNativeComponentViewConfig = { uiViewClassName: 'ColorPropNativeComponent', Commands: {}, - Constants: {}, + + bubblingEventTypes: { + ...ReactNativeViewViewConfig.bubblingEventTypes + }, + + directEventTypes: { + ...ReactNativeViewViewConfig.directEventTypes + }, validAttributes: { - tintColor: { process: require('processColor') }, - style: ReactNativeStyleAttributes + ...ReactNativeViewViewConfig.validAttributes, + tintColor: { process: require('processColor') } } }; @@ -113,6 +138,8 @@ ReactNativeViewConfigRegistry.register( 'ColorPropNativeComponent', () => ColorPropNativeComponentViewConfig, ); + +module.exports = 'ColorPropNativeComponent'; ", } `; @@ -132,17 +159,24 @@ Map { 'use strict'; -const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes'); const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry'); +const ReactNativeViewViewConfig = require('ReactNativeViewViewConfig'); const EnumPropsNativeComponentViewConfig = { uiViewClassName: 'EnumPropsNativeComponent', Commands: {}, - Constants: {}, + + bubblingEventTypes: { + ...ReactNativeViewViewConfig.bubblingEventTypes + }, + + directEventTypes: { + ...ReactNativeViewViewConfig.directEventTypes + }, validAttributes: { - alignment: true, - style: ReactNativeStyleAttributes + ...ReactNativeViewViewConfig.validAttributes, + alignment: true } }; @@ -150,6 +184,8 @@ ReactNativeViewConfigRegistry.register( 'EnumPropsNativeComponent', () => EnumPropsNativeComponentViewConfig, ); + +module.exports = 'EnumPropsNativeComponent'; ", } `; @@ -169,16 +205,17 @@ Map { 'use strict'; -const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes'); const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry'); +const ReactNativeViewViewConfig = require('ReactNativeViewViewConfig'); const EventsNestedObjectNativeComponentViewConfig = { uiViewClassName: 'EventsNestedObjectNativeComponent', Commands: {}, - Constants: {}, bubblingEventTypes: { - onChange: { + ...ReactNativeViewViewConfig.bubblingEventTypes, + + topChange: { phasedRegistrationNames: { captured: 'onChangeCapture', bubbled: 'onChange' @@ -186,9 +223,14 @@ const EventsNestedObjectNativeComponentViewConfig = { } }, + directEventTypes: { + ...ReactNativeViewViewConfig.directEventTypes + }, + validAttributes: { + ...ReactNativeViewViewConfig.validAttributes, disabled: true, - style: ReactNativeStyleAttributes + onChange: true } }; @@ -196,6 +238,8 @@ ReactNativeViewConfigRegistry.register( 'EventsNestedObjectNativeComponent', () => EventsNestedObjectNativeComponentViewConfig, ); + +module.exports = 'EventsNestedObjectNativeComponent'; ", } `; @@ -215,16 +259,17 @@ Map { 'use strict'; -const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes'); const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry'); +const ReactNativeViewViewConfig = require('ReactNativeViewViewConfig'); const EventsNativeComponentViewConfig = { uiViewClassName: 'EventsNativeComponent', Commands: {}, - Constants: {}, bubblingEventTypes: { - onChange: { + ...ReactNativeViewViewConfig.bubblingEventTypes, + + topChange: { phasedRegistrationNames: { captured: 'onChangeCapture', bubbled: 'onChange' @@ -233,14 +278,18 @@ const EventsNativeComponentViewConfig = { }, directEventTypes: { + ...ReactNativeViewViewConfig.directEventTypes, + onEventDirect: { registrationName: 'onEventDirect' } }, validAttributes: { + ...ReactNativeViewViewConfig.validAttributes, disabled: true, - style: ReactNativeStyleAttributes + onChange: true, + onEventDirect: true } }; @@ -248,6 +297,8 @@ ReactNativeViewConfigRegistry.register( 'EventsNativeComponent', () => EventsNativeComponentViewConfig, ); + +module.exports = 'EventsNativeComponent'; ", } `; @@ -267,22 +318,29 @@ Map { 'use strict'; -const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes'); const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry'); +const ReactNativeViewViewConfig = require('ReactNativeViewViewConfig'); const FloatPropNativeComponentViewConfig = { uiViewClassName: 'FloatPropNativeComponent', Commands: {}, - Constants: {}, + + bubblingEventTypes: { + ...ReactNativeViewViewConfig.bubblingEventTypes + }, + + directEventTypes: { + ...ReactNativeViewViewConfig.directEventTypes + }, validAttributes: { + ...ReactNativeViewViewConfig.validAttributes, blurRadius: true, blurRadius2: true, blurRadius3: true, blurRadius4: true, blurRadius5: true, - blurRadius6: true, - style: ReactNativeStyleAttributes + blurRadius6: true } }; @@ -290,6 +348,8 @@ ReactNativeViewConfigRegistry.register( 'FloatPropNativeComponent', () => FloatPropNativeComponentViewConfig, ); + +module.exports = 'FloatPropNativeComponent'; ", } `; @@ -309,17 +369,24 @@ Map { 'use strict'; -const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes'); const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry'); +const ReactNativeViewViewConfig = require('ReactNativeViewViewConfig'); const ImagePropNativeComponentViewConfig = { uiViewClassName: 'ImagePropNativeComponent', Commands: {}, - Constants: {}, + + bubblingEventTypes: { + ...ReactNativeViewViewConfig.bubblingEventTypes + }, + + directEventTypes: { + ...ReactNativeViewViewConfig.directEventTypes + }, validAttributes: { - thumbImage: { process: require('resolveAssetSource') }, - style: ReactNativeStyleAttributes + ...ReactNativeViewViewConfig.validAttributes, + thumbImage: { process: require('resolveAssetSource') } } }; @@ -327,6 +394,8 @@ ReactNativeViewConfigRegistry.register( 'ImagePropNativeComponent', () => ImagePropNativeComponentViewConfig, ); + +module.exports = 'ImagePropNativeComponent'; ", } `; @@ -346,19 +415,26 @@ Map { 'use strict'; -const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes'); const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry'); +const ReactNativeViewViewConfig = require('ReactNativeViewViewConfig'); const IntegerPropNativeComponentViewConfig = { uiViewClassName: 'IntegerPropNativeComponent', Commands: {}, - Constants: {}, + + bubblingEventTypes: { + ...ReactNativeViewViewConfig.bubblingEventTypes + }, + + directEventTypes: { + ...ReactNativeViewViewConfig.directEventTypes + }, validAttributes: { + ...ReactNativeViewViewConfig.validAttributes, progress1: true, progress2: true, - progress3: true, - style: ReactNativeStyleAttributes + progress3: true } }; @@ -366,6 +442,8 @@ ReactNativeViewConfigRegistry.register( 'IntegerPropNativeComponent', () => IntegerPropNativeComponentViewConfig, ); + +module.exports = 'IntegerPropNativeComponent'; ", } `; @@ -385,16 +463,17 @@ Map { 'use strict'; -const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes'); const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry'); +const ReactNativeViewViewConfig = require('ReactNativeViewViewConfig'); const InterfaceOnlyComponentViewConfig = { uiViewClassName: 'InterfaceOnlyComponent', Commands: {}, - Constants: {}, bubblingEventTypes: { - onChange: { + ...ReactNativeViewViewConfig.bubblingEventTypes, + + topChange: { phasedRegistrationNames: { captured: 'onChangeCapture', bubbled: 'onChange' @@ -402,9 +481,14 @@ const InterfaceOnlyComponentViewConfig = { } }, + directEventTypes: { + ...ReactNativeViewViewConfig.directEventTypes + }, + validAttributes: { + ...ReactNativeViewViewConfig.validAttributes, accessibilityHint: true, - style: ReactNativeStyleAttributes + onChange: true } }; @@ -412,6 +496,8 @@ ReactNativeViewConfigRegistry.register( 'InterfaceOnlyComponent', () => InterfaceOnlyComponentViewConfig, ); + +module.exports = 'InterfaceOnlyComponent'; ", } `; @@ -431,20 +517,27 @@ Map { 'use strict'; -const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes'); const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry'); +const ReactNativeViewViewConfig = require('ReactNativeViewViewConfig'); const ImageColorPropNativeComponentViewConfig = { uiViewClassName: 'ImageColorPropNativeComponent', Commands: {}, - Constants: {}, + + bubblingEventTypes: { + ...ReactNativeViewViewConfig.bubblingEventTypes + }, + + directEventTypes: { + ...ReactNativeViewViewConfig.directEventTypes + }, validAttributes: { + ...ReactNativeViewViewConfig.validAttributes, thumbImage: { process: require('resolveAssetSource') }, color: { process: require('processColor') }, thumbTintColor: { process: require('processColor') }, - point: { diff: require('pointsDiffer') }, - style: ReactNativeStyleAttributes + point: { diff: require('pointsDiffer') } } }; @@ -452,6 +545,8 @@ ReactNativeViewConfigRegistry.register( 'ImageColorPropNativeComponent', () => ImageColorPropNativeComponentViewConfig, ); + +module.exports = 'ImageColorPropNativeComponent'; ", } `; @@ -471,17 +566,24 @@ Map { 'use strict'; -const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes'); const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry'); +const ReactNativeViewViewConfig = require('ReactNativeViewViewConfig'); const PointPropNativeComponentViewConfig = { uiViewClassName: 'PointPropNativeComponent', Commands: {}, - Constants: {}, + + bubblingEventTypes: { + ...ReactNativeViewViewConfig.bubblingEventTypes + }, + + directEventTypes: { + ...ReactNativeViewViewConfig.directEventTypes + }, validAttributes: { - startPoint: { diff: require('pointsDiffer') }, - style: ReactNativeStyleAttributes + ...ReactNativeViewViewConfig.validAttributes, + startPoint: { diff: require('pointsDiffer') } } }; @@ -489,6 +591,8 @@ ReactNativeViewConfigRegistry.register( 'PointPropNativeComponent', () => PointPropNativeComponentViewConfig, ); + +module.exports = 'PointPropNativeComponent'; ", } `; @@ -508,17 +612,24 @@ Map { 'use strict'; -const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes'); const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry'); +const ReactNativeViewViewConfig = require('ReactNativeViewViewConfig'); const StringPropComponentViewConfig = { uiViewClassName: 'StringPropComponent', Commands: {}, - Constants: {}, + + bubblingEventTypes: { + ...ReactNativeViewViewConfig.bubblingEventTypes + }, + + directEventTypes: { + ...ReactNativeViewViewConfig.directEventTypes + }, validAttributes: { - accessibilityHint: true, - style: ReactNativeStyleAttributes + ...ReactNativeViewViewConfig.validAttributes, + accessibilityHint: true } }; @@ -526,6 +637,8 @@ ReactNativeViewConfigRegistry.register( 'StringPropComponent', () => StringPropComponentViewConfig, ); + +module.exports = 'StringPropComponent'; ", } `; @@ -545,17 +658,24 @@ Map { 'use strict'; -const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes'); const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry'); +const ReactNativeViewViewConfig = require('ReactNativeViewViewConfig'); const MultiFile1NativeComponentViewConfig = { uiViewClassName: 'MultiFile1NativeComponent', Commands: {}, - Constants: {}, + + bubblingEventTypes: { + ...ReactNativeViewViewConfig.bubblingEventTypes + }, + + directEventTypes: { + ...ReactNativeViewViewConfig.directEventTypes + }, validAttributes: { - disabled: true, - style: ReactNativeStyleAttributes + ...ReactNativeViewViewConfig.validAttributes, + disabled: true } }; @@ -564,14 +684,23 @@ ReactNativeViewConfigRegistry.register( () => MultiFile1NativeComponentViewConfig, ); +module.exports = 'MultiFile1NativeComponent'; + const MultiFile2NativeComponentViewConfig = { uiViewClassName: 'MultiFile2NativeComponent', Commands: {}, - Constants: {}, + + bubblingEventTypes: { + ...ReactNativeViewViewConfig.bubblingEventTypes + }, + + directEventTypes: { + ...ReactNativeViewViewConfig.directEventTypes + }, validAttributes: { - disabled: true, - style: ReactNativeStyleAttributes + ...ReactNativeViewViewConfig.validAttributes, + disabled: true } }; @@ -579,6 +708,8 @@ ReactNativeViewConfigRegistry.register( 'MultiFile2NativeComponent', () => MultiFile2NativeComponentViewConfig, ); + +module.exports = 'MultiFile2NativeComponent'; ", } `; @@ -598,17 +729,24 @@ Map { 'use strict'; -const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes'); const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry'); +const ReactNativeViewViewConfig = require('ReactNativeViewViewConfig'); const MultiComponent1NativeComponentViewConfig = { uiViewClassName: 'MultiComponent1NativeComponent', Commands: {}, - Constants: {}, + + bubblingEventTypes: { + ...ReactNativeViewViewConfig.bubblingEventTypes + }, + + directEventTypes: { + ...ReactNativeViewViewConfig.directEventTypes + }, validAttributes: { - disabled: true, - style: ReactNativeStyleAttributes + ...ReactNativeViewViewConfig.validAttributes, + disabled: true } }; @@ -617,14 +755,23 @@ ReactNativeViewConfigRegistry.register( () => MultiComponent1NativeComponentViewConfig, ); +module.exports = 'MultiComponent1NativeComponent'; + const MultiComponent2NativeComponentViewConfig = { uiViewClassName: 'MultiComponent2NativeComponent', Commands: {}, - Constants: {}, + + bubblingEventTypes: { + ...ReactNativeViewViewConfig.bubblingEventTypes + }, + + directEventTypes: { + ...ReactNativeViewViewConfig.directEventTypes + }, validAttributes: { - disabled: true, - style: ReactNativeStyleAttributes + ...ReactNativeViewViewConfig.validAttributes, + disabled: true } }; @@ -632,6 +779,8 @@ ReactNativeViewConfigRegistry.register( 'MultiComponent2NativeComponent', () => MultiComponent2NativeComponentViewConfig, ); + +module.exports = 'MultiComponent2NativeComponent'; ", } `;