This package alows you to start an activity (Android) or show a modal window (iOS) for adding events to calendar. Through a promise, you can find out if a new event was added and get its id. See the usage section for more information.
npm install react-native-add-calendar-event --save
yarn add react-native-add-calendar-event
-
react-native link react-native-add-calendar-event -
add
NSCalendarsUsageDescriptionkey to yourInfo.plistfile. The string value associated with the key will be used when asking user for calendar permission. -
rebuild your project
see the example for a demo app
import * as AddCalendarEvent from 'react-native-add-calendar-event';
const eventConfig = {
title,
// and other options
};
AddCalendarEvent.presentNewCalendarEventDialog(eventConfig)
.then(eventId => {
//handle success (receives event id) or dismissing the modal (receives false)
if (eventId) {
console.warn(eventId);
} else {
console.warn('dismissed');
}
})
.catch((error: string) => {
// handle error such as when user rejected permissions
console.warn(error);
});
};| Property | Value | Note |
|---|---|---|
| title | String | |
| startDate | String | format: 'YYYY-MM-DDTHH:mm:ss.SSSZZ' |
| endDate | String | format: 'YYYY-MM-DDTHH:mm:ss.SSSZZ' |
| location | String | |
| url | String | iOS only |
| notes | String | The notes (iOS) or description (Android) associated with the event. |
The dates passed to this module are strings. If you use moment, you may get the right format via moment(momentInUTC).local().format('YYYY-MM-DDTHH:mm:ss.SSSZZ').
More options can be easily added, PRs are welcome!
- In XCode, in the project navigator, right click
Libraries➜Add Files to [your project's name] - Go to
node_modules➜react-native-add-calendar-eventand addAddCalendarEvent.xcodeproj - In XCode, in the project navigator, select your project. Add
libAddCalendarEvent.ato your project'sBuild Phases➜Link Binary With Libraries - Run your project (
Cmd+R)<
- Open up
android/app/src/main/java/[...]/MainActivity.java
- Add
import com.vonovak.AddCalendarEventPackage;to the imports at the top of the file - Add
new AddCalendarEventPackage()to the list returned by thegetPackages()method
- Append the following lines to
android/settings.gradle:include ':react-native-add-calendar-event' project(':react-native-add-calendar-event').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-add-calendar-event/android') - Insert the following lines inside the dependencies block in
android/app/build.gradle:compile project(':react-native-add-calendar-event')

