@cas0570/chat-widget 0.0.1

package/dist/geoapps-chat-widget.js

@@ -0,0 +1,1471 @@
+import { jsx as s, jsxs as b } from "react/jsx-runtime";
+import J, { useRef as R, useState as I, useEffect as L, useCallback as A } from "react";
+import ie from "react-dom/client";
+const le = "gcw_chat_", ce = "gcw_popout_", de = "gcw_read_";
+let Q = !1;
+function Y(e) {
+  return `${le}${e || "default"}`;
+}
+function ue(e, n, t) {
+  if (!Q)
+    try {
+      Q = !0;
+      const a = {
+        messages: e.map((r) => ({
+          id: r.id,
+          role: r.role,
+          content: r.content,
+          timestamp: r.timestamp.toISOString(),
+          sources: r.sources
+        })),
+        sessionId: n,
+        lastUpdated: (/* @__PURE__ */ new Date()).toISOString()
+      };
+      localStorage.setItem(Y(t), JSON.stringify(a));
+    } catch (a) {
+      console.warn("Failed to save chat state:", a);
+    } finally {
+      Q = !1;
+    }
+}
+function ne(e) {
+  try {
+    const n = localStorage.getItem(Y(e));
+    if (!n) return null;
+    const t = JSON.parse(n), a = new Date(t.lastUpdated);
+    return (Date.now() - a.getTime()) / (1e3 * 60 * 60) > 24 ? (oe(e), null) : {
+      messages: t.messages.map((o) => ({
+        id: o.id,
+        role: o.role,
+        content: o.content,
+        timestamp: new Date(o.timestamp),
+        sources: o.sources
+      })),
+      sessionId: t.sessionId
+    };
+  } catch (n) {
+    return console.warn("Failed to load chat state:", n), null;
+  }
+}
+function oe(e) {
+  try {
+    localStorage.removeItem(Y(e));
+  } catch (n) {
+    console.warn("Failed to clear chat state:", n);
+  }
+}
+function pe(e, n) {
+  const t = Y(e), a = (r) => {
+    if (r.key === t) {
+      if (!r.newValue) {
+        n(null);
+        return;
+      }
+      try {
+        const o = JSON.parse(r.newValue);
+        n({
+          messages: o.messages.map((i) => ({
+            id: i.id,
+            role: i.role,
+            content: i.content,
+            timestamp: new Date(i.timestamp),
+            sources: i.sources
+          })),
+          sessionId: o.sessionId
+        });
+      } catch {
+      }
+    }
+  };
+  return window.addEventListener("storage", a), () => window.removeEventListener("storage", a);
+}
+function te(e) {
+  return `${ce}${e || "default"}`;
+}
+function K(e, n) {
+  try {
+    e ? localStorage.setItem(te(n), "true") : localStorage.removeItem(te(n));
+  } catch (t) {
+    console.warn("Failed to save popout state:", t);
+  }
+}
+function me(e) {
+  try {
+    return localStorage.getItem(te(e)) === "true";
+  } catch {
+    return !1;
+  }
+}
+function se(e) {
+  return `${de}${e || "default"}`;
+}
+function Z(e, n) {
+  try {
+    e ? localStorage.setItem(se(n), e) : localStorage.removeItem(se(n));
+  } catch (t) {
+    console.warn("Failed to save read state:", t);
+  }
+}
+function he(e) {
+  try {
+    return localStorage.getItem(se(e));
+  } catch {
+    return null;
+  }
+}
+function ge(e) {
+  const { apiUrl: n, tenantId: t, sessionId: a, headers: r = {}, onError: o, persist: i = !0 } = e, d = R(!1), [p, l] = I(() => {
+    if (i) {
+      const c = ne(t);
+      if (c) return c.messages;
+    }
+    return [];
+  }), [g, v] = I(!1), [E, x] = I(null), [m, f] = I(() => {
+    if (i) {
+      const c = ne(t);
+      if (c) return c.sessionId;
+    }
+    return a || null;
+  }), B = R(null);
+  L(() => {
+    d.current || i && p.length > 0 && ue(p, m, t);
+  }, [p, m, t, i]), L(() => i ? pe(t, (_) => {
+    d.current = !0, _ ? (l(_.messages), f(_.sessionId)) : (l([]), f(null)), setTimeout(() => {
+      d.current = !1;
+    }, 0);
+  }) : void 0, [t, i]);
+  const O = () => `msg_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`, X = A(async (c) => {
+    var P;
+    if (!c.trim() || g) return;
+    B.current && B.current.abort(), B.current = new AbortController();
+    const _ = {
+      id: O(),
+      role: "user",
+      content: c.trim(),
+      timestamp: /* @__PURE__ */ new Date()
+    };
+    l((u) => [...u, _]), v(!0), x(null);
+    const $ = O(), W = {
+      id: $,
+      role: "assistant",
+      content: "",
+      timestamp: /* @__PURE__ */ new Date(),
+      isStreaming: !0
+    };
+    l((u) => [...u, W]);
+    try {
+      const u = await fetch(n, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          ...t && { "X-Tenant-ID": t },
+          ...r
+        },
+        body: JSON.stringify({
+          message: c.trim(),
+          session_id: m
+        }),
+        signal: B.current.signal
+      });
+      if (!u.ok) {
+        const h = await u.json().catch(() => ({}));
+        throw new Error(h.detail || `Request failed with status ${u.status}`);
+      }
+      const y = u.headers.get("content-type");
+      if (y != null && y.includes("text/event-stream"))
+        await q(u, $);
+      else {
+        const h = await u.json(), C = (P = h.message.citations) == null ? void 0 : P.map((k) => ({
+          title: k.title,
+          url: k.url,
+          relevance: k.relevance_score
+        }));
+        l((k) => k.map(
+          (j) => j.id === $ ? {
+            ...j,
+            content: h.message.content,
+            isStreaming: !1,
+            sources: C
+          } : j
+        )), h.session_id && f(h.session_id);
+      }
+    } catch (u) {
+      if (u.name === "AbortError")
+        return;
+      const y = u instanceof Error ? u : new Error("An error occurred");
+      x(y), o == null || o(y), l((h) => h.map(
+        (C) => C.id === $ ? {
+          ...C,
+          content: "Sorry, an error occurred. Please try again.",
+          isStreaming: !1
+        } : C
+      ));
+    } finally {
+      v(!1), B.current = null;
+    }
+  }, [n, t, m, r, g, o]), q = async (c, _) => {
+    var u;
+    const $ = (u = c.body) == null ? void 0 : u.getReader();
+    if (!$) throw new Error("No response body");
+    const W = new TextDecoder();
+    let P = "";
+    try {
+      for (; ; ) {
+        const { done: y, value: h } = await $.read();
+        if (y) break;
+        const k = W.decode(h, { stream: !0 }).split(`
+`);
+        for (const j of k)
+          if (j.startsWith("data: ")) {
+            const F = j.slice(6);
+            if (F === "[DONE]") continue;
+            try {
+              const S = JSON.parse(F);
+              S.type === "content" && S.content ? (P += S.content, l((V) => V.map(
+                (D) => D.id === _ ? { ...D, content: P } : D
+              ))) : S.type === "sources" && S.sources ? l((V) => V.map(
+                (D) => D.id === _ ? { ...D, sources: S.sources } : D
+              )) : S.conversation_id && f(S.conversation_id);
+            } catch {
+            }
+          }
+      }
+    } finally {
+      l((y) => y.map(
+        (h) => h.id === _ ? { ...h, isStreaming: !1 } : h
+      ));
+    }
+  }, T = A(() => {
+    l([]), f(null), x(null), i && oe(t);
+  }, [i, t]);
+  return {
+    messages: p,
+    isLoading: g,
+    error: E,
+    sendMessage: X,
+    clearMessages: T,
+    sessionId: m
+  };
+}
+let U = null;
+function fe(e, n, t) {
+  const [a, r] = I(() => me(e.tenantId)), o = R(U);
+  L(() => {
+    if (a && !o.current) {
+      const l = window.open("", "GeoAppsChatPopout");
+      l && l.location.href !== "about:blank" && !l.closed ? (o.current = l, U = l) : (r(!1), K(!1, e.tenantId));
+    }
+  }, [a, e.tenantId]), L(() => {
+    if (!o.current) return;
+    const l = setInterval(() => {
+      var g;
+      (g = o.current) != null && g.closed && (r(!1), o.current = null, U = null, K(!1, e.tenantId));
+    }, 500);
+    return () => clearInterval(l);
+  }, [e.tenantId, t]);
+  const i = A(() => {
+    if (o.current && !o.current.closed) {
+      o.current.focus();
+      return;
+    }
+    const l = {
+      small: { width: 380, height: 520 },
+      medium: { width: 440, height: 660 },
+      large: { width: 560, height: 780 },
+      fullscreen: { width: 700, height: 800 }
+    }, { width: g, height: v } = l[n], E = (window.screen.width - g) / 2, x = (window.screen.height - v) / 2, m = window.open(
+      "",
+      "GeoAppsChatPopout",
+      `width=${g},height=${v},left=${E},top=${x},resizable=yes,scrollbars=no`
+    );
+    if (!m) {
+      console.error("Failed to open popup window. Check if popups are blocked.");
+      return;
+    }
+    m.__CHAT_CONFIG__ = e, m.document.write(we(e)), m.document.close(), o.current = m, U = m, r(!0), K(!0, e.tenantId);
+  }, [e, n]), d = A(() => {
+    o.current && !o.current.closed && o.current.close(), o.current = null, U = null, r(!1), K(!1, e.tenantId);
+  }, [e.tenantId]), p = A(() => {
+    o.current && !o.current.closed && o.current.focus();
+  }, []);
+  return {
+    isPoppedOut: a,
+    openPopout: i,
+    closePopout: d,
+    focusPopout: p
+  };
+}
+function we(e) {
+  const n = e.messages.map((t) => ({
+    ...t,
+    timestamp: t.timestamp.toISOString()
+  }));
+  return `
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>${G(e.title)}</title>
+  <style>
+    * { margin: 0; padding: 0; box-sizing: border-box; }
+    html, body, #chat-root { height: 100%; width: 100%; }
+    body { 
+      font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+      background: #f5f5f5;
+    }
+    
+    /* Modern chat widget styling */
+    .popout-container {
+      height: 100%;
+      display: flex;
+      flex-direction: column;
+      background: white;
+      border-radius: 0;
+    }
+    .popout-header {
+      padding: 0.75rem 1rem;
+      color: white;
+      display: flex;
+      align-items: center;
+      gap: 0.75rem;
+      flex-shrink: 0;
+      box-shadow: 0 1px 3px rgba(0,0,0,0.1);
+    }
+    .popout-header-icon {
+      width: 2.5rem;
+      height: 2.5rem;
+      border-radius: 50%;
+      background: rgba(255,255,255,0.2);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      flex-shrink: 0;
+    }
+    .popout-header-icon svg {
+      width: 1.25rem;
+      height: 1.25rem;
+    }
+    .popout-header-info {
+      flex: 1;
+      min-width: 0;
+    }
+    .popout-title {
+      font-weight: 600;
+      font-size: 0.875rem;
+    }
+    .popout-subtitle {
+      font-size: 0.75rem;
+      opacity: 0.9;
+    }
+    .popout-header-actions {
+      display: flex;
+      gap: 0.25rem;
+    }
+    .popout-header-btn {
+      width: 2rem;
+      height: 2rem;
+      border-radius: 50%;
+      border: none;
+      background: rgba(255,255,255,0.1);
+      color: white;
+      cursor: pointer;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      transition: background 0.2s;
+    }
+    .popout-header-btn:hover {
+      background: rgba(255,255,255,0.25);
+    }
+    .popout-header-btn svg {
+      width: 1rem;
+      height: 1rem;
+    }
+    .popout-messages {
+      flex: 1;
+      overflow-y: auto;
+      padding: 1rem;
+      display: flex;
+      flex-direction: column;
+      gap: 1rem;
+      background: #fafafa;
+    }
+    .popout-messages::-webkit-scrollbar {
+      width: 6px;
+    }
+    .popout-messages::-webkit-scrollbar-track {
+      background: transparent;
+    }
+    .popout-messages::-webkit-scrollbar-thumb {
+      background: #d1d5db;
+      border-radius: 3px;
+    }
+    .popout-messages::-webkit-scrollbar-thumb:hover {
+      background: #9ca3af;
+    }
+    /* Empty state */
+    .popout-empty {
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      padding: 2rem;
+      color: #9ca3af;
+      text-align: center;
+    }
+    .popout-empty svg {
+      width: 4rem;
+      height: 4rem;
+      margin-bottom: 1rem;
+      opacity: 0.5;
+    }
+    .popout-empty p {
+      font-size: 0.875rem;
+    }
+    .popout-message-wrapper {
+      display: flex;
+      flex-direction: column;
+    }
+    .popout-message-wrapper.user {
+      align-items: flex-end;
+    }
+    .popout-message-wrapper.assistant {
+      align-items: flex-start;
+    }
+    .popout-message {
+      max-width: 85%;
+      padding: 0.75rem 1rem;
+      border-radius: 1rem;
+      font-size: 0.875rem;
+      line-height: 1.5;
+      word-wrap: break-word;
+    }
+    .popout-message.user {
+      color: white;
+      border-bottom-right-radius: 0.25rem;
+    }
+    .popout-message.assistant {
+      background: #f1f5f9;
+      color: #1f2937;
+      border-bottom-left-radius: 0.25rem;
+      box-shadow: 0 1px 2px rgba(0,0,0,0.05);
+    }
+    .popout-message p { margin-bottom: 0.5rem; }
+    .popout-message p:last-child { margin-bottom: 0; }
+    .popout-message strong { font-weight: 600; }
+    .popout-message em { font-style: italic; }
+    .popout-message code {
+      background: rgba(0,0,0,0.06);
+      padding: 0.125rem 0.375rem;
+      border-radius: 0.25rem;
+      font-size: 0.8125rem;
+      font-family: 'SF Mono', Monaco, Consolas, monospace;
+    }
+    .popout-message.user code {
+      background: rgba(255,255,255,0.2);
+    }
+    .popout-message pre {
+      background: #1f2937;
+      color: #f3f4f6;
+      padding: 0.75rem;
+      border-radius: 0.5rem;
+      font-size: 0.75rem;
+      overflow-x: auto;
+      margin: 0.5rem 0;
+    }
+    .popout-message pre code {
+      background: none;
+      padding: 0;
+      font-size: inherit;
+    }
+    .popout-message ul, .popout-message ol {
+      padding-left: 1.25rem;
+      margin: 0.5rem 0;
+    }
+    .popout-message li { margin: 0.25rem 0; }
+    .popout-message a {
+      color: #2563eb;
+      text-decoration: underline;
+    }
+    .popout-message.user a {
+      color: rgba(255,255,255,0.9);
+    }
+    .popout-input-container {
+      padding: 0.75rem 1rem 1rem;
+      border-top: 1px solid #e5e7eb;
+      flex-shrink: 0;
+      background: white;
+    }
+    .popout-input-wrapper {
+      display: flex;
+      gap: 0.5rem;
+      align-items: flex-end;
+    }
+    .popout-textarea {
+      flex: 1;
+      padding: 0.625rem 1rem;
+      border: 1px solid #e5e7eb;
+      border-radius: 1.25rem;
+      resize: none;
+      font-size: 0.875rem;
+      font-family: inherit;
+      min-height: 44px;
+      max-height: 120px;
+      outline: none;
+      transition: border-color 0.2s, box-shadow 0.2s;
+    }
+    .popout-textarea:focus {
+      border-color: ${e.primaryColor};
+      box-shadow: 0 0 0 3px ${e.primaryColor}15;
+    }
+    .popout-textarea::placeholder {
+      color: #9ca3af;
+    }
+    .popout-send-btn {
+      width: 2.5rem;
+      height: 2.5rem;
+      border-radius: 0.75rem;
+      border: none;
+      color: white;
+      cursor: pointer;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      flex-shrink: 0;
+      transition: opacity 0.2s, transform 0.1s;
+    }
+    .popout-send-btn:hover { opacity: 0.9; }
+    .popout-send-btn:active { transform: scale(0.95); }
+    .popout-send-btn:disabled { opacity: 0.5; cursor: not-allowed; transform: none; }
+    .popout-send-btn svg { width: 1.25rem; height: 1.25rem; }
+    .popout-input-hint {
+      font-size: 0.625rem;
+      color: #9ca3af;
+      text-align: center;
+      margin-top: 0.5rem;
+    }
+    .popout-timestamp {
+      font-size: 0.625rem;
+      color: #9ca3af;
+      margin-top: 0.25rem;
+      padding: 0 0.25rem;
+    }
+    .popout-loading {
+      display: flex;
+      gap: 0.25rem;
+      padding: 0.25rem 0;
+    }
+    .popout-loading span {
+      width: 0.5rem;
+      height: 0.5rem;
+      background: #9ca3af;
+      border-radius: 50%;
+      animation: bounce 1.4s infinite ease-in-out both;
+    }
+    .popout-loading span:nth-child(1) { animation-delay: -0.32s; }
+    .popout-loading span:nth-child(2) { animation-delay: -0.16s; }
+    @keyframes bounce {
+      0%, 80%, 100% { transform: scale(0); }
+      40% { transform: scale(1); }
+    }
+    /* Typing indicator */
+    .typing-indicator {
+      display: flex;
+      align-items: flex-start;
+    }
+    .typing-bubble {
+      background: white;
+      padding: 0.75rem 1rem;
+      border-radius: 1rem;
+      border-bottom-left-radius: 0.25rem;
+      box-shadow: 0 1px 2px rgba(0,0,0,0.05);
+      display: flex;
+      gap: 0.25rem;
+    }
+    .typing-bubble span {
+      width: 0.5rem;
+      height: 0.5rem;
+      background: #9ca3af;
+      border-radius: 50%;
+      animation: bounce 1.4s infinite ease-in-out both;
+    }
+    .typing-bubble span:nth-child(1) { animation-delay: -0.32s; }
+    .typing-bubble span:nth-child(2) { animation-delay: -0.16s; }
+  </style>
+</head>
+<body>
+  <div id="chat-root">
+    <div class="popout-container">
+      <div class="popout-header" style="background: ${e.primaryColor}">
+        <div class="popout-header-icon">
+          <svg fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z" />
+          </svg>
+        </div>
+        <div class="popout-header-info">
+          <div class="popout-title">${G(e.title)}</div>
+          <div class="popout-subtitle">${G(e.subtitle)}</div>
+        </div>
+        <div class="popout-header-actions">
+          <button class="popout-header-btn" id="clear-btn" title="Clear conversation">
+            <svg fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" />
+            </svg>
+          </button>
+        </div>
+      </div>
+      <div class="popout-messages" id="messages-container"></div>
+      <div class="popout-input-container">
+        <div class="popout-input-wrapper">
+          <textarea 
+            class="popout-textarea" 
+            id="message-input"
+            placeholder="${G(e.placeholder)}"
+            rows="1"
+          ></textarea>
+          <button 
+            class="popout-send-btn" 
+            id="send-btn"
+            style="background: ${e.primaryColor}"
+          >
+            <svg fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 19l9 2-9-18-9 18 9-2zm0 0v-8" />
+            </svg>
+          </button>
+        </div>
+        <p class="popout-input-hint">Press Enter to send, Shift+Enter for new line</p>
+      </div>
+    </div>
+  </div>
+  <script>
+    (function() {
+      const config = ${JSON.stringify({
+    apiUrl: e.apiUrl,
+    tenantId: e.tenantId,
+    sessionId: e.sessionId,
+    primaryColor: e.primaryColor,
+    headers: e.headers || {}
+  })};
+      
+      const STORAGE_KEY = 'gcw_chat_' + (config.tenantId || 'default');
+      
+      let messages = ${JSON.stringify(n)}.map(m => ({
+        ...m,
+        timestamp: new Date(m.timestamp)
+      }));
+      let sessionId = config.sessionId;
+      let isLoading = false;
+
+      const messagesContainer = document.getElementById('messages-container');
+      const messageInput = document.getElementById('message-input');
+      const sendBtn = document.getElementById('send-btn');
+
+      // Save state to localStorage for sync with main window
+      function saveState() {
+        try {
+          const state = {
+            messages: messages.map(m => ({
+              id: m.id,
+              role: m.role,
+              content: m.content,
+              timestamp: m.timestamp.toISOString(),
+              sources: m.sources
+            })),
+            sessionId: sessionId,
+            lastUpdated: new Date().toISOString()
+          };
+          localStorage.setItem(STORAGE_KEY, JSON.stringify(state));
+        } catch (e) {
+          console.warn('Failed to save state:', e);
+        }
+      }
+
+      function escapeHtml(text) {
+        const div = document.createElement('div');
+        div.textContent = text;
+        return div.innerHTML;
+      }
+
+      function parseMarkdown(text) {
+        if (!text) return '';
+        
+        // Code blocks
+        text = text.replace(/\`\`\`([\\s\\S]*?)\`\`\`/g, '<pre><code>$1</code></pre>');
+        
+        // Inline code
+        text = text.replace(/\`([^\`]+)\`/g, '<code>$1</code>');
+        
+        // Bold
+        text = text.replace(/\\*\\*(.+?)\\*\\*/g, '<strong>$1</strong>');
+        
+        // Italic
+        text = text.replace(/\\*([^*]+?)\\*/g, '<em>$1</em>');
+        
+        // Links
+        text = text.replace(/\\[([^\\]]+)\\]\\(([^)]+)\\)/g, '<a href="$2" target="_blank" rel="noopener">$1</a>');
+        
+        // Lists
+        const lines = text.split('\\n');
+        let result = [];
+        let inList = false;
+        let listType = null;
+        
+        for (const line of lines) {
+          const ulMatch = line.match(/^[\\s]*[-*•]\\s+(.+)/);
+          const olMatch = line.match(/^[\\s]*(\\d+)[.)]\\s+(.+)/);
+          
+          if (ulMatch) {
+            if (!inList || listType !== 'ul') {
+              if (inList) result.push('</' + listType + '>');
+              result.push('<ul>');
+              inList = true;
+              listType = 'ul';
+            }
+            result.push('<li>' + ulMatch[1] + '</li>');
+          } else if (olMatch) {
+            if (!inList || listType !== 'ol') {
+              if (inList) result.push('</' + listType + '>');
+              result.push('<ol>');
+              inList = true;
+              listType = 'ol';
+            }
+            result.push('<li>' + olMatch[2] + '</li>');
+          } else {
+            if (inList) {
+              result.push('</' + listType + '>');
+              inList = false;
+              listType = null;
+            }
+            if (line.trim()) {
+              result.push('<p>' + line + '</p>');
+            }
+          }
+        }
+        if (inList) result.push('</' + listType + '>');
+        
+        return result.join('');
+      }
+
+      function formatTime(date) {
+        return date.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
+      }
+
+      function renderMessages() {
+        // Show empty state if no messages
+        if (messages.length === 0) {
+          messagesContainer.innerHTML = \`
+            <div class="popout-empty">
+              <svg fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z" />
+              </svg>
+              <p>Start a conversation by typing a message below</p>
+            </div>
+          \`;
+          return;
+        }
+
+        messagesContainer.innerHTML = messages.map(msg => {
+          const isUser = msg.role === 'user';
+          const content = msg.isStreaming && !msg.content 
+            ? '<div class="popout-loading"><span></span><span></span><span></span></div>'
+            : parseMarkdown(escapeHtml(msg.content));
+          
+          return \`
+            <div class="popout-message-wrapper \${msg.role}">
+              <div class="popout-message \${msg.role}" \${isUser ? 'style="background: ' + config.primaryColor + '"' : ''}>
+                \${content}
+              </div>
+              <div class="popout-timestamp">\${formatTime(msg.timestamp)}</div>
+            </div>
+          \`;
+        }).join('');
+        
+        messagesContainer.scrollTop = messagesContainer.scrollHeight;
+      }
+
+      async function sendMessage(content) {
+        if (!content.trim() || isLoading) return;
+
+        const userMsg = {
+          id: 'msg_' + Date.now(),
+          role: 'user',
+          content: content.trim(),
+          timestamp: new Date()
+        };
+        messages.push(userMsg);
+
+        const assistantMsgId = 'msg_' + Date.now() + '_assistant';
+        const assistantMsg = {
+          id: assistantMsgId,
+          role: 'assistant',
+          content: '',
+          timestamp: new Date(),
+          isStreaming: true
+        };
+        messages.push(assistantMsg);
+        
+        isLoading = true;
+        renderMessages();
+        messageInput.value = '';
+        sendBtn.disabled = true;
+
+        try {
+          const response = await fetch(config.apiUrl, {
+            method: 'POST',
+            headers: {
+              'Content-Type': 'application/json',
+              ...(config.tenantId && { 'X-Tenant-ID': config.tenantId }),
+              ...config.headers
+            },
+            body: JSON.stringify({
+              message: content.trim(),
+              session_id: sessionId
+            })
+          });
+
+          if (!response.ok) throw new Error('Request failed');
+
+          const data = await response.json();
+          
+          const msgIndex = messages.findIndex(m => m.id === assistantMsgId);
+          if (msgIndex !== -1) {
+            messages[msgIndex] = {
+              ...messages[msgIndex],
+              content: data.message.content,
+              isStreaming: false
+            };
+          }
+          
+          if (data.session_id) {
+            sessionId = data.session_id;
+          }
+          
+          // Save to localStorage after successful response
+          saveState();
+        } catch (err) {
+          const msgIndex = messages.findIndex(m => m.id === assistantMsgId);
+          if (msgIndex !== -1) {
+            messages[msgIndex] = {
+              ...messages[msgIndex],
+              content: 'Sorry, an error occurred. Please try again.',
+              isStreaming: false
+            };
+          }
+        } finally {
+          isLoading = false;
+          sendBtn.disabled = false;
+          renderMessages();
+          saveState(); // Always save state after message exchange
+        }
+      }
+
+      // Auto-resize textarea
+      messageInput.addEventListener('input', function() {
+        this.style.height = 'auto';
+        this.style.height = Math.min(this.scrollHeight, 120) + 'px';
+      });
+
+      // Send on Enter (Shift+Enter for newline)
+      messageInput.addEventListener('keydown', function(e) {
+        if (e.key === 'Enter' && !e.shiftKey) {
+          e.preventDefault();
+          sendMessage(this.value);
+        }
+      });
+
+      sendBtn.addEventListener('click', function() {
+        sendMessage(messageInput.value);
+      });
+
+      // Clear conversation button
+      const clearBtn = document.getElementById('clear-btn');
+      if (clearBtn) {
+        clearBtn.addEventListener('click', function() {
+          if (confirm('Are you sure you want to clear the conversation?')) {
+            messages = [];
+            sessionId = null;
+            saveState();
+            renderMessages();
+          }
+        });
+      }
+
+      // Initial render
+      renderMessages();
+      messageInput.focus();
+    })();
+  <\/script>
+</body>
+</html>
+  `;
+}
+function G(e) {
+  return e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
+}
+function be({ content: e, className: n }) {
+  if (!e) return null;
+  const t = ve(e);
+  return /* @__PURE__ */ s("div", { className: n, children: t.map((a, r) => /* @__PURE__ */ s(J.Fragment, { children: a }, r)) });
+}
+function ve(e) {
+  const n = e.split(`
+`), t = [];
+  let a = null;
+  const r = () => {
+    a && (a.type === "ul" ? t.push(
+      /* @__PURE__ */ s("ul", { className: "gcw-md-list gcw-md-list--ul", children: a.items.map((o, i) => /* @__PURE__ */ s("li", { className: "gcw-md-list__item", children: o }, i)) }, `list-${t.length}`)
+    ) : t.push(
+      /* @__PURE__ */ s("ol", { className: "gcw-md-list gcw-md-list--ol", children: a.items.map((o, i) => /* @__PURE__ */ s("li", { className: "gcw-md-list__item", children: o }, i)) }, `list-${t.length}`)
+    ), a = null);
+  };
+  for (let o = 0; o < n.length; o++) {
+    const i = n[o];
+    if (i.startsWith("#### ")) {
+      r(), t.push(
+        /* @__PURE__ */ s("h5", { className: "gcw-md-heading gcw-md-heading--h5", children: z(i.slice(5)) }, o)
+      );
+      continue;
+    }
+    if (i.startsWith("### ")) {
+      r(), t.push(
+        /* @__PURE__ */ s("h4", { className: "gcw-md-heading gcw-md-heading--h4", children: z(i.slice(4)) }, o)
+      );
+      continue;
+    }
+    if (i.startsWith("## ")) {
+      r(), t.push(
+        /* @__PURE__ */ s("h3", { className: "gcw-md-heading gcw-md-heading--h3", children: z(i.slice(3)) }, o)
+      );
+      continue;
+    }
+    if (i.startsWith("# ")) {
+      r(), t.push(
+        /* @__PURE__ */ s("h2", { className: "gcw-md-heading gcw-md-heading--h2", children: z(i.slice(2)) }, o)
+      );
+      continue;
+    }
+    const d = i.match(/^[\s]*[-*•]\s+(.+)/);
+    if (d) {
+      (!a || a.type !== "ul") && (r(), a = { type: "ul", items: [] }), a.items.push(z(d[1]));
+      continue;
+    }
+    const p = i.match(/^[\s]*(\d+)[.)]\s+(.+)/);
+    if (p) {
+      (!a || a.type !== "ol") && (r(), a = { type: "ol", items: [] }), a.items.push(z(p[2]));
+      continue;
+    }
+    if (i.startsWith("```")) {
+      r();
+      const l = [];
+      for (o++; o < n.length && !n[o].startsWith("```"); )
+        l.push(n[o]), o++;
+      t.push(
+        /* @__PURE__ */ s("pre", { className: "gcw-md-code-block", children: /* @__PURE__ */ s("code", { children: l.join(`
+`) }) }, `code-${t.length}`)
+      );
+      continue;
+    }
+    if (i.trim() === "") {
+      r();
+      continue;
+    }
+    r(), t.push(
+      /* @__PURE__ */ s("p", { className: "gcw-md-paragraph", children: z(i) }, o)
+    );
+  }
+  return r(), t;
+}
+function z(e) {
+  if (!e) return null;
+  const n = [];
+  let t = e, a = 0;
+  for (; t.length > 0; ) {
+    const r = t.match(/^\*\*(.+?)\*\*/);
+    if (r) {
+      n.push(/* @__PURE__ */ s("strong", { className: "gcw-md-bold", children: r[1] }, a++)), t = t.slice(r[0].length);
+      continue;
+    }
+    const o = t.match(/^\*([^*]+?)\*/);
+    if (o) {
+      n.push(/* @__PURE__ */ s("em", { className: "gcw-md-italic", children: o[1] }, a++)), t = t.slice(o[0].length);
+      continue;
+    }
+    const i = t.match(/^`([^`]+)`/);
+    if (i) {
+      n.push(
+        /* @__PURE__ */ s("code", { className: "gcw-md-code", children: i[1] }, a++)
+      ), t = t.slice(i[0].length);
+      continue;
+    }
+    const d = t.match(/^\[([^\]]+)\]\(([^)]+)\)/);
+    if (d) {
+      n.push(
+        /* @__PURE__ */ s(
+          "a",
+          {
+            href: d[2],
+            target: "_blank",
+            rel: "noopener noreferrer",
+            className: "gcw-md-link",
+            children: d[1]
+          },
+          a++
+        )
+      ), t = t.slice(d[0].length);
+      continue;
+    }
+    const p = t.search(/[\*`\[]/);
+    if (p === -1) {
+      n.push(t);
+      break;
+    } else p === 0 ? (n.push(t[0]), t = t.slice(1)) : (n.push(t.slice(0, p)), t = t.slice(p));
+  }
+  return n.length === 1 ? n[0] : n;
+}
+function ye() {
+  return /* @__PURE__ */ b("div", { className: "gcw-typing__dots", children: [
+    /* @__PURE__ */ s("span", { className: "gcw-typing__dot" }),
+    /* @__PURE__ */ s("span", { className: "gcw-typing__dot" }),
+    /* @__PURE__ */ s("span", { className: "gcw-typing__dot" })
+  ] });
+}
+function ke({ className: e }) {
+  return /* @__PURE__ */ s("svg", { className: e, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ s("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1" }) });
+}
+function xe(e) {
+  return e.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" });
+}
+function Me(e, n) {
+  return e.length <= n ? e : e.slice(0, n - 3) + "...";
+}
+function _e({ message: e, primaryColor: n }) {
+  const t = e.role === "user", a = t ? "user" : "assistant";
+  return /* @__PURE__ */ s("div", { className: `gcw-bubble-row gcw-bubble-row--${a}`, children: /* @__PURE__ */ b("div", { className: `gcw-bubble-wrapper gcw-bubble-wrapper--${a}`, children: [
+    /* @__PURE__ */ s(
+      "div",
+      {
+        className: `gcw-bubble gcw-bubble--${a}`,
+        style: t ? { backgroundColor: n } : void 0,
+        children: e.isStreaming && !e.content ? /* @__PURE__ */ s(ye, {}) : /* @__PURE__ */ s(be, { content: e.content, className: "gcw-content" })
+      }
+    ),
+    e.sources && e.sources.length > 0 && /* @__PURE__ */ s("div", { className: "gcw-sources", children: e.sources.slice(0, 3).map((r, o) => /* @__PURE__ */ b(
+      "a",
+      {
+        href: r.url,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className: "gcw-source",
+        children: [
+          /* @__PURE__ */ s(ke, { className: "gcw-source__icon" }),
+          Me(r.title, 25)
+        ]
+      },
+      o
+    )) }),
+    /* @__PURE__ */ s("span", { className: "gcw-bubble__timestamp", children: xe(e.timestamp) })
+  ] }) });
+}
+function Ce() {
+  return /* @__PURE__ */ s("div", { className: "gcw-typing", children: /* @__PURE__ */ s("div", { className: "gcw-typing__bubble", children: /* @__PURE__ */ b("div", { className: "gcw-typing__dots", children: [
+    /* @__PURE__ */ s("span", { className: "gcw-typing__dot" }),
+    /* @__PURE__ */ s("span", { className: "gcw-typing__dot" }),
+    /* @__PURE__ */ s("span", { className: "gcw-typing__dot" })
+  ] }) }) });
+}
+function Se({ messages: e, isLoading: n, primaryColor: t }) {
+  var r;
+  const a = R(null);
+  return L(() => {
+    var o;
+    (o = a.current) == null || o.scrollIntoView({ behavior: "smooth" });
+  }, [e, n]), e.length === 0 && !n ? /* @__PURE__ */ b("div", { className: "gcw-empty", children: [
+    /* @__PURE__ */ s("svg", { className: "gcw-empty__icon", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ s("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z" }) }),
+    /* @__PURE__ */ s("p", { className: "gcw-empty__text", children: "Start a conversation by typing a message below" })
+  ] }) : /* @__PURE__ */ b("div", { className: "gcw-messages", children: [
+    e.map((o) => /* @__PURE__ */ s(
+      _e,
+      {
+        message: o,
+        primaryColor: t
+      },
+      o.id
+    )),
+    n && ((r = e[e.length - 1]) == null ? void 0 : r.role) !== "assistant" && /* @__PURE__ */ s(Ce, {}),
+    /* @__PURE__ */ s("div", { ref: a })
+  ] });
+}
+function Ie({ placeholder: e, isLoading: n, onSendMessage: t, primaryColor: a }) {
+  const [r, o] = I(""), i = R(null);
+  L(() => {
+    const l = i.current;
+    l && (l.style.height = "auto", l.style.height = `${Math.min(l.scrollHeight, 120)}px`);
+  }, [r]);
+  const d = () => {
+    r.trim() && !n && (t(r), o(""), i.current && (i.current.style.height = "auto"));
+  };
+  return /* @__PURE__ */ b("div", { className: "gcw-input-area", children: [
+    /* @__PURE__ */ b("div", { className: "gcw-input-row", children: [
+      /* @__PURE__ */ s(
+        "textarea",
+        {
+          ref: i,
+          value: r,
+          onChange: (l) => o(l.target.value),
+          onKeyDown: (l) => {
+            l.key === "Enter" && !l.shiftKey && (l.preventDefault(), d());
+          },
+          placeholder: e,
+          disabled: n,
+          rows: 1,
+          className: "gcw-input"
+        }
+      ),
+      /* @__PURE__ */ s(
+        "button",
+        {
+          onClick: d,
+          disabled: !r.trim() || n,
+          className: "gcw-send-btn",
+          style: { backgroundColor: a },
+          title: "Send message",
+          children: n ? /* @__PURE__ */ b("svg", { className: "gcw-send-btn__icon gcw-spin", fill: "none", viewBox: "0 0 24 24", children: [
+            /* @__PURE__ */ s("circle", { style: { opacity: 0.25 }, cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
+            /* @__PURE__ */ s("path", { style: { opacity: 0.75 }, fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })
+          ] }) : /* @__PURE__ */ s("svg", { className: "gcw-send-btn__icon", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ s("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 19l9 2-9-18-9 18 9-2zm0 0v-8" }) })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ s("p", { className: "gcw-input-hint", children: "Press Enter to send, Shift+Enter for new line" })
+  ] });
+}
+function Ne({ size: e, className: n = "gcw-w-4 gcw-h-4" }) {
+  switch (e) {
+    case "small":
+      return /* @__PURE__ */ s("svg", { className: n, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ s("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5l-5-5m5 5v-4m0 4h-4" }) });
+    case "medium":
+      return /* @__PURE__ */ s("svg", { className: n, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ s("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5l-5-5m5 5v-4m0 4h-4" }) });
+    case "large":
+      return /* @__PURE__ */ s("svg", { className: n, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ s("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5l-5-5m5 5v-4m0 4h-4" }) });
+    case "fullscreen":
+      return /* @__PURE__ */ s("svg", { className: n, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ s("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 9V4.5M9 9H4.5M9 9L3.75 3.75M9 15v4.5M9 15H4.5M9 15l-5.25 5.25M15 9h4.5M15 9V4.5M15 9l5.25-5.25M15 15h4.5M15 15v4.5m0-4.5l5.25 5.25" }) });
+  }
+}
+function Le({ className: e = "gcw-w-4 gcw-h-4" }) {
+  return /* @__PURE__ */ s("svg", { className: e, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ s("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" }) });
+}
+function Ee({ className: e = "gcw-w-4 gcw-h-4" }) {
+  return /* @__PURE__ */ s("svg", { className: e, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ s("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) });
+}
+function Te({ className: e = "gcw-w-4 gcw-h-4" }) {
+  return /* @__PURE__ */ s("svg", { className: e, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ s("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" }) });
+}
+function $e({ className: e = "gcw-w-6 gcw-h-6" }) {
+  return /* @__PURE__ */ s("svg", { className: e, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ s("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8 10h.01M12 10h.01M16 10h.01M9 16H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-5l-5 5v-5z" }) });
+}
+const Be = {
+  small: "gcw-window--small",
+  medium: "gcw-window--medium",
+  large: "gcw-window--large",
+  fullscreen: "gcw-window--fullscreen"
+};
+function je({
+  title: e,
+  subtitle: n,
+  placeholder: t,
+  messages: a,
+  isLoading: r,
+  onSendMessage: o,
+  onClose: i,
+  onClear: d,
+  onSizeChange: p,
+  onPopout: l,
+  primaryColor: g,
+  size: v
+}) {
+  const E = () => {
+    const x = ["small", "medium", "large", "fullscreen"], f = (x.indexOf(v) + 1) % x.length;
+    p(x[f]);
+  };
+  return /* @__PURE__ */ b("div", { className: `gcw-window ${Be[v]}`, children: [
+    /* @__PURE__ */ b("div", { className: "gcw-header", style: { backgroundColor: g }, children: [
+      /* @__PURE__ */ b("div", { className: "gcw-header__left", children: [
+        /* @__PURE__ */ s("div", { className: "gcw-header__avatar", children: /* @__PURE__ */ s($e, { className: "gcw-header__avatar-icon" }) }),
+        /* @__PURE__ */ b("div", { className: "gcw-header__info", children: [
+          /* @__PURE__ */ s("h3", { className: "gcw-header__title", children: e }),
+          /* @__PURE__ */ s("p", { className: "gcw-header__subtitle", children: n })
+        ] })
+      ] }),
+      /* @__PURE__ */ b("div", { className: "gcw-header__actions", children: [
+        /* @__PURE__ */ s(
+          "button",
+          {
+            onClick: E,
+            className: "gcw-header__btn",
+            title: `Size: ${v} (click to cycle)`,
+            children: /* @__PURE__ */ s(Ne, { size: v, className: "gcw-header__btn-icon" })
+          }
+        ),
+        /* @__PURE__ */ s(
+          "button",
+          {
+            onClick: l,
+            className: "gcw-header__btn",
+            title: "Open in new window",
+            children: /* @__PURE__ */ s(Le, { className: "gcw-header__btn-icon" })
+          }
+        ),
+        /* @__PURE__ */ s(
+          "button",
+          {
+            onClick: d,
+            className: "gcw-header__btn",
+            title: "Clear conversation",
+            children: /* @__PURE__ */ s(Te, { className: "gcw-header__btn-icon" })
+          }
+        ),
+        /* @__PURE__ */ s(
+          "button",
+          {
+            onClick: i,
+            className: "gcw-header__btn",
+            title: "Close",
+            children: /* @__PURE__ */ s(Ee, { className: "gcw-header__btn-icon" })
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ s(
+      Se,
+      {
+        messages: a,
+        isLoading: r,
+        primaryColor: g
+      }
+    ),
+    /* @__PURE__ */ s(
+      Ie,
+      {
+        placeholder: t,
+        isLoading: r,
+        onSendMessage: o,
+        primaryColor: g
+      }
+    )
+  ] });
+}
+function De({ isOpen: e, onClick: n, primaryColor: t, hasUnread: a, isPoppedOut: r }) {
+  return /* @__PURE__ */ b(
+    "button",
+    {
+      onClick: n,
+      className: "gcw-toggle",
+      style: { backgroundColor: t },
+      title: r ? "Chat is open in another window" : e ? "Close chat" : "Open chat",
+      children: [
+        a && !e && /* @__PURE__ */ s("span", { className: "gcw-toggle__badge gcw-toggle__badge--unread", children: "!" }),
+        r && /* @__PURE__ */ s("span", { className: "gcw-toggle__badge gcw-toggle__badge--popout" }),
+        /* @__PURE__ */ s("div", { className: "gcw-toggle__icon", children: r ? /* @__PURE__ */ s("svg", { fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ s("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" }) }) : e ? /* @__PURE__ */ s("svg", { fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ s("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) : /* @__PURE__ */ s("svg", { fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ s("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z" }) }) })
+      ]
+    }
+  );
+}
+function re({
+  apiUrl: e,
+  tenantId: n,
+  title: t = "Chat Assistant",
+  subtitle: a = "How can I help you?",
+  placeholder: r = "Type a message...",
+  greeting: o,
+  primaryColor: i = "#3b82f6",
+  position: d = "bottom-right",
+  defaultOpen: p = !1,
+  defaultSize: l = "medium",
+  headers: g,
+  onOpen: v,
+  onClose: E,
+  onMessageSent: x,
+  onResponseReceived: m
+}) {
+  const [f, B] = I(p), [O, X] = I(l), [q, T] = I(!1), { messages: c, isLoading: _, sendMessage: $, clearMessages: W, sessionId: P } = ge({
+    apiUrl: e,
+    tenantId: n,
+    headers: g
+  }), [u, y] = I(() => c.length > 0), [h, C] = I([]);
+  L(() => {
+    f && o && !u && c.length === 0 && y(!0);
+  }, [f, o, u, c.length]), L(() => {
+    c.length > 0 && y(!0);
+  }, [c.length]), L(() => {
+    u && o && c.length === 0 ? C([
+      {
+        id: "greeting",
+        role: "assistant",
+        content: o,
+        timestamp: /* @__PURE__ */ new Date()
+      }
+    ]) : o && c.length > 0 ? C([
+      {
+        id: "greeting",
+        role: "assistant",
+        content: o,
+        timestamp: /* @__PURE__ */ new Date()
+      },
+      ...c
+    ]) : C(c);
+  }, [c, u, o]);
+  const { isPoppedOut: k, openPopout: j, focusPopout: F } = fe(
+    {
+      apiUrl: e,
+      tenantId: n,
+      title: t,
+      subtitle: a,
+      placeholder: r,
+      primaryColor: i,
+      sessionId: P,
+      messages: h,
+      headers: g
+    },
+    O,
+    () => {
+    }
+  );
+  L(() => {
+    if (f || k) {
+      const w = [...c].reverse().find((M) => !M.isStreaming && M.content);
+      w && Z(w.id, n), T(!1);
+    } else {
+      const w = c.filter((N) => !N.isStreaming && N.content), M = he(n);
+      if (w.length === 0) {
+        T(!1);
+        return;
+      }
+      if (!M) {
+        T(w.some((N) => N.role === "assistant"));
+        return;
+      }
+      const H = w.findIndex((N) => N.id === M);
+      if (H === -1) {
+        T(w.some((N) => N.role === "assistant"));
+        return;
+      }
+      const ae = w.slice(H + 1).some((N) => N.role === "assistant");
+      T(ae);
+    }
+  }, [f, k, c, n]);
+  const S = () => {
+    if (k) {
+      F();
+      return;
+    }
+    const w = !f;
+    if (B(w), w) {
+      v == null || v();
+      const M = [...c].reverse().find((H) => !H.isStreaming && H.content);
+      M && Z(M.id, n), T(!1);
+    } else
+      E == null || E();
+  };
+  return /* @__PURE__ */ b("div", { className: `gcw-widget gcw-container ${d === "top-left" ? "gcw-container--top-left" : d === "top-right" ? "gcw-container--top-right" : d === "bottom-left" ? "gcw-container--bottom-left" : "gcw-container--bottom-right"}`, children: [
+    f && !k && /* @__PURE__ */ s(
+      je,
+      {
+        title: t,
+        subtitle: a,
+        placeholder: r,
+        messages: h,
+        isLoading: _,
+        onSendMessage: async (w) => {
+          x == null || x(w), await $(w);
+          const M = c[c.length - 1];
+          (M == null ? void 0 : M.role) === "assistant" && (m == null || m(M.content));
+        },
+        onClose: S,
+        onClear: () => {
+          W(), y(!1), C([]), T(!1), Z(null, n);
+        },
+        onSizeChange: (w) => {
+          X(w);
+        },
+        onPopout: () => {
+          B(!1), j();
+        },
+        primaryColor: i,
+        size: O
+      }
+    ),
+    /* @__PURE__ */ s(
+      De,
+      {
+        isOpen: f,
+        onClick: S,
+        primaryColor: i,
+        hasUnread: q && !f && !k,
+        isPoppedOut: k
+      }
+    )
+  ] });
+}
+function ee(e, n) {
+  let t;
+  if (n) {
+    const r = document.getElementById(n);
+    if (!r)
+      throw new Error(`Container with id "${n}" not found`);
+    t = r;
+  } else
+    t = document.createElement("div"), t.id = "geoapps-chat-widget-root", document.body.appendChild(t);
+  const a = ie.createRoot(t);
+  return a.render(
+    J.createElement(
+      J.StrictMode,
+      null,
+      J.createElement(re, e)
+    )
+  ), () => {
+    a.unmount(), !n && t.parentNode && t.parentNode.removeChild(t);
+  };
+}
+if (typeof window < "u") {
+  window.GeoAppsChatWidget = {
+    embed: ee,
+    ChatWidget: re
+  };
+  const e = document.currentScript;
+  if (e) {
+    const n = e.dataset.apiUrl;
+    n && (document.readyState === "loading" ? document.addEventListener("DOMContentLoaded", () => {
+      ee({
+        apiUrl: n,
+        title: e.dataset.title,
+        subtitle: e.dataset.subtitle,
+        greeting: e.dataset.greeting,
+        placeholder: e.dataset.placeholder,
+        primaryColor: e.dataset.primaryColor,
+        position: e.dataset.position,
+        defaultOpen: e.dataset.defaultOpen === "true"
+      });
+    }) : ee({
+      apiUrl: n,
+      title: e.dataset.title,
+      subtitle: e.dataset.subtitle,
+      greeting: e.dataset.greeting,
+      placeholder: e.dataset.placeholder,
+      primaryColor: e.dataset.primaryColor,
+      position: e.dataset.position,
+      defaultOpen: e.dataset.defaultOpen === "true"
+    }));
+  }
+}
+export {
+  _e as ChatBubble,
+  re as ChatWidget,
+  je as ChatWindow,
+  Ie as MessageInput,
+  Se as MessageList,
+  De as ToggleButton,
+  ee as embedChatWidget,
+  ge as useChat
+};