Antla Custom Events Documentation

Looking for the Headless SDK or Headless API? Start at Headless SDK and Headless API.

📌 Overview

Antla fires custom DOM events whenever users interact with key parts of the try-on experience.

Events are dispatched with the prefix: antla_
Each event includes rich contextual data about the funnel, user, and product.

You can listen for the following events:

Enum Key	Event Name
`MODAL_OPEN`	`antla_modal_open`
`MODAL_CLOSE`	`antla_modal_close`
`IMAGE_UPLOADED_SUCCESS`	`antla_image_upload_success`
`IMAGE_UPLOADED_ERROR`	`antla_image_upload_error`
`IMAGE_GENERATED_SUCCESS`	`antla_image_generated_success`
`IMAGE_GENERATED_ERROR`	`antla_image_generated_error`
`TRY_ON_DISCOUNT_SHOWED`	`antla_try_on_discount_showed`
`TRY_ON_DISCOUNT_COPIED_CLIPBOARD`	`antla_try_on_discount_copied_clipboard`
`PRODUCT_ADDED_TO_CART`	`antla_product_added_to_cart`
`EMAIL_SEND`	`antla_email_send`
`EMAIL_SEND_ERROR`	`antla_email_send_error`
`SOCIAL_SEND`	`antla_social_send`
`SOCIAL_SEND_ERROR`	`antla_social_send_error`

document.addEventListener("antla_modal_open", (event) => {
  const data = event.detail;
  console.log("Modal opened", data);
});

Head to Event Payload for the full payload shape.