Merge pull request #103 from henninghall/prettier

Add prettier and style all files

DatePickerAndroid.js

@@ -1,16 +1,19 @@
-import React from 'react';
-import { DatePickerIOS, requireNativeComponent, StyleSheet } from 'react-native';
+import React from 'react'
+import { DatePickerIOS, requireNativeComponent, StyleSheet } from 'react-native'
 import moment from 'moment'
-import { throwIfInvalidProps } from "./propChecker";
+import { throwIfInvalidProps } from './propChecker';
 
-const NativeDatePicker = requireNativeComponent(`DatePickerManager`, DatePickerAndroid, { nativeOnly: { onChange: true } });
+const NativeDatePicker = requireNativeComponent(
+  `DatePickerManager`,
+  DatePickerAndroid,
+  { nativeOnly: { onChange: true } }
+)
 
 class DatePickerAndroid extends React.PureComponent {
-
   static defaultProps = {
     mode: 'datetime',
     minuteInterval: 1,
-  };
+  }
 
   render() {
     if (__DEV__) throwIfInvalidProps(this.props)
@@ -32,35 +35,42 @@ class DatePickerAndroid extends React.PureComponent {
     this.props.onDateChange(jsDate)
   }
 
-  _maximumDate = () => this.props.maximumDate && this._toIsoWithTimeZoneOffset(this.props.maximumDate);
+  _maximumDate = () =>
+    this.props.maximumDate &&
+    this._toIsoWithTimeZoneOffset(this.props.maximumDate)
 
-  _minimumDate = () => this.props.minimumDate && this._toIsoWithTimeZoneOffset(this.props.minimumDate);
+  _minimumDate = () =>
+    this.props.minimumDate &&
+    this._toIsoWithTimeZoneOffset(this.props.minimumDate)
 
-  _date = () => this._toIsoWithTimeZoneOffset(this.props.date);
+  _date = () => this._toIsoWithTimeZoneOffset(this.props.date)
 
   _fromIsoWithTimeZoneOffset = date => {
-    if (this.props.timeZoneOffsetInMinutes === undefined)
-      return moment(date)
+    if (this.props.timeZoneOffsetInMinutes === undefined) return moment(date)
 
-    return moment.utc(date).subtract(this.props.timeZoneOffsetInMinutes, 'minutes')
+    return moment
+      .utc(date)
+      .subtract(this.props.timeZoneOffsetInMinutes, 'minutes')
   }
 
   _toIsoWithTimeZoneOffset = date => {
     if (this.props.timeZoneOffsetInMinutes === undefined)
       return moment(date).toISOString()
 
-    return moment.utc(date).add(this.props.timeZoneOffsetInMinutes, 'minutes').toISOString()
+    return moment
+      .utc(date)
+      .add(this.props.timeZoneOffsetInMinutes, 'minutes')
+      .toISOString()
   }
-
 }
 
 const styles = StyleSheet.create({
   picker: {
     width: 310,
     height: 180,
-  }
+  },
 })
 
-DatePickerAndroid.propTypes = DatePickerIOS.propTypes;
+DatePickerAndroid.propTypes = DatePickerIOS.propTypes
 
-export default DatePickerAndroid;
+export default DatePickerAndroid

DatePickerIOS.js

@@ -7,97 +7,16 @@
  *
  * This is a controlled component version of RCTDatePickerIOS
  *
- * @format
- * @flow
  */
 
-'use strict';
+'use strict'
 
-import React from 'react';
-import { StyleSheet, View, requireNativeComponent } from 'react-native';
-import { throwIfInvalidProps } from "./propChecker";
-const invariant = require('fbjs/lib/invariant');
+import React from 'react'
+import { StyleSheet, View, requireNativeComponent } from 'react-native'
+import { throwIfInvalidProps } from './propChecker';
+const invariant = require('fbjs/lib/invariant')
 
-import type { ViewProps } from 'ViewPropTypes';
-
-const RCTDatePickerIOS = requireNativeComponent('RNDatePicker');
-
-type Event = Object;
-
-type Props = $ReadOnly<{|
-  ...ViewProps,
-
-  /**
-   * The currently selected date.
-   */
-  date ?: ? Date,
-
-  /**
-   * Provides an initial value that will change when the user starts selecting
-   * a date. It is useful for simple use-cases where you do not want to deal
-   * with listening to events and updating the date prop to keep the
-   * controlled state in sync. The controlled state has known bugs which
-   * causes it to go out of sync with native. The initialDate prop is intended
-   * to allow you to have native be source of truth.
-   */
-  initialDate ?: ? Date,
-
-  /**
-   * The date picker locale.
-   */
-  locale ?: ? string,
-
-  /**
-   * Maximum date.
-   *
-   * Restricts the range of possible date/time values.
-   */
-  maximumDate ?: ? Date,
-
-  /**
-   * Minimum date.
-   *
-   * Restricts the range of possible date/time values.
-   */
-  minimumDate ?: ? Date,
-
-  /**
-   * The interval at which minutes can be selected.
-   */
-  minuteInterval ?: ? (1 | 2 | 3 | 4 | 5 | 6 | 10 | 12 | 15 | 20 | 30),
-
-  /**
-   * The date picker mode.
-   */
-  mode ?: ? ('date' | 'time' | 'datetime'),
-
-  /**
-   * Date change handler.
-   *
-   * This is called when the user changes the date or time in the UI.
-   * The first and only argument is an Event. For getting the date the picker
-   * was changed to, use onDateChange instead.
-   */
-  onChange ?: ? (event: Event) => void,
-
-  /**
-   * Date change handler.
-   *
-   * This is called when the user changes the date or time in the UI.
-   * The first and only argument is a Date object representing the new
-   * date and time.
-   */
-  onDateChange: (date: Date) => void,
-
-    /**
-     * Timezone offset in minutes.
-     *
-     * By default, the date picker will use the device's timezone. With this
-     * parameter, it is possible to force a certain timezone offset. For
-     * instance, to show times in Pacific Standard Time, pass -7 * 60.
-     */
-    timeZoneOffsetInMinutes ?: ? number,
-|}>;
+const RCTDatePickerIOS = requireNativeComponent('RNDatePicker')
 
 /**
  * Use `DatePickerIOS` to render a date/time picker (selector) on iOS.  This is
@@ -106,52 +25,48 @@ type Props = $ReadOnly<{|
  * the user's change will be reverted immediately to reflect `props.date` as the
  * source of truth.
  */
-export default class DatePickerIOS extends React.Component<Props> {
+export default class DatePickerIOS extends React.Component {
   static DefaultProps = {
     mode: 'datetime',
-  };
+  }
 
   // $FlowFixMe How to type a native component to be able to call setNativeProps
-  _picker: ?React.ElementRef<typeof RCTDatePickerIOS> = null;
+  _picker = null
 
   componentDidUpdate() {
     if (this.props.date) {
-      const propsTimeStamp = this.props.date.getTime();
+      const propsTimeStamp = this.props.date.getTime()
       if (this._picker) {
         this._picker.setNativeProps({
           date: propsTimeStamp,
-        });
+        })
       }
     }
   }
 
-  _onChange = (event: Event) => {
-    const nativeTimeStamp = event.nativeEvent.timestamp;
+  _onChange = event => {
+    const nativeTimeStamp = event.nativeEvent.timestamp
     this.props.onDateChange &&
-      this.props.onDateChange(new Date(nativeTimeStamp));
-    this.props.onChange && this.props.onChange(event);
-  };
+      this.props.onDateChange(new Date(nativeTimeStamp))
+    this.props.onChange && this.props.onChange(event)
+  }
 
   render() {
-    const props = this.props;
+    const props = this.props
     if (__DEV__) throwIfInvalidProps(props)
-    invariant(
-      props.date || props.initialDate,
-      'A selected date or initial date should be specified.',
-    );
     return (
       <RCTDatePickerIOS
         key={this.props.textColor} // preventing "Today" string keep old text color when text color changes
         ref={picker => {
-          this._picker = picker;
+          this._picker = picker
         }}
         style={[styles.datePickerIOS, props.style]}
         date={
           props.date
             ? props.date.getTime()
             : props.initialDate
-              ? props.initialDate.getTime()
-              : undefined
+            ? props.initialDate.getTime()
+            : undefined
         }
         locale={props.locale ? props.locale : undefined}
         maximumDate={
@@ -168,7 +83,7 @@ export default class DatePickerIOS extends React.Component {
         onResponderTerminationRequest={() => false}
         textColor={props.textColor}
       />
-    );
+    )
   }
 }
 
@@ -177,4 +92,4 @@ const styles = StyleSheet.create({
     height: 216,
     width: 310,
   },
-});
+})

examples/advanced/.eslintrc.js

@@ -1,4 +1,4 @@
 module.exports = {
   root: true,
   extends: '@react-native-community',
-};
+}

examples/advanced/.watchmanconfig

@@ -1 +1 @@
-{}
+{}

examples/advanced/__tests__/App-test.js

@@ -2,13 +2,13 @@
  * @format
  */
 
-import 'react-native';
-import React from 'react';
-import App from '../App';
+import 'react-native'
+import React from 'react'
+import App from '../App'
 
 // Note: test renderer must be required after react-native.
-import renderer from 'react-test-renderer';
+import renderer from 'react-test-renderer'
 
 it('renders correctly', () => {
-  renderer.create(<App />);
-});
+  renderer.create(<App />)
+})

examples/advanced/app.json

@@ -1,4 +1,4 @@
 {
-  "name": "rn602",
-  "displayName": "DatePicker"
+    "name": "rn602",
+    "displayName": "DatePicker"
 }

examples/advanced/babel.config.js

@@ -1,3 +1,3 @@
 module.exports = {
   presets: ['module:metro-react-native-babel-preset'],
-};
+}

examples/advanced/index.js

@@ -1,9 +1,5 @@
-/**
- * @format
- */
+import { AppRegistry } from 'react-native'
+import App from './src/App'
+import { name as appName } from './app.json'
 
-import {AppRegistry} from 'react-native';
-import App from './src/App';
-import {name as appName} from './app.json';
-
-AppRegistry.registerComponent(appName, () => App);
+AppRegistry.registerComponent(appName, () => App)

examples/advanced/metro.config.js

@@ -14,4 +14,4 @@ module.exports = {
       },
     }),
   },
-};
+}

examples/advanced/package.json

@@ -1,28 +1,28 @@
 {
-  "name": "rn602",
-  "version": "0.0.1",
-  "private": true,
-  "scripts": {
-    "start": "react-native start",
-    "test": "jest",
-    "lint": "eslint ."
-  },
-  "dependencies": {
-    "react": "16.8.6",
-    "react-native": "0.60.3",
-    "react-native-date-picker": "^2.5.0"
-  },
-  "devDependencies": {
-    "@babel/core": "^7.5.4",
-    "@babel/runtime": "^7.5.4",
-    "@react-native-community/eslint-config": "^0.0.5",
-    "babel-jest": "^24.8.0",
-    "eslint": "^6.0.1",
-    "jest": "^24.8.0",
-    "metro-react-native-babel-preset": "^0.55.0",
-    "react-test-renderer": "16.8.6"
-  },
-  "jest": {
-    "preset": "react-native"
-  }
+    "name": "rn602",
+    "version": "0.0.1",
+    "private": true,
+    "scripts": {
+        "start": "react-native start",
+        "test": "jest",
+        "lint": "eslint ."
+    },
+    "dependencies": {
+        "react": "16.8.6",
+        "react-native": "0.60.3",
+        "react-native-date-picker": "^2.6.1"
+    },
+    "devDependencies": {
+        "@babel/core": "^7.5.4",
+        "@babel/runtime": "^7.5.4",
+        "@react-native-community/eslint-config": "^0.0.5",
+        "babel-jest": "^24.8.0",
+        "eslint": "^6.0.1",
+        "jest": "^24.8.0",
+        "metro-react-native-babel-preset": "^0.55.0",
+        "react-test-renderer": "16.8.6"
+    },
+    "jest": {
+        "preset": "react-native"
+    }
 }

examples/advanced/src/App.js

@@ -1,32 +1,40 @@
-import React, { Component } from 'react';
-import { ScrollView, StyleSheet, Text, TouchableOpacity } from 'react-native';
-import examples from './examples';
+import React, { Component } from 'react'
+import { ScrollView, StyleSheet, Text, TouchableOpacity } from 'react-native'
+import examples from './examples'
 
 export default class App extends Component {
-
   state = {
     picker: undefined,
-    backgroundColor: "#ffffff";,
+    backgroundColor: '#ffffff';,
   }
 
   render() {
     return (
       <ScrollView
-        style={[styles.container, { backgroundColor: this.state.backgroundColor }]}
-        contentContainerStyle={styles.content}>
+        style={[
+          styles.container,
+          { backgroundColor: this.state.backgroundColor },
+        ]}
+        contentContainerStyle={styles.content}
+      >
         <Text style={styles.header}>{!this.state.picker && 'Examples'}</Text>
         {!this.state.picker && this.renderButtons()}
         {!!this.state.picker && this.renderBackButton()}
         {!!this.state.picker && this.renderPicker()}
       </ScrollView>
-    );
+    )
   }
 
   setBackgroundColor = backgroundColor => this.setState({ backgroundColor })
 
   renderPicker = () => {
-    const Picker = examples[this.state.picker].component;
-    return <Picker backgroundColor={this.state.backgroundColor} setBackground={this.setBackgroundColor} />
+    const Picker = examples[this.state.picker].component
+    return (
+      <Picker
+        backgroundColor={this.state.backgroundColor}
+        setBackground={this.setBackgroundColor}
+      />
+    )
   }
 
   renderButtons = () =>
@@ -34,7 +42,7 @@ export default class App extends Component {
       .filter(key => key !== this.state.picker)
       .map(this.renderButton)
 
-  renderButton = (key) => (
+  renderButton = key => (
     <TouchableOpacity
       key={key}
       onPress={() => this.setState({ picker: key })}
@@ -44,21 +52,20 @@ export default class App extends Component {
     </TouchableOpacity>
   )
 
-  renderBackButton = (key) => (
+  renderBackButton = key => (
     <TouchableOpacity
       onPress={() => this.setState({ picker: undefined })}
-      style={{ margin: 10, position: 'absolute', top: 0, left: 10, }}
+      style={{ margin: 10, position: 'absolute', top: 0, left: 10 }}
     >
       <Text style={styles.text}>Back</Text>
     </TouchableOpacity>
   )
-
 }
 
 const styles = StyleSheet.create({
   container: {
     paddingTop: 15,
-    borderWidth:1,
+    borderWidth: 1,
   },
   content: {
     alignItems: 'center',
@@ -71,5 +78,5 @@ const styles = StyleSheet.create({
     color: 'black',
     fontSize: 22,
     margin: 20,
-  }
+  },
 })

examples/advanced/src/PropButton.js

@@ -1,4 +1,6 @@
-import React, { Component } from 'react';
-import { Button } from 'react-native';
+import React, { Component } from 'react'
+import { Button } from 'react-native'
 
-export const PropButton = ({ title, value, onChange }) => <Button title={title} onPress={() => onChange(value)} />
+export const PropButton = ({ title, value, onChange }) => (
+  <Button title={title} onPress={() => onChange(value)} />
+)

examples/advanced/src/PropSlider.js

@@ -1,56 +1,63 @@
-import React, { Component } from 'react';
-import { Dimensions, FlatList, StyleSheet, Text, TouchableOpacity } from 'react-native';
+import React, { Component } from 'react'
+import {
+  Dimensions,
+  FlatList,
+  StyleSheet,
+  Text,
+  TouchableOpacity,
+} from 'react-native'
 
 const { width, height } = Dimensions.get('screen')
 
 export default class PropSlider extends Component {
-
-    render() {
-        return (
-            <FlatList
-                horizontal
-                style={styles.list}
-                data={this.data()}
-                renderItem={this.renderItem}
-                contentContainerStyle={styles.content}
-                keyExtractor={item => item.name}
-            />
-        )
-    }
-
-    data = () => this.props.data.map(prop => (prop.selected = this.props.selectedProp === prop.name, prop))
-
-    onPress = index => () => this.props.onSelect(this.props.data[index].name)
-
-    renderItem = ({ item, index }) => (
-        <TouchableOpacity
-            key={item.name}
-            style={[styles.item, this.getStyle(item)]}
-            onPress={this.onPress(index)}
-        >
-            <Text key={item.name}>{item.name}</Text>
-        </TouchableOpacity>
+  render() {
+    return (
+      <FlatList
+        horizontal
+        style={styles.list}
+        data={this.data()}
+        renderItem={this.renderItem}
+        contentContainerStyle={styles.content}
+        keyExtractor={item => item.name}
+      />
     )
+  }
 
-    getStyle = (item) => ({
-        backgroundColor: item.selected ? '#82e584' : '#abcdef',
-        width: this.props.width ? this.props.width : 100,
-        height: 30,
-    })
+  data = () =>
+    this.props.data.map(
+      prop => ((prop.selected = this.props.selectedProp === prop.name), prop)
+    )
 
+  onPress = index => () => this.props.onSelect(this.props.data[index].name)
+
+  renderItem = ({ item, index }) => (
+    <TouchableOpacity
+      key={item.name}
+      style={[styles.item, this.getStyle(item)]}
+      onPress={this.onPress(index)}
+    >
+      <Text key={item.name}>{item.name}</Text>
+    </TouchableOpacity>
+  )
+
+  getStyle = item => ({
+    backgroundColor: item.selected ? '#82e584' : '#abcdef',
+    width: this.props.width ? this.props.width : 100,
+    height: 30,
+  })
 }
 
 const styles = StyleSheet.create({
-    list: {
-        width,
-    },
-    content: {
-        padding: 20,
-    },
-    item: {
-        justifyContent: 'center',
-        alignItems: 'center',
-        marginHorizontal: 5,
-        borderRadius: 10,
-    },
-})
+  list: {
+    width,
+  },
+  content: {
+    padding: 20,
+  },
+  item: {
+    justifyContent: 'center',
+    alignItems: 'center',
+    marginHorizontal: 5,
+    borderRadius: 10,
+  },
+})

examples/advanced/src/exampleKeys.js

@@ -1,6 +1,6 @@
 export const EXAMPLE_KEYS = {
-    MINIMAL : 'MINIMAL',
-    ADVANCED : 'ADVANCED',
-    TIME_MODE : 'TIME_MODE',
-    DATE_MODE : 'DATE_MODE',
-}
+  MINIMAL: 'MINIMAL',
+  ADVANCED: 'ADVANCED',
+  TIME_MODE: 'TIME_MODE',
+  DATE_MODE: 'DATE_MODE',
+}

examples/advanced/src/examples.js

@@ -3,23 +3,23 @@ import Minimal from './examples/Minimal'
 import Advanced from './examples/Advanced'
 import TimeMode from './examples/TimeMode'
 import { EXAMPLE_KEYS } from './exampleKeys'
-import DateMode from './examples/DateMode';
+import DateMode from './examples/DateMode'
 
 export default {
-    [EXAMPLE_KEYS.MINIMAL]: {
-        buttonTitle: 'Minimal',
-        component: Minimal
-    },
-    [EXAMPLE_KEYS.ADVANCED]: {
-        buttonTitle: 'Advanced',
-        component: Advanced
-    },
-    [EXAMPLE_KEYS.TIME_MODE]: {
-        buttonTitle: 'Time mode',
-        component: TimeMode
-    },
-    [EXAMPLE_KEYS.DATE_MODE]: {
-        buttonTitle: 'Date mode',
-        component: DateMode
-    }
+  [EXAMPLE_KEYS.MINIMAL]: {
+    buttonTitle: 'Minimal',
+    component: Minimal,
+  },
+  [EXAMPLE_KEYS.ADVANCED]: {
+    buttonTitle: 'Advanced',
+    component: Advanced,
+  },
+  [EXAMPLE_KEYS.TIME_MODE]: {
+    buttonTitle: 'Time mode',
+    component: TimeMode,
+  },
+  [EXAMPLE_KEYS.DATE_MODE]: {
+    buttonTitle: 'Date mode',
+    component: DateMode,
+  },
 }

examples/advanced/src/examples/Advanced.js

@@ -1,28 +1,33 @@
-import React, { Component } from 'react';
-import { StyleSheet, Text, View } from 'react-native';
-import DatePicker from 'react-native-date-picker';
-import DateChange from '../propPickers/DateChange';
-import FadeToColor from '../propPickers/FadeToColor';
-import LocalePicker from '../propPickers/LocalePicker';
-import MinMaxDateChange from '../propPickers/MinMaxDateChange';
-import ModePicker from '../propPickers/ModePicker';
-import TextColor from '../propPickers/TextColor';
-import TimeZoneOffsetInMinutes from '../propPickers/TimeZoneOffsetInMinutes';
-import PropSlider from '../PropSlider';
-import MinuteInterval from '../propPickers/MinuteInterval';
+import React, { Component } from 'react'
+import { StyleSheet, Text, View } from 'react-native'
+import DatePicker from 'react-native-date-picker'
+import DateChange from '../propPickers/DateChange'
+import FadeToColor from '../propPickers/FadeToColor'
+import LocalePicker from '../propPickers/LocalePicker'
+import MinMaxDateChange from '../propPickers/MinMaxDateChange'
+import ModePicker from '../propPickers/ModePicker'
+import TextColor from '../propPickers/TextColor'
+import TimeZoneOffsetInMinutes from '../propPickers/TimeZoneOffsetInMinutes'
+import PropSlider from '../PropSlider'
+import MinuteInterval from '../propPickers/MinuteInterval'
 
-Date.prototype.addHours = function (h) {
-  this.setTime(this.getTime() + (h * 60 * 60 * 1000));
-  return this;
+Date.prototype.addHours = function(h) {
+  this.setTime(this.getTime() + h * 60 * 60 * 1000)
+  return this
 }
 
-export const defaultMinDate = new Date().addHours(-24 * 5);
-export const defaultMaxDate = new Date().addHours(24 * 5);
+export const defaultMinDate = new Date().addHours(-24 * 5)
+export const defaultMaxDate = new Date().addHours(24 * 5)
 
-export const readableDate = date => date ? date.toISOString().substr(0, 19).replace('T', ' ') : 'undefined'
+export const readableDate = date =>
+  date
+    ? date
+        .toISOString()
+        .substr(0, 19)
+        .replace('T', ' ')
+    : 'undefined'
 
 export default class Advanced extends Component {
-
   state = {
     chosenDate: new Date(),
     searchTerm: '',
@@ -68,50 +73,91 @@ export default class Advanced extends Component {
 
   propertyList = () => [
     {
-      name: 'mode', component:
-        <ModePicker selected={this.state.mode} onChange={mode => this.setState({ mode })} />
+      name: 'mode',
+      component: (
+        <ModePicker
+          selected={this.state.mode}
+          onChange={mode => this.setState({ mode })}
+        />
+      ),
     },
     {
-      name: 'locale', component:
-        <LocalePicker locale={this.state.locale} onChange={locale => this.setState({ locale })} />
+      name: 'locale',
+      component: (
+        <LocalePicker
+          locale={this.state.locale}
+          onChange={locale => this.setState({ locale })}
+        />
+      ),
     },
     {
-      name: 'timeZoneOffset', component:
-        <TimeZoneOffsetInMinutes onChange={timeZoneOffsetInMinutes => this.setState({ timeZoneOffsetInMinutes })} />
+      name: 'timeZoneOffset',
+      component: (
+        <TimeZoneOffsetInMinutes
+          onChange={timeZoneOffsetInMinutes =>
+            this.setState({ timeZoneOffsetInMinutes })
+          }
+        />
+      ),
     },
     {
-      name: 'date', component:
-        <DateChange value={this.state.chosenDate} onChange={chosenDate => this.setState({ chosenDate })} />
+      name: 'date',
+      component: (
+        <DateChange
+          value={this.state.chosenDate}
+          onChange={chosenDate => this.setState({ chosenDate })}
+        />
+      ),
     },
     {
-      name: 'minuteInterval', component:
-        <MinuteInterval value={this.state.minuteInterval} onChange={minuteInterval => this.setState({ minuteInterval })} />
+      name: 'minuteInterval',
+      component: (
+        <MinuteInterval
+          value={this.state.minuteInterval}
+          onChange={minuteInterval => this.setState({ minuteInterval })}
+        />
+      ),
     },
     {
-      name: 'minDate', component:
-        <MinMaxDateChange value={this.state.minDate} onChange={minDate => this.setState({ minDate })}
+      name: 'minDate',
+      component: (
+        <MinMaxDateChange
+          value={this.state.minDate}
+          onChange={minDate => this.setState({ minDate })}
           defaultDate={defaultMinDate}
         />
+      ),
     },
     {
-      name: 'maxDate', component:
-        <MinMaxDateChange value={this.state.maxDate} onChange={maxDate => this.setState({ maxDate })}
-          defaultDate={defaultMaxDate} />
+      name: 'maxDate',
+      component: (
+        <MinMaxDateChange
+          value={this.state.maxDate}
+          onChange={maxDate => this.setState({ maxDate })}
+          defaultDate={defaultMaxDate}
+        />
+      ),
     },
     {
-      name: 'fadeToColor', component:
+      name: 'fadeToColor',
+      component: (
         <FadeToColor onChange={() => this.props.setBackground(randomColor())} />
+      ),
     },
     {
-      name: 'textColor', component:
-        <TextColor onChange={() => this.setState({ textColor: randomColor() })} />
+      name: 'textColor',
+      component: (
+        <TextColor
+          onChange={() => this.setState({ textColor: randomColor() })}
+        />
+      ),
     },
   ]
 
-  selectedPropData = () => this.propertyList().find(p => p.name === this.state.selectedProp)
+  selectedPropData = () =>
+    this.propertyList().find(p => p.name === this.state.selectedProp)
   onSelect = selectedProp => this.setState({ selectedProp })
   setDate = newDate => this.setState({ chosenDate: newDate })
-
 }
 
 const styles = StyleSheet.create({
@@ -132,9 +178,10 @@ const styles = StyleSheet.create({
   },
 })
 
-const randomColor = () => '#' + pad(Math.floor(Math.random() * 16777215).toString(16), 6);
+const randomColor = () =>
+  '#' + pad(Math.floor(Math.random() * 16777215).toString(16), 6)
 
 function pad(n, width) {
-  n = n + '';
-  return n.length >= width ? n : new Array(width - n.length + 1).join('0') + n;
-}
+  n = n + ''
+  return n.length >= width ? n : new Array(width - n.length + 1).join('0') + n
+}

examples/advanced/src/examples/DateMode.js

@@ -1,15 +1,14 @@
-import React, { Component } from 'react';
-import DatePicker from 'react-native-date-picker';
+import React, { Component } from 'react'
+import DatePicker from 'react-native-date-picker'
 
 export default class DateMode extends Component {
-
   state = { date: new Date() }
 
-  render = () =>
+  render = () => (
     <DatePicker
       date={this.state.date}
       onDateChange={date => this.setState({ date })}
       mode={'date'}
     />
-
+  )
 }

examples/advanced/src/examples/Minimal.js

@@ -1,14 +1,13 @@
-import React, { Component } from 'react';
-import DatePicker from 'react-native-date-picker';
+import React, { Component } from 'react'
+import DatePicker from 'react-native-date-picker'
 
 export default class MinimalExample extends Component {
-
   state = { date: new Date() }
 
-  render = () =>
+  render = () => (
     <DatePicker
       date={this.state.date}
-      onDateChange={date => this.setState({ date })} 
+      onDateChange={date => this.setState({ date })}
     />
-
+  )
 }

examples/advanced/src/examples/TimeMode.js

@@ -1,15 +1,14 @@
-import React, { Component } from 'react';
-import DatePicker from 'react-native-date-picker';
+import React, { Component } from 'react'
+import DatePicker from 'react-native-date-picker'
 
 export default class TimeMode extends Component {
-
   state = { date: new Date() }
 
-  render = () =>
+  render = () => (
     <DatePicker
       date={this.state.date}
       onDateChange={date => this.setState({ date })}
       mode={'time'}
     />
-
+  )
 }

examples/advanced/src/locales.js

@@ -1,212 +1,212 @@
 export default [
-    'af-ZA',
-    'am-ET',
-    'ar-AE',
-    'ar-BH',
-    'ar-DZ',
-    'ar-EG',
-    'ar-IQ',
-    'ar-JO',
-    'ar-KW',
-    'ar-LB',
-    'ar-LY',
-    'ar-MA',
-    'arn-CL',
-    'ar-OM',
-    'ar-QA',
-    'ar-SA',
-    'ar-SY',
-    'ar-TN',
-    'ar-YE',
-    'as-IN',
-    'az-Cyrl-AZ',
-    'az-Latn-AZ',
-    'ba-RU',
-    'be-BY',
-    'bg-BG',
-    'bn-BD',
-    'bn-IN',
-    'bo-CN',
-    'br-FR',
-    'bs-Cyrl-BA',
-    'bs-Latn-BA',
-    'ca-ES',
-    'co-FR',
-    'cs-CZ',
-    'cy-GB',
-    'da-DK',
-    'de-AT',
-    'de-CH',
-    'de-DE',
-    'de-LI',
-    'de-LU',
-    'dsb-DE',
-    'dv-MV',
-    'el-GR',
-    'en-029',
-    'en-AU',
-    'en-BZ',
-    'en-CA',
-    'en-GB',
-    'en-IE',
-    'en-IN',
-    'en-JM',
-    'en-MY',
-    'en-NZ',
-    'en-PH',
-    'en-SG',
-    'en-TT',
-    'en-US',
-    'en-ZA',
-    'en-ZW',
-    'es-AR',
-    'es-BO',
-    'es-CL',
-    'es-CO',
-    'es-CR',
-    'es-DO',
-    'es-EC',
-    'es-ES',
-    'es-GT',
-    'es-HN',
-    'es-MX',
-    'es-NI',
-    'es-PA',
-    'es-PE',
-    'es-PR',
-    'es-PY',
-    'es-SV',
-    'es-US',
-    'es-UY',
-    'es-VE',
-    'et-EE',
-    'eu-ES',
-    'fa-IR',
-    'fi-FI',
-    'fil-PH',
-    'fo-FO',
-    'fr-BE',
-    'fr-CA',
-    'fr-CH',
-    'fr-FR',
-    'fr-LU',
-    'fr-MC',
-    'fy-NL',
-    'ga-IE',
-    'gd-GB',
-    'gl-ES',
-    'gsw-FR',
-    'gu-IN',
-    'ha-Latn-NG',
-    'he-IL',
-    'hi-IN',
-    'hr-BA',
-    'hr-HR',
-    'hsb-DE',
-    'hu-HU',
-    'hy-AM',
-    'id-ID',
-    'ig-NG',
-    'ii-CN',
-    'is-IS',
-    'it-CH',
-    'it-IT',
-    'iu-Cans-CA',
-    'iu-Latn-CA',
-    'ja-JP',
-    'ka-GE',
-    'kk-KZ',
-    'kl-GL',
-    'km-KH',
-    'kn-IN',
-    'kok-IN',
-    'ko-KR',
-    'ky-KG',
-    'lb-LU',
-    'lo-LA',
-    'lt-LT',
-    'lv-LV',
-    'mi-NZ',
-    'mk-MK',
-    'ml-IN',
-    'mn-MN',
-    'mn-Mong-CN',
-    'moh-CA',
-    'mr-IN',
-    'ms-BN',
-    'ms-MY',
-    'mt-MT',
-    'nb-NO',
-    'ne-NP',
-    'nl-BE',
-    'nl-NL',
-    'nn-NO',
-    'nso-ZA',
-    'oc-FR',
-    'or-IN',
-    'pa-IN',
-    'pl-PL',
-    'prs-AF',
-    'ps-AF',
-    'pt-BR',
-    'pt-PT',
-    'qut-GT',
-    'quz-BO',
-    'quz-EC',
-    'quz-PE',
-    'rm-CH',
-    'ro-RO',
-    'ru-RU',
-    'rw-RW',
-    'sah-RU',
-    'sa-IN',
-    'se-FI',
-    'se-NO',
-    'se-SE',
-    'si-LK',
-    'sk-SK',
-    'sl-SI',
-    'sma-NO',
-    'sma-SE',
-    'smj-NO',
-    'smj-SE',
-    'smn-FI',
-    'sms-FI',
-    'sq-AL',
-    'sr-Cyrl-BA',
-    'sr-Cyrl-CS',
-    'sr-Cyrl-ME',
-    'sr-Cyrl-RS',
-    'sr-Latn-BA',
-    'sr-Latn-CS',
-    'sr-Latn-ME',
-    'sr-Latn-RS',
-    'sv-FI',
-    'sv-SE',
-    'sw-KE',
-    'syr-SY',
-    'ta-IN',
-    'te-IN',
-    'tg-Cyrl-TJ',
-    'th-TH',
-    'tk-TM',
-    'tn-ZA',
-    'tr-TR',
-    'tt-RU',
-    'tzm-Latn-DZ',
-    'ug-CN',
-    'uk-UA',
-    'ur-PK',
-    'uz-Cyrl-UZ',
-    'uz-Latn-UZ',
-    'vi-VN',
-    'wo-SN',
-    'xh-ZA',
-    'yo-NG',
-    'zh-CN',
-    'zh-HK',
-    'zh-MO',
-    'zh-SG',
-    'zh-TW',
-    'zu-ZA',
-]
+  'af-ZA',
+  'am-ET',
+  'ar-AE',
+  'ar-BH',
+  'ar-DZ',
+  'ar-EG',
+  'ar-IQ',
+  'ar-JO',
+  'ar-KW',
+  'ar-LB',
+  'ar-LY',
+  'ar-MA',
+  'arn-CL',
+  'ar-OM',
+  'ar-QA',
+  'ar-SA',
+  'ar-SY',
+  'ar-TN',
+  'ar-YE',
+  'as-IN',
+  'az-Cyrl-AZ',
+  'az-Latn-AZ',
+  'ba-RU',
+  'be-BY',
+  'bg-BG',
+  'bn-BD',
+  'bn-IN',
+  'bo-CN',
+  'br-FR',
+  'bs-Cyrl-BA',
+  'bs-Latn-BA',
+  'ca-ES',
+  'co-FR',
+  'cs-CZ',
+  'cy-GB',
+  'da-DK',
+  'de-AT',
+  'de-CH',
+  'de-DE',
+  'de-LI',
+  'de-LU',
+  'dsb-DE',
+  'dv-MV',
+  'el-GR',
+  'en-029',
+  'en-AU',
+  'en-BZ',
+  'en-CA',
+  'en-GB',
+  'en-IE',
+  'en-IN',
+  'en-JM',
+  'en-MY',
+  'en-NZ',
+  'en-PH',
+  'en-SG',
+  'en-TT',
+  'en-US',
+  'en-ZA',
+  'en-ZW',
+  'es-AR',
+  'es-BO',
+  'es-CL',
+  'es-CO',
+  'es-CR',
+  'es-DO',
+  'es-EC',
+  'es-ES',
+  'es-GT',
+  'es-HN',
+  'es-MX',
+  'es-NI',
+  'es-PA',
+  'es-PE',
+  'es-PR',
+  'es-PY',
+  'es-SV',
+  'es-US',
+  'es-UY',
+  'es-VE',
+  'et-EE',
+  'eu-ES',
+  'fa-IR',
+  'fi-FI',
+  'fil-PH',
+  'fo-FO',
+  'fr-BE',
+  'fr-CA',
+  'fr-CH',
+  'fr-FR',
+  'fr-LU',
+  'fr-MC',
+  'fy-NL',
+  'ga-IE',
+  'gd-GB',
+  'gl-ES',
+  'gsw-FR',
+  'gu-IN',
+  'ha-Latn-NG',
+  'he-IL',
+  'hi-IN',
+  'hr-BA',
+  'hr-HR',
+  'hsb-DE',
+  'hu-HU',
+  'hy-AM',
+  'id-ID',
+  'ig-NG',
+  'ii-CN',
+  'is-IS',
+  'it-CH',
+  'it-IT',
+  'iu-Cans-CA',
+  'iu-Latn-CA',
+  'ja-JP',
+  'ka-GE',
+  'kk-KZ',
+  'kl-GL',
+  'km-KH',
+  'kn-IN',
+  'kok-IN',
+  'ko-KR',
+  'ky-KG',
+  'lb-LU',
+  'lo-LA',
+  'lt-LT',
+  'lv-LV',
+  'mi-NZ',
+  'mk-MK',
+  'ml-IN',
+  'mn-MN',
+  'mn-Mong-CN',
+  'moh-CA',
+  'mr-IN',
+  'ms-BN',
+  'ms-MY',
+  'mt-MT',
+  'nb-NO',
+  'ne-NP',
+  'nl-BE',
+  'nl-NL',
+  'nn-NO',
+  'nso-ZA',
+  'oc-FR',
+  'or-IN',
+  'pa-IN',
+  'pl-PL',
+  'prs-AF',
+  'ps-AF',
+  'pt-BR',
+  'pt-PT',
+  'qut-GT',
+  'quz-BO',
+  'quz-EC',
+  'quz-PE',
+  'rm-CH',
+  'ro-RO',
+  'ru-RU',
+  'rw-RW',
+  'sah-RU',
+  'sa-IN',
+  'se-FI',
+  'se-NO',
+  'se-SE',
+  'si-LK',
+  'sk-SK',
+  'sl-SI',
+  'sma-NO',
+  'sma-SE',
+  'smj-NO',
+  'smj-SE',
+  'smn-FI',
+  'sms-FI',
+  'sq-AL',
+  'sr-Cyrl-BA',
+  'sr-Cyrl-CS',
+  'sr-Cyrl-ME',
+  'sr-Cyrl-RS',
+  'sr-Latn-BA',
+  'sr-Latn-CS',
+  'sr-Latn-ME',
+  'sr-Latn-RS',
+  'sv-FI',
+  'sv-SE',
+  'sw-KE',
+  'syr-SY',
+  'ta-IN',
+  'te-IN',
+  'tg-Cyrl-TJ',
+  'th-TH',
+  'tk-TM',
+  'tn-ZA',
+  'tr-TR',
+  'tt-RU',
+  'tzm-Latn-DZ',
+  'ug-CN',
+  'uk-UA',
+  'ur-PK',
+  'uz-Cyrl-UZ',
+  'uz-Latn-UZ',
+  'vi-VN',
+  'wo-SN',
+  'xh-ZA',
+  'yo-NG',
+  'zh-CN',
+  'zh-HK',
+  'zh-MO',
+  'zh-SG',
+  'zh-TW',
+  'zu-ZA',
+]

examples/advanced/src/propPickers/DateChange.js

@@ -1,26 +1,45 @@
-import React, { Component } from 'react';
-import { Dimensions, Button, View, StyleSheet, ScrollView, Text, TouchableOpacity } from 'react-native';
+import React, { Component } from 'react'
+import {
+  Dimensions,
+  Button,
+  View,
+  StyleSheet,
+  ScrollView,
+  Text,
+  TouchableOpacity,
+} from 'react-native'
 
 export default class extends Component {
-
-    render() {
-        return (
-            <React.Fragment>
-                <Button title='Add 1 min'
-                    onPress={() => this.props.onChange(
-                        new Date(this.props.value.getTime() + 60 * 1000)
-                    )} />
-                <Text />
-                <Button title='Add 1 hour'
-                    onPress={() => this.props.onChange(
-                        new Date(this.props.value.getTime() + 60 * 60 * 1000)
-                    )} />
-                <Text />
-                <Button title='Add 24 hours'
-                    onPress={() => this.props.onChange(
-                        new Date(this.props.value.getTime() + 60 * 60 * 24 * 1000)
-                    )} />
-            </React.Fragment>
-        );
-    }
-}
+  render() {
+    return (
+      <React.Fragment>
+        <Button
+          title="Add 1 min"
+          onPress={() =>
+            this.props.onChange(
+              new Date(this.props.value.getTime() + 60 * 1000)
+            )
+          }
+        />
+        <Text />
+        <Button
+          title="Add 1 hour"
+          onPress={() =>
+            this.props.onChange(
+              new Date(this.props.value.getTime() + 60 * 60 * 1000)
+            )
+          }
+        />
+        <Text />
+        <Button
+          title="Add 24 hours"
+          onPress={() =>
+            this.props.onChange(
+              new Date(this.props.value.getTime() + 60 * 60 * 24 * 1000)
+            )
+          }
+        />
+      </React.Fragment>
+    )
+  }
+}

examples/advanced/src/propPickers/FadeToColor.js

@@ -1,12 +1,8 @@
-import React, { Component } from 'react';
-import { Button } from 'react-native';
+import React, { Component } from 'react'
+import { Button } from 'react-native'
 
 export default class extends Component {
-
-    render() {
-        return (
-            <Button title={'Change color'} onPress={this.props.onChange} />
-        );
-    }
-
-}
+  render() {
+    return <Button title={'Change color'} onPress={this.props.onChange} />
+  }
+}

examples/advanced/src/propPickers/LocalePicker.js

@@ -1,40 +1,39 @@
-import React, { Component } from 'react';
-import locales from '../locales';
-import PropSlider from '../PropSlider';
+import React, { Component } from 'react'
+import locales from '../locales'
+import PropSlider from '../PropSlider'
 
-const data = locales.map(key => ({ name: key }));
+const data = locales.map(key => ({ name: key }))
 
-const split1 = Math.floor(data.length / 3);
-const split2 = Math.floor(2 * data.length / 3);
+const split1 = Math.floor(data.length / 3)
+const split2 = Math.floor((2 * data.length) / 3)
 
-const data1 = data.slice(0, split1);
-const data2 = data.slice(split1, split2);
-const data3 = data.slice(split2);
+const data1 = data.slice(0, split1)
+const data2 = data.slice(split1, split2)
+const data3 = data.slice(split2)
 
 export default class LocalPicker extends Component {
-
-    render() {
-        return (
-            <React.Fragment>
-                <PropSlider
-                    selectedProp={this.props.locale}
-                    onSelect={this.props.onChange}
-                    data={data1}
-                    width={50}
-                />
-                 <PropSlider
-                    selectedProp={this.props.locale}
-                    onSelect={this.props.onChange}
-                    data={data2}
-                    width={50}
-                />
-                <PropSlider
-                    selectedProp={this.props.locale}
-                    onSelect={this.props.onChange}
-                    data={data3}
-                    width={50}
-                />
-            </React.Fragment>
-        );
-    }
-}
+  render() {
+    return (
+      <React.Fragment>
+        <PropSlider
+          selectedProp={this.props.locale}
+          onSelect={this.props.onChange}
+          data={data1}
+          width={50}
+        />
+        <PropSlider
+          selectedProp={this.props.locale}
+          onSelect={this.props.onChange}
+          data={data2}
+          width={50}
+        />
+        <PropSlider
+          selectedProp={this.props.locale}
+          onSelect={this.props.onChange}
+          data={data3}
+          width={50}
+        />
+      </React.Fragment>
+    )
+  }
+}

examples/advanced/src/propPickers/MinMaxDateChange.js

@@ -1,41 +1,55 @@
-import React, { Component } from 'react';
-import { Text, Button, View, StyleSheet } from 'react-native';
+import React, { Component } from 'react'
+import { Text, Button, View, StyleSheet } from 'react-native'
 import { readableDate } from '../examples/Advanced'
-import { PropButton } from '../PropButton';
+import { PropButton } from '../PropButton'
 
 export default class extends Component {
+  render() {
+    const { onChange, defaultDate } = this.props
+    return (
+      <React.Fragment>
+        <Text>{readableDate(this.props.value)}</Text>
+        <View style={styles.row}>
+          {this.renderButton('-1 hour', -1)}
+          {this.renderButton('+1 hour', 1)}
+        </View>
+        <View style={styles.row}>
+          {this.renderButton('-1 day', -24)}
+          {this.renderButton('+1 day', 24)}
+        </View>
+        <View style={styles.row}>
+          <PropButton
+            title="Set undefined"
+            value={undefined}
+            onChange={onChange}
+          />
+          <PropButton
+            title="Set default"
+            value={defaultDate}
+            onChange={onChange}
+          />
+        </View>
+      </React.Fragment>
+    )
+  }
 
-    render() {
-        const { onChange, defaultDate } = this.props;
-        return (
-            <React.Fragment>
-                <Text>{readableDate(this.props.value)}</Text>
-                <View style={styles.row} >
-                    {this.renderButton('-1 hour', -1)}
-                    {this.renderButton('+1 hour', 1)}
-                </View>
-                <View style={styles.row} >
-                    {this.renderButton('-1 day', -24)}
-                    {this.renderButton('+1 day', 24)}
-                </View>
-                <View style={styles.row} >
-                    <PropButton title='Set undefined' value={undefined} onChange={onChange} />
-                    <PropButton title='Set default' value={defaultDate} onChange={onChange} />
-                </View>
-            </React.Fragment >
-        )
-    }
-
-    renderButton = (title, hourDiff) => <PropButton title={title} onChange={this.props.onChange}
-        value={this.props.value && new Date(this.props.value.getTime()).addHours(hourDiff)} />
-
+  renderButton = (title, hourDiff) => (
+    <PropButton
+      title={title}
+      onChange={this.props.onChange}
+      value={
+        this.props.value &&
+        new Date(this.props.value.getTime()).addHours(hourDiff)
+      }
+    />
+  )
 }
 
 const styles = StyleSheet.create({
-    row: {
-        flexDirection: 'row',
-        width: 300,
-        justifyContent: 'space-between',
-        margin: 5,
-    }
-})
+  row: {
+    flexDirection: 'row',
+    width: 300,
+    justifyContent: 'space-between',
+    margin: 5,
+  },
+})

examples/advanced/src/propPickers/MinuteInterval.js

@@ -1,18 +1,18 @@
-import React, { Component } from 'react';
-import {Button } from 'react-native';
+import React, { Component } from 'react'
+import { Button } from 'react-native'
 
 export default class extends Component {
-
-    render() {
-        return (
-            <React.Fragment>
-                {[1, 5, 10, 15].map(minutes =>
-                    <Button
-                        key={minutes}
-                        title={minutes + ' min'}
-                        onPress={() => this.props.onChange(minutes)}
-                    />)}
-            </React.Fragment>
-        );
-    }
-}
+  render() {
+    return (
+      <React.Fragment>
+        {[1, 5, 10, 15].map(minutes => (
+          <Button
+            key={minutes}
+            title={minutes + ' min'}
+            onPress={() => this.props.onChange(minutes)}
+          />
+        ))}
+      </React.Fragment>
+    )
+  }
+}

examples/advanced/src/propPickers/ModePicker.js

@@ -1,22 +1,17 @@
-import React, { Component } from 'react';
-import PropSlider from '../PropSlider';
+import React, { Component } from 'react'
+import PropSlider from '../PropSlider'
 
-const data = [
-    { name: 'datetime' },
-    { name: 'date' },
-    { name: 'time' },
-]
+const data = [{ name: 'datetime' }, { name: 'date' }, { name: 'time' }]
 
 export default class extends Component {
-
-    render() {
-        return (
-            <PropSlider
-                selectedProp={this.props.selected}
-                onSelect={this.props.onChange}
-                data={data}
-                width={100}
-            />
-        );
-    }
-}
+  render() {
+    return (
+      <PropSlider
+        selectedProp={this.props.selected}
+        onSelect={this.props.onChange}
+        data={data}
+        width={100}
+      />
+    )
+  }
+}

examples/advanced/src/propPickers/TextColor.js

@@ -1,12 +1,8 @@
-import React, { Component } from 'react';
-import { Button } from 'react-native';
+import React, { Component } from 'react'
+import { Button } from 'react-native'
 
 export default class extends Component {
-
-    render() {
-        return (
-            <Button title={'Change color'} onPress={this.props.onChange} />
-        );
-    }
-
-}
+  render() {
+    return <Button title={'Change color'} onPress={this.props.onChange} />
+  }
+}

examples/advanced/src/propPickers/TimeZoneOffsetInMinutes.js

@@ -1,17 +1,20 @@
-import React, { Component } from 'react';
-import { PropButton } from '../PropButton';
+import React, { Component } from 'react'
+import { PropButton } from '../PropButton'
 
 export default class extends Component {
-
-    render() {
-        const {onChange} = this.props
-        return (
-            <React.Fragment>
-                <PropButton title='Set undefined' value={undefined} onChange={onChange} />
-                <PropButton title='Set 0' value={0} onChange={onChange} />
-                <PropButton title='Set 180' value={180} onChange={onChange} />
-                <PropButton title='Set -180' value={-180} onChange={onChange} />
-            </React.Fragment>
-        );
-    }
-}
+  render() {
+    const { onChange } = this.props
+    return (
+      <React.Fragment>
+        <PropButton
+          title="Set undefined"
+          value={undefined}
+          onChange={onChange}
+        />
+        <PropButton title="Set 0" value={0} onChange={onChange} />
+        <PropButton title="Set 180" value={180} onChange={onChange} />
+        <PropButton title="Set -180" value={-180} onChange={onChange} />
+      </React.Fragment>
+    )
+  }
+}

examples/advanced/yarn.lock

@@ -5127,10 +5127,10 @@ react-is@^16.8.1, react-is@^16.8.4, react-is@^16.8.6:
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.8.6.tgz#5bbc1e2d29141c9fbdfed456343fe2bc430a6a16"
   integrity sha512-aUk3bHfZ2bRSVFFbbeVS4i+lNPZr3/WM5jT2J5omUVV1zzcs1nAaf3l51ctA5FFvCRbhrH0bdAsRRQddFJZPtA==
 
-react-native-date-picker@^2.5.0:
-  version "2.5.0"
-  resolved "https://registry.yarnpkg.com/react-native-date-picker/-/react-native-date-picker-2.5.0.tgz#6dc89e9c7fdf61de708fc444594dcc16a20a7070"
-  integrity sha512-l7nzA6J2q45mmBZE2CgsO+YGm8ZaFiAuXdXIxFx/M0J9wWH2Th0RMnBssDx4nbHrk020bl5lzeCZKQHtiS58wA==
+react-native-date-picker@^2.6.1:
+  version "2.6.1"
+  resolved "https://registry.yarnpkg.com/react-native-date-picker/-/react-native-date-picker-2.6.1.tgz#ad322cc12a760ad7a2cabce18928652dd4f8b8f0"
+  integrity sha512-9FVOMulMs5mWfjWcoEuHotIh5LiJPHvrSUEsHfiYW48kME3GF/nE0DyNg4qDuJFRsZr8mIdiNyLQHQbnhGKZ/Q==
   dependencies:
     moment "^2.22.1"
 

examples/cocoapods/App.js

@@ -6,8 +6,8 @@
  * @flow
  */
 
-import React, { Component } from 'react';
-import { Platform, StyleSheet, Text, View } from 'react-native';
+import React, { Component } from 'react'
+import { Platform, StyleSheet, Text, View } from 'react-native'
 import DatePicker from 'react-native-date-picker'
 
 const instructions = Platform.select({
@@ -15,11 +15,10 @@ const instructions = Platform.select({
   android:
     'Double tap R on your keyboard to reload,\n' +
     'Shake or press menu button for dev menu',
-});
+})
 
-type Props = {};
+type Props = {}
 export default class App extends Component<Props> {
-
   state = { date: new Date() }
 
   render() {
@@ -30,9 +29,10 @@ export default class App extends Component {
         <Text style={styles.instructions}>{instructions}</Text>
         <DatePicker
           date={this.state.date}
-          onDateChange={date => this.setState({ date })} />
+          onDateChange={date => this.setState({ date })}
+        />
       </View>
-    );
+    )
   }
 }
 
@@ -53,4 +53,4 @@ const styles = StyleSheet.create({
     color: '#333333',
     marginBottom: 5,
   },
-});
+})

examples/cocoapods/index.js

@@ -1,7 +1,7 @@
 /** @format */
 
-import {AppRegistry} from 'react-native';
-import App from './App';
-import {name as appName} from './app.json';
+import { AppRegistry } from 'react-native'
+import App from './App'
+import { name as appName } from './app.json'
 
-AppRegistry.registerComponent(appName, () => App);
+AppRegistry.registerComponent(appName, () => App)

examples/detox/app.js

@@ -4,52 +4,69 @@
  * @flow
  */
 
-import React, { Component } from 'react';
+import React, { Component } from 'react'
 import {
   AppRegistry,
   StyleSheet,
   Text,
   View,
-  TouchableOpacity
-} from 'react-native';
+  TouchableOpacity,
+} from 'react-native'
 
 class example extends Component {
   constructor(props) {
-    super(props);
+    super(props)
     this.state = {
-      greeting: undefined
-    };
+      greeting: undefined,
+    }
   }
   render() {
-    if (this.state.greeting) return this.renderAfterButton();
+    if (this.state.greeting) return this.renderAfterButton()
     return (
-      <View testID='welcome' style={{flex: 1, paddingTop: 20, justifyContent: 'center', alignItems: 'center'}}>
-        <Text style={{fontSize: 25, marginBottom: 30}}>
-          Welcome
-        </Text>
-        <TouchableOpacity testID='hello_button' onPress={this.onButtonPress.bind(this, 'Hello')}>
-          <Text style={{color: 'blue', marginBottom: 20}}>Say Hello</Text>
+      <View
+        testID="welcome"
+        style={{
+          flex: 1,
+          paddingTop: 20,
+          justifyContent: 'center',
+          alignItems: 'center',
+        }}
+      >
+        <Text style={{ fontSize: 25, marginBottom: 30 }}>Welcome</Text>
+        <TouchableOpacity
+          testID="hello_button"
+          onPress={this.onButtonPress.bind(this, 'Hello')}
+        >
+          <Text style={{ color: 'blue', marginBottom: 20 }}>Say Hello</Text>
         </TouchableOpacity>
-        <TouchableOpacity testID='world_button' onPress={this.onButtonPress.bind(this, 'World')}>
-          <Text style={{color: 'blue', marginBottom: 20}}>Say World</Text>
+        <TouchableOpacity
+          testID="world_button"
+          onPress={this.onButtonPress.bind(this, 'World')}
+        >
+          <Text style={{ color: 'blue', marginBottom: 20 }}>Say World</Text>
         </TouchableOpacity>
       </View>
-    );
+    )
   }
   renderAfterButton() {
     return (
-      <View style={{flex: 1, paddingTop: 20, justifyContent: 'center', alignItems: 'center'}}>
-        <Text style={{fontSize: 25}}>
-          {this.state.greeting}!!!
-        </Text>
+      <View
+        style={{
+          flex: 1,
+          paddingTop: 20,
+          justifyContent: 'center',
+          alignItems: 'center',
+        }}
+      >
+        <Text style={{ fontSize: 25 }}>{this.state.greeting}!!!</Text>
       </View>
-    );
+    )
   }
   onButtonPress(greeting) {
     this.setState({
-      greeting: greeting
-    });
+      greeting: greeting,
+    })
   }
 }
 
-AppRegistry.registerComponent('example', () => example);
+AppRegistry.registerComponent('example', () => example)

examples/detox/e2e/example.spec.js

@@ -1,19 +1,19 @@
 describe('Example', () => {
   beforeEach(async () => {
-    await device.reloadReactNative();
-  });
-  
+    await device.reloadReactNative()
+  })
+
   it('should have welcome screen', async () => {
-    await expect(element(by.id('welcome'))).toBeVisible();
-  });
-  
+    await expect(element(by.id('welcome'))).toBeVisible()
+  })
+
   it('should show hello screen after tap', async () => {
-    await element(by.id('hello_button')).tap();
-    await expect(element(by.text('Hello!!!'))).toBeVisible();
-  });
-  
+    await element(by.id('hello_button')).tap()
+    await expect(element(by.text('Hello!!!'))).toBeVisible()
+  })
+
   it('should show world screen after tap', async () => {
-    await element(by.id('world_button')).tap();
-    await expect(element(by.text('World!!!'))).toBeVisible();
-  });
-});
+    await element(by.id('world_button')).tap()
+    await expect(element(by.text('World!!!'))).toBeVisible()
+  })
+})

examples/detox/e2e/init.js

@@ -1,19 +1,19 @@
-const detox = require('detox');
-const config = require('../package.json').detox;
-const adapter = require('detox/runners/mocha/adapter');
+const detox = require('detox')
+const config = require('../package.json').detox
+const adapter = require('detox/runners/mocha/adapter')
 
 before(async () => {
-  await detox.init(config);
-});
+  await detox.init(config)
+})
 
-beforeEach(async function () {
-  await adapter.beforeEach(this);
-});
+beforeEach(async function() {
+  await adapter.beforeEach(this)
+})
 
-afterEach(async function () {
-  await adapter.afterEach(this);
-});
+afterEach(async function() {
+  await adapter.afterEach(this)
+})
 
 after(async () => {
-  await detox.cleanup();
-});
+  await detox.cleanup()
+})

examples/detox/e2eExplicitRequire/example.spec.js

@@ -1,26 +1,28 @@
-const {device, expect, element, by, waitFor} = require('detox');
+const { device, expect, element, by, waitFor } = require('detox')
 
 describe('Example', () => {
   beforeEach(async () => {
-    await device.reloadReactNative();
-  });
-  
+    await device.reloadReactNative()
+  })
+
   it('should have welcome screen', async () => {
-    await expect(element(by.id('welcome'))).toBeVisible();
-  });
-  
+    await expect(element(by.id('welcome'))).toBeVisible()
+  })
+
   it('should show hello screen after tap', async () => {
-    await element(by.id('hello_button')).tap();
-    await expect(element(by.text('Hello!!!'))).toBeVisible();
-  });
-  
+    await element(by.id('hello_button')).tap()
+    await expect(element(by.text('Hello!!!'))).toBeVisible()
+  })
+
   it('should show world screen after tap', async () => {
-    await element(by.id('world_button')).tap();
-    await expect(element(by.text('World!!!'))).toBeVisible();
-  });
+    await element(by.id('world_button')).tap()
+    await expect(element(by.text('World!!!'))).toBeVisible()
+  })
 
   it('waitFor should be exported', async () => {
-    await waitFor(element(by.id('welcome'))).toExist().withTimeout(2000);
-    await expect(element(by.id('welcome'))).toExist();
-  });
-});
+    await waitFor(element(by.id('welcome')))
+      .toExist()
+      .withTimeout(2000)
+    await expect(element(by.id('welcome'))).toExist()
+  })
+})

examples/detox/e2eExplicitRequire/init.js

@@ -1,14 +1,14 @@
-const detox = require('detox');
-const config = require('../package.json').detox;
+const detox = require('detox')
+const config = require('../package.json').detox
 
 /*
 Example showing how to use Detox with required objects rather than globally exported.
 e.g `const {device, expect, element, by, waitFor} = require('detox');`
  */
 before(async () => {
-  await detox.init(config, {initGlobals: false});
-});
+  await detox.init(config, { initGlobals: false })
+})
 
 after(async () => {
-  await detox.cleanup();
-});
+  await detox.cleanup()
+})

examples/detox/index.android.js

@@ -1 +1 @@
-require('./app');
+require('./app')

examples/detox/index.js

@@ -1 +1 @@
-require('./app');
+require('./app')

examples/detox/rn-cli.config.js

@@ -1,12 +1,12 @@
-let metroBundler;
+let metroBundler
 try {
-  metroBundler = require('metro');
+  metroBundler = require('metro')
 } catch (ex) {
-  metroBundler = require('metro-bundler');
+  metroBundler = require('metro-bundler')
 }
 
 module.exports = {
   getBlacklistRE: function() {
-    return metroBundler.createBlacklist([/test\/.*/, /detox\/node_modules\/.*/]);
-  }
-};
+    return metroBundler.createBlacklist([/test\/.*/, /detox\/node_modules\/.*/])
+  },
+}

examples/react-native-v0.59.8/App.js

@@ -1,9 +1,9 @@
-import React, { Component } from "react";
-import { StyleSheet, View } from "react-native";
-import DatePicker from "react-native-date-picker";
+import React, { Component } from 'react';
+import { StyleSheet, View } from 'react-native';
+import DatePicker from 'react-native-date-picker';
 
 export default class App extends Component {
-  state = { date: new Date() };
+  state = { date: new Date() }
 
   render = () => (
     <View style={styles.container}>
@@ -12,14 +12,14 @@ export default class App extends Component {
         onDateChange={date => this.setState({ date })}
       />
     </View>
-  );
+  )
 }
 
 const styles = StyleSheet.create({
   container: {
     flex: 1,
-    justifyContent: "center";,
-    alignItems: "center";,
-    backgroundColor: "#FFFFFF"
-  }
-});
+    justifyContent: 'center';,
+    alignItems: 'center';,
+    backgroundColor: '#FFFFFF',
+  },
+})

examples/react-native-v0.59.8/__tests__/App-test.js

@@ -2,13 +2,13 @@
  * @format
  */
 
-import 'react-native';
-import React from 'react';
-import App from '../App';
+import 'react-native'
+import React from 'react'
+import App from '../App'
 
 // Note: test renderer must be required after react-native.
-import renderer from 'react-test-renderer';
+import renderer from 'react-test-renderer'
 
 it('renders correctly', () => {
-  renderer.create(<App />);
-});
+  renderer.create(<App />)
+})

examples/react-native-v0.59.8/babel.config.js

@@ -1,3 +1,3 @@
 module.exports = {
   presets: ['module:metro-react-native-babel-preset'],
-};
+}

examples/react-native-v0.59.8/index.js

@@ -2,8 +2,8 @@
  * @format
  */
 
-import {AppRegistry} from 'react-native';
-import App from './App';
-import {name as appName} from './app.json';
+import { AppRegistry } from 'react-native'
+import App from './App'
+import { name as appName } from './app.json'
 
-AppRegistry.registerComponent(appName, () => App);
+AppRegistry.registerComponent(appName, () => App)

examples/react-native-v0.59.8/metro.config.js

@@ -14,4 +14,4 @@ module.exports = {
       },
     }),
   },
-};
+}

examples/react-native-v0.59.9/__tests__/App-test.js

@@ -2,13 +2,13 @@
  * @format
  */
 
-import 'react-native';
-import React from 'react';
-import App from '../App';
+import 'react-native'
+import React from 'react'
+import App from '../App'
 
 // Note: test renderer must be required after react-native.
-import renderer from 'react-test-renderer';
+import renderer from 'react-test-renderer'
 
 it('renders correctly', () => {
-  renderer.create(<App />);
-});
+  renderer.create(<App />)
+})

examples/react-native-v0.59.9/babel.config.js

@@ -1,3 +1,3 @@
 module.exports = {
   presets: ['module:metro-react-native-babel-preset'],
-};
+}

examples/react-native-v0.59.9/metro.config.js

@@ -14,4 +14,4 @@ module.exports = {
       },
     }),
   },
-};
+}

examples/react-native-v0.59.9/src/App.js

@@ -1,9 +1,9 @@
-import React, { Component } from "react";
-import { StyleSheet, View } from "react-native";
-import DatePicker from "react-native-date-picker";
+import React, { Component } from 'react';
+import { StyleSheet, View } from 'react-native';
+import DatePicker from 'react-native-date-picker';
 
 export default class App extends Component {
-  state = { date: new Date() };
+  state = { date: new Date() }
 
   render = () => (
     <View style={styles.container}>
@@ -12,14 +12,14 @@ export default class App extends Component {
         onDateChange={date => this.setState({ date })}
       />
     </View>
-  );
+  )
 }
 
 const styles = StyleSheet.create({
   container: {
     flex: 1,
-    justifyContent: "center";,
-    alignItems: "center";,
-    backgroundColor: "#FFFFFF"
-  }
-});
+    justifyContent: 'center';,
+    alignItems: 'center';,
+    backgroundColor: '#FFFFFF',
+  },
+})

examples/react-native-v0.60.3/.eslintrc.js

@@ -1,4 +1,4 @@
 module.exports = {
   root: true,
   extends: '@react-native-community',
-};
+}

examples/react-native-v0.60.3/App.js

@@ -6,15 +6,15 @@
  * @flow
  */
 
-import React, { Fragment, useState } from "react";
+import React, { Fragment, useState } from 'react';
 import {
   SafeAreaView,
   StyleSheet,
   ScrollView,
   View,
   Text,
-  StatusBar
-} from "react-native";
+  StatusBar,
+} from 'react-native';
 
 import moduleName from 'module'
 import {
@@ -22,60 +22,56 @@ import {
   LearnMoreLinks,
   Colors,
   DebugInstructions,
-  ReloadInstructions
-} from "react-native/Libraries/NewAppScreen";
+  ReloadInstructions,
+} from 'react-native/Libraries/NewAppScreen';
 
 const App = () => {
-  const [date, setDate] = useState(new Date());
+  const [date, setDate] = useState(new Date())
 
   return (
     <Fragment>
-          <DatePicker
-            date={date}
-            onDateChange={setDate}
-            mode="date"
-          />
+      <DatePicker date={date} onDateChange={setDate} mode="date" />
     </Fragment>
-  );
-};
+  )
+}
 
 const styles = StyleSheet.create({
   scrollView: {
-    backgroundColor: Colors.lighter
+    backgroundColor: Colors.lighter,
   },
   engine: {
-    position: "absolute";,
-    right: 0
+    position: 'absolute';,
+    right: 0,
   },
   body: {
-    backgroundColor: Colors.white
+    backgroundColor: Colors.white,
   },
   sectionContainer: {
     marginTop: 32,
-    paddingHorizontal: 24
+    paddingHorizontal: 24,
   },
   sectionTitle: {
     fontSize: 24,
-    fontWeight: "600";,
-    color: Colors.black
+    fontWeight: '600';,
+    color: Colors.black,
   },
   sectionDescription: {
     marginTop: 8,
     fontSize: 18,
-    fontWeight: "400";,
-    color: Colors.dark
+    fontWeight: '400';,
+    color: Colors.dark,
   },
   highlight: {
-    fontWeight: "700"
+    fontWeight: '700',
   },
   footer: {
     color: Colors.dark,
     fontSize: 12,
-    fontWeight: "600";,
+    fontWeight: '600';,
     padding: 4,
     paddingRight: 12,
-    textAlign: "right"
-  }
-});
+    textAlign: 'right',
+  },
+})
 
-export default App;
+export default App

examples/react-native-v0.60.3/__tests__/App-test.js

@@ -2,13 +2,13 @@
  * @format
  */
 
-import 'react-native';
-import React from 'react';
-import App from '../App';
+import 'react-native'
+import React from 'react'
+import App from '../App'
 
 // Note: test renderer must be required after react-native.
-import renderer from 'react-test-renderer';
+import renderer from 'react-test-renderer'
 
 it('renders correctly', () => {
-  renderer.create(<App />);
-});
+  renderer.create(<App />)
+})

examples/react-native-v0.60.3/babel.config.js

@@ -1,3 +1,3 @@
 module.exports = {
   presets: ['module:metro-react-native-babel-preset'],
-};
+}

examples/react-native-v0.60.3/index.js

@@ -2,8 +2,8 @@
  * @format
  */
 
-import {AppRegistry} from 'react-native';
-import App from './App';
-import {name as appName} from './app.json';
+import { AppRegistry } from 'react-native'
+import App from './App'
+import { name as appName } from './app.json'
 
-AppRegistry.registerComponent(appName, () => App);
+AppRegistry.registerComponent(appName, () => App)

examples/react-native-v0.60.3/metro.config.js

@@ -14,4 +14,4 @@ module.exports = {
       },
     }),
   },
-};
+}

index.d.ts

@@ -72,14 +72,14 @@ interface Props extends ViewProps {
    * instance, to show times in Pacific Standard Time, pass -7 * 60.
    */
   timeZoneOffsetInMinutes?: number
-   
+
   /**
    * Android picker is fading towords this background color. { color, 'none' }
-   */ 
+   */
   fadeToColor?: string
-  
+
   /**
-   * Changes the text color.	
+   * Changes the text color.
    */
   textColor?: string
 }

index.js

@@ -1,6 +1,5 @@
-import { Platform } from 'react-native';
-import DatePickerIOS from './DatePickerIOS';
-import DatePickerAndroid from './DatePickerAndroid';
-
+import { Platform } from 'react-native'
+import DatePickerIOS from './DatePickerIOS'
+import DatePickerAndroid from './DatePickerAndroid'
 
 export default Platform.OS === 'ios' ? DatePickerIOS : DatePickerAndroid

package.json

@@ -26,5 +26,8 @@
     "react native date picker",
     "react-native",
     "react-native-date-picker"
-  ]
+  ],
+  "devDependencies": {
+    "prettier": "^1.18.2"
+  }
 }

prettier.config.js

@@ -0,0 +1,5 @@
+module.exports = {
+  trailingComma: 'es5',
+  semi: false,
+  singleQuote: true,
+}

propChecker.js

@@ -1,36 +1,43 @@
 export function throwIfInvalidProps(props) {
-    checks.forEach(check => check.validate(props))
+  checks.forEach(check => check.validate(props))
 }
 
 class PropCheck {
-    constructor(isInvalid, errorText) {
-        this.isInvalid = isInvalid
-        this.errorText = errorText
-    }
-    validate = (props) => {
-        if (this.isInvalid(props)) {
-            throw new Error(`${this.errorText} Check usage of react-native-date-picker.`)
-        }
+  constructor(isInvalid, errorText) {
+    this.isInvalid = isInvalid
+    this.errorText = errorText
+  }
+  validate = props => {
+    if (this.isInvalid(props)) {
+      throw new Error(
+        `${this.errorText} Check usage of react-native-date-picker.`
+      )
     }
+  }
 }
 
 const widthCheck = new PropCheck(
-    (props) => props && props.style && props.style.width && typeof props.style.width !== "number",
-    "Invalid style: width. Width needs to be a number. Percentages or other values are not supported."
+  props =>
+    props &&
+    props.style &&
+    props.style.width &&
+    typeof props.style.width !== 'number',
+  'Invalid style: width. Width needs to be a number. Percentages or other values are not supported.'
 )
 
 const heightCheck = new PropCheck(
-    (props) => props && props.style && props.style.height && typeof props.style.height !== "number",
-    "Invalid style: height. Height needs to be a number. Percentages or other values are not supported."
+  props =>
+    props &&
+    props.style &&
+    props.style.height &&
+    typeof props.style.height !== 'number',
+  'Invalid style: height. Height needs to be a number. Percentages or other values are not supported.'
 )
 
 const modeCheck = new PropCheck(
-    (props) => props && props.mode && !["datetime", "date", "time"].includes(props.mode),
-    "Invalid mode. Valid modes: 'datetime', 'date', 'time'"
+  props =>
+    props && props.mode && !['datetime', 'date', 'time'].includes(props.mode),
+  "Invalid mode. Valid modes: 'datetime', 'date', 'time'"
 )
 
-const checks = [
-    widthCheck,
-    heightCheck,
-    modeCheck,
-]
+const checks = [widthCheck, heightCheck, modeCheck]

yarn.lock

@@ -0,0 +1,13 @@
+# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
+# yarn lockfile v1
+
+
+moment@^2.22.1:
+  version "2.24.0"
+  resolved "https://registry.yarnpkg.com/moment/-/moment-2.24.0.tgz#0d055d53f5052aa653c9f6eb68bb5d12bf5c2b5b"
+  integrity sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg==
+
+prettier@^1.18.2:
+  version "1.18.2"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.18.2.tgz#6823e7c5900017b4bd3acf46fe9ac4b4d7bda9ea"
+  integrity sha512-OeHeMc0JhFE9idD4ZdtNibzY0+TPHSpSSb9h8FqtP+YnoZZ1sl8Vc9b1sasjfymH3SonAF4QcA2+mzHPhMvIiw==