@cloudflare/ai-search-snippet 0.0.37 → 0.0.39

package/dist/search-snippet.es.js

@@ -1,142 +1,279 @@
-var P = Object.defineProperty;
-var U = (n, i, e) => i in n ? P(n, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[i] = e;
-var a = (n, i, e) => U(n, typeof i != "symbol" ? i + "" : i, e);
-const g = [
-  "Searching...",
-  "Digging through results...",
-  "Scanning the knowledge base...",
-  "Finding the best matches...",
-  "Sifting through the data...",
-  "Almost there...",
-  "Looking far and wide...",
-  "Connecting the dots...",
-  "Rummaging through pages...",
-  "Hunting down answers..."
-];
-function $(n, i) {
+var W = Object.defineProperty;
+var J = (l, i, e) => i in l ? W(l, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : l[i] = e;
+var a = (l, i, e) => J(l, typeof i != "symbol" ? i + "" : i, e);
+const T = {
+  // Shared
+  loadingAriaLabel: "Loading",
+  errorPrefix: "Error:",
+  missingApiUrlError: "The api-url attribute is required. Please provide a valid API URL.",
+  poweredBy: "Powered by",
+  poweredByLinkLabel: "Cloudflare AI Search",
+  // Search (shared between bar and modal)
+  placeholder: "Search...",
+  searchButtonLabel: "Search",
+  searchInputAriaLabel: "Search input",
+  searchResultsAriaLabel: "Search results",
+  emptyStateTitle: "Start Searching",
+  emptyStateDescription: "Enter a query to search for results",
+  modalEmptyStateDescription: "Start typing to search",
+  noResultsTitle: "No Results Found",
+  noResultsDescription: 'No results found for "{query}"',
+  modalNoResultsTitle: "No results found",
+  modalNoResultsDescription: 'No results for "{query}"',
+  resultsCount: "Found {n} result",
+  resultsCountPlural: "Found {n} results",
+  resultsCountOverflow: "Showing {n} of {total} results",
+  modalResultsCount: "{n} result",
+  modalResultsCountPlural: "{n} results",
+  modalResultsCountZero: "0 results",
+  modalResultsCountError: "Error",
+  seeMoreResults: "See more results",
+  // Modal-only
+  navigateHint: "Navigate",
+  selectHint: "Select",
+  closeHint: "Close",
+  // Chat (shared between bubble, page, and chat view)
+  chatTitle: "Chat",
+  chatPlaceholder: "Type a message...",
+  chatInputAriaLabel: "Chat message input",
+  sendButtonLabel: "Send",
+  sendButtonAriaLabel: "Send message",
+  chatEmptyTitle: "Start a Conversation",
+  chatEmptyDescription: "Send a message to begin chatting",
+  userAvatar: "U",
+  assistantAvatar: "AI",
+  unknownError: "Unknown error",
+  // Chat bubble
+  openChatAriaLabel: "Open chat",
+  clearHistoryAriaLabel: "Clear history",
+  minimizeAriaLabel: "Minimize",
+  closeAriaLabel: "Close",
+  // Chat page
+  historyTitle: "History",
+  newChatButton: "New Chat",
+  clearChatButton: "Clear Chat",
+  toggleSidebarTitle: "Toggle sidebar",
+  deleteChatTitle: "Delete chat",
+  noChatsYet: "No chats yet",
+  yesterday: "Yesterday",
+  // Relative timestamps (formatTimestamp)
+  justNow: "Just now",
+  minuteAgo: "{n} minute ago",
+  minutesAgo: "{n} minutes ago",
+  hourAgo: "{n} hour ago",
+  hoursAgo: "{n} hours ago",
+  // Cycling loading messages
+  loadingMessages: [
+    "Searching...",
+    "Digging through results...",
+    "Scanning the knowledge base...",
+    "Finding the best matches...",
+    "Sifting through the data...",
+    "Almost there...",
+    "Looking far and wide...",
+    "Connecting the dots...",
+    "Rummaging through pages...",
+    "Hunting down answers..."
+  ]
+};
+function g(l) {
+  if (!l || typeof l != "object")
+    return T;
+  const i = { ...T };
+  for (const e of Object.keys(l)) {
+    const t = l[e];
+    if (t != null) {
+      if (e === "loadingMessages") {
+        Array.isArray(t) && t.length > 0 && (i.loadingMessages = t.filter((s) => typeof s == "string"), i.loadingMessages.length === 0 && (i.loadingMessages = T.loadingMessages));
+        continue;
+      }
+      typeof t == "string" && (i[e] = t);
+    }
+  }
+  return i;
+}
+function y(l, i = {}) {
+  return l.replace(/\{(\w+)\}/g, (e, t) => Object.hasOwn(i, t) ? String(i[t]) : e);
+}
+function k(l, i) {
+  if (!l) return null;
+  try {
+    const e = JSON.parse(l);
+    if (e === null || typeof e != "object" || Array.isArray(e))
+      throw new Error("translations must be a JSON object");
+    return e;
+  } catch (e) {
+    return console.error(`${i}: invalid translations attribute`, e), null;
+  }
+}
+const A = 2500;
+function _(l, i) {
   let e;
   function t(...s) {
     clearTimeout(e), e = setTimeout(() => {
-      n(...s);
+      l(...s);
     }, i);
   }
   return t.cancel = () => clearTimeout(e), t;
 }
-function h(n) {
+function c(l) {
   const i = document.createElement("div");
-  return i.textContent = n, i.innerHTML;
+  return i.textContent = l, i.innerHTML;
 }
-function q(n) {
+function V(l) {
   try {
-    return decodeURI(n);
+    return decodeURI(l);
   } catch {
-    return n;
+    return l;
   }
 }
-function E(n) {
-  return new DOMParser().parseFromString(n, "text/html").documentElement.textContent || "";
+function I(l) {
+  return new DOMParser().parseFromString(l, "text/html").documentElement.textContent || "";
 }
-function O(n) {
-  const i = new Date(n), t = (/* @__PURE__ */ new Date()).getTime() - i.getTime();
-  if (t < 6e4)
-    return "Just now";
-  if (t < 36e5) {
-    const s = Math.floor(t / 6e4);
-    return `${s} ${s === 1 ? "minute" : "minutes"} ago`;
+function X(l, i) {
+  const e = g(i), t = new Date(l), r = (/* @__PURE__ */ new Date()).getTime() - t.getTime();
+  if (r < 6e4)
+    return e.justNow;
+  if (r < 36e5) {
+    const n = Math.floor(r / 6e4), o = n === 1 ? e.minuteAgo : e.minutesAgo;
+    return y(o, { n });
   }
-  if (t < 864e5) {
-    const s = Math.floor(t / 36e5);
-    return `${s} ${s === 1 ? "hour" : "hours"} ago`;
+  if (r < 864e5) {
+    const n = Math.floor(r / 36e5), o = n === 1 ? e.hourAgo : e.hoursAgo;
+    return y(o, { n });
   }
-  return i.toLocaleString(void 0, {
+  return t.toLocaleString(void 0, {
     month: "short",
     day: "numeric",
     hour: "2-digit",
     minute: "2-digit"
   });
 }
-function B(n) {
-  return new Date(n).toLocaleDateString(void 0, {
+function j(l) {
+  return new Date(l).toLocaleDateString(void 0, {
     month: "short",
     day: "numeric"
   });
 }
-function M(n = "id") {
-  return `${n}-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
+function R(l = "id") {
+  return `${l}-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
 }
-function d(n, i) {
-  return n !== null ? n : i;
+function m(l, i) {
+  return l !== null ? l : i;
 }
-function m(n, i) {
-  return n === null ? i : n === "true" || n === "";
+function v(l, i) {
+  return l === null ? i : l === "true" || l === "";
 }
-function y(n, i) {
-  if (n === null) return i;
-  const e = Number.parseInt(n, 10);
+function w(l, i) {
+  if (l === null) return i;
+  const e = Number.parseInt(l, 10);
   return Number.isNaN(e) ? i : e;
 }
-function v(n, i) {
-  return new CustomEvent(n, {
+function F(l, i) {
+  if (!(l === null || l === ""))
+    try {
+      const e = JSON.parse(l);
+      if (e === null || typeof e != "object" || Array.isArray(e))
+        throw new Error("chat-query-rewrite must be a JSON object");
+      const t = e, s = {};
+      return typeof t.enabled == "boolean" && (s.enabled = t.enabled), typeof t.model == "string" && (s.model = t.model), typeof t.rewritePrompt == "string" && (s.rewritePrompt = t.rewritePrompt), s;
+    } catch (e) {
+      console.error(`${i}: invalid chat-query-rewrite attribute`, e);
+      return;
+    }
+}
+function b(l, i) {
+  return new CustomEvent(l, {
     detail: i,
     bubbles: !0,
     composed: !0,
     cancelable: !0
   });
 }
-function x(n) {
-  if (!n)
+function S(l) {
+  if (!l)
     throw new Error("API URL is required");
-  return new K(n);
+  return new ae(l);
+}
+const Z = "@cf/meta/llama-3.3-70b-instruct-fp8-fast", ee = `You rewrite a multi-turn chat into a single standalone search query for a retrieval system.
+
+Inputs: the full conversation in \`messages\`. The final user message is the one to answer; earlier messages are context only.
+
+Rules:
+- Output ONLY the rewritten query as plain text. No preamble, no quotes, no markdown, no explanation.
+- Resolve pronouns and references (it, that, they, the second one, the previous one, etc.) using prior turns.
+- Inline any entities, names, versions, products, or constraints from earlier turns that the final message depends on.
+- Preserve the user's original language and terminology. Do not translate.
+- Do not invent facts, sources, dates, or details not present in the conversation.
+- If the final user message is already fully self-contained, return it unchanged (modulo trivial cleanup).
+- Drop greetings, thanks, and meta questions about the assistant itself; keep only the information need.
+- Keep it concise — a search query, not a sentence. Aim for under 200 characters when possible.
+
+Return only the rewritten query.`;
+function te(l) {
+  let i = "message";
+  const e = [];
+  for (const t of l.split(`
+`)) {
+    const s = t.endsWith("\r") ? t.slice(0, -1) : t;
+    if (s === "" || s.startsWith(":"))
+      continue;
+    const r = s.indexOf(":"), n = r === -1 ? s : s.slice(0, r);
+    let o = r === -1 ? "" : s.slice(r + 1);
+    o.startsWith(" ") && (o = o.slice(1)), n === "event" ? i = o : n === "data" && e.push(o);
+  }
+  return e.length === 0 ? null : { event: i, data: e.join(`
+`) };
 }
-function w(n) {
-  return n !== null && typeof n == "object" && !Array.isArray(n);
+function C(l) {
+  return l !== null && typeof l == "object" && !Array.isArray(l);
 }
-function R(...n) {
+function K(...l) {
   const i = {};
-  for (const e of n)
+  for (const e of l)
     if (e)
       for (const [t, s] of Object.entries(e)) {
         const r = i[t];
-        w(r) && w(s) ? i[t] = R(r, s) : i[t] = s;
+        C(r) && C(s) ? i[t] = K(r, s) : i[t] = s;
       }
   return i;
 }
-function D(n, i) {
-  if (!w(i))
-    return n;
+function se(l, i) {
+  if (!C(i))
+    return l;
   const e = new URLSearchParams();
-  for (const [l, p] of Object.entries(i))
-    p != null && e.append(l, String(p));
+  for (const [h, d] of Object.entries(i))
+    d != null && e.append(h, String(d));
   const t = e.toString();
   if (!t)
-    return n;
-  const s = n.indexOf("#"), r = s === -1 ? n : n.slice(0, s), o = s === -1 ? "" : n.slice(s), c = r.includes("?") ? "&" : "?";
-  return `${r}${c}${t}${o}`;
+    return l;
+  const s = l.indexOf("#"), r = s === -1 ? l : l.slice(0, s), n = s === -1 ? "" : l.slice(s), o = r.includes("?") ? "&" : "?";
+  return `${r}${o}${t}${n}`;
 }
-function j(n) {
-  if (!w(n))
+function ie(l) {
+  if (!C(l))
     return {};
   const i = {};
-  for (const [e, t] of Object.entries(n))
+  for (const [e, t] of Object.entries(l))
     t != null && (i[e] = String(t));
   return i;
 }
-function V(n) {
-  return w(n) ? n : void 0;
+function re(l) {
+  return C(l) ? l : void 0;
 }
-class K {
+class ae {
   constructor(i) {
     a(this, "activeRequests", /* @__PURE__ */ new Map());
     a(this, "baseUrl");
     this.baseUrl = i.replace(/\/$/, "");
   }
   request(i, e, t, s) {
-    const r = e === "search" ? "snippet-search" : "snippet-chat-completions", o = D(`${this.baseUrl}/${e}`, s?.queryParams);
-    return fetch(o, {
+    const r = e === "search" ? "snippet-search" : "snippet-chat-completions", n = se(`${this.baseUrl}/${e}`, s?.queryParams);
+    return fetch(n, {
       method: "POST",
-      body: JSON.stringify(R(V(s?.body), i)),
+      body: JSON.stringify(K(re(s?.body), i)),
       headers: {
-        ...j(s?.headers),
+        ...ie(s?.headers),
         "Content-Type": "application/json",
         Accept: i.stream ? "text/event-stream" : "application/json",
         "cf-ai-search-source": r
@@ -151,7 +288,7 @@ class K {
     const t = this.generateRequestId(), s = new AbortController(), r = e.signal || s.signal;
     this.registerRequest(t, s);
     try {
-      const o = await this.request(
+      const n = await this.request(
         {
           messages: [{ role: "user", content: i }],
           stream: !1,
@@ -166,28 +303,28 @@ class K {
         r,
         e.request
       );
-      if (!o.ok)
-        throw new Error(`HTTP error! status: ${o.status}`);
-      if (!o.body)
+      if (!n.ok)
+        throw new Error(`HTTP error! status: ${n.status}`);
+      if (!n.body)
         throw new Error("Response body is empty");
-      const c = await o.json();
-      if (c.success && c.result)
-        return c.result.chunks.map(
-          (l) => ({
+      const o = await n.json();
+      if (o.success && o.result)
+        return o.result.chunks.map(
+          (h) => ({
             type: "result",
-            id: l.id,
-            title: E(l.item.metadata?.title),
-            description: l.item.metadata?.description ? E(l.item.metadata?.description) : "",
-            timestamp: l.item.timestamp ?? void 0,
-            url: l.item.key,
-            image: l.item.metadata?.image || void 0,
+            id: h.id,
+            title: I(h.item.metadata?.title),
+            description: h.item.metadata?.description ? I(h.item.metadata?.description) : "",
+            timestamp: h.item.timestamp ?? void 0,
+            url: h.item.key,
+            image: h.item.metadata?.image || void 0,
             metadata: {
-              ...l.item.metadata,
-              instance_id: l.instance_id
+              ...h.item.metadata,
+              instance_id: h.instance_id
             }
           })
         );
-      throw c.success === !1 ? new Error(c.error) : new Error("Unknown error");
+      throw o.success === !1 ? new Error(o.error) : new Error("Unknown error");
     } finally {
       this.unregisterRequest(t);
     }
@@ -195,7 +332,7 @@ class K {
   async *searchStream(i, e = {}) {
     const t = this.generateRequestId(), s = new AbortController(), r = e.signal || s.signal;
     this.registerRequest(t, s);
-    const o = await this.request(
+    const n = await this.request(
       {
         messages: [{ role: "user", content: i }],
         stream: !0,
@@ -207,24 +344,24 @@ class K {
       r,
       e.request
     );
-    if (!o.ok)
-      throw new Error(`HTTP error! status: ${o.status}`);
-    if (!o.body)
+    if (!n.ok)
+      throw new Error(`HTTP error! status: ${n.status}`);
+    if (!n.body)
       throw new Error("Response body is empty");
-    let c = "";
-    const l = o.body.getReader(), p = new TextDecoder();
+    let o = "";
+    const h = n.body.getReader(), d = new TextDecoder();
     for (; ; ) {
-      const { done: u, value: S } = await l.read();
+      const { done: u, value: f } = await h.read();
       if (u)
         break;
-      const _ = p.decode(S, { stream: !0 });
-      c += _;
+      const L = d.decode(f, { stream: !0 });
+      o += L;
     }
     yield {
       type: "result",
       id: "",
       title: "",
-      description: c.replaceAll("data: ", "").trim().split(`
+      description: o.replaceAll("data: ", "").trim().split(`
 
 `).map((u) => JSON.parse(u)).map((u) => u.response).join(""),
       url: "",
@@ -232,22 +369,86 @@ class K {
     };
   }
   async *chat(i, e) {
-    const t = new AbortController(), s = e?.signal || t.signal, r = await this.request(
-      {
-        messages: [{ role: "user", content: i }],
-        stream: !1
-      },
-      "chat/completions",
-      s
-    );
-    if (!r.ok)
-      throw new Error(`HTTP error! status: ${r.status}`);
-    if (!r.body)
+    const t = new AbortController(), s = e?.signal || t.signal, r = e?.stream ?? !0, o = { messages: [...e?.history ?? [], { role: "user", content: i }], stream: r };
+    if (e?.queryRewrite) {
+      const d = typeof e.queryRewrite == "object" ? e.queryRewrite : {};
+      o.ai_search_options = {
+        query_rewrite: {
+          enabled: !0,
+          model: d.model ?? Z,
+          rewrite_prompt: d.rewritePrompt ?? ee
+        }
+      };
+    }
+    const h = await this.request(o, "chat/completions", s);
+    if (!h.ok)
+      throw new Error(`HTTP error! status: ${h.status}`);
+    if (!h.body)
       throw new Error("Response body is empty");
-    yield {
-      type: "text",
-      message: (await r.json()).choices.map((c) => c.message.content).join("")
+    if (!r) {
+      yield {
+        type: "text",
+        message: (await h.json()).choices.map((p) => p.message.content).join("")
+      };
+      return;
+    }
+    yield* this.parseChatStream(h.body);
+  }
+  /**
+   * Consume an SSE stream from the chat/completions endpoint and yield one
+   * ChatTextResponse per non-empty content delta. Discards `event: chunks`
+   * (RAG sources) and the `[DONE]` sentinel; tolerates malformed individual
+   * frames without aborting the whole stream.
+   */
+  async *parseChatStream(i) {
+    const e = i.getReader(), t = new TextDecoder();
+    let s = "";
+    const r = (n) => {
+      const o = te(n);
+      if (!o || o.event === "chunks")
+        return null;
+      if (o.data === "[DONE]")
+        return "done";
+      try {
+        const d = JSON.parse(o.data).choices?.[0]?.delta?.content;
+        if (typeof d == "string" && d.length > 0)
+          return { type: "text", message: d };
+      } catch (h) {
+        console.error("AISearchClient: failed to parse SSE chat chunk", h);
+      }
+      return null;
     };
+    try {
+      for (; ; ) {
+        const { done: n, value: o } = await e.read();
+        if (n)
+          break;
+        s += t.decode(o, { stream: !0 });
+        let h = s.indexOf(`
+
+`);
+        for (; h !== -1; ) {
+          const d = s.slice(0, h);
+          s = s.slice(h + 2);
+          const p = r(d);
+          if (p === "done")
+            return;
+          p && (yield p), h = s.indexOf(`
+
+`);
+        }
+      }
+      if (s += t.decode(), s.trim().length > 0) {
+        const n = r(s);
+        n && n !== "done" && (yield n);
+      }
+    } catch (n) {
+      if (n.name === "AbortError")
+        return;
+      throw n;
+    } finally {
+      e.releaseLock();
+    }
   }
   /**
    * Cancels an active request by ID
@@ -286,10 +487,141 @@ class K {
     return `req-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
   }
 }
-const G = `<svg width="32" height="10" viewBox="0 0 412 186" xmlns="http://www.w3.org/2000/svg" aria-label="Cloudflare" role="img">
+const ne = "0.0.39", oe = `<svg width="32" height="10" viewBox="0 0 412 186" xmlns="http://www.w3.org/2000/svg" aria-label="Cloudflare" role="img">
   <path fill="#f38020" d="m280.8395,183.31456c11,-26 -4,-38 -19,-38l-148,-2c-4,0 -4,-6 1,-7l150,-2c17,-1 37,-15 43,-33c0,0 10,-21 9,-24a97,97 0 0 0 -187,-11c-38,-25 -78,9 -69,46c-48,3 -65,46 -60,72c0,1 1,2 3,2l274,0c1,0 3,-1 3,-3z"/>
   <path fill="#faae40" d="m330.8395,81.31456c-4,0 -6,-1 -7,1l-5,21c-5,16 3,30 20,31l32,2c4,0 4,6 -1,7l-33,1c-36,4 -46,39 -46,39c0,2 0,3 2,3l113,0l3,-2a81,81 0 0 0 -78,-103"/>
-</svg>`, F = "https://workers.cloudflare.com/product/ai-search", k = `Powered by <a href="${F}" target="_blank" rel="noopener noreferrer">Cloudflare AI Search ${G}</a>`, H = `
+</svg>`, le = "https://workers.cloudflare.com/product/ai-search", E = `Powered by <a href="${le}" target="_blank" rel="noopener noreferrer">Cloudflare AI Search ${oe}</a>`, ce = 2e4, he = 20, de = "/stats";
+function z() {
+  return typeof document < "u" && typeof window < "u";
+}
+class Q {
+  constructor(i, e = {}) {
+    a(this, "baseUrl");
+    a(this, "endpoint");
+    a(this, "snippetVersion");
+    a(this, "flushIntervalMs");
+    a(this, "maxBufferSize");
+    a(this, "buffer", []);
+    a(this, "flushTimer", null);
+    a(this, "destroyed", !1);
+    a(this, "boundUnloadHandler");
+    a(this, "boundVisibilityHandler");
+    this.baseUrl = i.replace(/\/$/, ""), this.endpoint = e.endpoint ?? de, this.snippetVersion = e.snippetVersion ?? ne, this.flushIntervalMs = e.flushIntervalMs ?? ce, this.maxBufferSize = Math.max(1, e.maxBufferSize ?? he), this.boundUnloadHandler = () => this.flushBeacon(), this.boundVisibilityHandler = () => {
+      typeof document < "u" && document.visibilityState === "hidden" && this.flushBeacon();
+    }, z() && (window.addEventListener("pagehide", this.boundUnloadHandler), document.addEventListener("visibilitychange", this.boundVisibilityHandler));
+  }
+  /**
+   * Record a completed search (no click).
+   */
+  trackSearch(i, e) {
+    this.track({
+      inputQuery: i,
+      snippetVersion: this.snippetVersion,
+      totalResult: e
+    });
+  }
+  /**
+   * Record a click on a specific result.
+   */
+  trackClick(i, e, t, s) {
+    this.track({
+      inputQuery: i,
+      snippetVersion: this.snippetVersion,
+      totalResult: e,
+      clickedResultId: t,
+      clickPosition: s,
+      clickViewMore: !1
+    });
+  }
+  /**
+   * Record a click on the "See more" link.
+   */
+  trackViewMore(i, e) {
+    this.track({
+      inputQuery: i,
+      snippetVersion: this.snippetVersion,
+      totalResult: e,
+      clickViewMore: !0
+    });
+  }
+  /**
+   * Buffer a pre-built event. Higher-level `track*` helpers call this.
+   */
+  track(i) {
+    if (!this.destroyed) {
+      if (this.buffer.push(i), this.buffer.length >= this.maxBufferSize) {
+        this.flush();
+        return;
+      }
+      this.scheduleFlush();
+    }
+  }
+  /**
+   * Force an immediate flush using `fetch` with `keepalive: true`.
+   * Returns synchronously; network errors are swallowed.
+   */
+  flush() {
+    const i = this.drainBuffer();
+    if (i.length === 0)
+      return;
+    const e = JSON.stringify({ events: i });
+    fetch(this.buildUrl(), {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: e,
+      keepalive: !0
+    }).catch((t) => {
+      console.log(t);
+    });
+  }
+  /**
+   * Flush path optimized for page-unload. Prefers `navigator.sendBeacon`
+   * when available; falls back to `fetch({ keepalive: true })`.
+   */
+  flushBeacon() {
+    const i = this.drainBuffer();
+    if (i.length === 0)
+      return;
+    const e = JSON.stringify({ events: i }), t = this.buildUrl();
+    if (typeof navigator < "u" && typeof navigator.sendBeacon == "function")
+      try {
+        const s = new Blob([e], { type: "application/json" });
+        if (navigator.sendBeacon(t, s))
+          return;
+      } catch {
+      }
+    typeof fetch < "u" && fetch(t, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: e,
+      keepalive: !0
+    }).catch(() => {
+    });
+  }
+  /**
+   * Remove unload listeners, clear timers, and flush anything still buffered.
+   * Call from the host component's `disconnectedCallback`.
+   */
+  destroy() {
+    this.destroyed || (this.destroyed = !0, this.flushTimer !== null && (clearTimeout(this.flushTimer), this.flushTimer = null), z() && (window.removeEventListener("pagehide", this.boundUnloadHandler), document.removeEventListener("visibilitychange", this.boundVisibilityHandler)), this.flushBeacon());
+  }
+  scheduleFlush() {
+    this.flushTimer !== null || this.destroyed || (this.flushTimer = setTimeout(() => {
+      this.flushTimer = null, this.flush();
+    }, this.flushIntervalMs));
+  }
+  drainBuffer() {
+    if (this.flushTimer !== null && (clearTimeout(this.flushTimer), this.flushTimer = null), this.buffer.length === 0)
+      return [];
+    const i = this.buffer;
+    return this.buffer = [], i;
+  }
+  buildUrl() {
+    const i = this.endpoint.startsWith("/") ? this.endpoint : `/${this.endpoint}`;
+    return `${this.baseUrl}${i}`;
+  }
+}
+const G = `
 /* Chat container */
 .chat-container {
   display: flex;
@@ -332,6 +664,7 @@ const G = `<svg width="32" height="10" viewBox="0 0 412 186" xmlns="http://www.w
   gap: var(--search-snippet-spacing-sm);
   max-width: 85%;
   animation: slideIn var(--search-snippet-animation-duration) ease-out;
+  animation-fill-mode: both;
 }
 
 @keyframes slideIn {
@@ -402,6 +735,9 @@ const G = `<svg width="32" height="10" viewBox="0 0 412 186" xmlns="http://www.w
   border-radius: var(--search-snippet-border-radius);
   word-wrap: break-word;
   overflow-wrap: break-word;
+  /* Isolate layout cost of bubble height changes during streaming so
+     siblings don't reflow. */
+  contain: layout style;
 }
 
 .chat-message-user .chat-message-bubble {
@@ -606,7 +942,7 @@ const G = `<svg width="32" height="10" viewBox="0 0 412 186" xmlns="http://www.w
 .chat-message-bubble a:hover {
   text-decoration: none;
 }
-`, C = `
+`, M = `
 :host {
   /* Colors - Light Mode */
   --search-snippet-primary-color: #2563eb;
@@ -1041,55 +1377,55 @@ const G = `<svg width="32" height="10" viewBox="0 0 412 186" xmlns="http://www.w
   text-align: center;
 }
 `;
-function Y(n) {
-  let i = n;
-  i = J(i), i = i.replace(/```([\s\S]*?)```/g, (o, c) => `<pre><code>${c.trim()}</code></pre>`);
+function pe(l) {
+  let i = l;
+  i = ue(i), i = i.replace(/```([\s\S]*?)```/g, (n, o) => `<pre><code>${o.trim()}</code></pre>`);
   const e = i.split(`
 `), t = [];
   let s = !1, r = "";
-  for (let o = 0; o < e.length; o++) {
-    const c = e[o], l = c.match(/^(#{1,6})\s+(.+)$/);
-    if (l) {
-      const u = l[1].length, S = l[2];
-      t.push(`<h${u}>${f(S)}</h${u}>`);
+  for (let n = 0; n < e.length; n++) {
+    const o = e[n], h = o.match(/^(#{1,6})\s+(.+)$/);
+    if (h) {
+      const u = h[1].length, f = h[2];
+      t.push(`<h${u}>${x(f)}</h${u}>`);
       continue;
     }
-    if (c.match(/^---+$/)) {
+    if (o.match(/^---+$/)) {
       t.push("<hr />");
       continue;
     }
-    if (c.match(/^>\s+/)) {
-      const u = c.replace(/^>\s+/, "");
-      t.push(`<blockquote>${f(u)}</blockquote>`);
+    if (o.match(/^>\s+/)) {
+      const u = o.replace(/^>\s+/, "");
+      t.push(`<blockquote>${x(u)}</blockquote>`);
       continue;
     }
-    const p = c.match(/^[-*]\s+(.+)$/);
-    if (p) {
-      (!s || r !== "ul") && (s && t.push(`</${r}>`), t.push("<ul>"), s = !0, r = "ul"), t.push(`<li>${f(p[1])}</li>`);
+    const d = o.match(/^[-*]\s+(.+)$/);
+    if (d) {
+      (!s || r !== "ul") && (s && t.push(`</${r}>`), t.push("<ul>"), s = !0, r = "ul"), t.push(`<li>${x(d[1])}</li>`);
       continue;
     }
-    const b = c.match(/^\d+\.\s+(.+)$/);
-    if (b) {
-      (!s || r !== "ol") && (s && t.push(`</${r}>`), t.push("<ol>"), s = !0, r = "ol"), t.push(`<li>${f(b[1])}</li>`);
+    const p = o.match(/^\d+\.\s+(.+)$/);
+    if (p) {
+      (!s || r !== "ol") && (s && t.push(`</${r}>`), t.push("<ol>"), s = !0, r = "ol"), t.push(`<li>${x(p[1])}</li>`);
       continue;
     }
-    if (s && (t.push(`</${r}>`), s = !1, r = ""), c.trim() === "") {
+    if (s && (t.push(`</${r}>`), s = !1, r = ""), o.trim() === "") {
       t.push("<br />");
       continue;
     }
-    t.push(`<p>${f(c)}</p>`);
+    t.push(`<p>${x(o)}</p>`);
   }
   return s && t.push(`</${r}>`), t.join(`
 `);
 }
-function f(n) {
-  let i = n;
+function x(l) {
+  let i = l;
   return i = i.replace(/`([^`]+)`/g, "<code>$1</code>"), i = i.replace(/\*\*\*(.+?)\*\*\*/g, "<strong><em>$1</em></strong>"), i = i.replace(/___(.+?)___/g, "<strong><em>$1</em></strong>"), i = i.replace(/\*\*(.+?)\*\*/g, "<strong>$1</strong>"), i = i.replace(/__(.+?)__/g, "<strong>$1</strong>"), i = i.replace(/\*(.+?)\*/g, "<em>$1</em>"), i = i.replace(/_(.+?)_/g, "<em>$1</em>"), i = i.replace(
     /\[([^\]]+)\]\(([^)]+)\)/g,
     '<a href="$2" target="_blank" rel="noopener noreferrer">$1</a>'
   ), i;
 }
-function J(n) {
+function ue(l) {
   const i = {
     "&": "&amp;",
     "<": "&lt;",
@@ -1097,13 +1433,15 @@ function J(n) {
     '"': "&quot;",
     "'": "&#39;"
   };
-  return n.replace(/[&<>"']/g, (e) => i[e] || e);
+  return l.replace(/[&<>"']/g, (e) => i[e] || e);
 }
-class N {
+const ge = 64;
+class Y {
   constructor(i, e, t) {
     a(this, "container");
     a(this, "client");
     a(this, "props");
+    a(this, "translations");
     a(this, "inputElement", null);
     a(this, "messagesContainer", null);
     a(this, "sendButton", null);
@@ -1112,46 +1450,54 @@ class N {
     a(this, "currentStreamingMessageId", null);
     a(this, "loadingMessageInterval", null);
     a(this, "loadingMessageIndex", 0);
+    a(this, "pendingScrollFrame", null);
     // Event handler references for cleanup
     a(this, "handleInputResize", null);
     a(this, "handleInputKeydown", null);
     a(this, "handleSendClick", null);
-    this.container = i, this.client = e, this.props = t, this.render(), this.attachEventListeners();
+    this.container = i, this.client = e, this.props = t, this.translations = g(t.translations), this.render(), this.attachEventListeners();
   }
   /**
    * Render the chat interface
    */
   render() {
+    const i = this.translations;
     this.container.innerHTML = `
       <div class="chat-container">
         <div class="chat-messages">
-          <div class="chat-empty">
-            <svg class="chat-empty-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-              <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path>
-            </svg>
-            <div class="chat-empty-title">Start a Conversation</div>
-            <div class="chat-empty-description">
-              Send a message to begin chatting
-            </div>
-          </div>
+          ${this.renderEmptyStateHTML()}
         </div>
         <div class="chat-input-area">
           <div class="chat-input-wrapper">
             <textarea
               class="chat-input"
-              placeholder="${h(this.props.placeholder || "Type a message...")}"
-              aria-label="Chat message input"
+              placeholder="${c(this.props.placeholder || i.chatPlaceholder)}"
+              aria-label="${c(i.chatInputAriaLabel)}"
               style="height: 40px;"
               rows="1"
             ></textarea>
-            <button class="button chat-send-button" aria-label="Send message">
-              <span>Send</span>
+            <button class="button chat-send-button" aria-label="${c(i.sendButtonAriaLabel)}">
+              <span>${c(i.sendButtonLabel)}</span>
             </button>
           </div>
         </div>
       </div>
     `, this.messagesContainer = this.container.querySelector(".chat-messages"), this.inputElement = this.container.querySelector(".chat-input"), this.sendButton = this.container.querySelector(".chat-send-button");
   }
+  renderEmptyStateHTML() {
+    const i = this.translations;
+    return `
+      <div class="chat-empty">
+        <svg class="chat-empty-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+          <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path>
+        </svg>
+        <div class="chat-empty-title">${c(i.chatEmptyTitle)}</div>
+        <div class="chat-empty-description">
+          ${c(i.chatEmptyDescription)}
+        </div>
+      </div>
+    `;
+  }
   /**
    * Attach event listeners
    */
@@ -1177,37 +1523,43 @@ class N {
    * Send a message
    */
   async sendMessage(i) {
-    const e = {
-      id: M("msg"),
+    const e = this.messages.map((o) => ({
+      role: o.role,
+      content: o.content
+    })), t = this.resolveQueryRewriteOption(e), s = {
+      id: R("msg"),
       role: "user",
       content: i,
       timestamp: Date.now()
     };
-    this.addMessage(e), this.renderMessages(!0), this.setStreamingState(!0);
-    const t = M("msg"), s = {
-      id: t,
+    this.addMessage(s), this.renderMessages(!0), this.setStreamingState(!0);
+    const r = R("msg"), n = {
+      id: r,
       role: "assistant",
       content: "",
       timestamp: Date.now()
     };
-    this.addMessage(s), this.currentStreamingMessageId = t, this.renderMessages(!0);
+    this.addMessage(n), this.currentStreamingMessageId = r, this.renderMessages(!0);
     try {
-      const r = this.client.chat(i);
-      let o = "";
-      for await (const l of r)
-        if (l.type === "text" && l.message)
-          o += l.message, this.updateStreamingMessage(t, o);
-        else if (l.type === "error") {
-          this.showErrorInMessage(t, l.message || "Unknown error");
+      const o = this.client.chat(i, { history: e, queryRewrite: t });
+      let h = "";
+      for await (const p of o)
+        if (p.type === "text" && p.message)
+          h += p.message, this.updateStreamingMessage(r, h);
+        else if (p.type === "error") {
+          this.showErrorInMessage(
+            r,
+            p.message || this.translations.unknownError
+          );
           break;
         }
-      const c = this.messages.findIndex((l) => l.id === t);
-      c !== -1 && (this.messages[c].content = o), this.container.dispatchEvent(v("message", { message: s }));
-    } catch (r) {
-      this.showErrorInMessage(t, r.message), this.container.dispatchEvent(
-        v("error", {
+      const d = this.messages.findIndex((p) => p.id === r);
+      d !== -1 && (this.messages[d].content = h), this.container.dispatchEvent(b("message", { message: n }));
+    } catch (o) {
+      this.showErrorInMessage(r, o.message), this.container.dispatchEvent(
+        b("error", {
           error: {
-            message: r.message,
+            message: o.message,
             code: "CHAT_ERROR"
           }
         })
@@ -1216,6 +1568,16 @@ class N {
       this.setStreamingState(!1), this.renderMessages(), this.currentStreamingMessageId = null;
     }
   }
+  /**
+   * Resolve `chatQueryRewrite` from props into the value passed to
+   * `AISearchClient.chat`. Query rewriting is gated on having at least one
+   * prior turn — there is nothing to rewrite against on the first message.
+   * `chatQueryRewrite.enabled === false` opts out unconditionally.
+   */
+  resolveQueryRewriteOption(i) {
+    const e = this.props.chatQueryRewrite;
+    return e?.enabled === !1 || i.length === 0 ? !1 : e && (e.model !== void 0 || e.rewritePrompt !== void 0) ? { model: e.model, rewritePrompt: e.rewritePrompt } : !0;
+  }
   /**
    * Add a message to the chat
    */
@@ -1223,81 +1585,138 @@ class N {
     this.messages.push(i), this.renderMessages();
   }
   /**
-   * Update streaming message content
+   * Update streaming message content.
+   *
+   * During streaming this performs a surgical DOM update on the streaming
+   * bubble only — no full message-list re-render. Content is written as plain
+   * text (escaped via textContent) to avoid markdown structural flips that
+   * cause height jumps. Markdown is applied once the stream completes via the
+   * final `renderMessages()` call in `sendMessage`'s `finally` block.
    */
   updateStreamingMessage(i, e) {
     const t = this.messages.findIndex((s) => s.id === i);
-    t !== -1 && (this.messages[t].content = e, this.renderMessages(!0));
+    t !== -1 && (this.messages[t].content = e, this.updateStreamingMessageDOM(i, e) || this.renderMessages(!0));
+  }
+  /**
+   * Surgically update the streaming bubble's text node. Returns true on
+   * success, false if the target nodes weren't found (caller should fall back
+   * to a full re-render).
+   */
+  updateStreamingMessageDOM(i, e) {
+    if (!this.messagesContainer)
+      return !1;
+    const t = this.messagesContainer.querySelector(
+      `[data-message-id="${CSS.escape(i)}"]`
+    );
+    if (!t)
+      return !1;
+    const s = t.querySelector(".chat-message-bubble");
+    if (!s)
+      return !1;
+    const r = this.isNearBottom();
+    let n = s.querySelector(".chat-message-text");
+    if (!n) {
+      const o = document.createElement("div");
+      o.className = "chat-message-text";
+      const h = s.querySelector(".chat-streaming");
+      h ? s.insertBefore(o, h) : s.appendChild(o), n = o;
+    }
+    return n.textContent = e, r && this.scheduleScrollToBottom(), !0;
   }
   /**
    * Show error in message
    */
   showErrorInMessage(i, e) {
     const t = this.messages.findIndex((s) => s.id === i);
-    t !== -1 && (this.messages[t].content = `Error: ${e}`, this.renderMessages());
+    t !== -1 && (this.messages[t].content = `${this.translations.errorPrefix} ${e}`, this.renderMessages());
   }
   /**
-   * Render all messages
+   * Render all messages. Forces a scroll to bottom regardless of current
+   * scroll position; called only on full-list mutations (add, clear, set,
+   * end-of-stream final render, prop changes), not on per-token updates.
    */
   renderMessages(i = !1) {
     if (!this.messagesContainer) return;
     if (this.messages.length === 0) {
-      this.messagesContainer.innerHTML = `
-        <div class="chat-empty">
-          <svg class="chat-empty-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-            <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path>
-          </svg>
-          <div class="chat-empty-title">Start a Conversation</div>
-          <div class="chat-empty-description">
-            Send a message to begin chatting
-          </div>
-        </div>
-      `;
+      this.messagesContainer.innerHTML = this.renderEmptyStateHTML();
       return;
     }
     const e = this.messages.map(
       (t) => this.renderMessage(t, i && t.id === this.currentStreamingMessageId)
     ).join("");
-    this.messagesContainer.innerHTML = e, this.scrollToBottom();
+    this.messagesContainer.innerHTML = e, this.scheduleScrollToBottom();
   }
   /**
    * Render a single message
    */
   renderMessage(i, e = !1) {
-    const t = `chat-message-${i.role}`, s = i.role === "user" ? "U" : "AI";
+    const t = this.translations, s = `chat-message-${i.role}`, r = i.role === "user" ? t.userAvatar : t.assistantAvatar, n = t.loadingMessages[this.loadingMessageIndex] ?? "", o = i.content ? e ? c(i.content) : pe(i.content) : "";
     return `
-      <div class="chat-message ${t}">
-        <div class="chat-message-avatar">${s}</div>
+      <div class="chat-message ${s}" data-message-id="${c(i.id)}">
+        <div class="chat-message-avatar">${c(r)}</div>
         <div class="chat-message-content">
           <div class="chat-message-bubble">
-            ${i.content ? `<div class="chat-message-text">${Y(i.content)}</div>` : ""}
-            ${e ? `<div class="chat-streaming"><span class="chat-streaming-dot"></span><span class="chat-streaming-dot"></span><span class="chat-streaming-dot"></span><span class="loading-text">${g[this.loadingMessageIndex]}</span></div>` : ""}
+            ${o ? `<div class="chat-message-text">${o}</div>` : ""}
+            ${e ? `<div class="chat-streaming"><span class="chat-streaming-dot"></span><span class="chat-streaming-dot"></span><span class="chat-streaming-dot"></span><span class="loading-text">${c(n)}</span></div>` : ""}
           </div>
           <div class="chat-message-metadata">
-            <span class="chat-message-time">${O(i.timestamp)}</span>
+            <span class="chat-message-time">${c(X(i.timestamp, this.translations))}</span>
           </div>
         </div>
       </div>
     `;
   }
   /**
-   * Scroll to bottom of messages
+   * True when the user is within `BOTTOM_FOLLOW_THRESHOLD_PX` of the bottom
+   * of the messages list. Used to decide whether to auto-follow the stream
+   * or leave the user where they scrolled.
    */
-  scrollToBottom() {
-    this.messagesContainer && requestAnimationFrame(() => {
-      this.messagesContainer && (this.messagesContainer.scrollTop = this.messagesContainer.scrollHeight);
-    });
+  isNearBottom() {
+    const i = this.messagesContainer;
+    return i ? i.scrollHeight - i.scrollTop - i.clientHeight < ge : !0;
+  }
+  /**
+   * Schedule a single scroll-to-bottom on the next animation frame. Multiple
+   * calls within the same frame are coalesced into one DOM write. The "should
+   * I scroll?" decision is gated by callers — `updateStreamingMessageDOM`
+   * only calls this when the user is near the bottom; full re-renders always
+   * call it.
+   */
+  scheduleScrollToBottom() {
+    this.messagesContainer && this.pendingScrollFrame === null && (this.pendingScrollFrame = requestAnimationFrame(() => {
+      this.pendingScrollFrame = null;
+      const i = this.messagesContainer;
+      i && (i.scrollTop = i.scrollHeight);
+    }));
   }
   /**
    * Set streaming state
    */
   setStreamingState(i) {
-    this.isStreaming = i, this.inputElement && (this.inputElement.disabled = i), this.sendButton && (this.sendButton.disabled = i, this.sendButton.innerHTML = i ? '<div class="loading"></div>' : "<span>Send</span>"), i ? this.startLoadingMessages() : this.clearLoadingMessages();
+    this.isStreaming = i, this.inputElement && (this.inputElement.disabled = i), this.sendButton && (this.sendButton.disabled = i, this.sendButton.innerHTML = i ? '<div class="loading"></div>' : `<span>${c(this.translations.sendButtonLabel)}</span>`), i ? this.startLoadingMessages() : this.clearLoadingMessages();
   }
   startLoadingMessages() {
-    this.loadingMessageIndex = Math.floor(Math.random() * g.length), this.loadingMessageInterval = setInterval(() => {
-      this.loadingMessageIndex = (this.loadingMessageIndex + 1) % g.length, this.isStreaming && this.renderMessages(!0);
-    }, 2500);
+    this.clearLoadingMessages();
+    const i = this.translations.loadingMessages;
+    this.loadingMessageIndex = Math.floor(Math.random() * i.length), this.loadingMessageInterval = setInterval(() => {
+      const e = this.translations.loadingMessages;
+      if (this.loadingMessageIndex = (this.loadingMessageIndex + 1) % e.length, !this.isStreaming) return;
+      this.updateLoadingTextDOM(e[this.loadingMessageIndex] ?? "") || this.renderMessages(!0);
+    }, A);
+  }
+  /**
+   * Update the rotating loading-text label inside the currently-streaming
+   * bubble only. Returns true on success, false if the target wasn't found.
+   */
+  updateLoadingTextDOM(i) {
+    if (!this.messagesContainer || !this.currentStreamingMessageId)
+      return !1;
+    const e = this.messagesContainer.querySelector(
+      `[data-message-id="${CSS.escape(this.currentStreamingMessageId)}"]`
+    );
+    if (!e) return !1;
+    const t = e.querySelector(".chat-streaming .loading-text");
+    return t ? (t.textContent = i, !0) : !1;
   }
   clearLoadingMessages() {
     this.loadingMessageInterval && (clearInterval(this.loadingMessageInterval), this.loadingMessageInterval = null);
@@ -1320,15 +1739,28 @@ class N {
   setMessages(i) {
     this.messages = [...i], this.renderMessages();
   }
+  /**
+   * Update the props (e.g. placeholder / translations) and re-render.
+   *
+   * Safe to call at any time: existing messages and streaming state are
+   * preserved; listeners on the old DOM are removed and re-attached to the
+   * newly rendered elements.
+   */
+  setProps(i) {
+    this.props = i, this.translations = g(i.translations), this.detachEventListeners(), this.render(), this.attachEventListeners(), this.renderMessages(this.isStreaming), this.isStreaming && this.setStreamingState(!0);
+  }
+  detachEventListeners() {
+    this.inputElement && (this.handleInputResize && this.inputElement.removeEventListener("input", this.handleInputResize), this.handleInputKeydown && this.inputElement.removeEventListener("keydown", this.handleInputKeydown)), this.sendButton && this.handleSendClick && this.sendButton.removeEventListener("click", this.handleSendClick), this.handleInputResize = null, this.handleInputKeydown = null, this.handleSendClick = null;
+  }
   /**
    * Destroy and cleanup
    */
   destroy() {
-    this.clearLoadingMessages(), this.isStreaming && this.client.cancelAllRequests(), this.inputElement && (this.handleInputResize && this.inputElement.removeEventListener("input", this.handleInputResize), this.handleInputKeydown && this.inputElement.removeEventListener("keydown", this.handleInputKeydown)), this.sendButton && this.handleSendClick && this.sendButton.removeEventListener("click", this.handleSendClick), this.handleInputResize = null, this.handleInputKeydown = null, this.handleSendClick = null;
+    this.clearLoadingMessages(), this.pendingScrollFrame !== null && (cancelAnimationFrame(this.pendingScrollFrame), this.pendingScrollFrame = null), this.isStreaming && this.client.cancelAllRequests(), this.inputElement && (this.handleInputResize && this.inputElement.removeEventListener("input", this.handleInputResize), this.handleInputKeydown && this.inputElement.removeEventListener("keydown", this.handleInputKeydown)), this.sendButton && this.handleSendClick && this.sendButton.removeEventListener("click", this.handleSendClick), this.handleInputResize = null, this.handleInputKeydown = null, this.handleSendClick = null;
   }
 }
-const L = "chat-bubble-snippet";
-class W extends HTMLElement {
+const $ = "chat-bubble-snippet";
+class me extends HTMLElement {
   constructor() {
     super();
     a(this, "shadow");
@@ -1337,6 +1769,9 @@ class W extends HTMLElement {
     a(this, "container", null);
     a(this, "isExpanded", !1);
     a(this, "isMinimized", !1);
+    a(this, "translationsOverride", null);
+    a(this, "resolvedTranslations", g(null));
+    a(this, "chatQueryRewriteOverride", null);
     // Event handler references for cleanup
     a(this, "handleBubbleClick", null);
     a(this, "handleCloseClick", null);
@@ -1345,25 +1780,85 @@ class W extends HTMLElement {
     this.shadow = this.attachShadow({ mode: "open" });
   }
   static get observedAttributes() {
-    return ["api-url", "placeholder", "theme", "hide-branding"];
+    return [
+      "api-url",
+      "placeholder",
+      "theme",
+      "hide-branding",
+      "translations",
+      "chat-query-rewrite"
+    ];
   }
   connectedCallback() {
-    this.render(), this.initializeClient(), this.dispatchEvent(v("ready", void 0));
+    this.syncTranslationsFromAttribute(), this.render(), this.initializeClient(), this.dispatchEvent(b("ready", void 0));
   }
   disconnectedCallback() {
     this.cleanup();
   }
   attributeChangedCallback(e, t, s) {
-    t !== s && (e === "api-url" ? this.initializeClient() : e === "theme" && this.updateTheme(s));
+    t !== s && (e === "api-url" ? this.initializeClient() : e === "theme" ? this.updateTheme(s) : e === "translations" && (this.syncTranslationsFromAttribute(), this.isConnected && this.rerenderAfterTranslationsChange()));
+  }
+  /**
+   * Get the current translations object.
+   */
+  get translations() {
+    return this.translationsOverride;
+  }
+  /**
+   * Override AI Search query rewriting on subsequent chat turns. Setting
+   * `null` falls back to parsing the `chat-query-rewrite` attribute.
+   */
+  get chatQueryRewrite() {
+    return this.chatQueryRewriteOverride;
+  }
+  set chatQueryRewrite(e) {
+    this.chatQueryRewriteOverride = e ?? null, this.chatView && this.chatView.setProps(this.getProps());
+  }
+  /**
+   * Override any user-facing string. Omitted keys fall back to English defaults.
+   */
+  set translations(e) {
+    this.translationsOverride = e ?? null, this.resolvedTranslations = g(this.translationsOverride), this.isConnected && this.rerenderAfterTranslationsChange();
+  }
+  syncTranslationsFromAttribute() {
+    if (this.translationsOverride) {
+      this.resolvedTranslations = g(this.translationsOverride);
+      return;
+    }
+    const e = k(
+      this.getAttribute("translations"),
+      "ChatBubbleSnippet"
+    );
+    this.resolvedTranslations = g(e);
+  }
+  rerenderAfterTranslationsChange() {
+    const e = this.isExpanded, t = this.isMinimized;
+    this.removeEventListeners();
+    const s = this.chatView ? this.shadow.querySelector(".chat-content") : null;
+    s?.parentNode && s.parentNode.removeChild(s), this.render(), e && (this.shadow.querySelector(".bubble-button")?.classList.add("hidden"), this.shadow.querySelector(".chat-window")?.classList.add("expanded"), t && this.shadow.querySelector(".chat-window")?.classList.add("minimized"));
+    const r = this.shadow.querySelector(".chat-window");
+    if (this.chatView && s && r) {
+      const n = r.querySelector(".chat-content");
+      n ? r.replaceChild(s, n) : r.appendChild(s), this.chatView.setProps(this.getProps());
+    } else e && this.initializeChatView();
   }
   getProps() {
+    const e = this.resolvedTranslations;
     return {
-      apiUrl: d(this.getAttribute("api-url"), ""),
-      placeholder: d(this.getAttribute("placeholder"), "Type a message..."),
-      theme: d(this.getAttribute("theme"), "auto"),
-      hideBranding: m(this.getAttribute("hide-branding"), !1)
+      apiUrl: m(this.getAttribute("api-url"), ""),
+      placeholder: m(this.getAttribute("placeholder"), e.chatPlaceholder),
+      theme: m(this.getAttribute("theme"), "auto"),
+      hideBranding: v(this.getAttribute("hide-branding"), !1),
+      translations: this.translationsOverride ?? void 0,
+      chatQueryRewrite: this.resolveChatQueryRewrite()
     };
   }
+  resolveChatQueryRewrite() {
+    return this.chatQueryRewriteOverride !== null ? this.chatQueryRewriteOverride : F(
+      this.getAttribute("chat-query-rewrite"),
+      "ChatBubbleSnippet"
+    );
+  }
   initializeClient() {
     const e = this.getProps();
     if (!e.apiUrl) {
@@ -1371,15 +1866,15 @@ class W extends HTMLElement {
       return;
     }
     try {
-      this.client = x(e.apiUrl);
+      this.client = S(e.apiUrl);
     } catch (t) {
       console.error("ChatBubbleSnippet:", t);
     }
   }
   render() {
     const e = document.createElement("style");
-    e.textContent = `${C}
-${H}
+    e.textContent = `${M}
+${G}
 ${this.getBubbleStyles()}`, this.container = document.createElement("div"), this.container.className = "chat-bubble-widget", this.container.innerHTML = this.getBaseHTML(), this.shadow.innerHTML = "", this.shadow.appendChild(e), this.shadow.appendChild(this.container), this.attachEventListeners();
   }
   getBubbleStyles() {
@@ -1524,8 +2019,9 @@ ${this.getBubbleStyles()}`, this.container = document.createElement("div"), this
     `;
   }
   getBaseHTML() {
+    const e = this.getProps(), t = this.resolvedTranslations, s = e.hideBranding ? "" : `<div class="powered-by">${E}</div>`;
     return `
-      <button class="bubble-button" aria-label="Open chat">
+      <button class="bubble-button" aria-label="${c(t.openChatAriaLabel)}">
         <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
           <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path>
         </svg>
@@ -1536,21 +2032,21 @@ ${this.getBubbleStyles()}`, this.container = document.createElement("div"), this
             <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
               <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path>
             </svg>
-            <span>Chat</span>
+            <span>${c(t.chatTitle)}</span>
           </div>
           <div class="chat-header-actions">
-            <button class="icon-button clear-button" aria-label="Clear history">
+            <button class="icon-button clear-button" aria-label="${c(t.clearHistoryAriaLabel)}">
               <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                 <polyline points="3 6 5 6 21 6"></polyline>
                 <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
               </svg>
             </button>
-            <button class="icon-button minimize-button" aria-label="Minimize">
+            <button class="icon-button minimize-button" aria-label="${c(t.minimizeAriaLabel)}">
               <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                 <line x1="5" y1="12" x2="19" y2="12"></line>
               </svg>
             </button>
-            <button class="icon-button close-button" aria-label="Close">
+            <button class="icon-button close-button" aria-label="${c(t.closeAriaLabel)}">
               <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                 <line x1="18" y1="6" x2="6" y2="18"></line>
                 <line x1="6" y1="6" x2="18" y2="18"></line>
@@ -1559,7 +2055,7 @@ ${this.getBubbleStyles()}`, this.container = document.createElement("div"), this
           </div>
         </div>
         <div class="chat-content"></div>
-        ${this.getProps().hideBranding ? "" : `<div class="powered-by">${k}</div>`}
+        ${s}
       </div>
     `;
   }
@@ -1591,15 +2087,16 @@ ${this.getBubbleStyles()}`, this.container = document.createElement("div"), this
     const e = this.shadow.querySelector(".chat-content");
     if (!e) return;
     if (!this.client) {
+      const s = this.resolvedTranslations;
       e.innerHTML = `
         <div style="padding: 16px; color: var(--search-snippet-error-color, #ef4444); font-family: var(--search-snippet-font-family, sans-serif); font-size: var(--search-snippet-font-size-base, 14px);">
-          <strong>Error:</strong> The <code>api-url</code> attribute is required. Please provide a valid API URL.
+          <strong>${c(s.errorPrefix)}</strong> ${c(s.missingApiUrlError)}
         </div>
       `;
       return;
     }
     const t = this.getProps();
-    this.chatView = new N(e, this.client, t);
+    this.chatView = new Y(e, this.client, t);
   }
   updateTheme(e) {
     (e === "light" || e === "dark" ? e : null) === null && this.hasAttribute("theme") && this.getAttribute("theme") !== "auto" && this.removeAttribute("theme");
@@ -1618,9 +2115,9 @@ ${this.getBubbleStyles()}`, this.container = document.createElement("div"), this
     return this.chatView?.getMessages() || [];
   }
 }
-customElements.get(L) || customElements.define(L, W);
-const I = "chat-page-snippet", z = "chat-page-sessions";
-class X extends HTMLElement {
+customElements.get($) || customElements.define($, me);
+const q = "chat-page-snippet", B = "chat-page-sessions";
+class ve extends HTMLElement {
   constructor() {
     super();
     a(this, "shadow");
@@ -1630,6 +2127,9 @@ class X extends HTMLElement {
     a(this, "sessions", []);
     a(this, "currentSessionId", null);
     a(this, "sidebarCollapsed", !1);
+    a(this, "translationsOverride", null);
+    a(this, "resolvedTranslations", g(null));
+    a(this, "chatQueryRewriteOverride", null);
     // Event handler references for cleanup
     a(this, "handleClearClick", null);
     a(this, "handleNewChatClick", null);
@@ -1639,25 +2139,96 @@ class X extends HTMLElement {
     this.shadow = this.attachShadow({ mode: "open" }), this.loadSessions();
   }
   static get observedAttributes() {
-    return ["api-url", "placeholder", "theme", "hide-branding"];
+    return [
+      "api-url",
+      "placeholder",
+      "theme",
+      "hide-branding",
+      "translations",
+      "chat-query-rewrite"
+    ];
   }
   connectedCallback() {
-    this.render(), this.initializeClient(), this.setupView(), this.dispatchEvent(v("ready", void 0));
+    this.syncTranslationsFromAttribute(), this.render(), this.initializeClient(), this.setupView(), this.dispatchEvent(b("ready", void 0));
   }
   disconnectedCallback() {
     this.saveCurrentSession(), this.cleanup();
   }
   attributeChangedCallback(e, t, s) {
-    t !== s && (e === "api-url" ? (this.initializeClient(), this.setupView()) : e === "theme" && this.updateTheme(s));
+    t !== s && (e === "api-url" ? (this.initializeClient(), this.setupView()) : e === "theme" ? this.updateTheme(s) : e === "translations" && (this.syncTranslationsFromAttribute(), this.isConnected && this.rerenderAfterTranslationsChange()));
+  }
+  /**
+   * Get the current translations object.
+   */
+  get translations() {
+    return this.translationsOverride;
+  }
+  /**
+   * Override AI Search query rewriting on subsequent chat turns. Setting
+   * `null` falls back to parsing the `chat-query-rewrite` attribute.
+   */
+  get chatQueryRewrite() {
+    return this.chatQueryRewriteOverride;
+  }
+  set chatQueryRewrite(e) {
+    this.chatQueryRewriteOverride = e ?? null, this.chatView && this.chatView.setProps(this.getProps());
+  }
+  /**
+   * Override any user-facing string. Omitted keys fall back to English defaults.
+   */
+  set translations(e) {
+    this.translationsOverride = e ?? null, this.resolvedTranslations = g(this.translationsOverride), this.refreshDefaultSessionTitles(), this.isConnected && this.rerenderAfterTranslationsChange();
+  }
+  syncTranslationsFromAttribute() {
+    if (this.translationsOverride) {
+      this.resolvedTranslations = g(this.translationsOverride), this.refreshDefaultSessionTitles();
+      return;
+    }
+    const e = k(this.getAttribute("translations"), "ChatPageSnippet");
+    this.resolvedTranslations = g(e), this.refreshDefaultSessionTitles();
+  }
+  /**
+   * Replace the stored title of any still-default-titled session with the
+   * current `newChatButton` translation, so the sidebar reflects the active
+   * language after a translations change.
+   */
+  refreshDefaultSessionTitles() {
+    if (this.sessions.length === 0) return;
+    const e = this.resolvedTranslations.newChatButton;
+    let t = !1;
+    for (const s of this.sessions)
+      s.titleIsDefault && s.title !== e && (s.title = e, t = !0);
+    t && this.saveSessions();
+  }
+  rerenderAfterTranslationsChange() {
+    this.removeEventListeners();
+    const e = this.chatView ? this.shadow.querySelector(".container") : null;
+    e?.parentNode && e.parentNode.removeChild(e), this.render(), this.attachEventListeners(), this.renderChatList();
+    const t = this.shadow.querySelector(".chat-page-content");
+    if (this.chatView && e && t) {
+      const s = t.querySelector(".container");
+      s ? t.replaceChild(e, s) : t.appendChild(e), this.chatView.setProps(this.getProps()), this.handleMessageEvent = () => {
+        this.saveCurrentSession(), this.updateSessionTitle(), this.renderChatList();
+      }, e.addEventListener("message", this.handleMessageEvent);
+    }
   }
   getProps() {
+    const e = this.resolvedTranslations;
     return {
-      apiUrl: d(this.getAttribute("api-url"), ""),
-      placeholder: d(this.getAttribute("placeholder"), "Type a message..."),
-      theme: d(this.getAttribute("theme"), "auto"),
-      hideBranding: m(this.getAttribute("hide-branding"), !1)
+      apiUrl: m(this.getAttribute("api-url"), ""),
+      placeholder: m(this.getAttribute("placeholder"), e.chatPlaceholder),
+      theme: m(this.getAttribute("theme"), "auto"),
+      hideBranding: v(this.getAttribute("hide-branding"), !1),
+      translations: this.translationsOverride ?? void 0,
+      chatQueryRewrite: this.resolveChatQueryRewrite()
     };
   }
+  resolveChatQueryRewrite() {
+    return this.chatQueryRewriteOverride !== null ? this.chatQueryRewriteOverride : F(
+      this.getAttribute("chat-query-rewrite"),
+      "ChatPageSnippet"
+    );
+  }
   initializeClient() {
     const e = this.getProps();
     if (!e.apiUrl) {
@@ -1665,15 +2236,15 @@ class X extends HTMLElement {
       return;
     }
     try {
-      this.client = x(e.apiUrl);
+      this.client = S(e.apiUrl);
     } catch (t) {
       console.error("ChatPageSnippet:", t);
     }
   }
   render() {
     const e = document.createElement("style");
-    e.textContent = `${C}
-${H}
+    e.textContent = `${M}
+${G}
 ${this.getPageStyles()}`, this.container = document.createElement("div"), this.container.className = "chat-page-container", this.container.innerHTML = this.getBaseHTML(), this.shadow.innerHTML = "", this.shadow.appendChild(e), this.shadow.appendChild(this.container), this.attachEventListeners();
   }
   getPageStyles() {
@@ -1953,24 +2524,25 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
     `;
   }
   getBaseHTML() {
+    const e = this.getProps(), t = this.resolvedTranslations, s = e.hideBranding ? "" : `<div class="powered-by">${E}</div>`;
     return `
       <div class="chat-sidebar">
         <div class="sidebar-header">
-          <span class="sidebar-title">History</span>
+          <span class="sidebar-title">${c(t.historyTitle)}</span>
         </div>
         <button class="new-chat-button">
           <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
             <path d="M12 5v14M5 12h14"></path>
           </svg>
-          New Chat
+          ${c(t.newChatButton)}
         </button>
         <div class="chat-list"></div>
-        ${this.getProps().hideBranding ? "" : `<div class="powered-by">${k}</div>`}
+        ${s}
       </div>
       <div class="chat-main">
         <div class="chat-page-header">
           <div class="chat-page-header-left">
-            <button class="toggle-sidebar-button" title="Toggle sidebar">
+            <button class="toggle-sidebar-button" title="${c(t.toggleSidebarTitle)}">
               <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                 <path d="M3 12h18M3 6h18M3 18h18"></path>
               </svg>
@@ -1979,7 +2551,7 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
               <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                 <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path>
               </svg>
-              <span>Chat</span>
+              <span>${c(t.chatTitle)}</span>
             </div>
           </div>
           <div class="chat-page-header-actions">
@@ -1987,7 +2559,7 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
               <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                 <path d="M3 6h18M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
               </svg>
-              Clear Chat
+              ${c(t.clearChatButton)}
             </button>
           </div>
         </div>
@@ -1999,25 +2571,28 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
   }
   attachEventListeners() {
     const e = this.shadow.querySelector(".clear-button"), t = this.shadow.querySelector(".new-chat-button"), s = this.shadow.querySelector(".toggle-sidebar-button"), r = this.shadow.querySelector(".chat-list");
-    this.handleClearClick = () => this.clearCurrentChat(), this.handleNewChatClick = () => this.createNewChat(), this.handleToggleSidebarClick = () => this.toggleSidebar(), this.handleChatListClick = (o) => this.onChatListClick(o), e?.addEventListener("click", this.handleClearClick), t?.addEventListener("click", this.handleNewChatClick), s?.addEventListener("click", this.handleToggleSidebarClick), r?.addEventListener("click", this.handleChatListClick);
+    this.handleClearClick = () => this.clearCurrentChat(), this.handleNewChatClick = () => this.createNewChat(), this.handleToggleSidebarClick = () => this.toggleSidebar(), this.handleChatListClick = (n) => this.onChatListClick(n), e?.addEventListener("click", this.handleClearClick), t?.addEventListener("click", this.handleNewChatClick), s?.addEventListener("click", this.handleToggleSidebarClick), r?.addEventListener("click", this.handleChatListClick);
   }
   removeEventListeners() {
-    const e = this.shadow.querySelector(".clear-button"), t = this.shadow.querySelector(".new-chat-button"), s = this.shadow.querySelector(".toggle-sidebar-button"), r = this.shadow.querySelector(".chat-list"), o = this.shadow.querySelector(".container");
-    this.handleClearClick && e?.removeEventListener("click", this.handleClearClick), this.handleNewChatClick && t?.removeEventListener("click", this.handleNewChatClick), this.handleToggleSidebarClick && s?.removeEventListener("click", this.handleToggleSidebarClick), this.handleChatListClick && r?.removeEventListener("click", this.handleChatListClick), this.handleMessageEvent && o && o.removeEventListener("message", this.handleMessageEvent), this.handleClearClick = null, this.handleNewChatClick = null, this.handleToggleSidebarClick = null, this.handleChatListClick = null, this.handleMessageEvent = null;
+    const e = this.shadow.querySelector(".clear-button"), t = this.shadow.querySelector(".new-chat-button"), s = this.shadow.querySelector(".toggle-sidebar-button"), r = this.shadow.querySelector(".chat-list"), n = this.shadow.querySelector(".container");
+    this.handleClearClick && e?.removeEventListener("click", this.handleClearClick), this.handleNewChatClick && t?.removeEventListener("click", this.handleNewChatClick), this.handleToggleSidebarClick && s?.removeEventListener("click", this.handleToggleSidebarClick), this.handleChatListClick && r?.removeEventListener("click", this.handleChatListClick), this.handleMessageEvent && n && n.removeEventListener("message", this.handleMessageEvent), this.handleClearClick = null, this.handleNewChatClick = null, this.handleToggleSidebarClick = null, this.handleChatListClick = null, this.handleMessageEvent = null;
   }
   setupView() {
     const e = this.shadow.querySelector(".container");
     if (!this.client) {
-      e && (e.innerHTML = `
+      if (e) {
+        const s = this.resolvedTranslations;
+        e.innerHTML = `
           <div style="padding: 16px; color: var(--search-snippet-error-color, #ef4444); font-family: var(--search-snippet-font-family, sans-serif); font-size: var(--search-snippet-font-size-base, 14px);">
-            <strong>Error:</strong> The <code>api-url</code> attribute is required. Please provide a valid API URL.
+            <strong>${c(s.errorPrefix)}</strong> ${c(s.missingApiUrlError)}
           </div>
-        `);
+        `;
+      }
       return;
     }
     if (!e) return;
     const t = this.getProps();
-    if (this.chatView = new N(e, this.client, t), this.sessions.length === 0)
+    if (this.chatView = new Y(e, this.client, t), this.sessions.length === 0)
       this.createNewChat();
     else {
       const s = this.sessions[0];
@@ -2032,7 +2607,7 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
   }
   loadSessions() {
     try {
-      const e = localStorage.getItem(z);
+      const e = localStorage.getItem(B);
       e && (this.sessions = JSON.parse(e), this.sessions.sort((t, s) => s.updatedAt - t.updatedAt));
     } catch (e) {
       console.error("Failed to load chat sessions:", e);
@@ -2040,7 +2615,7 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
   }
   saveSessions() {
     try {
-      localStorage.setItem(z, JSON.stringify(this.sessions));
+      localStorage.setItem(B, JSON.stringify(this.sessions));
     } catch (e) {
       console.error("Failed to save chat sessions:", e);
     }
@@ -2052,20 +2627,20 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
   }
   updateSessionTitle() {
     if (!this.currentSessionId) return;
-    const e = this.sessions.find((t) => t.id === this.currentSessionId);
-    if (e && e.messages.length > 0 && e.title === "New Chat") {
-      const t = e.messages.find((s) => s.role === "user");
-      t && (e.title = t.content.slice(0, 50) + (t.content.length > 50 ? "..." : ""), this.saveSessions());
-    }
+    const e = this.sessions.find((r) => r.id === this.currentSessionId);
+    if (!e || e.messages.length === 0 || !(e.titleIsDefault ?? e.title === this.resolvedTranslations.newChatButton)) return;
+    const s = e.messages.find((r) => r.role === "user");
+    s && (e.title = s.content.slice(0, 50) + (s.content.length > 50 ? "..." : ""), e.titleIsDefault = !1, this.saveSessions());
   }
   createNewChat() {
     this.saveCurrentSession();
     const e = {
       id: this.generateSessionId(),
-      title: "New Chat",
+      title: this.resolvedTranslations.newChatButton,
       messages: [],
       createdAt: Date.now(),
-      updatedAt: Date.now()
+      updatedAt: Date.now(),
+      titleIsDefault: !0
     };
     this.sessions.unshift(e), this.currentSessionId = e.id, this.saveSessions(), this.chatView?.clearMessages(), this.renderChatList();
   }
@@ -2082,7 +2657,7 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
   clearCurrentChat() {
     if (!this.currentSessionId) return;
     const e = this.sessions.find((t) => t.id === this.currentSessionId);
-    e && (e.messages = [], e.title = "New Chat", e.updatedAt = Date.now(), this.saveSessions()), this.chatView?.clearMessages(), this.renderChatList();
+    e && (e.messages = [], e.title = this.resolvedTranslations.newChatButton, e.titleIsDefault = !0, e.updatedAt = Date.now(), this.saveSessions()), this.chatView?.clearMessages(), this.renderChatList();
   }
   toggleSidebar() {
     this.sidebarCollapsed = !this.sidebarCollapsed, this.shadow.querySelector(".chat-sidebar")?.classList.toggle("collapsed", this.sidebarCollapsed);
@@ -2091,35 +2666,35 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
     const t = e.target, s = t.closest(".chat-list-item-delete");
     if (s) {
       e.stopPropagation();
-      const o = s.getAttribute("data-session-id");
-      o && this.deleteSession(o);
+      const n = s.getAttribute("data-session-id");
+      n && this.deleteSession(n);
       return;
     }
     const r = t.closest(".chat-list-item");
     if (r) {
-      const o = r.getAttribute("data-session-id");
-      o && this.switchToSession(o);
+      const n = r.getAttribute("data-session-id");
+      n && this.switchToSession(n);
     }
   }
   renderChatList() {
     const e = this.shadow.querySelector(".chat-list");
-    if (e) {
-      if (this.sessions.length === 0) {
-        e.innerHTML = '<div class="chat-list-empty">No chats yet</div>';
-        return;
-      }
-      e.innerHTML = this.sessions.map((t) => this.renderChatListItem(t)).join("");
+    if (!e) return;
+    const t = this.resolvedTranslations;
+    if (this.sessions.length === 0) {
+      e.innerHTML = `<div class="chat-list-empty">${this.escapeHTML(t.noChatsYet)}</div>`;
+      return;
     }
+    e.innerHTML = this.sessions.map((s) => this.renderChatListItem(s)).join("");
   }
   renderChatListItem(e) {
-    const t = e.id === this.currentSessionId, s = this.formatDate(e.updatedAt);
+    const t = e.id === this.currentSessionId, s = this.formatDate(e.updatedAt), r = this.resolvedTranslations.deleteChatTitle;
     return `
       <div class="chat-list-item ${t ? "active" : ""}" data-session-id="${e.id}">
         <div class="chat-list-item-content">
           <div class="chat-list-item-title">${this.escapeHTML(e.title)}</div>
           <div class="chat-list-item-date">${s}</div>
         </div>
-        <button class="chat-list-item-delete" data-session-id="${e.id}" title="Delete chat">
+        <button class="chat-list-item-delete" data-session-id="${e.id}" title="${this.escapeHTML(r)}">
           <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
             <path d="M3 6h18M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
           </svg>
@@ -2128,8 +2703,8 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
     `;
   }
   formatDate(e) {
-    const t = new Date(e), r = (/* @__PURE__ */ new Date()).getTime() - t.getTime(), o = Math.floor(r / (1e3 * 60 * 60 * 24));
-    return o === 0 ? t.toLocaleTimeString(void 0, { hour: "2-digit", minute: "2-digit" }) : o === 1 ? "Yesterday" : o < 7 ? t.toLocaleDateString(void 0, { weekday: "long" }) : t.toLocaleDateString(void 0, { month: "short", day: "numeric" });
+    const t = new Date(e), r = (/* @__PURE__ */ new Date()).getTime() - t.getTime(), n = Math.floor(r / (1e3 * 60 * 60 * 24));
+    return n === 0 ? t.toLocaleTimeString(void 0, { hour: "2-digit", minute: "2-digit" }) : n === 1 ? this.resolvedTranslations.yesterday : n < 7 ? t.toLocaleDateString(void 0, { weekday: "long" }) : t.toLocaleDateString(void 0, { month: "short", day: "numeric" });
   }
   escapeHTML(e) {
     const t = document.createElement("div");
@@ -2158,8 +2733,8 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
     return this.sessions.find((e) => e.id === this.currentSessionId) || null;
   }
 }
-customElements.get(I) || customElements.define(I, X);
-const Z = `
+customElements.get(q) || customElements.define(q, ve);
+const fe = `
 /* Search view states */
 .search-view {
   transition: var(--search-snippet-transition-slow);
@@ -2529,12 +3104,13 @@ a.search-result-item:focus-visible {
   border-radius: 2px;
   font-weight: var(--search-snippet-font-weight-medium);
 }
-`, A = "search-bar-snippet", Q = 10, ee = 50;
-class te extends HTMLElement {
+`, O = "search-bar-snippet", H = 10, N = 50;
+class be extends HTMLElement {
   constructor() {
     super();
     a(this, "shadow");
     a(this, "client", null);
+    a(this, "stats", null);
     a(this, "container", null);
     a(this, "inputElement", null);
     a(this, "resultsContainer", null);
@@ -2543,11 +3119,19 @@ class te extends HTMLElement {
     a(this, "currentSearchController", null);
     a(this, "loadingMessageInterval", null);
     a(this, "loadingMessageIndex", 0);
+    a(this, "translationsOverride", null);
+    a(this, "resolvedTranslations", g(null));
+    // Analytics context: captures the most recently completed search so that
+    // click / view-more events report the same query + total.
+    a(this, "lastSearchQuery", "");
+    a(this, "lastSearchTotal", 0);
     // Event handler references for cleanup
     a(this, "handleInputChange", null);
     a(this, "handleInputKeydownEnter", null);
     a(this, "handleInputKeydownEscape", null);
     a(this, "handleSearchButtonClick", null);
+    a(this, "handleResultClick", null);
+    a(this, "handleSeeMoreClick", null);
     this.shadow = this.attachShadow({ mode: "open" });
   }
   static get observedAttributes() {
@@ -2555,6 +3139,7 @@ class te extends HTMLElement {
       "api-url",
       "placeholder",
       "max-results",
+      "max-render-results",
       "debounce-ms",
       "theme",
       "hide-branding",
@@ -2562,30 +3147,73 @@ class te extends HTMLElement {
       "show-date",
       "hide-thumbnails",
       "see-more",
-      "request-options"
+      "disable-analytics",
+      "request-options",
+      "translations"
     ];
   }
   connectedCallback() {
-    this.initializeClient(), this.render(), this.dispatchEvent(v("ready", void 0));
+    this.syncTranslationsFromAttribute(), this.initializeClient(), this.render(), this.dispatchEvent(b("ready", void 0));
   }
   disconnectedCallback() {
     this.cleanup();
   }
   attributeChangedCallback(e, t, s) {
-    t !== s && (e === "api-url" ? this.initializeClient() : e === "theme" && this.updateTheme(s));
+    t !== s && (e === "api-url" || e === "disable-analytics" ? this.initializeClient() : e === "theme" ? this.updateTheme(s) : e === "translations" && (this.syncTranslationsFromAttribute(), this.isConnected && this.rerender()));
+  }
+  /**
+   * Get the current translations object. Mirrors the property getter.
+   */
+  get translations() {
+    return this.translationsOverride;
+  }
+  /**
+   * Override any user-facing string. Omitted keys fall back to English defaults.
+   */
+  set translations(e) {
+    this.translationsOverride = e ?? null, this.resolvedTranslations = g(this.translationsOverride), this.isConnected && this.rerender();
+  }
+  /**
+   * Re-render preserving the current query and re-running the search so
+   * results remain visible after a translations change at runtime.
+   */
+  rerender() {
+    const e = this.inputElement?.value ?? "";
+    this.render(), e && this.inputElement && (this.inputElement.value = e, e.trim().length > 0 && this.performSearch(e.trim()));
+  }
+  syncTranslationsFromAttribute() {
+    if (this.translationsOverride) {
+      this.resolvedTranslations = g(this.translationsOverride);
+      return;
+    }
+    const e = k(
+      this.getAttribute("translations"),
+      "SearchBarSnippet"
+    );
+    this.resolvedTranslations = g(e);
   }
   getProps() {
+    const e = this.resolvedTranslations;
     return {
-      apiUrl: d(this.getAttribute("api-url"), ""),
-      placeholder: d(this.getAttribute("placeholder"), "Search..."),
-      maxResults: y(this.getAttribute("max-results"), 10),
-      debounceMs: y(this.getAttribute("debounce-ms"), 300),
-      theme: d(this.getAttribute("theme"), "auto"),
-      hideBranding: m(this.getAttribute("hide-branding"), !1),
-      showUrl: m(this.getAttribute("show-url"), !1),
-      showDate: m(this.getAttribute("show-date"), !1),
-      hideThumbnails: m(this.getAttribute("hide-thumbnails"), !1),
-      seeMore: d(this.getAttribute("see-more"), "")
+      apiUrl: m(this.getAttribute("api-url"), ""),
+      placeholder: m(this.getAttribute("placeholder"), e.placeholder),
+      maxResults: w(
+        this.getAttribute("max-results"),
+        N
+      ),
+      maxRenderResults: w(
+        this.getAttribute("max-render-results"),
+        H
+      ),
+      debounceMs: w(this.getAttribute("debounce-ms"), 300),
+      theme: m(this.getAttribute("theme"), "auto"),
+      hideBranding: v(this.getAttribute("hide-branding"), !1),
+      showUrl: v(this.getAttribute("show-url"), !1),
+      showDate: v(this.getAttribute("show-date"), !1),
+      hideThumbnails: v(this.getAttribute("hide-thumbnails"), !1),
+      seeMore: m(this.getAttribute("see-more"), ""),
+      disableAnalytics: v(this.getAttribute("disable-analytics"), !1),
+      translations: this.translationsOverride ?? void 0
     };
   }
   getRequestOptions() {
@@ -2604,24 +3232,27 @@ class te extends HTMLElement {
   initializeClient() {
     const e = this.getProps();
     if (!e.apiUrl) {
-      console.error("SearchBarSnippet: api-url attribute is required"), this.client = null, this.showMissingApiUrlError();
+      console.error("SearchBarSnippet: api-url attribute is required"), this.client = null, this.destroyStatsClient(), this.showMissingApiUrlError();
       return;
     }
     try {
-      this.client = x(e.apiUrl);
+      this.client = S(e.apiUrl), this.destroyStatsClient(), e.disableAnalytics || (this.stats = new Q(e.apiUrl));
     } catch (t) {
       console.error("SearchBarSnippet:", t);
     }
   }
+  destroyStatsClient() {
+    this.stats && (this.stats.destroy(), this.stats = null);
+  }
   render() {
-    const e = this.getProps(), t = (r) => this.performSearch(r);
-    this.debouncedSearch = $(
-      t,
+    const e = this.getProps(), t = this.resolvedTranslations, s = (n) => this.performSearch(n);
+    this.debouncedSearch = _(
+      s,
       e.debounceMs || 400
     );
-    const s = document.createElement("style");
-    s.textContent = `${C}
-${Z}`, this.container = document.createElement("div"), this.container.className = "container", this.container.innerHTML = `
+    const r = document.createElement("style");
+    r.textContent = `${M}
+${fe}`, this.container = document.createElement("div"), this.container.className = "container", this.container.innerHTML = `
             <div class="search-view"> 
                 <div class="search-input-wrapper">
                     <svg xmlns="http://www.w3.org/2000/svg" class="search-icon" height="24px" viewBox="0 -960 960 960" width="24px" fill="currentColor"><path d="M784-120 532-372q-30 24-69 38t-83 14q-109 0-184.5-75.5T120-580q0-109 75.5-184.5T380-840q109 0 184.5 75.5T640-580q0 44-14 83t-38 69l252 252-56 56ZM380-400q75 0 127.5-52.5T560-580q0-75-52.5-127.5T380-760q-75 0-127.5 52.5T200-580q0 75 52.5 127.5T380-400Z"/></svg>
@@ -2629,12 +3260,12 @@ ${Z}`, this.container = document.createElement("div"), this.container.className
                         type="text"
                         name="search-input"
                         class="search-input"
-                        placeholder="${h(e.placeholder || "Search...")}"
-                        aria-label="Search input"
+                        placeholder="${c(e.placeholder || t.placeholder)}"
+                        aria-label="${c(t.searchInputAriaLabel)}"
                         autocomplete="off"
                     />
-                    <button class="button search-submit-button" aria-label="Search">
-                        <span>Search</span>
+                    <button class="button search-submit-button" aria-label="${c(t.searchButtonLabel)}">
+                        <span>${c(t.searchButtonLabel)}</span>
                     </button>
                 </div>
                 <div class="search-content">
@@ -2643,7 +3274,7 @@ ${Z}`, this.container = document.createElement("div"), this.container.className
                     </div>
                 </div>
             </div>
-        `, this.shadow.innerHTML = "", this.shadow.appendChild(s), this.shadow.appendChild(this.container), this.inputElement = this.container.querySelector(".search-input"), this.resultsContainer = this.container.querySelector(".search-results-wrapper"), this.searchButton = this.container.querySelector(".search-submit-button"), this.attachEventListeners(), this.client || this.showMissingApiUrlError();
+        `, this.shadow.innerHTML = "", this.shadow.appendChild(r), this.shadow.appendChild(this.container), this.inputElement = this.container.querySelector(".search-input"), this.resultsContainer = this.container.querySelector(".search-results-wrapper"), this.searchButton = this.container.querySelector(".search-submit-button"), this.attachEventListeners(), this.client || this.showMissingApiUrlError();
   }
   attachEventListeners() {
     this.inputElement && (this.handleInputChange = (e) => {
@@ -2668,12 +3299,12 @@ ${Z}`, this.container = document.createElement("div"), this.container.className
     }
     this.currentSearchController && (this.currentSearchController.abort(), this.currentSearchController = null), this.currentSearchController = new AbortController(), this.showLoadingState();
     try {
-      const t = await this.client.search(e, {
+      const t = this.getProps(), s = await this.client.search(e, {
         signal: this.currentSearchController.signal,
-        maxResults: ee,
+        maxResults: t.maxResults || N,
         request: this.getRequestOptions()
-      }), s = this.getProps(), r = t.slice(0, s.maxResults || Q);
-      this.displayResults(r, e, t.length);
+      }), r = s.slice(0, t.maxRenderResults || H);
+      this.lastSearchQuery = e, this.lastSearchTotal = s.length, this.stats?.trackSearch(e, s.length), this.displayResults(r, e, s.length);
     } catch (t) {
       if (t.name === "AbortError")
         return;
@@ -2688,37 +3319,39 @@ ${Z}`, this.container = document.createElement("div"), this.container.className
       this.showNoResultsState(t);
       return;
     }
-    const r = this.getProps(), o = r.hideBranding ? "" : `<div class="powered-by-inline">${k}</div>`, c = s > e.length, l = c ? `Showing ${e.length} of ${s} results` : `Found ${s} result${s === 1 ? "" : "s"}`, p = r.seeMore && c ? `<div class="search-footer">
-            <a href="${h(r.seeMore + encodeURIComponent(t))}" class="search-see-more">
-              <span>See more results</span>
+    const r = this.getProps(), n = this.resolvedTranslations, o = r.hideBranding ? "" : `<div class="powered-by-inline">${E}</div>`, h = s > e.length, d = h ? y(n.resultsCountOverflow, { n: e.length, total: s }) : y(s === 1 ? n.resultsCount : n.resultsCountPlural, {
+      n: s
+    }), p = r.seeMore && h ? `<div class="search-footer">
+            <a href="${c(r.seeMore + encodeURIComponent(t))}" class="search-see-more">
+              <span>${c(n.seeMoreResults)}</span>
               <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"/><path d="m12 5 7 7-7 7"/></svg>
             </a>
-          </div>` : "", b = `
+          </div>` : "", u = `
             <div class="search-header">
                 <div class="search-count">
-                    ${l}
+                    ${c(d)}
                 </div>
                 ${o}
             </div>
             <div class="search-results">
-                ${e.map((u) => this.renderResult(u)).join("")}
+                ${e.map((f, L) => this.renderResult(f, L)).join("")}
             </div>
             ${p}
         `;
-    this.resultsContainer.innerHTML = b, this.attachResultHandlers();
+    this.resultsContainer.innerHTML = u, this.attachResultHandlers();
   }
-  renderResult(e) {
-    const t = this.getProps(), s = t.hideThumbnails ? "" : this.renderResultImage(e.image, e.title), r = e.url ? h(e.url) : "#", o = e.url ? h(q(e.url)) : "", c = t.showDate && e.timestamp !== void 0 ? `<div class="search-result-date">${h(B(e.timestamp))}</div>` : "", l = t.showUrl && e.url || c ? `<div class="search-result-metadata">
-            ${t.showUrl && e.url ? `<span class="search-result-url">${o}</span>` : '<span class="search-result-url search-result-url-empty"></span>'}
-            ${c}
+  renderResult(e, t) {
+    const s = this.getProps(), r = s.hideThumbnails ? "" : this.renderResultImage(e.image, e.title), n = e.url ? c(e.url) : "#", o = e.url ? c(V(e.url)) : "", h = s.showDate && e.timestamp !== void 0 ? `<div class="search-result-date">${c(j(e.timestamp))}</div>` : "", d = s.showUrl && e.url || h ? `<div class="search-result-metadata">
+            ${s.showUrl && e.url ? `<span class="search-result-url">${o}</span>` : '<span class="search-result-url search-result-url-empty"></span>'}
+            ${h}
           </div>` : "";
     return `
-            <a href="${r}" class="search-result-item" data-result-id="${h(e.url || "")}">
-                ${s}
+            <a href="${n}" class="search-result-item" data-index="${t}" data-result-id="${c(e.id || "")}">
+                ${r}
                 <div class="search-result-content">
-                    <div class="search-result-title">${h(e.title || "")}</div>
-                    <div class="search-result-snippet">${h(e.description || "")}</div>
-                    ${l}
+                    <div class="search-result-title">${c(e.title || "")}</div>
+                    <div class="search-result-snippet">${c(e.description || "")}</div>
+                    ${d}
                 </div>
             </a>
         `;
@@ -2731,8 +3364,8 @@ ${Z}`, this.container = document.createElement("div"), this.container.className
         <div class="search-result-image-placeholder" style="display: none;">${s}</div>
         <img 
           class="search-result-image" 
-          src="${h(e)}" 
-          alt="${h(t)}"
+          src="${c(e)}" 
+          alt="${c(t)}"
           loading="lazy"
         />
       </div>
@@ -2743,95 +3376,118 @@ ${Z}`, this.container = document.createElement("div"), this.container.className
       `;
   }
   attachResultHandlers() {
-    const e = this.container?.querySelectorAll(".search-result-item");
+    this.detachResultTrackingHandlers();
+    const e = this.resultsContainer;
     if (!e) return;
-    for (const s of e)
-      s.getAttribute("href") === "#" && s.addEventListener("click", (o) => {
-        o.preventDefault();
-      });
-    this.container?.querySelectorAll(".search-result-image")?.forEach((s) => {
-      s.addEventListener("load", () => {
-        s.classList.add("loaded"), s.closest(".search-result-image-container")?.querySelector(".search-result-image-loading")?.remove();
-      }), s.addEventListener("error", () => {
-        const r = s.closest(".search-result-image-container");
-        r?.querySelector(".search-result-image-loading")?.remove();
-        const o = r?.querySelector(
+    this.handleResultClick = (r) => {
+      const o = r.target?.closest(".search-result-item");
+      if (!o) return;
+      o.getAttribute("href") === "#" && r.preventDefault();
+      const d = o.getAttribute("data-index"), p = o.getAttribute("data-result-id") ?? "", u = d !== null ? Number.parseInt(d, 10) : Number.NaN;
+      !Number.isNaN(u) && p && this.stats?.trackClick(this.lastSearchQuery, this.lastSearchTotal, p, u);
+    }, e.addEventListener("click", this.handleResultClick);
+    const t = e.querySelector(".search-see-more");
+    t && (this.handleSeeMoreClick = () => {
+      this.stats?.trackViewMore(this.lastSearchQuery, this.lastSearchTotal);
+    }, t.addEventListener("click", this.handleSeeMoreClick)), this.container?.querySelectorAll(".search-result-image")?.forEach((r) => {
+      r.addEventListener("load", () => {
+        r.classList.add("loaded"), r.closest(".search-result-image-container")?.querySelector(".search-result-image-loading")?.remove();
+      }), r.addEventListener("error", () => {
+        const n = r.closest(".search-result-image-container");
+        n?.querySelector(".search-result-image-loading")?.remove();
+        const o = n?.querySelector(
           ".search-result-image-placeholder"
         );
-        o && (o.style.display = "flex"), s.style.display = "none";
+        o && (o.style.display = "flex"), r.style.display = "none";
       });
     });
   }
+  detachResultTrackingHandlers() {
+    const e = this.resultsContainer;
+    e && this.handleResultClick && e.removeEventListener("click", this.handleResultClick), this.handleResultClick = null, this.handleSeeMoreClick = null;
+  }
   showLoadingState() {
-    this.resultsContainer && (this.clearLoadingInterval(), this.loadingMessageIndex = Math.floor(Math.random() * g.length), this.resultsContainer.innerHTML = `
+    if (!this.resultsContainer) return;
+    this.clearLoadingInterval();
+    const e = this.resolvedTranslations.loadingMessages;
+    this.loadingMessageIndex = Math.floor(Math.random() * e.length);
+    const t = this.resolvedTranslations;
+    this.resultsContainer.innerHTML = `
             <div class="search-loading">
-                <div class="loading" aria-label="Loading"></div>
-                <div class="loading-text loading-text-animate">${g[this.loadingMessageIndex]}</div>
+                <div class="loading" aria-label="${c(t.loadingAriaLabel)}"></div>
+                <div class="loading-text loading-text-animate">${c(e[this.loadingMessageIndex])}</div>
             </div>
-        `, this.startLoadingInterval());
+        `, this.startLoadingInterval();
   }
   startLoadingInterval() {
     this.loadingMessageInterval = setInterval(() => {
-      this.loadingMessageIndex = (this.loadingMessageIndex + 1) % g.length;
-      const e = this.resultsContainer?.querySelector(".loading-text");
-      e && (e.classList.remove("loading-text-animate"), e.offsetWidth, e.textContent = g[this.loadingMessageIndex], e.classList.add("loading-text-animate"));
-    }, 2500);
+      const e = this.resolvedTranslations.loadingMessages;
+      this.loadingMessageIndex = (this.loadingMessageIndex + 1) % e.length;
+      const t = this.resultsContainer?.querySelector(".loading-text");
+      t && (t.classList.remove("loading-text-animate"), t.offsetWidth, t.textContent = e[this.loadingMessageIndex], t.classList.add("loading-text-animate"));
+    }, A);
   }
   clearLoadingInterval() {
     this.loadingMessageInterval && (clearInterval(this.loadingMessageInterval), this.loadingMessageInterval = null);
   }
   showEmptyState() {
-    this.clearLoadingInterval(), this.resultsContainer && (this.resultsContainer.innerHTML = `
+    if (this.clearLoadingInterval(), !this.resultsContainer) return;
+    const e = this.resolvedTranslations;
+    this.resultsContainer.innerHTML = `
             <div class="search-empty">
                 <svg class="search-empty-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                     <circle cx="11" cy="11" r="8"></circle>
                     <path d="m21 21-4.35-4.35"></path>
                 </svg>
-                <div class="search-empty-title">Start Searching</div>
+                <div class="search-empty-title">${c(e.emptyStateTitle)}</div>
                 <div class="search-empty-description">
-                    Enter a query to search for results
+                    ${c(e.emptyStateDescription)}
                 </div>
             </div>
-        `);
+        `;
   }
   showNoResultsState(e) {
-    this.clearLoadingInterval(), this.resultsContainer && (this.resultsContainer.innerHTML = `
+    if (this.clearLoadingInterval(), !this.resultsContainer) return;
+    const t = this.resolvedTranslations;
+    this.resultsContainer.innerHTML = `
             <div class="search-empty">
                 <svg class="search-empty-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                     <circle cx="11" cy="11" r="8"></circle>
                     <line x1="21" y1="21" x2="16.65" y2="16.65"></line>
                 </svg>
-                <div class="search-empty-title">No Results Found</div>
+                <div class="search-empty-title">${c(t.noResultsTitle)}</div>
                 <div class="search-empty-description">
-                    No results found for "${h(e)}"
+                    ${c(y(t.noResultsDescription, { query: e }))}
                 </div>
             </div>
-        `);
+        `;
   }
   showErrorState(e) {
-    this.clearLoadingInterval(), this.resultsContainer && (this.resultsContainer.innerHTML = `
+    if (this.clearLoadingInterval(), !this.resultsContainer) return;
+    const t = this.resolvedTranslations;
+    this.resultsContainer.innerHTML = `
             <div class="error">
-                <strong>Error:</strong> ${h(e)}
+                <strong>${c(t.errorPrefix)}</strong> ${c(e)}
             </div>
-        `);
+        `;
   }
   showMissingApiUrlError() {
-    this.resultsContainer && this.showErrorState("The api-url attribute is required. Please provide a valid API URL.");
+    this.resultsContainer && this.showErrorState(this.resolvedTranslations.missingApiUrlError);
   }
   updateTheme(e) {
     const t = e === "light" || e === "dark" || e === "auto" ? e : "auto";
     t === "auto" ? this.removeAttribute("theme") : this.setAttribute("theme", t);
   }
   cleanup() {
-    this.clearLoadingInterval(), this.currentSearchController && (this.currentSearchController.abort(), this.currentSearchController = null), this.client && this.client.cancelAllRequests(), this.inputElement && (this.handleInputChange && this.inputElement.removeEventListener("input", this.handleInputChange), this.handleInputKeydownEnter && this.inputElement.removeEventListener("keydown", this.handleInputKeydownEnter), this.handleInputKeydownEscape && window.removeEventListener("keydown", this.handleInputKeydownEscape)), this.searchButton && this.handleSearchButtonClick && this.searchButton.removeEventListener("click", this.handleSearchButtonClick), this.handleInputChange = null, this.handleInputKeydownEnter = null, this.handleInputKeydownEscape = null, this.handleSearchButtonClick = null;
+    this.clearLoadingInterval(), this.currentSearchController && (this.currentSearchController.abort(), this.currentSearchController = null), this.client && this.client.cancelAllRequests(), this.destroyStatsClient(), this.inputElement && (this.handleInputChange && this.inputElement.removeEventListener("input", this.handleInputChange), this.handleInputKeydownEnter && this.inputElement.removeEventListener("keydown", this.handleInputKeydownEnter), this.handleInputKeydownEscape && window.removeEventListener("keydown", this.handleInputKeydownEscape)), this.searchButton && this.handleSearchButtonClick && this.searchButton.removeEventListener("click", this.handleSearchButtonClick), this.detachResultTrackingHandlers(), this.handleInputChange = null, this.handleInputKeydownEnter = null, this.handleInputKeydownEscape = null, this.handleSearchButtonClick = null;
   }
   // Public API
   async search(e) {
     await this.performSearch(e);
   }
 }
-customElements.get(A) || customElements.define(A, te);
-const se = `
+customElements.get(O) || customElements.define(O, be);
+const ye = `
 /* Modal backdrop */
 .modal-backdrop {
   position: fixed;
@@ -3268,12 +3924,13 @@ a.modal-result-item:focus-visible {
 .modal-container.open {
   animation: modal-slide-in var(--search-snippet-transition) ease-out;
 }
-`, T = "search-modal-snippet", ie = 10, re = 50;
-class ae extends HTMLElement {
+`, P = "search-modal-snippet", D = 10, U = 50;
+class we extends HTMLElement {
   constructor() {
     super();
     a(this, "shadow");
     a(this, "client", null);
+    a(this, "stats", null);
     a(this, "backdrop", null);
     a(this, "modal", null);
     a(this, "inputElement", null);
@@ -3286,11 +3943,18 @@ class ae extends HTMLElement {
     a(this, "currentSearchController", null);
     a(this, "loadingMessageInterval", null);
     a(this, "loadingMessageIndex", 0);
+    a(this, "translationsOverride", null);
+    a(this, "resolvedTranslations", g(null));
+    // Analytics context: populated by performSearch so click/view-more events
+    // can reuse the query and total from the most recent result set.
+    a(this, "lastSearchQuery", "");
+    a(this, "lastSearchTotal", 0);
     // Event handler references for cleanup
     a(this, "handleGlobalKeydown", null);
     a(this, "handleInputChange", null);
     a(this, "handleInputKeydown", null);
     a(this, "handleBackdropClick", null);
+    a(this, "handleResultsContainerClick", null);
     // Scroll lock state
     a(this, "savedBodyStyles", null);
     a(this, "savedHtmlOverflow", null);
@@ -3301,6 +3965,7 @@ class ae extends HTMLElement {
       "api-url",
       "placeholder",
       "max-results",
+      "max-render-results",
       "theme",
       "shortcut",
       "use-meta-key",
@@ -3310,32 +3975,81 @@ class ae extends HTMLElement {
       "show-date",
       "hide-thumbnails",
       "see-more",
-      "request-options"
+      "disable-analytics",
+      "request-options",
+      "translations"
     ];
   }
   connectedCallback() {
-    this.initializeClient(), this.render(), this.attachGlobalKeyboardShortcut(), this.dispatchEvent(v("ready", void 0));
+    this.syncTranslationsFromAttribute(), this.initializeClient(), this.render(), this.attachGlobalKeyboardShortcut(), this.dispatchEvent(b("ready", void 0));
   }
   disconnectedCallback() {
     this.cleanup();
   }
   attributeChangedCallback(e, t, s) {
-    t !== s && (e === "api-url" ? this.initializeClient() : e === "theme" && this.updateTheme(s));
+    t !== s && (e === "api-url" || e === "disable-analytics" ? this.initializeClient() : e === "theme" ? this.updateTheme(s) : e === "translations" && (this.syncTranslationsFromAttribute(), this.isConnected && this.rerender()));
+  }
+  /**
+   * Get the current translations object.
+   */
+  get translations() {
+    return this.translationsOverride;
+  }
+  /**
+   * Override any user-facing string. Omitted keys fall back to English defaults.
+   */
+  set translations(e) {
+    this.translationsOverride = e ?? null, this.resolvedTranslations = g(this.translationsOverride), this.isConnected && this.rerender();
+  }
+  /**
+   * Re-render while preserving open state and the current query. Results are
+   * re-fetched so the list reflects the updated translation strings around
+   * them (counts, footer hints, etc.). Selection resets to none — the same
+   * behavior as the immediate post-search state.
+   */
+  rerender() {
+    const e = this.isOpen, t = this.inputElement?.value ?? "";
+    this.isOpen = !1, this.render(), e && (this.isOpen = !0, this.backdrop?.classList.add("open"), this.modal?.classList.add("open"), requestAnimationFrame(() => {
+      requestAnimationFrame(() => {
+        this.inputElement?.focus();
+      });
+    })), t && this.inputElement && (this.inputElement.value = t, t.trim().length > 0 && this.performSearch(t.trim()));
+  }
+  syncTranslationsFromAttribute() {
+    if (this.translationsOverride) {
+      this.resolvedTranslations = g(this.translationsOverride);
+      return;
+    }
+    const e = k(
+      this.getAttribute("translations"),
+      "SearchModalSnippet"
+    );
+    this.resolvedTranslations = g(e);
   }
   getProps() {
+    const e = this.resolvedTranslations;
     return {
-      apiUrl: d(this.getAttribute("api-url"), ""),
-      placeholder: d(this.getAttribute("placeholder"), "Search..."),
-      maxResults: y(this.getAttribute("max-results"), 10),
-      debounceMs: y(this.getAttribute("debounce-ms"), 300),
-      theme: d(this.getAttribute("theme"), "auto"),
-      shortcut: d(this.getAttribute("shortcut"), "k"),
+      apiUrl: m(this.getAttribute("api-url"), ""),
+      placeholder: m(this.getAttribute("placeholder"), e.placeholder),
+      maxResults: w(
+        this.getAttribute("max-results"),
+        U
+      ),
+      maxRenderResults: w(
+        this.getAttribute("max-render-results"),
+        D
+      ),
+      debounceMs: w(this.getAttribute("debounce-ms"), 300),
+      theme: m(this.getAttribute("theme"), "auto"),
+      shortcut: m(this.getAttribute("shortcut"), "k"),
       useMetaKey: this.getAttribute("use-meta-key") !== "false",
-      hideBranding: m(this.getAttribute("hide-branding"), !1),
-      showUrl: m(this.getAttribute("show-url"), !1),
-      showDate: m(this.getAttribute("show-date"), !1),
-      hideThumbnails: m(this.getAttribute("hide-thumbnails"), !1),
-      seeMore: d(this.getAttribute("see-more"), "")
+      hideBranding: v(this.getAttribute("hide-branding"), !1),
+      showUrl: v(this.getAttribute("show-url"), !1),
+      showDate: v(this.getAttribute("show-date"), !1),
+      hideThumbnails: v(this.getAttribute("hide-thumbnails"), !1),
+      seeMore: m(this.getAttribute("see-more"), ""),
+      disableAnalytics: v(this.getAttribute("disable-analytics"), !1),
+      translations: this.translationsOverride ?? void 0
     };
   }
   getRequestOptions() {
@@ -3354,25 +4068,28 @@ class ae extends HTMLElement {
   initializeClient() {
     const e = this.getProps();
     if (!e.apiUrl) {
-      console.error("SearchModalSnippet: api-url attribute is required"), this.client = null, this.showMissingApiUrlError();
+      console.error("SearchModalSnippet: api-url attribute is required"), this.client = null, this.destroyStatsClient(), this.showMissingApiUrlError();
       return;
     }
     try {
-      this.client = x(e.apiUrl);
+      this.client = S(e.apiUrl), this.destroyStatsClient(), e.disableAnalytics || (this.stats = new Q(e.apiUrl));
     } catch (t) {
       console.error("SearchModalSnippet:", t);
     }
   }
+  destroyStatsClient() {
+    this.stats && (this.stats.destroy(), this.stats = null);
+  }
   render() {
-    const e = this.getProps(), t = (c) => this.performSearch(c);
-    this.debouncedSearch = $(
-      t,
+    const e = this.getProps(), t = this.resolvedTranslations, s = (h) => this.performSearch(h);
+    this.debouncedSearch = _(
+      s,
       e.debounceMs || 300
     );
-    const s = document.createElement("style");
-    s.textContent = `${C}
-${se}`;
-    const r = e.hideBranding ? "" : `<div class="powered-by-inline">${k}</div>`, o = document.createElement("div");
+    const r = document.createElement("style");
+    r.textContent = `${M}
+${ye}`;
+    const n = e.hideBranding ? "" : `<div class="powered-by-inline">${E}</div>`, o = document.createElement("div");
     o.innerHTML = `
       <div class="modal-backdrop" role="presentation"></div>
       <div class="modal-container" role="dialog" aria-modal="true" aria-labelledby="modal-title">
@@ -3383,8 +4100,8 @@ ${se}`;
           <input
             type="text"
             class="modal-search-input"
-            placeholder="${h(e.placeholder || "Search...")}"
-            aria-label="Search"
+            placeholder="${c(e.placeholder || t.placeholder)}"
+            aria-label="${c(t.searchButtonLabel)}"
             aria-autocomplete="list"
             aria-controls="modal-results-list"
             aria-expanded="false"
@@ -3393,7 +4110,7 @@ ${se}`;
           />
         </div>
         <div class="modal-content">
-          <div class="modal-results" id="modal-results-list" role="listbox" aria-label="Search results">
+          <div class="modal-results" id="modal-results-list" role="listbox" aria-label="${c(t.searchResultsAriaLabel)}">
             ${this.renderEmptyState()}
           </div>
         </div>
@@ -3402,21 +4119,21 @@ ${se}`;
             <div class="modal-footer-hint">
               <kbd class="modal-kbd">↑</kbd>
               <kbd class="modal-kbd">↓</kbd>
-              <span>Navigate</span>
+              <span>${c(t.navigateHint)}</span>
             </div>
             <div class="modal-footer-hint">
               <kbd class="modal-kbd">↵</kbd>
-              <span>Select</span>
+              <span>${c(t.selectHint)}</span>
             </div>
             <div class="modal-footer-hint">
               <kbd class="modal-kbd">Esc</kbd>
-              <span>Close</span>
+              <span>${c(t.closeHint)}</span>
             </div>
           </div>
-          ${r}
+          ${n}
         </div>
       </div>
-    `, this.shadow.innerHTML = "", this.shadow.appendChild(s), this.shadow.appendChild(o), this.backdrop = this.shadow.querySelector(".modal-backdrop"), this.modal = this.shadow.querySelector(".modal-container"), this.inputElement = this.shadow.querySelector(".modal-search-input"), this.resultsContainer = this.shadow.querySelector(".modal-results"), this.footerCount = this.shadow.querySelector(".modal-results-count"), this.attachEventListeners(), this.client || this.showMissingApiUrlError();
+    `, this.shadow.innerHTML = "", this.shadow.appendChild(r), this.shadow.appendChild(o), this.backdrop = this.shadow.querySelector(".modal-backdrop"), this.modal = this.shadow.querySelector(".modal-container"), this.inputElement = this.shadow.querySelector(".modal-search-input"), this.resultsContainer = this.shadow.querySelector(".modal-results"), this.footerCount = this.shadow.querySelector(".modal-results-count"), this.attachEventListeners(), this.client || this.showMissingApiUrlError();
   }
   attachGlobalKeyboardShortcut() {
     const e = this.getProps(), t = e.shortcut?.toLowerCase() || "k";
@@ -3466,7 +4183,7 @@ ${se}`;
     }
     const e = this.results[this.activeIndex];
     this.dispatchEvent(
-      v("result-select", {
+      b("result-select", {
         result: e,
         index: this.activeIndex
       })
@@ -3483,12 +4200,12 @@ ${se}`;
     }
     this.currentSearchController && (this.currentSearchController.abort(), this.currentSearchController = null), this.currentSearchController = new AbortController(), this.showLoadingState();
     try {
-      const t = await this.client.search(e, {
+      const t = this.getProps(), s = await this.client.search(e, {
         signal: this.currentSearchController.signal,
-        maxResults: re,
+        maxResults: t.maxResults || U,
         request: this.getRequestOptions()
-      }), s = this.getProps();
-      this.results = t.slice(0, s.maxResults || ie), this.activeIndex = this.results.length > 0 ? 0 : -1, this.displayResults(this.results, e, t.length);
+      });
+      this.results = s.slice(0, t.maxRenderResults || D), this.activeIndex = this.results.length > 0 ? 0 : -1, this.lastSearchQuery = e, this.lastSearchTotal = s.length, this.stats?.trackSearch(e, s.length), this.displayResults(this.results, e, s.length);
     } catch (t) {
       if (t.name === "AbortError")
         return;
@@ -3503,33 +4220,36 @@ ${se}`;
       this.showNoResultsState(t);
       return;
     }
-    const r = this.getProps(), o = e.map((b, u) => this.renderResult(b, u)).join(""), c = s > e.length, l = c ? `Showing ${e.length} of ${s} results` : `${s} result${s === 1 ? "" : "s"}`, p = r.seeMore && c ? `<a href="${h(r.seeMore + encodeURIComponent(t))}" class="modal-see-more">
-            <span>See more results</span>
+    const r = this.getProps(), n = this.resolvedTranslations, o = e.map((u, f) => this.renderResult(u, f)).join(""), h = s > e.length, d = h ? y(n.resultsCountOverflow, { n: e.length, total: s }) : y(s === 1 ? n.modalResultsCount : n.modalResultsCountPlural, {
+      n: s
+    }), p = r.seeMore && h ? `<a href="${c(r.seeMore + encodeURIComponent(t))}" class="modal-see-more">
+            <span>${c(n.seeMoreResults)}</span>
             <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"/><path d="m12 5 7 7-7 7"/></svg>
           </a>` : "";
-    this.resultsContainer.innerHTML = o + p, this.footerCount && (this.footerCount.textContent = l), this.inputElement && this.inputElement.setAttribute("aria-expanded", "true"), this.attachResultHandlers(), this.updateActiveResult();
+    this.resultsContainer.innerHTML = o + p, this.footerCount && (this.footerCount.textContent = d), this.inputElement && this.inputElement.setAttribute("aria-expanded", "true"), this.attachResultHandlers(), this.updateActiveResult();
   }
   renderResult(e, t) {
-    const s = this.getProps(), r = s.hideThumbnails ? "" : this.renderResultImage(e.image, e.title), o = e.url ? h(e.url) : "#", c = e.url ? h(q(e.url)) : "", l = s.showDate && e.timestamp !== void 0 ? `<div class="modal-result-date">${h(B(e.timestamp))}</div>` : "", p = s.showUrl && e.url || l ? `<div class="modal-result-metadata">
-            ${s.showUrl && e.url ? `<span class="modal-result-url">${c}</span>` : '<span class="modal-result-url modal-result-url-empty"></span>'}
-            ${l}
+    const s = this.getProps(), r = s.hideThumbnails ? "" : this.renderResultImage(e.image, e.title), n = e.url ? c(e.url) : "#", o = e.url ? c(V(e.url)) : "", h = s.showDate && e.timestamp !== void 0 ? `<div class="modal-result-date">${c(j(e.timestamp))}</div>` : "", d = s.showUrl && e.url || h ? `<div class="modal-result-metadata">
+            ${s.showUrl && e.url ? `<span class="modal-result-url">${o}</span>` : '<span class="modal-result-url modal-result-url-empty"></span>'}
+            ${h}
           </div>` : "";
     return `
       <a 
-        href="${o}"
+        href="${n}"
         class="modal-result-item${t === this.activeIndex ? " active" : ""}" 
         role="option" 
         id="result-${t}"
         aria-selected="${t === this.activeIndex}"
         tabindex="-1"
         data-index="${t}"
-        data-url="${h(e.url || "")}"
+        data-result-id="${c(e.id || "")}"
+        data-url="${c(e.url || "")}"
       >
         ${r}
         <div class="modal-result-content">
-          <div class="modal-result-title">${h(e.title || "")}</div>
-          ${e.description ? `<div class="modal-result-description">${h(e.description)}</div>` : ""}
-          ${p}
+          <div class="modal-result-title">${c(e.title || "")}</div>
+          ${e.description ? `<div class="modal-result-description">${c(e.description)}</div>` : ""}
+          ${d}
         </div>
       </a>
     `;
@@ -3542,8 +4262,8 @@ ${se}`;
         <div class="modal-result-image-placeholder" style="display: none;">${s}</div>
         <img 
           class="modal-result-image" 
-          src="${h(e)}" 
-          alt="${h(t)}"
+          src="${c(e)}" 
+          alt="${c(t)}"
           loading="lazy"
         />
       </div>
@@ -3554,35 +4274,49 @@ ${se}`;
       `;
   }
   attachResultHandlers() {
-    const e = this.resultsContainer?.querySelectorAll(".modal-result-item");
+    this.detachResultsContainerClick();
+    const e = this.resultsContainer;
     if (!e) return;
-    e.forEach((s, r) => {
-      s.getAttribute("href") === "#" && s.addEventListener("click", (c) => {
-        c.preventDefault();
-      }), s.addEventListener("mouseenter", () => {
-        this.activeIndex = r, this.updateActiveResult();
+    this.handleResultsContainerClick = (r) => {
+      const n = r.target;
+      if (!n) return;
+      const o = n.closest(".modal-result-item");
+      if (o) {
+        o.getAttribute("href") === "#" && r.preventDefault();
+        const p = o.getAttribute("data-index"), u = o.getAttribute("data-result-id") ?? "", f = p !== null ? Number.parseInt(p, 10) : Number.NaN;
+        !Number.isNaN(f) && u && this.stats?.trackClick(this.lastSearchQuery, this.lastSearchTotal, u, f);
+        return;
+      }
+      n.closest(".modal-see-more") && this.stats?.trackViewMore(this.lastSearchQuery, this.lastSearchTotal);
+    }, e.addEventListener("click", this.handleResultsContainerClick), e.querySelectorAll(".modal-result-item").forEach((r, n) => {
+      r.addEventListener("mouseenter", () => {
+        this.activeIndex = n, this.updateActiveResult();
       });
-    }), this.resultsContainer?.querySelectorAll(".modal-result-image")?.forEach((s) => {
-      s.addEventListener("load", () => {
-        s.classList.add("loaded"), s.closest(".modal-result-image-container")?.querySelector(".modal-result-image-loading")?.remove();
-      }), s.addEventListener("error", () => {
-        const r = s.closest(".modal-result-image-container");
-        r?.querySelector(".modal-result-image-loading")?.remove();
-        const o = r?.querySelector(
+    }), e.querySelectorAll(".modal-result-image").forEach((r) => {
+      r.addEventListener("load", () => {
+        r.classList.add("loaded"), r.closest(".modal-result-image-container")?.querySelector(".modal-result-image-loading")?.remove();
+      }), r.addEventListener("error", () => {
+        const n = r.closest(".modal-result-image-container");
+        n?.querySelector(".modal-result-image-loading")?.remove();
+        const o = n?.querySelector(
           ".modal-result-image-placeholder"
         );
-        o && (o.style.display = "flex"), s.style.display = "none";
+        o && (o.style.display = "flex"), r.style.display = "none";
       });
     });
   }
+  detachResultsContainerClick() {
+    this.resultsContainer && this.handleResultsContainerClick && this.resultsContainer.removeEventListener("click", this.handleResultsContainerClick), this.handleResultsContainerClick = null;
+  }
   renderEmptyState() {
+    const e = this.resolvedTranslations;
     return `
       <div class="modal-empty">
         <svg class="modal-empty-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
           <circle cx="11" cy="11" r="8"></circle>
           <path d="m21 21-4.35-4.35"></path>
         </svg>
-        <div class="modal-empty-description">Start typing to search</div>
+        <div class="modal-empty-description">${c(e.modalEmptyStateDescription)}</div>
       </div>
     `;
   }
@@ -3590,44 +4324,52 @@ ${se}`;
     this.clearLoadingInterval(), this.resultsContainer && (this.resultsContainer.innerHTML = this.renderEmptyState(), this.footerCount && (this.footerCount.textContent = ""), this.inputElement && this.inputElement.setAttribute("aria-expanded", "false"));
   }
   showLoadingState() {
-    this.resultsContainer && (this.clearLoadingInterval(), this.loadingMessageIndex = Math.floor(Math.random() * g.length), this.resultsContainer.innerHTML = `
+    if (!this.resultsContainer) return;
+    this.clearLoadingInterval();
+    const e = this.resolvedTranslations.loadingMessages, t = this.resolvedTranslations;
+    this.loadingMessageIndex = Math.floor(Math.random() * e.length), this.resultsContainer.innerHTML = `
       <div class="modal-loading">
-        <div class="loading" aria-label="Loading"></div>
-        <div class="loading-text loading-text-animate">${g[this.loadingMessageIndex]}</div>
+        <div class="loading" aria-label="${c(t.loadingAriaLabel)}"></div>
+        <div class="loading-text loading-text-animate">${c(e[this.loadingMessageIndex])}</div>
       </div>
-    `, this.footerCount && (this.footerCount.textContent = g[this.loadingMessageIndex]), this.startLoadingInterval());
+    `, this.footerCount && (this.footerCount.textContent = e[this.loadingMessageIndex]), this.startLoadingInterval();
   }
   startLoadingInterval() {
     this.loadingMessageInterval = setInterval(() => {
-      this.loadingMessageIndex = (this.loadingMessageIndex + 1) % g.length;
-      const e = this.resultsContainer?.querySelector(".loading-text");
-      e && (e.classList.remove("loading-text-animate"), e.offsetWidth, e.textContent = g[this.loadingMessageIndex], e.classList.add("loading-text-animate")), this.footerCount && (this.footerCount.textContent = g[this.loadingMessageIndex]);
-    }, 2500);
+      const e = this.resolvedTranslations.loadingMessages;
+      this.loadingMessageIndex = (this.loadingMessageIndex + 1) % e.length;
+      const t = this.resultsContainer?.querySelector(".loading-text");
+      t && (t.classList.remove("loading-text-animate"), t.offsetWidth, t.textContent = e[this.loadingMessageIndex], t.classList.add("loading-text-animate")), this.footerCount && (this.footerCount.textContent = e[this.loadingMessageIndex]);
+    }, A);
   }
   clearLoadingInterval() {
     this.loadingMessageInterval && (clearInterval(this.loadingMessageInterval), this.loadingMessageInterval = null);
   }
   showNoResultsState(e) {
-    this.clearLoadingInterval(), this.resultsContainer && (this.resultsContainer.innerHTML = `
+    if (this.clearLoadingInterval(), !this.resultsContainer) return;
+    const t = this.resolvedTranslations;
+    this.resultsContainer.innerHTML = `
       <div class="modal-empty">
         <svg class="modal-empty-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
           <circle cx="11" cy="11" r="8"></circle>
           <line x1="21" y1="21" x2="16.65" y2="16.65"></line>
         </svg>
-        <div class="modal-empty-title">No results found</div>
-        <div class="modal-empty-description">No results for "${h(e)}"</div>
+        <div class="modal-empty-title">${c(t.modalNoResultsTitle)}</div>
+        <div class="modal-empty-description">${c(y(t.modalNoResultsDescription, { query: e }))}</div>
       </div>
-    `, this.footerCount && (this.footerCount.textContent = "0 results"), this.inputElement && this.inputElement.setAttribute("aria-expanded", "false"));
+    `, this.footerCount && (this.footerCount.textContent = t.modalResultsCountZero), this.inputElement && this.inputElement.setAttribute("aria-expanded", "false");
   }
   showErrorState(e) {
-    this.clearLoadingInterval(), this.resultsContainer && (this.resultsContainer.innerHTML = `
+    if (this.clearLoadingInterval(), !this.resultsContainer) return;
+    const t = this.resolvedTranslations;
+    this.resultsContainer.innerHTML = `
       <div class="error">
-        <strong>Error:</strong> ${h(e)}
+        <strong>${c(t.errorPrefix)}</strong> ${c(e)}
       </div>
-    `, this.footerCount && (this.footerCount.textContent = "Error"));
+    `, this.footerCount && (this.footerCount.textContent = t.modalResultsCountError);
   }
   showMissingApiUrlError() {
-    this.resultsContainer && this.showErrorState("The api-url attribute is required. Please provide a valid API URL.");
+    this.resultsContainer && this.showErrorState(this.resolvedTranslations.missingApiUrlError);
   }
   updateTheme(e) {
     const t = e === "light" || e === "dark" || e === "auto" ? e : "auto";
@@ -3649,7 +4391,7 @@ ${se}`;
     document.documentElement.style.overflow = this.savedHtmlOverflow || "", document.body.style.overflow = this.savedBodyStyles.overflow, document.body.style.position = this.savedBodyStyles.position, document.body.style.top = this.savedBodyStyles.top, document.body.style.width = this.savedBodyStyles.width, document.body.style.scrollbarGutter = this.savedBodyStyles.scrollbarGutter || "", window.scrollTo(0, e), this.savedBodyStyles = null, this.savedHtmlOverflow = null;
   }
   cleanup() {
-    this.clearLoadingInterval(), this.currentSearchController && (this.currentSearchController.abort(), this.currentSearchController = null), this.handleGlobalKeydown && (document.removeEventListener("keydown", this.handleGlobalKeydown), this.handleGlobalKeydown = null), this.inputElement && (this.handleInputChange && this.inputElement.removeEventListener("input", this.handleInputChange), this.handleInputKeydown && this.inputElement.removeEventListener("keydown", this.handleInputKeydown)), this.backdrop && this.handleBackdropClick && this.backdrop.removeEventListener("click", this.handleBackdropClick), this.handleInputChange = null, this.handleInputKeydown = null, this.handleBackdropClick = null, this.client && this.client.cancelAllRequests();
+    this.clearLoadingInterval(), this.currentSearchController && (this.currentSearchController.abort(), this.currentSearchController = null), this.handleGlobalKeydown && (document.removeEventListener("keydown", this.handleGlobalKeydown), this.handleGlobalKeydown = null), this.inputElement && (this.handleInputChange && this.inputElement.removeEventListener("input", this.handleInputChange), this.handleInputKeydown && this.inputElement.removeEventListener("keydown", this.handleInputKeydown)), this.backdrop && this.handleBackdropClick && this.backdrop.removeEventListener("click", this.handleBackdropClick), this.detachResultsContainerClick(), this.handleInputChange = null, this.handleInputKeydown = null, this.handleBackdropClick = null, this.destroyStatsClient(), this.client && this.client.cancelAllRequests();
   }
   // Public API
   /**
@@ -3660,13 +4402,13 @@ ${se}`;
       requestAnimationFrame(() => {
         this.inputElement?.focus();
       });
-    }), this.lockBodyScroll(), this.dispatchEvent(v("open", void 0)));
+    }), this.lockBodyScroll(), this.dispatchEvent(b("open", void 0)));
   }
   /**
    * Close the search modal
    */
   close() {
-    this.isOpen && (this.isOpen = !1, this.backdrop?.classList.remove("open"), this.modal?.classList.remove("open"), this.inputElement && (this.inputElement.value = ""), this.results = [], this.activeIndex = -1, this.showEmptyState(), this.unlockBodyScroll(), this.dispatchEvent(v("close", void 0)));
+    this.isOpen && (this.isOpen = !1, this.backdrop?.classList.remove("open"), this.modal?.classList.remove("open"), this.inputElement && (this.inputElement.value = ""), this.results = [], this.activeIndex = -1, this.showEmptyState(), this.unlockBodyScroll(), this.dispatchEvent(b("close", void 0)));
   }
   /**
    * Toggle the search modal open/closed
@@ -3693,13 +4435,16 @@ ${se}`;
     return this.isOpen;
   }
 }
-customElements.get(T) || customElements.define(T, ae);
+customElements.get(P) || customElements.define(P, we);
 export {
-  K as AISearchClient,
-  W as ChatBubbleSnippet,
-  X as ChatPageSnippet,
-  te as SearchBarSnippet,
-  ae as SearchModalSnippet,
-  te as default
+  ae as AISearchClient,
+  me as ChatBubbleSnippet,
+  ve as ChatPageSnippet,
+  T as DEFAULT_TRANSLATIONS,
+  be as SearchBarSnippet,
+  we as SearchModalSnippet,
+  Q as StatsClient,
+  be as default,
+  g as mergeTranslations
 };
 //# sourceMappingURL=search-snippet.es.js.map