@askdialog/dialog-react 0.0.0-beta-20260909090007 → 0.0.0-beta-20260911075342

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.
package/README.md CHANGED
@@ -38,7 +38,7 @@ import '@askdialog/dialog-react/style.css';
38
38
 
39
39
  const client = new Dialog({
40
40
  apiKey: 'your-api-key',
41
- locale: 'en',
41
+ locale: 'en', currency: 'EUR',
42
42
  callbacks: {
43
43
  addToCart: () => Promise.resolve(),
44
44
  getProduct: () => Promise.resolve({
@@ -105,7 +105,7 @@ Standalone input component for asking questions.
105
105
 
106
106
  ### Storefront search
107
107
 
108
- React binding of the SDK search controller (`createSearchController`): debounce, cancellation, stale-response protection, pagination and search attribution analytics all come from the SDK — these components only render and route.
108
+ `useDialogSearch` binds the SDK controller to component state. The controller manages requests and analytics; components handle rendering and navigation.
109
109
 
110
110
  ```tsx
111
111
  import { Dialog } from '@askdialog/dialog-sdk';
@@ -116,10 +116,10 @@ import {
116
116
  } from '@askdialog/dialog-react';
117
117
  import '@askdialog/dialog-react/style.css';
118
118
 
119
- const client = new Dialog({ apiKey: 'your-api-key', locale: 'en' });
119
+ const client = new Dialog({ apiKey: 'your-api-key', locale: 'en-US', currency: 'USD' });
120
120
 
121
121
  function SearchPage() {
122
- const { controller, state } = useDialogSearch({ client });
122
+ const { controller, state } = useDialogSearch({ client, language: 'en', currency: client.currency });
123
123
 
124
124
  return (
125
125
  <>
@@ -136,11 +136,14 @@ Creates one search controller per hook instance and disposes it on unmount.
136
136
 
137
137
  **Options:**
138
138
  - `client` (Dialog) - Dialog SDK client instance (required)
139
+ - `language` (string, required) - Lowercase ISO 639-1 language code, e.g. `fr`
140
+ - `currency` (string, required) - ISO 4217 currency, e.g. `EUR`
139
141
  - `surface` (SearchSurface, optional) - Where results are displayed, for analytics (default: `'search_page'`)
140
142
  - `navigate` ((url, hit) => void, optional) - Router adapter called after selection attribution (e.g. `(url) => router.push(url)`). Omit it to let the cards' plain `<a href>` links navigate natively.
141
143
  - `debounceMs` (number, optional) - Keystroke debounce (default: 250)
142
144
  - `hitsPerPage` (number, optional) - Results per page (default: 12)
143
- - `locale` (string, optional) - Storefront locale naming the searched index (`products_fr`); defaults to the client's
145
+
146
+ Search language and currency are explicit and independent of `client.locale`, which can be a regional locale such as `fr-FR`.
144
147
 
145
148
  **Returns:** `{ controller, state }` — pass both to the components below. `state.status` is `idle` / `loading` / `success` / `empty` / `error`.
146
149
 
@@ -161,7 +164,6 @@ Floating results panel overlaying the page content: portaled to `document.body`
161
164
  **Props:**
162
165
  - `controller` (SearchController) - From `useDialogSearch` (required)
163
166
  - `state` (SearchControllerState) - From `useDialogSearch` (required)
164
- - `locale` (string, optional) - BCP 47 locale used to format the card prices via `Intl.NumberFormat` (browser default when omitted)
165
167
 
166
168
  #### DialogSearchPagination
167
169
 
@@ -1,18 +1,20 @@
1
1
  import { Dialog, SearchController, SearchControllerState, SearchHit, SearchSurface } from '@askdialog/dialog-sdk';
2
2
  export interface UseDialogSearchOptions {
3
3
  client: Dialog;
4
- /** Where the results are displayed, for search analytics. */
4
+ /** Lowercase ISO 639-1 language code, e.g. `fr`. */
5
+ language: string;
6
+ /** ISO 4217 currency, independent of language. */
7
+ currency: string;
8
+ /** UI surface used in search analytics. */
5
9
  surface?: SearchSurface;
6
- /** Router adapter called after selection attribution; omit to let the cards' `<a href>` navigate natively. */
10
+ /** Navigate after recording selection; omit to use native links. */
7
11
  navigate?: (url: string, hit: SearchHit) => void;
8
12
  debounceMs?: number;
9
13
  hitsPerPage?: number;
10
- /** Storefront locale for the searched index (`products_fr`); defaults to the client's. */
11
- locale?: string;
12
14
  }
13
15
  export interface DialogSearch {
14
16
  controller: SearchController;
15
17
  state: SearchControllerState;
16
18
  }
17
- /** Options are read when the controller is created — later changes don't rebind a live controller. */
19
+ /** Options are fixed when the controller is created. */
18
20
  export declare const useDialogSearch: (options: UseDialogSearchOptions) => DialogSearch;
@@ -47,13 +47,13 @@ const H = ({
47
47
  questions: t,
48
48
  productId: s,
49
49
  productTitle: r,
50
- selectedVariantId: i
50
+ selectedVariantId: a
51
51
  }) => {
52
52
  const c = (l) => {
53
53
  e.sendProductMessage({
54
54
  productId: s,
55
55
  productTitle: r,
56
- selectedVariantId: i,
56
+ selectedVariantId: a,
57
57
  question: l,
58
58
  fromQuestionSuggestion: !0
59
59
  });
@@ -79,7 +79,7 @@ const H = ({
79
79
  questions: t,
80
80
  isLoading: s,
81
81
  productId: r,
82
- productTitle: i,
82
+ productTitle: a,
83
83
  selectedVariantId: c
84
84
  }) => /* @__PURE__ */ n("div", { className: "dialog-block-suggestions-container", children: s || !t ? /* @__PURE__ */ n(O, {}) : /* @__PURE__ */ n(
85
85
  j,
@@ -87,7 +87,7 @@ const H = ({
87
87
  client: e,
88
88
  questions: t,
89
89
  productId: r,
90
- productTitle: i,
90
+ productTitle: a,
91
91
  selectedVariantId: c
92
92
  }
93
93
  ) }), T = ({ color: e = "#ffffff" }) => /* @__PURE__ */ n(
@@ -114,9 +114,9 @@ const H = ({
114
114
  placeholder: t = "Ask anything...",
115
115
  productId: s,
116
116
  productTitle: r,
117
- selectedVariantId: i
117
+ selectedVariantId: a
118
118
  }) => {
119
- const c = v(null), [l, a] = C(""), o = () => {
119
+ const c = v(null), [l, i] = C(""), o = () => {
120
120
  var d;
121
121
  (d = c.current) == null || d.focus();
122
122
  }, u = () => {
@@ -124,10 +124,10 @@ const H = ({
124
124
  d.trim() && (e.sendProductMessage({
125
125
  productId: s,
126
126
  productTitle: r,
127
- selectedVariantId: i,
127
+ selectedVariantId: a,
128
128
  question: d,
129
129
  fromQuestionSuggestion: !0
130
- }), a(""));
130
+ }), i(""));
131
131
  };
132
132
  return /* @__PURE__ */ h("div", { className: "dialog-input-wrapper", onClick: o, children: [
133
133
  /* @__PURE__ */ n(
@@ -136,7 +136,7 @@ const H = ({
136
136
  id: "dialog-ask-anything-input-ai-input",
137
137
  ref: c,
138
138
  value: l,
139
- onChange: (d) => a(d.target.value),
139
+ onChange: (d) => i(d.target.value),
140
140
  className: "dialog-ask-anything-input-ai-input",
141
141
  placeholder: t,
142
142
  onKeyDown: (d) => {
@@ -159,18 +159,18 @@ const H = ({
159
159
  if (!e) return;
160
160
  const t = document.body;
161
161
  Object.keys(e).forEach((s) => {
162
- const r = s, i = P(s);
162
+ const r = s, a = P(s);
163
163
  if (e[r] !== void 0) {
164
164
  if (typeof e[r] == "object") {
165
165
  Object.keys(e[r]).forEach(
166
166
  (c) => {
167
- var a;
167
+ var i;
168
168
  const l = c;
169
169
  if (l !== void 0) {
170
170
  const o = P(c), u = e[r];
171
171
  t.style.setProperty(
172
- `--dialog-theme-${i}-${o}`,
173
- (a = u[l]) == null ? void 0 : a.toString()
172
+ `--dialog-theme-${a}-${o}`,
173
+ (i = u[l]) == null ? void 0 : i.toString()
174
174
  );
175
175
  }
176
176
  }
@@ -179,11 +179,11 @@ const H = ({
179
179
  }
180
180
  if (r === "ctaBorderType") {
181
181
  const c = e[r] === "rounded" ? "24px" : "0";
182
- t.style.setProperty(`--dialog-theme-${i}`, c);
182
+ t.style.setProperty(`--dialog-theme-${a}`, c);
183
183
  return;
184
184
  }
185
185
  t.style.setProperty(
186
- `--dialog-theme-${i}`,
186
+ `--dialog-theme-${a}`,
187
187
  e[r].toString()
188
188
  );
189
189
  }
@@ -195,27 +195,27 @@ const H = ({
195
195
  productId: t,
196
196
  productTitle: s,
197
197
  selectedVariantId: r,
198
- enableInput: i = !0
198
+ enableInput: a = !0
199
199
  }) => {
200
- const [c, l] = C(!0), [a, o] = C(
200
+ const [c, l] = C(!0), [i, o] = C(
201
201
  void 0
202
202
  );
203
203
  f(() => {
204
204
  R({
205
205
  method: "react",
206
- version: "0.0.0-beta-20260909090007"
206
+ version: "0.0.0-beta-20260911075342"
207
207
  }), A("pdp-block");
208
208
  }, []);
209
209
  const u = w(
210
- () => c ? "" : a == null ? void 0 : a.assistantName,
211
- [a, c]
212
- ), p = w(
213
- () => c ? "" : a == null ? void 0 : a.description,
214
- [a, c]
215
- ), d = w(
216
- () => c ? "" : a == null ? void 0 : a.inputPlaceholder,
217
- [a, c]
210
+ () => c ? "" : i == null ? void 0 : i.assistantName,
211
+ [i, c]
218
212
  ), m = w(
213
+ () => c ? "" : i == null ? void 0 : i.description,
214
+ [i, c]
215
+ ), d = w(
216
+ () => c ? "" : i == null ? void 0 : i.inputPlaceholder,
217
+ [i, c]
218
+ ), p = w(
219
219
  () => {
220
220
  var g;
221
221
  return I((g = e.getLocalizationInformations()) == null ? void 0 : g.languageCode);
@@ -242,21 +242,21 @@ const H = ({
242
242
  {
243
243
  id: "dialog-instant",
244
244
  className: "dialog-block-container",
245
- dir: m,
245
+ dir: p,
246
246
  children: [
247
- /* @__PURE__ */ n(H, { title: u, description: p }),
247
+ /* @__PURE__ */ n(H, { title: u, description: m }),
248
248
  /* @__PURE__ */ n(
249
249
  $,
250
250
  {
251
251
  client: e,
252
- questions: a == null ? void 0 : a.questions,
252
+ questions: i == null ? void 0 : i.questions,
253
253
  isLoading: c,
254
254
  productId: t,
255
255
  productTitle: s,
256
256
  selectedVariantId: r
257
257
  }
258
258
  ),
259
- i && /* @__PURE__ */ n(
259
+ a && /* @__PURE__ */ n(
260
260
  V,
261
261
  {
262
262
  client: e,
@@ -308,9 +308,9 @@ const H = ({
308
308
  autoFocus: s = !1,
309
309
  submitAriaLabel: r = "Search"
310
310
  }) => {
311
- const [i, c] = C("");
312
- return /* @__PURE__ */ h("form", { className: "dialog-search-bar", role: "search", onSubmit: (a) => {
313
- a.preventDefault(), e.submit(i);
311
+ const [a, c] = C("");
312
+ return /* @__PURE__ */ h("form", { className: "dialog-search-bar", role: "search", onSubmit: (i) => {
313
+ i.preventDefault(), e.submit(a);
314
314
  }, children: [
315
315
  /* @__PURE__ */ h("div", { className: "dialog-search-bar-field", children: [
316
316
  /* @__PURE__ */ n("span", { className: "dialog-search-bar-icon", children: /* @__PURE__ */ n(W, {}) }),
@@ -320,12 +320,12 @@ const H = ({
320
320
  type: "text",
321
321
  name: "dialog-search-query",
322
322
  className: "dialog-search-bar-input",
323
- value: i,
323
+ value: a,
324
324
  "aria-label": t,
325
325
  placeholder: t,
326
326
  autoFocus: s,
327
- onChange: (a) => {
328
- c(a.target.value), e.setQuery(a.target.value);
327
+ onChange: (i) => {
328
+ c(i.target.value), e.setQuery(i.target.value);
329
329
  }
330
330
  }
331
331
  )
@@ -395,64 +395,64 @@ const H = ({
395
395
  index: s,
396
396
  locale: r
397
397
  }) => {
398
- const i = v(null);
398
+ const a = v(null);
399
399
  f(() => {
400
- i.current !== null && e.observeResult(i.current, s);
400
+ a.current !== null && e.observeResult(a.current, s);
401
401
  }, [e, t, s]);
402
402
  const c = (d) => {
403
- const m = d.metaKey || d.ctrlKey || d.shiftKey || d.altKey;
404
- e.selectResult(s, { navigate: !m }) && d.preventDefault();
403
+ const p = d.metaKey || d.ctrlKey || d.shiftKey || d.altKey;
404
+ e.selectResult(s, { navigate: !p }) && d.preventDefault();
405
405
  }, l = (d) => {
406
406
  d.button === 1 && e.selectResult(s, { navigate: !1 });
407
- }, a = t.title ?? t.objectID, o = X(t.priceRange, r), u = t.url === void 0 ? void 0 : G(t.url), p = /* @__PURE__ */ h(y, { children: [
408
- /* @__PURE__ */ n("div", { className: "dialog-search-card-image", children: t.imageUrl !== void 0 && /* @__PURE__ */ n("img", { src: t.imageUrl, alt: a, loading: "lazy" }) }),
407
+ }, i = t.title ?? t.objectID, o = X(t.priceRange, r), u = t.url === void 0 ? void 0 : G(t.url), m = /* @__PURE__ */ h(y, { children: [
408
+ /* @__PURE__ */ n("div", { className: "dialog-search-card-image", children: t.imageUrl !== void 0 && /* @__PURE__ */ n("img", { src: t.imageUrl, alt: i, loading: "lazy" }) }),
409
409
  /* @__PURE__ */ h("div", { className: "dialog-search-card-info", children: [
410
- /* @__PURE__ */ n("p", { className: "dialog-search-card-title", children: a }),
410
+ /* @__PURE__ */ n("p", { className: "dialog-search-card-title", children: i }),
411
411
  o !== "" && /* @__PURE__ */ n("p", { className: "dialog-search-card-price", children: o })
412
412
  ] })
413
413
  ] });
414
- return /* @__PURE__ */ n("li", { ref: i, className: "dialog-search-card", children: u === void 0 ? /* @__PURE__ */ n("div", { className: "dialog-search-card-body", children: p }) : /* @__PURE__ */ n(
414
+ return /* @__PURE__ */ n("li", { ref: a, className: "dialog-search-card", children: u === void 0 ? /* @__PURE__ */ n("div", { className: "dialog-search-card-body", children: m }) : /* @__PURE__ */ n(
415
415
  "a",
416
416
  {
417
417
  className: "dialog-search-card-body",
418
418
  href: u,
419
419
  onClick: c,
420
420
  onAuxClick: l,
421
- children: p
421
+ children: m
422
422
  }
423
423
  ) });
424
424
  }, J = (e) => {
425
- const t = v(null), [s, r] = C(void 0), [i, c] = C(0);
425
+ const t = v(null), [s, r] = C(void 0), [a, c] = C(0);
426
426
  return D(() => {
427
427
  if (!e)
428
428
  return;
429
429
  const l = () => {
430
- const a = t.current;
431
- if (a === null)
430
+ const i = t.current;
431
+ if (i === null)
432
432
  return;
433
- const o = a.previousElementSibling ?? a, { top: u, bottom: p, left: d, width: m } = o.getBoundingClientRect();
433
+ const o = i.previousElementSibling ?? i, { top: u, bottom: m, left: d, width: p } = o.getBoundingClientRect();
434
434
  c(window.innerHeight), r(
435
- (g) => g !== void 0 && g.top === u && g.bottom === p && g.left === d && g.width === m ? g : { top: u, bottom: p, left: d, width: m }
435
+ (g) => g !== void 0 && g.top === u && g.bottom === m && g.left === d && g.width === p ? g : { top: u, bottom: m, left: d, width: p }
436
436
  );
437
437
  };
438
438
  return l(), window.addEventListener("scroll", l, !0), window.addEventListener("resize", l), () => {
439
439
  window.removeEventListener("scroll", l, !0), window.removeEventListener("resize", l);
440
440
  };
441
- }, [e]), { anchorRef: t, rect: s, viewportHeight: i };
441
+ }, [e]), { anchorRef: t, rect: s, viewportHeight: a };
442
442
  }, ee = (e, t) => {
443
- const [s, r] = C(!1), i = v(null), c = e.status !== b.IDLE && !s;
443
+ const [s, r] = C(!1), a = v(null), c = e.status !== b.IDLE && !s;
444
444
  return f(() => {
445
445
  r(!1);
446
446
  }, [e.query]), f(() => {
447
447
  if (!c)
448
448
  return;
449
- const l = (a) => {
450
- var m, g;
451
- const o = a.target;
449
+ const l = (i) => {
450
+ var p, g;
451
+ const o = i.target;
452
452
  if (!(o instanceof Node))
453
453
  return;
454
- const u = (m = t.current) == null ? void 0 : m.previousElementSibling, p = ((g = i.current) == null ? void 0 : g.contains(o)) ?? !1, d = (u == null ? void 0 : u.contains(o)) ?? !1;
455
- !p && !d && r(!0);
454
+ const u = (p = t.current) == null ? void 0 : p.previousElementSibling, m = ((g = a.current) == null ? void 0 : g.contains(o)) ?? !1, d = (u == null ? void 0 : u.contains(o)) ?? !1;
455
+ !m && !d && r(!0);
456
456
  };
457
457
  return document.addEventListener("pointerdown", l), () => document.removeEventListener("pointerdown", l);
458
458
  }, [c, t]), f(() => {
@@ -460,17 +460,17 @@ const H = ({
460
460
  const l = (o = t.current) == null ? void 0 : o.previousElementSibling;
461
461
  if (l == null)
462
462
  return;
463
- const a = () => r(!1);
464
- return l.addEventListener("focusin", a), () => l.removeEventListener("focusin", a);
465
- }, [t]), { isOpen: c, panelRef: i };
463
+ const i = () => r(!1);
464
+ return l.addEventListener("focusin", i), () => l.removeEventListener("focusin", i);
465
+ }, [t]), { isOpen: c, panelRef: a };
466
466
  }, S = 8, E = 16, te = 200, se = (e) => e instanceof M ? `Search failed (${e.status}${e.code ? ` ${e.code}` : ""}): ${e.message}` : "Search failed: network error. Check your connection and try again.", re = (e, t) => e.bottom > 0 && e.top < t, ne = (e, t) => {
467
- const s = t - e.bottom - S - E, r = e.top - S - E, i = { left: e.left, width: e.width };
467
+ const s = t - e.bottom - S - E, r = e.top - S - E, a = { left: e.left, width: e.width };
468
468
  return s < te && r > s ? {
469
- ...i,
469
+ ...a,
470
470
  bottom: t - e.top + S,
471
471
  maxHeight: Math.max(r, 0)
472
472
  } : {
473
- ...i,
473
+ ...a,
474
474
  top: e.bottom + S,
475
475
  maxHeight: Math.max(s, 0)
476
476
  };
@@ -516,15 +516,15 @@ const H = ({
516
516
  " result",
517
517
  r.nbHits > 1 ? "s" : ""
518
518
  ] }),
519
- /* @__PURE__ */ n("ul", { className: "dialog-search-results", children: r.hits.map((i, c) => /* @__PURE__ */ n(
519
+ /* @__PURE__ */ n("ul", { className: "dialog-search-results", children: r.hits.map((a, c) => /* @__PURE__ */ n(
520
520
  Y,
521
521
  {
522
522
  controller: e,
523
- hit: i,
523
+ hit: a,
524
524
  index: c,
525
525
  locale: s
526
526
  },
527
- i.objectID
527
+ a.objectID
528
528
  )) }),
529
529
  /* @__PURE__ */ n(z, { controller: e, state: t })
530
530
  ] });
@@ -536,10 +536,10 @@ const H = ({
536
536
  state: t,
537
537
  locale: s
538
538
  }) => {
539
- const r = t.status !== b.IDLE, { anchorRef: i, rect: c, viewportHeight: l } = J(r), { isOpen: a, panelRef: o } = ee(t, i);
539
+ const r = t.status !== b.IDLE, { anchorRef: a, rect: c, viewportHeight: l } = J(r), { isOpen: i, panelRef: o } = ee(t, a);
540
540
  return /* @__PURE__ */ h(y, { children: [
541
- /* @__PURE__ */ n("div", { ref: i }),
542
- a && c !== void 0 && re(c, l) && _(
541
+ /* @__PURE__ */ n("div", { ref: a }),
542
+ i && c !== void 0 && re(c, l) && _(
543
543
  /* @__PURE__ */ n(
544
544
  "div",
545
545
  {
@@ -552,7 +552,7 @@ const H = ({
552
552
  document.body
553
553
  )
554
554
  ] });
555
- }, ae = {
555
+ }, ie = {
556
556
  status: b.IDLE,
557
557
  query: "",
558
558
  page: 0
@@ -561,26 +561,20 @@ const H = ({
561
561
  t.current = e;
562
562
  const s = v(void 0), r = N(() => {
563
563
  if (s.current === void 0) {
564
- const {
565
- client: o,
566
- surface: u = "search_page",
567
- locale: p = o.locale,
568
- ...d
569
- } = t.current;
564
+ const { client: o, surface: u = "search_page", ...m } = t.current;
570
565
  s.current = B({
571
- search: (m, g) => o.search(m, g),
572
- locale: p,
566
+ search: (d, p) => o.search(d, p),
573
567
  analytics: {
574
568
  surface: u,
575
- trackViewSearchResults: (m) => o.trackViewSearchResults(m),
576
- trackSelectSearchResult: (m) => o.trackSelectSearchResult(m)
569
+ trackViewSearchResults: (d) => o.trackViewSearchResults(d),
570
+ trackSelectSearchResult: (d) => o.trackSelectSearchResult(d)
577
571
  },
578
- ...d
572
+ ...m
579
573
  });
580
574
  }
581
575
  return s.current;
582
- }, []), i = v(void 0);
583
- i.current ?? (i.current = {
576
+ }, []), a = v(void 0);
577
+ a.current ?? (a.current = {
584
578
  setQuery: (o) => r().setQuery(o),
585
579
  submit: (o) => r().submit(o),
586
580
  setPage: (o) => r().setPage(o),
@@ -589,8 +583,7 @@ const H = ({
589
583
  selectResult: (o, u) => r().selectResult(o, u),
590
584
  subscribe: (o) => r().subscribe(o),
591
585
  getState: () => r().getState(),
592
- // Clear the ref so the next access creates a fresh controller instead of
593
- // dispatching into the disposed one; never create a controller here.
586
+ // Create a replacement on next access after disposal.
594
587
  dispose: () => {
595
588
  var o;
596
589
  (o = s.current) == null || o.dispose(), s.current = void 0;
@@ -598,7 +591,7 @@ const H = ({
598
591
  }), f(() => {
599
592
  R({
600
593
  method: "react",
601
- version: "0.0.0-beta-20260909090007"
594
+ version: "0.0.0-beta-20260911075342"
602
595
  });
603
596
  const o = r();
604
597
  return () => {
@@ -611,12 +604,12 @@ const H = ({
611
604
  ), l = N(
612
605
  () => r().getState(),
613
606
  [r]
614
- ), a = x(
607
+ ), i = x(
615
608
  c,
616
609
  l,
617
- () => ae
610
+ () => ie
618
611
  );
619
- return { controller: i.current, state: a };
612
+ return { controller: a.current, state: i };
620
613
  };
621
614
  export {
622
615
  V as DialogInput,
@@ -1 +1 @@
1
- (function(f,s){typeof exports=="object"&&typeof module<"u"?s(exports,require("react/jsx-runtime"),require("react"),require("@askdialog/dialog-sdk"),require("react-dom")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","@askdialog/dialog-sdk","react-dom"],s):(f=typeof globalThis<"u"?globalThis:f||self,s(f["dialog-react"]={},f["react/jsx-runtime"],f.React,f.dialogSdk,f.ReactDOM))})(this,(function(f,s,d,b,P){"use strict";const m=({title:e="Your expert",description:t="A question about this product?"})=>s.jsxs("div",{className:"dialog-block-header-container",children:[s.jsx("div",{className:"dialog-block-title",children:e}),s.jsx("div",{className:"dialog-block-description",children:t})]}),E=({color:e="#181825"})=>s.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[s.jsxs("g",{clipPath:"url(#clip0_466_934)",children:[s.jsx("path",{d:"M5.41675 10.8333L6.07046 12.1408C6.2917 12.5832 6.40232 12.8045 6.55011 12.9962C6.68124 13.1663 6.83375 13.3188 7.00388 13.45C7.19559 13.5977 7.41684 13.7084 7.85932 13.9296L9.16675 14.5833L7.85932 15.237C7.41684 15.4583 7.19559 15.5689 7.00388 15.7167C6.83375 15.8478 6.68124 16.0003 6.55011 16.1704C6.40232 16.3622 6.2917 16.5834 6.07046 17.0259L5.41675 18.3333L4.76303 17.0259C4.54179 16.5834 4.43117 16.3622 4.28339 16.1704C4.15225 16.0003 3.99974 15.8478 3.82962 15.7167C3.6379 15.5689 3.41666 15.4583 2.97418 15.237L1.66675 14.5833L2.97418 13.9296C3.41666 13.7084 3.6379 13.5977 3.82962 13.45C3.99974 13.3188 4.15225 13.1663 4.28339 12.9962C4.43117 12.8045 4.54179 12.5832 4.76303 12.1408L5.41675 10.8333Z",stroke:e,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),s.jsx("path",{d:"M12.5001 1.66666L13.4823 4.22034C13.7173 4.83136 13.8348 5.13688 14.0175 5.39386C14.1795 5.62162 14.3785 5.82061 14.6062 5.98256C14.8632 6.16529 15.1687 6.2828 15.7797 6.5178L18.3334 7.49999L15.7797 8.48217C15.1687 8.71718 14.8632 8.83469 14.6062 9.01742C14.3785 9.17937 14.1795 9.37836 14.0175 9.60612C13.8348 9.8631 13.7173 10.1686 13.4823 10.7796L12.5001 13.3333L11.5179 10.7796C11.2829 10.1686 11.1654 9.8631 10.9827 9.60612C10.8207 9.37836 10.6217 9.17937 10.3939 9.01742C10.137 8.83469 9.83145 8.71718 9.22043 8.48217L6.66675 7.49999L9.22043 6.5178C9.83145 6.28279 10.137 6.16529 10.3939 5.98256C10.6217 5.82061 10.8207 5.62162 10.9827 5.39386C11.1654 5.13688 11.2829 4.83136 11.5179 4.22034L12.5001 1.66666Z",stroke:e,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]}),s.jsx("defs",{children:s.jsx("clipPath",{id:"clip0_466_934",children:s.jsx("rect",{width:"20",height:"20",fill:"white"})})})]}),L=({client:e,questions:t,productId:r,productTitle:o,selectedVariantId:i})=>{const l=c=>{e.sendProductMessage({productId:r,productTitle:o,selectedVariantId:i,question:c,fromQuestionSuggestion:!0})};return s.jsx(s.Fragment,{children:t.map(c=>s.jsxs("button",{className:"dialog-block-suggestions-item",onClick:()=>l(c.question),children:[s.jsx(E,{color:e.theme.primaryColor}),s.jsx("span",{className:"dialog-block-suggestions-item-label",children:c.question})]},c.question))})},D=()=>s.jsxs(s.Fragment,{children:[s.jsx("div",{className:"dialog-block-suggestions-skeleton-item"}),s.jsx("div",{className:"dialog-block-suggestions-skeleton-item"}),s.jsx("div",{className:"dialog-block-suggestions-skeleton-item"})]}),_=({client:e,questions:t,isLoading:r,productId:o,productTitle:i,selectedVariantId:l})=>s.jsx("div",{className:"dialog-block-suggestions-container",children:r||!t?s.jsx(D,{}):s.jsx(L,{client:e,questions:t,productId:o,productTitle:i,selectedVariantId:l})}),A=({color:e="#ffffff"})=>s.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:s.jsx("path",{d:"M10 16.6667V3.33334M10 3.33334L5 8.33334M10 3.33334L15 8.33334",stroke:e,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})}),y=({client:e,placeholder:t="Ask anything...",productId:r,productTitle:o,selectedVariantId:i})=>{const l=d.useRef(null),[c,n]=d.useState(""),a=()=>{var u;(u=l.current)==null||u.focus()},h=()=>{const u=c;u.trim()&&(e.sendProductMessage({productId:r,productTitle:o,selectedVariantId:i,question:u,fromQuestionSuggestion:!0}),n(""))},S=u=>{u.key==="Enter"&&h()};return s.jsxs("div",{className:"dialog-input-wrapper",onClick:a,children:[s.jsx("input",{id:"dialog-ask-anything-input-ai-input",ref:l,value:c,onChange:u=>n(u.target.value),className:"dialog-ask-anything-input-ai-input",placeholder:t,onKeyDown:S}),s.jsx("button",{id:"send-message-button-ai-input",className:"dialog-input-submit",disabled:!c.trim(),onClick:h,children:s.jsx(A,{color:e.theme.ctaTextColor})})]})},w=e=>e.replace(/([A-Z])/g,"-$1").toLowerCase(),I=e=>{if(!e)return;const t=document.body;Object.keys(e).forEach(r=>{const o=r,i=w(r);if(e[o]!==void 0){if(typeof e[o]=="object"){Object.keys(e[o]).forEach(l=>{var n;const c=l;if(c!==void 0){const a=w(l),h=e[o];t.style.setProperty(`--dialog-theme-${i}-${a}`,(n=h[c])==null?void 0:n.toString())}});return}if(o==="ctaBorderType"){const l=e[o]==="rounded"?"24px":"0";t.style.setProperty(`--dialog-theme-${i}`,l);return}t.style.setProperty(`--dialog-theme-${i}`,e[o].toString())}})},M=({theme:e,children:t})=>(d.useEffect(()=>{e&&I(e)},[e]),s.jsx(s.Fragment,{children:t})),F=({client:e,productId:t,productTitle:r,selectedVariantId:o,enableInput:i=!0})=>{const[l,c]=d.useState(!0),[n,a]=d.useState(void 0);d.useEffect(()=>{b.registerDialogInstallation({method:"react",version:"0.0.0-beta-20260909090007"}),b.addAuditCapability("pdp-block")},[]);const h=d.useMemo(()=>l?"":n==null?void 0:n.assistantName,[n,l]),S=d.useMemo(()=>l?"":n==null?void 0:n.description,[n,l]),u=d.useMemo(()=>l?"":n==null?void 0:n.inputPlaceholder,[n,l]),p=d.useMemo(()=>{var g;return b.resolveTextDirection((g=e.getLocalizationInformations())==null?void 0:g.languageCode)},[e]);return d.useEffect(()=>{let g=!0;return(async()=>{c(!0),a(void 0);try{const C=await e.getSuggestions(t);g&&a(C)}catch(C){console.error("error",C)}finally{g&&c(!1)}})(),()=>{g=!1}},[e,t]),s.jsx(M,{theme:e.theme,children:s.jsxs("div",{id:"dialog-instant",className:"dialog-block-container",dir:p,children:[s.jsx(m,{title:h,description:S}),s.jsx(_,{client:e,questions:n==null?void 0:n.questions,isLoading:l,productId:t,productTitle:r,selectedVariantId:o}),i&&s.jsx(y,{client:e,placeholder:u,productId:t,productTitle:r,selectedVariantId:o})]})})},O=()=>s.jsx("svg",{width:16,height:16,viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:s.jsx("path",{d:"M8 13V3M8 3L3 8M8 3L13 8",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})}),T="M5.3217 0.588255C5.63241 -0.196084 6.36759 -0.196085 6.6783 0.588254C6.98901 1.37259 7.68193 2.82807 8.42693 3.57307C9.17193 4.31807 10.6274 5.01099 11.4117 5.3217C12.1961 5.63241 12.1961 6.36759 11.4117 6.6783C10.6274 6.98901 9.17193 7.68193 8.42693 8.42693C7.68193 9.17193 6.98901 10.6274 6.6783 11.4117C6.36759 12.1961 5.63241 12.1961 5.3217 11.4117C5.01099 10.6274 4.31807 9.17193 3.57307 8.42693C2.82808 7.68193 1.37259 6.98901 0.588255 6.6783C-0.196084 6.36759 -0.196085 5.63241 0.588254 5.3217C1.37259 5.01099 2.82807 4.31807 3.57307 3.57307C4.31807 2.82808 5.01099 1.37259 5.3217 0.588255Z",B=({color:e="currentColor"})=>s.jsx("svg",{width:16,height:16,viewBox:"0 0 12 12",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:s.jsx("path",{d:T,fill:e})}),q=({controller:e,placeholder:t="Search products...",autoFocus:r=!1,submitAriaLabel:o="Search"})=>{const[i,l]=d.useState(""),c=n=>{n.preventDefault(),e.submit(i)};return s.jsxs("form",{className:"dialog-search-bar",role:"search",onSubmit:c,children:[s.jsxs("div",{className:"dialog-search-bar-field",children:[s.jsx("span",{className:"dialog-search-bar-icon",children:s.jsx(B,{})}),s.jsx("input",{type:"text",name:"dialog-search-query",className:"dialog-search-bar-input",value:i,"aria-label":t,placeholder:t,autoFocus:r,onChange:n=>{l(n.target.value),e.setQuery(n.target.value)}})]}),s.jsx("button",{type:"submit",className:"dialog-search-bar-submit","aria-label":o,children:s.jsx(O,{})})]})},N=({controller:e,state:t})=>{const r=t.response;return r===void 0||r.nbPages<=1?null:s.jsxs("nav",{"aria-label":"Search results pages",className:"dialog-search-pagination",children:[s.jsx("button",{type:"button",disabled:r.page===0,onClick:()=>e.setPage(r.page-1),children:"Previous"}),s.jsxs("span",{children:["Page ",r.page+1," / ",r.nbPages]}),s.jsx("button",{type:"button",disabled:r.page>=r.nbPages-1,onClick:()=>e.setPage(r.page+1),children:"Next"})]})},v=({amount:e,currencyCode:t},r)=>t===void 0?new Intl.NumberFormat(r).format(Number(e)):new Intl.NumberFormat(r,{style:"currency",currency:t}).format(Number(e)),H=({min:e,max:t},r)=>e.amount===t.amount?v(e,r):`${v(e,r)} – ${v(t,r)}`,V=(e,t)=>{if(e===void 0)return"";try{return H(e,t)}catch{return""}},x=e=>{try{const{protocol:t}=new URL(e,window.location.href);return t==="http:"||t==="https:"?e:void 0}catch{return}},k=({controller:e,hit:t,index:r,locale:o})=>{const i=d.useRef(null);d.useEffect(()=>{i.current!==null&&e.observeResult(i.current,r)},[e,t,r]);const l=u=>{const p=u.metaKey||u.ctrlKey||u.shiftKey||u.altKey;e.selectResult(r,{navigate:!p})&&u.preventDefault()},c=u=>{u.button===1&&e.selectResult(r,{navigate:!1})},n=t.title??t.objectID,a=V(t.priceRange,o),h=t.url===void 0?void 0:x(t.url),S=s.jsxs(s.Fragment,{children:[s.jsx("div",{className:"dialog-search-card-image",children:t.imageUrl!==void 0&&s.jsx("img",{src:t.imageUrl,alt:n,loading:"lazy"})}),s.jsxs("div",{className:"dialog-search-card-info",children:[s.jsx("p",{className:"dialog-search-card-title",children:n}),a!==""&&s.jsx("p",{className:"dialog-search-card-price",children:a})]})]});return s.jsx("li",{ref:i,className:"dialog-search-card",children:h===void 0?s.jsx("div",{className:"dialog-search-card-body",children:S}):s.jsx("a",{className:"dialog-search-card-body",href:h,onClick:l,onAuxClick:c,children:S})})},K=e=>{const t=d.useRef(null),[r,o]=d.useState(void 0),[i,l]=d.useState(0);return d.useLayoutEffect(()=>{if(!e)return;const c=()=>{const n=t.current;if(n===null)return;const a=n.previousElementSibling??n,{top:h,bottom:S,left:u,width:p}=a.getBoundingClientRect();l(window.innerHeight),o(g=>g!==void 0&&g.top===h&&g.bottom===S&&g.left===u&&g.width===p?g:{top:h,bottom:S,left:u,width:p})};return c(),window.addEventListener("scroll",c,!0),window.addEventListener("resize",c),()=>{window.removeEventListener("scroll",c,!0),window.removeEventListener("resize",c)}},[e]),{anchorRef:t,rect:r,viewportHeight:i}},$=(e,t)=>{const[r,o]=d.useState(!1),i=d.useRef(null),l=e.status!==b.SearchStatus.IDLE&&!r;return d.useEffect(()=>{o(!1)},[e.query]),d.useEffect(()=>{if(!l)return;const c=n=>{var p,g;const a=n.target;if(!(a instanceof Node))return;const h=(p=t.current)==null?void 0:p.previousElementSibling,S=((g=i.current)==null?void 0:g.contains(a))??!1,u=(h==null?void 0:h.contains(a))??!1;!S&&!u&&o(!0)};return document.addEventListener("pointerdown",c),()=>document.removeEventListener("pointerdown",c)},[l,t]),d.useEffect(()=>{var a;const c=(a=t.current)==null?void 0:a.previousElementSibling;if(c==null)return;const n=()=>o(!1);return c.addEventListener("focusin",n),()=>c.removeEventListener("focusin",n)},[t]),{isOpen:l,panelRef:i}},X=e=>e instanceof b.DialogSearchError?`Search failed (${e.status}${e.code?` ${e.code}`:""}): ${e.message}`:"Search failed: network error. Check your connection and try again.",j=(e,t)=>e.bottom>0&&e.top<t,W=(e,t)=>{const r=t-e.bottom-8-16,o=e.top-8-16,i={left:e.left,width:e.width};return r<200&&o>r?{...i,bottom:t-e.top+8,maxHeight:Math.max(o,0)}:{...i,top:e.bottom+8,maxHeight:Math.max(r,0)}},Q=(e,t,r)=>{const o=t.response;switch(t.status){case b.SearchStatus.LOADING:return s.jsxs("p",{role:"status",className:"dialog-search-status",children:["Searching “",t.query,"”…"]});case b.SearchStatus.ERROR:return s.jsxs("div",{className:"dialog-search-error",children:[s.jsx("p",{role:"alert",className:"dialog-search-status dialog-search-status-error",children:X(t.error)}),s.jsx("button",{type:"button",className:"dialog-search-retry",onClick:()=>e.retry(),children:"Retry"})]});case b.SearchStatus.EMPTY:return s.jsxs("p",{role:"status",className:"dialog-search-status",children:["No products match “",o==null?void 0:o.query,"”."]});case b.SearchStatus.SUCCESS:return o===void 0?null:s.jsxs(s.Fragment,{children:[s.jsxs("p",{role:"status",className:"dialog-search-status",children:[o.nbHits," result",o.nbHits>1?"s":""]}),s.jsx("ul",{className:"dialog-search-results",children:o.hits.map((i,l)=>s.jsx(k,{controller:e,hit:i,index:l,locale:r},i.objectID))}),s.jsx(N,{controller:e,state:t})]});default:return null}},U=({controller:e,state:t,locale:r})=>{const o=t.status!==b.SearchStatus.IDLE,{anchorRef:i,rect:l,viewportHeight:c}=K(o),{isOpen:n,panelRef:a}=$(t,i);return s.jsxs(s.Fragment,{children:[s.jsx("div",{ref:i}),n&&l!==void 0&&j(l,c)&&P.createPortal(s.jsx("div",{ref:a,className:"dialog-search-panel",style:W(l,c),children:Q(e,t,r)}),document.body)]})},z={status:b.SearchStatus.IDLE,query:"",page:0},G=e=>{const t=d.useRef(e);t.current=e;const r=d.useRef(void 0),o=d.useCallback(()=>{if(r.current===void 0){const{client:a,surface:h="search_page",locale:S=a.locale,...u}=t.current;r.current=b.createSearchController({search:(p,g)=>a.search(p,g),locale:S,analytics:{surface:h,trackViewSearchResults:p=>a.trackViewSearchResults(p),trackSelectSearchResult:p=>a.trackSelectSearchResult(p)},...u})}return r.current},[]),i=d.useRef(void 0);i.current??(i.current={setQuery:a=>o().setQuery(a),submit:a=>o().submit(a),setPage:a=>o().setPage(a),retry:()=>o().retry(),observeResult:(a,h)=>o().observeResult(a,h),selectResult:(a,h)=>o().selectResult(a,h),subscribe:a=>o().subscribe(a),getState:()=>o().getState(),dispose:()=>{var a;(a=r.current)==null||a.dispose(),r.current=void 0}}),d.useEffect(()=>{b.registerDialogInstallation({method:"react",version:"0.0.0-beta-20260909090007"});const a=o();return()=>{a.dispose(),r.current===a&&(r.current=void 0)}},[o]);const l=d.useCallback(a=>o().subscribe(a),[o]),c=d.useCallback(()=>o().getState(),[o]),n=d.useSyncExternalStore(l,c,()=>z);return{controller:i.current,state:n}};f.DialogInput=y,f.DialogProductBlock=F,f.DialogSearchBar=q,f.DialogSearchPagination=N,f.DialogSearchProductCard=k,f.DialogSearchResults=U,f.useDialogSearch=G,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})}));
1
+ (function(g,s){typeof exports=="object"&&typeof module<"u"?s(exports,require("react/jsx-runtime"),require("react"),require("@askdialog/dialog-sdk"),require("react-dom")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","@askdialog/dialog-sdk","react-dom"],s):(g=typeof globalThis<"u"?globalThis:g||self,s(g["dialog-react"]={},g["react/jsx-runtime"],g.React,g.dialogSdk,g.ReactDOM))})(this,(function(g,s,d,p,P){"use strict";const m=({title:e="Your expert",description:t="A question about this product?"})=>s.jsxs("div",{className:"dialog-block-header-container",children:[s.jsx("div",{className:"dialog-block-title",children:e}),s.jsx("div",{className:"dialog-block-description",children:t})]}),E=({color:e="#181825"})=>s.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[s.jsxs("g",{clipPath:"url(#clip0_466_934)",children:[s.jsx("path",{d:"M5.41675 10.8333L6.07046 12.1408C6.2917 12.5832 6.40232 12.8045 6.55011 12.9962C6.68124 13.1663 6.83375 13.3188 7.00388 13.45C7.19559 13.5977 7.41684 13.7084 7.85932 13.9296L9.16675 14.5833L7.85932 15.237C7.41684 15.4583 7.19559 15.5689 7.00388 15.7167C6.83375 15.8478 6.68124 16.0003 6.55011 16.1704C6.40232 16.3622 6.2917 16.5834 6.07046 17.0259L5.41675 18.3333L4.76303 17.0259C4.54179 16.5834 4.43117 16.3622 4.28339 16.1704C4.15225 16.0003 3.99974 15.8478 3.82962 15.7167C3.6379 15.5689 3.41666 15.4583 2.97418 15.237L1.66675 14.5833L2.97418 13.9296C3.41666 13.7084 3.6379 13.5977 3.82962 13.45C3.99974 13.3188 4.15225 13.1663 4.28339 12.9962C4.43117 12.8045 4.54179 12.5832 4.76303 12.1408L5.41675 10.8333Z",stroke:e,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),s.jsx("path",{d:"M12.5001 1.66666L13.4823 4.22034C13.7173 4.83136 13.8348 5.13688 14.0175 5.39386C14.1795 5.62162 14.3785 5.82061 14.6062 5.98256C14.8632 6.16529 15.1687 6.2828 15.7797 6.5178L18.3334 7.49999L15.7797 8.48217C15.1687 8.71718 14.8632 8.83469 14.6062 9.01742C14.3785 9.17937 14.1795 9.37836 14.0175 9.60612C13.8348 9.8631 13.7173 10.1686 13.4823 10.7796L12.5001 13.3333L11.5179 10.7796C11.2829 10.1686 11.1654 9.8631 10.9827 9.60612C10.8207 9.37836 10.6217 9.17937 10.3939 9.01742C10.137 8.83469 9.83145 8.71718 9.22043 8.48217L6.66675 7.49999L9.22043 6.5178C9.83145 6.28279 10.137 6.16529 10.3939 5.98256C10.6217 5.82061 10.8207 5.62162 10.9827 5.39386C11.1654 5.13688 11.2829 4.83136 11.5179 4.22034L12.5001 1.66666Z",stroke:e,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]}),s.jsx("defs",{children:s.jsx("clipPath",{id:"clip0_466_934",children:s.jsx("rect",{width:"20",height:"20",fill:"white"})})})]}),L=({client:e,questions:t,productId:r,productTitle:o,selectedVariantId:i})=>{const l=c=>{e.sendProductMessage({productId:r,productTitle:o,selectedVariantId:i,question:c,fromQuestionSuggestion:!0})};return s.jsx(s.Fragment,{children:t.map(c=>s.jsxs("button",{className:"dialog-block-suggestions-item",onClick:()=>l(c.question),children:[s.jsx(E,{color:e.theme.primaryColor}),s.jsx("span",{className:"dialog-block-suggestions-item-label",children:c.question})]},c.question))})},D=()=>s.jsxs(s.Fragment,{children:[s.jsx("div",{className:"dialog-block-suggestions-skeleton-item"}),s.jsx("div",{className:"dialog-block-suggestions-skeleton-item"}),s.jsx("div",{className:"dialog-block-suggestions-skeleton-item"})]}),_=({client:e,questions:t,isLoading:r,productId:o,productTitle:i,selectedVariantId:l})=>s.jsx("div",{className:"dialog-block-suggestions-container",children:r||!t?s.jsx(D,{}):s.jsx(L,{client:e,questions:t,productId:o,productTitle:i,selectedVariantId:l})}),A=({color:e="#ffffff"})=>s.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:s.jsx("path",{d:"M10 16.6667V3.33334M10 3.33334L5 8.33334M10 3.33334L15 8.33334",stroke:e,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})}),y=({client:e,placeholder:t="Ask anything...",productId:r,productTitle:o,selectedVariantId:i})=>{const l=d.useRef(null),[c,n]=d.useState(""),a=()=>{var u;(u=l.current)==null||u.focus()},h=()=>{const u=c;u.trim()&&(e.sendProductMessage({productId:r,productTitle:o,selectedVariantId:i,question:u,fromQuestionSuggestion:!0}),n(""))},b=u=>{u.key==="Enter"&&h()};return s.jsxs("div",{className:"dialog-input-wrapper",onClick:a,children:[s.jsx("input",{id:"dialog-ask-anything-input-ai-input",ref:l,value:c,onChange:u=>n(u.target.value),className:"dialog-ask-anything-input-ai-input",placeholder:t,onKeyDown:b}),s.jsx("button",{id:"send-message-button-ai-input",className:"dialog-input-submit",disabled:!c.trim(),onClick:h,children:s.jsx(A,{color:e.theme.ctaTextColor})})]})},w=e=>e.replace(/([A-Z])/g,"-$1").toLowerCase(),I=e=>{if(!e)return;const t=document.body;Object.keys(e).forEach(r=>{const o=r,i=w(r);if(e[o]!==void 0){if(typeof e[o]=="object"){Object.keys(e[o]).forEach(l=>{var n;const c=l;if(c!==void 0){const a=w(l),h=e[o];t.style.setProperty(`--dialog-theme-${i}-${a}`,(n=h[c])==null?void 0:n.toString())}});return}if(o==="ctaBorderType"){const l=e[o]==="rounded"?"24px":"0";t.style.setProperty(`--dialog-theme-${i}`,l);return}t.style.setProperty(`--dialog-theme-${i}`,e[o].toString())}})},M=({theme:e,children:t})=>(d.useEffect(()=>{e&&I(e)},[e]),s.jsx(s.Fragment,{children:t})),F=({client:e,productId:t,productTitle:r,selectedVariantId:o,enableInput:i=!0})=>{const[l,c]=d.useState(!0),[n,a]=d.useState(void 0);d.useEffect(()=>{p.registerDialogInstallation({method:"react",version:"0.0.0-beta-20260911075342"}),p.addAuditCapability("pdp-block")},[]);const h=d.useMemo(()=>l?"":n==null?void 0:n.assistantName,[n,l]),b=d.useMemo(()=>l?"":n==null?void 0:n.description,[n,l]),u=d.useMemo(()=>l?"":n==null?void 0:n.inputPlaceholder,[n,l]),S=d.useMemo(()=>{var f;return p.resolveTextDirection((f=e.getLocalizationInformations())==null?void 0:f.languageCode)},[e]);return d.useEffect(()=>{let f=!0;return(async()=>{c(!0),a(void 0);try{const C=await e.getSuggestions(t);f&&a(C)}catch(C){console.error("error",C)}finally{f&&c(!1)}})(),()=>{f=!1}},[e,t]),s.jsx(M,{theme:e.theme,children:s.jsxs("div",{id:"dialog-instant",className:"dialog-block-container",dir:S,children:[s.jsx(m,{title:h,description:b}),s.jsx(_,{client:e,questions:n==null?void 0:n.questions,isLoading:l,productId:t,productTitle:r,selectedVariantId:o}),i&&s.jsx(y,{client:e,placeholder:u,productId:t,productTitle:r,selectedVariantId:o})]})})},O=()=>s.jsx("svg",{width:16,height:16,viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:s.jsx("path",{d:"M8 13V3M8 3L3 8M8 3L13 8",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})}),T="M5.3217 0.588255C5.63241 -0.196084 6.36759 -0.196085 6.6783 0.588254C6.98901 1.37259 7.68193 2.82807 8.42693 3.57307C9.17193 4.31807 10.6274 5.01099 11.4117 5.3217C12.1961 5.63241 12.1961 6.36759 11.4117 6.6783C10.6274 6.98901 9.17193 7.68193 8.42693 8.42693C7.68193 9.17193 6.98901 10.6274 6.6783 11.4117C6.36759 12.1961 5.63241 12.1961 5.3217 11.4117C5.01099 10.6274 4.31807 9.17193 3.57307 8.42693C2.82808 7.68193 1.37259 6.98901 0.588255 6.6783C-0.196084 6.36759 -0.196085 5.63241 0.588254 5.3217C1.37259 5.01099 2.82807 4.31807 3.57307 3.57307C4.31807 2.82808 5.01099 1.37259 5.3217 0.588255Z",B=({color:e="currentColor"})=>s.jsx("svg",{width:16,height:16,viewBox:"0 0 12 12",fill:"none",xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",children:s.jsx("path",{d:T,fill:e})}),q=({controller:e,placeholder:t="Search products...",autoFocus:r=!1,submitAriaLabel:o="Search"})=>{const[i,l]=d.useState(""),c=n=>{n.preventDefault(),e.submit(i)};return s.jsxs("form",{className:"dialog-search-bar",role:"search",onSubmit:c,children:[s.jsxs("div",{className:"dialog-search-bar-field",children:[s.jsx("span",{className:"dialog-search-bar-icon",children:s.jsx(B,{})}),s.jsx("input",{type:"text",name:"dialog-search-query",className:"dialog-search-bar-input",value:i,"aria-label":t,placeholder:t,autoFocus:r,onChange:n=>{l(n.target.value),e.setQuery(n.target.value)}})]}),s.jsx("button",{type:"submit",className:"dialog-search-bar-submit","aria-label":o,children:s.jsx(O,{})})]})},N=({controller:e,state:t})=>{const r=t.response;return r===void 0||r.nbPages<=1?null:s.jsxs("nav",{"aria-label":"Search results pages",className:"dialog-search-pagination",children:[s.jsx("button",{type:"button",disabled:r.page===0,onClick:()=>e.setPage(r.page-1),children:"Previous"}),s.jsxs("span",{children:["Page ",r.page+1," / ",r.nbPages]}),s.jsx("button",{type:"button",disabled:r.page>=r.nbPages-1,onClick:()=>e.setPage(r.page+1),children:"Next"})]})},v=({amount:e,currencyCode:t},r)=>t===void 0?new Intl.NumberFormat(r).format(Number(e)):new Intl.NumberFormat(r,{style:"currency",currency:t}).format(Number(e)),H=({min:e,max:t},r)=>e.amount===t.amount?v(e,r):`${v(e,r)} – ${v(t,r)}`,V=(e,t)=>{if(e===void 0)return"";try{return H(e,t)}catch{return""}},x=e=>{try{const{protocol:t}=new URL(e,window.location.href);return t==="http:"||t==="https:"?e:void 0}catch{return}},k=({controller:e,hit:t,index:r,locale:o})=>{const i=d.useRef(null);d.useEffect(()=>{i.current!==null&&e.observeResult(i.current,r)},[e,t,r]);const l=u=>{const S=u.metaKey||u.ctrlKey||u.shiftKey||u.altKey;e.selectResult(r,{navigate:!S})&&u.preventDefault()},c=u=>{u.button===1&&e.selectResult(r,{navigate:!1})},n=t.title??t.objectID,a=V(t.priceRange,o),h=t.url===void 0?void 0:x(t.url),b=s.jsxs(s.Fragment,{children:[s.jsx("div",{className:"dialog-search-card-image",children:t.imageUrl!==void 0&&s.jsx("img",{src:t.imageUrl,alt:n,loading:"lazy"})}),s.jsxs("div",{className:"dialog-search-card-info",children:[s.jsx("p",{className:"dialog-search-card-title",children:n}),a!==""&&s.jsx("p",{className:"dialog-search-card-price",children:a})]})]});return s.jsx("li",{ref:i,className:"dialog-search-card",children:h===void 0?s.jsx("div",{className:"dialog-search-card-body",children:b}):s.jsx("a",{className:"dialog-search-card-body",href:h,onClick:l,onAuxClick:c,children:b})})},K=e=>{const t=d.useRef(null),[r,o]=d.useState(void 0),[i,l]=d.useState(0);return d.useLayoutEffect(()=>{if(!e)return;const c=()=>{const n=t.current;if(n===null)return;const a=n.previousElementSibling??n,{top:h,bottom:b,left:u,width:S}=a.getBoundingClientRect();l(window.innerHeight),o(f=>f!==void 0&&f.top===h&&f.bottom===b&&f.left===u&&f.width===S?f:{top:h,bottom:b,left:u,width:S})};return c(),window.addEventListener("scroll",c,!0),window.addEventListener("resize",c),()=>{window.removeEventListener("scroll",c,!0),window.removeEventListener("resize",c)}},[e]),{anchorRef:t,rect:r,viewportHeight:i}},$=(e,t)=>{const[r,o]=d.useState(!1),i=d.useRef(null),l=e.status!==p.SearchStatus.IDLE&&!r;return d.useEffect(()=>{o(!1)},[e.query]),d.useEffect(()=>{if(!l)return;const c=n=>{var S,f;const a=n.target;if(!(a instanceof Node))return;const h=(S=t.current)==null?void 0:S.previousElementSibling,b=((f=i.current)==null?void 0:f.contains(a))??!1,u=(h==null?void 0:h.contains(a))??!1;!b&&!u&&o(!0)};return document.addEventListener("pointerdown",c),()=>document.removeEventListener("pointerdown",c)},[l,t]),d.useEffect(()=>{var a;const c=(a=t.current)==null?void 0:a.previousElementSibling;if(c==null)return;const n=()=>o(!1);return c.addEventListener("focusin",n),()=>c.removeEventListener("focusin",n)},[t]),{isOpen:l,panelRef:i}},X=e=>e instanceof p.DialogSearchError?`Search failed (${e.status}${e.code?` ${e.code}`:""}): ${e.message}`:"Search failed: network error. Check your connection and try again.",j=(e,t)=>e.bottom>0&&e.top<t,W=(e,t)=>{const r=t-e.bottom-8-16,o=e.top-8-16,i={left:e.left,width:e.width};return r<200&&o>r?{...i,bottom:t-e.top+8,maxHeight:Math.max(o,0)}:{...i,top:e.bottom+8,maxHeight:Math.max(r,0)}},Q=(e,t,r)=>{const o=t.response;switch(t.status){case p.SearchStatus.LOADING:return s.jsxs("p",{role:"status",className:"dialog-search-status",children:["Searching “",t.query,"”…"]});case p.SearchStatus.ERROR:return s.jsxs("div",{className:"dialog-search-error",children:[s.jsx("p",{role:"alert",className:"dialog-search-status dialog-search-status-error",children:X(t.error)}),s.jsx("button",{type:"button",className:"dialog-search-retry",onClick:()=>e.retry(),children:"Retry"})]});case p.SearchStatus.EMPTY:return s.jsxs("p",{role:"status",className:"dialog-search-status",children:["No products match “",o==null?void 0:o.query,"”."]});case p.SearchStatus.SUCCESS:return o===void 0?null:s.jsxs(s.Fragment,{children:[s.jsxs("p",{role:"status",className:"dialog-search-status",children:[o.nbHits," result",o.nbHits>1?"s":""]}),s.jsx("ul",{className:"dialog-search-results",children:o.hits.map((i,l)=>s.jsx(k,{controller:e,hit:i,index:l,locale:r},i.objectID))}),s.jsx(N,{controller:e,state:t})]});default:return null}},U=({controller:e,state:t,locale:r})=>{const o=t.status!==p.SearchStatus.IDLE,{anchorRef:i,rect:l,viewportHeight:c}=K(o),{isOpen:n,panelRef:a}=$(t,i);return s.jsxs(s.Fragment,{children:[s.jsx("div",{ref:i}),n&&l!==void 0&&j(l,c)&&P.createPortal(s.jsx("div",{ref:a,className:"dialog-search-panel",style:W(l,c),children:Q(e,t,r)}),document.body)]})},z={status:p.SearchStatus.IDLE,query:"",page:0},G=e=>{const t=d.useRef(e);t.current=e;const r=d.useRef(void 0),o=d.useCallback(()=>{if(r.current===void 0){const{client:a,surface:h="search_page",...b}=t.current;r.current=p.createSearchController({search:(u,S)=>a.search(u,S),analytics:{surface:h,trackViewSearchResults:u=>a.trackViewSearchResults(u),trackSelectSearchResult:u=>a.trackSelectSearchResult(u)},...b})}return r.current},[]),i=d.useRef(void 0);i.current??(i.current={setQuery:a=>o().setQuery(a),submit:a=>o().submit(a),setPage:a=>o().setPage(a),retry:()=>o().retry(),observeResult:(a,h)=>o().observeResult(a,h),selectResult:(a,h)=>o().selectResult(a,h),subscribe:a=>o().subscribe(a),getState:()=>o().getState(),dispose:()=>{var a;(a=r.current)==null||a.dispose(),r.current=void 0}}),d.useEffect(()=>{p.registerDialogInstallation({method:"react",version:"0.0.0-beta-20260911075342"});const a=o();return()=>{a.dispose(),r.current===a&&(r.current=void 0)}},[o]);const l=d.useCallback(a=>o().subscribe(a),[o]),c=d.useCallback(()=>o().getState(),[o]),n=d.useSyncExternalStore(l,c,()=>z);return{controller:i.current,state:n}};g.DialogInput=y,g.DialogProductBlock=F,g.DialogSearchBar=q,g.DialogSearchPagination=N,g.DialogSearchProductCard=k,g.DialogSearchResults=U,g.useDialogSearch=G,Object.defineProperty(g,Symbol.toStringTag,{value:"Module"})}));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@askdialog/dialog-react",
3
- "version": "0.0.0-beta-20260909090007",
3
+ "version": "0.0.0-beta-20260911075342",
4
4
  "private": false,
5
5
  "type": "module",
6
6
  "main": "./dist/dialog-react.umd.js",
@@ -19,14 +19,14 @@
19
19
  "dist"
20
20
  ],
21
21
  "peerDependencies": {
22
- "@askdialog/dialog-sdk": "0.0.0-beta-20260909090007",
22
+ "@askdialog/dialog-sdk": "0.0.0-beta-20260911075342",
23
23
  "react": "^19.0.0",
24
24
  "react-dom": "^19.0.0"
25
25
  },
26
26
  "devDependencies": {
27
27
  "@types/react": "^19.2.7",
28
28
  "@types/react-dom": "^19.2.3",
29
- "@askdialog/dialog-sdk": "0.0.0-beta-20260909090007"
29
+ "@askdialog/dialog-sdk": "0.0.0-beta-20260911075342"
30
30
  },
31
31
  "author": "Dialog",
32
32
  "publishConfig": {