https://framer.com/m/AddtoCalendar-YxXz.js
Io / Enhancements / AddCalendar
AddCalendar
AddCalendar carries an event — name, description, place and times — and hands it to the reader’s calendar when the layer inside it is tapped.
Examples
Live specimens for every control the component exposes.
Setup
The visible part is whatever you drop into the Trigger slot — usually a Button. That slot can only be filled on the canvas, so the specimen here is deliberately empty rather than showing a stand-in. The event fields below travel with it.
Event
Four fields make the event: name, description, location and the start and end times. They are handed over as-is, so write them the way the reader should see them in their own calendar.
named event
with location
with description
Props
The controls exposed on the instance panel.
Usage
Guidance carried over from the component definition.
Reach for AddCalendar
A session, launch or deadline should land in the reader’s own calendar.
The trigger needs to be a designed layer rather than a stock button.
You want to track that the hand-off happened.
The event details are fixed copy rather than per-item data.
Reach for something else
You need to display a calendar rather than add one event to the reader’s own.
The event details come from the CMS per item.
Readers should book a slot rather than save one — use Cal.com or Calendly.
Io — Enhancements
Every specimen above is a live component instance. Colour, type and radius resolve from the project theme tokens.