diff --git a/Libraries/Components/ActivityIndicator/ActivityIndicator.js b/Libraries/Components/ActivityIndicator/ActivityIndicator.js index 1c4a54c98f..f6ffe500ed 100644 --- a/Libraries/Components/ActivityIndicator/ActivityIndicator.js +++ b/Libraries/Components/ActivityIndicator/ActivityIndicator.js @@ -15,15 +15,12 @@ const React = require('react'); const StyleSheet = require('../../StyleSheet/StyleSheet'); const View = require('../View/View'); -const RCTActivityIndicatorViewNativeComponent = require('./RCTActivityIndicatorViewNativeComponent'); +const ActivityIndicatorViewNativeComponent = require('./ActivityIndicatorViewNativeComponent'); import type {NativeComponent} from '../../Renderer/shims/ReactNative'; import type {ViewProps} from '../View/ViewPropTypes'; -const RCTActivityIndicator = - Platform.OS === 'android' - ? require('../ProgressBarAndroid/ProgressBarAndroid') - : RCTActivityIndicatorViewNativeComponent; +const ProgressBarAndroid = require('../ProgressBarAndroid/ProgressBarAndroid'); const GRAY = '#999999'; @@ -93,8 +90,6 @@ const ActivityIndicator = (props: Props, forwardedRef?: any) => { ref: forwardedRef, style: sizeStyle, size: sizeProp, - styleAttr: 'Normal', - indeterminate: true, }; return ( @@ -106,7 +101,11 @@ const ActivityIndicator = (props: Props, forwardedRef?: any) => { )}> {/* $FlowFixMe(>=0.78.0 site=react_native_android_fb) This issue was * found when making Flow check .android.js files. */} - + {Platform.OS === 'android' ? ( + + ) : ( + + )} ); }; diff --git a/Libraries/Components/ActivityIndicator/RCTActivityIndicatorViewNativeComponent.js b/Libraries/Components/ActivityIndicator/ActivityIndicatorViewNativeComponent.js similarity index 63% rename from Libraries/Components/ActivityIndicator/RCTActivityIndicatorViewNativeComponent.js rename to Libraries/Components/ActivityIndicator/ActivityIndicatorViewNativeComponent.js index e1d2be9293..731b6f3fb2 100644 --- a/Libraries/Components/ActivityIndicator/RCTActivityIndicatorViewNativeComponent.js +++ b/Libraries/Components/ActivityIndicator/ActivityIndicatorViewNativeComponent.js @@ -10,11 +10,13 @@ 'use strict'; -const requireNativeComponent = require('../../ReactNative/requireNativeComponent'); +import type { + WithDefault, + CodegenNativeComponent, +} from '../../Types/CodegenTypes'; +import type {ColorValue} from '../../StyleSheet/StyleSheetTypes'; import type {ViewProps} from '../View/ViewPropTypes'; -import type {ViewStyleProp} from '../../StyleSheet/StyleSheet'; -import type {NativeComponent} from '../../Renderer/shims/ReactNative'; type NativeProps = $ReadOnly<{| ...ViewProps, @@ -24,21 +26,21 @@ type NativeProps = $ReadOnly<{| * * See http://facebook.github.io/react-native/docs/activityindicator.html#hideswhenstopped */ - hidesWhenStopped?: ?boolean, + hidesWhenStopped?: ?WithDefault, /** * Whether to show the indicator (true, the default) or hide it (false). * * See http://facebook.github.io/react-native/docs/activityindicator.html#animating */ - animating?: ?boolean, + animating?: ?WithDefault, /** * The foreground color of the spinner (default is gray). * * See http://facebook.github.io/react-native/docs/activityindicator.html#color */ - color?: ?string, + color?: ?ColorValue, /** * Size of the indicator (default is 'small'). @@ -46,15 +48,17 @@ type NativeProps = $ReadOnly<{| * * See http://facebook.github.io/react-native/docs/activityindicator.html#size */ - size?: ?('small' | 'large'), - - style?: ?ViewStyleProp, - styleAttr?: ?string, - indeterminate?: ?boolean, + size?: ?WithDefault<'small' | 'large', 'small'>, |}>; -type ActivityIndicatorNativeType = Class>; +type Options = { + isDeprecatedPaperComponentNameRCT: true, +}; -module.exports = ((requireNativeComponent( - 'RCTActivityIndicatorView', -): any): ActivityIndicatorNativeType); +type ActivityIndicatorNativeType = CodegenNativeComponent< + 'ActivityIndicatorView', + NativeProps, + Options, +>; + +module.exports = ((require('./ActivityIndicatorViewNativeViewConfig'): any): ActivityIndicatorNativeType); diff --git a/Libraries/Components/ActivityIndicator/ActivityIndicatorViewNativeViewConfig.js b/Libraries/Components/ActivityIndicator/ActivityIndicatorViewNativeViewConfig.js new file mode 100644 index 0000000000..0e448d1d21 --- /dev/null +++ b/Libraries/Components/ActivityIndicator/ActivityIndicatorViewNativeViewConfig.js @@ -0,0 +1,45 @@ + +/** + * 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 ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry'); +const ReactNativeViewViewConfig = require('ReactNativeViewViewConfig'); +const verifyComponentAttributeEquivalence = require('verifyComponentAttributeEquivalence'); + +const ActivityIndicatorViewViewConfig = { + uiViewClassName: 'RCTActivityIndicatorView', + Commands: {}, + + bubblingEventTypes: { + ...ReactNativeViewViewConfig.bubblingEventTypes, + }, + + directEventTypes: { + ...ReactNativeViewViewConfig.directEventTypes, + }, + + validAttributes: { + ...ReactNativeViewViewConfig.validAttributes, + hidesWhenStopped: true, + animating: true, + color: { process: require('processColor') }, + size: true, + }, +}; + +verifyComponentAttributeEquivalence('RCTActivityIndicatorView', ActivityIndicatorViewViewConfig); + +ReactNativeViewConfigRegistry.register( + 'RCTActivityIndicatorView', + () => ActivityIndicatorViewViewConfig, +); + +module.exports = 'RCTActivityIndicatorView'; // RCT prefix present for paper support diff --git a/Libraries/Components/ActivityIndicator/ActivityIndicatorSchema.js b/Libraries/Components/ActivityIndicator/ActivityIndicatorViewSchema.js similarity index 80% rename from Libraries/Components/ActivityIndicator/ActivityIndicatorSchema.js rename to Libraries/Components/ActivityIndicator/ActivityIndicatorViewSchema.js index 7da1cbc1c2..d45f759072 100644 --- a/Libraries/Components/ActivityIndicator/ActivityIndicatorSchema.js +++ b/Libraries/Components/ActivityIndicator/ActivityIndicatorViewSchema.js @@ -17,6 +17,7 @@ const SwitchSchema: SchemaType = { ActivityIndicatorSchema: { components: { ActivityIndicatorView: { + isDeprecatedPaperComponentNameRCT: true, extendsProps: [ { type: 'ReactNativeBuiltInType', @@ -41,14 +42,6 @@ const SwitchSchema: SchemaType = { default: false, }, }, - { - name: 'styleAttr', - optional: true, - typeAnnotation: { - type: 'StringTypeAnnotation', - default: '', - }, - }, { name: 'color', optional: true, @@ -73,14 +66,6 @@ const SwitchSchema: SchemaType = { ], }, }, - { - name: 'intermediate', - optional: true, - typeAnnotation: { - type: 'BooleanTypeAnnotation', - default: false, - }, - }, ], }, }, diff --git a/Libraries/Components/ActivityIndicator/__tests__/__snapshots__/ActivityIndicator-test.js.snap b/Libraries/Components/ActivityIndicator/__tests__/__snapshots__/ActivityIndicator-test.js.snap index 51f69150ab..fcd667d567 100644 --- a/Libraries/Components/ActivityIndicator/__tests__/__snapshots__/ActivityIndicator-test.js.snap +++ b/Libraries/Components/ActivityIndicator/__tests__/__snapshots__/ActivityIndicator-test.js.snap @@ -22,7 +22,6 @@ exports[` should render as when not mocked 1`] = ` animating={true} color="#0000ff" hidesWhenStopped={true} - indeterminate={true} size="large" style={ Object { @@ -30,7 +29,6 @@ exports[` should render as when not mocked 1`] = ` "width": 36, } } - styleAttr="Normal" /> `; diff --git a/Libraries/Utilities/__tests__/verifyComponentAttributeEquivalence-test.js b/Libraries/Utilities/__tests__/verifyComponentAttributeEquivalence-test.js index 57e0d00e8a..13a1b3637d 100644 --- a/Libraries/Utilities/__tests__/verifyComponentAttributeEquivalence-test.js +++ b/Libraries/Utilities/__tests__/verifyComponentAttributeEquivalence-test.js @@ -13,6 +13,7 @@ const getNativeComponentAttributes = require('../../ReactNative/getNativeComponentAttributes'); const verifyComponentAttributeEquivalence = require('../verifyComponentAttributeEquivalence'); +jest.dontMock('../verifyComponentAttributeEquivalence'); jest.mock('../../ReactNative/getNativeComponentAttributes', () => () => ({ NativeProps: { value: 'BOOL', diff --git a/jest/setup.js b/jest/setup.js index eb2358c3c8..3a2eb77bd2 100644 --- a/jest/setup.js +++ b/jest/setup.js @@ -363,3 +363,8 @@ jest.doMock('../Libraries/ReactNative/requireNativeComponent', () => { } }; }); + +jest.doMock( + '../Libraries/Utilities/verifyComponentAttributeEquivalence', + () => function() {}, +); diff --git a/packages/react-native-codegen/src/cli/viewconfigs/generate-view-configs-cli.js b/packages/react-native-codegen/src/cli/viewconfigs/generate-view-configs-cli.js index eccf262a8d..421b569e95 100644 --- a/packages/react-native-codegen/src/cli/viewconfigs/generate-view-configs-cli.js +++ b/packages/react-native-codegen/src/cli/viewconfigs/generate-view-configs-cli.js @@ -23,7 +23,10 @@ const yargv = yargs.strict().option('t', { const argv = yargv.argv; const fileList = argv._[0].split('\n'); -const CURRENT_VIEW_CONFIG_FILES = ['SliderNativeComponent.js']; +const CURRENT_VIEW_CONFIG_FILES = [ + 'SliderNativeComponent.js', + 'ActivityIndicatorViewNativeComponent.js', +]; generate( fileList.filter(fileName =>