@ubique-innovation/react-icalendar-link
TypeScript icon, indicating that this package has built-in type declarations

3.1.0 • Public • Published

react-icalendar-link

Ability to create link for downloading ics file

NPM JavaScript Style Guide

Install

npm install --save react-icalendar-link

Usage

import React from "react";
import ICalendarLink from "react-icalendar-link";

class App extends React.Component {
  render() {
    const event = {
      title: "My Title",
      description: "My Description",
      startTime: "2018-10-07T10:30:00+10:00",
      endTime: "2018-10-07T12:00:00+10:00",
      location: "10 Carlotta St, Artarmon NSW 2064, Australia",
      attendees: [
        "Hello World <hello@world.com>",
        "Hey <hey@test.com>",
      ]
    }
    return (
      <ICalendarLink event={event}>
        Add to Calendar
      </ICalendarLink>
    );
  }
}

Using a Different File Name

By default, the file name that a user downloads is download.ics. You can specify a different file name using the filename prop.

<ICalLink filename="blahblah.ics" {...{ event }} />

Using Raw Content

Currently it provides very few fields. You can provide the raw content for the extra fields instead.

import React from "react";
import ICalendarLink from "react-icalendar-link";

class App extends React.Component {
  render() {
    const event = {
      title: "My Title",
      description: "My Description",
      startTime: "2018-10-07T10:30:00+10:00",
      location: "10 Carlotta St, Artarmon NSW 2064, Australia",
    }
    const rawContent = `ATTENDEE;CN="Cyrus Daboo";CUTYPE=INDIVIDUAL;PARTSTAT=ACCEPTED:mailto:cyrus@example.com
ATTENDEE;CN="Wilfredo Sanchez Vega";CUTYPE=INDIVIDUAL;PARTSTAT=NEEDS-ACTION;ROLE=REQ-PARTICIPANT;RSVP=TRUE:mailto:wilfredo@example.com
ATTENDEE;CN="Bernard Desruisseaux";CUTYPE=INDIVIDUAL;PARTSTAT=NEEDS-ACTION;ROLE=REQ-PARTICIPANT;RSVP=TRUE:mailto:bernard@example.net
ATTENDEE;CN="Mike Douglass";CUTYPE=INDIVIDUAL;PARTSTAT=NEEDS-ACTION;RSVP=TRUE:mailto:mike@example.org`;

    return (
      <ICalendarLink event={event} rawContent={rawContent}>
        Add to Calendar
      </ICalendarLink>
    );
  }
}

License

MIT © josephj MIT © Ubique Innovation

Readme

Keywords

none

Package Sidebar

Install

npm i @ubique-innovation/react-icalendar-link

Weekly Downloads

1

Version

3.1.0

License

MIT

Unpacked Size

61.4 kB

Total Files

9

Last publish

Collaborators

  • ub-innovation