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
Event When Detail
duki:chat:open Chat opens
duki:chat:close Chat closes
duki:chat:fullscreen Enter fullscreen
duki:chat:smallscreen Exit fullscreen
duki:chat:init Session ready chatId
duki:chat:start Session started chatId
duki:chat:history History received messages[]
duki:chat:historyend History rendered messages[]
duki:chat:typing Typing on
duki:chat:typingend Typing off
duki:chat:thinking Thinking on
duki:chat:thinkingend Thinking off
duki:chat:message User sent message
duki:chat:error Error error
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.

AI Chat Custom Fields

Add contextual data to enrich conversations. Define window.dukiCustomFields before loading the chat widget. These fields are automatically sent on duki:chat:start.

<script>
window.dukiCustomFields = {
  // Business Context
  country: "",
  userMarket: "",

  // Page Context
  currentPageUrl: window.location.href,
  currentPageTitle: document.title,
  previousPageUrl: document.referrer,

  // User Context
  visitorName: "",
  visitorEmail: "",
  companyName: "",
  userRole: "",
  industry: "",

  // Behavioral Context
  pageCategory: "",
  userIntent: "",
  customerType: "",

  // Technical Context
  userAgent: navigator.userAgent,
  language: navigator.language,
  timezone: Intl.DateTimeFormat().resolvedOptions().timeZone,

  // Session Context
  sessionId: "",
  visitCount: "",
  lastVisit: "",


};
</script>

You can dynamically add values with:

<script>
window.dukiSetCustomField = function(key, value) {
  if (!window.dukiCustomFields.dynamicFields)
    window.dukiCustomFields.dynamicFields = {};
  window.dukiCustomFields.dynamicFields[key] = value;
};

// Example usage
window.dukiSetCustomField("planSelected", "Pro");
window.dukiSetCustomField("cartValue", "199.90");
</script>

This helps personalize AI replies, analytics, and lead enrichment.