@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.js CHANGED
@@ -10,7 +10,7 @@ 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.0.17";
13
+ const $8db9a15135765c11$export$83d89fbfd8236492 = "4.0.19";
14
14
 
15
15
  /**
16
16
  * Symbol used to identify the version of a SearchModal function. Values right now: 1 = 1st gen classic modal, 2 = second gen modal
@@ -2736,8 +2736,8 @@ function $4a3ed70b3b7c60d5$export$9ca09caa9c849d9c() {
2736
2736
  var $26db6925469636a4$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<a>`),
2737
2737
  $26db6925469636a4$var$_tmpl$2 = /*#__PURE__*/$8tj43$template(`<div class=listing-card><div class=image-part></div><!$><!/><h3 class=title>`),
2738
2738
  $26db6925469636a4$var$_tmpl$3 = /*#__PURE__*/$8tj43$template(`<div class=empty-image>`);
2739
- const $26db6925469636a4$var$aspectRatioWidthComponent = 402.67;
2740
- const $26db6925469636a4$var$aspectRatioHeightComponent = 203.64;
2739
+ const $26db6925469636a4$var$aspectRatioWidthComponent = 400;
2740
+ const $26db6925469636a4$var$aspectRatioHeightComponent = 200;
2741
2741
  const $26db6925469636a4$var$listingSuggestionCollageAspectRatio = $26db6925469636a4$var$aspectRatioWidthComponent / $26db6925469636a4$var$aspectRatioHeightComponent;
2742
2742
  function $26db6925469636a4$export$67152d26d4f56ee8(_ref) {
2743
2743
  let {
@@ -2899,7 +2899,7 @@ function $26db6925469636a4$export$ea41102db9bd68c3(_ref3) {
2899
2899
  function $26db6925469636a4$var$EmptyImage() {
2900
2900
  return (() => {
2901
2901
  var _el$7 = $8tj43$getNextElement($26db6925469636a4$var$_tmpl$3);
2902
- _el$7.style.setProperty("aspect-ratio", "1.977362011392654");
2902
+ _el$7.style.setProperty("aspect-ratio", "2");
2903
2903
  $8tj43$insert(_el$7, $8tj43$createComponent((0, $4a3ed70b3b7c60d5$export$9ca09caa9c849d9c), {}));
2904
2904
  return _el$7;
2905
2905
  })();
@@ -3520,11 +3520,12 @@ function $1abb91ab5abc8994$export$66d1697a0f27069c(modalLayoutStacked) {
3520
3520
  var $06fcd2a345efd24d$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<div class=instant-results-wrapper><h2></h2><!$><!/>`),
3521
3521
  $06fcd2a345efd24d$var$_tmpl$2 = /*#__PURE__*/$8tj43$template(`<div>`),
3522
3522
  $06fcd2a345efd24d$var$_tmpl$3 = /*#__PURE__*/$8tj43$template(`<dialog>`),
3523
- $06fcd2a345efd24d$var$_tmpl$4 = /*#__PURE__*/$8tj43$template(`<div class=depict-search-modal-backdrop>`),
3524
- $06fcd2a345efd24d$var$_tmpl$5 = /*#__PURE__*/$8tj43$template(`<div class=depict-search-modal><div class=body><!$><!/><div class=padded></div><div class=discover-more><button class=major type=button></button></div></div><!$><!/>`),
3525
- $06fcd2a345efd24d$var$_tmpl$6 = /*#__PURE__*/$8tj43$template(`<div class=left>`),
3526
- $06fcd2a345efd24d$var$_tmpl$7 = /*#__PURE__*/$8tj43$template(`<div class=right>`),
3527
- $06fcd2a345efd24d$var$_tmpl$8 = /*#__PURE__*/$8tj43$template(`<b>`);
3523
+ $06fcd2a345efd24d$var$_tmpl$4 = /*#__PURE__*/$8tj43$template(`<div class=discover-more><button class=major type=button>`),
3524
+ $06fcd2a345efd24d$var$_tmpl$5 = /*#__PURE__*/$8tj43$template(`<b>`),
3525
+ $06fcd2a345efd24d$var$_tmpl$6 = /*#__PURE__*/$8tj43$template(`<div class=depict-search-modal-backdrop>`),
3526
+ $06fcd2a345efd24d$var$_tmpl$7 = /*#__PURE__*/$8tj43$template(`<div class=depict-search-modal><div class=body><!$><!/><div class=padded></div></div><!$><!/>`),
3527
+ $06fcd2a345efd24d$var$_tmpl$8 = /*#__PURE__*/$8tj43$template(`<div class=left>`),
3528
+ $06fcd2a345efd24d$var$_tmpl$9 = /*#__PURE__*/$8tj43$template(`<div class=right>`);
3528
3529
  /**
3529
3530
  * Second generation search modal - the solid component that gets added to <body> when the search modal is opened
3530
3531
  */
@@ -3826,6 +3827,21 @@ function $06fcd2a345efd24d$var$RawSearchModalV2(_ref) {
3826
3827
  return _el$6;
3827
3828
  })();
3828
3829
  };
3830
+ const discoverMoreSection = (() => {
3831
+ var _el$7 = $8tj43$getNextElement($06fcd2a345efd24d$var$_tmpl$4),
3832
+ _el$8 = _el$7.firstChild;
3833
+ $8tj43$addEventListener(_el$8, "click", $8tj43$catchify(() => submit_query_()), true);
3834
+ $8tj43$insert(_el$8, (() => {
3835
+ var _c$ = $8tj43$memo(() => !!get_search_field_value_());
3836
+ return () => _c$() ? i18n_.modal_view_all_results_()((() => {
3837
+ var _el$9 = $8tj43$getNextElement($06fcd2a345efd24d$var$_tmpl$5);
3838
+ $8tj43$insert(_el$9, formattedTotalNumberResults);
3839
+ return _el$9;
3840
+ })()) : i18n_.modal_discover_more_();
3841
+ })());
3842
+ $8tj43$runHydrationEvents();
3843
+ return _el$7;
3844
+ })();
3829
3845
  const search_field = $584c06c09cf4609d$export$b94867ecbd698f21({
3830
3846
  BackIcon_: () => $8tj43$createComponent((0, $c2fe922d21c40514$export$11e9f390c90a537f), {}),
3831
3847
  input_field_ref_: element => set_input_field(element),
@@ -3875,24 +3891,22 @@ function $06fcd2a345efd24d$var$RawSearchModalV2(_ref) {
3875
3891
  },
3876
3892
  get children() {
3877
3893
  return [(() => {
3878
- var _el$7 = $8tj43$getNextElement($06fcd2a345efd24d$var$_tmpl$4);
3879
- $8tj43$addEventListener(_el$7, "click", close_modal_, true);
3880
- $8tj43$effect(_$p => $8tj43$classList(_el$7, {
3894
+ var _el$10 = $8tj43$getNextElement($06fcd2a345efd24d$var$_tmpl$6);
3895
+ $8tj43$addEventListener(_el$10, "click", close_modal_, true);
3896
+ $8tj43$effect(_$p => $8tj43$classList(_el$10, {
3881
3897
  [backdropRandomClassname]: true
3882
3898
  }, _$p));
3883
3899
  $8tj43$runHydrationEvents();
3884
- return _el$7;
3900
+ return _el$10;
3885
3901
  })(), (() => {
3886
- var _el$8 = $8tj43$getNextElement($06fcd2a345efd24d$var$_tmpl$5),
3887
- _el$9 = _el$8.firstChild,
3888
- _el$13 = _el$9.firstChild,
3889
- [_el$14, _co$2] = $8tj43$getNextMarker(_el$13.nextSibling),
3890
- _el$10 = _el$14.nextSibling,
3891
- _el$11 = _el$10.nextSibling,
3902
+ var _el$11 = $8tj43$getNextElement($06fcd2a345efd24d$var$_tmpl$7),
3892
3903
  _el$12 = _el$11.firstChild,
3893
- _el$15 = _el$9.nextSibling,
3894
- [_el$16, _co$3] = $8tj43$getNextMarker(_el$15.nextSibling);
3895
- $8tj43$addEventListener(_el$8, "click", $8tj43$catchify(_ref3 => {
3904
+ _el$14 = _el$12.firstChild,
3905
+ [_el$15, _co$2] = $8tj43$getNextMarker(_el$14.nextSibling),
3906
+ _el$13 = _el$15.nextSibling,
3907
+ _el$16 = _el$12.nextSibling,
3908
+ [_el$17, _co$3] = $8tj43$getNextMarker(_el$16.nextSibling);
3909
+ $8tj43$addEventListener(_el$11, "click", $8tj43$catchify(_ref3 => {
3896
3910
  let {
3897
3911
  target: target,
3898
3912
  currentTarget: currentTarget
@@ -3904,10 +3918,11 @@ function $06fcd2a345efd24d$var$RawSearchModalV2(_ref) {
3904
3918
  const resizeObserver = new ResizeObserver($8tj43$catchify(records => setModalBodyWidth(records.at(-1).contentRect.width)));
3905
3919
  resizeObserver.observe(element);
3906
3920
  $8tj43$onCleanup(() => resizeObserver.disconnect());
3907
- }, _el$9);
3908
- $8tj43$insert(_el$9, search_field, _el$14, _co$2);
3921
+ }, _el$12);
3922
+ $8tj43$insert(_el$12, search_field, _el$15, _co$2);
3909
3923
  $8tj43$use(el => {
3910
- $8tj43$catchify((0, $558d0596fcf0e0b0$export$50b90be27d8502d9))(el, bodyAlignmentSignal, bottom_distance_under_modal_);
3924
+ $8tj43$catchify((0, $558d0596fcf0e0b0$export$50b90be27d8502d9))(el, bodyAlignmentSignal, bottom_distance_under_modal_ || (() => 0.03 // 3% under SearchModalV2 by default
3925
+ ));
3911
3926
  // Workaround part 2 of https://github.com/solidjs/solid/issues/2030
3912
3927
  // 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
3913
3928
  // We could also lift out the createResource from InstantResults into this component, but this component is already huge.
@@ -3915,41 +3930,32 @@ function $06fcd2a345efd24d$var$RawSearchModalV2(_ref) {
3915
3930
  const showStackedDOM = $8tj43$createMemo(() => modalLayoutStacked_() || noResults());
3916
3931
  $8tj43$createEffect(() => {
3917
3932
  if (showStackedDOM()) {
3918
- el.replaceChildren(...renderedTextSuggestions(), ...renderedVisualSuggestions());
3933
+ el.replaceChildren(...renderedTextSuggestions(), ...renderedVisualSuggestions(), discoverMoreSection);
3919
3934
  return;
3920
3935
  }
3921
3936
  el.replaceChildren(...[(() => {
3922
- var _el$17 = $8tj43$getNextElement($06fcd2a345efd24d$var$_tmpl$6);
3923
- $8tj43$insert(_el$17, renderedTextSuggestions);
3924
- return _el$17;
3925
- })(), (() => {
3926
- var _el$18 = $8tj43$getNextElement($06fcd2a345efd24d$var$_tmpl$7);
3927
- $8tj43$insert(_el$18, renderedVisualSuggestions);
3937
+ var _el$18 = $8tj43$getNextElement($06fcd2a345efd24d$var$_tmpl$8);
3938
+ $8tj43$insert(_el$18, renderedTextSuggestions);
3928
3939
  return _el$18;
3929
- })()]);
3940
+ })(), (() => {
3941
+ var _el$19 = $8tj43$getNextElement($06fcd2a345efd24d$var$_tmpl$9);
3942
+ $8tj43$insert(_el$19, renderedVisualSuggestions);
3943
+ return _el$19;
3944
+ })(), discoverMoreSection]);
3930
3945
  });
3931
- }, _el$10);
3932
- $8tj43$addEventListener(_el$12, "click", $8tj43$catchify(() => submit_query_()), true);
3933
- $8tj43$insert(_el$12, (() => {
3934
- var _c$ = $8tj43$memo(() => !!get_search_field_value_());
3935
- return () => _c$() ? i18n_.modal_view_all_results_()((() => {
3936
- var _el$19 = $8tj43$getNextElement($06fcd2a345efd24d$var$_tmpl$8);
3937
- $8tj43$insert(_el$19, formattedTotalNumberResults);
3938
- return _el$19;
3939
- })()) : i18n_.modal_discover_more_();
3940
- })());
3941
- $8tj43$insert(_el$8, $8tj43$createComponent((0, $a86e71c0015bd8ab$export$f021bdedd3ec901a), {
3946
+ }, _el$13);
3947
+ $8tj43$insert(_el$11, $8tj43$createComponent((0, $a86e71c0015bd8ab$export$f021bdedd3ec901a), {
3942
3948
  styles: mergedCssObject
3943
- }), _el$16, _co$3);
3949
+ }), _el$17, _co$3);
3944
3950
  $8tj43$effect(_p$ => {
3945
3951
  var _v$ = !!modalLayoutStacked_(),
3946
3952
  _v$2 = {
3947
3953
  [random_classname_body]: true
3948
3954
  },
3949
3955
  _v$3 = !!noResults();
3950
- _v$ !== _p$.e && _el$8.classList.toggle("stacked", _p$.e = _v$);
3951
- _p$.t = $8tj43$classList(_el$9, _v$2, _p$.t);
3952
- _v$3 !== _p$.a && _el$10.classList.toggle("no-results", _p$.a = _v$3);
3956
+ _v$ !== _p$.e && _el$11.classList.toggle("stacked", _p$.e = _v$);
3957
+ _p$.t = $8tj43$classList(_el$12, _v$2, _p$.t);
3958
+ _v$3 !== _p$.a && _el$13.classList.toggle("no-results", _p$.a = _v$3);
3953
3959
  return _p$;
3954
3960
  }, {
3955
3961
  e: undefined,
@@ -3957,7 +3963,7 @@ function $06fcd2a345efd24d$var$RawSearchModalV2(_ref) {
3957
3963
  a: undefined
3958
3964
  });
3959
3965
  $8tj43$runHydrationEvents();
3960
- return _el$8;
3966
+ return _el$11;
3961
3967
  })()];
3962
3968
  }
3963
3969
  })];
@@ -10449,7 +10455,8 @@ function $082c4ed3e22f8d71$export$9bf11afa910f536e(_ref) {
10449
10455
  background = el;
10450
10456
  (0, $8tj43$observer).wait_for_element(el).then($8tj43$catchify(() => {
10451
10457
  set_background_style("transition", "all 200ms ease-in");
10452
- set_background_style("opacity", "1");
10458
+ // For some reason this needs a requestAnimationFrame but the other modal-opening animations don't
10459
+ requestAnimationFrame($8tj43$catchify(() => set_background_style("opacity", "1")));
10453
10460
  }));
10454
10461
  }, _el$2);
10455
10462
  $8tj43$addEventListener(_el$2, "click", dismiss_modal_, true);
@@ -13529,6 +13536,69 @@ function $d53ebed6f63304e4$var$make_state_saved_rows(_ref2, i18n_) {
13529
13536
  }));
13530
13537
  return rows;
13531
13538
  }
13539
+ function $d7833ca17fc05c5e$export$e06dee46ebe7faa9(_ref) {
13540
+ let {
13541
+ setBackdropStyle_: setBackdropStyle_,
13542
+ setBodyAlignment_: setBodyAlignment_,
13543
+ openDuration_: openDuration_
13544
+ } = _ref;
13545
+ setBackdropStyle_(prev => ({
13546
+ ...prev,
13547
+ opacity: 0,
13548
+ transition: "opacity ".concat(openDuration_, "ms ease-in")
13549
+ }));
13550
+ requestAnimationFrame(() => setBackdropStyle_(prev => ({
13551
+ ...prev,
13552
+ opacity: 1
13553
+ })));
13554
+ setBodyAlignment_(prev => ({
13555
+ ...prev,
13556
+ opacity: 0,
13557
+ transition: "opacity ".concat(openDuration_, "ms ease-in ").concat(openDuration_ / 5, "ms"),
13558
+ // Add a slight delay so the brightness of the modal isn't so jarring before the background has gotten darkened
13559
+ "--js-animation-duration": "".concat(openDuration_, "ms")
13560
+ }));
13561
+ requestAnimationFrame(() => setBodyAlignment_(prev => ({
13562
+ ...prev,
13563
+ opacity: 1
13564
+ })));
13565
+ }
13566
+ function $d7833ca17fc05c5e$export$23d40cc5971c3acd(_ref2) {
13567
+ let {
13568
+ setBackdropStyle_: setBackdropStyle_,
13569
+ setBodyAlignment_: setBodyAlignment_,
13570
+ closeDuration_: closeDuration_
13571
+ } = _ref2;
13572
+ setBackdropStyle_(prev => ({
13573
+ ...prev,
13574
+ opacity: 0,
13575
+ transition: "opacity ".concat(closeDuration_, "ms ease-out")
13576
+ }));
13577
+ setBodyAlignment_(prev => ({
13578
+ ...prev,
13579
+ opacity: 0,
13580
+ transition: "opacity ".concat(closeDuration_, "ms ease-out")
13581
+ }));
13582
+ }
13583
+ function $d7833ca17fc05c5e$export$dab9321f3c157061(alignmentSignals, modalVersion) {
13584
+ const [, setBodyAlignment_] = alignmentSignals.body_;
13585
+ const [, setBackdropStyle_] = alignmentSignals.backdrop_ || $8tj43$createSignal({});
13586
+ // For default centered modal, also run our fading animations if search modal v2
13587
+ modalVersion === 2 && $d7833ca17fc05c5e$export$e06dee46ebe7faa9({
13588
+ openDuration_: 125,
13589
+ setBodyAlignment_: setBodyAlignment_,
13590
+ setBackdropStyle_: setBackdropStyle_
13591
+ });
13592
+ const closingAnimation = modalVersion === 2 ? async () => {
13593
+ $d7833ca17fc05c5e$export$23d40cc5971c3acd({
13594
+ closeDuration_: 100,
13595
+ setBodyAlignment_: setBodyAlignment_,
13596
+ setBackdropStyle_: setBackdropStyle_
13597
+ });
13598
+ await new Promise(r => setTimeout(r, 100));
13599
+ } : undefined;
13600
+ return closingAnimation;
13601
+ }
13532
13602
  var $937791b86d3d1509$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<div class="depict plp search">`);
13533
13603
  function $937791b86d3d1509$export$44f738469d5570cf(_ref) {
13534
13604
  let {
@@ -13543,7 +13613,15 @@ function $937791b86d3d1509$export$44f738469d5570cf(_ref) {
13543
13613
  } = _ref;
13544
13614
  return $8tj43$createRoot(dispose => {
13545
13615
  const [innerWidthReactive, setInnerWidthReactive] = $8tj43$createSignal(innerWidth);
13546
- const resizeObserver = new ResizeObserver(records => setInnerWidthReactive(records.at(-1).contentRect.width));
13616
+ const [innerHeightReactive, setInnerHeightReactive] = $8tj43$createSignal(innerHeight);
13617
+ const resizeObserver = new ResizeObserver(records => {
13618
+ const {
13619
+ width: width,
13620
+ height: height
13621
+ } = records.at(-1).contentRect;
13622
+ setInnerWidthReactive(width);
13623
+ setInnerHeightReactive(height);
13624
+ });
13547
13625
  const {
13548
13626
  left: left,
13549
13627
  top: top,
@@ -13576,6 +13654,13 @@ function $937791b86d3d1509$export$44f738469d5570cf(_ref) {
13576
13654
  zIndex: +zIndexOfFake + 1
13577
13655
  } : {})
13578
13656
  });
13657
+ const absoluteFieldTop = $8tj43$createMemo(() => {
13658
+ innerHeightReactive();
13659
+ innerWidthReactive();
13660
+ // This is very semi-scientific but I hope it works (seems to, albeit laggy see comment where this value gets used)
13661
+ return fakeField.getBoundingClientRect().top;
13662
+ });
13663
+ $8tj43$createEffect(() => console.log("absoluteFieldTop", fakeField, absoluteFieldTop(), "changing", addedToBody));
13579
13664
  const pxOffCenter = Math.abs($8tj43$untrack(innerWidthReactive) / 2 - (left + width / 2));
13580
13665
  const openDuration_ = pxOffCenter > 100 ? 250 : 125; // faster animations if little left-right movement
13581
13666
  const closeDuration_ = pxOffCenter > 100 ? 150 : 100;
@@ -13609,7 +13694,10 @@ function $937791b86d3d1509$export$44f738469d5570cf(_ref) {
13609
13694
  Object.assign(addedToBody.style, {
13610
13695
  // This is left: 50%, transform: translateX(-50) with extra steps but when using it safari and firefox glitch out like crazy
13611
13696
  left: "".concat(innerWidthReactive() / 2 - inModalFieldWidth() / 2, "px"),
13612
- width: inModalFieldWidthPx()
13697
+ width: inModalFieldWidthPx(),
13698
+ // 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.
13699
+ // 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…
13700
+ top: absoluteFieldTop() + "px"
13613
13701
  });
13614
13702
  // We might only have changed the left position which align_field doesn't know about, make it poll the position for a while
13615
13703
  setPollAlignment_(true);
@@ -13627,7 +13715,7 @@ function $937791b86d3d1509$export$44f738469d5570cf(_ref) {
13627
13715
  clearTimeout(disableResizePollingTimeout);
13628
13716
  setPollAlignment_(false);
13629
13717
  });
13630
- $937791b86d3d1509$export$e06dee46ebe7faa9({
13718
+ $d7833ca17fc05c5e$export$e06dee46ebe7faa9({
13631
13719
  setBackdropStyle_: setBackdropStyle_,
13632
13720
  setBodyAlignment_: setBodyAlignment_,
13633
13721
  openDuration_: openDuration_
@@ -13641,7 +13729,7 @@ function $937791b86d3d1509$export$44f738469d5570cf(_ref) {
13641
13729
  width: width,
13642
13730
  left: left
13643
13731
  } = fakeField.getBoundingClientRect();
13644
- $937791b86d3d1509$export$23d40cc5971c3acd({
13732
+ $d7833ca17fc05c5e$export$23d40cc5971c3acd({
13645
13733
  setBackdropStyle_: setBackdropStyle_,
13646
13734
  setBodyAlignment_: setBodyAlignment_,
13647
13735
  closeDuration_: closeDuration_
@@ -13670,69 +13758,6 @@ function $937791b86d3d1509$export$44f738469d5570cf(_ref) {
13670
13758
  };
13671
13759
  });
13672
13760
  }
13673
- function $937791b86d3d1509$export$e06dee46ebe7faa9(_ref2) {
13674
- let {
13675
- setBackdropStyle_: setBackdropStyle_,
13676
- setBodyAlignment_: setBodyAlignment_,
13677
- openDuration_: openDuration_
13678
- } = _ref2;
13679
- setBackdropStyle_(prev => ({
13680
- ...prev,
13681
- opacity: 0,
13682
- transition: "opacity ".concat(openDuration_, "ms ease-in")
13683
- }));
13684
- requestAnimationFrame(() => setBackdropStyle_(prev => ({
13685
- ...prev,
13686
- opacity: 1
13687
- })));
13688
- setBodyAlignment_(prev => ({
13689
- ...prev,
13690
- opacity: 0,
13691
- transition: "opacity ".concat(openDuration_, "ms ease-in ").concat(openDuration_ / 5, "ms"),
13692
- // Add a slight delay so the brightness of the modal isn't so jarring before the background has gotten darkened
13693
- "--js-animation-duration": "".concat(openDuration_, "ms")
13694
- }));
13695
- requestAnimationFrame(() => setBodyAlignment_(prev => ({
13696
- ...prev,
13697
- opacity: 1
13698
- })));
13699
- }
13700
- function $937791b86d3d1509$export$23d40cc5971c3acd(_ref3) {
13701
- let {
13702
- setBackdropStyle_: setBackdropStyle_,
13703
- setBodyAlignment_: setBodyAlignment_,
13704
- closeDuration_: closeDuration_
13705
- } = _ref3;
13706
- setBackdropStyle_(prev => ({
13707
- ...prev,
13708
- opacity: 0,
13709
- transition: "opacity ".concat(closeDuration_, "ms ease-out")
13710
- }));
13711
- setBodyAlignment_(prev => ({
13712
- ...prev,
13713
- opacity: 0,
13714
- transition: "opacity ".concat(closeDuration_, "ms ease-out")
13715
- }));
13716
- }
13717
- function $937791b86d3d1509$export$dab9321f3c157061(alignmentSignals, modalVersion) {
13718
- const [, setBodyAlignment_] = alignmentSignals.body_;
13719
- const [, setBackdropStyle_] = alignmentSignals.backdrop_ || $8tj43$createSignal({});
13720
- // For default centered modal, also run our fading animations if search modal v2
13721
- modalVersion === 2 && $937791b86d3d1509$export$e06dee46ebe7faa9({
13722
- openDuration_: 125,
13723
- setBodyAlignment_: setBodyAlignment_,
13724
- setBackdropStyle_: setBackdropStyle_
13725
- });
13726
- const closingAnimation = modalVersion === 2 ? async () => {
13727
- $937791b86d3d1509$export$23d40cc5971c3acd({
13728
- closeDuration_: 100,
13729
- setBodyAlignment_: setBodyAlignment_,
13730
- setBackdropStyle_: setBackdropStyle_
13731
- });
13732
- await new Promise(r => setTimeout(r, 100));
13733
- } : undefined;
13734
- return closingAnimation;
13735
- }
13736
13761
  var $da279c5a540c6846$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<div class=filter-results-for-one-row><!$><!/><!$><!/>`),
13737
13762
  $da279c5a540c6846$var$_tmpl$2 = /*#__PURE__*/$8tj43$template(`<div class="depict plp search"><div class=listing-page><!$><!/><!$><!/><!$><!/><!$><!/><!$><!/><!$><!/><!$><!/></div><!$><!/><!$><!/>`);
13738
13763
  function $da279c5a540c6846$export$a54ec244c8863715(_ref) {
@@ -14461,7 +14486,7 @@ class $eb064bc3350276c1$export$ac6237957a15b3f0 {
14461
14486
  if (!((_ = open_signal_value[0]) !== null && _ !== void 0 && _.alignmentSignals_) && search_page_aligned_modal_alignment_signals_) {
14462
14487
  // Open modal aligned with search page if no alignment specified and possible to align with search page
14463
14488
  const [options_arg, ...rest] = open_signal_value === true ? [{}] : open_signal_value;
14464
- const closingAnimation = $937791b86d3d1509$export$dab9321f3c157061(search_page_aligned_modal_alignment_signals_, modalVersion);
14489
+ const closingAnimation = $d7833ca17fc05c5e$export$dab9321f3c157061(search_page_aligned_modal_alignment_signals_, modalVersion);
14465
14490
  open_modal_({
14466
14491
  closing_animation_: closingAnimation,
14467
14492
  ...options_arg,
@@ -14471,7 +14496,7 @@ class $eb064bc3350276c1$export$ac6237957a15b3f0 {
14471
14496
  }
14472
14497
  // Open centered modal
14473
14498
  const centeredModalAlignmentSignals = $8e8ce3f7a5eb11a6$export$41b4894022a3580f();
14474
- const closingAnimation = $937791b86d3d1509$export$dab9321f3c157061(centeredModalAlignmentSignals, modalVersion);
14499
+ const closingAnimation = $d7833ca17fc05c5e$export$dab9321f3c157061(centeredModalAlignmentSignals, modalVersion);
14475
14500
  if (signal_value_is_options) {
14476
14501
  const [options_arg, ...rest] = open_signal_value;
14477
14502
  open_modal_({
@@ -14725,7 +14750,7 @@ const $169c13c0531d91d2$export$d86a33413558014e = openModalParams => {
14725
14750
  field_: $8tj43$createSignal({}),
14726
14751
  backdrop_: $8tj43$createSignal({})
14727
14752
  };
14728
- const closingAnimation = $937791b86d3d1509$export$dab9321f3c157061(alignmentSignals_, openModalParams.runAnimations_ ? 2 : 1);
14753
+ const closingAnimation = $d7833ca17fc05c5e$export$dab9321f3c157061(alignmentSignals_, openModalParams.runAnimations_ ? 2 : 1);
14729
14754
  $8tj43$createRoot(dispose => {
14730
14755
  dispose_aligner = () => {
14731
14756
  var _cleanup;