@depict-ai/ui 2.1.3 → 2.1.4

package/ES10/index.cjs

@@ -76,7 +76,7 @@ $parcel$export(module.exports, "defaultColsAtSize", () => $33eed84f447aa0c0$expo
 $parcel$export(module.exports, "defaultCategoryTitlePlugin", () => $33eed84f447aa0c0$export$7bf543b9d9be2c22);
 $parcel$export(module.exports, "version", () => $aa1938dec50d6c12$export$83d89fbfd8236492);
 /*! Depict.ai search and product listing SDK */
-const $aa1938dec50d6c12$export$83d89fbfd8236492 = "2.1.3";
+const $aa1938dec50d6c12$export$83d89fbfd8236492 = "2.1.4";
 const $a68b73fd7ba0853f$var$fallback_operator = "in";
 const $a68b73fd7ba0853f$var$fallback_token = "";
 const $a68b73fd7ba0853f$var$legacy_filter_prefix = "filter_";
@@ -5274,6 +5274,9 @@ function $f8f375d6245ffff2$var$remap_blocks_to_index(_ref2) {
     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
+    if (!cols_showing)
+      // Nope out of here if we don't know how many columns are showing
+      return content_blocks_by_index;
     for (let i = 0; i < wrapped_blocks.length; i++) {
       // i = row to show at
       const block = wrapped_blocks[i];
@@ -5338,10 +5341,12 @@ function $f8f375d6245ffff2$var$remap_blocks_to_index(_ref2) {
 function $f8f375d6245ffff2$var$wrap_blocks_in_div(rendered_content_blocks, max_span_columns) {
   const get_wrapped_blocks = $52FdA$solidjs.mapArray(() => rendered_content_blocks, block => {
     if (!block) return;
-    const get_span_columns = () => {
+    const final_span_columns = $52FdA$solidjs.createMemo(() => {
       var _max_span_columns;
       return Math.min(block.span_columns, (_max_span_columns = max_span_columns()) !== null && _max_span_columns !== void 0 ? _max_span_columns : Infinity);
-    };
+    });
+    // If the item spans an entire row, limit the height to 1 row since there's no concept of "rows" if there are no products beside the block
+    const final_span_rows = $52FdA$solidjs.createMemo(() => final_span_columns() === max_span_columns() ? 1 : block.span_rows);
     const [rendering_delayed, set_rendering_delayed_] = $52FdA$solidjs.createSignal(true);
     const content = $52FdA$solidjsweb.createComponent((0, $52FdA$solidjs.Show), {
       get when() {
@@ -5356,10 +5361,10 @@ function $f8f375d6245ffff2$var$wrap_blocks_in_div(rendered_content_blocks, max_s
         }));
         $52FdA$solidjsweb.effect(_p$ => {
           const _v$ = {
-              [(0, $830518481649feb1$export$c500183c31c2b22e)]: get_span_columns()
+              [(0, $830518481649feb1$export$c500183c31c2b22e)]: final_span_columns()
             },
-            _v$2 = "span ".concat(get_span_columns()),
-            _v$3 = "span ".concat(block.span_rows);
+            _v$2 = "span ".concat(final_span_columns()),
+            _v$3 = "span ".concat(final_span_rows());
           _p$._v$ = $52FdA$solidjsweb.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"));
@@ -5382,7 +5387,10 @@ function $f8f375d6245ffff2$var$wrap_blocks_in_div(rendered_content_blocks, max_s
       },
       get span_columns() {
         // Cap max width of block to the number of columns available, for everyone downstream
-        return get_span_columns();
+        return final_span_columns();
+      },
+      get span_rows() {
+        return final_span_rows();
       }
     });
   });

package/ES10/index.d.ts

@@ -7,7 +7,7 @@ import { CategorySuggestion, SearchSuggestionsResponse } from "@depict-ai/types/
 import { BaseSearchRequest } from "@depict-ai/types/api/BaseSearchRequest";
 import { SearchSuggestionsRequest } from "@depict-ai/types/api/SearchSuggestionsRequest";
 import { ProductListingRequestV2 } from "@depict-ai/types/api/ProductListingRequestV2";
-export const version = "2.1.3";
+export const version = "2.1.4";
 /**
  * Use `javascript_media_query` but return a reactive accessor instead of taking a callback function
  */

package/ES10/index.js

@@ -9,7 +9,7 @@ import { createStore as $8tj43$createStore, reconcile as $8tj43$reconcile } from
 /*! Depict.ai search and product listing SDK */
 import { register_es_version } from "../multi_import_deduplicator.mjs";
 register_es_version("ui", "ES10");
-const $8db9a15135765c11$export$83d89fbfd8236492 = "2.1.3";
+const $8db9a15135765c11$export$83d89fbfd8236492 = "2.1.4";
 const $2855bffe06ef7a03$var$fallback_operator = "in";
 const $2855bffe06ef7a03$var$fallback_token = "";
 const $2855bffe06ef7a03$var$legacy_filter_prefix = "filter_";
@@ -5207,6 +5207,9 @@ function $ff7feae4dddd6073$var$remap_blocks_to_index(_ref2) {
     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
+    if (!cols_showing)
+      // Nope out of here if we don't know how many columns are showing
+      return content_blocks_by_index;
     for (let i = 0; i < wrapped_blocks.length; i++) {
       // i = row to show at
       const block = wrapped_blocks[i];
@@ -5271,10 +5274,12 @@ function $ff7feae4dddd6073$var$remap_blocks_to_index(_ref2) {
 function $ff7feae4dddd6073$var$wrap_blocks_in_div(rendered_content_blocks, max_span_columns) {
   const get_wrapped_blocks = $8tj43$mapArray(() => rendered_content_blocks, block => {
     if (!block) return;
-    const get_span_columns = () => {
+    const final_span_columns = $8tj43$createMemo(() => {
       var _max_span_columns;
       return Math.min(block.span_columns, (_max_span_columns = max_span_columns()) !== null && _max_span_columns !== void 0 ? _max_span_columns : Infinity);
-    };
+    });
+    // If the item spans an entire row, limit the height to 1 row since there's no concept of "rows" if there are no products beside the block
+    const final_span_rows = $8tj43$createMemo(() => final_span_columns() === max_span_columns() ? 1 : block.span_rows);
     const [rendering_delayed, set_rendering_delayed_] = $8tj43$createSignal(true);
     const content = $8tj43$createComponent((0, $8tj43$Show), {
       get when() {
@@ -5289,10 +5294,10 @@ function $ff7feae4dddd6073$var$wrap_blocks_in_div(rendered_content_blocks, max_s
         }));
         $8tj43$effect(_p$ => {
           const _v$ = {
-              [(0, $64d94dcaa058dc7b$export$c500183c31c2b22e)]: get_span_columns()
+              [(0, $64d94dcaa058dc7b$export$c500183c31c2b22e)]: final_span_columns()
             },
-            _v$2 = "span ".concat(get_span_columns()),
-            _v$3 = "span ".concat(block.span_rows);
+            _v$2 = "span ".concat(final_span_columns()),
+            _v$3 = "span ".concat(final_span_rows());
           _p$._v$ = $8tj43$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"));
@@ -5315,7 +5320,10 @@ function $ff7feae4dddd6073$var$wrap_blocks_in_div(rendered_content_blocks, max_s
       },
       get span_columns() {
         // Cap max width of block to the number of columns available, for everyone downstream
-        return get_span_columns();
+        return final_span_columns();
+      },
+      get span_rows() {
+        return final_span_rows();
       }
     });
   });

package/latest/index.cjs

@@ -70,7 +70,7 @@ $parcel$export(module.exports, "defaultColsAtSize", () => $a3280f0aad997933$expo
 $parcel$export(module.exports, "defaultCategoryTitlePlugin", () => $a3280f0aad997933$export$7bf543b9d9be2c22);
 $parcel$export(module.exports, "version", () => $b757f75811f3261f$export$83d89fbfd8236492);
 /*! Depict.ai search and product listing SDK */
-const $b757f75811f3261f$export$83d89fbfd8236492 = "2.1.3";
+const $b757f75811f3261f$export$83d89fbfd8236492 = "2.1.4";
 const $1ab22f2cd39b3061$var$fallback_operator = "in";
 const $1ab22f2cd39b3061$var$fallback_token = "";
 const $1ab22f2cd39b3061$var$legacy_filter_prefix = "filter_";
@@ -4920,6 +4920,9 @@ function $d92f338ba8f9da9b$var$remap_blocks_to_index({
     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
+    if (!cols_showing)
+      // Nope out of here if we don't know how many columns are showing
+      return content_blocks_by_index;
     for (let i = 0; i < wrapped_blocks.length; i++) {
       // i = row to show at
       const block = wrapped_blocks[i];
@@ -4980,7 +4983,9 @@ function $d92f338ba8f9da9b$var$remap_blocks_to_index({
 function $d92f338ba8f9da9b$var$wrap_blocks_in_div(rendered_content_blocks, max_span_columns) {
   const get_wrapped_blocks = $gVhhF$solidjs.mapArray(() => rendered_content_blocks, block => {
     if (!block) return;
-    const get_span_columns = () => Math.min(block.span_columns, max_span_columns() ?? Infinity);
+    const final_span_columns = $gVhhF$solidjs.createMemo(() => Math.min(block.span_columns, max_span_columns() ?? Infinity));
+    // If the item spans an entire row, limit the height to 1 row since there's no concept of "rows" if there are no products beside the block
+    const final_span_rows = $gVhhF$solidjs.createMemo(() => final_span_columns() === max_span_columns() ? 1 : block.span_rows);
     const [rendering_delayed, set_rendering_delayed_] = $gVhhF$solidjs.createSignal(true);
     const content = $gVhhF$solidjsweb.createComponent((0, $gVhhF$solidjs.Show), {
       get when() {
@@ -4995,10 +5000,10 @@ function $d92f338ba8f9da9b$var$wrap_blocks_in_div(rendered_content_blocks, max_s
         }));
         $gVhhF$solidjsweb.effect(_p$ => {
           const _v$ = {
-              [(0, $75777da1687ba3f6$export$c500183c31c2b22e)]: get_span_columns()
+              [(0, $75777da1687ba3f6$export$c500183c31c2b22e)]: final_span_columns()
             },
-            _v$2 = `span ${get_span_columns()}`,
-            _v$3 = `span ${block.span_rows}`;
+            _v$2 = `span ${final_span_columns()}`,
+            _v$3 = `span ${final_span_rows()}`;
           _p$._v$ = $gVhhF$solidjsweb.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"));
@@ -5021,7 +5026,10 @@ function $d92f338ba8f9da9b$var$wrap_blocks_in_div(rendered_content_blocks, max_s
       },
       get span_columns() {
         // Cap max width of block to the number of columns available, for everyone downstream
-        return get_span_columns();
+        return final_span_columns();
+      },
+      get span_rows() {
+        return final_span_rows();
       }
     });
   });

package/latest/index.d.ts

@@ -7,7 +7,7 @@ import { CategorySuggestion, SearchSuggestionsResponse } from "@depict-ai/types/
 import { BaseSearchRequest } from "@depict-ai/types/api/BaseSearchRequest";
 import { SearchSuggestionsRequest } from "@depict-ai/types/api/SearchSuggestionsRequest";
 import { ProductListingRequestV2 } from "@depict-ai/types/api/ProductListingRequestV2";
-export const version = "2.1.3";
+export const version = "2.1.4";
 /**
  * Use `javascript_media_query` but return a reactive accessor instead of taking a callback function
  */

package/latest/index.js

@@ -6,7 +6,7 @@ import { createStore as $9HbP8$createStore, reconcile as $9HbP8$reconcile } from
 /*! 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.1.3";
+const $ec291e0010116877$export$83d89fbfd8236492 = "2.1.4";
 const $4147651646da990a$var$fallback_operator = "in";
 const $4147651646da990a$var$fallback_token = "";
 const $4147651646da990a$var$legacy_filter_prefix = "filter_";
@@ -4856,6 +4856,9 @@ function $e7a7eb102ddc0c79$var$remap_blocks_to_index({
     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
+    if (!cols_showing)
+      // Nope out of here if we don't know how many columns are showing
+      return content_blocks_by_index;
     for (let i = 0; i < wrapped_blocks.length; i++) {
       // i = row to show at
       const block = wrapped_blocks[i];
@@ -4916,7 +4919,9 @@ function $e7a7eb102ddc0c79$var$remap_blocks_to_index({
 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);
+    const final_span_columns = $9HbP8$createMemo(() => Math.min(block.span_columns, max_span_columns() ?? Infinity));
+    // If the item spans an entire row, limit the height to 1 row since there's no concept of "rows" if there are no products beside the block
+    const final_span_rows = $9HbP8$createMemo(() => final_span_columns() === max_span_columns() ? 1 : block.span_rows);
     const [rendering_delayed, set_rendering_delayed_] = $9HbP8$createSignal(true);
     const content = $9HbP8$createComponent((0, $9HbP8$Show), {
       get when() {
@@ -4931,10 +4936,10 @@ function $e7a7eb102ddc0c79$var$wrap_blocks_in_div(rendered_content_blocks, max_s
         }));
         $9HbP8$effect(_p$ => {
           const _v$ = {
-              [(0, $6dee9211e57ac31a$export$c500183c31c2b22e)]: get_span_columns()
+              [(0, $6dee9211e57ac31a$export$c500183c31c2b22e)]: final_span_columns()
             },
-            _v$2 = `span ${get_span_columns()}`,
-            _v$3 = `span ${block.span_rows}`;
+            _v$2 = `span ${final_span_columns()}`,
+            _v$3 = `span ${final_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"));
@@ -4957,7 +4962,10 @@ function $e7a7eb102ddc0c79$var$wrap_blocks_in_div(rendered_content_blocks, max_s
       },
       get span_columns() {
         // Cap max width of block to the number of columns available, for everyone downstream
-        return get_span_columns();
+        return final_span_columns();
+      },
+      get span_rows() {
+        return final_span_rows();
       }
     });
   });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@depict-ai/ui",
-  "version": "2.1.3",
+  "version": "2.1.4",
   "description": "Base package containing the actual UI of Depict UI along with translations, with a not-simplified API. We recommend using @depict-ai/js-ui or @depict-ai/react-ui instead.",
   "packageManager": "yarn@3.2.2",
   "sass": "styles.scss",

package/server/ES10/index.cjs

@@ -76,7 +76,7 @@ $parcel$export(module.exports, "defaultColsAtSize", () => $33eed84f447aa0c0$expo
 $parcel$export(module.exports, "defaultCategoryTitlePlugin", () => $33eed84f447aa0c0$export$7bf543b9d9be2c22);
 $parcel$export(module.exports, "version", () => $aa1938dec50d6c12$export$83d89fbfd8236492);
 /*! Depict.ai search and product listing SDK */
-const $aa1938dec50d6c12$export$83d89fbfd8236492 = "2.1.3";
+const $aa1938dec50d6c12$export$83d89fbfd8236492 = "2.1.4";
 const $a68b73fd7ba0853f$var$fallback_operator = "in";
 const $a68b73fd7ba0853f$var$fallback_token = "";
 const $a68b73fd7ba0853f$var$legacy_filter_prefix = "filter_";
@@ -4349,6 +4349,9 @@ function $f8f375d6245ffff2$var$remap_blocks_to_index(_ref2) {
     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
+    if (!cols_showing)
+      // Nope out of here if we don't know how many columns are showing
+      return content_blocks_by_index;
     for (let i = 0; i < wrapped_blocks.length; i++) {
       // i = row to show at
       const block = wrapped_blocks[i];
@@ -4413,17 +4416,19 @@ function $f8f375d6245ffff2$var$remap_blocks_to_index(_ref2) {
 function $f8f375d6245ffff2$var$wrap_blocks_in_div(rendered_content_blocks, max_span_columns) {
   const get_wrapped_blocks = $3hooq$solidjs.mapArray(() => rendered_content_blocks, block => {
     if (!block) return;
-    const get_span_columns = () => {
+    const final_span_columns = $3hooq$solidjs.createMemo(() => {
       var _max_span_columns;
       return Math.min(block.span_columns, (_max_span_columns = max_span_columns()) !== null && _max_span_columns !== void 0 ? _max_span_columns : Infinity);
-    };
+    });
+    // If the item spans an entire row, limit the height to 1 row since there's no concept of "rows" if there are no products beside the block
+    const final_span_rows = $3hooq$solidjs.createMemo(() => final_span_columns() === max_span_columns() ? 1 : block.span_rows);
     const [rendering_delayed, set_rendering_delayed_] = $3hooq$solidjs.createSignal(true);
     const content = $3hooq$solidjsweb.createComponent((0, $3hooq$solidjs.Show), {
       get when() {
         return !rendering_delayed();
       },
       get children() {
-        return $3hooq$solidjsweb.ssr($f8f375d6245ffff2$var$_tmpl$, $3hooq$solidjsweb.ssrHydrationKey(), "grid-column:" + "span ".concat($3hooq$solidjsweb.escape(get_span_columns(), true)) + (";grid-row:" + "span ".concat($3hooq$solidjsweb.escape(block.span_rows, true))) + (";spans_columns_variable_name:" + $3hooq$solidjsweb.escape(get_span_columns(), true)), $3hooq$solidjsweb.escape($3hooq$solidjsweb.createComponent($f8f375d6245ffff2$var$RenderContent, {
+        return $3hooq$solidjsweb.ssr($f8f375d6245ffff2$var$_tmpl$, $3hooq$solidjsweb.ssrHydrationKey(), "grid-column:" + "span ".concat($3hooq$solidjsweb.escape(final_span_columns(), true)) + (";grid-row:" + "span ".concat($3hooq$solidjsweb.escape(final_span_rows(), true))) + (";spans_columns_variable_name:" + $3hooq$solidjsweb.escape(final_span_columns(), true)), $3hooq$solidjsweb.escape($3hooq$solidjsweb.createComponent($f8f375d6245ffff2$var$RenderContent, {
           get content() {
             return block.content;
           }
@@ -4440,7 +4445,10 @@ function $f8f375d6245ffff2$var$wrap_blocks_in_div(rendered_content_blocks, max_s
       },
       get span_columns() {
         // Cap max width of block to the number of columns available, for everyone downstream
-        return get_span_columns();
+        return final_span_columns();
+      },
+      get span_rows() {
+        return final_span_rows();
       }
     });
   });

package/server/ES10/index.d.ts

@@ -7,7 +7,7 @@ import { CategorySuggestion, SearchSuggestionsResponse } from "@depict-ai/types/
 import { BaseSearchRequest } from "@depict-ai/types/api/BaseSearchRequest";
 import { SearchSuggestionsRequest } from "@depict-ai/types/api/SearchSuggestionsRequest";
 import { ProductListingRequestV2 } from "@depict-ai/types/api/ProductListingRequestV2";
-export const version = "2.1.3";
+export const version = "2.1.4";
 /**
  * Use `javascript_media_query` but return a reactive accessor instead of taking a callback function
  */

package/server/ES10/index.js

@@ -9,7 +9,7 @@ import { createStore as $b8hua$createStore, reconcile as $b8hua$reconcile } from
 /*! Depict.ai search and product listing SDK */
 import { register_es_version } from "../../multi_import_deduplicator.mjs";
 register_es_version("ui", "ES10");
-const $8db9a15135765c11$export$83d89fbfd8236492 = "2.1.3";
+const $8db9a15135765c11$export$83d89fbfd8236492 = "2.1.4";
 const $2855bffe06ef7a03$var$fallback_operator = "in";
 const $2855bffe06ef7a03$var$fallback_token = "";
 const $2855bffe06ef7a03$var$legacy_filter_prefix = "filter_";
@@ -4282,6 +4282,9 @@ function $ff7feae4dddd6073$var$remap_blocks_to_index(_ref2) {
     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
+    if (!cols_showing)
+      // Nope out of here if we don't know how many columns are showing
+      return content_blocks_by_index;
     for (let i = 0; i < wrapped_blocks.length; i++) {
       // i = row to show at
       const block = wrapped_blocks[i];
@@ -4346,17 +4349,19 @@ function $ff7feae4dddd6073$var$remap_blocks_to_index(_ref2) {
 function $ff7feae4dddd6073$var$wrap_blocks_in_div(rendered_content_blocks, max_span_columns) {
   const get_wrapped_blocks = $b8hua$mapArray(() => rendered_content_blocks, block => {
     if (!block) return;
-    const get_span_columns = () => {
+    const final_span_columns = $b8hua$createMemo(() => {
       var _max_span_columns;
       return Math.min(block.span_columns, (_max_span_columns = max_span_columns()) !== null && _max_span_columns !== void 0 ? _max_span_columns : Infinity);
-    };
+    });
+    // If the item spans an entire row, limit the height to 1 row since there's no concept of "rows" if there are no products beside the block
+    const final_span_rows = $b8hua$createMemo(() => final_span_columns() === max_span_columns() ? 1 : block.span_rows);
     const [rendering_delayed, set_rendering_delayed_] = $b8hua$createSignal(true);
     const content = $b8hua$createComponent((0, $b8hua$Show), {
       get when() {
         return !rendering_delayed();
       },
       get children() {
-        return $b8hua$ssr($ff7feae4dddd6073$var$_tmpl$, $b8hua$ssrHydrationKey(), "grid-column:" + "span ".concat($b8hua$escape(get_span_columns(), true)) + (";grid-row:" + "span ".concat($b8hua$escape(block.span_rows, true))) + (";spans_columns_variable_name:" + $b8hua$escape(get_span_columns(), true)), $b8hua$escape($b8hua$createComponent($ff7feae4dddd6073$var$RenderContent, {
+        return $b8hua$ssr($ff7feae4dddd6073$var$_tmpl$, $b8hua$ssrHydrationKey(), "grid-column:" + "span ".concat($b8hua$escape(final_span_columns(), true)) + (";grid-row:" + "span ".concat($b8hua$escape(final_span_rows(), true))) + (";spans_columns_variable_name:" + $b8hua$escape(final_span_columns(), true)), $b8hua$escape($b8hua$createComponent($ff7feae4dddd6073$var$RenderContent, {
           get content() {
             return block.content;
           }
@@ -4373,7 +4378,10 @@ function $ff7feae4dddd6073$var$wrap_blocks_in_div(rendered_content_blocks, max_s
       },
       get span_columns() {
         // Cap max width of block to the number of columns available, for everyone downstream
-        return get_span_columns();
+        return final_span_columns();
+      },
+      get span_rows() {
+        return final_span_rows();
       }
     });
   });

package/server/latest/index.cjs

@@ -70,7 +70,7 @@ $parcel$export(module.exports, "defaultColsAtSize", () => $a3280f0aad997933$expo
 $parcel$export(module.exports, "defaultCategoryTitlePlugin", () => $a3280f0aad997933$export$7bf543b9d9be2c22);
 $parcel$export(module.exports, "version", () => $b757f75811f3261f$export$83d89fbfd8236492);
 /*! Depict.ai search and product listing SDK */
-const $b757f75811f3261f$export$83d89fbfd8236492 = "2.1.3";
+const $b757f75811f3261f$export$83d89fbfd8236492 = "2.1.4";
 const $1ab22f2cd39b3061$var$fallback_operator = "in";
 const $1ab22f2cd39b3061$var$fallback_token = "";
 const $1ab22f2cd39b3061$var$legacy_filter_prefix = "filter_";
@@ -4032,6 +4032,9 @@ function $d92f338ba8f9da9b$var$remap_blocks_to_index({
     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
+    if (!cols_showing)
+      // Nope out of here if we don't know how many columns are showing
+      return content_blocks_by_index;
     for (let i = 0; i < wrapped_blocks.length; i++) {
       // i = row to show at
       const block = wrapped_blocks[i];
@@ -4092,14 +4095,16 @@ function $d92f338ba8f9da9b$var$remap_blocks_to_index({
 function $d92f338ba8f9da9b$var$wrap_blocks_in_div(rendered_content_blocks, max_span_columns) {
   const get_wrapped_blocks = $5vyXB$solidjs.mapArray(() => rendered_content_blocks, block => {
     if (!block) return;
-    const get_span_columns = () => Math.min(block.span_columns, max_span_columns() ?? Infinity);
+    const final_span_columns = $5vyXB$solidjs.createMemo(() => Math.min(block.span_columns, max_span_columns() ?? Infinity));
+    // If the item spans an entire row, limit the height to 1 row since there's no concept of "rows" if there are no products beside the block
+    const final_span_rows = $5vyXB$solidjs.createMemo(() => final_span_columns() === max_span_columns() ? 1 : block.span_rows);
     const [rendering_delayed, set_rendering_delayed_] = $5vyXB$solidjs.createSignal(true);
     const content = $5vyXB$solidjsweb.createComponent((0, $5vyXB$solidjs.Show), {
       get when() {
         return !rendering_delayed();
       },
       get children() {
-        return $5vyXB$solidjsweb.ssr($d92f338ba8f9da9b$var$_tmpl$, $5vyXB$solidjsweb.ssrHydrationKey(), "grid-column:" + `span ${$5vyXB$solidjsweb.escape(get_span_columns(), true)}` + (";grid-row:" + `span ${$5vyXB$solidjsweb.escape(block.span_rows, true)}`) + (";spans_columns_variable_name:" + $5vyXB$solidjsweb.escape(get_span_columns(), true)), $5vyXB$solidjsweb.escape($5vyXB$solidjsweb.createComponent($d92f338ba8f9da9b$var$RenderContent, {
+        return $5vyXB$solidjsweb.ssr($d92f338ba8f9da9b$var$_tmpl$, $5vyXB$solidjsweb.ssrHydrationKey(), "grid-column:" + `span ${$5vyXB$solidjsweb.escape(final_span_columns(), true)}` + (";grid-row:" + `span ${$5vyXB$solidjsweb.escape(final_span_rows(), true)}`) + (";spans_columns_variable_name:" + $5vyXB$solidjsweb.escape(final_span_columns(), true)), $5vyXB$solidjsweb.escape($5vyXB$solidjsweb.createComponent($d92f338ba8f9da9b$var$RenderContent, {
           get content() {
             return block.content;
           }
@@ -4116,7 +4121,10 @@ function $d92f338ba8f9da9b$var$wrap_blocks_in_div(rendered_content_blocks, max_s
       },
       get span_columns() {
         // Cap max width of block to the number of columns available, for everyone downstream
-        return get_span_columns();
+        return final_span_columns();
+      },
+      get span_rows() {
+        return final_span_rows();
       }
     });
   });

package/server/latest/index.d.ts

@@ -7,7 +7,7 @@ import { CategorySuggestion, SearchSuggestionsResponse } from "@depict-ai/types/
 import { BaseSearchRequest } from "@depict-ai/types/api/BaseSearchRequest";
 import { SearchSuggestionsRequest } from "@depict-ai/types/api/SearchSuggestionsRequest";
 import { ProductListingRequestV2 } from "@depict-ai/types/api/ProductListingRequestV2";
-export const version = "2.1.3";
+export const version = "2.1.4";
 /**
  * Use `javascript_media_query` but return a reactive accessor instead of taking a callback function
  */

package/server/latest/index.js

@@ -6,7 +6,7 @@ import { createStore as $i7OB2$createStore, reconcile as $i7OB2$reconcile } from
 /*! 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.1.3";
+const $ec291e0010116877$export$83d89fbfd8236492 = "2.1.4";
 const $4147651646da990a$var$fallback_operator = "in";
 const $4147651646da990a$var$fallback_token = "";
 const $4147651646da990a$var$legacy_filter_prefix = "filter_";
@@ -3968,6 +3968,9 @@ function $e7a7eb102ddc0c79$var$remap_blocks_to_index({
     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
+    if (!cols_showing)
+      // Nope out of here if we don't know how many columns are showing
+      return content_blocks_by_index;
     for (let i = 0; i < wrapped_blocks.length; i++) {
       // i = row to show at
       const block = wrapped_blocks[i];
@@ -4028,14 +4031,16 @@ function $e7a7eb102ddc0c79$var$remap_blocks_to_index({
 function $e7a7eb102ddc0c79$var$wrap_blocks_in_div(rendered_content_blocks, max_span_columns) {
   const get_wrapped_blocks = $i7OB2$mapArray(() => rendered_content_blocks, block => {
     if (!block) return;
-    const get_span_columns = () => Math.min(block.span_columns, max_span_columns() ?? Infinity);
+    const final_span_columns = $i7OB2$createMemo(() => Math.min(block.span_columns, max_span_columns() ?? Infinity));
+    // If the item spans an entire row, limit the height to 1 row since there's no concept of "rows" if there are no products beside the block
+    const final_span_rows = $i7OB2$createMemo(() => final_span_columns() === max_span_columns() ? 1 : block.span_rows);
     const [rendering_delayed, set_rendering_delayed_] = $i7OB2$createSignal(true);
     const content = $i7OB2$createComponent((0, $i7OB2$Show), {
       get when() {
         return !rendering_delayed();
       },
       get children() {
-        return $i7OB2$ssr($e7a7eb102ddc0c79$var$_tmpl$, $i7OB2$ssrHydrationKey(), "grid-column:" + `span ${$i7OB2$escape(get_span_columns(), true)}` + (";grid-row:" + `span ${$i7OB2$escape(block.span_rows, true)}`) + (";spans_columns_variable_name:" + $i7OB2$escape(get_span_columns(), true)), $i7OB2$escape($i7OB2$createComponent($e7a7eb102ddc0c79$var$RenderContent, {
+        return $i7OB2$ssr($e7a7eb102ddc0c79$var$_tmpl$, $i7OB2$ssrHydrationKey(), "grid-column:" + `span ${$i7OB2$escape(final_span_columns(), true)}` + (";grid-row:" + `span ${$i7OB2$escape(final_span_rows(), true)}`) + (";spans_columns_variable_name:" + $i7OB2$escape(final_span_columns(), true)), $i7OB2$escape($i7OB2$createComponent($e7a7eb102ddc0c79$var$RenderContent, {
           get content() {
             return block.content;
           }
@@ -4052,7 +4057,10 @@ function $e7a7eb102ddc0c79$var$wrap_blocks_in_div(rendered_content_blocks, max_s
       },
       get span_columns() {
         // Cap max width of block to the number of columns available, for everyone downstream
-        return get_span_columns();
+        return final_span_columns();
+      },
+      get span_rows() {
+        return final_span_rows();
       }
     });
   });