@depict-ai/ui 0.0.65 → 0.0.67

package/dist/module.js

@@ -1,8 +1,8 @@
-import {add_to_version_info as $g9l4l$add_to_version_info, fetch_recs as $g9l4l$fetch_recs, snakeCasifyObject as $g9l4l$snakeCasifyObject, GenericSliderArrowButton as $g9l4l$GenericSliderArrowButton, catchify as $g9l4l$catchify, base_url as $g9l4l$base_url, get_depict_id as $g9l4l$get_depict_id, get_user_id as $g9l4l$get_user_id, get_session_id as $g9l4l$get_session_id, dlog as $g9l4l$dlog, make_url_with_query_params as $g9l4l$make_url_with_query_params, fetch_retry as $g9l4l$fetch_retry, add_version_query_params as $g9l4l$add_version_query_params, sort_obj as $g9l4l$sort_obj, Tenant as $g9l4l$Tenant, Placeholder as $g9l4l$Placeholder, report as $g9l4l$report, javascript_media_query as $g9l4l$javascript_media_query, standard_price_format as $g9l4l$standard_price_format, deparallelize_no_drop as $g9l4l$deparallelize_no_drop, default_rr as $g9l4l$default_rr, make_random_classname as $g9l4l$make_random_classname, n_col_styling_with_dist as $g9l4l$n_col_styling_with_dist, observer as $g9l4l$observer, Lazyfier as $g9l4l$Lazyfier, queueMacroTask as $g9l4l$queueMacroTask, deparallelize as $g9l4l$deparallelize, Rec_Renderer as $g9l4l$Rec_Renderer, CrossIcon as $g9l4l$CrossIcon, useExpandingContainer as $g9l4l$useExpandingContainer, Amazing_Slider as $g9l4l$Amazing_Slider, slider_snap_css as $g9l4l$slider_snap_css, slider_fading_factory as $g9l4l$slider_fading_factory, MinusIcon as $g9l4l$MinusIcon, FilterIcon as $g9l4l$FilterIcon, SortIconAsc as $g9l4l$SortIconAsc, SortIconDesc as $g9l4l$SortIconDesc, PlusIcon as $g9l4l$PlusIcon, TickIcon as $g9l4l$TickIcon, ArrowUp as $g9l4l$ArrowUp, normal_get_product_id as $g9l4l$normal_get_product_id, ContainedPlaceholderImage as $g9l4l$ContainedPlaceholderImage, BackIcon as $g9l4l$BackIcon, SearchIcon as $g9l4l$SearchIcon, Layout as $g9l4l$Layout, make_placeholder_rr as $g9l4l$make_placeholder_rr, async_iterable_ipns as $g9l4l$async_iterable_ipns, make_asyncIterable_exiter as $g9l4l$make_asyncIterable_exiter, href_change_ipns as $g9l4l$href_change_ipns, depict_click as $g9l4l$depict_click, impression_track_element as $g9l4l$impression_track_element, add_new_tab_listener as $g9l4l$add_new_tab_listener, ContainedImage as $g9l4l$ContainedImage, buildThresholdList as $g9l4l$buildThresholdList, PreviousSearchIcon as $g9l4l$PreviousSearchIcon, insert_surfaces as $g9l4l$insert_surfaces, instant_exec_on_popstate_before_ipns_update as $g9l4l$instant_exec_on_popstate_before_ipns_update} from "@depict-ai/utilishared";
-import {template as $g9l4l$template, insert as $g9l4l$insert, effect as $g9l4l$effect, setAttribute as $g9l4l$setAttribute, createComponent as $g9l4l$createComponent, use as $g9l4l$use, addEventListener as $g9l4l$addEventListener, delegateEvents as $g9l4l$delegateEvents, spread as $g9l4l$spread, memo as $g9l4l$memo, style as $g9l4l$style, mergeProps as $g9l4l$mergeProps, classList as $g9l4l$classList, className as $g9l4l$className} from "solid-js/web";
-import {createSignal as $g9l4l$createSignal, onCleanup as $g9l4l$onCleanup, createComputed as $g9l4l$createComputed, createEffect as $g9l4l$createEffect, untrack as $g9l4l$untrack, batch as $g9l4l$batch, createResource as $g9l4l$createResource, createMemo as $g9l4l$createMemo, Show as $g9l4l$Show, createRenderEffect as $g9l4l$createRenderEffect, runWithOwner as $g9l4l$runWithOwner, createRoot as $g9l4l$createRoot, getOwner as $g9l4l$getOwner, on as $g9l4l$on, Index as $g9l4l$Index, For as $g9l4l$For, ErrorBoundary as $g9l4l$ErrorBoundary} from "solid-js";
+import {add_to_version_info as $g9l4l$add_to_version_info, fetch_recs as $g9l4l$fetch_recs, snakeCasifyObject as $g9l4l$snakeCasifyObject, GenericSliderArrowButton as $g9l4l$GenericSliderArrowButton, catchify as $g9l4l$catchify, base_url as $g9l4l$base_url, get_depict_id as $g9l4l$get_depict_id, get_user_id as $g9l4l$get_user_id, get_session_id as $g9l4l$get_session_id, dlog as $g9l4l$dlog, make_url_with_query_params as $g9l4l$make_url_with_query_params, fetch_retry as $g9l4l$fetch_retry, add_version_query_params as $g9l4l$add_version_query_params, sort_obj as $g9l4l$sort_obj, Tenant as $g9l4l$Tenant, Placeholder as $g9l4l$Placeholder, report as $g9l4l$report, javascript_media_query as $g9l4l$javascript_media_query, standard_price_format as $g9l4l$standard_price_format, deparallelize_no_drop as $g9l4l$deparallelize_no_drop, default_rr as $g9l4l$default_rr, make_random_classname as $g9l4l$make_random_classname, n_col_styling_with_dist as $g9l4l$n_col_styling_with_dist, observer as $g9l4l$observer, Lazyfier as $g9l4l$Lazyfier, queueMacroTask as $g9l4l$queueMacroTask, deparallelize as $g9l4l$deparallelize, Rec_Renderer as $g9l4l$Rec_Renderer, CrossIcon as $g9l4l$CrossIcon, useExpandingContainer as $g9l4l$useExpandingContainer, Amazing_Slider as $g9l4l$Amazing_Slider, slider_snap_css as $g9l4l$slider_snap_css, slider_fading_factory as $g9l4l$slider_fading_factory, MinusIcon as $g9l4l$MinusIcon, FilterIcon as $g9l4l$FilterIcon, SortIconAsc as $g9l4l$SortIconAsc, SortIconDesc as $g9l4l$SortIconDesc, PlusIcon as $g9l4l$PlusIcon, hsl_to_rgb as $g9l4l$hsl_to_rgb, relative_luminance_from_rgb as $g9l4l$relative_luminance_from_rgb, TickIcon as $g9l4l$TickIcon, ArrowUp as $g9l4l$ArrowUp, normal_get_product_id as $g9l4l$normal_get_product_id, ContainedPlaceholderImage as $g9l4l$ContainedPlaceholderImage, BackIcon as $g9l4l$BackIcon, SearchIcon as $g9l4l$SearchIcon, Layout as $g9l4l$Layout, make_placeholder_rr as $g9l4l$make_placeholder_rr, async_iterable_ipns as $g9l4l$async_iterable_ipns, make_asyncIterable_exiter as $g9l4l$make_asyncIterable_exiter, href_change_ipns as $g9l4l$href_change_ipns, depict_click as $g9l4l$depict_click, impression_track_element as $g9l4l$impression_track_element, add_new_tab_listener as $g9l4l$add_new_tab_listener, ContainedImage as $g9l4l$ContainedImage, buildThresholdList as $g9l4l$buildThresholdList, PreviousSearchIcon as $g9l4l$PreviousSearchIcon, insert_surfaces as $g9l4l$insert_surfaces, instant_exec_on_popstate_before_ipns_update as $g9l4l$instant_exec_on_popstate_before_ipns_update} from "@depict-ai/utilishared";
+import {template as $g9l4l$template, insert as $g9l4l$insert, effect as $g9l4l$effect, setAttribute as $g9l4l$setAttribute, createComponent as $g9l4l$createComponent, use as $g9l4l$use, addEventListener as $g9l4l$addEventListener, delegateEvents as $g9l4l$delegateEvents, spread as $g9l4l$spread, classList as $g9l4l$classList, memo as $g9l4l$memo, style as $g9l4l$style, mergeProps as $g9l4l$mergeProps, className as $g9l4l$className} from "solid-js/web";
+import {createSignal as $g9l4l$createSignal, onCleanup as $g9l4l$onCleanup, createComputed as $g9l4l$createComputed, createEffect as $g9l4l$createEffect, untrack as $g9l4l$untrack, batch as $g9l4l$batch, createResource as $g9l4l$createResource, createMemo as $g9l4l$createMemo, Show as $g9l4l$Show, createRenderEffect as $g9l4l$createRenderEffect, runWithOwner as $g9l4l$runWithOwner, createRoot as $g9l4l$createRoot, getOwner as $g9l4l$getOwner, createReaction as $g9l4l$createReaction, on as $g9l4l$on, ErrorBoundary as $g9l4l$ErrorBoundary, Index as $g9l4l$Index, For as $g9l4l$For} from "solid-js";
 
-/*! Depict.ai search and product listing SDK */ const $18bf1d29fb889cca$export$83d89fbfd8236492 = "0.0.65";
+/*! Depict.ai search and product listing SDK */ const $18bf1d29fb889cca$export$83d89fbfd8236492 = "0.0.67";
 
 
 
@@ -787,6 +787,55 @@ function $ed06bb0bb83a46b3$export$a2cc176055f8f08() {
 }
 
 
+
+
+
+
+
+
+// Errors caused by SDK consuming code interfacing with the SDK, not the SDK itself or other Depict packages
+class $22d7fd594100c3d0$export$e1d52e4f0c7557a1 extends Error {
+}
+class $22d7fd594100c3d0$export$aa14a9f43128f61f extends $22d7fd594100c3d0$export$e1d52e4f0c7557a1 {
+    constructor(templateError){
+        super("Uncaught error in product card template", {
+            cause: templateError
+        });
+    }
+}
+
+
+const $a406ebe9523f192f$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div></div>`, 2);
+function $a406ebe9523f192f$export$b69d0d92862de18b(props) {
+    return (0, $g9l4l$ErrorBoundary)({
+        fallback (err, retry) {
+            const { message_: message_ , severity_: severity_  } = props;
+            let message = message_;
+            if (err instanceof (0, $22d7fd594100c3d0$export$aa14a9f43128f61f)) {
+                console.error(err.cause);
+                message = `${message}: ${err.message}`;
+            } else (0, $g9l4l$report)([
+                err,
+                message_
+            ], severity_);
+            props.on_error_?.(retry);
+            return (()=>{
+                const _el$ = $a406ebe9523f192f$var$_tmpl$.cloneNode(true);
+                (0, $g9l4l$insert)(_el$, message);
+                (0, $g9l4l$effect)((_$p)=>(0, $g9l4l$classList)(_el$, Object.fromEntries(props.class_list_?.map((c)=>[
+                            c,
+                            true
+                        ]) || []), _$p));
+                return _el$;
+            })();
+        },
+        get children () {
+            return props.children;
+        }
+    });
+}
+
+
 const $57363319986950eb$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="PLP-results"></div>`, 2), $57363319986950eb$var$_tmpl$2 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="cards"></div>`, 2);
 let $57363319986950eb$var$cached_placeholder_element;
 function $57363319986950eb$export$3925f87b1545cfc6({ plp_results_: plp_results_ , depict_api_: depict_api_ , all_products_loaded_: all_products_loaded_ , min_products_to_fetch_: min_products_to_fetch_ , query_base_: query_base_ , first_result_in_viewport_: first_result_in_viewport_ , last_result_in_viewport_: last_result_in_viewport_ , scroll_restoration_data_: scroll_restoration_data_ , no_results_options_: no_results_options_ , desktop_filter_elements_: desktop_filter_elements_ , sort_or_filter_open_: sort_or_filter_open_ , rr_options_: rr_options_ , layout_options_: layout_options_ , tenant_object_: tenant_object_ , type_for_tracking_: type_for_tracking_ , id_currently_querying_for_: id_currently_querying_for_  }) {
@@ -823,8 +872,7 @@ function $57363319986950eb$export$3925f87b1545cfc6({ plp_results_: plp_results_
             recs: current_results.displays,
             ...rr_options_,
             ...typeof rr_options_.template === "function" ? {
-                template: (...args)=>(0, $g9l4l$runWithOwner)(owner_for_cards, ()=>// give template the possibility to know when it gets removed from the DOM by using solid-js onCleanup
-                        rr_options_.template(...args))
+                template: $57363319986950eb$var$wrap_template_to_throw_into_error_boundary(rr_options_.template, owner_for_cards)
             } : {},
             post_processors: [
                 ...rr_options_.post_processors || [],
@@ -869,86 +917,101 @@ function $57363319986950eb$export$3925f87b1545cfc6({ plp_results_: plp_results_
                 return (0, $g9l4l$createComponent)((0, $a20b0ecfca7ab32d$export$ef6006467f04ee41), no_results_options_);
             },
             get children () {
-                return (()=>{
-                    const random_id = (0, $g9l4l$make_random_classname)();
-                    const selector_beginning = `.depict.plp #${random_id}>`;
-                    const cards = (()=>{
-                        const _el$2 = $57363319986950eb$var$_tmpl$2.cloneNode(true);
-                        (0, $g9l4l$setAttribute)(_el$2, "id", random_id);
-                        return _el$2;
-                    })();
-                    const style = document.createElement("style");
-                    (0, $g9l4l$createRenderEffect)(()=>{
-                        // Add grid styling that changes when filters get opened/closed
-                        const when_filters_closed_cols = layout_options_.cols_at_size;
-                        const cols_at_size = sort_or_filter_open_() ? when_filters_closed_cols.map((row)=>{
-                            const [num_cols_default, , , , override_cols] = row;
-                            const cloned_row = [
-                                ...row
-                            ];
-                            // @ts-ignore
-                            cloned_row[0] = num_cols_default - 1;
-                            if (override_cols) // @ts-ignore
-                            cloned_row[4] = {
-                                overrides: Object.fromEntries(Object.entries(override_cols.overrides).map(([row, column])=>[
-                                        row,
-                                        column - 1
-                                    ]))
-                            };
-                            return cloned_row;
-                        }) : when_filters_closed_cols;
-                        const css = (0, $g9l4l$n_col_styling_with_dist)(selector_beginning, layout_options_.grid_spacing, cols_at_size, "grid", layout_options_.override_vertical_spacing);
-                        style.replaceChildren(css);
-                    });
-                    (0, $g9l4l$createRenderEffect)(// render placeholders / product cards
-                    (0, $g9l4l$catchify)(async ()=>{
-                        const owner_ = (0, $g9l4l$getOwner)();
-                        if (is_loading()) await $57363319986950eb$var$insert_placeholders({
-                            scroll_restoration_data_: scroll_restoration_data_,
-                            id_currently_querying_for_: id_currently_querying_for_,
-                            rr_options_: rr_options_,
-                            tenant_object_: tenant_object_,
-                            min_products_to_fetch_: min_products_to_fetch_,
-                            owner_: owner_,
-                            cards_element_: cards
-                        });
-                        else if (!has_no_results_or_failed()) {
-                            plp_results_(); // re-run render_and_insert_results when results change
-                            render_and_insert_results(cards, owner_);
-                        }
-                    }));
-                    // copied from RecommendationGrid
-                    // convoluted lazy loading that
-                    // when the elements are in the DOM starts IntersectionObserver on whole grid
-                    // when grid intersects starts Lazyfier
-                    // this is because Lazyfier is fucking stupid
-                    (0, $g9l4l$observer).wait_for_element(cards).then((0, $g9l4l$catchify)((element)=>{
-                        let start_lazy_loading;
-                        const lazy_loading_promise = new Promise((r)=>start_lazy_loading = r);
-                        const lf = new (0, $g9l4l$Lazyfier)({
-                            only_load_intersecting: true,
-                            wait_for_dominsertion: lazy_loading_promise,
-                            ignore_data_urls: true,
-                            lazyfinder: {
-                                unload () {}
-                            }
+                return (0, $a406ebe9523f192f$export$b69d0d92862de18b)({
+                    severity_: "error",
+                    // More granular error handling
+                    // This _also_ fails when a product card rendering fails due to the runWithOwner with a root that was created inside the "root"/"context" of this ErrorBoundary
+                    on_error_: (retry)=>{
+                        // re-try / reset ErrorBoundary next time we're getting product cards
+                        const track = (0, $g9l4l$createReaction)(retry);
+                        track(plp_results_);
+                    },
+                    class_list_: [
+                        "cards"
+                    ],
+                    // So that the styling looks pretty when we've failed
+                    message_: "Result rendering failed",
+                    get children () {
+                        const random_id = (0, $g9l4l$make_random_classname)();
+                        const selector_beginning = `.depict.plp #${random_id}>`;
+                        const cards = (()=>{
+                            const _el$2 = $57363319986950eb$var$_tmpl$2.cloneNode(true);
+                            (0, $g9l4l$setAttribute)(_el$2, "id", random_id);
+                            return _el$2;
+                        })();
+                        const style = document.createElement("style");
+                        (0, $g9l4l$createRenderEffect)(()=>{
+                            // Add grid styling that changes when filters get opened/closed
+                            const when_filters_closed_cols = layout_options_.cols_at_size;
+                            const cols_at_size = sort_or_filter_open_() ? when_filters_closed_cols.map((row)=>{
+                                const [num_cols_default, , , , override_cols] = row;
+                                const cloned_row = [
+                                    ...row
+                                ];
+                                // @ts-ignore
+                                cloned_row[0] = num_cols_default - 1;
+                                if (override_cols) // @ts-ignore
+                                cloned_row[4] = {
+                                    overrides: Object.fromEntries(Object.entries(override_cols.overrides).map(([row, column])=>[
+                                            row,
+                                            column - 1
+                                        ]))
+                                };
+                                return cloned_row;
+                            }) : when_filters_closed_cols;
+                            const css = (0, $g9l4l$n_col_styling_with_dist)(selector_beginning, layout_options_.grid_spacing, cols_at_size, "grid", layout_options_.override_vertical_spacing);
+                            style.replaceChildren(css);
                         });
-                        lf.start_observing_for_new_children_(element);
-                        const i_o = new IntersectionObserver((0, $g9l4l$catchify)((records)=>{
-                            for (const record of records)if (record.intersectionRatio > 0) {
-                                start_lazy_loading();
-                                i_o.disconnect();
-                                return;
+                        (0, $g9l4l$createRenderEffect)(// render placeholders / product cards
+                        (0, $g9l4l$catchify)(async ()=>{
+                            const owner_ = (0, $g9l4l$getOwner)();
+                            if (is_loading()) await $57363319986950eb$var$insert_placeholders({
+                                scroll_restoration_data_: scroll_restoration_data_,
+                                id_currently_querying_for_: id_currently_querying_for_,
+                                rr_options_: rr_options_,
+                                tenant_object_: tenant_object_,
+                                min_products_to_fetch_: min_products_to_fetch_,
+                                owner_: owner_,
+                                cards_element_: cards
+                            });
+                            else if (!has_no_results_or_failed()) {
+                                plp_results_(); // re-run render_and_insert_results when results change
+                                render_and_insert_results(cards, owner_);
                             }
                         }));
-                        i_o.observe(cards);
-                    }));
-                    return [
-                        (0, $ed06bb0bb83a46b3$export$a2cc176055f8f08)(),
-                        cards,
-                        style
-                    ];
-                })();
+                        // copied from RecommendationGrid
+                        // convoluted lazy loading that
+                        // when the elements are in the DOM starts IntersectionObserver on whole grid
+                        // when grid intersects starts Lazyfier
+                        // this is because Lazyfier is fucking stupid
+                        (0, $g9l4l$observer).wait_for_element(cards).then((0, $g9l4l$catchify)((element)=>{
+                            let start_lazy_loading;
+                            const lazy_loading_promise = new Promise((r)=>start_lazy_loading = r);
+                            const lf = new (0, $g9l4l$Lazyfier)({
+                                only_load_intersecting: true,
+                                wait_for_dominsertion: lazy_loading_promise,
+                                ignore_data_urls: true,
+                                lazyfinder: {
+                                    unload () {}
+                                }
+                            });
+                            lf.start_observing_for_new_children_(element);
+                            const i_o = new IntersectionObserver((0, $g9l4l$catchify)((records)=>{
+                                for (const record of records)if (record.intersectionRatio > 0) {
+                                    start_lazy_loading();
+                                    i_o.disconnect();
+                                    return;
+                                }
+                            }));
+                            i_o.observe(cards);
+                        }));
+                        return [
+                            (0, $ed06bb0bb83a46b3$export$a2cc176055f8f08)(),
+                            cards,
+                            style
+                        ];
+                    }
+                });
             }
         }), null);
         (0, $g9l4l$insert)(_el$, desktop_filter_elements_, null);
@@ -965,19 +1028,18 @@ async function $57363319986950eb$var$insert_placeholders({ scroll_restoration_da
     let existing_num = 0;
     let removed_old_children = false;
     if (!$57363319986950eb$var$cached_placeholder_element) {
+        const [dispose_card, root_in_root] = (0, $g9l4l$createRoot)((dispose)=>[
+                dispose,
+                (0, $g9l4l$getOwner)()
+            ]);
         const { elements: elements  } = await (0, $g9l4l$default_rr)(tenant_object_, {
             ...rr_options_,
             type: "placeholder",
             pre_processors: [],
             post_processors: [],
             ...typeof rr_options_.template === "function" ? {
-                template: (...args)=>(0, $g9l4l$createRoot)(async (dispose)=>{
-                        try {
-                            return await rr_options_.template(...args);
-                        } finally{
-                            (0, $g9l4l$queueMacroTask)((0, $g9l4l$catchify)(dispose)); // we just want it cloned and dead
-                        }
-                    })
+                template: $57363319986950eb$var$wrap_template_to_throw_into_error_boundary(rr_options_.template, root_in_root, ()=>(0, $g9l4l$queueMacroTask)((0, $g9l4l$catchify)(dispose_card)) // we just want it cloned and dead
+                )
             } : {},
             recs: [
                 {
@@ -993,13 +1055,28 @@ async function $57363319986950eb$var$insert_placeholders({ scroll_restoration_da
             const to_add = num_placeholders() - existing_num;
             if (to_add <= 0) return;
             // We don't need to remove placeholders, only need to add. The reason for that is that chrome restores the scroll position once all tasks queued as reaction of the "popstate" events have been completed in the task queue. That means that we need to get the placeholders in fast, or we might lose scroll position if the previous site was shorter.
-            // The query id and the amount might update in separate tasks because one comes from href_change_ipns and the other one from another "popstate" listener. Therefore, we need to be able to dynamically add more placeholders. I'm not entirely sure about this anymore though, since we have the scroll position on a per-id basis it might work anyways but THIS WORKS and I've been working on this bug for 3 hours so let's just keep it this way.
+            // The query id and the amount might update in separate tasks because one comes from href_change_ipns and the other one from another "popstate" listener. Therefore, we need to be able to dynamically add more placeholders. I'm not entirely sure about this anymore though, since we have the scroll position on a per-id basis it might work anyway but THIS WORKS, and I've been working on this bug for 3 hours so let's just keep it this way.
             cards_element_[removed_old_children ? "append" : (removed_old_children = true, "replaceChildren")](...Array.from({
                 length: to_add
             }).map(()=>$57363319986950eb$var$cached_placeholder_element.cloneNode(true)));
             existing_num += to_add;
         }));
 }
+function $57363319986950eb$var$wrap_template_to_throw_into_error_boundary(template, root_in_root, on_finally) {
+    return async (...args)=>{
+        try {
+            return await (0, $g9l4l$runWithOwner)(root_in_root, ()=>template(...args)) || [];
+        } catch (e) {
+            (0, $g9l4l$runWithOwner)(root_in_root, ()=>{
+                // Throw in case of promise rejection, ultimately into ErrorBoundary
+                throw e;
+            });
+            return [];
+        } finally{
+            on_finally?.();
+        }
+    };
+}
 
 
 
@@ -2635,7 +2712,7 @@ function $b114513503b25433$export$82ed4b28ecb67608({ filter_: filter_ , selected
                         // lighten or darken (+/- 10) depending on it's over or under 50 lightness
                         // lighten under 25 lightness by 20
                         const target_lightness = is_hovered ? is_light ? lightness() - 10 : lightness() < 25 ? lightness() + 20 : lightness() + 10 : lightness();
-                        classList.toggle("check-dark", lightness() > 75); // dark checkmark for bright colors
+                        classList.toggle("check-dark", $b114513503b25433$var$black_contrast_better(hue(), saturation(), lightness())); // Decide between black/white checkmark based on which one has better contrast according to WCAG contrast guidelines
                         style.backgroundColor = `hsl(${hue()}, ${saturation()}%, ${target_lightness}%)`;
                     }
                 });
@@ -2732,6 +2809,15 @@ function $b114513503b25433$export$82ed4b28ecb67608({ filter_: filter_ , selected
         return _el$;
     })();
 }
+function $b114513503b25433$var$black_contrast_better(hue, saturation, lightness) {
+    const as_rgb = (0, $g9l4l$hsl_to_rgb)(hue, saturation, lightness);
+    const luminance_color = (0, $g9l4l$relative_luminance_from_rgb)(...as_rgb);
+    const luminance_white = 1;
+    const luminance_black = 0;
+    const contrast_ratio_if_white = (luminance_white + 0.05) / (luminance_color + 0.05);
+    const contrast_ratio_if_black = (luminance_color + 0.05) / (luminance_black + 0.05);
+    return contrast_ratio_if_black > contrast_ratio_if_white;
+}
 
 
 var $7b224b353182ce9a$export$2e2bcd8739ae039 = {
@@ -3013,31 +3099,6 @@ function $a2432c33d88ec427$export$ab34afce88557c0e(props) {
 
 
 
-
-
-const $a406ebe9523f192f$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div></div>`, 2);
-function $a406ebe9523f192f$export$b69d0d92862de18b(props) {
-    return (0, $g9l4l$ErrorBoundary)({
-        fallback (err) {
-            const { message_: message_ , severity_: severity_  } = props;
-            (0, $g9l4l$report)([
-                err,
-                message_
-            ], severity_);
-            return (()=>{
-                const _el$ = $a406ebe9523f192f$var$_tmpl$.cloneNode(true);
-                (0, $g9l4l$insert)(_el$, message_);
-                return _el$;
-            })();
-        },
-        get children () {
-            return props.children;
-        }
-    });
-}
-
-
-
 const $8aff437d739a524d$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="filter-collapsible"></div>`, 2), $8aff437d739a524d$var$_tmpl$2 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<button class="clear-group"><span></span></button>`, 4), $8aff437d739a524d$var$_tmpl$3 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="view-more-clear"></div>`, 2), $8aff437d739a524d$var$_tmpl$4 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="filter-collapsible-body"><div class="filter-part"></div></div>`, 4), $8aff437d739a524d$var$_tmpl$5 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<details class="filter-collapsible"></details>`, 2), $8aff437d739a524d$var$_tmpl$6 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<summary class="filter-group-summary"><div class="summary"><span></span><div class="selected-w-sign"></div></div></summary>`, 8), $8aff437d739a524d$var$_tmpl$7 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="ungrouped"></div>`, 2), $8aff437d739a524d$var$_tmpl$8 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<button class="clear-all-filters major"></button>`, 2);
 function $8aff437d739a524d$export$3f1a388cc0d8fed7(props) {
     // Split like this to make placeholder wrapping more visible & this component is exported and used in MobileModal
@@ -5296,14 +5357,18 @@ function $7a7079d66c12b788$export$d757d54550ebfb3d({ category_suggestion_: categ
 
 
 const $6ded59a142c93078$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<button class="back" type="button"></button>`, 2), $6ded59a142c93078$var$_tmpl$2 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="search-field"><div class="field"><input class="query" tabindex="0"><button type="button" class="clear"></button></div><button class="submit major" type="button"></button></div>`, 9);
-function $6ded59a142c93078$export$b94867ecbd698f21({ search_field_value_: search_field_value_ , input_field_ref_: input_field_ref_ , field_element_ref_: field_element_ref_ , submit_query_: submit_query_ , override_on_enter_: override_on_enter_ , clear_filters_: clear_filters_ , disabled_: disabled_ = false , on_back_: on_back_ , i18n_: i18n_  }) {
-    let input_field;
+function $6ded59a142c93078$export$b94867ecbd698f21({ search_field_value_: search_field_value_ , input_field_ref_: input_field_ref_ , field_element_ref_: field_element_ref_ , submit_query_: submit_query_ , override_on_enter_: override_on_enter_ , clear_filters_: clear_filters_ , disabled_: disabled_ = false , on_back_: on_back_ , i18n_: i18n_ , after_focusing_: after_focusing_  }) {
+    let input_element;
+    // This is the div where we recommend (and ourselves do) attach the event listener to that opens the search modal.
+    let field_div;
     (0, $g9l4l$createEffect)((0, $g9l4l$catchify)(async ()=>{
         if (disabled_) return;
         // we aren't in DOM yet unfortunately, wouldn't even be with onMount
-        await (0, $g9l4l$observer).wait_for_element(input_field);
-        input_field.focus();
+        await (0, $g9l4l$observer).wait_for_element(input_element);
+        input_element.focus();
+        after_focusing_?.(input_element);
     })); // focus field on render
+    const owner_of_field_element = (0, $g9l4l$getOwner)();
     return (()=>{
         const _el$ = $6ded59a142c93078$var$_tmpl$2.cloneNode(true), _el$3 = _el$.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$4.nextSibling, _el$6 = _el$3.nextSibling;
         (0, $g9l4l$insert)(_el$, (0, $g9l4l$createComponent)((0, $g9l4l$Show), {
@@ -5316,38 +5381,47 @@ function $6ded59a142c93078$export$b94867ecbd698f21({ search_field_value_: search
                 return _el$2;
             }
         }), _el$3);
-        (0, $g9l4l$use)((el)=>field_element_ref_?.(el), _el$3);
-        (0, $g9l4l$addEventListener)(_el$4, "select", (0, $g9l4l$catchify)((e)=>{
-            if (!disabled_) // just in case. The field not actually being disabled when being disabled_ is so that you can focus it and open the modal. We don't want any of the other input-field-interaction features to work
-            {
-                if (input_field.selectionStart === 0 && input_field.selectionEnd === input_field.value.length) // everything was selected, clear filters on next submit on next input
-                input_field.addEventListener("input", (0, $g9l4l$catchify)(clear_filters_), {
+        (0, $g9l4l$use)((el)=>{
+            field_div = el;
+            field_element_ref_?.(el);
+        }, _el$3);
+        _el$4.$$pointerdown = ({ pointerType: pointerType  })=>{
+            // When selecting text with a mouse we want a SearchField to be focussed even when releasing the mouse outside the .field element (we assume the event listener which opens the modal is attached to that).
+            if (pointerType === "mouse") {
+                const handler = (0, $g9l4l$catchify)(({ pointerType: pointerType , target: target  })=>{
+                    if (pointerType !== "mouse" || !(target instanceof Node) || target === field_div || field_div.contains(target)) return;
+                    input_element.click();
+                });
+                window.addEventListener("pointerup", handler, {
                     once: true
                 });
+                if (owner_of_field_element) (0, $g9l4l$runWithOwner)(owner_of_field_element, ()=>(0, $g9l4l$onCleanup)(()=>window.removeEventListener("pointerup", handler)));
             }
+        };
+        (0, $g9l4l$addEventListener)(_el$4, "select", (0, $g9l4l$catchify)(()=>{
+            if (disabled_) // just in case. The field not actually being disabled when being disabled_ is so that you can focus it and open the modal. We don't want any of the other input-field-interaction features to work
+            return;
+            if (input_element.selectionStart === 0 && input_element.selectionEnd === input_element.value.length) // everything was selected, clear filters on next submit on next input
+            input_element.addEventListener("input", (0, $g9l4l$catchify)(clear_filters_), {
+                once: true
+            });
         }));
         (0, $g9l4l$addEventListener)(_el$4, "input", (0, $g9l4l$catchify)(()=>{
-            const { value: value  } = input_field;
+            const { value: value  } = input_element;
             if (!disabled_ && !value.length) clear_filters_(); // if the user clears the whole field, reset filters on next submit
             search_field_value_[1](value);
         }), true);
         (0, $g9l4l$addEventListener)(_el$4, "keydown", (0, $g9l4l$catchify)((e)=>{
             if (disabled_) {
                 if (e.key !== "Tab" && e.key !== "Shift") // alow tab-selecting the input field and then open the modal when the user start writing but also to move past the field with tab
-                input_field.click();
+                input_element.click();
             } else if (e.key === "Enter") {
                 const dont_submit = override_on_enter_?.(e);
                 if (!dont_submit) submit_query_();
             }
         }), true);
-        (0, $g9l4l$addEventListener)(_el$4, "focus", (0, $g9l4l$catchify)(()=>{
-            if (disabled_) {
-                const last_pos = input_field.value.length;
-                input_field.setSelectionRange(last_pos, last_pos);
-            }
-        }));
         const _ref$ = (0, $g9l4l$catchify)((el)=>{
-            input_field = el;
+            input_element = el;
             input_field_ref_?.(el);
         });
         typeof _ref$ === "function" && (0, $g9l4l$use)(_ref$, _el$4);
@@ -5355,8 +5429,7 @@ function $6ded59a142c93078$export$b94867ecbd698f21({ search_field_value_: search
         (0, $g9l4l$addEventListener)(_el$5, "click", (0, $g9l4l$catchify)(()=>{
             search_field_value_[1]("");
             clear_filters_();
-            if (disabled_) return;
-            input_field.focus();
+            if (!disabled_) input_element.focus();
         }), true);
         (0, $g9l4l$insert)(_el$5, (0, $g9l4l$createComponent)((0, $g9l4l$CrossIcon), {}));
         (0, $g9l4l$addEventListener)(_el$6, "click", (0, $g9l4l$catchify)(()=>submit_query_()), true);
@@ -5383,7 +5456,8 @@ function $6ded59a142c93078$export$b94867ecbd698f21({ search_field_value_: search
 (0, $g9l4l$delegateEvents)([
     "click",
     "keydown",
-    "input"
+    "input",
+    "pointerdown"
 ]);
 
 
@@ -5735,7 +5809,7 @@ function $4ad18a8b237ff7f6$export$2542ffb77b620b02(params_to_default_value) {
 
 
 const $d3c0043bb23a833f$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<span class="orig price"></span>`, 2), $d3c0043bb23a833f$var$_tmpl$2 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<a class="instant-card"><div class="img-part"></div><div class="right-part"><div class="title-brand-tagline"><span class="brand"></span><span class="title"></span></div><div class="price-container"><span class="price"></span></div></div></a>`, 16), $d3c0043bb23a833f$var$_tmpl$3 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="tagline"></div>`, 2);
-const $d3c0043bb23a833f$export$b05c0ae390cf3e06 = (display_or_variant_container, { i18n: i18n  })=>{
+const $d3c0043bb23a833f$export$b05c0ae390cf3e06 = (display_or_variant_container, { i18n: i18n , market: market  })=>{
     const display = (0, $g9l4l$createMemo)(()=>{
         const display = display_or_variant_container();
         // Support for backend's new display format
@@ -5747,7 +5821,12 @@ const $d3c0043bb23a833f$export$b05c0ae390cf3e06 = (display_or_variant_container,
             };
         }
         if (display.page_url) return display;
-        // Support for Spendrups displays, should probably be in the Spendrups script
+        // Support for post-migration (but still old basic format) Stronger displays, with slug but without page_url
+        if (display.slug) {
+            display.page_url = `/${market}/` + display.slug;
+            return display;
+        }
+        // Support for Spendrups displays, used by our frontend script and Spendrups coming react-ui integration.
         if (!display?.variants?.length) return;
         return display.variants.filter((v)=>v.product_id == display.product_id)[0];
     });
@@ -6734,7 +6813,7 @@ function $b24f16c875c2baa6$export$f021bdedd3ec901a(props) {
 
 
 const $a9f6faeac82c322b$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="discover-more"><button class="major" type="button"></button></div>`, 4), $a9f6faeac82c322b$var$_tmpl$2 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<b></b>`, 2), $a9f6faeac82c322b$var$_tmpl$3 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="depict-search-modal"><div class="body"><div class="padded"></div></div></div>`, 6), $a9f6faeac82c322b$var$_tmpl$4 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="depict plp search"><div class="depict-search-modal-backdrop"></div></div>`, 4);
-function $a9f6faeac82c322b$export$1c593cbd6f1e10bc({ search_field_value_: search_field_value_ , search_query_: search_query_ , search_page_url_param_name_: search_page_url_param_name_ , previous_searches_: previous_searches_ , close_modal_: close_modal_ , style_props_: style_props_ = (0, $g9l4l$createSignal)({}) , depict_api_: depict_api_ , tenant_: tenant_ , market_: market_ , submit_query_: submit_query_ , instant_results_options_: instant_results_options_ , register_closing_animation_: register_closing_animation_ , url_transformer_: url_transformer_ , closing_animation_: closing_animation_ , alternative_query_submitter_for_spas_: alternative_query_submitter_for_spas_ , clear_filters_: clear_filters_ , i18n_: i18n_ , disable_scrolling_: disable_scrolling_ = true , enable_category_suggestions_: enable_category_suggestions_ , class_list_: class_list_ , after_submit_: after_submit_ , bottom_distance_under_modal_: bottom_distance_under_modal_ , navigate_page_to_href_: navigate_page_to_href_ , on_submit_with_unchanged_value_: on_submit_with_unchanged_value_  }) {
+function $a9f6faeac82c322b$export$1c593cbd6f1e10bc({ search_field_value_: search_field_value_ , search_query_: search_query_ , search_page_url_param_name_: search_page_url_param_name_ , previous_searches_: previous_searches_ , close_modal_: close_modal_ , style_props_: style_props_ = (0, $g9l4l$createSignal)({}) , depict_api_: depict_api_ , tenant_: tenant_ , market_: market_ , submit_query_: submit_query_ , instant_results_options_: instant_results_options_ , register_closing_animation_: register_closing_animation_ , url_transformer_: url_transformer_ , closing_animation_: closing_animation_ , alternative_query_submitter_for_spas_: alternative_query_submitter_for_spas_ , clear_filters_: clear_filters_ , i18n_: i18n_ , disable_scrolling_: disable_scrolling_ = true , enable_category_suggestions_: enable_category_suggestions_ , class_list_: class_list_ , after_submit_: after_submit_ , bottom_distance_under_modal_: bottom_distance_under_modal_ , navigate_page_to_href_: navigate_page_to_href_ , on_submit_with_unchanged_value_: on_submit_with_unchanged_value_ , selected_text_range_: selected_text_range_  }) {
     let on_enter_in_search_field_function;
     const [input_field, set_input_field] = (0, $g9l4l$createSignal)();
     const [get_search_field_value_] = search_field_value_;
@@ -6796,7 +6875,14 @@ function $a9f6faeac82c322b$export$1c593cbd6f1e10bc({ search_field_value_: search
         search_field_value_: search_field_value_,
         submit_query_: submit_query_,
         clear_filters_: clear_filters_,
-        i18n_: i18n_
+        i18n_: i18n_,
+        after_focusing_: (input_el)=>{
+            // Restore the selection range from the SearchField that was used to open the modal, if it was saved.
+            if (!selected_text_range_) return;
+            const [start, end] = selected_text_range_;
+            if (start === null || end === null) return;
+            input_el.setSelectionRange(start, end);
+        }
     });
     search_field.classList.add("in-modal");
     const modal_element = (()=>{
@@ -7066,28 +7152,38 @@ function $b76e8f62b1f313ef$export$a54ec244c8863715(opts) {
             })));
     const available_filters_ = (0, $g9l4l$createMemo)(()=>search_results_()?.filters);
     const modal_body_style = (0, $g9l4l$createSignal)({});
-    let input_field;
+    let search_field;
     if (include_input_field_) {
         const SafeSearchField = (0, $g9l4l$catchify)((0, $6ded59a142c93078$export$b94867ecbd698f21));
-        input_field = (0, $g9l4l$createComponent)(SafeSearchField, {
+        let input_element;
+        let div_with_field_class;
+        search_field = SafeSearchField({
             i18n_: i18n_,
-            disabled_: true,
             search_query_: search_query_,
             search_field_value_: search_field_value_,
             submit_query_: submit_query_,
-            clear_filters_: clear_filters_on_next_submit_
+            clear_filters_: clear_filters_on_next_submit_,
+            input_field_ref_: (el)=>input_element = el,
+            field_element_ref_: (el)=>div_with_field_class = el,
+            disabled_: true
         });
-        if (input_field) {
+        if (search_field) {
             opts?.modal_body_style_ref_?.(modal_body_style);
-            const align_position = (0, $g9l4l$catchify)((0, $079defea521d5e2a$export$b3ad617e9036868))(modal_body_style, input_field, undefined, true);
-            input_field.addEventListener("click", (0, $g9l4l$catchify)((e)=>{
+            const align_position = (0, $g9l4l$catchify)((0, $079defea521d5e2a$export$b3ad617e9036868))(modal_body_style, search_field, undefined, true);
+            div_with_field_class.addEventListener("click", (0, $g9l4l$catchify)((e)=>{
                 const target = e.target;
                 const sel = ".submit";
                 if (target?.matches?.(sel) || target?.closest?.(sel)) // the search button is just decor, don't do anything when clicked
                 return;
+                // When selecting text in the SearchField that's in the page we want the same selection to persist. It doesn't by itself, since the SearchModal has an entirely different SearchField. Therefore, we manually copy the selection over.
+                const selected_text_range_ = [
+                    input_element.selectionStart,
+                    input_element.selectionEnd
+                ];
                 align_position?.();
                 open_modal_({
-                    style_props_: modal_body_style
+                    style_props_: modal_body_style,
+                    selected_text_range_: selected_text_range_
                 }, ()=>include_input_field_?.on_close_?.());
                 include_input_field_?.on_open_?.();
             }));
@@ -7163,7 +7259,7 @@ function $b76e8f62b1f313ef$export$a54ec244c8863715(opts) {
         document.createComment("Search page based on Depict SDK"),
         (()=>{
             const _el$2 = $b76e8f62b1f313ef$var$_tmpl$2.cloneNode(true), _el$3 = _el$2.firstChild;
-            (0, $g9l4l$insert)(_el$3, input_field, null);
+            (0, $g9l4l$insert)(_el$3, search_field, null);
             (0, $g9l4l$insert)(_el$3, make_category_suggestion_card_ ? (0, $g9l4l$createComponent)((0, $a406ebe9523f192f$export$b69d0d92862de18b), {
                 severity_: "error",
                 message_: "Category suggestions failed",
@@ -7620,7 +7716,8 @@ function $540e930c58500cbe$export$f2dc7e4e4aa11abb({ depict_search: depict_searc
 function $540e930c58500cbe$export$316f6f283ae64765({ depict_search: depict_search , modal_dispose_handler: modal_dispose_handler , click_handler: click_handler , aligner_ref: aligner_ref  }) {
     const shared_properties = $540e930c58500cbe$var$get_shared_properties(depict_search);
     return (0, $c7f938ac40924f3b$export$23fca46f3143581f)(()=>{
-        const input = (0, $g9l4l$createComponent)((0, $6ded59a142c93078$export$b94867ecbd698f21), {
+        let input_element;
+        const search_field = (0, $g9l4l$createComponent)((0, $6ded59a142c93078$export$b94867ecbd698f21), {
             get search_query_ () {
                 return shared_properties.search_query_signal_;
             },
@@ -7637,35 +7734,40 @@ function $540e930c58500cbe$export$316f6f283ae64765({ depict_search: depict_searc
                 return shared_properties.i18n_;
             },
             disabled_: true,
+            input_field_ref_: (el)=>input_element = el,
             field_element_ref_: (field)=>{
                 const style_props_ = (0, $g9l4l$createSignal)({
                     position: "fixed"
                 });
                 const defaultHandler = (0, $g9l4l$catchify)(()=>{
-                    const { cleanup: cleanup  } = $540e930c58500cbe$var$align_field_modal(style_props_, input, aligner_ref);
+                    // When selecting text in the SearchField that's in the page we want the same selection to persist. It doesn't by itself, since the SearchModal has an entirely different SearchField. Therefore, we manually copy the selection over.
+                    const selected_text_range_ = [
+                        input_element.selectionStart,
+                        input_element.selectionEnd
+                    ];
+                    const { cleanup: cleanup  } = $540e930c58500cbe$var$align_field_modal(style_props_, search_field, aligner_ref);
                     const complete_modal_dispose_handler = ()=>{
                         modal_dispose_handler?.();
                         cleanup();
                     };
                     depict_search.modal_open = [
                         {
-                            style_props_: style_props_
+                            style_props_: style_props_,
+                            selected_text_range_: selected_text_range_
                         },
                         complete_modal_dispose_handler
                     ];
                 });
                 const handler = click_handler ?? defaultHandler;
                 field.addEventListener("click", handler);
-                (0, $g9l4l$onCleanup)(()=>{
-                    field.removeEventListener("click", handler);
-                });
+                (0, $g9l4l$onCleanup)(()=>field.removeEventListener("click", handler));
             }
         });
         // We assume this to be an array containing exactly on div in js-ui
         return [
             (()=>{
                 const _el$ = $540e930c58500cbe$var$_tmpl$.cloneNode(true);
-                (0, $g9l4l$insert)(_el$, input);
+                (0, $g9l4l$insert)(_el$, search_field);
                 return _el$;
             })()
         ];
@@ -7695,6 +7797,7 @@ function $540e930c58500cbe$var$align_field_modal(style_props_, input, aligner_re
 
 
 
+
 const $7cbfd6122dbaf087$export$d86a33413558014e = (openModalParams)=>{
     const { search: search  } = openModalParams;
     openModalParams.location ||= "centered";
@@ -7952,4 +8055,4 @@ class $ba6c9609228edf6b$export$3ccaa27d81dd8556 extends EventTarget {
 (0, $g9l4l$add_to_version_info)("ui", (0, $18bf1d29fb889cca$export$83d89fbfd8236492));
 
 
-export {$e95f1855a5e3864f$export$58e808b1db15d3bc as fetchDepictRecommendations, $ec52ef1e6c117813$export$de035477d6fef996 as QuickLinks, $ec52ef1e6c117813$export$5b7c3ce0ebe51f86 as BreadCrumbs, $6340962f8bafd049$export$b91cec6bdc6b32a1 as CategoryTitle, $9b693ea3ff420de6$export$824dde41348efed1 as embedded_num_products, $80a49d3809ecb080$export$643598a327b5833e as get_categories, $ec52ef1e6c117813$export$f34314aa9505732e as DepictCategory, $ec52ef1e6c117813$export$e2bf8ce7779e827e as CategoryPage, $540e930c58500cbe$export$ac6237957a15b3f0 as DepictSearch, $540e930c58500cbe$export$bde3eb976dfded9 as get_search_query_updating_blocked_signal, $540e930c58500cbe$export$f2dc7e4e4aa11abb as SearchPage, $540e930c58500cbe$export$316f6f283ae64765 as SearchField, $7cbfd6122dbaf087$export$d86a33413558014e as open_modal_with_alignment, $aaacfac0064e97d9$export$ee1733d9a8495996 as DefaultInstantCardPlaceholder, $079defea521d5e2a$export$b3ad617e9036868 as align_field, $b4e6a093ae83373b$export$6daf8749b65a1b77 as convert_sdk_cols_at_size_to_layout, $246aa49a8f85c7f3$export$1233ca167bf71f9a as styles_to_valid_css_string, $a1123c5ed9b0ee29$export$fe334901e8bebd57 as disable_scrolling, $a3e81b85527bc866$export$d0596b5cae35ad4 as open_search_with_shift_slash, $972ebf2641490830$export$26df08e242fe83a3 as push_state_with_query_param_value, $3846bb34098c738f$export$e015ed2f2950f2e3 as DepictAPI, $fefe7683325039b3$export$d9f36cf74e24d595 as media_query_to_accessor, $36316d7b4c897a03$export$689e204eadb33baf as setup_fast_leave, $886fa987db4f3805$export$5196e4c01fa56fcb as show_toast, $5178263ed1e394ca$export$469c7af753d08925 as solid_format_price, $a79ffb1cbfbd2a09$export$828dcdd425fd3231 as connect_search_field_height_to_aligner_height, $ba6c9609228edf6b$export$3ccaa27d81dd8556 as PageReplacer, $18bf1d29fb889cca$export$83d89fbfd8236492 as version};
+export {$e95f1855a5e3864f$export$58e808b1db15d3bc as fetchDepictRecommendations, $ec52ef1e6c117813$export$de035477d6fef996 as QuickLinks, $ec52ef1e6c117813$export$5b7c3ce0ebe51f86 as BreadCrumbs, $6340962f8bafd049$export$b91cec6bdc6b32a1 as CategoryTitle, $9b693ea3ff420de6$export$824dde41348efed1 as embedded_num_products, $80a49d3809ecb080$export$643598a327b5833e as get_categories, $ec52ef1e6c117813$export$f34314aa9505732e as DepictCategory, $ec52ef1e6c117813$export$e2bf8ce7779e827e as CategoryPage, $540e930c58500cbe$export$ac6237957a15b3f0 as DepictSearch, $540e930c58500cbe$export$bde3eb976dfded9 as get_search_query_updating_blocked_signal, $540e930c58500cbe$export$f2dc7e4e4aa11abb as SearchPage, $540e930c58500cbe$export$316f6f283ae64765 as SearchField, $22d7fd594100c3d0$export$aa14a9f43128f61f as ProductCardError, $7cbfd6122dbaf087$export$d86a33413558014e as open_modal_with_alignment, $aaacfac0064e97d9$export$ee1733d9a8495996 as DefaultInstantCardPlaceholder, $079defea521d5e2a$export$b3ad617e9036868 as align_field, $b4e6a093ae83373b$export$6daf8749b65a1b77 as convert_sdk_cols_at_size_to_layout, $246aa49a8f85c7f3$export$1233ca167bf71f9a as styles_to_valid_css_string, $a1123c5ed9b0ee29$export$fe334901e8bebd57 as disable_scrolling, $a3e81b85527bc866$export$d0596b5cae35ad4 as open_search_with_shift_slash, $972ebf2641490830$export$26df08e242fe83a3 as push_state_with_query_param_value, $3846bb34098c738f$export$e015ed2f2950f2e3 as DepictAPI, $fefe7683325039b3$export$d9f36cf74e24d595 as media_query_to_accessor, $36316d7b4c897a03$export$689e204eadb33baf as setup_fast_leave, $886fa987db4f3805$export$5196e4c01fa56fcb as show_toast, $5178263ed1e394ca$export$469c7af753d08925 as solid_format_price, $a79ffb1cbfbd2a09$export$828dcdd425fd3231 as connect_search_field_height_to_aligner_height, $ba6c9609228edf6b$export$3ccaa27d81dd8556 as PageReplacer, $18bf1d29fb889cca$export$83d89fbfd8236492 as version};