@brainbase-labs/chat-widget 0.1.1 → 0.1.5

package/dist/index.js

@@ -1,1308 +0,0 @@
-import { useState as I, useRef as R, useEffect as U, useCallback as x, useMemo as ee } from "react";
-import { jsxs as i, jsx as e } from "react/jsx-runtime";
-const te = "bb-chat-";
-function ie(o) {
-  try {
-    const t = sessionStorage.getItem(`${te}${o}`);
-    return t ? JSON.parse(t) : null;
-  } catch {
-    return null;
-  }
-}
-function ne(o, t) {
-  try {
-    sessionStorage.setItem(
-      `${te}${o}`,
-      JSON.stringify(t)
-    );
-  } catch {
-  }
-}
-function se(o) {
-  try {
-    sessionStorage.removeItem(`${te}${o}`);
-  } catch {
-  }
-}
-function le(o) {
-  const {
-    config: t,
-    apiClient: s,
-    mockMode: r,
-    onSessionStart: d,
-    onSessionEnd: u,
-    onMessage: c,
-    onError: m
-  } = o, [l, n] = I([]), [C, M] = I([]), [j, S] = I(!1), [q, P] = I(null), [g, H] = I(null), T = R(0), V = R(!1);
-  U(() => {
-    if (V.current) return;
-    V.current = !0;
-    const _ = ie(t.embedId);
-    _ && _.status === "active" && (H(_.sessionId), n(_.messages), M(_.toolCalls), T.current = _.startTime);
-  }, [t.embedId]), U(() => {
-    g && l.length > 0 && ne(t.embedId, {
-      sessionId: g,
-      deploymentId: t.deploymentId,
-      workerId: t.workerId,
-      flowId: t.flowId,
-      startTime: T.current,
-      messages: l,
-      toolCalls: C,
-      status: "active"
-    });
-  }, [g, l, C, t]);
-  const K = x(async () => (T.current = Date.now(), H(null), n([]), M([]), se(t.embedId), ""), [t.embedId]), B = x(
-    (_, b, k) => {
-      switch (_.type) {
-        case "session": {
-          const p = _.data;
-          p.session_id && (k(p.session_id), p.is_new && (T.current = Date.now(), d == null || d(p.session_id)));
-          break;
-        }
-        case "message": {
-          const p = _.data;
-          p.content && n(
-            (h) => h.map(
-              (a) => a.id === b ? { ...a, content: p.content, status: "streaming" } : a
-            )
-          );
-          break;
-        }
-        case "tool_call": {
-          const p = _.data;
-          M((h) => {
-            const a = h.findIndex(
-              (f) => f.name === p.function && f.status === "pending"
-            );
-            return a !== -1 && p.result !== void 0 ? h.map(
-              (f, v) => v === a ? { ...f, result: p.result, status: "completed" } : f
-            ) : a === -1 ? [
-              ...h,
-              {
-                id: `tc-${Date.now()}-${Math.random().toString(36).slice(2)}`,
-                name: p.function,
-                arguments: p.args ?? {},
-                status: "pending",
-                timestamp: Date.now()
-              }
-            ] : h;
-          }), p.content && n(
-            (h) => h.map(
-              (a) => a.id === b ? { ...a, content: p.content, status: "streaming" } : a
-            )
-          );
-          break;
-        }
-        case "waiting":
-          break;
-        case "done": {
-          n(
-            (p) => p.map((h) => h.id === b ? { ...h, status: "sent" } : h)
-          );
-          break;
-        }
-        case "completed": {
-          n(
-            (p) => p.map((h) => h.id === b ? { ...h, status: "sent" } : h)
-          ), g && ne(t.embedId, {
-            sessionId: g,
-            deploymentId: t.deploymentId,
-            workerId: t.workerId,
-            flowId: t.flowId,
-            startTime: T.current,
-            messages: l,
-            toolCalls: C,
-            status: "completed"
-          });
-          break;
-        }
-        case "error": {
-          const p = _.data;
-          n(
-            (h) => h.map(
-              (a) => a.id === b ? {
-                ...a,
-                status: "error",
-                content: p.error ?? "An error occurred"
-              } : a
-            )
-          );
-          break;
-        }
-      }
-    },
-    [t, g, l, C, d]
-  ), G = x(
-    async (_, b, k) => {
-      const p = _.getReader(), h = new TextDecoder();
-      let a = "";
-      try {
-        for (; ; ) {
-          const { done: f, value: v } = await p.read();
-          if (f) break;
-          for (a += h.decode(v, { stream: !0 }); a.includes(`
-
-`); ) {
-            const [$, ae] = a.split(`
-
-`, 2);
-            a = ae;
-            for (const oe of $.split(`
-`))
-              if (oe.startsWith("data: "))
-                try {
-                  const ce = JSON.parse(oe.slice(6));
-                  B(ce, b, k);
-                } catch {
-                }
-          }
-        }
-      } finally {
-        p.releaseLock();
-      }
-    },
-    [B]
-  ), J = x(
-    async (_) => {
-      if (!_.trim()) return;
-      const b = {
-        id: `user-${Date.now()}`,
-        role: "user",
-        content: _,
-        timestamp: Date.now(),
-        status: "sent"
-      };
-      n((a) => [...a, b]), c == null || c(b);
-      const k = `assistant-${Date.now()}`, p = {
-        id: k,
-        role: "assistant",
-        content: "",
-        timestamp: Date.now(),
-        status: "streaming"
-      };
-      n((a) => [...a, p]), S(!0), P(null);
-      const h = (a) => {
-        H(a);
-      };
-      try {
-        if (r) {
-          const a = s.sendMessage(_);
-          for await (const f of a)
-            B(f, k, h);
-        } else {
-          const a = await s.sendMessage({
-            embedId: t.embedId,
-            message: _,
-            sessionId: g ?? void 0
-          });
-          await G(a, k, h);
-        }
-        n(
-          (a) => a.map(
-            (f) => f.id === k && f.status === "streaming" ? { ...f, status: "sent" } : f
-          )
-        );
-      } catch (a) {
-        const f = a instanceof Error ? a : new Error("Failed to send message");
-        P(f), m == null || m(f), n(
-          (v) => v.map(
-            ($) => $.id === k ? { ...$, status: "error", content: "Failed to get response" } : $
-          )
-        );
-      } finally {
-        S(!1);
-      }
-    },
-    [
-      g,
-      s,
-      r,
-      t.embedId,
-      B,
-      G,
-      c,
-      m
-    ]
-  ), A = x(async () => {
-    if (!g) return;
-    const _ = {
-      sessionId: g,
-      deploymentId: t.deploymentId,
-      workerId: t.workerId,
-      flowId: t.flowId,
-      startTime: T.current,
-      messages: l,
-      toolCalls: C,
-      status: "completed"
-    };
-    u == null || u(_), se(t.embedId), H(null), n([]), M([]);
-  }, [
-    g,
-    t,
-    l,
-    C,
-    u
-  ]), z = x(() => {
-    n([]), M([]);
-  }, []);
-  return {
-    messages: l,
-    toolCalls: C,
-    isLoading: j,
-    error: q,
-    sessionId: g,
-    sendMessage: J,
-    endSession: A,
-    clearMessages: z,
-    startNewSession: K
-  };
-}
-const de = "https://whatsapp-based-server.onrender.com";
-function ue(o = de) {
-  return {
-    async getDeploymentConfig(t) {
-      const s = await fetch(`${o}/chat/config/${t}`);
-      if (!s.ok)
-        throw new Error(`Failed to fetch deployment config: ${s.status}`);
-      const r = await s.json();
-      return {
-        embedId: r.embedId,
-        // Note: The public config endpoint doesn't expose internal IDs
-        // These will be resolved server-side when sending messages
-        deploymentId: "",
-        workerId: "",
-        flowId: "",
-        welcomeMessage: r.welcomeMessage,
-        agentName: r.agentName,
-        agentLogoUrl: r.agentLogoUrl,
-        primaryColor: r.primaryColor,
-        styling: r.styling
-      };
-    },
-    async sendMessage(t) {
-      const s = await fetch(`${o}/chat/message`, {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({
-          embed_id: t.embedId,
-          message: t.message,
-          session_id: t.sessionId || void 0,
-          metadata: t.metadata
-        })
-      });
-      if (!s.ok) {
-        const r = await s.text();
-        throw new Error(`Failed to send message: ${s.status} - ${r}`);
-      }
-      if (!s.body)
-        throw new Error("No response stream available");
-      return s.body;
-    }
-  };
-}
-const me = {
-  embedId: "mock-embed-id",
-  deploymentId: "mock-deployment-id",
-  workerId: "mock-worker-id",
-  flowId: "mock-flow-id",
-  // Note: welcomeMessage is handled by the engine, not the widget
-  agentName: "AI Assistant",
-  agentLogoUrl: void 0,
-  primaryColor: "#1a1a2e",
-  styling: {}
-}, ge = [
-  {
-    trigger: /hello|hi|hey/i,
-    response: "Hello! I'm a demo AI assistant. How can I help you today?",
-    delay: 500
-  },
-  {
-    trigger: /weather/i,
-    response: "I'd check the weather for you, but I'm in mock mode! In production, I could use a weather API.",
-    delay: 800,
-    toolCalls: [
-      {
-        name: "get_weather",
-        arguments: { location: "San Francisco" },
-        result: { temperature: 72, condition: "sunny" }
-      }
-    ]
-  },
-  {
-    trigger: /help|support/i,
-    response: "I'm here to help! You can ask me questions, and I'll do my best to assist you. In production, I'd be connected to your Brainbase AI agent with full capabilities.",
-    delay: 600
-  },
-  {
-    trigger: /pricing|cost|price/i,
-    response: "For pricing information, I'd typically check our database or connect you with the sales team. This is a mock response demonstrating how I'd handle pricing questions.",
-    delay: 700,
-    toolCalls: [
-      {
-        name: "lookup_pricing",
-        arguments: { plan: "all" },
-        result: {
-          plans: [
-            { name: "Starter", price: "$29/mo" },
-            { name: "Pro", price: "$99/mo" }
-          ]
-        }
-      }
-    ]
-  },
-  {
-    trigger: /.*/,
-    response: "I'm running in mock mode. This is a simulated response to demonstrate the chat UI. In production, I'd be connected to your Brainbase AI agent!",
-    delay: 1e3
-  }
-];
-function F(o) {
-  return new Promise((t) => setTimeout(t, o));
-}
-function pe(o, t) {
-  const s = { ...me, ...o }, r = t ?? ge, d = `mock-session-${Date.now()}`;
-  return {
-    async getDeploymentConfig(u) {
-      return await F(300), s;
-    },
-    async *sendMessage(u) {
-      yield {
-        type: "session",
-        data: { session_id: d, is_new: !0 },
-        timestamp: Date.now()
-      };
-      const c = r.find(
-        (n) => typeof n.trigger == "string" ? u.toLowerCase().includes(n.trigger.toLowerCase()) : n.trigger.test(u)
-      ) ?? r[r.length - 1];
-      if (await F(c.delay ?? 500), c.toolCalls)
-        for (const n of c.toolCalls)
-          yield {
-            type: "tool_call",
-            data: {
-              function: n.name,
-              args: n.arguments
-            },
-            timestamp: Date.now()
-          }, await F(300), yield {
-            type: "tool_call",
-            data: {
-              function: n.name,
-              result: n.result
-            },
-            timestamp: Date.now()
-          }, await F(200);
-      const m = c.response.split(" ");
-      let l = "";
-      for (const n of m)
-        l += (l ? " " : "") + n, yield {
-          type: "message",
-          data: { content: l, role: "assistant" },
-          timestamp: Date.now()
-        }, await F(30 + Math.random() * 40);
-      yield {
-        type: "done",
-        data: { session_id: d },
-        timestamp: Date.now()
-      };
-    }
-  };
-}
-const Z = ({
-  className: o,
-  color: t = "currentColor",
-  cutoutColor: s = "var(--bb-primary-color)"
-}) => /* @__PURE__ */ i(
-  "svg",
-  {
-    className: o,
-    viewBox: "0 0 800 800",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg",
-    children: [
-      /* @__PURE__ */ e(
-        "path",
-        {
-          d: "M400 412C400 405.373 405.373 400 412 400H788C794.627 400 800 405.373 800 412V740C800 773.137 773.137 800 740 800H412C405.373 800 400 794.627 400 788V412Z",
-          fill: t
-        }
-      ),
-      /* @__PURE__ */ e("circle", { cx: "400", cy: "400", r: "400", fill: t }),
-      /* @__PURE__ */ e(
-        "path",
-        {
-          d: "M0 60C0 26.8629 26.8629 0 60 0H397.614C398.932 0 400 1.06811 400 2.38569V2.38569C400 221.982 221.982 400 2.38569 400V400C1.06811 400 0 398.932 0 397.614V60Z",
-          fill: t
-        }
-      ),
-      /* @__PURE__ */ e(
-        "path",
-        {
-          d: "M400 412C400 405.373 405.373 400 412 400H738C744.627 400 750 405.373 750 412V725C750 738.807 738.807 750 725 750H412C405.373 750 400 744.627 400 738V412Z",
-          fill: t
-        }
-      ),
-      /* @__PURE__ */ e("circle", { cx: "400", cy: "400", r: "350", fill: t }),
-      /* @__PURE__ */ e(
-        "path",
-        {
-          d: "M50 75C50 61.1929 61.1929 50 75 50H388C394.627 50 400 55.3726 400 62V388C400 394.627 394.627 400 388 400H62C55.3726 400 50 394.627 50 388V75Z",
-          fill: t
-        }
-      ),
-      /* @__PURE__ */ e(
-        "rect",
-        {
-          x: "399.919",
-          y: "209",
-          width: "270",
-          height: "270",
-          rx: "12",
-          transform: "rotate(45 399.919 209)",
-          fill: s
-        }
-      )
-    ]
-  }
-), he = "_header_1p6z5_1", _e = "_compact_1p6z5_9", fe = "_headerBackground_1p6z5_20", be = "_headerContent_1p6z5_59", we = "_topRow_1p6z5_64", ye = "_agentInfo_1p6z5_79", Ce = "_agentLogo_1p6z5_85", ke = "_agentLogoPlaceholder_1p6z5_102", ve = "_brainbaseLogo_1p6z5_123", Ie = "_agentName_1p6z5_137", Ne = "_actions_1p6z5_144", Le = "_actionButton_1p6z5_149", Be = "_welcomeText_1p6z5_183", $e = "_title_1p6z5_202", xe = "_subtitle_1p6z5_210", w = {
-  header: he,
-  compact: _e,
-  headerBackground: fe,
-  headerContent: be,
-  topRow: we,
-  agentInfo: ye,
-  agentLogo: Ce,
-  agentLogoPlaceholder: ke,
-  brainbaseLogo: ve,
-  agentName: Ie,
-  actions: Ne,
-  actionButton: Le,
-  welcomeText: Be,
-  title: $e,
-  subtitle: xe
-}, Me = ({
-  agentName: o = "AI Assistant",
-  agentLogoUrl: t,
-  welcomeTitle: s,
-  welcomeSubtitle: r,
-  onClose: d,
-  onNewChatRequest: u,
-  showNewChatButton: c = !1,
-  compact: m = !1
-}) => {
-  const l = s || "Hello there.", n = r || "How can we help?";
-  return /* @__PURE__ */ i("div", { className: `${w.header} ${m ? w.compact : ""}`, children: [
-    /* @__PURE__ */ e("div", { className: w.headerBackground }),
-    /* @__PURE__ */ i("div", { className: w.headerContent, children: [
-      /* @__PURE__ */ i("div", { className: w.topRow, children: [
-        /* @__PURE__ */ i("div", { className: w.agentInfo, children: [
-          t ? /* @__PURE__ */ e(
-            "img",
-            {
-              src: t,
-              alt: o,
-              className: w.agentLogo
-            }
-          ) : /* @__PURE__ */ e("div", { className: w.agentLogoPlaceholder, children: /* @__PURE__ */ e(
-            Z,
-            {
-              className: w.brainbaseLogo,
-              color: "white",
-              cutoutColor: "var(--bb-primary-color)"
-            }
-          ) }),
-          /* @__PURE__ */ e("span", { className: w.agentName, children: o })
-        ] }),
-        /* @__PURE__ */ i("div", { className: w.actions, children: [
-          c && u && /* @__PURE__ */ e(
-            "button",
-            {
-              className: w.actionButton,
-              onClick: u,
-              "aria-label": "Start new chat",
-              type: "button",
-              children: /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ e(
-                "path",
-                {
-                  d: "M12 5V19M5 12H19",
-                  stroke: "currentColor",
-                  strokeWidth: "2",
-                  strokeLinecap: "round",
-                  strokeLinejoin: "round"
-                }
-              ) })
-            }
-          ),
-          d && /* @__PURE__ */ e(
-            "button",
-            {
-              className: w.actionButton,
-              onClick: d,
-              "aria-label": "Close chat",
-              type: "button",
-              children: /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ e(
-                "path",
-                {
-                  d: "M6 18L18 6M6 6L18 18",
-                  stroke: "currentColor",
-                  strokeWidth: "2",
-                  strokeLinecap: "round",
-                  strokeLinejoin: "round"
-                }
-              ) })
-            }
-          )
-        ] })
-      ] }),
-      !m && /* @__PURE__ */ i("div", { className: w.welcomeText, children: [
-        /* @__PURE__ */ e("h1", { className: w.title, children: l }),
-        /* @__PURE__ */ e("p", { className: w.subtitle, children: n })
-      ] })
-    ] })
-  ] });
-}, Se = "_messageWrapper_c86gj_1", Te = "_user_c86gj_19", We = "_assistant_c86gj_24", De = "_avatar_c86gj_28", He = "_avatarPlaceholder_c86gj_43", Pe = "_brainbaseLogo_c86gj_53", Ee = "_messageBubble_c86gj_58", je = "_error_c86gj_76", Ve = "_content_c86gj_81", Ae = "_cursor_c86gj_88", ze = "_errorIndicator_c86gj_107", N = {
-  messageWrapper: Se,
-  user: Te,
-  assistant: We,
-  avatar: De,
-  avatarPlaceholder: He,
-  brainbaseLogo: Pe,
-  messageBubble: Ee,
-  error: je,
-  content: Ve,
-  cursor: Ae,
-  errorIndicator: ze
-}, Fe = ({
-  message: o,
-  agentName: t,
-  agentLogoUrl: s
-}) => {
-  const r = o.role === "user", d = o.status === "streaming", u = o.status === "error";
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: `${N.messageWrapper} ${r ? N.user : N.assistant}`,
-      children: [
-        !r && /* @__PURE__ */ e("div", { className: N.avatar, children: s ? /* @__PURE__ */ e("img", { src: s, alt: t || "AI" }) : /* @__PURE__ */ e("div", { className: N.avatarPlaceholder, children: /* @__PURE__ */ e(
-          Z,
-          {
-            className: N.brainbaseLogo,
-            color: "white",
-            cutoutColor: "var(--bb-primary-color)"
-          }
-        ) }) }),
-        /* @__PURE__ */ i(
-          "div",
-          {
-            className: `${N.messageBubble} ${u ? N.error : ""}`,
-            role: "article",
-            "aria-label": `${r ? "Your message" : `${t || "AI"} says`}`,
-            children: [
-              /* @__PURE__ */ i("div", { className: N.content, children: [
-                o.content,
-                d && /* @__PURE__ */ e("span", { className: N.cursor })
-              ] }),
-              u && /* @__PURE__ */ i("div", { className: N.errorIndicator, children: [
-                /* @__PURE__ */ i("svg", { viewBox: "0 0 24 24", fill: "none", children: [
-                  /* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "2" }),
-                  /* @__PURE__ */ e("path", { d: "M12 8V12M12 16H12.01", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" })
-                ] }),
-                /* @__PURE__ */ e("span", { children: "Failed to send" })
-              ] })
-            ]
-          }
-        )
-      ]
-    }
-  );
-}, Oe = "_toolCall_1wby1_1", Re = "_iconWrapper_1wby1_24", Ue = "_spinner_1wby1_33", Ze = "_checkIcon_1wby1_48", qe = "_errorIcon_1wby1_54", Ke = "_content_1wby1_60", Ge = "_label_1wby1_66", Je = "_name_1wby1_73", Ye = "_pending_1wby1_78", Xe = "_completed_1wby1_82", Qe = "_error_1wby1_54", L = {
-  toolCall: Oe,
-  iconWrapper: Re,
-  spinner: Ue,
-  checkIcon: Ze,
-  errorIcon: qe,
-  content: Ke,
-  label: Ge,
-  name: Je,
-  pending: Ye,
-  completed: Xe,
-  error: Qe
-}, et = ({ toolCall: o }) => {
-  const t = o.status === "pending" || o.status === "executing", s = o.status === "completed", r = o.status === "error", d = (u) => u.replace(/_/g, " ").replace(/([A-Z])/g, " $1").trim().toLowerCase().replace(/^./, (c) => c.toUpperCase());
-  return /* @__PURE__ */ i(
-    "div",
-    {
-      className: `${L.toolCall} ${t ? L.pending : ""} ${s ? L.completed : ""} ${r ? L.error : ""}`,
-      children: [
-        /* @__PURE__ */ e("div", { className: L.iconWrapper, children: t ? /* @__PURE__ */ e("div", { className: L.spinner }) : s ? /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", fill: "none", className: L.checkIcon, children: /* @__PURE__ */ e(
-          "path",
-          {
-            d: "M20 6L9 17L4 12",
-            stroke: "currentColor",
-            strokeWidth: "2",
-            strokeLinecap: "round",
-            strokeLinejoin: "round"
-          }
-        ) }) : /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", fill: "none", className: L.errorIcon, children: /* @__PURE__ */ e(
-          "path",
-          {
-            d: "M6 18L18 6M6 6L18 18",
-            stroke: "currentColor",
-            strokeWidth: "2",
-            strokeLinecap: "round",
-            strokeLinejoin: "round"
-          }
-        ) }) }),
-        /* @__PURE__ */ i("div", { className: L.content, children: [
-          /* @__PURE__ */ e("span", { className: L.label, children: t ? "Running" : s ? "Completed" : "Failed" }),
-          /* @__PURE__ */ e("span", { className: L.name, children: d(o.name) })
-        ] })
-      ]
-    }
-  );
-}, tt = "_wrapper_10rss_2", ot = "_avatar_10rss_22", nt = "_avatarPlaceholder_10rss_37", st = "_brainbaseLogo_10rss_47", rt = "_bubble_10rss_52", at = "_dot_10rss_63", W = {
-  wrapper: tt,
-  avatar: ot,
-  avatarPlaceholder: nt,
-  brainbaseLogo: st,
-  bubble: rt,
-  dot: at
-}, ct = ({
-  agentName: o = "AI",
-  agentLogoUrl: t
-}) => /* @__PURE__ */ i("div", { className: W.wrapper, role: "status", "aria-label": `${o} is typing`, children: [
-  /* @__PURE__ */ e("div", { className: W.avatar, children: t ? /* @__PURE__ */ e("img", { src: t, alt: o }) : /* @__PURE__ */ e("div", { className: W.avatarPlaceholder, children: /* @__PURE__ */ e(
-    Z,
-    {
-      className: W.brainbaseLogo,
-      color: "white",
-      cutoutColor: "var(--bb-primary-color)"
-    }
-  ) }) }),
-  /* @__PURE__ */ i("div", { className: W.bubble, children: [
-    /* @__PURE__ */ e("span", { className: W.dot }),
-    /* @__PURE__ */ e("span", { className: W.dot }),
-    /* @__PURE__ */ e("span", { className: W.dot })
-  ] })
-] }), it = "_messageList_241kk_1", lt = "_emptyState_241kk_29", dt = "_emptyIcon_241kk_40", ut = "_emptyText_241kk_52", Y = {
-  messageList: it,
-  emptyState: lt,
-  emptyIcon: dt,
-  emptyText: ut
-}, mt = ({
-  messages: o,
-  toolCalls: t,
-  isLoading: s,
-  agentName: r,
-  agentLogoUrl: d
-}) => {
-  var l;
-  const u = R(null), c = R(null);
-  U(() => {
-    var n;
-    (n = c.current) == null || n.scrollIntoView({ behavior: "smooth" });
-  }, [o, t, s]);
-  const m = t.filter(
-    (n) => n.status === "pending" || n.status === "executing"
-  );
-  return /* @__PURE__ */ i("div", { className: Y.messageList, ref: u, role: "log", "aria-live": "polite", children: [
-    o.length === 0 && !s && /* @__PURE__ */ i("div", { className: Y.emptyState, children: [
-      /* @__PURE__ */ e("div", { className: Y.emptyIcon, children: /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ e(
-        "path",
-        {
-          d: "M8 12H8.01M12 12H12.01M16 12H16.01M21 12C21 16.4183 16.9706 20 12 20C10.4607 20 9.01172 19.6565 7.74467 19.0511L3 20L4.39499 16.28C3.51156 15.0423 3 13.5743 3 12C3 7.58172 7.02944 4 12 4C16.9706 4 21 7.58172 21 12Z",
-          stroke: "currentColor",
-          strokeWidth: "1.5",
-          strokeLinecap: "round",
-          strokeLinejoin: "round"
-        }
-      ) }) }),
-      /* @__PURE__ */ e("p", { className: Y.emptyText, children: "Start a conversation" })
-    ] }),
-    o.map((n) => /* @__PURE__ */ e(
-      Fe,
-      {
-        message: n,
-        agentName: r,
-        agentLogoUrl: d
-      },
-      n.id
-    )),
-    m.map((n) => /* @__PURE__ */ e(et, { toolCall: n }, n.id)),
-    s && ((l = o[o.length - 1]) == null ? void 0 : l.role) === "user" && /* @__PURE__ */ e(ct, { agentName: r, agentLogoUrl: d }),
-    /* @__PURE__ */ e("div", { ref: c })
-  ] });
-}, gt = "_inputWrapper_5lgg7_1", pt = "_inputContainer_5lgg7_7", ht = "_textarea_5lgg7_23", _t = "_sendButton_5lgg7_50", ft = "_hint_5lgg7_89", O = {
-  inputWrapper: gt,
-  inputContainer: pt,
-  textarea: ht,
-  sendButton: _t,
-  hint: ft
-}, bt = ({
-  onSend: o,
-  disabled: t = !1,
-  placeholder: s = "Send a message..."
-}) => {
-  const [r, d] = I(""), u = R(null), c = x(() => {
-    const n = u.current;
-    n && (n.style.height = "auto", n.style.height = `${Math.min(n.scrollHeight, 150)}px`);
-  }, []);
-  U(() => {
-    c();
-  }, [r, c]);
-  const m = x(
-    (n) => {
-      n == null || n.preventDefault();
-      const C = r.trim();
-      C && !t && (o(C), d(""), u.current && (u.current.style.height = "auto"));
-    },
-    [r, t, o]
-  ), l = x(
-    (n) => {
-      n.key === "Enter" && !n.shiftKey && (n.preventDefault(), m());
-    },
-    [m]
-  );
-  return /* @__PURE__ */ i("form", { className: O.inputWrapper, onSubmit: m, children: [
-    /* @__PURE__ */ i("div", { className: O.inputContainer, children: [
-      /* @__PURE__ */ e(
-        "textarea",
-        {
-          ref: u,
-          className: O.textarea,
-          value: r,
-          onChange: (n) => d(n.target.value),
-          onKeyDown: l,
-          placeholder: s,
-          disabled: t,
-          rows: 1,
-          "aria-label": "Message input"
-        }
-      ),
-      /* @__PURE__ */ e(
-        "button",
-        {
-          type: "submit",
-          className: O.sendButton,
-          disabled: t || !r.trim(),
-          "aria-label": "Send message",
-          children: /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ e(
-            "path",
-            {
-              d: "M22 2L11 13M22 2L15 22L11 13M22 2L2 9L11 13",
-              stroke: "currentColor",
-              strokeWidth: "2",
-              strokeLinecap: "round",
-              strokeLinejoin: "round"
-            }
-          ) })
-        }
-      )
-    ] }),
-    /* @__PURE__ */ i("div", { className: O.hint, children: [
-      "Press ",
-      /* @__PURE__ */ e("kbd", { children: "Enter" }),
-      " to send, ",
-      /* @__PURE__ */ e("kbd", { children: "Shift + Enter" }),
-      " for new line"
-    ] })
-  ] });
-}, wt = "_poweredBy_9jh5q_1", yt = "_logo_9jh5q_20", Ct = "_poweredText_9jh5q_24", kt = "_text_9jh5q_36", X = {
-  poweredBy: wt,
-  logo: yt,
-  poweredText: Ct,
-  text: kt
-}, vt = ({ className: o }) => /* @__PURE__ */ i(
-  "svg",
-  {
-    className: o,
-    viewBox: "0 0 800 800",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg",
-    children: [
-      /* @__PURE__ */ e(
-        "path",
-        {
-          d: "M400 412C400 405.373 405.373 400 412 400H788C794.627 400 800 405.373 800 412V740C800 773.137 773.137 800 740 800H412C405.373 800 400 794.627 400 788V412Z",
-          fill: "currentColor"
-        }
-      ),
-      /* @__PURE__ */ e("circle", { cx: "400", cy: "400", r: "400", fill: "currentColor" }),
-      /* @__PURE__ */ e(
-        "path",
-        {
-          d: "M0 60C0 26.8629 26.8629 0 60 0H397.614C398.932 0 400 1.06811 400 2.38569V2.38569C400 221.982 221.982 400 2.38569 400V400C1.06811 400 0 398.932 0 397.614V60Z",
-          fill: "currentColor"
-        }
-      ),
-      /* @__PURE__ */ e(
-        "path",
-        {
-          d: "M400 412C400 405.373 405.373 400 412 400H738C744.627 400 750 405.373 750 412V725C750 738.807 738.807 750 725 750H412C405.373 750 400 744.627 400 738V412Z",
-          fill: "currentColor"
-        }
-      ),
-      /* @__PURE__ */ e("circle", { cx: "400", cy: "400", r: "350", fill: "currentColor" }),
-      /* @__PURE__ */ e(
-        "path",
-        {
-          d: "M50 75C50 61.1929 61.1929 50 75 50H388C394.627 50 400 55.3726 400 62V388C400 394.627 394.627 400 388 400H62C55.3726 400 50 394.627 50 388V75Z",
-          fill: "currentColor"
-        }
-      ),
-      /* @__PURE__ */ e(
-        "rect",
-        {
-          x: "399.919",
-          y: "209",
-          width: "270",
-          height: "270",
-          rx: "12",
-          transform: "rotate(45 399.919 209)",
-          fill: "var(--bb-surface-bg, #ffffff)"
-        }
-      )
-    ]
-  }
-), It = () => /* @__PURE__ */ i(
-  "a",
-  {
-    href: "https://brainbaselabs.com/",
-    target: "_blank",
-    rel: "noopener noreferrer",
-    className: X.poweredBy,
-    "aria-label": "Powered by Brainbase Labs",
-    children: [
-      /* @__PURE__ */ e("span", { className: X.poweredText, children: "Powered by" }),
-      /* @__PURE__ */ e(vt, { className: X.logo }),
-      /* @__PURE__ */ e("span", { className: X.text, children: "Brainbase Labs" })
-    ]
-  }
-), Nt = "_container_m2o9l_1", Lt = "_body_m2o9l_26", Bt = "_confirmationOverlay_m2o9l_35", $t = "_confirmationDialog_m2o9l_56", xt = "_confirmationText_m2o9l_78", Mt = "_confirmationButtons_m2o9l_86", St = "_cancelButton_m2o9l_91", Tt = "_confirmButton_m2o9l_92", D = {
-  container: Nt,
-  body: Lt,
-  confirmationOverlay: Bt,
-  confirmationDialog: $t,
-  confirmationText: xt,
-  confirmationButtons: Mt,
-  cancelButton: St,
-  confirmButton: Tt
-}, Wt = ({
-  config: o,
-  messages: t,
-  toolCalls: s,
-  isLoading: r,
-  onSendMessage: d,
-  onClose: u,
-  onNewChat: c
-}) => {
-  const [m, l] = I(!1), n = t.length > 0, C = () => {
-    l(!0);
-  }, M = () => {
-    l(!1), c == null || c();
-  }, j = () => {
-    l(!1);
-  };
-  return /* @__PURE__ */ i("div", { className: D.container, role: "dialog", "aria-label": "Chat window", children: [
-    /* @__PURE__ */ e(
-      Me,
-      {
-        agentName: o.agentName,
-        agentLogoUrl: o.agentLogoUrl,
-        welcomeTitle: "Hello there.",
-        welcomeSubtitle: "How can we help?",
-        onClose: u,
-        onNewChatRequest: C,
-        showNewChatButton: n,
-        compact: n
-      }
-    ),
-    /* @__PURE__ */ i("div", { className: D.body, children: [
-      /* @__PURE__ */ e(
-        mt,
-        {
-          messages: t,
-          toolCalls: s,
-          isLoading: r,
-          agentName: o.agentName,
-          agentLogoUrl: o.agentLogoUrl
-        }
-      ),
-      /* @__PURE__ */ e(
-        bt,
-        {
-          onSend: d,
-          disabled: r,
-          placeholder: "Ask a question..."
-        }
-      )
-    ] }),
-    /* @__PURE__ */ e(It, {}),
-    m && /* @__PURE__ */ e("div", { className: D.confirmationOverlay, children: /* @__PURE__ */ i("div", { className: D.confirmationDialog, children: [
-      /* @__PURE__ */ e("p", { className: D.confirmationText, children: "End current chat and start a new conversation?" }),
-      /* @__PURE__ */ i("div", { className: D.confirmationButtons, children: [
-        /* @__PURE__ */ e(
-          "button",
-          {
-            className: D.cancelButton,
-            onClick: j,
-            type: "button",
-            children: "Cancel"
-          }
-        ),
-        /* @__PURE__ */ e(
-          "button",
-          {
-            className: D.confirmButton,
-            onClick: M,
-            type: "button",
-            children: "End Chat"
-          }
-        )
-      ] })
-    ] }) })
-  ] });
-}, Dt = "_toggleButton_11dqz_1", Ht = "_icon_11dqz_31", Pt = "_agentLogo_11dqz_36", Et = "_unreadBadge_11dqz_43", Q = {
-  toggleButton: Dt,
-  icon: Ht,
-  agentLogo: Pt,
-  unreadBadge: Et
-}, re = ({
-  onClick: o,
-  agentLogoUrl: t,
-  unreadCount: s = 0
-}) => /* @__PURE__ */ i(
-  "button",
-  {
-    className: Q.toggleButton,
-    onClick: o,
-    "aria-label": "Open chat",
-    type: "button",
-    children: [
-      t ? /* @__PURE__ */ e("img", { src: t, alt: "", className: Q.agentLogo }) : /* @__PURE__ */ e(
-        "svg",
-        {
-          className: Q.icon,
-          viewBox: "0 0 24 24",
-          fill: "none",
-          xmlns: "http://www.w3.org/2000/svg",
-          children: /* @__PURE__ */ e(
-            "path",
-            {
-              d: "M8 12H8.01M12 12H12.01M16 12H16.01M21 12C21 16.4183 16.9706 20 12 20C10.4607 20 9.01172 19.6565 7.74467 19.0511L3 20L4.39499 16.28C3.51156 15.0423 3 13.5743 3 12C3 7.58172 7.02944 4 12 4C16.9706 4 21 7.58172 21 12Z",
-              stroke: "currentColor",
-              strokeWidth: "2",
-              strokeLinecap: "round",
-              strokeLinejoin: "round"
-            }
-          )
-        }
-      ),
-      s > 0 && /* @__PURE__ */ e("span", { className: Q.unreadBadge, children: s > 9 ? "9+" : s })
-    ]
-  }
-), jt = "_container_kgfgt_1", Vt = "_header_kgfgt_25", At = "_logoWrapper_kgfgt_38", zt = "_logo_kgfgt_38", Ft = "_closeButton_kgfgt_51", Ot = "_content_kgfgt_74", Rt = "_iconWrapper_kgfgt_84", Ut = "_errorIcon_kgfgt_95", Zt = "_title_kgfgt_101", qt = "_description_kgfgt_109", Kt = "_retryButton_kgfgt_117", Gt = "_footer_kgfgt_139", Jt = "_poweredBy_kgfgt_146", Yt = "_footerLogo_kgfgt_160", y = {
-  container: jt,
-  header: Vt,
-  logoWrapper: At,
-  logo: zt,
-  closeButton: Ft,
-  content: Ot,
-  iconWrapper: Rt,
-  errorIcon: Ut,
-  title: Zt,
-  description: qt,
-  retryButton: Kt,
-  footer: Gt,
-  poweredBy: Jt,
-  footerLogo: Yt
-}, Xt = ({
-  errorType: o,
-  message: t,
-  onRetry: s,
-  onClose: r
-}) => {
-  const d = () => {
-    switch (o) {
-      case "not_found":
-        return {
-          title: "Chat Not Found",
-          description: t || "This chat widget is not configured correctly. Please check the embed ID.",
-          icon: /* @__PURE__ */ i("svg", { viewBox: "0 0 24 24", fill: "none", className: y.errorIcon, children: [
-            /* @__PURE__ */ e(
-              "circle",
-              {
-                cx: "12",
-                cy: "12",
-                r: "10",
-                stroke: "currentColor",
-                strokeWidth: "1.5"
-              }
-            ),
-            /* @__PURE__ */ e(
-              "path",
-              {
-                d: "M12 7V13M12 16V16.5",
-                stroke: "currentColor",
-                strokeWidth: "1.5",
-                strokeLinecap: "round"
-              }
-            )
-          ] })
-        };
-      case "network":
-        return {
-          title: "Connection Error",
-          description: t || "Unable to connect to the chat service. Please check your internet connection.",
-          icon: /* @__PURE__ */ i("svg", { viewBox: "0 0 24 24", fill: "none", className: y.errorIcon, children: [
-            /* @__PURE__ */ e(
-              "path",
-              {
-                d: "M12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21Z",
-                stroke: "currentColor",
-                strokeWidth: "1.5"
-              }
-            ),
-            /* @__PURE__ */ e(
-              "path",
-              {
-                d: "M8 15L16 9M8 9L16 15",
-                stroke: "currentColor",
-                strokeWidth: "1.5",
-                strokeLinecap: "round"
-              }
-            )
-          ] })
-        };
-      default:
-        return {
-          title: "Something Went Wrong",
-          description: t || "An unexpected error occurred. Please try again later.",
-          icon: /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", fill: "none", className: y.errorIcon, children: /* @__PURE__ */ e(
-            "path",
-            {
-              d: "M12 9V13M12 17H12.01M21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12Z",
-              stroke: "currentColor",
-              strokeWidth: "1.5",
-              strokeLinecap: "round"
-            }
-          ) })
-        };
-    }
-  }, { title: u, description: c, icon: m } = d();
-  return /* @__PURE__ */ i("div", { className: y.container, children: [
-    /* @__PURE__ */ i("div", { className: y.header, children: [
-      /* @__PURE__ */ e("div", { className: y.logoWrapper, children: /* @__PURE__ */ e(
-        Z,
-        {
-          className: y.logo,
-          color: "white",
-          cutoutColor: "var(--bb-primary-color)"
-        }
-      ) }),
-      r && /* @__PURE__ */ e(
-        "button",
-        {
-          className: y.closeButton,
-          onClick: r,
-          "aria-label": "Close",
-          type: "button",
-          children: /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ e(
-            "path",
-            {
-              d: "M6 18L18 6M6 6L18 18",
-              stroke: "currentColor",
-              strokeWidth: "2",
-              strokeLinecap: "round"
-            }
-          ) })
-        }
-      )
-    ] }),
-    /* @__PURE__ */ i("div", { className: y.content, children: [
-      /* @__PURE__ */ e("div", { className: y.iconWrapper, children: m }),
-      /* @__PURE__ */ e("h2", { className: y.title, children: u }),
-      /* @__PURE__ */ e("p", { className: y.description, children: c }),
-      s && /* @__PURE__ */ e("button", { className: y.retryButton, onClick: s, type: "button", children: "Try Again" })
-    ] }),
-    /* @__PURE__ */ e("div", { className: y.footer, children: /* @__PURE__ */ i(
-      "a",
-      {
-        href: "https://brainbaselabs.com",
-        target: "_blank",
-        rel: "noopener noreferrer",
-        className: y.poweredBy,
-        children: [
-          "Powered by",
-          " ",
-          /* @__PURE__ */ e(
-            Z,
-            {
-              className: y.footerLogo,
-              color: "var(--bb-text-tertiary)",
-              cutoutColor: "var(--bb-surface-bg)"
-            }
-          ),
-          /* @__PURE__ */ e("span", { children: "Brainbase Labs" })
-        ]
-      }
-    ) })
-  ] });
-}, Qt = "_widget_1ehud_1", eo = "_inline_1ehud_25", E = {
-  widget: Qt,
-  "bottom-right": "_bottom-right_1ehud_10",
-  "bottom-left": "_bottom-left_1ehud_17",
-  inline: eo
-}, to = "https://whatsapp-based-server.onrender.com", so = ({
-  embedId: o,
-  apiBaseUrl: t = to,
-  mockMode: s = !1,
-  mockResponses: r,
-  position: d = "bottom-right",
-  defaultOpen: u = !1,
-  primaryColor: c,
-  agentName: m,
-  welcomeMessage: l,
-  className: n,
-  onSessionStart: C,
-  onSessionEnd: M,
-  onMessage: j,
-  onError: S
-}) => {
-  const [q, P] = I(u), [g, H] = I(null), [T, V] = I(!0), [K, B] = I(null), [G, J] = I(), A = ee(() => s ? pe(
-    { primaryColor: c, agentName: m, welcomeMessage: l },
-    r
-  ) : ue(t), [s, c, m, l, r, t]), z = x(async () => {
-    V(!0), B(null), J(void 0);
-    try {
-      const v = await A.getDeploymentConfig(o);
-      H({
-        ...v,
-        // Allow prop overrides
-        primaryColor: c ?? v.primaryColor,
-        agentName: m ?? v.agentName,
-        welcomeMessage: l ?? v.welcomeMessage
-      });
-    } catch (v) {
-      const $ = v instanceof Error ? v : new Error("Failed to load config");
-      $.message.includes("404") ? (B("not_found"), J("The chat widget with this embed ID was not found.")) : $.message.includes("Failed to fetch") || $.message.includes("network") ? B("network") : B("unknown"), s && (H({
-        embedId: o,
-        deploymentId: "mock-deployment",
-        workerId: "mock-worker",
-        flowId: "mock-flow",
-        primaryColor: c ?? "#1a1a2e",
-        agentName: m ?? "AI Assistant"
-      }), B(null)), S == null || S($);
-    } finally {
-      V(!1);
-    }
-  }, [o, s, A, c, m, l, S]);
-  U(() => {
-    z();
-  }, [z]);
-  const _ = ee(() => g || {
-    embedId: o,
-    deploymentId: "",
-    workerId: "",
-    flowId: "",
-    primaryColor: c,
-    agentName: m,
-    welcomeMessage: l
-  }, [g, o, c, m, l]), b = le({
-    config: _,
-    apiClient: A,
-    mockMode: s,
-    onSessionStart: C,
-    onSessionEnd: M,
-    onMessage: j,
-    onError: S
-  }), k = ee(
-    () => ({
-      "--bb-primary-color": (g == null ? void 0 : g.primaryColor) ?? c ?? "#1a1a2e"
-    }),
-    [g == null ? void 0 : g.primaryColor, c]
-  ), p = () => {
-    b.endSession(), b.startNewSession();
-  }, h = () => {
-    P(!1);
-  }, a = () => {
-    z();
-  }, f = d === "inline";
-  return T ? null : K && !s ? !f && !q ? /* @__PURE__ */ e(
-    "div",
-    {
-      className: `${E.widget} ${E[d]} ${n ?? ""}`,
-      style: k,
-      children: /* @__PURE__ */ e(
-        re,
-        {
-          onClick: () => P(!0),
-          agentName: m
-        }
-      )
-    }
-  ) : /* @__PURE__ */ e(
-    "div",
-    {
-      className: `${E.widget} ${E[d]} ${n ?? ""}`,
-      style: k,
-      children: /* @__PURE__ */ e(
-        Xt,
-        {
-          errorType: K,
-          message: G,
-          onRetry: a,
-          onClose: f ? void 0 : h
-        }
-      )
-    }
-  ) : /* @__PURE__ */ e(
-    "div",
-    {
-      className: `${E.widget} ${E[d]} ${n ?? ""}`,
-      style: k,
-      children: q || f ? /* @__PURE__ */ e(
-        Wt,
-        {
-          config: _,
-          messages: b.messages,
-          toolCalls: b.toolCalls,
-          isLoading: b.isLoading,
-          onSendMessage: b.sendMessage,
-          onClose: f ? void 0 : h,
-          onNewChat: p
-        }
-      ) : /* @__PURE__ */ e(
-        re,
-        {
-          onClick: () => P(!0),
-          agentName: g == null ? void 0 : g.agentName,
-          agentLogoUrl: g == null ? void 0 : g.agentLogoUrl
-        }
-      )
-    }
-  );
-};
-function ro() {
-  if (typeof crypto < "u" && crypto.randomUUID)
-    return `bb-${crypto.randomUUID()}`;
-  const o = Date.now().toString(36), t = Math.random().toString(36).substring(2, 15), s = Math.random().toString(36).substring(2, 15);
-  return `bb-${o}-${t}${s}`;
-}
-export {
-  Wt as ChatContainer,
-  Me as ChatHeader,
-  re as ChatToggleButton,
-  so as ChatWidget,
-  Fe as Message,
-  bt as MessageInput,
-  mt as MessageList,
-  et as ToolCallDisplay,
-  ct as TypingIndicator,
-  se as clearSession,
-  ue as createAPIClient,
-  pe as createMockAPIClient,
-  ro as generateSessionId,
-  ie as getStoredSession,
-  ne as storeSession,
-  le as useChat
-};