@smooai/chat-widget · Aurora Glass

Embeddable AI chat,
beautifully on brand.

A framework-light <smooth-agent-chat> web component for the smooth-operator protocol. One script tag. Streaming replies, grounded sources, full-page or popover — and it inherits your brand color, automatically.

View on GitHub

Adapts to your brand

Pass one primary color — gradients, bubbles and glow derive themselves. Light or dark.

Streaming + sources

Token-by-token replies with a live typing indicator and collapsible grounding citations.

Popover or full-page

A floating launcher, or a full-bleed support page. Same component, one attribute.

Framework-light

No React on the host page. Shadow-DOM isolated. ~19 kB gzipped, protocol client included.

Same component · three brands

One widget, your color

Live, streaming conversations below — driven by the real <smooth-agent-chat> component against an in-page mock of the smooth-operator protocol.

Default · dark
Coral · light
Violet · dark

Drop it in

Two lines to embed

index.html — declarative
<!-- one script tag, then the element -->
<script src="https://unpkg.com/@smooai/chat-widget/dist/chat-widget.global.js"></script>
<smooth-agent-chat
    endpoint="wss://your-host/ws"
    agent-id="…"
    agent-name="Support">
</smooth-agent-chat>
app.ts — programmatic
import { mountChatWidget } from '@smooai/chat-widget';

mountChatWidget({
  endpoint: 'wss://your-host/ws',
  agentId: '…',
  agentName: 'Support',
  theme: { primary: '#8b5cf6' },
});