Avancerad widget-anpassning

Widgetens utseende kontrolleras primärt via data-color-attributet. Färgen appliceras på:

• Bubble-bakgrund
• Header-bakgrund
• Skicka-knappen
• Användarens meddelandebubblor

Widgeten använder shadow DOM för isolering — dina CSS-regler påverkar inte widgeten och vice versa.

Widgeten exponerar ett globalt API via window.__sweo_widget:

// Öppna chattpanelen programmatiskt
window.__sweo_widget?.open();

// Stäng panelen
window.__sweo_widget?.close();

// Toggle (öppna/stäng)
window.__sweo_widget?.toggle();

Användbart för att trigga chatten från egna knappar eller vid specifika användaråtgärder.

Widgeten kommunicerar med din server via dessa API-endpoints:

• POST /api/chat/stream — Skickar meddelanden, få streaming-svar
• SSE-events: delta (token), done (klart), error, blocked, escalated

done-eventet innehåller:

{
  "type": "done",
  "conversationId": "conv_abc123",
  "confidence": 0.92,
  "citations": [{"sourceId": "..."}]
}

Widgeten genererar automatiskt ett anonymt ID: anon_ + 8 slumpmässiga tecken (base36). ID:t sparas i localStorage under nyckeln __chat_widget_uid.

Du kan skicka eget användar-ID via API:t:

POST /api/chat/message
{
  "message": "Hej!",
  "userId": "customer_12345",
  "channel": "web"
}

Detta kopplar konversationen till en specifik kundprofil.

Via REST API:t kan du skicka metadata med varje meddelande:

POST /api/chat/message
{
  "message": "Where is my order?",
  "userId": "customer_12345",
  "conversationId": "conv_existing",
  "channel": "web"
}

Fältet conversationId kopplar meddelandet till en befintlig konversation. Om det utelämnas skapas en ny.

För Single-Page Applications, lägg till widgeten dynamiskt:

// React: Lägg i useEffect
useEffect(() => {
  const script = document.createElement('script');
  script.src = 'https://din-domän.com/api/widget/chat-widget.js';
  script.dataset.apiKey = 'YOUR_API_KEY';
  script.dataset.apiUrl = 'https://din-domän.com';
  script.dataset.title = 'Hej!';
  script.dataset.color = '#6366f1';
  document.body.appendChild(script);

  return () => script.remove();
}, []);

Widgeten hanterar navigering automatiskt — konversationshistoriken sparas i localStorage.