Iframe UI events

These events are specific to calls using Daily Prebuilt (iframe mode). They fire when the UI state changes — entering fullscreen, toggling picture-in-picture, switching sidebar panels, and so on.

fullscreen

Prebuilt Custom Fires when the call iframe enters browser fullscreen mode — typically when a user clicks the fullscreen button or when requestFullscreen() is called.

// Example event object
{
  "action": "fullscreen",
  "callClientId": "17225364729060.9442072768918943"
}

exited-fullscreen

Prebuilt Custom Fires when the call iframe exits fullscreen mode.

// Example event object
{
  "action": "exited-fullscreen",
  "callClientId": "17225364729060.9442072768918943"
}

active-speaker-mode-change

Prebuilt Custom Fires when Active Speaker mode is toggled — either via the built-in UI or programmatically via setActiveSpeakerMode().

Active Speaker mode is a Daily Prebuilt concept. If you’ve built your own custom UI, this event will not fire and setActiveSpeakerMode() will have no effect.

string

Always "active-speaker-mode-change".

string

The ID of the call client instance that emitted this event.

boolean

true if Active Speaker mode was turned on, false if turned off.

// Example event object
{
  "action": "active-speaker-mode-change",
  "enabled": true,
  "callClientId": "17225364729060.9442072768918943"
}

show-local-video-changed

Prebuilt Custom Fires when the local participant’s self-view is shown or hidden — either by user interaction or when setShowLocalVideo() is called.

string

Always "show-local-video-changed".

string

The ID of the call client instance that emitted this event.

boolean

true if the local video is now visible, false if hidden.

// Example event object
{
  "action": "show-local-video-changed",
  "show": true,
  "callClientId": "17225364729060.9442072768918943"
}

pip-started

Prebuilt Custom Fires when picture-in-picture mode starts — either from the built-in PiP button or when the browser’s PiP API is activated.

// Example event object
{
  "action": "pip-started",
  "callClientId": "17225364729060.9442072768918943"
}

pip-stopped

Prebuilt Custom Fires when picture-in-picture mode stops — when the user exits PiP via the button, closes the PiP window using browser controls, or the browser deactivates PiP.

// Example event object
{
  "action": "pip-stopped",
  "callClientId": "17225364729060.9442072768918943"
}

Prebuilt Custom Fires when the sidebar panel changes — either via user interaction or when setSidebarView() is called.

string

Always "sidebar-view-changed".

string

The ID of the call client instance that emitted this event.

SidebarView

The currently active sidebar panel. Built-in values are 'people', 'chat', 'network', and 'breakout'. Custom panel names are also possible. null means the sidebar is closed.

// Example event object
{
  "action": "sidebar-view-changed",
  "view": "people",
  "callClientId": "17225364729060.9442072768918943"
}

custom-button-click

Prebuilt Custom Fires when a local participant clicks a custom tray button. See customTrayButtons and updateCustomTrayButtons() for how to add custom buttons to the tray.

string

Always "custom-button-click".

string

The ID of the call client instance that emitted this event.

string

The ID of the button that was clicked, as defined in customTrayButtons.

// Example event object
{
  "action": "custom-button-click",
  "button_id": "myCustomButton",
  "callClientId": "17225364729060.9442072768918943"
}

call.on('custom-button-click', ({ button_id }) => {
  if (button_id === 'raise-hand') {
    toggleHandRaise();
  }
});

lang-updated

Prebuilt Custom Fires after setDailyLang() is called. lang is the language currently in effect; langSetting is the value that was explicitly set. For example, calling setDailyLang('user') defers to the browser’s language preference — langSetting will be 'user' and lang will be the resolved language like 'en'. In custom call object mode, this event fires but has no automatic visual effect — use the payload to update your own UI if needed.

string

Always "lang-updated".

string

The ID of the call client instance that emitted this event.

DailyLanguage

The language currently in effect (e.g. 'en', 'fr').

DailyLanguageSetting

The value explicitly set via setDailyLang() — may be a language code or 'user' to follow the browser setting.

// Example event object
{
  "action": "lang-updated",
  "callClientId": "17225364729060.9442072768918943",
  "lang": "en",
  "langSetting": "user"
}

theme-updated

Prebuilt Custom Fires when the Prebuilt theme changes via setTheme().

string

Always "theme-updated".

string

The ID of the call client instance that emitted this event.

DailyThemeConfig

The full current theme configuration, including the colors object.

// Example event object
{
  "action": "theme-updated",
  "callClientId": "17225364729060.9442072768918943",
  "theme": {
    "colors": {
      "accent": "#F3B3A6",
      "background": "#D7FBFE",
      "backgroundAccent": "#9CF6FC",
      "border": "#797BA9",
      "mainAreaBg": "#B7CE63",
      "mainAreaBgAccent": "#8FB339"
    }
  }
}

Methods

Guides

Error events

Daily Call Client

Types

Factory Methods

Static Methods

Instance Methods

Events

Iframe UI events

fullscreen

exited-fullscreen

active-speaker-mode-change

show-local-video-changed

pip-started

pip-stopped

sidebar-view-changed

custom-button-click

lang-updated

theme-updated

See also

Methods

Guides

​fullscreen

​exited-fullscreen

​active-speaker-mode-change

​show-local-video-changed

​pip-started

​pip-stopped

​sidebar-view-changed

​custom-button-click

​lang-updated

​theme-updated

​See also

Methods

Guides

fullscreen

exited-fullscreen

active-speaker-mode-change

show-local-video-changed

pip-started

pip-stopped

sidebar-view-changed

custom-button-click

lang-updated

theme-updated

See also