Widget SDK live demos
All Paysight Widget integration patterns live in one playground — no copy-paste required. Each preset loads a sandbox config and keeps a Code tab in sync withPaySightSDK.createWidget({...}).
Open demo playground
Launch the full interactive demo at
payment.paysight.io/demo.Playground guide
Detailed walkthrough of every preset, inspector tabs, and what to try in each scenario.
All presets use
environment: 'sandbox'. The Code tab always outputs the vanilla embed API documented here — use your own numeric productId in production.Presets
Playground features
- Preset navigator — 12 scenarios grouped by Start, Checkout UX, Risk, Wallets, and Funnels
- Scenario / Setup controls — preset-specific and shared config panels that update the live widget
- Event log — last 60
onMessageevents with expected-event hints per preset - Config inspector — read-only JSON of the active
WidgetConfig - Code tab — copyable vanilla embed generated from the live config
- Reset session — fresh
sessionIdwithout leaving the preset
Related guides
- Apple Pay via widget — demo:
?preset=apple-pay - Google Pay via widget — demo:
?preset=google-pay - Wallet-only checkout — demo:
?preset=both-wallets - Saved payment & upsell — demo:
?preset=upsell - External payment button — demo:
?preset=external-button - Shopify cart checkout — demo:
?preset=shopify - 3DS via widget — demo:
?preset=three-ds - Styling guide — demo:
?preset=theming