update to fix re-renders

Author: lfkwtz

Diff for: demo/App.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import {
+  Alert,
   Button,
   Text,
   TextInput,
@@ -9,7 +10,7 @@ import {
   TouchableWithoutFeedback,
   View,
 } from 'react-native';
-// import {Chevron} from 'react-native-shapes';
+import {Chevron} from 'react-native-shapes';
 // import { Ionicons } from '@expo/vector-icons';
 import RNPickerSelect, {defaultStyles} from './react-native-picker-select';
 
@@ -154,6 +155,9 @@ export default class App extends React.Component {
             onDownArrow={() => {
               this.inputRefs.favSport1.togglePicker();
             }}
+            onDonePress={() => {
+              Alert.alert('Done pressed');
+            }}
             style={pickerSelectStyles}
             value={this.state.favSport0}
             ref={el => {
@@ -172,6 +176,9 @@ export default class App extends React.Component {
                 favSport1: value,
               });
             }}
+            onUpArrow={() => {
+              this.inputRefs.favSport0.togglePicker();
+            }}
             style={pickerSelectStyles}
             value={this.state.favSport1}
             useNativeAndroidPickerStyle={false}
@@ -192,6 +199,9 @@ export default class App extends React.Component {
                 favSport2: value,
               });
             }}
+            onDonePress={() => {
+              Alert.alert('Should never appear - no InputAccessoryView');
+            }}
             InputAccessoryView={() => null}
             style={pickerSelectStyles}
             value={this.state.favSport2}
@@ -221,9 +231,9 @@ export default class App extends React.Component {
             value={this.state.favSport3}
             useNativeAndroidPickerStyle={false}
             textInputProps={{underlineColorAndroid: 'cyan'}}
-            // Icon={() => {
-            //   return <Chevron size={1.5} color="gray" />;
-            // }}
+            Icon={() => {
+              return <Chevron size={1.5} color="gray" />;
+            }}
           />
 
           <View paddingVertical={5} />

Diff for: demo/package.json

@@ -13,7 +13,8 @@
     "lodash.isequal": "^4.5.0",
     "prop-types": "^15.7.2",
     "react": "16.9.0",
-    "react-native": "0.61.5"
+    "react-native": "0.61.5",
+    "react-native-shapes": "^0.1.0"
   },
   "devDependencies": {
     "@babel/core": "^7.6.2",

Diff for: demo/react-native-picker-select/index.js

@@ -180,16 +180,19 @@ export default class RNPickerSelect extends PureComponent {
     this.togglePicker(false, onDownArrow);
   }
 
-  onValueChange(value, index) {
-    const {onValueChange} = this.props;
+  onValueChange(val, idx) {
+    const {onValueChange, value} = this.props;
 
-    onValueChange(value, index);
+    onValueChange(val, idx);
 
-    this.setState(prevState => {
-      return {
-        selectedItem: prevState.items[index],
-      };
-    });
+    // if value prop is not used, maintain selectedItem internally
+    if (isEqual(value, undefined)) {
+      this.setState(prevState => {
+        return {
+          selectedItem: prevState.items[idx],
+        };
+      });
+    }
   }
 
   onOrientationChange({nativeEvent}) {

Diff for: demo/yarn.lock

@@ -5191,6 +5191,11 @@ react-is@^16.8.1, react-is@^16.8.4, react-is@^16.9.0:
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.12.0.tgz#2cc0fe0fba742d97fd527c42a13bec4eeb06241c"
   integrity sha512-rPCkf/mWBtKc97aLL9/txD8DZdemK0vkA3JMLShjlJB3Pj3s+lpf1KaBzMfQrAmhMQB0n1cU/SUGgKKBCe837Q==
 
+react-native-shapes@^0.1.0:
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/react-native-shapes/-/react-native-shapes-0.1.0.tgz#53a9a01ba15ff33d35d0062c25ede48382033b30"
+  integrity sha512-5EHcc/Burlvp2UdfzT+EkQqGn7WO6SQGxZ9w0/4BWYMB/bShA8/lnhuWgxQz+IxZwxnzPkYiR4zCS2NlQQJGig==
+
 [email protected]:
   version "0.61.5"
   resolved "https://registry.yarnpkg.com/react-native/-/react-native-0.61.5.tgz#6e21acb56cbd75a3baeb1f70201a66f42600bba8"

Diff for: src/index.js

@@ -179,16 +179,19 @@ export default class RNPickerSelect extends PureComponent {
         this.togglePicker(false, onDownArrow);
     }
 
-    onValueChange(value, index) {
-        const { onValueChange } = this.props;
+    onValueChange(val, idx) {
+        const { onValueChange, value } = this.props;
 
-        onValueChange(value, index);
+        onValueChange(val, idx);
 
-        this.setState((prevState) => {
-            return {
-                selectedItem: prevState.items[index],
-            };
-        });
+        // if value prop is not used, maintain selectedItem internally
+        if (isEqual(value, undefined)) {
+            this.setState((prevState) => {
+                return {
+                    selectedItem: prevState.items[idx],
+                };
+            });
+        }
     }
 
     onOrientationChange({ nativeEvent }) {