Fix bugs with time picker and prepare for v1.0.0

Author: RichardLindhout

README.md

@@ -1,12 +1,13 @@
 ## react-native-paper-dates
 
-- Smooth and fast cross platform Material Design date picker for React Native Paper
+- Smooth and fast cross platform Material Design **date** picker and **time** picker for React Native Paper
 - Tested on Android, iOS and the web platform!
 - Uses the native Date.Intl API's which work out of the box on the web / iOS
 - Simple API
 - Typesafe
 - Endless scrolling
 - Performant
+- Great react-native-web support
 
 Older demo of this library
 <img src="https://user-images.githubusercontent.com/6492229/90681177-4970f280-e263-11ea-8257-6810c5166f92.gif"/>
@@ -117,11 +118,69 @@ export default function RangeDatePage() {
 ```
 
 
+### Time picker
+```tsx
+import * as React from 'react'
+import { Button } from 'react-native-paper'
+import { TimePickerModal } from 'react-native-paper-dates'
+
+export default function RangeDatePage() {
+  const [visible, setVisible] = React.useState(false)
+  const onDismiss = React.useCallback(() => {
+    setVisible(false)
+  }, [setVisible])
+
+  const onConfirm = React.useCallback(
+    ({ hours, minutes }) => {
+      setVisible(false);
+      console.log({ hours, minutes });
+    },
+    [setVisible]
+  );
+
+
+  return (
+    <>
+      <TimePickerModal
+        visible={visible}
+        onDismiss={onDismiss}
+        onConfirm={onConfirm}
+        label={'Select time'} // optional, default 'Select time'
+        cancelLabel="Cancel" // optional, default: 'Cancel'
+        confirmLabel="Ok" // optional, default: 'Ok'
+        hours={12} // optional, default: current hours
+        minutes={14} // optional, default: current minutes
+      />
+      <Button onPress={()=> setVisible(true)}>
+        Pick time
+      </Button>
+    </>
+  )
+}
+```
+
+
+
+
+
 
 ## Roadmap
-Things on our roadmap are labeled with enhancement.
+Things on our roadmap have labels with `enhancement`.
 https://github.com/web-ridge/react-native-paper-dates/issues
 
+## Tips & Tricks
+- Use 0.14+ version of React-Native-Web
+- Try to avoid putting the pickers inside of a scrollView
+If that is **not possible** use the following props on the surrounding ScrollViews/Flatlists
+
+```javascript
+    keyboardDismissMode="on-drag"
+    keyboardShouldPersistTaps="handled"
+    contentInsetAdjustmentBehavior="always"
+```
+This is to prevent the need to press 2 times before save works (1 press for closing keyboard, 1 press for confirm/close)
+(https://github.com/facebook/react-native/issues/10138)
+
 ## Android Caveats
 
 You will need to add a polyfill for the Intl API on Android if:

example/package.json

@@ -29,8 +29,8 @@
     "react-dom": "^16.13.1",
     "react-native": "0.63.2",
     "react-native-localize": "^1.4.1",
-    "react-native-vector-icons": "^7.1.0",
-    "react-native-web": "^0.0.0-80dae21e2",
+    "react-native-vector-icons": "https://github.com/RichardLindhout/react-native-vector-icons",
+    "react-native-web": "^0.14.8",
     "react-scripts": "3.4.3"
   },
   "devDependencies": {