Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.omneo.io/llms.txt

Use this file to discover all available pages before exploring further.

The Omneo SDK (also referred to as the Shapes SDK) is a JavaScript library for building customer-facing front-end experiences. It wraps the Omneo profile API, handles token-scoped authentication, and provides an event system so UI components can react to data changes without managing API state directly. This guide covers the most common patterns. For the full SDK reference, see Omneo SDK.

​
Initialise the SDK

const shapesClient = ShapesSDK.init({
  url: 'https://api.[tenant].getomneo.com/id',
  token: '{omneo_id_token}'
})
The token must be a profile-scoped Omneo ID token generated server-side. See Omneo ID for how to obtain one.

​
Load data with hydrate

Call hydrate for each data type your UI needs. The SDK fetches the data and holds it in state. 
shapesClient.hydrate('profile')
shapesClient.hydrate('transactions')
shapesClient.hydrate('rewards')
shapesClient.hydrate('lists')

​
React to data with events

Subscribe to events to receive data when it becomes available or changes. 
shapesClient.on('profile.ready', function(data) {
  renderProfile(data.data)
})

shapesClient.on('transactions.ready', function(data) {
  renderTransactionList(data)
})

shapesClient.on('rewards.ready', function(data) {
  renderRewards(data)
})
The *.ready event fires once when data first loads. Use *.update to also catch subsequent changes.

​
Read a value from state

Use .find() to read a value from the SDK’s cached state without triggering a new API request. 
const firstName = shapesClient.find('profile.data.first_name')
const rewardBalance = shapesClient.find('balances.combined_balance_dollars')
const isLoading = shapesClient.find('loading')

​
Make a direct API request

Use .get() when you need data outside the standard hydrated endpoints, or when you need query parameters. 
// Transactions with product variant data included
const response = await shapesClient.get('transactions?include=product')
const transactions = response?.body?.data
Direct .get() calls do not update the SDK’s internal state. The response is returned to your code only — other subscribers are not notified.

​
Unsubscribe from events

Remove a handler when the component is unmounted or no longer needs updates. 
const handler = function(data) { renderRewards(data) }
shapesClient.on('rewards.update', handler)

// Later, when cleaning up:
shapesClient.off('rewards.update', handler)