Stringsaeed / react-native-week-month-date-picker

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

React Native Week Month Date Picker

Date picker with a week and month view

Demo

Installation

npm install react-native-week-month-date-picker

Dependencies

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 moment date-fns

follow react-native-reanimated, react-native-gesture-handler, and react-native-safe-area-context installation guide to install native dependencies properly.

Usage

import { DatePicker } from 'react-native-week-month-date-picker';
import { addDays } from 'date-fns';

export default function App() {
  const [selectedDate, setSelectedDate] = React.useState(new Date());

  return (
    <SafeAreaView>
      <DatePicker
        startDate={new Date()}
        maxFutureDays={90}
        markedDates={[new Date(), addDays(new Date(), 2)]}
        onDateChange={(date) => setSelectedDate(date)}
        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

About

License:MIT License


Languages

Language:TypeScript 67.7%Language:Java 16.6%Language:Objective-C 8.8%Language:JavaScript 4.1%Language:Ruby 1.9%Language:Shell 0.4%Language:C 0.3%Language:Swift 0.2%