@depict-ai/ui 4.7.31 → 4.7.33

package/ES10/index.cjs

@@ -18,6 +18,8 @@ function $parcel$export(e, n, v, s) {
 function $parcel$interopDefault(a) {
   return a && a.__esModule ? a.default : a;
 }
+$parcel$export(module.exports, "setExtraDisplayTransformers", () => $cc9aacef898ccc9a$export$f98b8d5ea7207a1);
+$parcel$export(module.exports, "getExtraDisplayTransformers", () => $cc9aacef898ccc9a$export$b2d94be4f02525b2);
 $parcel$export(module.exports, "remap_blocks_to_index", () => $f8f375d6245ffff2$export$92aa5d691d588f3f);
 $parcel$export(module.exports, "useMobileHover", () => $0deb6ff75e3d67c6$export$d4d96868197be50e);
 $parcel$export(module.exports, "useVisibilityState", () => $e7a7d2fe8a8217d8$export$54299a3c81f5425);
@@ -111,7 +113,14 @@ $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.31";
+const $aa1938dec50d6c12$export$83d89fbfd8236492 = "4.7.33";
+
+// Value first so shopify merchants can set (extra) display transformers in the shopify app
+// Calling these functions normally doesn't do anything, but our shopify app respects them
+// Them being here is value first too because this can be easily imported in the product card editor
+let $cc9aacef898ccc9a$var$extraDisplayTransformers;
+const $cc9aacef898ccc9a$export$b2d94be4f02525b2 = () => $cc9aacef898ccc9a$var$extraDisplayTransformers;
+const $cc9aacef898ccc9a$export$f98b8d5ea7207a1 = displayTransformers => $cc9aacef898ccc9a$var$extraDisplayTransformers = displayTransformers;
 function $3e17e871e9d0911d$export$d9f36cf74e24d595(media_query) {
   const signal = $52FdA$solidjs.createSignal(false);
   $52FdA$solidjs.onCleanup($52FdA$depictaiutilishared.javascript_media_query(media_query, _ref => {
@@ -485,19 +494,22 @@ function $f8f375d6245ffff2$var$wrap_blocks_in_div(rendered_content_blocks, max_s
           }
         }));
         $52FdA$solidjsweb.effect(_p$ => {
-          var _v$ = {
+          var _v$ = !!(final_span_columns() === max_span_columns()),
+            _v$2 = {
               [(0, $830518481649feb1$export$c500183c31c2b22e)]: final_span_columns()
             },
-            _v$2 = "span ".concat(final_span_columns()),
-            _v$3 = "span ".concat(final_span_rows());
-          _p$.e = $52FdA$solidjsweb.style(_el$, _v$, _p$.e);
-          _v$2 !== _p$.t && ((_p$.t = _v$2) != null ? _el$.style.setProperty("grid-column", _v$2) : _el$.style.removeProperty("grid-column"));
-          _v$3 !== _p$.a && ((_p$.a = _v$3) != null ? _el$.style.setProperty("grid-row", _v$3) : _el$.style.removeProperty("grid-row"));
+            _v$3 = "span ".concat(final_span_columns()),
+            _v$4 = "span ".concat(final_span_rows());
+          _v$ !== _p$.e && _el$.classList.toggle("spans-whole-row", _p$.e = _v$);
+          _p$.t = $52FdA$solidjsweb.style(_el$, _v$2, _p$.t);
+          _v$3 !== _p$.a && ((_p$.a = _v$3) != null ? _el$.style.setProperty("grid-column", _v$3) : _el$.style.removeProperty("grid-column"));
+          _v$4 !== _p$.o && ((_p$.o = _v$4) != null ? _el$.style.setProperty("grid-row", _v$4) : _el$.style.removeProperty("grid-row"));
           return _p$;
         }, {
           e: undefined,
           t: undefined,
-          a: undefined
+          a: undefined,
+          o: undefined
         });
         return _el$;
       }
@@ -1845,25 +1857,30 @@ function $28535bb7671c63d1$export$e4b984597b71e989(props) {
   })));
   return container;
 }
+const $f3db423dc84bc35d$var$customUrls = (url, width) => {
+  var _url$startsWith;
+  if (url !== null && url !== void 0 && (_url$startsWith = url.startsWith) !== null && _url$startsWith !== void 0 && _url$startsWith.call(url, "https://cdn.shopify.com"))
+    // The shopify image resizing CDN blocks Cloudflare's image resizer. It's possible that we can't detect shopify image URLs sometimes because they go to the merchant's domain,
+    // but it seems like the URLs returned by the Depict API always goes to the cdn.shopify.com version of an image, so this simple workaround works.
+    return $858fdcf73148519f$export$1d6267828870adda(url, width);
+  // Use cloudflare image resizer instead of img.depict.ai because it's a lot faster (and also auto-chooses other formats if webp is not supported)
+  return "https://app.depict.ai/cdn-cgi/image/width=".concat(width, ",format=auto/").concat(url);
+};
 function $f3db423dc84bc35d$export$9d4a4b669b1929ab(props) {
   return $52FdA$solidjsweb.createComponent((0, $28535bb7671c63d1$export$e4b984597b71e989), $52FdA$solidjsweb.mergeProps(props, {
     get imgProps() {
       return {
         ...props.imgProps,
-        customUrls: (url, width // Apparently don't have to encode url for CF's service
-        ) => {
-          var _url$startsWith;
-          if (url !== null && url !== void 0 && (_url$startsWith = url.startsWith) !== null && _url$startsWith !== void 0 && _url$startsWith.call(url, "https://cdn.shopify.com"))
-            // The shopify image resizing CDN blocks Cloudflare's image resizer. It's possible that we can't detect shopify image URLs sometimes because they go to the merchant's domain,
-            // but it seems like the URLs returned by the Depict API always goes to the cdn.shopify.com version of an image, so this simple workaround works.
-            return $858fdcf73148519f$export$1d6267828870adda(url, width);
-          // Use cloudflare image resizer instead of img.depict.ai because it's a lot faster (and also auto-chooses other formats if webp is not supported)
-          return "https://app.depict.ai/cdn-cgi/image/width=".concat(width, ",format=auto/").concat(url);
-        }
+        customUrls: $f3db423dc84bc35d$var$customUrls
       };
     }
   }));
 }
+function $f3db423dc84bc35d$export$140423fa4bfb6d63(props) {
+  return $52FdA$solidjsweb.createComponent((0, $858fdcf73148519f$export$6e5611bc7e57e477), $52FdA$solidjsweb.mergeProps(props, {
+    customUrls: $f3db423dc84bc35d$var$customUrls
+  }));
+}
 function $f38f2e64ebe2da86$export$a71e92cfbb498adc(props) {
   return $52FdA$solidjs.createMemo(() => {
     const price_formatting = props.price_formatting_;
@@ -11137,7 +11154,8 @@ class $9cbefc32b9dab36d$export$f34314aa9505732e {
           // Please make sure that the signal created by below line always updates AFTER selected_filters_ updates on a "popstate" event. If the filter cache is popped before the selected filters are the code in create_modified_filters() is going to re-calculate search_local_filter_cache without knowing the real value of search_selected_filters, and we'll end up with too few filters in search_local_filter_cache in some cases
           local_filter_cache: [],
           expanded_hierarchical_filters: [],
-          scroll_restoration_data: []
+          scroll_restoration_data: [],
+          history_content_blocks: []
         }),
         router_: $parcel$interopDefault($52FdA$babelruntimehelpersclassPrivateFieldGet)(this, $9cbefc32b9dab36d$var$_router),
         prefix_: "category" + unique_instance_key_for_state + "_"
@@ -15925,71 +15943,99 @@ function $c3a7faae6f2b93c9$export$7af06a63c5a976c9(el, listing_id, i18n_) {
   $52FdA$solidjs.onCleanup(disconnect);
 }
 $52FdA$solidjsweb.delegateEvents(["click"]);
-var $c19709057a32b2e7$var$_tmpl$ = /*#__PURE__*/$52FdA$solidjsweb.template(`<a><img>`),
-  $c19709057a32b2e7$var$_tmpl$2 = /*#__PURE__*/$52FdA$solidjsweb.template(`<a><video loop>`);
+var $c19709057a32b2e7$var$_tmpl$ = /*#__PURE__*/$52FdA$solidjsweb.template(`<a class=d-standard-content-wrapper><video loop class=d-standard-content>`);
 function $c19709057a32b2e7$export$780a853d15174484(_ref) {
   let {
-    contentBlock: contentBlock,
+    contentBlock_: {
+      content: {
+        link: link,
+        type: type,
+        url: mediaUrl
+      }
+    },
     router_: router_
   } = _ref;
-  if (contentBlock.content.type === "image") return () => (() => {
-    var _el$ = $52FdA$solidjsweb.getNextElement($c19709057a32b2e7$var$_tmpl$),
-      _el$2 = _el$.firstChild;
-    $52FdA$solidjsweb.addEventListener(_el$, "click", $52FdA$depictaiutilisharedlatest.catchify(ev => router_.navigate_.go_to_({
-      new_url_: contentBlock.content.link,
-      is_replace_: false,
-      event_: ev
-    })), true);
-    _el$2.style.setProperty("width", "100%");
-    _el$2.style.setProperty("height", "100%");
-    _el$2.style.setProperty("object-fit", "cover");
-    _el$2.style.setProperty("position", "absolute");
-    _el$2.style.setProperty("inset", "0");
-    $52FdA$solidjsweb.effect(_p$ => {
-      var _v$ = contentBlock.content.link,
-        _v$2 = contentBlock.content.url;
-      _v$ !== _p$.e && $52FdA$solidjsweb.setAttribute(_el$, "href", _p$.e = _v$);
-      _v$2 !== _p$.t && $52FdA$solidjsweb.setAttribute(_el$2, "src", _p$.t = _v$2);
-      return _p$;
-    }, {
-      e: undefined,
-      t: undefined
-    });
-    $52FdA$solidjsweb.runHydrationEvents();
-    return _el$;
-  })();
-  if (contentBlock.content.type === "video") return () => (() => {
-    var _el$3 = $52FdA$solidjsweb.getNextElement($c19709057a32b2e7$var$_tmpl$2),
-      _el$4 = _el$3.firstChild;
-    $52FdA$solidjsweb.addEventListener(_el$3, "click", $52FdA$depictaiutilisharedlatest.catchify(ev => router_.navigate_.go_to_({
-      new_url_: contentBlock.content.link,
-      is_replace_: false,
-      event_: ev
-    })), true);
-    $52FdA$solidjsweb.setProperty(_el$4, "controls", false);
-    $52FdA$solidjsweb.setProperty(_el$4, "muted", true);
-    $52FdA$solidjsweb.setProperty(_el$4, "autoplay", true);
-    $52FdA$solidjsweb.setProperty(_el$4, "playsinline", true);
-    _el$4.style.setProperty("width", "100%");
-    _el$4.style.setProperty("height", "100%");
-    _el$4.style.setProperty("object-fit", "cover");
-    _el$4.style.setProperty("position", "absolute");
-    _el$4.style.setProperty("inset", "0");
-    $52FdA$solidjsweb.effect(_p$ => {
-      var _v$3 = contentBlock.content.link,
-        _v$4 = contentBlock.content.url;
-      _v$3 !== _p$.e && $52FdA$solidjsweb.setAttribute(_el$3, "href", _p$.e = _v$3);
-      _v$4 !== _p$.t && $52FdA$solidjsweb.setAttribute(_el$4, "src", _p$.t = _v$4);
-      return _p$;
+  if (type === "image") {
+    const [wrapperSize, setWrapperSize] = $52FdA$solidjs.createSignal();
+    return $52FdA$solidjsweb.createComponent((0, $52FdA$solidjsweb.Dynamic), $52FdA$solidjsweb.mergeProps({
+      component: link ? "a" : "div",
+      "class": "d-standard-content-wrapper",
+      ref: el => setWrapperSize(() => $858fdcf73148519f$export$e6fffe67d4cdd848(el)),
+      get onClick() {
+        return $52FdA$depictaiutilisharedlatest.catchify(ev => link && router_.navigate_.go_to_({
+          new_url_: link,
+          is_replace_: false,
+          event_: ev
+        }));
+      }
+    }, link && {
+      href: link
     }, {
-      e: undefined,
-      t: undefined
-    });
-    $52FdA$solidjsweb.runHydrationEvents();
-    return _el$3;
-  })();
+      get children() {
+        return $52FdA$solidjsweb.createComponent((0, $f3db423dc84bc35d$export$140423fa4bfb6d63), {
+          get size() {
+            return $52FdA$solidjs.createMemo(() => {
+              var _wrapperSize;
+              return ((_wrapperSize = wrapperSize()) === null || _wrapperSize === void 0 ? void 0 : _wrapperSize()) || 0;
+            });
+          },
+          src: mediaUrl,
+          "class": "d-standard-content"
+        });
+      }
+    }));
+  }
+  if (type === "video") {
+    const pageVisible = $e7a7d2fe8a8217d8$export$54299a3c81f5425();
+    return (() => {
+      var _el$ = $52FdA$solidjsweb.getNextElement($c19709057a32b2e7$var$_tmpl$),
+        _el$2 = _el$.firstChild;
+      $52FdA$solidjsweb.addEventListener(_el$, "click", $52FdA$depictaiutilisharedlatest.catchify(ev => router_.navigate_.go_to_({
+        new_url_: link,
+        is_replace_: false,
+        event_: ev
+      })), true);
+      $52FdA$solidjsweb.setAttribute(_el$, "href", link);
+      $52FdA$solidjsweb.use(element => $52FdA$solidjs.createEffect(() => {
+        if (pageVisible()) element.play().catch(e => $52FdA$depictaiutilishared.dlog("Failed to play", e));else element.pause();
+      }), _el$2);
+      $52FdA$solidjsweb.setAttribute(_el$2, "src", mediaUrl);
+      $52FdA$solidjsweb.setProperty(_el$2, "controls", false);
+      $52FdA$solidjsweb.setProperty(_el$2, "muted", true);
+      $52FdA$solidjsweb.setProperty(_el$2, "autoplay", true);
+      $52FdA$solidjsweb.setProperty(_el$2, "playsinline", true);
+      $52FdA$solidjsweb.runHydrationEvents();
+      return _el$;
+    })();
+  }
 }
 $52FdA$solidjsweb.delegateEvents(["click"]);
+function $0c035bbe7e30b438$export$7a92d995f1bf3592(history_content_blocks_, plp_meta, content_blocks_by_row_, router_) {
+  const [historyContentBlocks, setHistoryContentBlocks] = history_content_blocks_;
+  $52FdA$solidjs.createEffect(() => {
+    var _plp_meta;
+    const serverContentBlock = (_plp_meta = plp_meta()) === null || _plp_meta === void 0 ? void 0 : _plp_meta.content_blocks;
+    if (serverContentBlock && JSON.stringify(serverContentBlock) !== JSON.stringify(historyContentBlocks())) setHistoryContentBlocks(serverContentBlock);
+  });
+  const contentBlocksByRow = $52FdA$solidjs.createMemo(() => {
+    if (content_blocks_by_row_()) return content_blocks_by_row_();
+    const content = [];
+    historyContentBlocks().forEach(row => {
+      const contentBlock = {
+        span_columns: row.span_columns,
+        span_rows: row.span_rows,
+        position: row.position,
+        content: () => $52FdA$solidjsweb.createComponent((0, $c19709057a32b2e7$export$780a853d15174484), {
+          contentBlock_: row,
+          router_: router_
+        })
+      };
+      content[row.row] = contentBlock;
+    });
+    return content;
+  });
+  return contentBlocksByRow;
+}
 var $ede6c70ecdca46fe$var$_tmpl$ = /*#__PURE__*/$52FdA$solidjsweb.template(`<div class=product-count><!$><!/> <!$><!/>`),
   $ede6c70ecdca46fe$var$_tmpl$2 = /*#__PURE__*/$52FdA$solidjsweb.template(`<div>`),
   $ede6c70ecdca46fe$var$_tmpl$3 = /*#__PURE__*/$52FdA$solidjsweb.template(`<div class=filter-results-for-one-row><!$><!/><!$><!/>`),
@@ -16018,6 +16064,7 @@ function $ede6c70ecdca46fe$export$f7d2f673fc2f091d(_ref) {
     show_breadcrumbs_: show_breadcrumbs_,
     layout_options_: layout_options_,
     scroll_restoration_data_: scroll_restoration_data_,
+    history_content_blocks_: history_content_blocks_,
     product_card_template_: product_card_template_,
     sideways_filter_clearing_flag_: sideways_filter_clearing_flag_,
     sorting_query_param_: sorting_query_param_,
@@ -16086,24 +16133,7 @@ function $ede6c70ecdca46fe$export$f7d2f673fc2f091d(_ref) {
   }));
   // Make "Get Listing" request to get quicklinks, breadcrumbs, title, etc
   const [plp_meta] = $52FdA$solidjs.createResource(meta_query_base, $52FdA$depictaiutilisharedlatest.catchify(query => depict_api_.get_listing(query)));
-  const contentBlocksByRow = $52FdA$solidjs.createMemo(() => {
-    var _plp_meta, _plp_meta$content_blo;
-    if (content_blocks_by_row_()) return content_blocks_by_row_();
-    const content = [];
-    (_plp_meta = plp_meta()) === null || _plp_meta === void 0 || (_plp_meta$content_blo = _plp_meta.content_blocks) === null || _plp_meta$content_blo === void 0 || _plp_meta$content_blo.forEach(row => {
-      const contentBlock = {
-        span_columns: row.span_columns,
-        span_rows: row.span_rows,
-        position: row.position,
-        content: $c19709057a32b2e7$export$780a853d15174484({
-          contentBlock: row,
-          router_: router_
-        })
-      };
-      content[row.row] = contentBlock;
-    });
-    return content;
-  });
+  const contentBlocksByRow = $0c035bbe7e30b438$export$7a92d995f1bf3592(history_content_blocks_, plp_meta, content_blocks_by_row_, router_);
   const available_sortings_ = $52FdA$solidjs.createMemo(() => {
     var _plp_products_, _plp_products_$sorts;
     return (_plp_products_ = plp_products_()) === null || _plp_products_ === void 0 ? void 0 : (_plp_products_$sorts = _plp_products_.sorts) === null || _plp_products_$sorts === void 0 ? void 0 : _plp_products_$sorts.map(sort => {
@@ -16119,13 +16149,13 @@ function $ede6c70ecdca46fe$export$f7d2f673fc2f091d(_ref) {
     return (_plp_products_2 = plp_products_()) === null || _plp_products_2 === void 0 ? void 0 : _plp_products_2.filters;
   });
   const title = $52FdA$solidjs.createMemo(() => {
-    var _plp_meta2;
-    return (_plp_meta2 = plp_meta()) === null || _plp_meta2 === void 0 ? void 0 : _plp_meta2.title;
+    var _plp_meta;
+    return (_plp_meta = plp_meta()) === null || _plp_meta === void 0 ? void 0 : _plp_meta.title;
   });
   const crumb_data_ = $ede6c70ecdca46fe$var$add_us_to_crumbs(plp_meta);
   const quicklinks_data_ = $52FdA$solidjs.createMemo(() => {
-    var _plp_meta3;
-    return (_plp_meta3 = plp_meta()) === null || _plp_meta3 === void 0 ? void 0 : _plp_meta3.quick_links;
+    var _plp_meta2;
+    return (_plp_meta2 = plp_meta()) === null || _plp_meta2 === void 0 ? void 0 : _plp_meta2.quick_links;
   });
   const [sort_or_filter_open_, set_sort_or_filter_open_] = $52FdA$solidjs.createSignal(false);
   const [desktop_filter_elements_, set_desktop_filter_elements] = $52FdA$solidjs.createSignal();
@@ -16437,8 +16467,8 @@ function $ede6c70ecdca46fe$export$f7d2f673fc2f091d(_ref) {
 function $ede6c70ecdca46fe$var$add_us_to_crumbs(plp_meta) {
   const href_accessor = $52FdA$depictaiutilisharedlatest.use_href_accessor();
   return $52FdA$solidjs.createMemo(() => {
-    var _plp_meta4;
-    const api_value = (_plp_meta4 = plp_meta()) === null || _plp_meta4 === void 0 ? void 0 : _plp_meta4.breadcrumbs;
+    var _plp_meta3;
+    const api_value = (_plp_meta3 = plp_meta()) === null || _plp_meta3 === void 0 ? void 0 : _plp_meta3.breadcrumbs;
     if (!api_value) return api_value;
     return [...api_value, $52FdA$solidjs.mergeProps(plp_meta(), {
       get page_url() {
@@ -16488,7 +16518,8 @@ function $c10e33c4681f8c9b$export$e2bf8ce7779e827e(props) {
       sorting_open: category_sorting_open_,
       expanded_filters: expanded_filters_,
       expanded_hierarchical_filters: expanded_hierarchical_filters_,
-      scroll_restoration_data: scroll_restoration_data_
+      scroll_restoration_data: scroll_restoration_data_,
+      history_content_blocks: history_content_blocks_
     } = depict_category.historyStateSignals_;
     const {
       current_sorting_: current_sorting_,
@@ -16540,6 +16571,7 @@ function $c10e33c4681f8c9b$export$e2bf8ce7779e827e(props) {
       sideways_filter_clearing_flag_: sideways_filter_clearing_flag_,
       content_blocks_by_row_: () => props.content_blocks_by_row,
       scroll_restoration_data_: scroll_restoration_data_,
+      history_content_blocks_: history_content_blocks_,
       layout_options_: $52FdA$solidjs.createMemo(() => ({
         cols_at_size: $5401a6698b0c0658$export$6daf8749b65a1b77(props.cols_at_size),
         ...grid_spacing_override(),

package/ES10/index.d.ts

@@ -1,9 +1,9 @@
-import { JSX, Accessor, Setter, Signal } from "solid-js";
-import { report, Amazing_Slider, Display, useExpandingContainer, ColsAtSize, Elem, ModernDisplay, Node_Array } from "@depict-ai/utilishared/ES10";
-import { SearchFilter, SearchRequestV3, SortModel } from "@depict-ai/types/api/SearchRequestV3";
+import { Display, ModernDisplay, report, Amazing_Slider, useExpandingContainer, ColsAtSize, Elem, Node_Array } from "@depict-ai/utilishared/ES10";
 import { ContentLink, SearchResponse, SearchFilter as _SearchFilter1 } from "@depict-ai/types/api/SearchResponse";
 import { Ancestors, ListingSuggestion, SearchSuggestionsResponseV3 } from "@depict-ai/types/api/SearchSuggestionsResponseV3";
-import { ProductListing, GetListingResponse } from "@depict-ai/types/api/GetListingResponse";
+import { ProductListing, GetListingResponse, ContentBlock as _ContentBlock1 } from "@depict-ai/types/api/GetListingResponse";
+import { JSX, Accessor, Setter, Signal } from "solid-js";
+import { SearchFilter, SearchRequestV3, SortModel } from "@depict-ai/types/api/SearchRequestV3";
 import { ProductListingResponseV3, SearchFilter as _SearchFilter2 } from "@depict-ai/types/api/ProductListingResponseV3";
 import { SearchSuggestionsRequestV3 } from "@depict-ai/types/api/SearchSuggestionsRequestV3";
 import { ProductListingRequestV3 } from "@depict-ai/types/api/ProductListingRequestV3";
@@ -11,7 +11,61 @@ 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.31";
+export const version = "4.7.33";
+type DisplayTransformerAlwaysThereData = {
+  merchant: string;
+  market: string;
+  locale: string;
+};
+type CanBePromiseWrapped<T> = T | Promise<T>;
+export type ModernDisplayWithPageUrl<T extends ModernDisplay> = { [K in keyof T]: K extends "variant_displays" ? (T[K][number] & {
+  page_url: string;
+})[] : T[K] };
+/**
+ * A ProductListing with ancestors added in, this is what we pass to the display transformers as the ancestors might be required to construct the URL
+ */
+type ProductListingWithAncestors = ProductListing & {
+  ancestors: Ancestors;
+};
+/**
+ * The displayTransformer for categories does not only get a list of ListingSuggestions, when a search query has listing suggestions, but also their ancestors since we show breadcrumbs for the listing suggestions. To let the user differentiate (since the suggestion ones can be added/removed but not the ancestors) we add a boolean is_suggestion to the listing suggestions passed to the displayTransformer.
+ */
+type ListingSuggestionForTransformer = (ListingSuggestion & {
+  is_suggestion: true;
+}) | (Omit<ListingSuggestion, "suggestions_result_id"> & {
+  is_suggestion: false;
+});
+/**
+ * DisplayTransformers supersede pageURLCreator
+ * DisplayTransformers are functions that take in a list of categories, content search results or products and then can transform or enrich the data for each category, content search result or product card in a batched way.
+ */
+export type DisplayTransformers<InputDisplay extends ModernDisplay, OutputDisplay extends ModernDisplay | never> = {
+  products?: (options: DisplayTransformerAlwaysThereData & {
+    displays: InputDisplay[];
+  }) => CanBePromiseWrapped<OutputDisplay extends ModernDisplay ? ModernDisplayWithPageUrl<OutputDisplay>[] : never>;
+  categories?: <T extends ProductListingWithAncestors | ListingSuggestionForTransformer>(options: DisplayTransformerAlwaysThereData & {
+    data: T[];
+  }) => CanBePromiseWrapped<(T & {
+    page_url: string;
+  })[]>;
+  contentResults?: (options: DisplayTransformerAlwaysThereData & {
+    data: ContentLink[];
+  }) => CanBePromiseWrapped<ContentLink[]>;
+};
+export type SomethingTakingADisplayTransformers<InputDisplay extends Display, OutputDisplay extends ModernDisplay | never> = InputDisplay extends ModernDisplay ? "page_url" extends keyof InputDisplay["variant_displays"][number] ? {
+  display_transformers: DisplayTransformers<InputDisplay, OutputDisplay>;
+} : {
+  display_transformers: DisplayTransformers<InputDisplay, OutputDisplay>;
+} : {
+  page_url_creator?: never;
+  display_transformers?: never;
+};
+export const getExtraDisplayTransformers: () => DisplayTransformers<any, any> | undefined;
+/**
+ *
+ * @param displayTransformers
+ */
+export const setExtraDisplayTransformers: <InputDisplay extends ModernDisplay, OutputDisplay extends ModernDisplay = ModernDisplayWithPageUrl<InputDisplay>>(displayTransformers: DisplayTransformers<InputDisplay, OutputDisplay>) => DisplayTransformers<InputDisplay, OutputDisplay>;
 /**
  * Use `javascript_media_query` but return a reactive accessor instead of taking a callback function
  */
@@ -108,10 +162,10 @@ export function remap_blocks_to_index<T = () => JSX.Element | Promise<JSX.Elemen
   })[];
   n_cols_currently_showing_: number | null;
 }): {
-  content_blocks_by_index_: JSX.Element[];
+  content_blocks_by_index_: (Awaited<T> | T[])[];
   readonly displaced_products_?: undefined;
 } | {
-  readonly content_blocks_by_index_: JSX.Element[];
+  readonly content_blocks_by_index_: (Awaited<T> | T[])[];
   readonly displaced_products_: (number | (true | undefined)[])[];
 };
 /**
@@ -434,54 +488,6 @@ export function SolidFormatPrice(props: {
     places_after_comma_: number | "auto";
   };
 }): JSX.Element;
-type DisplayTransformerAlwaysThereData = {
-  merchant: string;
-  market: string;
-  locale: string;
-};
-type CanBePromiseWrapped<T> = T | Promise<T>;
-export type ModernDisplayWithPageUrl<T extends ModernDisplay> = { [K in keyof T]: K extends "variant_displays" ? (T[K][number] & {
-  page_url: string;
-})[] : T[K] };
-/**
- * A ProductListing with ancestors added in, this is what we pass to the display transformers as the ancestors might be required to construct the URL
- */
-type ProductListingWithAncestors = ProductListing & {
-  ancestors: Ancestors;
-};
-/**
- * The displayTransformer for categories does not only get a list of ListingSuggestions, when a search query has listing suggestions, but also their ancestors since we show breadcrumbs for the listing suggestions. To let the user differentiate (since the suggestion ones can be added/removed but not the ancestors) we add a boolean is_suggestion to the listing suggestions passed to the displayTransformer.
- */
-type ListingSuggestionForTransformer = (ListingSuggestion & {
-  is_suggestion: true;
-}) | (Omit<ListingSuggestion, "suggestions_result_id"> & {
-  is_suggestion: false;
-});
-/**
- * DisplayTransformers supersede pageURLCreator
- * DisplayTransformers are functions that take in a list of categories, content search results or products and then can transform or enrich the data for each category, content search result or product card in a batched way.
- */
-export type DisplayTransformers<InputDisplay extends ModernDisplay, OutputDisplay extends ModernDisplay | never> = {
-  products?: (options: DisplayTransformerAlwaysThereData & {
-    displays: InputDisplay[];
-  }) => CanBePromiseWrapped<OutputDisplay extends ModernDisplay ? ModernDisplayWithPageUrl<OutputDisplay>[] : never>;
-  categories?: <T extends ProductListingWithAncestors | ListingSuggestionForTransformer>(options: DisplayTransformerAlwaysThereData & {
-    data: T[];
-  }) => CanBePromiseWrapped<(T & {
-    page_url: string;
-  })[]>;
-  contentResults?: (options: DisplayTransformerAlwaysThereData & {
-    data: ContentLink[];
-  }) => CanBePromiseWrapped<ContentLink[]>;
-};
-export type SomethingTakingADisplayTransformers<InputDisplay extends Display, OutputDisplay extends ModernDisplay | never> = InputDisplay extends ModernDisplay ? "page_url" extends keyof InputDisplay["variant_displays"][number] ? {
-  display_transformers: DisplayTransformers<InputDisplay, OutputDisplay>;
-} : {
-  display_transformers: DisplayTransformers<InputDisplay, OutputDisplay>;
-} : {
-  page_url_creator?: never;
-  display_transformers?: never;
-};
 type ListingSuggestionAfterURLCreator = { [K in keyof ListingSuggestion]: K extends "ancestors" ? (ListingSuggestion & {
   page_url: string;
 })[] : ListingSuggestion[K] } & {
@@ -1334,6 +1340,7 @@ export class DepictCategory<InputDisplay extends Display, OutputDisplay extends
       expanded_: boolean;
     }[]>;
     scroll_restoration_data: Signal<ScrollRestorationData>;
+    history_content_blocks: Signal<_ContentBlock1[]>;
   };
   /**
    * Signal representing the currently selected filters. Will update to always reflect the state of the current URL. Calling the setter triggers a navigation (replaceState) to an updated URL.
@@ -1484,7 +1491,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 unknown>(openModalParams: OpenModalParams<OriginalDisplay, OutputDisplay>) => void;
+export const open_modal_with_alignment: <OriginalDisplay extends Display, OutputDisplay extends ModernDisplay>(openModalParams: OpenModalParams<OriginalDisplay, OutputDisplay>) => void;
 export function open_search_with_shift_slash(open_search: VoidFunction): () => void;
 export interface PageReplacer {
   readonly render_: () => Node_Array;
@@ -1563,5 +1570,5 @@ export function CategoryPage<OriginalDisplay extends Display, OutputDisplay exte
   content_blocks_by_row?: ContentBlocksByRow;
   layout?: PossibleLayout;
   filterModalParent_?: HTMLElement | ShadowRoot;
-}): import("@depict-ai/utilishared").Node_Array;
+}): import("@depict-ai/utilishared/latest").Node_Array;
 export type { SearchFilter } from "@depict-ai/types/api/SearchRequestV3";