aizek-chatbot 1.0.29 → 1.0.30

package/dist/index.mjs

@@ -0,0 +1,1182 @@
+import { useRef, useState, useEffect } from 'react';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import ReactMarkdown from 'react-markdown';
+import remarkGfm from 'remark-gfm';
+import sanitizeHtml from 'sanitize-html';
+
+// src/utils/global.ts
+var SESSION_TTL_MS = 60 * 60 * 1e3;
+var MAX_SESSIONS = 3;
+var DEVICE_KEY = "aizek_device_id_v1";
+var ACTIVE_SESSION_KEY = "aizek_active_session_v1";
+var LOCAL_SESSIONS_KEY = "aizek_sessions_v1";
+function validateHeaders(headers, authConfig, opts = {}) {
+  if (headers && (!authConfig || Object.keys(authConfig).length === 0)) {
+    return {
+      isValid: false,
+      missingKeys: [],
+      extraKeys: [],
+      emptyValueKeys: [],
+      warning: "Auth config bo\u015F ya da tan\u0131ms\u0131z, header do\u011Frulamas\u0131 yap\u0131lam\u0131yor."
+    };
+  }
+  const { caseSensitive = false, allowExtra = false } = opts;
+  const normalize = (s) => caseSensitive ? s : s.toLowerCase();
+  const headerEntries = Object.entries(headers).map(([k, v]) => [normalize(k), v.trim()]);
+  const authEntries = Object.entries(authConfig).map(([k, v]) => [normalize(k), v.trim()]);
+  const headerKeys = headerEntries.map(([k]) => k);
+  const authKeys = authEntries.map(([k]) => k);
+  const requiredSet = new Set(authKeys);
+  const missingKeys = authKeys.filter((k) => !headerKeys.includes(k));
+  const extraKeys = headerKeys.filter((k) => !requiredSet.has(k));
+  const hasAllRequired = missingKeys.length === 0;
+  const hasExtraKeys = extraKeys.length > 0 && !allowExtra;
+  const emptyValueKeys = authKeys.filter((k) => {
+    const val = headerEntries.find(([key]) => key === k)?.[1];
+    return !val || val.length === 0;
+  });
+  const isValid = hasAllRequired && !hasExtraKeys && emptyValueKeys.length === 0;
+  return { isValid, missingKeys, extraKeys, emptyValueKeys };
+}
+function getOrCreateDeviceId() {
+  if (typeof window === "undefined") return "";
+  const existing = localStorage.getItem(DEVICE_KEY);
+  if (existing) return existing;
+  const id = crypto.randomUUID();
+  localStorage.setItem(DEVICE_KEY, id);
+  return id;
+}
+function now() {
+  return Date.now();
+}
+function readStoredSessions() {
+  try {
+    const raw = localStorage.getItem(LOCAL_SESSIONS_KEY);
+    const parsed = JSON.parse(raw ?? "[]");
+    if (!Array.isArray(parsed)) return [];
+    return parsed.filter((x) => x && typeof x.sessionId === "string" && typeof x.lastActive === "number").slice(0, MAX_SESSIONS);
+  } catch {
+    return [];
+  }
+}
+function writeStoredSessions(list) {
+  localStorage.setItem(LOCAL_SESSIONS_KEY, JSON.stringify(list.slice(0, MAX_SESSIONS)));
+}
+function purgeExpiredLocalSessions(setActiveSessionIdState) {
+  const list = readStoredSessions();
+  const filtered = list.filter((s) => now() - s.lastActive <= SESSION_TTL_MS);
+  if (filtered.length !== list.length) writeStoredSessions(filtered);
+  const active = getActiveSessionId();
+  if (active && !filtered.some((s) => s.sessionId === active)) {
+    setActiveSessionId(null);
+    setActiveSessionIdState(null);
+  }
+  return filtered;
+}
+function getActiveSessionId() {
+  return localStorage.getItem(ACTIVE_SESSION_KEY);
+}
+function setActiveSessionId(id) {
+  if (!id) localStorage.removeItem(ACTIVE_SESSION_KEY);
+  else localStorage.setItem(ACTIVE_SESSION_KEY, id);
+}
+function touchSession(sessionId) {
+  const list = readStoredSessions();
+  const next = list.map((s) => s.sessionId === sessionId ? { ...s, lastActive: now() } : s);
+  if (!next.some((s) => s.sessionId === sessionId)) next.unshift({ sessionId, lastActive: now() });
+  writeStoredSessions(next.slice(0, MAX_SESSIONS));
+}
+function upsertSessionsFromServer(serverSessionIds, setSessions) {
+  const local = readStoredSessions();
+  const map = new Map(local.map((s) => [s.sessionId, s.lastActive]));
+  const merged = serverSessionIds.slice(0, MAX_SESSIONS).map((sid) => ({
+    sessionId: sid,
+    lastActive: map.get(sid) ?? now()
+  }));
+  writeStoredSessions(merged);
+  setSessions(merged.map((x) => x.sessionId));
+  return merged;
+}
+var HeaderAlert = ({ headerValidation, showAlert, setShowAlert }) => {
+  if (!headerValidation || !showAlert) return null;
+  const { isValid, missingKeys, extraKeys, emptyValueKeys, warning } = headerValidation;
+  if (isValid && missingKeys.length === 0 && extraKeys.length === 0 && emptyValueKeys.length === 0 && !warning) {
+    return null;
+  }
+  const hasErrors = missingKeys.length > 0 || emptyValueKeys.length > 0;
+  const hasWarnings = extraKeys.length > 0 || !!warning;
+  const alertType = hasErrors ? "error" : "warning";
+  const getAlertIcon = () => {
+    if (hasErrors) {
+      return /* @__PURE__ */ jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z" }) });
+    }
+    return /* @__PURE__ */ jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx("path", { d: "M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z" }) });
+  };
+  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: `alert-container ${alertType}`, children: [
+    /* @__PURE__ */ jsx("div", { className: "alert-icon-container", children: getAlertIcon() }),
+    /* @__PURE__ */ jsxs("div", { className: "alert-content", children: [
+      /* @__PURE__ */ jsx("h4", { className: "alert-title", children: hasErrors ? "Header Do\u011Frulama Hatas\u0131" : "Header Uyar\u0131s\u0131" }),
+      /* @__PURE__ */ jsx("p", { className: "alert-message", children: hasErrors && hasWarnings ? "Header yap\u0131land\u0131rman\u0131zda hatalar ve uyar\u0131lar bulundu." : hasErrors ? "Header yap\u0131land\u0131rman\u0131zda hatalar bulundu." : "Header yap\u0131land\u0131rman\u0131zda fazla anahtarlar bulundu." }),
+      missingKeys.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("strong", { children: "Eksik Header'lar:" }),
+        /* @__PURE__ */ jsx("ul", { className: "alert-list", children: missingKeys.map((key, index) => /* @__PURE__ */ jsxs("li", { className: "alert-list-item", children: [
+          /* @__PURE__ */ jsx("span", { children: "\u2022" }),
+          /* @__PURE__ */ jsx("code", { children: key })
+        ] }, index)) })
+      ] }),
+      emptyValueKeys.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("strong", { children: "Bo\u015F De\u011Ferli Header'lar:" }),
+        /* @__PURE__ */ jsx("ul", { className: "alert-list", children: emptyValueKeys.map((key, index) => /* @__PURE__ */ jsxs("li", { className: "alert-list-item", children: [
+          /* @__PURE__ */ jsx("span", { children: "\u2022" }),
+          /* @__PURE__ */ jsx("code", { children: key }),
+          /* @__PURE__ */ jsx("span", { children: "(de\u011Fer bo\u015F olamaz)" })
+        ] }, index)) })
+      ] }),
+      extraKeys.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("strong", { children: "Fazla Header'lar:" }),
+        /* @__PURE__ */ jsx("ul", { className: "alert-list", children: extraKeys.map((key, index) => /* @__PURE__ */ jsxs("li", { className: "alert-list-item", children: [
+          /* @__PURE__ */ jsx("span", { children: "\u2022" }),
+          /* @__PURE__ */ jsx("code", { children: key })
+        ] }, index)) })
+      ] }),
+      warning && /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("strong", { children: "Uyar\u0131:" }),
+        /* @__PURE__ */ jsx("p", { className: "alert-message", children: warning })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        onClick: () => setShowAlert(false),
+        className: "alert-close-button",
+        "aria-label": "Uyar\u0131y\u0131 kapat",
+        children: /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx("path", { d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" }) })
+      }
+    )
+  ] }) });
+};
+var LoadingSpinner = () => {
+  return /* @__PURE__ */ jsx("div", { className: "loading-spinner" });
+};
+var ChatInput = ({ isLoading, placeholder, handleSendMessage }) => {
+  const [message, setMessage] = useState("");
+  const textareaRef = useRef(null);
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    if (message.trim() && !isLoading) {
+      handleSendMessage(message.trim());
+      setMessage("");
+      if (textareaRef.current) {
+        textareaRef.current.style.height = "auto";
+      }
+    }
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter" && !e.shiftKey) {
+      e.preventDefault();
+      handleSubmit(e);
+    }
+  };
+  const handleInputChange = (e) => {
+    setMessage(e.target.value);
+    const textarea = e.target;
+    textarea.style.height = "auto";
+    textarea.style.height = Math.min(textarea.scrollHeight, 120) + "px";
+  };
+  return /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "input-container", children: [
+    /* @__PURE__ */ jsx(
+      "textarea",
+      {
+        ref: textareaRef,
+        value: message,
+        onChange: handleInputChange,
+        onKeyDown: handleKeyDown,
+        placeholder,
+        disabled: isLoading,
+        className: "textarea"
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "submit",
+        disabled: isLoading || !message.trim(),
+        className: "send-button",
+        children: isLoading ? /* @__PURE__ */ jsx(LoadingSpinner, {}) : /* @__PURE__ */ jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx("path", { d: "M2.01 21L23 12 2.01 3 2 10l15 2-15 2z" }) })
+      }
+    )
+  ] });
+};
+var GenericUIRenderer = ({ uiData, onInteraction }) => {
+  const containerRef = useRef(null);
+  if (!uiData || !uiData.components) return null;
+  const collectFormValues = () => {
+    if (!containerRef.current) return {};
+    const formData = {};
+    const inputs = containerRef.current.querySelectorAll("input, textarea, select");
+    inputs.forEach((element) => {
+      const name = element.getAttribute("name");
+      if (name) {
+        if (element instanceof HTMLInputElement && element.type === "checkbox") {
+          formData[name] = element.checked;
+        } else if (element instanceof HTMLInputElement && element.type === "radio") {
+          if (element.checked) {
+            formData[name] = element.value;
+          }
+        } else {
+          formData[name] = element.value;
+        }
+      }
+    });
+    return formData;
+  };
+  const renderComponent = (comp) => {
+    switch (comp.type) {
+      case "text":
+        return /* @__PURE__ */ jsx("p", { className: "gen-ui-text", children: comp.value ?? comp.label }, comp.id);
+      case "input":
+        return /* @__PURE__ */ jsxs("div", { className: "gen-ui-input-wrapper", children: [
+          comp.label && /* @__PURE__ */ jsx("label", { className: "gen-ui-input-label", children: comp.label }),
+          comp.fieldType === "textarea" ? /* @__PURE__ */ jsx(
+            "textarea",
+            {
+              name: comp.id,
+              placeholder: comp.placeholder,
+              className: "gen-ui-textarea"
+            }
+          ) : /* @__PURE__ */ jsx(
+            "input",
+            {
+              name: comp.id,
+              type: comp.fieldType || "text",
+              placeholder: comp.placeholder,
+              className: "gen-ui-input"
+            }
+          )
+        ] }, comp.id);
+      case "select":
+        return /* @__PURE__ */ jsxs("div", { className: "gen-ui-select-wrapper", children: [
+          comp.label && /* @__PURE__ */ jsx("label", { className: "gen-ui-select-label", children: comp.label }),
+          /* @__PURE__ */ jsx("select", { name: comp.id, className: "gen-ui-select", children: comp.options?.map((opt) => /* @__PURE__ */ jsx("option", { value: opt, children: opt }, opt)) })
+        ] }, comp.id);
+      case "button":
+        return /* @__PURE__ */ jsx(
+          "button",
+          {
+            onClick: () => {
+              const formValues = collectFormValues();
+              onInteraction({
+                action: comp.label,
+                buttonId: comp.buttonType,
+                formData: formValues
+              });
+            },
+            className: "gen-ui-button",
+            children: comp.label
+          },
+          comp.id
+        );
+      case "card":
+        return /* @__PURE__ */ jsxs("div", { className: "gen-ui-card", children: [
+          comp.label && /* @__PURE__ */ jsx("h2", { className: "gen-ui-card-title", children: comp.label }),
+          comp.value && /* @__PURE__ */ jsx("p", { className: "gen-ui-card-content", children: comp.value })
+        ] }, comp.id);
+      case "list":
+        return /* @__PURE__ */ jsx("ul", { className: "gen-ui-list", children: comp.items?.map((item) => /* @__PURE__ */ jsx("li", { className: "gen-ui-list-item", children: item.label ?? String(item.value ?? "") }, item.id)) }, comp.id);
+      case "image":
+        return /* @__PURE__ */ jsx(
+          "img",
+          {
+            src: comp.url,
+            alt: comp.label || "",
+            className: "gen-ui-image"
+          },
+          comp.id
+        );
+      case "link":
+        return /* @__PURE__ */ jsx(
+          "a",
+          {
+            href: comp.url,
+            className: "gen-ui-link",
+            children: comp.label || comp.url
+          },
+          comp.id
+        );
+      case "table":
+        return /* @__PURE__ */ jsx("div", { className: "gen-ui-table-wrapper", children: /* @__PURE__ */ jsxs("table", { className: "gen-ui-table", children: [
+          comp.columns && /* @__PURE__ */ jsx("thead", { className: "gen-ui-table-header", children: /* @__PURE__ */ jsx("tr", { children: comp.columns.map((col) => /* @__PURE__ */ jsx("th", { className: "gen-ui-table-th", children: col }, col)) }) }),
+          comp.rows && /* @__PURE__ */ jsx("tbody", { className: "gen-ui-table-body", children: comp.rows.map((row, ridx) => /* @__PURE__ */ jsx("tr", { children: row.map((cell, cidx) => /* @__PURE__ */ jsx("td", { className: "gen-ui-table-td", children: cell }, cidx)) }, ridx)) })
+        ] }) }, comp.id);
+      case "form":
+        return /* @__PURE__ */ jsx("form", { className: "gen-ui-form", children: comp.items?.map((field) => renderComponent(field)) }, comp.id);
+      default:
+        return null;
+    }
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "generative-ui-container", ref: containerRef, children: [
+    (uiData.title || uiData.description) && /* @__PURE__ */ jsxs("div", { className: "generative-ui-header", children: [
+      uiData.title && /* @__PURE__ */ jsx("h1", { className: "generative-ui-title", children: uiData.title }),
+      uiData.description && /* @__PURE__ */ jsx("p", { className: "generative-ui-description", children: uiData.description })
+    ] }),
+    uiData.components.map((comp) => renderComponent(comp))
+  ] });
+};
+var MessageBubble = ({ message, onAction }) => {
+  console.log("MESSAGE", message);
+  const isUser = message.role === "user";
+  const approval = message.role === "approval";
+  if (approval) {
+    return /* @__PURE__ */ jsx(Fragment, {});
+  }
+  return /* @__PURE__ */ jsxs("div", { className: `message-container ${isUser ? "user" : "assistant"}`, children: [
+    /* @__PURE__ */ jsx("div", { className: `message-bubble ${isUser ? "user" : "assistant"}`, children: isUser ? message.text && /* @__PURE__ */ jsx("div", { className: "markdown-content", children: message.text }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      message.text && /* @__PURE__ */ jsx("div", { className: "markdown-content", children: /* @__PURE__ */ jsx(ReactMarkdown, { remarkPlugins: [remarkGfm], children: message.text }) }),
+      message.ui && /* @__PURE__ */ jsx(
+        GenericUIRenderer,
+        {
+          uiData: message.ui,
+          onInteraction: (event) => {
+            console.log("event", event);
+            if (event.buttonId === "submit") {
+              onAction(JSON.stringify(event.formData), true);
+            } else {
+              onAction(event.action, true);
+            }
+          }
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ jsx("div", { className: `message-time ${isUser ? "user" : "assistant"}`, children: message.timestamp.toLocaleTimeString("tr-TR", {
+      hour: "2-digit",
+      minute: "2-digit"
+    }) })
+  ] });
+};
+var TypingDots = () => {
+  const [dots, setDots] = useState("");
+  useEffect(() => {
+    const interval = setInterval(() => {
+      setDots((prev) => {
+        if (prev === "...") return "";
+        return prev + ".";
+      });
+    }, 500);
+    return () => clearInterval(interval);
+  }, []);
+  return /* @__PURE__ */ jsx("div", { className: "message-container assistant", children: /* @__PURE__ */ jsx("div", { className: "message-bubble assistant", children: /* @__PURE__ */ jsx("div", { className: "message-typing-indicator", children: /* @__PURE__ */ jsx("span", { children: dots }) }) }) });
+};
+
+// src/utils/chatbot.ts
+var extractUIJsonFromText = (text) => {
+  const regex = /```ui-component([\s\S]*?)```/g;
+  let cleaned = text;
+  let match;
+  let uiData = null;
+  while ((match = regex.exec(text)) !== null) {
+    const block = match[1].trim();
+    try {
+      const parsed = JSON.parse(block);
+      if (parsed && parsed.components && Array.isArray(parsed.components)) {
+        parsed.components = parsed.components.map((comp, index) => {
+          if (!comp.id || typeof comp.id !== "string" || !comp.id.trim()) {
+            comp.id = `ui-comp-${index}-${Date.now()}`;
+          }
+          if (comp.type === "button") {
+            if (!comp.buttonType) {
+              comp.buttonType = "click";
+            }
+          }
+          if (comp.type === "input") {
+            if (!comp.fieldType) {
+              comp.fieldType = "text";
+            }
+          }
+          if (comp.type === "select") {
+            if (comp.options && Array.isArray(comp.options)) {
+              const firstOption = comp.options[0];
+              if (typeof firstOption === "object" && firstOption !== null) {
+                if ("label" in firstOption || "value" in firstOption) {
+                  comp.options = comp.options.map(
+                    (opt) => opt.label || opt.value || String(opt)
+                  );
+                }
+              }
+            }
+          }
+          if (comp.type === "table") {
+            if (comp.columns && Array.isArray(comp.columns)) {
+              const firstCol = comp.columns[0];
+              if (typeof firstCol === "object" && firstCol !== null) {
+                comp.columns = comp.columns.map(
+                  (col) => col.label || col.id || String(col)
+                );
+              }
+            }
+            if (comp.rows && Array.isArray(comp.rows)) {
+              const firstRow = comp.rows[0];
+              if (typeof firstRow === "object" && !Array.isArray(firstRow)) {
+                comp.rows = comp.rows.map((row) => {
+                  if (Array.isArray(row)) return row;
+                  return Object.values(row).map((val) => {
+                    if (typeof val === "object" && val !== null) {
+                      if (val.type === "image" && val.src) return val.src;
+                      if (val.value !== void 0) return String(val.value);
+                    }
+                    return String(val || "");
+                  });
+                });
+              }
+            }
+          }
+          if (comp.type === "form" && comp.items && Array.isArray(comp.items)) {
+            comp.items = comp.items.map((field, fieldIndex) => {
+              if (!field.id || !field.id.trim()) {
+                field.id = `field-${fieldIndex}-${Date.now()}`;
+              }
+              if (field.optional !== void 0) {
+                field.requiredField = !field.optional;
+                delete field.optional;
+              }
+              if (field.required !== void 0) {
+                field.requiredField = field.required;
+                delete field.required;
+              }
+              if (field.type === "input" && !field.fieldType) {
+                field.fieldType = "text";
+              }
+              if (field.type === "select" && field.options && Array.isArray(field.options)) {
+                const firstOpt = field.options[0];
+                if (typeof firstOpt === "object" && firstOpt !== null) {
+                  field.options = field.options.map(
+                    (opt) => opt.label || opt.value || String(opt)
+                  );
+                }
+              }
+              return field;
+            });
+          }
+          if (comp.type === "list" && comp.items && Array.isArray(comp.items)) {
+            comp.items = comp.items.map((item, itemIndex) => {
+              if (typeof item === "string") {
+                return {
+                  id: `list-item-${itemIndex}-${Date.now()}`,
+                  type: "text",
+                  value: item,
+                  label: item
+                };
+              }
+              if (!item.id || !item.id.trim()) {
+                item.id = `list-item-${itemIndex}-${Date.now()}`;
+              }
+              return item;
+            });
+          }
+          return comp;
+        });
+        uiData = parsed;
+      }
+      cleaned = cleaned.replace(match[0], "").trim();
+      break;
+    } catch (e) {
+      console.error("Invalid ui-component JSON:", e, block);
+    }
+  }
+  return {
+    cleanedText: cleaned,
+    uiData
+  };
+};
+var AizekChatBot = ({ clientId, headers, onMounted, onReady, onOpen, onClose, onMessage, onToolCall, onDisconnect }) => {
+  const messagesEndRef = useRef(null);
+  const [config, setConfig] = useState();
+  const [messages, setMessages] = useState([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const [isConfigLoading, setIsConfigLoading] = useState(true);
+  const [isOpen, setIsOpen] = useState(false);
+  const [headerValidation, setHeaderValidation] = useState(null);
+  const [showAlert, setShowAlert] = useState(true);
+  const [sessions, setSessions] = useState([]);
+  const [activeSessionId, setActiveSessionIdState] = useState(null);
+  const [activeTab, setActiveTab] = useState("home");
+  const [messageView, setMessageView] = useState("list");
+  const [sessionTitleById, setSessionTitleById] = useState({});
+  const PROXY_BASE_URL = "https://proxy.aizek.ai/api";
+  const createNewSession = async () => {
+    const deviceId = getOrCreateDeviceId();
+    if (sessions.length >= MAX_SESSIONS) {
+      throw new Error(`You can open up to ${MAX_SESSIONS} sessions.`);
+    }
+    const res = await fetch(`${PROXY_BASE_URL}/aizek-sessions/new?clientId=${clientId}`, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        "x-device-id": deviceId,
+        "x-alternate": JSON.stringify(headers)
+      }
+    });
+    const data = await res.json();
+    if (!data.success) throw new Error(data.message || "session create failed");
+    const sid = data.data.sessionId;
+    const updatedSessions = data.data.sessions ?? [sid];
+    upsertSessionsFromServer(updatedSessions, setSessions);
+    setActiveSessionIdState(sid);
+    setActiveSessionId(sid);
+    setActiveTab("messages");
+    setMessageView("detail");
+    touchSession(sid);
+    setMessages([]);
+    return sid;
+  };
+  const loadConfig = async () => {
+    try {
+      setIsConfigLoading(true);
+      const deviceId = getOrCreateDeviceId();
+      purgeExpiredLocalSessions(setActiveSessionIdState);
+      const localActive = getActiveSessionId();
+      const response = await fetch(`${PROXY_BASE_URL}/aizek-connect?clientId=${clientId}`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          "x-device-id": deviceId,
+          "x-alternate": JSON.stringify(headers)
+        }
+      });
+      const data = await response.json();
+      if (!data.success) {
+        setIsOpen(false);
+        return;
+      }
+      setIsOpen(!!data.data.widget_config.initial_open);
+      setConfig(data.data);
+      const serverSessions = data.data.sessions ?? [];
+      const merged = upsertSessionsFromServer(serverSessions, setSessions);
+      if (merged.length === 0) {
+        const newSid = await createNewSession();
+        setActiveSessionIdState(newSid);
+        setActiveSessionId(newSid);
+        return;
+      }
+      const mergedIds = merged.map((s) => s.sessionId);
+      const nextActive = (localActive && mergedIds.includes(localActive) ? localActive : null) ?? mergedIds[0] ?? null;
+      setActiveSessionIdState(nextActive);
+      setActiveSessionId(nextActive);
+      if (headers) {
+        const validationResult = validateHeaders(headers, data.data.auth_config, {
+          allowExtra: false,
+          caseSensitive: true
+        });
+        setHeaderValidation(validationResult);
+      }
+      onReady?.({ config: { ...data.data } });
+    } catch (error) {
+      console.error("Failed to load chat widget config:", error);
+    } finally {
+      setIsConfigLoading(false);
+    }
+  };
+  const getHistoryMessageBySessionId = async (sid) => {
+    try {
+      const deviceId = getOrCreateDeviceId();
+      const response = await fetch(`${PROXY_BASE_URL}/aizek-messages`, {
+        method: "GET",
+        headers: {
+          "Content-Type": "application/json",
+          "x-device-id": deviceId,
+          "x-session-id": sid,
+          "x-alternate": JSON.stringify(headers)
+        }
+      });
+      const data = await response.json();
+      if (!data.success) {
+        throw new Error(data.message || "Failed to fetch messages");
+      }
+      const historyMessages = [];
+      if (data.data?.messages && Array.isArray(data.data.messages)) {
+        for (const msg of data.data.messages) {
+          let textContent = "";
+          let uiData = null;
+          if (typeof msg.content === "string") {
+            textContent = msg.content;
+          } else if (Array.isArray(msg.content)) {
+            const textParts = [];
+            for (const item of msg.content) {
+              if (item.type === "text" && item.text) {
+                textParts.push(item.text);
+              }
+            }
+            textContent = textParts.join("\n");
+          }
+          if (textContent) {
+            const extracted = extractUIJsonFromText(textContent);
+            textContent = extracted.cleanedText;
+            uiData = extracted.uiData;
+          }
+          if (textContent.trim() || uiData) {
+            historyMessages.push({
+              text: textContent.trim() || void 0,
+              ui: uiData,
+              role: msg.role === "user" ? "user" : msg.role === "assistant" ? "assistant" : "user",
+              timestamp: /* @__PURE__ */ new Date()
+            });
+          }
+        }
+      }
+      return historyMessages;
+    } catch (error) {
+      console.error("Error fetching message history:", error);
+      return [];
+    }
+  };
+  useEffect(() => {
+    onMounted?.();
+    loadConfig();
+  }, []);
+  useEffect(() => {
+    const t = setInterval(() => {
+      purgeExpiredLocalSessions(setActiveSessionIdState);
+    }, 1e3);
+    return () => clearInterval(t);
+  }, []);
+  useEffect(() => {
+    if (typeof config?.widget_config.initial_open === "boolean") {
+      const open = config.widget_config.initial_open;
+      setIsOpen(open);
+      if (open) onOpen?.();
+      else onClose?.();
+    }
+  }, [config?.widget_config.initial_open]);
+  useEffect(() => {
+    messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
+  }, [messages]);
+  useEffect(() => {
+    if (activeSessionId && !isConfigLoading) {
+      getHistoryMessageBySessionId(activeSessionId).then((historyMessages) => {
+        setMessages(historyMessages);
+      }).catch((error) => {
+        console.error("Failed to load message history:", error);
+      });
+    } else if (!activeSessionId) {
+      setMessages([]);
+    }
+  }, [activeSessionId, isConfigLoading]);
+  useEffect(() => {
+    if (!sessions.length) return;
+    const missing = sessions.filter((sid) => !sessionTitleById[sid]);
+    if (!missing.length) return;
+    let cancelled = false;
+    (async () => {
+      for (const sid of missing) {
+        if (cancelled) return;
+        const title = await fetchLastMessageTitle(sid);
+        if (cancelled) return;
+        if (!title) continue;
+        setSessionTitleById((prev) => prev[sid] ? prev : { ...prev, [sid]: title });
+      }
+    })();
+    return () => {
+      cancelled = true;
+    };
+  }, [sessions]);
+  const addMessage = (payload) => {
+    const newMessage = {
+      text: payload.text,
+      ui: payload.ui,
+      role: payload.role,
+      timestamp: /* @__PURE__ */ new Date()
+    };
+    onMessage?.(newMessage);
+    setMessages((prev) => [...prev, newMessage]);
+    messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
+    return newMessage;
+  };
+  const sendMessage = async (message, approval) => {
+    if (!message.trim() || isLoading) return;
+    setMessages((prev) => [
+      ...prev,
+      { text: message, ui: void 0, role: approval ? "approval" : "user", timestamp: /* @__PURE__ */ new Date() }
+    ]);
+    setIsLoading(true);
+    try {
+      const deviceId = getOrCreateDeviceId();
+      purgeExpiredLocalSessions(setActiveSessionIdState);
+      let sid = activeSessionId;
+      if (!sid) sid = await createNewSession();
+      const response = await fetch(`${PROXY_BASE_URL}/aizek-chat?clientId=${clientId}`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          "x-device-id": deviceId,
+          "x-session-id": sid,
+          "x-alternate": JSON.stringify(headers)
+        },
+        body: JSON.stringify({ message })
+      });
+      if (response.status === 401) {
+        const local = readStoredSessions().filter((s) => s.sessionId !== sid);
+        writeStoredSessions(local);
+        setSessions(local.map((x) => x.sessionId));
+        setActiveSessionId(null);
+        setActiveSessionIdState(null);
+        const newSid = await createNewSession();
+        const retry = await fetch(`${PROXY_BASE_URL}/aizek-chat?clientId=${clientId}`, {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json",
+            "x-device-id": deviceId,
+            "x-session-id": newSid,
+            "x-alternate": JSON.stringify(headers)
+          },
+          body: JSON.stringify({ message })
+        });
+        if (!retry.ok) throw new Error(`HTTP error ${retry.status}`);
+        const retryJson = await retry.json();
+        const text = JSON.stringify(retryJson.data);
+        const { cleanedText, uiData } = extractUIJsonFromText(text);
+        addMessage({ text: cleanedText, ui: uiData, role: "assistant" });
+        touchSession(newSid);
+        return;
+      }
+      if (!response.ok) {
+        throw new Error(`HTTP error ${response.status}`);
+      }
+      if (!response.body) {
+        throw new Error("Streaming desteklenmiyor (response.body yok)");
+      }
+      const reader = response.body.getReader();
+      const decoder = new TextDecoder();
+      let buffer = "";
+      while (true) {
+        const { value, done } = await reader.read();
+        if (done) break;
+        buffer += decoder.decode(value, { stream: true });
+        const chunks = buffer.split("\n\n");
+        buffer = chunks.pop() ?? "";
+        for (const rawChunk of chunks) {
+          const line = rawChunk.split("\n").find((l) => l.startsWith("data:"));
+          if (!line) continue;
+          const jsonStr = line.replace(/^data:\s*/, "").trim();
+          if (!jsonStr) continue;
+          const event = JSON.parse(jsonStr);
+          if (event.type === "assistant_text" && event.content) {
+            const { cleanedText, uiData } = extractUIJsonFromText(event.content);
+            addMessage({
+              text: cleanedText,
+              ui: uiData,
+              role: "assistant"
+            });
+          }
+          if (event.type === "assistant_tool_result" && event.content) {
+            const toolInfoParsed = JSON.parse(event.content);
+            onToolCall?.(toolInfoParsed);
+          }
+          if (event.type === "error" && event.content) {
+            const { cleanedText, uiData } = extractUIJsonFromText(event.content);
+            addMessage({
+              text: cleanedText,
+              ui: uiData,
+              role: "assistant"
+            });
+          }
+        }
+      }
+      touchSession(sid);
+    } catch (error) {
+      console.error("Error sending message:", error);
+      addMessage({ text: "Sorry, something went wrong. Please try again.", role: "assistant" });
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  const disconnectActiveSession = async () => {
+    try {
+      const deviceId = getOrCreateDeviceId();
+      const sid = activeSessionId;
+      if (!sid) return;
+      await fetch(`${PROXY_BASE_URL}/aizek-disconnect?clientId=${clientId}`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          "x-device-id": deviceId,
+          "x-session-id": sid,
+          "x-alternate": JSON.stringify(headers)
+        },
+        body: JSON.stringify({ sessionId: sid })
+      });
+      const nextStored = readStoredSessions().filter((s) => s.sessionId !== sid);
+      writeStoredSessions(nextStored);
+      const nextSessions = nextStored.map((x) => x.sessionId);
+      setSessions(nextSessions);
+      const nextActive = nextSessions[0] ?? null;
+      setActiveSessionIdState(nextActive);
+      setActiveSessionId(nextActive);
+      setMessages([]);
+      onDisconnect?.();
+    } catch (e) {
+      console.error(e);
+    }
+  };
+  const handleSelectSession = (sid) => {
+    setActiveSessionIdState(sid);
+    setActiveSessionId(sid);
+    setActiveTab("messages");
+    setMessageView("detail");
+  };
+  const getSessionTitle = (sid) => {
+    if (sessionTitleById[sid]) return sessionTitleById[sid];
+    return "New conversation";
+  };
+  const fetchLastMessageTitle = async (sid) => {
+    try {
+      const deviceId = getOrCreateDeviceId();
+      const res = await fetch(`${PROXY_BASE_URL}/aizek-last-message`, {
+        method: "GET",
+        headers: {
+          "Content-Type": "application/json",
+          "x-device-id": deviceId,
+          "x-session-id": sid,
+          "x-alternate": JSON.stringify(headers)
+        }
+      });
+      const json = await res.json();
+      if (!json?.success) return null;
+      const last = json?.data?.lastMessage;
+      if (!last) return null;
+      let textContent = "";
+      if (typeof last.content === "string") {
+        textContent = last.content;
+      } else if (Array.isArray(last.content)) {
+        const parts = [];
+        for (const item of last.content) {
+          if (item?.type === "text" && typeof item.text === "string") parts.push(item.text);
+        }
+        textContent = parts.join("\n");
+      }
+      if (!textContent.trim()) return null;
+      const extracted = extractUIJsonFromText(textContent);
+      const cleaned = (extracted.cleanedText || "").trim();
+      const firstLine = (cleaned.split("\n").find((l) => l.trim()) || "").trim();
+      const title = firstLine || cleaned;
+      if (!title) return null;
+      const compact = title.length > 46 ? `${title.slice(0, 46).trim()}\u2026` : title;
+      return compact;
+    } catch (e) {
+      console.error("Failed to fetch last message title:", e);
+      return null;
+    }
+  };
+  const toggleChat = () => {
+    const newIsOpen = !isOpen;
+    setIsOpen(newIsOpen);
+    if (newIsOpen) onOpen?.();
+    else onClose?.();
+  };
+  const clean = sanitizeHtml(config?.widget_config.welcome_message ?? "", {
+    allowedTags: ["b", "i", "em", "strong", "a", "p", "br"],
+    allowedAttributes: {
+      a: ["href", "target", "rel"]
+    }
+  });
+  return /* @__PURE__ */ jsx(Fragment, { children: isConfigLoading ? /* @__PURE__ */ jsx(
+    "button",
+    {
+      className: "floating-button bottom-right button-sizes medium loading-state",
+      style: { background: "#4f46e5" },
+      "aria-label": "Loading",
+      children: /* @__PURE__ */ jsx("div", { className: "loading-spinner" })
+    }
+  ) : /* @__PURE__ */ jsxs(Fragment, { children: [
+    isOpen && /* @__PURE__ */ jsx("div", { className: `overlay floating-chat-overlay ${isOpen ? "is-open" : ""}`, onClick: toggleChat }),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: `chat-container ${config?.widget_config.button_position} ${isOpen ? "is-open" : ""}`,
+        style: { width: config?.widget_config.chat_width, height: config?.widget_config.chat_height },
+        children: /* @__PURE__ */ jsxs("div", { className: "chatbot-container", children: [
+          /* @__PURE__ */ jsxs("div", { className: "header", style: { background: config?.widget_config.header_background }, children: [
+            /* @__PURE__ */ jsx("div", { className: "logo-container", children: config?.widget_config.company_logo ? config?.widget_config.company_logo.startsWith("http") || config?.widget_config.company_logo.startsWith("data:") ? /* @__PURE__ */ jsx("img", { src: config?.widget_config.company_logo, alt: "Company Logo", className: "logo-image" }) : /* @__PURE__ */ jsx("span", { className: "logo-text", children: config?.widget_config.company_logo }) : "\u{1F916}" }),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("h3", { className: "company-name", children: config?.widget_config.company_name }),
+              /* @__PURE__ */ jsx("p", { className: "status-text", children: isLoading ? "Typing..." : "Online" })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "chat-content", children: [
+            activeTab === "home" && /* @__PURE__ */ jsxs("div", { className: "home-panel", children: [
+              /* @__PURE__ */ jsx("p", { className: "eyebrow", children: "Welcome" }),
+              /* @__PURE__ */ jsx("h3", { className: "panel-title", children: config?.widget_config.company_name }),
+              /* @__PURE__ */ jsx("p", { className: "panel-subtitle", children: "Ask anything. We keep your history and respond instantly." }),
+              /* @__PURE__ */ jsxs("div", { className: "home-actions", children: [
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    className: "primary-button",
+                    onClick: async () => {
+                      try {
+                        await createNewSession();
+                      } catch (e) {
+                        console.error(e);
+                      }
+                    },
+                    disabled: isLoading || sessions.length >= MAX_SESSIONS,
+                    children: "Start a new conversation"
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    className: "ghost-button",
+                    onClick: () => {
+                      setActiveTab("messages");
+                      setMessageView("list");
+                    },
+                    children: "View conversations"
+                  }
+                )
+              ] })
+            ] }),
+            activeTab === "messages" && /* @__PURE__ */ jsx(Fragment, { children: messageView === "list" ? /* @__PURE__ */ jsxs("div", { className: "conversation-list", children: [
+              /* @__PURE__ */ jsxs("div", { className: "list-header", children: [
+                /* @__PURE__ */ jsxs("div", { children: [
+                  /* @__PURE__ */ jsx("p", { className: "eyebrow", children: "Conversations" }),
+                  /* @__PURE__ */ jsx("h4", { className: "panel-title", children: "Inbox" })
+                ] }),
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    className: "session-new-button",
+                    onClick: async () => {
+                      try {
+                        await createNewSession();
+                      } catch (e) {
+                        console.error(e);
+                      }
+                    },
+                    disabled: sessions.length >= MAX_SESSIONS,
+                    children: /* @__PURE__ */ jsx("span", { children: "+ New" })
+                  }
+                )
+              ] }),
+              sessions.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "empty-list", children: [
+                /* @__PURE__ */ jsx("div", { className: "empty-state-icon", children: "\u{1F4AC}" }),
+                /* @__PURE__ */ jsx("h4", { className: "empty-state-title", children: "No conversations yet" }),
+                /* @__PURE__ */ jsx("p", { className: "empty-state-description", children: "Start a new conversation to see it appear here." })
+              ] }) : /* @__PURE__ */ jsx("div", { className: "conversation-items", children: sessions.map((sid) => /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  className: `conversation-item ${sid === activeSessionId ? "active" : ""}`,
+                  onClick: () => handleSelectSession(sid),
+                  children: [
+                    /* @__PURE__ */ jsxs("div", { className: "conversation-meta", children: [
+                      /* @__PURE__ */ jsx("p", { className: "conversation-title", children: getSessionTitle(sid) }),
+                      /* @__PURE__ */ jsxs("p", { className: "conversation-sub", children: [
+                        "Session ID: ",
+                        sid.slice(0, 8),
+                        "..."
+                      ] })
+                    ] }),
+                    /* @__PURE__ */ jsx("span", { className: "conversation-pill", children: "Open" })
+                  ]
+                },
+                sid
+              )) })
+            ] }) : /* @__PURE__ */ jsxs("div", { className: "conversation-detail", children: [
+              /* @__PURE__ */ jsxs("div", { className: "detail-header", children: [
+                /* @__PURE__ */ jsx("div", { className: "detail-header-left", children: /* @__PURE__ */ jsx("button", { className: "icon-button", onClick: () => setMessageView("list"), "aria-label": "Back", children: /* @__PURE__ */ jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ jsx(
+                  "path",
+                  {
+                    d: "M15 18l-6-6 6-6",
+                    stroke: "currentColor",
+                    strokeWidth: "2",
+                    strokeLinecap: "round",
+                    strokeLinejoin: "round"
+                  }
+                ) }) }) }),
+                /* @__PURE__ */ jsxs("div", { className: "detail-header-center", children: [
+                  /* @__PURE__ */ jsx("div", { className: "detail-avatar", "aria-hidden": "true", children: /* @__PURE__ */ jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ jsx(
+                    "path",
+                    {
+                      d: "M12 3c-4.418 0-8 3.134-8 7 0 2.382 1.362 4.486 3.5 5.737V21l4.07-2.13c.14.008.283.013.43.013 4.418 0 8-3.134 8-7s-3.582-7-8-7z",
+                      stroke: "currentColor",
+                      strokeWidth: "2",
+                      strokeLinejoin: "round"
+                    }
+                  ) }) }),
+                  /* @__PURE__ */ jsxs("div", { className: "detail-title", children: [
+                    /* @__PURE__ */ jsxs("div", { className: "detail-title-row", children: [
+                      /* @__PURE__ */ jsx("strong", { className: "detail-title-text", children: activeSessionId ? getSessionTitle(activeSessionId) : "Chat" }),
+                      /* @__PURE__ */ jsx("span", { className: `status-dot ${isLoading ? "typing" : "online"}`, "aria-hidden": "true" })
+                    ] }),
+                    /* @__PURE__ */ jsx("p", { className: "detail-subtitle", children: isLoading ? "Yaz\u0131yor\u2026" : "Online" })
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "detail-header-right", children: [
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      className: "icon-button",
+                      onClick: () => {
+                        setActiveTab("info");
+                        setMessageView("list");
+                      },
+                      "aria-label": "Bilgi",
+                      children: /* @__PURE__ */ jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", children: [
+                        /* @__PURE__ */ jsx(
+                          "path",
+                          {
+                            d: "M12 17v-6",
+                            stroke: "currentColor",
+                            strokeWidth: "2",
+                            strokeLinecap: "round"
+                          }
+                        ),
+                        /* @__PURE__ */ jsx(
+                          "path",
+                          {
+                            d: "M12 8h.01",
+                            stroke: "currentColor",
+                            strokeWidth: "2.5",
+                            strokeLinecap: "round"
+                          }
+                        ),
+                        /* @__PURE__ */ jsx(
+                          "circle",
+                          {
+                            cx: "12",
+                            cy: "12",
+                            r: "9",
+                            stroke: "currentColor",
+                            strokeWidth: "2"
+                          }
+                        )
+                      ] })
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      className: "icon-button danger",
+                      onClick: disconnectActiveSession,
+                      disabled: !activeSessionId,
+                      "aria-label": "End conversation",
+                      children: /* @__PURE__ */ jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", children: [
+                        /* @__PURE__ */ jsx(
+                          "path",
+                          {
+                            d: "M3 6h18",
+                            stroke: "currentColor",
+                            strokeWidth: "2",
+                            strokeLinecap: "round"
+                          }
+                        ),
+                        /* @__PURE__ */ jsx(
+                          "path",
+                          {
+                            d: "M8 6V4h8v2",
+                            stroke: "currentColor",
+                            strokeWidth: "2",
+                            strokeLinejoin: "round"
+                          }
+                        ),
+                        /* @__PURE__ */ jsx(
+                          "path",
+                          {
+                            d: "M6 6l1 16h10l1-16",
+                            stroke: "currentColor",
+                            strokeWidth: "2",
+                            strokeLinejoin: "round"
+                          }
+                        )
+                      ] })
+                    }
+                  )
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "messages-container", children: [
+                /* @__PURE__ */ jsx(HeaderAlert, { headerValidation, setShowAlert, showAlert }),
+                messages.length === 0 ? /* @__PURE__ */ jsx("div", { className: "empty-state", children: /* @__PURE__ */ jsx("span", { dangerouslySetInnerHTML: { __html: clean } }) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                  messages.map((message, index) => /* @__PURE__ */ jsx(MessageBubble, { message, onAction: sendMessage }, index)),
+                  config?.widget_config.show_typing_indicator && isLoading && /* @__PURE__ */ jsx(TypingDots, {})
+                ] }),
+                /* @__PURE__ */ jsx("div", { ref: messagesEndRef })
+              ] }),
+              /* @__PURE__ */ jsx(
+                ChatInput,
+                {
+                  handleSendMessage: sendMessage,
+                  isLoading,
+                  placeholder: config?.widget_config.placeholder ?? ""
+                }
+              )
+            ] }) }),
+            activeTab === "info" && /* @__PURE__ */ jsxs("div", { className: "info-panel", children: [
+              /* @__PURE__ */ jsx("p", { className: "eyebrow", children: "Info" }),
+              /* @__PURE__ */ jsx("h4", { className: "panel-title", children: "Widget Details" }),
+              /* @__PURE__ */ jsxs("ul", { className: "info-list", children: [
+                /* @__PURE__ */ jsxs("li", { children: [
+                  /* @__PURE__ */ jsx("span", { children: "Company" }),
+                  /* @__PURE__ */ jsx("strong", { children: config?.widget_config.company_name })
+                ] }),
+                /* @__PURE__ */ jsxs("li", { children: [
+                  /* @__PURE__ */ jsx("span", { children: "Status" }),
+                  /* @__PURE__ */ jsx("strong", { children: isLoading ? "Typing..." : "Online" })
+                ] }),
+                /* @__PURE__ */ jsxs("li", { children: [
+                  /* @__PURE__ */ jsx("span", { children: "Conversations" }),
+                  /* @__PURE__ */ jsx("strong", { children: sessions.length })
+                ] })
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "bottom-nav", children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                className: `nav-button ${activeTab === "home" ? "active" : ""}`,
+                onClick: () => {
+                  setActiveTab("home");
+                  setMessageView("list");
+                },
+                children: "Home"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                className: `nav-button ${activeTab === "messages" ? "active" : ""}`,
+                onClick: () => {
+                  setActiveTab("messages");
+                  setMessageView("list");
+                },
+                children: "Messages"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                className: `nav-button ${activeTab === "info" ? "active" : ""}`,
+                onClick: () => {
+                  setActiveTab("info");
+                  setMessageView("list");
+                },
+                children: "Info"
+              }
+            )
+          ] })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        onClick: toggleChat,
+        className: `floating-button ${config?.widget_config.button_position} button-sizes ${config?.widget_config.button_size} ${isOpen ? "is-open" : ""}`,
+        style: { background: config?.widget_config.button_background },
+        children: isOpen ? /* @__PURE__ */ jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx("path", { d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" }) }) : /* @__PURE__ */ jsx("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx("path", { d: "M20 2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h4l4 4 4-4h4c1.1 0-2 .9-2-2V4c0-1.1-.9-2-2-2zm-2 12H6v-2h12v2zm0-3H6V9h12v2zm0-3H6V6h12v2z" }) })
+      }
+    )
+  ] }) });
+};
+
+export { AizekChatBot };
+//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.mjs.map