React Native Week Month Date Picker
Date picker with a week and month view
Installation
npm install react-native-week-month-date-pickerDependencies
This library needs these dependencies to be installed as peer dependencies in your project:
npm install react-native-reanimated react-native-gesture-handler react-native-safe-area-context date-fnsfollow react-native-reanimated, react-native-gesture-handler, and react-native-safe-area-context installation guide to install native dependencies properly.
Usage
import { addDays } from 'date-fns';
import * as React from 'react';
import { SafeAreaView, StyleSheet, Text, View } from 'react-native';
import { DatePicker } from 'react-native-week-month-date-picker';
export default function App() {
const minDate = new Date();
const [selectedDate, setSelectedDate] = React.useState(new Date());
return (
<SafeAreaView style={{ flex: 1}}>
<DatePicker
minDate={minDate}
maxDate={addDays(minDate, 120)}
markedDates={[minDate, addDays(new Date(), 2)]}
selectedDate={selectedDate}
onDateChange={(date) => setSelectedDate(date)}
disabledDates={[addDays(new Date(), 1), addDays(new Date(), 3)]}
allowsPastDates={false}
locale="en"
theme={{
primaryColor: 'purple',
}}
>
<View>
<Text>Timeslots</Text>
<Text>{selectedDate.toString()}</Text>
</View>
</DatePicker>
</SafeAreaView>
);
}Contributing
See the contributing guide to learn how to contribute to the repository and the development workflow.
License
MIT