Widget Events

Listen in the host page

// Catch all
window.addEventListener('duki:event', (e) => {
  console.log('[DUKI]', e.detail.name, e.detail);
});

// Specific
window.addEventListener('duki:chat:init', (e) => {
  const { chatId } = e.detail;
});

Check the "Event catalog" to see events names

Payload

{
  name,          // normalized event name, e.g. "chat:init"
  ts,            // ISO timestamp
  projectId,     // widget project id
  language,      // e.g., "en"
  side,          // "right" | "left"
  ...custom      // event-specific fields (chatId, message, error, ...)
}

Event catalog

GTM / GA4

<script>
window.dataLayer = window.dataLayer || [];
window.addEventListener('duki:event', (e) => {
  const ev = e.detail;
  window.dataLayer.push({
    event: 'duki_' + ev.name.replace(/:/g, '_'),
    duki: ev
  });
});
</script>

This is an exmple how you can use the events.