A plugin for Android to detect and watch for system theme changes. Currently the WebView does not populate the prefers-calendar property with their system dark mode.

npm install capacitor-plugin-calendar
npx cap sync

// Prompt to create event
const { id } = await Calendar.addEvent({
  title: 'Event Name',
  location: 'The World',
  startDate: new Date(),
  isAllDay: true,
});

// Update event
await Calendar.updateEvent({
  id,
  location: 'North Pole',
});

// Check event exists
const { result } = await Calendar.hasEvent({ id });

// Delete event
await Calendar.deleteEvent({ id });

Ensure that you have the following permissions added

<?xml version='1.0' encoding='utf-8'?>
<manifest ...>
    <uses-permission android:name="android.permission.READ_CALENDAR" />
    <uses-permission android:name="android.permission.WRITE_CALENDAR" />
</manifest>

• requestAccess(...)
• hasAccess(...)
• hasEvent(...)
• addEvent(...)
• updateEvent(...)
• removeEvent(...)
• Type Aliases
• Enums

requestAccess(options: { fullAccess?: boolean; }) => Promise<{ result: CalendarPermissionResult; }>

Request access to the calendar

Returns: Promise<{ result: CalendarPermissionResult; }>

hasAccess(options: { fullAccess?: boolean; }) => Promise<{ result: CalendarPermissionResult; }>

Returns access level

Returns: Promise<{ result: CalendarPermissionResult; }>

hasEvent(options: { id: string; }) => Promise<{ result: boolean; }>

Returns true when provided id exists in the calendar

Returns: Promise<{ result: boolean; }>

addEvent(options: CalendarCreateEventOptions) => Promise<{ id: string; }>

Open device calendar with pre-fill event using provided information

Returns: Promise<{ id: string; }>

updateEvent(options: CalendarUpdateEventOptions) => Promise<{ id: string; }>

Updates event with provided data by an id

Returns: Promise<{ id: string; }>

removeEvent(options: { id: string; }) => Promise<{ result: boolean; }>

Removes an event by its id

Returns: Promise<{ result: boolean; }>

CalendarEventOptions & { title: string; startDate: number; fullAccess?: boolean; }

{ title?: string; startDate?: number; notes?: string; location?: string; endDate?: number; isAllDay?: boolean; }

CalendarEventOptions & { id: string; }