Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/nicolasbeauvais/vue-add-to-calendar

A Vue.js component that provides "Add to Calendar" functionality, works with Vue 2.X
https://github.com/nicolasbeauvais/vue-add-to-calendar

add-to-calendar calendar component vue vue2 vuejs vuejs2

Last synced: about 1 month ago
JSON representation

A Vue.js component that provides "Add to Calendar" functionality, works with Vue 2.X

Lists

README

        

Vue Add To Calendar


Release
Build Status
Coverage Status
Downloads
License
vue2

A Vue.js renderless component providing 'Add to Calendar' functionality


Less than 1kb gzipped

---

## [Demo](https://nicolasbeauvais.github.io/vue-add-to-calendar/)

### What is a renderless component?

Renderless components give you the highest possible control over your markup and styling. This means that `vue-add-to-calendar` ship with minimal HTML and no CSS to let you adapt the look and feel of the components to your needs. You can learn more about renderless components in [this blog article](https://adamwathan.me/renderless-components-in-vuejs/) by [@adamwathan](https://github.com/adamwathan).

## Include support for:
- Google calendar
- Microsoft live calendar
- Office 365 calendar

## Installation

```bash
# Yarn
yarn add vue-add-to-calendar

# NPM
npm install --save vue-add-to-calendar

# Bower
bower install vue-add-to-calendar
```

## Usage

### Loading the library

##### Browserify / Webpack

```javascript
var AddToCalendar = require('vue-add-to-calendar');

Vue.use(AddToCalendar);
```

##### HTML

```html

```

### Using the add to calendar component

```html




Add to Google calendar



Add to Microsoft live calendar



Add to Office365 outlook calendar

```

#### Available properties

List of available props to use in the component:

Prop | Data Type | Default | Description
-------------- | ---------- | --------- | -----------
`title` | String | | Event title
`details` | String | | Event details
`location` | String | | Event location
`start` | Date | | Event start date
`end` | Date | | Event end date

## Feature request
Feel free to open an issue to ask for a new calendar support.

## Changelog
Detailed changes for each release can be found in [CHANGELOG.md](https://github.com/nicolasbeauvais/vue-add-to-calendar/blob/master/CHANGELOG.md).

## Issues
Please make sure to read the [Issue Reporting Checklist](https://github.com/nicolasbeauvais/vue-add-to-calendar/blob/master/CONTRIBUTING.md#issue-reporting-guidelines) before opening an issue. Issues not conforming to the guidelines may be closed immediately.

## Contribution
Please make sure to read the [Contributing Guide](https://github.com/nicolasbeauvais/vue-add-to-calendar/blob/master/CONTRIBUTING.md) before making a pull request.

## License

[MIT](http://opensource.org/licenses/MIT)