@askdialog/dialog-react 2.7.0 → 2.8.0
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 +2 -3
- package/dist/components/DialogProductBlock/DialogAskSomethingElse.d.ts +12 -0
- package/dist/components/DialogProductBlock/DialogProductBlock.d.ts +1 -0
- package/dist/components/DialogProductBlock/inputMessages.d.ts +1 -0
- package/dist/dialog-react.css +1 -1
- package/dist/dialog-react.js +428 -387
- package/dist/dialog-react.umd.cjs +1 -1
- package/package.json +3 -3
package/dist/dialog-react.js
CHANGED
|
@@ -1,14 +1,59 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { useRef as b, useState as v, useEffect as f, useMemo as
|
|
3
|
-
import { registerDialogInstallation as
|
|
4
|
-
import { createPortal as
|
|
5
|
-
const
|
|
1
|
+
import { jsx as o, jsxs as h, Fragment as C } from "react/jsx-runtime";
|
|
2
|
+
import { useRef as b, useState as v, useEffect as f, useMemo as S, useLayoutEffect as V, useCallback as P, useSyncExternalStore as K } from "react";
|
|
3
|
+
import { registerDialogInstallation as M, addAuditCapability as F, resolveTextDirection as U, SearchStatus as L, DialogSearchError as Q, createSearchController as W } from "@askdialog/dialog-sdk";
|
|
4
|
+
import { createPortal as Z } from "react-dom";
|
|
5
|
+
const R = {
|
|
6
|
+
en: {
|
|
7
|
+
placeholder: "Ask the AI a question",
|
|
8
|
+
aiDisclosure: "You're chatting with an AI assistant. It can make mistakes, so please double-check important information",
|
|
9
|
+
askSomethingElse: "Ask something else"
|
|
10
|
+
},
|
|
11
|
+
fr: {
|
|
12
|
+
placeholder: "Posez une question à l'IA",
|
|
13
|
+
aiDisclosure: "Vous discutez avec un assistant IA. Il peut se tromper, pensez à vérifier les informations importantes",
|
|
14
|
+
askSomethingElse: "Posez une autre question"
|
|
15
|
+
},
|
|
16
|
+
es: {
|
|
17
|
+
placeholder: "Haz una pregunta a la IA",
|
|
18
|
+
aiDisclosure: "Estás chateando con un asistente de IA. Puede cometer errores, así que verifica la información importante",
|
|
19
|
+
askSomethingElse: "Pregunta otra cosa"
|
|
20
|
+
}
|
|
21
|
+
}, T = (e) => {
|
|
22
|
+
var n;
|
|
23
|
+
const t = ((n = e == null ? void 0 : e.split("-")[0]) == null ? void 0 : n.toLowerCase()) ?? "en";
|
|
24
|
+
return R[t] ?? R.en;
|
|
25
|
+
}, X = ({
|
|
26
|
+
client: e,
|
|
27
|
+
questions: t,
|
|
28
|
+
disabled: n,
|
|
29
|
+
productId: s,
|
|
30
|
+
productTitle: r,
|
|
31
|
+
selectedVariantId: a
|
|
32
|
+
}) => /* @__PURE__ */ o(
|
|
33
|
+
"button",
|
|
34
|
+
{
|
|
35
|
+
type: "button",
|
|
36
|
+
className: "dialog-ask-something-else",
|
|
37
|
+
disabled: n,
|
|
38
|
+
onClick: () => {
|
|
39
|
+
e.openAssistantWithSuggestions({
|
|
40
|
+
questions: t ?? [],
|
|
41
|
+
product: {
|
|
42
|
+
id: s,
|
|
43
|
+
title: r,
|
|
44
|
+
selectedVariantId: a
|
|
45
|
+
}
|
|
46
|
+
});
|
|
47
|
+
},
|
|
48
|
+
children: T(e.locale).askSomethingElse
|
|
49
|
+
}
|
|
50
|
+
), G = ({
|
|
6
51
|
title: e = "Your expert",
|
|
7
52
|
description: t = "A question about this product?"
|
|
8
|
-
}) => /* @__PURE__ */
|
|
9
|
-
/* @__PURE__ */
|
|
10
|
-
/* @__PURE__ */
|
|
11
|
-
] }),
|
|
53
|
+
}) => /* @__PURE__ */ h("div", { className: "dialog-block-header-container", children: [
|
|
54
|
+
/* @__PURE__ */ o("div", { className: "dialog-block-title", children: e }),
|
|
55
|
+
/* @__PURE__ */ o("div", { className: "dialog-block-description", children: t })
|
|
56
|
+
] }), Y = ({ color: e = "#181825" }) => /* @__PURE__ */ h(
|
|
12
57
|
"svg",
|
|
13
58
|
{
|
|
14
59
|
width: "20",
|
|
@@ -17,8 +62,8 @@ const Q = ({
|
|
|
17
62
|
fill: "none",
|
|
18
63
|
xmlns: "http://www.w3.org/2000/svg",
|
|
19
64
|
children: [
|
|
20
|
-
/* @__PURE__ */
|
|
21
|
-
/* @__PURE__ */
|
|
65
|
+
/* @__PURE__ */ h("g", { clipPath: "url(#clip0_466_934)", children: [
|
|
66
|
+
/* @__PURE__ */ o(
|
|
22
67
|
"path",
|
|
23
68
|
{
|
|
24
69
|
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",
|
|
@@ -28,7 +73,7 @@ const Q = ({
|
|
|
28
73
|
strokeLinejoin: "round"
|
|
29
74
|
}
|
|
30
75
|
),
|
|
31
|
-
/* @__PURE__ */
|
|
76
|
+
/* @__PURE__ */ o(
|
|
32
77
|
"path",
|
|
33
78
|
{
|
|
34
79
|
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",
|
|
@@ -39,58 +84,58 @@ const Q = ({
|
|
|
39
84
|
}
|
|
40
85
|
)
|
|
41
86
|
] }),
|
|
42
|
-
/* @__PURE__ */
|
|
87
|
+
/* @__PURE__ */ o("defs", { children: /* @__PURE__ */ o("clipPath", { id: "clip0_466_934", children: /* @__PURE__ */ o("rect", { width: "20", height: "20", fill: "white" }) }) })
|
|
43
88
|
]
|
|
44
89
|
}
|
|
45
|
-
),
|
|
90
|
+
), J = ({
|
|
46
91
|
client: e,
|
|
47
92
|
questions: t,
|
|
48
|
-
productId:
|
|
93
|
+
productId: n,
|
|
49
94
|
productTitle: s,
|
|
50
|
-
selectedVariantId:
|
|
95
|
+
selectedVariantId: r
|
|
51
96
|
}) => {
|
|
52
|
-
const
|
|
97
|
+
const a = (c) => {
|
|
53
98
|
e.sendProductMessage({
|
|
54
|
-
productId:
|
|
99
|
+
productId: n,
|
|
55
100
|
productTitle: s,
|
|
56
|
-
selectedVariantId:
|
|
57
|
-
question:
|
|
101
|
+
selectedVariantId: r,
|
|
102
|
+
question: c,
|
|
58
103
|
fromQuestionSuggestion: !0
|
|
59
104
|
});
|
|
60
105
|
};
|
|
61
|
-
return /* @__PURE__ */
|
|
106
|
+
return /* @__PURE__ */ o(C, { children: t.map((c) => /* @__PURE__ */ h(
|
|
62
107
|
"button",
|
|
63
108
|
{
|
|
64
109
|
className: "dialog-block-suggestions-item",
|
|
65
|
-
onClick: () =>
|
|
110
|
+
onClick: () => a(c.question),
|
|
66
111
|
children: [
|
|
67
|
-
/* @__PURE__ */
|
|
68
|
-
/* @__PURE__ */
|
|
112
|
+
/* @__PURE__ */ o(Y, { color: e.theme.primaryColor }),
|
|
113
|
+
/* @__PURE__ */ o("span", { className: "dialog-block-suggestions-item-label", children: c.question })
|
|
69
114
|
]
|
|
70
115
|
},
|
|
71
|
-
|
|
116
|
+
c.question
|
|
72
117
|
)) });
|
|
73
|
-
},
|
|
74
|
-
/* @__PURE__ */
|
|
75
|
-
/* @__PURE__ */
|
|
76
|
-
/* @__PURE__ */
|
|
77
|
-
] }),
|
|
118
|
+
}, ee = () => /* @__PURE__ */ h(C, { children: [
|
|
119
|
+
/* @__PURE__ */ o("div", { className: "dialog-block-suggestions-skeleton-item" }),
|
|
120
|
+
/* @__PURE__ */ o("div", { className: "dialog-block-suggestions-skeleton-item" }),
|
|
121
|
+
/* @__PURE__ */ o("div", { className: "dialog-block-suggestions-skeleton-item" })
|
|
122
|
+
] }), te = ({
|
|
78
123
|
client: e,
|
|
79
124
|
questions: t,
|
|
80
|
-
isLoading:
|
|
125
|
+
isLoading: n,
|
|
81
126
|
productId: s,
|
|
82
|
-
productTitle:
|
|
83
|
-
selectedVariantId:
|
|
84
|
-
}) => /* @__PURE__ */
|
|
85
|
-
|
|
127
|
+
productTitle: r,
|
|
128
|
+
selectedVariantId: a
|
|
129
|
+
}) => /* @__PURE__ */ o("div", { className: "dialog-block-suggestions-container", children: n || !t ? /* @__PURE__ */ o(ee, {}) : /* @__PURE__ */ o(
|
|
130
|
+
J,
|
|
86
131
|
{
|
|
87
132
|
client: e,
|
|
88
133
|
questions: t,
|
|
89
134
|
productId: s,
|
|
90
|
-
productTitle:
|
|
91
|
-
selectedVariantId:
|
|
135
|
+
productTitle: r,
|
|
136
|
+
selectedVariantId: a
|
|
92
137
|
}
|
|
93
|
-
) }),
|
|
138
|
+
) }), se = ({ color: e = "#ffffff" }) => /* @__PURE__ */ o(
|
|
94
139
|
"svg",
|
|
95
140
|
{
|
|
96
141
|
width: "20",
|
|
@@ -98,7 +143,7 @@ const Q = ({
|
|
|
98
143
|
viewBox: "0 0 20 20",
|
|
99
144
|
fill: "none",
|
|
100
145
|
xmlns: "http://www.w3.org/2000/svg",
|
|
101
|
-
children: /* @__PURE__ */
|
|
146
|
+
children: /* @__PURE__ */ o(
|
|
102
147
|
"path",
|
|
103
148
|
{
|
|
104
149
|
d: "M10 16.6667V3.33334M10 3.33334L5 8.33334M10 3.33334L15 8.33334",
|
|
@@ -109,88 +154,71 @@ const Q = ({
|
|
|
109
154
|
}
|
|
110
155
|
)
|
|
111
156
|
}
|
|
112
|
-
),
|
|
113
|
-
en: {
|
|
114
|
-
placeholder: "Ask the AI a question",
|
|
115
|
-
aiDisclosure: "You're chatting with an AI assistant. It can make mistakes, so please double-check important information"
|
|
116
|
-
},
|
|
117
|
-
fr: {
|
|
118
|
-
placeholder: "Posez une question à l'IA",
|
|
119
|
-
aiDisclosure: "Vous discutez avec un assistant IA. Il peut se tromper, pensez à vérifier les informations importantes"
|
|
120
|
-
},
|
|
121
|
-
es: {
|
|
122
|
-
placeholder: "Haz una pregunta a la IA",
|
|
123
|
-
aiDisclosure: "Estás chateando con un asistente de IA. Puede cometer errores, así que verifica la información importante"
|
|
124
|
-
}
|
|
125
|
-
}, ee = (e) => {
|
|
126
|
-
var r;
|
|
127
|
-
const t = ((r = e == null ? void 0 : e.split("-")[0]) == null ? void 0 : r.toLowerCase()) ?? "en";
|
|
128
|
-
return E[t] ?? E.en;
|
|
129
|
-
}, te = ({
|
|
157
|
+
), ne = ({
|
|
130
158
|
client: e,
|
|
131
159
|
productId: t,
|
|
132
|
-
productTitle:
|
|
160
|
+
productTitle: n,
|
|
133
161
|
selectedVariantId: s
|
|
134
162
|
}) => {
|
|
135
|
-
const
|
|
163
|
+
const r = b(null), [a, c] = v(""), i = T(e.locale), l = () => {
|
|
136
164
|
var d;
|
|
137
|
-
(d =
|
|
165
|
+
(d = r.current) == null || d.focus();
|
|
138
166
|
}, u = () => {
|
|
139
|
-
const d =
|
|
167
|
+
const d = a;
|
|
140
168
|
d.trim() && (e.sendProductMessage({
|
|
141
169
|
productId: t,
|
|
142
|
-
productTitle:
|
|
170
|
+
productTitle: n,
|
|
143
171
|
selectedVariantId: s,
|
|
144
172
|
question: d,
|
|
145
173
|
fromQuestionSuggestion: !0
|
|
146
|
-
}),
|
|
174
|
+
}), c(""));
|
|
147
175
|
}, p = (d) => {
|
|
148
176
|
d.key === "Enter" && u();
|
|
149
177
|
};
|
|
150
|
-
return /* @__PURE__ */
|
|
151
|
-
/* @__PURE__ */
|
|
152
|
-
/* @__PURE__ */
|
|
178
|
+
return /* @__PURE__ */ h("div", { className: "dialog-input-container", children: [
|
|
179
|
+
/* @__PURE__ */ h("div", { className: "dialog-input-wrapper", onClick: l, children: [
|
|
180
|
+
/* @__PURE__ */ o(
|
|
153
181
|
"input",
|
|
154
182
|
{
|
|
155
183
|
id: "dialog-ask-anything-input-ai-input",
|
|
156
|
-
ref:
|
|
157
|
-
value:
|
|
158
|
-
onChange: (d) =>
|
|
184
|
+
ref: r,
|
|
185
|
+
value: a,
|
|
186
|
+
onChange: (d) => c(d.target.value),
|
|
159
187
|
className: "dialog-ask-anything-input-ai-input",
|
|
160
|
-
placeholder:
|
|
188
|
+
placeholder: i.placeholder,
|
|
161
189
|
"aria-describedby": "dialog-input-ai-disclosure",
|
|
162
190
|
onKeyDown: p
|
|
163
191
|
}
|
|
164
192
|
),
|
|
165
|
-
/* @__PURE__ */
|
|
193
|
+
/* @__PURE__ */ o(
|
|
166
194
|
"button",
|
|
167
195
|
{
|
|
168
196
|
id: "send-message-button-ai-input",
|
|
169
197
|
className: "dialog-input-submit",
|
|
170
|
-
disabled: !
|
|
198
|
+
disabled: !a.trim(),
|
|
171
199
|
onClick: u,
|
|
172
|
-
children: /* @__PURE__ */
|
|
200
|
+
children: /* @__PURE__ */ o(se, { color: e.theme.ctaTextColor })
|
|
173
201
|
}
|
|
174
202
|
)
|
|
175
203
|
] }),
|
|
176
|
-
/* @__PURE__ */
|
|
204
|
+
/* @__PURE__ */ o("p", { id: "dialog-input-ai-disclosure", className: "dialog-input-ai-disclosure", children: i.aiDisclosure })
|
|
177
205
|
] });
|
|
178
|
-
},
|
|
206
|
+
}, I = (e) => e.replace(/([A-Z])/g, "-$1").toLowerCase(), oe = (e) => {
|
|
179
207
|
if (!e) return;
|
|
180
208
|
const t = document.body;
|
|
181
|
-
Object.keys(e).forEach((
|
|
182
|
-
const s =
|
|
209
|
+
Object.keys(e).forEach((n) => {
|
|
210
|
+
const s = n, r = I(n);
|
|
183
211
|
if (e[s] !== void 0) {
|
|
184
212
|
if (typeof e[s] == "object") {
|
|
185
213
|
Object.keys(e[s]).forEach(
|
|
186
|
-
(
|
|
187
|
-
var
|
|
188
|
-
const
|
|
189
|
-
if (
|
|
190
|
-
const
|
|
214
|
+
(a) => {
|
|
215
|
+
var i;
|
|
216
|
+
const c = a;
|
|
217
|
+
if (c !== void 0) {
|
|
218
|
+
const l = I(a), u = e[s];
|
|
191
219
|
t.style.setProperty(
|
|
192
|
-
`--dialog-theme-${
|
|
193
|
-
(
|
|
220
|
+
`--dialog-theme-${r}-${l}`,
|
|
221
|
+
(i = u[c]) == null ? void 0 : i.toString()
|
|
194
222
|
);
|
|
195
223
|
}
|
|
196
224
|
}
|
|
@@ -198,98 +226,111 @@ const Q = ({
|
|
|
198
226
|
return;
|
|
199
227
|
}
|
|
200
228
|
if (s === "ctaBorderType") {
|
|
201
|
-
const
|
|
202
|
-
t.style.setProperty(`--dialog-theme-${
|
|
229
|
+
const a = e[s] === "rounded" ? "24px" : "0";
|
|
230
|
+
t.style.setProperty(`--dialog-theme-${r}`, a);
|
|
203
231
|
return;
|
|
204
232
|
}
|
|
205
233
|
t.style.setProperty(
|
|
206
|
-
`--dialog-theme-${
|
|
234
|
+
`--dialog-theme-${r}`,
|
|
207
235
|
e[s].toString()
|
|
208
236
|
);
|
|
209
237
|
}
|
|
210
238
|
});
|
|
211
239
|
}, re = ({ theme: e, children: t }) => (f(() => {
|
|
212
|
-
e &&
|
|
213
|
-
}, [e]), /* @__PURE__ */
|
|
240
|
+
e && oe(e);
|
|
241
|
+
}, [e]), /* @__PURE__ */ o(C, { children: t })), ie = 2, ae = 5, Ze = ({
|
|
214
242
|
client: e,
|
|
215
243
|
productId: t,
|
|
216
|
-
productTitle:
|
|
244
|
+
productTitle: n,
|
|
217
245
|
selectedVariantId: s,
|
|
218
|
-
enableInput:
|
|
246
|
+
enableInput: r = !1
|
|
219
247
|
}) => {
|
|
220
|
-
|
|
248
|
+
var g;
|
|
249
|
+
const [a, c] = v(!0), [i, l] = v(
|
|
221
250
|
void 0
|
|
222
251
|
);
|
|
223
252
|
f(() => {
|
|
224
|
-
|
|
253
|
+
M({
|
|
225
254
|
method: "react",
|
|
226
|
-
version: "2.
|
|
227
|
-
}),
|
|
255
|
+
version: "2.8.0"
|
|
256
|
+
}), F("pdp-block");
|
|
228
257
|
}, []);
|
|
229
|
-
const u =
|
|
230
|
-
() =>
|
|
231
|
-
[
|
|
232
|
-
), p =
|
|
233
|
-
() =>
|
|
234
|
-
[
|
|
235
|
-
), d =
|
|
236
|
-
() =>
|
|
237
|
-
[
|
|
238
|
-
), m =
|
|
258
|
+
const u = S(
|
|
259
|
+
() => a ? "" : i == null ? void 0 : i.assistantName,
|
|
260
|
+
[i, a]
|
|
261
|
+
), p = S(
|
|
262
|
+
() => a ? "" : i == null ? void 0 : i.description,
|
|
263
|
+
[i, a]
|
|
264
|
+
), d = S(
|
|
265
|
+
() => a ? "" : i == null ? void 0 : i.inputPlaceholder,
|
|
266
|
+
[i, a]
|
|
267
|
+
), m = S(
|
|
239
268
|
() => {
|
|
240
|
-
var
|
|
241
|
-
return
|
|
269
|
+
var y;
|
|
270
|
+
return U((y = e.getLocalizationInformations()) == null ? void 0 : y.languageCode);
|
|
242
271
|
},
|
|
243
272
|
[e]
|
|
244
273
|
);
|
|
245
274
|
return f(() => {
|
|
246
|
-
let
|
|
275
|
+
let y = !0;
|
|
247
276
|
return (async () => {
|
|
248
|
-
|
|
277
|
+
c(!0), l(void 0);
|
|
249
278
|
try {
|
|
250
|
-
const
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
279
|
+
const E = await e.getSuggestions(t, {
|
|
280
|
+
limit: ae
|
|
281
|
+
});
|
|
282
|
+
y && l(E);
|
|
283
|
+
} catch (E) {
|
|
284
|
+
console.error("error", E);
|
|
254
285
|
} finally {
|
|
255
|
-
|
|
286
|
+
y && c(!1);
|
|
256
287
|
}
|
|
257
288
|
})(), () => {
|
|
258
|
-
|
|
289
|
+
y = !1;
|
|
259
290
|
};
|
|
260
|
-
}, [e, t]), /* @__PURE__ */
|
|
291
|
+
}, [e, t]), /* @__PURE__ */ o(re, { theme: e.theme, children: /* @__PURE__ */ h(
|
|
261
292
|
"div",
|
|
262
293
|
{
|
|
263
294
|
id: "dialog-instant",
|
|
264
295
|
className: "dialog-block-container",
|
|
265
296
|
dir: m,
|
|
266
297
|
children: [
|
|
267
|
-
/* @__PURE__ */
|
|
268
|
-
/* @__PURE__ */
|
|
269
|
-
|
|
298
|
+
/* @__PURE__ */ o(G, { title: u, description: p }),
|
|
299
|
+
/* @__PURE__ */ o(
|
|
300
|
+
te,
|
|
270
301
|
{
|
|
271
302
|
client: e,
|
|
272
|
-
questions:
|
|
273
|
-
isLoading:
|
|
303
|
+
questions: (g = i == null ? void 0 : i.questions) == null ? void 0 : g.slice(0, ie),
|
|
304
|
+
isLoading: a,
|
|
274
305
|
productId: t,
|
|
275
|
-
productTitle:
|
|
306
|
+
productTitle: n,
|
|
276
307
|
selectedVariantId: s
|
|
277
308
|
}
|
|
278
309
|
),
|
|
279
|
-
|
|
280
|
-
|
|
310
|
+
r ? /* @__PURE__ */ o(
|
|
311
|
+
ne,
|
|
281
312
|
{
|
|
282
313
|
client: e,
|
|
283
314
|
placeholder: d,
|
|
284
315
|
productId: t,
|
|
285
|
-
productTitle:
|
|
316
|
+
productTitle: n,
|
|
317
|
+
selectedVariantId: s
|
|
318
|
+
}
|
|
319
|
+
) : /* @__PURE__ */ o(
|
|
320
|
+
X,
|
|
321
|
+
{
|
|
322
|
+
client: e,
|
|
323
|
+
questions: i == null ? void 0 : i.questions,
|
|
324
|
+
disabled: a,
|
|
325
|
+
productId: t,
|
|
326
|
+
productTitle: n,
|
|
286
327
|
selectedVariantId: s
|
|
287
328
|
}
|
|
288
329
|
)
|
|
289
330
|
]
|
|
290
331
|
}
|
|
291
332
|
) });
|
|
292
|
-
},
|
|
333
|
+
}, le = () => /* @__PURE__ */ o(
|
|
293
334
|
"svg",
|
|
294
335
|
{
|
|
295
336
|
width: 16,
|
|
@@ -298,7 +339,7 @@ const Q = ({
|
|
|
298
339
|
fill: "none",
|
|
299
340
|
xmlns: "http://www.w3.org/2000/svg",
|
|
300
341
|
"aria-hidden": "true",
|
|
301
|
-
children: /* @__PURE__ */
|
|
342
|
+
children: /* @__PURE__ */ o(
|
|
302
343
|
"path",
|
|
303
344
|
{
|
|
304
345
|
d: "M8 13V3M8 3L3 8M8 3L13 8",
|
|
@@ -309,9 +350,9 @@ const Q = ({
|
|
|
309
350
|
}
|
|
310
351
|
)
|
|
311
352
|
}
|
|
312
|
-
),
|
|
353
|
+
), ce = "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", de = ({
|
|
313
354
|
color: e = "currentColor"
|
|
314
|
-
}) => /* @__PURE__ */
|
|
355
|
+
}) => /* @__PURE__ */ o(
|
|
315
356
|
"svg",
|
|
316
357
|
{
|
|
317
358
|
width: 16,
|
|
@@ -320,47 +361,47 @@ const Q = ({
|
|
|
320
361
|
fill: "none",
|
|
321
362
|
xmlns: "http://www.w3.org/2000/svg",
|
|
322
363
|
"aria-hidden": "true",
|
|
323
|
-
children: /* @__PURE__ */
|
|
364
|
+
children: /* @__PURE__ */ o("path", { d: ce, fill: e })
|
|
324
365
|
}
|
|
325
|
-
),
|
|
366
|
+
), Xe = ({
|
|
326
367
|
controller: e,
|
|
327
368
|
placeholder: t = "Search products...",
|
|
328
|
-
autoFocus:
|
|
369
|
+
autoFocus: n = !1,
|
|
329
370
|
submitAriaLabel: s = "Search"
|
|
330
371
|
}) => {
|
|
331
|
-
const [
|
|
332
|
-
return /* @__PURE__ */
|
|
333
|
-
|
|
372
|
+
const [r, a] = v("");
|
|
373
|
+
return /* @__PURE__ */ h("form", { className: "dialog-search-bar", role: "search", onSubmit: (i) => {
|
|
374
|
+
i.preventDefault(), e.submit(r);
|
|
334
375
|
}, children: [
|
|
335
|
-
/* @__PURE__ */
|
|
336
|
-
/* @__PURE__ */
|
|
337
|
-
/* @__PURE__ */
|
|
376
|
+
/* @__PURE__ */ h("div", { className: "dialog-search-bar-field", children: [
|
|
377
|
+
/* @__PURE__ */ o("span", { className: "dialog-search-bar-icon", children: /* @__PURE__ */ o(de, {}) }),
|
|
378
|
+
/* @__PURE__ */ o(
|
|
338
379
|
"input",
|
|
339
380
|
{
|
|
340
381
|
type: "text",
|
|
341
382
|
name: "dialog-search-query",
|
|
342
383
|
className: "dialog-search-bar-input",
|
|
343
|
-
value:
|
|
384
|
+
value: r,
|
|
344
385
|
"aria-label": t,
|
|
345
386
|
placeholder: t,
|
|
346
|
-
autoFocus:
|
|
347
|
-
onChange: (
|
|
348
|
-
i
|
|
387
|
+
autoFocus: n,
|
|
388
|
+
onChange: (i) => {
|
|
389
|
+
a(i.target.value), e.setQuery(i.target.value);
|
|
349
390
|
}
|
|
350
391
|
}
|
|
351
392
|
)
|
|
352
393
|
] }),
|
|
353
|
-
/* @__PURE__ */
|
|
394
|
+
/* @__PURE__ */ o(
|
|
354
395
|
"button",
|
|
355
396
|
{
|
|
356
397
|
type: "submit",
|
|
357
398
|
className: "dialog-search-bar-submit",
|
|
358
399
|
"aria-label": s,
|
|
359
|
-
children: /* @__PURE__ */
|
|
400
|
+
children: /* @__PURE__ */ o(le, {})
|
|
360
401
|
}
|
|
361
402
|
)
|
|
362
403
|
] });
|
|
363
|
-
},
|
|
404
|
+
}, ue = (e, t) => {
|
|
364
405
|
try {
|
|
365
406
|
return new Intl.NumberFormat(t).format(e);
|
|
366
407
|
} catch {
|
|
@@ -378,7 +419,7 @@ const Q = ({
|
|
|
378
419
|
seeAllLabel: (t) => t === 1 ? "See the result" : `See all ${e(t)} results`,
|
|
379
420
|
previous: "Previous",
|
|
380
421
|
next: "Next",
|
|
381
|
-
pageOf: (t,
|
|
422
|
+
pageOf: (t, n) => `Page ${e(t)} / ${e(n)}`
|
|
382
423
|
}),
|
|
383
424
|
fr: (e) => ({
|
|
384
425
|
searching: (t) => `Recherche de « ${t} »…`,
|
|
@@ -391,7 +432,7 @@ const Q = ({
|
|
|
391
432
|
seeAllLabel: (t) => t === 1 ? "Voir le résultat" : `Voir les ${e(t)} résultats`,
|
|
392
433
|
previous: "Précédent",
|
|
393
434
|
next: "Suivant",
|
|
394
|
-
pageOf: (t,
|
|
435
|
+
pageOf: (t, n) => `Page ${e(t)} / ${e(n)}`
|
|
395
436
|
}),
|
|
396
437
|
de: (e) => ({
|
|
397
438
|
searching: (t) => `Suche nach „${t}“…`,
|
|
@@ -404,7 +445,7 @@ const Q = ({
|
|
|
404
445
|
seeAllLabel: (t) => t === 1 ? "Das Ergebnis anzeigen" : `Alle ${e(t)} Ergebnisse anzeigen`,
|
|
405
446
|
previous: "Zurück",
|
|
406
447
|
next: "Weiter",
|
|
407
|
-
pageOf: (t,
|
|
448
|
+
pageOf: (t, n) => `Seite ${e(t)} / ${e(n)}`
|
|
408
449
|
}),
|
|
409
450
|
es: (e) => ({
|
|
410
451
|
searching: (t) => `Buscando «${t}»…`,
|
|
@@ -417,7 +458,7 @@ const Q = ({
|
|
|
417
458
|
seeAllLabel: (t) => t === 1 ? "Ver el resultado" : `Ver los ${e(t)} resultados`,
|
|
418
459
|
previous: "Anterior",
|
|
419
460
|
next: "Siguiente",
|
|
420
|
-
pageOf: (t,
|
|
461
|
+
pageOf: (t, n) => `Página ${e(t)} / ${e(n)}`
|
|
421
462
|
}),
|
|
422
463
|
it: (e) => ({
|
|
423
464
|
searching: (t) => `Ricerca di “${t}”…`,
|
|
@@ -430,123 +471,123 @@ const Q = ({
|
|
|
430
471
|
seeAllLabel: (t) => t === 1 ? "Vedi il risultato" : `Vedi tutti i ${e(t)} risultati`,
|
|
431
472
|
previous: "Precedente",
|
|
432
473
|
next: "Successivo",
|
|
433
|
-
pageOf: (t,
|
|
474
|
+
pageOf: (t, n) => `Pagina ${e(t)} / ${e(n)}`
|
|
434
475
|
})
|
|
435
|
-
},
|
|
476
|
+
}, O = (e) => {
|
|
436
477
|
var s;
|
|
437
478
|
const t = ((s = e == null ? void 0 : e.split("-")[0]) == null ? void 0 : s.toLowerCase()) ?? "en";
|
|
438
|
-
return ($[t] ?? $.en)((
|
|
439
|
-
},
|
|
479
|
+
return ($[t] ?? $.en)((r) => ue(r, e));
|
|
480
|
+
}, _ = (e) => e.status !== L.LOADING && e.response !== void 0 && e.response.nbPages > 1, he = ({
|
|
440
481
|
controller: e,
|
|
441
482
|
state: t,
|
|
442
|
-
locale:
|
|
483
|
+
locale: n
|
|
443
484
|
}) => {
|
|
444
485
|
const s = t.response;
|
|
445
|
-
if (s === void 0 || !
|
|
486
|
+
if (s === void 0 || !_(t))
|
|
446
487
|
return null;
|
|
447
|
-
const
|
|
448
|
-
return /* @__PURE__ */
|
|
449
|
-
/* @__PURE__ */
|
|
488
|
+
const r = O(n);
|
|
489
|
+
return /* @__PURE__ */ h("nav", { "aria-label": "Search results pages", className: "dialog-search-pagination", children: [
|
|
490
|
+
/* @__PURE__ */ o(
|
|
450
491
|
"button",
|
|
451
492
|
{
|
|
452
493
|
type: "button",
|
|
453
494
|
disabled: s.page === 0,
|
|
454
495
|
onClick: () => e.setPage(s.page - 1),
|
|
455
|
-
children:
|
|
496
|
+
children: r.previous
|
|
456
497
|
}
|
|
457
498
|
),
|
|
458
|
-
/* @__PURE__ */
|
|
459
|
-
/* @__PURE__ */
|
|
499
|
+
/* @__PURE__ */ o("span", { children: r.pageOf(s.page + 1, s.nbPages) }),
|
|
500
|
+
/* @__PURE__ */ o(
|
|
460
501
|
"button",
|
|
461
502
|
{
|
|
462
503
|
type: "button",
|
|
463
504
|
disabled: s.page >= s.nbPages - 1,
|
|
464
505
|
onClick: () => e.setPage(s.page + 1),
|
|
465
|
-
children:
|
|
506
|
+
children: r.next
|
|
466
507
|
}
|
|
467
508
|
)
|
|
468
509
|
] });
|
|
469
|
-
},
|
|
470
|
-
const
|
|
510
|
+
}, D = (e) => e.normalize("NFD").replace(new RegExp("\\p{M}", "gu"), "").replace(/ẞ/gu, "ß").toUpperCase().toLowerCase().replace(/ς/g, "σ"), ge = (e, t) => {
|
|
511
|
+
const n = { before: "", match: e, after: "" }, s = D(t.trim());
|
|
471
512
|
if (s === "")
|
|
472
|
-
return
|
|
473
|
-
const
|
|
474
|
-
let
|
|
475
|
-
|
|
476
|
-
const m =
|
|
477
|
-
for (let
|
|
478
|
-
|
|
479
|
-
|
|
513
|
+
return n;
|
|
514
|
+
const r = [...e], a = [];
|
|
515
|
+
let c = "";
|
|
516
|
+
r.forEach((p, d) => {
|
|
517
|
+
const m = D(p);
|
|
518
|
+
for (let g = 0; g < m.length; g += 1)
|
|
519
|
+
a.push(d);
|
|
520
|
+
c += m;
|
|
480
521
|
});
|
|
481
|
-
const
|
|
482
|
-
if (
|
|
483
|
-
return
|
|
484
|
-
const
|
|
522
|
+
const i = c.indexOf(s);
|
|
523
|
+
if (i === -1)
|
|
524
|
+
return n;
|
|
525
|
+
const l = a[i], u = a[i + s.length - 1] + 1;
|
|
485
526
|
return {
|
|
486
|
-
before:
|
|
487
|
-
match:
|
|
488
|
-
after:
|
|
527
|
+
before: r.slice(0, l).join(""),
|
|
528
|
+
match: r.slice(l, u).join(""),
|
|
529
|
+
after: r.slice(u).join("")
|
|
489
530
|
};
|
|
490
|
-
},
|
|
531
|
+
}, H = ({
|
|
491
532
|
title: e,
|
|
492
533
|
query: t
|
|
493
534
|
}) => {
|
|
494
|
-
const { before:
|
|
495
|
-
return /* @__PURE__ */
|
|
496
|
-
|
|
497
|
-
/* @__PURE__ */
|
|
498
|
-
|
|
535
|
+
const { before: n, match: s, after: r } = ge(e, t);
|
|
536
|
+
return /* @__PURE__ */ h(C, { children: [
|
|
537
|
+
n !== "" && /* @__PURE__ */ o("span", { className: "dialog-search-muted", children: n }),
|
|
538
|
+
/* @__PURE__ */ o("span", { className: "dialog-search-match", children: s }),
|
|
539
|
+
r !== "" && /* @__PURE__ */ o("span", { className: "dialog-search-muted", children: r })
|
|
499
540
|
] });
|
|
500
|
-
},
|
|
541
|
+
}, pe = ({ amount: e, currencyCode: t }, n) => t === void 0 ? new Intl.NumberFormat(n).format(Number(e)) : new Intl.NumberFormat(n, {
|
|
501
542
|
style: "currency",
|
|
502
543
|
currency: t
|
|
503
|
-
}).format(Number(e)),
|
|
544
|
+
}).format(Number(e)), me = (e, t) => {
|
|
504
545
|
if (e === void 0)
|
|
505
546
|
return "";
|
|
506
547
|
try {
|
|
507
|
-
return
|
|
548
|
+
return pe(e.min, t);
|
|
508
549
|
} catch {
|
|
509
550
|
return "";
|
|
510
551
|
}
|
|
511
|
-
},
|
|
552
|
+
}, fe = (e) => {
|
|
512
553
|
try {
|
|
513
554
|
const { protocol: t } = new URL(e, window.location.href);
|
|
514
555
|
return t === "http:" || t === "https:" ? e : void 0;
|
|
515
556
|
} catch {
|
|
516
557
|
return;
|
|
517
558
|
}
|
|
518
|
-
},
|
|
559
|
+
}, q = (e) => e.url === void 0 || e.url === "" ? void 0 : fe(e.url), B = (e) => e.title ?? e.handle ?? e.objectID, be = ({
|
|
519
560
|
controller: e,
|
|
520
561
|
hit: t,
|
|
521
|
-
index:
|
|
562
|
+
index: n,
|
|
522
563
|
locale: s,
|
|
523
|
-
query:
|
|
564
|
+
query: r = ""
|
|
524
565
|
}) => {
|
|
525
|
-
const
|
|
566
|
+
const a = b(null);
|
|
526
567
|
f(() => {
|
|
527
|
-
|
|
528
|
-
}, [e, t,
|
|
529
|
-
const
|
|
568
|
+
a.current !== null && e.observeResult(a.current, n);
|
|
569
|
+
}, [e, t, n]);
|
|
570
|
+
const c = (d) => {
|
|
530
571
|
const m = d.metaKey || d.ctrlKey || d.shiftKey || d.altKey;
|
|
531
|
-
e.selectResult(
|
|
532
|
-
},
|
|
533
|
-
d.button === 1 && e.selectResult(
|
|
534
|
-
},
|
|
535
|
-
/* @__PURE__ */
|
|
536
|
-
/* @__PURE__ */
|
|
537
|
-
|
|
572
|
+
e.selectResult(n, { navigate: !m }) && d.preventDefault();
|
|
573
|
+
}, i = (d) => {
|
|
574
|
+
d.button === 1 && e.selectResult(n, { navigate: !1 });
|
|
575
|
+
}, l = me(t.priceRange, s), u = q(t), p = /* @__PURE__ */ h(C, { children: [
|
|
576
|
+
/* @__PURE__ */ o("span", { className: "dialog-search-product-thumb", "aria-hidden": !0, children: t.imageUrl !== void 0 && t.imageUrl !== "" && /* @__PURE__ */ o("img", { src: t.imageUrl, alt: "", loading: "lazy" }) }),
|
|
577
|
+
/* @__PURE__ */ o("span", { className: "dialog-search-product-title", children: /* @__PURE__ */ o(H, { title: B(t), query: r }) }),
|
|
578
|
+
l !== "" && /* @__PURE__ */ o("span", { className: "dialog-search-product-price", children: l })
|
|
538
579
|
] });
|
|
539
|
-
return /* @__PURE__ */
|
|
580
|
+
return /* @__PURE__ */ o("li", { ref: a, className: "dialog-search-card", children: u === void 0 ? /* @__PURE__ */ o("div", { className: "dialog-search-product", children: p }) : /* @__PURE__ */ o(
|
|
540
581
|
"a",
|
|
541
582
|
{
|
|
542
583
|
className: "dialog-search-product",
|
|
543
584
|
href: u,
|
|
544
|
-
onClick:
|
|
545
|
-
onAuxClick:
|
|
585
|
+
onClick: c,
|
|
586
|
+
onAuxClick: i,
|
|
546
587
|
children: p
|
|
547
588
|
}
|
|
548
589
|
) });
|
|
549
|
-
},
|
|
590
|
+
}, ve = () => /* @__PURE__ */ o(
|
|
550
591
|
"svg",
|
|
551
592
|
{
|
|
552
593
|
width: 16,
|
|
@@ -555,9 +596,9 @@ const Q = ({
|
|
|
555
596
|
fill: "currentColor",
|
|
556
597
|
xmlns: "http://www.w3.org/2000/svg",
|
|
557
598
|
"aria-hidden": "true",
|
|
558
|
-
children: /* @__PURE__ */
|
|
599
|
+
children: /* @__PURE__ */ o("path", { d: "M221.66,133.66l-72,72a8,8,0,0,1-11.32-11.32L196.69,136H40a8,8,0,0,1,0-16H196.69L138.34,61.66a8,8,0,0,1,11.32-11.32l72,72A8,8,0,0,1,221.66,133.66Z" })
|
|
559
600
|
}
|
|
560
|
-
),
|
|
601
|
+
), Ce = () => /* @__PURE__ */ o(
|
|
561
602
|
"svg",
|
|
562
603
|
{
|
|
563
604
|
width: 12,
|
|
@@ -566,100 +607,100 @@ const Q = ({
|
|
|
566
607
|
fill: "currentColor",
|
|
567
608
|
xmlns: "http://www.w3.org/2000/svg",
|
|
568
609
|
"aria-hidden": "true",
|
|
569
|
-
children: /* @__PURE__ */
|
|
610
|
+
children: /* @__PURE__ */ o("path", { d: "M181.66,133.66l-80,80a8,8,0,0,1-11.32-11.32L164.69,128,90.34,53.66a8,8,0,0,1,11.32-11.32l80,80A8,8,0,0,1,181.66,133.66Z" })
|
|
570
611
|
}
|
|
571
|
-
),
|
|
572
|
-
const
|
|
573
|
-
return
|
|
574
|
-
}),
|
|
612
|
+
), j = (e) => (e ?? []).flatMap((t) => {
|
|
613
|
+
const n = q(t);
|
|
614
|
+
return n === void 0 ? [] : [{ collection: t, href: n }];
|
|
615
|
+
}), ye = ({
|
|
575
616
|
collections: e,
|
|
576
617
|
query: t,
|
|
577
|
-
messages:
|
|
618
|
+
messages: n
|
|
578
619
|
}) => {
|
|
579
|
-
const s =
|
|
580
|
-
return s.length === 0 ? null : /* @__PURE__ */
|
|
581
|
-
/* @__PURE__ */
|
|
582
|
-
/* @__PURE__ */
|
|
583
|
-
/* @__PURE__ */
|
|
620
|
+
const s = j(e);
|
|
621
|
+
return s.length === 0 ? null : /* @__PURE__ */ h("aside", { className: "dialog-search-collections", children: [
|
|
622
|
+
/* @__PURE__ */ h("div", { className: "dialog-search-section-head", children: [
|
|
623
|
+
/* @__PURE__ */ o("p", { className: "dialog-search-label", children: n.collectionsLabel }),
|
|
624
|
+
/* @__PURE__ */ o("span", { className: "dialog-search-count", children: n.collectionsCount(s.length) })
|
|
584
625
|
] }),
|
|
585
|
-
/* @__PURE__ */
|
|
586
|
-
/* @__PURE__ */
|
|
587
|
-
/* @__PURE__ */
|
|
588
|
-
/* @__PURE__ */
|
|
589
|
-
] }) },
|
|
626
|
+
/* @__PURE__ */ o("ul", { className: "dialog-search-collection-list", children: s.map(({ collection: r, href: a }) => /* @__PURE__ */ o("li", { children: /* @__PURE__ */ h("a", { className: "dialog-search-collection", href: a, children: [
|
|
627
|
+
/* @__PURE__ */ o("span", { className: "dialog-search-collection-thumb", "aria-hidden": !0, children: r.imageUrl !== void 0 && r.imageUrl !== "" && /* @__PURE__ */ o("img", { src: r.imageUrl, alt: "", loading: "lazy" }) }),
|
|
628
|
+
/* @__PURE__ */ o("span", { className: "dialog-search-collection-title", children: /* @__PURE__ */ o(H, { title: B(r), query: t }) }),
|
|
629
|
+
/* @__PURE__ */ o("span", { className: "dialog-search-caret", children: /* @__PURE__ */ o(Ce, {}) })
|
|
630
|
+
] }) }, r.objectID)) })
|
|
590
631
|
] });
|
|
591
|
-
},
|
|
632
|
+
}, Se = ({
|
|
592
633
|
controller: e,
|
|
593
634
|
response: t,
|
|
594
|
-
locale:
|
|
635
|
+
locale: n,
|
|
595
636
|
messages: s
|
|
596
|
-
}) => /* @__PURE__ */
|
|
597
|
-
/* @__PURE__ */
|
|
637
|
+
}) => /* @__PURE__ */ h("section", { className: "dialog-search-products", children: [
|
|
638
|
+
/* @__PURE__ */ o("div", { className: "dialog-search-section-head", children: /* @__PURE__ */ h("p", { className: "dialog-search-label", children: [
|
|
598
639
|
s.productsLabel,
|
|
599
|
-
t.nbHits > 0 && /* @__PURE__ */
|
|
640
|
+
t.nbHits > 0 && /* @__PURE__ */ o("span", { className: "dialog-search-label-count", children: ` · ${s.resultsCount(t.nbHits)}` })
|
|
600
641
|
] }) }),
|
|
601
|
-
/* @__PURE__ */
|
|
602
|
-
|
|
642
|
+
/* @__PURE__ */ o("ul", { className: "dialog-search-results", children: t.hits.length === 0 ? /* @__PURE__ */ o("li", { className: "dialog-search-empty", role: "status", children: s.noResults }) : t.hits.map((r, a) => /* @__PURE__ */ o(
|
|
643
|
+
be,
|
|
603
644
|
{
|
|
604
645
|
controller: e,
|
|
605
|
-
hit:
|
|
606
|
-
index:
|
|
607
|
-
locale:
|
|
646
|
+
hit: r,
|
|
647
|
+
index: a,
|
|
648
|
+
locale: n,
|
|
608
649
|
query: t.query
|
|
609
650
|
},
|
|
610
|
-
|
|
651
|
+
r.objectID
|
|
611
652
|
)) })
|
|
612
|
-
] }),
|
|
613
|
-
const
|
|
614
|
-
|
|
653
|
+
] }), k = 8, w = 16, we = 200, Le = 1440, ke = (e, t) => e.bottom > 0 && e.top < t, Ne = (e, t) => {
|
|
654
|
+
const n = Math.min(
|
|
655
|
+
Le,
|
|
615
656
|
t - 2 * w
|
|
616
|
-
), s = e.left + e.width / 2 -
|
|
657
|
+
), s = e.left + e.width / 2 - n / 2;
|
|
617
658
|
return { left: Math.min(
|
|
618
659
|
Math.max(s, w),
|
|
619
|
-
t - w -
|
|
620
|
-
), width:
|
|
621
|
-
},
|
|
622
|
-
const s =
|
|
623
|
-
return s <
|
|
624
|
-
...
|
|
625
|
-
bottom:
|
|
626
|
-
maxHeight: Math.max(
|
|
660
|
+
t - w - n
|
|
661
|
+
), width: n };
|
|
662
|
+
}, Ee = (e, t, n) => {
|
|
663
|
+
const s = n - e.bottom - k - w, r = e.top - k - w, a = Ne(e, t);
|
|
664
|
+
return s < we && r > s ? {
|
|
665
|
+
...a,
|
|
666
|
+
bottom: n - e.top + k,
|
|
667
|
+
maxHeight: Math.max(r, 0)
|
|
627
668
|
} : {
|
|
628
|
-
...
|
|
629
|
-
top: e.bottom +
|
|
669
|
+
...a,
|
|
670
|
+
top: e.bottom + k,
|
|
630
671
|
maxHeight: Math.max(s, 0)
|
|
631
672
|
};
|
|
632
|
-
},
|
|
673
|
+
}, Pe = (e) => {
|
|
633
674
|
const t = e.trim().replace(/^#/, "");
|
|
634
675
|
if (!/^(?:[0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t))
|
|
635
676
|
return;
|
|
636
|
-
const
|
|
677
|
+
const n = t.length <= 4 ? [...t].map((s) => s + s).join("") : t;
|
|
637
678
|
return [0, 2, 4].map(
|
|
638
|
-
(s) => Number.parseInt(
|
|
679
|
+
(s) => Number.parseInt(n.slice(s, s + 2), 16)
|
|
639
680
|
);
|
|
640
|
-
},
|
|
681
|
+
}, Ae = (e) => {
|
|
641
682
|
const t = /^rgba?\((\d+), (\d+), (\d+)(?:, [\d.]+)?\)$/.exec(e);
|
|
642
683
|
if (t !== null)
|
|
643
684
|
return [t[1], t[2], t[3]].map(Number);
|
|
644
|
-
},
|
|
685
|
+
}, xe = (e) => {
|
|
645
686
|
if (typeof document > "u")
|
|
646
687
|
return;
|
|
647
688
|
const t = document.createElement("span");
|
|
648
689
|
if (t.style.color = e, t.style.color === "")
|
|
649
690
|
return;
|
|
650
691
|
document.body.appendChild(t);
|
|
651
|
-
const
|
|
652
|
-
return t.remove(),
|
|
653
|
-
},
|
|
692
|
+
const n = Ae(getComputedStyle(t).color);
|
|
693
|
+
return t.remove(), n;
|
|
694
|
+
}, Re = (e) => Pe(e) ?? xe(e), Ie = (e) => {
|
|
654
695
|
const t = e / 255;
|
|
655
696
|
return t <= 0.03928 ? t / 12.92 : ((t + 0.055) / 1.055) ** 2.4;
|
|
656
|
-
},
|
|
657
|
-
const t =
|
|
697
|
+
}, z = (e) => {
|
|
698
|
+
const t = Re(e);
|
|
658
699
|
if (t === void 0)
|
|
659
700
|
return;
|
|
660
|
-
const [
|
|
661
|
-
return 0.2126 *
|
|
662
|
-
},
|
|
701
|
+
const [n, s, r] = t.map(Ie);
|
|
702
|
+
return 0.2126 * n + 0.7152 * s + 0.0722 * r;
|
|
703
|
+
}, $e = "#181825", De = "#ffffff", Me = "straight", A = 0.5, x = {
|
|
663
704
|
light: {
|
|
664
705
|
panel: "#ffffff",
|
|
665
706
|
side: "#fafbfc",
|
|
@@ -678,7 +719,7 @@ const Q = ({
|
|
|
678
719
|
hover: "#242830",
|
|
679
720
|
thumb: "#2b2f38"
|
|
680
721
|
}
|
|
681
|
-
},
|
|
722
|
+
}, Te = {
|
|
682
723
|
rectangle: {
|
|
683
724
|
"r-panel": "4px",
|
|
684
725
|
"r-item": "4px",
|
|
@@ -691,220 +732,220 @@ const Q = ({
|
|
|
691
732
|
"r-thumb": "8px",
|
|
692
733
|
"r-btn": "10px"
|
|
693
734
|
}
|
|
694
|
-
}, N = (e) => e === void 0 || e.trim() === "" ? void 0 : e.trim(),
|
|
695
|
-
const t = e === void 0 ? void 0 :
|
|
696
|
-
return t === void 0 ? "light" : t <
|
|
697
|
-
},
|
|
698
|
-
const
|
|
699
|
-
return
|
|
700
|
-
},
|
|
701
|
-
const t =
|
|
702
|
-
...
|
|
703
|
-
|
|
735
|
+
}, N = (e) => e === void 0 || e.trim() === "" ? void 0 : e.trim(), Oe = (e) => {
|
|
736
|
+
const t = e === void 0 ? void 0 : z(e);
|
|
737
|
+
return t === void 0 ? "light" : t < A ? "dark" : "light";
|
|
738
|
+
}, _e = (e, t) => {
|
|
739
|
+
const n = z(e);
|
|
740
|
+
return n === void 0 ? x[t].text : (t === "light" ? n < A : n >= A) ? e : x[t].text;
|
|
741
|
+
}, He = (e) => {
|
|
742
|
+
const t = Oe(N(e == null ? void 0 : e.backgroundColor)), n = (e == null ? void 0 : e.ctaBorderType) === Me ? "rectangle" : "rectangle-rounded", s = N(e == null ? void 0 : e.primaryColor) ?? $e, r = N(e == null ? void 0 : e.fontFamily), a = {
|
|
743
|
+
...x[t],
|
|
744
|
+
...Te[n],
|
|
704
745
|
primary: s,
|
|
705
|
-
accent:
|
|
706
|
-
"cta-text": N(e == null ? void 0 : e.ctaTextColor) ??
|
|
707
|
-
...
|
|
746
|
+
accent: _e(s, t),
|
|
747
|
+
"cta-text": N(e == null ? void 0 : e.ctaTextColor) ?? De,
|
|
748
|
+
...r === void 0 ? {} : { font: r }
|
|
708
749
|
};
|
|
709
750
|
return Object.fromEntries(
|
|
710
|
-
Object.entries(
|
|
751
|
+
Object.entries(a).map(([c, i]) => [`--dso-${c}`, i])
|
|
711
752
|
);
|
|
712
|
-
},
|
|
713
|
-
const t = b(null), [
|
|
714
|
-
return
|
|
753
|
+
}, qe = (e) => {
|
|
754
|
+
const t = b(null), [n, s] = v(void 0), [r, a] = v({ width: 0, height: 0 });
|
|
755
|
+
return V(() => {
|
|
715
756
|
if (!e)
|
|
716
757
|
return;
|
|
717
|
-
const
|
|
718
|
-
const
|
|
719
|
-
if (
|
|
758
|
+
const c = () => {
|
|
759
|
+
const i = t.current;
|
|
760
|
+
if (i === null)
|
|
720
761
|
return;
|
|
721
|
-
const
|
|
722
|
-
|
|
723
|
-
(
|
|
762
|
+
const l = i.previousElementSibling ?? i, { top: u, bottom: p, left: d, width: m } = l.getBoundingClientRect();
|
|
763
|
+
a(
|
|
764
|
+
(g) => g.width === window.innerWidth && g.height === window.innerHeight ? g : { width: window.innerWidth, height: window.innerHeight }
|
|
724
765
|
), s(
|
|
725
|
-
(
|
|
766
|
+
(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 }
|
|
726
767
|
);
|
|
727
768
|
};
|
|
728
|
-
return
|
|
729
|
-
window.removeEventListener("scroll",
|
|
769
|
+
return c(), window.addEventListener("scroll", c, !0), window.addEventListener("resize", c), () => {
|
|
770
|
+
window.removeEventListener("scroll", c, !0), window.removeEventListener("resize", c);
|
|
730
771
|
};
|
|
731
|
-
}, [e]), { anchorRef: t, rect:
|
|
732
|
-
},
|
|
733
|
-
const [
|
|
772
|
+
}, [e]), { anchorRef: t, rect: n, viewport: r };
|
|
773
|
+
}, Be = (e, t) => {
|
|
774
|
+
const [n, s] = v(!1), r = b(null), a = e.status !== L.IDLE && !n;
|
|
734
775
|
return f(() => {
|
|
735
776
|
s(!1);
|
|
736
777
|
}, [e.query]), f(() => {
|
|
737
|
-
if (!
|
|
778
|
+
if (!a)
|
|
738
779
|
return;
|
|
739
|
-
const
|
|
740
|
-
var m,
|
|
741
|
-
const
|
|
742
|
-
if (!(
|
|
780
|
+
const c = (i) => {
|
|
781
|
+
var m, g;
|
|
782
|
+
const l = i.target;
|
|
783
|
+
if (!(l instanceof Node))
|
|
743
784
|
return;
|
|
744
|
-
const u = (m = t.current) == null ? void 0 : m.previousElementSibling, p = ((
|
|
785
|
+
const u = (m = t.current) == null ? void 0 : m.previousElementSibling, p = ((g = r.current) == null ? void 0 : g.contains(l)) ?? !1, d = (u == null ? void 0 : u.contains(l)) ?? !1;
|
|
745
786
|
!p && !d && s(!0);
|
|
746
787
|
};
|
|
747
|
-
return document.addEventListener("pointerdown",
|
|
748
|
-
}, [
|
|
749
|
-
var
|
|
750
|
-
const
|
|
751
|
-
if (
|
|
788
|
+
return document.addEventListener("pointerdown", c), () => document.removeEventListener("pointerdown", c);
|
|
789
|
+
}, [a, t]), f(() => {
|
|
790
|
+
var l;
|
|
791
|
+
const c = (l = t.current) == null ? void 0 : l.previousElementSibling;
|
|
792
|
+
if (c == null)
|
|
752
793
|
return;
|
|
753
|
-
const
|
|
754
|
-
return
|
|
755
|
-
}, [t]), { isOpen:
|
|
756
|
-
},
|
|
757
|
-
var m,
|
|
758
|
-
const { controller:
|
|
759
|
-
if (
|
|
760
|
-
return /* @__PURE__ */
|
|
761
|
-
/* @__PURE__ */
|
|
794
|
+
const i = () => s(!1);
|
|
795
|
+
return c.addEventListener("focusin", i), () => c.removeEventListener("focusin", i);
|
|
796
|
+
}, [t]), { isOpen: a, panelRef: r };
|
|
797
|
+
}, je = (e) => e instanceof Q ? `Search failed (${e.status}${e.code ? ` ${e.code}` : ""}): ${e.message}` : "Search failed: network error. Check your connection and try again.", ze = (e, t) => {
|
|
798
|
+
var m, g;
|
|
799
|
+
const { controller: n, state: s, locale: r, seeAllHref: a } = e, { status: c, response: i } = s;
|
|
800
|
+
if (c === L.ERROR)
|
|
801
|
+
return /* @__PURE__ */ h("div", { className: "dialog-search-error", children: [
|
|
802
|
+
/* @__PURE__ */ o(
|
|
762
803
|
"p",
|
|
763
804
|
{
|
|
764
805
|
role: "alert",
|
|
765
806
|
className: "dialog-search-status dialog-search-status-error",
|
|
766
|
-
children:
|
|
807
|
+
children: je(s.error)
|
|
767
808
|
}
|
|
768
809
|
),
|
|
769
|
-
/* @__PURE__ */
|
|
810
|
+
/* @__PURE__ */ o(
|
|
770
811
|
"button",
|
|
771
812
|
{
|
|
772
813
|
type: "button",
|
|
773
814
|
className: "dialog-search-retry",
|
|
774
|
-
onClick: () =>
|
|
815
|
+
onClick: () => n.retry(),
|
|
775
816
|
children: t.retry
|
|
776
817
|
}
|
|
777
818
|
)
|
|
778
819
|
] });
|
|
779
|
-
if (
|
|
780
|
-
return /* @__PURE__ */
|
|
781
|
-
const
|
|
782
|
-
return /* @__PURE__ */
|
|
783
|
-
/* @__PURE__ */
|
|
820
|
+
if (i === void 0)
|
|
821
|
+
return /* @__PURE__ */ o("p", { role: "status", className: "dialog-search-status", children: t.searching(s.query) });
|
|
822
|
+
const l = ((g = (m = s.sections) == null ? void 0 : m.collections) == null ? void 0 : g.hits) ?? [], u = j(l).length > 0, p = a !== void 0 && i.nbHits > 0, d = !p && _(s);
|
|
823
|
+
return /* @__PURE__ */ h(C, { children: [
|
|
824
|
+
/* @__PURE__ */ h(
|
|
784
825
|
"div",
|
|
785
826
|
{
|
|
786
827
|
className: `dialog-search-body${u ? "" : " dialog-search-body--no-collections"}`,
|
|
787
828
|
children: [
|
|
788
|
-
/* @__PURE__ */
|
|
789
|
-
|
|
829
|
+
/* @__PURE__ */ o(
|
|
830
|
+
ye,
|
|
790
831
|
{
|
|
791
|
-
collections:
|
|
792
|
-
query:
|
|
832
|
+
collections: l,
|
|
833
|
+
query: i.query,
|
|
793
834
|
messages: t
|
|
794
835
|
}
|
|
795
836
|
),
|
|
796
|
-
/* @__PURE__ */
|
|
797
|
-
|
|
837
|
+
/* @__PURE__ */ o(
|
|
838
|
+
Se,
|
|
798
839
|
{
|
|
799
|
-
controller:
|
|
800
|
-
response:
|
|
801
|
-
locale:
|
|
840
|
+
controller: n,
|
|
841
|
+
response: i,
|
|
842
|
+
locale: r,
|
|
802
843
|
messages: t
|
|
803
844
|
}
|
|
804
845
|
)
|
|
805
846
|
]
|
|
806
847
|
}
|
|
807
848
|
),
|
|
808
|
-
(p || d) && /* @__PURE__ */
|
|
809
|
-
t.seeAllLabel(
|
|
810
|
-
/* @__PURE__ */
|
|
811
|
-
] }) : /* @__PURE__ */
|
|
812
|
-
|
|
849
|
+
(p || d) && /* @__PURE__ */ o("div", { className: "dialog-search-footer", children: p ? /* @__PURE__ */ h("a", { className: "dialog-search-cta", href: a(i.query), children: [
|
|
850
|
+
t.seeAllLabel(i.nbHits),
|
|
851
|
+
/* @__PURE__ */ o(ve, {})
|
|
852
|
+
] }) : /* @__PURE__ */ o(
|
|
853
|
+
he,
|
|
813
854
|
{
|
|
814
|
-
controller:
|
|
855
|
+
controller: n,
|
|
815
856
|
state: s,
|
|
816
|
-
locale:
|
|
857
|
+
locale: r
|
|
817
858
|
}
|
|
818
859
|
) })
|
|
819
860
|
] });
|
|
820
|
-
},
|
|
821
|
-
const { state: t, locale:
|
|
822
|
-
() =>
|
|
861
|
+
}, Ge = (e) => {
|
|
862
|
+
const { state: t, locale: n, theme: s, layout: r = "list" } = e, a = t.status !== L.IDLE, { anchorRef: c, rect: i, viewport: l } = qe(a), { isOpen: u, panelRef: p } = Be(t, c), d = O(n), m = S(
|
|
863
|
+
() => He(s),
|
|
823
864
|
[s]
|
|
824
865
|
);
|
|
825
|
-
return /* @__PURE__ */
|
|
826
|
-
/* @__PURE__ */
|
|
827
|
-
u &&
|
|
828
|
-
/* @__PURE__ */
|
|
866
|
+
return /* @__PURE__ */ h(C, { children: [
|
|
867
|
+
/* @__PURE__ */ o("div", { ref: c }),
|
|
868
|
+
u && i !== void 0 && ke(i, l.height) && Z(
|
|
869
|
+
/* @__PURE__ */ o(
|
|
829
870
|
"div",
|
|
830
871
|
{
|
|
831
872
|
ref: p,
|
|
832
|
-
className: `dialog-search-panel dialog-search-panel--${
|
|
873
|
+
className: `dialog-search-panel dialog-search-panel--${r}`,
|
|
833
874
|
style: {
|
|
834
|
-
...
|
|
875
|
+
...Ee(i, l.width, l.height),
|
|
835
876
|
...m
|
|
836
877
|
},
|
|
837
|
-
children:
|
|
878
|
+
children: ze(e, d)
|
|
838
879
|
}
|
|
839
880
|
),
|
|
840
881
|
document.body
|
|
841
882
|
)
|
|
842
883
|
] });
|
|
843
|
-
},
|
|
844
|
-
status:
|
|
884
|
+
}, Ve = {
|
|
885
|
+
status: L.IDLE,
|
|
845
886
|
query: "",
|
|
846
887
|
page: 0
|
|
847
|
-
},
|
|
888
|
+
}, Ye = (e) => {
|
|
848
889
|
const t = b(e);
|
|
849
890
|
t.current = e;
|
|
850
|
-
const
|
|
851
|
-
if (
|
|
852
|
-
const { client:
|
|
853
|
-
|
|
854
|
-
search: (d, m) =>
|
|
891
|
+
const n = b(void 0), s = P(() => {
|
|
892
|
+
if (n.current === void 0) {
|
|
893
|
+
const { client: l, surface: u = "search_page", ...p } = t.current;
|
|
894
|
+
n.current = W({
|
|
895
|
+
search: (d, m) => l.search(d, m),
|
|
855
896
|
analytics: {
|
|
856
897
|
surface: u,
|
|
857
|
-
trackViewSearchResults: (d) =>
|
|
858
|
-
trackSelectSearchResult: (d) =>
|
|
898
|
+
trackViewSearchResults: (d) => l.trackViewSearchResults(d),
|
|
899
|
+
trackSelectSearchResult: (d) => l.trackSelectSearchResult(d)
|
|
859
900
|
},
|
|
860
901
|
...p
|
|
861
902
|
});
|
|
862
903
|
}
|
|
863
|
-
return
|
|
864
|
-
}, []),
|
|
865
|
-
|
|
866
|
-
setQuery: (
|
|
867
|
-
submit: (
|
|
868
|
-
setPage: (
|
|
904
|
+
return n.current;
|
|
905
|
+
}, []), r = b(void 0);
|
|
906
|
+
r.current ?? (r.current = {
|
|
907
|
+
setQuery: (l) => s().setQuery(l),
|
|
908
|
+
submit: (l) => s().submit(l),
|
|
909
|
+
setPage: (l) => s().setPage(l),
|
|
869
910
|
retry: () => s().retry(),
|
|
870
|
-
observeResult: (
|
|
871
|
-
selectResult: (
|
|
872
|
-
subscribe: (
|
|
911
|
+
observeResult: (l, u) => s().observeResult(l, u),
|
|
912
|
+
selectResult: (l, u) => s().selectResult(l, u),
|
|
913
|
+
subscribe: (l) => s().subscribe(l),
|
|
873
914
|
getState: () => s().getState(),
|
|
874
915
|
// Create a replacement on next access after disposal.
|
|
875
916
|
dispose: () => {
|
|
876
|
-
var
|
|
877
|
-
(
|
|
917
|
+
var l;
|
|
918
|
+
(l = n.current) == null || l.dispose(), n.current = void 0;
|
|
878
919
|
}
|
|
879
920
|
}), f(() => {
|
|
880
|
-
|
|
921
|
+
M({
|
|
881
922
|
method: "react",
|
|
882
|
-
version: "2.
|
|
923
|
+
version: "2.8.0"
|
|
883
924
|
});
|
|
884
|
-
const
|
|
925
|
+
const l = s();
|
|
885
926
|
return () => {
|
|
886
|
-
|
|
927
|
+
l.dispose(), n.current === l && (n.current = void 0);
|
|
887
928
|
};
|
|
888
929
|
}, [s]);
|
|
889
|
-
const
|
|
890
|
-
(
|
|
930
|
+
const a = P(
|
|
931
|
+
(l) => s().subscribe(l),
|
|
891
932
|
[s]
|
|
892
|
-
),
|
|
933
|
+
), c = P(
|
|
893
934
|
() => s().getState(),
|
|
894
935
|
[s]
|
|
895
|
-
),
|
|
896
|
-
|
|
897
|
-
|
|
898
|
-
() =>
|
|
936
|
+
), i = K(
|
|
937
|
+
a,
|
|
938
|
+
c,
|
|
939
|
+
() => Ve
|
|
899
940
|
);
|
|
900
|
-
return { controller:
|
|
941
|
+
return { controller: r.current, state: i, theme: e.client.theme };
|
|
901
942
|
};
|
|
902
943
|
export {
|
|
903
|
-
|
|
904
|
-
|
|
905
|
-
|
|
906
|
-
|
|
907
|
-
|
|
908
|
-
|
|
909
|
-
|
|
944
|
+
ne as DialogInput,
|
|
945
|
+
Ze as DialogProductBlock,
|
|
946
|
+
Xe as DialogSearchBar,
|
|
947
|
+
he as DialogSearchPagination,
|
|
948
|
+
be as DialogSearchProductCard,
|
|
949
|
+
Ge as DialogSearchResults,
|
|
950
|
+
Ye as useDialogSearch
|
|
910
951
|
};
|