@depict-ai/ui 4.7.21 → 4.7.23

package/ES10/index.js

@@ -1,6 +1,6 @@
-import { add_to_version_info as $8tj43$add_to_version_info, catchify as $8tj43$catchify, dlog as $8tj43$dlog, camelCasifyObject as $8tj43$camelCasifyObject, useExpandingContainer as $8tj43$useExpandingContainer, fetch_retry as $8tj43$fetch_retry, base_url as $8tj43$base_url, dwarn as $8tj43$dwarn, slider_fractional_factory as $8tj43$slider_fractional_factory, make_random_classname as $8tj43$make_random_classname, n_col_styling_with_dist as $8tj43$n_col_styling_with_dist, layout_get_visible_recs_without_partial_rows as $8tj43$layout_get_visible_recs_without_partial_rows, layout_get_total_rec_amount_for_row as $8tj43$layout_get_total_rec_amount_for_row, layout_media_query_header as $8tj43$layout_media_query_header, report as $8tj43$report, slider_fading_factory as $8tj43$slider_fading_factory, Amazing_Slider as $8tj43$Amazing_Slider, slider_snap_css as $8tj43$slider_snap_css, observer as $8tj43$observer, javascript_media_query as $8tj43$javascript_media_query, queueMacroTask as $8tj43$queueMacroTask, findMostFrequentItem as $8tj43$findMostFrequentItem, standard_price_format as $8tj43$standard_price_format, instant_exec_on_suspect_history_change as $8tj43$instant_exec_on_suspect_history_change, deparallelize_no_drop as $8tj43$deparallelize_no_drop, ContainedImage as $8tj43$ContainedImage, buildThresholdList as $8tj43$buildThresholdList, make_asyncIterable_exiter as $8tj43$make_asyncIterable_exiter, href_change_ipns as $8tj43$href_change_ipns, base64_encode_unicode as $8tj43$base64_encode_unicode, base64_decode_unicode as $8tj43$base64_decode_unicode, use_href_accessor as $8tj43$use_href_accessor, get_session_id as $8tj43$get_session_id, add_version_query_params as $8tj43$add_version_query_params, hex_to_rgb as $8tj43$hex_to_rgb, relative_luminance_from_rgb as $8tj43$relative_luminance_from_rgb, snakeCasifyObject as $8tj43$snakeCasifyObject, make_url_with_query_params as $8tj43$make_url_with_query_params, sort_obj as $8tj43$sort_obj, insert_surfaces as $8tj43$insert_surfaces, is_debug as $8tj43$is_debug } from "@depict-ai/utilishared/ES10";
-import { isServer as $8tj43$isServer, createComponent as $8tj43$createComponent, insert as $8tj43$insert, template as $8tj43$template, getNextElement as $8tj43$getNextElement, mergeProps as $8tj43$mergeProps, effect as $8tj43$effect, className as $8tj43$className, spread as $8tj43$spread, runHydrationEvents as $8tj43$runHydrationEvents, addEventListener as $8tj43$addEventListener, memo as $8tj43$memo, delegateEvents as $8tj43$delegateEvents, getNextMarker as $8tj43$getNextMarker, classList as $8tj43$classList, setAttribute as $8tj43$setAttribute, use as $8tj43$use, style as $8tj43$style, setProperty as $8tj43$setProperty, Dynamic as $8tj43$Dynamic } from "solid-js/web";
-import { createContext as $8tj43$createContext, createSignal as $8tj43$createSignal, createMemo as $8tj43$createMemo, createEffect as $8tj43$createEffect, onCleanup as $8tj43$onCleanup, untrack as $8tj43$untrack, useContext as $8tj43$useContext, For as $8tj43$For, getOwner as $8tj43$getOwner, createResource as $8tj43$createResource, runWithOwner as $8tj43$runWithOwner, Show as $8tj43$Show, mergeProps as $8tj43$mergeProps1, Suspense as $8tj43$Suspense, createRenderEffect as $8tj43$createRenderEffect, Index as $8tj43$Index, createRoot as $8tj43$createRoot, createUniqueId as $8tj43$createUniqueId, createComputed as $8tj43$createComputed, ErrorBoundary as $8tj43$ErrorBoundary, splitProps as $8tj43$splitProps, on as $8tj43$on, batch as $8tj43$batch, createSelector as $8tj43$createSelector, children as $8tj43$children, createReaction as $8tj43$createReaction, mapArray as $8tj43$mapArray } from "solid-js";
+import { add_to_version_info as $8tj43$add_to_version_info, slider_fading_factory as $8tj43$slider_fading_factory, Amazing_Slider as $8tj43$Amazing_Slider, slider_snap_css as $8tj43$slider_snap_css, catchify as $8tj43$catchify, dlog as $8tj43$dlog, camelCasifyObject as $8tj43$camelCasifyObject, useExpandingContainer as $8tj43$useExpandingContainer, fetch_retry as $8tj43$fetch_retry, base_url as $8tj43$base_url, dwarn as $8tj43$dwarn, slider_fractional_factory as $8tj43$slider_fractional_factory, make_random_classname as $8tj43$make_random_classname, n_col_styling_with_dist as $8tj43$n_col_styling_with_dist, layout_get_visible_recs_without_partial_rows as $8tj43$layout_get_visible_recs_without_partial_rows, layout_get_total_rec_amount_for_row as $8tj43$layout_get_total_rec_amount_for_row, layout_media_query_header as $8tj43$layout_media_query_header, report as $8tj43$report, observer as $8tj43$observer, javascript_media_query as $8tj43$javascript_media_query, queueMacroTask as $8tj43$queueMacroTask, findMostFrequentItem as $8tj43$findMostFrequentItem, standard_price_format as $8tj43$standard_price_format, instant_exec_on_suspect_history_change as $8tj43$instant_exec_on_suspect_history_change, deparallelize_no_drop as $8tj43$deparallelize_no_drop, ContainedImage as $8tj43$ContainedImage, buildThresholdList as $8tj43$buildThresholdList, make_asyncIterable_exiter as $8tj43$make_asyncIterable_exiter, href_change_ipns as $8tj43$href_change_ipns, base64_encode_unicode as $8tj43$base64_encode_unicode, base64_decode_unicode as $8tj43$base64_decode_unicode, use_href_accessor as $8tj43$use_href_accessor, get_session_id as $8tj43$get_session_id, add_version_query_params as $8tj43$add_version_query_params, hex_to_rgb as $8tj43$hex_to_rgb, relative_luminance_from_rgb as $8tj43$relative_luminance_from_rgb, snakeCasifyObject as $8tj43$snakeCasifyObject, make_url_with_query_params as $8tj43$make_url_with_query_params, sort_obj as $8tj43$sort_obj, insert_surfaces as $8tj43$insert_surfaces, is_debug as $8tj43$is_debug } from "@depict-ai/utilishared/ES10";
+import { createSignal as $8tj43$createSignal, onCleanup as $8tj43$onCleanup, createContext as $8tj43$createContext, createEffect as $8tj43$createEffect, Show as $8tj43$Show, useContext as $8tj43$useContext, createMemo as $8tj43$createMemo, untrack as $8tj43$untrack, For as $8tj43$For, getOwner as $8tj43$getOwner, createResource as $8tj43$createResource, runWithOwner as $8tj43$runWithOwner, mergeProps as $8tj43$mergeProps1, Suspense as $8tj43$Suspense, createRenderEffect as $8tj43$createRenderEffect, Index as $8tj43$Index, createRoot as $8tj43$createRoot, createUniqueId as $8tj43$createUniqueId, createComputed as $8tj43$createComputed, ErrorBoundary as $8tj43$ErrorBoundary, splitProps as $8tj43$splitProps, on as $8tj43$on, batch as $8tj43$batch, createSelector as $8tj43$createSelector, children as $8tj43$children, createReaction as $8tj43$createReaction, mapArray as $8tj43$mapArray } from "solid-js";
+import { template as $8tj43$template, getNextElement as $8tj43$getNextElement, insert as $8tj43$insert, createComponent as $8tj43$createComponent, isServer as $8tj43$isServer, effect as $8tj43$effect, setAttribute as $8tj43$setAttribute, mergeProps as $8tj43$mergeProps, className as $8tj43$className, spread as $8tj43$spread, runHydrationEvents as $8tj43$runHydrationEvents, addEventListener as $8tj43$addEventListener, memo as $8tj43$memo, delegateEvents as $8tj43$delegateEvents, getNextMarker as $8tj43$getNextMarker, classList as $8tj43$classList, use as $8tj43$use, style as $8tj43$style, setProperty as $8tj43$setProperty, Dynamic as $8tj43$Dynamic } from "solid-js/web";
 import $8tj43$babelruntimehelpersdefineProperty from "@babel/runtime/helpers/defineProperty";
 import { ListenableSet as $8tj43$ListenableSet, catchify as $8tj43$catchify1, use_href_accessor as $8tj43$use_href_accessor1, queueMacroTask as $8tj43$queueMacroTask1, report as $8tj43$report1 } from "@depict-ai/utilishared/ES10";
 import $8tj43$babelruntimehelpersclassPrivateFieldSet from "@babel/runtime/helpers/classPrivateFieldSet";
@@ -10,7 +10,116 @@ import { createStore as $8tj43$createStore, reconcile as $8tj43$reconcile } from
 /*! Depict.ai search and product listing SDK */
 import { register_es_version } from "../multi_import_deduplicator.mjs";
 register_es_version("ui", "ES10");
-const $8db9a15135765c11$export$83d89fbfd8236492 = "4.7.21";
+const $8db9a15135765c11$export$83d89fbfd8236492 = "4.7.23";
+function $a35e6f680c5bbc60$export$54299a3c81f5425() {
+  const d = document;
+  const [isVisible, setIsVisible] = $8tj43$createSignal(d.visibilityState !== "hidden");
+  const handleVisibilityChange = () => setIsVisible(d.visibilityState !== "hidden");
+  d.addEventListener("visibilitychange", handleVisibilityChange);
+  $8tj43$onCleanup(() => d.removeEventListener("visibilitychange", handleVisibilityChange));
+  return isVisible;
+}
+var $ca6ab5f08bd28bca$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 14 26"><path d="M2 24.656c-.078 0-.156-.016-.234-.047s-.133-.066-.187-.129c-.117-.117-.176-.258-.176-.422s.059-.305.176-.422l10.371-10.371L1.578 2.883c-.117-.117-.176-.258-.176-.422s.059-.305.176-.422.258-.176.422-.176.305.059.422.176l10.805 10.793a.59.59 0 0 1 .176.434c0 .172-.059.305-.176.422L2.422 24.48a.42.42 0 0 1-.199.129.54.54 0 0 1-.223.047zm0 0"fill=#0f0f0f>`);
+function $ca6ab5f08bd28bca$export$8be2714ec7f169ee() {
+  let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return (() => {
+    var _el$ = $8tj43$getNextElement($ca6ab5f08bd28bca$var$_tmpl$);
+    $8tj43$effect(_p$ => {
+      var _props$width_, _props$height_;
+      var _v$ = (_props$width_ = props.width_) !== null && _props$width_ !== void 0 ? _props$width_ : 14,
+        _v$2 = (_props$height_ = props.height_) !== null && _props$height_ !== void 0 ? _props$height_ : 26;
+      _v$ !== _p$.e && $8tj43$setAttribute(_el$, "width", _p$.e = _v$);
+      _v$2 !== _p$.t && $8tj43$setAttribute(_el$, "height", _p$.t = _v$2);
+      return _p$;
+    }, {
+      e: undefined,
+      t: undefined
+    });
+    return _el$;
+  })();
+}
+var $002f09d00aac50b2$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<div>`),
+  $002f09d00aac50b2$var$_tmpl$2 = /*#__PURE__*/$8tj43$template(`<div class="depict-slider depict"><button aria-label="Scroll left"class="left d-navbutton"type=button></button><button aria-label="Scroll right"class="right d-navbutton"type=button></button><div class=sliding>`);
+const $002f09d00aac50b2$var$SlidableContext = /*@__PURE__*/$8tj43$createContext();
+function $002f09d00aac50b2$export$6649caad96ef8870(props) {
+  const {
+    slider_ref_: slider_ref_,
+    faded_opacity_ = 0.7,
+    mutation_plugins_ = [],
+    disable_fading_: disable_fading_,
+    snapAlign_: snapAlign_,
+    fadingThreshold_ = 0.96
+  } = props;
+  const [hasHydrated, setHasHydrated] = $8tj43$createSignal(false);
+  $8tj43$createEffect(() => setHasHydrated(true));
+  const MakeButton = () => (() => {
+    var _el$ = $8tj43$getNextElement($002f09d00aac50b2$var$_tmpl$);
+    $8tj43$insert(_el$, $8tj43$createComponent((0, $ca6ab5f08bd28bca$export$8be2714ec7f169ee), {
+      get height_() {
+        return props.arrow_height_;
+      },
+      get width_() {
+        return props.arrow_width_;
+      }
+    }));
+    return _el$;
+  })();
+  // To support SSR it would be very hard to make Amazing_Slider compatible with solid's SSR because it would have to be rewritten in a more JSX way
+  // However, all it would do on the server (when used by SlidableItems) is creating the following 5 div elements
+  // Therefore, we just bail on the server (and first render on the client which is the hydration) and return a static version of the slider
+  // Once we have hydrated, we construct and insert the actual slider
+  return $8tj43$createComponent((0, $8tj43$Show), {
+    get when() {
+      return hasHydrated() && !(0, $8tj43$isServer);
+    },
+    get fallback() {
+      return (() => {
+        var _el$2 = $8tj43$getNextElement($002f09d00aac50b2$var$_tmpl$2),
+          _el$3 = _el$2.firstChild,
+          _el$4 = _el$3.nextSibling,
+          _el$5 = _el$4.nextSibling;
+        $8tj43$insert(_el$3, $8tj43$createComponent(MakeButton, {}));
+        $8tj43$insert(_el$4, $8tj43$createComponent(MakeButton, {}));
+        $8tj43$insert(_el$5, () => props.children);
+        return _el$2;
+      })();
+    },
+    get children() {
+      return (() => {
+        const [intersectionEntries_, setIntersectionEntries] = $8tj43$createSignal([]);
+        const fading_plugin = disable_fading_ ? undefined : $8tj43$slider_fading_factory({
+          threshold_: fadingThreshold_,
+          faded_opacity_: faded_opacity_
+        });
+        const slider = new (0, $8tj43$Amazing_Slider)({
+          button_contents: {
+            left: [MakeButton()],
+            right: [MakeButton()]
+          },
+          constructor_plugins: [$8tj43$slider_snap_css(0, {
+            align: snapAlign_
+          }).constructor_plugin, ...(fading_plugin ? [fading_plugin.constructor_plugin] : [])],
+          mutation_plugins: [...(fading_plugin ? [fading_plugin.mutation_plugin_] : []), ...mutation_plugins_, entries => setIntersectionEntries(entries)]
+        });
+        $8tj43$insert(slider.insert_here, () => $8tj43$createComponent($002f09d00aac50b2$var$SlidableContext.Provider, {
+          value: {
+            slider_: slider,
+            intersectionEntries_: intersectionEntries_
+          },
+          get children() {
+            return props.children;
+          }
+        }));
+        $8tj43$onCleanup(() => slider.observer.disconnect());
+        slider_ref_ === null || slider_ref_ === void 0 || slider_ref_(slider);
+        return slider.container;
+      })();
+    }
+  });
+}
+function $002f09d00aac50b2$export$eaa625fb39439e37() {
+  return $8tj43$useContext($002f09d00aac50b2$var$SlidableContext);
+}
 
 /**
  * Gets product_id (the thing we key the rendering on) from a display
@@ -730,107 +839,6 @@ function $63f1f8dbcd07d3b0$export$445d8d3f5f706a40(props, container_element) {
   return [container_element, $8tj43$memo(view_more_button_container), $8tj43$memo(view_less_button_container), style_element];
 }
 $8tj43$delegateEvents(["click"]);
-var $ca6ab5f08bd28bca$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 14 26"><path d="M2 24.656c-.078 0-.156-.016-.234-.047s-.133-.066-.187-.129c-.117-.117-.176-.258-.176-.422s.059-.305.176-.422l10.371-10.371L1.578 2.883c-.117-.117-.176-.258-.176-.422s.059-.305.176-.422.258-.176.422-.176.305.059.422.176l10.805 10.793a.59.59 0 0 1 .176.434c0 .172-.059.305-.176.422L2.422 24.48a.42.42 0 0 1-.199.129.54.54 0 0 1-.223.047zm0 0"fill=#0f0f0f>`);
-function $ca6ab5f08bd28bca$export$8be2714ec7f169ee() {
-  let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  return (() => {
-    var _el$ = $8tj43$getNextElement($ca6ab5f08bd28bca$var$_tmpl$);
-    $8tj43$effect(_p$ => {
-      var _props$width_, _props$height_;
-      var _v$ = (_props$width_ = props.width_) !== null && _props$width_ !== void 0 ? _props$width_ : 14,
-        _v$2 = (_props$height_ = props.height_) !== null && _props$height_ !== void 0 ? _props$height_ : 26;
-      _v$ !== _p$.e && $8tj43$setAttribute(_el$, "width", _p$.e = _v$);
-      _v$2 !== _p$.t && $8tj43$setAttribute(_el$, "height", _p$.t = _v$2);
-      return _p$;
-    }, {
-      e: undefined,
-      t: undefined
-    });
-    return _el$;
-  })();
-}
-var $002f09d00aac50b2$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<div>`),
-  $002f09d00aac50b2$var$_tmpl$2 = /*#__PURE__*/$8tj43$template(`<div class="depict-slider depict"><button aria-label="Scroll left"class="left d-navbutton"type=button></button><button aria-label="Scroll right"class="right d-navbutton"type=button></button><div class=sliding>`);
-const $002f09d00aac50b2$var$SlidableContext = /*@__PURE__*/$8tj43$createContext();
-function $002f09d00aac50b2$export$6649caad96ef8870(props) {
-  const {
-    slider_ref_: slider_ref_,
-    faded_opacity_ = 0.7,
-    mutation_plugins_ = [],
-    disable_fading_: disable_fading_,
-    snapAlign_: snapAlign_,
-    fadingThreshold_ = 0.96
-  } = props;
-  const [hasHydrated, setHasHydrated] = $8tj43$createSignal(false);
-  $8tj43$createEffect(() => setHasHydrated(true));
-  const MakeButton = () => (() => {
-    var _el$ = $8tj43$getNextElement($002f09d00aac50b2$var$_tmpl$);
-    $8tj43$insert(_el$, $8tj43$createComponent((0, $ca6ab5f08bd28bca$export$8be2714ec7f169ee), {
-      get height_() {
-        return props.arrow_height_;
-      },
-      get width_() {
-        return props.arrow_width_;
-      }
-    }));
-    return _el$;
-  })();
-  // To support SSR it would be very hard to make Amazing_Slider compatible with solid's SSR because it would have to be rewritten in a more JSX way
-  // However, all it would do on the server (when used by SlidableItems) is creating the following 5 div elements
-  // Therefore, we just bail on the server (and first render on the client which is the hydration) and return a static version of the slider
-  // Once we have hydrated, we construct and insert the actual slider
-  return $8tj43$createComponent((0, $8tj43$Show), {
-    get when() {
-      return hasHydrated() && !(0, $8tj43$isServer);
-    },
-    get fallback() {
-      return (() => {
-        var _el$2 = $8tj43$getNextElement($002f09d00aac50b2$var$_tmpl$2),
-          _el$3 = _el$2.firstChild,
-          _el$4 = _el$3.nextSibling,
-          _el$5 = _el$4.nextSibling;
-        $8tj43$insert(_el$3, $8tj43$createComponent(MakeButton, {}));
-        $8tj43$insert(_el$4, $8tj43$createComponent(MakeButton, {}));
-        $8tj43$insert(_el$5, () => props.children);
-        return _el$2;
-      })();
-    },
-    get children() {
-      return (() => {
-        const [intersectionEntries_, setIntersectionEntries] = $8tj43$createSignal([]);
-        const fading_plugin = disable_fading_ ? undefined : $8tj43$slider_fading_factory({
-          threshold_: fadingThreshold_,
-          faded_opacity_: faded_opacity_
-        });
-        const slider = new (0, $8tj43$Amazing_Slider)({
-          button_contents: {
-            left: [MakeButton()],
-            right: [MakeButton()]
-          },
-          constructor_plugins: [$8tj43$slider_snap_css(0, {
-            align: snapAlign_
-          }).constructor_plugin, ...(fading_plugin ? [fading_plugin.constructor_plugin] : [])],
-          mutation_plugins: [...(fading_plugin ? [fading_plugin.mutation_plugin_] : []), ...mutation_plugins_, entries => setIntersectionEntries(entries)]
-        });
-        $8tj43$insert(slider.insert_here, () => $8tj43$createComponent($002f09d00aac50b2$var$SlidableContext.Provider, {
-          value: {
-            slider_: slider,
-            intersectionEntries_: intersectionEntries_
-          },
-          get children() {
-            return props.children;
-          }
-        }));
-        $8tj43$onCleanup(() => slider.observer.disconnect());
-        slider_ref_ === null || slider_ref_ === void 0 || slider_ref_(slider);
-        return slider.container;
-      })();
-    }
-  });
-}
-function $002f09d00aac50b2$export$eaa625fb39439e37() {
-  return $8tj43$useContext($002f09d00aac50b2$var$SlidableContext);
-}
 var $39ddb986053fb759$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<h2 class=recs-title>`);
 function $39ddb986053fb759$export$d41d19e89346fa2(_ref) {
   let {
@@ -1640,17 +1648,17 @@ function $0c5b1686f971e5e7$export$b73ed90f0ee50dc3(_ref) {
     return _el$;
   })();
 }
-var $72017ebd8b9df947$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<div style=position:absolute;width:10px;height:10px;overflow:hidden>`);
-let $72017ebd8b9df947$var$cachedValue;
-async function $72017ebd8b9df947$export$7b9a0e99f0aeb2f3() {
-  if ($72017ebd8b9df947$var$cachedValue != undefined) return $72017ebd8b9df947$var$cachedValue;
-  return $72017ebd8b9df947$var$cachedValue = $72017ebd8b9df947$var$checkIfIsAffectedByChromeBug326498383();
+var $c4103af154850e50$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<div style=position:absolute;width:10px;height:10px;overflow:hidden>`);
+let $c4103af154850e50$var$cachedValue;
+async function $c4103af154850e50$export$7b9a0e99f0aeb2f3() {
+  if ($c4103af154850e50$var$cachedValue != undefined) return $c4103af154850e50$var$cachedValue;
+  return $c4103af154850e50$var$cachedValue = $c4103af154850e50$var$checkIfIsAffectedByChromeBug326498383();
 }
-async function $72017ebd8b9df947$var$checkIfIsAffectedByChromeBug326498383() {
+async function $c4103af154850e50$var$checkIfIsAffectedByChromeBug326498383() {
   let isAffected = true;
   let resolveTimeoutPromise;
   try {
-    const div = $8tj43$getNextElement($72017ebd8b9df947$var$_tmpl$);
+    const div = $8tj43$getNextElement($c4103af154850e50$var$_tmpl$);
     const waitAFrame = () => new Promise(r => requestAnimationFrame(() => requestAnimationFrame(r)));
     const timeoutPromise = new Promise(r => {
       resolveTimeoutPromise = r;
@@ -1663,7 +1671,7 @@ async function $72017ebd8b9df947$var$checkIfIsAffectedByChromeBug326498383() {
       style: style
     } = div;
     // Just to get a long string
-    div.append($72017ebd8b9df947$export$7b9a0e99f0aeb2f3 + "");
+    div.append($c4103af154850e50$export$7b9a0e99f0aeb2f3 + "");
     document.documentElement.append(div);
     style.overflow = "auto";
     await waitAFrame();
@@ -1711,7 +1719,7 @@ function $4089a7972a508539$export$ebf0b1d4f90c09ae(_ref) {
   const textFadeInAnimationRunning = $8tj43$createSignal(false);
   const [getSecondPartAnimationRunning] = textFadeInAnimationRunning;
   const [userWantsExpanded, setUserWantsExpanded] = userWantsExpandedSignal_;
-  $72017ebd8b9df947$export$7b9a0e99f0aeb2f3().then(is => isAffectedByChromeBug = is);
+  $c4103af154850e50$export$7b9a0e99f0aeb2f3().then(is => isAffectedByChromeBug = is);
   return $8tj43$createComponent((0, $5441862cd2f5e111$export$e68cff63f76bd15b), {
     get children() {
       return $8tj43$createComponent((0, $8tj43$Show), {
@@ -16281,4 +16289,4 @@ function $8821a19349c36651$export$e2bf8ce7779e827e(props) {
   }, "Entire CategoryPage failed");
 }
 $8tj43$add_to_version_info("ui", (0, $8db9a15135765c11$export$83d89fbfd8236492));
-export { $618bd53ea0a41cd4$export$80bb7300ce6a8be3 as useProductCardIsVisible, $618bd53ea0a41cd4$export$f223d69ed12f5fb7 as CurrentlyIntersectingContext, $8e8b179489080711$export$5bad61ecde080b1f as useExpandingContainerReactive, $bb34cd283e904784$export$2c9f9bf2092486aa as LooksSliderOrGrid, $697d8713dc82b9ab$export$44809a8a3e867e30 as LookCard, $ac571292d606f30b$export$7e1297a3a19f10d8 as PseudoRouter, $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, $98688279b9059f50$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, $74777e8fe65b3dcb$export$240ecf5363d76c0f as ExtraSentryContextProvider, $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, $63f1f8dbcd07d3b0$export$445d8d3f5f706a40 as SolidLayoutWithProvidedElement, $d5f1e6a0f9117286$export$79b1565500412d9b as general_modal_abstraction, $9783d437ad61594c$export$3b621d86b1566b2 as CrossIcon, $ca6ab5f08bd28bca$export$8be2714ec7f169ee as GenericSliderArrowButton, $50aebf5b445518eb$export$58e808b1db15d3bc as fetchDepictRecommendations, $fa332ea03168857c$export$b91cec6bdc6b32a1 as CategoryTitle, $702d7656a373973e$export$824dde41348efed1 as embedded_num_products, $160ea2b55d8772d2$export$c1a6b039e689a58e as get_listings, $f5f54892fd0c7d9f$export$f34314aa9505732e as DepictCategory, $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, $62a8813a51fbd22f$export$5b7c3ce0ebe51f86 as BreadCrumbs, $62a8813a51fbd22f$export$de035477d6fef996 as QuickLinks, $8821a19349c36651$export$e2bf8ce7779e827e as CategoryPage };
+export { $a35e6f680c5bbc60$export$54299a3c81f5425 as useVisibilityState, $002f09d00aac50b2$export$eaa625fb39439e37 as useSlidableInformation, $618bd53ea0a41cd4$export$80bb7300ce6a8be3 as useProductCardIsVisible, $618bd53ea0a41cd4$export$f223d69ed12f5fb7 as CurrentlyIntersectingContext, $8e8b179489080711$export$5bad61ecde080b1f as useExpandingContainerReactive, $bb34cd283e904784$export$2c9f9bf2092486aa as LooksSliderOrGrid, $697d8713dc82b9ab$export$44809a8a3e867e30 as LookCard, $ac571292d606f30b$export$7e1297a3a19f10d8 as PseudoRouter, $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, $98688279b9059f50$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, $74777e8fe65b3dcb$export$240ecf5363d76c0f as ExtraSentryContextProvider, $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, $63f1f8dbcd07d3b0$export$445d8d3f5f706a40 as SolidLayoutWithProvidedElement, $d5f1e6a0f9117286$export$79b1565500412d9b as general_modal_abstraction, $9783d437ad61594c$export$3b621d86b1566b2 as CrossIcon, $ca6ab5f08bd28bca$export$8be2714ec7f169ee as GenericSliderArrowButton, $50aebf5b445518eb$export$58e808b1db15d3bc as fetchDepictRecommendations, $fa332ea03168857c$export$b91cec6bdc6b32a1 as CategoryTitle, $702d7656a373973e$export$824dde41348efed1 as embedded_num_products, $160ea2b55d8772d2$export$c1a6b039e689a58e as get_listings, $f5f54892fd0c7d9f$export$f34314aa9505732e as DepictCategory, $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, $62a8813a51fbd22f$export$5b7c3ce0ebe51f86 as BreadCrumbs, $62a8813a51fbd22f$export$de035477d6fef996 as QuickLinks, $8821a19349c36651$export$e2bf8ce7779e827e as CategoryPage };

package/latest/index.cjs

@@ -1,6 +1,6 @@
 var $gVhhF$depictaiutilishared = require("@depict-ai/utilishared/latest");
-var $gVhhF$solidjsweb = require("solid-js/web");
 var $gVhhF$solidjs = require("solid-js");
+var $gVhhF$solidjsweb = require("solid-js/web");
 var $gVhhF$depictaiutilisharedlatest = require("@depict-ai/utilishared/latest");
 var $gVhhF$solidjsstore = require("solid-js/store");
 require("../multi_import_deduplicator.cjs").register_es_version("ui", "latest");
@@ -12,6 +12,8 @@ function $parcel$export(e, n, v, s) {
     configurable: true
   });
 }
+$parcel$export(module.exports, "useVisibilityState", () => $55cbacb79d3e0cea$export$54299a3c81f5425);
+$parcel$export(module.exports, "useSlidableInformation", () => $a0e53f99354809d9$export$eaa625fb39439e37);
 $parcel$export(module.exports, "useProductCardIsVisible", () => $67155e1aeb7073f6$export$80bb7300ce6a8be3);
 $parcel$export(module.exports, "CurrentlyIntersectingContext", () => $67155e1aeb7073f6$export$f223d69ed12f5fb7);
 $parcel$export(module.exports, "useExpandingContainerReactive", () => $4b455f60dadde8b8$export$5bad61ecde080b1f);
@@ -101,7 +103,114 @@ $parcel$export(module.exports, "BreadCrumbs", () => $1f4925833f07df29$export$5b7
 $parcel$export(module.exports, "QuickLinks", () => $1f4925833f07df29$export$de035477d6fef996);
 $parcel$export(module.exports, "CategoryPage", () => $14f289047713d67a$export$e2bf8ce7779e827e);
 /*! Depict.ai search and product listing SDK */
-const $b757f75811f3261f$export$83d89fbfd8236492 = "4.7.21";
+const $b757f75811f3261f$export$83d89fbfd8236492 = "4.7.23";
+function $55cbacb79d3e0cea$export$54299a3c81f5425() {
+  const d = document;
+  const [isVisible, setIsVisible] = $gVhhF$solidjs.createSignal(d.visibilityState !== "hidden");
+  const handleVisibilityChange = () => setIsVisible(d.visibilityState !== "hidden");
+  d.addEventListener("visibilitychange", handleVisibilityChange);
+  $gVhhF$solidjs.onCleanup(() => d.removeEventListener("visibilitychange", handleVisibilityChange));
+  return isVisible;
+}
+var $0f313083912e447a$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.template(`<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 14 26"><path d="M2 24.656c-.078 0-.156-.016-.234-.047s-.133-.066-.187-.129c-.117-.117-.176-.258-.176-.422s.059-.305.176-.422l10.371-10.371L1.578 2.883c-.117-.117-.176-.258-.176-.422s.059-.305.176-.422.258-.176.422-.176.305.059.422.176l10.805 10.793a.59.59 0 0 1 .176.434c0 .172-.059.305-.176.422L2.422 24.48a.42.42 0 0 1-.199.129.54.54 0 0 1-.223.047zm0 0"fill=#0f0f0f>`);
+function $0f313083912e447a$export$8be2714ec7f169ee(props = {}) {
+  return (() => {
+    var _el$ = $gVhhF$solidjsweb.getNextElement($0f313083912e447a$var$_tmpl$);
+    $gVhhF$solidjsweb.effect(_p$ => {
+      var _v$ = props.width_ ?? 14,
+        _v$2 = props.height_ ?? 26;
+      _v$ !== _p$.e && $gVhhF$solidjsweb.setAttribute(_el$, "width", _p$.e = _v$);
+      _v$2 !== _p$.t && $gVhhF$solidjsweb.setAttribute(_el$, "height", _p$.t = _v$2);
+      return _p$;
+    }, {
+      e: undefined,
+      t: undefined
+    });
+    return _el$;
+  })();
+}
+var $a0e53f99354809d9$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div>`),
+  $a0e53f99354809d9$var$_tmpl$2 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class="depict-slider depict"><button aria-label="Scroll left"class="left d-navbutton"type=button></button><button aria-label="Scroll right"class="right d-navbutton"type=button></button><div class=sliding>`);
+const $a0e53f99354809d9$var$SlidableContext = /*@__PURE__*/$gVhhF$solidjs.createContext();
+function $a0e53f99354809d9$export$6649caad96ef8870(props) {
+  const {
+    slider_ref_: slider_ref_,
+    faded_opacity_ = 0.7,
+    mutation_plugins_ = [],
+    disable_fading_: disable_fading_,
+    snapAlign_: snapAlign_,
+    fadingThreshold_ = 0.96
+  } = props;
+  const [hasHydrated, setHasHydrated] = $gVhhF$solidjs.createSignal(false);
+  $gVhhF$solidjs.createEffect(() => setHasHydrated(true));
+  const MakeButton = () => (() => {
+    var _el$ = $gVhhF$solidjsweb.getNextElement($a0e53f99354809d9$var$_tmpl$);
+    $gVhhF$solidjsweb.insert(_el$, $gVhhF$solidjsweb.createComponent((0, $0f313083912e447a$export$8be2714ec7f169ee), {
+      get height_() {
+        return props.arrow_height_;
+      },
+      get width_() {
+        return props.arrow_width_;
+      }
+    }));
+    return _el$;
+  })();
+  // To support SSR it would be very hard to make Amazing_Slider compatible with solid's SSR because it would have to be rewritten in a more JSX way
+  // However, all it would do on the server (when used by SlidableItems) is creating the following 5 div elements
+  // Therefore, we just bail on the server (and first render on the client which is the hydration) and return a static version of the slider
+  // Once we have hydrated, we construct and insert the actual slider
+  return $gVhhF$solidjsweb.createComponent((0, $gVhhF$solidjs.Show), {
+    get when() {
+      return hasHydrated() && !(0, $gVhhF$solidjsweb.isServer);
+    },
+    get fallback() {
+      return (() => {
+        var _el$2 = $gVhhF$solidjsweb.getNextElement($a0e53f99354809d9$var$_tmpl$2),
+          _el$3 = _el$2.firstChild,
+          _el$4 = _el$3.nextSibling,
+          _el$5 = _el$4.nextSibling;
+        $gVhhF$solidjsweb.insert(_el$3, $gVhhF$solidjsweb.createComponent(MakeButton, {}));
+        $gVhhF$solidjsweb.insert(_el$4, $gVhhF$solidjsweb.createComponent(MakeButton, {}));
+        $gVhhF$solidjsweb.insert(_el$5, () => props.children);
+        return _el$2;
+      })();
+    },
+    get children() {
+      return (() => {
+        const [intersectionEntries_, setIntersectionEntries] = $gVhhF$solidjs.createSignal([]);
+        const fading_plugin = disable_fading_ ? undefined : $gVhhF$depictaiutilishared.slider_fading_factory({
+          threshold_: fadingThreshold_,
+          faded_opacity_: faded_opacity_
+        });
+        const slider = new (0, $gVhhF$depictaiutilishared.Amazing_Slider)({
+          button_contents: {
+            left: [MakeButton()],
+            right: [MakeButton()]
+          },
+          constructor_plugins: [$gVhhF$depictaiutilishared.slider_snap_css(0, {
+            align: snapAlign_
+          }).constructor_plugin, ...(fading_plugin ? [fading_plugin.constructor_plugin] : [])],
+          mutation_plugins: [...(fading_plugin ? [fading_plugin.mutation_plugin_] : []), ...mutation_plugins_, entries => setIntersectionEntries(entries)]
+        });
+        $gVhhF$solidjsweb.insert(slider.insert_here, () => $gVhhF$solidjsweb.createComponent($a0e53f99354809d9$var$SlidableContext.Provider, {
+          value: {
+            slider_: slider,
+            intersectionEntries_: intersectionEntries_
+          },
+          get children() {
+            return props.children;
+          }
+        }));
+        $gVhhF$solidjs.onCleanup(() => slider.observer.disconnect());
+        slider_ref_?.(slider);
+        return slider.container;
+      })();
+    }
+  });
+}
+function $a0e53f99354809d9$export$eaa625fb39439e37() {
+  return $gVhhF$solidjs.useContext($a0e53f99354809d9$var$SlidableContext);
+}
 
 /**
  * Gets product_id (the thing we key the rendering on) from a display
@@ -784,105 +893,6 @@ function $f48d0fbb00835aaa$export$445d8d3f5f706a40(props, container_element, ins
   return [container_element, $gVhhF$solidjsweb.memo(view_more_button_container), $gVhhF$solidjsweb.memo(view_less_button_container), style_element];
 }
 $gVhhF$solidjsweb.delegateEvents(["click"]);
-var $0f313083912e447a$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.template(`<svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 14 26"><path d="M2 24.656c-.078 0-.156-.016-.234-.047s-.133-.066-.187-.129c-.117-.117-.176-.258-.176-.422s.059-.305.176-.422l10.371-10.371L1.578 2.883c-.117-.117-.176-.258-.176-.422s.059-.305.176-.422.258-.176.422-.176.305.059.422.176l10.805 10.793a.59.59 0 0 1 .176.434c0 .172-.059.305-.176.422L2.422 24.48a.42.42 0 0 1-.199.129.54.54 0 0 1-.223.047zm0 0"fill=#0f0f0f>`);
-function $0f313083912e447a$export$8be2714ec7f169ee(props = {}) {
-  return (() => {
-    var _el$ = $gVhhF$solidjsweb.getNextElement($0f313083912e447a$var$_tmpl$);
-    $gVhhF$solidjsweb.effect(_p$ => {
-      var _v$ = props.width_ ?? 14,
-        _v$2 = props.height_ ?? 26;
-      _v$ !== _p$.e && $gVhhF$solidjsweb.setAttribute(_el$, "width", _p$.e = _v$);
-      _v$2 !== _p$.t && $gVhhF$solidjsweb.setAttribute(_el$, "height", _p$.t = _v$2);
-      return _p$;
-    }, {
-      e: undefined,
-      t: undefined
-    });
-    return _el$;
-  })();
-}
-var $a0e53f99354809d9$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div>`),
-  $a0e53f99354809d9$var$_tmpl$2 = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div class="depict-slider depict"><button aria-label="Scroll left"class="left d-navbutton"type=button></button><button aria-label="Scroll right"class="right d-navbutton"type=button></button><div class=sliding>`);
-const $a0e53f99354809d9$var$SlidableContext = /*@__PURE__*/$gVhhF$solidjs.createContext();
-function $a0e53f99354809d9$export$6649caad96ef8870(props) {
-  const {
-    slider_ref_: slider_ref_,
-    faded_opacity_ = 0.7,
-    mutation_plugins_ = [],
-    disable_fading_: disable_fading_,
-    snapAlign_: snapAlign_,
-    fadingThreshold_ = 0.96
-  } = props;
-  const [hasHydrated, setHasHydrated] = $gVhhF$solidjs.createSignal(false);
-  $gVhhF$solidjs.createEffect(() => setHasHydrated(true));
-  const MakeButton = () => (() => {
-    var _el$ = $gVhhF$solidjsweb.getNextElement($a0e53f99354809d9$var$_tmpl$);
-    $gVhhF$solidjsweb.insert(_el$, $gVhhF$solidjsweb.createComponent((0, $0f313083912e447a$export$8be2714ec7f169ee), {
-      get height_() {
-        return props.arrow_height_;
-      },
-      get width_() {
-        return props.arrow_width_;
-      }
-    }));
-    return _el$;
-  })();
-  // To support SSR it would be very hard to make Amazing_Slider compatible with solid's SSR because it would have to be rewritten in a more JSX way
-  // However, all it would do on the server (when used by SlidableItems) is creating the following 5 div elements
-  // Therefore, we just bail on the server (and first render on the client which is the hydration) and return a static version of the slider
-  // Once we have hydrated, we construct and insert the actual slider
-  return $gVhhF$solidjsweb.createComponent((0, $gVhhF$solidjs.Show), {
-    get when() {
-      return hasHydrated() && !(0, $gVhhF$solidjsweb.isServer);
-    },
-    get fallback() {
-      return (() => {
-        var _el$2 = $gVhhF$solidjsweb.getNextElement($a0e53f99354809d9$var$_tmpl$2),
-          _el$3 = _el$2.firstChild,
-          _el$4 = _el$3.nextSibling,
-          _el$5 = _el$4.nextSibling;
-        $gVhhF$solidjsweb.insert(_el$3, $gVhhF$solidjsweb.createComponent(MakeButton, {}));
-        $gVhhF$solidjsweb.insert(_el$4, $gVhhF$solidjsweb.createComponent(MakeButton, {}));
-        $gVhhF$solidjsweb.insert(_el$5, () => props.children);
-        return _el$2;
-      })();
-    },
-    get children() {
-      return (() => {
-        const [intersectionEntries_, setIntersectionEntries] = $gVhhF$solidjs.createSignal([]);
-        const fading_plugin = disable_fading_ ? undefined : $gVhhF$depictaiutilishared.slider_fading_factory({
-          threshold_: fadingThreshold_,
-          faded_opacity_: faded_opacity_
-        });
-        const slider = new (0, $gVhhF$depictaiutilishared.Amazing_Slider)({
-          button_contents: {
-            left: [MakeButton()],
-            right: [MakeButton()]
-          },
-          constructor_plugins: [$gVhhF$depictaiutilishared.slider_snap_css(0, {
-            align: snapAlign_
-          }).constructor_plugin, ...(fading_plugin ? [fading_plugin.constructor_plugin] : [])],
-          mutation_plugins: [...(fading_plugin ? [fading_plugin.mutation_plugin_] : []), ...mutation_plugins_, entries => setIntersectionEntries(entries)]
-        });
-        $gVhhF$solidjsweb.insert(slider.insert_here, () => $gVhhF$solidjsweb.createComponent($a0e53f99354809d9$var$SlidableContext.Provider, {
-          value: {
-            slider_: slider,
-            intersectionEntries_: intersectionEntries_
-          },
-          get children() {
-            return props.children;
-          }
-        }));
-        $gVhhF$solidjs.onCleanup(() => slider.observer.disconnect());
-        slider_ref_?.(slider);
-        return slider.container;
-      })();
-    }
-  });
-}
-function $a0e53f99354809d9$export$eaa625fb39439e37() {
-  return $gVhhF$solidjs.useContext($a0e53f99354809d9$var$SlidableContext);
-}
 var $363ce4d1d71041aa$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.template(`<h2 class=recs-title>`);
 function $363ce4d1d71041aa$export$d41d19e89346fa2({
   recommendations_resource_: recommendations_resource_,
@@ -1654,17 +1664,17 @@ function $1ae437d7d388a66e$export$b73ed90f0ee50dc3({
     return _el$;
   })();
 }
-var $b9e830d616d01b31$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div style=position:absolute;width:10px;height:10px;overflow:hidden>`);
-let $b9e830d616d01b31$var$cachedValue;
-async function $b9e830d616d01b31$export$7b9a0e99f0aeb2f3() {
-  if ($b9e830d616d01b31$var$cachedValue != undefined) return $b9e830d616d01b31$var$cachedValue;
-  return $b9e830d616d01b31$var$cachedValue = $b9e830d616d01b31$var$checkIfIsAffectedByChromeBug326498383();
+var $4f38102efa525ee0$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div style=position:absolute;width:10px;height:10px;overflow:hidden>`);
+let $4f38102efa525ee0$var$cachedValue;
+async function $4f38102efa525ee0$export$7b9a0e99f0aeb2f3() {
+  if ($4f38102efa525ee0$var$cachedValue != undefined) return $4f38102efa525ee0$var$cachedValue;
+  return $4f38102efa525ee0$var$cachedValue = $4f38102efa525ee0$var$checkIfIsAffectedByChromeBug326498383();
 }
-async function $b9e830d616d01b31$var$checkIfIsAffectedByChromeBug326498383() {
+async function $4f38102efa525ee0$var$checkIfIsAffectedByChromeBug326498383() {
   let isAffected = true;
   let resolveTimeoutPromise;
   try {
-    const div = $gVhhF$solidjsweb.getNextElement($b9e830d616d01b31$var$_tmpl$);
+    const div = $gVhhF$solidjsweb.getNextElement($4f38102efa525ee0$var$_tmpl$);
     const waitAFrame = () => new Promise(r => requestAnimationFrame(() => requestAnimationFrame(r)));
     const timeoutPromise = new Promise(r => {
       resolveTimeoutPromise = r;
@@ -1677,7 +1687,7 @@ async function $b9e830d616d01b31$var$checkIfIsAffectedByChromeBug326498383() {
       style: style
     } = div;
     // Just to get a long string
-    div.append($b9e830d616d01b31$export$7b9a0e99f0aeb2f3 + "");
+    div.append($4f38102efa525ee0$export$7b9a0e99f0aeb2f3 + "");
     document.documentElement.append(div);
     style.overflow = "auto";
     await waitAFrame();
@@ -1724,7 +1734,7 @@ function $905010a06f9aeae5$export$ebf0b1d4f90c09ae({
   const textFadeInAnimationRunning = $gVhhF$solidjs.createSignal(false);
   const [getSecondPartAnimationRunning] = textFadeInAnimationRunning;
   const [userWantsExpanded, setUserWantsExpanded] = userWantsExpandedSignal_;
-  $b9e830d616d01b31$export$7b9a0e99f0aeb2f3().then(is => isAffectedByChromeBug = is);
+  $4f38102efa525ee0$export$7b9a0e99f0aeb2f3().then(is => isAffectedByChromeBug = is);
   return $gVhhF$solidjsweb.createComponent((0, $84798aaa863a4909$export$e68cff63f76bd15b), {
     get children() {
       return $gVhhF$solidjsweb.createComponent((0, $gVhhF$solidjs.Show), {