Embed in your product

Sometimes a chat bubble is not the right surface. When the agent is part of your product (a copilot in a settings page, an onboarding wizard, an in-app voice assistant), use one of the embed shapes below.

Iframe vs SDK vs web component

• Iframe: zero coupling, fastest to ship, full Saaya UI. Best for "drop a chat into a help page".
• Web component (`<saaya-chat>`): clean DOM integration, theme via CSS variables, no iframe sandbox issues.
• SDK (`@saaya/sdk` + your own UI): full control over rendering, state, and events. Best for in-product copilots.

Identity

All three shapes accept a session token minted on your backend. The token identifies the user, scopes which agent they can talk to, and expires in minutes, never seconds, never days.

Events

The embed surface emits a stream of events: `session.started`, `message.user`, `message.agent`, `tool.called`, `session.ended`, `escalation.requested`. Subscribe in JS or fan them out via webhooks for your analytics warehouse.

import { Saaya } from "@saaya/sdk";

const saaya = new Saaya({ sessionToken: token });
const session = await saaya.sessions.stream({ agentId, channel: "chat" });

session.on("message.agent", (m) => render(m));
session.on("escalation.requested", () => routeToHuman());
session.send("Hi, can you help me cancel my plan?");

Custom domains

On the Business plan and above, host the embed under your own domain (`chat.acme.com`). Saaya issues a TLS cert and proxies through our CDN, your users never see a saaya.ai URL.