From 5f70c3cffb13693fd8d9bfecb4c2c9cd25c87003 Mon Sep 17 00:00:00 2001
From: Artem <artem.kosiakevych@gmail.com>
Date: Thu, 27 Feb 2020 12:43:40 +0200
Subject: [PATCH] Update IOs part

---
 .DS_Store                                    | Bin 6148 -> 6148 bytes
 README.md                                    |  10 ++--
 src/DatePicker.ios.js                        |  46 -------------------
 src/DatePicker.ios.tsx                       |  28 +++++++++++
 src/{TimePicker.js => TimePicker.android.js} |  20 +++-----
 src/TimePicker.ios.tsx                       |  16 +++++++
 6 files changed, 57 insertions(+), 63 deletions(-)
 delete mode 100644 src/DatePicker.ios.js
 create mode 100644 src/DatePicker.ios.tsx
 rename src/{TimePicker.js => TimePicker.android.js} (95%)
 create mode 100644 src/TimePicker.ios.tsx

diff --git a/.DS_Store b/.DS_Store
index 5008ddfcf53c02e82d7eee2e57c38e5672ef89f6..d0d36d76ca3f3ab601c4527d227cdb9528e26197 100644
GIT binary patch
delta 339
zcmZoMXfc=|#>B)qF;Q%yo}wrR0|Nsi1A_nqLq0<$LrPA%VQ_N(#>C}}^&lB`hD3%u
zh7^V(WZB#TpbQWcR09b#6}kB?E=f80NkAD6C+|zrSC|huVpEkuP*pucN<jw5F;MFm
zflg##U}h)=Iwl$7OsI^&tJ??}WCt8PUexmf;sB_=+<b(^n6fDLF$orIO#H(#*+7J4
iGdBk}2QbJsCVpq0%rBzI$^^7eVX~o!^yUDOEzAI2SWq(n

delta 70
zcmZoMXfc=|#>AjHu~2NHo+1YW5HK<@2y7N){>HLdfq56xW_AvK4xj>{$am(+{342+
UKzW7)kiy9(Jj$D6L{=~Z01@sEU;qFB

diff --git a/README.md b/README.md
index eb2b800b..510a6059 100644
--- a/README.md
+++ b/README.md
@@ -119,6 +119,7 @@ module.exports = MyPicker;
 | disabled | undefind | `bool` | Disable picker selection  |
 
 # Time Picker
+For IOs DatePickerIOS is used
 
 ![](./src/assets/timePickerAndroid.gif)
 ![](./src/assets/timePickerIos.gif)
@@ -134,12 +135,13 @@ onTimeSelected = date => {}
 
 | Prop                 |     Default      |      Type       | Description                 |
 | :------------------- | :--------------: | :-------------: | :-------------------------- |
-| ...WheelPicker props |        -         |        -        | All style WheelPicker props |
+| [DatePickerIOS props](https://facebook.github.io/react-native/docs/datepickerios#props) |        -         |        -        | All DatePickerIOS props (IOS only) |
+| ...WheelPicker props |        -         |        -        | All style WheelPicker props (Android only) |
 | initDate             |   current date   |     `Date`      | Initial date                |
 | onTimeSelected       |        -         |     `func`      | Callback with selected time |
-| hours                |   [1,2,3,4...]   | `Array<string>` | Custom hours array          |
-| minutes              | [00,05,10,15...] | `Array<string>` | Custom minutes array        |
-| format24             |      false       |    `boolean`    | Time format                 |
+| hours                |   [1,2,3,4...]   | `Array<string>` | Custom hours array (Android only)         |
+| minutes              | [00,05,10,15...] | `Array<string>` | Custom minutes array (Android only)       |
+| format24             |      false       |    `boolean`    | Time format (Android only)                |
 
 # Date Picker
 
diff --git a/src/DatePicker.ios.js b/src/DatePicker.ios.js
deleted file mode 100644
index 8a73e775..00000000
--- a/src/DatePicker.ios.js
+++ /dev/null
@@ -1,46 +0,0 @@
-/**
- * @prettier
- * @flow
- * */
-
-import React from 'react'
-import { DatePickerIOS, StyleSheet, Dimensions } from 'react-native'
-
-type Props = {
-  onDateSelected: Date => void,
-  initDate: Date
-}
-
-type State = {
-  chosenDate: Date
-}
-
-export default class DatePicker extends React.Component<Props, State> {
-  constructor(props: Props){
-    super(props)
-    this.state = { chosenDate: props.initDate || new Date() }
-  }
-
-  setDate = (newDate) => {
-    this.setState({chosenDate: newDate})
-    const { onDateSelected } = this.props
-    if (onDateSelected) onDateSelected(newDate)
-  }
-
-  render(){
-    return (
-        <DatePickerIOS
-          style={styles.picker}
-          date={this.state.chosenDate}
-          onDateChange={this.setDate}
-          {...this.props}
-        />
-    )
-  }
-}
-
-let styles = StyleSheet.create({
-  picker: {
-    width: Dimensions.get('screen').width
-  },
-})
diff --git a/src/DatePicker.ios.tsx b/src/DatePicker.ios.tsx
new file mode 100644
index 00000000..015bcf18
--- /dev/null
+++ b/src/DatePicker.ios.tsx
@@ -0,0 +1,28 @@
+import React, { useState } from "react";
+import { DatePickerIOS, View } from "react-native";
+
+interface Props {
+  initDate: Date;
+  onDateSelected?: Function;
+  disabled?: boolean;
+}
+
+const DatePicker: React.FC<Props> = props => {
+  const { initDate, onDateSelected, disabled } = props;
+  const [date, setDate] = useState(initDate || new Date())
+  return (
+    <View pointerEvents={disabled ? "none" : "auto"}>
+      <DatePickerIOS
+        date={date}
+        onDateChange={(date) => {
+          if (onDateSelected) onDateSelected(date)
+          setDate(date)
+        }}
+        mode={'date'}
+        {...props}
+      />
+    </View>
+  );
+};
+
+export default DatePicker;
diff --git a/src/TimePicker.js b/src/TimePicker.android.js
similarity index 95%
rename from src/TimePicker.js
rename to src/TimePicker.android.js
index a60d3e30..520489b4 100644
--- a/src/TimePicker.js
+++ b/src/TimePicker.android.js
@@ -1,8 +1,3 @@
-/**
- * @prettier
- * @flow
- * */
-
 import React from 'react'
 import { View, StyleSheet } from 'react-native'
 import WheelPicker from './WheelPicker'
@@ -71,21 +66,21 @@ export default class TimePicker extends React.Component<Props, State> {
       <View style={[styles.container, { backgroundColor: this.props.backgroundColor }]}>
         <WheelPicker
           isCyclic
-          style={styles.wheelPicker}
+          // style={styles.wheelPicker}
           {...this.props}
           data={hours}
           onItemSelected={this.onHourSelected}
           selectedItem={selectedHourIndex}
-          initPosition={0}
+          initPosition={selectedHourIndex}
         />
         <WheelPicker
-          style={styles.wheelPicker}
+          // style={styles.wheelPicker}
           isCyclic
           {...this.props}
           data={minutes}
           onItemSelected={this.onMinuteSelected}
           selectedItem={selectedMinuteIndex}
-          initPosition={0}
+          initPosition={selectedMinuteIndex}
         />
         {!this.props.format24 && this.renderAm()}
       </View>
@@ -149,13 +144,12 @@ export default class TimePicker extends React.Component<Props, State> {
 
 const styles = StyleSheet.create({
   container: {
-    alignItems: 'center',
+    // alignItems: 'center',
     flexDirection: 'row',
   },
   wheelPicker: {
     height: 150,
-    width: null,
+    width: 150,
     flex: 1,
   },
-})
-
+})
\ No newline at end of file
diff --git a/src/TimePicker.ios.tsx b/src/TimePicker.ios.tsx
new file mode 100644
index 00000000..6a3f84c4
--- /dev/null
+++ b/src/TimePicker.ios.tsx
@@ -0,0 +1,16 @@
+import React from "react";
+import DatePicker from './DatePicker.ios'
+
+interface Props {
+  initDate: Date;
+  onTimeSelected?: Function;
+  disabled?: boolean;
+}
+
+const TimePicker: React.FC<Props> = props => {
+  return (
+    <DatePicker mode={'time'} {...props} onDateSelected={props.onTimeSelected}/>
+  );
+};
+
+export default TimePicker;