{"_id":"@akson/chatsuite-session-embed","_rev":"2-f947d02532da3da7ea305a281631ec92","name":"@akson/chatsuite-session-embed","dist-tags":{"latest":"0.2.0"},"versions":{"0.1.0":{"name":"@akson/chatsuite-session-embed","version":"0.1.0","license":"UNLICENSED","_id":"@akson/chatsuite-session-embed@0.1.0","maintainers":[{"name":"antoineschaller","email":"antoine.schaller@akson.ch"}],"dist":{"shasum":"f41344253a885df033c3aa275bcb689d1e53e81b","tarball":"https://registry.npmjs.org/@akson/chatsuite-session-embed/-/chatsuite-session-embed-0.1.0.tgz","fileCount":7,"integrity":"sha512-uNAuPlpRD0zjPwA9f7ZpbNQX+KSBXHbD9aF5KtCbrZCMgbXLQyWbtNsiwvwzRHEOY/ks+EJmO3baX2ju7C+itQ==","signatures":[{"sig":"MEUCIQC5DbMpj/PPXGaJB8x/1p0DpNRIsTRY8P3/r+/bBzvk6AIgZV/tn3KMI1+wzLmX+qqzGKU9iRWv6REobuTml5k2X3I=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":115043},"main":"dist/index.mjs","types":"dist/index.d.mts","module":"dist/index.mjs","exports":{".":{"types":"./dist/index.d.mts","import":"./dist/index.mjs"},"./bundle":"./dist/chatsuite-session.js","./headless":{"types":"./dist/headless.d.mts","import":"./dist/headless.mjs"}},"gitHead":"77e0b41e0c08fc83cb2caeb71ae3cf2f80f00c1f","scripts":{"dev":"tsup --watch","test":"vitest run","build":"tsup","typecheck":"tsc --noEmit","prepublishOnly":"pnpm build"},"_npmUser":{"name":"antoineschaller","email":"antoine.schaller@akson.ch"},"_npmVersion":"10.9.7","description":"Drop-in WhatsApp session status pill + QR scan modal for ChatSuite consumers, plus a headless SessionMonitor for SSR/Node use.","directories":{},"_nodeVersion":"22.22.2","dependencies":{"qrcode":"^1.5.4"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.0.2","vitest":"^4.0.18","typescript":"^5.9.3","@types/qrcode":"^1.5.5"},"_npmOperationalInternal":{"tmp":"tmp/chatsuite-session-embed_0.1.0_1777361348270_0.8913101786063393","host":"s3://npm-registry-packages-npm-production"}},"0.2.0":{"name":"@akson/chatsuite-session-embed","version":"0.2.0","description":"Drop-in WhatsApp session status pill + QR scan modal for ChatSuite consumers, plus a headless SessionMonitor for SSR/Node use.","license":"UNLICENSED","publishConfig":{"access":"public"},"main":"dist/index.mjs","module":"dist/index.mjs","types":"dist/index.d.mts","exports":{".":{"types":"./dist/index.d.mts","import":"./dist/index.mjs"},"./headless":{"types":"./dist/headless.d.mts","import":"./dist/headless.mjs"},"./bundle":"./dist/chatsuite-session.js"},"scripts":{"build":"tsup","dev":"tsup --watch","typecheck":"tsc --noEmit","test":"vitest run","prepublishOnly":"pnpm build"},"dependencies":{"qrcode":"^1.5.4"},"devDependencies":{"@types/qrcode":"^1.5.5","tsup":"^8.0.2","typescript":"^5.9.3","vitest":"^4.0.18"},"gitHead":"614c449dd41a9bae98266e53f97558f4e27a3ffa","_id":"@akson/chatsuite-session-embed@0.2.0","_nodeVersion":"24.15.0","_npmVersion":"11.13.0","dist":{"integrity":"sha512-a4cb4IvnGTwwuoo831lVkgtZ0VOW2HnxGhYEXQ/mVYqmBHAmuymeFwkyRqFN6iZyCE9ejQ0fg9N3flGqsrh5sA==","shasum":"2a708649967477a68d68f941b23c5a01c23dcad5","tarball":"https://registry.npmjs.org/@akson/chatsuite-session-embed/-/chatsuite-session-embed-0.2.0.tgz","fileCount":8,"unpackedSize":116161,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIHrVOP/ogGlx503pm003WY2hWr3MUq8v8l9A4i0a8UAdAiEAqS94Em3YGbcBJxNG8SK0/5ikUpGG7iEPx06ZDqlgCa4="}]},"_npmUser":{"name":"antoineschaller","email":"antoine.schaller@akson.ch"},"directories":{},"maintainers":[{"name":"antoineschaller","email":"antoine.schaller@akson.ch"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/chatsuite-session-embed_0.2.0_1777625100001_0.8143844586355184"},"_hasShrinkwrap":false}},"time":{"created":"2026-04-28T07:29:08.171Z","modified":"2026-05-01T08:45:00.255Z","0.1.0":"2026-04-28T07:29:08.452Z","0.2.0":"2026-05-01T08:45:00.155Z"},"license":"UNLICENSED","description":"Drop-in WhatsApp session status pill + QR scan modal for ChatSuite consumers, plus a headless SessionMonitor for SSR/Node use.","maintainers":[{"name":"antoineschaller","email":"antoine.schaller@akson.ch"}],"readme":"# @akson/chatsuite-session-embed\n\nDrop-in WhatsApp session status pill + QR scan modal for any web app that consumes ChatSuite.\n\nExternal apps (the MyArmy Meteor app, future integrations) can render a live status indicator and a self-refreshing QR modal with one script tag and an API token, so end users always see the latest QR while Baileys rotates it every ~20 seconds.\n\n## Install\n\n### Script tag (recommended)\n\n```html\n<script src=\"https://api.chatsuite.akson.ch/embed/chatsuite-session.js\" defer></script>\n<chatsuite-session-status\n  api-base=\"https://api.chatsuite.akson.ch\"\n  tel=\"+41764113232\"\n  data-token=\"wa_...\"\n  auto-open=\"true\"></chatsuite-session-status>\n```\n\nThe custom element upgrades as soon as the bundle loads. No build step required.\n\n### ESM (bundlers)\n\n```bash\npnpm add @akson/chatsuite-session-embed\n```\n\n```ts\nimport {\n  SessionMonitor,\n  registerSessionStatusElement,\n} from '@akson/chatsuite-session-embed';\n\n// Either register the custom element …\nregisterSessionStatusElement();\n\n// … or drive your own UI from the headless monitor:\nconst monitor = new SessionMonitor({\n  apiBase: 'https://api.chatsuite.akson.ch',\n  tel: '+41764113232',\n  token: process.env.CHATSUITE_TOKEN!,\n});\nmonitor.on('qr', (snap) => render(snap.qr));\nmonitor.on('state', (snap) => updatePill(snap.state));\nmonitor.start();\n```\n\n## Web Component attributes\n\n| Attribute    | Required | Description                                                                 |\n|--------------|----------|-----------------------------------------------------------------------------|\n| `api-base`   | yes      | Origin of the ChatSuite API.                                                |\n| `tel`        | yes      | Phone number with leading `+`, e.g. `+41764113232`.                         |\n| `data-token` | yes      | API token (`wa_*`). Use a token scoped to this `tel` only.                  |\n| `auto-open`  | no       | When `\"true\"`, opens the QR modal automatically as soon as a QR is emitted. |\n\n## DOM events\n\nThe custom element re-emits monitor events as bubbling `CustomEvent`s on itself:\n\n| Event                | `detail`                                                |\n|----------------------|---------------------------------------------------------|\n| `chatsuite:state`    | `SessionSnapshot` (every state or QR change).           |\n| `chatsuite:error`    | `{ message: string }`.                                  |\n\n## `SessionMonitor` events\n\n```ts\nmonitor.on('open', () => {});            // SSE stream connected\nmonitor.on('state', (snap) => {});       // any state or QR change\nmonitor.on('qr', (snap) => {});          // new QR rotated in\nmonitor.on('connected', (snap) => {});   // session reached ACTIVE\nmonitor.on('disconnected', (snap) => {});\nmonitor.on('error', ({ message }) => {});\nmonitor.on('close', () => {});           // monitor.stop() called\n```\n\n`SessionSnapshot` always carries `qr`, `qrVersion`, `qrExpiresAt`, `state`, and `tel`. Use `qrVersion` to dedupe renders — it strictly increases each time Baileys rotates the QR.\n\n## Auth\n\nThe package authenticates to the API with a `wa_*` token via `Authorization: Bearer <token>`. The same global `authenticate` + `requireSessionAccess` middleware that protects `/api/v1/sessions/...` covers the SSE endpoint, so the token is scoped by its phone number / session ID restrictions exactly like the rest of the API.\n\nFor browser consumers: prefer a token that is scoped to a single `tel` so embedding it in HTML reveals only the access that page needs.\n\n## CORS\n\nThe ChatSuite API CORS allowlist already includes `https://chatsuite.akson.ch`, `https://www.myarmy.ch`, and `https://myarmy.ch`. Other origins must be added to `apps/api/src/config/cors.config.ts` (or the `CORS_ORIGIN` env var) before the SSE stream will load cross-origin.\n\n## Cache-busting\n\nThe bundle is shipped from the API with `Cache-Control: max-age=86400`, so consumers can see a 24-hour stale window after a release. Append a version query (`?v=<release-hash>`) to the script `src` to force a refresh, or invalidate the CDN cache, or pin a specific version when one is published.\n\n## Build\n\n```sh\npnpm --filter @akson/chatsuite-session-embed build\n```\n\nOutputs:\n\n- `dist/chatsuite-session.js` — iife bundle for `<script>` tag use.\n- `dist/index.mjs` — ESM entry for bundlers, plus `dist/index.d.ts`.\n\n## Smoke test\n\n```sh\npnpm --filter @akson/chatsuite-session-embed build\nopen packages/session-embed/examples/static.html\n```\n\nThe example page shows a status pill bound to the MyArmy session and logs every state/QR change.\n","readmeFilename":"README.md"}