> For the complete documentation index, see [llms.txt](https://calcom.gitbook.io/docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://calcom.gitbook.io/docs/core-features/new-docs-embed/embed-events.md).

# Embed events

## Actions/Events

You can listen to an event that occurs in embed as follows. We use the term Action and Event interchangeably. Though the technically better term is `event`, it can be confused with booking events or event-types.

```html
<script>
Cal("on", {
  action: "ANY_ACTION_NAME",
  callback: (e)=>{
    // `data` is properties for the event.
    // `type` is the name of the action(You can also call it type of the action.) This would be same as "ANY_ACTION_NAME" except when ANY_ACTION_NAME="*" which listens to all the events.
    // `namespace` tells you the Cal namespace for which the event is fired/
    const {data, type, namespace} = e.detail;
  }
})
</script>
```

### Following are the list of supported events that embed fires.

<table><thead><tr><th width="209.33333333333331">Action</th><th>Description</th><th>Properties</th></tr></thead><tbody><tr><td>eventTypeSelected</td><td>When user chooses an event-type from the listing.</td><td>eventType:object // Event Type that has been selected"</td></tr><tr><td>bookingSuccessful</td><td>When the booking is successfully done. It might not be confirmed.</td><td>confirmed: boolean; //Whether confirmation from organizer is pending or not  <br><br>eventType: "Object for Event Type that has been booked";  <br><br>date: string; // Date of Event  <br><br>duration: number; //Duration of booked Event  <br><br>organizer: object //Organizer details like name, timezone, email</td></tr><tr><td>linkReady</td><td>Tells that the link is ready to be shown now.</td><td>None</td></tr><tr><td>linkFailed</td><td>Fired if link fails to load</td><td>code: number; // Error Code <br><br>msg: string; //Human Readable msg  <br><br>data: object // More details to debug the error</td></tr><tr><td>__iframeReady</td><td>It is fired when the embedded iframe is ready to communicate with parent snippet. This is mostly for internal use by Embed Snippet</td><td>None</td></tr><tr><td>__windowLoadComplete</td><td>Tells that window load for iframe is complete</td><td>None</td></tr><tr><td>__dimensionChanged</td><td>Tells that dimensions of the content inside the iframe changed.</td><td>iframeWidth:number, iframeHeight:number</td></tr></tbody></table>

{% hint style="info" %}
Events that start with \_\_ are internal.
{% endhint %}

To get more details on how Embed actually works, you can refer to this[ Embed Flowchart](https://www.figma.com/file/zZ5oaUpg12Fuu5mGZrPlP5/Embed-Flowchart)