@depict-ai/ui 4.0.17 → 4.0.19
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 +145 -120
- package/ES10/index.d.ts +1 -1
- package/ES10/index.js +145 -120
- package/latest/index.cjs +143 -118
- package/latest/index.d.ts +1 -1
- package/latest/index.js +143 -118
- package/package.json +2 -2
- package/server/ES10/index.cjs +97 -77
- package/server/ES10/index.d.ts +1 -1
- package/server/ES10/index.js +97 -77
- package/server/latest/index.cjs +95 -75
- package/server/latest/index.d.ts +1 -1
- package/server/latest/index.js +95 -75
package/latest/index.cjs
CHANGED
|
@@ -89,7 +89,7 @@ $parcel$export(module.exports, "defaultCategoryTitlePlugin", () => $a3280f0aad99
|
|
|
89
89
|
$parcel$export(module.exports, "version", () => $b757f75811f3261f$export$83d89fbfd8236492);
|
|
90
90
|
$parcel$export(module.exports, "SearchField", () => $c0a0659cf97e8eb2$export$316f6f283ae64765);
|
|
91
91
|
/*! Depict.ai search and product listing SDK */
|
|
92
|
-
const $b757f75811f3261f$export$83d89fbfd8236492 = "4.0.
|
|
92
|
+
const $b757f75811f3261f$export$83d89fbfd8236492 = "4.0.19";
|
|
93
93
|
|
|
94
94
|
/**
|
|
95
95
|
* Symbol used to identify the version of a SearchModal function. Values right now: 1 = 1st gen classic modal, 2 = second gen modal
|
|
@@ -2705,8 +2705,8 @@ function $3a1c4fee88fb8672$export$9ca09caa9c849d9c() {
|
|
|
2705
2705
|
var $1f3b5fa875714dea$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.template(`<a>`),
|
|
2706
2706
|
$1f3b5fa875714dea$var$_tmpl$2 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class=listing-card><div class=image-part></div><!$><!/><h3 class=title>`),
|
|
2707
2707
|
$1f3b5fa875714dea$var$_tmpl$3 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class=empty-image>`);
|
|
2708
|
-
const $1f3b5fa875714dea$var$aspectRatioWidthComponent =
|
|
2709
|
-
const $1f3b5fa875714dea$var$aspectRatioHeightComponent =
|
|
2708
|
+
const $1f3b5fa875714dea$var$aspectRatioWidthComponent = 400;
|
|
2709
|
+
const $1f3b5fa875714dea$var$aspectRatioHeightComponent = 200;
|
|
2710
2710
|
const $1f3b5fa875714dea$var$listingSuggestionCollageAspectRatio = $1f3b5fa875714dea$var$aspectRatioWidthComponent / $1f3b5fa875714dea$var$aspectRatioHeightComponent;
|
|
2711
2711
|
function $1f3b5fa875714dea$export$67152d26d4f56ee8({
|
|
2712
2712
|
listing_: listing_,
|
|
@@ -2852,7 +2852,7 @@ function $1f3b5fa875714dea$export$ea41102db9bd68c3({
|
|
|
2852
2852
|
function $1f3b5fa875714dea$var$EmptyImage() {
|
|
2853
2853
|
return (() => {
|
|
2854
2854
|
var _el$7 = $gVhhF$solidjsweb.getNextElement($1f3b5fa875714dea$var$_tmpl$3);
|
|
2855
|
-
_el$7.style.setProperty("aspect-ratio", "
|
|
2855
|
+
_el$7.style.setProperty("aspect-ratio", "2");
|
|
2856
2856
|
$gVhhF$solidjsweb.insert(_el$7, $gVhhF$solidjsweb.createComponent((0, $3a1c4fee88fb8672$export$9ca09caa9c849d9c), {}));
|
|
2857
2857
|
return _el$7;
|
|
2858
2858
|
})();
|
|
@@ -3448,11 +3448,12 @@ function $3b9f2020814c7876$export$66d1697a0f27069c(modalLayoutStacked) {
|
|
|
3448
3448
|
var $11597ae03e703a47$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class=instant-results-wrapper><h2></h2><!$><!/>`),
|
|
3449
3449
|
$11597ae03e703a47$var$_tmpl$2 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div>`),
|
|
3450
3450
|
$11597ae03e703a47$var$_tmpl$3 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<dialog>`),
|
|
3451
|
-
$11597ae03e703a47$var$_tmpl$4 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class=
|
|
3452
|
-
$11597ae03e703a47$var$_tmpl$5 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<
|
|
3453
|
-
$11597ae03e703a47$var$_tmpl$6 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class=
|
|
3454
|
-
$11597ae03e703a47$var$_tmpl$7 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class=
|
|
3455
|
-
$11597ae03e703a47$var$_tmpl$8 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<
|
|
3451
|
+
$11597ae03e703a47$var$_tmpl$4 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class=discover-more><button class=major type=button>`),
|
|
3452
|
+
$11597ae03e703a47$var$_tmpl$5 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<b>`),
|
|
3453
|
+
$11597ae03e703a47$var$_tmpl$6 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class=depict-search-modal-backdrop>`),
|
|
3454
|
+
$11597ae03e703a47$var$_tmpl$7 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class=depict-search-modal><div class=body><!$><!/><div class=padded></div></div><!$><!/>`),
|
|
3455
|
+
$11597ae03e703a47$var$_tmpl$8 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class=left>`),
|
|
3456
|
+
$11597ae03e703a47$var$_tmpl$9 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class=right>`);
|
|
3456
3457
|
/**
|
|
3457
3458
|
* Second generation search modal - the solid component that gets added to <body> when the search modal is opened
|
|
3458
3459
|
*/
|
|
@@ -3746,6 +3747,21 @@ function $11597ae03e703a47$var$RawSearchModalV2({
|
|
|
3746
3747
|
return _el$6;
|
|
3747
3748
|
})();
|
|
3748
3749
|
};
|
|
3750
|
+
const discoverMoreSection = (() => {
|
|
3751
|
+
var _el$7 = $gVhhF$solidjsweb.getNextElement($11597ae03e703a47$var$_tmpl$4),
|
|
3752
|
+
_el$8 = _el$7.firstChild;
|
|
3753
|
+
$gVhhF$solidjsweb.addEventListener(_el$8, "click", $gVhhF$depictaiutilishared.catchify(() => submit_query_()), true);
|
|
3754
|
+
$gVhhF$solidjsweb.insert(_el$8, (() => {
|
|
3755
|
+
var _c$ = $gVhhF$solidjsweb.memo(() => !!get_search_field_value_());
|
|
3756
|
+
return () => _c$() ? i18n_.modal_view_all_results_()((() => {
|
|
3757
|
+
var _el$9 = $gVhhF$solidjsweb.getNextElement($11597ae03e703a47$var$_tmpl$5);
|
|
3758
|
+
$gVhhF$solidjsweb.insert(_el$9, formattedTotalNumberResults);
|
|
3759
|
+
return _el$9;
|
|
3760
|
+
})()) : i18n_.modal_discover_more_();
|
|
3761
|
+
})());
|
|
3762
|
+
$gVhhF$solidjsweb.runHydrationEvents();
|
|
3763
|
+
return _el$7;
|
|
3764
|
+
})();
|
|
3749
3765
|
const search_field = $66b8b9a9613c141d$export$b94867ecbd698f21({
|
|
3750
3766
|
BackIcon_: () => $gVhhF$solidjsweb.createComponent((0, $b8660a70353e03cf$export$11e9f390c90a537f), {}),
|
|
3751
3767
|
input_field_ref_: element => set_input_field(element),
|
|
@@ -3791,24 +3807,22 @@ function $11597ae03e703a47$var$RawSearchModalV2({
|
|
|
3791
3807
|
},
|
|
3792
3808
|
get children() {
|
|
3793
3809
|
return [(() => {
|
|
3794
|
-
var _el$
|
|
3795
|
-
$gVhhF$solidjsweb.addEventListener(_el$
|
|
3796
|
-
$gVhhF$solidjsweb.effect(_$p => $gVhhF$solidjsweb.classList(_el$
|
|
3810
|
+
var _el$10 = $gVhhF$solidjsweb.getNextElement($11597ae03e703a47$var$_tmpl$6);
|
|
3811
|
+
$gVhhF$solidjsweb.addEventListener(_el$10, "click", close_modal_, true);
|
|
3812
|
+
$gVhhF$solidjsweb.effect(_$p => $gVhhF$solidjsweb.classList(_el$10, {
|
|
3797
3813
|
[backdropRandomClassname]: true
|
|
3798
3814
|
}, _$p));
|
|
3799
3815
|
$gVhhF$solidjsweb.runHydrationEvents();
|
|
3800
|
-
return _el$
|
|
3816
|
+
return _el$10;
|
|
3801
3817
|
})(), (() => {
|
|
3802
|
-
var _el$
|
|
3803
|
-
_el$9 = _el$8.firstChild,
|
|
3804
|
-
_el$13 = _el$9.firstChild,
|
|
3805
|
-
[_el$14, _co$2] = $gVhhF$solidjsweb.getNextMarker(_el$13.nextSibling),
|
|
3806
|
-
_el$10 = _el$14.nextSibling,
|
|
3807
|
-
_el$11 = _el$10.nextSibling,
|
|
3818
|
+
var _el$11 = $gVhhF$solidjsweb.getNextElement($11597ae03e703a47$var$_tmpl$7),
|
|
3808
3819
|
_el$12 = _el$11.firstChild,
|
|
3809
|
-
_el$
|
|
3810
|
-
[_el$
|
|
3811
|
-
|
|
3820
|
+
_el$14 = _el$12.firstChild,
|
|
3821
|
+
[_el$15, _co$2] = $gVhhF$solidjsweb.getNextMarker(_el$14.nextSibling),
|
|
3822
|
+
_el$13 = _el$15.nextSibling,
|
|
3823
|
+
_el$16 = _el$12.nextSibling,
|
|
3824
|
+
[_el$17, _co$3] = $gVhhF$solidjsweb.getNextMarker(_el$16.nextSibling);
|
|
3825
|
+
$gVhhF$solidjsweb.addEventListener(_el$11, "click", $gVhhF$depictaiutilishared.catchify(({
|
|
3812
3826
|
target: target,
|
|
3813
3827
|
currentTarget: currentTarget
|
|
3814
3828
|
}) => {
|
|
@@ -3819,10 +3833,11 @@ function $11597ae03e703a47$var$RawSearchModalV2({
|
|
|
3819
3833
|
const resizeObserver = new ResizeObserver($gVhhF$depictaiutilishared.catchify(records => setModalBodyWidth(records.at(-1).contentRect.width)));
|
|
3820
3834
|
resizeObserver.observe(element);
|
|
3821
3835
|
$gVhhF$solidjs.onCleanup(() => resizeObserver.disconnect());
|
|
3822
|
-
}, _el$
|
|
3823
|
-
$gVhhF$solidjsweb.insert(_el$
|
|
3836
|
+
}, _el$12);
|
|
3837
|
+
$gVhhF$solidjsweb.insert(_el$12, search_field, _el$15, _co$2);
|
|
3824
3838
|
$gVhhF$solidjsweb.use(el => {
|
|
3825
|
-
$gVhhF$depictaiutilishared.catchify((0, $7b98f0cf558884f7$export$50b90be27d8502d9))(el, bodyAlignmentSignal, bottom_distance_under_modal_)
|
|
3839
|
+
$gVhhF$depictaiutilishared.catchify((0, $7b98f0cf558884f7$export$50b90be27d8502d9))(el, bodyAlignmentSignal, bottom_distance_under_modal_ || (() => 0.03 // 3% under SearchModalV2 by default
|
|
3840
|
+
));
|
|
3826
3841
|
// Workaround part 2 of https://github.com/solidjs/solid/issues/2030
|
|
3827
3842
|
// We can't just re-render the components in the two different <Show> branches because <Show> would infinite loop because it depends on the resource created by the components
|
|
3828
3843
|
// We could also lift out the createResource from InstantResults into this component, but this component is already huge.
|
|
@@ -3830,41 +3845,32 @@ function $11597ae03e703a47$var$RawSearchModalV2({
|
|
|
3830
3845
|
const showStackedDOM = $gVhhF$solidjs.createMemo(() => modalLayoutStacked_() || noResults());
|
|
3831
3846
|
$gVhhF$solidjs.createEffect(() => {
|
|
3832
3847
|
if (showStackedDOM()) {
|
|
3833
|
-
el.replaceChildren(...renderedTextSuggestions(), ...renderedVisualSuggestions());
|
|
3848
|
+
el.replaceChildren(...renderedTextSuggestions(), ...renderedVisualSuggestions(), discoverMoreSection);
|
|
3834
3849
|
return;
|
|
3835
3850
|
}
|
|
3836
3851
|
el.replaceChildren(...[(() => {
|
|
3837
|
-
var _el$
|
|
3838
|
-
$gVhhF$solidjsweb.insert(_el$
|
|
3839
|
-
return _el$17;
|
|
3840
|
-
})(), (() => {
|
|
3841
|
-
var _el$18 = $gVhhF$solidjsweb.getNextElement($11597ae03e703a47$var$_tmpl$7);
|
|
3842
|
-
$gVhhF$solidjsweb.insert(_el$18, renderedVisualSuggestions);
|
|
3852
|
+
var _el$18 = $gVhhF$solidjsweb.getNextElement($11597ae03e703a47$var$_tmpl$8);
|
|
3853
|
+
$gVhhF$solidjsweb.insert(_el$18, renderedTextSuggestions);
|
|
3843
3854
|
return _el$18;
|
|
3844
|
-
})()
|
|
3855
|
+
})(), (() => {
|
|
3856
|
+
var _el$19 = $gVhhF$solidjsweb.getNextElement($11597ae03e703a47$var$_tmpl$9);
|
|
3857
|
+
$gVhhF$solidjsweb.insert(_el$19, renderedVisualSuggestions);
|
|
3858
|
+
return _el$19;
|
|
3859
|
+
})(), discoverMoreSection]);
|
|
3845
3860
|
});
|
|
3846
|
-
}, _el$
|
|
3847
|
-
$gVhhF$solidjsweb.
|
|
3848
|
-
$gVhhF$solidjsweb.insert(_el$12, (() => {
|
|
3849
|
-
var _c$ = $gVhhF$solidjsweb.memo(() => !!get_search_field_value_());
|
|
3850
|
-
return () => _c$() ? i18n_.modal_view_all_results_()((() => {
|
|
3851
|
-
var _el$19 = $gVhhF$solidjsweb.getNextElement($11597ae03e703a47$var$_tmpl$8);
|
|
3852
|
-
$gVhhF$solidjsweb.insert(_el$19, formattedTotalNumberResults);
|
|
3853
|
-
return _el$19;
|
|
3854
|
-
})()) : i18n_.modal_discover_more_();
|
|
3855
|
-
})());
|
|
3856
|
-
$gVhhF$solidjsweb.insert(_el$8, $gVhhF$solidjsweb.createComponent((0, $b776f25acdda22eb$export$f021bdedd3ec901a), {
|
|
3861
|
+
}, _el$13);
|
|
3862
|
+
$gVhhF$solidjsweb.insert(_el$11, $gVhhF$solidjsweb.createComponent((0, $b776f25acdda22eb$export$f021bdedd3ec901a), {
|
|
3857
3863
|
styles: mergedCssObject
|
|
3858
|
-
}), _el$
|
|
3864
|
+
}), _el$17, _co$3);
|
|
3859
3865
|
$gVhhF$solidjsweb.effect(_p$ => {
|
|
3860
3866
|
var _v$ = !!modalLayoutStacked_(),
|
|
3861
3867
|
_v$2 = {
|
|
3862
3868
|
[random_classname_body]: true
|
|
3863
3869
|
},
|
|
3864
3870
|
_v$3 = !!noResults();
|
|
3865
|
-
_v$ !== _p$.e && _el$
|
|
3866
|
-
_p$.t = $gVhhF$solidjsweb.classList(_el$
|
|
3867
|
-
_v$3 !== _p$.a && _el$
|
|
3871
|
+
_v$ !== _p$.e && _el$11.classList.toggle("stacked", _p$.e = _v$);
|
|
3872
|
+
_p$.t = $gVhhF$solidjsweb.classList(_el$12, _v$2, _p$.t);
|
|
3873
|
+
_v$3 !== _p$.a && _el$13.classList.toggle("no-results", _p$.a = _v$3);
|
|
3868
3874
|
return _p$;
|
|
3869
3875
|
}, {
|
|
3870
3876
|
e: undefined,
|
|
@@ -3872,7 +3878,7 @@ function $11597ae03e703a47$var$RawSearchModalV2({
|
|
|
3872
3878
|
a: undefined
|
|
3873
3879
|
});
|
|
3874
3880
|
$gVhhF$solidjsweb.runHydrationEvents();
|
|
3875
|
-
return _el$
|
|
3881
|
+
return _el$11;
|
|
3876
3882
|
})()];
|
|
3877
3883
|
}
|
|
3878
3884
|
})];
|
|
@@ -9945,7 +9951,8 @@ function $1872ceb56ede7a52$export$9bf11afa910f536e({
|
|
|
9945
9951
|
background = el;
|
|
9946
9952
|
(0, $gVhhF$depictaiutilishared.observer).wait_for_element(el).then($gVhhF$depictaiutilishared.catchify(() => {
|
|
9947
9953
|
set_background_style("transition", "all 200ms ease-in");
|
|
9948
|
-
|
|
9954
|
+
// For some reason this needs a requestAnimationFrame but the other modal-opening animations don't
|
|
9955
|
+
requestAnimationFrame($gVhhF$depictaiutilishared.catchify(() => set_background_style("opacity", "1")));
|
|
9949
9956
|
}));
|
|
9950
9957
|
}, _el$2);
|
|
9951
9958
|
$gVhhF$solidjsweb.addEventListener(_el$2, "click", dismiss_modal_, true);
|
|
@@ -12790,6 +12797,67 @@ function $3716b8caf7f959e2$var$make_state_saved_rows(
|
|
|
12790
12797
|
}));
|
|
12791
12798
|
return rows;
|
|
12792
12799
|
}
|
|
12800
|
+
function $6892e0748f94faa6$export$e06dee46ebe7faa9({
|
|
12801
|
+
setBackdropStyle_: setBackdropStyle_,
|
|
12802
|
+
setBodyAlignment_: setBodyAlignment_,
|
|
12803
|
+
openDuration_: openDuration_
|
|
12804
|
+
}) {
|
|
12805
|
+
setBackdropStyle_(prev => ({
|
|
12806
|
+
...prev,
|
|
12807
|
+
opacity: 0,
|
|
12808
|
+
transition: `opacity ${openDuration_}ms ease-in`
|
|
12809
|
+
}));
|
|
12810
|
+
requestAnimationFrame(() => setBackdropStyle_(prev => ({
|
|
12811
|
+
...prev,
|
|
12812
|
+
opacity: 1
|
|
12813
|
+
})));
|
|
12814
|
+
setBodyAlignment_(prev => ({
|
|
12815
|
+
...prev,
|
|
12816
|
+
opacity: 0,
|
|
12817
|
+
transition: `opacity ${openDuration_}ms ease-in ${openDuration_ / 5}ms`,
|
|
12818
|
+
// Add a slight delay so the brightness of the modal isn't so jarring before the background has gotten darkened
|
|
12819
|
+
"--js-animation-duration": `${openDuration_}ms`
|
|
12820
|
+
}));
|
|
12821
|
+
requestAnimationFrame(() => setBodyAlignment_(prev => ({
|
|
12822
|
+
...prev,
|
|
12823
|
+
opacity: 1
|
|
12824
|
+
})));
|
|
12825
|
+
}
|
|
12826
|
+
function $6892e0748f94faa6$export$23d40cc5971c3acd({
|
|
12827
|
+
setBackdropStyle_: setBackdropStyle_,
|
|
12828
|
+
setBodyAlignment_: setBodyAlignment_,
|
|
12829
|
+
closeDuration_: closeDuration_
|
|
12830
|
+
}) {
|
|
12831
|
+
setBackdropStyle_(prev => ({
|
|
12832
|
+
...prev,
|
|
12833
|
+
opacity: 0,
|
|
12834
|
+
transition: `opacity ${closeDuration_}ms ease-out`
|
|
12835
|
+
}));
|
|
12836
|
+
setBodyAlignment_(prev => ({
|
|
12837
|
+
...prev,
|
|
12838
|
+
opacity: 0,
|
|
12839
|
+
transition: `opacity ${closeDuration_}ms ease-out`
|
|
12840
|
+
}));
|
|
12841
|
+
}
|
|
12842
|
+
function $6892e0748f94faa6$export$dab9321f3c157061(alignmentSignals, modalVersion) {
|
|
12843
|
+
const [, setBodyAlignment_] = alignmentSignals.body_;
|
|
12844
|
+
const [, setBackdropStyle_] = alignmentSignals.backdrop_ || $gVhhF$solidjs.createSignal({});
|
|
12845
|
+
// For default centered modal, also run our fading animations if search modal v2
|
|
12846
|
+
modalVersion === 2 && $6892e0748f94faa6$export$e06dee46ebe7faa9({
|
|
12847
|
+
openDuration_: 125,
|
|
12848
|
+
setBodyAlignment_: setBodyAlignment_,
|
|
12849
|
+
setBackdropStyle_: setBackdropStyle_
|
|
12850
|
+
});
|
|
12851
|
+
const closingAnimation = modalVersion === 2 ? async () => {
|
|
12852
|
+
$6892e0748f94faa6$export$23d40cc5971c3acd({
|
|
12853
|
+
closeDuration_: 100,
|
|
12854
|
+
setBodyAlignment_: setBodyAlignment_,
|
|
12855
|
+
setBackdropStyle_: setBackdropStyle_
|
|
12856
|
+
});
|
|
12857
|
+
await new Promise(r => setTimeout(r, 100));
|
|
12858
|
+
} : undefined;
|
|
12859
|
+
return closingAnimation;
|
|
12860
|
+
}
|
|
12793
12861
|
var $5cbaffcb5602e671$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class="depict plp search">`);
|
|
12794
12862
|
function $5cbaffcb5602e671$export$44f738469d5570cf({
|
|
12795
12863
|
actualField_: actualField_,
|
|
@@ -12803,7 +12871,15 @@ function $5cbaffcb5602e671$export$44f738469d5570cf({
|
|
|
12803
12871
|
}) {
|
|
12804
12872
|
return $gVhhF$solidjs.createRoot(dispose => {
|
|
12805
12873
|
const [innerWidthReactive, setInnerWidthReactive] = $gVhhF$solidjs.createSignal(innerWidth);
|
|
12806
|
-
const
|
|
12874
|
+
const [innerHeightReactive, setInnerHeightReactive] = $gVhhF$solidjs.createSignal(innerHeight);
|
|
12875
|
+
const resizeObserver = new ResizeObserver(records => {
|
|
12876
|
+
const {
|
|
12877
|
+
width: width,
|
|
12878
|
+
height: height
|
|
12879
|
+
} = records.at(-1).contentRect;
|
|
12880
|
+
setInnerWidthReactive(width);
|
|
12881
|
+
setInnerHeightReactive(height);
|
|
12882
|
+
});
|
|
12807
12883
|
const {
|
|
12808
12884
|
left: left,
|
|
12809
12885
|
top: top,
|
|
@@ -12836,6 +12912,13 @@ function $5cbaffcb5602e671$export$44f738469d5570cf({
|
|
|
12836
12912
|
zIndex: +zIndexOfFake + 1
|
|
12837
12913
|
} : {})
|
|
12838
12914
|
});
|
|
12915
|
+
const absoluteFieldTop = $gVhhF$solidjs.createMemo(() => {
|
|
12916
|
+
innerHeightReactive();
|
|
12917
|
+
innerWidthReactive();
|
|
12918
|
+
// This is very semi-scientific but I hope it works (seems to, albeit laggy see comment where this value gets used)
|
|
12919
|
+
return fakeField.getBoundingClientRect().top;
|
|
12920
|
+
});
|
|
12921
|
+
$gVhhF$solidjs.createEffect(() => console.log("absoluteFieldTop", fakeField, absoluteFieldTop(), "changing", addedToBody));
|
|
12839
12922
|
const pxOffCenter = Math.abs($gVhhF$solidjs.untrack(innerWidthReactive) / 2 - (left + width / 2));
|
|
12840
12923
|
const openDuration_ = pxOffCenter > 100 ? 250 : 125; // faster animations if little left-right movement
|
|
12841
12924
|
const closeDuration_ = pxOffCenter > 100 ? 150 : 100;
|
|
@@ -12869,7 +12952,10 @@ function $5cbaffcb5602e671$export$44f738469d5570cf({
|
|
|
12869
12952
|
Object.assign(addedToBody.style, {
|
|
12870
12953
|
// This is left: 50%, transform: translateX(-50) with extra steps but when using it safari and firefox glitch out like crazy
|
|
12871
12954
|
left: `${innerWidthReactive() / 2 - inModalFieldWidth() / 2}px`,
|
|
12872
|
-
width: inModalFieldWidthPx()
|
|
12955
|
+
width: inModalFieldWidthPx(),
|
|
12956
|
+
// Lord forgive me for this is laggy. Example: on preview browser when resizing the screen in both x and y direction at the sam time. But it's too hard to change the code now, so that it doesn't happen.
|
|
12957
|
+
// Basically we'd want one align_field running in only the y-axis on the field that's still in the DOM and another one in the x-axis on the fake field. Or something…
|
|
12958
|
+
top: absoluteFieldTop() + "px"
|
|
12873
12959
|
});
|
|
12874
12960
|
// We might only have changed the left position which align_field doesn't know about, make it poll the position for a while
|
|
12875
12961
|
setPollAlignment_(true);
|
|
@@ -12887,7 +12973,7 @@ function $5cbaffcb5602e671$export$44f738469d5570cf({
|
|
|
12887
12973
|
clearTimeout(disableResizePollingTimeout);
|
|
12888
12974
|
setPollAlignment_(false);
|
|
12889
12975
|
});
|
|
12890
|
-
$
|
|
12976
|
+
$6892e0748f94faa6$export$e06dee46ebe7faa9({
|
|
12891
12977
|
setBackdropStyle_: setBackdropStyle_,
|
|
12892
12978
|
setBodyAlignment_: setBodyAlignment_,
|
|
12893
12979
|
openDuration_: openDuration_
|
|
@@ -12901,7 +12987,7 @@ function $5cbaffcb5602e671$export$44f738469d5570cf({
|
|
|
12901
12987
|
width: width,
|
|
12902
12988
|
left: left
|
|
12903
12989
|
} = fakeField.getBoundingClientRect();
|
|
12904
|
-
$
|
|
12990
|
+
$6892e0748f94faa6$export$23d40cc5971c3acd({
|
|
12905
12991
|
setBackdropStyle_: setBackdropStyle_,
|
|
12906
12992
|
setBodyAlignment_: setBodyAlignment_,
|
|
12907
12993
|
closeDuration_: closeDuration_
|
|
@@ -12930,67 +13016,6 @@ function $5cbaffcb5602e671$export$44f738469d5570cf({
|
|
|
12930
13016
|
};
|
|
12931
13017
|
});
|
|
12932
13018
|
}
|
|
12933
|
-
function $5cbaffcb5602e671$export$e06dee46ebe7faa9({
|
|
12934
|
-
setBackdropStyle_: setBackdropStyle_,
|
|
12935
|
-
setBodyAlignment_: setBodyAlignment_,
|
|
12936
|
-
openDuration_: openDuration_
|
|
12937
|
-
}) {
|
|
12938
|
-
setBackdropStyle_(prev => ({
|
|
12939
|
-
...prev,
|
|
12940
|
-
opacity: 0,
|
|
12941
|
-
transition: `opacity ${openDuration_}ms ease-in`
|
|
12942
|
-
}));
|
|
12943
|
-
requestAnimationFrame(() => setBackdropStyle_(prev => ({
|
|
12944
|
-
...prev,
|
|
12945
|
-
opacity: 1
|
|
12946
|
-
})));
|
|
12947
|
-
setBodyAlignment_(prev => ({
|
|
12948
|
-
...prev,
|
|
12949
|
-
opacity: 0,
|
|
12950
|
-
transition: `opacity ${openDuration_}ms ease-in ${openDuration_ / 5}ms`,
|
|
12951
|
-
// Add a slight delay so the brightness of the modal isn't so jarring before the background has gotten darkened
|
|
12952
|
-
"--js-animation-duration": `${openDuration_}ms`
|
|
12953
|
-
}));
|
|
12954
|
-
requestAnimationFrame(() => setBodyAlignment_(prev => ({
|
|
12955
|
-
...prev,
|
|
12956
|
-
opacity: 1
|
|
12957
|
-
})));
|
|
12958
|
-
}
|
|
12959
|
-
function $5cbaffcb5602e671$export$23d40cc5971c3acd({
|
|
12960
|
-
setBackdropStyle_: setBackdropStyle_,
|
|
12961
|
-
setBodyAlignment_: setBodyAlignment_,
|
|
12962
|
-
closeDuration_: closeDuration_
|
|
12963
|
-
}) {
|
|
12964
|
-
setBackdropStyle_(prev => ({
|
|
12965
|
-
...prev,
|
|
12966
|
-
opacity: 0,
|
|
12967
|
-
transition: `opacity ${closeDuration_}ms ease-out`
|
|
12968
|
-
}));
|
|
12969
|
-
setBodyAlignment_(prev => ({
|
|
12970
|
-
...prev,
|
|
12971
|
-
opacity: 0,
|
|
12972
|
-
transition: `opacity ${closeDuration_}ms ease-out`
|
|
12973
|
-
}));
|
|
12974
|
-
}
|
|
12975
|
-
function $5cbaffcb5602e671$export$dab9321f3c157061(alignmentSignals, modalVersion) {
|
|
12976
|
-
const [, setBodyAlignment_] = alignmentSignals.body_;
|
|
12977
|
-
const [, setBackdropStyle_] = alignmentSignals.backdrop_ || $gVhhF$solidjs.createSignal({});
|
|
12978
|
-
// For default centered modal, also run our fading animations if search modal v2
|
|
12979
|
-
modalVersion === 2 && $5cbaffcb5602e671$export$e06dee46ebe7faa9({
|
|
12980
|
-
openDuration_: 125,
|
|
12981
|
-
setBodyAlignment_: setBodyAlignment_,
|
|
12982
|
-
setBackdropStyle_: setBackdropStyle_
|
|
12983
|
-
});
|
|
12984
|
-
const closingAnimation = modalVersion === 2 ? async () => {
|
|
12985
|
-
$5cbaffcb5602e671$export$23d40cc5971c3acd({
|
|
12986
|
-
closeDuration_: 100,
|
|
12987
|
-
setBodyAlignment_: setBodyAlignment_,
|
|
12988
|
-
setBackdropStyle_: setBackdropStyle_
|
|
12989
|
-
});
|
|
12990
|
-
await new Promise(r => setTimeout(r, 100));
|
|
12991
|
-
} : undefined;
|
|
12992
|
-
return closingAnimation;
|
|
12993
|
-
}
|
|
12994
13019
|
var $f1d7cb69f839a526$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class=filter-results-for-one-row><!$><!/><!$><!/>`),
|
|
12995
13020
|
$f1d7cb69f839a526$var$_tmpl$2 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class="depict plp search"><div class=listing-page><!$><!/><!$><!/><!$><!/><!$><!/><!$><!/><!$><!/><!$><!/></div><!$><!/><!$><!/>`);
|
|
12996
13021
|
function $f1d7cb69f839a526$export$a54ec244c8863715({
|
|
@@ -13621,7 +13646,7 @@ class $2c61e4cd8229c49a$export$ac6237957a15b3f0 {
|
|
|
13621
13646
|
if (!open_signal_value[0]?.alignmentSignals_ && search_page_aligned_modal_alignment_signals_) {
|
|
13622
13647
|
// Open modal aligned with search page if no alignment specified and possible to align with search page
|
|
13623
13648
|
const [options_arg, ...rest] = open_signal_value === true ? [{}] : open_signal_value;
|
|
13624
|
-
const closingAnimation = $
|
|
13649
|
+
const closingAnimation = $6892e0748f94faa6$export$dab9321f3c157061(search_page_aligned_modal_alignment_signals_, modalVersion);
|
|
13625
13650
|
open_modal_({
|
|
13626
13651
|
closing_animation_: closingAnimation,
|
|
13627
13652
|
...options_arg,
|
|
@@ -13631,7 +13656,7 @@ class $2c61e4cd8229c49a$export$ac6237957a15b3f0 {
|
|
|
13631
13656
|
}
|
|
13632
13657
|
// Open centered modal
|
|
13633
13658
|
const centeredModalAlignmentSignals = $2005eec80e40088f$export$41b4894022a3580f();
|
|
13634
|
-
const closingAnimation = $
|
|
13659
|
+
const closingAnimation = $6892e0748f94faa6$export$dab9321f3c157061(centeredModalAlignmentSignals, modalVersion);
|
|
13635
13660
|
if (signal_value_is_options) {
|
|
13636
13661
|
const [options_arg, ...rest] = open_signal_value;
|
|
13637
13662
|
open_modal_({
|
|
@@ -13868,7 +13893,7 @@ const $9c143d25df1fc2a2$export$d86a33413558014e = openModalParams => {
|
|
|
13868
13893
|
field_: $gVhhF$solidjs.createSignal({}),
|
|
13869
13894
|
backdrop_: $gVhhF$solidjs.createSignal({})
|
|
13870
13895
|
};
|
|
13871
|
-
const closingAnimation = $
|
|
13896
|
+
const closingAnimation = $6892e0748f94faa6$export$dab9321f3c157061(alignmentSignals_, openModalParams.runAnimations_ ? 2 : 1);
|
|
13872
13897
|
$gVhhF$solidjs.createRoot(dispose => {
|
|
13873
13898
|
dispose_aligner = () => {
|
|
13874
13899
|
cleanup?.();
|
package/latest/index.d.ts
CHANGED
|
@@ -10,7 +10,7 @@ import { ProductListingRequestV3 } from "@depict-ai/types/api/ProductListingRequ
|
|
|
10
10
|
import { GetListingRequest } from "@depict-ai/types/api/GetListingRequest";
|
|
11
11
|
import { BaseSearchRequestV3 } from "@depict-ai/types/api/BaseSearchRequestV3";
|
|
12
12
|
import { SearchFilter as _SearchFilter2 } from "@depict-ai/types/api/SearchRequestV2";
|
|
13
|
-
export const version = "4.0.
|
|
13
|
+
export const version = "4.0.19";
|
|
14
14
|
/**
|
|
15
15
|
* Symbol used to identify the version of a SearchModal function. Values right now: 1 = 1st gen classic modal, 2 = second gen modal
|
|
16
16
|
*/
|