Demo — Chat Widget

Instalação rápida

Adicione uma única linha ao seu HTML. O widget aparece automaticamente no canto da página, pronto para se comunicar com seu agente de IA.

Inclusão básica

<script
  src="chat-widget.js"
  data-site-id="meu-site"
  data-agent-url="https://meu-agente.com/api/chat"
></script>

Todos os atributos

data-site-id obrigatório Identificador único do seu site/produto. Enviado em cada requisição ao agente.

data-agent-url obrigatório URL da sua API de agente de IA (POST JSON).

data-theme Tema visual do chat. "light" | "dark"

data-position Lado da tela onde o botão aparece. "right" | "left"

data-title Título exibido no cabeçalho do chat. "Assistente IA"

data-color Cor primária do widget (hex ou CSS). "#2563eb"

data-placeholder Texto placeholder do campo de mensagem. "Digite sua mensagem..."

Payload enviado ao agente

{
  "session_id": "sess_k3f8x...",
  "site_id":    "meu-site",
  "message":    "Olá, preciso de ajuda",
  "history": [
    { "role": "user",      "content": "..." },
    { "role": "assistant", "content": "..." }
  ],
  "timestamp": "2025-01-01T12:00:00Z"
}

Resposta esperada do agente

// Qualquer uma dessas chaves:
{ "reply":    "Sua resposta aqui" }
{ "message":  "Sua resposta aqui" }
{ "response": "Sua resposta aqui" }
{ "text":     "Sua resposta aqui" }

// Headers enviados automaticamente:
X-Site-Id: meu-site
X-Session-Id: sess_k3f8x...

API JavaScript (controle programático)


      ChatWidget.open()                   // abre o painel
      ChatWidget.close()                  // fecha o painel
      ChatWidget.clear()                  // limpa a conversa e gera nova sessão
      ChatWidget.getSessionId()           // retorna o session_id atual
      ChatWidget.getSiteId()              // retorna o site_id configurado
      ChatWidget.sendMessage("Texto")     // envia mensagem programaticamente

O session_id é gerado automaticamente e persiste durante a aba do navegador (sessionStorage). Ao fechar/reabrir o chat ou chamar ChatWidget.clear(), uma nova sessão é criada. O widget não depende de nenhuma biblioteca externa.