@depict-ai/ui 4.1.3 → 4.1.5
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/ES10/index.cjs +189 -82
- package/ES10/index.d.ts +8 -2
- package/ES10/index.js +189 -83
- package/latest/index.cjs +189 -82
- package/latest/index.d.ts +8 -2
- package/latest/index.js +189 -83
- package/package.json +1 -1
- package/server/ES10/index.cjs +157 -53
- package/server/ES10/index.d.ts +8 -2
- package/server/ES10/index.js +157 -54
- package/server/latest/index.cjs +157 -53
- package/server/latest/index.d.ts +8 -2
- package/server/latest/index.js +157 -54
package/ES10/index.js
CHANGED
|
@@ -10,7 +10,76 @@ import { createStore as $8tj43$createStore, reconcile as $8tj43$reconcile } from
|
|
|
10
10
|
/*! Depict.ai search and product listing SDK */
|
|
11
11
|
import { register_es_version } from "../multi_import_deduplicator.mjs";
|
|
12
12
|
register_es_version("ui", "ES10");
|
|
13
|
-
const $8db9a15135765c11$export$83d89fbfd8236492 = "4.1.
|
|
13
|
+
const $8db9a15135765c11$export$83d89fbfd8236492 = "4.1.5";
|
|
14
|
+
|
|
15
|
+
/**
|
|
16
|
+
* This is a function that will safely clone an object that may contain promises.
|
|
17
|
+
* It will use structuredClone to clone the object and then re-apply (copy) any promises that were in the original object to the cloned object.
|
|
18
|
+
* @param obj Anything to clone
|
|
19
|
+
*/
|
|
20
|
+
function $6d75ec14f537c37f$export$83bb9af5671e1dbe(obj) {
|
|
21
|
+
if (obj instanceof Promise) return obj;
|
|
22
|
+
// Extract all promises, keep a map of them, and then re-apply them to both the original object and the target object after cloning
|
|
23
|
+
const seen = new Set();
|
|
24
|
+
const keyStack = [[]];
|
|
25
|
+
const valueStack = [obj];
|
|
26
|
+
const promiseLocationStack = [];
|
|
27
|
+
while (valueStack.length) {
|
|
28
|
+
const value = valueStack.pop();
|
|
29
|
+
const keyPath = keyStack.pop();
|
|
30
|
+
// Promises can only be in objects and we don't need to check for objects we've already seen (like in circular references)
|
|
31
|
+
if (typeof value !== "object" || value === null || seen.has(value)) continue;
|
|
32
|
+
seen.add(value);
|
|
33
|
+
if (Array.isArray(value)) {
|
|
34
|
+
for (let i = 0; i < value.length; i++) {
|
|
35
|
+
const ourValue = value[i];
|
|
36
|
+
const valuesKeyPath = [...keyPath, i];
|
|
37
|
+
if (ourValue instanceof Promise) {
|
|
38
|
+
promiseLocationStack.push([valuesKeyPath, ourValue]);
|
|
39
|
+
delete value[i]; // This will leave a hole in the array, but it's fine since we'll put it back soon
|
|
40
|
+
// This way both the indexes will be correct when putting the value back and our for loop doesn't get messed up
|
|
41
|
+
} else {
|
|
42
|
+
keyStack.push(valuesKeyPath);
|
|
43
|
+
valueStack.push(ourValue);
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
continue;
|
|
47
|
+
}
|
|
48
|
+
for (const innerKey in value) {
|
|
49
|
+
const ourValue = value[innerKey];
|
|
50
|
+
const valuesKeyPath = [...keyPath, innerKey];
|
|
51
|
+
if (ourValue instanceof Promise) {
|
|
52
|
+
promiseLocationStack.push([valuesKeyPath, ourValue]);
|
|
53
|
+
delete value[innerKey];
|
|
54
|
+
} else {
|
|
55
|
+
keyStack.push(valuesKeyPath);
|
|
56
|
+
valueStack.push(ourValue);
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
let structuredClonedObject;
|
|
61
|
+
let error;
|
|
62
|
+
try {
|
|
63
|
+
structuredClonedObject = structuredClone(obj);
|
|
64
|
+
} catch (e) {
|
|
65
|
+
// We still need to put back the promises in the original object, even if we threw an error
|
|
66
|
+
error = e;
|
|
67
|
+
}
|
|
68
|
+
// Put back the promises in both the original object and the cloned object
|
|
69
|
+
while (promiseLocationStack.length) {
|
|
70
|
+
const [keyPath, promise] = promiseLocationStack.pop();
|
|
71
|
+
let targetInClone = structuredClonedObject;
|
|
72
|
+
let targetInOriginal = obj;
|
|
73
|
+
for (let i = 0; i < keyPath.length - 1; i++) {
|
|
74
|
+
if (!error) targetInClone = targetInClone[keyPath[i]];
|
|
75
|
+
targetInOriginal = targetInOriginal[keyPath[i]];
|
|
76
|
+
}
|
|
77
|
+
if (!error) targetInClone[keyPath[keyPath.length - 1]] = promise;
|
|
78
|
+
targetInOriginal[keyPath[keyPath.length - 1]] = promise;
|
|
79
|
+
}
|
|
80
|
+
if (error) throw error;
|
|
81
|
+
return structuredClonedObject;
|
|
82
|
+
}
|
|
14
83
|
const $68e6625c8d51f847$export$3064e1e8c6513da3 = new Set();
|
|
15
84
|
let $68e6625c8d51f847$var$has_ran = false;
|
|
16
85
|
function $68e6625c8d51f847$export$5162a71f252e6122() {
|
|
@@ -157,12 +226,55 @@ function $00a5b94f0c11efbb$export$d9f36cf74e24d595(media_query) {
|
|
|
157
226
|
}).remove);
|
|
158
227
|
return signal[0];
|
|
159
228
|
}
|
|
229
|
+
var $bc2337c9a05ecd18$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<span>`);
|
|
230
|
+
function $bc2337c9a05ecd18$export$acb3eaade4b23afd(props) {
|
|
231
|
+
// Work around https://github.com/solidjs/solid/issues/1980
|
|
232
|
+
return (() => {
|
|
233
|
+
var _el$ = $8tj43$getNextElement($bc2337c9a05ecd18$var$_tmpl$);
|
|
234
|
+
$8tj43$effect(_p$ => {
|
|
235
|
+
var _v$ = "".concat(props.class || "", " depict-placeholder"),
|
|
236
|
+
_v$2 = props.style;
|
|
237
|
+
_v$ !== _p$.e && $8tj43$className(_el$, _p$.e = _v$);
|
|
238
|
+
_p$.t = $8tj43$style(_el$, _v$2, _p$.t);
|
|
239
|
+
return _p$;
|
|
240
|
+
}, {
|
|
241
|
+
e: undefined,
|
|
242
|
+
t: undefined
|
|
243
|
+
});
|
|
244
|
+
return _el$;
|
|
245
|
+
})();
|
|
246
|
+
}
|
|
247
|
+
function $ceafb6fb91c6f394$export$89c6019e4baa40b1(props) {
|
|
248
|
+
const style = $8tj43$createMemo(() => {
|
|
249
|
+
const {
|
|
250
|
+
style: style,
|
|
251
|
+
height: height,
|
|
252
|
+
width: width
|
|
253
|
+
} = props;
|
|
254
|
+
return {
|
|
255
|
+
...(style || {}),
|
|
256
|
+
height: height !== null && height !== void 0 ? height : "1em",
|
|
257
|
+
...(width && {
|
|
258
|
+
width: width
|
|
259
|
+
})
|
|
260
|
+
};
|
|
261
|
+
});
|
|
262
|
+
return $8tj43$createComponent((0, $bc2337c9a05ecd18$export$acb3eaade4b23afd), {
|
|
263
|
+
get style() {
|
|
264
|
+
return style();
|
|
265
|
+
},
|
|
266
|
+
get ["class"]() {
|
|
267
|
+
return props.class;
|
|
268
|
+
}
|
|
269
|
+
});
|
|
270
|
+
}
|
|
160
271
|
var $9a693c7e832d3f18$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<span class="title line-clamp">`),
|
|
161
272
|
$9a693c7e832d3f18$var$_tmpl$2 = /*#__PURE__*/$8tj43$template(`<span class=brand>`),
|
|
162
273
|
$9a693c7e832d3f18$var$_tmpl$3 = /*#__PURE__*/$8tj43$template(`<div class="tagline line-clamp">`),
|
|
163
274
|
$9a693c7e832d3f18$var$_tmpl$4 = /*#__PURE__*/$8tj43$template(`<span class="orig price"><!$><!/><!$><!/><!$><!/>`),
|
|
164
|
-
$9a693c7e832d3f18$var$_tmpl$5 = /*#__PURE__*/$8tj43$template(`<
|
|
165
|
-
$9a693c7e832d3f18$var$_tmpl$6 = /*#__PURE__*/$8tj43$template(`<div class=
|
|
275
|
+
$9a693c7e832d3f18$var$_tmpl$5 = /*#__PURE__*/$8tj43$template(`<span class=price><!$><!/><!$><!/><!$><!/>`),
|
|
276
|
+
$9a693c7e832d3f18$var$_tmpl$6 = /*#__PURE__*/$8tj43$template(`<a class=instant-card><div class=img-part><!$><!/><!$><!/></div><div class=right-part><!$><!/><div class=price-container><!$><!/><!$><!/>`),
|
|
277
|
+
$9a693c7e832d3f18$var$_tmpl$7 = /*#__PURE__*/$8tj43$template(`<div class=title-brand-tagline>`);
|
|
166
278
|
const $9a693c7e832d3f18$export$b05c0ae390cf3e06 = _ref => {
|
|
167
279
|
var _variant$image_urls;
|
|
168
280
|
let {
|
|
@@ -178,7 +290,10 @@ const $9a693c7e832d3f18$export$b05c0ae390cf3e06 = _ref => {
|
|
|
178
290
|
const [get_selected_index_, set_selected_index_] = selected_index_ || [];
|
|
179
291
|
const variant = display_.variant_displays[display_.variant_index];
|
|
180
292
|
const href = $8tj43$createMemo(() => variant.page_url); // <- could be made reactive getter in displayTransformers, read it in memo here since it might create computations (for example in the preview-brower), and there's no owner in the onClick handler
|
|
181
|
-
|
|
293
|
+
// Prices can be promises, for example in our shopify app. Always assume they are (will work the same when they aren't)
|
|
294
|
+
const [salePrice] = $8tj43$createResource(() => variant.sale_price);
|
|
295
|
+
const [originalPrice] = $8tj43$createResource(() => variant.original_price);
|
|
296
|
+
const isOnSale = $8tj43$createMemo(() => salePrice() !== originalPrice());
|
|
182
297
|
const supports_hover = $00a5b94f0c11efbb$export$d9f36cf74e24d595("(hover: hover) and (pointer: fine)");
|
|
183
298
|
const [isSelected, selectedDueToKeyboardNavigation] = selected_index_ ? $d0883254246d3eb6$export$fb40a80c530e5f2b(get_selected_index_, keyboardNavigationGroupIndex_, index_) : [];
|
|
184
299
|
const secondary_image_url = ((_variant$image_urls = variant.image_urls) === null || _variant$image_urls === void 0 ? void 0 : _variant$image_urls[1]) || variant.secondary_image_url || variant.alternative_display_image_url;
|
|
@@ -200,25 +315,20 @@ const $9a693c7e832d3f18$export$b05c0ae390cf3e06 = _ref => {
|
|
|
200
315
|
})();
|
|
201
316
|
})())];
|
|
202
317
|
return (() => {
|
|
203
|
-
var _el$4 = $8tj43$getNextElement($9a693c7e832d3f18$var$_tmpl$
|
|
318
|
+
var _el$4 = $8tj43$getNextElement($9a693c7e832d3f18$var$_tmpl$6),
|
|
204
319
|
_el$5 = _el$4.firstChild,
|
|
205
320
|
_el$6 = _el$5.firstChild,
|
|
206
321
|
[_el$7, _co$] = $8tj43$getNextMarker(_el$6.nextSibling),
|
|
207
322
|
_el$8 = _el$7.nextSibling,
|
|
208
323
|
[_el$9, _co$2] = $8tj43$getNextMarker(_el$8.nextSibling),
|
|
209
324
|
_el$10 = _el$5.nextSibling,
|
|
210
|
-
_el$
|
|
211
|
-
[_el$
|
|
212
|
-
_el$11 = _el$
|
|
325
|
+
_el$30 = _el$10.firstChild,
|
|
326
|
+
[_el$31, _co$11] = $8tj43$getNextMarker(_el$30.nextSibling),
|
|
327
|
+
_el$11 = _el$31.nextSibling,
|
|
213
328
|
_el$26 = _el$11.firstChild,
|
|
214
329
|
[_el$27, _co$9] = $8tj43$getNextMarker(_el$26.nextSibling),
|
|
215
|
-
_el$
|
|
216
|
-
_el$
|
|
217
|
-
[_el$21, _co$6] = $8tj43$getNextMarker(_el$20.nextSibling),
|
|
218
|
-
_el$22 = _el$21.nextSibling,
|
|
219
|
-
[_el$23, _co$7] = $8tj43$getNextMarker(_el$22.nextSibling),
|
|
220
|
-
_el$24 = _el$23.nextSibling,
|
|
221
|
-
[_el$25, _co$8] = $8tj43$getNextMarker(_el$24.nextSibling);
|
|
330
|
+
_el$28 = _el$27.nextSibling,
|
|
331
|
+
[_el$29, _co$10] = $8tj43$getNextMarker(_el$28.nextSibling);
|
|
222
332
|
$8tj43$use(element => $d0883254246d3eb6$export$12761f53d7ab7f27(element, () => {
|
|
223
333
|
var _selectedDueToKeyboar;
|
|
224
334
|
return (_selectedDueToKeyboar = selectedDueToKeyboardNavigation === null || selectedDueToKeyboardNavigation === void 0 ? void 0 : selectedDueToKeyboardNavigation()) !== null && _selectedDueToKeyboar !== void 0 ? _selectedDueToKeyboar : false;
|
|
@@ -247,12 +357,14 @@ const $9a693c7e832d3f18$export$b05c0ae390cf3e06 = _ref => {
|
|
|
247
357
|
}
|
|
248
358
|
}), _el$9, _co$2);
|
|
249
359
|
$8tj43$insert(_el$10, selected_index_ ? $8tj43$createComponent(TitleBrandTagline, {}) : (() => {
|
|
250
|
-
var _el$
|
|
251
|
-
$8tj43$insert(_el$
|
|
252
|
-
return _el$
|
|
253
|
-
})(), _el$
|
|
360
|
+
var _el$32 = $8tj43$getNextElement($9a693c7e832d3f18$var$_tmpl$7);
|
|
361
|
+
$8tj43$insert(_el$32, $8tj43$createComponent(TitleBrandTagline, {}));
|
|
362
|
+
return _el$32;
|
|
363
|
+
})(), _el$31, _co$11);
|
|
254
364
|
$8tj43$insert(_el$11, $8tj43$createComponent((0, $8tj43$Show), {
|
|
255
|
-
when
|
|
365
|
+
get when() {
|
|
366
|
+
return isOnSale();
|
|
367
|
+
},
|
|
256
368
|
get children() {
|
|
257
369
|
var _el$12 = $8tj43$getNextElement($9a693c7e832d3f18$var$_tmpl$4),
|
|
258
370
|
_el$13 = _el$12.firstChild,
|
|
@@ -264,7 +376,7 @@ const $9a693c7e832d3f18$export$b05c0ae390cf3e06 = _ref => {
|
|
|
264
376
|
$8tj43$insert(_el$12, () => i18n_.price_formatting_().pre_, _el$14, _co$3);
|
|
265
377
|
$8tj43$insert(_el$12, $8tj43$createComponent((0, $60ec7a29849d81db$export$a71e92cfbb498adc), {
|
|
266
378
|
get price_() {
|
|
267
|
-
return
|
|
379
|
+
return originalPrice();
|
|
268
380
|
},
|
|
269
381
|
get price_formatting_() {
|
|
270
382
|
return i18n_.price_formatting_();
|
|
@@ -274,17 +386,39 @@ const $9a693c7e832d3f18$export$b05c0ae390cf3e06 = _ref => {
|
|
|
274
386
|
return _el$12;
|
|
275
387
|
}
|
|
276
388
|
}), _el$27, _co$9);
|
|
277
|
-
_el$
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
get price_() {
|
|
281
|
-
return variant.sale_price;
|
|
389
|
+
$8tj43$insert(_el$11, $8tj43$createComponent((0, $8tj43$Show), {
|
|
390
|
+
get when() {
|
|
391
|
+
return !salePrice.loading && salePrice.latest;
|
|
282
392
|
},
|
|
283
|
-
get
|
|
284
|
-
return
|
|
393
|
+
get fallback() {
|
|
394
|
+
return $8tj43$createComponent((0, $ceafb6fb91c6f394$export$89c6019e4baa40b1), {
|
|
395
|
+
width: "5ch",
|
|
396
|
+
height: "1em",
|
|
397
|
+
"class": "price"
|
|
398
|
+
});
|
|
399
|
+
},
|
|
400
|
+
get children() {
|
|
401
|
+
var _el$19 = $8tj43$getNextElement($9a693c7e832d3f18$var$_tmpl$5),
|
|
402
|
+
_el$20 = _el$19.firstChild,
|
|
403
|
+
[_el$21, _co$6] = $8tj43$getNextMarker(_el$20.nextSibling),
|
|
404
|
+
_el$22 = _el$21.nextSibling,
|
|
405
|
+
[_el$23, _co$7] = $8tj43$getNextMarker(_el$22.nextSibling),
|
|
406
|
+
_el$24 = _el$23.nextSibling,
|
|
407
|
+
[_el$25, _co$8] = $8tj43$getNextMarker(_el$24.nextSibling);
|
|
408
|
+
$8tj43$insert(_el$19, () => i18n_.price_formatting_().pre_, _el$21, _co$6);
|
|
409
|
+
$8tj43$insert(_el$19, $8tj43$createComponent((0, $60ec7a29849d81db$export$a71e92cfbb498adc), {
|
|
410
|
+
get price_() {
|
|
411
|
+
return salePrice();
|
|
412
|
+
},
|
|
413
|
+
get price_formatting_() {
|
|
414
|
+
return i18n_.price_formatting_();
|
|
415
|
+
}
|
|
416
|
+
}), _el$23, _co$7);
|
|
417
|
+
$8tj43$insert(_el$19, () => i18n_.price_formatting_().post_, _el$25, _co$8);
|
|
418
|
+
$8tj43$effect(() => _el$19.classList.toggle("sales-price", !!isOnSale()));
|
|
419
|
+
return _el$19;
|
|
285
420
|
}
|
|
286
|
-
}), _el$
|
|
287
|
-
$8tj43$insert(_el$19, () => i18n_.price_formatting_().post_, _el$25, _co$8);
|
|
421
|
+
}), _el$29, _co$10);
|
|
288
422
|
$8tj43$effect(_p$ => {
|
|
289
423
|
var _v$ = href(),
|
|
290
424
|
_v$2 = display_.search_result_id,
|
|
@@ -303,24 +437,6 @@ const $9a693c7e832d3f18$export$b05c0ae390cf3e06 = _ref => {
|
|
|
303
437
|
})();
|
|
304
438
|
};
|
|
305
439
|
$8tj43$delegateEvents(["click"]);
|
|
306
|
-
var $bc2337c9a05ecd18$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<span>`);
|
|
307
|
-
function $bc2337c9a05ecd18$export$acb3eaade4b23afd(props) {
|
|
308
|
-
// Work around https://github.com/solidjs/solid/issues/1980
|
|
309
|
-
return (() => {
|
|
310
|
-
var _el$ = $8tj43$getNextElement($bc2337c9a05ecd18$var$_tmpl$);
|
|
311
|
-
$8tj43$effect(_p$ => {
|
|
312
|
-
var _v$ = "".concat(props.class || "", " depict-placeholder"),
|
|
313
|
-
_v$2 = props.style;
|
|
314
|
-
_v$ !== _p$.e && $8tj43$className(_el$, _p$.e = _v$);
|
|
315
|
-
_p$.t = $8tj43$style(_el$, _v$2, _p$.t);
|
|
316
|
-
return _p$;
|
|
317
|
-
}, {
|
|
318
|
-
e: undefined,
|
|
319
|
-
t: undefined
|
|
320
|
-
});
|
|
321
|
-
return _el$;
|
|
322
|
-
})();
|
|
323
|
-
}
|
|
324
440
|
function $3ab4aa97880fb88d$export$3f37af283f8fb843(props) {
|
|
325
441
|
const style = $8tj43$createMemo(() => {
|
|
326
442
|
const {
|
|
@@ -352,30 +468,6 @@ function $3ab4aa97880fb88d$export$3f37af283f8fb843(props) {
|
|
|
352
468
|
}
|
|
353
469
|
});
|
|
354
470
|
}
|
|
355
|
-
function $ceafb6fb91c6f394$export$89c6019e4baa40b1(props) {
|
|
356
|
-
const style = $8tj43$createMemo(() => {
|
|
357
|
-
const {
|
|
358
|
-
style: style,
|
|
359
|
-
height: height,
|
|
360
|
-
width: width
|
|
361
|
-
} = props;
|
|
362
|
-
return {
|
|
363
|
-
...(style || {}),
|
|
364
|
-
height: height !== null && height !== void 0 ? height : "1em",
|
|
365
|
-
...(width && {
|
|
366
|
-
width: width
|
|
367
|
-
})
|
|
368
|
-
};
|
|
369
|
-
});
|
|
370
|
-
return $8tj43$createComponent((0, $bc2337c9a05ecd18$export$acb3eaade4b23afd), {
|
|
371
|
-
get style() {
|
|
372
|
-
return style();
|
|
373
|
-
},
|
|
374
|
-
get ["class"]() {
|
|
375
|
-
return props.class;
|
|
376
|
-
}
|
|
377
|
-
});
|
|
378
|
-
}
|
|
379
471
|
var $5eaa00b951637e96$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<div class=instant-card><div class=img-part></div><div class=right-part><div class=title-brand-tagline><span class=title></span></div><div class=price-container>`);
|
|
380
472
|
const $5eaa00b951637e96$export$8a2234b5b1a5ebd4 = "--image-aspect-ratio";
|
|
381
473
|
function $5eaa00b951637e96$export$ee1733d9a8495996() {
|
|
@@ -488,7 +580,12 @@ function $2d7bad8684bc7f44$export$43f0fb951fcb0c54(_ref) {
|
|
|
488
580
|
// We had a case on singular where they popped an image url and due to use caching after some time there was no image
|
|
489
581
|
// Attempt cloning the displays if possible (99.9% of the cases probably) and if not, just use the original display
|
|
490
582
|
try {
|
|
491
|
-
|
|
583
|
+
// Use promiseSafeStructuredClone so that:
|
|
584
|
+
// 1. When fetching for example prices from an API, one can start that API request
|
|
585
|
+
// 2. Add the promise to the display
|
|
586
|
+
// 3. Already render the product card with placeholders for prices while the price loads
|
|
587
|
+
// 4. When the price loads, re-render the display with the new price
|
|
588
|
+
display = $6d75ec14f537c37f$export$83bb9af5671e1dbe(display);
|
|
492
589
|
} catch (e) {
|
|
493
590
|
if (!$2d7bad8684bc7f44$var$printedCloneError) {
|
|
494
591
|
$2d7bad8684bc7f44$var$printedCloneError = true;
|
|
@@ -546,7 +643,7 @@ function $2d7bad8684bc7f44$export$43f0fb951fcb0c54(_ref) {
|
|
|
546
643
|
// Modified futher to bias towards saying objects are equal non-primitive objects differ
|
|
547
644
|
function $2d7bad8684bc7f44$var$deep_equal(obj1, obj2) {
|
|
548
645
|
const stack = [[obj1, obj2]];
|
|
549
|
-
while (stack.length
|
|
646
|
+
while (stack.length) {
|
|
550
647
|
const [currentObj1, currentObj2] = stack.pop();
|
|
551
648
|
if (currentObj1 === currentObj2) continue;
|
|
552
649
|
if (Array.isArray(currentObj1) && Array.isArray(currentObj2)) {
|
|
@@ -2559,10 +2656,10 @@ function $56047603f9d212b6$export$6e5611bc7e57e477(props) {
|
|
|
2559
2656
|
const src_options = $8tj43$createMemo(() => {
|
|
2560
2657
|
const {
|
|
2561
2658
|
src: src,
|
|
2562
|
-
|
|
2659
|
+
customUrls: customUrls
|
|
2563
2660
|
} = props;
|
|
2564
|
-
const fallback_src = (
|
|
2565
|
-
const srcset = $56047603f9d212b6$var$make_srcset(props.src, props.resolutions || [64, 128, 256, 300, 400, 512, 640, 768, 1024, 1280, 1536, 2048, 2560, 3072, 3584, 4096],
|
|
2661
|
+
const fallback_src = (customUrls || $56047603f9d212b6$export$1d6267828870adda)(src, 400);
|
|
2662
|
+
const srcset = $56047603f9d212b6$var$make_srcset(props.src, props.resolutions || [64, 128, 256, 300, 400, 512, 640, 768, 1024, 1280, 1536, 2048, 2560, 3072, 3584, 4096], customUrls);
|
|
2566
2663
|
// The order here *might* matter - I've seen mobile safari always start with loading the 400px version when it was reversed
|
|
2567
2664
|
return {
|
|
2568
2665
|
srcset: srcset,
|
|
@@ -2571,7 +2668,9 @@ function $56047603f9d212b6$export$6e5611bc7e57e477(props) {
|
|
|
2571
2668
|
});
|
|
2572
2669
|
// Work around https://github.com/solidjs/solid/issues/1828
|
|
2573
2670
|
const img = new Image(); // Need to use new Image or browser might not start loading image before it's in the DOM
|
|
2574
|
-
const [, otherAttributes] = $8tj43$splitProps(props, ["resolutions", "size", "src", "srcSet", "loading"
|
|
2671
|
+
const [, otherAttributes] = $8tj43$splitProps(props, ["resolutions", "size", "src", "srcSet", "loading", "customUrls" // Can't have properties ending on underscore because the property name mangling will get confused by this <-
|
|
2672
|
+
]);
|
|
2673
|
+
|
|
2575
2674
|
const [hasSetSize, setHasSetSize] = $8tj43$createSignal(false);
|
|
2576
2675
|
const [hasDecoded, setHasDecoded] = $8tj43$createSignal(false);
|
|
2577
2676
|
const productCardIndexAccessor = $1e69163caedaab4e$export$e3faf4d95300054f();
|
|
@@ -2703,9 +2802,9 @@ function $56047603f9d212b6$export$6e5611bc7e57e477(props) {
|
|
|
2703
2802
|
});
|
|
2704
2803
|
}
|
|
2705
2804
|
function $56047603f9d212b6$var$make_srcset(url, resolutions, customGenerateImageUrl_) {
|
|
2706
|
-
return resolutions.map(width => "".concat((customGenerateImageUrl_ || $56047603f9d212b6$
|
|
2805
|
+
return resolutions.map(width => "".concat((customGenerateImageUrl_ || $56047603f9d212b6$export$1d6267828870adda)(url, width), " ").concat(width, "w")).join(", ");
|
|
2707
2806
|
}
|
|
2708
|
-
function $56047603f9d212b6$
|
|
2807
|
+
function $56047603f9d212b6$export$1d6267828870adda(url, width) {
|
|
2709
2808
|
// Even just creating one `URL` object per image src and then setting the search parameter is quite slow (0.25ms to set the width param)
|
|
2710
2809
|
// We're making the assumptions that the url has already at least one query parameter and that the image resizing service will choose the last one out of a duplicate width parameter (shopify's does)
|
|
2711
2810
|
// That way we can just to string concatenation which is insanely fast
|
|
@@ -2772,8 +2871,15 @@ function $7fbaab3d3dafb4f5$export$9d4a4b669b1929ab(props) {
|
|
|
2772
2871
|
get imgProps() {
|
|
2773
2872
|
return {
|
|
2774
2873
|
...props.imgProps,
|
|
2775
|
-
|
|
2776
|
-
) =>
|
|
2874
|
+
customUrls: (url, width // Apparently don't have to encode url for CF's service
|
|
2875
|
+
) => {
|
|
2876
|
+
if (url.startsWith("https://cdn.shopify.com"))
|
|
2877
|
+
// The shopify image resizing CDN blocks Cloudflare's image resizer. It's possible that we can't detect shopify image URLs sometimes because they go to the merchant's domain,
|
|
2878
|
+
// but it seems like the URLs returned by the Depict API always goes to the cdn.shopify.com version of an image, so this simple workaround works.
|
|
2879
|
+
return $56047603f9d212b6$export$1d6267828870adda(url, width);
|
|
2880
|
+
// Use cloudflare image resizer instead of img.depict.ai because it's a lot faster (and also auto-chooses other formats if webp is not supported)
|
|
2881
|
+
return "https://app.depict.ai/cdn-cgi/image/width=".concat(width, ",format=auto/").concat(url);
|
|
2882
|
+
}
|
|
2777
2883
|
};
|
|
2778
2884
|
}
|
|
2779
2885
|
}));
|
|
@@ -15210,4 +15316,4 @@ function $a3026fb727bc7550$var$align_field_modal(alignmentSignals, input, modalV
|
|
|
15210
15316
|
});
|
|
15211
15317
|
}
|
|
15212
15318
|
$8tj43$add_to_version_info("ui", (0, $8db9a15135765c11$export$83d89fbfd8236492));
|
|
15213
|
-
export { $68e6625c8d51f847$export$5162a71f252e6122 as preserve_items_in_history_dot_state, $68e6625c8d51f847$export$3064e1e8c6513da3 as prefixes_to_preserve_in_history_dot_state, $9b35d1384e31813a$export$29d28dadc2d6b631 as allowNativeNavigation, $b026fa9c9c904a98$export$1ea76ea778b880dd as modalVersionSymbol, $a604a8ffa4e4c03f$export$e417c49320921907 as createDeparallelizedNoDropResource, $01c33966d9ddb108$export$f50b88e2a00918b5 as throw_globally, $40411f2ec772c376$export$9265e66f26f8e383 as ClassicSearchModal, $06fcd2a345efd24d$export$b0c55aa2e87c4be7 as SearchModalV2, $7fbaab3d3dafb4f5$export$9d4a4b669b1929ab as ModernResponsiveContainedImage, $6a439680ae7e9ba3$export$3e41faf802a29e71 as Tab, $6a439680ae7e9ba3$export$b2539bed5023c21c as Tabs, $6b0fd8fd20df8ccf$export$d4973c31938cbfd1 as ShopTheLookButton, $972f6bce0f9d61be$export$e183a13865960371 as history_dot_state_to_state, $2855bffe06ef7a03$export$916e6850778505f6 as strip_encoded_filter_and_sort, $2855bffe06ef7a03$export$58aa3f171519b6d7 as encode_filters, $2855bffe06ef7a03$export$f934fa24c3a86811 as decode_filters, $2855bffe06ef7a03$export$62acb285a7579555 as encode_sorting, $2855bffe06ef7a03$export$766e9676e74997d3 as decode_sorting, $4df489344a0f97c7$export$d7b7ab832c20e2f4 as shopifyContainedImageContextSymbol, $5441862cd2f5e111$export$e68cff63f76bd15b as ListingProvider, $5441862cd2f5e111$export$8d0c4fdbb05a2f2e as useListing, $1e69163caedaab4e$export$11354f017ddc9790 as ProductCardIndexProvider, $1e69163caedaab4e$export$e3faf4d95300054f as useProductCardIndex, $4df489344a0f97c7$export$e4b984597b71e989 as ShopifyContainedImage, $002f09d00aac50b2$export$6649caad96ef8870 as SlidableItems, $fc830a7ee59416ef$export$ebdc3711f7e02ccd as make_accurate_width_accessor, $d5d7e58c5c9d8db0$export$9574e176201e5e8d as RecommendationSlider, $b432b11321ad4c97$export$9756467d34d91cdb as RecommendationGrid, $56047603f9d212b6$export$6e5611bc7e57e477 as ShopifyResponsiveImg, $56047603f9d212b6$export$e6fffe67d4cdd848 as makeSizeAccessor, $801e8845d3fa3653$export$94026ee33dbabc26 as ImageContainer, $74777e8fe65b3dcb$export$b69d0d92862de18b as SentryErrorBoundary, $ad371564683947ab$export$6c6d7a51fa9aa15d as ExpandingDetails, $e18ab2868df26f40$export$f091cbac892643a4 as accessor_of_object_to_object_with_accessor_values, $4711a82d08d2021b$export$fecbb157621501bd as SelectedFilters, $f6b0500577e1b210$export$3f1a388cc0d8fed7 as FilterBody, $44aa24b1bb793549$export$b288c38ae3fddb56 as create_modified_filters, $63f1f8dbcd07d3b0$export$d21e32dfedac04be as SolidLayout, $d5f1e6a0f9117286$export$79b1565500412d9b as general_modal_abstraction, $9783d437ad61594c$export$3b621d86b1566b2 as CrossIcon, $ca6ab5f08bd28bca$export$8be2714ec7f169ee as GenericSliderArrowButton, $50aebf5b445518eb$export$58e808b1db15d3bc as fetchDepictRecommendations, $f5f54892fd0c7d9f$export$de035477d6fef996 as QuickLinks, $f5f54892fd0c7d9f$export$5b7c3ce0ebe51f86 as BreadCrumbs, $fa332ea03168857c$export$b91cec6bdc6b32a1 as CategoryTitle, $702d7656a373973e$export$824dde41348efed1 as embedded_num_products, $160ea2b55d8772d2$export$c1a6b039e689a58e as get_listings, $f5f54892fd0c7d9f$export$f34314aa9505732e as DepictCategory, $f5f54892fd0c7d9f$export$e2bf8ce7779e827e as CategoryPage, $eb064bc3350276c1$export$ac6237957a15b3f0 as DepictSearch, $eb064bc3350276c1$export$bde3eb976dfded9 as get_search_query_updating_blocked_signal, $eb064bc3350276c1$export$f2dc7e4e4aa11abb as SearchPage, $f3b7124b76123e44$export$aa14a9f43128f61f as ProductCardError, $169c13c0531d91d2$export$d86a33413558014e as open_modal_with_alignment, $5eaa00b951637e96$export$ee1733d9a8495996 as DefaultInstantCardPlaceholder, $1308a7816c3d4f2d$export$b3ad617e9036868 as align_field, $1308a7816c3d4f2d$export$3f238c96c45e6cc6 as ALIGN_TOP, $1308a7816c3d4f2d$export$902f8b4a7dae5d78 as ALIGN_WIDTH_ON_MODAL, $1308a7816c3d4f2d$export$7895aadd1956b1c7 as ALIGN_LEFT, $1308a7816c3d4f2d$export$6060bc6bee850eb6 as SET_CENTERED_LEFT, $a9c7ba6087881ac2$export$6daf8749b65a1b77 as convert_sdk_cols_at_size_to_layout, $cc64aabf2c7a1f1a$export$1233ca167bf71f9a as styles_to_valid_css_string, $e56d241d0f33d459$export$fe334901e8bebd57 as disable_scrolling, $573c007c697a1831$export$d0596b5cae35ad4 as open_search_with_shift_slash, $284849364a6ef73a$export$e015ed2f2950f2e3 as DepictAPI, $00a5b94f0c11efbb$export$d9f36cf74e24d595 as media_query_to_accessor, $e60a76195ac6d408$export$689e204eadb33baf as setup_fast_leave, $a61a2051e15c8d7a$export$5196e4c01fa56fcb as show_toast, $60ec7a29849d81db$export$a71e92cfbb498adc as SolidFormatPrice, $37e8c97bb6876197$export$828dcdd425fd3231 as connect_search_field_height_to_aligner_height, $bc2337c9a05ecd18$export$acb3eaade4b23afd as BasePlaceholder, $ceafb6fb91c6f394$export$89c6019e4baa40b1 as TextPlaceholder, $3ab4aa97880fb88d$export$3f37af283f8fb843 as ImagePlaceholder, $f9fd3017c20b774a$export$3ccaa27d81dd8556 as PageReplacer, $d399250dfa491636$export$864d304a0bc46829 as defaultGridSpacing, $d399250dfa491636$export$c3834fa86c616831 as defaultColsAtSize, $d399250dfa491636$export$7bf543b9d9be2c22 as defaultCategoryTitlePlugin, $8db9a15135765c11$export$83d89fbfd8236492 as version, $a3026fb727bc7550$export$316f6f283ae64765 as SearchField };
|
|
15319
|
+
export { $6d75ec14f537c37f$export$83bb9af5671e1dbe as promiseSafeStructuredClone, $68e6625c8d51f847$export$5162a71f252e6122 as preserve_items_in_history_dot_state, $68e6625c8d51f847$export$3064e1e8c6513da3 as prefixes_to_preserve_in_history_dot_state, $9b35d1384e31813a$export$29d28dadc2d6b631 as allowNativeNavigation, $b026fa9c9c904a98$export$1ea76ea778b880dd as modalVersionSymbol, $a604a8ffa4e4c03f$export$e417c49320921907 as createDeparallelizedNoDropResource, $01c33966d9ddb108$export$f50b88e2a00918b5 as throw_globally, $40411f2ec772c376$export$9265e66f26f8e383 as ClassicSearchModal, $06fcd2a345efd24d$export$b0c55aa2e87c4be7 as SearchModalV2, $7fbaab3d3dafb4f5$export$9d4a4b669b1929ab as ModernResponsiveContainedImage, $6a439680ae7e9ba3$export$3e41faf802a29e71 as Tab, $6a439680ae7e9ba3$export$b2539bed5023c21c as Tabs, $6b0fd8fd20df8ccf$export$d4973c31938cbfd1 as ShopTheLookButton, $972f6bce0f9d61be$export$e183a13865960371 as history_dot_state_to_state, $2855bffe06ef7a03$export$916e6850778505f6 as strip_encoded_filter_and_sort, $2855bffe06ef7a03$export$58aa3f171519b6d7 as encode_filters, $2855bffe06ef7a03$export$f934fa24c3a86811 as decode_filters, $2855bffe06ef7a03$export$62acb285a7579555 as encode_sorting, $2855bffe06ef7a03$export$766e9676e74997d3 as decode_sorting, $4df489344a0f97c7$export$d7b7ab832c20e2f4 as shopifyContainedImageContextSymbol, $5441862cd2f5e111$export$e68cff63f76bd15b as ListingProvider, $5441862cd2f5e111$export$8d0c4fdbb05a2f2e as useListing, $1e69163caedaab4e$export$11354f017ddc9790 as ProductCardIndexProvider, $1e69163caedaab4e$export$e3faf4d95300054f as useProductCardIndex, $4df489344a0f97c7$export$e4b984597b71e989 as ShopifyContainedImage, $002f09d00aac50b2$export$6649caad96ef8870 as SlidableItems, $fc830a7ee59416ef$export$ebdc3711f7e02ccd as make_accurate_width_accessor, $d5d7e58c5c9d8db0$export$9574e176201e5e8d as RecommendationSlider, $b432b11321ad4c97$export$9756467d34d91cdb as RecommendationGrid, $56047603f9d212b6$export$6e5611bc7e57e477 as ShopifyResponsiveImg, $56047603f9d212b6$export$e6fffe67d4cdd848 as makeSizeAccessor, $801e8845d3fa3653$export$94026ee33dbabc26 as ImageContainer, $74777e8fe65b3dcb$export$b69d0d92862de18b as SentryErrorBoundary, $ad371564683947ab$export$6c6d7a51fa9aa15d as ExpandingDetails, $e18ab2868df26f40$export$f091cbac892643a4 as accessor_of_object_to_object_with_accessor_values, $4711a82d08d2021b$export$fecbb157621501bd as SelectedFilters, $f6b0500577e1b210$export$3f1a388cc0d8fed7 as FilterBody, $44aa24b1bb793549$export$b288c38ae3fddb56 as create_modified_filters, $63f1f8dbcd07d3b0$export$d21e32dfedac04be as SolidLayout, $d5f1e6a0f9117286$export$79b1565500412d9b as general_modal_abstraction, $9783d437ad61594c$export$3b621d86b1566b2 as CrossIcon, $ca6ab5f08bd28bca$export$8be2714ec7f169ee as GenericSliderArrowButton, $50aebf5b445518eb$export$58e808b1db15d3bc as fetchDepictRecommendations, $f5f54892fd0c7d9f$export$de035477d6fef996 as QuickLinks, $f5f54892fd0c7d9f$export$5b7c3ce0ebe51f86 as BreadCrumbs, $fa332ea03168857c$export$b91cec6bdc6b32a1 as CategoryTitle, $702d7656a373973e$export$824dde41348efed1 as embedded_num_products, $160ea2b55d8772d2$export$c1a6b039e689a58e as get_listings, $f5f54892fd0c7d9f$export$f34314aa9505732e as DepictCategory, $f5f54892fd0c7d9f$export$e2bf8ce7779e827e as CategoryPage, $eb064bc3350276c1$export$ac6237957a15b3f0 as DepictSearch, $eb064bc3350276c1$export$bde3eb976dfded9 as get_search_query_updating_blocked_signal, $eb064bc3350276c1$export$f2dc7e4e4aa11abb as SearchPage, $f3b7124b76123e44$export$aa14a9f43128f61f as ProductCardError, $169c13c0531d91d2$export$d86a33413558014e as open_modal_with_alignment, $5eaa00b951637e96$export$ee1733d9a8495996 as DefaultInstantCardPlaceholder, $1308a7816c3d4f2d$export$b3ad617e9036868 as align_field, $1308a7816c3d4f2d$export$3f238c96c45e6cc6 as ALIGN_TOP, $1308a7816c3d4f2d$export$902f8b4a7dae5d78 as ALIGN_WIDTH_ON_MODAL, $1308a7816c3d4f2d$export$7895aadd1956b1c7 as ALIGN_LEFT, $1308a7816c3d4f2d$export$6060bc6bee850eb6 as SET_CENTERED_LEFT, $a9c7ba6087881ac2$export$6daf8749b65a1b77 as convert_sdk_cols_at_size_to_layout, $cc64aabf2c7a1f1a$export$1233ca167bf71f9a as styles_to_valid_css_string, $e56d241d0f33d459$export$fe334901e8bebd57 as disable_scrolling, $573c007c697a1831$export$d0596b5cae35ad4 as open_search_with_shift_slash, $284849364a6ef73a$export$e015ed2f2950f2e3 as DepictAPI, $00a5b94f0c11efbb$export$d9f36cf74e24d595 as media_query_to_accessor, $e60a76195ac6d408$export$689e204eadb33baf as setup_fast_leave, $a61a2051e15c8d7a$export$5196e4c01fa56fcb as show_toast, $60ec7a29849d81db$export$a71e92cfbb498adc as SolidFormatPrice, $37e8c97bb6876197$export$828dcdd425fd3231 as connect_search_field_height_to_aligner_height, $bc2337c9a05ecd18$export$acb3eaade4b23afd as BasePlaceholder, $ceafb6fb91c6f394$export$89c6019e4baa40b1 as TextPlaceholder, $3ab4aa97880fb88d$export$3f37af283f8fb843 as ImagePlaceholder, $f9fd3017c20b774a$export$3ccaa27d81dd8556 as PageReplacer, $d399250dfa491636$export$864d304a0bc46829 as defaultGridSpacing, $d399250dfa491636$export$c3834fa86c616831 as defaultColsAtSize, $d399250dfa491636$export$7bf543b9d9be2c22 as defaultCategoryTitlePlugin, $8db9a15135765c11$export$83d89fbfd8236492 as version, $a3026fb727bc7550$export$316f6f283ae64765 as SearchField };
|