Examples
Runnable click-to-fork examples for every framework, plus copy-paste embeds and live CDN demos
Runnable examples (recommended)
The public examples repo has a self-contained minimal app for every framework and both zero-build modes. Each one is click-to-fork on StackBlitz and CodeSandbox — no local setup.
| Framework / mode | Open it live | Source |
|---|---|---|
| React (Vite) | StackBlitz · CodeSandbox | react/ |
| Vue 3 (Vite) | StackBlitz · CodeSandbox | vue/ |
| Angular (standalone) | StackBlitz · CodeSandbox | angular/ |
| Ember | StackBlitz · CodeSandbox | ember/ |
| Script loader (zero build) | CodeSandbox · StackBlitz | cdn-loader/ |
| Web Component (zero build) | CodeSandbox · StackBlitz | web-component/ |
Demo mode by default. Every example boots with publicKey="pk_demo", a documentation sentinel the widget recognises and short-circuits to bundled mock content. Swap in your own pk_live_... in the entry file to wire it to your integration — each example points you to the right spot in a comment.
Two sandbox providers for redundancy. Use StackBlitz first for the framework examples (its WebContainer boots the dev server reliably) and CodeSandbox first for the zero-build examples. The script-loader example only works on CodeSandbox — StackBlitz's sandbox blocks the cross-origin iframe to cdn.wexio.io.
Live CDN demos
Ready-to-open demos hosted on the CDN — view source on either to see a complete embed:
Web Component demo
The <wexio-widget> element on a plain HTML page
React (ESM CDN) demo
The React component loaded over an import map, no build step
Copy-paste embeds
Full working snippets you can drop straight into a page:
Script loader
One-tag iframe embed with the window.Wexio() API
Web Component
Custom element with attributes, events, and identify()
React (ESM CDN)
React component from the CDN with an import map — no npm install
React app (npm)
The @wexio/messenger-widget-react package inside a React app
For Vue, Angular, and Ember, the install pages carry a full quick-start, and the runnable examples above are the fastest way to see them working:
Vue install
@wexio/messenger-widget-vue — props, events, build config
Angular install
@wexio/messenger-widget-angular — inputs, outputs, standalone
Ember install
@wexio/messenger-widget-ember — element registration + service
The copy-paste embeds use pk_live_... as a placeholder — swap in your real public key. To attribute conversations to a logged-in user, add an identity proof — see Authentication.