@depict-ai/ui 0.0.71 → 0.0.73

package/dist/module.js

@@ -1,8 +1,9 @@
-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 {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, instant_exec_on_suspect_history_change as $g9l4l$instant_exec_on_suspect_history_change, 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} 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";
+import {compressToBase64 as $g9l4l$compressToBase64, decompressFromBase64 as $g9l4l$decompressFromBase64} from "lz-string";
 
-/*! Depict.ai search and product listing SDK */ const $18bf1d29fb889cca$export$83d89fbfd8236492 = "0.0.71";
+/*! Depict.ai search and product listing SDK */ const $18bf1d29fb889cca$export$83d89fbfd8236492 = "0.0.73";
 
 
 
@@ -56,10 +57,10 @@ function $014a147d094b0d08$var$history_state_change(signals, entries, state) {
 }
 
 
-function $3075a4497054bec6$export$9862539c89138352(get_default_values) {
-    const state = (0, $014a147d094b0d08$export$e183a13865960371)(get_default_values());
+function $3075a4497054bec6$export$9862539c89138352(get_default_values_) {
+    const state = (0, $014a147d094b0d08$export$e183a13865960371)(get_default_values_());
     const reset_state = ()=>{
-        const new_defaults = get_default_values();
+        const new_defaults = get_default_values_();
         for(const key in state){
             const new_value = new_defaults[key];
             state[key][1](new_value);
@@ -2833,156 +2834,6 @@ var $7b224b353182ce9a$export$2e2bcd8739ae039 = {
 
 
 
-function $dd3727f29e682893$export$b288c38ae3fddb56({ available_filters_: available_filters_ , local_filter_cache_: [read_local_cache, write_local_cache] , selected_filters_: [read_selected_filters]  }) {
-    let last_remote_state;
-    (0, $g9l4l$createComputed)(()=>{
-        const remote_filters = Object.fromEntries(available_filters_()?.map((filter)=>[
-                JSON.stringify([
-                    filter.field,
-                    filter.op,
-                    filter?.meta?.type
-                ]),
-                filter
-            ]) || []);
-        const local_filters = Object.fromEntries(read_local_cache().map((filter)=>[
-                JSON.stringify([
-                    filter.field,
-                    filter.op,
-                    filter?.meta?.type
-                ]),
-                filter
-            ]));
-        const selected_filters = Object.fromEntries(read_selected_filters().map((filter_obj)=>[
-                JSON.stringify([
-                    filter_obj.field,
-                    filter_obj.op
-                ]),
-                filter_obj
-            ]));
-        const new_local_filter_state = [];
-        // we want to be as close as possible to available_filters_ in local_filters except that we want to keep values from previous available_filters_ as long as they're selected
-        for (const filter_id of [
-            ...Object.keys(local_filters).filter((key)=>!(key in remote_filters)),
-            ...Object.keys(remote_filters)
-        ]){
-            const local_filter = local_filters[filter_id];
-            const remote_filter = remote_filters[filter_id];
-            const filter_id_without_meta_type = JSON.stringify(JSON.parse(filter_id).slice(0, 2));
-            if (!remote_filter) // check if this filter is selected, if it is just take the local one but set counts to 0 and remove non-selected options
-            {
-                if (filter_id_without_meta_type in selected_filters) new_local_filter_state.push($dd3727f29e682893$var$modify_only_local_filter(local_filter, selected_filters[filter_id_without_meta_type]));
-            } else if (!local_filter) // just take the remote one
-            new_local_filter_state.push(remote_filter);
-            else {
-                // both exist, merge them if needed
-                const remote_meta = remote_filter.meta;
-                const local_meta = local_filter.meta;
-                const this_applied_filter = selected_filters[filter_id_without_meta_type];
-                if (!remote_meta || !local_meta || !("values" in remote_meta) || !("values" in local_meta) || !Array.isArray(this_applied_filter?.data)) // can't or shouldn't be merged due to not being selected, just take remote one
-                new_local_filter_state.push(remote_filter);
-                else {
-                    const data_objs_in_remote = Object.fromEntries(remote_meta.values.map((value, index)=>[
-                            JSON.stringify(value),
-                            {
-                                value_: value,
-                                count_: remote_meta.counts?.[index],
-                                name_: remote_meta.names?.[index]
-                            }
-                        ]));
-                    const data_objs_in_local = Object.fromEntries(local_meta.values.map((value, index)=>[
-                            JSON.stringify(value),
-                            {
-                                value_: value,
-                                count_: 0,
-                                name_: local_meta.names?.[index]
-                            }
-                        ]));
-                    const new_data = [
-                        ...Object.keys(data_objs_in_local).filter((key)=>{
-                            // put data entries that are selected and don't exist in new remote state first
-                            if (key in data_objs_in_remote) return false;
-                            const selected_values = this_applied_filter.data;
-                            return selected_values.some((value)=>{
-                                const is_equal = JSON.stringify(value) === key;
-                                if (is_equal) return true;
-                                if (local_meta.type === remote_meta.type && local_meta.type === "checkbox-hierarchical") {
-                                    // Very special case for hierarchical checkboxes - when a parent has all kids checked and a kid is deselected, the parent gets deselected. But since if it still has selected children we don't want to remove it from the filter state, even though it isn't selected, as the UI won't know the correct title of the parent category otherwise. This keeps it in that case.
-                                    const selected_values = data_objs_in_local[key].value_;
-                                    const values_length = value?.length;
-                                    if (values_length > 1 && values_length - 1 === selected_values.length) {
-                                        let is_parent = true;
-                                        for(let i = 0; i < selected_values.length; i++)if (selected_values[i] !== value[i]) is_parent = false;
-                                        return is_parent;
-                                    }
-                                }
-                                return false;
-                            });
-                        }).map((key)=>data_objs_in_local[key]),
-                        ...Object.values(data_objs_in_remote)
-                    ];
-                    const new_values = new_data.map(({ value_: value_  })=>value_);
-                    const result = {
-                        ...remote_filter,
-                        meta: {
-                            ...remote_filter.meta,
-                            values: new_values,
-                            names: new_data.map(({ name_: name_  })=>name_),
-                            counts: new_data.map(({ count_: count_  })=>count_)
-                        }
-                    };
-                    new_local_filter_state.push(result);
-                }
-            }
-        }
-        if (last_remote_state !== available_filters_() || // we HAVE to update the local filter state (it can contain same info but needs to be different object reference) every time the API state changes, otherwise the CheckboxHierarchicalFilter component doesn't update
-        JSON.stringify(new_local_filter_state) !== JSON.stringify(read_local_cache())) // Sorry……… They're not that big
-        write_local_cache(new_local_filter_state);
-        last_remote_state = available_filters_();
-    });
-    return read_local_cache;
-}
-/**
- * When a filter is only available locally due to being selected in a previous navigation, we want to make that clear and prevent further "invalid" choices.
- * This sets the counts to 0 (if applicable) and removes non-selected options (if applicable)
- */ function $dd3727f29e682893$var$modify_only_local_filter(local_filter_object, selected_filter) {
-    const old_meta = local_filter_object.meta;
-    const selected_filter_data = selected_filter.data;
-    const modified_filter_object = {
-        ...local_filter_object
-    };
-    if (old_meta) {
-        const new_meta = {
-            ...old_meta
-        };
-        modified_filter_object.meta = new_meta;
-        // set counts to 0
-        if ("counts" in new_meta) {
-            const counts = new_meta.counts;
-            if (counts) new_meta.counts = counts.map(()=>0);
-        }
-        if (Array.isArray(selected_filter_data) && "values" in new_meta) {
-            // we have an array of values and want to strip the ones from the available ones that aren't selected
-            const values = new_meta.values;
-            if (Array.isArray(values)) {
-                const jsond_set_values = selected_filter_data.map((data)=>JSON.stringify(data));
-                const indexes_to_remove = new Set();
-                for(let i = 0; i < values.length; i++){
-                    const value = values[i];
-                    if (!jsond_set_values.includes(JSON.stringify(value))) // We want to remove the entry with this value from the filter object because it's not selected
-                    indexes_to_remove.add(i);
-                }
-                new_meta.values = values.filter((_, index)=>!indexes_to_remove.has(index));
-                if (new_meta.names) new_meta.names = new_meta.names.filter((_, index)=>!indexes_to_remove.has(index));
-                if (new_meta.counts) // remove counts that are too much, they're all zero anyway if they exist
-                new_meta.counts.length -= indexes_to_remove.size;
-            }
-        }
-    }
-    return modified_filter_object;
-}
-
-
-
 
 
 
@@ -3124,11 +2975,7 @@ function $8aff437d739a524d$export$3f1a388cc0d8fed7(props) {
     });
 }
 function $8aff437d739a524d$var$ActualFilterBody(props) {
-    const modified_available_filters_with_selected_unexisting_ones_injected_from_local_state = (0, $dd3727f29e682893$export$b288c38ae3fddb56)({
-        available_filters_: props.available_filters_,
-        selected_filters_: props.selected_filters_,
-        local_filter_cache_: props.local_filter_cache_
-    });
+    const [modified_available_filters_with_selected_unexisting_ones_injected_from_local_state] = props.local_filter_cache_;
     const togglable_filters = (0, $g9l4l$createMemo)(()=>modified_available_filters_with_selected_unexisting_ones_injected_from_local_state().filter((item)=>item?.meta?.group_title));
     const untogglable_filters = (0, $g9l4l$createMemo)(()=>modified_available_filters_with_selected_unexisting_ones_injected_from_local_state().filter((item)=>!item?.meta?.group_title));
     const togglable_filters_grouped_by_collapsible = (0, $g9l4l$createMemo)(()=>{
@@ -3329,7 +3176,7 @@ function $8aff437d739a524d$var$ActualFilterBody(props) {
 
 
 const $c23bd3d951eee1f2$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="sorting-attributes"></div>`, 2), $c23bd3d951eee1f2$var$_tmpl$2 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="sorting-direction"></div>`, 2), $c23bd3d951eee1f2$var$_tmpl$3 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div><div class="input-row"><input type="radio"><span class="custom-indicator"></span></div></div>`, 7), $c23bd3d951eee1f2$var$_tmpl$4 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div><label class="input-row"><input type="radio"><span class="custom-indicator"></span></label></div>`, 7);
-function $c23bd3d951eee1f2$export$1f1775a58da589b5({ available_sortings_: available_sortings_ , current_sorting_: current_sorting_  }) {
+function $c23bd3d951eee1f2$export$1f1775a58da589b5({ available_sortings_: available_sortings_ , current_sorting_: [get_current_sorting, set_current_sorting] , meta_of_currently_selected_sorting_: meta_of_currently_selected_sorting_  }) {
     const title_radio_name = (0, $g9l4l$make_random_classname)();
     const order_radio_name = (0, $g9l4l$make_random_classname)();
     return (0, $g9l4l$createComponent)((0, $g9l4l$Show), {
@@ -3363,14 +3210,14 @@ function $c23bd3d951eee1f2$export$1f1775a58da589b5({ available_sortings_: availa
                         },
                         children: (item, index)=>{
                             const is_checked = (0, $g9l4l$createMemo)(()=>{
-                                const sort = current_sorting_[0]();
+                                const sort = get_current_sorting();
                                 if (!sort) // if no sortings are selected, "select" first sort
                                 return index === 0;
                                 return sort.field === item().field && (sort.order === item().order || item().meta.values?.length > 1);
                             });
                             return /* wrapping div for flex gap polyfill scss mixin */ (()=>{
                                 const _el$8 = $c23bd3d951eee1f2$var$_tmpl$4.cloneNode(true), _el$9 = _el$8.firstChild, _el$10 = _el$9.firstChild, _el$11 = _el$10.nextSibling;
-                                (0, $g9l4l$addEventListener)(_el$10, "change", (0, $g9l4l$catchify)(()=>current_sorting_[1](item())));
+                                (0, $g9l4l$addEventListener)(_el$10, "change", (0, $g9l4l$catchify)(()=>set_current_sorting(item())));
                                 (0, $g9l4l$setAttribute)(_el$10, "name", title_radio_name);
                                 (0, $g9l4l$insert)(_el$9, ()=>item().meta.title, null);
                                 (0, $g9l4l$effect)(()=>_el$10.checked = is_checked());
@@ -3382,27 +3229,25 @@ function $c23bd3d951eee1f2$export$1f1775a58da589b5({ available_sortings_: availa
                 })(),
                 (0, $g9l4l$createComponent)((0, $g9l4l$Show), {
                     get when () {
-                        return current_sorting_[0]()?.meta?.values?.length > 1;
+                        return meta_of_currently_selected_sorting_()?.values?.length > 1;
                     },
                     get children () {
                         const _el$2 = $c23bd3d951eee1f2$var$_tmpl$2.cloneNode(true);
                         (0, $g9l4l$insert)(_el$2, (0, $g9l4l$createComponent)((0, $g9l4l$Index), {
                             get each () {
-                                return current_sorting_[0]().meta.values;
+                                return meta_of_currently_selected_sorting_()?.values;
                             },
                             children: (order_value, index)=>{
+                                const is_checked = (0, $g9l4l$createMemo)(()=>get_current_sorting()?.order === order_value());
                                 return (()=>{
                                     const _el$12 = $c23bd3d951eee1f2$var$_tmpl$4.cloneNode(true), _el$13 = _el$12.firstChild, _el$14 = _el$13.firstChild, _el$15 = _el$14.nextSibling;
-                                    (0, $g9l4l$addEventListener)(_el$14, "change", (0, $g9l4l$catchify)(()=>current_sorting_[1]((c)=>c && {
+                                    (0, $g9l4l$addEventListener)(_el$14, "change", (0, $g9l4l$catchify)(()=>set_current_sorting((c)=>c && {
                                                 ...c,
                                                 order: order_value()
                                             })));
                                     (0, $g9l4l$setAttribute)(_el$14, "name", order_radio_name);
-                                    (0, $g9l4l$insert)(_el$13, ()=>current_sorting_[0]()?.meta?.names?.[index], null);
-                                    (0, $g9l4l$effect)(()=>_el$14.checked = (0, $g9l4l$createMemo)(()=>{
-                                            const sort = current_sorting_[0]();
-                                            return sort?.order === order_value();
-                                        })());
+                                    (0, $g9l4l$insert)(_el$13, ()=>meta_of_currently_selected_sorting_()?.names?.[index], null);
+                                    (0, $g9l4l$effect)(()=>_el$14.checked = is_checked());
                                     return _el$12;
                                 })();
                             }
@@ -3747,20 +3592,177 @@ function $fd7da6fb3e08aa40$export$9bf11afa910f536e({ args_for_sorting_: args_for
 
 
 
+
+function $dd3727f29e682893$export$b288c38ae3fddb56({ available_filters_: available_filters_ , local_filter_cache_: [read_local_cache, write_local_cache] , selected_filters_: [read_selected_filters]  }) {
+    let last_remote_state;
+    (0, $g9l4l$createComputed)(()=>{
+        const remote_filters = Object.fromEntries(available_filters_()?.map((filter)=>[
+                JSON.stringify([
+                    filter.field,
+                    filter.op,
+                    filter?.meta?.type
+                ]),
+                filter
+            ]) || []);
+        const local_filters = Object.fromEntries(read_local_cache().map((filter)=>[
+                JSON.stringify([
+                    filter.field,
+                    filter.op,
+                    filter?.meta?.type
+                ]),
+                filter
+            ]));
+        const selected_filters = Object.fromEntries(read_selected_filters().map((filter_obj)=>[
+                JSON.stringify([
+                    filter_obj.field,
+                    filter_obj.op
+                ]),
+                filter_obj
+            ]));
+        const new_local_filter_state = [];
+        // we want to be as close as possible to available_filters_ in local_filters except that we want to keep values from previous available_filters_ as long as they're selected
+        for (const filter_id of [
+            ...Object.keys(local_filters).filter((key)=>!(key in remote_filters)),
+            ...Object.keys(remote_filters)
+        ]){
+            const local_filter = local_filters[filter_id];
+            const remote_filter = remote_filters[filter_id];
+            const filter_id_without_meta_type = JSON.stringify(JSON.parse(filter_id).slice(0, 2));
+            if (!remote_filter) // check if this filter is selected, if it is just take the local one but set counts to 0 and remove non-selected options
+            {
+                if (filter_id_without_meta_type in selected_filters) new_local_filter_state.push($dd3727f29e682893$var$modify_only_local_filter(local_filter, selected_filters[filter_id_without_meta_type]));
+            } else if (!local_filter) // just take the remote one
+            new_local_filter_state.push(remote_filter);
+            else {
+                // both exist, merge them if needed
+                const remote_meta = remote_filter.meta;
+                const local_meta = local_filter.meta;
+                const this_applied_filter = selected_filters[filter_id_without_meta_type];
+                if (!remote_meta || !local_meta || !("values" in remote_meta) || !("values" in local_meta) || !Array.isArray(this_applied_filter?.data)) // can't or shouldn't be merged due to not being selected, just take remote one
+                new_local_filter_state.push(remote_filter);
+                else {
+                    const data_objs_in_remote = Object.fromEntries(remote_meta.values.map((value, index)=>[
+                            JSON.stringify(value),
+                            {
+                                value_: value,
+                                count_: remote_meta.counts?.[index],
+                                name_: remote_meta.names?.[index]
+                            }
+                        ]));
+                    const data_objs_in_local = Object.fromEntries(local_meta.values.map((value, index)=>[
+                            JSON.stringify(value),
+                            {
+                                value_: value,
+                                count_: 0,
+                                name_: local_meta.names?.[index]
+                            }
+                        ]));
+                    const new_data = [
+                        ...Object.keys(data_objs_in_local).filter((key)=>{
+                            // put data entries that are selected and don't exist in new remote state first
+                            if (key in data_objs_in_remote) return false;
+                            const selected_values = this_applied_filter.data;
+                            return selected_values.some((value)=>{
+                                const is_equal = JSON.stringify(value) === key;
+                                if (is_equal) return true;
+                                if (local_meta.type === remote_meta.type && local_meta.type === "checkbox-hierarchical") {
+                                    // Very special case for hierarchical checkboxes - when a parent has all kids checked and a kid is deselected, the parent gets deselected. But since if it still has selected children we don't want to remove it from the filter state, even though it isn't selected, as the UI won't know the correct title of the parent category otherwise. This keeps it in that case.
+                                    const selected_values = data_objs_in_local[key].value_;
+                                    const values_length = value?.length;
+                                    if (values_length > 1 && values_length - 1 === selected_values.length) {
+                                        let is_parent = true;
+                                        for(let i = 0; i < selected_values.length; i++)if (selected_values[i] !== value[i]) is_parent = false;
+                                        return is_parent;
+                                    }
+                                }
+                                return false;
+                            });
+                        }).map((key)=>data_objs_in_local[key]),
+                        ...Object.values(data_objs_in_remote)
+                    ];
+                    const new_values = new_data.map(({ value_: value_  })=>value_);
+                    const result = {
+                        ...remote_filter,
+                        meta: {
+                            ...remote_filter.meta,
+                            values: new_values,
+                            names: new_data.map(({ name_: name_  })=>name_),
+                            counts: new_data.map(({ count_: count_  })=>count_)
+                        }
+                    };
+                    new_local_filter_state.push(result);
+                }
+            }
+        }
+        if (last_remote_state !== available_filters_() || // we HAVE to update the local filter state (it can contain same info but needs to be different object reference) every time the API state changes, otherwise the CheckboxHierarchicalFilter component doesn't update
+        JSON.stringify(new_local_filter_state) !== JSON.stringify(read_local_cache())) // Sorry……… They're not that big
+        write_local_cache(new_local_filter_state);
+        last_remote_state = available_filters_();
+    });
+}
+/**
+ * When a filter is only available locally due to being selected in a previous navigation, we want to make that clear and prevent further "invalid" choices.
+ * This sets the counts to 0 (if applicable) and removes non-selected options (if applicable)
+ */ function $dd3727f29e682893$var$modify_only_local_filter(local_filter_object, selected_filter) {
+    const old_meta = local_filter_object.meta;
+    const selected_filter_data = selected_filter.data;
+    const modified_filter_object = {
+        ...local_filter_object
+    };
+    if (old_meta) {
+        const new_meta = {
+            ...old_meta
+        };
+        modified_filter_object.meta = new_meta;
+        // set counts to 0
+        if ("counts" in new_meta) {
+            const counts = new_meta.counts;
+            if (counts) new_meta.counts = counts.map(()=>0);
+        }
+        if (Array.isArray(selected_filter_data) && "values" in new_meta) {
+            // we have an array of values and want to strip the ones from the available ones that aren't selected
+            const values = new_meta.values;
+            if (Array.isArray(values)) {
+                const jsond_set_values = selected_filter_data.map((data)=>JSON.stringify(data));
+                const indexes_to_remove = new Set();
+                for(let i = 0; i < values.length; i++){
+                    const value = values[i];
+                    if (!jsond_set_values.includes(JSON.stringify(value))) // We want to remove the entry with this value from the filter object because it's not selected
+                    indexes_to_remove.add(i);
+                }
+                new_meta.values = values.filter((_, index)=>!indexes_to_remove.has(index));
+                if (new_meta.names) new_meta.names = new_meta.names.filter((_, index)=>!indexes_to_remove.has(index));
+                if (new_meta.counts) // remove counts that are too much, they're all zero anyway if they exist
+                new_meta.counts.length -= indexes_to_remove.size;
+            }
+        }
+    }
+    return modified_filter_object;
+}
+
+
 const $bf7fe049e78f975a$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="filters"><div class="body"></div></div>`, 4), $bf7fe049e78f975a$var$_tmpl$2 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="sorting"><div class="body"></div></div>`, 4), $bf7fe049e78f975a$var$_tmpl$3 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="sort-and-filter-buttons"><div class="outer"><div class="inner"></div></div></div>`, 6), $bf7fe049e78f975a$var$_tmpl$4 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<span class="num-filters"></span>`, 2), $bf7fe049e78f975a$var$_tmpl$5 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="open-filters-button-container"><button class="filter toggle-button major-minor-transition" type="button"><span></span></button></div>`, 6), $bf7fe049e78f975a$var$_tmpl$6 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<button class="toggle-button for-sorting major-minor-transition"><span></span></button>`, 4);
 function $bf7fe049e78f975a$export$d7841e452f2e59a8({ current_sorting_: current_sorting_ , set_extra_els_in_results_container_: set_extra_els_in_results_container_ , search_filters_open_: search_filters_open_ , search_sorting_open_: search_sorting_open_ , set_sort_or_filter_open_: set_sort_or_filter_open_ , i18n_: i18n_ , available_sortings_: available_sortings_ , available_filters_: available_filters_ , expanded_filters_: expanded_filters_ , middle_elements_: middle_elements_ , input_modal_open_: input_modal_open_ , expanded_hierarchical_filters_: expanded_hierarchical_filters_ , number_of_rendered_selected_filters_items_: number_of_rendered_selected_filters_items_ , set_sort_and_filter_element_: set_sort_and_filter_element_ , formatted_number_of_results_: formatted_number_of_results_ , filter_button_width_: filter_button_width_ , sort_button_width_: sort_button_width_ , selected_filters_: selected_filters_ , local_filter_cache_: local_filter_cache_ , get_extra_filters_button_: get_extra_filters_button_ , get_extra_sorting_button_: get_extra_sorting_button_  }) {
     return (0, $a406ebe9523f192f$export$b69d0d92862de18b)({
         severity_: "error",
         message_: "Sorting and filters failed",
         get children () {
+            // This could technically be in SearchPage and CategoryPage and would be better suited there since it writes into local_filter_cache_ which i.e. SelectedFilters uses, but it's better suited here IMO due to DRY and being inside the correct error boundary here
+            (0, $dd3727f29e682893$export$b288c38ae3fddb56)({
+                available_filters_: available_filters_,
+                selected_filters_: selected_filters_,
+                local_filter_cache_: local_filter_cache_
+            });
             const cleanup_promise = new Promise((r)=>(0, $g9l4l$onCleanup)(r));
             const [filters_open, set_filters_open] = search_filters_open_;
             const [sorting_open, set_sorting_open] = search_sorting_open_;
+            const [get_current_sorting_] = current_sorting_;
             const [is_small, set_is_small] = (0, $g9l4l$createSignal)(false);
             const dismiss_modal_ = (0, $g9l4l$catchify)(()=>{
                 set_filters_open(false);
                 set_sorting_open(false);
             });
+            const meta_of_currently_selected_sorting_ = (0, $g9l4l$createMemo)(()=>available_sortings_()?.find?.((sorting)=>sorting.field === get_current_sorting_()?.field)?.meta);
             const filter_options = {
                 expanded_hierarchical_filters_: expanded_hierarchical_filters_,
                 local_filter_cache_: local_filter_cache_,
@@ -3771,7 +3773,8 @@ function $bf7fe049e78f975a$export$d7841e452f2e59a8({ current_sorting_: current_s
             };
             const sorting_options = {
                 current_sorting_: current_sorting_,
-                available_sortings_: available_sortings_
+                available_sortings_: available_sortings_,
+                meta_of_currently_selected_sorting_: meta_of_currently_selected_sorting_
             };
             const make_open_filters_button = (adhere_to_width = false, is_tabbable = false)=>(0, $g9l4l$createComponent)($bf7fe049e78f975a$var$OpenFiltersButton, {
                     tabindex_: is_tabbable ? 0 : -1,
@@ -3784,11 +3787,12 @@ function $bf7fe049e78f975a$export$d7841e452f2e59a8({ current_sorting_: current_s
             const make_open_sorting_button = (adhere_to_width = false, is_tabbable = false)=>(0, $g9l4l$createComponent)($bf7fe049e78f975a$var$OpenSortingButton, {
                     tabindex_: is_tabbable ? 0 : -1,
                     i18n_: i18n_,
-                    current_sorting_: current_sorting_,
+                    get_current_sorting_: get_current_sorting_,
                     search_filters_open_: search_filters_open_,
                     search_sorting_open_: search_sorting_open_,
                     available_sortings_: available_sortings_,
-                    sort_button_width_: adhere_to_width ? sort_button_width_ : undefined
+                    sort_button_width_: adhere_to_width ? sort_button_width_ : undefined,
+                    meta_of_currently_selected_sorting_: meta_of_currently_selected_sorting_
                 });
             let open_modal_;
             let close_modal_;
@@ -3916,7 +3920,7 @@ function $bf7fe049e78f975a$var$OpenFiltersButton({ i18n_: i18n_ , search_filters
         return _el$8;
     })();
 }
-function $bf7fe049e78f975a$var$OpenSortingButton({ i18n_: i18n_ , current_sorting_: current_sorting_ , search_filters_open_: search_filters_open_ , available_sortings_: available_sortings_ , search_sorting_open_: search_sorting_open_ , sort_button_width_: sort_button_width_ , tabindex_: tabindex_  }) {
+function $bf7fe049e78f975a$var$OpenSortingButton({ i18n_: i18n_ , get_current_sorting_: get_current_sorting_ , search_filters_open_: search_filters_open_ , available_sortings_: available_sortings_ , search_sorting_open_: search_sorting_open_ , sort_button_width_: sort_button_width_ , tabindex_: tabindex_ , meta_of_currently_selected_sorting_: meta_of_currently_selected_sorting_  }) {
     const sorting_closed = (0, $g9l4l$createMemo)(()=>!search_sorting_open_[0]());
     // We assume in embedded_num_products that this is a single HTMLElement so pls change there if you change it here
     return (()=>{
@@ -3932,7 +3936,7 @@ function $bf7fe049e78f975a$var$OpenSortingButton({ i18n_: i18n_ , current_sortin
         (0, $g9l4l$setAttribute)(_el$12, "tabindex", tabindex_);
         (0, $g9l4l$insert)(_el$13, (()=>{
             const _c$ = (0, $g9l4l$memo)(()=>!!sorting_closed());
-            return ()=>_c$() && (current_sorting_[0]()?.meta?.title || available_sortings_()?.[0]?.meta?.title) || i18n_.sorting_text_();
+            return ()=>_c$() && (meta_of_currently_selected_sorting_()?.title || available_sortings_()?.[0]?.meta?.title) || i18n_.sorting_text_();
         })());
         (0, $g9l4l$insert)(_el$12, (0, $g9l4l$createComponent)((0, $g9l4l$Show), {
             get when () {
@@ -3942,7 +3946,7 @@ function $bf7fe049e78f975a$var$OpenSortingButton({ i18n_: i18n_ , current_sortin
                 return (0, $g9l4l$createComponent)((0, $g9l4l$MinusIcon), {});
             },
             get children () {
-                return (0, $g9l4l$memo)(()=>current_sorting_[0]()?.order === "asc")() ? (0, $g9l4l$createComponent)((0, $g9l4l$SortIconAsc), {}) : (0, $g9l4l$createComponent)((0, $g9l4l$SortIconDesc), {});
+                return (0, $g9l4l$memo)(()=>get_current_sorting_()?.order === "asc")() ? (0, $g9l4l$createComponent)((0, $g9l4l$SortIconAsc), {}) : (0, $g9l4l$createComponent)((0, $g9l4l$SortIconDesc), {});
             }
         }), null);
         (0, $g9l4l$effect)((_p$)=>{
@@ -4123,8 +4127,157 @@ function $4a2667e8d77eb55a$var$ActualFloatingButtons({ search_filters_open_: [ge
 
 
 
+
+
+const $73294c7089bfc7c9$var$operator_map = {
+    "eq": "≡",
+    "neq": "≠",
+    "in": "∈",
+    "nin": "∉",
+    "leq": "≤",
+    "geq": "≥",
+    "inrange": "\uD83D\uDD22"
+};
+const $73294c7089bfc7c9$var$sorting_query_param = "sorting";
+const $73294c7089bfc7c9$var$ascending_token = "\uD83D\uDCC8";
+const $73294c7089bfc7c9$var$descending_token = "\uD83D\uDCC9";
+const $73294c7089bfc7c9$var$filter_query_param_prefix = "filter_";
+const $73294c7089bfc7c9$var$range_delimiter = "-";
+const $73294c7089bfc7c9$var$string_item_delimiter = "‚"; // This is not a comma but a comma-like character that browsers will render in the URL bar.
+const $73294c7089bfc7c9$var$array_item_delimiter = "‣"; // FIXME: decide on a character. Could theoretically be a double string delimiter.
+const $73294c7089bfc7c9$var$empty_item_replacement = "0️⃣";
+/**
+ * Checks if a given array of filter data can be neatly serialized into an URL query parameter, or if it should fall back to JSON+base64.
+ * The requirements are either an array of strings, containing no reserved characters, or an array of arrays of strings, containing no reserved characters.
+ * No deep or mixed nesting levels are supported.
+ */ function $73294c7089bfc7c9$var$array_is_serializable(array, is_root = true) {
+    if (array.every((item)=>Array.isArray(item))) {
+        if (!is_root) // Deeply nested arrays are not supported, but also don't exist as filters (yet)
+        return false;
+        return array.every((item)=>$73294c7089bfc7c9$var$array_is_serializable(item, false));
+    }
+    if (array.some((item)=>typeof item !== "string")) // Numbers are not supported, since 1 and "1" would encode to the same thing
+    return false;
+    // Encoding reserved characters is not supported
+    return !array.some((item)=>item.includes($73294c7089bfc7c9$var$array_item_delimiter) || item.includes($73294c7089bfc7c9$var$string_item_delimiter) || item === $73294c7089bfc7c9$var$empty_item_replacement);
+}
+/**
+ * Human readable string[] or string[][] serialization for URLs.
+ * @param array
+ * @returns
+ */ function $73294c7089bfc7c9$var$encode_array(array) {
+    const is_nested = array.every((item)=>Array.isArray(item));
+    if (is_nested) return array.map($73294c7089bfc7c9$var$encode_array).join($73294c7089bfc7c9$var$array_item_delimiter) + $73294c7089bfc7c9$var$array_item_delimiter; // Nested arrays require a suffix to close nesting levels
+    return array.map((item)=>item === "" ? $73294c7089bfc7c9$var$empty_item_replacement : item).join($73294c7089bfc7c9$var$string_item_delimiter);
+}
+function $73294c7089bfc7c9$var$decode_array(encoded_array) {
+    const is_nested = encoded_array.includes($73294c7089bfc7c9$var$array_item_delimiter);
+    if (is_nested) return encoded_array.split($73294c7089bfc7c9$var$array_item_delimiter).filter((s)=>s !== "") // Remove empty segments, caused by trailing delimiter
+    .map($73294c7089bfc7c9$var$decode_array);
+    return encoded_array.split($73294c7089bfc7c9$var$string_item_delimiter).filter((s)=>s !== "") // Remove empty segments, caused by trailing delimiter in the single item special case
+    .map((item)=>item === $73294c7089bfc7c9$var$empty_item_replacement ? "" : item);
+}
+function $73294c7089bfc7c9$var$encode_filter_data(op, data) {
+    if (data === "true") // boolean encoding
+    return "1";
+    if (data === "false") // boolean encoding
+    return "0";
+    const data_is_array = Array.isArray(data);
+    if (op === "inrange" && data_is_array && data.every((item)=>typeof item === "number")) // numeric range filter encoding
+    return data.join($73294c7089bfc7c9$var$range_delimiter);
+    if (data_is_array && $73294c7089bfc7c9$var$array_is_serializable(data)) {
+        const encoded_data = $73294c7089bfc7c9$var$encode_array(data);
+        if (!encoded_data.includes($73294c7089bfc7c9$var$array_item_delimiter) && !encoded_data.includes($73294c7089bfc7c9$var$string_item_delimiter)) // A string[] with only one item will encode without delimiters, which is indistinguishable from a plain string during decoding
+        // In that case we add a delimiter suffix at the end
+        return encoded_data + $73294c7089bfc7c9$var$string_item_delimiter;
+        return encoded_data;
+    }
+    // Fallback encoding
+    return (0, $g9l4l$compressToBase64)(JSON.stringify(data));
+}
+function $73294c7089bfc7c9$var$decode_filter_data(op, encoded_data) {
+    if (encoded_data === "1") return "true";
+    if (encoded_data === "0") return "false";
+    if (op === "inrange" && encoded_data.includes($73294c7089bfc7c9$var$range_delimiter)) return encoded_data.split($73294c7089bfc7c9$var$range_delimiter).map((x)=>parseFloat(x));
+    if (encoded_data.includes($73294c7089bfc7c9$var$string_item_delimiter) || encoded_data.includes($73294c7089bfc7c9$var$array_item_delimiter)) return $73294c7089bfc7c9$var$decode_array(encoded_data);
+    try {
+        return JSON.parse((0, $g9l4l$decompressFromBase64)(encoded_data));
+    } catch (e) {
+        (0, $g9l4l$dlog)("Failed to fallback parse filter data", op, encoded_data, e);
+    }
+    return null;
+}
+function $73294c7089bfc7c9$export$58aa3f171519b6d7(filters, search_params) {
+    for (const filter of filters){
+        const { field: field , op: op , data: data  } = filter;
+        const encoded_data = $73294c7089bfc7c9$var$encode_filter_data(op, data);
+        search_params.set($73294c7089bfc7c9$var$filter_query_param_prefix + field + $73294c7089bfc7c9$var$operator_map[op], encoded_data);
+    }
+}
+function $73294c7089bfc7c9$export$f934fa24c3a86811(search_params) {
+    const found_filters = [];
+    for (const key of search_params.keys()){
+        if (!key.startsWith($73294c7089bfc7c9$var$filter_query_param_prefix)) continue;
+        const encoded_data = search_params.get(key);
+        if (!encoded_data) continue;
+        for (const op of Object.keys($73294c7089bfc7c9$var$operator_map)){
+            const token = $73294c7089bfc7c9$var$operator_map[op];
+            if (!key.endsWith(token)) continue;
+            const data = $73294c7089bfc7c9$var$decode_filter_data(op, encoded_data);
+            if (!data) continue;
+            const field = key.slice($73294c7089bfc7c9$var$filter_query_param_prefix.length, -token.length);
+            found_filters.push({
+                field: field,
+                op: op,
+                data: data
+            });
+        }
+    }
+    return found_filters;
+}
+function $73294c7089bfc7c9$export$62acb285a7579555(sorting, search_params) {
+    if (!sorting) return;
+    const { field: field , order: order  } = sorting;
+    const ascending = order === "asc";
+    search_params.set($73294c7089bfc7c9$var$sorting_query_param, field + (ascending ? $73294c7089bfc7c9$var$ascending_token : $73294c7089bfc7c9$var$descending_token));
+}
+function $73294c7089bfc7c9$export$766e9676e74997d3(search_params) {
+    const encoded_sorting = search_params.get($73294c7089bfc7c9$var$sorting_query_param);
+    if (!encoded_sorting) return;
+    if (encoded_sorting.endsWith($73294c7089bfc7c9$var$ascending_token)) return {
+        field: encoded_sorting.slice(0, -$73294c7089bfc7c9$var$ascending_token.length),
+        order: "asc"
+    };
+    if (encoded_sorting.endsWith($73294c7089bfc7c9$var$descending_token)) return {
+        field: encoded_sorting.slice(0, -$73294c7089bfc7c9$var$descending_token.length),
+        order: "desc"
+    };
+    (0, $g9l4l$dlog)("Invalid sorting query param value", encoded_sorting);
+    return;
+}
+function $73294c7089bfc7c9$export$af4a870a0ee262c4(search_params) {
+    // We'll be modifying the URLSearchParams object, so we need to make a copy of the keys first
+    const keys = [
+        ...search_params.keys()
+    ];
+    for (const key of keys)if (key.startsWith($73294c7089bfc7c9$var$filter_query_param_prefix) || key === $73294c7089bfc7c9$var$sorting_query_param) search_params.delete(key);
+}
+const $73294c7089bfc7c9$export$e2cf3f19dd3f8aac = "went_sideways_clear_filters";
+function $73294c7089bfc7c9$export$43cd1e747fecd42e(to_url, set_clearing_flag, from_search_params = new URLSearchParams(location.search)) {
+    if (!to_url) return to_url;
+    const was_url_object = to_url instanceof URL;
+    const url_object = was_url_object ? to_url : new URL(to_url);
+    const { searchParams: searchParams  } = url_object;
+    if (set_clearing_flag) searchParams.set($73294c7089bfc7c9$export$e2cf3f19dd3f8aac, "true");
+    if (from_search_params.has($73294c7089bfc7c9$var$sorting_query_param)) searchParams.set($73294c7089bfc7c9$var$sorting_query_param, from_search_params.get($73294c7089bfc7c9$var$sorting_query_param));
+    for (const key of from_search_params.keys())if (key.startsWith($73294c7089bfc7c9$var$filter_query_param_prefix)) searchParams.set(key, from_search_params.get(key));
+    if (was_url_object) return url_object;
+    return url_object.href;
+}
+
+
 const $1b5a927e48d892a1$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<nav class="crumbs"></nav>`, 2), $1b5a927e48d892a1$var$_tmpl$2 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<a class="crumb"></a>`, 2), $1b5a927e48d892a1$var$_tmpl$3 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<span class="separator"></span>`, 2);
-function $1b5a927e48d892a1$export$5646050d516e06bc({ crumb_data_: get_api_crumb_data , on_crumb_click_: on_crumb_click_ , i18n_: i18n_  }) {
+function $1b5a927e48d892a1$export$5646050d516e06bc({ crumb_data_: get_api_crumb_data , router_: router_ , i18n_: i18n_  }) {
     const placeholder_crumb_data = [
         ,
         ,
@@ -4141,6 +4294,7 @@ function $1b5a927e48d892a1$export$5646050d516e06bc({ crumb_data_: get_api_crumb_
                     return crumb_data();
                 },
                 children: (display_accessor, index)=>{
+                    const href = (0, $g9l4l$createMemo)(()=>(0, $73294c7089bfc7c9$export$43cd1e747fecd42e)(display_accessor()?.page_url));
                     return [
                         (0, $g9l4l$createComponent)((0, $g9l4l$Show), {
                             get when () {
@@ -4154,9 +4308,13 @@ function $1b5a927e48d892a1$export$5646050d516e06bc({ crumb_data_: get_api_crumb_
                             },
                             get children () {
                                 const _el$2 = $1b5a927e48d892a1$var$_tmpl$2.cloneNode(true);
-                                (0, $g9l4l$addEventListener)(_el$2, "click", (0, $g9l4l$catchify)((ev)=>on_crumb_click_(ev, display_accessor())), true);
+                                (0, $g9l4l$addEventListener)(_el$2, "click", (0, $g9l4l$catchify)((ev)=>router_.navigate_.go_to_({
+                                        new_url_: href(),
+                                        is_replace_: false,
+                                        event_: ev
+                                    })), true);
                                 (0, $g9l4l$insert)(_el$2, ()=>display_accessor().title);
-                                (0, $g9l4l$effect)(()=>(0, $g9l4l$setAttribute)(_el$2, "href", display_accessor().page_url));
+                                (0, $g9l4l$effect)(()=>(0, $g9l4l$setAttribute)(_el$2, "href", href()));
                                 return _el$2;
                             }
                         }),
@@ -4193,8 +4351,9 @@ function $1b5a927e48d892a1$export$5646050d516e06bc({ crumb_data_: get_api_crumb_
 
 
 
+
 const $6af87e1502f04aa3$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<nav class="quicklinks"></nav>`, 2), $6af87e1502f04aa3$var$_tmpl$2 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div>QuickLinks failed</div>`, 2), $6af87e1502f04aa3$var$_tmpl$3 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<a class="quicklink"></a>`, 2);
-function $6af87e1502f04aa3$export$466cdc317043f6cb({ quicklinks_data_: quicklinks_data_ , on_link_click_: on_link_click_ , current_query_id_: current_query_id_ , slider_arrow_button_: slider_arrow_button_ , breadcrumb_data_: breadcrumb_data_ , i18n_: i18n_  }) {
+function $6af87e1502f04aa3$export$466cdc317043f6cb({ quicklinks_data_: quicklinks_data_ , router_: router_ , current_query_id_: current_query_id_ , slider_arrow_button_: slider_arrow_button_ , breadcrumb_data_: breadcrumb_data_ , i18n_: i18n_  }) {
     let scrolling_logic_ran_for_query_id = false;
     let last_scroll_position;
     let scroll_to_element_on_dom_insertion;
@@ -4317,18 +4476,37 @@ function $6af87e1502f04aa3$export$466cdc317043f6cb({ quicklinks_data_: quicklink
                         },
                         children: (display_accessor, index)=>{
                             const is_selected = (0, $g9l4l$createMemo)(()=>selected_index() === index);
+                            // Problem: if opening a sibling link in a new tab, filter clearing behavior is no longer consistent
+                            // Solution:
+                            // If id of current category is in quick links they're siblings, don't add state to the url
+                            // If it's not in it, it's a child of the current one, so add state
+                            // (This brought up the issue on what happens if someone links to a filter that no longer exists, I chose to ignore that for now)
+                            // Problem: When you don't open a link in a new tab, we don't display the filter cleared toast
+                            // Solution: instead of not adding the state to the url, add a flag to the link if it's a sibling and then display the toast on load if the flag is set
+                            const is_sibling = (0, $g9l4l$createMemo)(()=>{
+                                const current_id = current_query_id_();
+                                return quicklinks_data_()?.some(({ query_id: query_id  })=>query_id === current_id);
+                            });
+                            const href = (0, $g9l4l$createMemo)(()=>// We don't want these links to delete the sort and filter state by default, only if `clear_filters_when_going_sideways` explicitly clears them
+                                (0, $73294c7089bfc7c9$export$43cd1e747fecd42e)(display_accessor()?.page_url, is_sibling()));
                             return (()=>{
                                 const _el$3 = $6af87e1502f04aa3$var$_tmpl$3.cloneNode(true);
                                 (0, $g9l4l$addEventListener)(_el$3, "click", (0, $g9l4l$catchify)((ev)=>{
-                                    if (is_selected() && !ev.metaKey && !ev.ctrlKey && !ev.button) ev.preventDefault();
-                                    else if (display_accessor()) on_link_click_(ev, display_accessor());
+                                    const url = href();
+                                    if (is_selected() && !ev.metaKey && !ev.ctrlKey && !ev.button || !url) // allow open currently selected one in new tab but otherwise prevent clicks
+                                    ev.preventDefault();
+                                    else if (href()) router_.navigate_.go_to_({
+                                        new_url_: url,
+                                        is_replace_: false,
+                                        event_: ev
+                                    });
                                 }), true);
                                 (0, $g9l4l$insert)(_el$3, ()=>display_accessor()?.title || (0, $g9l4l$createComponent)((0, $g9l4l$Placeholder), {
                                         height: "1em",
                                         width: "10ch"
                                     }));
                                 (0, $g9l4l$effect)((_p$)=>{
-                                    const _v$ = !!is_selected(), _v$2 = display_accessor()?.page_url || "javascript:void(0)";
+                                    const _v$ = !!is_selected(), _v$2 = href();
                                     _v$ !== _p$._v$ && _el$3.classList.toggle("selected", _p$._v$ = _v$);
                                     _v$2 !== _p$._v$2 && (0, $g9l4l$setAttribute)(_el$3, "href", _p$._v$2 = _v$2);
                                     return _p$;
@@ -4355,7 +4533,17 @@ function $6af87e1502f04aa3$export$466cdc317043f6cb({ quicklinks_data_: quicklink
 
 
 
-function $2bdb723d3eb0e5b3$export$3fe6942dd2836d9d({ crumb_data_: crumb_data_ , query_id_: query_id_ , i18n_: i18n_ , selected_filters_: selected_filters_ , local_filter_cache_: local_filter_cache_ , expanded_hierarchical_filters_: expanded_hierarchical_filters_  }) {
+
+function $cb20e79516018342$export$3945d6db2dfd3d12({ crumb_data_: crumb_data_ , query_id_: query_id_ , i18n_: i18n_ , selected_filters_: selected_filters_ , local_filter_cache_: local_filter_cache_ , expanded_hierarchical_filters_: expanded_hierarchical_filters_ , plp_results_: plp_results_  }) {
+    // If we just got opened in a new tab, clear filters instantly and remove the flag
+    $cb20e79516018342$var$clear_if_opened_new_tab_with_sideways_url_params_flag({
+        plp_results_: plp_results_,
+        local_filter_cache_: local_filter_cache_,
+        expanded_hierarchical_filters_: expanded_hierarchical_filters_,
+        selected_filters_: selected_filters_,
+        i18n_: i18n_
+    });
+    // Code below is for when we're already open and the user navigates to a new category
     let previous_crumb_data = (0, $g9l4l$untrack)(crumb_data_);
     let query_id_when_we_got_previous_data = (0, $g9l4l$untrack)(query_id_);
     let allow_filter_clearing = true; // set to false when going backwards/forwards
@@ -4372,7 +4560,41 @@ function $2bdb723d3eb0e5b3$export$3fe6942dd2836d9d({ crumb_data_: crumb_data_ ,
             const went_downwards = previous_length < new_length;
             const shorter_array = went_upwards ? new_crumb_data : previous_crumb_data;
             const longer_array = went_upwards ? previous_crumb_data : new_crumb_data;
-            if (!((went_upwards || went_downwards) && shorter_array.every(({ query_id: query_id  }, index)=>longer_array[index].query_id === query_id))) // We went sideways, not up or down. Clear filters.
+            if (!((went_upwards || went_downwards) && shorter_array.every(({ query_id: query_id  }, index)=>longer_array[index].query_id === query_id))) {
+                // We went sideways, not up or down. Clear filters.
+                (0, $af89070cc0052779$export$8895d39404bd2bb1)({
+                    user_triggered_: false,
+                    i18n_: i18n_,
+                    also_clear_sorting_: false,
+                    selected_filters_: selected_filters_,
+                    expanded_hierarchical_filters_: expanded_hierarchical_filters_,
+                    local_filter_cache_: local_filter_cache_
+                });
+                // Also ensure we don't have `sideways_url_params_flag` set anymore
+                const url = new URL(location.href);
+                const { searchParams: searchParams  } = url;
+                if (searchParams.has((0, $73294c7089bfc7c9$export$e2cf3f19dd3f8aac))) {
+                    searchParams.delete((0, $73294c7089bfc7c9$export$e2cf3f19dd3f8aac));
+                    history.replaceState(history.state, "", url.href);
+                }
+            }
+        }
+        query_id_when_we_got_previous_data = query_id_of_new_data;
+        previous_crumb_data = new_crumb_data;
+        if (!allow_filter_clearing) allow_filter_clearing = true;
+    })));
+}
+function $cb20e79516018342$var$clear_if_opened_new_tab_with_sideways_url_params_flag({ plp_results_: plp_results_ , expanded_hierarchical_filters_: expanded_hierarchical_filters_ , i18n_: i18n_ , selected_filters_: selected_filters_ , local_filter_cache_: local_filter_cache_  }) {
+    const tracking_function_for_plp_results = (0, $g9l4l$createReaction)(()=>{
+        // On first rendering of the CategoryPage (after we have results), check if we got to this URL by going sideways in QuickLinks and clear filters with toast if so
+        const url_object = new URL(location.href);
+        const { searchParams: searchParams  } = url_object;
+        if (searchParams.get((0, $73294c7089bfc7c9$export$e2cf3f19dd3f8aac)) !== "true") return;
+        searchParams.delete((0, $73294c7089bfc7c9$export$e2cf3f19dd3f8aac));
+        history.replaceState(history.state, "", url_object.href);
+        (0, $g9l4l$dlog)("Flag to clear filters was set, clearing filters");
+        (0, $g9l4l$queueMacroTask)(()=>{
+            // Do it next task so that all the filters have time to populate
             (0, $af89070cc0052779$export$8895d39404bd2bb1)({
                 user_triggered_: false,
                 i18n_: i18n_,
@@ -4381,11 +4603,9 @@ function $2bdb723d3eb0e5b3$export$3fe6942dd2836d9d({ crumb_data_: crumb_data_ ,
                 expanded_hierarchical_filters_: expanded_hierarchical_filters_,
                 local_filter_cache_: local_filter_cache_
             });
-        }
-        query_id_when_we_got_previous_data = query_id_of_new_data;
-        previous_crumb_data = new_crumb_data;
-        if (!allow_filter_clearing) allow_filter_clearing = true;
-    })));
+        });
+    });
+    tracking_function_for_plp_results(plp_results_);
 }
 
 
@@ -4504,7 +4724,7 @@ let $01115659405f3c64$export$44dad306455dddf;
 
 
 const $1ae892b13d7746ab$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="product-count"> </div>`, 2), $1ae892b13d7746ab$var$_tmpl$2 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div></div>`, 2), $1ae892b13d7746ab$var$_tmpl$3 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="filter-results-for-one-row"></div>`, 2), $1ae892b13d7746ab$var$_tmpl$4 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="depict plp category"><div class="listing-page"></div></div>`, 4);
-function $1ae892b13d7746ab$export$f7d2f673fc2f091d({ depict_api_: depict_api_ , query_id_: query_id_ , current_sorting_: current_sorting_ , min_products_to_fetch_: min_products_to_fetch_ , category_filters_open_: category_filters_open_ , category_sorting_open_: category_sorting_open_ , expanded_filters_: expanded_filters_ , selected_filters_: selected_filters_ , get_quicklinks_accessor_: get_quicklinks_accessor_ , i18n_: incoming_i18n , get_breadcrumb_accessor_: get_breadcrumb_accessor_ , slider_arrow_button_: slider_arrow_button_ , expanded_hierarchical_filters_: expanded_hierarchical_filters_ , local_filter_cache_: local_filter_cache_ , tenant_: tenant_ , market_: market_ , on_category_link_click_: on_category_link_click_ , show_quicklinks_: show_quicklinks_ , category_title_: category_title_ , show_breadcrumbs_: show_breadcrumbs_ , layout_options_: layout_options_ , scroll_restoration_data_: scroll_restoration_data_ , rr_options_: rr_options_ , get_product_id_: get_product_id_  }) {
+function $1ae892b13d7746ab$export$f7d2f673fc2f091d({ depict_api_: depict_api_ , query_id_: query_id_ , current_sorting_: current_sorting_ , min_products_to_fetch_: min_products_to_fetch_ , category_filters_open_: category_filters_open_ , category_sorting_open_: category_sorting_open_ , expanded_filters_: expanded_filters_ , selected_filters_: selected_filters_ , get_quicklinks_accessor_: get_quicklinks_accessor_ , i18n_: incoming_i18n , get_breadcrumb_accessor_: get_breadcrumb_accessor_ , slider_arrow_button_: slider_arrow_button_ , expanded_hierarchical_filters_: expanded_hierarchical_filters_ , local_filter_cache_: local_filter_cache_ , tenant_: tenant_ , market_: market_ , router_: router_ , show_quicklinks_: show_quicklinks_ , category_title_: category_title_ , show_breadcrumbs_: show_breadcrumbs_ , layout_options_: layout_options_ , scroll_restoration_data_: scroll_restoration_data_ , rr_options_: rr_options_ , get_product_id_: get_product_id_  }) {
     let results_for;
     let only_show_filters_opener_;
     let middle_elements_;
@@ -4678,13 +4898,14 @@ function $1ae892b13d7746ab$export$f7d2f673fc2f091d({ depict_api_: depict_api_ ,
         selected_filters_: selected_filters_,
         available_filters_: available_filters_
     });
-    (0, $2bdb723d3eb0e5b3$export$3fe6942dd2836d9d)({
+    (0, $cb20e79516018342$export$3945d6db2dfd3d12)({
         query_id_: query_id_,
         crumb_data_: crumb_data_,
         i18n_: i18n_,
         selected_filters_: selected_filters_,
         local_filter_cache_: local_filter_cache_,
-        expanded_hierarchical_filters_: expanded_hierarchical_filters_
+        expanded_hierarchical_filters_: expanded_hierarchical_filters_,
+        plp_results_: plp_results_
     });
     get_breadcrumb_accessor_?.(crumb_data_);
     get_quicklinks_accessor_?.(quicklinks_data_);
@@ -4697,7 +4918,7 @@ function $1ae892b13d7746ab$export$f7d2f673fc2f091d({ depict_api_: depict_api_ ,
                 get children () {
                     return (0, $g9l4l$createComponent)((0, $1b5a927e48d892a1$export$5646050d516e06bc), {
                         crumb_data_: crumb_data_,
-                        on_crumb_click_: on_category_link_click_,
+                        router_: router_,
                         i18n_: i18n_
                     });
                 }
@@ -4708,7 +4929,7 @@ function $1ae892b13d7746ab$export$f7d2f673fc2f091d({ depict_api_: depict_api_ ,
                     return (0, $g9l4l$createComponent)((0, $6af87e1502f04aa3$export$466cdc317043f6cb), {
                         quicklinks_data_: quicklinks_data_,
                         current_query_id_: query_id_,
-                        on_link_click_: on_category_link_click_,
+                        router_: router_,
                         slider_arrow_button_: slider_arrow_button_,
                         breadcrumb_data_: crumb_data_,
                         i18n_: i18n_
@@ -4932,6 +5153,166 @@ function $c7f938ac40924f3b$export$23fca46f3143581f(component, error_message) {
 }
 
 
+
+
+
+function $b4291f5d2e6b2fae$export$7bcff1eb3eca57d7(router) {
+    const current_sorting_ = (0, $g9l4l$createSignal)();
+    const selected_filters_ = (0, $g9l4l$createSignal)([]);
+    const [get_sorting, set_sorting] = current_sorting_;
+    const [get_selected_filters, set_selected_filters] = selected_filters_;
+    const [get_current_href, set_current_href] = (0, $g9l4l$createSignal)(location.href);
+    const history_change_handler = ()=>set_current_href(location.href);
+    const owner = (0, $g9l4l$getOwner)() || (0, $g9l4l$createRoot)(()=>(0, $g9l4l$getOwner)());
+    let writer_started = false;
+    (0, $g9l4l$instant_exec_on_suspect_history_change).add(history_change_handler);
+    (0, $g9l4l$onCleanup)(()=>(0, $g9l4l$instant_exec_on_suspect_history_change).delete(history_change_handler));
+    (0, $g9l4l$createComputed)(()=>{
+        const { searchParams: searchParams  } = new URL(get_current_href());
+        (0, $g9l4l$batch)(()=>{
+            const found_sorting = (0, $73294c7089bfc7c9$export$766e9676e74997d3)(searchParams);
+            if (found_sorting) {
+                const current_sorting = (0, $g9l4l$untrack)(get_sorting);
+                // Do some diffing since we might assume in certain places of the code that if the signal changes it means the sorting has changed
+                if (current_sorting?.field !== found_sorting.field || current_sorting?.order !== found_sorting.order) set_sorting(found_sorting);
+            } else set_sorting();
+            const found_filters = (0, $73294c7089bfc7c9$export$f934fa24c3a86811)(searchParams);
+            const selected_filters = (0, $g9l4l$untrack)(get_selected_filters);
+            const found_filters_map = new Map(found_filters.map(({ field: field , op: op , data: data  })=>[
+                    JSON.stringify([
+                        field,
+                        op
+                    ]),
+                    data
+                ]));
+            // Sorry for this diffing algorithm lol. Looking forwards to Records and Tuples.
+            if (selected_filters.length !== found_filters.length || !selected_filters.every(({ field: field , op: op , data: data  })=>JSON.stringify(found_filters_map.get(JSON.stringify([
+                    field,
+                    op
+                ]))) === JSON.stringify(data))) set_selected_filters(found_filters);
+            if (!writer_started) {
+                // The owner here is the createComputed which gets disposed the next time the computation runs - but we actually just want to delay the start of the href_writer until our signals contain the current value of the URL, therefore the runWithOwner
+                (0, $g9l4l$runWithOwner)(owner, ()=>$b4291f5d2e6b2fae$var$start_href_writer(get_sorting, get_selected_filters, router));
+                writer_started = true;
+            }
+        });
+    });
+    return {
+        current_sorting_: current_sorting_,
+        selected_filters_: selected_filters_
+    };
+}
+/**
+ * Writes the sorting and filters to the URL query parameters when they change.
+ */ function $b4291f5d2e6b2fae$var$start_href_writer(get_sorting, get_selected_filters, router) {
+    // This has to be a createComputed because there can be some kind of URL query bouncing back and forwards otherwise (observed when clearing filters by making a new search)
+    (0, $g9l4l$createComputed)((0, $g9l4l$on)([
+        get_sorting,
+        get_selected_filters
+    ], ([sorting, filters])=>{
+        const current_href = location.href;
+        const url_object = new URL(current_href);
+        const { searchParams: searchParams  } = url_object;
+        (0, $73294c7089bfc7c9$export$af4a870a0ee262c4)(searchParams);
+        (0, $73294c7089bfc7c9$export$62acb285a7579555)(sorting, searchParams);
+        (0, $73294c7089bfc7c9$export$58aa3f171519b6d7)(filters, searchParams);
+        // We can't just check if the URL is equal since sometimes the order of the parameters in the URL changes (randomly?) so we need to compare them one by one
+        const unmodified_search_params = [
+            ...new URL(current_href).searchParams
+        ];
+        const new_search_params = [
+            ...searchParams
+        ];
+        // Having the array middle step because if we'd check the "size" property of the map the algorithm could be fooled if there were two query parameters with the same key
+        const new_search_params_map = new Map(new_search_params);
+        if (unmodified_search_params.length !== new_search_params.length || !unmodified_search_params.every(([key, value])=>new_search_params_map.get(key) === value)) // Only update URL if it actually changed
+        router.navigate_.go_to_({
+            is_replace_: true,
+            new_url_: url_object.href,
+            force_spa_navigation_: true
+        });
+    }, {
+        defer: true
+    }));
+}
+
+
+
+class $cfa2761d36e5714c$export$7e1297a3a19f10d8 {
+    #forced_default_on_navigation({ is_replace: is_replace , new_url: new_url  }) {
+        history[is_replace ? "replaceState" : "pushState"](history.state, "", new_url);
+    }
+    /**
+   * Function that will be called when we want to navigate, or a string saying it's not an SPA. You can change this OTG
+   */ #throwing_on_navigation(...args) {
+        const { on_navigation_: on_navigation_  } = this;
+        if (typeof on_navigation_ !== "function") throw new Error("on_navigation_ is not a function");
+        // make sure that we don't accidentally catchify if the SDK consumer has fucked up
+        try {
+            return on_navigation_(...args);
+        } catch (e) {
+            queueMicrotask(()=>{
+                throw e;
+            });
+        }
+    }
+    /**
+   * Checks if this tab shouldn't navigate because user wants to open in new tab
+   */ #dont_attempt_navigation(ev) {
+        return ev?.button || ev?.metaKey || ev?.ctrlKey;
+    }
+    /**
+   * Vue has async router that needs to be awaited (it navigates after a microtask)
+   * This standardises waiting for all kinds of routers
+   */ #get_navigation_happened_promise(is_replace1) {
+        return new Promise((resolve)=>{
+            const handler = (what_happened)=>{
+                if (what_happened === (is_replace1 ? "replaceState" : "pushState")) {
+                    resolve();
+                    (0, $g9l4l$instant_exec_on_suspect_history_change).delete(handler);
+                }
+            };
+            (0, $g9l4l$instant_exec_on_suspect_history_change).add(handler);
+        });
+    }
+    navigate_ = {
+        /**
+     * Call this if you *just* want to replace the state object in history.state
+     */ replace_state_: (new_state)=>{
+            // This doesn't break any router, so we just do this directly for now, since many don't expose an interface for changing the state
+            history.replaceState(new_state, "");
+        },
+        /**
+     * Call this to change the URL
+     * @param new_url_ new URL to go to
+     * @param event_ event if you have this in a click handler, will not do anything on cmd/ctrl or non-left click then
+     * @param force_spa_navigation_ if you want to force SPA navigation even if on_navigation_ is set to "hard_navigation". You should only set this to true for inter-SDK-page navigations
+     * @param is_replace_ if you want to replace the current URL in history instead of pushing a new one
+     */ go_to_: async ({ new_url_: new_url_ , event_: event_ , force_spa_navigation_: force_spa_navigation_ , is_replace_: is_replace_  })=>{
+            const wants_hard_navigation = this.on_navigation_ === "hard_navigation";
+            if (this.#dont_attempt_navigation(event_)) return;
+            if (wants_hard_navigation && !force_spa_navigation_) {
+                if (!event_) // If we haven't gotten an event, nothing will happen by not calling prevent default, so we need to change the URL
+                location.assign(new_url_);
+                return;
+            }
+            event_?.preventDefault();
+            const promise = this.#get_navigation_happened_promise(true);
+            const navigation_function = // Don't allow hard navigation if we're forcing SPA navigation, which we do for things where PageReplacer can be used for performance
+            force_spa_navigation_ && wants_hard_navigation ? this.#forced_default_on_navigation : this.#throwing_on_navigation;
+            navigation_function.call(this, {
+                is_replace: is_replace_,
+                new_url: new_url_ instanceof URL ? new_url_ : new URL(new_url_)
+            });
+            await promise;
+        }
+    };
+    constructor(on_navigation){
+        this.on_navigation_ = on_navigation;
+    }
+}
+
+
 const $ec52ef1e6c117813$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="depict plp category"></div>`, 2);
 const $ec52ef1e6c117813$var$min_products_to_fetch_ = 20;
 const $ec52ef1e6c117813$var$privately_shared_properties = /*@__PURE__*/ new WeakMap();
@@ -4942,6 +5323,7 @@ const $ec52ef1e6c117813$var$InExternalAreaDiv = ({ children: children  })=>(()=>
         return _el$;
     })();
 class $ec52ef1e6c117813$export$f34314aa9505732e {
+    #router = new (0, $cfa2761d36e5714c$export$7e1297a3a19f10d8)("hard_navigation");
     #locale_signal = (0, $g9l4l$createSignal)();
     #merchant_signal = (0, $g9l4l$createSignal)();
     #market_signal = (0, $g9l4l$createSignal)();
@@ -4972,38 +5354,30 @@ class $ec52ef1e6c117813$export$f34314aa9505732e {
     set market(market) {
         this.#market_signal[1](market);
     }
+    get on_navigation() {
+        // The only non-reactive public property on the class (I don't see it making sense to have it reactive)
+        return this.#router.on_navigation_;
+    }
+    set on_navigation(new_function) {
+        this.#router.on_navigation_ = new_function;
+    }
     constructor({ api: api , on_navigation: on_navigation , ...props_on_class }){
         if ($ec52ef1e6c117813$export$f34314aa9505732e.#has_been_constructed) throw new Error("You can only have one instance of DepictCategory due to state limitations");
         $ec52ef1e6c117813$export$f34314aa9505732e.#has_been_constructed = true;
         Object.assign(this, props_on_class); // set initial signal values
         (0, $2864fd26f57ff474$export$5162a71f252e6122)();
+        if (on_navigation) this.#router.on_navigation_ = on_navigation;
+        const { selected_filters_: selected_filters_ , current_sorting_: current_sorting_  } = (0, $b4291f5d2e6b2fae$export$7bcff1eb3eca57d7)(this.#router);
         const [reset_history_state_, state_] = (0, $3075a4497054bec6$export$9862539c89138352)(()=>({
-                category_sorting: undefined,
                 category_filters_open: false,
                 category_sorting_open: false,
                 category_expanded_filters: [],
-                // WARNING, it is insanely important, when creating the signals like this using make_resettable_history_state, that the two lines below are in *precisely that order*. The reason for that is that make_resettable_history_state will write the values of the signals in the order that they are written here when a "popstate" event occurs. If the filter cache is popped before the selected filters are the code in create_modified_filters() in FilterBody.tsx is going to re-calculate search_local_filter_cache without knowing the real value of search_selected_filters and we'll end up with too few filters in search_local_filter_cache in some cases
-                category_selected_filters: [],
+                // Please make sure that the signal created by below line always updates AFTER selected_filters_ updates on a "popstate" event. If the filter cache is popped before the selected filters are the code in create_modified_filters() is going to re-calculate search_local_filter_cache without knowing the real value of search_selected_filters, and we'll end up with too few filters in search_local_filter_cache in some cases
                 category_local_filter_cache: [],
                 category_expanded_hierarchical_filters: [],
                 category_scroll_restoration_data: []
             }));
         const i18n_ = (0, $0466953901b38f18$export$f091cbac892643a4)(this.#locale_signal[0]);
-        const on_category_link_click_ = (e, d)=>{
-            if (e.button || e.metaKey || e.ctrlKey) // Not single page navigating because button is not 0 or ctrl/command click
-            return;
-            try {
-                const url_object = new URL(d.page_url);
-                const relative_url = url_object.pathname + url_object.search + url_object.hash;
-                on_navigation(relative_url, e, d);
-                e.preventDefault();
-            } catch (e) {
-                queueMicrotask(()=>{
-                    // make sure to throw into the global scope if on_navigation throws
-                    throw e;
-                });
-            }
-        };
         $ec52ef1e6c117813$var$privately_shared_properties.set(this, {
             state_: state_,
             breadcrumb_signal_: (0, $g9l4l$createSignal)(),
@@ -5011,7 +5385,9 @@ class $ec52ef1e6c117813$export$f34314aa9505732e {
             i18n_: i18n_,
             reset_history_state_: reset_history_state_,
             depict_api_: api ?? new (0, $3846bb34098c738f$export$e015ed2f2950f2e3)(),
-            on_category_link_click_: on_category_link_click_,
+            router_: this.#router,
+            selected_filters_: selected_filters_,
+            current_sorting_: current_sorting_,
             slider_arrow_button_: (0, $g9l4l$GenericSliderArrowButton)({
                 height_: 12,
                 width_: 6.46
@@ -5028,7 +5404,7 @@ function $ec52ef1e6c117813$export$e2bf8ce7779e827e({ depict_category: depict_cat
         grid_spacing: grid_spacing.horizontal
     };
     return (0, $c7f938ac40924f3b$export$23fca46f3143581f)(()=>{
-        const { state_: { category_local_filter_cache: local_filter_cache_ , category_sorting: current_sorting_ , category_filters_open: category_filters_open_ , category_sorting_open: category_sorting_open_ , category_expanded_filters: expanded_filters_ , category_expanded_hierarchical_filters: expanded_hierarchical_filters_ , category_selected_filters: selected_filters_ , category_scroll_restoration_data: scroll_restoration_data_  } , reset_history_state_: reset_history_state_ , depict_api_: depict_api_ , i18n_: i18n_ , on_category_link_click_: on_category_link_click_ , breadcrumb_signal_: breadcrumb_signal_ , quicklinks_signal_: quicklinks_signal_ , slider_arrow_button_: slider_arrow_button_  } = shared_properties;
+        const { state_: { category_local_filter_cache: local_filter_cache_ , category_filters_open: category_filters_open_ , category_sorting_open: category_sorting_open_ , category_expanded_filters: expanded_filters_ , category_expanded_hierarchical_filters: expanded_hierarchical_filters_ , category_scroll_restoration_data: scroll_restoration_data_  } , current_sorting_: current_sorting_ , selected_filters_: selected_filters_ , reset_history_state_: reset_history_state_ , depict_api_: depict_api_ , i18n_: i18n_ , router_: router_ , breadcrumb_signal_: breadcrumb_signal_ , quicklinks_signal_: quicklinks_signal_ , slider_arrow_button_: slider_arrow_button_  } = shared_properties;
         (0, $g9l4l$onCleanup)(reset_history_state_);
         return (0, $1ae892b13d7746ab$export$f7d2f673fc2f091d)({
             tenant_: ()=>depict_category.merchant,
@@ -5042,7 +5418,7 @@ function $ec52ef1e6c117813$export$e2bf8ce7779e827e({ depict_category: depict_cat
             category_title_: category_title,
             show_breadcrumbs_: show_breadcrumbs,
             current_sorting_: current_sorting_,
-            on_category_link_click_: on_category_link_click_,
+            router_: router_,
             get_breadcrumb_accessor_: (accessor)=>(0, $g9l4l$createComputed)(()=>breadcrumb_signal_[1](accessor())),
             get_quicklinks_accessor_: (accessor)=>(0, $g9l4l$createComputed)(()=>quicklinks_signal_[1](accessor())),
             category_filters_open_: category_filters_open_,
@@ -5067,25 +5443,25 @@ function $ec52ef1e6c117813$export$e2bf8ce7779e827e({ depict_category: depict_cat
     }, "Entire CategoryPage failed");
 }
 function $ec52ef1e6c117813$export$5b7c3ce0ebe51f86({ depict_category: depict_category  }) {
-    const { i18n_: i18n_ , breadcrumb_signal_: [crumb_data_] , on_category_link_click_: on_crumb_click_  } = $ec52ef1e6c117813$var$get_shared_properties(depict_category);
+    const { i18n_: i18n_ , breadcrumb_signal_: [crumb_data_] , router_: router_  } = $ec52ef1e6c117813$var$get_shared_properties(depict_category);
     return (0, $g9l4l$createComponent)($ec52ef1e6c117813$var$InExternalAreaDiv, {
         get children () {
             return (0, $1b5a927e48d892a1$export$5646050d516e06bc)({
                 i18n_: i18n_,
                 crumb_data_: crumb_data_,
-                on_crumb_click_: on_crumb_click_
+                router_: router_
             });
         }
     });
 }
 function $ec52ef1e6c117813$export$de035477d6fef996({ depict_category: depict_category  }) {
-    const { i18n_: i18n_ , quicklinks_signal_: [quicklinks_data_] , breadcrumb_signal_: [breadcrumb_data_] , on_category_link_click_: on_link_click_ , slider_arrow_button_: slider_arrow_button_  } = $ec52ef1e6c117813$var$get_shared_properties(depict_category);
+    const { i18n_: i18n_ , quicklinks_signal_: [quicklinks_data_] , breadcrumb_signal_: [breadcrumb_data_] , router_: router_ , slider_arrow_button_: slider_arrow_button_  } = $ec52ef1e6c117813$var$get_shared_properties(depict_category);
     return (0, $g9l4l$createComponent)($ec52ef1e6c117813$var$InExternalAreaDiv, {
         get children () {
             return (0, $6af87e1502f04aa3$export$466cdc317043f6cb)({
                 i18n_: i18n_,
                 quicklinks_data_: quicklinks_data_,
-                on_link_click_: on_link_click_,
+                router_: router_,
                 current_query_id_: ()=>depict_category.category_id,
                 slider_arrow_button_: slider_arrow_button_,
                 breadcrumb_data_: breadcrumb_data_
@@ -5314,17 +5690,14 @@ function $aaacfac0064e97d9$export$ee1733d9a8495996() {
 
 
 const $7a7079d66c12b788$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<span class="parent-title"></span>`, 2), $7a7079d66c12b788$var$_tmpl$2 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<a class="category-suggestion"><span class="title"></span></a>`, 4);
-function $7a7079d66c12b788$export$d757d54550ebfb3d({ category_suggestion_: category_suggestion_ , on_navigation_: on_navigation_  }) {
+function $7a7079d66c12b788$export$d757d54550ebfb3d({ category_suggestion_: category_suggestion_ , router_: router_  }) {
     return (()=>{
         const _el$ = $7a7079d66c12b788$var$_tmpl$2.cloneNode(true), _el$2 = _el$.firstChild;
-        (0, $g9l4l$addEventListener)(_el$, "click", (0, $g9l4l$catchify)((e)=>{
-            if (e.button || e.metaKey || e.ctrlKey) // Not single page navigating because button is not 0 or ctrl/command click
-            return;
-            if (on_navigation_) {
-                e.preventDefault();
-                return on_navigation_(category_suggestion_().page_url);
-            }
-        }), true);
+        (0, $g9l4l$addEventListener)(_el$, "click", (0, $g9l4l$catchify)((e)=>router_.navigate_.go_to_({
+                new_url_: category_suggestion_().page_url,
+                is_replace_: false,
+                event_: e
+            })), true);
         (0, $g9l4l$insert)(_el$2, ()=>category_suggestion_().title);
         (0, $g9l4l$insert)(_el$, (0, $g9l4l$createComponent)((0, $g9l4l$Show), {
             get when () {
@@ -5402,13 +5775,14 @@ function $6ded59a142c93078$export$b94867ecbd698f21({ search_field_value_: search
             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_), {
+            input_element.addEventListener("input", (0, $g9l4l$catchify)(()=>clear_filters_(false)), // We don't count this as user triggered since it wasn't explicit
+            {
                 once: true
             });
         }));
         (0, $g9l4l$addEventListener)(_el$4, "input", (0, $g9l4l$catchify)(()=>{
             const { value: value  } = input_element;
-            if (!disabled_ && !value.length) clear_filters_(); // if the user clears the whole field, reset filters on next submit
+            if (!disabled_ && !value.length) clear_filters_(false); // 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)=>{
@@ -5428,7 +5802,7 @@ function $6ded59a142c93078$export$b94867ecbd698f21({ search_field_value_: search
         _el$4.classList.toggle("has-adjacent-back-button", !!on_back_);
         (0, $g9l4l$addEventListener)(_el$5, "click", (0, $g9l4l$catchify)(()=>{
             search_field_value_[1]("");
-            clear_filters_();
+            clear_filters_(true);
             if (!disabled_) input_element.focus();
         }), true);
         (0, $g9l4l$insert)(_el$5, (0, $g9l4l$createComponent)((0, $g9l4l$CrossIcon), {}));
@@ -5646,27 +6020,27 @@ function $079defea521d5e2a$export$b3ad617e9036868(modal_body_style, input_field,
 
 
 function $a0d89ff25220eb8d$export$e026af0c7b64ea5f({ selected_filters_: selected_filters_ , search_query_: [get_search_query] , current_sorting_: current_sorting_ , expanded_hierarchical_filters_: expanded_hierarchical_filters_ , i18n_: i18n_ , local_filter_cache_: local_filter_cache_  }) {
-    const [get_selected_filters, set_selected_filters] = selected_filters_;
-    const clear_filters_next_submit_ = (0, $g9l4l$createSignal)(false); // we store this here (and not in history.state) (maybe there's a better place) because it's a very temporary thing. I.e. as soon as anything breaks the "flow of intent" to make a new search we want this reset
+    const [get_selected_filters] = selected_filters_;
+    // Possible values:
+    // 0 - we should not clear next submit
+    // 1 - we should clear next submit due to internal heuristics
+    // 2 - we should clear next submit due to EXPLICIT user action (i.e. clear button pressed)
+    const clear_filters_next_submit_ = (0, $g9l4l$createSignal)(0); // we store this here (and not in history.state) (maybe there's a better place) because it's a very temporary thing. I.e. as soon as anything breaks the "flow of intent" to make a new search we want this reset
     const [get_clear_filters_next_submit, set_clear_filters_next_submit] = clear_filters_next_submit_;
-    const clear_filters = ()=>set_clear_filters_next_submit(true);
+    const clear_filters = (user_triggered)=>set_clear_filters_next_submit(user_triggered ? 2 : 1);
     (0, $g9l4l$createComputed)((0, $g9l4l$on)(get_selected_filters, ()=>{
         // if the selected filters update, clear the clearing signal
-        set_clear_filters_next_submit(false);
+        set_clear_filters_next_submit(0);
     }, {
         defer: true
     }));
     (0, $g9l4l$createComputed)((0, $g9l4l$on)(get_search_query, (0, $g9l4l$catchify)(()=>{
         // when a query was submitted, clear filters if clear was pressed before
-        if ((0, $g9l4l$untrack)(get_clear_filters_next_submit)) {
-            set_clear_filters_next_submit(false);
-            set_selected_filters([]);
-            // also collapse expanded filters in hierarchical filter tree again
-            expanded_hierarchical_filters_[1]([]);
-            // also clear sorting
-            current_sorting_[1](undefined);
+        const clear_value = (0, $g9l4l$untrack)(get_clear_filters_next_submit);
+        if (clear_value) {
+            set_clear_filters_next_submit(0);
             (0, $af89070cc0052779$export$8895d39404bd2bb1)({
-                user_triggered_: true,
+                user_triggered_: clear_value === 2,
                 selected_filters_: selected_filters_,
                 i18n_: i18n_,
                 also_clear_sorting_: true,
@@ -5711,26 +6085,8 @@ function $4d62f5daa51642fe$export$84bba84a7b837187(search_query) {
 
 
 
-/**
- * Calls history.pushState wiht the current url BUT the query parameter with name url_param_name has been set to value (or deleted if no value is provided) and url_transformer has been executed on the URL object that we're pushing
- */ function $972ebf2641490830$export$26df08e242fe83a3(url_param_name, value, url_transformer) {
-    $972ebf2641490830$var$set_param(false, url_param_name, value, url_transformer);
-}
-function $972ebf2641490830$export$7a053411c76081d8(url_param_name, value, url_transformer) {
-    $972ebf2641490830$var$set_param(true, url_param_name, value, url_transformer);
-}
-function $972ebf2641490830$var$set_param(replace, url_param_name, value, url_transformer) {
-    const u_o = new URL(location.href);
-    url_transformer?.(u_o);
-    const { searchParams: searchParams  } = u_o;
-    if (value !== undefined) searchParams.set(url_param_name, value);
-    else searchParams.delete(url_param_name);
-    history[replace ? "replaceState" : "pushState"](history.state, "", u_o.href);
-}
-
-
-function $7f6ddd9a7e868c4d$export$e16630ecb9644a1c({ on_submit_with_unchanged_value_: on_submit_with_unchanged_value_ , search_param_name_: search_param_name_ , search_field_value_: [read_field_value, write_field_value] , search_query_: [read_search_query] , url_transformer_: url_transformer_ , on_submit_: on_submit_ = (0, $972ebf2641490830$export$26df08e242fe83a3) , after_submit_: after_submit_  }) {
-    const new_search_query = (0, $g9l4l$untrack)(read_field_value);
+async function $7f6ddd9a7e868c4d$export$e16630ecb9644a1c({ on_submit_with_unchanged_value_: on_submit_with_unchanged_value_ , search_param_name_: search_param_name_ , set_search_field_value_: set_search_field_value_ , search_query_: [read_search_query] , url_transformer_: url_transformer_ , router_: router_ , after_submit_: after_submit_ , get_new_query: get_new_query  }) {
+    const new_search_query = get_new_query();
     const previous_query = (0, $g9l4l$untrack)(read_search_query);
     if (previous_query === new_search_query && new URLSearchParams(location.search).has(search_param_name_)) {
         // don't push a history entry / re-search if someone submits a search again
@@ -5738,9 +6094,16 @@ function $7f6ddd9a7e868c4d$export$e16630ecb9644a1c({ on_submit_with_unchanged_va
         on_submit_with_unchanged_value_?.();
         return;
     }
-    write_field_value(previous_query); // restore the value to the previous query since this one goes to the new history entry
-    on_submit_(search_param_name_, new_search_query, url_transformer_);
-    write_field_value(new_search_query);
+    set_search_field_value_(previous_query); // restore the value to the previous query since this one goes to the new history entry
+    const target_url = new URL(location.href);
+    url_transformer_?.(target_url);
+    target_url.searchParams.set(search_param_name_, new_search_query);
+    await router_.navigate_.go_to_({
+        new_url_: target_url,
+        is_replace_: false,
+        force_spa_navigation_: true
+    });
+    set_search_field_value_(new_search_query);
     scrollTo(0, 0);
     after_submit_?.();
 }
@@ -5749,6 +6112,8 @@ function $7f6ddd9a7e868c4d$export$e16630ecb9644a1c({ on_submit_with_unchanged_va
 
 
 function $4ad18a8b237ff7f6$export$2542ffb77b620b02(params_to_default_value) {
+    // TODO: remove this abstraction, put it in same place as filters
+    // TODO: make it only return an accessor
     const signals = {};
     const entries = Object.entries(params_to_default_value);
     for (const [param, default_value] of entries)signals[param] = (0, $g9l4l$createSignal)(default_value ?? "");
@@ -6079,47 +6444,26 @@ function $ced3551536e52fa1$export$50b90be27d8502d9(el, [get_style_props, set_sty
 
 
 
-function $8fee64e5ff6fd014$export$91c3b6774e8be0f5({ param_: param_ , value_: value_ , url_transformer_: url_transformer_ , alternative_query_submitter_for_spas_: alternative_query_submitter_for_spas_ , set_search_field_value_: set_search_field_value_ , get_search_query_: get_search_query_ , after_submit_: after_submit_ , on_submit_with_unchanged_value_: on_submit_with_unchanged_value_  }) {
-    const [read_link, write_link] = (0, $g9l4l$createSignal)();
+function $8fee64e5ff6fd014$export$91c3b6774e8be0f5({ param_: param_ , value_: value_ , url_transformer_: url_transformer_  }) {
+    const [get_current_href, set_current_href] = (0, $g9l4l$createSignal)(location.href);
     const [exit_iterable, exitable_iterable] = (0, $g9l4l$make_asyncIterable_exiter)((0, $g9l4l$href_change_ipns));
     (0, $g9l4l$onCleanup)(exit_iterable);
     (0, $g9l4l$catchify)(async ()=>{
-        for await (const href of exitable_iterable){
-            // use native links so ppl can cmdclick/right click and open in new tab and see target URL
-            const u_o = new URL(href);
-            url_transformer_?.(u_o);
-            u_o.searchParams.set(param_, value_);
-            write_link(u_o.href);
-        }
+        for await (const href of exitable_iterable)// use native links so ppl can cmdclick/right click and open in new tab and see target URL
+        set_current_href(href);
     })();
-    const on_click_handler_ = (e)=>{
-        if (e.button || e.metaKey || e.ctrlKey) // not button 0 or cmd/ctrl click
-        return;
-        e.preventDefault();
-        if (new URLSearchParams(location.search).get(param_) === value_) {
-            // don't do anything if we're already searching for this
-            on_submit_with_unchanged_value_?.();
-            return;
-        }
-        set_search_field_value_((0, $g9l4l$untrack)(get_search_query_)); // fill in old query in previous history entry before making new one, like we do in submit_query
-        if (typeof alternative_query_submitter_for_spas_ === "function") alternative_query_submitter_for_spas_(param_, value_, url_transformer_);
-        else {
-            history.pushState(history.state, "", (0, $g9l4l$untrack)((0, $g9l4l$catchify)(()=>read_link())));
-            scrollTo(0, 0);
-        }
-        set_search_field_value_(value_);
-        after_submit_?.();
-    };
-    return {
-        read_link_: read_link,
-        on_click_handler_: on_click_handler_
-    };
+    return (0, $g9l4l$createMemo)(()=>{
+        const u_o = new URL(get_current_href());
+        url_transformer_?.(u_o);
+        u_o.searchParams.set(param_, value_());
+        return u_o.href;
+    });
 }
 
 
 
 const $dd44dd5f5011ac6f$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="previous-searches"><h2 class="text"></h2><div class="list"></div></div>`, 6), $dd44dd5f5011ac6f$var$_tmpl$2 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<a class="item"><div class="left"><span></span></div><button class="delete"></button></a>`, 8);
-function $dd44dd5f5011ac6f$export$a146ac6fa8346a25({ text_: text_ , previous_searches_: previous_searches_ , search_query_param_name_: search_query_param_name_ , currently_showing_suggestions_: currently_showing_suggestions_ , set_unfiltered_previous_searches_: set_unfiltered_previous_searches_ , search_field_value_: search_field_value_ , selected_index_: [read_selected_index_, write_selected_index_] , url_transformer_: url_transformer_ , alternative_query_submitter_for_spas_: alternative_query_submitter_for_spas_ , i18n_: i18n_ , get_search_query_: get_search_query_ , after_submit_: after_submit_ , on_submit_with_unchanged_value_: on_submit_with_unchanged_value_  }) {
+function $dd44dd5f5011ac6f$export$a146ac6fa8346a25({ text_: text_ , previous_searches_: previous_searches_ , search_query_param_name_: search_query_param_name_ , currently_showing_suggestions_: currently_showing_suggestions_ , set_unfiltered_previous_searches_: set_unfiltered_previous_searches_ , selected_index_: [read_selected_index_, write_selected_index_] , url_transformer_: url_transformer_ , i18n_: i18n_ , submit_query_: submit_query_  }) {
     const has_entries = (0, $g9l4l$createMemo)(()=>previous_searches_().length >= 1);
     currently_showing_suggestions_[1]((value)=>{
         value[0] = (0, $g9l4l$createMemo)(()=>previous_searches_().map((result)=>({
@@ -6145,20 +6489,20 @@ function $dd44dd5f5011ac6f$export$a146ac6fa8346a25({ text_: text_ , previous_sea
                     return previous_searches_();
                 },
                 children: (item, index)=>{
-                    const param_change_obj = (0, $g9l4l$createMemo)(()=>(0, $8fee64e5ff6fd014$export$91c3b6774e8be0f5)({
-                            param_: search_query_param_name_,
-                            value_: item(),
-                            url_transformer_: url_transformer_,
-                            alternative_query_submitter_for_spas_: alternative_query_submitter_for_spas_,
-                            set_search_field_value_: search_field_value_[1],
-                            get_search_query_: get_search_query_,
-                            after_submit_: after_submit_,
-                            on_submit_with_unchanged_value_: on_submit_with_unchanged_value_
-                        }));
+                    const href = (0, $8fee64e5ff6fd014$export$91c3b6774e8be0f5)({
+                        param_: search_query_param_name_,
+                        value_: item,
+                        url_transformer_: url_transformer_
+                    });
                     return (()=>{
                         const _el$4 = $dd44dd5f5011ac6f$var$_tmpl$2.cloneNode(true), _el$5 = _el$4.firstChild, _el$6 = _el$5.firstChild, _el$7 = _el$5.nextSibling;
                         (0, $g9l4l$use)((element)=>element.addEventListener(// Viskan's Oscar Jacobson site requires us to add the event listener normally here. They do too much when this element is clicked. We work around it by blocking the event and just dispatching it non-bubbling on this element.
-                            "click", (0, $g9l4l$catchify)((e)=>param_change_obj().on_click_handler_(e))), _el$4);
+                            "click", (0, $g9l4l$catchify)((ev)=>{
+                                if (ev.button || ev.metaKey || ev.ctrlKey) // not button 0 or cmd/ctrl click
+                                return;
+                                ev.preventDefault();
+                                submit_query_(item());
+                            })), _el$4);
                         (0, $g9l4l$addEventListener)(_el$4, "mouseleave", (0, $g9l4l$catchify)(()=>write_selected_index_(undefined)));
                         (0, $g9l4l$addEventListener)(_el$4, "mouseenter", (0, $g9l4l$catchify)(()=>write_selected_index_([
                                 0,
@@ -6183,7 +6527,7 @@ function $dd44dd5f5011ac6f$export$a146ac6fa8346a25({ text_: text_ , previous_sea
                             })), _el$7);
                         (0, $g9l4l$insert)(_el$7, (0, $g9l4l$createComponent)((0, $g9l4l$CrossIcon), {}));
                         (0, $g9l4l$effect)((_p$)=>{
-                            const _v$ = !!(0, $g9l4l$createMemo)(()=>read_selected_index_()?.[0] === 0 && read_selected_index_()?.[1] === index)(), _v$2 = param_change_obj().read_link_(), _v$3 = i18n_.previous_searches_delete_entry_from_history_();
+                            const _v$ = !!(0, $g9l4l$createMemo)(()=>read_selected_index_()?.[0] === 0 && read_selected_index_()?.[1] === index)(), _v$2 = href(), _v$3 = i18n_.previous_searches_delete_entry_from_history_();
                             _v$ !== _p$._v$ && _el$4.classList.toggle("selected", _p$._v$ = _v$);
                             _v$2 !== _p$._v$2 && (0, $g9l4l$setAttribute)(_el$4, "href", _p$._v$2 = _v$2);
                             _v$3 !== _p$._v$3 && (0, $g9l4l$setAttribute)(_el$7, "title", _p$._v$3 = _v$3);
@@ -6282,41 +6626,34 @@ function $54eb3ff8b0c7c7b8$export$ba17c5b7e6dda39f({ whole_text_to_display_: who
 
 
 const $f19e81a7eecb0aac$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<a class="suggestion"></a>`, 2), $f19e81a7eecb0aac$var$_tmpl$2 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="search-icon"></div>`, 2), $f19e81a7eecb0aac$var$_tmpl$3 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<span class="type"></span>`, 2), $f19e81a7eecb0aac$var$_tmpl$4 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div><span class="value"></span></div>`, 4), $f19e81a7eecb0aac$var$_tmpl$5 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<h2 class="text"></h2>`, 2), $f19e81a7eecb0aac$var$_tmpl$6 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="suggestion-container query"></div>`, 2), $f19e81a7eecb0aac$var$_tmpl$7 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="suggestion-container page"></div>`, 2), $f19e81a7eecb0aac$var$_tmpl$8 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="suggestions"></div>`, 2);
-function $f19e81a7eecb0aac$export$e872e2339fb04a7f({ suggestion_memo_: suggestion_memo_ , search_field_value_: search_field_value_ , search_page_url_param_name_: search_page_url_param_name_ , selected_index_: [read_selected_index_, write_selected_index_] , url_transformer_: url_transformer_ , filtered_previous_searches_: filtered_previous_searches_ , currently_showing_suggestions_: currently_showing_suggestions_ , on_previous_searches_page_: on_previous_searches_page_ , alternative_query_submitter_for_spas_: alternative_query_submitter_for_spas_ , i18n_: i18n_ , include_category_suggestions_: include_category_suggestions_ , searching_for_value_: searching_for_value_ , get_search_query_: get_search_query_ , after_submit_: after_submit_ , navigate_page_to_href_: navigate_page_to_href_ , on_submit_with_unchanged_value_: on_submit_with_unchanged_value_  }) {
+function $f19e81a7eecb0aac$export$e872e2339fb04a7f({ suggestion_memo_: suggestion_memo_ , search_page_url_param_name_: search_page_url_param_name_ , selected_index_: [read_selected_index_, write_selected_index_] , url_transformer_: url_transformer_ , filtered_previous_searches_: filtered_previous_searches_ , currently_showing_suggestions_: currently_showing_suggestions_ , on_previous_searches_page_: on_previous_searches_page_ , i18n_: i18n_ , include_category_suggestions_: include_category_suggestions_ , searching_for_value_: searching_for_value_ , router_: router_ , submit_query_: submit_query_  }) {
     const queries_memo = (0, $g9l4l$createMemo)(()=>suggestion_memo_().filter(({ type: type , title: title  })=>type === (0, $c7bc9269d29d4bdc$export$3cf9497e790da491) && !filtered_previous_searches_().includes(title) // don't show the ones we already show from the history
         ));
     const not_queries_memo = (0, $g9l4l$createMemo)(()=>suggestion_memo_().filter(({ type: type  })=>type !== (0, $c7bc9269d29d4bdc$export$3cf9497e790da491)));
     const render_entry = (input_obj, autocomplete_data_index, index, is_history = false)=>{
         const is_query = (0, $g9l4l$createMemo)(()=>input_obj().type === (0, $c7bc9269d29d4bdc$export$3cf9497e790da491));
-        const param_change_obj = (0, $g9l4l$createMemo)(()=>is_query() ? (0, $8fee64e5ff6fd014$export$91c3b6774e8be0f5)({
+        const href_with_changed_params_accessor = (0, $g9l4l$createMemo)(()=>is_query() ? (0, $8fee64e5ff6fd014$export$91c3b6774e8be0f5)({
                 param_: search_page_url_param_name_,
-                value_: input_obj().title,
-                url_transformer_: url_transformer_,
-                alternative_query_submitter_for_spas_: alternative_query_submitter_for_spas_,
-                get_search_query_: get_search_query_,
-                set_search_field_value_: search_field_value_[1],
-                after_submit_: after_submit_,
-                on_submit_with_unchanged_value_: on_submit_with_unchanged_value_
+                value_: (0, $g9l4l$createMemo)(()=>input_obj().title),
+                url_transformer_: url_transformer_
             }) : undefined);
-        const [href, set_href] = (0, $g9l4l$createSignal)();
-        (0, $g9l4l$createComputed)(()=>{
-            const new_href = is_query() ? param_change_obj().read_link_() : input_obj().page_url;
-            // href will first show up in a tick from input_obj() updating, we don't want to assign undefined in the meantime
-            if (new_href) set_href(new_href);
-        });
+        const href = (0, $g9l4l$createMemo)(()=>is_query() ? href_with_changed_params_accessor()() : input_obj().page_url);
         return (()=>{
             const _el$ = $f19e81a7eecb0aac$var$_tmpl$.cloneNode(true);
             (0, $g9l4l$use)((element)=>element.addEventListener("click", (0, $g9l4l$catchify)((ev)=>{
                     // Viskan's Oscar Jacobson site requires us to add the event listener normally here. They do too much when this element is clicked. We work around it by blocking the event and just dispatching it non-bubbling on this element.
-                    if (is_query()) return param_change_obj().on_click_handler_(ev);
-                    else if (navigate_page_to_href_) {
-                        // single page navigate to category suggestions if enabled
-                        // object should have a href where we want to go
+                    if (is_query()) {
                         if (ev.button || ev.metaKey || ev.ctrlKey) // not button 0 or cmd/ctrl click
                         return;
                         ev.preventDefault();
-                        navigate_page_to_href_(input_obj().page_url);
+                        submit_query_(input_obj().title);
+                        return;
                     }
+                    router_.navigate_.go_to_({
+                        new_url_: input_obj().page_url,
+                        is_replace_: false,
+                        event_: ev
+                    });
                 })), _el$);
             (0, $g9l4l$addEventListener)(_el$, "mouseleave", (0, $g9l4l$catchify)(()=>write_selected_index_(undefined)));
             (0, $g9l4l$addEventListener)(_el$, "mouseenter", (0, $g9l4l$catchify)(()=>write_selected_index_([
@@ -6541,6 +6878,7 @@ function $a817d06dc1c5911c$export$217899a935ef803b({ selected_index_: [read_sele
         }
     };
     // TODO: if selected item stops existing, remove it
+    // Is above actually not done???
     $a817d06dc1c5911c$var$actual_navigation_working_on_fake_data({
         ...rest_of_props,
         last_suggestion_index_: last_suggestion_index_,
@@ -6548,7 +6886,7 @@ function $a817d06dc1c5911c$export$217899a935ef803b({ selected_index_: [read_sele
         write_selected_fake_index_: write_selected_fake_index_
     });
 }
-function $a817d06dc1c5911c$var$actual_navigation_working_on_fake_data({ element_: element_ , search_field_value_: [get_search_field_value, set_search_field_value] , updating_blocked_: [read_updating_blocked, write_updating_blocked] , last_suggestion_index_: last_suggestion_index_ , read_selected_fake_index_: read_selected_fake_index_ , write_selected_fake_index_: write_selected_fake_index_ , set_override_on_enter_fn_: set_override_on_enter_fn_ , navigate_page_to_href_: navigate_page_to_href_ , url_transformer_: url_transformer_ , search_query_param_name_: search_query_param_name_  }) {
+function $a817d06dc1c5911c$var$actual_navigation_working_on_fake_data({ element_: element_ , search_field_value_: [get_search_field_value, set_search_field_value] , updating_blocked_: [read_updating_blocked, write_updating_blocked] , last_suggestion_index_: last_suggestion_index_ , read_selected_fake_index_: read_selected_fake_index_ , write_selected_fake_index_: write_selected_fake_index_ , set_override_on_enter_fn_: set_override_on_enter_fn_ , url_transformer_: url_transformer_ , search_query_param_name_: search_query_param_name_ , router_: router_  }) {
     let previous_value;
     (0, $g9l4l$createEffect)(()=>{
         const sfv = get_search_field_value();
@@ -6586,6 +6924,7 @@ function $a817d06dc1c5911c$var$actual_navigation_working_on_fake_data({ element_
                 set_search_field_value(title);
                 override_on_enter_for_this_entry((e)=>{
                     // Open search query in new tab on cmd+enter
+                    // If it's not cmd+enter, pressing enter will just submit the value that was put into the field while selecting with the arrow keys ;)
                     const url = new URL(location);
                     url_transformer_?.(url);
                     url.searchParams.set(search_query_param_name_, title);
@@ -6593,11 +6932,11 @@ function $a817d06dc1c5911c$var$actual_navigation_working_on_fake_data({ element_
                 });
             } else if (selected_entry?.type == "category") override_on_enter_for_this_entry((e)=>{
                 const { page_url: page_url  } = selected_entry;
-                if (!$a817d06dc1c5911c$var$open_link_on_cmd_pressed(e, page_url)) {
-                    // Above fn will return true if it opened a new tab, and we won't make these checks anymore
-                    if (navigate_page_to_href_) navigate_page_to_href_(page_url);
-                    else location.href = page_url;
-                }
+                if (!$a817d06dc1c5911c$var$open_link_on_cmd_pressed(e, page_url)) // Above fn will return true if it opened a new tab, and we won't make these checks anymore
+                router_.navigate_.go_to_({
+                    new_url_: page_url,
+                    is_replace_: false
+                });
                 return true;
             });
             else if (!selected_entry) {
@@ -6630,7 +6969,7 @@ function $a817d06dc1c5911c$var$open_link_on_cmd_pressed(e, href) {
 
 
 const $c7bc9269d29d4bdc$export$3cf9497e790da491 = "query";
-function $c7bc9269d29d4bdc$export$2f2b9559550c7bbc({ search_field_value_: search_field_value_ , search_query_: [get_search_query_] , search_page_url_param_name_: search_page_url_param_name_ , previous_searches_: unfiltered_previous_searches , previous_searches_text_: previous_searches_text_ , depict_api_: depict_api_ , tenant_: tenant_ , market_: market_ , input_field_: input_field_ , url_transformer_: url_transformer_ , currently_showing_suggestions_: currently_showing_suggestions_ , set_override_on_enter_fn_: set_override_on_enter_fn_ , selected_index_: selected_index_ , i18n_: i18n_ , include_category_suggestions_: include_category_suggestions_ , alternative_query_submitter_for_spas_: alternative_query_submitter_for_spas_ , after_submit_: after_submit_ , navigate_page_to_href_: navigate_page_to_href_ , on_submit_with_unchanged_value_: on_submit_with_unchanged_value_  }) {
+function $c7bc9269d29d4bdc$export$2f2b9559550c7bbc({ search_field_value_: search_field_value_ , search_query_: [get_search_query_] , search_page_url_param_name_: search_page_url_param_name_ , previous_searches_: unfiltered_previous_searches , previous_searches_text_: previous_searches_text_ , depict_api_: depict_api_ , tenant_: tenant_ , market_: market_ , input_field_: input_field_ , url_transformer_: url_transformer_ , currently_showing_suggestions_: currently_showing_suggestions_ , set_override_on_enter_fn_: set_override_on_enter_fn_ , selected_index_: selected_index_ , i18n_: i18n_ , include_category_suggestions_: include_category_suggestions_ , submit_query_: submit_query_ , router_: router_  }) {
     const [searching_for_value, set_searching_for_value] = (0, $g9l4l$createSignal)();
     const [read_search_field_value] = search_field_value_;
     const updating_blocked = (0, $g9l4l$createSignal)(false);
@@ -6673,7 +7012,7 @@ function $c7bc9269d29d4bdc$export$2f2b9559550c7bbc({ search_field_value_: search
         set_override_on_enter_fn_: set_override_on_enter_fn_,
         search_query_param_name_: search_page_url_param_name_,
         url_transformer_: url_transformer_,
-        navigate_page_to_href_: navigate_page_to_href_
+        router_: router_
     });
     return [
         (0, $g9l4l$createComponent)((0, $g9l4l$Show), {
@@ -6691,14 +7030,10 @@ function $c7bc9269d29d4bdc$export$2f2b9559550c7bbc({ search_field_value_: search
                     get previous_searches_ () {
                         return (0, $g9l4l$createMemo)(()=>filtered_previous_searches().slice(0, 5));
                     },
-                    search_field_value_: search_field_value_,
                     selected_index_: selected_index_,
                     currently_showing_suggestions_: currently_showing_suggestions_,
                     url_transformer_: url_transformer_,
-                    get_search_query_: get_search_query_,
-                    alternative_query_submitter_for_spas_: alternative_query_submitter_for_spas_,
-                    after_submit_: after_submit_,
-                    on_submit_with_unchanged_value_: on_submit_with_unchanged_value_
+                    submit_query_: submit_query_
                 });
             }
         }),
@@ -6716,18 +7051,14 @@ function $c7bc9269d29d4bdc$export$2f2b9559550c7bbc({ search_field_value_: search
             on_previous_searches_page_: show_previous_searches_component,
             i18n_: i18n_,
             url_transformer_: url_transformer_,
-            search_field_value_: search_field_value_,
             searching_for_value_: searching_for_value,
             search_page_url_param_name_: search_page_url_param_name_,
-            alternative_query_submitter_for_spas_: alternative_query_submitter_for_spas_,
             selected_index_: selected_index_,
             suggestion_memo_: read_suggestion_signal,
             currently_showing_suggestions_: currently_showing_suggestions_,
-            get_search_query_: get_search_query_,
             include_category_suggestions_: include_category_suggestions_,
-            after_submit_: after_submit_,
-            navigate_page_to_href_: navigate_page_to_href_,
-            on_submit_with_unchanged_value_: on_submit_with_unchanged_value_
+            router_: router_,
+            submit_query_: submit_query_
         })
     ];
 }
@@ -6813,7 +7144,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_: props_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_: props_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_: props_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_ , dont_sync_search_field_value_except_on_submit_: dont_sync_search_field_value_except_on_submit_ = false  }) {
+function $a9f6faeac82c322b$export$1c593cbd6f1e10bc({ search_field_value_: props_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_: props_submit_query , instant_results_options_: instant_results_options_ , register_closing_animation_: register_closing_animation_ , url_transformer_: url_transformer_ , closing_animation_: closing_animation_ , clear_filters_: clear_filters_ , i18n_: i18n_ , disable_scrolling_: disable_scrolling_ = true , enable_category_suggestions_: enable_category_suggestions_ , class_list_: class_list_ , bottom_distance_under_modal_: bottom_distance_under_modal_ , selected_text_range_: selected_text_range_ , dont_sync_search_field_value_except_on_submit_: dont_sync_search_field_value_except_on_submit_ = false , router_: router_  }) {
     let on_enter_in_search_field_function;
     // As per feedback from stronger we sometimes want a modal with the search field value disconnected from the one in the rest of the UI, see https://depictaiworkspace.slack.com/archives/C02J16R9XEH/p1679065878487709.
     // This is desired for when the modal is opened from a UI element that visually does not look connected with the search page or current query
@@ -6827,12 +7158,6 @@ function $a9f6faeac82c322b$export$1c593cbd6f1e10bc({ search_field_value_: props_
         propagate_search_field_value_back?.();
         return props_submit_query(...args);
     };
-    const after_submit_ = props_after_submit && ((...args)=>{
-        // This will be called by link_to_param_change when clicking on a suggestion
-        // the logic in link_to_param_change doesn't need to read the search field value before submitting, so we can just propagate the changes after submitting
-        propagate_search_field_value_back?.();
-        return props_after_submit(...args);
-    });
     const [input_field, set_input_field] = (0, $g9l4l$createSignal)();
     const [get_search_field_value_] = search_field_value_;
     const [elements_outside_scrollable, set_elements_outside_scrollable] = (0, $g9l4l$createSignal)();
@@ -6855,7 +7180,7 @@ function $a9f6faeac82c322b$export$1c593cbd6f1e10bc({ search_field_value_: props_
             (matches ? set_elements_outside_scrollable : set_elements_inside_scrollable)("");
             (matches ? set_elements_inside_scrollable : set_elements_outside_scrollable)((()=>{
                 const _el$ = $a9f6faeac82c322b$var$_tmpl$.cloneNode(true), _el$2 = _el$.firstChild;
-                _el$2.$$click = submit_query_;
+                (0, $g9l4l$addEventListener)(_el$2, "click", (0, $g9l4l$catchify)(()=>submit_query_()), true);
                 (0, $g9l4l$insert)(_el$2, (()=>{
                     const _c$ = (0, $g9l4l$memo)(()=>!!get_search_field_value_());
                     return ()=>_c$() ? i18n_.modal_view_all_results_()((()=>{
@@ -6929,13 +7254,11 @@ function $a9f6faeac82c322b$export$1c593cbd6f1e10bc({ search_field_value_: props_
                     selected_index_: selected_index,
                     currently_showing_suggestions_: currently_showing_suggestions_,
                     depict_api_: depict_api_,
-                    alternative_query_submitter_for_spas_: alternative_query_submitter_for_spas_,
                     url_transformer_: url_transformer_,
                     i18n_: i18n_,
                     include_category_suggestions_: enable_category_suggestions_ ?? true,
-                    after_submit_: after_submit_,
-                    navigate_page_to_href_: navigate_page_to_href_,
-                    on_submit_with_unchanged_value_: on_submit_with_unchanged_value_
+                    router_: router_,
+                    submit_query_: submit_query_
                 });
             }
         }), null);
@@ -7027,7 +7350,7 @@ function $a9f6faeac82c322b$var$close_modal_when_navigating_away(close_modal, sea
 
 
 const $71cf2f71a46bffea$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="category-suggestions"></div>`, 2), $71cf2f71a46bffea$var$_tmpl$2 = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="category-suggestion"></div>`, 2);
-function $71cf2f71a46bffea$export$c05a196222ba1302({ suggestions_: suggestions_ , children: children , selected_filters_: selected_filters_ , slider_arrow_button_: slider_arrow_button_  }) {
+function $71cf2f71a46bffea$export$c05a196222ba1302({ suggestions_: suggestions_ , children: children , slider_arrow_button_: slider_arrow_button_  }) {
     const category_suggestions_ = (0, $g9l4l$createMemo)(()=>suggestions_()?.suggestions.filter((s)=>s.type === "category"));
     return (0, $g9l4l$createComponent)((0, $g9l4l$Show), {
         get when () {
@@ -7058,7 +7381,7 @@ function $71cf2f71a46bffea$export$c05a196222ba1302({ suggestions_: suggestions_
                                 get each () {
                                     return category_suggestions_();
                                 },
-                                children: (suggestion, index)=>children(suggestion, index, selected_filters_)
+                                children: (suggestion, index)=>children(suggestion, index)
                             });
                         }
                     });
@@ -7283,7 +7606,6 @@ function $b76e8f62b1f313ef$export$a54ec244c8863715(opts) {
                 message_: "Category suggestions failed",
                 get children () {
                     return (0, $g9l4l$createComponent)((0, $71cf2f71a46bffea$export$c05a196222ba1302), {
-                        selected_filters_: selected_filters_,
                         suggestions_: suggestions,
                         slider_arrow_button_: slider_arrow_button_,
                         children: make_category_suggestion_card_
@@ -7432,6 +7754,8 @@ function $a79ffb1cbfbd2a09$export$828dcdd425fd3231(aligner) {
 }
 
 
+
+
 const $540e930c58500cbe$var$_tmpl$ = /*@__PURE__*/ (0, /*@__PURE__*/$g9l4l$template)(`<div class="depict plp search"></div>`, 2);
 /**
  * Type for the private properties that are shared between the different exported search SDK wrapper functions. SDK users are not allowed to change/access these, they're an internal implementation detail.
@@ -7444,36 +7768,18 @@ class $540e930c58500cbe$export$ac6237957a15b3f0 {
     #market_signal = (0, $g9l4l$createSignal)();
     #modal_open_signal = (0, $g9l4l$createSignal)(false);
     static #has_been_constructed = false;
-    constructor({ search_query_url_param_name: search_query_url_param_name = "search_query" , url_transformer: url_transformer , on_navigation: raw_on_navigation , enable_category_suggestions: enable_category_suggestions = true , disable_scrolling_during_modal: // Stuff needed for non-standard customer deployments that we shouldn't actually expose
+    #router = new (0, $cfa2761d36e5714c$export$7e1297a3a19f10d8)("hard_navigation");
+    constructor({ search_query_url_param_name: search_query_url_param_name = "query" , url_transformer: url_transformer , on_navigation: on_navigation , enable_category_suggestions: enable_category_suggestions = true , disable_scrolling_during_modal: // Stuff needed for non-standard customer deployments that we shouldn't actually expose
     disable_scrolling_during_modal = true , api: api , bottom_distance_under_modal_: bottom_distance_under_modal_ , render_instant_card: render_instant_card , ...props_on_class }){
         if ($540e930c58500cbe$export$ac6237957a15b3f0.#has_been_constructed) throw new Error("You can only have one instance of DepictSearch");
         Object.assign(this, props_on_class);
-        const on_navigation = raw_on_navigation && ((absolute_href)=>{
-            const u_o = new URL(absolute_href);
-            const relative_href = u_o.pathname + u_o.search + u_o.hash;
-            // make sure that we don't accidentally catchify if the SDK consumer has fucked up
-            try {
-                return raw_on_navigation(relative_href);
-            } catch (e) {
-                queueMicrotask(()=>{
-                    throw e;
-                });
-            }
-        });
-        const alternative_query_submitter_for_spas_ = on_navigation && ((search_param_name, new_search_query, url_transformer)=>{
-            const target_url = new URL(location.href);
-            url_transformer?.(target_url);
-            target_url.searchParams.set(search_param_name, new_search_query);
-            on_navigation(target_url.href);
-        });
+        const { current_sorting_: current_sorting_ , selected_filters_: selected_filters_  } = (0, $b4291f5d2e6b2fae$export$7bcff1eb3eca57d7)(this.#router);
         const [reset_history_state_, state_] = (0, $3075a4497054bec6$export$9862539c89138352)(()=>({
                 search_field_value: new URLSearchParams(location.search).get(search_query_url_param_name) ?? "",
-                search_sorting: undefined,
                 search_filters_open: false,
                 search_sorting_open: false,
                 search_expanded_filters: [],
-                // WARNING, it is insanely important, when creating the signals like this using make_resettable_history_state, that the two lines below are in *precisely that order*. The reason for that is that make_resettable_history_state will write the values of the signals in the order that they are written here when a "popstate" event occurs. If the filter cache is popped before the selected filters are the code in create_modified_filters() in FilterBody.tsx is going to re-calculate search_local_filter_cache without knowing the real value of search_selected_filters, and we'll end up with too few filters in search_local_filter_cache in some cases
-                search_selected_filters: [],
+                // Please make sure that the signal created by below line always updates AFTER selected_filters_ updates on a "popstate" event. If the filter cache is popped before the selected filters are the code in create_modified_filters() is going to re-calculate search_local_filter_cache without knowing the real value of search_selected_filters, and we'll end up with too few filters in search_local_filter_cache in some cases
                 search_local_filter_cache: [],
                 search_expanded_hierarchical_filters: [],
                 search_showing_recommendation_rows: (0, $aee0c68312d971f4$export$1c8c715550dc689d),
@@ -7489,24 +7795,27 @@ class $540e930c58500cbe$export$ac6237957a15b3f0 {
         const [, set_search_showing_recommendation_rows] = state_.search_showing_recommendation_rows;
         const after_submit_ = ()=>set_search_showing_recommendation_rows((0, $aee0c68312d971f4$export$1c8c715550dc689d)); // do this every time after we have submitted a new query - otherwise there might already be a saved number of rows in the state
         const on_submit_with_unchanged_value_ = ()=>this.modal_open = false;
-        const configured_submit_query_ = ()=>(0, $7f6ddd9a7e868c4d$export$e16630ecb9644a1c)({
+        const [get_search_field_value_, set_search_field_value_] = state_.search_field_value;
+        const configured_submit_query_ = (new_query)=>(0, $7f6ddd9a7e868c4d$export$e16630ecb9644a1c)({
                 on_submit_with_unchanged_value_: on_submit_with_unchanged_value_,
-                search_field_value_: state_.search_field_value,
+                set_search_field_value_: set_search_field_value_,
                 search_query_: search_query_signal_,
                 search_param_name_: search_query_url_param_name,
                 url_transformer_: url_transformer,
-                on_submit_: alternative_query_submitter_for_spas_,
-                after_submit_: after_submit_
+                after_submit_: after_submit_,
+                get_new_query: ()=>new_query || (0, $g9l4l$untrack)(get_search_field_value_),
+                router_: this.#router
             });
         const i18n_ = (0, $0466953901b38f18$export$f091cbac892643a4)(this.#locale_signal[0]);
         const clear_filters_on_next_submit_ = (0, $a0d89ff25220eb8d$export$e026af0c7b64ea5f)({
-            selected_filters_: state_.search_selected_filters,
+            selected_filters_: selected_filters_,
             search_query_: search_query_signal_,
-            current_sorting_: state_.search_sorting,
+            current_sorting_: current_sorting_,
             expanded_hierarchical_filters_: state_.search_expanded_hierarchical_filters,
             i18n_: i18n_,
             local_filter_cache_: state_.search_local_filter_cache
         });
+        if (on_navigation) this.#router.on_navigation_ = on_navigation;
         (0, $g9l4l$createComputed)(()=>{
             const [get_search_query_updating_blocked] = search_query_updating_blocked_;
             const [get_raw_search_query_signal] = raw_search_query_signal;
@@ -7517,7 +7826,7 @@ class $540e930c58500cbe$export$ac6237957a15b3f0 {
             search_query_url_param_name_: search_query_url_param_name,
             reset_history_state_: reset_history_state_,
             state_: state_,
-            on_navigation_: on_navigation,
+            router_: this.#router,
             url_transformer_: url_transformer,
             depict_api_: depict_api_,
             enable_category_suggestions_: enable_category_suggestions,
@@ -7525,16 +7834,17 @@ class $540e930c58500cbe$export$ac6237957a15b3f0 {
             configured_submit_query_: configured_submit_query_,
             search_query_signal_: search_query_signal_,
             i18n_: i18n_,
-            search_query_updating_blocked_: search_query_updating_blocked_
+            search_query_updating_blocked_: search_query_updating_blocked_,
+            current_sorting_: current_sorting_,
+            selected_filters_: selected_filters_
         });
         (0, $2864fd26f57ff474$export$5162a71f252e6122)();
         (0, $g9l4l$catchify)(async ()=>{
-            const owner = (0, $g9l4l$getOwner)(); // we might have an owner, if so, pass it on
+            const owner = (0, $g9l4l$getOwner)() || (0, $g9l4l$createRoot)(()=>(0, $g9l4l$getOwner)()); // we might have an owner, if so, pass it on. Otherwise, create one so solid doesn't print warnings to the console
             const { open_modal_: open_modal_ , close_modal_: close_modal_  } = await (0, $3786428a06ed81c4$export$79b1565500412d9b)((...args)=>{
                 (0, $g9l4l$onCleanup)(()=>this.modal_open = false);
                 return (0, $a9f6faeac82c322b$export$1c593cbd6f1e10bc)(...args);
             }, {
-                after_submit_: after_submit_,
                 search_field_value_: state_.search_field_value,
                 search_query_: search_query_signal_,
                 search_page_url_param_name_: search_query_url_param_name,
@@ -7544,15 +7854,13 @@ class $540e930c58500cbe$export$ac6237957a15b3f0 {
                 clear_filters_: clear_filters_on_next_submit_,
                 market_: this.#market_signal[0],
                 submit_query_: configured_submit_query_,
-                alternative_query_submitter_for_spas_: alternative_query_submitter_for_spas_,
                 url_transformer_: url_transformer,
-                navigate_page_to_href_: on_navigation,
-                on_submit_with_unchanged_value_: on_submit_with_unchanged_value_,
+                router_: this.#router,
                 instant_results_options_: {
                     min_products_to_fetch_: $540e930c58500cbe$var$min_products_to_fetch_,
                     render_instant_card_: render_instant_card,
                     render_instant_card_placeholder_: (0, $aaacfac0064e97d9$export$ee1733d9a8495996),
-                    has_sort_or_filters_: (0, $g9l4l$createMemo)(()=>!!(Object.keys(state_.search_selected_filters[0]())?.length || state_.search_sorting[0]()))
+                    has_sort_or_filters_: (0, $g9l4l$createMemo)(()=>!!(Object.keys(selected_filters_[0]())?.length || current_sorting_[0]()))
                 },
                 i18n_: i18n_,
                 enable_category_suggestions_: enable_category_suggestions,
@@ -7561,7 +7869,7 @@ class $540e930c58500cbe$export$ac6237957a15b3f0 {
             });
             // This will add some default behaviour to open_modal_ if no style_props_ are supplied
             // The default behaviour is to align the modal with the input field if possible
-            const computation = ()=>{
+            const modal_opening_effect = ()=>{
                 const open_signal_value = this.modal_open;
                 const signal_value_is_options = Array.isArray(open_signal_value);
                 // Close modal if signal is false
@@ -7615,11 +7923,17 @@ class $540e930c58500cbe$export$ac6237957a15b3f0 {
                     style_props_: style_props_
                 });
             };
-            if (owner != null) (0, $g9l4l$runWithOwner)(owner, ()=>(0, $g9l4l$createComputed)(computation));
-            else (0, $g9l4l$createComputed)(computation);
+            (0, $g9l4l$runWithOwner)(owner, ()=>(0, $g9l4l$createEffect)(modal_opening_effect));
         })();
         $540e930c58500cbe$export$ac6237957a15b3f0.#has_been_constructed = true;
     }
+    get on_navigation() {
+        // The only non-reactive public property on the class (I don't see it making sense to have it reactive)
+        return this.#router.on_navigation_;
+    }
+    set on_navigation(new_function) {
+        this.#router.on_navigation_ = new_function;
+    }
     get localization() {
         // allow reactive access
         return this.#locale_signal[0]();
@@ -7702,18 +8016,18 @@ function $540e930c58500cbe$export$f2dc7e4e4aa11abb({ depict_search: depict_searc
                     });
                 });
             },
-            current_sorting_: state_.search_sorting,
+            current_sorting_: shared_properties.current_sorting_,
             search_filters_open_: state_.search_filters_open,
             search_sorting_open_: state_.search_sorting_open,
             expanded_filters_: state_.search_expanded_filters,
             make_category_suggestion_card_: shared_properties.enable_category_suggestions_ ? (category_suggestion_)=>{
                 return (0, $7a7079d66c12b788$export$d757d54550ebfb3d)({
                     category_suggestion_: category_suggestion_,
-                    on_navigation_: shared_properties.on_navigation_
+                    router_: shared_properties.router_
                 });
             } : false,
             expanded_hierarchical_filters_: state_.search_expanded_hierarchical_filters,
-            selected_filters_: state_.search_selected_filters,
+            selected_filters_: shared_properties.selected_filters_,
             showing_recommendation_rows_: state_.search_showing_recommendation_rows,
             scroll_restoration_data_: state_.search_scroll_restoration_data,
             include_input_field_: include_input_field,
@@ -7896,7 +8210,6 @@ function $a3e81b85527bc866$export$d0596b5cae35ad4(open_search) {
 
 
 
-
 function $36316d7b4c897a03$export$689e204eadb33baf(pr) {
     let old_url;
     let disconnect_link_observer;
@@ -8031,7 +8344,8 @@ class $ba6c9609228edf6b$export$3ccaa27d81dd8556 extends EventTarget {
     }, "failed to open page");
     #empty_page_bugfix() {
         // Called when a "page" is "opened" using PageReplacer
-        const on_popstate = ()=>{
+        const on_maybe_popstate = (what_happened)=>{
+            if (what_happened !== "popstate") return;
             const cleaned_current_url = $ba6c9609228edf6b$var$clean_url(location.href);
             if (!$ba6c9609228edf6b$export$3ccaa27d81dd8556.#visited_urls.has(cleaned_current_url)) {
                 /*
@@ -8059,8 +8373,8 @@ class $ba6c9609228edf6b$export$3ccaa27d81dd8556 extends EventTarget {
                 this.#unload(); // Call unload to "kill" the solid-js stuff quicker so that it stops updating - the user is expecting the next thing that happens to be a navigation to the actual page the URL says they're on.
             }
         };
-        (0, $g9l4l$instant_exec_on_popstate_before_ipns_update).add(on_popstate);
-        this.#revert_fns.push(()=>(0, $g9l4l$instant_exec_on_popstate_before_ipns_update).delete(on_popstate)); // Don't run the bugfixer if there isn't a PageReplacer page open since I assume the bug only happens when going back from a PageReplace'd page
+        (0, $g9l4l$instant_exec_on_suspect_history_change).add(on_maybe_popstate);
+        this.#revert_fns.push(()=>(0, $g9l4l$instant_exec_on_suspect_history_change).delete(on_maybe_popstate)); // Don't run the bugfixer if there isn't a PageReplacer page open since I assume the bug only happens when going back from a PageReplace'd page
     }
     /**
    * Stops listening to URL changes and closes the page (if it is currently open)
@@ -8092,4 +8406,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, $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};
+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, $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};