@depict-ai/react-ui 2.1.13 → 2.1.14

package/ES10/index.cjs

@@ -1,3 +1,4 @@
+"use client";
 var $2kiy7$depictaiutilishared = require("@depict-ai/utilishared/ES10");
 var $2kiy7$depictaiui = require("@depict-ai/ui/ES10");
 var $2kiy7$solidjs = require("solid-js");
@@ -38,7 +39,7 @@ $parcel$export(module.exports, "version", () => $efbdd2dab4314170$export$83d89fb
 $parcel$export(module.exports, "Navigation", () => $0d3a2413fdeb34b9$export$b8a61e5c71402559);
 /*! Depict.ai search and product listing react SDK wrapper */ // This is where the actual source of your React stuff should live
 // Note, if you add an export here, also add one in src-server/main.ts
-const $efbdd2dab4314170$export$83d89fbfd8236492 = "2.1.13";
+const $efbdd2dab4314170$export$83d89fbfd8236492 = "2.1.14";
 const $ef516b1f92253963$export$8e769ad4338a911e = {
   usedLocale: $2kiy7$solidjs.createSignal((0, $2kiy7$depictaiuilocales.defaultLocale)),
   search_instances: new Map(),
@@ -1029,4 +1030,4 @@ const $6bf91538dbdf0252$export$804fac5697cfbe35 = router => (relativeUrl, _ref)
 const $0d3a2413fdeb34b9$export$b8a61e5c71402559 = {
   nextRouterNavigation: $6bf91538dbdf0252$export$804fac5697cfbe35
 };
-$2kiy7$depictaiutilishared.add_to_version_info("react-ui", (0, $efbdd2dab4314170$export$83d89fbfd8236492));
+$2kiy7$depictaiutilishared.add_to_version_info("react-ui", (0, $efbdd2dab4314170$export$83d89fbfd8236492));

package/ES10/index.d.ts

@@ -3,7 +3,7 @@ import React, { PropsWithChildren, ReactNode, FC, ReactPortal, ReactElement } fr
 import { BaseProviderConfig, BaseSearchProviderConfig, BaseCategoryProviderConfig, ModernDisplayWithPageUrl, BaseProductListingConfig, BaseSearchPageConfig, BaseCategoryPageConfig, CategoryTitle, embedded_num_products, ImagePlaceholder as _ImagePlaceholder1, TextPlaceholder as _TextPlaceholder1, ExclusiveId, fetchDepictRecommendations } from "@depict-ai/ui/ES10";
 import { Locale } from "@depict-ai/ui/locales/ES10";
 import { Display, ModernDisplay } from "@depict-ai/utilishared/ES10";
-export const version = "2.1.13";
+export const version = "2.1.14";
 interface UsePerformanceClientReturn {
   dpc: DPC;
 }

package/ES10/index.js

@@ -1,3 +1,4 @@
+"use client";
 import { add_to_version_info as $jb2Oo$add_to_version_info, catchify as $jb2Oo$catchify, queueMacroTask as $jb2Oo$queueMacroTask, instant_exec_on_suspect_history_change as $jb2Oo$instant_exec_on_suspect_history_change, derror as $jb2Oo$derror, dwarn as $jb2Oo$dwarn } from "@depict-ai/utilishared/ES10";
 import { CategoryTitle as $383b6fd56bf151bd$re_export$CategoryTitle, embedded_num_products as $383b6fd56bf151bd$re_export$EmbeddedNumProducts, DepictAPI as $jb2Oo$DepictAPI, DepictSearch as $jb2Oo$DepictSearch, DepictCategory as $jb2Oo$DepictCategory, get_search_query_updating_blocked_signal as $jb2Oo$get_search_query_updating_blocked_signal, SearchPage as $jb2Oo$SearchPage, defaultColsAtSize as $jb2Oo$defaultColsAtSize, defaultGridSpacing as $jb2Oo$defaultGridSpacing, ProductCardError as $jb2Oo$ProductCardError, CategoryPage as $jb2Oo$CategoryPage, defaultCategoryTitlePlugin as $jb2Oo$defaultCategoryTitlePlugin, BreadCrumbs as $jb2Oo$BreadCrumbs, QuickLinks as $jb2Oo$QuickLinks, ImagePlaceholder as $jb2Oo$ImagePlaceholder, TextPlaceholder as $jb2Oo$TextPlaceholder, RecommendationSlider as $jb2Oo$RecommendationSlider, RecommendationGrid as $jb2Oo$RecommendationGrid, open_modal_with_alignment as $jb2Oo$open_modal_with_alignment, SearchField as $jb2Oo$SearchField, fetchDepictRecommendations as $jb2Oo$fetchDepictRecommendations } from "@depict-ai/ui/ES10";
 import { untrack as $jb2Oo$untrack, createRoot as $jb2Oo$createRoot, createEffect as $jb2Oo$createEffect, createMemo as $jb2Oo$createMemo, createComponent as $jb2Oo$createComponent, Show as $jb2Oo$Show, createSignal as $jb2Oo$createSignal, createComputed as $jb2Oo$createComputed, onCleanup as $jb2Oo$onCleanup, getOwner as $jb2Oo$getOwner, runWithOwner as $jb2Oo$runWithOwner, on as $jb2Oo$on, mapArray as $jb2Oo$mapArray } from "solid-js";
@@ -14,7 +15,7 @@ import { renderToString as $jb2Oo$renderToString } from "react-dom/server";
 // Note, if you add an export here, also add one in src-server/main.ts
 import { register_es_version } from "../multi_import_deduplicator.mjs";
 register_es_version("react-ui", "ES10");
-const $9bd9bb8700ab2ada$export$83d89fbfd8236492 = "2.1.13";
+const $9bd9bb8700ab2ada$export$83d89fbfd8236492 = "2.1.14";
 const $8c691d7f86317052$export$8e769ad4338a911e = {
   usedLocale: $jb2Oo$createSignal((0, $jb2Oo$defaultLocale)),
   search_instances: new Map(),
@@ -1006,4 +1007,4 @@ const $a7dfdd84298ae791$export$b8a61e5c71402559 = {
   nextRouterNavigation: $05726fa9c7eda0a1$export$804fac5697cfbe35
 };
 $jb2Oo$add_to_version_info("react-ui", (0, $9bd9bb8700ab2ada$export$83d89fbfd8236492));
-export { $c61814cfb91ead09$export$466cdc317043f6cb as QuickLinks, $ec632214ac078e79$export$5646050d516e06bc as BreadCrumbs, $f6a205a95e4fdee3$export$80e99ee6b29cadd2 as ComponentAligner, $18e5b9f66c7ade8e$export$9fac37a9c21c2f3b as DepictProvider, $e86a296a07b17ad5$export$f7d2f673fc2f091d as CategoryPage, $d059770e7af9e2dc$export$a54ec244c8863715 as SearchPage, $6406849926c3f794$export$3f37af283f8fb843 as ImagePlaceholder, $2c7738b65cbcac1c$export$89c6019e4baa40b1 as TextPlaceholder, $31abef71c0a2d3fc$export$b0a773486c1c2312 as RecommendationGrid, $c02e9fd51f31a1bd$export$82cfdc85a4d15688 as RecommendationSlider, $356d18d3ed66814e$export$912994940e660d32 as useSearchModal, $4c71282d292aac6d$export$9bb30bbe003b82e0 as useSearchField, $1895644749ca8d8a$export$6501da23a2770fc as useFetchRecommendations, $b34796f5ebe3470e$export$38b98fae14bd1f64 as usePerformanceClient, $383b6fd56bf151bd$re_export$CategoryTitle as CategoryTitle, $383b6fd56bf151bd$re_export$EmbeddedNumProducts as EmbeddedNumProducts, $9bd9bb8700ab2ada$export$83d89fbfd8236492 as version, $a7dfdd84298ae791$export$b8a61e5c71402559 as Navigation };
+export { $c61814cfb91ead09$export$466cdc317043f6cb as QuickLinks, $ec632214ac078e79$export$5646050d516e06bc as BreadCrumbs, $f6a205a95e4fdee3$export$80e99ee6b29cadd2 as ComponentAligner, $18e5b9f66c7ade8e$export$9fac37a9c21c2f3b as DepictProvider, $e86a296a07b17ad5$export$f7d2f673fc2f091d as CategoryPage, $d059770e7af9e2dc$export$a54ec244c8863715 as SearchPage, $6406849926c3f794$export$3f37af283f8fb843 as ImagePlaceholder, $2c7738b65cbcac1c$export$89c6019e4baa40b1 as TextPlaceholder, $31abef71c0a2d3fc$export$b0a773486c1c2312 as RecommendationGrid, $c02e9fd51f31a1bd$export$82cfdc85a4d15688 as RecommendationSlider, $356d18d3ed66814e$export$912994940e660d32 as useSearchModal, $4c71282d292aac6d$export$9bb30bbe003b82e0 as useSearchField, $1895644749ca8d8a$export$6501da23a2770fc as useFetchRecommendations, $b34796f5ebe3470e$export$38b98fae14bd1f64 as usePerformanceClient, $383b6fd56bf151bd$re_export$CategoryTitle as CategoryTitle, $383b6fd56bf151bd$re_export$EmbeddedNumProducts as EmbeddedNumProducts, $9bd9bb8700ab2ada$export$83d89fbfd8236492 as version, $a7dfdd84298ae791$export$b8a61e5c71402559 as Navigation };

package/latest/index.cjs

@@ -1,3 +1,4 @@
+"use client";
 var $2IzJs$depictaiutilishared = require("@depict-ai/utilishared/latest");
 var $2IzJs$depictaiui = require("@depict-ai/ui/latest");
 var $2IzJs$solidjs = require("solid-js");
@@ -38,7 +39,7 @@ $parcel$export(module.exports, "version", () => $db7b67857900028b$export$83d89fb
 $parcel$export(module.exports, "Navigation", () => $b742053c966024b4$export$b8a61e5c71402559);
 /*! Depict.ai search and product listing react SDK wrapper */ // This is where the actual source of your React stuff should live
 // Note, if you add an export here, also add one in src-server/main.ts
-const $db7b67857900028b$export$83d89fbfd8236492 = "2.1.13";
+const $db7b67857900028b$export$83d89fbfd8236492 = "2.1.14";
 const $0b7cd4fb39fc3502$export$8e769ad4338a911e = {
   usedLocale: $2IzJs$solidjs.createSignal((0, $2IzJs$depictaiuilocales.defaultLocale)),
   search_instances: new Map(),
@@ -987,4 +988,4 @@ const $e387bd534de10acd$export$804fac5697cfbe35 = router => (relativeUrl, {
 const $b742053c966024b4$export$b8a61e5c71402559 = {
   nextRouterNavigation: $e387bd534de10acd$export$804fac5697cfbe35
 };
-$2IzJs$depictaiutilishared.add_to_version_info("react-ui", (0, $db7b67857900028b$export$83d89fbfd8236492));
+$2IzJs$depictaiutilishared.add_to_version_info("react-ui", (0, $db7b67857900028b$export$83d89fbfd8236492));

package/latest/index.d.ts

@@ -3,7 +3,7 @@ import React, { PropsWithChildren, ReactNode, FC, ReactPortal, ReactElement } fr
 import { BaseProviderConfig, BaseSearchProviderConfig, BaseCategoryProviderConfig, ModernDisplayWithPageUrl, BaseProductListingConfig, BaseSearchPageConfig, BaseCategoryPageConfig, CategoryTitle, embedded_num_products, ImagePlaceholder as _ImagePlaceholder1, TextPlaceholder as _TextPlaceholder1, ExclusiveId, fetchDepictRecommendations } from "@depict-ai/ui/latest";
 import { Locale } from "@depict-ai/ui/locales/latest";
 import { Display, ModernDisplay } from "@depict-ai/utilishared/latest";
-export const version = "2.1.13";
+export const version = "2.1.14";
 interface UsePerformanceClientReturn {
   dpc: DPC;
 }

package/latest/index.js

@@ -1,3 +1,4 @@
+"use client";
 import { add_to_version_info as $2GFvs$add_to_version_info, catchify as $2GFvs$catchify, queueMacroTask as $2GFvs$queueMacroTask, instant_exec_on_suspect_history_change as $2GFvs$instant_exec_on_suspect_history_change, derror as $2GFvs$derror, dwarn as $2GFvs$dwarn } from "@depict-ai/utilishared/latest";
 import { CategoryTitle as $43099132aad1ceb6$re_export$CategoryTitle, embedded_num_products as $43099132aad1ceb6$re_export$EmbeddedNumProducts, DepictAPI as $2GFvs$DepictAPI, DepictSearch as $2GFvs$DepictSearch, DepictCategory as $2GFvs$DepictCategory, get_search_query_updating_blocked_signal as $2GFvs$get_search_query_updating_blocked_signal, SearchPage as $2GFvs$SearchPage, defaultColsAtSize as $2GFvs$defaultColsAtSize, defaultGridSpacing as $2GFvs$defaultGridSpacing, ProductCardError as $2GFvs$ProductCardError, CategoryPage as $2GFvs$CategoryPage, defaultCategoryTitlePlugin as $2GFvs$defaultCategoryTitlePlugin, BreadCrumbs as $2GFvs$BreadCrumbs, QuickLinks as $2GFvs$QuickLinks, ImagePlaceholder as $2GFvs$ImagePlaceholder, TextPlaceholder as $2GFvs$TextPlaceholder, RecommendationSlider as $2GFvs$RecommendationSlider, RecommendationGrid as $2GFvs$RecommendationGrid, open_modal_with_alignment as $2GFvs$open_modal_with_alignment, SearchField as $2GFvs$SearchField, fetchDepictRecommendations as $2GFvs$fetchDepictRecommendations } from "@depict-ai/ui/latest";
 import { untrack as $2GFvs$untrack, createRoot as $2GFvs$createRoot, createEffect as $2GFvs$createEffect, createMemo as $2GFvs$createMemo, createComponent as $2GFvs$createComponent, Show as $2GFvs$Show, createSignal as $2GFvs$createSignal, createComputed as $2GFvs$createComputed, onCleanup as $2GFvs$onCleanup, getOwner as $2GFvs$getOwner, runWithOwner as $2GFvs$runWithOwner, on as $2GFvs$on, mapArray as $2GFvs$mapArray } from "solid-js";
@@ -14,7 +15,7 @@ import { renderToString as $2GFvs$renderToString } from "react-dom/server";
 // Note, if you add an export here, also add one in src-server/main.ts
 import { register_es_version } from "../multi_import_deduplicator.mjs";
 register_es_version("react-ui", "latest");
-const $c9c4d066f9a5b51b$export$83d89fbfd8236492 = "2.1.13";
+const $c9c4d066f9a5b51b$export$83d89fbfd8236492 = "2.1.14";
 const $42858f023ef23dab$export$8e769ad4338a911e = {
   usedLocale: $2GFvs$createSignal((0, $2GFvs$defaultLocale)),
   search_instances: new Map(),
@@ -964,4 +965,4 @@ const $97603d19204ec48d$export$b8a61e5c71402559 = {
   nextRouterNavigation: $a92aa2beb560b8af$export$804fac5697cfbe35
 };
 $2GFvs$add_to_version_info("react-ui", (0, $c9c4d066f9a5b51b$export$83d89fbfd8236492));
-export { $b68a14248b7ef667$export$466cdc317043f6cb as QuickLinks, $f866f7ed9f751af4$export$5646050d516e06bc as BreadCrumbs, $421f32789b6f111f$export$80e99ee6b29cadd2 as ComponentAligner, $5376eb2a386cd90d$export$9fac37a9c21c2f3b as DepictProvider, $48d7f568740a317d$export$f7d2f673fc2f091d as CategoryPage, $4a678f0c87b12e78$export$a54ec244c8863715 as SearchPage, $f446a84f85ba06f6$export$3f37af283f8fb843 as ImagePlaceholder, $cbd250061abf11cb$export$89c6019e4baa40b1 as TextPlaceholder, $73b783bfc241b2d9$export$b0a773486c1c2312 as RecommendationGrid, $4fd5dc0e231a60d9$export$82cfdc85a4d15688 as RecommendationSlider, $70344e5e0d0fea06$export$912994940e660d32 as useSearchModal, $2b886cf548a4775c$export$9bb30bbe003b82e0 as useSearchField, $1bb4271dc44722e2$export$6501da23a2770fc as useFetchRecommendations, $a00d8f27abd5d0b0$export$38b98fae14bd1f64 as usePerformanceClient, $43099132aad1ceb6$re_export$CategoryTitle as CategoryTitle, $43099132aad1ceb6$re_export$EmbeddedNumProducts as EmbeddedNumProducts, $c9c4d066f9a5b51b$export$83d89fbfd8236492 as version, $97603d19204ec48d$export$b8a61e5c71402559 as Navigation };
+export { $b68a14248b7ef667$export$466cdc317043f6cb as QuickLinks, $f866f7ed9f751af4$export$5646050d516e06bc as BreadCrumbs, $421f32789b6f111f$export$80e99ee6b29cadd2 as ComponentAligner, $5376eb2a386cd90d$export$9fac37a9c21c2f3b as DepictProvider, $48d7f568740a317d$export$f7d2f673fc2f091d as CategoryPage, $4a678f0c87b12e78$export$a54ec244c8863715 as SearchPage, $f446a84f85ba06f6$export$3f37af283f8fb843 as ImagePlaceholder, $cbd250061abf11cb$export$89c6019e4baa40b1 as TextPlaceholder, $73b783bfc241b2d9$export$b0a773486c1c2312 as RecommendationGrid, $4fd5dc0e231a60d9$export$82cfdc85a4d15688 as RecommendationSlider, $70344e5e0d0fea06$export$912994940e660d32 as useSearchModal, $2b886cf548a4775c$export$9bb30bbe003b82e0 as useSearchField, $1bb4271dc44722e2$export$6501da23a2770fc as useFetchRecommendations, $a00d8f27abd5d0b0$export$38b98fae14bd1f64 as usePerformanceClient, $43099132aad1ceb6$re_export$CategoryTitle as CategoryTitle, $43099132aad1ceb6$re_export$EmbeddedNumProducts as EmbeddedNumProducts, $c9c4d066f9a5b51b$export$83d89fbfd8236492 as version, $97603d19204ec48d$export$b8a61e5c71402559 as Navigation };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@depict-ai/react-ui",
-  "version": "2.1.13",
+  "version": "2.1.14",
   "packageManager": "yarn@3.2.2",
   "source": "src/index.ts",
   "types": "ES10/index.d.ts",
@@ -137,7 +137,7 @@
     "@babel/runtime-corejs3": "latest",
     "@depict-ai/dpc": "^1.0.45",
     "@depict-ai/plp-styling": "^1.2.14",
-    "@depict-ai/ui": "^2.1.22",
+    "@depict-ai/ui": "^2.1.23",
     "@depict-ai/utilishared": "^1.0.51",
     "solid-js": "^1.8.1"
   },

package/server/ES10/index.cjs

@@ -1,3 +1,4 @@
+"use client";
 var $aNCHr$react = require("react");
 var $aNCHr$depictaiui = require("@depict-ai/ui/ES10");
 var $aNCHr$solidjsweb = require("solid-js/web");
@@ -31,6 +32,10 @@ $parcel$export(module.exports, "useSearchModal", () => $202459d454907b31$export$
 $parcel$export(module.exports, "usePerformanceClient", () => $202459d454907b31$export$38b98fae14bd1f64);
 $parcel$export(module.exports, "useFetchRecommendations", () => $202459d454907b31$export$6501da23a2770fc);
 $parcel$export(module.exports, "version", () => $efbdd2dab4314170$export$83d89fbfd8236492);
+//"use client"; // <- opt out of react server components to the rendering method where components are rendered both on the client and on the server and then hydrated on the client, see https://www.joshwcomeau.com/react/server-components/#:~:text=Client%20Components%20render%20on%20both%20the%20client%20and%20the%20server.
+// This "use client" actually just gets deleted by parcel, but I'm leaving it because we re-add it in the build scripts and this makes you more aware of that
+// Doing that freaks react out, one can only have one use client statement: https://depictaiworkspace.slack.com/archives/C02BASM9X5J/p1699972968084709 but leaving it here commented out for you rinformation regardless
+
 function $f144be06c518d0ac$export$4b564d7f5a1b1d43(_ref) {
   let {
     solid_component: solid_component,
@@ -185,7 +190,7 @@ function $3b36cc844440a979$export$e46079a2793e9ec7(props, set_portals) {
     }
   });
 }
-const $efbdd2dab4314170$export$83d89fbfd8236492 = "2.1.13";
+const $efbdd2dab4314170$export$83d89fbfd8236492 = "2.1.14";
 function $202459d454907b31$export$9fac37a9c21c2f3b(props) {
   return props.children;
 }
@@ -288,4 +293,4 @@ function $202459d454907b31$export$6501da23a2770fc() {
       throw new Error("fetchRecommendations is currently not available on the server due to personalisation/user_id related issues. Please only call it on the client.");
     }
   };
-}
+}

package/server/ES10/index.d.ts

@@ -3,7 +3,7 @@ import React, { PropsWithChildren, ReactNode, FC, ReactPortal, ReactElement } fr
 import { BaseProviderConfig, BaseSearchProviderConfig, BaseCategoryProviderConfig, ModernDisplayWithPageUrl, BaseProductListingConfig, BaseSearchPageConfig, BaseCategoryPageConfig, CategoryTitle, embedded_num_products, ImagePlaceholder as _ImagePlaceholder1, TextPlaceholder as _TextPlaceholder1, ExclusiveId, fetchDepictRecommendations } from "@depict-ai/ui/ES10";
 import { Locale } from "@depict-ai/ui/locales/ES10";
 import { Display, ModernDisplay } from "@depict-ai/utilishared/ES10";
-export const version = "2.1.13";
+export const version = "2.1.14";
 interface UsePerformanceClientReturn {
   dpc: DPC;
 }

package/server/ES10/index.js

@@ -1,3 +1,4 @@
+"use client";
 import { createElement as $7h5e1$createElement, useRef as $7h5e1$useRef, Fragment as $7h5e1$Fragment, useEffect as $7h5e1$useEffect, useState as $7h5e1$useState, Component as $7h5e1$Component } from "react";
 import { ImagePlaceholder as $7h5e1$ImagePlaceholder, TextPlaceholder as $7h5e1$TextPlaceholder, RecommendationGrid as $7h5e1$RecommendationGrid, defaultColsAtSize as $7h5e1$defaultColsAtSize, defaultGridSpacing as $7h5e1$defaultGridSpacing, ProductCardError as $7h5e1$ProductCardError } from "@depict-ai/ui/ES10";
 import { generateHydrationScript as $7h5e1$generateHydrationScript, renderToString as $7h5e1$renderToString, isServer as $7h5e1$isServer } from "solid-js/web";
@@ -6,6 +7,10 @@ import { renderToString as $7h5e1$renderToString1 } from "react-dom/server";
 import { getOwner as $7h5e1$getOwner, untrack as $7h5e1$untrack, runWithOwner as $7h5e1$runWithOwner, createEffect as $7h5e1$createEffect, on as $7h5e1$on, onCleanup as $7h5e1$onCleanup } from "solid-js";
 import { jsx as $7h5e1$jsx } from "react/jsx-runtime";
 import { createPortal as $7h5e1$createPortal } from "react-dom";
+
+//"use client"; // <- opt out of react server components to the rendering method where components are rendered both on the client and on the server and then hydrated on the client, see https://www.joshwcomeau.com/react/server-components/#:~:text=Client%20Components%20render%20on%20both%20the%20client%20and%20the%20server.
+// This "use client" actually just gets deleted by parcel, but I'm leaving it because we re-add it in the build scripts and this makes you more aware of that
+// Doing that freaks react out, one can only have one use client statement: https://depictaiworkspace.slack.com/archives/C02BASM9X5J/p1699972968084709 but leaving it here commented out for you rinformation regardless
 import { register_es_version } from "../../multi_import_deduplicator.mjs";
 register_es_version("react-ui", "ES10");
 function $e8e755ef02e716bf$export$4b564d7f5a1b1d43(_ref) {
@@ -162,7 +167,7 @@ function $cd68097a7ee08669$export$e46079a2793e9ec7(props, set_portals) {
     }
   });
 }
-const $9bd9bb8700ab2ada$export$83d89fbfd8236492 = "2.1.13";
+const $9bd9bb8700ab2ada$export$83d89fbfd8236492 = "2.1.14";
 function $5c4add0a8fe94894$export$9fac37a9c21c2f3b(props) {
   return props.children;
 }
@@ -266,4 +271,4 @@ function $5c4add0a8fe94894$export$6501da23a2770fc() {
     }
   };
 }
-export { $5c4add0a8fe94894$export$9fac37a9c21c2f3b as DepictProvider, $5c4add0a8fe94894$export$a54ec244c8863715 as SearchPage, $5c4add0a8fe94894$export$f7d2f673fc2f091d as CategoryPage, $5c4add0a8fe94894$export$5646050d516e06bc as BreadCrumbs, $5c4add0a8fe94894$export$466cdc317043f6cb as QuickLinks, $5c4add0a8fe94894$export$82cfdc85a4d15688 as RecommendationSlider, $5c4add0a8fe94894$export$80e99ee6b29cadd2 as ComponentAligner, $5c4add0a8fe94894$export$3f37af283f8fb843 as ImagePlaceholder, $5c4add0a8fe94894$export$b0a773486c1c2312 as RecommendationGrid, $5c4add0a8fe94894$export$89c6019e4baa40b1 as TextPlaceholder, $5c4add0a8fe94894$export$9bb30bbe003b82e0 as useSearchField, $5c4add0a8fe94894$export$a7f6cffb6b8ba11c as openModal, $5c4add0a8fe94894$export$912994940e660d32 as useSearchModal, $5c4add0a8fe94894$export$38b98fae14bd1f64 as usePerformanceClient, $5c4add0a8fe94894$export$6501da23a2770fc as useFetchRecommendations, $9bd9bb8700ab2ada$export$83d89fbfd8236492 as version };
+export { $5c4add0a8fe94894$export$9fac37a9c21c2f3b as DepictProvider, $5c4add0a8fe94894$export$a54ec244c8863715 as SearchPage, $5c4add0a8fe94894$export$f7d2f673fc2f091d as CategoryPage, $5c4add0a8fe94894$export$5646050d516e06bc as BreadCrumbs, $5c4add0a8fe94894$export$466cdc317043f6cb as QuickLinks, $5c4add0a8fe94894$export$82cfdc85a4d15688 as RecommendationSlider, $5c4add0a8fe94894$export$80e99ee6b29cadd2 as ComponentAligner, $5c4add0a8fe94894$export$3f37af283f8fb843 as ImagePlaceholder, $5c4add0a8fe94894$export$b0a773486c1c2312 as RecommendationGrid, $5c4add0a8fe94894$export$89c6019e4baa40b1 as TextPlaceholder, $5c4add0a8fe94894$export$9bb30bbe003b82e0 as useSearchField, $5c4add0a8fe94894$export$a7f6cffb6b8ba11c as openModal, $5c4add0a8fe94894$export$912994940e660d32 as useSearchModal, $5c4add0a8fe94894$export$38b98fae14bd1f64 as usePerformanceClient, $5c4add0a8fe94894$export$6501da23a2770fc as useFetchRecommendations, $9bd9bb8700ab2ada$export$83d89fbfd8236492 as version };

package/server/latest/index.cjs

@@ -1,3 +1,4 @@
+"use client";
 var $7QqFM$react = require("react");
 var $7QqFM$depictaiui = require("@depict-ai/ui/latest");
 var $7QqFM$solidjsweb = require("solid-js/web");
@@ -31,6 +32,10 @@ $parcel$export(module.exports, "useSearchModal", () => $41e7e5d85b5e0d49$export$
 $parcel$export(module.exports, "usePerformanceClient", () => $41e7e5d85b5e0d49$export$38b98fae14bd1f64);
 $parcel$export(module.exports, "useFetchRecommendations", () => $41e7e5d85b5e0d49$export$6501da23a2770fc);
 $parcel$export(module.exports, "version", () => $db7b67857900028b$export$83d89fbfd8236492);
+//"use client"; // <- opt out of react server components to the rendering method where components are rendered both on the client and on the server and then hydrated on the client, see https://www.joshwcomeau.com/react/server-components/#:~:text=Client%20Components%20render%20on%20both%20the%20client%20and%20the%20server.
+// This "use client" actually just gets deleted by parcel, but I'm leaving it because we re-add it in the build scripts and this makes you more aware of that
+// Doing that freaks react out, one can only have one use client statement: https://depictaiworkspace.slack.com/archives/C02BASM9X5J/p1699972968084709 but leaving it here commented out for you rinformation regardless
+
 function $35dfe83eec81954c$export$4b564d7f5a1b1d43({
   solid_component: solid_component,
   props: props,
@@ -177,7 +182,7 @@ function $c6b960f2a07285c8$export$e46079a2793e9ec7(props, set_portals) {
     }
   });
 }
-const $db7b67857900028b$export$83d89fbfd8236492 = "2.1.13";
+const $db7b67857900028b$export$83d89fbfd8236492 = "2.1.14";
 function $41e7e5d85b5e0d49$export$9fac37a9c21c2f3b(props) {
   return props.children;
 }
@@ -280,4 +285,4 @@ function $41e7e5d85b5e0d49$export$6501da23a2770fc() {
       throw new Error("fetchRecommendations is currently not available on the server due to personalisation/user_id related issues. Please only call it on the client.");
     }
   };
-}
+}

package/server/latest/index.d.ts

@@ -3,7 +3,7 @@ import React, { PropsWithChildren, ReactNode, FC, ReactPortal, ReactElement } fr
 import { BaseProviderConfig, BaseSearchProviderConfig, BaseCategoryProviderConfig, ModernDisplayWithPageUrl, BaseProductListingConfig, BaseSearchPageConfig, BaseCategoryPageConfig, CategoryTitle, embedded_num_products, ImagePlaceholder as _ImagePlaceholder1, TextPlaceholder as _TextPlaceholder1, ExclusiveId, fetchDepictRecommendations } from "@depict-ai/ui/latest";
 import { Locale } from "@depict-ai/ui/locales/latest";
 import { Display, ModernDisplay } from "@depict-ai/utilishared/latest";
-export const version = "2.1.13";
+export const version = "2.1.14";
 interface UsePerformanceClientReturn {
   dpc: DPC;
 }

package/server/latest/index.js

@@ -1,3 +1,4 @@
+"use client";
 import { createElement as $eOXet$createElement, useRef as $eOXet$useRef, Fragment as $eOXet$Fragment, useEffect as $eOXet$useEffect, useState as $eOXet$useState, Component as $eOXet$Component } from "react";
 import { ImagePlaceholder as $eOXet$ImagePlaceholder, TextPlaceholder as $eOXet$TextPlaceholder, RecommendationGrid as $eOXet$RecommendationGrid, defaultColsAtSize as $eOXet$defaultColsAtSize, defaultGridSpacing as $eOXet$defaultGridSpacing, ProductCardError as $eOXet$ProductCardError } from "@depict-ai/ui/latest";
 import { generateHydrationScript as $eOXet$generateHydrationScript, renderToString as $eOXet$renderToString, isServer as $eOXet$isServer } from "solid-js/web";
@@ -6,6 +7,10 @@ import { renderToString as $eOXet$renderToString1 } from "react-dom/server";
 import { getOwner as $eOXet$getOwner, untrack as $eOXet$untrack, runWithOwner as $eOXet$runWithOwner, createEffect as $eOXet$createEffect, on as $eOXet$on, onCleanup as $eOXet$onCleanup } from "solid-js";
 import { jsx as $eOXet$jsx } from "react/jsx-runtime";
 import { createPortal as $eOXet$createPortal } from "react-dom";
+
+//"use client"; // <- opt out of react server components to the rendering method where components are rendered both on the client and on the server and then hydrated on the client, see https://www.joshwcomeau.com/react/server-components/#:~:text=Client%20Components%20render%20on%20both%20the%20client%20and%20the%20server.
+// This "use client" actually just gets deleted by parcel, but I'm leaving it because we re-add it in the build scripts and this makes you more aware of that
+// Doing that freaks react out, one can only have one use client statement: https://depictaiworkspace.slack.com/archives/C02BASM9X5J/p1699972968084709 but leaving it here commented out for you rinformation regardless
 import { register_es_version } from "../../multi_import_deduplicator.mjs";
 register_es_version("react-ui", "latest");
 function $4568c09979447ab1$export$4b564d7f5a1b1d43({
@@ -154,7 +159,7 @@ function $4d5c3f13a5ae62a7$export$e46079a2793e9ec7(props, set_portals) {
     }
   });
 }
-const $c9c4d066f9a5b51b$export$83d89fbfd8236492 = "2.1.13";
+const $c9c4d066f9a5b51b$export$83d89fbfd8236492 = "2.1.14";
 function $2b1fdeb83610500f$export$9fac37a9c21c2f3b(props) {
   return props.children;
 }
@@ -258,4 +263,4 @@ function $2b1fdeb83610500f$export$6501da23a2770fc() {
     }
   };
 }
-export { $2b1fdeb83610500f$export$9fac37a9c21c2f3b as DepictProvider, $2b1fdeb83610500f$export$a54ec244c8863715 as SearchPage, $2b1fdeb83610500f$export$f7d2f673fc2f091d as CategoryPage, $2b1fdeb83610500f$export$5646050d516e06bc as BreadCrumbs, $2b1fdeb83610500f$export$466cdc317043f6cb as QuickLinks, $2b1fdeb83610500f$export$82cfdc85a4d15688 as RecommendationSlider, $2b1fdeb83610500f$export$80e99ee6b29cadd2 as ComponentAligner, $2b1fdeb83610500f$export$3f37af283f8fb843 as ImagePlaceholder, $2b1fdeb83610500f$export$b0a773486c1c2312 as RecommendationGrid, $2b1fdeb83610500f$export$89c6019e4baa40b1 as TextPlaceholder, $2b1fdeb83610500f$export$9bb30bbe003b82e0 as useSearchField, $2b1fdeb83610500f$export$a7f6cffb6b8ba11c as openModal, $2b1fdeb83610500f$export$912994940e660d32 as useSearchModal, $2b1fdeb83610500f$export$38b98fae14bd1f64 as usePerformanceClient, $2b1fdeb83610500f$export$6501da23a2770fc as useFetchRecommendations, $c9c4d066f9a5b51b$export$83d89fbfd8236492 as version };
+export { $2b1fdeb83610500f$export$9fac37a9c21c2f3b as DepictProvider, $2b1fdeb83610500f$export$a54ec244c8863715 as SearchPage, $2b1fdeb83610500f$export$f7d2f673fc2f091d as CategoryPage, $2b1fdeb83610500f$export$5646050d516e06bc as BreadCrumbs, $2b1fdeb83610500f$export$466cdc317043f6cb as QuickLinks, $2b1fdeb83610500f$export$82cfdc85a4d15688 as RecommendationSlider, $2b1fdeb83610500f$export$80e99ee6b29cadd2 as ComponentAligner, $2b1fdeb83610500f$export$3f37af283f8fb843 as ImagePlaceholder, $2b1fdeb83610500f$export$b0a773486c1c2312 as RecommendationGrid, $2b1fdeb83610500f$export$89c6019e4baa40b1 as TextPlaceholder, $2b1fdeb83610500f$export$9bb30bbe003b82e0 as useSearchField, $2b1fdeb83610500f$export$a7f6cffb6b8ba11c as openModal, $2b1fdeb83610500f$export$912994940e660d32 as useSearchModal, $2b1fdeb83610500f$export$38b98fae14bd1f64 as usePerformanceClient, $2b1fdeb83610500f$export$6501da23a2770fc as useFetchRecommendations, $c9c4d066f9a5b51b$export$83d89fbfd8236492 as version };

package/dist/main.js

@@ -1,527 +0,0 @@
-var $4GYXz$depictaiutilishared = require("@depict-ai/utilishared");
-var $4GYXz$depictaiui = require("@depict-ai/ui");
-var $4GYXz$solidjs = require("solid-js");
-var $4GYXz$solidjsweb = require("solid-js/web");
-var $4GYXz$react = require("react");
-var $4GYXz$reactjsxruntime = require("react/jsx-runtime");
-var $4GYXz$reactdom = require("react-dom");
-var $4GYXz$depictaiuilocales = require("@depict-ai/ui/locales");
-
-function $parcel$export(e, n, v, s) {
-  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
-}
-
-$parcel$export(module.exports, "QuickLinks", () => $f16af0e861aff3d0$export$466cdc317043f6cb);
-$parcel$export(module.exports, "BreadCrumbs", () => $d88e98b11c182b8e$export$5646050d516e06bc);
-$parcel$export(module.exports, "DepictAligner", () => $d96434e62e08087d$export$3f4580d6398c5027);
-$parcel$export(module.exports, "DepictProvider", () => $24b00503eef73528$export$9fac37a9c21c2f3b);
-$parcel$export(module.exports, "DepictCategoryPage", () => $5aa5fcb9f8a2bebc$export$d87c61cecb2edf0d);
-$parcel$export(module.exports, "DepictSearchPage", () => $7ad7a3d0011b7b1b$export$210723f5a54a7028);
-$parcel$export(module.exports, "DepictSearchField", () => $03c714523ff406fc$export$4c0fa313cf50c4ad);
-$parcel$export(module.exports, "ImagePlaceholder", () => $df522c8a81ed5a01$export$3f37af283f8fb843);
-$parcel$export(module.exports, "TextPlaceholder", () => $7c8b440edc188ad5$export$89c6019e4baa40b1);
-$parcel$export(module.exports, "useDepictSearchModal", () => $3647cad61d03b89c$export$cc1e9aaf280afdcb);
-$parcel$export(module.exports, "CategoryTitle", () => $b03e4eee8610ebbe$re_export$CategoryTitle);
-$parcel$export(module.exports, "EmbeddedNumProducts", () => $b03e4eee8610ebbe$re_export$EmbeddedNumProducts);
-$parcel$export(module.exports, "version", () => $db7b67857900028b$export$83d89fbfd8236492);
-$parcel$export(module.exports, "Navigation", () => $b742053c966024b4$export$b8a61e5c71402559);
-/*! Depict.ai search and product listing react SDK wrapper */ // This is where the actual source of your React stuff should live
-// Note, if you add an export here, also add one in src-server/main.ts
-
-
-
-const $0b7cd4fb39fc3502$export$8e769ad4338a911e = {
-    search: null,
-    category: null,
-    category_path: null,
-    search_page_path_: (0, $4GYXz$solidjs.createSignal)(),
-    required_state_set_: (0, $4GYXz$solidjs.createSignal)(false)
-};
-
-
-
-
-
-
-
-let $b4d0d98857ed9934$var$run_on_href_change;
-function $b4d0d98857ed9934$export$74f3924c5027fe1d(cb) {
-    $b4d0d98857ed9934$var$run_on_href_change = cb;
-}
-(async ()=>{
-    for await (const href of (0, $4GYXz$depictaiutilishared.href_change_ipns))$b4d0d98857ed9934$var$run_on_href_change?.(href);
-})();
-const $b4d0d98857ed9934$export$775e6b3892b5ad52 = (url)=>url.pathname == (0, $4GYXz$solidjs.untrack)((0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).search_page_path_[0]); // might have changed therefore get it from globalState
-const $b4d0d98857ed9934$export$92a8f8b3c630fa0d = (url)=>{
-    return $b4d0d98857ed9934$export$775e6b3892b5ad52(url) || url.pathname === (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).category_path;
-};
-function $b4d0d98857ed9934$export$f6e64e17bd69eeef(solid_component, props, wrapper_type = "div", wrapper_style = {}, react_render_handler) {
-    const [portals, set_portals] = (0, $4GYXz$react.useState)([]);
-    const wrapper_element_ref = (0, $4GYXz$react.useRef)();
-    (0, $4GYXz$react.useEffect)(()=>{
-        const wrapper_element = wrapper_element_ref.current;
-        const dispose = (0, $4GYXz$solidjsweb.render)(()=>solid_component(props, set_portals), wrapper_element);
-        return dispose;
-    }, []);
-    react_render_handler?.(props);
-    return (0, $4GYXz$react.createElement)(wrapper_type, {
-        ref: wrapper_element_ref,
-        style: wrapper_style
-    }, portals);
-}
-function $b4d0d98857ed9934$export$e5139bbbb9a05035(component, is_set = (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).required_state_set_[0]) {
-    return (...args)=>{
-        return (0, $4GYXz$solidjs.createComponent)((0, $4GYXz$solidjs.Show), {
-            get when () {
-                return is_set();
-            },
-            get children () {
-                return component(...args);
-            }
-        });
-    };
-}
-async function $b4d0d98857ed9934$export$79c79419c1ef0081({ display: display , info: info , component_portals: component_portals , set_portals: set_portals , react_template: react_template  }) {
-    const solid_container = document.createElement("div");
-    const react_has_rendered = new Promise((r)=>{
-        const m_o = new MutationObserver(()=>{
-            m_o.disconnect();
-            r();
-        });
-        m_o.observe(solid_container, {
-            childList: true
-        });
-    });
-    const is_placeholder = info.rendering_options.type === "placeholder";
-    const reactProductCard = (0, $4GYXz$reactjsxruntime.jsx)(react_template, {
-        display: is_placeholder ? null : display
-    });
-    const portal = $4GYXz$reactdom.createPortal(reactProductCard, solid_container);
-    component_portals.add(portal);
-    set_portals([
-        ...component_portals
-    ]);
-    (0, $4GYXz$solidjs.onCleanup)(()=>{
-        // this will stop working after any await so be careful to not await before this, or you'll have to carry the owner over with getOwner and runWithOwner
-        component_portals.delete(portal);
-        set_portals([
-            ...component_portals
-        ]);
-    });
-    await react_has_rendered; // wait for react to have finish portaling the elements so that the placeholders get removed once we have an actual result and so that the PLP code knows it has a placeholder when this is a placeholder rendering
-    return [
-        solid_container
-    ];
-}
-
-
-
-
-function $03c714523ff406fc$export$4c0fa313cf50c4ad() {
-    return (0, $b4d0d98857ed9934$export$f6e64e17bd69eeef)((0, $b4d0d98857ed9934$export$e5139bbbb9a05035)(()=>(0, $4GYXz$depictaiui.SearchField)({
-            depict_search: (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).search
-        })), {});
-}
-
-
-
-
-
-
-
-let $6319748b4f0426f0$var$set = false;
-let $6319748b4f0426f0$var$padding_animation;
-function $6319748b4f0426f0$export$6453cbc34515a94d(is_search_page) {
-    if ($6319748b4f0426f0$var$set) return; // Just being safe
-    $6319748b4f0426f0$var$set = true;
-    let should_use_old_scroll = false;
-    const old_scrollTo = window.scrollTo;
-    window.scrollTo = (...args)=>{
-        if (should_use_old_scroll || process.env.__NEXT_SCROLL_RESTORATION || !is_search_page(location)) return Reflect.apply(old_scrollTo, window, args);
-        else should_use_old_scroll = true;
-    };
-    addEventListener("popstate", (0, $4GYXz$depictaiutilishared.catchify)(()=>{
-        if (!is_search_page(location)) {
-            $6319748b4f0426f0$var$removeLotsOfPadding(); // Just making sure
-            return;
-        }
-        should_use_old_scroll = false;
-        $6319748b4f0426f0$var$addLotsOfPadding();
-        (0, $4GYXz$depictaiutilishared.observer).wait_for_element(".depict.plp .listing-page").then(()=>{
-            $6319748b4f0426f0$var$removeLotsOfPadding();
-        });
-    }));
-    (0, $4GYXz$depictaiutilishared.history_replacer)(()=>{
-        (0, $4GYXz$depictaiutilishared.queueMacroTask)(()=>{
-            $6319748b4f0426f0$var$removeLotsOfPadding();
-        });
-    }, false);
-    window?.next?.router?.events?.on("routeChangeStart", ()=>{
-        $6319748b4f0426f0$var$addLotsOfPadding();
-    });
-}
-/*
- Here we want to be able to add padding that *definitely* gets applied and then be able to revert precisely to what was before.
- The best way to achieve this is using an animation that with the fill set to none. This is because animations have the absolute highest precedence in CSS, even higher than !important. Then, to revert to the old padding, we just play the animation which is 1ms long so, it immediately finishes and whatever was defined before takes precedence again.
- */ function $6319748b4f0426f0$var$addLotsOfPadding() {
-    if ($6319748b4f0426f0$var$padding_animation) return; // We're already showing a bunch of padding
-    $6319748b4f0426f0$var$padding_animation = document.body.animate({
-        paddingBottom: (history.state?.search_scroll_restoration_data?.[0]?.min_results_loaded || 150) * 500 + "px",
-        offset: 0
-    }, 1);
-    $6319748b4f0426f0$var$padding_animation.pause();
-}
-function $6319748b4f0426f0$var$removeLotsOfPadding() {
-    if ($6319748b4f0426f0$var$padding_animation) {
-        $6319748b4f0426f0$var$padding_animation.play();
-        $6319748b4f0426f0$var$padding_animation = undefined;
-    }
-}
-
-
-
-
-const $bc389476eeb2b615$export$599d4515591ef232 = (href)=>{
-    const shallow = (0, $b4d0d98857ed9934$export$92a8f8b3c630fa0d)(location);
-    window.next.router.push(href, undefined, {
-        shallow: shallow,
-        scroll: true
-    });
-};
-
-
-
-function $24b00503eef73528$export$9fac37a9c21c2f3b(props) {
-    const { children: children , navigateFunction: navigateFunction , market: market , merchant: merchant , locale: locale  } = props;
-    const usedLocale = locale ?? (0, $4GYXz$depictaiuilocales.en);
-    const { searchPagePath: searchPagePath , urlParamName: urlParamName , enableCategorySuggestions: enableCategorySuggestions  } = props.search ?? {};
-    if (!market || !merchant) {
-        (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).required_state_set_[1](false);
-        return (0, $4GYXz$react.createElement)((0, $4GYXz$react.Fragment), null, children);
-    }
-    try {
-        const { search: search , category: category  } = (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e);
-        const [get_search_page_path, set_search_page_path] = (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).search_page_path_;
-        set_search_page_path(searchPagePath);
-        const on_navigation = typeof window?.next?.router !== "undefined" || navigateFunction ? (new_href)=>{
-            if (navigateFunction) navigateFunction(new_href);
-            else (0, $bc389476eeb2b615$export$599d4515591ef232)(new_href);
-        } : undefined;
-        if (!search) (0, $4GYXz$solidjs.createRoot)(()=>(0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).search = new (0, $4GYXz$depictaiui.DepictSearch)({
-                search_query_url_param_name: urlParamName,
-                market: market,
-                merchant: merchant,
-                enable_category_suggestions: enableCategorySuggestions ?? false,
-                // default category suggestions to false for @depict-ai/react-ui (https://linear.app/depictai/issue/FRO-401/default-enablecategorysuggestions-to-false)
-                localization: usedLocale,
-                url_transformer: (url)=>url.pathname = (0, $4GYXz$solidjs.untrack)(get_search_page_path),
-                on_navigation: on_navigation
-            }));
-        else {
-            search.market = market;
-            search.merchant = merchant;
-            search.localization = usedLocale;
-        }
-        if (!category) (0, $4GYXz$solidjs.createRoot)(()=>(0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).category = new (0, $4GYXz$depictaiui.DepictCategory)({
-                market: market,
-                merchant: merchant,
-                localization: usedLocale,
-                on_navigation: on_navigation
-            }));
-        else {
-            category.market = market;
-            category.merchant = merchant;
-            category.localization = usedLocale;
-        }
-        (0, $6319748b4f0426f0$export$6453cbc34515a94d)((0, $b4d0d98857ed9934$export$92a8f8b3c630fa0d));
-        (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).required_state_set_[1](true);
-    } catch (e) {
-        // Make sure to not break the users app if we throw
-        queueMicrotask(()=>{
-            throw e;
-        });
-    }
-    return (0, $4GYXz$react.createElement)((0, $4GYXz$react.Fragment), null, children);
-}
-
-
-
-const $d96434e62e08087d$export$3f4580d6398c5027 = /*#__PURE__*/ (0, $4GYXz$react.forwardRef)((_, ref)=>{
-    return /*#__PURE__*/ (0, $4GYXz$react.createElement)("div", {
-        className: "depict aligner",
-        style: {
-            height: "100%"
-        },
-        ref: ref
-    });
-});
-
-
-
-
-
-
-function $7ad7a3d0011b7b1b$export$210723f5a54a7028(props) {
-    return (0, $b4d0d98857ed9934$export$f6e64e17bd69eeef)((0, $b4d0d98857ed9934$export$e5139bbbb9a05035)($7ad7a3d0011b7b1b$var$SolidSearchPage), props);
-}
-function $7ad7a3d0011b7b1b$var$SolidSearchPage(props, set_portals) {
-    const depict_search = (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).search;
-    if (!depict_search) throw Error("No depict_search instance when rendering SearchPage. Did you forget to wrap your app in DepictProvider?");
-    const search_query_updating_blocked_signal = (0, $4GYXz$depictaiui.get_search_query_updating_blocked_signal)(depict_search);
-    if (!search_query_updating_blocked_signal) throw Error("No search_query_updating_blocked_signal when rendering SearchPage");
-    const [, set_search_query_updating_blocked_signal] = search_query_updating_blocked_signal;
-    const update_updating_blocked_signal = ()=>{
-        set_search_query_updating_blocked_signal(!(0, $b4d0d98857ed9934$export$775e6b3892b5ad52)(location));
-    };
-    // react is really slow with disposing components, we want to avoid a flash of another search query when you click on a product and navigate away
-    (0, $b4d0d98857ed9934$export$74f3924c5027fe1d)(update_updating_blocked_signal); // if we navigate, re-check
-    (0, $4GYXz$solidjs.createComputed)(()=>{
-        (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).search_page_path_[0](); // if react defined path changes, re-check
-        update_updating_blocked_signal();
-    });
-    const component_portals = new Set();
-    return (0, $4GYXz$depictaiui.SearchPage)({
-        // Default config goes here
-        include_input_field: props.includeInputField ?? true,
-        cols_at_size: props.columnsAtSize ?? [
-            [
-                4
-            ],
-            [
-                3,
-                1024
-            ],
-            [
-                2,
-                901
-            ]
-        ],
-        grid_spacing: props.gridSpacing ?? "2%",
-        // Todo: Do we need this?
-        get_product_id: ()=>"",
-        depict_search: depict_search,
-        product_card_template: (display, info)=>(0, $b4d0d98857ed9934$export$79c79419c1ef0081)({
-                display: display,
-                info: info,
-                react_template: props.productCard,
-                component_portals: component_portals,
-                set_portals: set_portals
-            })
-    });
-}
-
-
-
-
-
-
-let $5aa5fcb9f8a2bebc$var$render_cb;
-function $5aa5fcb9f8a2bebc$export$d87c61cecb2edf0d(props) {
-    return (0, $b4d0d98857ed9934$export$f6e64e17bd69eeef)((0, $b4d0d98857ed9934$export$e5139bbbb9a05035)($5aa5fcb9f8a2bebc$var$SolidCategoryPage), props, "div", {}, (props)=>$5aa5fcb9f8a2bebc$var$render_cb?.(props));
-}
-function $5aa5fcb9f8a2bebc$var$SolidCategoryPage(props, set_portals) {
-    const depict_category = (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).category;
-    if (!depict_category) throw Error("No depict_category instance when rendering SearchPage. Did you forget to wrap your app in DepictProvider?");
-    const [category_state_set, set_category_state_set] = (0, $4GYXz$solidjs.createSignal)(false);
-    $5aa5fcb9f8a2bebc$var$render_cb = (props)=>{
-        depict_category.category_id = props.categoryId;
-        (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).category_path = location.pathname;
-        if (props.categoryId) set_category_state_set(true);
-    };
-    $5aa5fcb9f8a2bebc$var$render_cb(props);
-    const component_portals = new Set();
-    const category = ()=>(0, $4GYXz$depictaiui.CategoryPage)({
-            depict_category: depict_category,
-            cols_at_size: props.columnsAtSize ?? [
-                [
-                    4
-                ],
-                [
-                    3,
-                    1024
-                ],
-                [
-                    2,
-                    901
-                ]
-            ],
-            grid_spacing: props.gridSpacing ?? "2%",
-            get_product_id: ()=>"",
-            category_title: props.categoryTitlePlugin || (0, $4GYXz$depictaiui.CategoryTitle),
-            show_breadcrumbs: props.showBreadcrumbs === undefined ? true : props.showBreadcrumbs,
-            show_quicklinks: props.showQuicklinks === undefined ? true : props.showQuicklinks,
-            product_card_template: (display, info)=>(0, $b4d0d98857ed9934$export$79c79419c1ef0081)({
-                    display: display,
-                    info: info,
-                    react_template: props.productCard,
-                    component_portals: component_portals,
-                    set_portals: set_portals
-                })
-        });
-    return (0, $b4d0d98857ed9934$export$e5139bbbb9a05035)(category, category_state_set);
-}
-
-
-
-
-
-function $d88e98b11c182b8e$export$5646050d516e06bc() {
-    return (0, $b4d0d98857ed9934$export$f6e64e17bd69eeef)((0, $b4d0d98857ed9934$export$e5139bbbb9a05035)($d88e98b11c182b8e$var$vanilla_breadcrumbs), {});
-}
-function $d88e98b11c182b8e$var$vanilla_breadcrumbs() {
-    const depict_category = (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).category;
-    if (!depict_category) throw Error("No depict_category instance when rendering BreadCrumbs. Did you forget to wrap your app in DepictProvider?");
-    return (0, $4GYXz$depictaiui.BreadCrumbs)({
-        depict_category: depict_category
-    });
-}
-
-
-
-
-
-function $f16af0e861aff3d0$export$466cdc317043f6cb() {
-    return (0, $b4d0d98857ed9934$export$f6e64e17bd69eeef)((0, $b4d0d98857ed9934$export$e5139bbbb9a05035)($f16af0e861aff3d0$var$vanilla_quick_links), {});
-}
-function $f16af0e861aff3d0$var$vanilla_quick_links() {
-    const depict_category = (0, $0b7cd4fb39fc3502$export$8e769ad4338a911e).category;
-    if (!depict_category) throw Error("No depict_category instance when rendering QuickLinks. Did you forget to wrap your app in DepictProvider?");
-    return (0, $4GYXz$depictaiui.QuickLinks)({
-        depict_category: depict_category
-    });
-}
-
-
-
-
-const $df522c8a81ed5a01$export$3f37af283f8fb843 = ({ aspectRatio: aspectRatio  })=>{
-    return (0, $b4d0d98857ed9934$export$f6e64e17bd69eeef)(()=>(0, $4GYXz$depictaiutilishared.ContainedPlaceholderImage)({
-            aspect_ratio: aspectRatio
-        }), {}, "div", {
-        "height": "100%"
-    });
-};
-
-
-
-
-const $7c8b440edc188ad5$export$89c6019e4baa40b1 = ({ width: width , height: height  })=>{
-    return (0, $b4d0d98857ed9934$export$f6e64e17bd69eeef)(()=>(0, $4GYXz$depictaiutilishared.Placeholder)({
-            width: width,
-            height: height
-        }), {}, "div", {
-        "height": "100%"
-    });
-};
-
-
-
-
-
-
-
-
-const $ef7db890e488d4f4$export$d69d8daa20eae175 = (createOpenModalParams)=>{
-    const { globalState: globalState , location: location , alignerRef: alignerRef  } = createOpenModalParams;
-    const openModal = ()=>{
-        const headerAligner = alignerRef?.current;
-        if (!globalState.search) throw new Error("No active search in the app!");
-        if (!headerAligner && location === "aligned") throw new Error("No active search header aligner on the page!");
-        const alignment_height = headerAligner?.clientHeight;
-        if (location !== "aligned" || isNaN(alignment_height)) {
-            // Open centered modal
-            globalState.search.modal_open = true;
-            return;
-        }
-        const style_element = document.createElement("style");
-        document.head.append(style_element);
-        const resize_observer = new ResizeObserver((0, $4GYXz$depictaiutilishared.catchify)(()=>{
-            const styles = (0, $4GYXz$depictaiui.styles_to_valid_css_string)({
-                ".depict.plp .depict-search-modal .query-input": {
-                    "height": `${headerAligner?.clientHeight}px`
-                }
-            });
-            style_element.replaceChildren(styles);
-        }));
-        resize_observer.observe(headerAligner);
-        let dispose_aligner;
-        /**
-     * Setting position to fixed is important to make the modal work with align_field.
-     */ const style_props_ = (0, $4GYXz$solidjs.createSignal)({
-            position: "fixed"
-        });
-        (0, $4GYXz$solidjs.createRoot)((dispose)=>{
-            dispose_aligner = ()=>{
-                resize_observer.disconnect();
-                style_element.remove();
-                dispose();
-            };
-            (0, $4GYXz$depictaiui.align_field)(style_props_, headerAligner, undefined, false, "top");
-        });
-        globalState.search.modal_open = [
-            {
-                style_props_: style_props_
-            },
-            dispose_aligner
-        ];
-    };
-    return openModal;
-};
-
-
-function $3647cad61d03b89c$export$cc1e9aaf280afdcb(params) {
-    const open = (0, $ef7db890e488d4f4$export$d69d8daa20eae175)({
-        globalState: $0b7cd4fb39fc3502$export$8e769ad4338a911e,
-        ...params
-    });
-    return {
-        open: open
-    };
-}
-
-
-
-
-
-const $db7b67857900028b$export$83d89fbfd8236492 = "0.0.59";
-
-
-
-
-const $e387bd534de10acd$export$804fac5697cfbe35 = (router)=>(href)=>{
-        const shallow = (0, $b4d0d98857ed9934$export$92a8f8b3c630fa0d)(location);
-        router.push(href, undefined, {
-            shallow: shallow,
-            scroll: true
-        });
-    };
-
-
-/**
- * Helper function that creates a function that can be used as the
- * navigateFunction callback for DepictProvider when using react-router.
- *
- * React-router expect relative URLs, so this function will strip the
- * protocol, hostname and port from the URL.
- *
- * @param navigateFunction what useNavigate() returns
- * @returns a function that can be used as the navigateFunction callback for DepictProvider
- */ const $201a023b63de7d2f$export$d53481656a62aebe = (navigateFunction)=>(href)=>{
-        const url_object = new URL(href);
-        return navigateFunction(url_object.pathname + url_object.search + url_object.hash);
-    };
-
-
-const $b742053c966024b4$export$b8a61e5c71402559 = {
-    nextRouterNavigation: $e387bd534de10acd$export$804fac5697cfbe35,
-    reactRouterNavigation: $201a023b63de7d2f$export$d53481656a62aebe
-};
-
-
-const $b03e4eee8610ebbe$var$package_name = "@depict-ai/react-ui";
-(0, $4GYXz$depictaiutilishared.dlog)($b03e4eee8610ebbe$var$package_name + " version", (0, $db7b67857900028b$export$83d89fbfd8236492));
-(0, $4GYXz$depictaiui.add_to_version_info)({
-    [$b03e4eee8610ebbe$var$package_name]: (0, $db7b67857900028b$export$83d89fbfd8236492)
-});
-
-

package/dist/module.js

@@ -1,510 +0,0 @@
-import {dlog as $TZSbU$dlog, href_change_ipns as $TZSbU$href_change_ipns, catchify as $TZSbU$catchify, observer as $TZSbU$observer, history_replacer as $TZSbU$history_replacer, queueMacroTask as $TZSbU$queueMacroTask, ContainedPlaceholderImage as $TZSbU$ContainedPlaceholderImage, Placeholder as $TZSbU$Placeholder} from "@depict-ai/utilishared";
-import {add_to_version_info as $TZSbU$add_to_version_info, CategoryTitle as $43099132aad1ceb6$re_export$CategoryTitle, embedded_num_products as $43099132aad1ceb6$re_export$EmbeddedNumProducts, SearchField as $TZSbU$SearchField, DepictSearch as $TZSbU$DepictSearch, DepictCategory as $TZSbU$DepictCategory, get_search_query_updating_blocked_signal as $TZSbU$get_search_query_updating_blocked_signal, SearchPage as $TZSbU$SearchPage, CategoryPage as $TZSbU$CategoryPage, BreadCrumbs as $TZSbU$BreadCrumbs, QuickLinks as $TZSbU$QuickLinks, styles_to_valid_css_string as $TZSbU$styles_to_valid_css_string, align_field as $TZSbU$align_field} from "@depict-ai/ui";
-import {untrack as $TZSbU$untrack, createComponent as $TZSbU$createComponent, Show as $TZSbU$Show, onCleanup as $TZSbU$onCleanup, createSignal as $TZSbU$createSignal, createRoot as $TZSbU$createRoot, createComputed as $TZSbU$createComputed} from "solid-js";
-import {render as $TZSbU$render} from "solid-js/web";
-import {useState as $TZSbU$useState, useRef as $TZSbU$useRef, useEffect as $TZSbU$useEffect, createElement as $TZSbU$createElement, Fragment as $TZSbU$Fragment, forwardRef as $TZSbU$forwardRef} from "react";
-import {jsx as $TZSbU$jsx} from "react/jsx-runtime";
-import {createPortal as $TZSbU$createPortal} from "react-dom";
-import {en as $TZSbU$en} from "@depict-ai/ui/locales";
-
-/*! Depict.ai search and product listing react SDK wrapper */ // This is where the actual source of your React stuff should live
-// Note, if you add an export here, also add one in src-server/main.ts
-
-
-
-const $42858f023ef23dab$export$8e769ad4338a911e = {
-    search: null,
-    category: null,
-    category_path: null,
-    search_page_path_: (0, $TZSbU$createSignal)(),
-    required_state_set_: (0, $TZSbU$createSignal)(false)
-};
-
-
-
-
-
-
-
-let $c83ba9ab79386687$var$run_on_href_change;
-function $c83ba9ab79386687$export$74f3924c5027fe1d(cb) {
-    $c83ba9ab79386687$var$run_on_href_change = cb;
-}
-(async ()=>{
-    for await (const href of (0, $TZSbU$href_change_ipns))$c83ba9ab79386687$var$run_on_href_change?.(href);
-})();
-const $c83ba9ab79386687$export$775e6b3892b5ad52 = (url)=>url.pathname == (0, $TZSbU$untrack)((0, $42858f023ef23dab$export$8e769ad4338a911e).search_page_path_[0]); // might have changed therefore get it from globalState
-const $c83ba9ab79386687$export$92a8f8b3c630fa0d = (url)=>{
-    return $c83ba9ab79386687$export$775e6b3892b5ad52(url) || url.pathname === (0, $42858f023ef23dab$export$8e769ad4338a911e).category_path;
-};
-function $c83ba9ab79386687$export$f6e64e17bd69eeef(solid_component, props, wrapper_type = "div", wrapper_style = {}, react_render_handler) {
-    const [portals, set_portals] = (0, $TZSbU$useState)([]);
-    const wrapper_element_ref = (0, $TZSbU$useRef)();
-    (0, $TZSbU$useEffect)(()=>{
-        const wrapper_element = wrapper_element_ref.current;
-        const dispose = (0, $TZSbU$render)(()=>solid_component(props, set_portals), wrapper_element);
-        return dispose;
-    }, []);
-    react_render_handler?.(props);
-    return (0, $TZSbU$createElement)(wrapper_type, {
-        ref: wrapper_element_ref,
-        style: wrapper_style
-    }, portals);
-}
-function $c83ba9ab79386687$export$e5139bbbb9a05035(component, is_set = (0, $42858f023ef23dab$export$8e769ad4338a911e).required_state_set_[0]) {
-    return (...args)=>{
-        return (0, $TZSbU$createComponent)((0, $TZSbU$Show), {
-            get when () {
-                return is_set();
-            },
-            get children () {
-                return component(...args);
-            }
-        });
-    };
-}
-async function $c83ba9ab79386687$export$79c79419c1ef0081({ display: display , info: info , component_portals: component_portals , set_portals: set_portals , react_template: react_template  }) {
-    const solid_container = document.createElement("div");
-    const react_has_rendered = new Promise((r)=>{
-        const m_o = new MutationObserver(()=>{
-            m_o.disconnect();
-            r();
-        });
-        m_o.observe(solid_container, {
-            childList: true
-        });
-    });
-    const is_placeholder = info.rendering_options.type === "placeholder";
-    const reactProductCard = (0, $TZSbU$jsx)(react_template, {
-        display: is_placeholder ? null : display
-    });
-    const portal = $TZSbU$createPortal(reactProductCard, solid_container);
-    component_portals.add(portal);
-    set_portals([
-        ...component_portals
-    ]);
-    (0, $TZSbU$onCleanup)(()=>{
-        // this will stop working after any await so be careful to not await before this, or you'll have to carry the owner over with getOwner and runWithOwner
-        component_portals.delete(portal);
-        set_portals([
-            ...component_portals
-        ]);
-    });
-    await react_has_rendered; // wait for react to have finish portaling the elements so that the placeholders get removed once we have an actual result and so that the PLP code knows it has a placeholder when this is a placeholder rendering
-    return [
-        solid_container
-    ];
-}
-
-
-
-
-function $02e2452814b6e7d6$export$4c0fa313cf50c4ad() {
-    return (0, $c83ba9ab79386687$export$f6e64e17bd69eeef)((0, $c83ba9ab79386687$export$e5139bbbb9a05035)(()=>(0, $TZSbU$SearchField)({
-            depict_search: (0, $42858f023ef23dab$export$8e769ad4338a911e).search
-        })), {});
-}
-
-
-
-
-
-
-
-let $8071251ee4e9ffa1$var$set = false;
-let $8071251ee4e9ffa1$var$padding_animation;
-function $8071251ee4e9ffa1$export$6453cbc34515a94d(is_search_page) {
-    if ($8071251ee4e9ffa1$var$set) return; // Just being safe
-    $8071251ee4e9ffa1$var$set = true;
-    let should_use_old_scroll = false;
-    const old_scrollTo = window.scrollTo;
-    window.scrollTo = (...args)=>{
-        if (should_use_old_scroll || process.env.__NEXT_SCROLL_RESTORATION || !is_search_page(location)) return Reflect.apply(old_scrollTo, window, args);
-        else should_use_old_scroll = true;
-    };
-    addEventListener("popstate", (0, $TZSbU$catchify)(()=>{
-        if (!is_search_page(location)) {
-            $8071251ee4e9ffa1$var$removeLotsOfPadding(); // Just making sure
-            return;
-        }
-        should_use_old_scroll = false;
-        $8071251ee4e9ffa1$var$addLotsOfPadding();
-        (0, $TZSbU$observer).wait_for_element(".depict.plp .listing-page").then(()=>{
-            $8071251ee4e9ffa1$var$removeLotsOfPadding();
-        });
-    }));
-    (0, $TZSbU$history_replacer)(()=>{
-        (0, $TZSbU$queueMacroTask)(()=>{
-            $8071251ee4e9ffa1$var$removeLotsOfPadding();
-        });
-    }, false);
-    window?.next?.router?.events?.on("routeChangeStart", ()=>{
-        $8071251ee4e9ffa1$var$addLotsOfPadding();
-    });
-}
-/*
- Here we want to be able to add padding that *definitely* gets applied and then be able to revert precisely to what was before.
- The best way to achieve this is using an animation that with the fill set to none. This is because animations have the absolute highest precedence in CSS, even higher than !important. Then, to revert to the old padding, we just play the animation which is 1ms long so, it immediately finishes and whatever was defined before takes precedence again.
- */ function $8071251ee4e9ffa1$var$addLotsOfPadding() {
-    if ($8071251ee4e9ffa1$var$padding_animation) return; // We're already showing a bunch of padding
-    $8071251ee4e9ffa1$var$padding_animation = document.body.animate({
-        paddingBottom: (history.state?.search_scroll_restoration_data?.[0]?.min_results_loaded || 150) * 500 + "px",
-        offset: 0
-    }, 1);
-    $8071251ee4e9ffa1$var$padding_animation.pause();
-}
-function $8071251ee4e9ffa1$var$removeLotsOfPadding() {
-    if ($8071251ee4e9ffa1$var$padding_animation) {
-        $8071251ee4e9ffa1$var$padding_animation.play();
-        $8071251ee4e9ffa1$var$padding_animation = undefined;
-    }
-}
-
-
-
-
-const $7216ca4c8308a0f9$export$599d4515591ef232 = (href)=>{
-    const shallow = (0, $c83ba9ab79386687$export$92a8f8b3c630fa0d)(location);
-    window.next.router.push(href, undefined, {
-        shallow: shallow,
-        scroll: true
-    });
-};
-
-
-
-function $5376eb2a386cd90d$export$9fac37a9c21c2f3b(props) {
-    const { children: children , navigateFunction: navigateFunction , market: market , merchant: merchant , locale: locale  } = props;
-    const usedLocale = locale ?? (0, $TZSbU$en);
-    const { searchPagePath: searchPagePath , urlParamName: urlParamName , enableCategorySuggestions: enableCategorySuggestions  } = props.search ?? {};
-    if (!market || !merchant) {
-        (0, $42858f023ef23dab$export$8e769ad4338a911e).required_state_set_[1](false);
-        return (0, $TZSbU$createElement)((0, $TZSbU$Fragment), null, children);
-    }
-    try {
-        const { search: search , category: category  } = (0, $42858f023ef23dab$export$8e769ad4338a911e);
-        const [get_search_page_path, set_search_page_path] = (0, $42858f023ef23dab$export$8e769ad4338a911e).search_page_path_;
-        set_search_page_path(searchPagePath);
-        const on_navigation = typeof window?.next?.router !== "undefined" || navigateFunction ? (new_href)=>{
-            if (navigateFunction) navigateFunction(new_href);
-            else (0, $7216ca4c8308a0f9$export$599d4515591ef232)(new_href);
-        } : undefined;
-        if (!search) (0, $TZSbU$createRoot)(()=>(0, $42858f023ef23dab$export$8e769ad4338a911e).search = new (0, $TZSbU$DepictSearch)({
-                search_query_url_param_name: urlParamName,
-                market: market,
-                merchant: merchant,
-                enable_category_suggestions: enableCategorySuggestions ?? false,
-                // default category suggestions to false for @depict-ai/react-ui (https://linear.app/depictai/issue/FRO-401/default-enablecategorysuggestions-to-false)
-                localization: usedLocale,
-                url_transformer: (url)=>url.pathname = (0, $TZSbU$untrack)(get_search_page_path),
-                on_navigation: on_navigation
-            }));
-        else {
-            search.market = market;
-            search.merchant = merchant;
-            search.localization = usedLocale;
-        }
-        if (!category) (0, $TZSbU$createRoot)(()=>(0, $42858f023ef23dab$export$8e769ad4338a911e).category = new (0, $TZSbU$DepictCategory)({
-                market: market,
-                merchant: merchant,
-                localization: usedLocale,
-                on_navigation: on_navigation
-            }));
-        else {
-            category.market = market;
-            category.merchant = merchant;
-            category.localization = usedLocale;
-        }
-        (0, $8071251ee4e9ffa1$export$6453cbc34515a94d)((0, $c83ba9ab79386687$export$92a8f8b3c630fa0d));
-        (0, $42858f023ef23dab$export$8e769ad4338a911e).required_state_set_[1](true);
-    } catch (e) {
-        // Make sure to not break the users app if we throw
-        queueMicrotask(()=>{
-            throw e;
-        });
-    }
-    return (0, $TZSbU$createElement)((0, $TZSbU$Fragment), null, children);
-}
-
-
-
-const $4db0e2f013fc5124$export$3f4580d6398c5027 = /*#__PURE__*/ (0, $TZSbU$forwardRef)((_, ref)=>{
-    return /*#__PURE__*/ (0, $TZSbU$createElement)("div", {
-        className: "depict aligner",
-        style: {
-            height: "100%"
-        },
-        ref: ref
-    });
-});
-
-
-
-
-
-
-function $4a678f0c87b12e78$export$210723f5a54a7028(props) {
-    return (0, $c83ba9ab79386687$export$f6e64e17bd69eeef)((0, $c83ba9ab79386687$export$e5139bbbb9a05035)($4a678f0c87b12e78$var$SolidSearchPage), props);
-}
-function $4a678f0c87b12e78$var$SolidSearchPage(props, set_portals) {
-    const depict_search = (0, $42858f023ef23dab$export$8e769ad4338a911e).search;
-    if (!depict_search) throw Error("No depict_search instance when rendering SearchPage. Did you forget to wrap your app in DepictProvider?");
-    const search_query_updating_blocked_signal = (0, $TZSbU$get_search_query_updating_blocked_signal)(depict_search);
-    if (!search_query_updating_blocked_signal) throw Error("No search_query_updating_blocked_signal when rendering SearchPage");
-    const [, set_search_query_updating_blocked_signal] = search_query_updating_blocked_signal;
-    const update_updating_blocked_signal = ()=>{
-        set_search_query_updating_blocked_signal(!(0, $c83ba9ab79386687$export$775e6b3892b5ad52)(location));
-    };
-    // react is really slow with disposing components, we want to avoid a flash of another search query when you click on a product and navigate away
-    (0, $c83ba9ab79386687$export$74f3924c5027fe1d)(update_updating_blocked_signal); // if we navigate, re-check
-    (0, $TZSbU$createComputed)(()=>{
-        (0, $42858f023ef23dab$export$8e769ad4338a911e).search_page_path_[0](); // if react defined path changes, re-check
-        update_updating_blocked_signal();
-    });
-    const component_portals = new Set();
-    return (0, $TZSbU$SearchPage)({
-        // Default config goes here
-        include_input_field: props.includeInputField ?? true,
-        cols_at_size: props.columnsAtSize ?? [
-            [
-                4
-            ],
-            [
-                3,
-                1024
-            ],
-            [
-                2,
-                901
-            ]
-        ],
-        grid_spacing: props.gridSpacing ?? "2%",
-        // Todo: Do we need this?
-        get_product_id: ()=>"",
-        depict_search: depict_search,
-        product_card_template: (display, info)=>(0, $c83ba9ab79386687$export$79c79419c1ef0081)({
-                display: display,
-                info: info,
-                react_template: props.productCard,
-                component_portals: component_portals,
-                set_portals: set_portals
-            })
-    });
-}
-
-
-
-
-
-
-let $48d7f568740a317d$var$render_cb;
-function $48d7f568740a317d$export$d87c61cecb2edf0d(props) {
-    return (0, $c83ba9ab79386687$export$f6e64e17bd69eeef)((0, $c83ba9ab79386687$export$e5139bbbb9a05035)($48d7f568740a317d$var$SolidCategoryPage), props, "div", {}, (props)=>$48d7f568740a317d$var$render_cb?.(props));
-}
-function $48d7f568740a317d$var$SolidCategoryPage(props, set_portals) {
-    const depict_category = (0, $42858f023ef23dab$export$8e769ad4338a911e).category;
-    if (!depict_category) throw Error("No depict_category instance when rendering SearchPage. Did you forget to wrap your app in DepictProvider?");
-    const [category_state_set, set_category_state_set] = (0, $TZSbU$createSignal)(false);
-    $48d7f568740a317d$var$render_cb = (props)=>{
-        depict_category.category_id = props.categoryId;
-        (0, $42858f023ef23dab$export$8e769ad4338a911e).category_path = location.pathname;
-        if (props.categoryId) set_category_state_set(true);
-    };
-    $48d7f568740a317d$var$render_cb(props);
-    const component_portals = new Set();
-    const category = ()=>(0, $TZSbU$CategoryPage)({
-            depict_category: depict_category,
-            cols_at_size: props.columnsAtSize ?? [
-                [
-                    4
-                ],
-                [
-                    3,
-                    1024
-                ],
-                [
-                    2,
-                    901
-                ]
-            ],
-            grid_spacing: props.gridSpacing ?? "2%",
-            get_product_id: ()=>"",
-            category_title: props.categoryTitlePlugin || (0, $43099132aad1ceb6$re_export$CategoryTitle),
-            show_breadcrumbs: props.showBreadcrumbs === undefined ? true : props.showBreadcrumbs,
-            show_quicklinks: props.showQuicklinks === undefined ? true : props.showQuicklinks,
-            product_card_template: (display, info)=>(0, $c83ba9ab79386687$export$79c79419c1ef0081)({
-                    display: display,
-                    info: info,
-                    react_template: props.productCard,
-                    component_portals: component_portals,
-                    set_portals: set_portals
-                })
-        });
-    return (0, $c83ba9ab79386687$export$e5139bbbb9a05035)(category, category_state_set);
-}
-
-
-
-
-
-function $f866f7ed9f751af4$export$5646050d516e06bc() {
-    return (0, $c83ba9ab79386687$export$f6e64e17bd69eeef)((0, $c83ba9ab79386687$export$e5139bbbb9a05035)($f866f7ed9f751af4$var$vanilla_breadcrumbs), {});
-}
-function $f866f7ed9f751af4$var$vanilla_breadcrumbs() {
-    const depict_category = (0, $42858f023ef23dab$export$8e769ad4338a911e).category;
-    if (!depict_category) throw Error("No depict_category instance when rendering BreadCrumbs. Did you forget to wrap your app in DepictProvider?");
-    return (0, $TZSbU$BreadCrumbs)({
-        depict_category: depict_category
-    });
-}
-
-
-
-
-
-function $b68a14248b7ef667$export$466cdc317043f6cb() {
-    return (0, $c83ba9ab79386687$export$f6e64e17bd69eeef)((0, $c83ba9ab79386687$export$e5139bbbb9a05035)($b68a14248b7ef667$var$vanilla_quick_links), {});
-}
-function $b68a14248b7ef667$var$vanilla_quick_links() {
-    const depict_category = (0, $42858f023ef23dab$export$8e769ad4338a911e).category;
-    if (!depict_category) throw Error("No depict_category instance when rendering QuickLinks. Did you forget to wrap your app in DepictProvider?");
-    return (0, $TZSbU$QuickLinks)({
-        depict_category: depict_category
-    });
-}
-
-
-
-
-const $f446a84f85ba06f6$export$3f37af283f8fb843 = ({ aspectRatio: aspectRatio  })=>{
-    return (0, $c83ba9ab79386687$export$f6e64e17bd69eeef)(()=>(0, $TZSbU$ContainedPlaceholderImage)({
-            aspect_ratio: aspectRatio
-        }), {}, "div", {
-        "height": "100%"
-    });
-};
-
-
-
-
-const $cbd250061abf11cb$export$89c6019e4baa40b1 = ({ width: width , height: height  })=>{
-    return (0, $c83ba9ab79386687$export$f6e64e17bd69eeef)(()=>(0, $TZSbU$Placeholder)({
-            width: width,
-            height: height
-        }), {}, "div", {
-        "height": "100%"
-    });
-};
-
-
-
-
-
-
-
-
-const $5e26376d86621891$export$d69d8daa20eae175 = (createOpenModalParams)=>{
-    const { globalState: globalState , location: location , alignerRef: alignerRef  } = createOpenModalParams;
-    const openModal = ()=>{
-        const headerAligner = alignerRef?.current;
-        if (!globalState.search) throw new Error("No active search in the app!");
-        if (!headerAligner && location === "aligned") throw new Error("No active search header aligner on the page!");
-        const alignment_height = headerAligner?.clientHeight;
-        if (location !== "aligned" || isNaN(alignment_height)) {
-            // Open centered modal
-            globalState.search.modal_open = true;
-            return;
-        }
-        const style_element = document.createElement("style");
-        document.head.append(style_element);
-        const resize_observer = new ResizeObserver((0, $TZSbU$catchify)(()=>{
-            const styles = (0, $TZSbU$styles_to_valid_css_string)({
-                ".depict.plp .depict-search-modal .query-input": {
-                    "height": `${headerAligner?.clientHeight}px`
-                }
-            });
-            style_element.replaceChildren(styles);
-        }));
-        resize_observer.observe(headerAligner);
-        let dispose_aligner;
-        /**
-     * Setting position to fixed is important to make the modal work with align_field.
-     */ const style_props_ = (0, $TZSbU$createSignal)({
-            position: "fixed"
-        });
-        (0, $TZSbU$createRoot)((dispose)=>{
-            dispose_aligner = ()=>{
-                resize_observer.disconnect();
-                style_element.remove();
-                dispose();
-            };
-            (0, $TZSbU$align_field)(style_props_, headerAligner, undefined, false, "top");
-        });
-        globalState.search.modal_open = [
-            {
-                style_props_: style_props_
-            },
-            dispose_aligner
-        ];
-    };
-    return openModal;
-};
-
-
-function $cfa72c75e6cf6901$export$cc1e9aaf280afdcb(params) {
-    const open = (0, $5e26376d86621891$export$d69d8daa20eae175)({
-        globalState: $42858f023ef23dab$export$8e769ad4338a911e,
-        ...params
-    });
-    return {
-        open: open
-    };
-}
-
-
-
-
-
-const $c9c4d066f9a5b51b$export$83d89fbfd8236492 = "0.0.59";
-
-
-
-
-const $a92aa2beb560b8af$export$804fac5697cfbe35 = (router)=>(href)=>{
-        const shallow = (0, $c83ba9ab79386687$export$92a8f8b3c630fa0d)(location);
-        router.push(href, undefined, {
-            shallow: shallow,
-            scroll: true
-        });
-    };
-
-
-/**
- * Helper function that creates a function that can be used as the
- * navigateFunction callback for DepictProvider when using react-router.
- *
- * React-router expect relative URLs, so this function will strip the
- * protocol, hostname and port from the URL.
- *
- * @param navigateFunction what useNavigate() returns
- * @returns a function that can be used as the navigateFunction callback for DepictProvider
- */ const $01e1970add53d62a$export$d53481656a62aebe = (navigateFunction)=>(href)=>{
-        const url_object = new URL(href);
-        return navigateFunction(url_object.pathname + url_object.search + url_object.hash);
-    };
-
-
-const $97603d19204ec48d$export$b8a61e5c71402559 = {
-    nextRouterNavigation: $a92aa2beb560b8af$export$804fac5697cfbe35,
-    reactRouterNavigation: $01e1970add53d62a$export$d53481656a62aebe
-};
-
-
-const $43099132aad1ceb6$var$package_name = "@depict-ai/react-ui";
-(0, $TZSbU$dlog)($43099132aad1ceb6$var$package_name + " version", (0, $c9c4d066f9a5b51b$export$83d89fbfd8236492));
-(0, $TZSbU$add_to_version_info)({
-    [$43099132aad1ceb6$var$package_name]: (0, $c9c4d066f9a5b51b$export$83d89fbfd8236492)
-});
-
-
-export {$b68a14248b7ef667$export$466cdc317043f6cb as QuickLinks, $f866f7ed9f751af4$export$5646050d516e06bc as BreadCrumbs, $4db0e2f013fc5124$export$3f4580d6398c5027 as DepictAligner, $5376eb2a386cd90d$export$9fac37a9c21c2f3b as DepictProvider, $48d7f568740a317d$export$d87c61cecb2edf0d as DepictCategoryPage, $4a678f0c87b12e78$export$210723f5a54a7028 as DepictSearchPage, $02e2452814b6e7d6$export$4c0fa313cf50c4ad as DepictSearchField, $f446a84f85ba06f6$export$3f37af283f8fb843 as ImagePlaceholder, $cbd250061abf11cb$export$89c6019e4baa40b1 as TextPlaceholder, $cfa72c75e6cf6901$export$cc1e9aaf280afdcb as useDepictSearchModal, $43099132aad1ceb6$re_export$CategoryTitle as CategoryTitle, $43099132aad1ceb6$re_export$EmbeddedNumProducts as EmbeddedNumProducts, $c9c4d066f9a5b51b$export$83d89fbfd8236492 as version, $97603d19204ec48d$export$b8a61e5c71402559 as Navigation};