@getlupa/client 1.24.2 → 1.25.0

package/dist/lupaSearch.mjs

@@ -18855,17 +18855,27 @@ const getPageCount = (total, limit) => {
 const isObject$1 = (value) => {
   return value !== null && typeof value === "object" && !Array.isArray(value);
 };
-const parseParam = (key, params) => {
-  const value = params.get(key);
+const decodeParam = (value) => {
   if (!value) {
     return void 0;
   }
+  try {
+    if (!/%[0-9A-Fa-f]{2}/.test(value)) {
+      return value;
+    }
+  } catch (e2) {
+    return value;
+  }
   try {
     return decodeURIComponent(value);
   } catch (e2) {
-    return void 0;
+    return value;
   }
 };
+const parseParam = (key, params) => {
+  const value = params.get(key);
+  return decodeParam(value != null ? value : void 0);
+};
 const parseRegularKeys = (regularKeys, searchParams, getQueryParamName) => {
   const params = /* @__PURE__ */ Object.create({});
   const keys = reverseKeyValue({
@@ -18883,7 +18893,7 @@ const parseRegularKeys = (regularKeys, searchParams, getQueryParamName) => {
 const parseFacetKey = (key, searchParams) => {
   var _a25, _b25, _c, _d;
   if (key.startsWith(FACET_PARAMS_TYPE.TERMS)) {
-    return (_b25 = (_a25 = searchParams.getAll(key)) == null ? void 0 : _a25.map((v) => decodeURIComponent(v))) != null ? _b25 : [];
+    return (_b25 = (_a25 = searchParams.getAll(key)) == null ? void 0 : _a25.map((v) => decodeParam(v))) != null ? _b25 : [];
   }
   if (key.startsWith(FACET_PARAMS_TYPE.RANGE) || key.startsWith(FACET_PARAMS_TYPE.PARTIAL_RANGE)) {
     const range2 = searchParams.get(key);
@@ -18899,7 +18909,7 @@ const parseFacetKey = (key, searchParams) => {
   if (key.startsWith(FACET_PARAMS_TYPE.HIERARCHY)) {
     return {
       level: 0,
-      terms: (_d = (_c = searchParams.getAll(key)) == null ? void 0 : _c.map((v) => decodeURIComponent(v))) != null ? _d : []
+      terms: (_d = (_c = searchParams.getAll(key)) == null ? void 0 : _c.map((v) => decodeParam(v))) != null ? _d : []
     };
   }
   return [];
@@ -18926,15 +18936,15 @@ const parseParams = (getQueryParamName, searchParams) => {
   }, parseRegularKeys(regularKeys, searchParams, getQueryParamName)), parseFacetKeys(facetKeys, searchParams));
   return r;
 };
-const appendParam = (url, { name, value }, encode2 = true) => {
+const appendParam = (url, { name, value }) => {
   if (Array.isArray(value)) {
     appendArrayParams(url, { name, value });
   } else {
-    appendSingleParam(url, { name, value }, encode2);
+    appendSingleParam(url, { name, value });
   }
 };
-const appendSingleParam = (url, param, encode2 = true) => {
-  const valueToAppend = encode2 ? encodeParam(param.value) : param.value;
+const appendSingleParam = (url, param) => {
+  const valueToAppend = param.value;
   if (url.searchParams.has(param.name)) {
     url.searchParams.set(param.name, valueToAppend);
   } else {
@@ -18943,7 +18953,7 @@ const appendSingleParam = (url, param, encode2 = true) => {
 };
 const appendArrayParams = (url, param) => {
   url.searchParams.delete(param.name);
-  param.value.forEach((v) => url.searchParams.append(param.name, encodeParam(v)));
+  param.value.forEach((v) => url.searchParams.append(param.name, v));
 };
 const getRemovableParams = (url, getQueryParamName, paramsToRemove) => {
   if (paramsToRemove === "all") {
@@ -19303,13 +19313,12 @@ const useParamsStore = /* @__PURE__ */ defineStore("params", () => {
   const getPageUrlWithNewParams = ({
     params: newParams,
     paramsToRemove,
-    encode: encode2 = true,
     searchResultsLink: searchResultsLink2
   }) => {
     const url = getPageUrl(searchResultsLink2);
     paramsToRemove = getRemovableParams(url, optionsStore.getQueryParamName, paramsToRemove);
     removeParams(url, paramsToRemove);
-    newParams.forEach((p2) => appendParam(url, p2, encode2));
+    newParams.forEach((p2) => appendParam(url, p2));
     return url.search;
   };
   const removeParameters = ({
@@ -19391,7 +19400,7 @@ const useParamsStore = /* @__PURE__ */ defineStore("params", () => {
       const routing = (_b25 = optionsStore.boxRoutingBehavior) != null ? _b25 : "direct-link";
       redirectToResultsPage(
         searchResultsLink.value,
-        encodeParam(searchText),
+        searchText,
         optionsStore.getQueryParamName,
         facet,
         routing
@@ -19401,7 +19410,6 @@ const useParamsStore = /* @__PURE__ */ defineStore("params", () => {
   const appendParams = ({
     params: newParams,
     paramsToRemove,
-    encode: encode2 = true,
     save = true,
     searchResultsLink: searchResultsLink2
   }) => {
@@ -19411,7 +19419,7 @@ const useParamsStore = /* @__PURE__ */ defineStore("params", () => {
     const url = getPageUrl(searchResultsLink2);
     paramsToRemove = getRemovableParams(url, optionsStore.getQueryParamName, paramsToRemove);
     removeParams(url, paramsToRemove);
-    newParams.forEach((p2) => appendParam(url, p2, encode2));
+    newParams.forEach((p2) => appendParam(url, p2));
     navigate(url);
     if (!save) {
       return;
@@ -19708,7 +19716,7 @@ const getApiUrl = (environment, customBaseUrl) => {
   }
   return Env[environment] || Env["production"];
 };
-const _sfc_main$1G = /* @__PURE__ */ defineComponent({
+const _sfc_main$1K = /* @__PURE__ */ defineComponent({
   __name: "VoiceSearchProgressCircle",
   props: {
     isRecording: { type: Boolean },
@@ -19921,15 +19929,15 @@ function useVoiceRecorder(options) {
     closeSocket
   };
 }
-const _hoisted_1$1o = {
+const _hoisted_1$1q = {
   key: 0,
   class: "lupa-dialog-overlay"
 };
-const _hoisted_2$Z = { class: "lupa-dialog-content" };
+const _hoisted_2$_ = { class: "lupa-dialog-content" };
 const _hoisted_3$G = { class: "lupa-listening-text" };
 const _hoisted_4$v = { class: "lupa-mic-button-wrapper" };
 const _hoisted_5$l = ["aria-label"];
-const _sfc_main$1F = /* @__PURE__ */ defineComponent({
+const _sfc_main$1J = /* @__PURE__ */ defineComponent({
   __name: "VoiceSearchDialog",
   props: {
     isOpen: { type: Boolean },
@@ -20034,12 +20042,12 @@ const _sfc_main$1F = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       var _a25, _b25;
       return openBlock(), createElementBlock("div", null, [
-        props.isOpen ? (openBlock(), createElementBlock("div", _hoisted_1$1o, [
+        props.isOpen ? (openBlock(), createElementBlock("div", _hoisted_1$1q, [
           createBaseVNode("button", {
             class: "lupa-dialog-box-close-button",
             onClick: _cache[0] || (_cache[0] = () => emit2("close"))
           }),
-          createBaseVNode("div", _hoisted_2$Z, [
+          createBaseVNode("div", _hoisted_2$_, [
             createBaseVNode("p", _hoisted_3$G, toDisplayString(description.value), 1),
             createBaseVNode("div", _hoisted_4$v, [
               createBaseVNode("button", {
@@ -20048,7 +20056,7 @@ const _sfc_main$1F = /* @__PURE__ */ defineComponent({
                 "aria-controls": "voice-search-microphone",
                 "aria-label": ((_b25 = (_a25 = labels.value) == null ? void 0 : _a25.aria) == null ? void 0 : _b25.microphone) || "Toggle microphone"
               }, null, 10, _hoisted_5$l),
-              createVNode(_sfc_main$1G, {
+              createVNode(_sfc_main$1K, {
                 ref_key: "voiceSearchProgressBar",
                 ref: voiceSearchProgressBar,
                 class: "lupa-progress-circle",
@@ -20063,8 +20071,8 @@ const _sfc_main$1F = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$1n = { id: "lupa-search-box-input-container" };
-const _hoisted_2$Y = { id: "lupa-search-box-input" };
+const _hoisted_1$1p = { id: "lupa-search-box-input-container" };
+const _hoisted_2$Z = { id: "lupa-search-box-input" };
 const _hoisted_3$F = ["value"];
 const _hoisted_4$u = ["aria-label", "placeholder"];
 const _hoisted_5$k = {
@@ -20073,7 +20081,7 @@ const _hoisted_5$k = {
 };
 const _hoisted_6$7 = { key: 2 };
 const _hoisted_7$5 = ["aria-label"];
-const _sfc_main$1E = /* @__PURE__ */ defineComponent({
+const _sfc_main$1I = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxInput",
   props: {
     options: {},
@@ -20209,7 +20217,7 @@ const _sfc_main$1E = /* @__PURE__ */ defineComponent({
     };
     __expose({ focus });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$1n, [
+      return openBlock(), createElementBlock("div", _hoisted_1$1p, [
         _ctx.options.showClearButton && !isClearButtonAtEndOfInput.value ? (openBlock(), createElementBlock("div", {
           key: 0,
           class: normalizeClass(["lupa-input-clear", [
@@ -20218,7 +20226,7 @@ const _sfc_main$1E = /* @__PURE__ */ defineComponent({
           ]]),
           onClick: clear
         }, null, 2)) : createCommentVNode("", true),
-        createBaseVNode("div", _hoisted_2$Y, [
+        createBaseVNode("div", _hoisted_2$Z, [
           createBaseVNode("input", {
             class: "lupa-hint",
             "aria-hidden": "true",
@@ -20272,7 +20280,7 @@ const _sfc_main$1E = /* @__PURE__ */ defineComponent({
             "aria-label": voiceSearchAriaLabel.value
           }, null, 8, _hoisted_7$5)
         ])) : createCommentVNode("", true),
-        isVoiceSearchEnabled.value ? (openBlock(), createBlock(_sfc_main$1F, {
+        isVoiceSearchEnabled.value ? (openBlock(), createBlock(_sfc_main$1J, {
           key: 3,
           ref_key: "voiceDialogOverlay",
           ref: voiceDialogOverlay,
@@ -20286,7 +20294,7 @@ const _sfc_main$1E = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$1D = /* @__PURE__ */ defineComponent({
+const _sfc_main$1H = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxMoreResults",
   props: {
     labels: {},
@@ -20324,9 +20332,9 @@ const _sfc_main$1D = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$1m = { class: "lupa-search-box-history-item" };
-const _hoisted_2$X = { class: "lupa-search-box-history-item-content" };
-const _sfc_main$1C = /* @__PURE__ */ defineComponent({
+const _hoisted_1$1o = { class: "lupa-search-box-history-item" };
+const _hoisted_2$Y = { class: "lupa-search-box-history-item-content" };
+const _sfc_main$1G = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxHistoryItem",
   props: {
     item: {},
@@ -20343,8 +20351,8 @@ const _sfc_main$1C = /* @__PURE__ */ defineComponent({
       emit2("click", { query: props.item });
     };
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$1m, [
-        createBaseVNode("div", _hoisted_2$X, [
+      return openBlock(), createElementBlock("div", _hoisted_1$1o, [
+        createBaseVNode("div", _hoisted_2$Y, [
           createBaseVNode("div", {
             class: normalizeClass(["lupa-search-box-history-item-text", { "lupa-search-box-history-item-highlighted": _ctx.highlighted }]),
             onClick: click2
@@ -20358,11 +20366,11 @@ const _sfc_main$1C = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$1l = {
+const _hoisted_1$1n = {
   key: 0,
   class: "lupa-search-box-history-panel"
 };
-const _sfc_main$1B = /* @__PURE__ */ defineComponent({
+const _sfc_main$1F = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxHistoryPanel",
   props: {
     options: {}
@@ -20413,9 +20421,9 @@ const _sfc_main$1B = /* @__PURE__ */ defineComponent({
       }
     };
     return (_ctx, _cache) => {
-      return hasHistory.value ? (openBlock(), createElementBlock("div", _hoisted_1$1l, [
+      return hasHistory.value ? (openBlock(), createElementBlock("div", _hoisted_1$1n, [
         (openBlock(true), createElementBlock(Fragment, null, renderList(limitedHistory.value, (item, index) => {
-          return openBlock(), createBlock(_sfc_main$1C, {
+          return openBlock(), createBlock(_sfc_main$1G, {
             key: item,
             item,
             highlighted: index === highlightIndex.value,
@@ -20431,12 +20439,12 @@ const _sfc_main$1B = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$1k = ["innerHTML"];
-const _hoisted_2$W = {
+const _hoisted_1$1m = ["innerHTML"];
+const _hoisted_2$X = {
   key: 1,
   class: "lupa-search-box-no-results"
 };
-const _sfc_main$1A = /* @__PURE__ */ defineComponent({
+const _sfc_main$1E = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxNoResults",
   props: {
     options: {}
@@ -20455,7 +20463,7 @@ const _sfc_main$1A = /* @__PURE__ */ defineComponent({
         key: 0,
         class: "lupa-search-box-no-results",
         innerHTML: customHtml.value
-      }, null, 8, _hoisted_1$1k)) : (openBlock(), createElementBlock("p", _hoisted_2$W, toDisplayString((_a25 = labels.value) == null ? void 0 : _a25.noResults), 1));
+      }, null, 8, _hoisted_1$1m)) : (openBlock(), createElementBlock("p", _hoisted_2$X, toDisplayString((_a25 = labels.value) == null ? void 0 : _a25.noResults), 1));
     };
   }
 });
@@ -20487,8 +20495,8 @@ const generateGridTemplate = (elements) => {
   }
   return gridTemplate.join(" ");
 };
-const _hoisted_1$1j = ["innerHTML"];
-const _hoisted_2$V = {
+const _hoisted_1$1l = ["innerHTML"];
+const _hoisted_2$W = {
   key: 1,
   "data-cy": "lupa-suggestion-value",
   class: "lupa-suggestion-value"
@@ -20506,7 +20514,7 @@ const _hoisted_5$j = {
   class: "lupa-suggestion-facet-value",
   "data-cy": "lupa-suggestion-facet-value"
 };
-const _sfc_main$1z = /* @__PURE__ */ defineComponent({
+const _sfc_main$1D = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxSuggestion",
   props: {
     suggestion: {},
@@ -20543,7 +20551,7 @@ const _sfc_main$1z = /* @__PURE__ */ defineComponent({
           class: "lupa-suggestion-value",
           "data-cy": "lupa-suggestion-value",
           innerHTML: _ctx.suggestion.displayHighlight
-        }, null, 8, _hoisted_1$1j)) : (openBlock(), createElementBlock("div", _hoisted_2$V, toDisplayString(_ctx.suggestion.display), 1)),
+        }, null, 8, _hoisted_1$1l)) : (openBlock(), createElementBlock("div", _hoisted_2$W, toDisplayString(_ctx.suggestion.display), 1)),
         _ctx.suggestion.facet ? (openBlock(), createElementBlock("div", _hoisted_3$E, [
           createBaseVNode("span", _hoisted_4$t, toDisplayString(facetLabel.value), 1),
           createBaseVNode("span", _hoisted_5$j, toDisplayString(_ctx.suggestion.facet.title), 1)
@@ -20552,11 +20560,11 @@ const _sfc_main$1z = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$1i = {
+const _hoisted_1$1k = {
   id: "lupa-search-box-suggestions",
   "data-cy": "lupa-search-box-suggestions"
 };
-const _sfc_main$1y = /* @__PURE__ */ defineComponent({
+const _sfc_main$1C = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxSuggestions",
   props: {
     items: {},
@@ -20623,9 +20631,9 @@ const _sfc_main$1y = /* @__PURE__ */ defineComponent({
       });
     });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$1i, [
+      return openBlock(), createElementBlock("div", _hoisted_1$1k, [
         (openBlock(true), createElementBlock(Fragment, null, renderList(items.value, (item, index) => {
-          return openBlock(), createBlock(_sfc_main$1z, {
+          return openBlock(), createBlock(_sfc_main$1D, {
             key: getSuggestionKey(item),
             class: normalizeClass([
               "lupa-suggestion",
@@ -20657,7 +20665,7 @@ const debounce = (func, timeout) => {
     }, timeout);
   };
 };
-const _sfc_main$1x = /* @__PURE__ */ defineComponent({
+const _sfc_main$1B = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxSuggestionsWrapper",
   props: {
     panel: {},
@@ -20700,7 +20708,7 @@ const _sfc_main$1x = /* @__PURE__ */ defineComponent({
     const getSuggestionsDebounced = debounce(getSuggestions, props.debounce);
     watch(() => props.panel.limit, getSuggestionsDebounced);
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(_sfc_main$1y, {
+      return openBlock(), createBlock(_sfc_main$1C, {
         items: searchResult.value,
         highlight: _ctx.panel.highlight,
         queryKey: _ctx.panel.queryKey,
@@ -29900,11 +29908,14 @@ const getDynamicAttributes = (dynamicAttributes = [], document2 = {}) => {
   }
   return parsedAttributes;
 };
-const getFieldValue = (doc2, field = "") => {
+const getFieldValue = (doc2, field = "", matchLiteral) => {
   var _a25;
   if (typeof field === "number") {
     return +field;
   }
+  if (matchLiteral) {
+    return field;
+  }
   const value = (_a25 = field == null ? void 0 : field.split(".")) == null ? void 0 : _a25.reduce((obj, key) => obj ? obj[key] : void 0, doc2);
   if (+value) {
     return +value;
@@ -29928,32 +29939,32 @@ const processDisplayCondition = (displayCondition, doc2 = {}) => {
     case "equals": {
       if (fields.length < 2) return false;
       const [field1, field2] = fields;
-      return getFieldValue(doc2, field1) === getFieldValue(doc2, field2);
+      return getFieldValue(doc2, field1) === getFieldValue(doc2, field2, displayCondition.matchLiteral);
     }
     case "notEquals": {
       if (fields.length < 2) return false;
       const [field1, field2] = fields;
-      return getFieldValue(doc2, field1) !== getFieldValue(doc2, field2);
+      return getFieldValue(doc2, field1) !== getFieldValue(doc2, field2, displayCondition.matchLiteral);
     }
     case "greaterThan": {
       if (fields.length < 2) return false;
       const [field1, field2] = fields;
-      return getFieldValue(doc2, field1) > getFieldValue(doc2, field2);
+      return getFieldValue(doc2, field1) > getFieldValue(doc2, field2, displayCondition.matchLiteral);
     }
     case "lessThan": {
       if (fields.length < 2) return false;
       const [field1, field2] = fields;
-      return getFieldValue(doc2, field1) < getFieldValue(doc2, field2);
+      return getFieldValue(doc2, field1) < getFieldValue(doc2, field2, displayCondition.matchLiteral);
     }
     case "greaterThanOrEquals": {
       if (fields.length < 2) return false;
       const [field1, field2] = fields;
-      return getFieldValue(doc2, field1) >= getFieldValue(doc2, field2);
+      return getFieldValue(doc2, field1) >= getFieldValue(doc2, field2, displayCondition.matchLiteral);
     }
     case "lessThanOrEquals": {
       if (fields.length < 2) return false;
       const [field1, field2] = fields;
-      return getFieldValue(doc2, field1) <= getFieldValue(doc2, field2);
+      return getFieldValue(doc2, field1) <= getFieldValue(doc2, field2, displayCondition.matchLiteral);
     }
     default:
       return false;
@@ -29982,9 +29993,9 @@ const replaceImageWithPlaceholder = (e2, placeholder) => {
     targetImage.src = placeholder;
   }
 };
-const _hoisted_1$1h = ["src"];
-const _hoisted_2$U = ["src"];
-const _sfc_main$1w = /* @__PURE__ */ defineComponent({
+const _hoisted_1$1j = ["src"];
+const _hoisted_2$V = ["src"];
+const _sfc_main$1A = /* @__PURE__ */ defineComponent({
   __name: "ProductImage",
   props: {
     item: {},
@@ -30126,7 +30137,7 @@ const _sfc_main$1w = /* @__PURE__ */ defineComponent({
             }, { alt: imageAlt.value ? imageAlt.value : void 0 }, {
               onError: replaceWithPlaceholder,
               key: finalUrl.value
-            }), null, 16, _hoisted_1$1h))
+            }), null, 16, _hoisted_1$1j))
           ]),
           _: 1
         })) : (openBlock(), createElementBlock("img", mergeProps({
@@ -30134,12 +30145,12 @@ const _sfc_main$1w = /* @__PURE__ */ defineComponent({
           class: ["lupa-images-main-image", { [_ctx.imageClass]: true }],
           style: styleOverride.value,
           src: finalMainImageUrl.value
-        }, { alt: imageAlt.value ? imageAlt.value : void 0 }, { onError: replaceWithPlaceholder }), null, 16, _hoisted_2$U))
+        }, { alt: imageAlt.value ? imageAlt.value : void 0 }, { onError: replaceWithPlaceholder }), null, 16, _hoisted_2$V))
       ], 38);
     };
   }
 });
-const _sfc_main$1v = /* @__PURE__ */ defineComponent({
+const _sfc_main$1z = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductImage",
   props: {
     item: {},
@@ -30147,7 +30158,7 @@ const _sfc_main$1v = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(_sfc_main$1w, {
+      return openBlock(), createBlock(_sfc_main$1A, {
         item: _ctx.item,
         options: _ctx.options,
         "wrapper-class": "lupa-search-box-image-wrapper",
@@ -30156,12 +30167,12 @@ const _sfc_main$1v = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$1g = ["innerHTML"];
-const _hoisted_2$T = {
+const _hoisted_1$1i = ["innerHTML"];
+const _hoisted_2$U = {
   key: 1,
   class: "lupa-search-box-product-title"
 };
-const _sfc_main$1u = /* @__PURE__ */ defineComponent({
+const _sfc_main$1y = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductTitle",
   props: {
     item: {},
@@ -30184,18 +30195,18 @@ const _sfc_main$1u = /* @__PURE__ */ defineComponent({
         key: 0,
         class: "lupa-search-box-product-title",
         innerHTML: sanitizedTitle.value
-      }, null, 8, _hoisted_1$1g)) : (openBlock(), createElementBlock("div", _hoisted_2$T, [
+      }, null, 8, _hoisted_1$1i)) : (openBlock(), createElementBlock("div", _hoisted_2$U, [
         createBaseVNode("strong", null, toDisplayString(title.value), 1)
       ]));
     };
   }
 });
-const _hoisted_1$1f = ["innerHTML"];
-const _hoisted_2$S = {
+const _hoisted_1$1h = ["innerHTML"];
+const _hoisted_2$T = {
   key: 1,
   class: "lupa-search-box-product-description"
 };
-const _sfc_main$1t = /* @__PURE__ */ defineComponent({
+const _sfc_main$1x = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductDescription",
   props: {
     item: {},
@@ -30218,12 +30229,12 @@ const _sfc_main$1t = /* @__PURE__ */ defineComponent({
         key: 0,
         class: "lupa-search-box-product-description",
         innerHTML: sanitizedDescription.value
-      }, null, 8, _hoisted_1$1f)) : (openBlock(), createElementBlock("div", _hoisted_2$S, toDisplayString(description.value), 1));
+      }, null, 8, _hoisted_1$1h)) : (openBlock(), createElementBlock("div", _hoisted_2$T, toDisplayString(description.value), 1));
     };
   }
 });
-const _hoisted_1$1e = { class: "lupa-search-box-product-price" };
-const _sfc_main$1s = /* @__PURE__ */ defineComponent({
+const _hoisted_1$1g = { class: "lupa-search-box-product-price" };
+const _sfc_main$1w = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductPrice",
   props: {
     item: {},
@@ -30245,13 +30256,13 @@ const _sfc_main$1s = /* @__PURE__ */ defineComponent({
       );
     });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$1e, [
+      return openBlock(), createElementBlock("div", _hoisted_1$1g, [
         createBaseVNode("strong", null, toDisplayString(price.value), 1)
       ]);
     };
   }
 });
-const _sfc_main$1r = /* @__PURE__ */ defineComponent({
+const _sfc_main$1v = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductRegularPrice",
   props: {
     item: {},
@@ -30282,12 +30293,12 @@ const _sfc_main$1r = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$1d = ["innerHTML"];
-const _hoisted_2$R = { key: 0 };
+const _hoisted_1$1f = ["innerHTML"];
+const _hoisted_2$S = { key: 0 };
 const _hoisted_3$D = { key: 1 };
 const _hoisted_4$s = { class: "lupa-search-box-custom-label" };
 const _hoisted_5$i = { class: "lupa-search-box-custom-text" };
-const _sfc_main$1q = /* @__PURE__ */ defineComponent({
+const _sfc_main$1u = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductCustom",
   props: {
     item: {},
@@ -30313,11 +30324,11 @@ const _sfc_main$1q = /* @__PURE__ */ defineComponent({
         key: 0,
         class: [className.value, "lupa-search-box-product-custom"],
         innerHTML: text.value
-      }, toHandlers(_ctx.options.action ? { click: handleClick } : {})), null, 16, _hoisted_1$1d)) : (openBlock(), createElementBlock("div", mergeProps({
+      }, toHandlers(_ctx.options.action ? { click: handleClick } : {})), null, 16, _hoisted_1$1f)) : (openBlock(), createElementBlock("div", mergeProps({
         key: 1,
         class: [className.value, "lupa-search-box-product-custom"]
       }, toHandlers(_ctx.options.action ? { click: handleClick } : {})), [
-        !label.value ? (openBlock(), createElementBlock("div", _hoisted_2$R, toDisplayString(text.value), 1)) : (openBlock(), createElementBlock("div", _hoisted_3$D, [
+        !label.value ? (openBlock(), createElementBlock("div", _hoisted_2$S, toDisplayString(text.value), 1)) : (openBlock(), createElementBlock("div", _hoisted_3$D, [
           createBaseVNode("div", _hoisted_4$s, toDisplayString(label.value), 1),
           createBaseVNode("div", _hoisted_5$i, toDisplayString(text.value), 1)
         ]))
@@ -30325,8 +30336,8 @@ const _sfc_main$1q = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$1c = ["innerHTML"];
-const _sfc_main$1p = /* @__PURE__ */ defineComponent({
+const _hoisted_1$1e = ["innerHTML"];
+const _sfc_main$1t = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductCustomHtml",
   props: {
     item: {},
@@ -30351,7 +30362,7 @@ const _sfc_main$1p = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock("div", mergeProps({
         class: className.value,
         innerHTML: text.value
-      }, toHandlers(_ctx.options.action ? { click: handleClick } : {})), null, 16, _hoisted_1$1c);
+      }, toHandlers(_ctx.options.action ? { click: handleClick } : {})), null, 16, _hoisted_1$1e);
     };
   }
 });
@@ -30690,6 +30701,7 @@ const useSearchResultStore = /* @__PURE__ */ defineStore("searchResult", () => {
     relatedQueriesApiEnabled,
     lastResultsSource,
     relatedQueryFacetKeys,
+    loadingRelatedQueries,
     setSidebarState,
     queryFacet,
     setLastRequestId,
@@ -30706,12 +30718,12 @@ const useSearchResultStore = /* @__PURE__ */ defineStore("searchResult", () => {
     setRelatedQueriesApiEnabled
   };
 });
-const _hoisted_1$1b = { class: "lupa-search-box-add-to-cart-wrapper" };
-const _hoisted_2$Q = { class: "lupa-search-box-product-addtocart" };
+const _hoisted_1$1d = { class: "lupa-search-box-add-to-cart-wrapper" };
+const _hoisted_2$R = { class: "lupa-search-box-product-addtocart" };
 const _hoisted_3$C = ["disabled"];
 const _hoisted_4$r = ["href"];
 const _hoisted_5$h = ["disabled"];
-const _sfc_main$1o = /* @__PURE__ */ defineComponent({
+const _sfc_main$1s = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductAddToCart",
   props: {
     item: {},
@@ -30757,8 +30769,8 @@ const _sfc_main$1o = /* @__PURE__ */ defineComponent({
       return Boolean(props.link && props.options.link);
     });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$1b, [
-        createBaseVNode("div", _hoisted_2$Q, [
+      return openBlock(), createElementBlock("div", _hoisted_1$1d, [
+        createBaseVNode("div", _hoisted_2$R, [
           hasLink.value ? (openBlock(), createElementBlock("button", mergeProps({
             key: 0,
             class: addToCartButtonClass.value,
@@ -30779,23 +30791,23 @@ const _sfc_main$1o = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$1a = {
+const _hoisted_1$1c = {
   key: 1,
   class: "lupa-search-box-element-badge-wrapper"
 };
 const __default__$4 = {
   components: {
-    SearchBoxProductImage: _sfc_main$1v,
-    SearchBoxProductTitle: _sfc_main$1u,
-    SearchBoxProductDescription: _sfc_main$1t,
-    SearchBoxProductPrice: _sfc_main$1s,
-    SearchBoxProductRegularPrice: _sfc_main$1r,
-    SearchBoxProductCustom: _sfc_main$1q,
-    SearchBoxProductCustomHtml: _sfc_main$1p,
-    SearchBoxProductAddToCart: _sfc_main$1o
+    SearchBoxProductImage: _sfc_main$1z,
+    SearchBoxProductTitle: _sfc_main$1y,
+    SearchBoxProductDescription: _sfc_main$1x,
+    SearchBoxProductPrice: _sfc_main$1w,
+    SearchBoxProductRegularPrice: _sfc_main$1v,
+    SearchBoxProductCustom: _sfc_main$1u,
+    SearchBoxProductCustomHtml: _sfc_main$1t,
+    SearchBoxProductAddToCart: _sfc_main$1s
   }
 };
-const _sfc_main$1n = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValues2({}, __default__$4), {
+const _sfc_main$1r = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValues2({}, __default__$4), {
   __name: "SearchBoxProductElement",
   props: {
     item: {},
@@ -30867,7 +30879,7 @@ const _sfc_main$1n = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValu
           "dynamic-attributes": dynamicAttributes.value,
           link: _ctx.link
         }, renderDynamicAttributesOnParentElement.value && dynamicAttributes.value), null, 16, ["item", "options", "labels", "class", "inStock", "dynamic-attributes", "link"])) : createCommentVNode("", true)
-      ], 64)) : (openBlock(), createElementBlock("div", _hoisted_1$1a, [
+      ], 64)) : (openBlock(), createElementBlock("div", _hoisted_1$1c, [
         displayElement.value ? (openBlock(), createBlock(resolveDynamicComponent(elementComponent.value), {
           key: 0,
           item: enhancedItem.value,
@@ -30882,14 +30894,14 @@ const _sfc_main$1n = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValu
     };
   }
 }));
-const _hoisted_1$19 = { class: "lupa-badge-title" };
-const _hoisted_2$P = ["src"];
+const _hoisted_1$1b = { class: "lupa-badge-title" };
+const _hoisted_2$Q = ["src"];
 const _hoisted_3$B = { key: 1 };
 const _hoisted_4$q = {
   key: 0,
   class: "lupa-badge-full-text"
 };
-const _sfc_main$1m = /* @__PURE__ */ defineComponent({
+const _sfc_main$1q = /* @__PURE__ */ defineComponent({
   __name: "SearchResultGeneratedBadge",
   props: {
     options: {},
@@ -30922,11 +30934,11 @@ const _sfc_main$1m = /* @__PURE__ */ defineComponent({
         class: normalizeClass(["lupa-dynamic-badge", customClassName.value]),
         style: normalizeStyle({ background: _ctx.badge.backgroundColor, color: _ctx.badge.color })
       }, [
-        createBaseVNode("span", _hoisted_1$19, [
+        createBaseVNode("span", _hoisted_1$1b, [
           image.value ? (openBlock(), createElementBlock("img", {
             key: 0,
             src: image.value
-          }, null, 8, _hoisted_2$P)) : createCommentVNode("", true),
+          }, null, 8, _hoisted_2$Q)) : createCommentVNode("", true),
           hasTitleText.value && showTitle.value ? (openBlock(), createElementBlock("span", _hoisted_3$B, toDisplayString(_ctx.badge.titleText), 1)) : createCommentVNode("", true)
         ]),
         hasAdditionalText.value ? (openBlock(), createElementBlock("span", _hoisted_4$q, toDisplayString(_ctx.badge.additionalText), 1)) : createCommentVNode("", true)
@@ -30934,8 +30946,8 @@ const _sfc_main$1m = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$18 = { class: "lupa-generated-badges" };
-const _sfc_main$1l = /* @__PURE__ */ defineComponent({
+const _hoisted_1$1a = { class: "lupa-generated-badges" };
+const _sfc_main$1p = /* @__PURE__ */ defineComponent({
   __name: "SearchResultGeneratedBadges",
   props: {
     options: {}
@@ -30961,9 +30973,9 @@ const _sfc_main$1l = /* @__PURE__ */ defineComponent({
       })).filter((b) => Boolean(b.id));
     });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$18, [
+      return openBlock(), createElementBlock("div", _hoisted_1$1a, [
         (openBlock(true), createElementBlock(Fragment, null, renderList(badges.value, (badge) => {
-          return openBlock(), createBlock(_sfc_main$1m, {
+          return openBlock(), createBlock(_sfc_main$1q, {
             key: badge.id,
             badge,
             options: _ctx.options
@@ -30973,8 +30985,8 @@ const _sfc_main$1l = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$17 = ["innerHTML"];
-const _sfc_main$1k = /* @__PURE__ */ defineComponent({
+const _hoisted_1$19 = ["innerHTML"];
+const _sfc_main$1o = /* @__PURE__ */ defineComponent({
   __name: "CustomBadge",
   props: {
     badge: {}
@@ -30995,12 +31007,12 @@ const _sfc_main$1k = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock("div", {
         class: normalizeClass(className.value),
         innerHTML: text.value
-      }, null, 10, _hoisted_1$17);
+      }, null, 10, _hoisted_1$19);
     };
   }
 });
-const _hoisted_1$16 = { class: "lupa-text-badges" };
-const _sfc_main$1j = /* @__PURE__ */ defineComponent({
+const _hoisted_1$18 = { class: "lupa-text-badges" };
+const _sfc_main$1n = /* @__PURE__ */ defineComponent({
   __name: "TextBadge",
   props: {
     badge: {}
@@ -31014,7 +31026,7 @@ const _sfc_main$1j = /* @__PURE__ */ defineComponent({
       return badges.value.slice(0, props.badge.maxItems);
     });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$16, [
+      return openBlock(), createElementBlock("div", _hoisted_1$18, [
         (openBlock(true), createElementBlock(Fragment, null, renderList(displayBadges.value, (item) => {
           return openBlock(), createElementBlock("div", {
             class: "lupa-badge lupa-text-badge",
@@ -31025,9 +31037,9 @@ const _sfc_main$1j = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$15 = { class: "lupa-image-badges" };
-const _hoisted_2$O = ["src"];
-const _sfc_main$1i = /* @__PURE__ */ defineComponent({
+const _hoisted_1$17 = { class: "lupa-image-badges" };
+const _hoisted_2$P = ["src"];
+const _sfc_main$1m = /* @__PURE__ */ defineComponent({
   __name: "ImageBadge",
   props: {
     badge: {}
@@ -31047,7 +31059,7 @@ const _sfc_main$1i = /* @__PURE__ */ defineComponent({
       return `${props.badge.rootImageUrl}${src}`;
     };
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$15, [
+      return openBlock(), createElementBlock("div", _hoisted_1$17, [
         (openBlock(true), createElementBlock(Fragment, null, renderList(displayBadges.value, (item) => {
           return openBlock(), createElementBlock("div", {
             class: "lupa-badge lupa-image-badge",
@@ -31055,14 +31067,14 @@ const _sfc_main$1i = /* @__PURE__ */ defineComponent({
           }, [
             createBaseVNode("img", {
               src: getImageUrl(item)
-            }, null, 8, _hoisted_2$O)
+            }, null, 8, _hoisted_2$P)
           ]);
         }), 128))
       ]);
     };
   }
 });
-const _sfc_main$1h = /* @__PURE__ */ defineComponent({
+const _sfc_main$1l = /* @__PURE__ */ defineComponent({
   __name: "DiscountBadge",
   props: {
     badge: {}
@@ -31124,16 +31136,16 @@ const _sfc_main$1h = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$14 = { id: "lupa-search-results-badges" };
+const _hoisted_1$16 = { id: "lupa-search-results-badges" };
 const __default__$3 = {
   components: {
-    CustomBadge: _sfc_main$1k,
-    TextBadge: _sfc_main$1j,
-    ImageBadge: _sfc_main$1i,
-    DiscountBadge: _sfc_main$1h
+    CustomBadge: _sfc_main$1o,
+    TextBadge: _sfc_main$1n,
+    ImageBadge: _sfc_main$1m,
+    DiscountBadge: _sfc_main$1l
   }
 };
-const _sfc_main$1g = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValues2({}, __default__$3), {
+const _sfc_main$1k = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValues2({}, __default__$3), {
   __name: "SearchResultsBadgeWrapper",
   props: {
     position: {},
@@ -31196,7 +31208,7 @@ const _sfc_main$1g = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValu
       }
     };
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$14, [
+      return openBlock(), createElementBlock("div", _hoisted_1$16, [
         createBaseVNode("div", {
           id: "lupa-badges",
           class: normalizeClass(anchorPosition.value)
@@ -31207,7 +31219,7 @@ const _sfc_main$1g = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValu
               badge
             }, null, 8, ["badge"]);
           }), 128)),
-          positionValue.value === "card" ? (openBlock(), createBlock(_sfc_main$1l, {
+          positionValue.value === "card" ? (openBlock(), createBlock(_sfc_main$1p, {
             key: 0,
             options: _ctx.options
           }, null, 8, ["options"])) : createCommentVNode("", true)
@@ -31216,13 +31228,13 @@ const _sfc_main$1g = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValu
     };
   }
 }));
-const _hoisted_1$13 = ["href"];
-const _hoisted_2$N = { class: "lupa-search-box-product-details-section" };
+const _hoisted_1$15 = ["href"];
+const _hoisted_2$O = { class: "lupa-search-box-product-details-section" };
 const _hoisted_3$A = {
   key: 0,
   class: "lupa-search-box-product-add-to-cart-section"
 };
-const _sfc_main$1f = /* @__PURE__ */ defineComponent({
+const _sfc_main$1j = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProduct",
   props: {
     item: {},
@@ -31328,7 +31340,7 @@ const _sfc_main$1f = /* @__PURE__ */ defineComponent({
           style: normalizeStyle(imageStyleOverride.value)
         }, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(imageElements.value, (element) => {
-            return openBlock(), createBlock(_sfc_main$1n, {
+            return openBlock(), createBlock(_sfc_main$1r, {
               class: "lupa-search-box-product-element",
               key: element.key,
               item: _ctx.item,
@@ -31338,10 +31350,10 @@ const _sfc_main$1f = /* @__PURE__ */ defineComponent({
             }, null, 8, ["item", "element", "labels", "link"]);
           }), 128))
         ], 4),
-        createBaseVNode("div", _hoisted_2$N, [
+        createBaseVNode("div", _hoisted_2$O, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(detailElements.value, (element) => {
             var _a25;
-            return openBlock(), createBlock(_sfc_main$1n, {
+            return openBlock(), createBlock(_sfc_main$1r, {
               class: "lupa-search-box-product-element",
               key: element.key,
               item: _ctx.item,
@@ -31352,7 +31364,7 @@ const _sfc_main$1f = /* @__PURE__ */ defineComponent({
               ((_a25 = badgeOptions.value) == null ? void 0 : _a25.anchorElementKey) === element.key ? {
                 name: "badges",
                 fn: withCtx(() => [
-                  createVNode(_sfc_main$1g, {
+                  createVNode(_sfc_main$1k, {
                     options: badgeOptions.value,
                     position: "card"
                   }, null, 8, ["options"])
@@ -31368,7 +31380,7 @@ const _sfc_main$1f = /* @__PURE__ */ defineComponent({
             class: normalizeClass(`lupa-search-box-group-${group}`)
           }, [
             (openBlock(true), createElementBlock(Fragment, null, renderList(getGroupElements(group), (element) => {
-              return openBlock(), createBlock(_sfc_main$1n, {
+              return openBlock(), createBlock(_sfc_main$1r, {
                 class: "lupa-search-box-product-element",
                 key: element.key,
                 item: _ctx.item,
@@ -31381,7 +31393,7 @@ const _sfc_main$1f = /* @__PURE__ */ defineComponent({
           ], 2);
         }), 128)),
         addToCartElement.value ? (openBlock(), createElementBlock("div", _hoisted_3$A, [
-          createVNode(_sfc_main$1n, {
+          createVNode(_sfc_main$1r, {
             class: "lupa-search-box-product-element",
             item: _ctx.item,
             element: addToCartElement.value,
@@ -31390,7 +31402,7 @@ const _sfc_main$1f = /* @__PURE__ */ defineComponent({
             isInStock: isInStock.value
           }, null, 8, ["item", "element", "labels", "link", "isInStock"])
         ])) : createCommentVNode("", true)
-      ], 16, _hoisted_1$13);
+      ], 16, _hoisted_1$15);
     };
   }
 });
@@ -31462,8 +31474,8 @@ const useTrackingStore = /* @__PURE__ */ defineStore("tracking", () => {
   };
   return { trackSearch, trackResults, trackEvent, trackDelayedEvent };
 });
-const _hoisted_1$12 = ["innerHTML"];
-const _sfc_main$1e = /* @__PURE__ */ defineComponent({
+const _hoisted_1$14 = ["innerHTML"];
+const _sfc_main$1i = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProducts",
   props: {
     items: {},
@@ -31574,7 +31586,7 @@ const _sfc_main$1e = /* @__PURE__ */ defineComponent({
             itemClicked: handleProductClick
           });
         }), 128)) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(displayItems.value, (item, index) => {
-          return openBlock(), createBlock(_sfc_main$1f, {
+          return openBlock(), createBlock(_sfc_main$1j, {
             key: index,
             item,
             panelOptions: _ctx.panelOptions,
@@ -31587,7 +31599,7 @@ const _sfc_main$1e = /* @__PURE__ */ defineComponent({
         hasResults.value && ((_a25 = _ctx.panelOptions) == null ? void 0 : _a25.appendCustomHtml) && (showAll.value || !showAllItemsToggleButton.value) ? (openBlock(), createElementBlock("div", {
           key: 2,
           innerHTML: _ctx.panelOptions.appendCustomHtml
-        }, null, 8, _hoisted_1$12)) : createCommentVNode("", true),
+        }, null, 8, _hoisted_1$14)) : createCommentVNode("", true),
         showAllItemsToggleButton.value ? (openBlock(), createElementBlock("a", {
           key: 3,
           class: "lupa-search-box-expand",
@@ -31598,9 +31610,9 @@ const _sfc_main$1e = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$11 = { class: "lupa-search-box-documents-go-to-results-wrapper" };
-const _hoisted_2$M = { key: 0 };
-const _sfc_main$1d = /* @__PURE__ */ defineComponent({
+const _hoisted_1$13 = { class: "lupa-search-box-documents-go-to-results-wrapper" };
+const _hoisted_2$N = { key: 0 };
+const _sfc_main$1h = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductsGoToResultsButton",
   props: {
     options: {},
@@ -31631,13 +31643,13 @@ const _sfc_main$1d = /* @__PURE__ */ defineComponent({
       emit2("goToResults");
     };
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$11, [
+      return openBlock(), createElementBlock("div", _hoisted_1$13, [
         createBaseVNode("button", {
           class: "lupa-search-box-documents-go-to-results-button",
           onClick: goToResults
         }, [
           createTextVNode(toDisplayString(goToResultsLabel.value) + " ", 1),
-          totalCount.value ? (openBlock(), createElementBlock("span", _hoisted_2$M, " " + toDisplayString(totalCount.value), 1)) : createCommentVNode("", true)
+          totalCount.value ? (openBlock(), createElementBlock("span", _hoisted_2$N, " " + toDisplayString(totalCount.value), 1)) : createCommentVNode("", true)
         ])
       ]);
     };
@@ -31733,7 +31745,7 @@ const processExtractionObject = (value = {}) => {
   }
   return parsedObject;
 };
-const _sfc_main$1c = /* @__PURE__ */ defineComponent({
+const _sfc_main$1g = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxProductsWrapper",
   props: {
     panel: {},
@@ -31804,7 +31816,7 @@ const _sfc_main$1c = /* @__PURE__ */ defineComponent({
     watch(() => props.panel.limit, getItemsDebounced);
     return (_ctx, _cache) => {
       var _a25, _b25;
-      return openBlock(), createBlock(_sfc_main$1e, {
+      return openBlock(), createBlock(_sfc_main$1i, {
         items: (_b25 = (_a25 = searchResult.value) == null ? void 0 : _a25.items) != null ? _b25 : [],
         panelOptions: _ctx.panel,
         labels: _ctx.labels,
@@ -31814,7 +31826,7 @@ const _sfc_main$1c = /* @__PURE__ */ defineComponent({
         default: withCtx(() => {
           var _a26;
           return [
-            showGoToResultsButton.value && ((_a26 = searchResult.value) == null ? void 0 : _a26.items.length) ? (openBlock(), createBlock(_sfc_main$1d, {
+            showGoToResultsButton.value && ((_a26 = searchResult.value) == null ? void 0 : _a26.items.length) ? (openBlock(), createBlock(_sfc_main$1h, {
               key: 0,
               options: _ctx.searchBoxOptions,
               panel: _ctx.panel,
@@ -31835,7 +31847,7 @@ const _sfc_main$1c = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$1b = /* @__PURE__ */ defineComponent({
+const _sfc_main$1f = /* @__PURE__ */ defineComponent({
   __name: "SearchBoxRelatedSourceWrapper",
   props: {
     panel: {},
@@ -31907,7 +31919,7 @@ const _sfc_main$1b = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       var _a25, _b25;
-      return openBlock(), createBlock(_sfc_main$1e, {
+      return openBlock(), createBlock(_sfc_main$1i, {
         items: (_b25 = (_a25 = searchResult.value) == null ? void 0 : _a25.items) != null ? _b25 : [],
         panelOptions: documentPanelOptions.value,
         labels: _ctx.labels,
@@ -31925,8 +31937,8 @@ const _sfc_main$1b = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$10 = ["data-cy"];
-const _hoisted_2$L = {
+const _hoisted_1$12 = ["data-cy"];
+const _hoisted_2$M = {
   key: 0,
   class: "lupa-panel-title lupa-panel-title-top-results"
 };
@@ -31936,12 +31948,12 @@ const _hoisted_3$z = {
 };
 const __default__$2 = {
   components: {
-    SearchBoxSuggestionsWrapper: _sfc_main$1x,
-    SearchBoxProductsWrapper: _sfc_main$1c,
-    SearchBoxRelatedSourceWrapper: _sfc_main$1b
+    SearchBoxSuggestionsWrapper: _sfc_main$1B,
+    SearchBoxProductsWrapper: _sfc_main$1g,
+    SearchBoxRelatedSourceWrapper: _sfc_main$1f
   }
 };
-const _sfc_main$1a = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValues2({}, __default__$2), {
+const _sfc_main$1e = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValues2({}, __default__$2), {
   __name: "SearchBoxMainPanel",
   props: {
     options: {},
@@ -32132,7 +32144,7 @@ const _sfc_main$1a = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValu
                 style: normalizeStyle(panel.gridArea ? { gridArea: `${panel.gridArea}${index}` } : {}),
                 "data-cy": "lupa-panel-" + panel.type + "-index"
               }, [
-                ((_a25 = panel.labels) == null ? void 0 : _a25.topResultsTitle) && showTopResultsPanelTitle(panel.queryKey) ? (openBlock(), createElementBlock("div", _hoisted_2$L, toDisplayString((_b25 = panel.labels) == null ? void 0 : _b25.topResultsTitle), 1)) : createCommentVNode("", true),
+                ((_a25 = panel.labels) == null ? void 0 : _a25.topResultsTitle) && showTopResultsPanelTitle(panel.queryKey) ? (openBlock(), createElementBlock("div", _hoisted_2$M, toDisplayString((_b25 = panel.labels) == null ? void 0 : _b25.topResultsTitle), 1)) : createCommentVNode("", true),
                 ((_c = panel.labels) == null ? void 0 : _c.title) && showPanelTitle(panel) ? (openBlock(), createElementBlock("div", _hoisted_3$z, toDisplayString((_d = panel.labels) == null ? void 0 : _d.title), 1)) : createCommentVNode("", true),
                 panel.queryKey && canShowPanel(panel) ? (openBlock(), createBlock(resolveDynamicComponent(getComponent(panel.type)), {
                   key: 2,
@@ -32155,14 +32167,14 @@ const _sfc_main$1a = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValu
                     key: "0"
                   } : void 0
                 ]), 1064, ["panel", "search-box-options", "options", "debounce", "inputValue", "labels"])) : createCommentVNode("", true)
-              ], 14, _hoisted_1$10);
+              ], 14, _hoisted_1$12);
             }), 128))
           ], 4),
-          !unref(hasAnyResults) && _ctx.options.showNoResultsPanel ? (openBlock(), createBlock(_sfc_main$1A, {
+          !unref(hasAnyResults) && _ctx.options.showNoResultsPanel ? (openBlock(), createBlock(_sfc_main$1E, {
             key: 1,
             options: _ctx.options
           }, null, 8, ["options"])) : createCommentVNode("", true),
-          displayShowMoreResultsButton.value ? (openBlock(), createBlock(_sfc_main$1D, {
+          displayShowMoreResultsButton.value ? (openBlock(), createBlock(_sfc_main$1H, {
             key: 2,
             labels: labels.value,
             options: _ctx.options,
@@ -32173,7 +32185,7 @@ const _sfc_main$1a = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValu
           id: "lupa-search-box-panel",
           class: normalizeClass({ "lupa-search-text-empty": isSearchEmpty.value })
         }, [
-          createVNode(_sfc_main$1B, {
+          createVNode(_sfc_main$1F, {
             options: _ctx.options.history,
             history: history.value,
             onGoToResults: handleGoToResults,
@@ -32198,8 +32210,8 @@ const unbindSearchTriggers = (triggers = [], event) => {
   const elements = getElements(triggers);
   elements.forEach((e2) => e2 == null ? void 0 : e2.removeEventListener(BIND_EVENT, event));
 };
-const _hoisted_1$$ = { class: "lupa-search-box-wrapper" };
-const _sfc_main$19 = /* @__PURE__ */ defineComponent({
+const _hoisted_1$11 = { class: "lupa-search-box-wrapper" };
+const _sfc_main$1d = /* @__PURE__ */ defineComponent({
   __name: "SearchBox",
   props: {
     options: {},
@@ -32538,8 +32550,8 @@ const _sfc_main$19 = /* @__PURE__ */ defineComponent({
         id: "lupa-search-box",
         class: normalizeClass({ "lupa-search-box-opened": opened.value })
       }, [
-        createBaseVNode("div", _hoisted_1$$, [
-          createVNode(_sfc_main$1E, {
+        createBaseVNode("div", _hoisted_1$11, [
+          createVNode(_sfc_main$1I, {
             options: inputOptions.value,
             suggestedValue: suggestedValue.value,
             "can-close": (_a26 = _ctx.isSearchContainer) != null ? _a26 : false,
@@ -32552,7 +32564,7 @@ const _sfc_main$19 = /* @__PURE__ */ defineComponent({
             onSearch: handleSearch,
             onClose: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("close"))
           }, null, 8, ["options", "suggestedValue", "can-close", "emit-input-on-focus"]),
-          opened.value || _ctx.isSearchContainer ? (openBlock(), createBlock(_sfc_main$1a, {
+          opened.value || _ctx.isSearchContainer ? (openBlock(), createBlock(_sfc_main$1e, {
             key: 0,
             options: panelOptions.value,
             inputValue: inputValue.value,
@@ -32643,11 +32655,11 @@ const getSearchParams = (url, params, baseUrl) => {
   }
   return searchParams;
 };
-const _hoisted_1$_ = {
+const _hoisted_1$10 = {
   key: 0,
   id: "lupa-search-results-did-you-mean"
 };
-const _hoisted_2$K = {
+const _hoisted_2$L = {
   key: 0,
   "data-cy": "suggested-search-text-label"
 };
@@ -32656,7 +32668,7 @@ const _hoisted_3$y = {
   "data-cy": "did-you-mean-label"
 };
 const _hoisted_4$p = { key: 1 };
-const _sfc_main$18 = /* @__PURE__ */ defineComponent({
+const _sfc_main$1c = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsDidYouMean",
   props: {
     labels: {}
@@ -32688,8 +32700,8 @@ const _sfc_main$18 = /* @__PURE__ */ defineComponent({
       paramStore.goToResults({ searchText, facet });
     };
     return (_ctx, _cache) => {
-      return unref(searchResult).suggestedSearchText || didYouMeanValue.value ? (openBlock(), createElementBlock("div", _hoisted_1$_, [
-        unref(searchResult).suggestedSearchText ? (openBlock(), createElementBlock("div", _hoisted_2$K, [
+      return unref(searchResult).suggestedSearchText || didYouMeanValue.value ? (openBlock(), createElementBlock("div", _hoisted_1$10, [
+        unref(searchResult).suggestedSearchText ? (openBlock(), createElementBlock("div", _hoisted_2$L, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.labels.noResultsSuggestion.split(" "), (label, index) => {
             return openBlock(), createElementBlock("span", { key: index }, [
               createBaseVNode("span", {
@@ -32714,12 +32726,12 @@ const _sfc_main$18 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$Z = {
+const _hoisted_1$$ = {
   key: 0,
   class: "lupa-search-results-summary"
 };
-const _hoisted_2$J = ["innerHTML"];
-const _sfc_main$17 = /* @__PURE__ */ defineComponent({
+const _hoisted_2$K = ["innerHTML"];
+const _sfc_main$1b = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsSummary",
   props: {
     label: {},
@@ -32734,8 +32746,8 @@ const _sfc_main$17 = /* @__PURE__ */ defineComponent({
       return addParamsToLabel(props.label, range2, `<span>${totalItems.value}</span>`);
     });
     return (_ctx, _cache) => {
-      return unref(totalItems) > 0 ? (openBlock(), createElementBlock("div", _hoisted_1$Z, [
-        createBaseVNode("div", { innerHTML: summaryLabel.value }, null, 8, _hoisted_2$J),
+      return unref(totalItems) > 0 ? (openBlock(), createElementBlock("div", _hoisted_1$$, [
+        createBaseVNode("div", { innerHTML: summaryLabel.value }, null, 8, _hoisted_2$K),
         _ctx.clearable ? (openBlock(), createElementBlock("span", {
           key: 0,
           class: "lupa-filter-clear",
@@ -32746,7 +32758,130 @@ const _sfc_main$17 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$Y = {
+const _sfc_main$1a = /* @__PURE__ */ defineComponent({
+  __name: "SkeletonBlock",
+  props: {
+    style: {}
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: "lupa-skeleton-block-wrapper",
+        style: normalizeStyle(_ctx.style)
+      }, _cache[0] || (_cache[0] = [
+        createBaseVNode("div", { class: "lupa-skeleton-block" }, [
+          createBaseVNode("div", { class: "lupa-skeleton-block__shimmer" })
+        ], -1)
+      ]), 4);
+    };
+  }
+});
+const _sfc_main$19 = /* @__PURE__ */ defineComponent({
+  __name: "SkeletonText",
+  props: {
+    style: {},
+    lines: { default: 1 }
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: "lupa-skeleton-text-wrapper",
+        style: normalizeStyle(_ctx.style)
+      }, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.lines, (i) => {
+          return openBlock(), createElementBlock("div", {
+            key: i,
+            class: "lupa-skeleton-line"
+          }, _cache[0] || (_cache[0] = [
+            createBaseVNode("div", { class: "lupa-skeleton-line__shimmer" }, null, -1)
+          ]));
+        }), 128))
+      ], 4);
+    };
+  }
+});
+const _hoisted_1$_ = {
+  key: 1,
+  class: "lupa-skeleton-text"
+};
+const _hoisted_2$J = {
+  key: 2,
+  class: "lupa-skeleton-blocks"
+};
+const _sfc_main$18 = /* @__PURE__ */ defineComponent({
+  __name: "LoadingBlock",
+  props: {
+    style: {},
+    type: {},
+    enabled: { type: Boolean },
+    loading: { type: Boolean },
+    count: {}
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return !_ctx.loading || !_ctx.enabled ? renderSlot(_ctx.$slots, "default", { key: 0 }) : _ctx.type === "text" ? (openBlock(), createElementBlock("div", _hoisted_1$_, [
+        createVNode(_sfc_main$19, {
+          style: normalizeStyle(_ctx.style),
+          lines: _ctx.count
+        }, null, 8, ["style", "lines"])
+      ])) : (openBlock(), createElementBlock("div", _hoisted_2$J, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.count, (n) => {
+          return openBlock(), createBlock(_sfc_main$1a, {
+            key: n,
+            style: normalizeStyle(_ctx.style)
+          }, null, 8, ["style"]);
+        }), 128))
+      ]));
+    };
+  }
+});
+const useLoadingSkeleton = () => {
+  const paramsStore = useParamsStore();
+  const optionsStore = useOptionsStore();
+  const searchResultStore = useSearchResultStore();
+  const { limit } = storeToRefs(paramsStore);
+  const {
+    searchResult,
+    relatedQueriesResult,
+    loading,
+    loadingFacets: loadingFacetsBase,
+    loadingRelatedQueries
+  } = storeToRefs(searchResultStore);
+  const { searchResultOptions } = storeToRefs(optionsStore);
+  const skeletonEnabled = computed(() => {
+    var _a25, _b25, _c, _d;
+    return ((_b25 = (_a25 = searchResultOptions.value) == null ? void 0 : _a25.loadingSkeleton) == null ? void 0 : _b25.enabled) && !((_d = (_c = searchResult.value) == null ? void 0 : _c.items) == null ? void 0 : _d.length);
+  });
+  const relatedQueriesSkeletonEnabled = computed(() => {
+    var _a25, _b25, _c, _d, _e;
+    return ((_b25 = (_a25 = searchResultOptions.value) == null ? void 0 : _a25.loadingSkeleton) == null ? void 0 : _b25.enabled) && Boolean((_c = searchResultOptions.value) == null ? void 0 : _c.relatedQueries) && !((_e = (_d = relatedQueriesResult.value) == null ? void 0 : _d.relatedQueries) == null ? void 0 : _e.length);
+  });
+  const facetSkeletonEnabled = computed(() => {
+    var _a25, _b25, _c, _d;
+    return ((_b25 = (_a25 = searchResultOptions.value) == null ? void 0 : _a25.loadingSkeleton) == null ? void 0 : _b25.enabled) && !((_d = (_c = searchResult.value) == null ? void 0 : _c.facets) == null ? void 0 : _d.length);
+  });
+  const loadingFacets = computed(() => {
+    var _a25;
+    if ((_a25 = searchResultOptions.value) == null ? void 0 : _a25.splitExpensiveRequests) {
+      return loadingFacetsBase.value;
+    }
+    return loading.value;
+  });
+  const loadingAny = computed(() => {
+    return loading.value || loadingRelatedQueries.value || loadingFacets.value;
+  });
+  return {
+    loading,
+    loadingRelatedQueries,
+    loadingFacets,
+    loadingAny,
+    limit,
+    skeletonEnabled,
+    relatedQueriesSkeletonEnabled,
+    facetSkeletonEnabled
+  };
+};
+const _hoisted_1$Z = {
   key: 0,
   class: "lupa-result-page-title",
   "data-cy": "lupa-result-page-title"
@@ -32758,7 +32893,7 @@ const _hoisted_3$x = {
 };
 const _hoisted_4$o = { class: "lupa-results-total-count-number" };
 const _hoisted_5$g = ["innerHTML"];
-const _sfc_main$16 = /* @__PURE__ */ defineComponent({
+const _sfc_main$17 = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsTitle",
   props: {
     options: {},
@@ -32768,7 +32903,10 @@ const _sfc_main$16 = /* @__PURE__ */ defineComponent({
   setup(__props) {
     const props = __props;
     const searchResultStore = useSearchResultStore();
+    const paramsStore = useParamsStore();
     const { currentQueryText, totalItems, searchResult } = storeToRefs(searchResultStore);
+    const { skeletonEnabled, loading } = useLoadingSkeleton();
+    const { query } = storeToRefs(paramsStore);
     const suggestedSearchText = computed(() => searchResult.value.suggestedSearchText);
     const queryText = computed(() => {
       return suggestedSearchText.value || currentQueryText.value;
@@ -32801,29 +32939,39 @@ const _sfc_main$16 = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", null, [
-        showSearchTitle.value ? (openBlock(), createElementBlock("h1", _hoisted_1$Y, [
-          createTextVNode(toDisplayString(searchResultsTitleTemplate.value || _ctx.options.labels.searchResults), 1),
-          queryText.value && !searchResultsTitleTemplate.value ? (openBlock(), createElementBlock("span", _hoisted_2$I, "'" + toDisplayString(queryText.value) + "'", 1)) : createCommentVNode("", true),
-          showProductCount.value ? (openBlock(), createElementBlock("span", _hoisted_3$x, [
-            createTextVNode("(" + toDisplayString(searchResultsCountLabel.value), 1),
-            createBaseVNode("span", _hoisted_4$o, toDisplayString(unref(totalItems)), 1),
-            _cache[0] || (_cache[0] = createTextVNode(")"))
-          ])) : createCommentVNode("", true)
-        ])) : createCommentVNode("", true),
-        _ctx.showSummary ? (openBlock(), createBlock(_sfc_main$17, {
-          key: 1,
-          label: summaryLabel.value
-        }, null, 8, ["label"])) : createCommentVNode("", true),
-        descriptionTop.value ? (openBlock(), createElementBlock("div", {
-          key: 2,
-          class: "lupa-result-page-description-top",
-          innerHTML: descriptionTop.value
-        }, null, 8, _hoisted_5$g)) : createCommentVNode("", true)
+        createVNode(_sfc_main$18, {
+          type: "text",
+          count: 1,
+          enabled: unref(skeletonEnabled) && Boolean(unref(query)),
+          loading: unref(loading)
+        }, {
+          default: withCtx(() => [
+            showSearchTitle.value ? (openBlock(), createElementBlock("h1", _hoisted_1$Z, [
+              createTextVNode(toDisplayString(searchResultsTitleTemplate.value || _ctx.options.labels.searchResults), 1),
+              queryText.value && !searchResultsTitleTemplate.value ? (openBlock(), createElementBlock("span", _hoisted_2$I, "'" + toDisplayString(queryText.value) + "'", 1)) : createCommentVNode("", true),
+              showProductCount.value ? (openBlock(), createElementBlock("span", _hoisted_3$x, [
+                createTextVNode("(" + toDisplayString(searchResultsCountLabel.value), 1),
+                createBaseVNode("span", _hoisted_4$o, toDisplayString(unref(totalItems)), 1),
+                _cache[0] || (_cache[0] = createTextVNode(")"))
+              ])) : createCommentVNode("", true)
+            ])) : createCommentVNode("", true),
+            _ctx.showSummary ? (openBlock(), createBlock(_sfc_main$1b, {
+              key: 1,
+              label: summaryLabel.value
+            }, null, 8, ["label"])) : createCommentVNode("", true),
+            descriptionTop.value ? (openBlock(), createElementBlock("div", {
+              key: 2,
+              class: "lupa-result-page-description-top",
+              innerHTML: descriptionTop.value
+            }, null, 8, _hoisted_5$g)) : createCommentVNode("", true)
+          ]),
+          _: 1
+        }, 8, ["enabled", "loading"])
       ]);
     };
   }
 });
-const _hoisted_1$X = {
+const _hoisted_1$Y = {
   class: "lupa-current-filter-label",
   "data-cy": "lupa-current-filter-label"
 };
@@ -32831,7 +32979,7 @@ const _hoisted_2$H = {
   class: "lupa-current-filter-value",
   "data-cy": "lupa-current-filter-value"
 };
-const _sfc_main$15 = /* @__PURE__ */ defineComponent({
+const _sfc_main$16 = /* @__PURE__ */ defineComponent({
   __name: "CurrentFilterDisplay",
   props: {
     filter: {}
@@ -32873,13 +33021,13 @@ const _sfc_main$15 = /* @__PURE__ */ defineComponent({
           onClick: handleClick,
           "aria-label": "Remove filter"
         }, "⨉"),
-        createBaseVNode("div", _hoisted_1$X, toDisplayString(_ctx.filter.label) + ": ", 1),
+        createBaseVNode("div", _hoisted_1$Y, toDisplayString(_ctx.filter.label) + ": ", 1),
         createBaseVNode("div", _hoisted_2$H, toDisplayString(formatFilterValue(props.filter)), 1)
       ], 2);
     };
   }
 });
-const _hoisted_1$W = { class: "lupa-filter-title-text" };
+const _hoisted_1$X = { class: "lupa-filter-title-text" };
 const _hoisted_2$G = {
   key: 0,
   class: "lupa-filter-count"
@@ -32889,7 +33037,7 @@ const _hoisted_3$w = {
   class: "filter-values"
 };
 const _hoisted_4$n = { class: "lupa-current-filter-list" };
-const _sfc_main$14 = /* @__PURE__ */ defineComponent({
+const _sfc_main$15 = /* @__PURE__ */ defineComponent({
   __name: "CurrentFilters",
   props: {
     options: {},
@@ -32969,7 +33117,7 @@ const _sfc_main$14 = /* @__PURE__ */ defineComponent({
           class: "lupa-current-filter-title",
           onClick: _cache[0] || (_cache[0] = ($event) => isOpen.value = !isOpen.value)
         }, [
-          createBaseVNode("div", _hoisted_1$W, [
+          createBaseVNode("div", _hoisted_1$X, [
             createTextVNode(toDisplayString((_c = (_b25 = (_a25 = _ctx.options) == null ? void 0 : _a25.labels) == null ? void 0 : _b25.title) != null ? _c : "") + " ", 1),
             _ctx.expandable ? (openBlock(), createElementBlock("span", _hoisted_2$G, " (" + toDisplayString(unref(currentFilterCount)) + ") ", 1)) : createCommentVNode("", true)
           ]),
@@ -32981,7 +33129,7 @@ const _sfc_main$14 = /* @__PURE__ */ defineComponent({
         !_ctx.expandable || isOpen.value ? (openBlock(), createElementBlock("div", _hoisted_3$w, [
           createBaseVNode("div", _hoisted_4$n, [
             (openBlock(true), createElementBlock(Fragment, null, renderList(currentDisplayFilters.value, (filter) => {
-              return openBlock(), createBlock(_sfc_main$15, {
+              return openBlock(), createBlock(_sfc_main$16, {
                 key: filter.key + "_" + filter.value,
                 filter,
                 units: units.value,
@@ -32999,8 +33147,8 @@ const _sfc_main$14 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$V = ["href"];
-const _sfc_main$13 = /* @__PURE__ */ defineComponent({
+const _hoisted_1$W = ["href"];
+const _sfc_main$14 = /* @__PURE__ */ defineComponent({
   __name: "CategoryFilterItem",
   props: {
     options: {},
@@ -33037,12 +33185,12 @@ const _sfc_main$13 = /* @__PURE__ */ defineComponent({
           "data-cy": "lupa-child-category-item",
           href: urlLink.value,
           onClick: handleNavigation
-        }, toDisplayString(title.value), 9, _hoisted_1$V)
+        }, toDisplayString(title.value), 9, _hoisted_1$W)
       ], 2);
     };
   }
 });
-const _hoisted_1$U = {
+const _hoisted_1$V = {
   class: "lupa-category-filter",
   "data-cy": "lupa-category-filter"
 };
@@ -33050,7 +33198,7 @@ const _hoisted_2$F = { class: "lupa-category-back" };
 const _hoisted_3$v = ["href"];
 const _hoisted_4$m = ["href"];
 const _hoisted_5$f = { class: "lupa-child-category-list" };
-const _sfc_main$12 = /* @__PURE__ */ defineComponent({
+const _sfc_main$13 = /* @__PURE__ */ defineComponent({
   __name: "CategoryFilter",
   props: {
     options: {}
@@ -33138,7 +33286,7 @@ const _sfc_main$12 = /* @__PURE__ */ defineComponent({
     };
     __expose({ fetch: fetch2 });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$U, [
+      return openBlock(), createElementBlock("div", _hoisted_1$V, [
         createBaseVNode("div", _hoisted_2$F, [
           hasBackButton.value ? (openBlock(), createElementBlock("a", {
             key: 0,
@@ -33159,7 +33307,7 @@ const _sfc_main$12 = /* @__PURE__ */ defineComponent({
         ], 2),
         createBaseVNode("div", _hoisted_5$f, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(categoryChildren.value, (child) => {
-            return openBlock(), createBlock(_sfc_main$13, {
+            return openBlock(), createBlock(_sfc_main$14, {
               key: getCategoryKey(child),
               item: child,
               options: _ctx.options
@@ -33170,7 +33318,7 @@ const _sfc_main$12 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$T = {
+const _hoisted_1$U = {
   class: "lupa-search-result-facet-term-values",
   "data-cy": "lupa-search-result-facet-term-values"
 };
@@ -33185,7 +33333,7 @@ const _hoisted_7$4 = {
 };
 const _hoisted_8$2 = { key: 0 };
 const _hoisted_9$2 = { key: 1 };
-const _sfc_main$11 = /* @__PURE__ */ defineComponent({
+const _sfc_main$12 = /* @__PURE__ */ defineComponent({
   __name: "TermFacet",
   props: {
     options: {},
@@ -33279,7 +33427,7 @@ const _sfc_main$11 = /* @__PURE__ */ defineComponent({
       }
     };
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$T, [
+      return openBlock(), createElementBlock("div", _hoisted_1$U, [
         isFilterable.value ? withDirectives((openBlock(), createElementBlock("input", {
           key: 0,
           class: "lupa-term-filter",
@@ -34228,7 +34376,7 @@ const roundToMaxDecimals = (value, maxPrecision = 0.1) => {
   }
   return out;
 };
-const _hoisted_1$S = { class: "lupa-search-result-facet-stats-values" };
+const _hoisted_1$T = { class: "lupa-search-result-facet-stats-values" };
 const _hoisted_2$D = {
   key: 0,
   class: "lupa-stats-facet-summary"
@@ -34257,7 +34405,7 @@ const _hoisted_14 = {
   key: 2,
   class: "lupa-stats-slider-wrapper"
 };
-const _sfc_main$10 = /* @__PURE__ */ defineComponent({
+const _sfc_main$11 = /* @__PURE__ */ defineComponent({
   __name: "StatsFacet",
   props: {
     options: {},
@@ -34476,7 +34624,7 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
       }
     );
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$S, [
+      return openBlock(), createElementBlock("div", _hoisted_1$T, [
         !isInputVisible.value ? (openBlock(), createElementBlock("div", _hoisted_2$D, toDisplayString(statsSummary.value), 1)) : (openBlock(), createElementBlock("div", _hoisted_3$t, [
           createBaseVNode("div", _hoisted_4$k, [
             rangeLabelFrom.value ? (openBlock(), createElementBlock("div", _hoisted_5$d, toDisplayString(rangeLabelFrom.value), 1)) : createCommentVNode("", true),
@@ -34541,7 +34689,7 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$R = { class: "lupa-term-checkbox-wrapper" };
+const _hoisted_1$S = { class: "lupa-term-checkbox-wrapper" };
 const _hoisted_2$C = { class: "lupa-term-label" };
 const _hoisted_3$s = {
   key: 0,
@@ -34551,7 +34699,7 @@ const _hoisted_4$j = {
   key: 0,
   class: "lupa-facet-level"
 };
-const _sfc_main$$ = /* @__PURE__ */ defineComponent({
+const _sfc_main$10 = /* @__PURE__ */ defineComponent({
   __name: "HierarchyFacetLevel",
   props: {
     options: {},
@@ -34605,7 +34753,7 @@ const _sfc_main$$ = /* @__PURE__ */ defineComponent({
           "data-cy": "lupa-facet-term",
           onClick: _cache[0] || (_cache[0] = ($event) => handleFacetClick(_ctx.item))
         }, [
-          createBaseVNode("div", _hoisted_1$R, [
+          createBaseVNode("div", _hoisted_1$S, [
             createBaseVNode("span", {
               class: normalizeClass(["lupa-term-checkbox", { checked: isChecked.value }])
             }, null, 2)
@@ -34633,13 +34781,13 @@ const _sfc_main$$ = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$Q = {
+const _hoisted_1$R = {
   class: "lupa-search-result-facet-term-values lupa-search-result-facet-hierarchy-values",
   "data-cy": "lupa-search-result-facet-term-values"
 };
 const _hoisted_2$B = { key: 0 };
 const _hoisted_3$r = ["placeholder"];
-const _sfc_main$_ = /* @__PURE__ */ defineComponent({
+const _sfc_main$$ = /* @__PURE__ */ defineComponent({
   __name: "HierarchyFacet",
   props: {
     options: {},
@@ -34695,7 +34843,7 @@ const _sfc_main$_ = /* @__PURE__ */ defineComponent({
       showAll.value = false;
     };
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$Q, [
+      return openBlock(), createElementBlock("div", _hoisted_1$R, [
         isFilterable.value ? (openBlock(), createElementBlock("div", _hoisted_2$B, [
           withDirectives(createBaseVNode("input", {
             class: "lupa-term-filter",
@@ -34707,7 +34855,7 @@ const _sfc_main$_ = /* @__PURE__ */ defineComponent({
           ])
         ])) : createCommentVNode("", true),
         (openBlock(true), createElementBlock(Fragment, null, renderList(displayValues.value, (item) => {
-          return openBlock(), createBlock(_sfc_main$$, {
+          return openBlock(), createBlock(_sfc_main$10, {
             key: item.title,
             options: _ctx.options,
             item,
@@ -34731,7 +34879,7 @@ const _sfc_main$_ = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$P = { class: "lupa-facet-label-text" };
+const _hoisted_1$Q = { class: "lupa-facet-label-text" };
 const _hoisted_2$A = {
   key: 0,
   class: "lupa-facet-content",
@@ -34739,12 +34887,12 @@ const _hoisted_2$A = {
 };
 const __default__$1 = {
   components: {
-    TermFacet: _sfc_main$11,
-    StatsFacet: _sfc_main$10,
-    HierarchyFacet: _sfc_main$_
+    TermFacet: _sfc_main$12,
+    StatsFacet: _sfc_main$11,
+    HierarchyFacet: _sfc_main$$
   }
 };
-const _sfc_main$Z = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValues2({}, __default__$1), {
+const _sfc_main$_ = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValues2({}, __default__$1), {
   __name: "FacetDisplay",
   props: {
     options: {},
@@ -34891,7 +35039,7 @@ const _sfc_main$Z = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValue
           "data-cy": "lupa-search-result-facet-label",
           onClick: toggleFacet
         }, [
-          createBaseVNode("div", _hoisted_1$P, toDisplayString(facetLabel.value), 1),
+          createBaseVNode("div", _hoisted_1$Q, toDisplayString(facetLabel.value), 1),
           createBaseVNode("div", {
             class: normalizeClass(["lupa-facet-label-caret", isOpen.value && "open"])
           }, null, 2)
@@ -35009,11 +35157,11 @@ const useSidebarToggle = () => {
     handleSortSidebarToggle
   };
 };
-const _hoisted_1$O = {
+const _hoisted_1$P = {
   key: 0,
   class: "lupa-desktop-toggle-filter-count"
 };
-const _sfc_main$Y = /* @__PURE__ */ defineComponent({
+const _sfc_main$Z = /* @__PURE__ */ defineComponent({
   __name: "DesktopFacetToggle",
   setup(__props) {
     const {
@@ -35035,12 +35183,12 @@ const _sfc_main$Y = /* @__PURE__ */ defineComponent({
         (...args) => unref(handleFilterSidebarToggle) && unref(handleFilterSidebarToggle)(...args))
       }, [
         createTextVNode(toDisplayString(unref(label)) + " ", 1),
-        unref(showMobileFilterCount) && unref(currentFilterCount) > 0 ? (openBlock(), createElementBlock("span", _hoisted_1$O, toDisplayString(unref(currentFilterCount)), 1)) : createCommentVNode("", true)
+        unref(showMobileFilterCount) && unref(currentFilterCount) > 0 ? (openBlock(), createElementBlock("span", _hoisted_1$P, toDisplayString(unref(currentFilterCount)), 1)) : createCommentVNode("", true)
       ], 2);
     };
   }
 });
-const _sfc_main$X = /* @__PURE__ */ defineComponent({
+const _sfc_main$Y = /* @__PURE__ */ defineComponent({
   __name: "DesktopSortToggle",
   setup(__props) {
     const { isSidebarVisible, sortLabel, sortToggleVisible, handleSortSidebarToggle } = useSidebarToggle();
@@ -35056,12 +35204,12 @@ const _sfc_main$X = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$N = { class: "lupa-search-result-facet-section" };
+const _hoisted_1$O = { class: "lupa-search-result-facet-section" };
 const _hoisted_2$z = {
   key: 0,
   class: "lupa-facets-title"
 };
-const _sfc_main$W = /* @__PURE__ */ defineComponent({
+const _sfc_main$X = /* @__PURE__ */ defineComponent({
   __name: "FacetList",
   props: {
     options: {},
@@ -35103,14 +35251,14 @@ const _sfc_main$W = /* @__PURE__ */ defineComponent({
     };
     return (_ctx, _cache) => {
       var _a25;
-      return openBlock(), createElementBlock("div", _hoisted_1$N, [
+      return openBlock(), createElementBlock("div", _hoisted_1$O, [
         _ctx.options.labels.title ? (openBlock(), createElementBlock("div", _hoisted_2$z, toDisplayString(_ctx.options.labels.title), 1)) : createCommentVNode("", true),
         createBaseVNode("div", {
           class: normalizeClass(["lupa-search-result-facet-list", "lupa-" + ((_a25 = displayFacetStyle.value) != null ? _a25 : "")])
         }, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(displayFacets.value, (facet) => {
             var _a26;
-            return openBlock(), createBlock(_sfc_main$Z, {
+            return openBlock(), createBlock(_sfc_main$_, {
               key: facet.key,
               facet,
               currentFilters: currentFiltersValue.value,
@@ -35122,14 +35270,14 @@ const _sfc_main$W = /* @__PURE__ */ defineComponent({
               onExpand: unref(handleFilterSidebarToggle)
             }, null, 8, ["facet", "currentFilters", "options", "clearable", "current-facet-style", "onExpand"]);
           }), 128)),
-          _ctx.facetStyle === "drawer" ? (openBlock(), createBlock(_sfc_main$Y, { key: 0 })) : createCommentVNode("", true),
-          _ctx.facetStyle === "drawer" || _ctx.facetStyle === "top-dropdown" ? (openBlock(), createBlock(_sfc_main$X, { key: 1 })) : createCommentVNode("", true)
+          _ctx.facetStyle === "drawer" ? (openBlock(), createBlock(_sfc_main$Z, { key: 0 })) : createCommentVNode("", true),
+          _ctx.facetStyle === "drawer" || _ctx.facetStyle === "top-dropdown" ? (openBlock(), createBlock(_sfc_main$Y, { key: 1 })) : createCommentVNode("", true)
         ], 2)
       ]);
     };
   }
 });
-const _sfc_main$V = /* @__PURE__ */ defineComponent({
+const _sfc_main$W = /* @__PURE__ */ defineComponent({
   __name: "FacetsButton",
   props: {
     options: {}
@@ -35154,7 +35302,7 @@ const _sfc_main$V = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$U = /* @__PURE__ */ defineComponent({
+const _sfc_main$V = /* @__PURE__ */ defineComponent({
   __name: "FacetsClearButton",
   props: {
     options: {}
@@ -35179,8 +35327,8 @@ const _sfc_main$U = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$M = { class: "lupa-facets-filter-button-wrapper" };
-const _sfc_main$T = /* @__PURE__ */ defineComponent({
+const _hoisted_1$N = { class: "lupa-facets-filter-button-wrapper" };
+const _sfc_main$U = /* @__PURE__ */ defineComponent({
   __name: "Facets",
   props: {
     options: {},
@@ -35288,7 +35436,7 @@ const _sfc_main$T = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock("div", {
         class: normalizeClass(["lupa-search-result-facets", { "lupa-search-result-facets-loading": unref(loadingFacets) }])
       }, [
-        regularFacets.value ? (openBlock(), createBlock(_sfc_main$W, {
+        regularFacets.value ? (openBlock(), createBlock(_sfc_main$X, {
           key: 0,
           options: _ctx.options,
           facets: regularFacets.value,
@@ -35298,13 +35446,13 @@ const _sfc_main$T = /* @__PURE__ */ defineComponent({
           onSelect: handleFacetSelect,
           onClear: clear
         }, null, 8, ["options", "facets", "currentFilters", "facetStyle", "clearable"])) : createCommentVNode("", true),
-        createBaseVNode("div", _hoisted_1$M, [
-          showFilterButton.value ? (openBlock(), createBlock(_sfc_main$U, {
+        createBaseVNode("div", _hoisted_1$N, [
+          showFilterButton.value ? (openBlock(), createBlock(_sfc_main$V, {
             key: 0,
             options: _ctx.options,
             onClear: clearAll
           }, null, 8, ["options"])) : createCommentVNode("", true),
-          showFilterButton.value ? (openBlock(), createBlock(_sfc_main$V, {
+          showFilterButton.value ? (openBlock(), createBlock(_sfc_main$W, {
             key: 1,
             options: _ctx.options,
             onFilter: filter
@@ -35314,12 +35462,12 @@ const _sfc_main$T = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$L = {
+const _hoisted_1$M = {
   key: 0,
   id: "lupa-search-result-filters",
   class: "lupa-search-result-filters"
 };
-const _sfc_main$S = /* @__PURE__ */ defineComponent({
+const _sfc_main$T = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsFilters",
   props: {
     options: {},
@@ -35329,6 +35477,7 @@ const _sfc_main$S = /* @__PURE__ */ defineComponent({
   emits: ["filter"],
   setup(__props, { expose: __expose, emit: __emit }) {
     const categoryFilters = ref(null);
+    const { facetSkeletonEnabled, loadingFacets } = useLoadingSkeleton();
     const props = __props;
     const emit2 = __emit;
     const desktopFiltersVisible = computed(() => {
@@ -35357,30 +35506,42 @@ const _sfc_main$S = /* @__PURE__ */ defineComponent({
     };
     __expose({ fetch: fetch2 });
     return (_ctx, _cache) => {
-      var _a25;
-      return visible.value ? (openBlock(), createElementBlock("div", _hoisted_1$L, [
-        showCurrentFilters.value ? (openBlock(), createBlock(_sfc_main$14, {
-          key: 0,
-          options: _ctx.options.currentFilters,
-          expandable: (_a25 = _ctx.expandable) != null ? _a25 : false
-        }, null, 8, ["options", "expandable"])) : createCommentVNode("", true),
-        _ctx.options.categories ? (openBlock(), createBlock(_sfc_main$12, {
-          key: 1,
-          options: _ctx.options.categories,
-          ref_key: "categoryFilters",
-          ref: categoryFilters
-        }, null, 8, ["options"])) : createCommentVNode("", true),
-        _ctx.options.facets ? (openBlock(), createBlock(_sfc_main$T, {
-          key: 2,
-          options: _ctx.options.facets,
-          "facet-style": _ctx.style,
-          onFilter: filter
-        }, null, 8, ["options", "facet-style"])) : createCommentVNode("", true)
+      return visible.value ? (openBlock(), createElementBlock("div", _hoisted_1$M, [
+        createVNode(_sfc_main$18, {
+          class: "lupa-skeleton-filters",
+          count: 1,
+          enabled: unref(facetSkeletonEnabled),
+          loading: unref(loadingFacets)
+        }, {
+          default: withCtx(() => {
+            var _a25;
+            return [
+              showCurrentFilters.value ? (openBlock(), createBlock(_sfc_main$15, {
+                key: 0,
+                options: _ctx.options.currentFilters,
+                expandable: (_a25 = _ctx.expandable) != null ? _a25 : false
+              }, null, 8, ["options", "expandable"])) : createCommentVNode("", true),
+              _ctx.options.categories ? (openBlock(), createBlock(_sfc_main$13, {
+                key: 1,
+                options: _ctx.options.categories,
+                ref_key: "categoryFilters",
+                ref: categoryFilters
+              }, null, 8, ["options"])) : createCommentVNode("", true),
+              _ctx.options.facets ? (openBlock(), createBlock(_sfc_main$U, {
+                key: 2,
+                options: _ctx.options.facets,
+                "facet-style": _ctx.style,
+                onFilter: filter
+              }, null, 8, ["options", "facet-style"])) : createCommentVNode("", true)
+            ];
+          }),
+          _: 1
+        }, 8, ["enabled", "loading"])
       ])) : createCommentVNode("", true);
     };
   }
 });
-const _hoisted_1$K = { class: "lupa-mobile-sidebar-content" };
+const _hoisted_1$L = { class: "lupa-mobile-sidebar-content" };
 const _hoisted_2$y = { class: "lupa-sidebar-top" };
 const _hoisted_3$q = { class: "lupa-sidebar-title" };
 const _hoisted_4$i = {
@@ -35388,7 +35549,7 @@ const _hoisted_4$i = {
   class: "lupa-sidebar-filter-count"
 };
 const _hoisted_5$c = { class: "lupa-sidebar-filter-options" };
-const _sfc_main$R = /* @__PURE__ */ defineComponent({
+const _sfc_main$S = /* @__PURE__ */ defineComponent({
   __name: "MobileFilterSidebar",
   props: {
     options: {}
@@ -35427,7 +35588,7 @@ const _sfc_main$R = /* @__PURE__ */ defineComponent({
           class: "lupa-sidebar-close",
           onClick: withModifiers(handleMobileToggle, ["stop"])
         }),
-        createBaseVNode("div", _hoisted_1$K, [
+        createBaseVNode("div", _hoisted_1$L, [
           createBaseVNode("div", _hoisted_2$y, [
             createBaseVNode("div", _hoisted_3$q, [
               createTextVNode(toDisplayString(sidebarTitle.value) + " ", 1),
@@ -35439,7 +35600,7 @@ const _sfc_main$R = /* @__PURE__ */ defineComponent({
             })
           ]),
           createBaseVNode("div", _hoisted_5$c, [
-            createVNode(_sfc_main$S, {
+            createVNode(_sfc_main$T, {
               options: _ctx.options,
               expandable: isActiveFiltersExpanded.value,
               style: "sidebar",
@@ -35451,14 +35612,17 @@ const _sfc_main$R = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$J = { id: "lupa-search-results-breadcrumbs" };
+const _hoisted_1$K = {
+  key: 0,
+  id: "lupa-search-results-breadcrumbs"
+};
 const _hoisted_2$x = ["href", "onClick"];
 const _hoisted_3$p = {
   key: 1,
   class: "lupa-search-results-breadcrumb-text"
 };
 const _hoisted_4$h = { key: 2 };
-const _sfc_main$Q = /* @__PURE__ */ defineComponent({
+const _sfc_main$R = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsBreadcrumbs",
   props: {
     breadcrumbs: {}
@@ -35476,6 +35640,10 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
     const hasEventRouting = computed(() => {
       return searchResultOptions.value.routingBehavior === "event";
     });
+    const hasBreadcrumbs = computed(() => {
+      var _a25;
+      return ((_a25 = breadcrumbsValue.value) == null ? void 0 : _a25.length) > 0;
+    });
     const getLabel = (label) => {
       return addParamsToLabel(label, `'${currentQueryText.value}'`);
     };
@@ -35483,7 +35651,7 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
       handleRoutingEvent(link, event, hasEventRouting.value);
     };
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$J, [
+      return hasBreadcrumbs.value ? (openBlock(), createElementBlock("div", _hoisted_1$K, [
         (openBlock(true), createElementBlock(Fragment, null, renderList(breadcrumbsValue.value, (breadcrumb, index) => {
           var _a25;
           return openBlock(), createElementBlock("span", {
@@ -35502,16 +35670,16 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
             index < breadcrumbsValue.value.length - 1 ? (openBlock(), createElementBlock("span", _hoisted_4$h, toDisplayString((_a25 = breadcrumb.separator) != null ? _a25 : "/"), 1)) : createCommentVNode("", true)
           ]);
         }), 128))
-      ]);
+      ])) : createCommentVNode("", true);
     };
   }
 });
-const _hoisted_1$I = {
+const _hoisted_1$J = {
   key: 0,
   id: "lupa-search-result-filters",
   class: "lupa-search-result-filters lupa-search-result-top-filters"
 };
-const _sfc_main$P = /* @__PURE__ */ defineComponent({
+const _sfc_main$Q = /* @__PURE__ */ defineComponent({
   __name: "FiltersTopDropdown",
   props: {
     options: {}
@@ -35519,6 +35687,7 @@ const _sfc_main$P = /* @__PURE__ */ defineComponent({
   emits: ["filter"],
   setup(__props, { emit: __emit }) {
     const props = __props;
+    const { facetSkeletonEnabled, loadingFacets } = useLoadingSkeleton();
     const emit2 = __emit;
     const filter = () => {
       emit2("filter");
@@ -35528,21 +35697,33 @@ const _sfc_main$P = /* @__PURE__ */ defineComponent({
       return (_a25 = props.options.visible) != null ? _a25 : true;
     });
     return (_ctx, _cache) => {
-      var _a25;
-      return visible.value ? (openBlock(), createElementBlock("div", _hoisted_1$I, [
-        _ctx.options.facets ? (openBlock(), createBlock(_sfc_main$T, {
-          key: 0,
-          options: _ctx.options.facets,
-          "facet-style": (_a25 = _ctx.options.facets.style) == null ? void 0 : _a25.type,
-          clearable: true,
-          onFilter: filter
-        }, null, 8, ["options", "facet-style"])) : createCommentVNode("", true)
+      return visible.value ? (openBlock(), createElementBlock("div", _hoisted_1$J, [
+        createVNode(_sfc_main$18, {
+          class: "lupa-skeleton-top-dropdown-filters",
+          count: 1,
+          enabled: unref(facetSkeletonEnabled),
+          loading: unref(loadingFacets)
+        }, {
+          default: withCtx(() => {
+            var _a25;
+            return [
+              _ctx.options.facets ? (openBlock(), createBlock(_sfc_main$U, {
+                key: 0,
+                options: _ctx.options.facets,
+                "facet-style": (_a25 = _ctx.options.facets.style) == null ? void 0 : _a25.type,
+                clearable: true,
+                onFilter: filter
+              }, null, 8, ["options", "facet-style"])) : createCommentVNode("", true)
+            ];
+          }),
+          _: 1
+        }, 8, ["enabled", "loading"])
       ])) : createCommentVNode("", true);
     };
   }
 });
-const _hoisted_1$H = { id: "lupa-search-results-layout-selection" };
-const _sfc_main$O = /* @__PURE__ */ defineComponent({
+const _hoisted_1$I = { id: "lupa-search-results-layout-selection" };
+const _sfc_main$P = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsLayoutSelection",
   setup(__props) {
     const searchResultStore = useSearchResultStore();
@@ -35553,7 +35734,7 @@ const _sfc_main$O = /* @__PURE__ */ defineComponent({
       searchResultStore.setLayout(layout2);
     };
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$H, [
+      return openBlock(), createElementBlock("div", _hoisted_1$I, [
         createBaseVNode("div", {
           class: normalizeClass([
             "lupa-layout-selection-grid",
@@ -35575,11 +35756,11 @@ const _sfc_main$O = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$G = {
+const _hoisted_1$H = {
   key: 0,
   class: "lupa-mobile-toggle-filter-count"
 };
-const _sfc_main$N = /* @__PURE__ */ defineComponent({
+const _sfc_main$O = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsMobileToggle",
   setup(__props) {
     const {
@@ -35601,12 +35782,12 @@ const _sfc_main$N = /* @__PURE__ */ defineComponent({
         (...args) => unref(handleFilterSidebarToggle) && unref(handleFilterSidebarToggle)(...args))
       }, [
         createTextVNode(toDisplayString(unref(label)) + " ", 1),
-        unref(showMobileFilterCount) && unref(currentFilterCount) > 0 ? (openBlock(), createElementBlock("span", _hoisted_1$G, toDisplayString(unref(currentFilterCount)), 1)) : createCommentVNode("", true)
+        unref(showMobileFilterCount) && unref(currentFilterCount) > 0 ? (openBlock(), createElementBlock("span", _hoisted_1$H, toDisplayString(unref(currentFilterCount)), 1)) : createCommentVNode("", true)
       ], 2);
     };
   }
 });
-const _sfc_main$M = /* @__PURE__ */ defineComponent({
+const _sfc_main$N = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsMobileFilterClose",
   props: {
     label: {}
@@ -35626,7 +35807,7 @@ const _sfc_main$M = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$F = {
+const _hoisted_1$G = {
   key: 0,
   id: "lupa-search-results-page-select",
   "data-cy": "lupa-search-results-page-select"
@@ -35639,7 +35820,7 @@ const _hoisted_3$o = {
   key: 0,
   class: "lupa-page-number-separator"
 };
-const _sfc_main$L = /* @__PURE__ */ defineComponent({
+const _sfc_main$M = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsPageSelect",
   props: {
     lastPageLabel: {},
@@ -35734,7 +35915,7 @@ const _sfc_main$L = /* @__PURE__ */ defineComponent({
     };
     return (_ctx, _cache) => {
       var _a25;
-      return showPagination.value ? (openBlock(), createElementBlock("div", _hoisted_1$F, [
+      return showPagination.value ? (openBlock(), createElementBlock("div", _hoisted_1$G, [
         showBack.value ? (openBlock(), createBlock(resolveDynamicComponent(tagName.value), {
           key: 0,
           class: normalizeClass(firstPageLabel.value === "<" ? "lupa-page-arrow" : "lupa-show-less"),
@@ -35809,7 +35990,7 @@ const _sfc_main$L = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$E = {
+const _hoisted_1$F = {
   id: "lupa-search-results-page-size",
   "data-cy": "lupa-search-results-page-size"
 };
@@ -35820,7 +36001,7 @@ const _hoisted_3$n = {
 };
 const _hoisted_4$g = ["value", "aria-label"];
 const _hoisted_5$b = ["value"];
-const _sfc_main$K = /* @__PURE__ */ defineComponent({
+const _sfc_main$L = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsPageSize",
   props: {
     labels: {},
@@ -35851,7 +36032,7 @@ const _sfc_main$K = /* @__PURE__ */ defineComponent({
     };
     return (_ctx, _cache) => {
       var _a25, _b25, _c;
-      return openBlock(), createElementBlock("div", _hoisted_1$E, [
+      return openBlock(), createElementBlock("div", _hoisted_1$F, [
         createBaseVNode("div", _hoisted_2$v, [
           createBaseVNode("label", _hoisted_3$n, toDisplayString(label.value), 1),
           createBaseVNode("select", {
@@ -35943,7 +36124,7 @@ const useSorting = () => {
     setSortValue
   };
 };
-const _hoisted_1$D = {
+const _hoisted_1$E = {
   key: 0,
   id: "lupa-search-results-sort",
   class: "lupa-search-results-sort"
@@ -35955,7 +36136,7 @@ const _hoisted_3$m = {
 };
 const _hoisted_4$f = ["aria-label"];
 const _hoisted_5$a = ["value"];
-const _sfc_main$J = /* @__PURE__ */ defineComponent({
+const _sfc_main$K = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsSort",
   setup(__props) {
     const {
@@ -35976,7 +36157,7 @@ const _sfc_main$J = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       var _a25, _b25;
-      return showDefaultSort.value ? (openBlock(), createElementBlock("div", _hoisted_1$D, [
+      return showDefaultSort.value ? (openBlock(), createElementBlock("div", _hoisted_1$E, [
         createBaseVNode("div", _hoisted_2$u, [
           createBaseVNode("label", _hoisted_3$m, toDisplayString(unref(sotyByTitleLabel)), 1),
           withDirectives(createBaseVNode("select", {
@@ -36003,7 +36184,7 @@ const _sfc_main$J = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$I = /* @__PURE__ */ defineComponent({
+const _sfc_main$J = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsSortDrawerToggle",
   setup(__props) {
     const { isSidebarVisible, sortLabel, sortToggleVisible, handleSortSidebarToggle } = useSidebarToggle();
@@ -36019,7 +36200,7 @@ const _sfc_main$I = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$C = { class: "lupa-toolbar-left" };
+const _hoisted_1$D = { class: "lupa-toolbar-left" };
 const _hoisted_2$t = {
   key: 0,
   class: "lupa-toolbar-right-title"
@@ -36034,7 +36215,7 @@ const _hoisted_7$2 = {
 };
 const _hoisted_8 = { key: 2 };
 const _hoisted_9 = { key: 4 };
-const _sfc_main$H = /* @__PURE__ */ defineComponent({
+const _sfc_main$I = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsToolbar",
   props: {
     options: {},
@@ -36147,16 +36328,16 @@ const _sfc_main$H = /* @__PURE__ */ defineComponent({
         id: "lupa-search-results-toolbar",
         class: normalizeClass({ "lupa-filter-no-results": !hasResults.value })
       }, [
-        createBaseVNode("div", _hoisted_1$C, [
+        createBaseVNode("div", _hoisted_1$D, [
           toolbarLeftLabel.value ? (openBlock(), createElementBlock("div", _hoisted_2$t, toDisplayString(toolbarLeftLabel.value), 1)) : createCommentVNode("", true),
-          showLayoutSelection.value ? (openBlock(), createBlock(_sfc_main$O, { key: 1 })) : (openBlock(), createElementBlock("div", _hoisted_3$l)),
-          showItemSummary.value ? (openBlock(), createBlock(_sfc_main$17, {
+          showLayoutSelection.value ? (openBlock(), createBlock(_sfc_main$P, { key: 1 })) : (openBlock(), createElementBlock("div", _hoisted_3$l)),
+          showItemSummary.value ? (openBlock(), createBlock(_sfc_main$1b, {
             key: 3,
             label: searchSummaryLabel.value,
             clearable: unref(hasAnyFilter) && showFilterClear.value,
             onClear: handleClearAll
           }, null, 8, ["label", "clearable"])) : (openBlock(), createElementBlock("div", _hoisted_4$e)),
-          displayPageSelect.value ? (openBlock(), createBlock(_sfc_main$L, {
+          displayPageSelect.value ? (openBlock(), createBlock(_sfc_main$M, {
             key: 5,
             options: paginationOptions.value.pageSelect,
             "last-page-label": paginationOptions.value.labels.showMore,
@@ -36165,19 +36346,19 @@ const _sfc_main$H = /* @__PURE__ */ defineComponent({
         ]),
         createBaseVNode("div", _hoisted_6$4, [
           toolbarRightLabel.value ? (openBlock(), createElementBlock("div", _hoisted_7$2, toDisplayString(toolbarRightLabel.value), 1)) : createCommentVNode("", true),
-          createVNode(_sfc_main$N),
-          createVNode(_sfc_main$I),
-          paginationDisplay.value.pageSize ? (openBlock(), createBlock(_sfc_main$K, {
+          createVNode(_sfc_main$O),
+          createVNode(_sfc_main$J),
+          paginationDisplay.value.pageSize ? (openBlock(), createBlock(_sfc_main$L, {
             key: 1,
             options: paginationOptions.value.pageSize,
             labels: paginationOptions.value.labels
           }, null, 8, ["options", "labels"])) : (openBlock(), createElementBlock("div", _hoisted_8)),
-          sortOptions.value ? (openBlock(), createBlock(_sfc_main$J, {
+          sortOptions.value ? (openBlock(), createBlock(_sfc_main$K, {
             key: 3,
             options: sortOptions.value,
             callbacks: callbacks.value
           }, null, 8, ["options", "callbacks"])) : (openBlock(), createElementBlock("div", _hoisted_9)),
-          showFiltersCloseButton.value && unref(isFilterSidebarVisible) ? (openBlock(), createBlock(_sfc_main$M, {
+          showFiltersCloseButton.value && unref(isFilterSidebarVisible) ? (openBlock(), createBlock(_sfc_main$N, {
             key: 5,
             label: optionsValue.value.labels.mobileFilterCloseButton
           }, null, 8, ["label"])) : createCommentVNode("", true)
@@ -36186,7 +36367,7 @@ const _sfc_main$H = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$G = /* @__PURE__ */ defineComponent({
+const _sfc_main$H = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsProductImage",
   props: {
     item: {},
@@ -36194,7 +36375,7 @@ const _sfc_main$G = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(_sfc_main$1w, {
+      return openBlock(), createBlock(_sfc_main$1A, {
         item: _ctx.item,
         options: _ctx.options,
         "wrapper-class": "lupa-search-results-image-wrapper",
@@ -36203,7 +36384,7 @@ const _sfc_main$G = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$B = ["title", "innerHTML"];
+const _hoisted_1$C = ["title", "innerHTML"];
 const _hoisted_2$s = ["title"];
 const _hoisted_3$k = ["href", "innerHTML"];
 const _hoisted_4$d = ["title"];
@@ -36212,7 +36393,7 @@ const _hoisted_5$8 = {
   class: "lupa-search-results-product-title-text"
 };
 const _hoisted_6$3 = ["href"];
-const _sfc_main$F = /* @__PURE__ */ defineComponent({
+const _sfc_main$G = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsProductTitle",
   props: {
     item: {},
@@ -36249,7 +36430,7 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
         style: normalizeStyle(`-webkit-line-clamp: ${maxLines.value}`),
         title: sanitizedTitle.value,
         innerHTML: sanitizedTitle.value
-      }, null, 12, _hoisted_1$B)) : isHtml.value && _ctx.options.link ? (openBlock(), createElementBlock("div", {
+      }, null, 12, _hoisted_1$C)) : isHtml.value && _ctx.options.link ? (openBlock(), createElementBlock("div", {
         key: 1,
         class: "lupa-search-results-product-title",
         style: normalizeStyle(`-webkit-line-clamp: ${maxLines.value}`),
@@ -36278,8 +36459,8 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$A = ["innerHTML"];
-const _sfc_main$E = /* @__PURE__ */ defineComponent({
+const _hoisted_1$B = ["innerHTML"];
+const _sfc_main$F = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsProductDescription",
   props: {
     item: {},
@@ -36306,7 +36487,7 @@ const _sfc_main$E = /* @__PURE__ */ defineComponent({
         class: "lupa-search-results-product-description",
         style: normalizeStyle(`-webkit-line-clamp: ${maxLines.value}`),
         innerHTML: sanitizedDescription.value
-      }, null, 12, _hoisted_1$A)) : (openBlock(), createElementBlock("div", {
+      }, null, 12, _hoisted_1$B)) : (openBlock(), createElementBlock("div", {
         key: 1,
         class: "lupa-search-results-product-description",
         style: normalizeStyle(`-webkit-line-clamp: ${maxLines.value}`)
@@ -36314,7 +36495,7 @@ const _sfc_main$E = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$z = { id: "lupa-search-results-rating" };
+const _hoisted_1$A = { id: "lupa-search-results-rating" };
 const _hoisted_2$r = { class: "lupa-ratings" };
 const _hoisted_3$j = { class: "lupa-ratings-base" };
 const _hoisted_4$c = ["innerHTML"];
@@ -36322,7 +36503,7 @@ const _hoisted_5$7 = { class: "lupa-rating-wrapper" };
 const _hoisted_6$2 = ["innerHTML"];
 const _hoisted_7$1 = ["href"];
 const STAR_COUNT = 5;
-const _sfc_main$D = /* @__PURE__ */ defineComponent({
+const _sfc_main$E = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsProductRating",
   props: {
     item: {},
@@ -36359,7 +36540,7 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
       return generateLink(props.options.links.ratingDetails, props.item);
     });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$z, [
+      return openBlock(), createElementBlock("div", _hoisted_1$A, [
         createBaseVNode("div", _hoisted_2$r, [
           createBaseVNode("div", _hoisted_3$j, [
             (openBlock(true), createElementBlock(Fragment, null, renderList(baseStars.value, (star, index) => {
@@ -36393,11 +36574,11 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$y = {
+const _hoisted_1$z = {
   class: "lupa-search-results-product-regular-price",
   "data-cy": "lupa-search-results-product-regular-price"
 };
-const _sfc_main$C = /* @__PURE__ */ defineComponent({
+const _sfc_main$D = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsProductRegularPrice",
   props: {
     item: {},
@@ -36419,11 +36600,11 @@ const _sfc_main$C = /* @__PURE__ */ defineComponent({
       );
     });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$y, toDisplayString(price.value), 1);
+      return openBlock(), createElementBlock("div", _hoisted_1$z, toDisplayString(price.value), 1);
     };
   }
 });
-const _sfc_main$B = /* @__PURE__ */ defineComponent({
+const _sfc_main$C = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsProductPrice",
   props: {
     item: {},
@@ -36457,12 +36638,12 @@ const _sfc_main$B = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$x = { class: "lupa-search-results-add-to-cart-wrapper" };
+const _hoisted_1$y = { class: "lupa-search-results-add-to-cart-wrapper" };
 const _hoisted_2$q = { class: "lupa-search-results-product-addtocart" };
 const _hoisted_3$i = ["disabled"];
 const _hoisted_4$b = ["href"];
 const _hoisted_5$6 = ["id", "disabled"];
-const _sfc_main$A = /* @__PURE__ */ defineComponent({
+const _sfc_main$B = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsProductAddToCart",
   props: {
     item: {},
@@ -36521,7 +36702,7 @@ const _sfc_main$A = /* @__PURE__ */ defineComponent({
       loading.value = false;
     });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$x, [
+      return openBlock(), createElementBlock("div", _hoisted_1$y, [
         createBaseVNode("div", _hoisted_2$q, [
           hasLink.value ? (openBlock(), createElementBlock("button", mergeProps({
             key: 0,
@@ -36544,12 +36725,12 @@ const _sfc_main$A = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$w = ["innerHTML"];
+const _hoisted_1$x = ["innerHTML"];
 const _hoisted_2$p = { key: 0 };
 const _hoisted_3$h = { key: 1 };
 const _hoisted_4$a = { class: "lupa-search-box-custom-label" };
 const _hoisted_5$5 = { class: "lupa-search-box-custom-text" };
-const _sfc_main$z = /* @__PURE__ */ defineComponent({
+const _sfc_main$A = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsProductCustom",
   props: {
     item: {},
@@ -36591,7 +36772,7 @@ const _sfc_main$z = /* @__PURE__ */ defineComponent({
         key: 0,
         class: className.value,
         innerHTML: text.value
-      }, toHandlers(_ctx.options.action ? { click: handleClick } : {})), null, 16, _hoisted_1$w)) : (openBlock(), createElementBlock("div", mergeProps({
+      }, toHandlers(_ctx.options.action ? { click: handleClick } : {})), null, 16, _hoisted_1$x)) : (openBlock(), createElementBlock("div", mergeProps({
         key: 1,
         class: className.value
       }, toHandlers(_ctx.options.action ? { click: handleClick } : {})), [
@@ -36603,8 +36784,8 @@ const _sfc_main$z = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$v = ["innerHTML"];
-const _sfc_main$y = /* @__PURE__ */ defineComponent({
+const _hoisted_1$w = ["innerHTML"];
+const _sfc_main$z = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsProductCustomHtmlElement",
   props: {
     item: {},
@@ -36640,15 +36821,15 @@ const _sfc_main$y = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock("div", mergeProps({
         class: className.value,
         innerHTML: text.value
-      }, toHandlers(_ctx.options.action ? { click: handleClick } : {})), null, 16, _hoisted_1$v);
+      }, toHandlers(_ctx.options.action ? { click: handleClick } : {})), null, 16, _hoisted_1$w);
     };
   }
 });
-const _hoisted_1$u = { id: "lupa-search-results-rating" };
+const _hoisted_1$v = { id: "lupa-search-results-rating" };
 const _hoisted_2$o = ["innerHTML"];
 const _hoisted_3$g = { class: "lupa-ratings" };
 const _hoisted_4$9 = ["href"];
-const _sfc_main$x = /* @__PURE__ */ defineComponent({
+const _sfc_main$y = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsProductSingleStarRating",
   props: {
     item: {},
@@ -36676,7 +36857,7 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
       return RATING_STAR_HTML;
     });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$u, [
+      return openBlock(), createElementBlock("div", _hoisted_1$v, [
         createBaseVNode("div", {
           innerHTML: star.value,
           class: "lupa-rating lupa-rating-highlighted"
@@ -36692,19 +36873,19 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
 });
 const __default__ = {
   components: {
-    SearchResultsProductImage: _sfc_main$G,
-    SearchResultsProductTitle: _sfc_main$F,
-    SearchResultsProductDescription: _sfc_main$E,
-    SearchResultsProductRating: _sfc_main$D,
-    SearchResultsProductRegularPrice: _sfc_main$C,
-    SearchResultsProductPrice: _sfc_main$B,
-    SearchResultsProductAddToCart: _sfc_main$A,
-    SearchResultsProductCustom: _sfc_main$z,
-    SearchResultsProductCustomHtmlElement: _sfc_main$y,
-    SearchResultsProductSingleStarRating: _sfc_main$x
-  }
-};
-const _sfc_main$w = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValues2({}, __default__), {
+    SearchResultsProductImage: _sfc_main$H,
+    SearchResultsProductTitle: _sfc_main$G,
+    SearchResultsProductDescription: _sfc_main$F,
+    SearchResultsProductRating: _sfc_main$E,
+    SearchResultsProductRegularPrice: _sfc_main$D,
+    SearchResultsProductPrice: _sfc_main$C,
+    SearchResultsProductAddToCart: _sfc_main$B,
+    SearchResultsProductCustom: _sfc_main$A,
+    SearchResultsProductCustomHtmlElement: _sfc_main$z,
+    SearchResultsProductSingleStarRating: _sfc_main$y
+  }
+};
+const _sfc_main$x = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValues2({}, __default__), {
   __name: "SearchResultsProductCardElement",
   props: {
     item: {},
@@ -36782,13 +36963,13 @@ const _sfc_main$w = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValue
     };
   }
 }));
-const _hoisted_1$t = ["href"];
+const _hoisted_1$u = ["href"];
 const _hoisted_2$n = {
   key: 0,
   class: "lupa-out-of-stock"
 };
 const _hoisted_3$f = { class: "lupa-search-result-product-details-section" };
-const _sfc_main$v = /* @__PURE__ */ defineComponent({
+const _sfc_main$w = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsProductCard",
   props: {
     product: {},
@@ -36965,7 +37146,7 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
         default: withCtx(() => {
           var _a25;
           return [
-            createVNode(_sfc_main$1g, { options: badgesOptions.value }, null, 8, ["options"]),
+            createVNode(_sfc_main$1k, { options: badgesOptions.value }, null, 8, ["options"]),
             createBaseVNode("div", {
               class: normalizeClass(["lupa-search-result-product-contents", listLayoutClass.value])
             }, [
@@ -36975,7 +37156,7 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
                 onClick: handleNavigation
               }, [
                 (openBlock(true), createElementBlock(Fragment, null, renderList(imageElements.value, (element) => {
-                  return openBlock(), createBlock(_sfc_main$w, {
+                  return openBlock(), createBlock(_sfc_main$x, {
                     class: "lupa-search-results-product-element",
                     item: _ctx.product,
                     element,
@@ -36986,16 +37167,16 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
                     onProductEvent: handleProductEvent
                   }, null, 8, ["item", "element", "labels", "inStock", "link"]);
                 }), 128)),
-                createVNode(_sfc_main$1g, {
+                createVNode(_sfc_main$1k, {
                   options: badgesOptions.value,
                   position: "image",
                   class: "lupa-image-badges"
                 }, null, 8, ["options"]),
                 ((_a25 = labels.value) == null ? void 0 : _a25.outOfStock) && !isInStock.value ? (openBlock(), createElementBlock("div", _hoisted_2$n, toDisplayString(labels.value.outOfStock), 1)) : createCommentVNode("", true)
-              ], 8, _hoisted_1$t),
+              ], 8, _hoisted_1$u),
               createBaseVNode("div", _hoisted_3$f, [
                 (openBlock(true), createElementBlock(Fragment, null, renderList(detailElements.value, (element) => {
-                  return openBlock(), createBlock(_sfc_main$w, {
+                  return openBlock(), createBlock(_sfc_main$x, {
                     class: "lupa-search-results-product-element",
                     item: _ctx.product,
                     element,
@@ -37013,7 +37194,7 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
                   class: normalizeClass("lupa-element-group-" + group)
                 }, [
                   (openBlock(true), createElementBlock(Fragment, null, renderList(getGroupElements(group), (element) => {
-                    return openBlock(), createBlock(_sfc_main$w, {
+                    return openBlock(), createBlock(_sfc_main$x, {
                       class: "lupa-search-results-product-element",
                       item: _ctx.product,
                       element,
@@ -37034,7 +37215,7 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$s = {
+const _hoisted_1$t = {
   id: "lupa-search-results-similar-queries",
   "data-cy": "lupa-search-results-similar-queries"
 };
@@ -37050,7 +37231,7 @@ const _hoisted_7 = {
   class: "lupa-products",
   "data-cy": "lupa-products"
 };
-const _sfc_main$u = /* @__PURE__ */ defineComponent({
+const _sfc_main$v = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsSimilarQueries",
   props: {
     labels: {},
@@ -37088,7 +37269,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
       };
     };
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$s, [
+      return openBlock(), createElementBlock("div", _hoisted_1$t, [
         createBaseVNode("div", _hoisted_2$m, toDisplayString(_ctx.labels.similarQueries), 1),
         (openBlock(true), createElementBlock(Fragment, null, renderList(similarQueries.value, (similarQuery, index) => {
           return openBlock(), createElementBlock("div", { key: index }, [
@@ -37108,7 +37289,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
             ]),
             createBaseVNode("div", _hoisted_7, [
               (openBlock(true), createElementBlock(Fragment, null, renderList(similarQuery.items, (product, index2) => {
-                return openBlock(), createBlock(_sfc_main$v, {
+                return openBlock(), createBlock(_sfc_main$w, {
                   style: normalizeStyle(_ctx.columnSize),
                   key: getDocumentKey(index2, product),
                   product,
@@ -37123,7 +37304,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$r = {
+const _hoisted_1$s = {
   key: 0,
   class: "lupa-results-additional-panel"
 };
@@ -37131,7 +37312,7 @@ const _hoisted_2$l = {
   class: "lupa-results-additional-panel-items",
   "data-cy": "lupa-results-additional-panel-items"
 };
-const _sfc_main$t = /* @__PURE__ */ defineComponent({
+const _sfc_main$u = /* @__PURE__ */ defineComponent({
   __name: "AdditionalPanel",
   props: {
     panel: {},
@@ -37204,10 +37385,10 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
       handleQueryChange();
     });
     return (_ctx, _cache) => {
-      return hasResults.value ? (openBlock(), createElementBlock("div", _hoisted_1$r, [
+      return hasResults.value ? (openBlock(), createElementBlock("div", _hoisted_1$s, [
         createBaseVNode("div", _hoisted_2$l, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(visibleItems.value, (item, index) => {
-            return openBlock(), createBlock(_sfc_main$v, {
+            return openBlock(), createBlock(_sfc_main$w, {
               key: index,
               product: item,
               options: _ctx.panel,
@@ -37225,11 +37406,11 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$q = {
+const _hoisted_1$r = {
   key: 0,
   class: "lupa-results-additional-panels"
 };
-const _sfc_main$s = /* @__PURE__ */ defineComponent({
+const _sfc_main$t = /* @__PURE__ */ defineComponent({
   __name: "AdditionalPanels",
   props: {
     options: {},
@@ -37246,9 +37427,9 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
       return locationPanels.value.length > 0;
     });
     return (_ctx, _cache) => {
-      return isVisible.value ? (openBlock(), createElementBlock("div", _hoisted_1$q, [
+      return isVisible.value ? (openBlock(), createElementBlock("div", _hoisted_1$r, [
         (openBlock(true), createElementBlock(Fragment, null, renderList(locationPanels.value, (panel) => {
-          return openBlock(), createBlock(_sfc_main$t, {
+          return openBlock(), createBlock(_sfc_main$u, {
             key: panel.queryKey,
             panel,
             options: _ctx.sdkOptions
@@ -37265,11 +37446,11 @@ const _export_sfc = (sfc, props) => {
   }
   return target2;
 };
-const _sfc_main$r = {};
-const _hoisted_1$p = { class: "lupa-spinner-wrapper" };
+const _sfc_main$s = {};
+const _hoisted_1$q = { class: "lupa-spinner-wrapper" };
 const _hoisted_2$k = { class: "lupa-spinner" };
 function _sfc_render(_ctx, _cache) {
-  return openBlock(), createElementBlock("div", _hoisted_1$p, [
+  return openBlock(), createElementBlock("div", _hoisted_1$q, [
     createBaseVNode("div", _hoisted_2$k, [
       (openBlock(), createElementBlock(Fragment, null, renderList(12, (x) => {
         return createBaseVNode("div", { key: x });
@@ -37277,8 +37458,8 @@ function _sfc_render(_ctx, _cache) {
     ])
   ]);
 }
-const Spinner = /* @__PURE__ */ _export_sfc(_sfc_main$r, [["render", _sfc_render]]);
-const _hoisted_1$o = {
+const Spinner = /* @__PURE__ */ _export_sfc(_sfc_main$s, [["render", _sfc_render]]);
+const _hoisted_1$p = {
   id: "lupa-search-results-similar-results",
   "data-cy": "lupa-search-results-similar-results"
 };
@@ -37287,7 +37468,7 @@ const _hoisted_3$d = {
   class: "lupa-products",
   "data-cy": "lupa-products"
 };
-const _sfc_main$q = /* @__PURE__ */ defineComponent({
+const _sfc_main$r = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsSimilarResults",
   props: {
     columnSize: {},
@@ -37308,11 +37489,11 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
       };
     });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$o, [
+      return openBlock(), createElementBlock("div", _hoisted_1$p, [
         createBaseVNode("div", _hoisted_2$j, toDisplayString(_ctx.labels.similarResultsLabel), 1),
         createBaseVNode("div", _hoisted_3$d, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(similarResults.value.items, (product, index) => {
-            return openBlock(), createBlock(_sfc_main$v, {
+            return openBlock(), createBlock(_sfc_main$w, {
               style: normalizeStyle(_ctx.columnSize),
               key: getDocumentKey(index, product),
               product,
@@ -37433,7 +37614,7 @@ const extractRelatedSource = (source, searchResults2, options, activeFilters) =>
       return extractFacetsRelatedSource(source, searchResults2, options, activeFilters);
   }
 });
-const _hoisted_1$n = { class: "lupa-related-query-item" };
+const _hoisted_1$o = { class: "lupa-related-query-item" };
 const _hoisted_2$i = { class: "lupa-related-query-image" };
 const _hoisted_3$c = { class: "lupa-related-query-label" };
 const _hoisted_4$7 = { class: "lupa-related-query-title" };
@@ -37441,7 +37622,7 @@ const _hoisted_5$3 = {
   key: 0,
   class: "lupa-related-query-count"
 };
-const _sfc_main$p = /* @__PURE__ */ defineComponent({
+const _sfc_main$q = /* @__PURE__ */ defineComponent({
   __name: "RelatedQueryPanel",
   props: {
     query: {},
@@ -37538,9 +37719,9 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       var _a25;
-      return openBlock(), createElementBlock("div", _hoisted_1$n, [
+      return openBlock(), createElementBlock("div", _hoisted_1$o, [
         createBaseVNode("div", _hoisted_2$i, [
-          itemToDisplay.value && image.value ? (openBlock(), createBlock(_sfc_main$1w, {
+          itemToDisplay.value && image.value ? (openBlock(), createBlock(_sfc_main$1A, {
             key: 0,
             "wrapper-class": "lupa-related-query-image-wrapper",
             "image-class": "lupa-related-query-image",
@@ -37556,7 +37737,7 @@ const _sfc_main$p = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$m = {
+const _hoisted_1$n = {
   key: 0,
   class: "lupa-related-queries"
 };
@@ -37565,7 +37746,7 @@ const _hoisted_2$h = {
   class: "lupa-related-queries-title"
 };
 const _hoisted_3$b = ["onClick"];
-const _sfc_main$o = /* @__PURE__ */ defineComponent({
+const _sfc_main$p = /* @__PURE__ */ defineComponent({
   __name: "RelatedQueries",
   props: {
     options: {}
@@ -37659,7 +37840,7 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
     };
     return (_ctx, _cache) => {
       var _a25, _b25, _c, _d;
-      return _ctx.options && hasEnoughRelatedQueries.value ? (openBlock(), createElementBlock("div", _hoisted_1$m, [
+      return _ctx.options && hasEnoughRelatedQueries.value ? (openBlock(), createElementBlock("div", _hoisted_1$n, [
         ((_b25 = (_a25 = _ctx.options) == null ? void 0 : _a25.labels) == null ? void 0 : _b25.title) ? (openBlock(), createElementBlock("h3", _hoisted_2$h, toDisplayString((_d = (_c = _ctx.options) == null ? void 0 : _c.labels) == null ? void 0 : _d.title), 1)) : createCommentVNode("", true),
         createBaseVNode("ul", null, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(relatedQueries2.value, (query) => {
@@ -37670,7 +37851,7 @@ const _sfc_main$o = /* @__PURE__ */ defineComponent({
               createBaseVNode("a", {
                 onClick: ($event) => handleRelatedQueryClick(query)
               }, [
-                createVNode(_sfc_main$p, {
+                createVNode(_sfc_main$q, {
                   "source-key": query.key,
                   options: _ctx.options,
                   query: query.value,
@@ -37714,13 +37895,13 @@ const extractRedirectionSuggestion = (searchText = "", options) => {
   }
   return null;
 };
-const _hoisted_1$l = {
+const _hoisted_1$m = {
   key: 0,
   class: "lupa-redirection-suggestion"
 };
 const _hoisted_2$g = { class: "lupa-redirections-suggestion-label" };
 const _hoisted_3$a = ["href"];
-const _sfc_main$n = /* @__PURE__ */ defineComponent({
+const _sfc_main$o = /* @__PURE__ */ defineComponent({
   __name: "RedirectionSuggestions",
   props: {
     options: {}
@@ -37743,7 +37924,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
       )
     );
     return (_ctx, _cache) => {
-      return redirectionSuggestion.value && label.value && link.value ? (openBlock(), createElementBlock("div", _hoisted_1$l, [
+      return redirectionSuggestion.value && label.value && link.value ? (openBlock(), createElementBlock("div", _hoisted_1$m, [
         createBaseVNode("h4", _hoisted_2$g, [
           createBaseVNode("a", { href: link.value }, toDisplayString(label.value), 9, _hoisted_3$a)
         ])
@@ -37751,11 +37932,11 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$k = {
+const _hoisted_1$l = {
   key: 0,
   class: "lupa-refiners-loading-notice"
 };
-const _sfc_main$m = /* @__PURE__ */ defineComponent({
+const _sfc_main$n = /* @__PURE__ */ defineComponent({
   __name: "RefinersLoadingNotice",
   props: {
     labels: {}
@@ -37766,14 +37947,14 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
     const props = __props;
     const label = computed(() => props.labels.refinersLoadingNotice);
     return (_ctx, _cache) => {
-      return label.value && unref(loadingRefiners) ? (openBlock(), createElementBlock("div", _hoisted_1$k, [
+      return label.value && unref(loadingRefiners) ? (openBlock(), createElementBlock("div", _hoisted_1$l, [
         createBaseVNode("p", null, toDisplayString(label.value), 1),
         createVNode(Spinner)
       ])) : createCommentVNode("", true);
     };
   }
 });
-const _hoisted_1$j = { class: "lupa-related-query-item" };
+const _hoisted_1$k = { class: "lupa-related-query-item" };
 const _hoisted_2$f = { class: "lupa-related-query-image" };
 const _hoisted_3$9 = { class: "lupa-related-query-label" };
 const _hoisted_4$6 = { class: "lupa-related-query-title" };
@@ -37781,7 +37962,7 @@ const _hoisted_5$2 = {
   key: 0,
   class: "lupa-related-query-count"
 };
-const _sfc_main$l = /* @__PURE__ */ defineComponent({
+const _sfc_main$m = /* @__PURE__ */ defineComponent({
   __name: "RelatedQueryPanelApi",
   props: {
     relatedQuery: {},
@@ -37813,9 +37994,9 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       var _a25;
-      return openBlock(), createElementBlock("div", _hoisted_1$j, [
+      return openBlock(), createElementBlock("div", _hoisted_1$k, [
         createBaseVNode("div", _hoisted_2$f, [
-          itemToDisplay.value && image.value ? (openBlock(), createBlock(_sfc_main$1w, {
+          itemToDisplay.value && image.value ? (openBlock(), createBlock(_sfc_main$1A, {
             key: 0,
             "wrapper-class": "lupa-related-query-image-wrapper",
             "image-class": "lupa-related-query-image",
@@ -37831,7 +38012,7 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$i = {
+const _hoisted_1$j = {
   key: 0,
   class: "lupa-related-queries"
 };
@@ -37840,7 +38021,7 @@ const _hoisted_2$e = {
   class: "lupa-related-queries-title"
 };
 const _hoisted_3$8 = ["onClick"];
-const _sfc_main$k = /* @__PURE__ */ defineComponent({
+const _sfc_main$l = /* @__PURE__ */ defineComponent({
   __name: "RelatedQueriesApi",
   props: {
     options: {}
@@ -37892,7 +38073,7 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent({
     };
     return (_ctx, _cache) => {
       var _a25, _b25, _c, _d;
-      return hasEnoughRelatedQueries.value ? (openBlock(), createElementBlock("div", _hoisted_1$i, [
+      return hasEnoughRelatedQueries.value ? (openBlock(), createElementBlock("div", _hoisted_1$j, [
         ((_b25 = (_a25 = _ctx.options) == null ? void 0 : _a25.labels) == null ? void 0 : _b25.title) ? (openBlock(), createElementBlock("h3", _hoisted_2$e, toDisplayString((_d = (_c = _ctx.options) == null ? void 0 : _c.labels) == null ? void 0 : _d.title), 1)) : createCommentVNode("", true),
         createBaseVNode("ul", null, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(relatedQueries2.value, (query) => {
@@ -37903,7 +38084,7 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent({
               createBaseVNode("a", {
                 onClick: ($event) => handleRelatedQueryClick(query)
               }, [
-                createVNode(_sfc_main$l, {
+                createVNode(_sfc_main$m, {
                   relatedQuery: query,
                   options: _ctx.options
                 }, null, 8, ["relatedQuery", "options"])
@@ -37915,9 +38096,9 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$h = { key: 0 };
+const _hoisted_1$i = { key: 0 };
 const _hoisted_2$d = ["innerHTML"];
-const _sfc_main$j = /* @__PURE__ */ defineComponent({
+const _sfc_main$k = /* @__PURE__ */ defineComponent({
   __name: "ZeroResults",
   props: {
     emptyResultsLabel: {},
@@ -37946,7 +38127,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock(Fragment, null, [
-        showDefaultZeroResultsTemplate.value ? (openBlock(), createElementBlock("div", _hoisted_1$h, [
+        showDefaultZeroResultsTemplate.value ? (openBlock(), createElementBlock("div", _hoisted_1$i, [
           createTextVNode(toDisplayString(_ctx.emptyResultsLabel) + " ", 1),
           createBaseVNode("span", null, toDisplayString(_ctx.currentQueryText), 1)
         ])) : createCommentVNode("", true),
@@ -37958,6 +38139,31 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
     };
   }
 });
+const _hoisted_1$h = {
+  key: 1,
+  class: "lupa-skeleton-grid"
+};
+const _sfc_main$j = /* @__PURE__ */ defineComponent({
+  __name: "LoadingGrid",
+  props: {
+    style: {},
+    enabled: { type: Boolean },
+    loading: { type: Boolean },
+    count: {}
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return !_ctx.loading || !_ctx.enabled ? renderSlot(_ctx.$slots, "default", { key: 0 }) : (openBlock(), createElementBlock("div", _hoisted_1$h, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.count, (n) => {
+          return openBlock(), createBlock(_sfc_main$1a, {
+            key: n,
+            style: normalizeStyle(_ctx.style)
+          }, null, 8, ["style"]);
+        }), 128))
+      ]));
+    };
+  }
+});
 const _hoisted_1$g = { id: "lupa-search-results-products" };
 const _hoisted_2$c = {
   class: "lupa-products",
@@ -37969,12 +38175,12 @@ const _hoisted_3$7 = {
   "data-cy": "lupa-no-results-in-page"
 };
 const _hoisted_4$5 = {
-  key: 5,
+  key: 3,
   class: "lupa-empty-results",
   "data-cy": "lupa-no-results"
 };
-const _hoisted_5$1 = { key: 6 };
-const _hoisted_6 = { key: 7 };
+const _hoisted_5$1 = { key: 4 };
+const _hoisted_6 = { key: 5 };
 const _sfc_main$i = /* @__PURE__ */ defineComponent({
   __name: "SearchResultsProducts",
   props: {
@@ -37998,6 +38204,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
       loading,
       relatedQueriesApiEnabled
     } = storeToRefs(searchResultStore);
+    const { limit, skeletonEnabled, relatedQueriesSkeletonEnabled, loadingRelatedQueries } = useLoadingSkeleton();
     const emit2 = __emit;
     const productCardOptions = computed(() => {
       return pick(props.options, [
@@ -38024,9 +38231,6 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
       var _a25, _b25, _c;
       return ((_c = (_b25 = (_a25 = props.options.filters) == null ? void 0 : _a25.facets) == null ? void 0 : _b25.style) == null ? void 0 : _c.type) !== "sidebar";
     });
-    const showMobileFilters = computed(() => {
-      return props.options.searchTitlePosition !== "search-results-top";
-    });
     const currentFilterToolbarVisible = computed(() => {
       var _a25, _b25, _c, _d, _e, _f;
       return Boolean(
@@ -38057,12 +38261,12 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
     });
     const columnSize = computed(() => {
       if (props.ssr) {
-        return "";
+        return {};
       }
       if (layout.value === ResultsLayoutEnum.LIST) {
-        return "width: 100%";
+        return { width: "100%" };
       }
-      return `width: ${100 / columnCount.value}%`;
+      return { width: `${100 / columnCount.value}%` };
     });
     const hasSimilarQueries = computed(() => {
       var _a25;
@@ -38098,55 +38302,64 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
       emit2("filter");
     };
     return (_ctx, _cache) => {
-      var _a25, _b25, _c;
+      var _a25, _b25, _c, _d;
       return openBlock(), createElementBlock("div", _hoisted_1$g, [
-        unref(loading) && !unref(isFilterSidebarVisible) ? (openBlock(), createBlock(Spinner, {
+        !unref(skeletonEnabled) && unref(loading) && !unref(isFilterSidebarVisible) ? (openBlock(), createBlock(Spinner, {
           key: 0,
           class: "lupa-loader"
         })) : createCommentVNode("", true),
-        createVNode(_sfc_main$n, {
+        createVNode(_sfc_main$o, {
           options: _ctx.options.redirectionSuggestions
         }, null, 8, ["options"]),
-        createVNode(_sfc_main$s, {
+        createVNode(_sfc_main$t, {
           options: _ctx.options,
           location: "top",
-          sdkOptions: _ctx.options.options
-        }, null, 8, ["options", "sdkOptions"]),
-        showLocalRelatedQueries.value ? (openBlock(), createBlock(_sfc_main$o, {
-          key: 1,
-          options: _ctx.options.relatedQueries
-        }, null, 8, ["options"])) : createCommentVNode("", true),
-        showApiRelatedQueries.value ? (openBlock(), createBlock(_sfc_main$k, {
-          key: 2,
-          options: _ctx.options.relatedQueries
-        }, null, 8, ["options"])) : createCommentVNode("", true),
-        unref(hasResults) ? (openBlock(), createElementBlock(Fragment, { key: 3 }, [
-          showTopFilters.value ? (openBlock(), createBlock(_sfc_main$P, {
+          "sdk-options": _ctx.options.options
+        }, null, 8, ["options", "sdk-options"]),
+        createVNode(_sfc_main$18, {
+          enabled: unref(relatedQueriesSkeletonEnabled),
+          loading: unref(loading) || unref(loadingRelatedQueries),
+          count: 1,
+          class: "lupa-skeleton-related-queries"
+        }, {
+          default: withCtx(() => [
+            showLocalRelatedQueries.value ? (openBlock(), createBlock(_sfc_main$p, {
+              key: 0,
+              options: _ctx.options.relatedQueries
+            }, null, 8, ["options"])) : createCommentVNode("", true),
+            showApiRelatedQueries.value ? (openBlock(), createBlock(_sfc_main$l, {
+              key: 1,
+              options: _ctx.options.relatedQueries
+            }, null, 8, ["options"])) : createCommentVNode("", true)
+          ]),
+          _: 1
+        }, 8, ["enabled", "loading"]),
+        unref(hasResults) ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+          showTopFilters.value ? (openBlock(), createBlock(_sfc_main$Q, {
             key: 0,
             options: (_a25 = _ctx.options.filters) != null ? _a25 : {}
           }, null, 8, ["options"])) : createCommentVNode("", true),
-          showMobileFilters.value ? (openBlock(), createBlock(_sfc_main$H, {
-            key: 1,
+          createVNode(_sfc_main$I, {
             class: "lupa-toolbar-mobile",
             options: _ctx.options,
             "pagination-location": "top",
             onFilter: filter
-          }, null, 8, ["options"])) : createCommentVNode("", true),
-          currentFilterOptions.value && currentFilterPositionDesktop.value === "pageTop" ? (openBlock(), createBlock(_sfc_main$14, {
-            key: 2,
+          }, null, 8, ["options"]),
+          currentFilterOptions.value && currentFilterPositionDesktop.value === "pageTop" ? (openBlock(), createBlock(_sfc_main$15, {
+            key: 1,
             class: normalizeClass(currentFiltersClass.value),
             "data-cy": "lupa-search-result-filters-mobile-toolbar",
             options: currentFilterOptions.value,
             expandable: !desktopFiltersExpanded.value
           }, null, 8, ["class", "options", "expandable"])) : createCommentVNode("", true)
         ], 64)) : createCommentVNode("", true),
-        unref(hasResults) ? (openBlock(), createElementBlock(Fragment, { key: 4 }, [
-          createVNode(_sfc_main$H, {
+        unref(hasResults) ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
+          createVNode(_sfc_main$I, {
             class: "lupa-toolbar-top",
             options: _ctx.options,
             "pagination-location": "top"
           }, null, 8, ["options"]),
-          currentFilterOptions.value && currentFilterPositionDesktop.value === "resultsTop" ? (openBlock(), createBlock(_sfc_main$14, {
+          currentFilterOptions.value && currentFilterPositionDesktop.value === "resultsTop" ? (openBlock(), createBlock(_sfc_main$15, {
             key: 0,
             class: normalizeClass(currentFiltersClass.value),
             "data-cy": "lupa-search-result-filters-mobile-toolbar",
@@ -38154,22 +38367,32 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
             expandable: !desktopFiltersExpanded.value
           }, null, 8, ["class", "options", "expandable"])) : createCommentVNode("", true),
           createBaseVNode("div", _hoisted_2$c, [
-            _ctx.$slots.productCard ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(unref(searchResult).items, (product, index) => {
-              return renderSlot(_ctx.$slots, "productCard", {
-                style: normalizeStyle(columnSize.value),
-                key: getProductKeyAction(index, product),
-                product,
-                options: productCardOptions.value
-              });
-            }), 128)) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(unref(searchResult).items, (product, index) => {
-              return openBlock(), createBlock(_sfc_main$v, {
-                style: normalizeStyle(columnSize.value),
-                key: getProductKeyAction(index, product),
-                product,
-                options: productCardOptions.value,
-                "analytics-metadata": clickMetadata.value
-              }, null, 8, ["style", "product", "options", "analytics-metadata"]);
-            }), 128))
+            createVNode(_sfc_main$j, {
+              enabled: unref(skeletonEnabled),
+              loading: unref(loading),
+              count: (_b25 = unref(limit)) != null ? _b25 : 12,
+              style: normalizeStyle(columnSize.value)
+            }, {
+              default: withCtx(() => [
+                _ctx.$slots.productCard ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(unref(searchResult).items, (product, index) => {
+                  return renderSlot(_ctx.$slots, "productCard", {
+                    key: getProductKeyAction(index, product),
+                    style: normalizeStyle(columnSize.value),
+                    product,
+                    options: productCardOptions.value
+                  });
+                }), 128)) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(unref(searchResult).items, (product, index) => {
+                  return openBlock(), createBlock(_sfc_main$w, {
+                    key: getProductKeyAction(index, product),
+                    style: normalizeStyle(columnSize.value),
+                    product,
+                    options: productCardOptions.value,
+                    "analytics-metadata": clickMetadata.value
+                  }, null, 8, ["style", "product", "options", "analytics-metadata"]);
+                }), 128))
+              ]),
+              _: 3
+            }, 8, ["enabled", "loading", "count", "style"])
           ]),
           unref(isPageEmpty) && _ctx.options.labels.noItemsInPage ? (openBlock(), createElementBlock("div", _hoisted_3$7, [
             createTextVNode(toDisplayString(_ctx.options.labels.noItemsInPage) + " ", 1),
@@ -38179,40 +38402,40 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
               onClick: goToFirstPage
             }, toDisplayString(_ctx.options.labels.backToFirstPage), 1)) : createCommentVNode("", true)
           ])) : createCommentVNode("", true),
-          createVNode(_sfc_main$H, {
+          createVNode(_sfc_main$I, {
             class: "lupa-toolbar-bottom",
             options: _ctx.options,
             "pagination-location": "bottom"
           }, null, 8, ["options"]),
-          createVNode(_sfc_main$s, {
+          createVNode(_sfc_main$t, {
             options: _ctx.options,
             location: "bottom",
-            sdkOptions: _ctx.options.options
-          }, null, 8, ["options", "sdkOptions"])
+            "sdk-options": _ctx.options.options
+          }, null, 8, ["options", "sdk-options"])
         ], 64)) : !unref(loading) && unref(currentQueryText) ? (openBlock(), createElementBlock("div", _hoisted_4$5, [
-          createVNode(_sfc_main$j, {
-            emptyResultsLabel: (_b25 = _ctx.options.labels) == null ? void 0 : _b25.emptyResults,
-            currentQueryText: unref(currentQueryText),
-            hasSimilarQueries: hasSimilarQueries.value || hasSimilarResults.value,
-            zeroResults: (_c = _ctx.options) == null ? void 0 : _c.zeroResults
-          }, null, 8, ["emptyResultsLabel", "currentQueryText", "hasSimilarQueries", "zeroResults"])
+          createVNode(_sfc_main$k, {
+            "empty-results-label": (_c = _ctx.options.labels) == null ? void 0 : _c.emptyResults,
+            "current-query-text": unref(currentQueryText),
+            "has-similar-queries": hasSimilarQueries.value || hasSimilarResults.value,
+            "zero-results": (_d = _ctx.options) == null ? void 0 : _d.zeroResults
+          }, null, 8, ["empty-results-label", "current-query-text", "has-similar-queries", "zero-results"])
         ])) : createCommentVNode("", true),
-        createVNode(_sfc_main$m, {
+        createVNode(_sfc_main$n, {
           labels: _ctx.options.labels
         }, null, 8, ["labels"]),
         hasSimilarQueries.value ? (openBlock(), createElementBlock("div", _hoisted_5$1, [
-          createVNode(_sfc_main$u, {
+          createVNode(_sfc_main$v, {
             labels: similarQueriesLabels.value,
-            columnSize: columnSize.value,
-            productCardOptions: productCardOptions.value
-          }, null, 8, ["labels", "columnSize", "productCardOptions"])
+            "column-size": columnSize.value,
+            "product-card-options": productCardOptions.value
+          }, null, 8, ["labels", "column-size", "product-card-options"])
         ])) : createCommentVNode("", true),
         hasSimilarResults.value ? (openBlock(), createElementBlock("div", _hoisted_6, [
-          createVNode(_sfc_main$q, {
+          createVNode(_sfc_main$r, {
             labels: similarResultsLabels.value,
-            columnSize: columnSize.value,
-            productCardOptions: productCardOptions.value
-          }, null, 8, ["labels", "columnSize", "productCardOptions"])
+            "column-size": columnSize.value,
+            "product-card-options": productCardOptions.value
+          }, null, 8, ["labels", "column-size", "product-card-options"])
         ])) : createCommentVNode("", true),
         renderSlot(_ctx.$slots, "append")
       ]);
@@ -38287,18 +38510,13 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
           ])) : createCommentVNode("", true),
           hasRelatedCategoryChildren.value ? (openBlock(), createElementBlock("div", _hoisted_4$4, [
             (openBlock(true), createElementBlock(Fragment, null, renderList(unref(relatedCategoryChildren), (child) => {
-              return openBlock(), createBlock(_sfc_main$13, {
+              return openBlock(), createBlock(_sfc_main$14, {
                 key: getCategoryKey(child),
                 item: child,
                 options: categoryOptions.value
               }, null, 8, ["item", "options"]);
             }), 128))
-          ])) : createCommentVNode("", true),
-          createVNode(_sfc_main$H, {
-            class: "lupa-toolbar-mobile",
-            "pagination-location": "top",
-            options: _ctx.options
-          }, null, 8, ["options"])
+          ])) : createCommentVNode("", true)
         ])
       ], 2);
     };
@@ -38726,8 +38944,8 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
         class: normalizeClass(["lupa-search-result-wrapper", { "lupa-search-wrapper-no-results": !unref(hasResults) }])
       }, [
         _ctx.isContainer ? (openBlock(), createElementBlock("div", _hoisted_1$c, [
-          createVNode(_sfc_main$18, { labels: didYouMeanLabels.value }, null, 8, ["labels"]),
-          createVNode(_sfc_main$16, {
+          createVNode(_sfc_main$1c, { labels: didYouMeanLabels.value }, null, 8, ["labels"]),
+          createVNode(_sfc_main$17, {
             "show-summary": true,
             options: _ctx.options,
             "is-product-list": (_a25 = _ctx.isProductList) != null ? _a25 : false
@@ -38737,13 +38955,13 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
           key: 1,
           options: _ctx.options
         }, null, 8, ["options"])) : createCommentVNode("", true),
-        _ctx.options.filters ? (openBlock(), createBlock(_sfc_main$R, {
+        _ctx.options.filters ? (openBlock(), createBlock(_sfc_main$S, {
           key: 2,
           options: _ctx.options.filters,
           onFilter: handleParamsChange
         }, null, 8, ["options"])) : createCommentVNode("", true),
         _ctx.options.sort ? (openBlock(), createBlock(_sfc_main$f, { key: 3 })) : createCommentVNode("", true),
-        unref(currentQueryText) || _ctx.isProductList ? (openBlock(), createBlock(_sfc_main$Q, {
+        unref(currentQueryText) || _ctx.isProductList ? (openBlock(), createBlock(_sfc_main$R, {
           key: 4,
           breadcrumbs: _ctx.options.breadcrumbs
         }, null, 8, ["breadcrumbs"])) : createCommentVNode("", true),
@@ -38752,7 +38970,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
           id: "lupa-search-results",
           class: normalizeClass(["top-layout-wrapper", indicatorClasses.value])
         }, [
-          showFilterSidebar.value ? (openBlock(), createBlock(_sfc_main$S, {
+          showFilterSidebar.value ? (openBlock(), createBlock(_sfc_main$T, {
             key: 0,
             options: (_b25 = _ctx.options.filters) != null ? _b25 : {},
             ref_key: "searchResultsFilters",
@@ -38760,8 +38978,8 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
             onFilter: handleParamsChange
           }, null, 8, ["options"])) : createCommentVNode("", true),
           createBaseVNode("div", _hoisted_2$8, [
-            createVNode(_sfc_main$18, { labels: didYouMeanLabels.value }, null, 8, ["labels"]),
-            createVNode(_sfc_main$16, {
+            createVNode(_sfc_main$1c, { labels: didYouMeanLabels.value }, null, 8, ["labels"]),
+            createVNode(_sfc_main$17, {
               options: _ctx.options,
               "is-product-list": (_c = _ctx.isProductList) != null ? _c : false
             }, null, 8, ["options", "is-product-list"]),
@@ -38777,8 +38995,8 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
             }, 8, ["options", "ssr"])
           ])
         ], 2)) : (openBlock(), createElementBlock(Fragment, { key: 6 }, [
-          createVNode(_sfc_main$18, { labels: didYouMeanLabels.value }, null, 8, ["labels"]),
-          createVNode(_sfc_main$16, {
+          createVNode(_sfc_main$1c, { labels: didYouMeanLabels.value }, null, 8, ["labels"]),
+          createVNode(_sfc_main$17, {
             options: _ctx.options,
             "is-product-list": (_d = _ctx.isProductList) != null ? _d : false
           }, null, 8, ["options", "is-product-list"]),
@@ -38786,7 +39004,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
             id: "lupa-search-results",
             class: normalizeClass(indicatorClasses.value)
           }, [
-            showFilterSidebar.value ? (openBlock(), createBlock(_sfc_main$S, {
+            showFilterSidebar.value ? (openBlock(), createBlock(_sfc_main$T, {
               key: 0,
               options: (_e = _ctx.options.filters) != null ? _e : {},
               ref_key: "searchResultsFilters",
@@ -38937,7 +39155,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
           onClick: withModifiers(innerClick, ["stop"])
         }, [
           createBaseVNode("div", _hoisted_1$a, [
-            createVNode(_sfc_main$19, {
+            createVNode(_sfc_main$1d, {
               options: fullSearchBoxOptions.value,
               "is-search-container": true,
               ref_key: "searchBox",
@@ -40525,7 +40743,7 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
                     key: getProductKeyAction(index, product)
                   }, {
                     default: withCtx(() => [
-                      createVNode(_sfc_main$v, {
+                      createVNode(_sfc_main$w, {
                         product,
                         options: _ctx.options,
                         "click-tracking-settings": clickTrackingSettings.value,
@@ -40540,7 +40758,7 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
               _: 1
             }, 16, ["wrap-around"])) : (openBlock(), createElementBlock("div", _hoisted_4$1, [
               (openBlock(true), createElementBlock(Fragment, null, renderList(recommendations2.value, (product, index) => {
-                return openBlock(), createBlock(_sfc_main$v, {
+                return openBlock(), createBlock(_sfc_main$w, {
                   style: normalizeStyle(columnSize.value),
                   key: getProductKeyAction(index, product),
                   product,
@@ -40786,7 +41004,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
             createBaseVNode("a", {
               href: getLink(product)
             }, [
-              createVNode(_sfc_main$G, {
+              createVNode(_sfc_main$H, {
                 item: product,
                 options: image.value
               }, null, 8, ["item", "options"])
@@ -40951,7 +41169,7 @@ const _sfc_main$4$1 = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("section", _hoisted_1$3, [
         (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.searchResults, (product, index) => {
-          return openBlock(), createBlock(_sfc_main$v, {
+          return openBlock(), createBlock(_sfc_main$w, {
             class: "lupa-chat-product-card",
             key: getProductKeyAction(index, product),
             product,
@@ -41147,7 +41365,7 @@ const _hoisted_4 = {
   key: 0,
   class: "lupasearch-chat-content"
 };
-const _sfc_main$1H = /* @__PURE__ */ defineComponent({
+const _sfc_main$1L = /* @__PURE__ */ defineComponent({
   __name: "ChatContainer",
   props: {
     options: {}
@@ -47171,7 +47389,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
     };
     __expose({ fetch: fetch2 });
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(_sfc_main$19), {
+      return openBlock(), createBlock(unref(_sfc_main$1d), {
         ref_key: "searchBox",
         ref: searchBox2,
         options: fullSearchBoxOptions.value
@@ -47832,7 +48050,7 @@ const chat = (options, mountOptions) => {
   const instance = createVue(
     options.displayOptions.containerSelector,
     mountOptions == null ? void 0 : mountOptions.mountingBehavior,
-    _sfc_main$1H,
+    _sfc_main$1L,
     {
       options
     }