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 Shapes SDK is a JavaScript library for building front-end experiences on top of Omneo profile data. It handles authentication, caching, state management, and API requests, so you can focus on building the UI.

​
Installation

Via CDN: 
<script type="text/javascript" src="https://cdn.omneo.io/shapes-sdk/shapes.sdk.js"></script>
When loaded from CDN, the SDK is available at window.ShapesSDK. Via npm/yarn: 
npm install @omneo/shapes-sdk
# or
yarn add @omneo/shapes-sdk

import ShapesSDK from '@omneo/shapes-sdk'
// or
const ShapesSDK = require('@omneo/shapes-sdk')

​
Initialisation

The SDK requires an Omneo ID URL and a profile-scoped token. Tokens must be generated server-side — do not generate them client-side. 
const shapesClient = ShapesSDK.init({
  url: 'https://api.[tenant].getomneo.com/id',
  token: '{omneo_id_token}',
  logging: true  // optional, enables console logging
})
See Omneo ID for how to obtain a profile-scoped token.

​
Core methods

​
.find(path)

Returns a value from the cached client state using dot notation. Does not trigger a new API request. 
const firstName = shapesClient.find('profile.data.first_name')
const balance = shapesClient.find('balances.combined_balance_dollars')
const loading = shapesClient.find('loading')

​
.hydrate(endpoint)

Registers that the SDK should fetch and maintain data for an endpoint. If not yet fetched, it requests the data from Omneo and merges it into state. Call this for each data type you need. 
shapesClient.hydrate('profile')
shapesClient.hydrate('transactions')
shapesClient.hydrate('rewards')
shapesClient.hydrate('lists')

​
.on(event, handler)

Subscribes to a state event. The handler is called whenever the named event fires, with the current state as its argument. 
shapesClient.on('profile.update', function(data) {
  console.log('Profile updated:', data)
  renderProfile(data.data)
})

shapesClient.on('transactions.update', function(data) {
  renderTransactions(data.data)
})
Available event types: shapes.ready, shapes.update, shapes.{endpoint}.ready, shapes.{endpoint}.load, shapes.{endpoint}.update

​
.off(event, handler)

Removes a previously registered event handler. 
shapesClient.off('profile.update', myHandler)

​
Making API requests

The SDK wraps the Omneo /profiles/me proxy endpoint: 
// GET
shapesClient.get('profile').then(response => { ... })

// POST (with state update)
shapesClient.post('profile', { first_name: 'Jane' }, true).then(response => { ... })

// PUT
shapesClient.put('lists.6', { title: 'My Wishlist' }, true).then(() => { ... })

// DELETE
shapesClient.delete('lists.6', true).then(response => { ... })
The third argument (updateState) tells the SDK whether to merge the response back into its internal state and emit update events.

​
State structure

{
  "loading": false,
  "profile": {
    "init": true,
    "error": false,
    "loading": false,
    "data": { "id": "...", "first_name": "Jane", ... }
  },
  "transactions": { "init": true, "data": { ... } },
  "rewards": { "init": true, "data": { ... } }
}