react-native-fast-calendar

Support for Calendar

Installation

npm install react-native-fast-calendar

Usage

import {
  SafeAreaView,
  StyleSheet,
  Text,
  TouchableOpacity,
  View,
} from 'react-native';
import {
  CalendarProvider,
  MonthCalendar,
  useCalendar,
  WeekCalendar,
} from 'react-native-fast-calendar';

const Home = () => {
  const { globalDate, showCalendar, setGlobalDate } = useCalendar();

  return (
    <View>
      <MonthCalendar
        initialDate={globalDate}
        onChangeDate={(date) => {
          setGlobalDate?.(date);
        }}
      />
      <WeekCalendar itemGap={6} />
      <TouchableOpacity onPress={showCalendar}>
        <Text>Open Calendar Modal</Text>
      </TouchableOpacity>
    </View>
  );
};
export default function App() {
  return (
    <SafeAreaView style={styles.container}>
      <CalendarProvider>
        <Home />
      </CalendarProvider>
    </SafeAreaView>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    paddingTop: 50,
  },
});