---
name: greenlight-chat-widget
description: >-
  Embed and operate the GreenLight AI sales/support chat widget on any site.
  Use when a user wants to install the widget, configure the tenant/bot,
  match it to a brand, wire the streaming chat, handle the onboarding handoff,
  or debug a 502 / silent disconnect. Covers the GreenLight widget contract.
version: 1.0.0
---

# GreenLight Chat Widget

The GreenLight chat widget is a drop-in AI assistant for websites. It connects
a visitor to a tenant-scoped bot and can hand off to a human operator.

## When to use this skill

- Installing the widget snippet on a new site.
- Configuring tenant id, bot id, and the API host.
- Matching widget appearance to brand (colors, position, avatar).
- Diagnosing widget 502 at ~30s or silent stream drops.
- Wiring the onboarding → operator handoff flow.

## Install

The widget is a single ES module served from the GreenLight CDN:

```html
<script type="module"
        src="https://cdn.greenlight.ru/web.js"
        data-tenant="<TENANT_ID>"
        data-bot="<BOT_ID>"
        data-api-host="https://api.greenlight.ru"></script>
```

Paste it once, before `</body>`. The module injects the widget and opens a
streaming connection to `https://api.greenlight.ru`.

## Getting tenant and bot ids

`data-tenant` and `data-bot` are issued per client. They isolate data and
conversation history per customer and select the bot persona / knowledge core.

- If you are a GreenLight client or partner: use the ids from your onboarding
  brief. If you do not have them, request them via https://greenlight.ru/contacts/.
- For a quick self-check, the public demo tenant is `romashka` / `main` (the
  demo site https://widget-demo.greenlight.ru/ uses it). Do not use the demo
  tenant for a real client.

## Configuration contract

- `data-tenant` — required. Issued per client; isolates data and history.
- `data-bot` — required. Selects the bot persona / knowledge core.
- `data-api-host` — optional, defaults to `https://api.greenlight.ru`.
- Chat uses **SSE over a POST** to `/api/chat`; the response body is a streamed
  SSE frame sequence read via `fetch` + `ReadableStream`. `EventSource` cannot
  be used because the request is a POST with a JSON body.

## Known failure modes

| Symptom | Root cause | Fix |
| --- | --- | --- |
| HTTP 502 after ~30s | Idle proxy timeout | Raise proxy read timeout to >60s; the widget retries on drop |
| Silent disconnect | Client buffer not flushed / SSE not parsed | Ensure the response is `text/event-stream`; check the frame accumulator |
| Wrong bot replies | Tenant/bot mismatch | Verify `data-tenant`/`data-bot` match the issued ids |
| Widget does not mount | `widget-status` says disabled | Check `/api/widget-status?t=<tenant>&b=<bot>` |

## Handoff to operator

When the bot confidence drops below threshold or the user asks for an operator,
emit a handoff. The widget then loads the operator pane from the same tenant.
Do not close the stream — keep it open and tag subsequent frames with
`role: operator`.

## Control plane

`data-tenant` and `data-bot` are managed in the GreenLight control plane.
Partners and clients receive them during onboarding; the widget itself does not
create tenants or bots.

## Compatibility

- Works on any static site (plain HTML, WordPress, Tilda, Webflow): the loader
  is a plain `<script type="module">`, no build step.
- Requires a modern browser with ES modules (all evergreen browsers).
- CSP: the widget loads from `cdn.greenlight.ru` and calls `api.greenlight.ru`;
  allow these origins in `script-src` / `connect-src` if a CSP is enforced.

## References

- GreenLight: https://greenlight.ru
- Agents page: https://greenlight.ru/agents/
- Contacts: https://greenlight.ru/contacts/

## На русском

Виджет GreenLight — это ИИ-консультант для сайта. Подключение: один скрипт на
`cdn.greenlight.ru/web.js` с атрибутами `data-tenant`, `data-bot`,
`data-api-host`. Идентификаторы выдаются для каждого клиента; для быстрой
проверки есть демо-тенант `romashka` / `main`.