react-native-picker-select android togglePicker patch-package

react-native-picker-select+8.0.4.patch

diff --git a/node_modules/react-native-picker-select/src/index.js b/node_modules/react-native-picker-select/src/index.js
index bcbc93e..9908f06 100644
--- a/node_modules/react-native-picker-select/src/index.js
+++ b/node_modules/react-native-picker-select/src/index.js
@@ -9,13 +9,13 @@ export default class RNPickerSelect extends PureComponent {
     static propTypes = {
         onValueChange: PropTypes.func.isRequired,
         items: PropTypes.arrayOf(
-            PropTypes.shape({
-                label: PropTypes.string.isRequired,
-                value: PropTypes.any.isRequired,
-                inputLabel: PropTypes.string,
-                key: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-                color: PropTypes.string,
-            })
+          PropTypes.shape({
+              label: PropTypes.string.isRequired,
+              value: PropTypes.any.isRequired,
+              inputLabel: PropTypes.string,
+              key: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+              color: PropTypes.string,
+          })
         ).isRequired,
         value: PropTypes.any, // eslint-disable-line react/forbid-prop-types
         placeholder: PropTypes.shape({
@@ -112,7 +112,6 @@ export default class RNPickerSelect extends PureComponent {
 
     constructor(props) {
         super(props);
-
         const items = RNPickerSelect.handlePlaceholder({
             placeholder: props.placeholder,
         }).concat(props.items);
@@ -155,7 +154,7 @@ export default class RNPickerSelect extends PureComponent {
             value: this.props.value,
         });
         const selectedItemChanged =
-            !isEqual(this.props.value, undefined) && !isEqual(prevState.selectedItem, selectedItem);
+          !isEqual(this.props.value, undefined) && !isEqual(prevState.selectedItem, selectedItem);
 
         if (itemsChanged || selectedItemChanged) {
             this.props.onValueChange(selectedItem.value, idx);
@@ -239,23 +238,24 @@ export default class RNPickerSelect extends PureComponent {
             Keyboard.dismiss();
         }
 
+        if (this.pickerRef && Platform.OS == 'android') this.pickerRef.focus();
         const animationType =
-            modalProps && modalProps.animationType ? modalProps.animationType : 'slide';
+          modalProps && modalProps.animationType ? modalProps.animationType : 'slide';
 
         this.triggerOpenCloseCallbacks();
 
         this.setState(
-            (prevState) => {
-                return {
-                    animationType: animate ? animationType : undefined,
-                    showPicker: !prevState.showPicker,
-                };
-            },
-            () => {
-                if (postToggleCallback) {
-                    postToggleCallback();
-                }
-            }
+          (prevState) => {
+              return {
+                  animationType: animate ? animationType : undefined,
+                  showPicker: !prevState.showPicker,
+              };
+          },
+          () => {
+              if (postToggleCallback) {
+                  postToggleCallback();
+              }
+          }
         );
     }
 
@@ -264,12 +264,12 @@ export default class RNPickerSelect extends PureComponent {
 
         return items.map((item) => {
             return (
-                <Picker.Item
-                    label={item.label}
-                    value={item.value}
-                    key={item.key || item.label}
-                    color={item.color}
-                />
+              <Picker.Item
+                label={item.label}
+                value={item.value}
+                key={item.key || item.label}
+                color={item.color}
+              />
             );
         });
     }
@@ -292,73 +292,73 @@ export default class RNPickerSelect extends PureComponent {
         }
 
         return (
-            <View
-                style={[defaultStyles.modalViewMiddle, style.modalViewMiddle]}
-                testID="input_accessory_view"
-            >
-                <View style={[defaultStyles.chevronContainer, style.chevronContainer]}>
-                    <TouchableOpacity
-                        activeOpacity={onUpArrow ? 0.5 : 1}
-                        onPress={onUpArrow ? this.onUpArrow : null}
-                    >
-                        <View
-                            style={[
-                                defaultStyles.chevron,
-                                style.chevron,
-                                defaultStyles.chevronUp,
-                                style.chevronUp,
-                                onUpArrow ? [defaultStyles.chevronActive, style.chevronActive] : {},
-                            ]}
-                        />
-                    </TouchableOpacity>
-                    <TouchableOpacity
-                        activeOpacity={onDownArrow ? 0.5 : 1}
-                        onPress={onDownArrow ? this.onDownArrow : null}
-                    >
-                        <View
-                            style={[
-                                defaultStyles.chevron,
-                                style.chevron,
-                                defaultStyles.chevronDown,
-                                style.chevronDown,
-                                onDownArrow
-                                    ? [defaultStyles.chevronActive, style.chevronActive]
-                                    : {},
-                            ]}
-                        />
-                    </TouchableOpacity>
-                </View>
-                <TouchableOpacity
-                    testID="done_button"
-                    onPress={() => {
-                        this.togglePicker(true, onDonePress);
-                    }}
-                    onPressIn={() => {
-                        this.setState({ doneDepressed: true });
-                    }}
-                    onPressOut={() => {
-                        this.setState({ doneDepressed: false });
-                    }}
-                    hitSlop={{ top: 4, right: 4, bottom: 4, left: 4 }}
-                    {...touchableDoneProps}
-                >
-                    <View testID="needed_for_touchable">
-                        <Text
-                            testID="done_text"
-                            allowFontScaling={false}
-                            style={[
-                                defaultStyles.done,
-                                style.done,
-                                doneDepressed
-                                    ? [defaultStyles.doneDepressed, style.doneDepressed]
-                                    : {},
-                            ]}
-                        >
-                            {doneText}
-                        </Text>
-                    </View>
-                </TouchableOpacity>
-            </View>
+          <View
+            style={[defaultStyles.modalViewMiddle, style.modalViewMiddle]}
+            testID="input_accessory_view"
+          >
+              <View style={[defaultStyles.chevronContainer, style.chevronContainer]}>
+                  <TouchableOpacity
+                    activeOpacity={onUpArrow ? 0.5 : 1}
+                    onPress={onUpArrow ? this.onUpArrow : null}
+                  >
+                      <View
+                        style={[
+                            defaultStyles.chevron,
+                            style.chevron,
+                            defaultStyles.chevronUp,
+                            style.chevronUp,
+                            onUpArrow ? [defaultStyles.chevronActive, style.chevronActive] : {},
+                        ]}
+                      />
+                  </TouchableOpacity>
+                  <TouchableOpacity
+                    activeOpacity={onDownArrow ? 0.5 : 1}
+                    onPress={onDownArrow ? this.onDownArrow : null}
+                  >
+                      <View
+                        style={[
+                            defaultStyles.chevron,
+                            style.chevron,
+                            defaultStyles.chevronDown,
+                            style.chevronDown,
+                            onDownArrow
+                              ? [defaultStyles.chevronActive, style.chevronActive]
+                              : {},
+                        ]}
+                      />
+                  </TouchableOpacity>
+              </View>
+              <TouchableOpacity
+                testID="done_button"
+                onPress={() => {
+                    this.togglePicker(true, onDonePress);
+                }}
+                onPressIn={() => {
+                    this.setState({ doneDepressed: true });
+                }}
+                onPressOut={() => {
+                    this.setState({ doneDepressed: false });
+                }}
+                hitSlop={{ top: 4, right: 4, bottom: 4, left: 4 }}
+                {...touchableDoneProps}
+              >
+                  <View testID="needed_for_touchable">
+                      <Text
+                        testID="done_text"
+                        allowFontScaling={false}
+                        style={[
+                            defaultStyles.done,
+                            style.done,
+                            doneDepressed
+                              ? [defaultStyles.doneDepressed, style.doneDepressed]
+                              : {},
+                        ]}
+                      >
+                          {doneText}
+                      </Text>
+                  </View>
+              </TouchableOpacity>
+          </View>
         );
     }
 
@@ -370,12 +370,12 @@ export default class RNPickerSelect extends PureComponent {
         }
 
         return (
-            <View
-                testID="icon_container"
-                style={[defaultStyles.iconContainer, style.iconContainer]}
-            >
-                <Icon testID="icon" />
-            </View>
+          <View
+            testID="icon_container"
+            style={[defaultStyles.iconContainer, style.iconContainer]}
+          >
+              <Icon testID="icon" />
+          </View>
         );
     }
 
@@ -384,31 +384,31 @@ export default class RNPickerSelect extends PureComponent {
         const { selectedItem } = this.state;
 
         const containerStyle =
-            Platform.OS === 'ios' ? style.inputIOSContainer : style.inputAndroidContainer;
+          Platform.OS === 'ios' ? style.inputIOSContainer : style.inputAndroidContainer;
 
         if (children) {
             return (
-                <View pointerEvents="box-only" style={containerStyle}>
-                    {children}
-                </View>
+              <View pointerEvents="box-only" style={containerStyle}>
+                  {children}
+              </View>
             );
         }
 
         return (
-            <View pointerEvents="box-only" style={containerStyle}>
-                <TextInput
-                    testID="text_input"
-                    style={[
-                        Platform.OS === 'ios' ? style.inputIOS : style.inputAndroid,
-                        this.getPlaceholderStyle(),
-                    ]}
-                    value={selectedItem.inputLabel ? selectedItem.inputLabel : selectedItem.label}
-                    ref={this.setInputRef}
-                    editable={false}
-                    {...textInputProps}
-                />
-                {this.renderIcon()}
-            </View>
+          <View pointerEvents="box-only" style={containerStyle}>
+              <TextInput
+                testID="text_input"
+                style={[
+                    Platform.OS === 'ios' ? style.inputIOS : style.inputAndroid,
+                    this.getPlaceholderStyle(),
+                ]}
+                value={selectedItem.inputLabel ? selectedItem.inputLabel : selectedItem.label}
+                ref={this.setInputRef}
+                editable={false}
+                {...textInputProps}
+              />
+              {this.renderIcon()}
+          </View>
         );
     }
 
@@ -417,52 +417,52 @@ export default class RNPickerSelect extends PureComponent {
         const { animationType, orientation, selectedItem, showPicker } = this.state;
 
         return (
-            <View style={[defaultStyles.viewContainer, style.viewContainer]}>
-                <TouchableOpacity
-                    testID="ios_touchable_wrapper"
+          <View style={[defaultStyles.viewContainer, style.viewContainer]}>
+              <TouchableOpacity
+                testID="ios_touchable_wrapper"
+                onPress={() => {
+                    this.togglePicker(true);
+                }}
+                activeOpacity={1}
+                {...touchableWrapperProps}
+              >
+                  {this.renderTextInputOrChildren()}
+              </TouchableOpacity>
+              <Modal
+                testID="ios_modal"
+                visible={showPicker}
+                transparent
+                animationType={animationType}
+                supportedOrientations={['portrait', 'landscape']}
+                onOrientationChange={this.onOrientationChange}
+                {...modalProps}
+              >
+                  <TouchableOpacity
+                    style={[defaultStyles.modalViewTop, style.modalViewTop]}
+                    testID="ios_modal_top"
                     onPress={() => {
                         this.togglePicker(true);
                     }}
-                    activeOpacity={1}
-                    {...touchableWrapperProps}
-                >
-                    {this.renderTextInputOrChildren()}
-                </TouchableOpacity>
-                <Modal
-                    testID="ios_modal"
-                    visible={showPicker}
-                    transparent
-                    animationType={animationType}
-                    supportedOrientations={['portrait', 'landscape']}
-                    onOrientationChange={this.onOrientationChange}
-                    {...modalProps}
-                >
-                    <TouchableOpacity
-                        style={[defaultStyles.modalViewTop, style.modalViewTop]}
-                        testID="ios_modal_top"
-                        onPress={() => {
-                            this.togglePicker(true);
-                        }}
-                    />
-                    {this.renderInputAccessoryView()}
-                    <View
-                        style={[
-                            defaultStyles.modalViewBottom,
-                            { height: orientation === 'portrait' ? 215 : 162 },
-                            style.modalViewBottom,
-                        ]}
-                    >
-                        <Picker
-                            testID="ios_picker"
-                            onValueChange={this.onValueChange}
-                            selectedValue={selectedItem.value}
-                            {...pickerProps}
-                        >
-                            {this.renderPickerItems()}
-                        </Picker>
-                    </View>
-                </Modal>
-            </View>
+                  />
+                  {this.renderInputAccessoryView()}
+                  <View
+                    style={[
+                        defaultStyles.modalViewBottom,
+                        { height: orientation === 'portrait' ? 215 : 162 },
+                        style.modalViewBottom,
+                    ]}
+                  >
+                      <Picker
+                        testID="ios_picker"
+                        onValueChange={this.onValueChange}
+                        selectedValue={selectedItem.value}
+                        {...pickerProps}
+                      >
+                          {this.renderPickerItems()}
+                      </Picker>
+                  </View>
+              </Modal>
+          </View>
         );
     }
 
@@ -477,58 +477,58 @@ export default class RNPickerSelect extends PureComponent {
             fixAndroidTouchableBug,
         } = this.props;
         const { selectedItem } = this.state;
-
         const Component = fixAndroidTouchableBug ? View : TouchableOpacity;
         return (
-            <Component
-                testID="android_touchable_wrapper"
-                onPress={onOpen}
-                activeOpacity={1}
-                {...touchableWrapperProps}
-            >
-                <View style={style.headlessAndroidContainer}>
-                    {this.renderTextInputOrChildren()}
-                    <Picker
-                        style={[
-                            Icon ? { backgroundColor: 'transparent' } : {}, // to hide native icon
-                            defaultStyles.headlessAndroidPicker,
-                            style.headlessAndroidPicker,
-                        ]}
-                        testID="android_picker_headless"
-                        enabled={!disabled}
-                        onValueChange={this.onValueChange}
-                        selectedValue={selectedItem.value}
-                        {...pickerProps}
-                    >
-                        {this.renderPickerItems()}
-                    </Picker>
-                </View>
-            </Component>
-        );
-    }
-
-    renderAndroidNativePickerStyle() {
-        const { disabled, Icon, style, pickerProps } = this.props;
-        const { selectedItem } = this.state;
-
-        return (
-            <View style={[defaultStyles.viewContainer, style.viewContainer]}>
-                <Picker
+          <Component
+            testID="android_touchable_wrapper"
+            onPress={onOpen}
+            activeOpacity={1}
+            {...touchableWrapperProps}
+          >
+              <View style={style.headlessAndroidContainer}>
+                  {this.renderTextInputOrChildren()}
+                  <Picker
+                    ref={(ref) => (this.pickerRef = ref)}
                     style={[
                         Icon ? { backgroundColor: 'transparent' } : {}, // to hide native icon
-                        style.inputAndroid,
-                        this.getPlaceholderStyle(),
+                        defaultStyles.headlessAndroidPicker,
+                        style.headlessAndroidPicker,
                     ]}
-                    testID="android_picker"
+                    testID="android_picker_headless"
                     enabled={!disabled}
                     onValueChange={this.onValueChange}
                     selectedValue={selectedItem.value}
                     {...pickerProps}
-                >
-                    {this.renderPickerItems()}
-                </Picker>
-                {this.renderIcon()}
-            </View>
+                  >
+                      {this.renderPickerItems()}
+                  </Picker>
+              </View>
+          </Component>
+        );
+    }
+
+    renderAndroidNativePickerStyle() {
+        const { disabled, Icon, style, pickerProps } = this.props;
+        const { selectedItem } = this.state;
+        return (
+          <View style={[defaultStyles.viewContainer, style.viewContainer]}>
+              <Picker
+                ref={(ref) => (this.pickerRef = ref)}
+                style={[
+                    Icon ? { backgroundColor: 'transparent' } : {}, // to hide native icon
+                    style.inputAndroid,
+                    this.getPlaceholderStyle(),
+                ]}
+                testID="android_picker"
+                enabled={!disabled}
+                onValueChange={this.onValueChange}
+                selectedValue={selectedItem.value}
+                {...pickerProps}
+              >
+                  {this.renderPickerItems()}
+              </Picker>
+              {this.renderIcon()}
+          </View>
         );
     }
 
@@ -537,22 +537,21 @@ export default class RNPickerSelect extends PureComponent {
         const { selectedItem } = this.state;
 
         return (
-            <View style={[defaultStyles.viewContainer, style.viewContainer]}>
-                <Picker
-                    style={[style.inputWeb]}
-                    testID="web_picker"
-                    enabled={!disabled}
-                    onValueChange={this.onValueChange}
-                    selectedValue={selectedItem.value}
-                    {...pickerProps}
-                >
-                    {this.renderPickerItems()}
-                </Picker>
-                {this.renderIcon()}
-            </View>
+          <View style={[defaultStyles.viewContainer, style.viewContainer]}>
+              <Picker
+                style={[style.inputWeb]}
+                testID="web_picker"
+                enabled={!disabled}
+                onValueChange={this.onValueChange}
+                selectedValue={selectedItem.value}
+                {...pickerProps}
+              >
+                  {this.renderPickerItems()}
+              </Picker>
+              {this.renderIcon()}
+          </View>
         );
     }
-
     render() {
         const { children, useNativeAndroidPickerStyle } = this.props;