duki.ai

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
EventWhenDetail
duki:chat:openChat opens
duki:chat:closeChat closes
duki:chat:fullscreenEnter fullscreen
duki:chat:smallscreenExit fullscreen
duki:chat:initSession readychatId
duki:chat:startSession startedchatId
duki:chat:historyHistory receivedmessages[]
duki:chat:historyendHistory renderedmessages[]
duki:chat:typingTyping on
duki:chat:typingendTyping off
duki:chat:thinkingThinking on
duki:chat:thinkingendThinking off
duki:chat:messageUser sentmessage
duki:chat:errorErrorerror
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.