status-im
/
react-native
mirror of https://github.com/status-im/react-native.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Picker: Remove PropTypes (#21281) 

Summary:
Part of: https://github.com/react-native-community/discussions-and-proposals/issues/29

This pull request removes all PropTypes from the various files for `Picker` and cleans up their flow types.
Pull Request resolved: https://github.com/facebook/react-native/pull/21281

Differential Revision: D10007224

Pulled By: TheSavior

fbshipit-source-id: 5b8b7918cc918dd77e7ab27c9e3921ffbeb4ff73
This commit is contained in:
empyrical 2018-09-23 22:33:25 -07:00 committed by Facebook Github Bot
parent afb7fc2aab
commit 421667ccae
2 changed files with 99 additions and 130 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

149
Libraries/Components/Picker/Picker.js
View File

@ -10,64 +10,103 @@
'use strict';
const ColorPropType = require('ColorPropType');
const DeprecatedViewPropTypes = require('DeprecatedViewPropTypes');
const PickerAndroid = require('PickerAndroid');
const PickerIOS = require('PickerIOS');
const Platform = require('Platform');
const PropTypes = require('prop-types');
const React = require('React');
const StyleSheetPropType = require('StyleSheetPropType');
const TextStylePropTypes = require('TextStylePropTypes');
const UnimplementedView = require('UnimplementedView');
const ViewStylePropTypes = require('ViewStylePropTypes');
const itemStylePropType = StyleSheetPropType(TextStylePropTypes);
const pickerStyleType = StyleSheetPropType({
...ViewStylePropTypes,
color: ColorPropType,
});
import type {TextStyleProp} from 'StyleSheet';
import type {ColorValue} from 'StyleSheetTypes';
const MODE_DIALOG = 'dialog';
const MODE_DROPDOWN = 'dropdown';
/**
* Individual selectable item in a Picker.
*/
class PickerItem extends React.Component<{
label: string,
value?: any,
color?: ColorPropType,
testID?: string,
}> {
static propTypes = {
type PickerItemProps = $ReadOnly<{|
/**
* Text to display for this item.
*/
label: PropTypes.string.isRequired,
label: string,
/**
* The value to be passed to picker's `onValueChange` callback when
* this item is selected. Can be a string or an integer.
*/
value: PropTypes.any,
value?: any,
/**
* Color of this item's text.
* @platform android
*/
color: ColorPropType,
color?: ColorValue,
/**
* Used to locate the item in end-to-end tests.
*/
testID: PropTypes.string,
};
testID?: string,
|}>;
/**
* Individual selectable item in a Picker.
*/
class PickerItem extends React.Component<PickerItemProps> {
render() {
// The items are not rendered directly
throw null;
}
}
type PickerProps = $ReadOnly<{|
children?: React.Node,
style?: ?TextStyleProp,
/**
* Value matching value of one of the items. Can be a string or an integer.
*/
selectedValue?: any,
/**
* Callback for when an item is selected. This is called with the following parameters:
* - `itemValue`: the `value` prop of the item that was selected
* - `itemPosition`: the index of the selected item in this picker
*/
onValueChange?: ?(newValue: any, newIndex: number) => mixed,
/**
* If set to false, the picker will be disabled, i.e. the user will not be able to make a
* selection.
* @platform android
*/
enabled?: ?boolean,
/**
* On Android, specifies how to display the selection items when the user taps on the picker:
*
* - 'dialog': Show a modal dialog. This is the default.
* - 'dropdown': Shows a dropdown anchored to the picker view
*
* @platform android
*/
mode?: ?('dialog' | 'dropdown'),
/**
* Style to apply to each of the item labels.
* @platform ios
*/
itemStyle?: ?TextStyleProp,
/**
* Prompt string for this picker, used on Android in dialog mode as the title of the dialog.
* @platform android
*/
prompt?: ?string,
/**
* Used to locate this view in end-to-end tests.
*/
testID?: ?string,
|}>;
/**
* Renders the native picker component on iOS and Android. Example:
*
@ -78,16 +117,7 @@ class PickerItem extends React.Component<{
* <Picker.Item label="JavaScript" value="js" />
* </Picker>
*/
class Picker extends React.Component<{
style?: $FlowFixMe,
selectedValue?: any,
onValueChange?: Function,
enabled?: boolean,
mode?: 'dialog' | 'dropdown',
itemStyle?: $FlowFixMe,
prompt?: string,
testID?: string,
}> {
class Picker extends React.Component<PickerProps> {
/**
* On Android, display the options in a dialog.
*/
@ -104,51 +134,6 @@ class Picker extends React.Component<{
mode: MODE_DIALOG,
};
// $FlowFixMe(>=0.41.0)
static propTypes = {
...DeprecatedViewPropTypes,
style: pickerStyleType,
/**
* Value matching value of one of the items. Can be a string or an integer.
*/
selectedValue: PropTypes.any,
/**
* Callback for when an item is selected. This is called with the following parameters:
* - `itemValue`: the `value` prop of the item that was selected
* - `itemPosition`: the index of the selected item in this picker
*/
onValueChange: PropTypes.func,
/**
* If set to false, the picker will be disabled, i.e. the user will not be able to make a
* selection.
* @platform android
*/
enabled: PropTypes.bool,
/**
* On Android, specifies how to display the selection items when the user taps on the picker:
*
* - 'dialog': Show a modal dialog. This is the default.
* - 'dropdown': Shows a dropdown anchored to the picker view
*
* @platform android
*/
mode: PropTypes.oneOf(['dialog', 'dropdown']),
/**
* Style to apply to each of the item labels.
* @platform ios
*/
itemStyle: itemStylePropType,
/**
* Prompt string for this picker, used on Android in dialog mode as the title of the dialog.
* @platform android
*/
prompt: PropTypes.string,
/**
* Used to locate this view in end-to-end tests.
*/
testID: PropTypes.string,
};
render() {
if (Platform.OS === 'ios') {
// $FlowFixMe found when converting React.createClass to ES6

56
Libraries/Components/Picker/PickerAndroid.android.js
View File

@ -10,13 +10,8 @@
'use strict';
const ColorPropType = require('ColorPropType');
const DeprecatedViewPropTypes = require('DeprecatedViewPropTypes');
const React = require('React');
const ReactPropTypes = require('prop-types');
const StyleSheet = require('StyleSheet');
const StyleSheetPropType = require('StyleSheetPropType');
const ViewStylePropTypes = require('ViewStylePropTypes');
const processColor = require('processColor');
const requireNativeComponent = require('requireNativeComponent');
@ -27,41 +22,30 @@ const DialogPicker = requireNativeComponent('AndroidDialogPicker');
const REF_PICKER = 'picker';
const MODE_DROPDOWN = 'dropdown';
const pickerStyleType = StyleSheetPropType({
...ViewStylePropTypes,
color: ColorPropType,
});
import type {SyntheticEvent} from 'CoreEventTypes';
import type {TextStyleProp} from 'StyleSheet';
type Event = Object;
type PickerAndroidChangeEvent = SyntheticEvent<
$ReadOnly<{|
position: number,
|}>,
>;
type PickerAndroidProps = $ReadOnly<{|
children?: React.Node,
style?: ?TextStyleProp,
selectedValue?: any,
enabled?: ?boolean,
mode?: ?('dialog' | 'dropdown'),
onValueChange?: ?(newValue: any, newIndex: number) => mixed,
prompt?: ?string,
testID?: string,
|}>;
/**
* Not exposed as a public API - use <Picker> instead.
*/
class PickerAndroid extends React.Component<
{
style?: $FlowFixMe,
selectedValue?: any,
enabled?: boolean,
mode?: 'dialog' | 'dropdown',
onValueChange?: Function,
prompt?: string,
testID?: string,
},
*,
> {
/* $FlowFixMe(>=0.78.0 site=react_native_android_fb) This issue was found
* when making Flow check .android.js files. */
static propTypes = {
...DeprecatedViewPropTypes,
style: pickerStyleType,
selectedValue: ReactPropTypes.any,
enabled: ReactPropTypes.bool,
mode: ReactPropTypes.oneOf(['dialog', 'dropdown']),
onValueChange: ReactPropTypes.func,
prompt: ReactPropTypes.string,
testID: ReactPropTypes.string,
};
class PickerAndroid extends React.Component<PickerAndroidProps, *> {
/* $FlowFixMe(>=0.78.0 site=react_native_android_fb) This issue was found
* when making Flow check .android.js files. */
constructor(props, context) {
@ -122,7 +106,7 @@ class PickerAndroid extends React.Component<
return <Picker ref={REF_PICKER} {...nativeProps} />;
}
_onChange = (event: Event) => {
_onChange = (event: PickerAndroidChangeEvent) => {
if (this.props.onValueChange) {
const position = event.nativeEvent.position;
if (position >= 0) {