@depict-ai/react-ui 4.8.7 → 4.9.1

package/dist/client/module_es10/index.js

@@ -0,0 +1,1361 @@
+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";
+import {CategoryTitle as $383b6fd56bf151bd$re_export$CategoryTitle, embedded_num_products as $383b6fd56bf151bd$re_export$EmbeddedNumProducts, SearchModalV2 as $383b6fd56bf151bd$re_export$SearchModalV2, ClassicSearchModal as $383b6fd56bf151bd$re_export$ClassicSearchModal, 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, LooksSliderOrGrid as $jb2Oo$LooksSliderOrGrid, modalVersionSymbol as $jb2Oo$modalVersionSymbol, open_modal_with_alignment as $jb2Oo$open_modal_with_alignment, SearchField as $jb2Oo$SearchField, fetchDepictRecommendations as $jb2Oo$fetchDepictRecommendations} from "@depict-ai/ui";
+import {untrack as $jb2Oo$untrack, createRoot as $jb2Oo$createRoot, createEffect as $jb2Oo$createEffect, createSignal as $jb2Oo$createSignal, createComputed as $jb2Oo$createComputed, createMemo as $jb2Oo$createMemo, onCleanup as $jb2Oo$onCleanup, getOwner as $jb2Oo$getOwner, runWithOwner as $jb2Oo$runWithOwner, on as $jb2Oo$on, mapArray as $jb2Oo$mapArray, Show as $jb2Oo$Show, createRenderEffect as $jb2Oo$createRenderEffect} from "solid-js";
+import {createElement as $jb2Oo$createElement, Fragment as $jb2Oo$Fragment, useEffect as $jb2Oo$useEffect, useState as $jb2Oo$useState, useRef as $jb2Oo$useRef, forwardRef as $jb2Oo$forwardRef, Component as $jb2Oo$Component, useCallback as $jb2Oo$useCallback} from "react";
+import {defaultLocale as $jb2Oo$defaultLocale} from "@depict-ai/ui/locales";
+import {render as $jb2Oo$render, createComponent as $jb2Oo$createComponent, hydrate as $jb2Oo$hydrate, isServer as $jb2Oo$isServer, ssr as $jb2Oo$ssr, ssrHydrationKey as $jb2Oo$ssrHydrationKey} from "solid-js/web";
+import {createStore as $jb2Oo$createStore, reconcile as $jb2Oo$reconcile} from "solid-js/store";
+import {DPC as $jb2Oo$DPC} from "@depict-ai/dpc";
+import {jsx as $jb2Oo$jsx} from "react/jsx-runtime";
+import {createPortal as $jb2Oo$createPortal} from "react-dom";
+import {renderToString as $jb2Oo$renderToString} from "react-dom/server";
+
+/*! 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 $9bd9bb8700ab2ada$export$83d89fbfd8236492 = "4.9.1";
+
+
+
+
+
+
+
+
+
+
+
+const $8c691d7f86317052$export$8e769ad4338a911e = {
+    usedLocale: (0, $jb2Oo$createSignal)((0, $jb2Oo$defaultLocale)),
+    search_instances: new Map(),
+    category_instances: new Map(),
+    api: null,
+    dpc: null,
+    merchant: (0, $jb2Oo$createSignal)(),
+    market: (0, $jb2Oo$createSignal)(),
+    sessionId: (0, $jb2Oo$createSignal)(),
+    known_category_paths: new Set(),
+    search_page_path_: (0, $jb2Oo$createSignal)(),
+    search_page_in_dom: (0, $jb2Oo$createSignal)(false),
+    category_page_in_dom: (0, $jb2Oo$createSignal)(false),
+    provider_is_updating: (0, $jb2Oo$createSignal)(false),
+    enable_content_search: (0, $jb2Oo$createSignal)(),
+    disable_override_listing_id: (0, $jb2Oo$createSignal)()
+};
+
+
+
+
+
+
+let $ac53b4e3251b31d0$var$run_on_href_change;
+let $ac53b4e3251b31d0$var$old_href = location.href;
+function $ac53b4e3251b31d0$export$74f3924c5027fe1d(cb) {
+    $ac53b4e3251b31d0$var$run_on_href_change = cb;
+}
+(0, $jb2Oo$instant_exec_on_suspect_history_change).add((0, $jb2Oo$catchify)(()=>{
+    const { href: href } = location;
+    if ($ac53b4e3251b31d0$var$run_on_href_change && $ac53b4e3251b31d0$var$old_href !== href) $ac53b4e3251b31d0$var$run_on_href_change(href);
+    $ac53b4e3251b31d0$var$old_href = href;
+}));
+const $ac53b4e3251b31d0$export$775e6b3892b5ad52 = function() {
+    let url = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : location;
+    return url.pathname == (0, $jb2Oo$untrack)((0, $8c691d7f86317052$export$8e769ad4338a911e).search_page_path_[0]);
+}; // might have changed therefore get it from globalState
+const $ac53b4e3251b31d0$export$30c8a12df09be0e4 = function() {
+    let url = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : location;
+    return (0, $8c691d7f86317052$export$8e769ad4338a911e).known_category_paths.has(url.pathname);
+};
+function $ac53b4e3251b31d0$export$f6e64e17bd69eeef(_ref) {
+    let { solid_component: solid_component, props: props, wrapper_type: wrapper_type = "div", wrapper_style: wrapper_style = {}, hydrate_function_when_ssr: hydrate_function_when_ssr } = _ref;
+    const [portals, set_portals] = (0, $jb2Oo$useState)([]);
+    const wrapper_element_ref = (0, $jb2Oo$useRef)();
+    const [[store, write_store]] = (0, $jb2Oo$useState)(()=>(0, $jb2Oo$createStore)(props));
+    // Update store when props change
+    write_store((0, $jb2Oo$reconcile)(props));
+    (0, $jb2Oo$useEffect)(()=>{
+        let gotDisposed = false;
+        const wrapper_element = wrapper_element_ref.current;
+        // If someone only rendered a solid component on the client that *could* be hydrated (no childNodes) then we fall back to `render` to avoid solid complaining about not being able to hydrate or crashing because the result of generateHydrationScript hasn't run at all
+        // This can happen for HMR or when SSR capable components are only rendered on the client
+        const render_function = hydrate_function_when_ssr && wrapper_element.childNodes.length ? hydrate_function_when_ssr : (0, $jb2Oo$render);
+        // Our system of suppressing hydration warnings and SSR-ing seems to generally work (all the time also in our test storefronts)
+        // But sometimes in prod (see https://depictaiworkspace.slack.com/archives/C061PGT2N3A/p1702038855265339) react for some reason actually sets innerHTML = ""; on our wrapper
+        // Deleting all our elements. To prevent that we just patch innerHTML to not do anything when being set to a new value
+        if (hydrate_function_when_ssr && !Object.getOwnPropertyNames(wrapper_element).includes("innerHTML")) Object.defineProperty(wrapper_element, "innerHTML", {
+            configurable: false,
+            enumerable: true,
+            get () {
+                var _Object$getOwnPropert, _Object$getOwnPropert2;
+                return (_Object$getOwnPropert = Object.getOwnPropertyDescriptor(Element.prototype, "innerHTML")) === null || _Object$getOwnPropert === void 0 ? void 0 : (_Object$getOwnPropert2 = _Object$getOwnPropert.get) === null || _Object$getOwnPropert2 === void 0 ? void 0 : _Object$getOwnPropert2.call(wrapper_element);
+            },
+            set () {
+            // Do nothing
+            }
+        });
+        const dispose = render_function(()=>solid_component(store, (newPortals)=>!gotDisposed && set_portals(newPortals)), wrapper_element);
+        return ()=>{
+            // Try being stupid react strict mode re-running effect proof https://legacy.reactjs.org/docs/strict-mode.html#ensuring-reusable-state
+            // And https://github.com/facebook/react/issues/24502
+            dispose();
+            // Nuke absolutely everything when this effect gets torn down so that we don't have any stale state or portals
+            gotDisposed = true;
+            wrapper_element.replaceChildren();
+            set_portals([]);
+        };
+    }, []);
+    return /*#__PURE__*/ (0, $jb2Oo$createElement)((0, $jb2Oo$Fragment), null, /*#__PURE__*/ (0, $jb2Oo$createElement)(wrapper_type, {
+        ref: wrapper_element_ref,
+        style: wrapper_style,
+        ...hydrate_function_when_ssr ? {
+            // We need this because on the server we put the solid SSR rendered string into html but it won't match on the client, luckily we can just suppress it
+            suppressHydrationWarning: true,
+            dangerouslySetInnerHTML: {
+                __html: ""
+            }
+        } : {}
+    }), ...portals);
+}
+
+
+
+
+let $64144f6d578fd8ac$var$set = false;
+let $64144f6d578fd8ac$var$padding_animation;
+function $64144f6d578fd8ac$export$6453cbc34515a94d() {
+    var _window, _window$next, _window$next$router, _window$next$router$e;
+    /// WARNING WARNING WARNING
+    // If you are debugging scroll restoration, make sure you're not in strict mode!!!!! Scroll restoration in nextjs won't work in strict mode because react will nuke all our elements from the DOM and render them again during going back
+    // Next 13.x+ has strict mode by default, opt out by setting reactStrictMode: false in next.config.js
+    const are_on_search_or_category_page = ()=>(0, $ac53b4e3251b31d0$export$775e6b3892b5ad52)() || (0, $ac53b4e3251b31d0$export$30c8a12df09be0e4)();
+    if ($64144f6d578fd8ac$var$set) return; // Just being safe
+    $64144f6d578fd8ac$var$set = true;
+    // We used to initialise this variable with false which in some cases (scroll to top button in FloatingButtons) would cause the scroll to be blocked when it shouldn't (see https://depictaiworkspace.slack.com/archives/C058KQ3MU8Z/p1686141321127089?thread_ts=1686134246.109689&cid=C058KQ3MU8Z)
+    // I don't know why we'd want to initialise it with false? The only reason I can see is in the hopes of scroll restoration working on initial page load, but it basically never does due to react rendering and executing our component too late
+    let should_use_old_scroll = true;
+    const old_scrollTo = window.scrollTo;
+    const next_router_event_target = $64144f6d578fd8ac$var$make_next_router_event_target(); // So we can use once: true
+    window.scrollTo = function() {
+        if (should_use_old_scroll || process.env.__NEXT_SCROLL_RESTORATION || !are_on_search_or_category_page() || history.scrollRestoration === "manual" // I.e. Chimi has manual scroll restoration that we don't want to block https://depictaiworkspace.slack.com/archives/C058KQ3MU8Z/p1686658007164019?thread_ts=1686134246.109689&cid=C058KQ3MU8Z
+        ) {
+            for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++)args[_key] = arguments[_key];
+            return Reflect.apply(old_scrollTo, window, args);
+        } else should_use_old_scroll = true;
+    };
+    // When popping state, add padding in the same event as the "popstate" event (required) and then remove it once our stuff is in the DOM
+    addEventListener("popstate", (0, $jb2Oo$catchify)(()=>{
+        if (!are_on_search_or_category_page()) {
+            $64144f6d578fd8ac$var$removeLotsOfPadding(); // Just making sure
+            return;
+        }
+        should_use_old_scroll = false;
+        const [get_search_page_in_dom] = (0, $8c691d7f86317052$export$8e769ad4338a911e).search_page_in_dom;
+        const [get_category_page_in_dom] = (0, $8c691d7f86317052$export$8e769ad4338a911e).category_page_in_dom;
+        const search_page_in_dom = (0, $jb2Oo$untrack)(get_search_page_in_dom);
+        const category_page_in_dom = (0, $jb2Oo$untrack)(get_category_page_in_dom);
+        const new_is_search = (0, $ac53b4e3251b31d0$export$775e6b3892b5ad52)();
+        const new_is_category = (0, $ac53b4e3251b31d0$export$30c8a12df09be0e4)();
+        let accessor_to_wait_for;
+        if (search_page_in_dom && new_is_search || category_page_in_dom && new_is_category) {
+            // Already on the page we're going to
+            $64144f6d578fd8ac$var$removeLotsOfPadding();
+            return;
+        }
+        $64144f6d578fd8ac$var$addLotsOfPadding();
+        if (new_is_search && category_page_in_dom) accessor_to_wait_for = get_search_page_in_dom;
+        else if (new_is_category && search_page_in_dom) accessor_to_wait_for = get_category_page_in_dom;
+        else accessor_to_wait_for = new_is_search ? get_search_page_in_dom : get_category_page_in_dom;
+        (0, $jb2Oo$createRoot)((dispose)=>(0, $jb2Oo$createEffect)(()=>{
+                if (accessor_to_wait_for()) {
+                    $64144f6d578fd8ac$var$removeLotsOfPadding();
+                    dispose();
+                }
+            }));
+    }));
+    (_window = window) === null || _window === void 0 || (_window$next = _window.next) === null || _window$next === void 0 || (_window$next$router = _window$next.router) === null || _window$next$router === void 0 || (_window$next$router$e = _window$next$router.events) === null || _window$next$router$e === void 0 || _window$next$router$e.on(// We have to use the actual next router here, if we'd use next_router_event_target for this window.event wouldn't be the popstate anymore
+    "routeChangeStart", (0, $jb2Oo$catchify)(()=>{
+        // this is for when we navigate to a new page (replaceState or pushState)
+        // We need to ensure that the page doesn't get shorter before the new history entry has been pushed
+        // There is beforeHistoryChange which fires literally the line of code before the history API is called, so we make the page long until a task after that
+        // The challenge is knowing on routeChangeStart if we're in a popstate (back/forward) or a pushState/replaceState
+        // We use the deprecated window.event property for that
+        // This is catchified, so we should see in sentry when it starts failing if browsers ever remove it???
+        if (window.event instanceof PopStateEvent) return;
+        $64144f6d578fd8ac$var$addLotsOfPadding();
+        next_router_event_target.addEventListener("beforeHistoryChange", (0, $jb2Oo$catchify)(()=>(0, $jb2Oo$queueMacroTask)($64144f6d578fd8ac$var$removeLotsOfPadding)), {
+            once: true
+        });
+    }));
+}
+/*
+ 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 $64144f6d578fd8ac$var$addLotsOfPadding() {
+    var _history$state, _history$state$search, _history$state$search2;
+    if ($64144f6d578fd8ac$var$padding_animation) return; // We're already showing a bunch of padding
+    $64144f6d578fd8ac$var$padding_animation = document.body.animate({
+        paddingBottom: (((_history$state = history.state) === null || _history$state === void 0 ? void 0 : (_history$state$search = _history$state.search_scroll_restoration_data) === null || _history$state$search === void 0 ? void 0 : (_history$state$search2 = _history$state$search[0]) === null || _history$state$search2 === void 0 ? void 0 : _history$state$search2.min_results_loaded) || 150) * 500 + "px",
+        offset: 0
+    }, 1);
+    $64144f6d578fd8ac$var$padding_animation.pause();
+}
+function $64144f6d578fd8ac$var$removeLotsOfPadding() {
+    if ($64144f6d578fd8ac$var$padding_animation) {
+        $64144f6d578fd8ac$var$padding_animation.play();
+        $64144f6d578fd8ac$var$padding_animation = undefined;
+    }
+}
+function $64144f6d578fd8ac$var$make_next_router_event_target() {
+    var _window2, _window2$next, _window2$next$router, _window2$next$router$;
+    const next_router_event_target = new EventTarget();
+    (_window2 = window) === null || _window2 === void 0 || (_window2$next = _window2.next) === null || _window2$next === void 0 || (_window2$next$router = _window2$next.router) === null || _window2$next$router === void 0 || (_window2$next$router$ = _window2$next$router.events) === null || _window2$next$router$ === void 0 || _window2$next$router$.on("beforeHistoryChange", ()=>next_router_event_target.dispatchEvent(new CustomEvent("beforeHistoryChange")));
+    return next_router_event_target;
+}
+
+
+
+
+const $7abe9e29758fa0eb$export$599d4515591ef232 = (relativeUrl, isReplace, scroll)=>{
+    var _window, _window$next;
+    if (typeof ((_window = window) === null || _window === void 0 ? void 0 : (_window$next = _window.next) === null || _window$next === void 0 ? void 0 : _window$next.router) === "undefined") throw new Error("You must provide a navigateFunction when not using Next.js.");
+    let Page;
+    (function(Page) {
+        Page[Page["OTHER"] = 0] = "OTHER";
+        Page[Page["SEARCH"] = 1] = "SEARCH";
+        Page[Page["CATEGORY"] = 2] = "CATEGORY";
+    })(Page || (Page = {}));
+    const current_page = (0, $ac53b4e3251b31d0$export$775e6b3892b5ad52)() ? Page.SEARCH : (0, $ac53b4e3251b31d0$export$30c8a12df09be0e4)() ? Page.CATEGORY : Page.OTHER;
+    const target_u_o = new URL(relativeUrl, location.origin);
+    const target_page = (0, $ac53b4e3251b31d0$export$775e6b3892b5ad52)(target_u_o) ? Page.SEARCH : (0, $ac53b4e3251b31d0$export$30c8a12df09be0e4)(target_u_o) ? Page.CATEGORY : Page.OTHER;
+    window.next.router[isReplace ? "replace" : "push"](relativeUrl, undefined, {
+        shallow: current_page === target_page && target_page !== Page.OTHER,
+        scroll: // Can't go shallowly to other pages
+        scroll
+    });
+};
+
+
+
+
+const $b34796f5ebe3470e$export$38b98fae14bd1f64 = ()=>{
+    if (!(0, $8c691d7f86317052$export$8e769ad4338a911e).dpc) throw new Error("Depict tracking is not configured. Wrap your app in a DepictProvider.");
+    return {
+        dpc: (0, $8c691d7f86317052$export$8e769ad4338a911e).dpc
+    };
+};
+const $b34796f5ebe3470e$export$47e064413edabf36 = (merchant, market, sessionId)=>{
+    if (!merchant) return;
+    try {
+        let { dpc: dpc } = (0, $8c691d7f86317052$export$8e769ad4338a911e);
+        if (!dpc) dpc = (0, $8c691d7f86317052$export$8e769ad4338a911e).dpc = new (0, $jb2Oo$DPC)(merchant, {
+            market: market
+        });
+        dpc.merchant = merchant;
+        dpc.market = market;
+        dpc.setSessionId(sessionId);
+    } catch (e) {
+        // Make sure to not break the users app if we throw
+        queueMicrotask(()=>{
+            throw e;
+        });
+    }
+};
+
+
+
+
+
+function $bef9f58602be2478$export$bae2769a30719c48(disposable, stateKey) {
+    const actual_function = (dispose)=>{
+        var _globalState$enableCa;
+        const { usedLocale: [get_locale], merchant: [get_merchant], market: [get_market], search_query_url_param_name: search_query_url_param_name, search_page_path_: [get_search_page_path], enable_content_search: [get_enable_content_search] } = (0, $8c691d7f86317052$export$8e769ad4338a911e);
+        const instance = new (0, $jb2Oo$DepictSearch)({
+            api: (0, $8c691d7f86317052$export$8e769ad4338a911e).api,
+            search_query_url_param_name: search_query_url_param_name,
+            market: (0, $jb2Oo$untrack)(get_market),
+            // TODO: check if we can do this
+            merchant: (0, $jb2Oo$untrack)(get_merchant),
+            enable_category_suggestions: (_globalState$enableCa = (0, $8c691d7f86317052$export$8e769ad4338a911e).enableCategorySuggestions) !== null && _globalState$enableCa !== void 0 ? _globalState$enableCa : false,
+            // default category suggestions to false for @depict-ai/react-ui (https://linear.app/depictai/issue/FRO-401/default-enablecategorysuggestions-to-false)
+            localization: (0, $jb2Oo$untrack)(get_locale),
+            url_transformer: (url)=>url.pathname = (0, $jb2Oo$untrack)(get_search_page_path),
+            on_navigation: function() {
+                return (0, $8c691d7f86317052$export$8e769ad4338a911e).on_navigation(...arguments);
+            },
+            // wrapping the function here since it could change
+            unique_instance_key_for_state: stateKey,
+            enable_content_search: (0, $jb2Oo$untrack)(get_enable_content_search),
+            searchModalComponent: (0, $8c691d7f86317052$export$8e769ad4338a911e).searchModalComponent_ || (process.env.NO_SEARCH_MODAL_DEFAULT === "true" ? undefined : (0, $383b6fd56bf151bd$re_export$SearchModalV2))
+        });
+        (0, $jb2Oo$createComputed)(()=>{
+            const new_merchant = get_merchant();
+            if (new_merchant) instance.merchant = new_merchant;
+        });
+        (0, $jb2Oo$createComputed)(()=>{
+            const new_market = get_market();
+            if (new_market) instance.market = new_market;
+        });
+        (0, $jb2Oo$createComputed)(()=>instance.localization = get_locale());
+        (0, $jb2Oo$createComputed)(()=>instance.enable_content_search = get_enable_content_search());
+        return {
+            instance: instance,
+            dispose: dispose,
+            users: 0
+        };
+    };
+    const function_length_0 = ()=>actual_function();
+    const function_length_1 = (dispose)=>actual_function(dispose);
+    return (0, $jb2Oo$createRoot)(disposable ? function_length_1 : function_length_0); // solid-js creates roots differently based on if it can detect a dispose argument, with function.length. That's why this is written like this
+}
+
+
+
+
+
+function $b1c85026e863c95b$export$248b95d5073d5bab(disposable, stateKey) {
+    const actual_function = (dispose)=>{
+        const { usedLocale: [get_locale], merchant: [get_merchant], market: [get_market], disable_override_listing_id: [get_disable_override_listing_id] } = (0, $8c691d7f86317052$export$8e769ad4338a911e);
+        const instance = new (0, $jb2Oo$DepictCategory)({
+            api: (0, $8c691d7f86317052$export$8e769ad4338a911e).api,
+            market: (0, $jb2Oo$untrack)(get_market),
+            // TODO: check if we can do this
+            merchant: (0, $jb2Oo$untrack)(get_merchant),
+            localization: (0, $jb2Oo$untrack)(get_locale),
+            on_navigation: function() {
+                return (0, $8c691d7f86317052$export$8e769ad4338a911e).on_navigation(...arguments);
+            },
+            // wrapping the function here since it could change
+            unique_instance_key_for_state: stateKey
+        });
+        (0, $jb2Oo$createComputed)(()=>{
+            const new_merchant = get_merchant();
+            if (new_merchant) instance.merchant = new_merchant;
+        });
+        (0, $jb2Oo$createComputed)(()=>{
+            const new_market = get_market();
+            if (new_market) instance.market = new_market;
+        });
+        (0, $jb2Oo$createComputed)(()=>instance.localization = get_locale());
+        (0, $jb2Oo$createComputed)(()=>instance.disable_override_listing_id = get_disable_override_listing_id());
+        return {
+            instance: instance,
+            dispose: dispose,
+            users: 0
+        };
+    };
+    const function_length_0 = ()=>actual_function();
+    const function_length_1 = (dispose)=>actual_function(dispose);
+    return (0, $jb2Oo$createRoot)(disposable ? function_length_1 : function_length_0); // solid-js creates roots differently based on if it can detect a dispose argument, with function.length. That's why this is written like this
+}
+
+
+let $18e5b9f66c7ade8e$var$provider_instances = 0;
+function $18e5b9f66c7ade8e$export$9fac37a9c21c2f3b(props) {
+    (0, $8c691d7f86317052$export$8e769ad4338a911e).provider_is_updating[1](true);
+    try {
+        return $18e5b9f66c7ade8e$var$ActualDepictProvider(props);
+    } finally{
+        (0, $8c691d7f86317052$export$8e769ad4338a911e).provider_is_updating[1](false);
+    }
+}
+function $18e5b9f66c7ade8e$var$ActualDepictProvider(props) {
+    var _props$search, _props$category;
+    const { children: children, navigateFunction: navigateFunction, market: market, merchant: merchant, locale: locale, metaData: metaData, sessionId: sessionId } = props;
+    const usedLocale = locale !== null && locale !== void 0 ? locale : (0, $jb2Oo$defaultLocale);
+    const { searchPagePath: searchPagePath, urlParamName: urlParamName, enableCategorySuggestions: enableCategorySuggestions, enableContentSearch: enableContentSearch, searchModalComponent: searchModalComponent } = (_props$search = props.search) !== null && _props$search !== void 0 ? _props$search : {};
+    $18e5b9f66c7ade8e$var$multiple_depictprovider_guard();
+    // Will run on other prop changes, but harmless
+    (0, $8c691d7f86317052$export$8e769ad4338a911e).sessionId[1](sessionId);
+    (0, $8c691d7f86317052$export$8e769ad4338a911e).usedLocale[1](usedLocale);
+    (0, $8c691d7f86317052$export$8e769ad4338a911e).enable_content_search[1](enableContentSearch);
+    (0, $8c691d7f86317052$export$8e769ad4338a911e).metaData = metaData;
+    (0, $8c691d7f86317052$export$8e769ad4338a911e).search_query_url_param_name = urlParamName;
+    (0, $8c691d7f86317052$export$8e769ad4338a911e).enableCategorySuggestions = enableCategorySuggestions;
+    (0, $8c691d7f86317052$export$8e769ad4338a911e).disable_override_listing_id[1]((_props$category = props.category) === null || _props$category === void 0 ? void 0 : _props$category.disableOverrideListingId);
+    (0, $8c691d7f86317052$export$8e769ad4338a911e).searchModalComponent_ = searchModalComponent;
+    (0, $b34796f5ebe3470e$export$47e064413edabf36)(merchant, market, sessionId);
+    if (!market || !merchant) return (0, $jb2Oo$createElement)((0, $jb2Oo$Fragment), null, children);
+    (0, $8c691d7f86317052$export$8e769ad4338a911e).market[1](market);
+    (0, $8c691d7f86317052$export$8e769ad4338a911e).merchant[1](merchant);
+    (0, $64144f6d578fd8ac$export$6453cbc34515a94d)();
+    try {
+        const { search_instances: search_instances, category_instances: category_instances, search_page_path_: [, set_search_page_path] } = (0, $8c691d7f86317052$export$8e769ad4338a911e);
+        const on_navigation = (_ref)=>{
+            let { is_replace: is_replace, new_url: new_url, scroll: scroll } = _ref;
+            const new_relative_url = new_url.origin === location.origin ? new_url.pathname + new_url.search + new_url.hash : new_url.href; // bail out of making URL relative if it's not possible
+            if (navigateFunction) navigateFunction(new_relative_url, {
+                replace: is_replace,
+                scroll: scroll
+            });
+            else (0, $7abe9e29758fa0eb$export$599d4515591ef232)(new_relative_url, is_replace, scroll);
+        };
+        (0, $8c691d7f86317052$export$8e769ad4338a911e).on_navigation = on_navigation;
+        (0, $8c691d7f86317052$export$8e769ad4338a911e).api || ((0, $8c691d7f86317052$export$8e769ad4338a911e).api = new (0, $jb2Oo$DepictAPI)({
+            get_metadata: async ()=>(0, $8c691d7f86317052$export$8e769ad4338a911e).metaData,
+            get_session_id: ()=>(0, $jb2Oo$untrack)((0, $8c691d7f86317052$export$8e769ad4338a911e).sessionId[0])
+        }));
+        (0, $8c691d7f86317052$export$8e769ad4338a911e).api.display_transformers = props.displayTransformers;
+        if (searchPagePath) set_search_page_path($18e5b9f66c7ade8e$var$ensure_correct_formatting(searchPagePath));
+        if (!search_instances.get(undefined)) {
+            // Create initial search instance which always exists. It i.e. gards against the state getting deleted from history.state by someone pushing to it with an empty object, which commonly people copy from code snippets.
+            // Also, it emulates the behavior pre-supporting multiple "depict blocks" on the same page
+            const instance = (0, $bef9f58602be2478$export$bae2769a30719c48)(false);
+            search_instances.set(undefined, instance);
+        }
+        if (!category_instances.get(undefined)) {
+            const instance = (0, $b1c85026e863c95b$export$248b95d5073d5bab)(false);
+            category_instances.set(undefined, instance);
+        }
+    } catch (e) {
+        // Make sure to not break the users app if we throw
+        queueMicrotask(()=>{
+            throw e;
+        });
+    }
+    return (0, $jb2Oo$createElement)((0, $jb2Oo$Fragment), null, children);
+}
+function $18e5b9f66c7ade8e$var$ensure_correct_formatting(path) {
+    // Make sure the path starts with a slash as it always will and is_page will fail otherwise
+    if (!path.startsWith("/")) return "/" + path;
+    return path;
+}
+function $18e5b9f66c7ade8e$var$multiple_depictprovider_guard() {
+    (0, $jb2Oo$useEffect)(()=>{
+        $18e5b9f66c7ade8e$var$provider_instances++;
+        if ($18e5b9f66c7ade8e$var$provider_instances > 1) throw new Error("You are using multiple DepictProviders. This is not supported and will lead to unexpected behavior. You can create multiple SearchPage and CategoryPage components, but only one DepictProvider.");
+        return ()=>{
+            $18e5b9f66c7ade8e$var$provider_instances--;
+        };
+    }, []);
+}
+
+
+
+const $f6a205a95e4fdee3$export$80e99ee6b29cadd2 = /*#__PURE__*/ (0, $jb2Oo$forwardRef)((_, ref)=>{
+    return /*#__PURE__*/ (0, $jb2Oo$createElement)("div", {
+        className: "depict aligner",
+        style: {
+            height: "100%"
+        },
+        ref: ref
+    });
+});
+
+
+
+
+
+
+
+
+
+
+
+
+function $fda7a7820477f957$export$f4d89133c6985668(type, stateKey, componentName) {
+    const instances = (0, $8c691d7f86317052$export$8e769ad4338a911e)[type + "_instances"];
+    if (!instances.get(undefined)) throw Error("".concat(componentName, ": State not set up. Did you forget to wrap your app in DepictProvider? Also make sure you've provided a merchant and a market."));
+    let instance = instances.get(stateKey);
+    if (!instance) {
+        instance = type === "search" ? (0, $bef9f58602be2478$export$bae2769a30719c48)(true, stateKey) : (0, $b1c85026e863c95b$export$248b95d5073d5bab)(true, stateKey);
+        instances.set(stateKey, instance);
+    }
+    instance.users++;
+    (0, $jb2Oo$onCleanup)(()=>{
+        var _instance;
+        instance.users--;
+        if (!instance.users && (_instance = instance) !== null && _instance !== void 0 && _instance.dispose) {
+            // main instance is not disposable, and shouldn't be deletable either
+            instance.dispose();
+            instances.delete(stateKey);
+        }
+    });
+    return instance.instance;
+}
+
+
+
+
+
+
+class $88d93ed7309e90d1$export$d0f82e3ef89b1f22 extends (0, $jb2Oo$Component) {
+    constructor(props){
+        super(props);
+        this.state = {
+            hasError: false
+        };
+    }
+    static getDerivedStateFromError() {
+        // Update state so the next render will show the fallback UI.
+        return {
+            hasError: true
+        };
+    }
+    componentDidCatch(error) {
+        this.props.on_error(error);
+    }
+    render() {
+        if (this.state.hasError) // You can render any custom fallback UI
+        return (0, $jb2Oo$createElement)("div", {
+            children: "Component failed"
+        });
+        return this.props.children;
+    }
+}
+
+
+
+
+async function $cce08f18e2476cbf$export$32024253978abdc7(_ref) {
+    let { component_props: component_props, component_portals: component_portals, set_portals: set_portals, get_react_template: get_react_template, set_on_index_change_: set_on_index_change_ } = _ref;
+    let set_react_has_ran_hooks;
+    let was_cleaned_up = false;
+    const react_has_ran_hooks = new Promise((r)=>set_react_has_ran_hooks = r);
+    const solid_container = document.createElement("div");
+    const [setIndexFunctionAccessor, setIndexFunctionSetter] = (0, $jb2Oo$createSignal)();
+    let call_when_template_changes;
+    const owner = (0, $jb2Oo$getOwner)();
+    const reactProductCard = (0, $jb2Oo$jsx)((props)=>{
+        // Sneak in a hook into their product card component to know once react has finished rendering and running hooks
+        (0, $jb2Oo$useEffect)(set_react_has_ran_hooks, []);
+        const [react_template, set_react_template] = (0, $jb2Oo$useState)(()=>(0, $jb2Oo$untrack)(get_react_template));
+        const [index, setIndex] = (0, $jb2Oo$useState)(0);
+        setIndexFunctionSetter(()=>setIndex);
+        call_when_template_changes = set_react_template;
+        return react_template(set_on_index_change_ ? {
+            ...props,
+            index: index
+        } : props);
+    }, component_props);
+    const reactProductCardInErrorBoundary = (0, $jb2Oo$jsx)((0, $88d93ed7309e90d1$export$d0f82e3ef89b1f22), {
+        children: reactProductCard,
+        on_error: (error)=>(0, $jb2Oo$runWithOwner)(owner, ()=>{
+                if (was_cleaned_up) return; // Would infinite loop if we'd throw after we've already been cleaned up. That is because the `ErrorBoundary` won't be "registered" with the cleaned-up owner anymore so react would hear about the throw and attempt to re-render the error boundary or something which would throw again, etc.
+                throw new (0, $jb2Oo$ProductCardError)(error);
+            })
+    });
+    const portal = $jb2Oo$createPortal(reactProductCardInErrorBoundary, solid_container);
+    component_portals.add(portal);
+    set_portals([
+        ...component_portals
+    ]);
+    set_on_index_change_ === null || set_on_index_change_ === void 0 || set_on_index_change_((newIndex)=>{
+        var _setIndexFunctionAcce;
+        return (_setIndexFunctionAcce = setIndexFunctionAccessor()) === null || _setIndexFunctionAcce === void 0 ? void 0 : _setIndexFunctionAcce(newIndex);
+    });
+    (0, $jb2Oo$createEffect)((0, $jb2Oo$on)(get_react_template, (new_template)=>queueMicrotask(()=>{
+            var _call_when_template_c;
+            return(// if we update the state inside the portal synchronously from the parent call react gets confused with "Warning: Cannot update a component (`Unknown`) while rendering a different component (`$48d7f568740a317d$export$f7d2f673fc2f091d`). To locate the bad setState() call inside `$48d7f568740a317d$export$f7d2f673fc2f091d`, follow the stack trace as described in https://reactjs.org/link/setstate-in-render"
+            // Therefore do it after a microtask to evade detection
+            (_call_when_template_c = call_when_template_changes) === null || _call_when_template_c === void 0 ? void 0 : _call_when_template_c(()=>new_template));
+        }), {
+        defer: true
+    })); // If we get a new template. call the useState hook thing so we correctly re-execute with the new template
+    (0, $jb2Oo$onCleanup)(()=>{
+        was_cleaned_up = true;
+        // 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);
+        // Updating i.e. the merchant will cause a setState call while rendering the DepictProvider component which is illegal because it usually infinite loops react apps. In our case it doesn't though, so we just evade detection by doing it a microtask later. See also https://github.com/facebook/react/issues/18178#issuecomment-595846312
+        queueMicrotask(()=>set_portals([
+                ...component_portals
+            ]));
+    });
+    await react_has_ran_hooks; // After React has created elements it still takes some time to actually connect the refs and run the hooks. We don't want to replace placeholders before then.
+    return [
+        solid_container
+    ];
+}
+
+
+
+
+function $0565aab3357d32e9$export$84601d922bd37be1(blocks, component_portals, set_portals) {
+    // This will re-render everything if a block moves around but the alternative is that we re-render every time any state that has been used in the content blocks changes which is worse
+    return (0, $jb2Oo$mapArray)(blocks, (block)=>{
+        if (!block) return block;
+        return {
+            get span_columns () {
+                return block === null || block === void 0 ? void 0 : block.spanColumns;
+            },
+            get span_rows () {
+                return block === null || block === void 0 ? void 0 : block.spanRows;
+            },
+            get position () {
+                return block === null || block === void 0 ? void 0 : block.position;
+            },
+            content: ()=>(0, $cce08f18e2476cbf$export$32024253978abdc7)({
+                    get_react_template: ()=>block.content,
+                    component_portals: component_portals,
+                    set_portals: set_portals,
+                    component_props: {}
+                })
+        };
+    });
+}
+
+
+
+
+
+function $7d10b4c67928d97f$export$eb5844afe948564b(props) {
+    const default_is_set = (0, $jb2Oo$createMemo)(()=>{
+        var _globalState$usedLoca;
+        return !!((0, $8c691d7f86317052$export$8e769ad4338a911e).merchant[0]() && (0, $8c691d7f86317052$export$8e769ad4338a911e).market[0]() && (_globalState$usedLoca = (0, $8c691d7f86317052$export$8e769ad4338a911e).usedLocale[0]()) !== null && _globalState$usedLoca !== void 0 && _globalState$usedLoca.backend_locale_);
+    });
+    const should_show = (0, $jb2Oo$createMemo)((prev)=>{
+        if (!prev && (0, $8c691d7f86317052$export$8e769ad4338a911e).provider_is_updating[0]()) // Why `!prev`? See https://gitlab.com/depict-ai/depict.ai/-/merge_requests/7854#note_1495776987
+        // If we weren't showing the component and the DepictProvider is currently updating, wait for it to have finished updating before showing the component
+        // Otherwise as soon as tenant and market is set we render the CategoryPage, but we might not have a DepictCategory yet, see https://depictaiworkspace.slack.com/archives/C04UZ2Z0RNE/p1690895918347289?thread_ts=1688391305.529449&cid=C04UZ2Z0RNE
+        return false;
+        return (props.isSet || default_is_set)();
+    });
+    return (0, $jb2Oo$createComponent)((0, $jb2Oo$Show), {
+        get when () {
+            return should_show();
+        },
+        get children () {
+            return props.children;
+        }
+    });
+}
+
+
+const $f33e2dee70c97da3$var$rendered_components_with_state_key = new Set();
+function $f33e2dee70c97da3$export$a54ec244c8863715(props) {
+    return (0, $ac53b4e3251b31d0$export$f6e64e17bd69eeef)({
+        solid_component: function() {
+            for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++)args[_key] = arguments[_key];
+            // Work around some kind of babel bug where an optimisation turns ...args into `arguments` in the ES10 build which becomes the wrong arguments when read from teh getter
+            const ourArguments = args;
+            return (0, $jb2Oo$createComponent)((0, $7d10b4c67928d97f$export$eb5844afe948564b), {
+                get children () {
+                    return $f33e2dee70c97da3$var$SolidSearchPage(...ourArguments);
+                }
+            });
+        },
+        props: props
+    });
+}
+function $f33e2dee70c97da3$var$SolidSearchPage(props, set_portals) {
+    const depict_search = (0, $jb2Oo$createMemo)(()=>{
+        const instance = (0, $fda7a7820477f957$export$f4d89133c6985668)("search", props.stateKey, "SearchPage");
+        (0, $jb2Oo$onCleanup)(()=>{
+            var _get_search_query_upd;
+            // Make sure we don't block the search query updating signal when we switch to a new provider instance
+            (_get_search_query_upd = (0, $jb2Oo$get_search_query_updating_blocked_signal)(instance)) === null || _get_search_query_upd === void 0 || _get_search_query_upd[1](false);
+        });
+        return instance;
+    });
+    const update_updating_blocked_signal = ()=>{
+        // if search instances changes, also re-check for good measure (otherwise would have untrack around depict_search)
+        const signal = (0, $jb2Oo$get_search_query_updating_blocked_signal)(depict_search());
+        if (!signal) throw Error("No search_query_updating_blocked_signal when rendering SearchPage");
+        const [, write_signal] = signal;
+        // This causes a bug. To reproduce:
+        // 1. Go to front page
+        // 2. Make a search
+        // 3. Press back button
+        // 4. Open search modal
+        // 5. Check the list of previous queries - the query just made isn't shown
+        // This is because on the front page the search_query updating is blocked because it's not the search page, and that means that `filtered_previous_searches` in Autocomplete.tsx doesn't filter out the current search query
+        // Because it's so minor and would be quite hard to fix (one would need a second "actual search query" signal just for this purpose) it's wontfix for now
+        // EDIT: now that we're resetting this in the onCleanup of the memo above this might no longer be the case
+        write_signal(!(0, $ac53b4e3251b31d0$export$775e6b3892b5ad52)(location));
+    };
+    const [, set_search_page_in_dom] = (0, $8c691d7f86317052$export$8e769ad4338a911e).search_page_in_dom;
+    const component_portals = new Set();
+    // We should only get here once react already has a DOM node which means we should be in the DOM
+    set_search_page_in_dom(true);
+    (0, $jb2Oo$onCleanup)(()=>set_search_page_in_dom(false));
+    // 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, $ac53b4e3251b31d0$export$74f3924c5027fe1d)(update_updating_blocked_signal); // if we navigate, re-check
+    (0, $jb2Oo$createComputed)(()=>{
+        (0, $8c691d7f86317052$export$8e769ad4338a911e).search_page_path_[0](); // if react defined path changes, re-check
+        update_updating_blocked_signal();
+    });
+    $f33e2dee70c97da3$var$search_page_path_checker();
+    return (0, $jb2Oo$createMemo)(()=>{
+        const stateKey = (0, $jb2Oo$untrack)(()=>props.stateKey);
+        if ($f33e2dee70c97da3$var$rendered_components_with_state_key.has(stateKey)) throw new Error("You have multiple SearchPage components with the same stateKey: ".concat(stateKey, ". Each SearchPage component must have a unique stateKey."));
+        const transformed_content_blocks = (0, $0565aab3357d32e9$export$84601d922bd37be1)(()=>props.contentBlocksByRow, component_portals, set_portals);
+        $f33e2dee70c97da3$var$rendered_components_with_state_key.add(stateKey);
+        (0, $jb2Oo$onCleanup)(()=>$f33e2dee70c97da3$var$rendered_components_with_state_key.delete(stateKey));
+        return (0, $jb2Oo$SearchPage)({
+            // Default config goes here
+            get include_input_field () {
+                return props.includeInputField;
+            },
+            get cols_at_size () {
+                var _props$columnsAtSize;
+                return (_props$columnsAtSize = props.columnsAtSize) !== null && _props$columnsAtSize !== void 0 ? _props$columnsAtSize : (0, $jb2Oo$defaultColsAtSize);
+            },
+            get grid_spacing () {
+                var _props$gridSpacing;
+                return (_props$gridSpacing = props.gridSpacing) !== null && _props$gridSpacing !== void 0 ? _props$gridSpacing : (0, $jb2Oo$defaultGridSpacing);
+            },
+            depict_search: depict_search(),
+            product_card_template: (display, info)=>(0, $cce08f18e2476cbf$export$32024253978abdc7)({
+                    component_props: {
+                        display: display
+                    },
+                    get_react_template: ()=>props.productCard,
+                    component_portals: component_portals,
+                    set_portals: set_portals,
+                    set_on_index_change_: info === null || info === void 0 ? void 0 : info.set_on_index_change
+                }),
+            get content_blocks_by_row () {
+                return transformed_content_blocks();
+            }
+        });
+    });
+}
+/**
+ * Users often set the searchPagePath to something without the market which breaks everything using the searchPagePath internally, notably refining the search query. Add a warning for them.
+ */ function $f33e2dee70c97da3$var$search_page_path_checker() {
+    let has_warned = false;
+    (0, $jb2Oo$createEffect)(()=>{
+        if (has_warned) return;
+        const should_be_path = (0, $8c691d7f86317052$export$8e769ad4338a911e).search_page_path_[0]();
+        const { pathname: pathname } = location;
+        if (// allow some variability just to be sure
+        should_be_path !== pathname && should_be_path + "/" !== pathname && should_be_path !== pathname + "/") {
+            (0, $jb2Oo$derror)("searchPagePath is set to", should_be_path, "but the SearchPage is rendered at", pathname, ". Please double-check your searchPagePath is where the SearchPage component ends up being rendered, after all redirects, unless you're sure this is intentional.");
+            has_warned = true;
+        }
+    });
+}
+
+
+
+
+
+
+
+
+
+
+
+const $710dda89475e8c05$var$rendered_components_with_state_key = new Set();
+function $710dda89475e8c05$export$f7d2f673fc2f091d(props) {
+    return (0, $ac53b4e3251b31d0$export$f6e64e17bd69eeef)({
+        // @ts-ignore
+        solid_component: function() {
+            for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++)args[_key] = arguments[_key];
+            // Work around some kind of babel bug where an optimisation turns ...args into `arguments` in the ES10 build which becomes the wrong arguments when read from teh getter
+            const ourArguments = args;
+            return (0, $jb2Oo$createComponent)((0, $7d10b4c67928d97f$export$eb5844afe948564b), {
+                get children () {
+                    return $710dda89475e8c05$var$SolidCategoryPage(...ourArguments);
+                }
+            });
+        },
+        props: props,
+        wrapper_type: "div",
+        wrapper_style: {}
+    });
+}
+function $710dda89475e8c05$var$SolidCategoryPage(props, set_portals) {
+    const depict_category = (0, $jb2Oo$createMemo)(()=>(0, $fda7a7820477f957$export$f4d89133c6985668)("category", props.stateKey, "CategoryPage") // stateKey can change
+    );
+    const [category_state_set, set_category_state_set] = (0, $jb2Oo$createSignal)(false);
+    const component_portals = new Set();
+    const [, set_category_page_in_dom] = (0, $8c691d7f86317052$export$8e769ad4338a911e).category_page_in_dom;
+    // We should only get here once react already has a DOM node which means we should be in the DOM
+    set_category_page_in_dom(true);
+    (0, $jb2Oo$onCleanup)(()=>set_category_page_in_dom(false));
+    (0, $jb2Oo$createComputed)(()=>{
+        const { listingQuery: listingQuery } = props;
+        // listingQuery is a store, but we want to just set it as a normal object whose reference changes when the store changes
+        depict_category().listing_query = {
+            ...listingQuery
+        };
+        if (listingQuery !== null && listingQuery !== void 0 && listingQuery.id && listingQuery !== null && listingQuery !== void 0 && listingQuery.type) {
+            set_category_state_set(true);
+            (0, $8c691d7f86317052$export$8e769ad4338a911e).known_category_paths.add(location.pathname);
+        }
+    });
+    const Category = ()=>(0, $jb2Oo$createMemo)(()=>{
+            const stateKey = (0, $jb2Oo$untrack)(()=>props.stateKey);
+            if ($710dda89475e8c05$var$rendered_components_with_state_key.has(stateKey)) throw new Error("You have multiple CategoryPage components with the same stateKey: ".concat(stateKey, ". Each CategoryPage component must have a unique stateKey."));
+            $710dda89475e8c05$var$rendered_components_with_state_key.add(stateKey);
+            (0, $jb2Oo$onCleanup)(()=>$710dda89475e8c05$var$rendered_components_with_state_key.delete(stateKey));
+            const transformed_content_blocks = (0, $0565aab3357d32e9$export$84601d922bd37be1)(()=>props.contentBlocksByRow, component_portals, set_portals);
+            return (0, $jb2Oo$CategoryPage)({
+                depict_category: depict_category(),
+                get cols_at_size () {
+                    var _props$columnsAtSize;
+                    return (_props$columnsAtSize = props.columnsAtSize) !== null && _props$columnsAtSize !== void 0 ? _props$columnsAtSize : (0, $jb2Oo$defaultColsAtSize);
+                },
+                get grid_spacing () {
+                    var _props$gridSpacing;
+                    return (_props$gridSpacing = props.gridSpacing) !== null && _props$gridSpacing !== void 0 ? _props$gridSpacing : (0, $jb2Oo$defaultGridSpacing);
+                },
+                category_title: (0, $jb2Oo$untrack)(()=>props.categoryTitlePlugin) || (0, $jb2Oo$defaultCategoryTitlePlugin),
+                get show_breadcrumbs () {
+                    return props.showBreadcrumbs;
+                },
+                get show_quicklinks () {
+                    return props.showQuicklinks;
+                },
+                get content_blocks_by_row () {
+                    // Having content blocks and a slider at the same time is not supported, so we have to actually forward undefined if none are specified
+                    if (!props.contentBlocksByRow) return undefined;
+                    return transformed_content_blocks();
+                },
+                get layout () {
+                    return props.layout;
+                },
+                product_card_template: (display, info)=>(0, $cce08f18e2476cbf$export$32024253978abdc7)({
+                        component_props: {
+                            display: display
+                        },
+                        get_react_template: ()=>props.productCard,
+                        component_portals: component_portals,
+                        set_portals: set_portals,
+                        set_on_index_change_: info === null || info === void 0 ? void 0 : info.set_on_index_change
+                    })
+            });
+        });
+    return (0, $jb2Oo$createComponent)((0, $7d10b4c67928d97f$export$eb5844afe948564b), {
+        isSet: category_state_set,
+        get children () {
+            return (0, $jb2Oo$createComponent)(Category, {});
+        }
+    });
+}
+
+
+
+
+
+
+
+
+function $ec632214ac078e79$export$5646050d516e06bc(react_props) {
+    return (0, $ac53b4e3251b31d0$export$f6e64e17bd69eeef)({
+        solid_component: (solidProps)=>(0, $jb2Oo$createComponent)((0, $7d10b4c67928d97f$export$eb5844afe948564b), {
+                get children () {
+                    return (0, $jb2Oo$createComponent)($ec632214ac078e79$var$VanillaBreadcrumbs, solidProps);
+                }
+            }),
+        props: react_props
+    });
+}
+function $ec632214ac078e79$var$VanillaBreadcrumbs(props) {
+    // memo so stateKey can be dynamically changed
+    return (0, $jb2Oo$createMemo)(()=>{
+        const depict_category = (0, $fda7a7820477f957$export$f4d89133c6985668)("category", props.stateKey, "BreadCrumbs");
+        return (0, $jb2Oo$BreadCrumbs)({
+            depict_category: depict_category
+        });
+    });
+}
+
+
+
+
+
+
+
+
+function $c61814cfb91ead09$export$466cdc317043f6cb() {
+    let react_props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    return (0, $ac53b4e3251b31d0$export$f6e64e17bd69eeef)({
+        solid_component: (solidProps)=>(0, $jb2Oo$createComponent)((0, $7d10b4c67928d97f$export$eb5844afe948564b), {
+                get children () {
+                    return (0, $jb2Oo$createComponent)($c61814cfb91ead09$var$VanillaQuickLinks, solidProps);
+                }
+            }),
+        props: react_props
+    });
+}
+function $c61814cfb91ead09$var$VanillaQuickLinks(props) {
+    // memo so stateKey can be dynamically changed
+    return (0, $jb2Oo$createMemo)(()=>{
+        const depict_category = (0, $fda7a7820477f957$export$f4d89133c6985668)("category", props.stateKey, "QuickLinks");
+        return (0, $jb2Oo$QuickLinks)({
+            depict_category: depict_category
+        });
+    });
+}
+
+
+
+
+
+const $6406849926c3f794$export$3f37af283f8fb843 = (raw_react_props)=>{
+    const react_props = {
+        class: raw_react_props.className,
+        ...raw_react_props
+    };
+    return (0, $ac53b4e3251b31d0$export$f6e64e17bd69eeef)({
+        solid_component: (props_store)=>(0, $jb2Oo$ImagePlaceholder)(props_store),
+        props: react_props,
+        wrapper_type: "span",
+        hydrate_function_when_ssr: (0, $jb2Oo$hydrate)
+    });
+};
+
+
+
+
+
+const $2c7738b65cbcac1c$export$89c6019e4baa40b1 = (raw_react_props)=>{
+    const react_props = {
+        class: raw_react_props.className,
+        ...raw_react_props
+    };
+    return (0, $ac53b4e3251b31d0$export$f6e64e17bd69eeef)({
+        solid_component: (props_store)=>(0, $jb2Oo$TextPlaceholder)(props_store),
+        props: react_props,
+        wrapper_type: "span",
+        hydrate_function_when_ssr: (0, $jb2Oo$hydrate),
+        wrapper_style: {
+            "height": "100%"
+        }
+    });
+};
+
+
+
+
+
+// Triggered by synsam trying to put null here and typescript somehow not complaining
+
+function $758339150fbfe9d5$export$4daadad26e48a2c7(props) {
+    var _props$recommendation;
+    const us = "RecommendationSlider/RecommendationGrid:";
+    if (typeof (props === null || props === void 0 ? void 0 : (_props$recommendation = props.recommendations) === null || _props$recommendation === void 0 ? void 0 : _props$recommendation.then) !== "function") {
+        (0, $jb2Oo$dwarn)(us, "Got", props.recommendations, "which is not thenable");
+        throw new Error(us + " props.recommendations needs to be a promise that is either unresolved (`new Promise(() => {})`) so we can show placeholders, or resolved (`Promise.resolve(recommendation_array)`) to the recommendations to show");
+    }
+}
+
+
+function $c02e9fd51f31a1bd$export$82cfdc85a4d15688(props) {
+    (0, $758339150fbfe9d5$export$4daadad26e48a2c7)(props);
+    return (0, $ac53b4e3251b31d0$export$f6e64e17bd69eeef)({
+        solid_component: $c02e9fd51f31a1bd$export$5abb40edfde2a843,
+        props: props
+    });
+}
+function $c02e9fd51f31a1bd$export$5abb40edfde2a843(props, set_portals) {
+    const component_portals = new Set();
+    return (0, $jb2Oo$RecommendationSlider)({
+        get recommendations () {
+            return props.recommendations;
+        },
+        product_card_template: (display, info)=>(0, $cce08f18e2476cbf$export$32024253978abdc7)({
+                component_props: {
+                    display: display
+                },
+                get_react_template: ()=>props.productCard,
+                component_portals: component_portals,
+                set_portals: set_portals,
+                set_on_index_change_: info === null || info === void 0 ? void 0 : info.set_on_index_change
+            }),
+        get cols_at_size () {
+            return props.columnsAtSize || (0, $jb2Oo$defaultColsAtSize);
+        },
+        get grid_spacing () {
+            var _props$gridSpacing;
+            return (_props$gridSpacing = props.gridSpacing) !== null && _props$gridSpacing !== void 0 ? _props$gridSpacing : (0, $jb2Oo$defaultGridSpacing);
+        },
+        get title () {
+            return props.title;
+        }
+    });
+}
+
+
+
+
+
+
+
+
+function $cd68097a7ee08669$export$e46079a2793e9ec7(props, set_portals) {
+    const component_portals = new Set();
+    return (0, $jb2Oo$RecommendationGrid)({
+        get recommendations () {
+            return props.recommendations;
+        },
+        product_card_template: (display, info)=>{
+            if (0, $jb2Oo$isServer) {
+                // This function can't be async on the server
+                // @ts-ignore emulate the wrapper div that we need in prod here too for consistency
+                const reactRetVal = (0, $jb2Oo$renderToString)((0, $jb2Oo$createElement)(()=>props.productCard({
+                        display: display
+                    })));
+                return (0, $jb2Oo$ssr)([
+                    "<div",
+                    ">",
+                    "</div>"
+                ], (0, $jb2Oo$ssrHydrationKey)(), reactRetVal);
+            }
+            return (0, $cce08f18e2476cbf$export$32024253978abdc7)({
+                component_props: {
+                    display: display
+                },
+                get_react_template: ()=>props.productCard,
+                component_portals: component_portals,
+                set_portals: set_portals,
+                set_on_index_change_: info === null || info === void 0 ? void 0 : info.set_on_index_change
+            });
+        },
+        get cols_at_size () {
+            return props.columnsAtSize || (0, $jb2Oo$defaultColsAtSize);
+        },
+        get grid_spacing () {
+            var _props$gridSpacing;
+            return (_props$gridSpacing = props.gridSpacing) !== null && _props$gridSpacing !== void 0 ? _props$gridSpacing : (0, $jb2Oo$defaultGridSpacing);
+        },
+        get max_rows () {
+            return props.maxRows;
+        },
+        get title () {
+            return props.title;
+        },
+        get view_more_button () {
+            var _viewMoreButton$start;
+            const { viewMoreButton: viewMoreButton } = props;
+            return viewMoreButton ? {
+                text: viewMoreButton.text,
+                start_rows: (_viewMoreButton$start = viewMoreButton.startRows) !== null && _viewMoreButton$start !== void 0 ? _viewMoreButton$start : 2,
+                rows_per_click: viewMoreButton.rowsPerClick
+            } : undefined;
+        }
+    });
+}
+
+
+
+
+function $31abef71c0a2d3fc$export$b0a773486c1c2312(props) {
+    (0, $758339150fbfe9d5$export$4daadad26e48a2c7)(props);
+    return (0, $ac53b4e3251b31d0$export$f6e64e17bd69eeef)({
+        solid_component: (0, $cd68097a7ee08669$export$e46079a2793e9ec7),
+        props: props,
+        hydrate_function_when_ssr: (0, $jb2Oo$hydrate),
+        wrapper_type: "section"
+    });
+}
+
+
+
+
+
+
+
+function $42a99d61b8f0a22c$export$ee471bde82ce7cf7(props) {
+    return (0, $ac53b4e3251b31d0$export$f6e64e17bd69eeef)({
+        solid_component: (props)=>(0, $jb2Oo$createComponent)((0, $7d10b4c67928d97f$export$eb5844afe948564b), {
+                get children () {
+                    return (0, $jb2Oo$createComponent)($42a99d61b8f0a22c$export$5afe1596ca0120c7, props);
+                }
+            }),
+        props: props
+    });
+}
+function $42a99d61b8f0a22c$export$5afe1596ca0120c7(props) {
+    const { merchant: [merchant], market: [market], usedLocale: [locale], on_navigation: on_navigation } = (0, $8c691d7f86317052$export$8e769ad4338a911e);
+    return (0, $jb2Oo$LooksSliderOrGrid)({
+        get gridSpacing_ () {
+            var _props$gridSpacing;
+            return (_props$gridSpacing = props.gridSpacing) !== null && _props$gridSpacing !== void 0 ? _props$gridSpacing : (0, $jb2Oo$defaultGridSpacing);
+        },
+        get columnsAtSize_ () {
+            var _props$columnsAtSize;
+            return (_props$columnsAtSize = props.columnsAtSize) !== null && _props$columnsAtSize !== void 0 ? _props$columnsAtSize : (0, $jb2Oo$defaultColsAtSize);
+        },
+        get productId_ () {
+            return props.productId;
+        },
+        get imagePlaceholderAspectRatio_ () {
+            var _props$imagePlacehold;
+            return (_props$imagePlacehold = props.imagePlaceholderAspectRatio) !== null && _props$imagePlacehold !== void 0 ? _props$imagePlacehold : 0.75;
+        },
+        get title_ () {
+            return props.title;
+        },
+        get class_ () {
+            return props.className;
+        },
+        get merchant_ () {
+            return merchant();
+        },
+        get market_ () {
+            return market();
+        },
+        get priceFormatting_ () {
+            return locale().price_formatting_;
+        },
+        get locale_ () {
+            return locale().backend_locale_;
+        },
+        get onNavigation_ () {
+            return on_navigation;
+        },
+        get gridOptions_ () {
+            var _view_more_button$sta;
+            const { gridOptions: gridOptions } = props;
+            const view_more_button = gridOptions === null || gridOptions === void 0 ? void 0 : gridOptions.viewMoreButton;
+            return gridOptions && {
+                max_rows: gridOptions.maxRows,
+                view_more_button: view_more_button && {
+                    text: view_more_button.text,
+                    start_rows: (_view_more_button$sta = view_more_button.startRows) !== null && _view_more_button$sta !== void 0 ? _view_more_button$sta : 2,
+                    rows_per_click: view_more_button.rowsPerClick
+                }
+            };
+        },
+        get displayTransformers_ () {
+            var _globalState$api;
+            return (_globalState$api = (0, $8c691d7f86317052$export$8e769ad4338a911e).api) === null || _globalState$api === void 0 ? void 0 : _globalState$api.display_transformers;
+        }
+    });
+}
+
+
+
+
+
+
+
+
+
+
+const $1283ca5a3f4a4617$export$d69d8daa20eae175 = (createOpenModalParams)=>{
+    const { location: location = "centered", alignerRef: alignerRef, stateKey: stateKey } = createOpenModalParams;
+    let [deduped_variable, set_deduped_variable] = (0, $jb2Oo$useState)();
+    // When component using this hook unmounts, "untrack" our component and dispose the search instance if needed
+    (0, $jb2Oo$useEffect)(()=>{
+        var _deduped_variable, _deduped_variable$;
+        return (_deduped_variable = deduped_variable) === null || _deduped_variable === void 0 ? void 0 : (_deduped_variable$ = _deduped_variable[1]) === null || _deduped_variable$ === void 0 ? void 0 : _deduped_variable$.call(_deduped_variable);
+    }, []);
+    const openModal = ()=>{
+        var _globalState$searchMo;
+        // Get the search instance and track this component, but only once (basically work around re-rendering)
+        // We have to do this in the openModal function since people might call this hook before creating DepictProvider
+        if (!deduped_variable) {
+            deduped_variable = (0, $jb2Oo$createRoot)((dispose)=>[
+                    (0, $fda7a7820477f957$export$f4d89133c6985668)("search", stateKey, "useSearchModal"),
+                    dispose
+                ]);
+            set_deduped_variable(deduped_variable);
+        }
+        const [search] = deduped_variable;
+        const runAnimations_ = ((_globalState$searchMo = (0, $8c691d7f86317052$export$8e769ad4338a911e).searchModalComponent_) === null || _globalState$searchMo === void 0 ? void 0 : _globalState$searchMo[0, $jb2Oo$modalVersionSymbol]) === 2;
+        if (location === "aligned" && alignerRef !== null && alignerRef !== void 0 && alignerRef.current) (0, $jb2Oo$open_modal_with_alignment)({
+            "element": alignerRef.current,
+            "location": location,
+            "search": search,
+            runAnimations_: runAnimations_
+        });
+        else (0, $jb2Oo$open_modal_with_alignment)({
+            "location": "centered",
+            "search": search,
+            runAnimations_: runAnimations_
+        });
+    };
+    return openModal;
+};
+
+
+function $356d18d3ed66814e$export$912994940e660d32() {
+    let params = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    const open = (0, $1283ca5a3f4a4617$export$d69d8daa20eae175)({
+        globalState: $8c691d7f86317052$export$8e769ad4338a911e,
+        ...params
+    });
+    return {
+        open: open
+    };
+}
+
+
+
+
+
+
+
+
+
+const $ab2d430c2034aa17$export$9bb30bbe003b82e0 = function() {
+    let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    // We should just export a plain SearchField component here, not a weird hook thing, but I don't want to make a breaking change. Just fixing the re-rendering issue for now.
+    // Create signal that persists across renders
+    const [[get_aligner_signal_value, set_aligner_signal_value]] = (0, $jb2Oo$useState)((0, $jb2Oo$createSignal)());
+    // Update signal value when alignerRef changes
+    set_aligner_signal_value(props === null || props === void 0 ? void 0 : props.alignerRef);
+    // Make sure react never re-renders the actual SearchField component
+    const componentFunction = (0, $jb2Oo$useCallback)(()=>(0, $ac53b4e3251b31d0$export$f6e64e17bd69eeef)({
+            solid_component: ()=>(0, $jb2Oo$createComponent)((0, $7d10b4c67928d97f$export$eb5844afe948564b), {
+                    get children () {
+                        return (0, $jb2Oo$createMemo)(()=>{
+                            const depict_search = (0, $fda7a7820477f957$export$f4d89133c6985668)("search", props.stateKey, "useSearchField");
+                            return (0, $jb2Oo$SearchField)({
+                                depict_search: depict_search,
+                                get aligner_ref () {
+                                    var _get_aligner_signal_v;
+                                    // React mutates the object at some random time so only get the current value once it actually is requested
+                                    return (_get_aligner_signal_v = get_aligner_signal_value()) === null || _get_aligner_signal_v === void 0 ? void 0 : _get_aligner_signal_v.current;
+                                }
+                            });
+                        });
+                    }
+                }),
+            props: {}
+        }), []);
+    return {
+        SearchField: componentFunction
+    };
+};
+
+
+
+
+
+
+function $1895644749ca8d8a$export$6501da23a2770fc() {
+    return {
+        fetchRecommendations: $1895644749ca8d8a$var$fetchRecommendations
+    };
+}
+async function $1895644749ca8d8a$var$fetchRecommendations(opts) {
+    var _globalState$api, _globalState$api$disp;
+    const { merchant: [get_merchant], market: [get_market], usedLocale: [get_usedLocale], sessionId: [get_sessionId] } = (0, $8c691d7f86317052$export$8e769ad4338a911e);
+    const merchant = (0, $jb2Oo$untrack)(get_merchant);
+    const market = (0, $jb2Oo$untrack)(get_market);
+    const locale = (0, $jb2Oo$untrack)(get_usedLocale).backend_locale_;
+    if (!merchant || !market || !locale) throw new Error("Depict recommendations are not configured (merchant, market or locale is falsy). Wrap your app in a DepictProvider.");
+    const fetchedRecs = await (0, $jb2Oo$fetchDepictRecommendations)({
+        merchant: merchant,
+        market: market,
+        locale: locale,
+        sessionId: (0, $jb2Oo$untrack)(get_sessionId),
+        ...opts
+    });
+    const transformFunction = (_globalState$api = (0, $8c691d7f86317052$export$8e769ad4338a911e).api) === null || _globalState$api === void 0 ? void 0 : (_globalState$api$disp = _globalState$api.display_transformers) === null || _globalState$api$disp === void 0 ? void 0 : _globalState$api$disp.products;
+    if (transformFunction) return await transformFunction({
+        merchant: merchant,
+        market: market,
+        locale: locale,
+        displays: fetchedRecs
+    });
+    return fetchedRecs;
+}
+
+
+
+
+
+function $39af3ccd78996343$export$72616730c1fad2f4(stateKey) {
+    // Create signal that will persist re-renders
+    const [[getStateKeySignalValue, setStateKeySignalValue]] = (0, $jb2Oo$useState)((0, $jb2Oo$createSignal)(stateKey));
+    const [cachedFunctionCalls] = (0, $jb2Oo$useState)({});
+    const [hookFunctionsObject, setHookFunctionsObject] = (0, $jb2Oo$useState)(new Proxy({}, {
+        get (target, property) {
+            return function() {
+                for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++)args[_key] = arguments[_key];
+                // Cache function calls until we have the real functions
+                cachedFunctionCalls[property] = args;
+            };
+        }
+    }));
+    (0, $jb2Oo$useEffect)(()=>{
+        // get_instance_and_track_component may first return something in useEffect because the next-js router first gives us stuff from the URL after hydration (effects have ran) and we only create the instances if merchant and market is set
+        return (0, $jb2Oo$createRoot)((dispose)=>{
+            let firstRun = true;
+            (0, $jb2Oo$createRenderEffect)(()=>{
+                const depict_category = (0, $fda7a7820477f957$export$f4d89133c6985668)("category", getStateKeySignalValue(), "useCategoryFilterHelpers");
+                const functions = $39af3ccd78996343$var$createHookFunctions(depict_category);
+                if (firstRun) {
+                    firstRun = false;
+                    // Run cached function calls
+                    Object.entries(cachedFunctionCalls).forEach((_ref)=>{
+                        var _functions$key;
+                        let [key, args] = _ref;
+                        return (_functions$key = functions[key]) === null || _functions$key === void 0 ? void 0 : _functions$key.call(functions, ...args);
+                    });
+                }
+                setHookFunctionsObject(functions);
+            });
+            return dispose;
+        });
+    }, []);
+    // When props change, update our signal value so solid can react to stateKey changing
+    (0, $jb2Oo$useEffect)(()=>{
+        setStateKeySignalValue(stateKey);
+    }, [
+        stateKey
+    ]);
+    return hookFunctionsObject;
+}
+function $39af3ccd78996343$var$createHookFunctions(depictCategory) {
+    const categorySetShouldShowFilters = (newValue)=>{
+        const { historyStateSignals_: { filters_open: [, setFiltersOpen], sorting_open: [, setSortingOpen] } } = depictCategory;
+        if (newValue) // Close sorting so we don't show both at once
+        setSortingOpen(false);
+        setFiltersOpen(newValue);
+    };
+    const categorySetFilter = (filter)=>{
+        const [selectedFilters, setSelectedFilters] = depictCategory.selectedFilters_;
+        const filteredFilters = (0, $jb2Oo$untrack)(selectedFilters).filter((_ref2)=>{
+            let { field: field, op: op } = _ref2;
+            return field !== filter.field && op !== filter.op;
+        });
+        filteredFilters.push(filter);
+        setSelectedFilters(filteredFilters);
+    };
+    const categoryExpandFilterGroup = (groupToExpand)=>{
+        const [expandedFilters, setExpandedFilters] = depictCategory.historyStateSignals_.expanded_filters;
+        const newExpanded = (0, $jb2Oo$untrack)(expandedFilters).filter((_ref3)=>{
+            let { section_: section_ } = _ref3;
+            return section_ !== groupToExpand;
+        });
+        newExpanded.push({
+            section_: groupToExpand,
+            expanded_: true
+        });
+        setExpandedFilters(newExpanded);
+    };
+    return {
+        categorySetShouldShowFilters: categorySetShouldShowFilters,
+        categorySetFilter: categorySetFilter,
+        categoryExpandFilterGroup: categoryExpandFilterGroup
+    };
+}
+
+
+
+
+
+
+const $05726fa9c7eda0a1$export$804fac5697cfbe35 = (router)=>(relativeUrl, _ref)=>{
+        let { scroll: scroll, replace: replace } = _ref;
+        let Page;
+        (function(Page) {
+            Page[Page["OTHER"] = 0] = "OTHER";
+            Page[Page["SEARCH"] = 1] = "SEARCH";
+            Page[Page["CATEGORY"] = 2] = "CATEGORY";
+        })(Page || (Page = {}));
+        const current_page = (0, $ac53b4e3251b31d0$export$775e6b3892b5ad52)() ? Page.SEARCH : (0, $ac53b4e3251b31d0$export$30c8a12df09be0e4)() ? Page.CATEGORY : Page.OTHER;
+        const target_u_o = new URL(relativeUrl, location.origin);
+        const target_page = (0, $ac53b4e3251b31d0$export$775e6b3892b5ad52)(target_u_o) ? Page.SEARCH : (0, $ac53b4e3251b31d0$export$30c8a12df09be0e4)(target_u_o) ? Page.CATEGORY : Page.OTHER;
+        router[replace ? "replace" : "push"](relativeUrl, undefined, {
+            shallow: current_page === target_page && target_page !== Page.OTHER,
+            scroll: // Can't go shallowly to other pages
+            scroll
+        });
+    };
+
+
+const $a7dfdd84298ae791$export$b8a61e5c71402559 = {
+    nextRouterNavigation: $05726fa9c7eda0a1$export$804fac5697cfbe35
+};
+
+
+(0, $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, $710dda89475e8c05$export$f7d2f673fc2f091d as CategoryPage, $f33e2dee70c97da3$export$a54ec244c8863715 as SearchPage, $6406849926c3f794$export$3f37af283f8fb843 as ImagePlaceholder, $2c7738b65cbcac1c$export$89c6019e4baa40b1 as TextPlaceholder, $31abef71c0a2d3fc$export$b0a773486c1c2312 as RecommendationGrid, $c02e9fd51f31a1bd$export$82cfdc85a4d15688 as RecommendationSlider, $42a99d61b8f0a22c$export$ee471bde82ce7cf7 as LooksSliderOrGrid, $356d18d3ed66814e$export$912994940e660d32 as useSearchModal, $ab2d430c2034aa17$export$9bb30bbe003b82e0 as useSearchField, $1895644749ca8d8a$export$6501da23a2770fc as useFetchRecommendations, $b34796f5ebe3470e$export$38b98fae14bd1f64 as usePerformanceClient, $39af3ccd78996343$export$72616730c1fad2f4 as useCategoryFilterHelpers, $383b6fd56bf151bd$re_export$CategoryTitle as CategoryTitle, $383b6fd56bf151bd$re_export$EmbeddedNumProducts as EmbeddedNumProducts, $383b6fd56bf151bd$re_export$SearchModalV2 as SearchModalV2, $383b6fd56bf151bd$re_export$ClassicSearchModal as ClassicSearchModal, $9bd9bb8700ab2ada$export$83d89fbfd8236492 as version, $a7dfdd84298ae791$export$b8a61e5c71402559 as Navigation};