@cloudflare/ai-search-snippet 0.0.30 → 0.0.32

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/main.d.ts +20 -4
  2. package/dist/search-snippet.es.js +284 -209
  3. package/dist/search-snippet.es.js.map +1 -1
  4. package/dist/search-snippet.umd.js +41 -41
  5. package/dist/search-snippet.umd.js.map +1 -1
  6. package/package.json +2 -1
package/dist/search-snippet.es.js CHANGED
@@ -1,7 +1,7 @@
1
- var H = Object.defineProperty;
2
- var N = (o, i, e) => i in o ? H(o, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[i] = e;
3
- var a = (o, i, e) => N(o, typeof i != "symbol" ? i + "" : i, e);
4
- const u = [
1
+ var U = Object.defineProperty;
2
+ var O = (n, i, e) => i in n ? U(n, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[i] = e;
3
+ var a = (n, i, e) => O(n, typeof i != "symbol" ? i + "" : i, e);
4
+ const g = [
5
5
  "Searching...",
6
6
  "Digging through results...",
7
7
  "Scanning the knowledge base...",
@@ -13,24 +13,31 @@ const u = [
13
13
  "Rummaging through pages...",
14
14
  "Hunting down answers..."
15
15
  ];
16
- function A(o, i) {
16
+ function $(n, i) {
17
17
  let e;
18
18
  function t(...s) {
19
19
  clearTimeout(e), e = setTimeout(() => {
20
- o(...s);
20
+ n(...s);
21
21
  }, i);
22
22
  }
23
23
  return t.cancel = () => clearTimeout(e), t;
24
24
  }
25
- function h(o) {
25
+ function h(n) {
26
26
  const i = document.createElement("div");
27
- return i.textContent = o, i.innerHTML;
27
+ return i.textContent = n, i.innerHTML;
28
28
  }
29
- function S(o) {
30
- return new DOMParser().parseFromString(o, "text/html").documentElement.textContent || "";
29
+ function q(n) {
30
+ try {
31
+ return decodeURI(n);
32
+ } catch {
33
+ return n;
34
+ }
35
+ }
36
+ function E(n) {
37
+ return new DOMParser().parseFromString(n, "text/html").documentElement.textContent || "";
31
38
  }
32
- function P(o) {
33
- const i = new Date(o), t = (/* @__PURE__ */ new Date()).getTime() - i.getTime();
39
+ function _(n) {
40
+ const i = new Date(n), t = (/* @__PURE__ */ new Date()).getTime() - i.getTime();
34
41
  if (t < 6e4)
35
42
  return "Just now";
36
43
  if (t < 36e5) {
@@ -48,60 +55,90 @@ function P(o) {
48
55
  minute: "2-digit"
49
56
  });
50
57
  }
51
- function $(o) {
52
- return new Date(o).toLocaleDateString(void 0, {
58
+ function B(n) {
59
+ return new Date(n).toLocaleDateString(void 0, {
53
60
  month: "short",
54
61
  day: "numeric"
55
62
  });
56
63
  }
57
- function E(o = "id") {
58
- return `${o}-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
64
+ function M(n = "id") {
65
+ return `${n}-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
59
66
  }
60
- function d(o, i) {
61
- return o !== null ? o : i;
67
+ function d(n, i) {
68
+ return n !== null ? n : i;
62
69
  }
63
- function g(o, i) {
64
- return o === null ? i : o === "true" || o === "";
70
+ function m(n, i) {
71
+ return n === null ? i : n === "true" || n === "";
65
72
  }
66
- function w(o, i) {
67
- if (o === null) return i;
68
- const e = Number.parseInt(o, 10);
73
+ function y(n, i) {
74
+ if (n === null) return i;
75
+ const e = Number.parseInt(n, 10);
69
76
  return Number.isNaN(e) ? i : e;
70
77
  }
71
- function m(o, i) {
72
- return new CustomEvent(o, {
78
+ function v(n, i) {
79
+ return new CustomEvent(n, {
73
80
  detail: i,
74
81
  bubbles: !0,
75
82
  composed: !0,
76
83
  cancelable: !0
77
84
  });
78
85
  }
79
- function x(o) {
80
- if (!o)
86
+ function x(n) {
87
+ if (!n)
81
88
  throw new Error("API URL is required");
82
- return new _(o);
83
- }
84
- class _ {
89
+ return new K(n);
90
+ }
91
+ function w(n) {
92
+ return n !== null && typeof n == "object" && !Array.isArray(n);
93
+ }
94
+ function R(...n) {
95
+ const i = {};
96
+ for (const e of n)
97
+ if (e)
98
+ for (const [t, s] of Object.entries(e)) {
99
+ const r = i[t];
100
+ w(r) && w(s) ? i[t] = R(r, s) : i[t] = s;
101
+ }
102
+ return i;
103
+ }
104
+ function D(n, i) {
105
+ if (!w(i))
106
+ return n;
107
+ const e = new URLSearchParams();
108
+ for (const [l, p] of Object.entries(i))
109
+ p != null && e.append(l, String(p));
110
+ const t = e.toString();
111
+ if (!t)
112
+ return n;
113
+ const s = n.indexOf("#"), r = s === -1 ? n : n.slice(0, s), o = s === -1 ? "" : n.slice(s), c = r.includes("?") ? "&" : "?";
114
+ return `${r}${c}${t}${o}`;
115
+ }
116
+ function j(n) {
117
+ if (!w(n))
118
+ return {};
119
+ const i = {};
120
+ for (const [e, t] of Object.entries(n))
121
+ t != null && (i[e] = String(t));
122
+ return i;
123
+ }
124
+ function V(n) {
125
+ return w(n) ? n : void 0;
126
+ }
127
+ class K {
85
128
  constructor(i) {
86
129
  a(this, "activeRequests", /* @__PURE__ */ new Map());
87
130
  a(this, "baseUrl");
88
131
  this.baseUrl = i.replace(/\/$/, "");
89
132
  }
90
- request(i = {}, e, t) {
91
- const s = e === "search" ? "snippet-search" : "snippet-chat-completions";
92
- return fetch(`${this.baseUrl}/${e}`, {
133
+ request(i, e, t, s) {
134
+ const r = e === "search" ? "snippet-search" : "snippet-chat-completions", o = D(`${this.baseUrl}/${e}`, s?.queryParams);
135
+ return fetch(o, {
93
136
  method: "POST",
94
- body: JSON.stringify({
95
- messages: [{ role: "user", content: i.query }],
96
- stream: i.streaming,
97
- max_results: i.maxResults,
98
- ...e === "search" && {
99
- ai_search_options: { retrieval: { metadata_only: !0 } }
100
- }
101
- }),
137
+ body: JSON.stringify(R(V(s?.body), i)),
102
138
  headers: {
139
+ ...j(s?.headers),
103
140
  "Content-Type": "application/json",
104
- "cf-ai-search-source": s
141
+ "cf-ai-search-source": r
105
142
  },
106
143
  signal: t
107
144
  });
@@ -113,27 +150,33 @@ class _ {
113
150
  const t = this.generateRequestId(), s = new AbortController(), r = e.signal || s.signal;
114
151
  this.registerRequest(t, s);
115
152
  try {
116
- const n = await this.request(
153
+ const o = await this.request(
117
154
  {
118
- query: i,
119
- streaming: !1,
120
- maxResults: e.maxResults || 30
155
+ messages: [{ role: "user", content: i }],
156
+ stream: !1,
157
+ ai_search_options: {
158
+ retrieval: {
159
+ metadata_only: !0,
160
+ max_results: e.maxResults ?? 30
161
+ }
162
+ }
121
163
  },
122
164
  "search",
123
- r
165
+ r,
166
+ e.request
124
167
  );
125
- if (!n.ok)
126
- throw new Error(`HTTP error! status: ${n.status}`);
127
- if (!n.body)
168
+ if (!o.ok)
169
+ throw new Error(`HTTP error! status: ${o.status}`);
170
+ if (!o.body)
128
171
  throw new Error("Response body is empty");
129
- const c = await n.json();
172
+ const c = await o.json();
130
173
  if (c.success && c.result)
131
174
  return c.result.chunks.map(
132
175
  (l) => ({
133
176
  type: "result",
134
177
  id: l.id,
135
- title: S(l.item.metadata?.title),
136
- description: l.item.metadata?.description ? S(l.item.metadata?.description) : "",
178
+ title: E(l.item.metadata?.title),
179
+ description: l.item.metadata?.description ? E(l.item.metadata?.description) : "",
137
180
  timestamp: l.item.timestamp ?? void 0,
138
181
  url: l.item.key,
139
182
  image: l.item.metadata?.image || void 0,
@@ -145,29 +188,33 @@ class _ {
145
188
  this.unregisterRequest(t);
146
189
  }
147
190
  }
148
- async *searchStream(i, e) {
149
- const t = this.generateRequestId(), s = new AbortController(), r = e?.signal || s.signal;
191
+ async *searchStream(i, e = {}) {
192
+ const t = this.generateRequestId(), s = new AbortController(), r = e.signal || s.signal;
150
193
  this.registerRequest(t, s);
151
- const n = await this.request(
194
+ const o = await this.request(
152
195
  {
153
- query: i,
154
- streaming: !0
196
+ messages: [{ role: "user", content: i }],
197
+ stream: !0,
198
+ ...e.maxResults !== void 0 && {
199
+ max_results: e.maxResults
200
+ }
155
201
  },
156
202
  "ai-search",
157
- r
203
+ r,
204
+ e.request
158
205
  );
159
- if (!n.ok)
160
- throw new Error(`HTTP error! status: ${n.status}`);
161
- if (!n.body)
206
+ if (!o.ok)
207
+ throw new Error(`HTTP error! status: ${o.status}`);
208
+ if (!o.body)
162
209
  throw new Error("Response body is empty");
163
210
  let c = "";
164
- const l = n.body.getReader(), v = new TextDecoder();
211
+ const l = o.body.getReader(), p = new TextDecoder();
165
212
  for (; ; ) {
166
- const { done: p, value: C } = await l.read();
167
- if (p)
213
+ const { done: u, value: S } = await l.read();
214
+ if (u)
168
215
  break;
169
- const R = v.decode(C, { stream: !0 });
170
- c += R;
216
+ const P = p.decode(S, { stream: !0 });
217
+ c += P;
171
218
  }
172
219
  yield {
173
220
  type: "result",
@@ -175,7 +222,7 @@ class _ {
175
222
  title: "",
176
223
  description: c.replaceAll("data: ", "").trim().split(`
177
224
 
178
- `).map((p) => JSON.parse(p)).map((p) => p.response).join(""),
225
+ `).map((u) => JSON.parse(u)).map((u) => u.response).join(""),
179
226
  url: "",
180
227
  metadata: {}
181
228
  };
@@ -183,8 +230,8 @@ class _ {
183
230
  async *chat(i, e) {
184
231
  const t = new AbortController(), s = e?.signal || t.signal, r = await this.request(
185
232
  {
186
- query: i,
187
- streaming: !1
233
+ messages: [{ role: "user", content: i }],
234
+ stream: !1
188
235
  },
189
236
  "chat/completions",
190
237
  s
@@ -235,10 +282,10 @@ class _ {
235
282
  return `req-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
236
283
  }
237
284
  }
238
- const D = `<svg width="32" height="10" viewBox="0 0 412 186" xmlns="http://www.w3.org/2000/svg" aria-label="Cloudflare" role="img">
285
+ const G = `<svg width="32" height="10" viewBox="0 0 412 186" xmlns="http://www.w3.org/2000/svg" aria-label="Cloudflare" role="img">
239
286
  <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"/>
240
287
  <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"/>
241
- </svg>`, U = "https://workers.cloudflare.com/product/ai-search", y = `Powered by <a href="${U}" target="_blank" rel="noopener noreferrer">Cloudflare AI Search ${D}</a>`, q = `
288
+ </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 = `
242
289
  /* Chat container */
243
290
  .chat-container {
244
291
  display: flex;
@@ -555,7 +602,7 @@ const D = `<svg width="32" height="10" viewBox="0 0 412 186" xmlns="http://www.w
555
602
  .chat-message-bubble a:hover {
556
603
  text-decoration: none;
557
604
  }
558
- `, k = `
605
+ `, C = `
559
606
  :host {
560
607
  /* Colors - Light Mode */
561
608
  --search-snippet-primary-color: #2563eb;
@@ -990,17 +1037,17 @@ const D = `<svg width="32" height="10" viewBox="0 0 412 186" xmlns="http://www.w
990
1037
  text-align: center;
991
1038
  }
992
1039
  `;
993
- function V(o) {
994
- let i = o;
995
- i = j(i), i = i.replace(/```([\s\S]*?)```/g, (n, c) => `<pre><code>${c.trim()}</code></pre>`);
1040
+ function Y(n) {
1041
+ let i = n;
1042
+ i = J(i), i = i.replace(/```([\s\S]*?)```/g, (o, c) => `<pre><code>${c.trim()}</code></pre>`);
996
1043
  const e = i.split(`
997
1044
  `), t = [];
998
1045
  let s = !1, r = "";
999
- for (let n = 0; n < e.length; n++) {
1000
- const c = e[n], l = c.match(/^(#{1,6})\s+(.+)$/);
1046
+ for (let o = 0; o < e.length; o++) {
1047
+ const c = e[o], l = c.match(/^(#{1,6})\s+(.+)$/);
1001
1048
  if (l) {
1002
- const p = l[1].length, C = l[2];
1003
- t.push(`<h${p}>${f(C)}</h${p}>`);
1049
+ const u = l[1].length, S = l[2];
1050
+ t.push(`<h${u}>${f(S)}</h${u}>`);
1004
1051
  continue;
1005
1052
  }
1006
1053
  if (c.match(/^---+$/)) {
@@ -1008,13 +1055,13 @@ function V(o) {
1008
1055
  continue;
1009
1056
  }
1010
1057
  if (c.match(/^>\s+/)) {
1011
- const p = c.replace(/^>\s+/, "");
1012
- t.push(`<blockquote>${f(p)}</blockquote>`);
1058
+ const u = c.replace(/^>\s+/, "");
1059
+ t.push(`<blockquote>${f(u)}</blockquote>`);
1013
1060
  continue;
1014
1061
  }
1015
- const v = c.match(/^[-*]\s+(.+)$/);
1016
- if (v) {
1017
- (!s || r !== "ul") && (s && t.push(`</${r}>`), t.push("<ul>"), s = !0, r = "ul"), t.push(`<li>${f(v[1])}</li>`);
1062
+ const p = c.match(/^[-*]\s+(.+)$/);
1063
+ if (p) {
1064
+ (!s || r !== "ul") && (s && t.push(`</${r}>`), t.push("<ul>"), s = !0, r = "ul"), t.push(`<li>${f(p[1])}</li>`);
1018
1065
  continue;
1019
1066
  }
1020
1067
  const b = c.match(/^\d+\.\s+(.+)$/);
@@ -1031,14 +1078,14 @@ function V(o) {
1031
1078
  return s && t.push(`</${r}>`), t.join(`
1032
1079
  `);
1033
1080
  }
1034
- function f(o) {
1035
- let i = o;
1081
+ function f(n) {
1082
+ let i = n;
1036
1083
  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(
1037
1084
  /\[([^\]]+)\]\(([^)]+)\)/g,
1038
1085
  '<a href="$2" target="_blank" rel="noopener noreferrer">$1</a>'
1039
1086
  ), i;
1040
1087
  }
1041
- function j(o) {
1088
+ function J(n) {
1042
1089
  const i = {
1043
1090
  "&": "&amp;",
1044
1091
  "<": "&lt;",
@@ -1046,9 +1093,9 @@ function j(o) {
1046
1093
  '"': "&quot;",
1047
1094
  "'": "&#39;"
1048
1095
  };
1049
- return o.replace(/[&<>"']/g, (e) => i[e] || e);
1096
+ return n.replace(/[&<>"']/g, (e) => i[e] || e);
1050
1097
  }
1051
- class B {
1098
+ class N {
1052
1099
  constructor(i, e, t) {
1053
1100
  a(this, "container");
1054
1101
  a(this, "client");
@@ -1127,13 +1174,13 @@ class B {
1127
1174
  */
1128
1175
  async sendMessage(i) {
1129
1176
  const e = {
1130
- id: E("msg"),
1177
+ id: M("msg"),
1131
1178
  role: "user",
1132
1179
  content: i,
1133
1180
  timestamp: Date.now()
1134
1181
  };
1135
1182
  this.addMessage(e), this.renderMessages(!0), this.setStreamingState(!0);
1136
- const t = E("msg"), s = {
1183
+ const t = M("msg"), s = {
1137
1184
  id: t,
1138
1185
  role: "assistant",
1139
1186
  content: "",
@@ -1142,19 +1189,19 @@ class B {
1142
1189
  this.addMessage(s), this.currentStreamingMessageId = t, this.renderMessages(!0);
1143
1190
  try {
1144
1191
  const r = this.client.chat(i);
1145
- let n = "";
1192
+ let o = "";
1146
1193
  for await (const l of r)
1147
1194
  if (l.type === "text" && l.message)
1148
- n += l.message, this.updateStreamingMessage(t, n);
1195
+ o += l.message, this.updateStreamingMessage(t, o);
1149
1196
  else if (l.type === "error") {
1150
1197
  this.showErrorInMessage(t, l.message || "Unknown error");
1151
1198
  break;
1152
1199
  }
1153
1200
  const c = this.messages.findIndex((l) => l.id === t);
1154
- c !== -1 && (this.messages[c].content = n), this.container.dispatchEvent(m("message", { message: s }));
1201
+ c !== -1 && (this.messages[c].content = o), this.container.dispatchEvent(v("message", { message: s }));
1155
1202
  } catch (r) {
1156
1203
  this.showErrorInMessage(t, r.message), this.container.dispatchEvent(
1157
- m("error", {
1204
+ v("error", {
1158
1205
  error: {
1159
1206
  message: r.message,
1160
1207
  code: "CHAT_ERROR"
@@ -1219,11 +1266,11 @@ class B {
1219
1266
  <div class="chat-message-avatar">${s}</div>
1220
1267
  <div class="chat-message-content">
1221
1268
  <div class="chat-message-bubble">
1222
- ${i.content ? `<div class="chat-message-text">${V(i.content)}</div>` : ""}
1223
- ${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">${u[this.loadingMessageIndex]}</span></div>` : ""}
1269
+ ${i.content ? `<div class="chat-message-text">${Y(i.content)}</div>` : ""}
1270
+ ${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>` : ""}
1224
1271
  </div>
1225
1272
  <div class="chat-message-metadata">
1226
- <span class="chat-message-time">${P(i.timestamp)}</span>
1273
+ <span class="chat-message-time">${_(i.timestamp)}</span>
1227
1274
  </div>
1228
1275
  </div>
1229
1276
  </div>
@@ -1244,8 +1291,8 @@ class B {
1244
1291
  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();
1245
1292
  }
1246
1293
  startLoadingMessages() {
1247
- this.loadingMessageIndex = Math.floor(Math.random() * u.length), this.loadingMessageInterval = setInterval(() => {
1248
- this.loadingMessageIndex = (this.loadingMessageIndex + 1) % u.length, this.isStreaming && this.renderMessages(!0);
1294
+ this.loadingMessageIndex = Math.floor(Math.random() * g.length), this.loadingMessageInterval = setInterval(() => {
1295
+ this.loadingMessageIndex = (this.loadingMessageIndex + 1) % g.length, this.isStreaming && this.renderMessages(!0);
1249
1296
  }, 2500);
1250
1297
  }
1251
1298
  clearLoadingMessages() {
@@ -1276,8 +1323,8 @@ class B {
1276
1323
  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;
1277
1324
  }
1278
1325
  }
1279
- const M = "chat-bubble-snippet";
1280
- class O extends HTMLElement {
1326
+ const L = "chat-bubble-snippet";
1327
+ class W extends HTMLElement {
1281
1328
  constructor() {
1282
1329
  super();
1283
1330
  a(this, "shadow");
@@ -1297,7 +1344,7 @@ class O extends HTMLElement {
1297
1344
  return ["api-url", "placeholder", "theme", "hide-branding"];
1298
1345
  }
1299
1346
  connectedCallback() {
1300
- this.render(), this.initializeClient(), this.dispatchEvent(m("ready", void 0));
1347
+ this.render(), this.initializeClient(), this.dispatchEvent(v("ready", void 0));
1301
1348
  }
1302
1349
  disconnectedCallback() {
1303
1350
  this.cleanup();
@@ -1310,7 +1357,7 @@ class O extends HTMLElement {
1310
1357
  apiUrl: d(this.getAttribute("api-url"), ""),
1311
1358
  placeholder: d(this.getAttribute("placeholder"), "Type a message..."),
1312
1359
  theme: d(this.getAttribute("theme"), "auto"),
1313
- hideBranding: g(this.getAttribute("hide-branding"), !1)
1360
+ hideBranding: m(this.getAttribute("hide-branding"), !1)
1314
1361
  };
1315
1362
  }
1316
1363
  initializeClient() {
@@ -1327,8 +1374,8 @@ class O extends HTMLElement {
1327
1374
  }
1328
1375
  render() {
1329
1376
  const e = document.createElement("style");
1330
- e.textContent = `${k}
1331
- ${q}
1377
+ e.textContent = `${C}
1378
+ ${H}
1332
1379
  ${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();
1333
1380
  }
1334
1381
  getBubbleStyles() {
@@ -1508,7 +1555,7 @@ ${this.getBubbleStyles()}`, this.container = document.createElement("div"), this
1508
1555
  </div>
1509
1556
  </div>
1510
1557
  <div class="chat-content"></div>
1511
- ${this.getProps().hideBranding ? "" : `<div class="powered-by">${y}</div>`}
1558
+ ${this.getProps().hideBranding ? "" : `<div class="powered-by">${k}</div>`}
1512
1559
  </div>
1513
1560
  `;
1514
1561
  }
@@ -1548,7 +1595,7 @@ ${this.getBubbleStyles()}`, this.container = document.createElement("div"), this
1548
1595
  return;
1549
1596
  }
1550
1597
  const t = this.getProps();
1551
- this.chatView = new B(e, this.client, t);
1598
+ this.chatView = new N(e, this.client, t);
1552
1599
  }
1553
1600
  updateTheme(e) {
1554
1601
  (e === "light" || e === "dark" ? e : null) === null && this.hasAttribute("theme") && this.getAttribute("theme") !== "auto" && this.removeAttribute("theme");
@@ -1567,9 +1614,9 @@ ${this.getBubbleStyles()}`, this.container = document.createElement("div"), this
1567
1614
  return this.chatView?.getMessages() || [];
1568
1615
  }
1569
1616
  }
1570
- customElements.get(M) || customElements.define(M, O);
1571
- const L = "chat-page-snippet", I = "chat-page-sessions";
1572
- class K extends HTMLElement {
1617
+ customElements.get(L) || customElements.define(L, W);
1618
+ const I = "chat-page-snippet", z = "chat-page-sessions";
1619
+ class X extends HTMLElement {
1573
1620
  constructor() {
1574
1621
  super();
1575
1622
  a(this, "shadow");
@@ -1591,7 +1638,7 @@ class K extends HTMLElement {
1591
1638
  return ["api-url", "placeholder", "theme", "hide-branding"];
1592
1639
  }
1593
1640
  connectedCallback() {
1594
- this.render(), this.initializeClient(), this.setupView(), this.dispatchEvent(m("ready", void 0));
1641
+ this.render(), this.initializeClient(), this.setupView(), this.dispatchEvent(v("ready", void 0));
1595
1642
  }
1596
1643
  disconnectedCallback() {
1597
1644
  this.saveCurrentSession(), this.cleanup();
@@ -1604,7 +1651,7 @@ class K extends HTMLElement {
1604
1651
  apiUrl: d(this.getAttribute("api-url"), ""),
1605
1652
  placeholder: d(this.getAttribute("placeholder"), "Type a message..."),
1606
1653
  theme: d(this.getAttribute("theme"), "auto"),
1607
- hideBranding: g(this.getAttribute("hide-branding"), !1)
1654
+ hideBranding: m(this.getAttribute("hide-branding"), !1)
1608
1655
  };
1609
1656
  }
1610
1657
  initializeClient() {
@@ -1621,8 +1668,8 @@ class K extends HTMLElement {
1621
1668
  }
1622
1669
  render() {
1623
1670
  const e = document.createElement("style");
1624
- e.textContent = `${k}
1625
- ${q}
1671
+ e.textContent = `${C}
1672
+ ${H}
1626
1673
  ${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();
1627
1674
  }
1628
1675
  getPageStyles() {
@@ -1914,7 +1961,7 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
1914
1961
  New Chat
1915
1962
  </button>
1916
1963
  <div class="chat-list"></div>
1917
- ${this.getProps().hideBranding ? "" : `<div class="powered-by">${y}</div>`}
1964
+ ${this.getProps().hideBranding ? "" : `<div class="powered-by">${k}</div>`}
1918
1965
  </div>
1919
1966
  <div class="chat-main">
1920
1967
  <div class="chat-page-header">
@@ -1948,11 +1995,11 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
1948
1995
  }
1949
1996
  attachEventListeners() {
1950
1997
  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");
1951
- 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);
1998
+ 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);
1952
1999
  }
1953
2000
  removeEventListeners() {
1954
- 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");
1955
- 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;
2001
+ 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");
2002
+ 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;
1956
2003
  }
1957
2004
  setupView() {
1958
2005
  const e = this.shadow.querySelector(".container");
@@ -1966,7 +2013,7 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
1966
2013
  }
1967
2014
  if (!e) return;
1968
2015
  const t = this.getProps();
1969
- if (this.chatView = new B(e, this.client, t), this.sessions.length === 0)
2016
+ if (this.chatView = new N(e, this.client, t), this.sessions.length === 0)
1970
2017
  this.createNewChat();
1971
2018
  else {
1972
2019
  const s = this.sessions[0];
@@ -1981,7 +2028,7 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
1981
2028
  }
1982
2029
  loadSessions() {
1983
2030
  try {
1984
- const e = localStorage.getItem(I);
2031
+ const e = localStorage.getItem(z);
1985
2032
  e && (this.sessions = JSON.parse(e), this.sessions.sort((t, s) => s.updatedAt - t.updatedAt));
1986
2033
  } catch (e) {
1987
2034
  console.error("Failed to load chat sessions:", e);
@@ -1989,7 +2036,7 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
1989
2036
  }
1990
2037
  saveSessions() {
1991
2038
  try {
1992
- localStorage.setItem(I, JSON.stringify(this.sessions));
2039
+ localStorage.setItem(z, JSON.stringify(this.sessions));
1993
2040
  } catch (e) {
1994
2041
  console.error("Failed to save chat sessions:", e);
1995
2042
  }
@@ -2040,14 +2087,14 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
2040
2087
  const t = e.target, s = t.closest(".chat-list-item-delete");
2041
2088
  if (s) {
2042
2089
  e.stopPropagation();
2043
- const n = s.getAttribute("data-session-id");
2044
- n && this.deleteSession(n);
2090
+ const o = s.getAttribute("data-session-id");
2091
+ o && this.deleteSession(o);
2045
2092
  return;
2046
2093
  }
2047
2094
  const r = t.closest(".chat-list-item");
2048
2095
  if (r) {
2049
- const n = r.getAttribute("data-session-id");
2050
- n && this.switchToSession(n);
2096
+ const o = r.getAttribute("data-session-id");
2097
+ o && this.switchToSession(o);
2051
2098
  }
2052
2099
  }
2053
2100
  renderChatList() {
@@ -2077,8 +2124,8 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
2077
2124
  `;
2078
2125
  }
2079
2126
  formatDate(e) {
2080
- const t = new Date(e), r = (/* @__PURE__ */ new Date()).getTime() - t.getTime(), n = Math.floor(r / (1e3 * 60 * 60 * 24));
2081
- return n === 0 ? t.toLocaleTimeString(void 0, { hour: "2-digit", minute: "2-digit" }) : n === 1 ? "Yesterday" : n < 7 ? t.toLocaleDateString(void 0, { weekday: "long" }) : t.toLocaleDateString(void 0, { month: "short", day: "numeric" });
2127
+ const t = new Date(e), r = (/* @__PURE__ */ new Date()).getTime() - t.getTime(), o = Math.floor(r / (1e3 * 60 * 60 * 24));
2128
+ 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" });
2082
2129
  }
2083
2130
  escapeHTML(e) {
2084
2131
  const t = document.createElement("div");
@@ -2107,8 +2154,8 @@ ${this.getPageStyles()}`, this.container = document.createElement("div"), this.c
2107
2154
  return this.sessions.find((e) => e.id === this.currentSessionId) || null;
2108
2155
  }
2109
2156
  }
2110
- customElements.get(L) || customElements.define(L, K);
2111
- const G = `
2157
+ customElements.get(I) || customElements.define(I, X);
2158
+ const Z = `
2112
2159
  /* Search view states */
2113
2160
  .search-view {
2114
2161
  transition: var(--search-snippet-transition-slow);
@@ -2478,8 +2525,8 @@ a.search-result-item:focus-visible {
2478
2525
  border-radius: 2px;
2479
2526
  font-weight: var(--search-snippet-font-weight-medium);
2480
2527
  }
2481
- `, z = "search-bar-snippet", F = 10, Y = 100;
2482
- class W extends HTMLElement {
2528
+ `, A = "search-bar-snippet", Q = 10, ee = 100;
2529
+ class te extends HTMLElement {
2483
2530
  constructor() {
2484
2531
  super();
2485
2532
  a(this, "shadow");
@@ -2510,11 +2557,12 @@ class W extends HTMLElement {
2510
2557
  "show-url",
2511
2558
  "show-date",
2512
2559
  "hide-thumbnails",
2513
- "see-more"
2560
+ "see-more",
2561
+ "request-options"
2514
2562
  ];
2515
2563
  }
2516
2564
  connectedCallback() {
2517
- this.initializeClient(), this.render(), this.dispatchEvent(m("ready", void 0));
2565
+ this.initializeClient(), this.render(), this.dispatchEvent(v("ready", void 0));
2518
2566
  }
2519
2567
  disconnectedCallback() {
2520
2568
  this.cleanup();
@@ -2526,16 +2574,29 @@ class W extends HTMLElement {
2526
2574
  return {
2527
2575
  apiUrl: d(this.getAttribute("api-url"), ""),
2528
2576
  placeholder: d(this.getAttribute("placeholder"), "Search..."),
2529
- maxResults: w(this.getAttribute("max-results"), 10),
2530
- debounceMs: w(this.getAttribute("debounce-ms"), 300),
2577
+ maxResults: y(this.getAttribute("max-results"), 10),
2578
+ debounceMs: y(this.getAttribute("debounce-ms"), 300),
2531
2579
  theme: d(this.getAttribute("theme"), "auto"),
2532
- hideBranding: g(this.getAttribute("hide-branding"), !1),
2533
- showUrl: g(this.getAttribute("show-url"), !1),
2534
- showDate: g(this.getAttribute("show-date"), !1),
2535
- hideThumbnails: g(this.getAttribute("hide-thumbnails"), !1),
2580
+ hideBranding: m(this.getAttribute("hide-branding"), !1),
2581
+ showUrl: m(this.getAttribute("show-url"), !1),
2582
+ showDate: m(this.getAttribute("show-date"), !1),
2583
+ hideThumbnails: m(this.getAttribute("hide-thumbnails"), !1),
2536
2584
  seeMore: d(this.getAttribute("see-more"), "")
2537
2585
  };
2538
2586
  }
2587
+ getRequestOptions() {
2588
+ const e = this.getAttribute("request-options");
2589
+ if (e)
2590
+ try {
2591
+ const t = JSON.parse(e);
2592
+ if (t === null || typeof t != "object" || Array.isArray(t))
2593
+ throw new Error("request-options must be a JSON object");
2594
+ return t;
2595
+ } catch (t) {
2596
+ console.error("SearchBarSnippet: invalid request-options attribute", t);
2597
+ return;
2598
+ }
2599
+ }
2539
2600
  initializeClient() {
2540
2601
  const e = this.getProps();
2541
2602
  if (!e.apiUrl) {
@@ -2550,13 +2611,13 @@ class W extends HTMLElement {
2550
2611
  }
2551
2612
  render() {
2552
2613
  const e = this.getProps(), t = (r) => this.performSearch(r);
2553
- this.debouncedSearch = A(
2614
+ this.debouncedSearch = $(
2554
2615
  t,
2555
2616
  e.debounceMs || 400
2556
2617
  );
2557
2618
  const s = document.createElement("style");
2558
- s.textContent = `${k}
2559
- ${G}`, this.container = document.createElement("div"), this.container.className = "container", this.container.innerHTML = `
2619
+ s.textContent = `${C}
2620
+ ${Z}`, this.container = document.createElement("div"), this.container.className = "container", this.container.innerHTML = `
2560
2621
  <div class="search-view">
2561
2622
  <div class="search-input-wrapper">
2562
2623
  <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>
@@ -2604,10 +2665,10 @@ ${G}`, this.container = document.createElement("div"), this.container.className
2604
2665
  this.currentSearchController && (this.currentSearchController.abort(), this.currentSearchController = null), this.currentSearchController = new AbortController(), this.showLoadingState();
2605
2666
  try {
2606
2667
  const t = await this.client.search(e, {
2607
- streaming: !1,
2608
2668
  signal: this.currentSearchController.signal,
2609
- maxResults: Y
2610
- }), s = this.getProps(), r = t.slice(0, s.maxResults || F);
2669
+ maxResults: ee,
2670
+ request: this.getRequestOptions()
2671
+ }), s = this.getProps(), r = t.slice(0, s.maxResults || Q);
2611
2672
  this.displayResults(r, e, t.length);
2612
2673
  } catch (t) {
2613
2674
  if (t.name === "AbortError")
@@ -2623,7 +2684,7 @@ ${G}`, this.container = document.createElement("div"), this.container.className
2623
2684
  this.showNoResultsState(t);
2624
2685
  return;
2625
2686
  }
2626
- const r = this.getProps(), n = r.hideBranding ? "" : `<div class="powered-by-inline">${y}</div>`, c = s > e.length, l = c ? `Showing ${e.length} of ${s} results` : `Found ${s} result${s === 1 ? "" : "s"}`, v = r.seeMore && c ? `<div class="search-footer">
2687
+ 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">
2627
2688
  <a href="${h(r.seeMore + encodeURIComponent(t))}" class="search-see-more">
2628
2689
  <span>See more results</span>
2629
2690
  <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>
@@ -2633,19 +2694,19 @@ ${G}`, this.container = document.createElement("div"), this.container.className
2633
2694
  <div class="search-count">
2634
2695
  ${l}
2635
2696
  </div>
2636
- ${n}
2697
+ ${o}
2637
2698
  </div>
2638
2699
  <div class="search-results">
2639
- ${e.map((p) => this.renderResult(p)).join("")}
2700
+ ${e.map((u) => this.renderResult(u)).join("")}
2640
2701
  </div>
2641
- ${v}
2702
+ ${p}
2642
2703
  `;
2643
2704
  this.resultsContainer.innerHTML = b, this.attachResultHandlers();
2644
2705
  }
2645
2706
  renderResult(e) {
2646
- const t = this.getProps(), s = t.hideThumbnails ? "" : this.renderResultImage(e.image, e.title), r = e.url ? h(e.url) : "#", n = t.showDate && e.timestamp !== void 0 ? `<div class="search-result-date">${h($(e.timestamp))}</div>` : "", c = t.showUrl && e.url || n ? `<div class="search-result-metadata">
2647
- ${t.showUrl && e.url ? `<span class="search-result-url">${h(e.url)}</span>` : '<span class="search-result-url search-result-url-empty"></span>'}
2648
- ${n}
2707
+ 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">
2708
+ ${t.showUrl && e.url ? `<span class="search-result-url">${o}</span>` : '<span class="search-result-url search-result-url-empty"></span>'}
2709
+ ${c}
2649
2710
  </div>` : "";
2650
2711
  return `
2651
2712
  <a href="${r}" class="search-result-item" data-result-id="${h(e.url || "")}">
@@ -2653,7 +2714,7 @@ ${G}`, this.container = document.createElement("div"), this.container.className
2653
2714
  <div class="search-result-content">
2654
2715
  <div class="search-result-title">${h(e.title || "")}</div>
2655
2716
  <div class="search-result-snippet">${h(e.description || "")}</div>
2656
- ${c}
2717
+ ${l}
2657
2718
  </div>
2658
2719
  </a>
2659
2720
  `;
@@ -2681,8 +2742,8 @@ ${G}`, this.container = document.createElement("div"), this.container.className
2681
2742
  const e = this.container?.querySelectorAll(".search-result-item");
2682
2743
  if (!e) return;
2683
2744
  for (const s of e)
2684
- s.getAttribute("href") === "#" && s.addEventListener("click", (n) => {
2685
- n.preventDefault();
2745
+ s.getAttribute("href") === "#" && s.addEventListener("click", (o) => {
2746
+ o.preventDefault();
2686
2747
  });
2687
2748
  this.container?.querySelectorAll(".search-result-image")?.forEach((s) => {
2688
2749
  s.addEventListener("load", () => {
@@ -2690,26 +2751,26 @@ ${G}`, this.container = document.createElement("div"), this.container.className
2690
2751
  }), s.addEventListener("error", () => {
2691
2752
  const r = s.closest(".search-result-image-container");
2692
2753
  r?.querySelector(".search-result-image-loading")?.remove();
2693
- const n = r?.querySelector(
2754
+ const o = r?.querySelector(
2694
2755
  ".search-result-image-placeholder"
2695
2756
  );
2696
- n && (n.style.display = "flex"), s.style.display = "none";
2757
+ o && (o.style.display = "flex"), s.style.display = "none";
2697
2758
  });
2698
2759
  });
2699
2760
  }
2700
2761
  showLoadingState() {
2701
- this.resultsContainer && (this.clearLoadingInterval(), this.loadingMessageIndex = Math.floor(Math.random() * u.length), this.resultsContainer.innerHTML = `
2762
+ this.resultsContainer && (this.clearLoadingInterval(), this.loadingMessageIndex = Math.floor(Math.random() * g.length), this.resultsContainer.innerHTML = `
2702
2763
  <div class="search-loading">
2703
2764
  <div class="loading" aria-label="Loading"></div>
2704
- <div class="loading-text loading-text-animate">${u[this.loadingMessageIndex]}</div>
2765
+ <div class="loading-text loading-text-animate">${g[this.loadingMessageIndex]}</div>
2705
2766
  </div>
2706
2767
  `, this.startLoadingInterval());
2707
2768
  }
2708
2769
  startLoadingInterval() {
2709
2770
  this.loadingMessageInterval = setInterval(() => {
2710
- this.loadingMessageIndex = (this.loadingMessageIndex + 1) % u.length;
2771
+ this.loadingMessageIndex = (this.loadingMessageIndex + 1) % g.length;
2711
2772
  const e = this.resultsContainer?.querySelector(".loading-text");
2712
- e && (e.classList.remove("loading-text-animate"), e.offsetWidth, e.textContent = u[this.loadingMessageIndex], e.classList.add("loading-text-animate"));
2773
+ e && (e.classList.remove("loading-text-animate"), e.offsetWidth, e.textContent = g[this.loadingMessageIndex], e.classList.add("loading-text-animate"));
2713
2774
  }, 2500);
2714
2775
  }
2715
2776
  clearLoadingInterval() {
@@ -2765,8 +2826,8 @@ ${G}`, this.container = document.createElement("div"), this.container.className
2765
2826
  await this.performSearch(e);
2766
2827
  }
2767
2828
  }
2768
- customElements.get(z) || customElements.define(z, W);
2769
- const X = `
2829
+ customElements.get(A) || customElements.define(A, te);
2830
+ const se = `
2770
2831
  /* Modal backdrop */
2771
2832
  .modal-backdrop {
2772
2833
  position: fixed;
@@ -3203,8 +3264,8 @@ a.modal-result-item:focus-visible {
3203
3264
  .modal-container.open {
3204
3265
  animation: modal-slide-in var(--search-snippet-transition) ease-out;
3205
3266
  }
3206
- `, T = "search-modal-snippet", J = 10, Z = 100;
3207
- class Q extends HTMLElement {
3267
+ `, T = "search-modal-snippet", ie = 10, re = 100;
3268
+ class ae extends HTMLElement {
3208
3269
  constructor() {
3209
3270
  super();
3210
3271
  a(this, "shadow");
@@ -3244,11 +3305,12 @@ class Q extends HTMLElement {
3244
3305
  "show-url",
3245
3306
  "show-date",
3246
3307
  "hide-thumbnails",
3247
- "see-more"
3308
+ "see-more",
3309
+ "request-options"
3248
3310
  ];
3249
3311
  }
3250
3312
  connectedCallback() {
3251
- this.initializeClient(), this.render(), this.attachGlobalKeyboardShortcut(), this.dispatchEvent(m("ready", void 0));
3313
+ this.initializeClient(), this.render(), this.attachGlobalKeyboardShortcut(), this.dispatchEvent(v("ready", void 0));
3252
3314
  }
3253
3315
  disconnectedCallback() {
3254
3316
  this.cleanup();
@@ -3260,18 +3322,31 @@ class Q extends HTMLElement {
3260
3322
  return {
3261
3323
  apiUrl: d(this.getAttribute("api-url"), ""),
3262
3324
  placeholder: d(this.getAttribute("placeholder"), "Search..."),
3263
- maxResults: w(this.getAttribute("max-results"), 10),
3264
- debounceMs: w(this.getAttribute("debounce-ms"), 300),
3325
+ maxResults: y(this.getAttribute("max-results"), 10),
3326
+ debounceMs: y(this.getAttribute("debounce-ms"), 300),
3265
3327
  theme: d(this.getAttribute("theme"), "auto"),
3266
3328
  shortcut: d(this.getAttribute("shortcut"), "k"),
3267
3329
  useMetaKey: this.getAttribute("use-meta-key") !== "false",
3268
- hideBranding: g(this.getAttribute("hide-branding"), !1),
3269
- showUrl: g(this.getAttribute("show-url"), !1),
3270
- showDate: g(this.getAttribute("show-date"), !1),
3271
- hideThumbnails: g(this.getAttribute("hide-thumbnails"), !1),
3330
+ hideBranding: m(this.getAttribute("hide-branding"), !1),
3331
+ showUrl: m(this.getAttribute("show-url"), !1),
3332
+ showDate: m(this.getAttribute("show-date"), !1),
3333
+ hideThumbnails: m(this.getAttribute("hide-thumbnails"), !1),
3272
3334
  seeMore: d(this.getAttribute("see-more"), "")
3273
3335
  };
3274
3336
  }
3337
+ getRequestOptions() {
3338
+ const e = this.getAttribute("request-options");
3339
+ if (e)
3340
+ try {
3341
+ const t = JSON.parse(e);
3342
+ if (t === null || typeof t != "object" || Array.isArray(t))
3343
+ throw new Error("request-options must be a JSON object");
3344
+ return t;
3345
+ } catch (t) {
3346
+ console.error("SearchModalSnippet: invalid request-options attribute", t);
3347
+ return;
3348
+ }
3349
+ }
3275
3350
  initializeClient() {
3276
3351
  const e = this.getProps();
3277
3352
  if (!e.apiUrl) {
@@ -3286,15 +3361,15 @@ class Q extends HTMLElement {
3286
3361
  }
3287
3362
  render() {
3288
3363
  const e = this.getProps(), t = (c) => this.performSearch(c);
3289
- this.debouncedSearch = A(
3364
+ this.debouncedSearch = $(
3290
3365
  t,
3291
3366
  e.debounceMs || 300
3292
3367
  );
3293
3368
  const s = document.createElement("style");
3294
- s.textContent = `${k}
3295
- ${X}`;
3296
- const r = e.hideBranding ? "" : `<div class="powered-by-inline">${y}</div>`, n = document.createElement("div");
3297
- n.innerHTML = `
3369
+ s.textContent = `${C}
3370
+ ${se}`;
3371
+ const r = e.hideBranding ? "" : `<div class="powered-by-inline">${k}</div>`, o = document.createElement("div");
3372
+ o.innerHTML = `
3298
3373
  <div class="modal-backdrop" role="presentation"></div>
3299
3374
  <div class="modal-container" role="dialog" aria-modal="true" aria-labelledby="modal-title">
3300
3375
  <div class="modal-header">
@@ -3337,7 +3412,7 @@ ${X}`;
3337
3412
  ${r}
3338
3413
  </div>
3339
3414
  </div>
3340
- `, this.shadow.innerHTML = "", this.shadow.appendChild(s), this.shadow.appendChild(n), 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();
3415
+ `, 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();
3341
3416
  }
3342
3417
  attachGlobalKeyboardShortcut() {
3343
3418
  const e = this.getProps(), t = e.shortcut?.toLowerCase() || "k";
@@ -3387,7 +3462,7 @@ ${X}`;
3387
3462
  }
3388
3463
  const e = this.results[this.activeIndex];
3389
3464
  this.dispatchEvent(
3390
- m("result-select", {
3465
+ v("result-select", {
3391
3466
  result: e,
3392
3467
  index: this.activeIndex
3393
3468
  })
@@ -3405,11 +3480,11 @@ ${X}`;
3405
3480
  this.currentSearchController && (this.currentSearchController.abort(), this.currentSearchController = null), this.currentSearchController = new AbortController(), this.showLoadingState();
3406
3481
  try {
3407
3482
  const t = await this.client.search(e, {
3408
- streaming: !1,
3409
3483
  signal: this.currentSearchController.signal,
3410
- maxResults: Z
3484
+ maxResults: re,
3485
+ request: this.getRequestOptions()
3411
3486
  }), s = this.getProps();
3412
- this.results = t.slice(0, s.maxResults || J), this.activeIndex = this.results.length > 0 ? 0 : -1, this.displayResults(this.results, e, t.length);
3487
+ this.results = t.slice(0, s.maxResults || ie), this.activeIndex = this.results.length > 0 ? 0 : -1, this.displayResults(this.results, e, t.length);
3413
3488
  } catch (t) {
3414
3489
  if (t.name === "AbortError")
3415
3490
  return;
@@ -3419,25 +3494,25 @@ ${X}`;
3419
3494
  }
3420
3495
  }
3421
3496
  displayResults(e, t, s = e.length) {
3422
- if (console.log({ results: e, query: t, totalResults: s }), this.clearLoadingInterval(), !this.resultsContainer) return;
3497
+ if (this.clearLoadingInterval(), !this.resultsContainer) return;
3423
3498
  if (e.length === 0) {
3424
3499
  this.showNoResultsState(t);
3425
3500
  return;
3426
3501
  }
3427
- const r = this.getProps(), n = e.map((b, p) => this.renderResult(b, p)).join(""), c = s > e.length, l = c ? `Showing ${e.length} of ${s} results` : `${s} result${s === 1 ? "" : "s"}`, v = r.seeMore && c ? `<a href="${h(r.seeMore + encodeURIComponent(t))}" class="modal-see-more">
3502
+ 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">
3428
3503
  <span>See more results</span>
3429
3504
  <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>
3430
3505
  </a>` : "";
3431
- this.resultsContainer.innerHTML = n + v, this.footerCount && (this.footerCount.textContent = l), this.inputElement && this.inputElement.setAttribute("aria-expanded", "true"), this.attachResultHandlers(), this.updateActiveResult();
3506
+ this.resultsContainer.innerHTML = o + p, this.footerCount && (this.footerCount.textContent = l), this.inputElement && this.inputElement.setAttribute("aria-expanded", "true"), this.attachResultHandlers(), this.updateActiveResult();
3432
3507
  }
3433
3508
  renderResult(e, t) {
3434
- const s = this.getProps(), r = s.hideThumbnails ? "" : this.renderResultImage(e.image, e.title), n = e.url ? h(e.url) : "#", c = s.showDate && e.timestamp !== void 0 ? `<div class="modal-result-date">${h($(e.timestamp))}</div>` : "", l = s.showUrl && e.url || c ? `<div class="modal-result-metadata">
3435
- ${s.showUrl && e.url ? `<span class="modal-result-url">${h(e.url)}</span>` : '<span class="modal-result-url modal-result-url-empty"></span>'}
3436
- ${c}
3509
+ 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">
3510
+ ${s.showUrl && e.url ? `<span class="modal-result-url">${c}</span>` : '<span class="modal-result-url modal-result-url-empty"></span>'}
3511
+ ${l}
3437
3512
  </div>` : "";
3438
3513
  return `
3439
3514
  <a
3440
- href="${n}"
3515
+ href="${o}"
3441
3516
  class="modal-result-item${t === this.activeIndex ? " active" : ""}"
3442
3517
  role="option"
3443
3518
  id="result-${t}"
@@ -3450,7 +3525,7 @@ ${X}`;
3450
3525
  <div class="modal-result-content">
3451
3526
  <div class="modal-result-title">${h(e.title || "")}</div>
3452
3527
  ${e.description ? `<div class="modal-result-description">${h(e.description)}</div>` : ""}
3453
- ${l}
3528
+ ${p}
3454
3529
  </div>
3455
3530
  </a>
3456
3531
  `;
@@ -3489,10 +3564,10 @@ ${X}`;
3489
3564
  }), s.addEventListener("error", () => {
3490
3565
  const r = s.closest(".modal-result-image-container");
3491
3566
  r?.querySelector(".modal-result-image-loading")?.remove();
3492
- const n = r?.querySelector(
3567
+ const o = r?.querySelector(
3493
3568
  ".modal-result-image-placeholder"
3494
3569
  );
3495
- n && (n.style.display = "flex"), s.style.display = "none";
3570
+ o && (o.style.display = "flex"), s.style.display = "none";
3496
3571
  });
3497
3572
  });
3498
3573
  }
@@ -3511,18 +3586,18 @@ ${X}`;
3511
3586
  this.clearLoadingInterval(), this.resultsContainer && (this.resultsContainer.innerHTML = this.renderEmptyState(), this.footerCount && (this.footerCount.textContent = ""), this.inputElement && this.inputElement.setAttribute("aria-expanded", "false"));
3512
3587
  }
3513
3588
  showLoadingState() {
3514
- this.resultsContainer && (this.clearLoadingInterval(), this.loadingMessageIndex = Math.floor(Math.random() * u.length), this.resultsContainer.innerHTML = `
3589
+ this.resultsContainer && (this.clearLoadingInterval(), this.loadingMessageIndex = Math.floor(Math.random() * g.length), this.resultsContainer.innerHTML = `
3515
3590
  <div class="modal-loading">
3516
3591
  <div class="loading" aria-label="Loading"></div>
3517
- <div class="loading-text loading-text-animate">${u[this.loadingMessageIndex]}</div>
3592
+ <div class="loading-text loading-text-animate">${g[this.loadingMessageIndex]}</div>
3518
3593
  </div>
3519
- `, this.footerCount && (this.footerCount.textContent = u[this.loadingMessageIndex]), this.startLoadingInterval());
3594
+ `, this.footerCount && (this.footerCount.textContent = g[this.loadingMessageIndex]), this.startLoadingInterval());
3520
3595
  }
3521
3596
  startLoadingInterval() {
3522
3597
  this.loadingMessageInterval = setInterval(() => {
3523
- this.loadingMessageIndex = (this.loadingMessageIndex + 1) % u.length;
3598
+ this.loadingMessageIndex = (this.loadingMessageIndex + 1) % g.length;
3524
3599
  const e = this.resultsContainer?.querySelector(".loading-text");
3525
- e && (e.classList.remove("loading-text-animate"), e.offsetWidth, e.textContent = u[this.loadingMessageIndex], e.classList.add("loading-text-animate")), this.footerCount && (this.footerCount.textContent = u[this.loadingMessageIndex]);
3600
+ 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]);
3526
3601
  }, 2500);
3527
3602
  }
3528
3603
  clearLoadingInterval() {
@@ -3580,13 +3655,13 @@ ${X}`;
3580
3655
  requestAnimationFrame(() => {
3581
3656
  this.inputElement?.focus();
3582
3657
  });
3583
- }), this.lockBodyScroll(), this.dispatchEvent(m("open", void 0)));
3658
+ }), this.lockBodyScroll(), this.dispatchEvent(v("open", void 0)));
3584
3659
  }
3585
3660
  /**
3586
3661
  * Close the search modal
3587
3662
  */
3588
3663
  close() {
3589
- 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(m("close", void 0)));
3664
+ 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)));
3590
3665
  }
3591
3666
  /**
3592
3667
  * Toggle the search modal open/closed
@@ -3613,13 +3688,13 @@ ${X}`;
3613
3688
  return this.isOpen;
3614
3689
  }
3615
3690
  }
3616
- customElements.get(T) || customElements.define(T, Q);
3691
+ customElements.get(T) || customElements.define(T, ae);
3617
3692
  export {
3618
- _ as AISearchClient,
3619
- O as ChatBubbleSnippet,
3620
- K as ChatPageSnippet,
3621
- W as SearchBarSnippet,
3622
- Q as SearchModalSnippet,
3623
- W as default
3693
+ K as AISearchClient,
3694
+ W as ChatBubbleSnippet,
3695
+ X as ChatPageSnippet,
3696
+ te as SearchBarSnippet,
3697
+ ae as SearchModalSnippet,
3698
+ te as default
3624
3699
  };
3625
3700
  //# sourceMappingURL=search-snippet.es.js.map