@depict-ai/ui 4.7.19 → 4.7.20

package/ES10/index.cjs

@@ -106,7 +106,7 @@ $parcel$export(module.exports, "BreadCrumbs", () => $335c02c1241a9ca8$export$5b7
 $parcel$export(module.exports, "QuickLinks", () => $335c02c1241a9ca8$export$de035477d6fef996);
 $parcel$export(module.exports, "CategoryPage", () => $c10e33c4681f8c9b$export$e2bf8ce7779e827e);
 /*! Depict.ai search and product listing SDK */
-const $aa1938dec50d6c12$export$83d89fbfd8236492 = "4.7.19";
+const $aa1938dec50d6c12$export$83d89fbfd8236492 = "4.7.20";
 
 /**
  * Gets product_id (the thing we key the rendering on) from a display
@@ -514,13 +514,15 @@ function $8edd3cf30d1fd8b4$export$a2cc176055f8f08() {
     t: "<!-- ".concat(text, " -->")
   } : document.createComment(text);
 }
-let $e3915574cfd3466c$var$cached_placeholder_element;
-let $e3915574cfd3466c$var$rendering_cached_placeholder_element;
+const $e3915574cfd3466c$var$defaultCacheKey = /*@__PURE__*/Symbol();
+const $e3915574cfd3466c$var$cachedPlaceholderElements = {};
+const $e3915574cfd3466c$var$renderingCachedPlaceholderElement = {};
 function $e3915574cfd3466c$export$f33414a4df0afd3f(_ref) {
   let {
     product_card_template_: product_card_template_,
     num_placeholders_: num_placeholders_,
-    content_blocks_: content_blocks_
+    content_blocks_: content_blocks_,
+    placeholderCacheKey_: placeholderCacheKey_
   } = _ref;
   const [num_to_actually_show, set_num_to_actually_show] = $52FdA$solidjs.createSignal($52FdA$solidjs.untrack(num_placeholders_));
   if (0, $52FdA$solidjsweb.isServer)
@@ -557,7 +559,8 @@ function $e3915574cfd3466c$export$f33414a4df0afd3f(_ref) {
       });
       // Show content block before product card, so it's *at* that index
       return [possible_content_block, $e3915574cfd3466c$var$Placeholder({
-        product_card_template_: product_card_template_
+        product_card_template_: product_card_template_,
+        placeholderCacheKey_: placeholderCacheKey_
       })]; // https://github.com/solidjs/solid/releases/tag/v1.7.0
     }
   });
@@ -567,23 +570,25 @@ function $e3915574cfd3466c$export$f33414a4df0afd3f(_ref) {
  */
 function $e3915574cfd3466c$var$Placeholder(_ref2) {
   let {
-    product_card_template_: product_card_template_
+    product_card_template_: product_card_template_,
+    placeholderCacheKey_ = $e3915574cfd3466c$var$defaultCacheKey
   } = _ref2;
   const get_cloned_placeholders = function () {
-    let element_to_clone = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : $e3915574cfd3466c$var$cached_placeholder_element;
+    let element_to_clone = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : $e3915574cfd3466c$var$cachedPlaceholderElements[placeholderCacheKey_];
     return Array.isArray(element_to_clone) ? element_to_clone.map(el => el instanceof Node ? el.cloneNode(true) : el) : element_to_clone;
   };
-  if ($e3915574cfd3466c$var$cached_placeholder_element) return get_cloned_placeholders();
+  if ($e3915574cfd3466c$var$cachedPlaceholderElements[placeholderCacheKey_]) return get_cloned_placeholders();
   let dispose_original_copy;
   const get_unwrapped_element = $52FdA$solidjs.createRoot(dispose => {
     dispose_original_copy = dispose;
     // if product_card_template_ is async and rejects the resource will take care of throwing upwards here in the solid-js error handling system
     const [resource] = $52FdA$solidjs.createResource(() => {
-      if ($e3915574cfd3466c$var$rendering_cached_placeholder_element) return $e3915574cfd3466c$var$rendering_cached_placeholder_element;
+      const rendering_cached_placeholder_element = $e3915574cfd3466c$var$renderingCachedPlaceholderElement[placeholderCacheKey_];
+      if (rendering_cached_placeholder_element) return rendering_cached_placeholder_element;
       const return_value = product_card_template_(null, undefined);
       if (typeof return_value === "object" && typeof (return_value === null || return_value === void 0 ? void 0 : return_value.then) === "function")
         // Is Promise or promise-like object
-        $e3915574cfd3466c$var$rendering_cached_placeholder_element = return_value;
+        $e3915574cfd3466c$var$renderingCachedPlaceholderElement[placeholderCacheKey_] = return_value;
       return return_value;
     });
     return $52FdA$solidjs.createMemo(() => {
@@ -592,14 +597,14 @@ function $e3915574cfd3466c$var$Placeholder(_ref2) {
     });
   });
   $52FdA$solidjs.onCleanup(() => {
-    if ($e3915574cfd3466c$var$rendering_cached_placeholder_element) {
-      var _rendering_cached_pla;
+    const rendering = $e3915574cfd3466c$var$renderingCachedPlaceholderElement[placeholderCacheKey_];
+    if (rendering) {
       // If we're still rendering in our separate root, let the rendering finish or other <Placeholder> components waiting for it might get an incomplete result
       const unset_current_rendering = () => {
         dispose_original_copy();
-        $e3915574cfd3466c$var$rendering_cached_placeholder_element = undefined;
+        $e3915574cfd3466c$var$renderingCachedPlaceholderElement[placeholderCacheKey_] = undefined;
       };
-      (_rendering_cached_pla = $e3915574cfd3466c$var$rendering_cached_placeholder_element) === null || _rendering_cached_pla === void 0 || _rendering_cached_pla.then(unset_current_rendering, unset_current_rendering);
+      rendering === null || rendering === void 0 || rendering.then(unset_current_rendering, unset_current_rendering);
     } else
       // Otherwise, just make sure we've disposed our root
       dispose_original_copy();
@@ -611,8 +616,8 @@ function $e3915574cfd3466c$var$Placeholder(_ref2) {
       return;
     // placeholders have finished rendering, freeze the elements
     // here we might receive the result of a promise that has already been received, tore down and put into cached_placeholder_element, so don't overwrite that more valid result if it's already set
-    $e3915574cfd3466c$var$cached_placeholder_element || ($e3915574cfd3466c$var$cached_placeholder_element = get_cloned_placeholders(unwrapped_array)); // Clone initial return value so that who gave us the elements can't mutate them, which has caused issues before with react
-    $e3915574cfd3466c$var$rendering_cached_placeholder_element = undefined;
+    $e3915574cfd3466c$var$cachedPlaceholderElements[placeholderCacheKey_] || ($e3915574cfd3466c$var$cachedPlaceholderElements[placeholderCacheKey_] = get_cloned_placeholders(unwrapped_array)); // Clone initial return value so that who gave us the elements can't mutate them, which has caused issues before with react
+    $e3915574cfd3466c$var$renderingCachedPlaceholderElement[placeholderCacheKey_] = undefined;
     dispose_original_copy(); // So that this memo will never re-run and the placeholder rendering function can clean up
     return get_cloned_placeholders(); // clone, just in case. If we wouldn't, someone could modify the copy in the DOM, and it would affect the cached version
   });
@@ -929,7 +934,8 @@ function $236a257ee52e5414$export$d41d19e89346fa2(_ref) {
     product_card_template_: product_card_template_,
     layout_options_: layout_options_,
     title_: title_,
-    NoResultsFallback_: NoResultsFallback_
+    NoResultsFallback_: NoResultsFallback_,
+    placeholderCacheKey_: placeholderCacheKey_
   } = _ref;
   const is_showing_something = $52FdA$solidjs.createMemo(() => {
     var _recommendations_reso;
@@ -970,7 +976,8 @@ function $236a257ee52e5414$export$d41d19e89346fa2(_ref) {
         get fallback() {
           return $e3915574cfd3466c$export$f33414a4df0afd3f({
             num_placeholders_: num_placeholders_,
-            product_card_template_: product_card_template_
+            product_card_template_: product_card_template_,
+            placeholderCacheKey_: placeholderCacheKey_
           });
         },
         get children() {
@@ -1970,7 +1977,6 @@ function $47e3c3102c78121b$export$44809a8a3e867e30(_ref) {
       ro.observe(el);
       $52FdA$solidjs.onCleanup(() => ro.disconnect());
     }, _el$);
-    _el$.classList.toggle("placeholder", !!!display_);
     $52FdA$solidjsweb.insert(_el$, $52FdA$solidjsweb.createComponent((0, $52FdA$solidjs.Show), {
       get when() {
         return display_();
@@ -2005,6 +2011,7 @@ function $47e3c3102c78121b$export$44809a8a3e867e30(_ref) {
       pseudoRouter_: pseudoRouter_,
       containerHeight_: containerHeight_
     }), _el$5, _co$2);
+    $52FdA$solidjsweb.effect(() => _el$.classList.toggle("placeholder", !display_()));
     $52FdA$solidjsweb.runHydrationEvents();
     return _el$;
   })();
@@ -2145,7 +2152,8 @@ function $2c920813c92d6987$export$7da560f849543dff(_ref) {
     title_: title_,
     max_rows_: max_rows_,
     view_more_button_: view_more_button_,
-    NoResultsFallback_: NoResultsFallback_
+    NoResultsFallback_: NoResultsFallback_,
+    placeholderCacheKey_: placeholderCacheKey_
   } = _ref;
   const rows_object_ = $52FdA$solidjs.createMemo(() => {
     var _view_more_button$row;
@@ -2204,7 +2212,8 @@ function $2c920813c92d6987$export$7da560f849543dff(_ref) {
           get fallback() {
             return $e3915574cfd3466c$export$f33414a4df0afd3f({
               num_placeholders_: num_placeholders_,
-              product_card_template_: product_card_template_
+              product_card_template_: product_card_template_,
+              placeholderCacheKey_: placeholderCacheKey_
             });
           },
           get children() {
@@ -2237,6 +2246,7 @@ function $2c920813c92d6987$export$7da560f849543dff(_ref) {
 }
 var $e57cd46536ad992e$var$_tmpl$ = /*#__PURE__*/$52FdA$solidjsweb.template(`<div style=--animation-duration:240ms>`);
 let $e57cd46536ad992e$var$expandedLooksSignal_;
+const $e57cd46536ad992e$var$placeholderCacheKey_ = /*@__PURE__*/Symbol("Looks");
 function $e57cd46536ad992e$export$2c9f9bf2092486aa(props) {
   return $d05611ff6b8c8357$export$23fca46f3143581f(() => {
     $e57cd46536ad992e$var$expandedLooksSignal_ || ($e57cd46536ad992e$var$expandedLooksSignal_ = $52FdA$solidjs.createSignal(new Set(), {
@@ -2302,7 +2312,8 @@ function $e57cd46536ad992e$export$2c9f9bf2092486aa(props) {
         cols_at_size: $5401a6698b0c0658$export$6daf8749b65a1b77(props.columnsAtSize_),
         ...grid_spacing_override()
       })),
-      NoResultsFallback_: () => props.NoResultsFallback_
+      NoResultsFallback_: () => props.NoResultsFallback_,
+      placeholderCacheKey_: $e57cd46536ad992e$var$placeholderCacheKey_
     };
     $52FdA$solidjs.createEffect(() => {
       const {

package/ES10/index.d.ts

@@ -11,7 +11,7 @@ import { GetListingRequest } from "@depict-ai/types/api/GetListingRequest";
 import { BaseSearchRequestV3 } from "@depict-ai/types/api/BaseSearchRequestV3";
 import { FeaturedInDisplay } from "@depict-ai/types/api/FeaturedInResponseV3";
 import { SearchFilter as _SearchFilter3 } from "@depict-ai/types/api/SearchRequestV2";
-export const version = "4.7.19";
+export const version = "4.7.20";
 declare const LISTING_ID = "listingId";
 declare const EXTERNAL_ID = "externalId";
 type ScrollRestorationData = {
@@ -1440,7 +1440,7 @@ type OpenModalParams<OriginalDisplay extends Display, OutputDisplay extends Mode
  * Open the modal with support for alignment.
  * @returns {void}
  */
-export const open_modal_with_alignment: <OriginalDisplay extends Display, OutputDisplay extends ModernDisplay>(openModalParams: OpenModalParams<OriginalDisplay, OutputDisplay>) => void;
+export const open_modal_with_alignment: <OriginalDisplay extends Display, OutputDisplay extends unknown>(openModalParams: OpenModalParams<OriginalDisplay, OutputDisplay>) => void;
 export function open_search_with_shift_slash(open_search: VoidFunction): () => void;
 export interface PageReplacer {
   readonly render_: () => Node_Array;
@@ -1519,5 +1519,5 @@ export function CategoryPage<OriginalDisplay extends Display, OutputDisplay exte
   content_blocks_by_row?: ContentBlocksByRow;
   layout?: PossibleLayout;
   filterModalParent_?: HTMLElement | ShadowRoot;
-}): import("@depict-ai/utilishared/latest").Node_Array;
+}): import("@depict-ai/utilishared").Node_Array;
 export type { SearchFilter } from "@depict-ai/types/api/SearchRequestV3";

package/ES10/index.js

@@ -10,7 +10,7 @@ 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.19";
+const $8db9a15135765c11$export$83d89fbfd8236492 = "4.7.20";
 
 /**
  * Gets product_id (the thing we key the rendering on) from a display
@@ -418,13 +418,15 @@ function $ca55612a53dbbdd2$export$a2cc176055f8f08() {
     t: "<!-- ".concat(text, " -->")
   } : document.createComment(text);
 }
-let $bdd80c7862246dc2$var$cached_placeholder_element;
-let $bdd80c7862246dc2$var$rendering_cached_placeholder_element;
+const $bdd80c7862246dc2$var$defaultCacheKey = /*@__PURE__*/Symbol();
+const $bdd80c7862246dc2$var$cachedPlaceholderElements = {};
+const $bdd80c7862246dc2$var$renderingCachedPlaceholderElement = {};
 function $bdd80c7862246dc2$export$f33414a4df0afd3f(_ref) {
   let {
     product_card_template_: product_card_template_,
     num_placeholders_: num_placeholders_,
-    content_blocks_: content_blocks_
+    content_blocks_: content_blocks_,
+    placeholderCacheKey_: placeholderCacheKey_
   } = _ref;
   const [num_to_actually_show, set_num_to_actually_show] = $8tj43$createSignal($8tj43$untrack(num_placeholders_));
   if (0, $8tj43$isServer)
@@ -461,7 +463,8 @@ function $bdd80c7862246dc2$export$f33414a4df0afd3f(_ref) {
       });
       // Show content block before product card, so it's *at* that index
       return [possible_content_block, $bdd80c7862246dc2$var$Placeholder({
-        product_card_template_: product_card_template_
+        product_card_template_: product_card_template_,
+        placeholderCacheKey_: placeholderCacheKey_
       })]; // https://github.com/solidjs/solid/releases/tag/v1.7.0
     }
   });
@@ -471,23 +474,25 @@ function $bdd80c7862246dc2$export$f33414a4df0afd3f(_ref) {
  */
 function $bdd80c7862246dc2$var$Placeholder(_ref2) {
   let {
-    product_card_template_: product_card_template_
+    product_card_template_: product_card_template_,
+    placeholderCacheKey_ = $bdd80c7862246dc2$var$defaultCacheKey
   } = _ref2;
   const get_cloned_placeholders = function () {
-    let element_to_clone = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : $bdd80c7862246dc2$var$cached_placeholder_element;
+    let element_to_clone = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : $bdd80c7862246dc2$var$cachedPlaceholderElements[placeholderCacheKey_];
     return Array.isArray(element_to_clone) ? element_to_clone.map(el => el instanceof Node ? el.cloneNode(true) : el) : element_to_clone;
   };
-  if ($bdd80c7862246dc2$var$cached_placeholder_element) return get_cloned_placeholders();
+  if ($bdd80c7862246dc2$var$cachedPlaceholderElements[placeholderCacheKey_]) return get_cloned_placeholders();
   let dispose_original_copy;
   const get_unwrapped_element = $8tj43$createRoot(dispose => {
     dispose_original_copy = dispose;
     // if product_card_template_ is async and rejects the resource will take care of throwing upwards here in the solid-js error handling system
     const [resource] = $8tj43$createResource(() => {
-      if ($bdd80c7862246dc2$var$rendering_cached_placeholder_element) return $bdd80c7862246dc2$var$rendering_cached_placeholder_element;
+      const rendering_cached_placeholder_element = $bdd80c7862246dc2$var$renderingCachedPlaceholderElement[placeholderCacheKey_];
+      if (rendering_cached_placeholder_element) return rendering_cached_placeholder_element;
       const return_value = product_card_template_(null, undefined);
       if (typeof return_value === "object" && typeof (return_value === null || return_value === void 0 ? void 0 : return_value.then) === "function")
         // Is Promise or promise-like object
-        $bdd80c7862246dc2$var$rendering_cached_placeholder_element = return_value;
+        $bdd80c7862246dc2$var$renderingCachedPlaceholderElement[placeholderCacheKey_] = return_value;
       return return_value;
     });
     return $8tj43$createMemo(() => {
@@ -496,14 +501,14 @@ function $bdd80c7862246dc2$var$Placeholder(_ref2) {
     });
   });
   $8tj43$onCleanup(() => {
-    if ($bdd80c7862246dc2$var$rendering_cached_placeholder_element) {
-      var _rendering_cached_pla;
+    const rendering = $bdd80c7862246dc2$var$renderingCachedPlaceholderElement[placeholderCacheKey_];
+    if (rendering) {
       // If we're still rendering in our separate root, let the rendering finish or other <Placeholder> components waiting for it might get an incomplete result
       const unset_current_rendering = () => {
         dispose_original_copy();
-        $bdd80c7862246dc2$var$rendering_cached_placeholder_element = undefined;
+        $bdd80c7862246dc2$var$renderingCachedPlaceholderElement[placeholderCacheKey_] = undefined;
       };
-      (_rendering_cached_pla = $bdd80c7862246dc2$var$rendering_cached_placeholder_element) === null || _rendering_cached_pla === void 0 || _rendering_cached_pla.then(unset_current_rendering, unset_current_rendering);
+      rendering === null || rendering === void 0 || rendering.then(unset_current_rendering, unset_current_rendering);
     } else
       // Otherwise, just make sure we've disposed our root
       dispose_original_copy();
@@ -515,8 +520,8 @@ function $bdd80c7862246dc2$var$Placeholder(_ref2) {
       return;
     // placeholders have finished rendering, freeze the elements
     // here we might receive the result of a promise that has already been received, tore down and put into cached_placeholder_element, so don't overwrite that more valid result if it's already set
-    $bdd80c7862246dc2$var$cached_placeholder_element || ($bdd80c7862246dc2$var$cached_placeholder_element = get_cloned_placeholders(unwrapped_array)); // Clone initial return value so that who gave us the elements can't mutate them, which has caused issues before with react
-    $bdd80c7862246dc2$var$rendering_cached_placeholder_element = undefined;
+    $bdd80c7862246dc2$var$cachedPlaceholderElements[placeholderCacheKey_] || ($bdd80c7862246dc2$var$cachedPlaceholderElements[placeholderCacheKey_] = get_cloned_placeholders(unwrapped_array)); // Clone initial return value so that who gave us the elements can't mutate them, which has caused issues before with react
+    $bdd80c7862246dc2$var$renderingCachedPlaceholderElement[placeholderCacheKey_] = undefined;
     dispose_original_copy(); // So that this memo will never re-run and the placeholder rendering function can clean up
     return get_cloned_placeholders(); // clone, just in case. If we wouldn't, someone could modify the copy in the DOM, and it would affect the cached version
   });
@@ -833,7 +838,8 @@ function $39ddb986053fb759$export$d41d19e89346fa2(_ref) {
     product_card_template_: product_card_template_,
     layout_options_: layout_options_,
     title_: title_,
-    NoResultsFallback_: NoResultsFallback_
+    NoResultsFallback_: NoResultsFallback_,
+    placeholderCacheKey_: placeholderCacheKey_
   } = _ref;
   const is_showing_something = $8tj43$createMemo(() => {
     var _recommendations_reso;
@@ -874,7 +880,8 @@ function $39ddb986053fb759$export$d41d19e89346fa2(_ref) {
         get fallback() {
           return $bdd80c7862246dc2$export$f33414a4df0afd3f({
             num_placeholders_: num_placeholders_,
-            product_card_template_: product_card_template_
+            product_card_template_: product_card_template_,
+            placeholderCacheKey_: placeholderCacheKey_
           });
         },
         get children() {
@@ -1874,7 +1881,6 @@ function $697d8713dc82b9ab$export$44809a8a3e867e30(_ref) {
       ro.observe(el);
       $8tj43$onCleanup(() => ro.disconnect());
     }, _el$);
-    _el$.classList.toggle("placeholder", !!!display_);
     $8tj43$insert(_el$, $8tj43$createComponent((0, $8tj43$Show), {
       get when() {
         return display_();
@@ -1909,6 +1915,7 @@ function $697d8713dc82b9ab$export$44809a8a3e867e30(_ref) {
       pseudoRouter_: pseudoRouter_,
       containerHeight_: containerHeight_
     }), _el$5, _co$2);
+    $8tj43$effect(() => _el$.classList.toggle("placeholder", !display_()));
     $8tj43$runHydrationEvents();
     return _el$;
   })();
@@ -2049,7 +2056,8 @@ function $e3efeb558d952696$export$7da560f849543dff(_ref) {
     title_: title_,
     max_rows_: max_rows_,
     view_more_button_: view_more_button_,
-    NoResultsFallback_: NoResultsFallback_
+    NoResultsFallback_: NoResultsFallback_,
+    placeholderCacheKey_: placeholderCacheKey_
   } = _ref;
   const rows_object_ = $8tj43$createMemo(() => {
     var _view_more_button$row;
@@ -2108,7 +2116,8 @@ function $e3efeb558d952696$export$7da560f849543dff(_ref) {
           get fallback() {
             return $bdd80c7862246dc2$export$f33414a4df0afd3f({
               num_placeholders_: num_placeholders_,
-              product_card_template_: product_card_template_
+              product_card_template_: product_card_template_,
+              placeholderCacheKey_: placeholderCacheKey_
             });
           },
           get children() {
@@ -2141,6 +2150,7 @@ function $e3efeb558d952696$export$7da560f849543dff(_ref) {
 }
 var $bb34cd283e904784$var$_tmpl$ = /*#__PURE__*/$8tj43$template(`<div style=--animation-duration:240ms>`);
 let $bb34cd283e904784$var$expandedLooksSignal_;
+const $bb34cd283e904784$var$placeholderCacheKey_ = /*@__PURE__*/Symbol("Looks");
 function $bb34cd283e904784$export$2c9f9bf2092486aa(props) {
   return $83e8cf2c0b87a58a$export$23fca46f3143581f(() => {
     $bb34cd283e904784$var$expandedLooksSignal_ || ($bb34cd283e904784$var$expandedLooksSignal_ = $8tj43$createSignal(new Set(), {
@@ -2206,7 +2216,8 @@ function $bb34cd283e904784$export$2c9f9bf2092486aa(props) {
         cols_at_size: $a9c7ba6087881ac2$export$6daf8749b65a1b77(props.columnsAtSize_),
         ...grid_spacing_override()
       })),
-      NoResultsFallback_: () => props.NoResultsFallback_
+      NoResultsFallback_: () => props.NoResultsFallback_,
+      placeholderCacheKey_: $bb34cd283e904784$var$placeholderCacheKey_
     };
     $8tj43$createEffect(() => {
       const {

package/latest/index.cjs

@@ -100,7 +100,7 @@ $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.19";
+const $b757f75811f3261f$export$83d89fbfd8236492 = "4.7.20";
 
 /**
  * Gets product_id (the thing we key the rendering on) from a display
@@ -496,12 +496,14 @@ function $fc23d7668ae0011d$export$a2cc176055f8f08(what = "grid") {
     t: `<!-- ${text} -->`
   } : document.createComment(text);
 }
-let $0caf87eaa19079da$var$cached_placeholder_element;
-let $0caf87eaa19079da$var$rendering_cached_placeholder_element;
+const $0caf87eaa19079da$var$defaultCacheKey = /*@__PURE__*/Symbol();
+const $0caf87eaa19079da$var$cachedPlaceholderElements = {};
+const $0caf87eaa19079da$var$renderingCachedPlaceholderElement = {};
 function $0caf87eaa19079da$export$f33414a4df0afd3f({
   product_card_template_: product_card_template_,
   num_placeholders_: num_placeholders_,
-  content_blocks_: content_blocks_
+  content_blocks_: content_blocks_,
+  placeholderCacheKey_: placeholderCacheKey_
 }) {
   const [num_to_actually_show, set_num_to_actually_show] = $gVhhF$solidjs.createSignal($gVhhF$solidjs.untrack(num_placeholders_));
   if (0, $gVhhF$solidjsweb.isServer)
@@ -535,7 +537,8 @@ function $0caf87eaa19079da$export$f33414a4df0afd3f({
       const possible_content_block = $gVhhF$solidjs.createMemo(() => content_blocks_?.()?.()?.[index]);
       // Show content block before product card, so it's *at* that index
       return [possible_content_block, $0caf87eaa19079da$var$Placeholder({
-        product_card_template_: product_card_template_
+        product_card_template_: product_card_template_,
+        placeholderCacheKey_: placeholderCacheKey_
       })]; // https://github.com/solidjs/solid/releases/tag/v1.7.0
     }
   });
@@ -544,20 +547,22 @@ function $0caf87eaa19079da$export$f33414a4df0afd3f({
  * Get one placeholder element. It will be cloned for each placeholder for ultimate performance even when solid-js isn't rendering the placeholders.
  */
 function $0caf87eaa19079da$var$Placeholder({
-  product_card_template_: product_card_template_
+  product_card_template_: product_card_template_,
+  placeholderCacheKey_ = $0caf87eaa19079da$var$defaultCacheKey
 }) {
-  const get_cloned_placeholders = (element_to_clone = $0caf87eaa19079da$var$cached_placeholder_element) => Array.isArray(element_to_clone) ? element_to_clone.map(el => el instanceof Node ? el.cloneNode(true) : el) : element_to_clone;
-  if ($0caf87eaa19079da$var$cached_placeholder_element) return get_cloned_placeholders();
+  const get_cloned_placeholders = (element_to_clone = $0caf87eaa19079da$var$cachedPlaceholderElements[placeholderCacheKey_]) => Array.isArray(element_to_clone) ? element_to_clone.map(el => el instanceof Node ? el.cloneNode(true) : el) : element_to_clone;
+  if ($0caf87eaa19079da$var$cachedPlaceholderElements[placeholderCacheKey_]) return get_cloned_placeholders();
   let dispose_original_copy;
   const get_unwrapped_element = $gVhhF$solidjs.createRoot(dispose => {
     dispose_original_copy = dispose;
     // if product_card_template_ is async and rejects the resource will take care of throwing upwards here in the solid-js error handling system
     const [resource] = $gVhhF$solidjs.createResource(() => {
-      if ($0caf87eaa19079da$var$rendering_cached_placeholder_element) return $0caf87eaa19079da$var$rendering_cached_placeholder_element;
+      const rendering_cached_placeholder_element = $0caf87eaa19079da$var$renderingCachedPlaceholderElement[placeholderCacheKey_];
+      if (rendering_cached_placeholder_element) return rendering_cached_placeholder_element;
       const return_value = product_card_template_(null, undefined);
       if (typeof return_value === "object" && typeof return_value?.then === "function")
         // Is Promise or promise-like object
-        $0caf87eaa19079da$var$rendering_cached_placeholder_element = return_value;
+        $0caf87eaa19079da$var$renderingCachedPlaceholderElement[placeholderCacheKey_] = return_value;
       return return_value;
     });
     return $gVhhF$solidjs.createMemo(() => {
@@ -566,13 +571,14 @@ function $0caf87eaa19079da$var$Placeholder({
     });
   });
   $gVhhF$solidjs.onCleanup(() => {
-    if ($0caf87eaa19079da$var$rendering_cached_placeholder_element) {
+    const rendering = $0caf87eaa19079da$var$renderingCachedPlaceholderElement[placeholderCacheKey_];
+    if (rendering) {
       // If we're still rendering in our separate root, let the rendering finish or other <Placeholder> components waiting for it might get an incomplete result
       const unset_current_rendering = () => {
         dispose_original_copy();
-        $0caf87eaa19079da$var$rendering_cached_placeholder_element = undefined;
+        $0caf87eaa19079da$var$renderingCachedPlaceholderElement[placeholderCacheKey_] = undefined;
       };
-      $0caf87eaa19079da$var$rendering_cached_placeholder_element?.then(unset_current_rendering, unset_current_rendering);
+      rendering?.then(unset_current_rendering, unset_current_rendering);
     } else
       // Otherwise, just make sure we've disposed our root
       dispose_original_copy();
@@ -584,8 +590,8 @@ function $0caf87eaa19079da$var$Placeholder({
       return;
     // placeholders have finished rendering, freeze the elements
     // here we might receive the result of a promise that has already been received, tore down and put into cached_placeholder_element, so don't overwrite that more valid result if it's already set
-    $0caf87eaa19079da$var$cached_placeholder_element ||= get_cloned_placeholders(unwrapped_array); // Clone initial return value so that who gave us the elements can't mutate them, which has caused issues before with react
-    $0caf87eaa19079da$var$rendering_cached_placeholder_element = undefined;
+    $0caf87eaa19079da$var$cachedPlaceholderElements[placeholderCacheKey_] ||= get_cloned_placeholders(unwrapped_array); // Clone initial return value so that who gave us the elements can't mutate them, which has caused issues before with react
+    $0caf87eaa19079da$var$renderingCachedPlaceholderElement[placeholderCacheKey_] = undefined;
     dispose_original_copy(); // So that this memo will never re-run and the placeholder rendering function can clean up
     return get_cloned_placeholders(); // clone, just in case. If we wouldn't, someone could modify the copy in the DOM, and it would affect the cached version
   });
@@ -882,7 +888,8 @@ function $363ce4d1d71041aa$export$d41d19e89346fa2({
   product_card_template_: product_card_template_,
   layout_options_: layout_options_,
   title_: title_,
-  NoResultsFallback_: NoResultsFallback_
+  NoResultsFallback_: NoResultsFallback_,
+  placeholderCacheKey_: placeholderCacheKey_
 }) {
   const is_showing_something = $gVhhF$solidjs.createMemo(() => recommendations_resource_.loading || recommendations_resource_()?.length);
   const title = $gVhhF$solidjs.createMemo(() => title_?.()); // In case getter/accessor creates elements, don't create them twice
@@ -920,7 +927,8 @@ function $363ce4d1d71041aa$export$d41d19e89346fa2({
         get fallback() {
           return $0caf87eaa19079da$export$f33414a4df0afd3f({
             num_placeholders_: num_placeholders_,
-            product_card_template_: product_card_template_
+            product_card_template_: product_card_template_,
+            placeholderCacheKey_: placeholderCacheKey_
           });
         },
         get children() {
@@ -1882,7 +1890,6 @@ function $ad882bbe664dbd53$export$44809a8a3e867e30({
       ro.observe(el);
       $gVhhF$solidjs.onCleanup(() => ro.disconnect());
     }, _el$);
-    _el$.classList.toggle("placeholder", !!!display_);
     $gVhhF$solidjsweb.insert(_el$, $gVhhF$solidjsweb.createComponent((0, $gVhhF$solidjs.Show), {
       get when() {
         return display_();
@@ -1913,6 +1920,7 @@ function $ad882bbe664dbd53$export$44809a8a3e867e30({
       pseudoRouter_: pseudoRouter_,
       containerHeight_: containerHeight_
     }), _el$5, _co$2);
+    $gVhhF$solidjsweb.effect(() => _el$.classList.toggle("placeholder", !display_()));
     $gVhhF$solidjsweb.runHydrationEvents();
     return _el$;
   })();
@@ -2040,7 +2048,8 @@ function $b8e79813f4f7ebe4$export$7da560f849543dff({
   title_: title_,
   max_rows_: max_rows_,
   view_more_button_: view_more_button_,
-  NoResultsFallback_: NoResultsFallback_
+  NoResultsFallback_: NoResultsFallback_,
+  placeholderCacheKey_: placeholderCacheKey_
 }) {
   const rows_object_ = $gVhhF$solidjs.createMemo(() => {
     const view_more_button = view_more_button_?.();
@@ -2095,7 +2104,8 @@ function $b8e79813f4f7ebe4$export$7da560f849543dff({
           get fallback() {
             return $0caf87eaa19079da$export$f33414a4df0afd3f({
               num_placeholders_: num_placeholders_,
-              product_card_template_: product_card_template_
+              product_card_template_: product_card_template_,
+              placeholderCacheKey_: placeholderCacheKey_
             });
           },
           get children() {
@@ -2128,6 +2138,7 @@ function $b8e79813f4f7ebe4$export$7da560f849543dff({
 }
 var $a3bbfa5fdaa39f3a$var$_tmpl$ = /*#__PURE__*/$gVhhF$solidjsweb.template(`<div style=--animation-duration:240ms>`);
 let $a3bbfa5fdaa39f3a$var$expandedLooksSignal_;
+const $a3bbfa5fdaa39f3a$var$placeholderCacheKey_ = /*@__PURE__*/Symbol("Looks");
 function $a3bbfa5fdaa39f3a$export$2c9f9bf2092486aa(props) {
   return $95837413165cc2df$export$23fca46f3143581f(() => {
     $a3bbfa5fdaa39f3a$var$expandedLooksSignal_ ||= $gVhhF$solidjs.createSignal(new Set(), {
@@ -2191,7 +2202,8 @@ function $a3bbfa5fdaa39f3a$export$2c9f9bf2092486aa(props) {
         cols_at_size: $4e04be41243c3d80$export$6daf8749b65a1b77(props.columnsAtSize_),
         ...grid_spacing_override()
       })),
-      NoResultsFallback_: () => props.NoResultsFallback_
+      NoResultsFallback_: () => props.NoResultsFallback_,
+      placeholderCacheKey_: $a3bbfa5fdaa39f3a$var$placeholderCacheKey_
     };
     $gVhhF$solidjs.createEffect(() => {
       const {

package/latest/index.d.ts

@@ -11,7 +11,7 @@ import { GetListingRequest } from "@depict-ai/types/api/GetListingRequest";
 import { BaseSearchRequestV3 } from "@depict-ai/types/api/BaseSearchRequestV3";
 import { FeaturedInDisplay } from "@depict-ai/types/api/FeaturedInResponseV3";
 import { SearchFilter as _SearchFilter3 } from "@depict-ai/types/api/SearchRequestV2";
-export const version = "4.7.19";
+export const version = "4.7.20";
 declare const LISTING_ID = "listingId";
 declare const EXTERNAL_ID = "externalId";
 type ScrollRestorationData = {
@@ -1440,7 +1440,7 @@ type OpenModalParams<OriginalDisplay extends Display, OutputDisplay extends Mode
  * Open the modal with support for alignment.
  * @returns {void}
  */
-export const open_modal_with_alignment: <OriginalDisplay extends Display, OutputDisplay extends ModernDisplay>(openModalParams: OpenModalParams<OriginalDisplay, OutputDisplay>) => void;
+export const open_modal_with_alignment: <OriginalDisplay extends Display, OutputDisplay extends unknown>(openModalParams: OpenModalParams<OriginalDisplay, OutputDisplay>) => void;
 export function open_search_with_shift_slash(open_search: VoidFunction): () => void;
 export interface PageReplacer {
   readonly render_: () => Node_Array;
@@ -1519,5 +1519,5 @@ export function CategoryPage<OriginalDisplay extends Display, OutputDisplay exte
   content_blocks_by_row?: ContentBlocksByRow;
   layout?: PossibleLayout;
   filterModalParent_?: HTMLElement | ShadowRoot;
-}): import("@depict-ai/utilishared/latest").Node_Array;
+}): import("@depict-ai/utilishared").Node_Array;
 export type { SearchFilter } from "@depict-ai/types/api/SearchRequestV3";