All Events

Every postMessage exchanged between the Sportsbook iFrame and your page, in one place. This page is the index: it gives the exact payload shape of each event and points to the page that shows how to handle it.

Direction is written from your page’s point of view:

iFrame → your page — the iFrame sends it. You subscribe with integration.on().
your page → iFrame — you send it, with integration.emit() or a helper.

You work with all of these through the integration module.

Message envelope

Messages you send are always wrapped in a value object:


{ type: "<event-type>", value: { /* payload */ } }

emit(data, type) builds this wrapper for you, so emit({ mode: 'dark' }, 'theme-mode-change') produces { type: 'theme-mode-change', value: { mode: 'dark' } }.

Important

Messages you receive are not all wrapped the same way. Most arrive with a value object, some arrive flat with the payload directly on the message, and user.multiCurrencyBalance uses data. The Payload column below shows the exact shape for each event — read it before destructuring in an on() callback.

This matters because a handler that reads the wrong level does not throw. It receives undefined and does nothing, which looks identical to the message never arriving.

Warning

The module’s message listener does not verify the sender’s origin, and it posts outgoing messages with a target origin of '*'. Both are worth tightening in your copy of the file — see Customising it.

iFrame → your page

Messages the iFrame sends to you. Subscribe to these.

Event	Payload	Fires when	Handled on
`login.click`	—	Player clicks Login, or attempts an action requiring auth while anonymous	Session & Auth
`register.click`	—	Player clicks Register, or attempts an action requiring an account	Session & Auth
`auth.fail`	—	The JWT was rejected inside the iFrame, although the player is authorized on your platform	Session & Auth
`user.balance`	—	Player’s balance changed inside the iFrame — a bet placed, a cashout	Balance & Currency
`user.balance_transfer`	`{ type, value: { type, amount } }`	Player clicks Deposit or Withdrawal inside the iFrame (transfer wallet)	Transfer wallet (requires sign-in)
`user.multiCurrencyBalance`	`{ type, data: { multiCurrencyBalance, selectedCurrency } }`	A multi-currency player’s balances or selected currency changed	Balance & Currency
`deposit.click`	—	Player clicks Deposit in the Betslip	Balance & Currency
`navigation`	`{ type, path, query }` — flat	The route changed inside the iFrame	Navigation & Routing
`openLink`	`{ type, url, target }` — flat	A banner or link inside the iFrame needs the parent page to navigate	Navigation & Routing
`sdkInit`	`{ type, value: { defaultThemeMode } }`	The iFrame finished initializing. Your cue to send `client-url`	Theme Mode, Embedding

Your page → iFrame

Messages you send to the iFrame.

Event	Payload	Send when	Handled on
`iframe`	`{ logout: true }` and other command flags	The player’s session ended, and other commands	Session & Auth, plus the envelope below
`iframe-navigation`	`{ path }`	On initial page load, and whenever you drive iFrame navigation yourself	Navigation & Routing
`client-url`	`{ href, basePath? }`	In response to `sdkInit`	Embedding
`theme-mode-change`	`{ mode: 'light' \| 'dark' }`	Your site’s theme changes	Theme Mode
`currency-update`	`{ currency }`	The player switches currency on your site	Balance & Currency
`get-user-balance`	— (send `{}`)	The balance changed outside the iFrame, for example after a deposit	Balance & Currency

The `iframe` command envelope

iframe is the module’s default message type. Sending a payload without an explicit type puts it in this envelope, where each key is a separate command:

Key	Value	Meaning
`logout`	`true`	The player’s session ended on your platform
`balanceTransferSuccess`	`true` / `false`	The result of a transfer you performed after `user.balance_transfer` — see Transfer wallet (requires sign-in)
`balance`, `currency`	value	Push the current balance and currency (transfer wallet)

Example:


import integration from "services/integration";
 
integration.helpers.logout(); // → { type: 'iframe', value: { logout: true } }
 
// No type argument, so the message lands in the `iframe` envelope
integration.emit({ balanceTransferSuccess: true });
integration.emit({ balance: user.balance, currency: user.currency });

Naming conventions

Two styles are in use, and the direction tells you which:

Direction	Style	Examples
iFrame → page	`<area>.<action>`	`login.click`, `register.click`, `auth.fail`
iFrame → page	`user.<thing>`	`user.balance`, `user.multiCurrencyBalance`
page → iFrame	kebab-case	`theme-mode-change`, `currency-update`, `get-user-balance`

openLink, sdkInit and scrollParent predate this convention. They keep their camelCase names for backwards compatibility.