useCalendlyEventListener()
The useCalendlyEventListener() composable is an easy way if you want to listen to certain events provided by calendly.
Example
Check the Playground for an example of how the useCalendlyEventListener() composable works.
Load the widget either via the components Inline Widget, Popup Widget, and Popup Button or the
useCalendly() composable to listen to certain eventsListeners available
onDateAndTimeSelected
After a user has opened the widget and selected a date and time.
See event Response for the event's payload.
Minimal example
<script lang="ts" setup>
useCalendlyEventListener({
onDateAndTimeSelected: event => {
console.log("onDateAndTimeSelected", event)
},
})
</script>
onEventScheduled
After a user has scheduled an event.
See event Response for the event's payload.
Minimal example
<script lang="ts" setup>
useCalendlyEventListener({
onEventScheduled: event => {
console.log("onEventScheduled", event)
},
})
</script>
onEventTypeViewed
After a user has selected an event type.
See event Response
Minimal example
<script lang="ts" setup>
useCalendlyEventListener({
onEventTypeViewed: event => {
console.log("onEventTypeViewed", event)
},
})
</script>
onProfilePageViewed
After a user has opened the widget and viewed your profile.
See event Response
Minimal example
<script lang="ts" setup>
useCalendlyEventListener({
onProfilePageViewed: event => {
console.log("onProfilePageViewed", event)
},
})
</script>
onPageHeightResize
After the height of the embed's parent page has changed.
See event Response
Minimal example
<script lang="ts" setup>
useCalendlyEventListener({
onPageHeightResize: event => {
console.log("onPageHeightResize", event.height)
},
})
</script>