{"templateId":"markdown","versions":[{"version":"2.0","label":"v2.0","link":"/percents-api/embedded-widget/overview","default":true,"active":true,"folderId":"27d36c3a"}],"sharedDataIds":{"sidebar":"sidebar-sidebars.yaml"},"props":{"metadata":{"markdoc":{"tagList":[]},"type":"markdown"},"seo":{"title":"SDK","llmstxt":{"hide":false,"sections":[{"title":"Table of contents","includeFiles":["**/*"],"excludeFiles":[]}],"excludeFiles":[]}},"dynamicMarkdocComponents":[],"compilationErrors":[],"ast":{"$$mdtype":"Tag","name":"article","attributes":{},"children":[{"$$mdtype":"Tag","name":"Heading","attributes":{"level":1,"id":"sdk","__idx":0},"children":["SDK"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The Percents SDK lets an issuer add branded rewards experiences to an existing web app without rebuilding offer, wallet, and reward activity UI."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"architecture","__idx":1},"children":["Architecture"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The integration has four pieces:"]},{"$$mdtype":"Tag","name":"ol","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":["The issuer host app loads ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["@percents/web-sdk"]}," and calls ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["Percents.init(...)"]},"."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["The SDK requests a short-lived SDK session from the issuer-owned session endpoint."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["The SDK mounts the Percents iframe app and sends the session, appearance, and initial view through ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["postMessage"]},"."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["The iframe calls the issuer-owned proxy API, which forwards CHG-scoped requests to Percents."]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The browser never receives a broad Percents API token. It only receives an opaque proxy session token that is meaningful to the issuer proxy."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"components","__idx":2},"children":["Components"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The current SDK supports:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Offers: available branded rewards offers and merchant activation."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Wallet: merchant-scoped branded balance summaries and balance detail."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["History: branded rewards activity and balance trends."]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Use the ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/percents-api/embedded-widget/playground"},"children":["SDK Playground"]}," to customize the appearance and see the SDK event stream."]}]},"headings":[{"value":"SDK","id":"sdk","depth":1},{"value":"Architecture","id":"architecture","depth":2},{"value":"Components","id":"components","depth":2}],"frontmatter":{"seo":{"title":"SDK"}},"lastModified":"2026-07-21T18:22:26.000Z","pagePropGetterError":{"message":"","name":""}},"slug":"/percents-api/embedded-widget/overview","userData":{"isAuthenticated":false,"teams":["anonymous"]},"isPublic":true}