From 5256625d8d8c3b11019e35f9b7cc67fd5bf8890a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tar=C4=B1k=20Y=C4=B1lmaz?= <tarikyilmaz@yandex.com.tr>
Date: Sun, 24 Dec 2017 23:27:36 +0300
Subject: [PATCH 1/3] Add prop types

---
 .gitignore   | 1 +
 index.js     | 6 ++----
 package.json | 3 +++
 3 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/.gitignore b/.gitignore
index 85b13164..d6b73102 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,5 +1,6 @@
 .idea
 npm-debug.log
+node_modules
 
 # vim
 *.sw*
diff --git a/index.js b/index.js
index d65bf4c0..cfbc5afb 100644
--- a/index.js
+++ b/index.js
@@ -1,9 +1,5 @@
 'use strict';
 
-import React,{
-    PropTypes
-} from 'react';
-
 import {
     View,
     StyleSheet,
@@ -15,6 +11,8 @@ import {
     Platform
 } from 'react-native';
 
+import PropTypes from 'prop-types';
+
 import styles from './style';
 import BaseComponent from './BaseComponent';
 
diff --git a/package.json b/package.json
index 16e1eba7..f2fce43d 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,9 @@
     "type": "git",
     "url": "https://github.com/d-a-n/react-native-modal-picker.git"
   },
+  "dependencies": {
+    "prop-types": "^15.6.0"
+  },
   "keywords": [
     "react-native",
     "dropdown",

From 6e28d4405920d1d22366c2f22d58434d0afdb9e4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tar=C4=B1k=20Y=C4=B1lmaz?= <tarikyilmaz@yandex.com.tr>
Date: Sun, 24 Dec 2017 23:32:46 +0300
Subject: [PATCH 2/3] Add react package

---
 package.json | 1 +
 1 file changed, 1 insertion(+)

diff --git a/package.json b/package.json
index f2fce43d..150b4a45 100644
--- a/package.json
+++ b/package.json
@@ -12,6 +12,7 @@
     "url": "https://github.com/d-a-n/react-native-modal-picker.git"
   },
   "dependencies": {
+    "react": "^16.0.0-alpha.12",
     "prop-types": "^15.6.0"
   },
   "keywords": [

From 50eb56e6072677060c5e2a4f487d794b71b14157 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tar=C4=B1k=20Y=C4=B1lmaz?= <tarikyilmaz@yandex.com.tr>
Date: Mon, 25 Dec 2017 00:43:18 +0300
Subject: [PATCH 3/3] Include react package

---
 index.js | 47 ++++++++++++++++++++++++++---------------------
 1 file changed, 26 insertions(+), 21 deletions(-)

diff --git a/index.js b/index.js
index cfbc5afb..58ff76dd 100644
--- a/index.js
+++ b/index.js
@@ -1,5 +1,7 @@
 'use strict';
 
+import React from 'react';
+
 import {
     View,
     StyleSheet,
@@ -36,7 +38,8 @@ const propTypes = {
 
 const defaultProps = {
     data: [],
-    onChange: ()=> {},
+    onChange: () => {
+    },
     initValue: 'Select me!',
     style: {},
     selectStyle: {},
@@ -77,9 +80,9 @@ export default class ModalPicker extends BaseComponent {
     }
 
     componentWillReceiveProps(nextProps) {
-      if (nextProps.initValue != this.props.initValue) {
-        this.setState({selected: nextProps.initValue});
-      }
+        if (nextProps.initValue != this.props.initValue) {
+            this.setState({selected: nextProps.initValue});
+        }
     }
 
     onChange(item) {
@@ -89,30 +92,30 @@ export default class ModalPicker extends BaseComponent {
     }
 
     close() {
-      this.setState({
-        modalVisible: false
-      });
+        this.setState({
+            modalVisible: false
+        });
     }
 
     open() {
-      this.setState({
-        modalVisible: true
-      });
+        this.setState({
+            modalVisible: true
+        });
     }
 
     renderSection(section) {
         return (
-            <View key={section.key} style={[styles.sectionStyle,this.props.sectionStyle]}>
-                <Text style={[styles.sectionTextStyle,this.props.sectionTextStyle]}>{section.label}</Text>
+            <View key={section.key} style={[styles.sectionStyle, this.props.sectionStyle]}>
+                <Text style={[styles.sectionTextStyle, this.props.sectionTextStyle]}>{section.label}</Text>
             </View>
         );
     }
 
     renderOption(option) {
         return (
-            <TouchableOpacity key={option.key} onPress={()=>this.onChange(option)}>
+            <TouchableOpacity key={option.key} onPress={() => this.onChange(option)}>
                 <View style={[styles.optionStyle, this.props.optionStyle]}>
-                    <Text style={[styles.optionTextStyle,this.props.optionTextStyle]}>{option.label}</Text>
+                    <Text style={[styles.optionTextStyle, this.props.optionTextStyle]}>{option.label}</Text>
                 </View>
             </TouchableOpacity>)
     }
@@ -127,10 +130,10 @@ export default class ModalPicker extends BaseComponent {
         });
 
         return (
-            <View style={[styles.overlayStyle, this.props.overlayStyle]} key={'modalPicker'+(componentIndex++)}>
+            <View style={[styles.overlayStyle, this.props.overlayStyle]} key={'modalPicker' + (componentIndex++)}>
                 <View style={styles.optionContainer}>
                     <ScrollView keyboardShouldPersistTaps>
-                        <View style={{paddingHorizontal:10}}>
+                        <View style={{paddingHorizontal: 10}}>
                             {options}
                         </View>
                     </ScrollView>
@@ -138,7 +141,8 @@ export default class ModalPicker extends BaseComponent {
                 <View style={styles.cancelContainer}>
                     <TouchableOpacity onPress={this.close}>
                         <View style={[styles.cancelStyle, this.props.cancelStyle]}>
-                            <Text style={[styles.cancelTextStyle,this.props.cancelTextStyle]}>{this.props.cancelText}</Text>
+                            <Text
+                                style={[styles.cancelTextStyle, this.props.cancelTextStyle]}>{this.props.cancelText}</Text>
                         </View>
                     </TouchableOpacity>
                 </View>
@@ -148,7 +152,7 @@ export default class ModalPicker extends BaseComponent {
 
     renderChildren() {
 
-        if(this.props.children) {
+        if (this.props.children) {
             return this.props.children;
         }
         return (
@@ -161,9 +165,10 @@ export default class ModalPicker extends BaseComponent {
     render() {
 
         const dp = (
-          <Modal transparent={true} ref="modal" visible={this.state.modalVisible} onRequestClose={this.close} animationType={this.state.animationType}>
-          {this.renderOptionList()}
-          </Modal>
+            <Modal transparent={true} ref="modal" visible={this.state.modalVisible} onRequestClose={this.close}
+                   animationType={this.state.animationType}>
+                {this.renderOptionList()}
+            </Modal>
         );
 
         return (