balanceShows available points and supporting copy.
Use the available HTTP API today and evaluate the schema-driven widget contract without mistaking an early preview for a production SDK.
Use server-side fetch. No supported npm package is claimed.
Call your own backend. Never embed a Loyumi secret in an app.
Schema-driven drafts remain on the device. There is no production embed runtime.
Review scope →The preview separates content structure from merchant styling. The published JSON Schema validates the current Studio document shape; it is an evaluation contract, not a stable production SDK guarantee.
{
"$schema": "https://docs.loyumi.com/schemas/widget-page.v0.1.json",
"schemaVersion": 1,
"id": "experience_sandbox",
"name": "Customer loyalty experience",
"revision": 1,
"updatedAt": "2026-08-02T08:00:00.000Z",
"theme": {
"accent": "#176348",
"background": "#f4f6f4",
"surface": "#ffffff",
"text": "#18211d",
"radius": 18,
"font": "system"
},
"canvas": { "maxWidth": 920, "gap": 14 },
"blocks": [
{
"id": "member-balance",
"type": "balance",
"props": {
"eyebrow": "Available balance",
"unit": "points",
"balance": 0,
"helper": "Updated after each eligible purchase",
"showHelper": true
},
"visibility": { "mobile": true, "desktop": true }
},
{
"id": "member-tier",
"type": "tier-progress",
"props": {
"title": "Your status",
"currentTier": "Member",
"nextTier": "Next tier",
"currentValue": 0,
"targetValue": 1000,
"unit": "points"
},
"visibility": { "mobile": true, "desktop": true }
}
]
}Download the Widget Studio JSON Schema →
balanceShows available points and supporting copy.
tier-progressShows current tier and a qualification threshold.
reward-catalogPresents a reward supplied by the host.
earn-previewPreviews potential earnings without mutating value.
referralExplains a referral benefit and host-owned action.
activityShows attributable earn and redeem activity.