import React, {Component} from 'react';  
import {View, StyleSheet} from "react-native";  
import NativeDates from 'native-dates';  
  
export default class App extends Component {  
    render() {  
        return (  
            <View style={styles.main}>
	            <NativeDates
		           onSelectionChange={(value) => {console.log(value)}}
		        />
			</View>  
		);  
	}  
}  
  
const styles = StyleSheet.create({  
    main: {  
	    flex:1,  
	    width: '100%',  
	    height: '100%',  
	}  
})

<NativeDates
	month={
		{
			header: {
				headerStyle: (Style Object),	// Style of each month whole header
				headerTextStyle: (Style Object),	// Text style of each month header
				weekdaysStyle: (Style Object),	// Style of each month weekdays section
				weekdaysItemStyle: (Style Object),	// Style of each items of each month weekdays section
				weekdaysTextStyle: (Style Object),	// Text style of each month weekdays section
			},
			style: {(Style Object)}	// This style object effects whole each month display.
		}
	}
/>

<NativeDates
	month={
		{
			header: {
				monthHeader: function(year, monthName, weekdaysNames){
					// Now do everything you want with year , monthName and weekdaysNames
				}
			},
			style:{(Style Object)}	// This style object effects whole each month display.
		}
	}
/>

<NativeDates
	day={
		{
			commonBackColor: (Color),	// Background color of an usual day that is not selected or disabled.
			commonTextColor: (Color),	// Text color of an usual day that is not selected or disabled.
			disabledBackColor: (Color),	// Background color of a disabled day.
			disabledTextColor: (Color),	// Text color of a disabled day.
			selectedBackColor: (Color),	// Background color of a selected day.
			selectedTextColor: (Color),	// Text color of a selected day.
			selectedBorderRadius: (Number),	// Border radius of a selected day.
			todayBorderColor: (Color),	// Border color of today (the day in which we are at the moment).
			todayTextColor: (Color),	// Text color of today (the day in which we are at the moment).
			todayBorderRadius: (Number),	// Border radius of today (the day in which we are at the moment).
			todayBorderWidth: (Number),	// Border width of today (the day in which we are at the moment).
			inRangeBackColor: (Color),	// Background color of the days that are between start and end selected dates (works when rangeSelect is true).
			inRangeTextColor: (Color),	//Text color of the days that are between start and end selected dates (works when rangeSelect is true).
		}
	}
/>

<NativeDates
	day={
		{
			dayComponent: function(date,status,disabled,onDayPress){
				// Now do everything you want with date, status, disabled and onDayPress
			}
		}
	}
/>