Remove view configs from JS
Summary: Apparently different apps have different implementations of view managers that support different props. This is a problem that we will need to address. Unfortunately, this means we can't have a static config defined in JS. We will need to find another approach to this problem. Reviewed By: sahrens Differential Revision: D9500178 fbshipit-source-id: b591559164fcf29f5fd43e13a0f2da15011491c6
This commit is contained in:
Eli White
Facebook Github Bot
parent
035597566f
commit
d2c27f5bff
|
|
@ -10,29 +10,14 @@
|
||||||
|
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
const AndroidConfig = require('ViewNativeComponentAndroidConfig');
|
|
||||||
const Platform = require('Platform');
|
|
||||||
const ReactNative = require('ReactNative');
|
const ReactNative = require('ReactNative');
|
||||||
|
|
||||||
const verifyComponentAttributeEquivalence = require('verifyComponentAttributeEquivalence');
|
|
||||||
const requireNativeComponent = require('requireNativeComponent');
|
const requireNativeComponent = require('requireNativeComponent');
|
||||||
const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry');
|
|
||||||
|
|
||||||
import type {ViewProps} from 'ViewPropTypes';
|
import type {ViewProps} from 'ViewPropTypes';
|
||||||
|
|
||||||
type ViewNativeComponentType = Class<ReactNative.NativeComponent<ViewProps>>;
|
type ViewNativeComponentType = Class<ReactNative.NativeComponent<ViewProps>>;
|
||||||
|
|
||||||
let NativeViewComponent;
|
const NativeViewComponent = requireNativeComponent('RCTView');
|
||||||
if (Platform.OS === 'android') {
|
|
||||||
if (__DEV__) {
|
|
||||||
verifyComponentAttributeEquivalence('RCTView', AndroidConfig);
|
|
||||||
}
|
|
||||||
|
|
||||||
NativeViewComponent = ReactNativeViewConfigRegistry.register('RCTView', () =>
|
|
||||||
require('ViewNativeComponentAndroidConfig'),
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
NativeViewComponent = requireNativeComponent('RCTView');
|
|
||||||
}
|
|
||||||
|
|
||||||
module.exports = ((NativeViewComponent: any): ViewNativeComponentType);
|
module.exports = ((NativeViewComponent: any): ViewNativeComponentType);
|
||||||
|
|
|
||||||
|
|
@ -1,287 +0,0 @@
|
||||||
/**
|
|
||||||
* Copyright (c) 2015-present, Facebook, Inc.
|
|
||||||
*
|
|
||||||
* 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';
|
|
||||||
|
|
||||||
const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes');
|
|
||||||
|
|
||||||
const processColor = require('processColor');
|
|
||||||
|
|
||||||
import type {ViewProps} from 'ViewPropTypes';
|
|
||||||
import type {____ViewStyle_Internal} from 'StyleSheetTypes';
|
|
||||||
import type {ReactNativeBaseComponentViewConfig} from 'ReactNativeTypes';
|
|
||||||
|
|
||||||
const colorHandler = {diff: null, process: processColor};
|
|
||||||
|
|
||||||
type Config = ReactNativeBaseComponentViewConfig<
|
|
||||||
$Keys<ViewProps> | $Keys<____ViewStyle_Internal>,
|
|
||||||
$Keys<____ViewStyle_Internal>,
|
|
||||||
>;
|
|
||||||
|
|
||||||
const ViewNativeComponentAndroidConfig: Config = {
|
|
||||||
bubblingEventTypes: {
|
|
||||||
topChange: {
|
|
||||||
phasedRegistrationNames: {
|
|
||||||
captured: 'onChangeCapture',
|
|
||||||
bubbled: 'onChange',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
topTouchCancel: {
|
|
||||||
phasedRegistrationNames: {
|
|
||||||
captured: 'onTouchCancelCapture',
|
|
||||||
bubbled: 'onTouchCancel',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
topTouchMove: {
|
|
||||||
phasedRegistrationNames: {
|
|
||||||
captured: 'onTouchMoveCapture',
|
|
||||||
bubbled: 'onTouchMove',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
topTouchStart: {
|
|
||||||
phasedRegistrationNames: {
|
|
||||||
captured: 'onTouchStartCapture',
|
|
||||||
bubbled: 'onTouchStart',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
topTouchEnd: {
|
|
||||||
phasedRegistrationNames: {
|
|
||||||
captured: 'onTouchEndCapture',
|
|
||||||
bubbled: 'onTouchEnd',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
topSelect: {
|
|
||||||
phasedRegistrationNames: {
|
|
||||||
captured: 'onSelectCapture',
|
|
||||||
bubbled: 'onSelect',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
Commands: {setPressed: 2, hotspotUpdate: 1},
|
|
||||||
directEventTypes: {
|
|
||||||
topLoadingError: {registrationName: 'onLoadingError'},
|
|
||||||
topLayout: {registrationName: 'onLayout'},
|
|
||||||
topScrollBeginDrag: {registrationName: 'onScrollBeginDrag'},
|
|
||||||
topContentSizeChange: {registrationName: 'onContentSizeChange'},
|
|
||||||
topMomentumScrollBegin: {registrationName: 'onMomentumScrollBegin'},
|
|
||||||
topScrollEndDrag: {registrationName: 'onScrollEndDrag'},
|
|
||||||
topMomentumScrollEnd: {registrationName: 'onMomentumScrollEnd'},
|
|
||||||
topLoadingStart: {registrationName: 'onLoadingStart'},
|
|
||||||
topSelectionChange: {registrationName: 'onSelectionChange'},
|
|
||||||
topLoadingFinish: {registrationName: 'onLoadingFinish'},
|
|
||||||
topMessage: {registrationName: 'onMessage'},
|
|
||||||
topScroll: {registrationName: 'onScroll'},
|
|
||||||
},
|
|
||||||
NativeProps: {
|
|
||||||
accessibilityComponentType: 'String',
|
|
||||||
accessibilityHint: 'String',
|
|
||||||
accessibilityLabel: 'String',
|
|
||||||
accessibilityLiveRegion: 'String',
|
|
||||||
accessibilityRole: 'String',
|
|
||||||
accessibilityStates: 'Array',
|
|
||||||
accessible: 'boolean',
|
|
||||||
alignContent: 'String',
|
|
||||||
alignItems: 'String',
|
|
||||||
alignSelf: 'String',
|
|
||||||
aspectRatio: 'number',
|
|
||||||
backgroundColor: 'Color',
|
|
||||||
borderBottomColor: 'Color',
|
|
||||||
borderBottomEndRadius: 'number',
|
|
||||||
borderBottomLeftRadius: 'number',
|
|
||||||
borderBottomRightRadius: 'number',
|
|
||||||
borderBottomStartRadius: 'number',
|
|
||||||
borderBottomWidth: 'number',
|
|
||||||
borderColor: 'Color',
|
|
||||||
borderEndColor: 'Color',
|
|
||||||
borderEndWidth: 'number',
|
|
||||||
borderLeftColor: 'Color',
|
|
||||||
borderLeftWidth: 'number',
|
|
||||||
borderRadius: 'number',
|
|
||||||
borderRightColor: 'Color',
|
|
||||||
borderRightWidth: 'number',
|
|
||||||
borderStartColor: 'Color',
|
|
||||||
borderStartWidth: 'number',
|
|
||||||
borderStyle: 'String',
|
|
||||||
borderTopColor: 'Color',
|
|
||||||
borderTopEndRadius: 'number',
|
|
||||||
borderTopLeftRadius: 'number',
|
|
||||||
borderTopRightRadius: 'number',
|
|
||||||
borderTopStartRadius: 'number',
|
|
||||||
borderTopWidth: 'number',
|
|
||||||
borderWidth: 'number',
|
|
||||||
bottom: 'Dynamic',
|
|
||||||
collapsable: 'boolean',
|
|
||||||
display: 'String',
|
|
||||||
elevation: 'number',
|
|
||||||
end: 'Dynamic',
|
|
||||||
flex: 'number',
|
|
||||||
flexBasis: 'Dynamic',
|
|
||||||
flexDirection: 'String',
|
|
||||||
flexGrow: 'number',
|
|
||||||
flexShrink: 'number',
|
|
||||||
flexWrap: 'String',
|
|
||||||
hasTVPreferredFocus: 'boolean',
|
|
||||||
height: 'Dynamic',
|
|
||||||
hitSlop: 'Map',
|
|
||||||
importantForAccessibility: 'String',
|
|
||||||
justifyContent: 'String',
|
|
||||||
left: 'Dynamic',
|
|
||||||
margin: 'Dynamic',
|
|
||||||
marginBottom: 'Dynamic',
|
|
||||||
marginEnd: 'Dynamic',
|
|
||||||
marginHorizontal: 'Dynamic',
|
|
||||||
marginLeft: 'Dynamic',
|
|
||||||
marginRight: 'Dynamic',
|
|
||||||
marginStart: 'Dynamic',
|
|
||||||
marginTop: 'Dynamic',
|
|
||||||
marginVertical: 'Dynamic',
|
|
||||||
maxHeight: 'Dynamic',
|
|
||||||
maxWidth: 'Dynamic',
|
|
||||||
minHeight: 'Dynamic',
|
|
||||||
minWidth: 'Dynamic',
|
|
||||||
nativeBackgroundAndroid: 'Map',
|
|
||||||
nativeForegroundAndroid: 'Map',
|
|
||||||
nativeID: 'String',
|
|
||||||
needsOffscreenAlphaCompositing: 'boolean',
|
|
||||||
onLayout: 'boolean',
|
|
||||||
opacity: 'number',
|
|
||||||
overflow: 'String',
|
|
||||||
padding: 'Dynamic',
|
|
||||||
paddingBottom: 'Dynamic',
|
|
||||||
paddingEnd: 'Dynamic',
|
|
||||||
paddingHorizontal: 'Dynamic',
|
|
||||||
paddingLeft: 'Dynamic',
|
|
||||||
paddingRight: 'Dynamic',
|
|
||||||
paddingStart: 'Dynamic',
|
|
||||||
paddingTop: 'Dynamic',
|
|
||||||
paddingVertical: 'Dynamic',
|
|
||||||
pointerEvents: 'String',
|
|
||||||
position: 'String',
|
|
||||||
removeClippedSubviews: 'boolean',
|
|
||||||
renderToHardwareTextureAndroid: 'boolean',
|
|
||||||
right: 'Dynamic',
|
|
||||||
rotation: 'number',
|
|
||||||
scaleX: 'number',
|
|
||||||
scaleY: 'number',
|
|
||||||
start: 'Dynamic',
|
|
||||||
testID: 'String',
|
|
||||||
top: 'Dynamic',
|
|
||||||
transform: 'Array',
|
|
||||||
translateX: 'number',
|
|
||||||
translateY: 'number',
|
|
||||||
width: 'Dynamic',
|
|
||||||
zIndex: 'number',
|
|
||||||
},
|
|
||||||
|
|
||||||
uiViewClassName: 'RCTView',
|
|
||||||
validAttributes: {
|
|
||||||
accessibilityComponentType: true,
|
|
||||||
accessibilityHint: true,
|
|
||||||
accessibilityLabel: true,
|
|
||||||
accessibilityLiveRegion: true,
|
|
||||||
accessibilityRole: true,
|
|
||||||
accessibilityStates: true,
|
|
||||||
accessible: true,
|
|
||||||
alignContent: true,
|
|
||||||
alignItems: true,
|
|
||||||
alignSelf: true,
|
|
||||||
aspectRatio: true,
|
|
||||||
backgroundColor: colorHandler,
|
|
||||||
borderBottomColor: colorHandler,
|
|
||||||
borderBottomEndRadius: true,
|
|
||||||
borderBottomLeftRadius: true,
|
|
||||||
borderBottomRightRadius: true,
|
|
||||||
borderBottomStartRadius: true,
|
|
||||||
borderBottomWidth: true,
|
|
||||||
borderColor: colorHandler,
|
|
||||||
borderEndColor: colorHandler,
|
|
||||||
borderEndWidth: true,
|
|
||||||
borderLeftColor: colorHandler,
|
|
||||||
borderLeftWidth: true,
|
|
||||||
borderRadius: true,
|
|
||||||
borderRightColor: colorHandler,
|
|
||||||
borderRightWidth: true,
|
|
||||||
borderStartColor: colorHandler,
|
|
||||||
borderStartWidth: true,
|
|
||||||
borderStyle: true,
|
|
||||||
borderTopColor: colorHandler,
|
|
||||||
borderTopEndRadius: true,
|
|
||||||
borderTopLeftRadius: true,
|
|
||||||
borderTopRightRadius: true,
|
|
||||||
borderTopStartRadius: true,
|
|
||||||
borderTopWidth: true,
|
|
||||||
borderWidth: true,
|
|
||||||
bottom: true,
|
|
||||||
collapsable: true,
|
|
||||||
display: true,
|
|
||||||
elevation: true,
|
|
||||||
end: true,
|
|
||||||
flex: true,
|
|
||||||
flexBasis: true,
|
|
||||||
flexDirection: true,
|
|
||||||
flexGrow: true,
|
|
||||||
flexShrink: true,
|
|
||||||
flexWrap: true,
|
|
||||||
hasTVPreferredFocus: true,
|
|
||||||
height: true,
|
|
||||||
hitSlop: true,
|
|
||||||
importantForAccessibility: true,
|
|
||||||
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,
|
|
||||||
nativeBackgroundAndroid: true,
|
|
||||||
nativeForegroundAndroid: true,
|
|
||||||
nativeID: true,
|
|
||||||
needsOffscreenAlphaCompositing: true,
|
|
||||||
onLayout: 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,
|
|
||||||
renderToHardwareTextureAndroid: true,
|
|
||||||
right: true,
|
|
||||||
rotation: true,
|
|
||||||
scaleX: true,
|
|
||||||
scaleY: true,
|
|
||||||
start: true,
|
|
||||||
testID: true,
|
|
||||||
top: true,
|
|
||||||
transform: true,
|
|
||||||
translateX: true,
|
|
||||||
translateY: true,
|
|
||||||
width: true,
|
|
||||||
zIndex: true,
|
|
||||||
style: ReactNativeStyleAttributes,
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
module.exports = ViewNativeComponentAndroidConfig;
|
|
||||||
|
|
@ -10,25 +10,8 @@
|
||||||
|
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
const AndroidConfig = require('ImageViewNativeComponentAndroidConfig');
|
|
||||||
const Platform = require('Platform');
|
|
||||||
|
|
||||||
const verifyComponentAttributeEquivalence = require('verifyComponentAttributeEquivalence');
|
|
||||||
const requireNativeComponent = require('requireNativeComponent');
|
const requireNativeComponent = require('requireNativeComponent');
|
||||||
const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry');
|
|
||||||
|
|
||||||
let ImageViewNativeComponent;
|
const ImageViewNativeComponent = requireNativeComponent('RCTImageView');
|
||||||
if (Platform.OS === 'android') {
|
|
||||||
if (__DEV__) {
|
|
||||||
verifyComponentAttributeEquivalence('RCTImageView', AndroidConfig);
|
|
||||||
}
|
|
||||||
|
|
||||||
ImageViewNativeComponent = ReactNativeViewConfigRegistry.register(
|
|
||||||
'RCTImageView',
|
|
||||||
() => AndroidConfig,
|
|
||||||
);
|
|
||||||
} else {
|
|
||||||
ImageViewNativeComponent = requireNativeComponent('RCTImageView');
|
|
||||||
}
|
|
||||||
|
|
||||||
module.exports = ImageViewNativeComponent;
|
module.exports = ImageViewNativeComponent;
|
||||||
|
|
|
||||||
|
|
@ -1,212 +0,0 @@
|
||||||
/**
|
|
||||||
* Copyright (c) 2015-present, Facebook, Inc.
|
|
||||||
*
|
|
||||||
* This source code is licensed under the MIT license found in the
|
|
||||||
* LICENSE file in the root directory of this source tree.
|
|
||||||
*
|
|
||||||
* @format
|
|
||||||
* @flow
|
|
||||||
*/
|
|
||||||
|
|
||||||
const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes');
|
|
||||||
|
|
||||||
const processColor = require('processColor');
|
|
||||||
|
|
||||||
const colorHandler = {diff: null, process: processColor};
|
|
||||||
|
|
||||||
const viewConfig = {
|
|
||||||
directEventTypes: {
|
|
||||||
topError: {registrationName: 'onError'},
|
|
||||||
topLoad: {registrationName: 'onLoad'},
|
|
||||||
topLoadEnd: {registrationName: 'onLoadEnd'},
|
|
||||||
topLoadStart: {registrationName: 'onLoadStart'},
|
|
||||||
},
|
|
||||||
NativeProps: {
|
|
||||||
accessibilityComponentType: 'String',
|
|
||||||
accessibilityHint: 'String',
|
|
||||||
accessibilityLabel: 'String',
|
|
||||||
accessibilityLiveRegion: 'String',
|
|
||||||
accessibilityRole: 'String',
|
|
||||||
accessibilityStates: 'Array',
|
|
||||||
alignContent: 'String',
|
|
||||||
alignItems: 'String',
|
|
||||||
alignSelf: 'String',
|
|
||||||
aspectRatio: 'number',
|
|
||||||
backgroundColor: 'Color',
|
|
||||||
blurRadius: 'number',
|
|
||||||
borderBottomLeftRadius: 'number',
|
|
||||||
borderBottomRightRadius: 'number',
|
|
||||||
borderBottomWidth: 'number',
|
|
||||||
borderColor: 'Color',
|
|
||||||
borderEndWidth: 'number',
|
|
||||||
borderLeftWidth: 'number',
|
|
||||||
borderRadius: 'number',
|
|
||||||
borderRightWidth: 'number',
|
|
||||||
borderStartWidth: 'number',
|
|
||||||
borderTopLeftRadius: 'number',
|
|
||||||
borderTopRightRadius: 'number',
|
|
||||||
borderTopWidth: 'number',
|
|
||||||
borderWidth: 'number',
|
|
||||||
bottom: 'Dynamic',
|
|
||||||
defaultSrc: 'String',
|
|
||||||
display: 'String',
|
|
||||||
elevation: 'number',
|
|
||||||
end: 'Dynamic',
|
|
||||||
fadeDuration: 'number',
|
|
||||||
flex: 'number',
|
|
||||||
flexBasis: 'Dynamic',
|
|
||||||
flexDirection: 'String',
|
|
||||||
flexGrow: 'number',
|
|
||||||
flexShrink: 'number',
|
|
||||||
flexWrap: 'String',
|
|
||||||
headers: 'Map',
|
|
||||||
height: 'Dynamic',
|
|
||||||
importantForAccessibility: 'String',
|
|
||||||
justifyContent: 'String',
|
|
||||||
left: 'Dynamic',
|
|
||||||
loadingIndicatorSrc: 'String',
|
|
||||||
margin: 'Dynamic',
|
|
||||||
marginBottom: 'Dynamic',
|
|
||||||
marginEnd: 'Dynamic',
|
|
||||||
marginHorizontal: 'Dynamic',
|
|
||||||
marginLeft: 'Dynamic',
|
|
||||||
marginRight: 'Dynamic',
|
|
||||||
marginStart: 'Dynamic',
|
|
||||||
marginTop: 'Dynamic',
|
|
||||||
marginVertical: 'Dynamic',
|
|
||||||
maxHeight: 'Dynamic',
|
|
||||||
maxWidth: 'Dynamic',
|
|
||||||
minHeight: 'Dynamic',
|
|
||||||
minWidth: 'Dynamic',
|
|
||||||
nativeID: 'String',
|
|
||||||
onLayout: 'boolean',
|
|
||||||
opacity: 'number',
|
|
||||||
overflow: 'String',
|
|
||||||
overlayColor: 'number',
|
|
||||||
padding: 'Dynamic',
|
|
||||||
paddingBottom: 'Dynamic',
|
|
||||||
paddingEnd: 'Dynamic',
|
|
||||||
paddingHorizontal: 'Dynamic',
|
|
||||||
paddingLeft: 'Dynamic',
|
|
||||||
paddingRight: 'Dynamic',
|
|
||||||
paddingStart: 'Dynamic',
|
|
||||||
paddingTop: 'Dynamic',
|
|
||||||
paddingVertical: 'Dynamic',
|
|
||||||
position: 'String',
|
|
||||||
progressiveRenderingEnabled: 'boolean',
|
|
||||||
renderToHardwareTextureAndroid: 'boolean',
|
|
||||||
resizeMethod: 'String',
|
|
||||||
resizeMode: 'String',
|
|
||||||
right: 'Dynamic',
|
|
||||||
rotation: 'number',
|
|
||||||
scaleX: 'number',
|
|
||||||
scaleY: 'number',
|
|
||||||
shouldNotifyLoadEvents: 'boolean',
|
|
||||||
src: 'Array',
|
|
||||||
start: 'Dynamic',
|
|
||||||
testID: 'String',
|
|
||||||
tintColor: 'Color',
|
|
||||||
top: 'Dynamic',
|
|
||||||
transform: 'Array',
|
|
||||||
translateX: 'number',
|
|
||||||
translateY: 'number',
|
|
||||||
width: 'Dynamic',
|
|
||||||
zIndex: 'number',
|
|
||||||
},
|
|
||||||
uiViewClassName: 'RCTImageView',
|
|
||||||
validAttributes: {
|
|
||||||
accessibilityComponentType: true,
|
|
||||||
accessibilityHint: true,
|
|
||||||
accessibilityLabel: true,
|
|
||||||
accessibilityLiveRegion: true,
|
|
||||||
accessibilityRole: true,
|
|
||||||
accessibilityStates: true,
|
|
||||||
alignContent: true,
|
|
||||||
alignItems: true,
|
|
||||||
alignSelf: true,
|
|
||||||
aspectRatio: true,
|
|
||||||
backgroundColor: colorHandler,
|
|
||||||
blurRadius: true,
|
|
||||||
borderBottomLeftRadius: true,
|
|
||||||
borderBottomRightRadius: true,
|
|
||||||
borderBottomWidth: true,
|
|
||||||
borderColor: colorHandler,
|
|
||||||
borderEndWidth: true,
|
|
||||||
borderLeftWidth: true,
|
|
||||||
borderRadius: true,
|
|
||||||
borderRightWidth: true,
|
|
||||||
borderStartWidth: true,
|
|
||||||
borderTopLeftRadius: true,
|
|
||||||
borderTopRightRadius: true,
|
|
||||||
borderTopWidth: true,
|
|
||||||
borderWidth: true,
|
|
||||||
bottom: true,
|
|
||||||
defaultSrc: true,
|
|
||||||
display: true,
|
|
||||||
elevation: true,
|
|
||||||
end: true,
|
|
||||||
fadeDuration: true,
|
|
||||||
flex: true,
|
|
||||||
flexBasis: true,
|
|
||||||
flexDirection: true,
|
|
||||||
flexGrow: true,
|
|
||||||
flexShrink: true,
|
|
||||||
flexWrap: true,
|
|
||||||
headers: true,
|
|
||||||
height: true,
|
|
||||||
importantForAccessibility: true,
|
|
||||||
justifyContent: true,
|
|
||||||
left: true,
|
|
||||||
loadingIndicatorSrc: 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,
|
|
||||||
onLayout: true,
|
|
||||||
opacity: true,
|
|
||||||
overflow: true,
|
|
||||||
overlayColor: true,
|
|
||||||
padding: true,
|
|
||||||
paddingBottom: true,
|
|
||||||
paddingEnd: true,
|
|
||||||
paddingHorizontal: true,
|
|
||||||
paddingLeft: true,
|
|
||||||
paddingRight: true,
|
|
||||||
paddingStart: true,
|
|
||||||
paddingTop: true,
|
|
||||||
paddingVertical: true,
|
|
||||||
position: true,
|
|
||||||
progressiveRenderingEnabled: true,
|
|
||||||
renderToHardwareTextureAndroid: true,
|
|
||||||
resizeMethod: true,
|
|
||||||
resizeMode: true,
|
|
||||||
right: true,
|
|
||||||
rotation: true,
|
|
||||||
scaleX: true,
|
|
||||||
scaleY: true,
|
|
||||||
shouldNotifyLoadEvents: true,
|
|
||||||
src: true,
|
|
||||||
start: true,
|
|
||||||
testID: true,
|
|
||||||
tintColor: colorHandler,
|
|
||||||
top: true,
|
|
||||||
transform: true,
|
|
||||||
translateX: true,
|
|
||||||
translateY: true,
|
|
||||||
width: true,
|
|
||||||
zIndex: true,
|
|
||||||
style: ReactNativeStyleAttributes,
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
module.exports = viewConfig;
|
|
||||||
|
|
@ -10,137 +10,8 @@
|
||||||
|
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes');
|
const requireNativeComponent = require('requireNativeComponent');
|
||||||
const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry');
|
|
||||||
|
|
||||||
const verifyComponentAttributeEquivalence = require('verifyComponentAttributeEquivalence');
|
const TextInlineImage = requireNativeComponent('RCTTextInlineImage');
|
||||||
|
|
||||||
const viewConfig = {
|
|
||||||
NativeProps: {
|
|
||||||
alignContent: 'String',
|
|
||||||
alignItems: 'String',
|
|
||||||
alignSelf: 'String',
|
|
||||||
aspectRatio: 'number',
|
|
||||||
borderBottomWidth: 'number',
|
|
||||||
borderEndWidth: 'number',
|
|
||||||
borderLeftWidth: 'number',
|
|
||||||
borderRightWidth: 'number',
|
|
||||||
borderStartWidth: 'number',
|
|
||||||
borderTopWidth: 'number',
|
|
||||||
borderWidth: 'number',
|
|
||||||
bottom: 'Dynamic',
|
|
||||||
display: 'String',
|
|
||||||
end: 'Dynamic',
|
|
||||||
flex: 'number',
|
|
||||||
flexBasis: 'Dynamic',
|
|
||||||
flexDirection: 'String',
|
|
||||||
flexGrow: 'number',
|
|
||||||
flexShrink: 'number',
|
|
||||||
flexWrap: 'String',
|
|
||||||
headers: 'Map',
|
|
||||||
height: 'Dynamic',
|
|
||||||
justifyContent: 'String',
|
|
||||||
left: 'Dynamic',
|
|
||||||
margin: 'Dynamic',
|
|
||||||
marginBottom: 'Dynamic',
|
|
||||||
marginEnd: 'Dynamic',
|
|
||||||
marginHorizontal: 'Dynamic',
|
|
||||||
marginLeft: 'Dynamic',
|
|
||||||
marginRight: 'Dynamic',
|
|
||||||
marginStart: 'Dynamic',
|
|
||||||
marginTop: 'Dynamic',
|
|
||||||
marginVertical: 'Dynamic',
|
|
||||||
maxHeight: 'Dynamic',
|
|
||||||
maxWidth: 'Dynamic',
|
|
||||||
minHeight: 'Dynamic',
|
|
||||||
minWidth: 'Dynamic',
|
|
||||||
onLayout: 'boolean',
|
|
||||||
overflow: 'String',
|
|
||||||
padding: 'Dynamic',
|
|
||||||
paddingBottom: 'Dynamic',
|
|
||||||
paddingEnd: 'Dynamic',
|
|
||||||
paddingHorizontal: 'Dynamic',
|
|
||||||
paddingLeft: 'Dynamic',
|
|
||||||
paddingRight: 'Dynamic',
|
|
||||||
paddingStart: 'Dynamic',
|
|
||||||
paddingTop: 'Dynamic',
|
|
||||||
paddingVertical: 'Dynamic',
|
|
||||||
position: 'String',
|
|
||||||
right: 'Dynamic',
|
|
||||||
src: 'Array',
|
|
||||||
start: 'Dynamic',
|
|
||||||
tintColor: 'number',
|
|
||||||
top: 'Dynamic',
|
|
||||||
width: 'Dynamic',
|
|
||||||
},
|
|
||||||
uiViewClassName: 'RCTTextInlineImage',
|
|
||||||
validAttributes: {
|
|
||||||
alignContent: true,
|
|
||||||
alignItems: true,
|
|
||||||
alignSelf: true,
|
|
||||||
aspectRatio: true,
|
|
||||||
borderBottomWidth: true,
|
|
||||||
borderEndWidth: true,
|
|
||||||
borderLeftWidth: true,
|
|
||||||
borderRightWidth: true,
|
|
||||||
borderStartWidth: true,
|
|
||||||
borderTopWidth: true,
|
|
||||||
borderWidth: true,
|
|
||||||
bottom: true,
|
|
||||||
display: true,
|
|
||||||
end: true,
|
|
||||||
flex: true,
|
|
||||||
flexBasis: true,
|
|
||||||
flexDirection: true,
|
|
||||||
flexGrow: true,
|
|
||||||
flexShrink: true,
|
|
||||||
flexWrap: true,
|
|
||||||
headers: true,
|
|
||||||
height: true,
|
|
||||||
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,
|
|
||||||
onLayout: true,
|
|
||||||
overflow: true,
|
|
||||||
padding: true,
|
|
||||||
paddingBottom: true,
|
|
||||||
paddingEnd: true,
|
|
||||||
paddingHorizontal: true,
|
|
||||||
paddingLeft: true,
|
|
||||||
paddingRight: true,
|
|
||||||
paddingStart: true,
|
|
||||||
paddingTop: true,
|
|
||||||
paddingVertical: true,
|
|
||||||
position: true,
|
|
||||||
right: true,
|
|
||||||
src: true,
|
|
||||||
start: true,
|
|
||||||
tintColor: true,
|
|
||||||
top: true,
|
|
||||||
width: true,
|
|
||||||
style: ReactNativeStyleAttributes,
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
if (__DEV__) {
|
|
||||||
verifyComponentAttributeEquivalence('RCTTextInlineImage', viewConfig);
|
|
||||||
}
|
|
||||||
|
|
||||||
const TextInlineImage = ReactNativeViewConfigRegistry.register(
|
|
||||||
'RCTTextInlineImage',
|
|
||||||
() => viewConfig,
|
|
||||||
);
|
|
||||||
|
|
||||||
module.exports = TextInlineImage;
|
module.exports = TextInlineImage;
|
||||||
|
|
|
||||||
|
|
@ -1,52 +0,0 @@
|
||||||
/**
|
|
||||||
* Copyright (c) 2015-present, Facebook, Inc.
|
|
||||||
*
|
|
||||||
* 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';
|
|
||||||
|
|
||||||
const deepDiffer = require('deepDiffer');
|
|
||||||
const getNativeComponentAttributes = require('getNativeComponentAttributes');
|
|
||||||
|
|
||||||
import type {ReactNativeBaseComponentViewConfig} from 'ReactNativeTypes';
|
|
||||||
|
|
||||||
/**
|
|
||||||
* The purpose of this function is to validate that the view config that
|
|
||||||
* native exposes for a given view manager is the same as the view config
|
|
||||||
* that is specified for that view manager in JS.
|
|
||||||
*
|
|
||||||
* In order to improve perf, we want to avoid calling into native to get
|
|
||||||
* the view config when each view manager is used. To do this, we are moving
|
|
||||||
* the configs to JS. In the future we will use these JS based view configs
|
|
||||||
* to codegen the view manager on native to ensure they stay in sync without
|
|
||||||
* this runtime check.
|
|
||||||
*
|
|
||||||
* If this function fails, that likely means a change was made to the native
|
|
||||||
* view manager without updating the JS config as well. Ideally you can make
|
|
||||||
* that direct change to the JS config. If you don't know what the differences
|
|
||||||
* are, the best approach I've found is to create a view that prints
|
|
||||||
* the return value of getNativeComponentAttributes, and then copying that
|
|
||||||
* text and pasting it back into JS:
|
|
||||||
* <Text selectable={true}>{JSON.stringify(getNativeComponentAttributes('RCTView'))}</Text>
|
|
||||||
*
|
|
||||||
* This is meant to be a stopgap until the time comes when we only have a
|
|
||||||
* single source of truth. I wonder if this message will still be here two
|
|
||||||
* years from now...
|
|
||||||
*/
|
|
||||||
function verifyComponentAttributeEquivalence(
|
|
||||||
componentName: string,
|
|
||||||
config: ReactNativeBaseComponentViewConfig<>,
|
|
||||||
) {
|
|
||||||
if (deepDiffer(getNativeComponentAttributes(componentName), config)) {
|
|
||||||
console.error(
|
|
||||||
`${componentName} config in JS does not match config specified by Native`,
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
module.exports = verifyComponentAttributeEquivalence;
|
|
||||||
|
|
@ -90,8 +90,7 @@ jest
|
||||||
|
|
||||||
return ReactNative;
|
return ReactNative;
|
||||||
})
|
})
|
||||||
.mock('ensureComponentIsNative', () => () => true)
|
.mock('ensureComponentIsNative', () => () => true);
|
||||||
.mock('verifyComponentAttributeEquivalence', () => () => {});
|
|
||||||
|
|
||||||
const mockEmptyObject = {};
|
const mockEmptyObject = {};
|
||||||
const mockNativeModules = {
|
const mockNativeModules = {
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue