@depict-ai/ui 2.0.26 → 2.1.1

package/latest/index.js

@@ -1,11 +1,12 @@
 import { add_to_version_info as $9HbP8$add_to_version_info, base64_encode_unicode as $9HbP8$base64_encode_unicode, base64_decode_unicode as $9HbP8$base64_decode_unicode, dlog as $9HbP8$dlog, queueMacroTask as $9HbP8$queueMacroTask, catchify as $9HbP8$catchify, is_safari as $9HbP8$is_safari, observer as $9HbP8$observer, Amazing_Slider as $9HbP8$Amazing_Slider, slider_snap_css as $9HbP8$slider_snap_css, slider_fading_factory as $9HbP8$slider_fading_factory, slider_fractional_factory as $9HbP8$slider_fractional_factory, camelCasifyObject as $9HbP8$camelCasifyObject, make_random_classname as $9HbP8$make_random_classname, n_col_styling_with_dist as $9HbP8$n_col_styling_with_dist, layout_get_visible_recs_without_partial_rows as $9HbP8$layout_get_visible_recs_without_partial_rows, layout_get_total_rec_amount_for_row as $9HbP8$layout_get_total_rec_amount_for_row, layout_media_query_header as $9HbP8$layout_media_query_header, report as $9HbP8$report, useExpandingContainer as $9HbP8$useExpandingContainer, standard_price_format as $9HbP8$standard_price_format, hex_to_rgb as $9HbP8$hex_to_rgb, relative_luminance_from_rgb as $9HbP8$relative_luminance_from_rgb, fetch_recs as $9HbP8$fetch_recs, snakeCasifyObject as $9HbP8$snakeCasifyObject, instant_exec_on_suspect_history_change as $9HbP8$instant_exec_on_suspect_history_change, base_url as $9HbP8$base_url, get_depict_id as $9HbP8$get_depict_id, get_user_id as $9HbP8$get_user_id, get_session_id as $9HbP8$get_session_id, sort_obj as $9HbP8$sort_obj, fetch_retry as $9HbP8$fetch_retry, add_version_query_params as $9HbP8$add_version_query_params, dwarn as $9HbP8$dwarn, make_url_with_query_params as $9HbP8$make_url_with_query_params, edit_current_page_meta_tags as $9HbP8$edit_current_page_meta_tags, javascript_media_query as $9HbP8$javascript_media_query, use_href_accessor as $9HbP8$use_href_accessor, is_debug as $9HbP8$is_debug, make_asyncIterable_exiter as $9HbP8$make_asyncIterable_exiter, href_change_ipns as $9HbP8$href_change_ipns, ContainedImage as $9HbP8$ContainedImage, buildThresholdList as $9HbP8$buildThresholdList, deparallelize_no_drop as $9HbP8$deparallelize_no_drop, ListenableSet as $9HbP8$ListenableSet, insert_surfaces as $9HbP8$insert_surfaces } from "@depict-ai/utilishared/latest";
-import { createComponent as $9HbP8$createComponent, template as $9HbP8$template, getNextElement as $9HbP8$getNextElement, effect as $9HbP8$effect, style as $9HbP8$style, spread as $9HbP8$spread, mergeProps as $9HbP8$mergeProps, runHydrationEvents as $9HbP8$runHydrationEvents, insert as $9HbP8$insert, setAttribute as $9HbP8$setAttribute, isServer as $9HbP8$isServer, addEventListener as $9HbP8$addEventListener, className as $9HbP8$className, memo as $9HbP8$memo, delegateEvents as $9HbP8$delegateEvents, classList as $9HbP8$classList, getNextMarker as $9HbP8$getNextMarker, Dynamic as $9HbP8$Dynamic, use as $9HbP8$use } from "solid-js/web";
-import { createSignal as $9HbP8$createSignal, getOwner as $9HbP8$getOwner, createEffect as $9HbP8$createEffect, runWithOwner as $9HbP8$runWithOwner, onCleanup as $9HbP8$onCleanup, createMemo as $9HbP8$createMemo, createContext as $9HbP8$createContext, useContext as $9HbP8$useContext, createResource as $9HbP8$createResource, Suspense as $9HbP8$Suspense, Show as $9HbP8$Show, createRenderEffect as $9HbP8$createRenderEffect, createRoot as $9HbP8$createRoot, For as $9HbP8$For, createUniqueId as $9HbP8$createUniqueId, untrack as $9HbP8$untrack, createComputed as $9HbP8$createComputed, ErrorBoundary as $9HbP8$ErrorBoundary, Index as $9HbP8$Index, on as $9HbP8$on, batch as $9HbP8$batch, createReaction as $9HbP8$createReaction } from "solid-js";
+import { createComponent as $9HbP8$createComponent, template as $9HbP8$template, getNextElement as $9HbP8$getNextElement, effect as $9HbP8$effect, style as $9HbP8$style, spread as $9HbP8$spread, mergeProps as $9HbP8$mergeProps, runHydrationEvents as $9HbP8$runHydrationEvents, insert as $9HbP8$insert, setAttribute as $9HbP8$setAttribute, isServer as $9HbP8$isServer, addEventListener as $9HbP8$addEventListener, className as $9HbP8$className, memo as $9HbP8$memo, delegateEvents as $9HbP8$delegateEvents, classList as $9HbP8$classList, getNextMarker as $9HbP8$getNextMarker, Dynamic as $9HbP8$Dynamic, use as $9HbP8$use, setProperty as $9HbP8$setProperty } from "solid-js/web";
+import { createSignal as $9HbP8$createSignal, getOwner as $9HbP8$getOwner, createEffect as $9HbP8$createEffect, runWithOwner as $9HbP8$runWithOwner, onCleanup as $9HbP8$onCleanup, createMemo as $9HbP8$createMemo, createContext as $9HbP8$createContext, useContext as $9HbP8$useContext, createResource as $9HbP8$createResource, Suspense as $9HbP8$Suspense, Show as $9HbP8$Show, untrack as $9HbP8$untrack, createRenderEffect as $9HbP8$createRenderEffect, Index as $9HbP8$Index, createRoot as $9HbP8$createRoot, For as $9HbP8$For, createUniqueId as $9HbP8$createUniqueId, createComputed as $9HbP8$createComputed, ErrorBoundary as $9HbP8$ErrorBoundary, on as $9HbP8$on, batch as $9HbP8$batch, createReaction as $9HbP8$createReaction, mapArray as $9HbP8$mapArray, mergeProps as $9HbP8$mergeProps1 } from "solid-js";
+import { createStore as $9HbP8$createStore, reconcile as $9HbP8$reconcile } from "solid-js/store";
 
 /*! Depict.ai search and product listing SDK */
 import { register_es_version } from "../multi_import_deduplicator.mjs";
 register_es_version("ui", "latest");
-const $ec291e0010116877$export$83d89fbfd8236492 = "2.0.26";
+const $ec291e0010116877$export$83d89fbfd8236492 = "2.1.1";
 const $4147651646da990a$var$fallback_operator = "in";
 const $4147651646da990a$var$fallback_token = "";
 const $4147651646da990a$var$legacy_filter_prefix = "filter_";
@@ -192,7 +193,7 @@ function $011607bdf658f807$export$e68cff63f76bd15b(props) {
 function $011607bdf658f807$export$8d0c4fdbb05a2f2e() {
   return $9HbP8$useContext($011607bdf658f807$var$ListingContext);
 }
-const $f18d425032111270$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div></div>`, 2);
+const $f18d425032111270$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div>`);
 function $f18d425032111270$export$94026ee33dbabc26(props) {
   return (() => {
     const _el$ = $9HbP8$getNextElement($f18d425032111270$var$_tmpl$);
@@ -200,7 +201,7 @@ function $f18d425032111270$export$94026ee33dbabc26(props) {
     return _el$;
   })();
 }
-const $e8ffe11ed01df0fe$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<img>`, 1);
+const $e8ffe11ed01df0fe$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<img>`);
 function $e8ffe11ed01df0fe$export$e6fffe67d4cdd848(whatToWatch) {
   const [size, setSize] = $9HbP8$createSignal(0);
   const resizeObserver = new ResizeObserver($9HbP8$catchify(records => {
@@ -305,7 +306,7 @@ function $660070e2a394b3c3$export$e4b984597b71e989(props) {
   }));
   return container;
 }
-const $fbbadcb080ad1d4a$var$_tmpl$ = /*#__PURE__*/$9HbP8$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"></path></svg>`, 4);
+const $fbbadcb080ad1d4a$var$_tmpl$ = /*#__PURE__*/$9HbP8$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 $fbbadcb080ad1d4a$export$8be2714ec7f169ee(props = {}) {
   return (() => {
     const _el$ = $9HbP8$getNextElement($fbbadcb080ad1d4a$var$_tmpl$);
@@ -322,7 +323,7 @@ function $fbbadcb080ad1d4a$export$8be2714ec7f169ee(props = {}) {
     return _el$;
   })();
 }
-const $f32e14878e75af51$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div></div>`, 2);
+const $f32e14878e75af51$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div>`);
 function $f32e14878e75af51$export$6649caad96ef8870({
   children: children,
   slider_ref_: slider_ref_,
@@ -420,7 +421,7 @@ const $b5cccc8ee7d24677$export$6daf8749b65a1b77 = cols_at_size => {
   return $b5cccc8ee7d24677$var$transform_elements(sorted_cols_at_size);
 };
 function $a458486f22b22f63$export$a2cc176055f8f08() {
-  const text = "Please try setting `columnsAtSize` on the `SearchPage`/`CategoryPage` components to change the grid before setting it with CSS. If you do with CSS, set `columnsAtSize` to an empty array to ensure no declarations created by the SDK leak through.";
+  const text = "Please try setting `columnsAtSize`/`gridSpacing` on the `SearchPage`/`CategoryPage` components to change the grid before setting it with CSS. If you do with CSS, set `columnsAtSize` to an empty array to ensure no declarations created by the SDK leak through.";
   return (0, $9HbP8$isServer) ? {
     t: `<!-- ${text} -->`
   } : document.createComment(text);
@@ -441,12 +442,13 @@ let $6e41f1fde994db72$var$cached_placeholder_element;
 let $6e41f1fde994db72$var$rendering_cached_placeholder_element;
 function $6e41f1fde994db72$export$f33414a4df0afd3f({
   product_card_template_: product_card_template_,
-  num_placeholders_: num_placeholders_
+  num_placeholders_: num_placeholders_,
+  content_blocks_: content_blocks_
 }) {
-  const [get_elements, set_elements] = $9HbP8$createSignal([]);
-  let existing_num = 0;
+  const [num_to_actually_show, set_num_to_actually_show] = $9HbP8$createSignal($9HbP8$untrack(num_placeholders_));
   if (0, $9HbP8$isServer)
     // want to render simple placeholders on server, effects don't run there
+    // FIXME when adding proper SSR: also SSR content blocks
     return $9HbP8$createMemo(() => Array.from({
       length: num_placeholders_()
     }).map(() => {
@@ -455,19 +457,30 @@ function $6e41f1fde994db72$export$f33414a4df0afd3f({
       if (typeof template_result?.then !== "function") return template_result;
     }));
   $9HbP8$createRenderEffect(() => {
+    const existing_num = num_to_actually_show();
     const to_add = num_placeholders_() - existing_num;
     if (to_add <= 0) return;
     // Below comment is from when we used recommendation renderer and manual DOM manipulation for this, but I'm still scared to remove placeholders and mess up scroll restoration, so I'm keeping the way it worked. Otherwise, <Index> could be used which would be far more elegant.
     // We don't need to remove placeholders, only need to add. The reason for that is that chrome restores the scroll position once all tasks queued as reaction of the "popstate" events have been completed in the task queue. That means that we need to get the placeholders in fast, or we might lose scroll position if the previous site was shorter.
     // The query id and the amount might update in separate tasks because one comes from href_change_ipns and the other one from another "popstate" listener. Therefore, we need to be able to dynamically add more placeholders. I'm not entirely sure about this anymore though, since we have the scroll position on a per-id basis it might work anyway but THIS WORKS, and I've been working on this bug for 3 hours so let's just keep it this way.
-    set_elements(prev => [...prev, ...Array.from({
-      length: to_add
-    }).map(() => $6e41f1fde994db72$var$Placeholder({
-      product_card_template_: product_card_template_
-    }))]);
-    existing_num += to_add;
+    // Above comments were from when we added elements in this createRenderEffect. Now I changed it to just increment the number and render them from an <Index> instead, so I can add content blocks better
+    // Functionality should be the same
+    set_num_to_actually_show(existing_num + to_add);
+  });
+  return $9HbP8$createComponent((0, $9HbP8$Index), {
+    get each() {
+      return Array.from({
+        length: num_to_actually_show()
+      });
+    },
+    children: (_item, index) => {
+      const possible_content_block = $9HbP8$createMemo(() => content_blocks_?.()?.()?.[index]);
+      // Show content block before product card, so it's *at* that index
+      return [possible_content_block, $6e41f1fde994db72$var$Placeholder({
+        product_card_template_: product_card_template_
+      })]; // https://github.com/solidjs/solid/releases/tag/v1.7.0
+    }
   });
-  return get_elements; // https://github.com/solidjs/solid/releases/tag/v1.7.0
 }
 /**
  * Get one placeholder element. It will be cloned for each placeholder for ultimate performance even when solid-js isn't rendering the placeholders.
@@ -552,7 +565,8 @@ function $29ec7cddbe1d3484$export$43f0fb951fcb0c54({
   merchant_: merchant_,
   market_: market_,
   product_card_template_: product_card_template_,
-  do_per_elements_: do_per_elements_
+  do_per_elements_: do_per_elements_,
+  content_blocks_: content_blocks_
 }) {
   return $9HbP8$createComponent((0, $9HbP8$For), {
     get each() {
@@ -560,6 +574,7 @@ function $29ec7cddbe1d3484$export$43f0fb951fcb0c54({
     },
     children: (product_id, index) => {
       const owner = $9HbP8$getOwner();
+      const possible_content_block = $9HbP8$createMemo(() => content_blocks_?.()?.()?.[index()]);
       const display_accessor = $9HbP8$createMemo(prev => {
         const new_display = displays_by_key_().get(product_id);
         if (prev && $29ec7cddbe1d3484$var$deep_equal(prev, new_display))
@@ -612,7 +627,9 @@ function $29ec7cddbe1d3484$export$43f0fb951fcb0c54({
         }
         do_per_elements_?.(elements, index);
       });
-      return product_card_resource; // https://github.com/solidjs/solid/releases/tag/v1.7.0
+      return [
+      // Show content block before product card, so it's *at* that index
+      possible_content_block, product_card_resource]; // https://github.com/solidjs/solid/releases/tag/v1.7.0
     }
   });
 }
@@ -649,7 +666,7 @@ class $4fd48cb976bf1789$export$aa14a9f43128f61f extends $4fd48cb976bf1789$export
     });
   }
 }
-const $b7436a6d1fd64e3b$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div></div>`, 2);
+const $b7436a6d1fd64e3b$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div>`);
 function $b7436a6d1fd64e3b$export$b69d0d92862de18b(props) {
   return $9HbP8$ErrorBoundary({
     fallback(err, retry) {
@@ -675,8 +692,8 @@ function $b7436a6d1fd64e3b$export$b69d0d92862de18b(props) {
     }
   });
 }
-const $c8d5ff4524619fcd$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div></div>`, 2),
-  $c8d5ff4524619fcd$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<style type="text/css"></style>`, 2);
+const $c8d5ff4524619fcd$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div>`),
+  $c8d5ff4524619fcd$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<style type=text/css>`);
 function $c8d5ff4524619fcd$export$d21e32dfedac04be(props) {
   const container_class = "x" + $9HbP8$createUniqueId();
   const container_element_ = (() => {
@@ -902,7 +919,7 @@ function $16b52438165aafe2$export$23fca46f3143581f(component, error_message) {
     // we're already in a root so cleanups are handled
     return component_in_error_boundary();
 }
-const $ee116da074deb002$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="depict recommendations"></div>`, 2);
+const $ee116da074deb002$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="depict recommendations">`);
 function $ee116da074deb002$export$9574e176201e5e8d(props) {
   return $16b52438165aafe2$export$23fca46f3143581f(() => {
     const grid_spacing_override = $9HbP8$createMemo(() => {
@@ -937,7 +954,7 @@ function $ee116da074deb002$export$9574e176201e5e8d(props) {
     })();
   }, "RecommendationSlider failed");
 }
-const $3da8afe3ed57cf34$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="recommendation-grid"><!#><!/><!#><!/></div>`, 6);
+const $3da8afe3ed57cf34$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=recommendation-grid><!$><!/><!$><!/>`);
 function $3da8afe3ed57cf34$export$7da560f849543dff({
   recommendations_resource_: recommendations_resource_,
   product_card_template_: product_card_template_,
@@ -996,8 +1013,8 @@ function $3da8afe3ed57cf34$export$7da560f849543dff({
     children: elements
   });
 }
-const $9ea5383493360761$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<button class="show-more major" type="button"></button>`, 2),
-  $9ea5383493360761$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="depict plp recommendations"></div>`, 2);
+const $9ea5383493360761$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<button class="show-more major"type=button>`),
+  $9ea5383493360761$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="depict plp recommendations">`);
 function $9ea5383493360761$export$9756467d34d91cdb(props) {
   return $16b52438165aafe2$export$23fca46f3143581f(() => {
     const rows_object_ = $9HbP8$createMemo(() => {
@@ -1173,7 +1190,7 @@ function $8c0f86cb3e266eeb$export$a71e92cfbb498adc(props) {
     return $9HbP8$standard_price_format(props.price_, price_formatting.places_after_comma_, price_formatting.decimal_places_delimiter_, price_formatting.thousands_delimiter_);
   });
 }
-const $bf52d9f9eebd1938$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div></div>`, 2);
+const $bf52d9f9eebd1938$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div>`);
 const $bf52d9f9eebd1938$var$closing_functions = /*@__PURE__*/new Set();
 const $bf52d9f9eebd1938$export$22970a0140fc759c = /*@__PURE__*/$9HbP8$createSignal(false);
 function $bf52d9f9eebd1938$export$5196e4c01fa56fcb({
@@ -1264,8 +1281,8 @@ function $bf52d9f9eebd1938$export$5196e4c01fa56fcb({
     close_toast_: close_toast_
   };
 }
-const $e9342fb3ac73a54a$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="statement"></div>`, 2),
-  $e9342fb3ac73a54a$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="buttons"><button class="restore minor"></button><button class="ok major"></button></div>`, 6);
+const $e9342fb3ac73a54a$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=statement>`),
+  $e9342fb3ac73a54a$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class=buttons><button class="restore minor"></button><button class="ok major">`);
 function $e9342fb3ac73a54a$export$8895d39404bd2bb1(props) {
   let previous_sorting;
   let on_toast_hidden;
@@ -1348,7 +1365,7 @@ function $e9342fb3ac73a54a$export$8895d39404bd2bb1(props) {
   if (delay_toast_) return show_configured_toast;else show_configured_toast();
 }
 $9HbP8$delegateEvents(["click"]);
-const $19976a74d273070d$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg><path d="M11.669 10.531l9.156-9.156a.78.78 0 0 0 .237-.569c0-.221-.079-.412-.237-.569A.8.8 0 0 0 20.24 0a.77.77 0 0 0-.569.237l-9.14 9.14-9.14-9.14A.79.79 0 0 0 .807 0a.77.77 0 0 0-.569.237A.78.78 0 0 0 0 .807a.77.77 0 0 0 .237.569l9.156 9.156-9.156 9.14c-.159.157-.237.349-.237.569s.079.412.237.569c.085.085.174.148.268.19a1.095 1.095 0 0 0 .316.048.894.894 0 0 0 .285-.048.84.84 0 0 0 .285-.19l9.139-9.14 9.14 9.14a.894.894 0 0 0 .268.19 1.049 1.049 0 0 0 .301.048.941.941 0 0 0 .301-.048.84.84 0 0 0 .285-.19.78.78 0 0 0 .237-.569c0-.221-.079-.412-.237-.569z"></path></svg>`, 4);
+const $19976a74d273070d$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg><path d="M11.669 10.531l9.156-9.156a.78.78 0 0 0 .237-.569c0-.221-.079-.412-.237-.569A.8.8 0 0 0 20.24 0a.77.77 0 0 0-.569.237l-9.14 9.14-9.14-9.14A.79.79 0 0 0 .807 0a.77.77 0 0 0-.569.237A.78.78 0 0 0 0 .807a.77.77 0 0 0 .237.569l9.156 9.156-9.156 9.14c-.159.157-.237.349-.237.569s.079.412.237.569c.085.085.174.148.268.19a1.095 1.095 0 0 0 .316.048.894.894 0 0 0 .285-.048.84.84 0 0 0 .285-.19l9.139-9.14 9.14 9.14a.894.894 0 0 0 .268.19 1.049 1.049 0 0 0 .301.048.941.941 0 0 0 .301-.048.84.84 0 0 0 .285-.19.78.78 0 0 0 .237-.569c0-.221-.079-.412-.237-.569z">`);
 function $19976a74d273070d$export$3b621d86b1566b2(props = {}) {
   return (() => {
     const _el$ = $9HbP8$getNextElement($19976a74d273070d$var$_tmpl$);
@@ -1370,10 +1387,10 @@ function $91aa8ee9f431800d$export$325f75597868c4f0(stuff) {
   if (typeof stuff !== "string") return stuff;
   return stuff.toLowerCase();
 }
-const $1adfe60f3a14a1d7$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<button class="clear-all-filters minor"></button>`, 2),
-  $1adfe60f3a14a1d7$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="inner"><span class="title"><!#><!/>: </span><!#><!/></div>`, 8),
-  $1adfe60f3a14a1d7$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<button class="clear-filter major"><!#><!/><span><!#><!/><!#><!/><!#><!/> – <!#><!/><!#><!/><!#><!/></span></button>`, 18),
-  $1adfe60f3a14a1d7$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<button class="clear-filter major"><!#><!/><span></span></button>`, 6);
+const $1adfe60f3a14a1d7$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<button class="clear-all-filters minor">`),
+  $1adfe60f3a14a1d7$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class=inner><span class=title><!$><!/>: </span><!$><!/>`),
+  $1adfe60f3a14a1d7$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<button class="clear-filter major"><!$><!/><span><!$><!/><!$><!/><!$><!/> – <!$><!/><!$><!/><!$><!/>`),
+  $1adfe60f3a14a1d7$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<button class="clear-filter major"><!$><!/><span>`);
 function $1adfe60f3a14a1d7$export$fecbb157621501bd({
   number_of_rendered_selected_filters_items_: number_of_rendered_selected_filters_items_,
   i18n_: i18n_,
@@ -1498,56 +1515,54 @@ function $1adfe60f3a14a1d7$export$fecbb157621501bd({
                           return matching_filter()?.op !== "inrange";
                         },
                         get fallback() {
+                          number_of_rendered_selected_filters_items_[1](prev => prev + 1);
+                          $9HbP8$onCleanup(() => number_of_rendered_selected_filters_items_[1](prev => prev - 1));
                           return (() => {
-                            number_of_rendered_selected_filters_items_[1](prev => prev + 1);
-                            $9HbP8$onCleanup(() => number_of_rendered_selected_filters_items_[1](prev => prev - 1));
-                            return (() => {
-                              const _el$9 = $9HbP8$getNextElement($1adfe60f3a14a1d7$var$_tmpl$3),
-                                _el$24 = _el$9.firstChild,
-                                [_el$25, _co$9] = $9HbP8$getNextMarker(_el$24.nextSibling),
-                                _el$10 = _el$25.nextSibling,
-                                _el$12 = _el$10.firstChild,
-                                [_el$13, _co$3] = $9HbP8$getNextMarker(_el$12.nextSibling),
-                                _el$14 = _el$13.nextSibling,
-                                [_el$15, _co$4] = $9HbP8$getNextMarker(_el$14.nextSibling),
-                                _el$16 = _el$15.nextSibling,
-                                [_el$17, _co$5] = $9HbP8$getNextMarker(_el$16.nextSibling),
-                                _el$11 = _el$17.nextSibling,
-                                _el$18 = _el$11.nextSibling,
-                                [_el$19, _co$6] = $9HbP8$getNextMarker(_el$18.nextSibling),
-                                _el$20 = _el$19.nextSibling,
-                                [_el$21, _co$7] = $9HbP8$getNextMarker(_el$20.nextSibling),
-                                _el$22 = _el$21.nextSibling,
-                                [_el$23, _co$8] = $9HbP8$getNextMarker(_el$22.nextSibling);
-                              _el$9.$$click = () => {
-                                const cloned_selected_filters = [...read_selected_filters()];
-                                cloned_selected_filters.splice(index_in_selected_filters, 1);
-                                write_selected_filters(cloned_selected_filters);
-                              };
-                              $9HbP8$insert(_el$9, $9HbP8$createComponent((0, $19976a74d273070d$export$3b621d86b1566b2), {}), _el$25, _co$9);
-                              $9HbP8$insert(_el$10, () => price_formatting_().pre_, _el$13, _co$3);
-                              $9HbP8$insert(_el$10, $9HbP8$createComponent((0, $8c0f86cb3e266eeb$export$a71e92cfbb498adc), {
-                                get price_() {
-                                  return filter().data[0];
-                                },
-                                get price_formatting_() {
-                                  return price_formatting_();
-                                }
-                              }), _el$15, _co$4);
-                              $9HbP8$insert(_el$10, () => price_formatting_().post_, _el$17, _co$5);
-                              $9HbP8$insert(_el$10, () => price_formatting_().pre_, _el$19, _co$6);
-                              $9HbP8$insert(_el$10, $9HbP8$createComponent((0, $8c0f86cb3e266eeb$export$a71e92cfbb498adc), {
-                                get price_() {
-                                  return filter().data[1];
-                                },
-                                get price_formatting_() {
-                                  return price_formatting_();
-                                }
-                              }), _el$21, _co$7);
-                              $9HbP8$insert(_el$10, () => price_formatting_().post_, _el$23, _co$8);
-                              $9HbP8$runHydrationEvents();
-                              return _el$9;
-                            })();
+                            const _el$9 = $9HbP8$getNextElement($1adfe60f3a14a1d7$var$_tmpl$3),
+                              _el$24 = _el$9.firstChild,
+                              [_el$25, _co$9] = $9HbP8$getNextMarker(_el$24.nextSibling),
+                              _el$10 = _el$25.nextSibling,
+                              _el$12 = _el$10.firstChild,
+                              [_el$13, _co$3] = $9HbP8$getNextMarker(_el$12.nextSibling),
+                              _el$14 = _el$13.nextSibling,
+                              [_el$15, _co$4] = $9HbP8$getNextMarker(_el$14.nextSibling),
+                              _el$16 = _el$15.nextSibling,
+                              [_el$17, _co$5] = $9HbP8$getNextMarker(_el$16.nextSibling),
+                              _el$11 = _el$17.nextSibling,
+                              _el$18 = _el$11.nextSibling,
+                              [_el$19, _co$6] = $9HbP8$getNextMarker(_el$18.nextSibling),
+                              _el$20 = _el$19.nextSibling,
+                              [_el$21, _co$7] = $9HbP8$getNextMarker(_el$20.nextSibling),
+                              _el$22 = _el$21.nextSibling,
+                              [_el$23, _co$8] = $9HbP8$getNextMarker(_el$22.nextSibling);
+                            _el$9.$$click = () => {
+                              const cloned_selected_filters = [...read_selected_filters()];
+                              cloned_selected_filters.splice(index_in_selected_filters, 1);
+                              write_selected_filters(cloned_selected_filters);
+                            };
+                            $9HbP8$insert(_el$9, $9HbP8$createComponent((0, $19976a74d273070d$export$3b621d86b1566b2), {}), _el$25, _co$9);
+                            $9HbP8$insert(_el$10, () => price_formatting_().pre_, _el$13, _co$3);
+                            $9HbP8$insert(_el$10, $9HbP8$createComponent((0, $8c0f86cb3e266eeb$export$a71e92cfbb498adc), {
+                              get price_() {
+                                return filter().data[0];
+                              },
+                              get price_formatting_() {
+                                return price_formatting_();
+                              }
+                            }), _el$15, _co$4);
+                            $9HbP8$insert(_el$10, () => price_formatting_().post_, _el$17, _co$5);
+                            $9HbP8$insert(_el$10, () => price_formatting_().pre_, _el$19, _co$6);
+                            $9HbP8$insert(_el$10, $9HbP8$createComponent((0, $8c0f86cb3e266eeb$export$a71e92cfbb498adc), {
+                              get price_() {
+                                return filter().data[1];
+                              },
+                              get price_formatting_() {
+                                return price_formatting_();
+                              }
+                            }), _el$21, _co$7);
+                            $9HbP8$insert(_el$10, () => price_formatting_().post_, _el$23, _co$8);
+                            $9HbP8$runHydrationEvents();
+                            return _el$9;
                           })();
                         },
                         get children() {
@@ -1670,8 +1685,8 @@ function $1adfe60f3a14a1d7$export$fecbb157621501bd({
   return outmost_element;
 }
 $9HbP8$delegateEvents(["click"]);
-const $49b79728e7d9e2a1$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<span class="count"></span>`, 2),
-  $49b79728e7d9e2a1$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<label class="input-row"><div class="left"><input type="checkbox"><span class="custom-indicator"></span><span class="text line-clamp"></span></div><!#><!/></label>`, 11);
+const $49b79728e7d9e2a1$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<span class=count>`),
+  $49b79728e7d9e2a1$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<label class=input-row><div class=left><input type=checkbox><span class=custom-indicator></span><span class="text line-clamp"></span></div><!$><!/>`);
 const $49b79728e7d9e2a1$export$48513f6b9f8ce62d = props => {
   // It seems like there's no diffing without memos here (since we often just have computations in the getters above that update to the same result often because their dependencies change with unrelated changes often), so put memos here to avoid unneeded DOM changes
   const count = $9HbP8$createMemo(() => props.count_);
@@ -1719,19 +1734,19 @@ const $49b79728e7d9e2a1$export$48513f6b9f8ce62d = props => {
           _v$3 = !checked() && is_count_zero();
         _v$ !== _p$._v$ && _el$.classList.toggle("count-0", _p$._v$ = _v$);
         _v$2 !== _p$._v$2 && $9HbP8$setAttribute(_el$3, "name", _p$._v$2 = _v$2);
-        _v$3 !== _p$._v$3 && (_el$3.disabled = _p$._v$3 = _v$3);
+        _v$3 !== _p$._v$3 && $9HbP8$setProperty(_el$3, "disabled", _p$._v$3 = _v$3);
         return _p$;
       }, {
         _v$: undefined,
         _v$2: undefined,
         _v$3: undefined
       });
-      $9HbP8$effect(() => _el$3.checked = checked());
+      $9HbP8$effect(() => $9HbP8$setProperty(_el$3, "checked", checked()));
       return _el$;
     })()
   );
 };
-const $f8a56ba74eedd0c6$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg><path d="M10.173 5.548H5.5V.875c0-.075-.027-.14-.081-.193S5.301.601 5.226.601s-.14.027-.193.081-.081.118-.081.193v4.673H.274c-.075 0-.14.027-.193.081A.27.27 0 0 0 0 5.827c0 .075.027.14.081.193s.118.081.193.081h4.678v4.673c0 .075.027.14.081.193s.118.081.193.081.14-.027.193-.081.081-.118.081-.193V6.101h4.673a.27.27 0 0 0 .199-.081c.054-.054.08-.118.08-.193a.27.27 0 0 0-.279-.279z" fill="#000"></path></svg>`, 4);
+const $f8a56ba74eedd0c6$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg><path d="M10.173 5.548H5.5V.875c0-.075-.027-.14-.081-.193S5.301.601 5.226.601s-.14.027-.193.081-.081.118-.081.193v4.673H.274c-.075 0-.14.027-.193.081A.27.27 0 0 0 0 5.827c0 .075.027.14.081.193s.118.081.193.081h4.678v4.673c0 .075.027.14.081.193s.118.081.193.081.14-.027.193-.081.081-.118.081-.193V6.101h4.673a.27.27 0 0 0 .199-.081c.054-.054.08-.118.08-.193a.27.27 0 0 0-.279-.279z"fill=#000>`);
 function $f8a56ba74eedd0c6$export$f21ab0717a89c77f(props) {
   return (() => {
     const _el$ = $9HbP8$getNextElement($f8a56ba74eedd0c6$var$_tmpl$);
@@ -1744,7 +1759,7 @@ function $f8a56ba74eedd0c6$export$f21ab0717a89c77f(props) {
     return _el$;
   })();
 }
-const $67b173f9db427028$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<button type="button" class="expand-filter"><!#><!/><span></span></button>`, 6);
+const $67b173f9db427028$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<button type=button class=expand-filter><!$><!/><span>`);
 function $67b173f9db427028$export$ca21a16d65b3dd8({
   show_extras_: [get_show_extras, set_show_extras],
   i18n_: i18n_
@@ -1766,7 +1781,7 @@ function $67b173f9db427028$export$ca21a16d65b3dd8({
   })();
 }
 $9HbP8$delegateEvents(["click"]);
-const $a4601e6bea3ed1e6$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<form class="checkboxes"><!#><!/><!#><!/></form>`, 6);
+const $a4601e6bea3ed1e6$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<form class=checkboxes><!$><!/><!$><!/>`);
 const $a4601e6bea3ed1e6$var$max_visible_without_collapsing = 15;
 const $a4601e6bea3ed1e6$var$show_non_collapsible_when_collapsed = 4;
 function $a4601e6bea3ed1e6$export$dd948f91abc3a1c4({
@@ -1893,9 +1908,9 @@ function $a4601e6bea3ed1e6$export$dd948f91abc3a1c4({
     return _el$;
   })();
 }
-const $eb8d9bf3b5700c26$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<form class="radios"></form>`, 2),
-  $eb8d9bf3b5700c26$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<span class="count"></span>`, 2),
-  $eb8d9bf3b5700c26$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<label class="input-row"><div class="left"><input type="radio"><span class="custom-indicator"></span><!#><!/></div><!#><!/></label>`, 11);
+const $eb8d9bf3b5700c26$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<form class=radios>`),
+  $eb8d9bf3b5700c26$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<span class=count>`),
+  $eb8d9bf3b5700c26$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<label class=input-row><div class=left><input type=radio><span class=custom-indicator></span><!$><!/></div><!$><!/>`);
 function $eb8d9bf3b5700c26$export$430444115f70a734({
   selected_filters_: selected_filters_,
   filter_: filter_
@@ -1961,12 +1976,12 @@ function $eb8d9bf3b5700c26$export$430444115f70a734({
             }
           }), _el$10, _co$2);
           $9HbP8$effect(() => _el$2.classList.toggle("count-0", !!(count() === 0)));
-          $9HbP8$effect(() => _el$4.checked = $9HbP8$createMemo(() => {
+          $9HbP8$effect(() => $9HbP8$setProperty(_el$4, "checked", $9HbP8$createMemo(() => {
             const v = value();
             const data = existing_filter()?.data;
             if ($91aa8ee9f431800d$export$325f75597868c4f0(data) === $91aa8ee9f431800d$export$325f75597868c4f0(v)) return true;
             return Array.isArray(data) && data.every((item, index) => item === v[index]);
-          })());
+          })()));
           return _el$2;
         })();
       }
@@ -1974,9 +1989,9 @@ function $eb8d9bf3b5700c26$export$430444115f70a734({
     return _el$;
   })();
 }
-const $a6b08770e164eced$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="range"><div class="input-group"><div class="field"><input type="number"></div><div class="separator">-</div><div class="field"><input type="number"></div></div><!#><!/><div class="value-text"><span class="min"><!#><!/><!#><!/><!#><!/></span><span class="max"><!#><!/><!#><!/><!#><!/></span></div></div>`, 32),
-  $a6b08770e164eced$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="slider"><div class="progress"></div></div>`, 4),
-  $a6b08770e164eced$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<div class="range-group"><input type="range" step="any"><input type="range" step="any"></div>`, 4);
+const $a6b08770e164eced$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=range><div class=input-group><div class=field><input type=number></div><div class=separator>-</div><div class=field><input type=number></div></div><!$><!/><div class=value-text><span class=min><!$><!/><!$><!/><!$><!/></span><span class=max><!$><!/><!$><!/><!$><!/>`),
+  $a6b08770e164eced$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class=slider><div class=progress>`),
+  $a6b08770e164eced$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<div class=range-group><input type=range step=any><input type=range step=any>`);
 function $a6b08770e164eced$export$e0d834a0ad870cda({
   filter_: filter_,
   selected_filters_: selected_filters_,
@@ -2129,11 +2144,11 @@ function $a6b08770e164eced$var$RangeSelector({
         _v$8 = min_(),
         _v$9 = max_();
       _v$ !== _p$._v$ && _el$.classList.toggle("disabled", _p$._v$ = _v$);
-      _v$2 !== _p$._v$2 && (_el$4.disabled = _p$._v$2 = _v$2);
+      _v$2 !== _p$._v$2 && $9HbP8$setProperty(_el$4, "disabled", _p$._v$2 = _v$2);
       _v$3 !== _p$._v$3 && $9HbP8$setAttribute(_el$4, "aria-label", _p$._v$3 = _v$3);
       _v$4 !== _p$._v$4 && $9HbP8$setAttribute(_el$4, "min", _p$._v$4 = _v$4);
       _v$5 !== _p$._v$5 && $9HbP8$setAttribute(_el$4, "max", _p$._v$5 = _v$5);
-      _v$6 !== _p$._v$6 && (_el$7.disabled = _p$._v$6 = _v$6);
+      _v$6 !== _p$._v$6 && $9HbP8$setProperty(_el$7, "disabled", _p$._v$6 = _v$6);
       _v$7 !== _p$._v$7 && $9HbP8$setAttribute(_el$7, "aria-label", _p$._v$7 = _v$7);
       _v$8 !== _p$._v$8 && $9HbP8$setAttribute(_el$7, "min", _p$._v$8 = _v$8);
       _v$9 !== _p$._v$9 && $9HbP8$setAttribute(_el$7, "max", _p$._v$9 = _v$9);
@@ -2149,8 +2164,8 @@ function $a6b08770e164eced$var$RangeSelector({
       _v$8: undefined,
       _v$9: undefined
     });
-    $9HbP8$effect(() => _el$4.value = get_current_range()[0]);
-    $9HbP8$effect(() => _el$7.value = get_current_range()[1]);
+    $9HbP8$effect(() => $9HbP8$setProperty(_el$4, "value", get_current_range()[0]));
+    $9HbP8$effect(() => $9HbP8$setProperty(_el$7, "value", get_current_range()[1]));
     $9HbP8$runHydrationEvents();
     return _el$;
   })();
@@ -2271,11 +2286,11 @@ function $a6b08770e164eced$var$LinearSlider({
         _v$15 = i18n_.range_filter_high_point_aria_label_(),
         _v$16 = min_(),
         _v$17 = max_();
-      _v$10 !== _p$._v$10 && (_el$28.disabled = _p$._v$10 = _v$10);
+      _v$10 !== _p$._v$10 && $9HbP8$setProperty(_el$28, "disabled", _p$._v$10 = _v$10);
       _v$11 !== _p$._v$11 && $9HbP8$setAttribute(_el$28, "aria-label", _p$._v$11 = _v$11);
       _v$12 !== _p$._v$12 && $9HbP8$setAttribute(_el$28, "min", _p$._v$12 = _v$12);
       _v$13 !== _p$._v$13 && $9HbP8$setAttribute(_el$28, "max", _p$._v$13 = _v$13);
-      _v$14 !== _p$._v$14 && (_el$29.disabled = _p$._v$14 = _v$14);
+      _v$14 !== _p$._v$14 && $9HbP8$setProperty(_el$29, "disabled", _p$._v$14 = _v$14);
       _v$15 !== _p$._v$15 && $9HbP8$setAttribute(_el$29, "aria-label", _p$._v$15 = _v$15);
       _v$16 !== _p$._v$16 && $9HbP8$setAttribute(_el$29, "min", _p$._v$16 = _v$16);
       _v$17 !== _p$._v$17 && $9HbP8$setAttribute(_el$29, "max", _p$._v$17 = _v$17);
@@ -2290,13 +2305,13 @@ function $a6b08770e164eced$var$LinearSlider({
       _v$16: undefined,
       _v$17: undefined
     });
-    $9HbP8$effect(() => _el$28.value = $9HbP8$createMemo(() => {
+    $9HbP8$effect(() => $9HbP8$setProperty(_el$28, "value", $9HbP8$createMemo(() => {
       min_();
       max_();
       return get_current_range()[0];
     }, undefined, {
       equals: false
-    })());
+    })()));
     $9HbP8$runHydrationEvents();
     return _el$27;
   })()];
@@ -2315,7 +2330,7 @@ function $a6b08770e164eced$var$set_range_with_sanitation(min_, max_, current_ran
   current_range_signal[1](new_value);
 }
 $9HbP8$delegateEvents(["keydown", "click", "input"]);
-const $0b6bc2f8309efa8a$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="morphing-sign" role="img"><span></span><span></span></div>`, 6);
+const $0b6bc2f8309efa8a$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=morphing-sign role=img><span></span><span>`);
 function $0b6bc2f8309efa8a$export$e5c2828934226505({
   expanded_: expanded_,
   i18n_: i18n_
@@ -2359,10 +2374,10 @@ function $0b6bc2f8309efa8a$export$e5c2828934226505({
   });
   return outer_div;
 }
-const $1c8cac76cb67e9af$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<form class="checkboxes hierarchical"><!#><!/><!#><!/></form>`, 6),
-  $1c8cac76cb67e9af$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="checkbox-details"><!#><!/><!#><!/></div>`, 6),
-  $1c8cac76cb67e9af$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<details></details>`, 2),
-  $1c8cac76cb67e9af$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<summary class="category-parent"><div class="summary"><span class="count"></span><!#><!/></div></summary>`, 8);
+const $1c8cac76cb67e9af$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<form class="checkboxes hierarchical"><!$><!/><!$><!/>`),
+  $1c8cac76cb67e9af$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class=checkbox-details><!$><!/><!$><!/>`),
+  $1c8cac76cb67e9af$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<details>`),
+  $1c8cac76cb67e9af$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<summary class=category-parent><div class=summary><span class=count></span><!$><!/>`);
 const $1c8cac76cb67e9af$var$max_visible_without_collapsing = 15;
 const $1c8cac76cb67e9af$var$show_non_collapsible_when_collapsed = 4;
 function $1c8cac76cb67e9af$export$a32086fa6616eafd({
@@ -2790,9 +2805,9 @@ function $1c8cac76cb67e9af$var$expand_until_choice(data_structure) {
     }
   });
 }
-const $93716a9ad0dea854$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="checkbox-grid" style="position:absolute;z-index:-1;pointer-events:none;opacity:0"></div>`, 2),
-  $93716a9ad0dea854$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<span class="count-wrapper"><span class="count"></span></span>`, 4),
-  $93716a9ad0dea854$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<button><!#><!/><!#><!/></button>`, 6);
+const $93716a9ad0dea854$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=checkbox-grid style=position:absolute;z-index:-1;pointer-events:none;opacity:0>`),
+  $93716a9ad0dea854$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<span class=count-wrapper><span class=count>`),
+  $93716a9ad0dea854$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<button><!$><!/><!$><!/>`);
 const $93716a9ad0dea854$var$gap_px = 5;
 const $93716a9ad0dea854$var$max_columns = 3;
 const $93716a9ad0dea854$export$414f6a19d38e655c = ({
@@ -3000,7 +3015,7 @@ function $93716a9ad0dea854$var$adjust_sizes(container_width, sizes, set_cols_at_
     overrides: column_to_row_result
   }]]);
 }
-const $e731d52d97444b7c$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<form class="checkbox-color"><!#><!/><!#><!/></form>`, 6);
+const $e731d52d97444b7c$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<form class=checkbox-color><!$><!/><!$><!/>`);
 const $e731d52d97444b7c$var$max_visible_without_collapsing = 30;
 const $e731d52d97444b7c$var$show_non_collapsible_when_collapsed = 8;
 function $e731d52d97444b7c$export$82ed4b28ecb67608({
@@ -3179,7 +3194,7 @@ var $12497d09ef87296e$export$2e2bcd8739ae039 = {
   "checkbox-grid": (0, $93716a9ad0dea854$export$414f6a19d38e655c),
   "checkbox-color": (0, $e731d52d97444b7c$export$82ed4b28ecb67608)
 };
-const $9bc34983fc5f7bdb$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns="http://www.w3.org/2000/svg" width="16.8" height="14"><path d="M4.617 12.738a.48.48 0 0 1-.164-.027c-.051-.023-.094-.055-.129-.098L.125 8.414A.39.39 0 0 1 0 8.117c0-.113.039-.211.125-.293s.18-.125.293-.125.215.043.297.125l3.902 3.902L16.086.262c.082-.082.18-.125.297-.125s.211.043.293.125.125.184.125.301-.043.215-.125.297L4.914 12.613c-.039.043-.086.078-.141.098s-.102.027-.156.027zm0 0"></path></svg>`, 4);
+const $9bc34983fc5f7bdb$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns=http://www.w3.org/2000/svg width=16.8 height=14><path d="M4.617 12.738a.48.48 0 0 1-.164-.027c-.051-.023-.094-.055-.129-.098L.125 8.414A.39.39 0 0 1 0 8.117c0-.113.039-.211.125-.293s.18-.125.293-.125.215.043.297.125l3.902 3.902L16.086.262c.082-.082.18-.125.297-.125s.211.043.293.125.125.184.125.301-.043.215-.125.297L4.914 12.613c-.039.043-.086.078-.141.098s-.102.027-.156.027zm0 0">`);
 function $9bc34983fc5f7bdb$export$f2ca6fc699ca1fb4(props = {}) {
   return (() => {
     const _el$ = $9HbP8$getNextElement($9bc34983fc5f7bdb$var$_tmpl$);
@@ -3188,7 +3203,7 @@ function $9bc34983fc5f7bdb$export$f2ca6fc699ca1fb4(props = {}) {
     return _el$;
   })();
 }
-const $a7b58cb3bcffd156$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<span class="show-selected" aria-hidden="true"><span></span><!#><!/></span>`, 6);
+const $a7b58cb3bcffd156$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<span class=show-selected aria-hidden=true><span></span><!$><!/>`);
 function $a7b58cb3bcffd156$export$53c59af873b303c9({
   selected_filters_in_group_: selected_filters_in_group_,
   i18n_: {
@@ -3308,7 +3323,7 @@ function $84d6cd10bb7b1589$export$ab34afce88557c0e(props) {
   }));
   return is_open;
 }
-const $d20eff0aadc28983$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<span></span>`, 2);
+const $d20eff0aadc28983$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<span>`);
 function $d20eff0aadc28983$export$acb3eaade4b23afd(props) {
   return (() => {
     const _el$ = $9HbP8$getNextElement($d20eff0aadc28983$var$_tmpl$);
@@ -3349,14 +3364,14 @@ function $d134eae24341b4a1$export$89c6019e4baa40b1(props) {
     }
   });
 }
-const $fab07f52c9861732$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="filter-collapsible"></div>`, 2),
-  $fab07f52c9861732$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<button class="clear-group"><!#><!/><span></span></button>`, 6),
-  $fab07f52c9861732$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<div class="view-more-clear"><!#><!/><!#><!/></div>`, 6),
-  $fab07f52c9861732$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<div class="filter-collapsible-body"><div class="filter-part"></div><!#><!/></div>`, 6),
-  $fab07f52c9861732$var$_tmpl$5 = /*#__PURE__*/$9HbP8$template(`<details class="filter-collapsible"></details>`, 2),
-  $fab07f52c9861732$var$_tmpl$6 = /*#__PURE__*/$9HbP8$template(`<summary class="filter-group-summary"><div class="summary"><span></span><div class="selected-w-sign"><!#><!/><!#><!/></div></div></summary>`, 12),
-  $fab07f52c9861732$var$_tmpl$7 = /*#__PURE__*/$9HbP8$template(`<div class="ungrouped"></div>`, 2),
-  $fab07f52c9861732$var$_tmpl$8 = /*#__PURE__*/$9HbP8$template(`<button class="clear-all-filters major"></button>`, 2);
+const $fab07f52c9861732$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=filter-collapsible>`),
+  $fab07f52c9861732$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<button class=clear-group><!$><!/><span>`),
+  $fab07f52c9861732$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<div class=view-more-clear><!$><!/><!$><!/>`),
+  $fab07f52c9861732$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<div class=filter-collapsible-body><div class=filter-part></div><!$><!/>`),
+  $fab07f52c9861732$var$_tmpl$5 = /*#__PURE__*/$9HbP8$template(`<details class=filter-collapsible>`),
+  $fab07f52c9861732$var$_tmpl$6 = /*#__PURE__*/$9HbP8$template(`<summary class=filter-group-summary><div class=summary><span></span><div class=selected-w-sign><!$><!/><!$><!/>`),
+  $fab07f52c9861732$var$_tmpl$7 = /*#__PURE__*/$9HbP8$template(`<div class=ungrouped>`),
+  $fab07f52c9861732$var$_tmpl$8 = /*#__PURE__*/$9HbP8$template(`<button class="clear-all-filters major">`);
 function $fab07f52c9861732$export$3f1a388cc0d8fed7(props) {
   // Split like this to make placeholder wrapping more visible & this component is exported and used in MobileModal
   return $9HbP8$createComponent((0, $9HbP8$Show), {
@@ -4261,7 +4276,7 @@ function $8f9120a1ca151e6a$export$205efb947c7ffd78(handler, passive = true) {
     $9HbP8$onCleanup(() => removeEventListener(event, catchified_handler));
   }
 }
-const $6db49ca163afa2c3$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="scroll-status" style="display:none"><span class="text"><b></b> – <b></b> <!#><!/> <b></b></span></div>`, 12);
+const $6db49ca163afa2c3$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=scroll-status style=display:none><span class=text><b></b> – <b></b> <!$><!/> <b>`);
 function $6db49ca163afa2c3$export$83fd5de5504a7a67({
   formatted_number_of_results_: formatted_number_of_results_,
   first_result_in_viewport_: [get_first_result_in_viewport],
@@ -4398,8 +4413,8 @@ function $6db49ca163afa2c3$export$83fd5de5504a7a67({
     return _el$;
   })();
 }
-const $598245ecfe38f34b$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<a class="hint" href="javascript:void(0)"></a>`, 2),
-  $598245ecfe38f34b$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="no-results"><div class="text"></div><!#><!/></div>`, 6);
+const $598245ecfe38f34b$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<a class=hint href=javascript:void(0)>`),
+  $598245ecfe38f34b$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class=no-results><div class=text></div><!$><!/>`);
 function $598245ecfe38f34b$export$ef6006467f04ee41({
   i18n_: i18n_,
   expanded_hierarchical_filters_: expanded_hierarchical_filters_,
@@ -4552,7 +4567,9 @@ function $0449e7d49398c077$export$a1fd619a4743ca08({
   min_products_to_fetch_: min_products_to_fetch_,
   query_base_: query_base_,
   depict_api_: depict_api_,
-  is_loading_: is_loading_
+  is_loading_: is_loading_,
+  content_blocks_: content_blocks_,
+  set_number_loaded_displays_: set_number_loaded_displays_
 }) {
   // The following sets up an intersection observer to determine which results are in the viewport, used for the ScrollStatus indicator and knowing when to load more
   const target_to_index_map = new Map();
@@ -4596,11 +4613,13 @@ function $0449e7d49398c077$export$a1fd619a4743ca08({
     query_base_: query_base_,
     depict_api_: depict_api_
   });
+  $9HbP8$createComputed(() => set_number_loaded_displays_(displays_by_key_().size));
   return $29ec7cddbe1d3484$export$43f0fb951fcb0c54({
     displays_by_key_: displays_by_key_,
     merchant_: merchant_,
     market_: market_,
     product_card_template_: product_card_template_,
+    content_blocks_: content_blocks_,
     do_per_elements_: (elements, index_accessor) =>
     // Adds/removes elements from the "results in viewport" intersection observer above
     $9HbP8$createEffect(() => {
@@ -4622,7 +4641,347 @@ function $0449e7d49398c077$export$a1fd619a4743ca08({
     })
   });
 }
-const $2d25e42846eac370$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="PLP-results"><!#><!/><!#><!/></div>`, 6);
+const $6dee9211e57ac31a$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div>`),
+  $6dee9211e57ac31a$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<style type=text/css>`);
+const $6dee9211e57ac31a$export$c500183c31c2b22e = "--spans-columns";
+function $6dee9211e57ac31a$export$ab6b147eec64fea5(props) {
+  const container_class = "x" + $9HbP8$createUniqueId();
+  const container_element_ = (() => {
+    const _el$ = $9HbP8$getNextElement($6dee9211e57ac31a$var$_tmpl$);
+    $9HbP8$spread(_el$, $9HbP8$mergeProps(() => props.element_attributes, {
+      "classList": {
+        [container_class]: true
+      }
+    }), false, true);
+    $9HbP8$insert(_el$, () => props.children);
+    $9HbP8$runHydrationEvents();
+    return _el$;
+  })(); // Don't want this in the error boundary below, it should only be for the actual layouting
+  return $9HbP8$createComponent((0, $b7436a6d1fd64e3b$export$b69d0d92862de18b), {
+    message_: "Failed calculating css grid layout",
+    severity_: "error",
+    get children() {
+      return $6dee9211e57ac31a$export$e2f22da34aaf310a(props, container_element_, false, container_class);
+    }
+  });
+}
+function $6dee9211e57ac31a$export$e2f22da34aaf310a(props, container_element, insert_after_container = false, container_class) {
+  if (!container_class) {
+    // only try to add if it wasn't provided, so that we have a code path without classList when doing SSR
+    container_class = $9HbP8$make_random_classname();
+    container_element.classList.add(container_class);
+  }
+  const container_selector = `.depict .${container_class}`; // class so ppl can have id if needed
+  const col_styling = $9HbP8$createMemo(() => $6dee9211e57ac31a$var$generate_media_queried_declarations({
+    container_selector_: container_selector,
+    default_grid_spacing_text: props.grid_spacing,
+    cols_at_size_: props.cols_at_size,
+    override_vertical_spacing_: props.override_vertical_spacing,
+    top_row_shortened_by_: props.top_row_shortened_by_()
+  }));
+  const base_styling = $9HbP8$createMemo(() => {
+    return `${container_selector}{display:grid;}`;
+  });
+  const get_styling = $9HbP8$createMemo(() => base_styling() + col_styling());
+  const style_element = (() => {
+    const _el$2 = $9HbP8$getNextElement($6dee9211e57ac31a$var$_tmpl$2);
+    $9HbP8$insert(_el$2, get_styling);
+    return _el$2;
+  })(); // need to create this after set_styling has been called or else there will be no styling in the SSR'd output
+  if (insert_after_container) container_element.after(style_element);
+  return [container_element, style_element];
+}
+function $6dee9211e57ac31a$var$generate_media_queried_declarations({
+  container_selector_: container_selector_,
+  default_grid_spacing_text: default_grid_spacing_text,
+  cols_at_size_: cols_at_size_,
+  override_vertical_spacing_: override_vertical_spacing_,
+  top_row_shortened_by_: top_row_shortened_by_
+}) {
+  return cols_at_size_.map(options => {
+    const [n_cols, min, max, grid_spacing_for_size] = options;
+    const spacing_to_use = grid_spacing_for_size || default_grid_spacing_text;
+    // See comment in else block below
+    const can_use_gap = $6dee9211e57ac31a$var$can_use_gap_for_unit(spacing_to_use) && (!override_vertical_spacing_ || $6dee9211e57ac31a$var$can_use_gap_for_unit(override_vertical_spacing_));
+    let spacing_styling;
+    let additional_styling = ""; // outside the media query
+    if (can_use_gap) spacing_styling = `gap:${spacing_to_use};${override_vertical_spacing_ ? `row-gap:${override_vertical_spacing_};` : ``}`;else {
+      // When using percent units, which our default styling does (because convenient) and our interface relies on (hard to specify different gaps for different screen sizes)
+      // row gaps in grids are relative to the whole height of the grid, maybe see also https://stackoverflow.com/a/53563865. The issue with that is that as we load more products, the gap grows. Also, it breaks existing integrations.
+      // Logical thought: use margins for the vertical spacing. But margins in grids are apparently relative to the size of the individual items in grids.
+      // Given that, and that content blocks can be of different width, we have to do some complicated calculations to convert the provided gap, which is in gap of the total container width, to a margin of the individual items.
+      const width_multiplier = `var(${$6dee9211e57ac31a$export$c500183c31c2b22e}, 1)`; // How many cards wide the current item is (needed because content blocks)
+      const one_item_width_exclusing_gaps = `calc(calc(100 / ${n_cols}) - calc(calc(${n_cols * 2 - 2} * calc(${$6dee9211e57ac31a$var$strip_percent_unit(spacing_to_use)} / 2)) / ${n_cols}))`; // Width of one item in percent of the whole
+      // Equation from layout.tsx, also used in CheckboxGrid. Needs half spacing for some reason
+      const this_item_width_meat = `calc(${one_item_width_exclusing_gaps} * ${width_multiplier})`; // Width of just the card
+      const this_item_width_gaps = `calc(calc(${width_multiplier} - 1) * ${$6dee9211e57ac31a$var$strip_percent_unit(spacing_to_use)})`; // Width of the gaps
+      const this_item_width = `calc(${this_item_width_meat} + ${this_item_width_gaps})`; // Width of this item including gaps
+      // this_item_width needs to be unitless, and since plain css can't do calc(40% / 5%) which would become unitless we need to strip all units in the calculations before
+      const convert_top_spacing_to_item_width_percentage = spacing => `calc(calc(100 / ${this_item_width}) * ${spacing})`; // Now finally we can convert the desired spacing to a percentage of this individual item's width (including gaps that would be there but aren't because content blocks span them)
+      spacing_styling = `column-gap:${spacing_to_use};`; // Still use gaps in the horizontal direction because that works flawlessly
+      // Re-use old layout code to get the correct :nth-child declarations for the top margins
+      additional_styling = $9HbP8$n_col_styling_with_dist(container_selector_ + ">", convert_top_spacing_to_item_width_percentage(default_grid_spacing_text), [[n_cols, min, max, grid_spacing_for_size ? convert_top_spacing_to_item_width_percentage(grid_spacing_for_size) : null]], "grid", override_vertical_spacing_ ? convert_top_spacing_to_item_width_percentage(override_vertical_spacing_) : override_vertical_spacing_, top_row_shortened_by_);
+    }
+    const media_query_body = `${container_selector_}{${spacing_styling}grid-template-columns:repeat(${n_cols},minmax(0,1fr));}`;
+    return `${$9HbP8$layout_media_query_header(min, max)}{${media_query_body}}${additional_styling}`;
+  }).join("");
+}
+function $6dee9211e57ac31a$var$can_use_gap_for_unit(spacing) {
+  const trimmed_spacing = spacing.trim();
+  return !trimmed_spacing.includes("%");
+}
+function $6dee9211e57ac31a$var$strip_percent_unit(css_value) {
+  return css_value.replaceAll("%", "");
+}
+function $15aa76e6da02e5c2$export$cb5808ba002cdeed({
+  layout_options_: layout_options_,
+  sort_or_filter_open_: sort_or_filter_open_
+}) {
+  return $9HbP8$createMemo(() => {
+    const layout_options = layout_options_();
+    // Add grid styling that changes when filters get opened/closed
+    const when_filters_closed_cols = layout_options.cols_at_size;
+    return sort_or_filter_open_() ? when_filters_closed_cols.map(row => {
+      const [num_cols_default,,,, override_cols] = row;
+      const cloned_row = [...row];
+      // @ts-ignore
+      cloned_row[0] = num_cols_default - 1;
+      if (override_cols)
+        // @ts-ignore
+        cloned_row[4] = {
+          overrides: Object.fromEntries(Object.entries(override_cols.overrides).map(([row, column]) => [row, column - 1]))
+        };
+      return cloned_row;
+    }) : when_filters_closed_cols;
+  });
+}
+function $bed740eef1769419$export$a79e666719b3647c(cols_at_size_) {
+  const size_active = $9HbP8$createMemo(() => cols_at_size_().map(([n_cols, min_width, max_width]) => {
+    const media_query = $9HbP8$layout_media_query_header(min_width, max_width).replaceAll("@media", "");
+    const matches = $dc9262ef6f786812$export$d9f36cf74e24d595(media_query);
+    return [matches, n_cols];
+  }));
+  const n_cols_currently_showing = $9HbP8$createMemo(() => {
+    try {
+      const [, n_cols_currently_showing] = size_active().find(([media_query]) => media_query());
+      return n_cols_currently_showing;
+    } catch (e) {
+      $9HbP8$dwarn("No active size found in columnsAtSize - can't render content blocks");
+      return null;
+    }
+  });
+  return n_cols_currently_showing;
+}
+function $7f60f09116a3fe61$export$3f37af283f8fb843(props) {
+  const style = $9HbP8$createMemo(() => {
+    const {
+      style: style,
+      height: height,
+      width: width,
+      aspectRatio: aspectRatio
+    } = props;
+    const is_image = aspectRatio != undefined;
+    const size_data = is_image ? {
+      width: "100%",
+      "padding-bottom": 1 / aspectRatio * 100 + "%"
+    } : {
+      width: width,
+      height: height
+    };
+    return {
+      display: "block",
+      ...(style || {}),
+      ...size_data
+    };
+  });
+  return $9HbP8$createComponent((0, $d20eff0aadc28983$export$acb3eaade4b23afd), {
+    get style() {
+      return style();
+    },
+    get ["class"]() {
+      return props.class;
+    }
+  });
+}
+const $e7a7eb102ddc0c79$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=content-block-wrapper>`);
+function $e7a7eb102ddc0c79$export$791ef57e62e21c3f({
+  content_blocks_: incoming_content_blocks,
+  cols_at_size_: cols_at_size_,
+  number_of_items_shown_: number_of_items_shown_,
+  set_top_row_shortened_by_: set_top_row_shortened_by_
+}) {
+  // these are by row
+  const [content_blocks, set_content_blocks] = $9HbP8$createStore([]);
+  const n_cols_currently_showing_ = $bed740eef1769419$export$a79e666719b3647c(cols_at_size_);
+  const products_to_rows = products => {
+    const cols_currently_showing = n_cols_currently_showing_();
+    if (cols_currently_showing === null) return 0;
+    return Math.ceil(products / cols_currently_showing);
+  };
+  const showing_rows = $9HbP8$createMemo(() => products_to_rows(number_of_items_shown_()));
+  $9HbP8$createEffect(() => {
+    const incoming_value = incoming_content_blocks();
+    if (!incoming_value) {
+      set_content_blocks([]);
+      return;
+    }
+    const capped_value = incoming_value.slice(0, showing_rows()); // Don't show more content blocks than we have rows
+    set_content_blocks($9HbP8$reconcile(capped_value, {
+      key: "content"
+    })); // key: Make moving blocks faster, see https://github.com/solidjs/solid/issues/1925#issuecomment-1769671596
+  });
+
+  const get_wrapped_blocks_ = $e7a7eb102ddc0c79$var$wrap_blocks_in_div(content_blocks, n_cols_currently_showing_);
+  $9HbP8$createComputed(() => {
+    // Update our styling if a content block forces some items that should be in the top row into a lower one, so we can generate margin-top declarations for them
+    const top_row_block = get_wrapped_blocks_()[0];
+    const blocks_in_top_row_taken = top_row_block?.span_columns;
+    if (blocks_in_top_row_taken == undefined) {
+      // Fall back to zero if no content block in top row, since then no blocks in top row are taken
+      set_top_row_shortened_by_(0);
+      return;
+    }
+    set_top_row_shortened_by_(blocks_in_top_row_taken - 1); // minus one because the content block wrapper also is an element
+  });
+
+  return $e7a7eb102ddc0c79$var$remap_blocks_to_index({
+    get_wrapped_blocks_: get_wrapped_blocks_,
+    n_cols_currently_showing_: n_cols_currently_showing_
+  });
+}
+/**
+ * Calculate where to put each of the finished wrapped content blocks. Also limit blocks' max width.
+ * @returns an array where index is index of the blocks in the "displays array" and value is the content block (elements) to show at that index
+ */
+function $e7a7eb102ddc0c79$var$remap_blocks_to_index({
+  get_wrapped_blocks_: get_wrapped_blocks_,
+  n_cols_currently_showing_: n_cols_currently_showing_
+}) {
+  return $9HbP8$createMemo(() => {
+    // This computation should be quite cheap since it just moves around things into an array
+    const content_blocks_by_index = [];
+    const constructed_block_arrays = new WeakSet();
+    const wrapped_blocks = get_wrapped_blocks_();
+    const cols_showing = n_cols_currently_showing_();
+    // Need to keep track of products displaced by blocks above when mapping rows to indexes in the actual grid
+    const displaced_products = []; // undefined = is product, true = is content block if number instead of tuple number indicates content blocks in that row. Index in first array is row, index in second array is column
+    for (let i = 0; i < wrapped_blocks.length; i++) {
+      // i = row to show at
+      const block = wrapped_blocks[i];
+      if (!block) continue; // Array can have holes/not defined places
+      const index_of_first_item_in_row = i * cols_showing;
+      const index_of_last_item_in_row = index_of_first_item_in_row + cols_showing;
+      const {
+        span_rows: span_rows,
+        position: position,
+        span_columns: span_columns
+      } = block; // span columns is already capped in the block wrapping step (wrap_blocks_in_div)
+      let target_index;
+      if (position === "left") target_index = index_of_first_item_in_row;else if (position === "right") target_index = index_of_last_item_in_row - span_columns;else if (position === "center") target_index = index_of_first_item_in_row + Math.floor((cols_showing - span_columns) / 2);else throw new Error("Invalid position for content block - must be left, right or center: " + JSON.stringify(position));
+      // Calculate displacement of us by content blocks above us
+      let displacement_by_added_blocks = 0;
+      for (let j = 0; j < i; j++) {
+        const row = displaced_products[j];
+        if (row === undefined) continue; // there were no blocks in this row
+        let items_in_row;
+        if (typeof row === "number") items_in_row = row;else {
+          items_in_row = row.filter(item => item).length;
+          displaced_products[j] = items_in_row;
+        }
+        displacement_by_added_blocks += items_in_row;
+      }
+      const index_of_us_in_row = target_index - index_of_first_item_in_row;
+      for (let j = 0; j < index_of_us_in_row; j++) if (displaced_products[i]?.[j])
+        // Add blocks in our *current* row to the displacement, but only the ones to our left
+        displacement_by_added_blocks++;
+      // Add block to output array at the correct index
+      const final_target_index = target_index - displacement_by_added_blocks;
+      const existing_block = content_blocks_by_index[final_target_index];
+      const block_content = block.content;
+      // If two blocks want to exist at the same location (can happen, for example if one block wants to be at the end of a row and the other one at the start of the next row) add an array with both
+      if (existing_block) {
+        if (constructed_block_arrays.has(existing_block))
+          // Only push to arrays we have created to not create funky bugs when there's an array in JSX.Element
+          existing_block.push(block_content);else {
+          const array = [existing_block, block_content];
+          constructed_block_arrays.add(array);
+          content_blocks_by_index[final_target_index] = array;
+        }
+      } else content_blocks_by_index[final_target_index] = block_content;
+      // Update displacement
+      for (let j = 0; j < span_rows; j++) {
+        const row = displaced_products[i + j] ||= [];
+        for (let k = index_of_us_in_row; k < index_of_us_in_row + span_columns; k++) row[k] = true;
+      }
+    }
+    return content_blocks_by_index;
+  });
+}
+/**
+ * Takes a store that contains an array from where index is number of row and value is the result of executing the content block rendering function.
+ * Then renders the content and wraps it into a div with the correct styling.
+ * Also caps span_columns to max available columns
+ */
+function $e7a7eb102ddc0c79$var$wrap_blocks_in_div(rendered_content_blocks, max_span_columns) {
+  const get_wrapped_blocks = $9HbP8$mapArray(() => rendered_content_blocks, block => {
+    if (!block) return;
+    const get_span_columns = () => Math.min(block.span_columns, max_span_columns() ?? Infinity);
+    return $9HbP8$mergeProps1(block, {
+      // Create content divs for the blocks with as much fine-grained diffing as possible?
+      content: (() => {
+        const _el$ = $9HbP8$getNextElement($e7a7eb102ddc0c79$var$_tmpl$);
+        $9HbP8$insert(_el$, $9HbP8$createComponent($e7a7eb102ddc0c79$var$RenderContent, {
+          get content() {
+            return block.content;
+          }
+        }));
+        $9HbP8$effect(_p$ => {
+          const _v$ = {
+              [(0, $6dee9211e57ac31a$export$c500183c31c2b22e)]: get_span_columns()
+            },
+            _v$2 = `span ${get_span_columns()}`,
+            _v$3 = `span ${block.span_rows}`;
+          _p$._v$ = $9HbP8$style(_el$, _v$, _p$._v$);
+          _v$2 !== _p$._v$2 && ((_p$._v$2 = _v$2) != null ? _el$.style.setProperty("grid-column", _v$2) : _el$.style.removeProperty("grid-column"));
+          _v$3 !== _p$._v$3 && ((_p$._v$3 = _v$3) != null ? _el$.style.setProperty("grid-row", _v$3) : _el$.style.removeProperty("grid-row"));
+          return _p$;
+        }, {
+          _v$: undefined,
+          _v$2: undefined,
+          _v$3: undefined
+        });
+        return _el$;
+      })(),
+      get span_columns() {
+        // Cap max width of block to the number of columns available, for everyone downstream
+        return get_span_columns();
+      }
+    });
+  });
+  return get_wrapped_blocks;
+}
+/**
+ * Basically adds support for async content block functions and shows a rudimentary placeholder if rendering is delayed. Required due to react having a rendering delay.
+ */
+function $e7a7eb102ddc0c79$var$RenderContent(props) {
+  const [resource] = $9HbP8$createResource(() => props.content,
+  // Could be reactive
+  fn => fn());
+  $9HbP8$createEffect(() => {
+    if (resource.error) console.error("Error in content block rendering", resource.error);
+  });
+  // The suspense is for when there's an async content block (which we have to support due to react having a rendering delay) so that we can show some height while it's loading (should kinda never be visible)
+  return $9HbP8$createComponent((0, $9HbP8$Suspense), {
+    get fallback() {
+      return $9HbP8$createComponent((0, $7f60f09116a3fe61$export$3f37af283f8fb843), {
+        width: "100%",
+        height: "max(100%, 400px)"
+      });
+    },
+    children: resource
+  });
+}
+const $2d25e42846eac370$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=PLP-results><!$><!/><!$><!/>`);
 function $2d25e42846eac370$export$3925f87b1545cfc6({
   plp_results_: plp_results_,
   depict_api_: depict_api_,
@@ -4637,7 +4996,8 @@ function $2d25e42846eac370$export$3925f87b1545cfc6({
   sort_or_filter_open_: sort_or_filter_open_,
   product_card_template_: product_card_template_,
   layout_options_: layout_options_,
-  id_currently_querying_for_: id_currently_querying_for_
+  id_currently_querying_for_: id_currently_querying_for_,
+  content_blocks_by_row_: content_blocks_by_row_
 }) {
   // The plp_results_ resource will be delayed because we're using createBatchedMemo to not make triplicate API requests, but we need to show the placeholders before already to match Chrome and Firefox's "content has to be there, ready for scroll restoration, before all popstate tasks have been completed"-requirement
   const is_loading_ = $9HbP8$createMemo(() => plp_results_.loading || query_base_.loading);
@@ -4684,20 +5044,33 @@ function $2d25e42846eac370$export$3925f87b1545cfc6({
             let is_just_after_plp_results_update = false;
             let fallback_is_alive = false;
             const [get_should_have_placeholders_rendered, set_should_have_placeholders_rendered] = $9HbP8$createSignal(true);
+            const [top_row_shortened_by_, set_top_row_shortened_by_] = $9HbP8$createSignal(0);
+            const [product_card_suspense_is_in_fallback, set_product_card_suspense_is_in_fallback] = $9HbP8$createSignal(false);
+            const [number_loaded_displays, set_number_loaded_displays_] = $9HbP8$createSignal(0);
+            const modified_cols_at_size = $15aa76e6da02e5c2$export$cb5808ba002cdeed({
+              layout_options_: layout_options_,
+              sort_or_filter_open_: sort_or_filter_open_
+            });
+            const num_placeholders_ = $9HbP8$createMemo(() => {
+              // Can't use the data out of request_base for the id because request_base is too late, we need the correct amount of placeholders before the browser has restored the scroll state after processing all popstate events
+              return (0, $7747fe1a8c5652e3$export$6c9030e511152266) + (get_scroll_restoration_data().find(({
+                for_id: for_id
+              }) => for_id === id_currently_querying_for_())?.min_results_loaded ?? min_products_to_fetch_);
+            });
+            const number_of_items_shown_ = $9HbP8$createMemo(() => is_loading_() || product_card_suspense_is_in_fallback() ? num_placeholders_() : number_loaded_displays());
+            const doesnt_have_content_blocks = $9HbP8$createMemo(() => !content_blocks_by_row_());
+            const content_blocks_ = $9HbP8$createMemo(() => doesnt_have_content_blocks() ? () => [] : $e7a7eb102ddc0c79$export$791ef57e62e21c3f({
+              content_blocks_: content_blocks_by_row_,
+              cols_at_size_: modified_cols_at_size,
+              number_of_items_shown_: number_of_items_shown_,
+              set_top_row_shortened_by_: set_top_row_shortened_by_
+            }));
             const rendered_placeholders = $9HbP8$createMemo(() => get_should_have_placeholders_rendered() ? $6e41f1fde994db72$export$f33414a4df0afd3f({
+              content_blocks_: content_blocks_,
               product_card_template_: product_card_template_,
-              num_placeholders_: $9HbP8$createMemo(() => {
-                // Can't use the data out of request_base for the id because request_base is too late, we need the correct amount of placeholders before the browser has restored the scroll state after processing all popstate events
-                return (0, $7747fe1a8c5652e3$export$6c9030e511152266) + (get_scroll_restoration_data().find(({
-                  for_id: for_id
-                }) => for_id === id_currently_querying_for_())?.min_results_loaded ?? min_products_to_fetch_);
-              })
+              num_placeholders_: num_placeholders_
             }) : undefined);
             const [get_suspense_is_blocked, set_suspense_is_blocked] = $9HbP8$createSignal(false);
-            const modified_cols_at_size = $2d25e42846eac370$var$make_modified_cols_at_size({
-              layout_options_: layout_options_,
-              sort_or_filter_open_: sort_or_filter_open_
-            });
             const block_suspense_if_needed = () => {
               if (!is_just_after_plp_results_update) return;
               is_just_after_plp_results_update = false;
@@ -4727,18 +5100,18 @@ function $2d25e42846eac370$export$3925f87b1545cfc6({
             */
             const product_cards_when_data = $9HbP8$createComponent((0, $9HbP8$Suspense), {
               get fallback() {
-                return (() => {
-                  fallback_is_alive = true;
-                  $9HbP8$onCleanup(block_suspense_if_needed); // Block suspense after initial run every time after we fetch
-                  return $9HbP8$createMemo(() => {
-                    // We need to be able to block the suspense since when async product cards are *rendering* we want to show the placeholders on initial load but not when loading more
-                    // In future we could have individual suspense's for each product card, but that's too much for now
-                    if (get_suspense_is_blocked()) return suspense_contents;
-                    set_should_have_placeholders_rendered(true); // just in case
-                    $9HbP8$onCleanup(() => set_should_have_placeholders_rendered(false));
-                    return rendered_placeholders; // I lifted the placeholders into the memo since we don't want to re-render them when switching from <Show> to <Suspense>
-                  });
-                })();
+                fallback_is_alive = true;
+                $9HbP8$onCleanup(block_suspense_if_needed); // Block suspense after initial run every time after we fetch
+                set_product_card_suspense_is_in_fallback(true); // Here for the content block code that needs to know how many items we're displaying
+                $9HbP8$onCleanup(() => set_product_card_suspense_is_in_fallback(false));
+                return $9HbP8$createMemo(() => {
+                  // We need to be able to block the suspense since when async product cards are *rendering* we want to show the placeholders on initial load but not when loading more
+                  // In future we could have individual suspense's for each product card, but that's too much for now
+                  if (get_suspense_is_blocked()) return suspense_contents;
+                  set_should_have_placeholders_rendered(true); // just in case
+                  $9HbP8$onCleanup(() => set_should_have_placeholders_rendered(false));
+                  return rendered_placeholders; // I lifted the placeholders into the memo since we don't want to re-render them when switching from <Show> to <Suspense>
+                });
               },
 
               get children() {
@@ -4754,37 +5127,64 @@ function $2d25e42846eac370$export$3925f87b1545cfc6({
                     min_products_to_fetch_: min_products_to_fetch_,
                     query_base_: query_base_,
                     depict_api_: depict_api_,
-                    is_loading_: is_loading_
+                    is_loading_: is_loading_,
+                    content_blocks_: content_blocks_,
+                    set_number_loaded_displays_: set_number_loaded_displays_
                   });
                   $9HbP8$onCleanup(() => suspense_contents = undefined);
                   return suspense_contents;
                 })();
               }
             });
-            return [$9HbP8$memo((0, $a458486f22b22f63$export$a2cc176055f8f08)), $9HbP8$createComponent((0, $c8d5ff4524619fcd$export$d21e32dfedac04be), {
-              get cols_at_size() {
-                return modified_cols_at_size();
+            /* This Show is so that we show placeholders while query_base is loading and because it's cumbersome to ensure that everything that directly accesses the plp_results_ resource is within the <Suspense> boundary */
+            const listing_contents = $9HbP8$createComponent((0, $9HbP8$Show), {
+              get when() {
+                return !is_loading_();
               },
-              get override_vertical_spacing() {
-                return layout_options_().override_vertical_spacing;
+              get fallback() {
+                return rendered_placeholders();
               },
-              get grid_spacing() {
-                return layout_options_().grid_spacing;
+              children: product_cards_when_data
+            });
+            return [$9HbP8$memo((0, $a458486f22b22f63$export$a2cc176055f8f08)), $9HbP8$createComponent((0, $9HbP8$Show), {
+              get when() {
+                return doesnt_have_content_blocks();
               },
-              rows: "all",
-              layout: "grid",
-              element_attributes: {
-                class: "cards"
+              get fallback() {
+                return $9HbP8$createComponent((0, $6dee9211e57ac31a$export$ab6b147eec64fea5), {
+                  get cols_at_size() {
+                    return modified_cols_at_size();
+                  },
+                  get override_vertical_spacing() {
+                    return layout_options_().override_vertical_spacing;
+                  },
+                  get grid_spacing() {
+                    return layout_options_().grid_spacing;
+                  },
+                  element_attributes: {
+                    class: "cards css-grid"
+                  },
+                  top_row_shortened_by_: top_row_shortened_by_,
+                  children: listing_contents
+                });
               },
               get children() {
-                return $9HbP8$createComponent((0, $9HbP8$Show), {
-                  get when() {
-                    return !is_loading_();
+                return $9HbP8$createComponent((0, $c8d5ff4524619fcd$export$d21e32dfedac04be), {
+                  get cols_at_size() {
+                    return modified_cols_at_size();
+                  },
+                  get override_vertical_spacing() {
+                    return layout_options_().override_vertical_spacing;
                   },
-                  get fallback() {
-                    return rendered_placeholders();
+                  get grid_spacing() {
+                    return layout_options_().grid_spacing;
                   },
-                  children: product_cards_when_data
+                  rows: "all",
+                  layout: "grid",
+                  element_attributes: {
+                    class: "cards"
+                  },
+                  children: listing_contents
                 });
               }
             })];
@@ -4797,36 +5197,10 @@ function $2d25e42846eac370$export$3925f87b1545cfc6({
     return _el$;
   })();
 }
-/**
- * Changes cols_at_size depending on if filters are open or not so one card less is shown when the filters are open
- * This function is special to the actual PLPResults.
- */
-function $2d25e42846eac370$var$make_modified_cols_at_size({
-  layout_options_: layout_options_,
-  sort_or_filter_open_: sort_or_filter_open_
-}) {
-  return $9HbP8$createMemo(() => {
-    const layout_options = layout_options_();
-    // Add grid styling that changes when filters get opened/closed
-    const when_filters_closed_cols = layout_options.cols_at_size;
-    return sort_or_filter_open_() ? when_filters_closed_cols.map(row => {
-      const [num_cols_default,,,, override_cols] = row;
-      const cloned_row = [...row];
-      // @ts-ignore
-      cloned_row[0] = num_cols_default - 1;
-      if (override_cols)
-        // @ts-ignore
-        cloned_row[4] = {
-          overrides: Object.fromEntries(Object.entries(override_cols.overrides).map(([row, column]) => [row, column - 1]))
-        };
-      return cloned_row;
-    }) : when_filters_closed_cols;
-  });
-}
-const $68a258a92b88f02f$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="sorting-attributes"></div>`, 2),
-  $68a258a92b88f02f$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="sorting-direction"></div>`, 2),
-  $68a258a92b88f02f$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<div><div class="input-row"><input type="radio"><span class="custom-indicator"></span><!#><!/></div></div>`, 9),
-  $68a258a92b88f02f$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<div><label class="input-row"><input type="radio"><span class="custom-indicator"></span><!#><!/></label></div>`, 9);
+const $68a258a92b88f02f$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=sorting-attributes>`),
+  $68a258a92b88f02f$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class=sorting-direction>`),
+  $68a258a92b88f02f$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<div><div class=input-row><input type=radio><span class=custom-indicator></span><!$><!/>`),
+  $68a258a92b88f02f$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<div><label class=input-row><input type=radio><span class=custom-indicator></span><!$><!/>`);
 function $68a258a92b88f02f$export$1f1775a58da589b5({
   available_sortings_: available_sortings_,
   current_sorting_: [get_current_sorting, set_current_sorting],
@@ -4850,7 +5224,7 @@ function $68a258a92b88f02f$export$1f1775a58da589b5({
             _el$7 = _el$6.nextSibling,
             _el$8 = _el$7.nextSibling,
             [_el$9, _co$] = $9HbP8$getNextMarker(_el$8.nextSibling);
-          _el$6.disabled = true;
+          $9HbP8$setProperty(_el$6, "disabled", true);
           $9HbP8$insert(_el$5, $9HbP8$createComponent((0, $d134eae24341b4a1$export$89c6019e4baa40b1), {
             height: "1.2em",
             width: "100%"
@@ -4885,7 +5259,7 @@ function $68a258a92b88f02f$export$1f1775a58da589b5({
                 $9HbP8$addEventListener(_el$12, "change", $9HbP8$catchify(() => set_current_sorting(item())));
                 $9HbP8$setAttribute(_el$12, "name", title_radio_name);
                 $9HbP8$insert(_el$11, () => item().meta.title, _el$15, _co$2);
-                $9HbP8$effect(() => _el$12.checked = is_checked());
+                $9HbP8$effect(() => $9HbP8$setProperty(_el$12, "checked", is_checked()));
                 return _el$10;
               })()
             );
@@ -4917,7 +5291,7 @@ function $68a258a92b88f02f$export$1f1775a58da589b5({
                 })));
                 $9HbP8$setAttribute(_el$18, "name", order_radio_name);
                 $9HbP8$insert(_el$17, () => meta_of_currently_selected_sorting_()?.names?.[index], _el$21, _co$3);
-                $9HbP8$effect(() => _el$18.checked = is_checked());
+                $9HbP8$effect(() => $9HbP8$setProperty(_el$18, "checked", is_checked()));
                 return _el$16;
               })();
             }
@@ -4964,7 +5338,7 @@ function $aea1edf92433e81e$export$fe334901e8bebd57() {
 // document.body.style.top = `-${from_top}px`;
 // document.body.style.overflowY = "scroll";
 
-const $e1bb71e65e01a3a0$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" class="sort-icon"><path d="M6.199 10.254a.35.35 0 0 0-.496 0L3.5 12.453V.348a.35.35 0 0 0-.7 0v12.105L.598 10.254c-.137-.137-.359-.137-.492 0a.35.35 0 0 0 0 .492l2.797 2.801a.35.35 0 0 0 .496 0L6.2 10.746c.137-.137.137-.355 0-.492zM9.449 3.5H8.051a.35.35 0 0 1-.352-.352V1.75c0-.191.156-.352.352-.352h1.398c.195 0 .352.16.352.352v1.398a.35.35 0 0 1-.352.352zm-1.051-.699h.703v-.699h-.703zm0 0"></path><path d="M10.852 6.301H8.051a.35.35 0 0 1-.352-.352V4.551a.35.35 0 0 1 .352-.352h2.801a.35.35 0 0 1 .348.352v1.398a.35.35 0 0 1-.348.352zm-2.453-.699H10.5v-.703H8.398zm3.851 3.5H8.051c-.195 0-.352-.16-.352-.352V7.352A.35.35 0 0 1 8.051 7h4.199c.191 0 .352.156.352.352V8.75c0 .191-.16.352-.352.352zm-3.852-.703h3.5V7.7h-3.5zm5.25 3.499H8.051a.35.35 0 0 1-.352-.348v-1.402a.35.35 0 0 1 .352-.348h5.598a.35.35 0 0 1 .352.348v1.402a.35.35 0 0 1-.352.348zm-5.25-.699H13.3V10.5H8.398zm0 0"></path></svg>`, 6);
+const $e1bb71e65e01a3a0$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns=http://www.w3.org/2000/svg width=14 height=14 class=sort-icon><path d="M6.199 10.254a.35.35 0 0 0-.496 0L3.5 12.453V.348a.35.35 0 0 0-.7 0v12.105L.598 10.254c-.137-.137-.359-.137-.492 0a.35.35 0 0 0 0 .492l2.797 2.801a.35.35 0 0 0 .496 0L6.2 10.746c.137-.137.137-.355 0-.492zM9.449 3.5H8.051a.35.35 0 0 1-.352-.352V1.75c0-.191.156-.352.352-.352h1.398c.195 0 .352.16.352.352v1.398a.35.35 0 0 1-.352.352zm-1.051-.699h.703v-.699h-.703zm0 0"></path><path d="M10.852 6.301H8.051a.35.35 0 0 1-.352-.352V4.551a.35.35 0 0 1 .352-.352h2.801a.35.35 0 0 1 .348.352v1.398a.35.35 0 0 1-.348.352zm-2.453-.699H10.5v-.703H8.398zm3.851 3.5H8.051c-.195 0-.352-.16-.352-.352V7.352A.35.35 0 0 1 8.051 7h4.199c.191 0 .352.156.352.352V8.75c0 .191-.16.352-.352.352zm-3.852-.703h3.5V7.7h-3.5zm5.25 3.499H8.051a.35.35 0 0 1-.352-.348v-1.402a.35.35 0 0 1 .352-.348h5.598a.35.35 0 0 1 .352.348v1.402a.35.35 0 0 1-.352.348zm-5.25-.699H13.3V10.5H8.398zm0 0">`);
 function $e1bb71e65e01a3a0$export$da32f7add8a22e86(props = {}) {
   return (() => {
     const _el$ = $9HbP8$getNextElement($e1bb71e65e01a3a0$var$_tmpl$);
@@ -4973,7 +5347,7 @@ function $e1bb71e65e01a3a0$export$da32f7add8a22e86(props = {}) {
     return _el$;
   })();
 }
-const $05fbe84eb34564ec$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" class="sort-icon"><path d="M6.199 10.254a.35.35 0 0 0-.496 0L3.5 12.453V.348a.35.35 0 0 0-.7 0v12.105L.598 10.254c-.137-.137-.359-.137-.492 0a.35.35 0 0 0 0 .492l2.797 2.801a.35.35 0 0 0 .496 0L6.2 10.746c.137-.137.137-.355 0-.492zm3.25 1.644H8.051a.35.35 0 0 1-.352-.348v-1.402a.35.35 0 0 1 .352-.348h1.398a.35.35 0 0 1 .352.348v1.402a.35.35 0 0 1-.352.348zm-1.051-.699h.703V10.5h-.703zm2.454-2.097H8.051c-.195 0-.352-.16-.352-.352V7.352A.35.35 0 0 1 8.051 7h2.801a.35.35 0 0 1 .348.352V8.75c0 .191-.156.352-.348.352zm-2.453-.703H10.5V7.7H8.398zm3.851-2.098H8.051a.35.35 0 0 1-.352-.352V4.551a.35.35 0 0 1 .352-.352h4.199c.191 0 .352.156.352.352v1.398c0 .195-.16.352-.352.352zm-3.852-.699h3.5v-.703h-3.5zm5.25-2.102H8.051a.35.35 0 0 1-.352-.352V1.75c0-.191.156-.352.352-.352h5.598c.195 0 .352.16.352.352v1.398a.35.35 0 0 1-.352.352zm-5.25-.699H13.3v-.699H8.398zm0 0"></path></svg>`, 4);
+const $05fbe84eb34564ec$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns=http://www.w3.org/2000/svg width=14 height=14 class=sort-icon><path d="M6.199 10.254a.35.35 0 0 0-.496 0L3.5 12.453V.348a.35.35 0 0 0-.7 0v12.105L.598 10.254c-.137-.137-.359-.137-.492 0a.35.35 0 0 0 0 .492l2.797 2.801a.35.35 0 0 0 .496 0L6.2 10.746c.137-.137.137-.355 0-.492zm3.25 1.644H8.051a.35.35 0 0 1-.352-.348v-1.402a.35.35 0 0 1 .352-.348h1.398a.35.35 0 0 1 .352.348v1.402a.35.35 0 0 1-.352.348zm-1.051-.699h.703V10.5h-.703zm2.454-2.097H8.051c-.195 0-.352-.16-.352-.352V7.352A.35.35 0 0 1 8.051 7h2.801a.35.35 0 0 1 .348.352V8.75c0 .191-.156.352-.348.352zm-2.453-.703H10.5V7.7H8.398zm3.851-2.098H8.051a.35.35 0 0 1-.352-.352V4.551a.35.35 0 0 1 .352-.352h4.199c.191 0 .352.156.352.352v1.398c0 .195-.16.352-.352.352zm-3.852-.699h3.5v-.703h-3.5zm5.25-2.102H8.051a.35.35 0 0 1-.352-.352V1.75c0-.191.156-.352.352-.352h5.598c.195 0 .352.16.352.352v1.398a.35.35 0 0 1-.352.352zm-5.25-.699H13.3v-.699H8.398zm0 0">`);
 function $05fbe84eb34564ec$export$d10e63059ddb9fd4(props = {}) {
   return (() => {
     const _el$ = $9HbP8$getNextElement($05fbe84eb34564ec$var$_tmpl$);
@@ -4982,7 +5356,7 @@ function $05fbe84eb34564ec$export$d10e63059ddb9fd4(props = {}) {
     return _el$;
   })();
 }
-const $b9bf7fce0ae60241$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns="http://www.w3.org/2000/svg" width="14" height="15" class="filter-icon"><path d="M1.75 14.697c-.096 0-.178-.034-.246-.103s-.103-.15-.103-.246V8.75c0-.096.034-.178.103-.246s.15-.103.246-.103.178.034.246.103.103.15.103.246v5.599c0 .096-.034.178-.103.246s-.15.103-.246.103zm0-9.796c-.096 0-.178-.034-.246-.103s-.103-.15-.103-.246v-3.5c0-.1.034-.185.103-.253s.15-.103.246-.103.178.034.246.103.103.153.103.253v3.5c0 .096-.034.178-.103.246s-.15.103-.246.103zm.697 2.796H1.053c-.292 0-.54-.103-.745-.308S0 6.938 0 6.651s.103-.54.308-.745.453-.308.745-.308h1.395c.292 0 .54.103.745.308s.308.453.308.745-.103.533-.308.738-.453.308-.745.308zM1.053 6.303c-.1 0-.185.034-.253.103s-.103.15-.103.246.034.178.103.246S.952 7 1.053 7h1.395c.1 0 .185-.034.253-.103s.103-.15.103-.246-.034-.178-.103-.246-.153-.103-.253-.103H1.053zm5.599 8.395c-.096 0-.178-.034-.246-.103s-.103-.15-.103-.246v-2.796c0-.1.034-.184.103-.253s.15-.102.246-.102.178.034.246.102.103.153.103.253v2.796c0 .096-.034.178-.103.246s-.15.103-.246.103zm0-7c-.096 0-.178-.034-.246-.103s-.103-.15-.103-.246V1.053c0-.1.034-.185.103-.253s.15-.103.246-.103.178.034.246.103S7 .952 7 1.053v6.296c0 .096-.034.178-.103.246s-.15.103-.246.103zm.697 2.803H5.947c-.287 0-.533-.102-.738-.308s-.308-.453-.308-.745.103-.533.308-.738.451-.308.738-.308h1.401c.292 0 .54.103.745.308s.308.451.308.738-.103.54-.308.745-.453.308-.745.308zM5.947 9.099c-.096 0-.178.034-.246.103s-.103.15-.103.246.034.185.103.253.15.103.246.103h1.401c.096 0 .178-.034.246-.103s.103-.153.103-.253-.034-.178-.103-.246-.15-.103-.246-.103H5.947zm5.605 5.599c-.1 0-.184-.034-.253-.103s-.102-.15-.102-.246v-7c0-.096.034-.178.102-.246S11.453 7 11.553 7s.178.034.246.103.103.15.103.246v7c0 .096-.034.178-.103.246s-.15.103-.246.103zm0-11.197c-.1 0-.184-.034-.253-.103s-.102-.15-.102-.246V1.053c0-.1.034-.185.102-.253s.153-.103.253-.103.178.034.246.103.103.153.103.253v2.099c0 .096-.034.178-.103.246s-.15.103-.246.103zm.697 2.803h-1.401c-.287 0-.533-.103-.738-.308s-.308-.453-.308-.745.103-.54.308-.745.451-.308.738-.308h1.401c.292 0 .54.103.745.308s.308.453.308.745-.102.54-.308.745-.453.308-.745.308zm-1.401-1.401c-.096 0-.178.034-.246.103s-.102.15-.102.246.034.178.102.246.15.103.246.103h1.401c.096 0 .178-.034.246-.103s.102-.15.102-.246-.034-.178-.102-.246-.15-.103-.246-.103h-1.401z"></path></svg>`, 4);
+const $b9bf7fce0ae60241$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns=http://www.w3.org/2000/svg width=14 height=15 class=filter-icon><path d="M1.75 14.697c-.096 0-.178-.034-.246-.103s-.103-.15-.103-.246V8.75c0-.096.034-.178.103-.246s.15-.103.246-.103.178.034.246.103.103.15.103.246v5.599c0 .096-.034.178-.103.246s-.15.103-.246.103zm0-9.796c-.096 0-.178-.034-.246-.103s-.103-.15-.103-.246v-3.5c0-.1.034-.185.103-.253s.15-.103.246-.103.178.034.246.103.103.153.103.253v3.5c0 .096-.034.178-.103.246s-.15.103-.246.103zm.697 2.796H1.053c-.292 0-.54-.103-.745-.308S0 6.938 0 6.651s.103-.54.308-.745.453-.308.745-.308h1.395c.292 0 .54.103.745.308s.308.453.308.745-.103.533-.308.738-.453.308-.745.308zM1.053 6.303c-.1 0-.185.034-.253.103s-.103.15-.103.246.034.178.103.246S.952 7 1.053 7h1.395c.1 0 .185-.034.253-.103s.103-.15.103-.246-.034-.178-.103-.246-.153-.103-.253-.103H1.053zm5.599 8.395c-.096 0-.178-.034-.246-.103s-.103-.15-.103-.246v-2.796c0-.1.034-.184.103-.253s.15-.102.246-.102.178.034.246.102.103.153.103.253v2.796c0 .096-.034.178-.103.246s-.15.103-.246.103zm0-7c-.096 0-.178-.034-.246-.103s-.103-.15-.103-.246V1.053c0-.1.034-.185.103-.253s.15-.103.246-.103.178.034.246.103S7 .952 7 1.053v6.296c0 .096-.034.178-.103.246s-.15.103-.246.103zm.697 2.803H5.947c-.287 0-.533-.102-.738-.308s-.308-.453-.308-.745.103-.533.308-.738.451-.308.738-.308h1.401c.292 0 .54.103.745.308s.308.451.308.738-.103.54-.308.745-.453.308-.745.308zM5.947 9.099c-.096 0-.178.034-.246.103s-.103.15-.103.246.034.185.103.253.15.103.246.103h1.401c.096 0 .178-.034.246-.103s.103-.153.103-.253-.034-.178-.103-.246-.15-.103-.246-.103H5.947zm5.605 5.599c-.1 0-.184-.034-.253-.103s-.102-.15-.102-.246v-7c0-.096.034-.178.102-.246S11.453 7 11.553 7s.178.034.246.103.103.15.103.246v7c0 .096-.034.178-.103.246s-.15.103-.246.103zm0-11.197c-.1 0-.184-.034-.253-.103s-.102-.15-.102-.246V1.053c0-.1.034-.185.102-.253s.153-.103.253-.103.178.034.246.103.103.153.103.253v2.099c0 .096-.034.178-.103.246s-.15.103-.246.103zm.697 2.803h-1.401c-.287 0-.533-.103-.738-.308s-.308-.453-.308-.745.103-.54.308-.745.451-.308.738-.308h1.401c.292 0 .54.103.745.308s.308.453.308.745-.102.54-.308.745-.453.308-.745.308zm-1.401-1.401c-.096 0-.178.034-.246.103s-.102.15-.102.246.034.178.102.246.15.103.246.103h1.401c.096 0 .178-.034.246-.103s.102-.15.102-.246-.034-.178-.102-.246-.15-.103-.246-.103h-1.401z">`);
 function $b9bf7fce0ae60241$export$28f6150e232898de() {
   return $9HbP8$getNextElement($b9bf7fce0ae60241$var$_tmpl$);
 }
@@ -4994,13 +5368,13 @@ function $b9bf7fce0ae60241$export$28f6150e232898de() {
 function $4cc1c021eee2a432$export$50f68cc9882e36a4(args_for_filtering) {
   return args_for_filtering.available_filters_()?.length === 0 && !args_for_filtering.selected_filters_[0]()?.length;
 }
-const $757dac7f7c6c5241$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<button class="clear minor"></button>`, 2),
-  $757dac7f7c6c5241$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="depict plp" id="depict-filter-sort-mobile-modal-container"><div class="depict-filter-sort-modal-backdrop"></div><button class="dismiss-modal"></button><div class="filter-sort-modal"><div class="body"><!#><!/><!#><!/></div><div class="bottom-row"><!#><!/><button class="show-results major"></button></div></div></div>`, 20),
-  $757dac7f7c6c5241$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<details class="sorting"></details>`, 2),
-  $757dac7f7c6c5241$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<summary class="sort-filter-summary"><div class="summary"><div class="left-els"><!#><!/><span></span></div><!#><!/></div></summary>`, 12),
-  $757dac7f7c6c5241$var$_tmpl$5 = /*#__PURE__*/$9HbP8$template(`<div class="body"></div>`, 2),
-  $757dac7f7c6c5241$var$_tmpl$6 = /*#__PURE__*/$9HbP8$template(`<details class="filters"></details>`, 2),
-  $757dac7f7c6c5241$var$_tmpl$7 = /*#__PURE__*/$9HbP8$template(`<b></b>`, 2);
+const $757dac7f7c6c5241$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<button class="clear minor">`),
+  $757dac7f7c6c5241$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="depict plp"id=depict-filter-sort-mobile-modal-container><div class=depict-filter-sort-modal-backdrop></div><button class=dismiss-modal></button><div class=filter-sort-modal><div class=body><!$><!/><!$><!/></div><div class=bottom-row><!$><!/><button class="show-results major">`),
+  $757dac7f7c6c5241$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<details class=sorting>`),
+  $757dac7f7c6c5241$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<summary class=sort-filter-summary><div class=summary><div class=left-els><!$><!/><span></span></div><!$><!/>`),
+  $757dac7f7c6c5241$var$_tmpl$5 = /*#__PURE__*/$9HbP8$template(`<div class=body>`),
+  $757dac7f7c6c5241$var$_tmpl$6 = /*#__PURE__*/$9HbP8$template(`<details class=filters>`),
+  $757dac7f7c6c5241$var$_tmpl$7 = /*#__PURE__*/$9HbP8$template(`<b>`);
 const $757dac7f7c6c5241$var$no_go_selector = ".range .range-group";
 function $757dac7f7c6c5241$export$9bf11afa910f536e({
   args_for_sorting_: args_for_sorting_,
@@ -5315,16 +5689,16 @@ function $757dac7f7c6c5241$export$9bf11afa910f536e({
   })()];
 }
 $9HbP8$delegateEvents(["click", "touchstart"]);
-const $11d594c749b76228$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14"><path d="M12.949 7.699H.352A.35.35 0 0 1 0 7.352.35.35 0 0 1 .352 7h12.598a.35.35 0 0 1 .352.352.35.35 0 0 1-.352.348zm0 0"></path></svg>`, 4);
+const $11d594c749b76228$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns=http://www.w3.org/2000/svg width=14 height=14><path d="M12.949 7.699H.352A.35.35 0 0 1 0 7.352.35.35 0 0 1 .352 7h12.598a.35.35 0 0 1 .352.352.35.35 0 0 1-.352.348zm0 0">`);
 function $11d594c749b76228$export$cb808a3c41736d8e() {
   return $9HbP8$getNextElement($11d594c749b76228$var$_tmpl$);
 }
-const $cdea4cf8c5c071ef$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="filters"><div class="body"></div></div>`, 4),
-  $cdea4cf8c5c071ef$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="sorting"><div class="body"></div></div>`, 4),
-  $cdea4cf8c5c071ef$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<div class="sort-and-filter-buttons"><div class="outer"><div class="inner"><!#><!/><!#><!/><!#><!/></div></div></div>`, 12),
-  $cdea4cf8c5c071ef$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<span class="num-filters"></span>`, 2),
-  $cdea4cf8c5c071ef$var$_tmpl$5 = /*#__PURE__*/$9HbP8$template(`<div class="open-filters-button-container"><!#><!/><button type="button"><!#><!/><span></span></button></div>`, 10),
-  $cdea4cf8c5c071ef$var$_tmpl$6 = /*#__PURE__*/$9HbP8$template(`<button class="toggle-button for-sorting major-minor-transition"><span></span><!#><!/></button>`, 6);
+const $cdea4cf8c5c071ef$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=filters><div class=body>`),
+  $cdea4cf8c5c071ef$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class=sorting><div class=body>`),
+  $cdea4cf8c5c071ef$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<div class=sort-and-filter-buttons><div class=outer><div class=inner><!$><!/><!$><!/><!$><!/>`),
+  $cdea4cf8c5c071ef$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<span class=num-filters>`),
+  $cdea4cf8c5c071ef$var$_tmpl$5 = /*#__PURE__*/$9HbP8$template(`<div class=open-filters-button-container><!$><!/><button type=button><!$><!/><span>`),
+  $cdea4cf8c5c071ef$var$_tmpl$6 = /*#__PURE__*/$9HbP8$template(`<button class="toggle-button for-sorting major-minor-transition"><span></span><!$><!/>`);
 function $cdea4cf8c5c071ef$export$d7841e452f2e59a8({
   current_sorting_: current_sorting_,
   set_extra_els_in_results_container_: set_extra_els_in_results_container_,
@@ -5643,11 +6017,11 @@ function $cdea4cf8c5c071ef$var$OpenSortingButton({
   })();
 }
 $9HbP8$delegateEvents(["click"]);
-const $f9182ab2348d1080$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14"><path d="M6.402.453L2.203 4.652a.35.35 0 0 0 0 .496c.137.137.359.137.492 0l3.605-3.605v11.406a.35.35 0 0 0 .348.352.35.35 0 0 0 .352-.352V1.543l3.602 3.605a.35.35 0 0 0 .496 0c.066-.07.102-.16.102-.25a.35.35 0 0 0-.102-.246L6.895.453c-.133-.137-.355-.137-.492 0zm0 0"></path></svg>`, 4);
+const $f9182ab2348d1080$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns=http://www.w3.org/2000/svg width=14 height=14><path d="M6.402.453L2.203 4.652a.35.35 0 0 0 0 .496c.137.137.359.137.492 0l3.605-3.605v11.406a.35.35 0 0 0 .348.352.35.35 0 0 0 .352-.352V1.543l3.602 3.605a.35.35 0 0 0 .496 0c.066-.07.102-.16.102-.25a.35.35 0 0 0-.102-.246L6.895.453c-.133-.137-.355-.137-.492 0zm0 0">`);
 function $f9182ab2348d1080$export$2624c5890f1bbcf7() {
   return $9HbP8$getNextElement($f9182ab2348d1080$var$_tmpl$);
 }
-const $0b0380f75d729d63$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="floating-buttons"><button class="filter"><div></div></button><button class="sort"><div></div></button><button class="up"><div></div></button></div>`, 14);
+const $0b0380f75d729d63$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=floating-buttons><button class=filter><div></div></button><button class=sort><div></div></button><button class=up><div>`);
 function $0b0380f75d729d63$export$b23abd26de154ede(props) {
   if (0, $9HbP8$isServer) return; // won't show in initial render and need scroll position
   const [is_small, set_is_small] = $9HbP8$createSignal(true);
@@ -5790,9 +6164,9 @@ function $0b0380f75d729d63$var$ActualFloatingButtons({
   })();
 }
 $9HbP8$delegateEvents(["click"]);
-const $dfa5b6f7c5e421df$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<nav class="crumbs"></nav>`, 2),
-  $dfa5b6f7c5e421df$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<a class="crumb"></a>`, 2),
-  $dfa5b6f7c5e421df$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<span class="separator"></span>`, 2);
+const $dfa5b6f7c5e421df$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<nav class=crumbs>`),
+  $dfa5b6f7c5e421df$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<a class=crumb>`),
+  $dfa5b6f7c5e421df$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<span class=separator>`);
 function $dfa5b6f7c5e421df$export$5646050d516e06bc({
   crumb_data_: get_api_crumb_data,
   router_: router_,
@@ -5862,9 +6236,9 @@ function $dfa5b6f7c5e421df$export$5646050d516e06bc({
   });
 }
 $9HbP8$delegateEvents(["click"]);
-const $06edf3aec9073663$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<nav class="quicklinks"></nav>`, 2),
-  $06edf3aec9073663$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div>QuickLinks failed</div>`, 2),
-  $06edf3aec9073663$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<a class="quicklink"></a>`, 2);
+const $06edf3aec9073663$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<nav class=quicklinks>`),
+  $06edf3aec9073663$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div>QuickLinks failed`),
+  $06edf3aec9073663$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<a class=quicklink>`);
 function $06edf3aec9073663$export$466cdc317043f6cb({
   quicklinks_data_: quicklinks_data_,
   router_: router_,
@@ -6265,8 +6639,8 @@ function $e7fce80abe608e01$var$clear_if_opened_new_tab_with_sideways_url_params_
   });
   tracking_function_for_plp_results(plp_results_);
 }
-const $9f5cb586f34c14e6$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="statement" style="white-space:pre-wrap">No category ID specified, this is probably unintentional. Make sure to create (and insert) the CategoryPage *after* you have specified a category ID in your Depict Provider.</div>`, 2),
-  $9f5cb586f34c14e6$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="buttons"><button class="ok major"></button></div>`, 4);
+const $9f5cb586f34c14e6$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=statement style=white-space:pre-wrap>No category ID specified, this is probably unintentional. Make sure to create (and insert) the CategoryPage *after* you have specified a category ID in your Depict Provider.`),
+  $9f5cb586f34c14e6$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class=buttons><button class="ok major">`);
 function $9f5cb586f34c14e6$export$d4fc5c0e68a52116(el, query_id_, i18n_) {
   if (!(0, $9HbP8$is_debug)) return; // Just to make sure we don't show this in production
   const owner = $9HbP8$getOwner();
@@ -6325,10 +6699,10 @@ function $2ab89d64b7f1d5ef$export$d31a1a1a83ad9413(plp_results_, [get_selected_f
       set_selected_filters(new_filters);
   });
 }
-const $df5d81d0fe61ff21$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="product-count"><!#><!/> <!#><!/></div>`, 6),
-  $df5d81d0fe61ff21$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div></div>`, 2),
-  $df5d81d0fe61ff21$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<div class="filter-results-for-one-row"><!#><!/><!#><!/></div>`, 6),
-  $df5d81d0fe61ff21$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<div class="depict plp category"><div class="listing-page"><!#><!/><!#><!/><!#><!/><!#><!/><!#><!/><!#><!/></div><!#><!/><!#><!/></div>`, 20);
+const $df5d81d0fe61ff21$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=product-count><!$><!/> <!$><!/>`),
+  $df5d81d0fe61ff21$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div>`),
+  $df5d81d0fe61ff21$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<div class=filter-results-for-one-row><!$><!/><!$><!/>`),
+  $df5d81d0fe61ff21$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<div class="depict plp category"><div class=listing-page><!$><!/><!$><!/><!$><!/><!$><!/><!$><!/><!$><!/></div><!$><!/><!$><!/>`);
 function $df5d81d0fe61ff21$export$f7d2f673fc2f091d({
   depict_api_: depict_api_,
   query_id_: query_id_,
@@ -6356,7 +6730,8 @@ function $df5d81d0fe61ff21$export$f7d2f673fc2f091d({
   product_card_template_: product_card_template_,
   sideways_filter_clearing_flag_: sideways_filter_clearing_flag_,
   sorting_query_param_: sorting_query_param_,
-  filter_query_param_prefix_: filter_query_param_prefix_
+  filter_query_param_prefix_: filter_query_param_prefix_,
+  content_blocks_by_row_: content_blocks_by_row_
 }) {
   let results_for;
   let only_show_filters_opener_;
@@ -6648,6 +7023,7 @@ function $df5d81d0fe61ff21$export$f7d2f673fc2f091d({
               product_card_template_: product_card_template_,
               sort_or_filter_open_: sort_or_filter_open_,
               desktop_filter_elements_: desktop_filter_elements_,
+              content_blocks_by_row_: content_blocks_by_row_,
               id_currently_querying_for_: query_id_,
               no_results_options_: {
                 selected_filters_: selected_filters_,
@@ -6939,7 +7315,7 @@ function $d8dbf52fea1773e2$export$f50b88e2a00918b5(fn) {
     }
   };
 }
-const $961b5c64bef4662f$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="depict plp category"></div>`, 2);
+const $961b5c64bef4662f$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="depict plp category">`);
 // We just pass page_url_creator to DepictAPI when we instantiate it, so don't allow it to be specified if api is already specified
 /**
  * Type for the private properties that are shared between the different exported search SDK wrapper functions.
@@ -7157,6 +7533,7 @@ function $961b5c64bef4662f$export$e2bf8ce7779e827e(props) {
       expanded_hierarchical_filters_: expanded_hierarchical_filters_,
       selected_filters_: selected_filters_,
       sideways_filter_clearing_flag_: sideways_filter_clearing_flag_,
+      content_blocks_by_row_: () => props.content_blocks_by_row,
       scroll_restoration_data_: scroll_restoration_data_,
       layout_options_: $9HbP8$createMemo(() => ({
         cols_at_size: $b5cccc8ee7d24677$export$6daf8749b65a1b77(props.cols_at_size),
@@ -7220,7 +7597,7 @@ function $961b5c64bef4662f$var$get_shared_properties(depict_category) {
   if (!shared_properties) throw new Error("Can't connect to provided DepictCategory instance");
   return shared_properties;
 }
-const $e4615ecd1849548f$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="category-title"><h1 class="title"></h1><span class="explanation"> — <!#><!/></span></div>`, 8);
+const $e4615ecd1849548f$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=category-title><h1 class=title></h1><span class=explanation> — <!$><!/>`);
 const $e4615ecd1849548f$export$b91cec6bdc6b32a1 = /*@__PURE__*/(() => {
   const actual_function = ({
     category_title_: category_title_,
@@ -7245,7 +7622,7 @@ const $e4615ecd1849548f$export$b91cec6bdc6b32a1 = /*@__PURE__*/(() => {
   actual_function[(0, $4fb3a1cf207a7d5c$export$5c28802497c8a83c)] = "simple";
   return actual_function;
 })();
-const $a6e23a834336fc19$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="sort-and-filter-buttons fake" aria-hidden="true" style="position:absolute;z-index:-1;pointer-events:none;opacity:0"><div class="outer"><div class="inner"><!#><!/><!#><!/><!#><!/></div></div></div>`, 12);
+const $a6e23a834336fc19$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="sort-and-filter-buttons fake"aria-hidden=true style=position:absolute;z-index:-1;pointer-events:none;opacity:0><div class=outer><div class=inner><!$><!/><!$><!/><!$><!/>`);
 const $a6e23a834336fc19$export$824dde41348efed1 = /*@__PURE__*/(() => {
   const actual_function = ({
     make_product_count_: make_product_count_,
@@ -7407,38 +7784,7 @@ async function $c9312089e8983364$var$download_categories(tenant, market, type) {
     return [];
   }
 }
-function $7f60f09116a3fe61$export$3f37af283f8fb843(props) {
-  const style = $9HbP8$createMemo(() => {
-    const {
-      style: style,
-      height: height,
-      width: width,
-      aspectRatio: aspectRatio
-    } = props;
-    const is_image = aspectRatio != undefined;
-    const size_data = is_image ? {
-      width: "100%",
-      "padding-bottom": 1 / aspectRatio * 100 + "%"
-    } : {
-      width: width,
-      height: height
-    };
-    return {
-      display: "block",
-      ...(style || {}),
-      ...size_data
-    };
-  });
-  return $9HbP8$createComponent((0, $d20eff0aadc28983$export$acb3eaade4b23afd), {
-    get style() {
-      return style();
-    },
-    get ["class"]() {
-      return props.class;
-    }
-  });
-}
-const $bb15dfb548a7666e$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="instant-card"><div class="img-part"></div><div class="right-part"><div class="title-brand-tagline"><span class="title"></span></div></div></div>`, 10);
+const $bb15dfb548a7666e$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=instant-card><div class=img-part></div><div class=right-part><div class=title-brand-tagline><span class=title>`);
 function $bb15dfb548a7666e$export$ee1733d9a8495996() {
   return (() => {
     const _el$ = $9HbP8$getNextElement($bb15dfb548a7666e$var$_tmpl$),
@@ -7456,8 +7802,8 @@ function $bb15dfb548a7666e$export$ee1733d9a8495996() {
     return _el$;
   })();
 }
-const $897bd4a76f611b38$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<span class="parent-title"></span>`, 2),
-  $897bd4a76f611b38$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<a class="category-suggestion"><span class="title"></span><!#><!/></a>`, 6);
+const $897bd4a76f611b38$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<span class=parent-title>`),
+  $897bd4a76f611b38$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<a class=category-suggestion><span class=title></span><!$><!/>`);
 function $897bd4a76f611b38$export$d757d54550ebfb3d({
   category_suggestion_: category_suggestion_,
   router_: router_
@@ -7491,11 +7837,11 @@ function $897bd4a76f611b38$export$d757d54550ebfb3d({
   })();
 }
 $9HbP8$delegateEvents(["click"]);
-const $22e59517c2ec94d3$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns="http://www.w3.org/2000/svg" width="24" height="16"><path d="M.773 7.371L7.98.176C8.098.059 8.238 0 8.402 0s.305.059.422.176S9 .434 9 .598s-.059.305-.176.422L2.648 7.195h19.547a.59.59 0 0 1 .609.609c0 .172-.059.305-.176.422s-.262.176-.434.176H2.648l6.176 6.176a.59.59 0 0 1 .176.426c0 .16-.059.301-.176.422-.055.059-.121.109-.199.137s-.148.039-.223.039-.156-.012-.234-.039a.54.54 0 0 1-.187-.137L.773 8.227c-.117-.117-.176-.258-.176-.422a.6.6 0 0 1 .176-.434zm0 0"></path></svg>`, 4);
+const $22e59517c2ec94d3$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns=http://www.w3.org/2000/svg width=24 height=16><path d="M.773 7.371L7.98.176C8.098.059 8.238 0 8.402 0s.305.059.422.176S9 .434 9 .598s-.059.305-.176.422L2.648 7.195h19.547a.59.59 0 0 1 .609.609c0 .172-.059.305-.176.422s-.262.176-.434.176H2.648l6.176 6.176a.59.59 0 0 1 .176.426c0 .16-.059.301-.176.422-.055.059-.121.109-.199.137s-.148.039-.223.039-.156-.012-.234-.039a.54.54 0 0 1-.187-.137L.773 8.227c-.117-.117-.176-.258-.176-.422a.6.6 0 0 1 .176-.434zm0 0">`);
 function $22e59517c2ec94d3$export$1c641004b5485fed() {
   return $9HbP8$getNextElement($22e59517c2ec94d3$var$_tmpl$);
 }
-const $16f0ed5ea30d8d9c$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg><path d="M19.811 20.174l-6.234-6.809a7.96 7.96 0 0 0 .923-1.179c.274-.424.502-.865.687-1.323a8.04 8.04 0 0 0 .42-1.436 7.88 7.88 0 0 0 .144-1.507c0-.526-.051-1.042-.154-1.548-.096-.506-.243-.995-.441-1.466s-.441-.919-.728-1.343a8.28 8.28 0 0 0-.984-1.21 7.86 7.86 0 0 0-1.2-.984A7.56 7.56 0 0 0 10.89.651C10.418.453 9.929.302 9.423.2S8.401.046 7.875.046 6.833.097 6.327.2 5.332.453 4.86.651a7.56 7.56 0 0 0-1.354.718c-.431.287-.831.615-1.2.984a8.28 8.28 0 0 0-.984 1.21 7.73 7.73 0 0 0-.728 1.343c-.198.472-.349.96-.451 1.466A8.31 8.31 0 0 0 0 7.921a8.31 8.31 0 0 0 .144 1.548c.103.506.253.995.451 1.466a8.08 8.08 0 0 0 .728 1.354 7.86 7.86 0 0 0 .984 1.2 7.54 7.54 0 0 0 1.2.995c.431.287.882.53 1.354.728.472.191.96.338 1.466.441a8.31 8.31 0 0 0 1.548.144c.451 0 .896-.038 1.333-.113a7.83 7.83 0 0 0 1.282-.328 7.55 7.55 0 0 0 1.2-.533 8.08 8.08 0 0 0 1.107-.749l6.245 6.809a.45.45 0 0 0 .174.123.55.55 0 0 0 .205.041.61.61 0 0 0 .195-.031c.061-.021.116-.055.164-.102.109-.096.164-.219.164-.369.007-.144-.038-.267-.133-.369zM1.046 7.921c0-.937.178-1.818.533-2.646.362-.834.851-1.559 1.466-2.174.622-.615 1.347-1.101 2.174-1.456.827-.362 1.712-.543 2.656-.543s1.829.181 2.656.543c.827.355 1.548.841 2.164 1.456.622.615 1.111 1.34 1.466 2.174a6.52 6.52 0 0 1 .543 2.646c0 .943-.181 1.829-.543 2.656a6.89 6.89 0 0 1-1.466 2.174c-.615.615-1.336 1.104-2.164 1.466-.827.356-1.712.533-2.656.533s-1.829-.178-2.656-.533c-.827-.362-1.552-.851-2.174-1.466-.615-.622-1.104-1.347-1.466-2.174-.355-.827-.533-1.712-.533-2.656z"></path></svg>`, 4);
+const $16f0ed5ea30d8d9c$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg><path d="M19.811 20.174l-6.234-6.809a7.96 7.96 0 0 0 .923-1.179c.274-.424.502-.865.687-1.323a8.04 8.04 0 0 0 .42-1.436 7.88 7.88 0 0 0 .144-1.507c0-.526-.051-1.042-.154-1.548-.096-.506-.243-.995-.441-1.466s-.441-.919-.728-1.343a8.28 8.28 0 0 0-.984-1.21 7.86 7.86 0 0 0-1.2-.984A7.56 7.56 0 0 0 10.89.651C10.418.453 9.929.302 9.423.2S8.401.046 7.875.046 6.833.097 6.327.2 5.332.453 4.86.651a7.56 7.56 0 0 0-1.354.718c-.431.287-.831.615-1.2.984a8.28 8.28 0 0 0-.984 1.21 7.73 7.73 0 0 0-.728 1.343c-.198.472-.349.96-.451 1.466A8.31 8.31 0 0 0 0 7.921a8.31 8.31 0 0 0 .144 1.548c.103.506.253.995.451 1.466a8.08 8.08 0 0 0 .728 1.354 7.86 7.86 0 0 0 .984 1.2 7.54 7.54 0 0 0 1.2.995c.431.287.882.53 1.354.728.472.191.96.338 1.466.441a8.31 8.31 0 0 0 1.548.144c.451 0 .896-.038 1.333-.113a7.83 7.83 0 0 0 1.282-.328 7.55 7.55 0 0 0 1.2-.533 8.08 8.08 0 0 0 1.107-.749l6.245 6.809a.45.45 0 0 0 .174.123.55.55 0 0 0 .205.041.61.61 0 0 0 .195-.031c.061-.021.116-.055.164-.102.109-.096.164-.219.164-.369.007-.144-.038-.267-.133-.369zM1.046 7.921c0-.937.178-1.818.533-2.646.362-.834.851-1.559 1.466-2.174.622-.615 1.347-1.101 2.174-1.456.827-.362 1.712-.543 2.656-.543s1.829.181 2.656.543c.827.355 1.548.841 2.164 1.456.622.615 1.111 1.34 1.466 2.174a6.52 6.52 0 0 1 .543 2.646c0 .943-.181 1.829-.543 2.656a6.89 6.89 0 0 1-1.466 2.174c-.615.615-1.336 1.104-2.164 1.466-.827.356-1.712.533-2.656.533s-1.829-.178-2.656-.533c-.827-.362-1.552-.851-2.174-1.466-.615-.622-1.104-1.347-1.466-2.174-.355-.827-.533-1.712-.533-2.656z">`);
 function $16f0ed5ea30d8d9c$export$82eafebb825fc23f(props = {}) {
   return (() => {
     const _el$ = $9HbP8$getNextElement($16f0ed5ea30d8d9c$var$_tmpl$);
@@ -7508,8 +7854,8 @@ function $16f0ed5ea30d8d9c$export$82eafebb825fc23f(props = {}) {
     return _el$;
   })();
 }
-const $5285d2814d0fac0c$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<button class="back" type="button"></button>`, 2),
-  $5285d2814d0fac0c$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="search-field"><!#><!/><div class="field"><input class="query" tabindex="0"><button type="button" class="clear"></button></div><button class="submit major" type="button"></button></div>`, 11);
+const $5285d2814d0fac0c$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<button class=back type=button>`),
+  $5285d2814d0fac0c$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class=search-field><!$><!/><div class=field><input class=query tabindex=0><button type=button class=clear></button></div><button class="submit major"type=button>`);
 function $5285d2814d0fac0c$export$b94867ecbd698f21({
   search_field_value_: search_field_value_,
   input_field_ref_: input_field_ref_,
@@ -7608,7 +7954,7 @@ function $5285d2814d0fac0c$export$b94867ecbd698f21({
       input_field_ref_?.(el);
     });
     typeof _ref$ === "function" && $9HbP8$use(_ref$, _el$4);
-    _el$4.classList.toggle("has-adjacent-back-button", !!on_back_);
+    _el$4.classList.toggle("has-adjacent-back-button", !!!!on_back_);
     $9HbP8$addEventListener(_el$5, "click", $9HbP8$catchify(() => {
       search_field_value_[1]("");
       clear_filters_(true);
@@ -7636,14 +7982,14 @@ function $5285d2814d0fac0c$export$b94867ecbd698f21({
       _v$4: undefined,
       _v$5: undefined
     });
-    $9HbP8$effect(() => _el$4.value = search_field_value_[0]());
+    $9HbP8$effect(() => $9HbP8$setProperty(_el$4, "value", search_field_value_[0]()));
     $9HbP8$runHydrationEvents();
     return _el$;
   })();
 }
 $9HbP8$delegateEvents(["click", "keydown", "input", "pointerdown"]);
-const $172e1b898d457050$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="search-recs"><h3 class="search-recs-title"></h3><!#><!/><!#><!/></div>`, 8),
-  $172e1b898d457050$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<button class="show-more major" type="button"></button>`, 2);
+const $172e1b898d457050$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=search-recs><h3 class=search-recs-title></h3><!$><!/><!$><!/>`),
+  $172e1b898d457050$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<button class="show-more major"type=button>`);
 const $172e1b898d457050$export$1c8c715550dc689d = 2;
 function $172e1b898d457050$export$7de92c4c2205ebf3({
   depict_api_: depict_api_,
@@ -7884,9 +8230,9 @@ async function $bfd908d13d90934c$export$e16630ecb9644a1c({
 const $c97b1f0e44afb9d2$export$27b710c08412a7ad = obj => {
   return Object.fromEntries(Object.keys(obj).map(key => [key, obj[key]()]));
 };
-const $e003be2a50d9e5bc$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<span class="orig price"><!#><!/><!#><!/><!#><!/></span>`, 8),
-  $e003be2a50d9e5bc$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<a class="instant-card"><div class="img-part"></div><div class="right-part"><div class="title-brand-tagline"><span class="brand"></span><span class="title line-clamp"></span><!#><!/></div><div class="price-container"><!#><!/><span class="price"><!#><!/><!#><!/><!#><!/></span></div></div></a>`, 26),
-  $e003be2a50d9e5bc$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<div class="tagline"></div>`, 2);
+const $e003be2a50d9e5bc$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<span class="orig price"><!$><!/><!$><!/><!$><!/>`),
+  $e003be2a50d9e5bc$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<a class=instant-card><div class=img-part></div><div class=right-part><div class=title-brand-tagline><span class=brand></span><span class="title line-clamp"></span><!$><!/></div><div class=price-container><!$><!/><span class=price><!$><!/><!$><!/><!$><!/>`),
+  $e003be2a50d9e5bc$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<div class=tagline>`);
 const $e003be2a50d9e5bc$export$b05c0ae390cf3e06 = (display_or_variant_container, {
   i18n: i18n
 }, router_) => {
@@ -8009,7 +8355,7 @@ const $e003be2a50d9e5bc$export$b05c0ae390cf3e06 = (display_or_variant_container,
   })();
 };
 $9HbP8$delegateEvents(["click"]);
-const $eea41f703612261b$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="instant-results"></div>`, 2);
+const $eea41f703612261b$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=instant-results>`);
 function $eea41f703612261b$export$62f101a8aa597bf8({
   depict_api_: depict_api_,
   search_field_value_: [get_search_field_value],
@@ -8102,8 +8448,8 @@ function $eea41f703612261b$export$62f101a8aa597bf8({
     return _el$;
   })();
 }
-const $4ceabea39c9a56ac$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div style="position:absolute;z-index:-1;pointer-events:none;width:100%;height:200%;top:-100%;"></div>`, 2),
-  $4ceabea39c9a56ac$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div style="position:absolute;z-index:-1;pointer-events:none;width:100%;height:200%;"></div>`, 2);
+const $4ceabea39c9a56ac$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div style=position:absolute;z-index:-1;pointer-events:none;width:100%;height:200%;top:-100%;>`),
+  $4ceabea39c9a56ac$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div style=position:absolute;z-index:-1;pointer-events:none;width:100%;height:200%;>`);
 function $4ceabea39c9a56ac$export$50b90be27d8502d9(el, [get_style_props, set_style_props], bottom_distance) {
   const overflow_style_beginning = "position:absolute;z-index:-1;pointer-events:none;width:100%;height:200%;";
   const upper_overflowing_box = $9HbP8$getNextElement($4ceabea39c9a56ac$var$_tmpl$);
@@ -8151,12 +8497,12 @@ function $a36cbc4f68bfd590$export$91c3b6774e8be0f5({
     return u_o.href;
   });
 }
-const $694b7f90501fea4c$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns="http://www.w3.org/2000/svg" width="12" height="13"><path d="M6 12.598a5.88 5.88 0 0 1-1.611-.223c-.52-.145-1.008-.352-1.465-.621s-.875-.605-1.254-.996-.693-.83-.955-1.318c-.039-.07-.047-.145-.023-.223s.072-.143.146-.182.145-.047.223-.023.143.072.182.146a5.54 5.54 0 0 0 .861 1.184c.34.352.715.65 1.125.897s.85.435 1.318.568A5.5 5.5 0 0 0 6 12a5.24 5.24 0 0 0 2.098-.422c.656-.285 1.229-.672 1.717-1.16s.879-1.061 1.16-1.717a5.22 5.22 0 0 0 .428-2.104c0-.742-.143-1.441-.428-2.098s-.668-1.229-1.16-1.717a5.42 5.42 0 0 0-1.717-1.154A5.18 5.18 0 0 0 6 1.201c-.496 0-.979.066-1.447.199s-.904.316-1.318.563-.785.539-1.125.891a5.31 5.31 0 0 0-.855 1.172.32.32 0 0 1-.164.141c-.066.023-.135.023-.205 0a.3.3 0 0 1-.158-.135C.691 3.965.682 3.895.697 3.82l.51-2.385c.016-.078.059-.141.129-.187a.28.28 0 0 1 .229-.041c.078.016.141.059.188.129a.28.28 0 0 1 .041.229l-.211.973a5.91 5.91 0 0 1 .926-.814 5.78 5.78 0 0 1 1.066-.609A5.79 5.79 0 0 1 4.746.732C5.156.643 5.574.598 6 .598c.402 0 .795.039 1.178.117s.76.191 1.119.34a5.95 5.95 0 0 1 1.031.551c.328.219.633.469.914.75s.535.592.75.92a5.77 5.77 0 0 1 .551 1.025 5.53 5.53 0 0 1 .34 1.119c.078.387.117.779.117 1.178s-.039.797-.117 1.184-.187.754-.34 1.113a5.96 5.96 0 0 1-.551 1.031 5.56 5.56 0 0 1-.75.914c-.281.285-.586.537-.914.756a5.95 5.95 0 0 1-1.031.551c-.359.148-.732.26-1.119.334s-.775.117-1.178.117zm0-5.695c-.023 0-.049-.004-.076-.012s-.047-.018-.07-.029l-2.701-1.5c-.07-.039-.117-.098-.141-.176a.29.29 0 0 1 .023-.229c.043-.074.104-.123.182-.146s.158-.014.229.029l2.543 1.412 3.152-2.004c.07-.047.145-.061.223-.041a.29.29 0 0 1 .188.135c.047.066.061.141.041.223a.27.27 0 0 1-.129.188L6.158 6.855a.27.27 0 0 1-.076.035c-.027.008-.055.012-.082.012z" fill="#0f0f0f"></path></svg>`, 4);
+const $694b7f90501fea4c$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns=http://www.w3.org/2000/svg width=12 height=13><path d="M6 12.598a5.88 5.88 0 0 1-1.611-.223c-.52-.145-1.008-.352-1.465-.621s-.875-.605-1.254-.996-.693-.83-.955-1.318c-.039-.07-.047-.145-.023-.223s.072-.143.146-.182.145-.047.223-.023.143.072.182.146a5.54 5.54 0 0 0 .861 1.184c.34.352.715.65 1.125.897s.85.435 1.318.568A5.5 5.5 0 0 0 6 12a5.24 5.24 0 0 0 2.098-.422c.656-.285 1.229-.672 1.717-1.16s.879-1.061 1.16-1.717a5.22 5.22 0 0 0 .428-2.104c0-.742-.143-1.441-.428-2.098s-.668-1.229-1.16-1.717a5.42 5.42 0 0 0-1.717-1.154A5.18 5.18 0 0 0 6 1.201c-.496 0-.979.066-1.447.199s-.904.316-1.318.563-.785.539-1.125.891a5.31 5.31 0 0 0-.855 1.172.32.32 0 0 1-.164.141c-.066.023-.135.023-.205 0a.3.3 0 0 1-.158-.135C.691 3.965.682 3.895.697 3.82l.51-2.385c.016-.078.059-.141.129-.187a.28.28 0 0 1 .229-.041c.078.016.141.059.188.129a.28.28 0 0 1 .041.229l-.211.973a5.91 5.91 0 0 1 .926-.814 5.78 5.78 0 0 1 1.066-.609A5.79 5.79 0 0 1 4.746.732C5.156.643 5.574.598 6 .598c.402 0 .795.039 1.178.117s.76.191 1.119.34a5.95 5.95 0 0 1 1.031.551c.328.219.633.469.914.75s.535.592.75.92a5.77 5.77 0 0 1 .551 1.025 5.53 5.53 0 0 1 .34 1.119c.078.387.117.779.117 1.178s-.039.797-.117 1.184-.187.754-.34 1.113a5.96 5.96 0 0 1-.551 1.031 5.56 5.56 0 0 1-.75.914c-.281.285-.586.537-.914.756a5.95 5.95 0 0 1-1.031.551c-.359.148-.732.26-1.119.334s-.775.117-1.178.117zm0-5.695c-.023 0-.049-.004-.076-.012s-.047-.018-.07-.029l-2.701-1.5c-.07-.039-.117-.098-.141-.176a.29.29 0 0 1 .023-.229c.043-.074.104-.123.182-.146s.158-.014.229.029l2.543 1.412 3.152-2.004c.07-.047.145-.061.223-.041a.29.29 0 0 1 .188.135c.047.066.061.141.041.223a.27.27 0 0 1-.129.188L6.158 6.855a.27.27 0 0 1-.076.035c-.027.008-.055.012-.082.012z"fill=#0f0f0f>`);
 function $694b7f90501fea4c$export$5d2caaa6b530761c() {
   return $9HbP8$getNextElement($694b7f90501fea4c$var$_tmpl$);
 }
-const $7ad3a93cbe6fa208$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="previous-searches"><h2 class="text"></h2><div class="list"></div></div>`, 6),
-  $7ad3a93cbe6fa208$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<a class="item"><div class="left"><!#><!/><span class="line-clamp"></span></div><button class="delete"></button></a>`, 10);
+const $7ad3a93cbe6fa208$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=previous-searches><h2 class=text></h2><div class=list>`),
+  $7ad3a93cbe6fa208$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<a class=item><div class=left><!$><!/><span class=line-clamp></span></div><button class=delete>`);
 function $7ad3a93cbe6fa208$export$a146ac6fa8346a25({
   text_: text_,
   previous_searches_: previous_searches_,
@@ -8259,8 +8605,8 @@ function $7ad3a93cbe6fa208$export$a146ac6fa8346a25({
     }
   });
 }
-const $f3213c0640246d58$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<span class="highlighted-part"></span>`, 2),
-  $f3213c0640246d58$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<span></span>`, 2);
+const $f3213c0640246d58$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<span class=highlighted-part>`),
+  $f3213c0640246d58$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<span>`);
 function $f3213c0640246d58$export$ba17c5b7e6dda39f({
   whole_text_to_display_: whole_text_to_display_memo,
   searching_for_value_: searching_for_value_memo,
@@ -8331,7 +8677,7 @@ function $f3213c0640246d58$export$ba17c5b7e6dda39f({
     return _el$2;
   })();
 }
-const $190927650b4840eb$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 256 256"><path d="M56 26.455a13.71 13.71 0 0 0-9.578 3.967A13.71 13.71 0 0 0 42.455 40v176a13.71 13.71 0 0 0 3.967 9.578A13.71 13.71 0 0 0 56 229.545h144A13.71 13.71 0 0 0 213.545 216V88a2.456 2.456 0 0 1 0-.002c.001-1.452-.597-2.895-1.623-3.922l-55.998-55.998a5.61 5.61 0 0 0-3.922-1.623 2.456 2.456 0 0 1-.002 0zm0 11.09h88A2.456 2.456 0 0 1 146.455 40v48c0 2.903 2.642 5.545 5.545 5.545h48A2.456 2.456 0 0 1 202.455 96v120a2.456 2.456 0 0 1-2.455 2.455H56A2.456 2.456 0 0 1 53.545 216V40A2.456 2.456 0 0 1 56 37.545zm103.061 11.498a2.456 2.456 0 0 1 2.676.531l28.689 28.689a2.456 2.456 0 0 1-1.736 4.191H160A2.456 2.456 0 0 1 157.545 80V51.311a2.456 2.456 0 0 1 1.516-2.268zM96 130.455c-2.903 0-5.545 2.642-5.545 5.545s2.642 5.545 5.545 5.545h64c2.903 0 5.545-2.642 5.545-5.545s-2.642-5.545-5.545-5.545zm0 32c-2.903 0-5.545 2.642-5.545 5.545s2.642 5.545 5.545 5.545h64c2.903 0 5.545-2.642 5.545-5.545s-2.642-5.545-5.545-5.545z"></path></svg>`, 4);
+const $190927650b4840eb$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<svg xmlns=http://www.w3.org/2000/svg width=32 height=32 viewBox="0 0 256 256"><path d="M56 26.455a13.71 13.71 0 0 0-9.578 3.967A13.71 13.71 0 0 0 42.455 40v176a13.71 13.71 0 0 0 3.967 9.578A13.71 13.71 0 0 0 56 229.545h144A13.71 13.71 0 0 0 213.545 216V88a2.456 2.456 0 0 1 0-.002c.001-1.452-.597-2.895-1.623-3.922l-55.998-55.998a5.61 5.61 0 0 0-3.922-1.623 2.456 2.456 0 0 1-.002 0zm0 11.09h88A2.456 2.456 0 0 1 146.455 40v48c0 2.903 2.642 5.545 5.545 5.545h48A2.456 2.456 0 0 1 202.455 96v120a2.456 2.456 0 0 1-2.455 2.455H56A2.456 2.456 0 0 1 53.545 216V40A2.456 2.456 0 0 1 56 37.545zm103.061 11.498a2.456 2.456 0 0 1 2.676.531l28.689 28.689a2.456 2.456 0 0 1-1.736 4.191H160A2.456 2.456 0 0 1 157.545 80V51.311a2.456 2.456 0 0 1 1.516-2.268zM96 130.455c-2.903 0-5.545 2.642-5.545 5.545s2.642 5.545 5.545 5.545h64c2.903 0 5.545-2.642 5.545-5.545s-2.642-5.545-5.545-5.545zm0 32c-2.903 0-5.545 2.642-5.545 5.545s2.642 5.545 5.545 5.545h64c2.903 0 5.545-2.642 5.545-5.545s-2.642-5.545-5.545-5.545z">`);
 function $190927650b4840eb$export$605674723bcc715c(props = {}) {
   return (() => {
     const _el$ = $9HbP8$getNextElement($190927650b4840eb$var$_tmpl$);
@@ -8340,15 +8686,15 @@ function $190927650b4840eb$export$605674723bcc715c(props = {}) {
     return _el$;
   })();
 }
-const $cea52f6b24092f05$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<a class="suggestion"></a>`, 2),
-  $cea52f6b24092f05$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="search-icon"></div>`, 2),
-  $cea52f6b24092f05$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<span class="type"></span>`, 2),
-  $cea52f6b24092f05$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<div class="with-parent-title"><!#><!/><span class="value line-clamp"></span></div>`, 6),
-  $cea52f6b24092f05$var$_tmpl$5 = /*#__PURE__*/$9HbP8$template(`<div class="with-icon"><!#><!/><!#><!/></div>`, 6),
-  $cea52f6b24092f05$var$_tmpl$6 = /*#__PURE__*/$9HbP8$template(`<h2 class="text"></h2>`, 2),
-  $cea52f6b24092f05$var$_tmpl$7 = /*#__PURE__*/$9HbP8$template(`<div class="suggestion-container query"><!#><!/><!#><!/></div>`, 6),
-  $cea52f6b24092f05$var$_tmpl$8 = /*#__PURE__*/$9HbP8$template(`<div class="suggestion-container page"></div>`, 2),
-  $cea52f6b24092f05$var$_tmpl$9 = /*#__PURE__*/$9HbP8$template(`<div class="suggestions"><!#><!/><!#><!/><!#><!/></div>`, 8);
+const $cea52f6b24092f05$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<a class=suggestion>`),
+  $cea52f6b24092f05$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class=search-icon>`),
+  $cea52f6b24092f05$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<span class=type>`),
+  $cea52f6b24092f05$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<div class=with-parent-title><!$><!/><span class="value line-clamp">`),
+  $cea52f6b24092f05$var$_tmpl$5 = /*#__PURE__*/$9HbP8$template(`<div class=with-icon><!$><!/><!$><!/>`),
+  $cea52f6b24092f05$var$_tmpl$6 = /*#__PURE__*/$9HbP8$template(`<h2 class=text>`),
+  $cea52f6b24092f05$var$_tmpl$7 = /*#__PURE__*/$9HbP8$template(`<div class="suggestion-container query"><!$><!/><!$><!/>`),
+  $cea52f6b24092f05$var$_tmpl$8 = /*#__PURE__*/$9HbP8$template(`<div class="suggestion-container page">`),
+  $cea52f6b24092f05$var$_tmpl$9 = /*#__PURE__*/$9HbP8$template(`<div class=suggestions><!$><!/><!$><!/><!$><!/>`);
 function $cea52f6b24092f05$export$e872e2339fb04a7f({
   suggestion_memo_: suggestion_memo_,
   search_query_url_param_name_: search_query_url_param_name_,
@@ -8606,7 +8952,7 @@ function $cea52f6b24092f05$export$e872e2339fb04a7f({
     }
   });
 }
-const $92a48aea6a9364d8$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<a target="_blank"></a>`, 2);
+const $92a48aea6a9364d8$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<a target=_blank>`);
 function $92a48aea6a9364d8$export$1efe1013da60d0e4(e, href) {
   if (e.metaKey || e.ctrlKey) {
     // Open link in a new tab with cmd/ctrl + enter.
@@ -8988,7 +9334,7 @@ const $926b1b5ba2239356$export$af8311b651139246 = css_properties => {
 const $926b1b5ba2239356$export$1233ca167bf71f9a = styles => {
   return Object.entries(styles).map(([selector, css_properties]) => `${selector} { ${$926b1b5ba2239356$export$af8311b651139246(css_properties)} }`).join(" ");
 };
-const $19f1f3e588d63502$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<style></style>`, 2);
+const $19f1f3e588d63502$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<style>`);
 function $19f1f3e588d63502$export$f021bdedd3ec901a(props) {
   const valid_css_string = $9HbP8$createMemo(() => {
     return $926b1b5ba2239356$export$1233ca167bf71f9a(props.styles());
@@ -8999,10 +9345,10 @@ function $19f1f3e588d63502$export$f021bdedd3ec901a(props) {
     return _el$;
   })();
 }
-const $fabfda1230351b1a$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="discover-more"><button class="major" type="button"></button></div>`, 4),
-  $fabfda1230351b1a$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<b></b>`, 2),
-  $fabfda1230351b1a$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<div class="depict-search-modal"><div class="body"><!#><!/><div class="padded"><!#><!/><!#><!/><!#><!/></div><!#><!/></div><!#><!/></div>`, 18),
-  $fabfda1230351b1a$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<div class="depict plp search"><div class="depict-search-modal-backdrop"></div><!#><!/></div>`, 6);
+const $fabfda1230351b1a$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=discover-more><button class=major type=button>`),
+  $fabfda1230351b1a$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<b>`),
+  $fabfda1230351b1a$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<div class=depict-search-modal><div class=body><!$><!/><div class=padded><!$><!/><!$><!/><!$><!/></div><!$><!/></div><!$><!/>`),
+  $fabfda1230351b1a$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<div class="depict plp search"><div class=depict-search-modal-backdrop></div><!$><!/>`);
 function $fabfda1230351b1a$export$1c593cbd6f1e10bc({
   search_field_value_: props_search_field_value,
   get_search_query_: get_search_query_,
@@ -9254,8 +9600,8 @@ function $fabfda1230351b1a$var$close_modal_when_navigating_away(close_modal, sea
   })();
 }
 $9HbP8$delegateEvents(["click"]);
-const $793905995512612d$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="category-suggestions"></div>`, 2),
-  $793905995512612d$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="category-suggestion"></div>`, 2);
+const $793905995512612d$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=category-suggestions>`),
+  $793905995512612d$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class=category-suggestion>`);
 function $793905995512612d$export$c05a196222ba1302({
   suggestions_: suggestions_,
   children: children
@@ -9299,8 +9645,8 @@ function $793905995512612d$export$c05a196222ba1302({
     }
   });
 }
-const $f8c929beb82c512b$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<b></b>`, 2),
-  $f8c929beb82c512b$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="results-for"></div>`, 2);
+const $f8c929beb82c512b$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<b>`),
+  $f8c929beb82c512b$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class=results-for>`);
 function $f8c929beb82c512b$export$9dd50d35b9d94fdf({
   get_search_query_: get_search_query_,
   i18n_: i18n_,
@@ -9349,7 +9695,7 @@ function $1801dbce7adb3f19$export$41b4894022a3580f({
   })));
   return style_props_;
 }
-const $522a690e0e2bd46d$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<span class="highlighted-part"></span>`, 2);
+const $522a690e0e2bd46d$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<span class=highlighted-part>`);
 const $522a690e0e2bd46d$var$dont_cut_in_between_less_than_characters = 30;
 function $522a690e0e2bd46d$export$e1a98a189fd2c0e7({
   content_result_: content_result_,
@@ -9569,10 +9915,10 @@ function $522a690e0e2bd46d$var$segment_text(text, matched_strings) {
   }
   return output;
 }
-const $b2bf2cdcff8142d8$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<a></a>`, 2),
-  $b2bf2cdcff8142d8$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div></div>`, 2),
-  $b2bf2cdcff8142d8$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<div class="description line-clamp"></div>`, 2),
-  $b2bf2cdcff8142d8$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<div class="content-card"><div class="image"></div><div class="info"><!#><!/><!#><!/></div></div>`, 10);
+const $b2bf2cdcff8142d8$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<a>`),
+  $b2bf2cdcff8142d8$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div>`),
+  $b2bf2cdcff8142d8$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<div class="description line-clamp">`),
+  $b2bf2cdcff8142d8$var$_tmpl$4 = /*#__PURE__*/$9HbP8$template(`<div class=content-card><div class=image></div><div class=info><!$><!/><!$><!/>`);
 function $b2bf2cdcff8142d8$export$f631859cab12b342({
   router_: router_,
   content_result_: content_result_
@@ -9725,9 +10071,9 @@ function $9d5b3ed1fc91c672$export$4405d077f0a20494({
     children: () => $9HbP8$createComponent((0, $b2bf2cdcff8142d8$export$f631859cab12b342), {})
   });
 }
-const $49de9d31aeea1b5e$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="content-results"><!#><!/><!#><!/></div>`, 6),
-  $49de9d31aeea1b5e$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<button class="view-more"></button>`, 2),
-  $49de9d31aeea1b5e$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<button class="view-less"></button>`, 2);
+const $49de9d31aeea1b5e$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=content-results><!$><!/><!$><!/>`),
+  $49de9d31aeea1b5e$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<button class=view-more>`),
+  $49de9d31aeea1b5e$var$_tmpl$3 = /*#__PURE__*/$9HbP8$template(`<button class=view-less>`);
 const $49de9d31aeea1b5e$export$70ceae36059a1036 = 1;
 function $49de9d31aeea1b5e$export$6d0c9c22f6652669({
   search_results_: search_results_,
@@ -9797,7 +10143,7 @@ function $49de9d31aeea1b5e$export$6d0c9c22f6652669({
         });
       }
     })), _el$5, _co$2);
-    $9HbP8$effect(() => _el$.style.setProperty("display", is_loading_() && placeholders_enabled() || content_results()?.length > 0 ? "" : "none"));
+    $9HbP8$effect(() => (is_loading_() && placeholders_enabled() || content_results()?.length, _el$.style.setProperty("display", is_loading_() && placeholders_enabled() || content_results()?.length > 0 ? "" : "none")));
     return _el$;
   })();
 }
@@ -9829,8 +10175,8 @@ function $49de9d31aeea1b5e$var$make_state_saved_rows(
   }));
   return rows;
 }
-const $7097477c78a89208$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="filter-results-for-one-row"><!#><!/><!#><!/></div>`, 6),
-  $7097477c78a89208$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="depict plp search"><div class="listing-page"><!#><!/><!#><!/><!#><!/><!#><!/><!#><!/><!#><!/><!#><!/></div><!#><!/><!#><!/></div>`, 22);
+const $7097477c78a89208$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class=filter-results-for-one-row><!$><!/><!$><!/>`),
+  $7097477c78a89208$var$_tmpl$2 = /*#__PURE__*/$9HbP8$template(`<div class="depict plp search"><div class=listing-page><!$><!/><!$><!/><!$><!/><!$><!/><!$><!/><!$><!/><!$><!/></div><!$><!/><!$><!/>`);
 function $7097477c78a89208$export$a54ec244c8863715({
   depict_api_: depict_api_,
   search_field_value_: search_field_value_,
@@ -9863,7 +10209,8 @@ function $7097477c78a89208$export$a54ec244c8863715({
   router_: router_,
   content_results_rows_: content_results_rows_,
   content_layout_options_: content_layout_options_,
-  content_search_enabled_: content_search_enabled_
+  content_search_enabled_: content_search_enabled_,
+  content_blocks_by_row_: content_blocks_by_row_
 }) {
   const [get_sorting] = current_sorting_;
   const all_products_loaded_ = $9HbP8$createSignal(false);
@@ -10142,6 +10489,7 @@ function $7097477c78a89208$export$a54ec244c8863715({
               layout_options_: layout_options_,
               sort_or_filter_open_: sort_or_filter_open_,
               id_currently_querying_for_: get_search_query_,
+              content_blocks_by_row_: content_blocks_by_row_,
               no_results_options_: {
                 selected_filters_: selected_filters_,
                 expanded_hierarchical_filters_: expanded_hierarchical_filters_,
@@ -10255,7 +10603,7 @@ function $1848f7cca286fbab$export$ff7109b9b2b206ba(sdk_cols_at_size, min_width_f
   sorted_sizes.unshift([1, min_width_for_more_than_one_column]);
   return sorted_sizes.map(([cols, max_width]) => max_width == Infinity ? [cols] : [cols, max_width]);
 }
-const $806c97b931758897$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="depict plp search"></div>`, 2);
+const $806c97b931758897$var$_tmpl$ = /*#__PURE__*/$9HbP8$template(`<div class="depict plp search">`);
 // We just pass page_url_creator to DepictAPI when we instantiate it, so don't allow it to be specified if api is already specified
 /**
  * Type for the private properties that are shared between the different exported search SDK wrapper functions.
@@ -10587,6 +10935,7 @@ function $806c97b931758897$export$f2dc7e4e4aa11abb(props) {
       search_sorting_open_: state_.sorting_open,
       expanded_filters_: state_.expanded_filters,
       content_results_rows_: state_.content_results_rows,
+      content_blocks_by_row_: () => props.content_blocks_by_row,
       router_: shared_properties.router_,
       make_category_suggestion_card_: shared_properties.enable_category_suggestions_ ? category_suggestion_ => {
         return $897bd4a76f611b38$export$d757d54550ebfb3d({