@getlupa/vue 0.8.4 → 0.8.5

package/dist/lupaSearch.js

@@ -1757,6 +1757,37 @@ const inputsAreEqual = (input, possibleValues) => {
   const normalizedInput = getNormalizedString(input);
   return possibleValues.some((v) => getNormalizedString(v) === normalizedInput);
 };
+const levenshteinDistance = (s = "", t = "") => {
+  if (!(s == null ? void 0 : s.length)) {
+    return t.length;
+  }
+  if (!(t == null ? void 0 : t.length)) {
+    return s.length;
+  }
+  const arr = [];
+  for (let i = 0; i <= t.length; i++) {
+    arr[i] = [i];
+    for (let j = 1; j <= s.length; j++) {
+      arr[i][j] = i === 0 ? j : Math.min(
+        arr[i - 1][j] + 1,
+        arr[i][j - 1] + 1,
+        arr[i - 1][j - 1] + (s[j - 1] === t[i - 1] ? 0 : 1)
+      );
+    }
+  }
+  return arr[t.length][s.length];
+};
+const findClosestStringValue = (input, possibleValues, key) => {
+  var _a;
+  const directMatch = possibleValues.find((v) => v[key] === input);
+  if (directMatch) {
+    return directMatch;
+  }
+  const distances = possibleValues.map((v) => levenshteinDistance(`${v[key]}`, input));
+  const minDistance = Math.min(...distances);
+  const closestValue = (_a = possibleValues.filter((_, i) => distances[i] === minDistance)) == null ? void 0 : _a[0];
+  return closestValue;
+};
 const initAnalyticsTracking = (analyticsOptions) => {
   try {
     if (analyticsOptions == null ? void 0 : analyticsOptions.enabled) {
@@ -3166,7 +3197,7 @@ const useSearchBoxStore = defineStore("searchBox", () => {
 });
 const _hoisted_1$1c = { id: "lupa-search-box-input-container" };
 const _hoisted_2$P = { class: "lupa-input-clear" };
-const _hoisted_3$B = { id: "lupa-search-box-input" };
+const _hoisted_3$A = { id: "lupa-search-box-input" };
 const _hoisted_4$s = ["value"];
 const _hoisted_5$g = ["aria-label", "placeholder"];
 const _hoisted_6$9 = {
@@ -3261,7 +3292,7 @@ const _sfc_main$1k = /* @__PURE__ */ vue.defineComponent({
             onClick: clear
           }, null, 2)
         ]),
-        vue.createElementVNode("div", _hoisted_3$B, [
+        vue.createElementVNode("div", _hoisted_3$A, [
           vue.createElementVNode("input", {
             class: "lupa-hint",
             "aria-hidden": "true",
@@ -3442,7 +3473,7 @@ const _hoisted_2$N = {
   "data-cy": "lupa-suggestion-value",
   class: "lupa-suggestion-value"
 };
-const _hoisted_3$A = {
+const _hoisted_3$z = {
   key: 2,
   class: "lupa-suggestion-facet",
   "data-cy": "lupa-suggestion-facet"
@@ -3492,7 +3523,7 @@ const _sfc_main$1f = /* @__PURE__ */ vue.defineComponent({
           "data-cy": "lupa-suggestion-value",
           innerHTML: _ctx.suggestion.displayHighlight
         }, null, 8, _hoisted_1$18)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$N, vue.toDisplayString(_ctx.suggestion.display), 1)),
-        _ctx.suggestion.facet ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$A, [
+        _ctx.suggestion.facet ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$z, [
           vue.createElementVNode("span", _hoisted_4$r, vue.toDisplayString(facetLabel.value), 1),
           vue.createElementVNode("span", _hoisted_5$f, vue.toDisplayString(_ctx.suggestion.facet.title), 1)
         ])) : vue.createCommentVNode("", true)
@@ -3906,7 +3937,7 @@ const _sfc_main$17 = /* @__PURE__ */ vue.defineComponent({
 });
 const _hoisted_1$11 = ["innerHTML"];
 const _hoisted_2$K = { key: 0 };
-const _hoisted_3$z = { key: 1 };
+const _hoisted_3$y = { key: 1 };
 const _hoisted_4$q = { class: "lupa-search-box-custom-label" };
 const _hoisted_5$e = { class: "lupa-search-box-custom-text" };
 const _sfc_main$16 = /* @__PURE__ */ vue.defineComponent({
@@ -3939,7 +3970,7 @@ const _sfc_main$16 = /* @__PURE__ */ vue.defineComponent({
         key: 1,
         class: [className.value, "lupa-search-box-product-custom"]
       }, vue.toHandlers(_ctx.options.action ? { click: handleClick } : {}, true)), [
-        !label.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$K, vue.toDisplayString(text.value), 1)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$z, [
+        !label.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$K, vue.toDisplayString(text.value), 1)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$y, [
           vue.createElementVNode("div", _hoisted_4$q, vue.toDisplayString(label.value), 1),
           vue.createElementVNode("div", _hoisted_5$e, vue.toDisplayString(text.value), 1)
         ]))
@@ -4164,7 +4195,7 @@ const useSearchResultStore = defineStore("searchResult", () => {
 });
 const _hoisted_1$$ = { class: "lupa-search-box-add-to-cart-wrapper" };
 const _hoisted_2$J = { class: "lupa-search-box-product-addtocart" };
-const _hoisted_3$y = ["onClick", "disabled"];
+const _hoisted_3$x = ["onClick", "disabled"];
 const _sfc_main$14 = /* @__PURE__ */ vue.defineComponent({
   __name: "SearchBoxProductAddToCart",
   props: {
@@ -4200,7 +4231,7 @@ const _sfc_main$14 = /* @__PURE__ */ vue.defineComponent({
             "data-cy": "lupa-add-to-cart",
             type: "button",
             disabled: !inStockValue.value || loading.value
-          }, vue.toDisplayString(label.value), 11, _hoisted_3$y)
+          }, vue.toDisplayString(label.value), 11, _hoisted_3$x)
         ])
       ]);
     };
@@ -4279,7 +4310,7 @@ const _sfc_main$13 = /* @__PURE__ */ vue.defineComponent(__spreadProps(__spreadV
 }));
 const _hoisted_1$_ = ["href"];
 const _hoisted_2$I = { class: "lupa-search-box-product-image-section" };
-const _hoisted_3$x = { class: "lupa-search-box-product-details-section" };
+const _hoisted_3$w = { class: "lupa-search-box-product-details-section" };
 const _hoisted_4$p = {
   key: 0,
   class: "lupa-search-box-product-add-to-cart-section"
@@ -4352,7 +4383,7 @@ const _sfc_main$12 = /* @__PURE__ */ vue.defineComponent({
             }, null, 8, ["item", "element", "labels", "link"]);
           }), 128))
         ]),
-        vue.createElementVNode("div", _hoisted_3$x, [
+        vue.createElementVNode("div", _hoisted_3$w, [
           (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(detailElements.value, (element) => {
             return vue.openBlock(), vue.createBlock(_sfc_main$13, {
               class: "lupa-search-box-product-element",
@@ -4596,7 +4627,7 @@ const _hoisted_1$Y = {
   id: "lupa-search-box-panel"
 };
 const _hoisted_2$H = ["data-cy"];
-const _hoisted_3$w = {
+const _hoisted_3$v = {
   key: 0,
   class: "lupa-panel-title"
 };
@@ -4748,7 +4779,7 @@ const _sfc_main$$ = /* @__PURE__ */ vue.defineComponent(__spreadProps(__spreadVa
                 ]),
                 "data-cy": "lupa-panel-" + panel.type + "-index"
               }, [
-                ((_a2 = panel.labels) == null ? void 0 : _a2.topResultsTitle) && showTopResultsPanelTitle(panel.queryKey) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$w, vue.toDisplayString((_b = panel.labels) == null ? void 0 : _b.topResultsTitle), 1)) : vue.createCommentVNode("", true),
+                ((_a2 = panel.labels) == null ? void 0 : _a2.topResultsTitle) && showTopResultsPanelTitle(panel.queryKey) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$v, vue.toDisplayString((_b = panel.labels) == null ? void 0 : _b.topResultsTitle), 1)) : vue.createCommentVNode("", true),
                 panel.queryKey ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(getComponent(panel.type)), {
                   key: 1,
                   panel,
@@ -5171,7 +5202,7 @@ const _hoisted_2$F = {
   key: 0,
   "data-cy": "suggested-search-text-label"
 };
-const _hoisted_3$v = {
+const _hoisted_3$u = {
   key: 1,
   "data-cy": "did-you-mean-label"
 };
@@ -5218,7 +5249,7 @@ const _sfc_main$Z = /* @__PURE__ */ vue.defineComponent({
             ]);
           }), 128))
         ])) : vue.createCommentVNode("", true),
-        didYouMeanValue.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$v, [
+        didYouMeanValue.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$u, [
           (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.labels.didYouMean.split(" "), (label, index) => {
             return vue.openBlock(), vue.createElementBlock("span", { key: index }, [
               label.includes("{1}") ? (vue.openBlock(), vue.createElementBlock("span", {
@@ -5272,7 +5303,7 @@ const _hoisted_1$U = {
   "data-cy": "lupa-result-page-title"
 };
 const _hoisted_2$D = { key: 0 };
-const _hoisted_3$u = {
+const _hoisted_3$t = {
   key: 1,
   class: "lupa-results-total-count"
 };
@@ -5315,7 +5346,7 @@ const _sfc_main$X = /* @__PURE__ */ vue.defineComponent({
         showSearchTitle.value ? (vue.openBlock(), vue.createElementBlock("h1", _hoisted_1$U, [
           vue.createTextVNode(vue.toDisplayString(_ctx.options.labels.searchResults), 1),
           queryText.value ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$D, "'" + vue.toDisplayString(queryText.value) + "'", 1)) : vue.createCommentVNode("", true),
-          showProductCount.value ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$u, "(" + vue.toDisplayString(vue.unref(totalItems)) + ")", 1)) : vue.createCommentVNode("", true)
+          showProductCount.value ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$t, "(" + vue.toDisplayString(vue.unref(totalItems)) + ")", 1)) : vue.createCommentVNode("", true)
         ])) : vue.createCommentVNode("", true),
         _ctx.showSummary ? (vue.openBlock(), vue.createBlock(_sfc_main$Y, {
           key: 1,
@@ -5335,7 +5366,7 @@ const _hoisted_2$C = {
   class: "lupa-current-filter-label",
   "data-cy": "lupa-current-filter-label"
 };
-const _hoisted_3$t = {
+const _hoisted_3$s = {
   class: "lupa-current-filter-value",
   "data-cy": "lupa-current-filter-value"
 };
@@ -5357,7 +5388,7 @@ const _sfc_main$W = /* @__PURE__ */ vue.defineComponent({
           onClick: handleClick
         }, "⨉"),
         vue.createElementVNode("div", _hoisted_2$C, vue.toDisplayString(_ctx.filter.label) + ": ", 1),
-        vue.createElementVNode("div", _hoisted_3$t, vue.toDisplayString(_ctx.filter.value), 1)
+        vue.createElementVNode("div", _hoisted_3$s, vue.toDisplayString(_ctx.filter.value), 1)
       ]);
     };
   }
@@ -5367,7 +5398,7 @@ const _hoisted_2$B = {
   key: 0,
   class: "lupa-filter-count"
 };
-const _hoisted_3$s = {
+const _hoisted_3$r = {
   key: 0,
   class: "filter-values"
 };
@@ -5436,7 +5467,7 @@ const _sfc_main$V = /* @__PURE__ */ vue.defineComponent({
             class: vue.normalizeClass(["lupa-filter-title-caret", isOpen.value && "open"])
           }, null, 2)) : vue.createCommentVNode("", true)
         ]),
-        !_ctx.expandable || isOpen.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$s, [
+        !_ctx.expandable || isOpen.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$r, [
           vue.createElementVNode("div", _hoisted_4$l, [
             (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(displayFilters), (filter) => {
               return vue.openBlock(), vue.createBlock(_sfc_main$W, {
@@ -5504,7 +5535,7 @@ const _hoisted_1$Q = {
   "data-cy": "lupa-category-filter"
 };
 const _hoisted_2$A = { class: "lupa-category-back" };
-const _hoisted_3$r = ["href"];
+const _hoisted_3$q = ["href"];
 const _hoisted_4$k = ["href"];
 const _hoisted_5$d = { class: "lupa-child-category-list" };
 const _sfc_main$T = /* @__PURE__ */ vue.defineComponent({
@@ -5600,7 +5631,7 @@ const _sfc_main$T = /* @__PURE__ */ vue.defineComponent({
             "data-cy": "lupa-category-back",
             href: backUrlLink.value,
             onClick: handleNavigationBack
-          }, vue.toDisplayString(backTitle.value), 9, _hoisted_3$r)) : vue.createCommentVNode("", true)
+          }, vue.toDisplayString(backTitle.value), 9, _hoisted_3$q)) : vue.createCommentVNode("", true)
         ]),
         vue.createElementVNode("div", {
           class: vue.normalizeClass(["lupa-current-category", { "lupa-current-category-active": isActive }])
@@ -5630,7 +5661,7 @@ const _hoisted_1$P = {
   "data-cy": "lupa-search-result-facet-term-values"
 };
 const _hoisted_2$z = ["placeholder"];
-const _hoisted_3$q = { class: "lupa-terms-list" };
+const _hoisted_3$p = { class: "lupa-terms-list" };
 const _hoisted_4$j = ["onClick"];
 const _hoisted_5$c = { class: "lupa-term-checkbox-wrapper" };
 const _hoisted_6$8 = { class: "lupa-term-checkbox-label" };
@@ -5720,7 +5751,7 @@ const _sfc_main$S = /* @__PURE__ */ vue.defineComponent({
         }, null, 8, _hoisted_2$z)), [
           [vue.vModelText, termFilter.value]
         ]) : vue.createCommentVNode("", true),
-        vue.createElementVNode("div", _hoisted_3$q, [
+        vue.createElementVNode("div", _hoisted_3$p, [
           (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(displayValues.value, (item) => {
             return vue.openBlock(), vue.createElementBlock("div", {
               class: vue.normalizeClass(["lupa-facet-term", { checked: isChecked(item) }]),
@@ -6733,7 +6764,7 @@ const _hoisted_2$y = {
   key: 0,
   class: "lupa-stats-facet-summary"
 };
-const _hoisted_3$p = {
+const _hoisted_3$o = {
   key: 1,
   class: "lupa-stats-facet-summary-input"
 };
@@ -6919,7 +6950,7 @@ const _sfc_main$R = /* @__PURE__ */ vue.defineComponent({
     };
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$O, [
-        !isInputVisible.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$y, vue.toDisplayString(statsSummary.value), 1)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$p, [
+        !isInputVisible.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$y, vue.toDisplayString(statsSummary.value), 1)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$o, [
           vue.createElementVNode("div", null, [
             rangeLabelFrom.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$i, vue.toDisplayString(rangeLabelFrom.value), 1)) : vue.createCommentVNode("", true),
             vue.createElementVNode("div", _hoisted_5$b, [
@@ -6987,7 +7018,7 @@ const _sfc_main$R = /* @__PURE__ */ vue.defineComponent({
 });
 const _hoisted_1$N = { class: "lupa-term-checkbox-wrapper" };
 const _hoisted_2$x = { class: "lupa-term-checkbox-label" };
-const _hoisted_3$o = { class: "lupa-term-label" };
+const _hoisted_3$n = { class: "lupa-term-label" };
 const _hoisted_4$h = {
   key: 0,
   class: "lupa-term-count"
@@ -7048,7 +7079,7 @@ const _sfc_main$Q = /* @__PURE__ */ vue.defineComponent({
             }, null, 2)
           ]),
           vue.createElementVNode("div", _hoisted_2$x, [
-            vue.createElementVNode("span", _hoisted_3$o, vue.toDisplayString(_ctx.item.title) + vue.toDisplayString(" "), 1),
+            vue.createElementVNode("span", _hoisted_3$n, vue.toDisplayString(_ctx.item.title) + vue.toDisplayString(" "), 1),
             _ctx.options.showDocumentCount ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4$h, "(" + vue.toDisplayString(_ctx.item.count) + ")", 1)) : vue.createCommentVNode("", true)
           ])
         ]),
@@ -7073,7 +7104,7 @@ const _hoisted_1$M = {
   "data-cy": "lupa-search-result-facet-term-values"
 };
 const _hoisted_2$w = { key: 0 };
-const _hoisted_3$n = ["placeholder"];
+const _hoisted_3$m = ["placeholder"];
 const _sfc_main$P = /* @__PURE__ */ vue.defineComponent({
   __name: "HierarchyFacet",
   props: {
@@ -7131,7 +7162,7 @@ const _sfc_main$P = /* @__PURE__ */ vue.defineComponent({
             "data-cy": "lupa-term-filter",
             "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => termFilter.value = $event),
             placeholder: _ctx.options.labels.facetFilter
-          }, null, 8, _hoisted_3$n), [
+          }, null, 8, _hoisted_3$m), [
             [vue.vModelText, termFilter.value]
           ])
         ])) : vue.createCommentVNode("", true),
@@ -7499,7 +7530,7 @@ const _hoisted_1$H = {
   class: "lupa-mobile-filter-sidebar"
 };
 const _hoisted_2$t = ["onClick"];
-const _hoisted_3$m = { class: "lupa-mobile-sidebar-content" };
+const _hoisted_3$l = { class: "lupa-mobile-sidebar-content" };
 const _hoisted_4$g = { class: "lupa-sidebar-top" };
 const _hoisted_5$9 = { class: "lupa-sidebar-title" };
 const _hoisted_6$6 = {
@@ -7538,7 +7569,7 @@ const _sfc_main$K = /* @__PURE__ */ vue.defineComponent({
           class: "lupa-sidebar-close",
           onClick: vue.withModifiers(handleMobileToggle, ["stop"])
         }, null, 8, _hoisted_2$t),
-        vue.createElementVNode("div", _hoisted_3$m, [
+        vue.createElementVNode("div", _hoisted_3$l, [
           vue.createElementVNode("div", _hoisted_4$g, [
             vue.createElementVNode("div", _hoisted_5$9, [
               vue.createTextVNode(vue.toDisplayString(sidebarTitle.value) + " ", 1),
@@ -7562,7 +7593,7 @@ const _sfc_main$K = /* @__PURE__ */ vue.defineComponent({
 });
 const _hoisted_1$G = { id: "lupa-search-results-breadcrumbs" };
 const _hoisted_2$s = ["href", "onClick"];
-const _hoisted_3$l = {
+const _hoisted_3$k = {
   key: 1,
   class: "lupa-search-results-breadcrumb-text"
 };
@@ -7606,7 +7637,7 @@ const _sfc_main$J = /* @__PURE__ */ vue.defineComponent({
                 var _a;
                 return handleNavigation(e, (_a = breadcrumb == null ? void 0 : breadcrumb.link) != null ? _a : "");
               }
-            }, vue.toDisplayString(getLabel(breadcrumb.label)), 9, _hoisted_2$s)) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$l, vue.toDisplayString(getLabel(breadcrumb.label)), 1)),
+            }, vue.toDisplayString(getLabel(breadcrumb.label)), 9, _hoisted_2$s)) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$k, vue.toDisplayString(getLabel(breadcrumb.label)), 1)),
             index < breadcrumbsValue.value.length - 1 ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4$f, " / ")) : vue.createCommentVNode("", true)
           ]);
         }), 128))
@@ -7707,7 +7738,7 @@ const _hoisted_2$r = {
   key: 0,
   class: "lupa-page-number-separator"
 };
-const _hoisted_3$k = ["onClick"];
+const _hoisted_3$j = ["onClick"];
 const _hoisted_4$e = {
   key: 0,
   class: "lupa-page-number-separator"
@@ -7811,7 +7842,7 @@ const _sfc_main$F = /* @__PURE__ */ vue.defineComponent({
               page === _ctx.options.selectedPage ? "lupa-page-number-selected" : ""
             ]),
             "data-cy": "lupa-page-number"
-          }, vue.toDisplayString(page), 11, _hoisted_3$k);
+          }, vue.toDisplayString(page), 11, _hoisted_3$j);
         }), 128)),
         showLastPage.value ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 2 }, [
           showLastPageSeparator.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$e, "...")) : vue.createCommentVNode("", true),
@@ -7838,7 +7869,7 @@ const _hoisted_1$B = {
   "data-cy": "lupa-search-results-page-size"
 };
 const _hoisted_2$q = { id: "lupa-select" };
-const _hoisted_3$j = { class: "lupa-select-label" };
+const _hoisted_3$i = { class: "lupa-select-label" };
 const _hoisted_4$d = ["aria-label"];
 const _sfc_main$E = /* @__PURE__ */ vue.defineComponent({
   __name: "SearchResultsPageSize",
@@ -7859,7 +7890,7 @@ const _sfc_main$E = /* @__PURE__ */ vue.defineComponent({
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$B, [
         vue.createElementVNode("div", _hoisted_2$q, [
-          vue.createElementVNode("label", _hoisted_3$j, vue.toDisplayString(_ctx.label), 1),
+          vue.createElementVNode("label", _hoisted_3$i, vue.toDisplayString(_ctx.label), 1),
           vue.createElementVNode("select", {
             class: "lupa-select-dropdown",
             "aria-label": _ctx.label,
@@ -7882,7 +7913,7 @@ const _hoisted_1$A = {
   class: "lupa-search-results-sort"
 };
 const _hoisted_2$p = { id: "lupa-select" };
-const _hoisted_3$i = { class: "lupa-select-label" };
+const _hoisted_3$h = { class: "lupa-select-label" };
 const _hoisted_4$c = ["aria-label"];
 const _hoisted_5$8 = ["value"];
 const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
@@ -7935,7 +7966,7 @@ const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$A, [
         vue.createElementVNode("div", _hoisted_2$p, [
-          vue.createElementVNode("label", _hoisted_3$i, vue.toDisplayString(_ctx.options.label), 1),
+          vue.createElementVNode("label", _hoisted_3$h, vue.toDisplayString(_ctx.options.label), 1),
           vue.withDirectives(vue.createElementVNode("select", {
             class: "lupa-select-dropdown",
             "aria-label": _ctx.options.label,
@@ -7960,7 +7991,7 @@ const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
 });
 const _hoisted_1$z = { class: "lupa-toolbar-left" };
 const _hoisted_2$o = { key: 1 };
-const _hoisted_3$h = { key: 3 };
+const _hoisted_3$g = { key: 3 };
 const _hoisted_4$b = { key: 5 };
 const _hoisted_5$7 = { class: "lupa-toolbar-right" };
 const _hoisted_6$5 = { key: 1 };
@@ -8071,7 +8102,7 @@ const _sfc_main$C = /* @__PURE__ */ vue.defineComponent({
             label: searchSummaryLabel.value,
             clearable: vue.unref(hasAnyFilter) && showFilterClear.value,
             onClear: handleClearAll
-          }, null, 8, ["label", "clearable"])) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$h)),
+          }, null, 8, ["label", "clearable"])) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$g)),
           displayPageSelect.value ? (vue.openBlock(), vue.createBlock(_sfc_main$F, {
             key: 4,
             options: paginationOptions.value.pageSelect,
@@ -8101,7 +8132,7 @@ const _sfc_main$C = /* @__PURE__ */ vue.defineComponent({
 });
 const _hoisted_1$y = { class: "lupa-badge-title" };
 const _hoisted_2$n = ["src"];
-const _hoisted_3$g = { key: 1 };
+const _hoisted_3$f = { key: 1 };
 const _hoisted_4$a = {
   key: 0,
   class: "lupa-badge-full-text"
@@ -8144,7 +8175,7 @@ const _sfc_main$B = /* @__PURE__ */ vue.defineComponent({
             key: 0,
             src: image.value
           }, null, 8, _hoisted_2$n)) : vue.createCommentVNode("", true),
-          hasTitleText.value && showTitle.value ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$g, vue.toDisplayString(_ctx.badge.titleText), 1)) : vue.createCommentVNode("", true)
+          hasTitleText.value && showTitle.value ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$f, vue.toDisplayString(_ctx.badge.titleText), 1)) : vue.createCommentVNode("", true)
         ]),
         hasAdditionalText.value ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4$a, vue.toDisplayString(_ctx.badge.additionalText), 1)) : vue.createCommentVNode("", true)
       ], 6);
@@ -8371,7 +8402,7 @@ const _sfc_main$v = /* @__PURE__ */ vue.defineComponent({
 });
 const _hoisted_1$s = ["innerHTML"];
 const _hoisted_2$l = ["title"];
-const _hoisted_3$f = {
+const _hoisted_3$e = {
   key: 0,
   class: "lupa-search-results-product-title-text"
 };
@@ -8415,7 +8446,7 @@ const _sfc_main$u = /* @__PURE__ */ vue.defineComponent({
         style: vue.normalizeStyle(`-webkit-line-clamp: ${maxLines.value}`),
         title: title.value
       }, [
-        !_ctx.options.link ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$f, vue.toDisplayString(title.value), 1)) : vue.createCommentVNode("", true),
+        !_ctx.options.link ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$e, vue.toDisplayString(title.value), 1)) : vue.createCommentVNode("", true),
         _ctx.options.link ? (vue.openBlock(), vue.createElementBlock("a", {
           key: 1,
           href: _ctx.link,
@@ -8461,7 +8492,7 @@ const _sfc_main$t = /* @__PURE__ */ vue.defineComponent({
 });
 const _hoisted_1$q = { id: "lupa-search-results-rating" };
 const _hoisted_2$k = { class: "lupa-ratings" };
-const _hoisted_3$e = { class: "lupa-ratings-base" };
+const _hoisted_3$d = { class: "lupa-ratings-base" };
 const _hoisted_4$8 = ["innerHTML"];
 const _hoisted_5$6 = { class: "lupa-rating-wrapper" };
 const _hoisted_6$4 = ["innerHTML"];
@@ -8500,7 +8531,7 @@ const _sfc_main$s = /* @__PURE__ */ vue.defineComponent({
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$q, [
         vue.createElementVNode("div", _hoisted_2$k, [
-          vue.createElementVNode("div", _hoisted_3$e, [
+          vue.createElementVNode("div", _hoisted_3$d, [
             (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(baseStars.value, (star, index) => {
               return vue.openBlock(), vue.createElementBlock("div", {
                 key: index,
@@ -8588,7 +8619,7 @@ const _sfc_main$q = /* @__PURE__ */ vue.defineComponent({
 });
 const _hoisted_1$n = { class: "lupa-search-results-add-to-cart-wrapper" };
 const _hoisted_2$j = { class: "lupa-search-results-product-addtocart" };
-const _hoisted_3$d = ["onClick", "disabled"];
+const _hoisted_3$c = ["onClick", "disabled"];
 const _sfc_main$p = /* @__PURE__ */ vue.defineComponent({
   __name: "SearchResultsProductAddToCart",
   props: {
@@ -8623,7 +8654,7 @@ const _sfc_main$p = /* @__PURE__ */ vue.defineComponent({
             class: vue.normalizeClass(loading.value ? "lupa-add-to-cart-loading" : "lupa-add-to-cart"),
             "data-cy": "lupa-add-to-cart",
             disabled: !inStockValue.value || loading.value
-          }, vue.toDisplayString(label.value), 11, _hoisted_3$d)
+          }, vue.toDisplayString(label.value), 11, _hoisted_3$c)
         ])
       ]);
     };
@@ -8631,7 +8662,7 @@ const _sfc_main$p = /* @__PURE__ */ vue.defineComponent({
 });
 const _hoisted_1$m = ["innerHTML"];
 const _hoisted_2$i = { key: 0 };
-const _hoisted_3$c = { key: 1 };
+const _hoisted_3$b = { key: 1 };
 const _hoisted_4$7 = { class: "lupa-search-box-custom-label" };
 const _hoisted_5$5 = { class: "lupa-search-box-custom-text" };
 const _sfc_main$o = /* @__PURE__ */ vue.defineComponent({
@@ -8676,7 +8707,7 @@ const _sfc_main$o = /* @__PURE__ */ vue.defineComponent({
         key: 1,
         class: className.value
       }, vue.toHandlers(_ctx.options.action ? { click: handleClick } : {}, true)), [
-        !label.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$i, vue.toDisplayString(text.value), 1)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$c, [
+        !label.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$i, vue.toDisplayString(text.value), 1)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$b, [
           vue.createElementVNode("div", _hoisted_4$7, vue.toDisplayString(label.value), 1),
           vue.createElementVNode("div", _hoisted_5$5, vue.toDisplayString(text.value), 1)
         ]))
@@ -8715,7 +8746,7 @@ const _sfc_main$n = /* @__PURE__ */ vue.defineComponent({
 });
 const _hoisted_1$k = { id: "lupa-search-results-rating" };
 const _hoisted_2$h = ["innerHTML"];
-const _hoisted_3$b = { class: "lupa-ratings" };
+const _hoisted_3$a = { class: "lupa-ratings" };
 const _hoisted_4$6 = ["href"];
 const _sfc_main$m = /* @__PURE__ */ vue.defineComponent({
   __name: "SearchResultsProductSingleStarRating",
@@ -8750,7 +8781,7 @@ const _sfc_main$m = /* @__PURE__ */ vue.defineComponent({
           innerHTML: star.value,
           class: "lupa-rating lupa-rating-highlighted"
         }, null, 8, _hoisted_2$h),
-        vue.createElementVNode("div", _hoisted_3$b, vue.toDisplayString(rating.value), 1),
+        vue.createElementVNode("div", _hoisted_3$a, vue.toDisplayString(rating.value), 1),
         vue.createElementVNode("a", {
           href: ratingLink.value,
           class: "lupa-total-ratings"
@@ -8848,7 +8879,7 @@ const _hoisted_2$g = {
   key: 0,
   class: "lupa-out-of-stock"
 };
-const _hoisted_3$a = { class: "lupa-search-result-product-details-section" };
+const _hoisted_3$9 = { class: "lupa-search-result-product-details-section" };
 const _sfc_main$k = /* @__PURE__ */ vue.defineComponent({
   __name: "SearchResultsProductCard",
   props: {
@@ -9024,7 +9055,7 @@ const _sfc_main$k = /* @__PURE__ */ vue.defineComponent({
             }, null, 8, ["options"]),
             ((_a = labels.value) == null ? void 0 : _a.outOfStock) && !isInStock.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$g, vue.toDisplayString(labels.value.outOfStock), 1)) : vue.createCommentVNode("", true)
           ], 8, _hoisted_1$j),
-          vue.createElementVNode("div", _hoisted_3$a, [
+          vue.createElementVNode("div", _hoisted_3$9, [
             (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(detailElements.value, (element) => {
               return vue.openBlock(), vue.createBlock(_sfc_main$l, {
                 class: "lupa-search-results-product-element",
@@ -9067,7 +9098,7 @@ const _hoisted_1$i = {
   "data-cy": "lupa-search-results-similar-queries"
 };
 const _hoisted_2$f = { class: "lupa-similar-queries-label" };
-const _hoisted_3$9 = {
+const _hoisted_3$8 = {
   class: "lupa-similar-query-label",
   "data-cy": "lupa-similar-query-label"
 };
@@ -9112,7 +9143,7 @@ const _sfc_main$j = /* @__PURE__ */ vue.defineComponent({
         vue.createElementVNode("div", _hoisted_2$f, vue.toDisplayString(_ctx.labels.similarQueries), 1),
         (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(similarQueries.value, (similarQuery, index) => {
           return vue.openBlock(), vue.createElementBlock("div", { key: index }, [
-            vue.createElementVNode("div", _hoisted_3$9, [
+            vue.createElementVNode("div", _hoisted_3$8, [
               vue.createElementVNode("span", null, vue.toDisplayString(similarQueryLabel.value), 1),
               vue.createElementVNode("span", {
                 id: "lupa-similar-query-text-component",
@@ -9301,7 +9332,7 @@ const _hoisted_1$e = {
   "data-cy": "lupa-search-results-similar-results"
 };
 const _hoisted_2$c = { class: "lupa-similar-results-label" };
-const _hoisted_3$8 = {
+const _hoisted_3$7 = {
   class: "lupa-products",
   "data-cy": "lupa-products"
 };
@@ -9323,7 +9354,7 @@ const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$e, [
         vue.createElementVNode("div", _hoisted_2$c, vue.toDisplayString(_ctx.labels.similarResultsLabel), 1),
-        vue.createElementVNode("div", _hoisted_3$8, [
+        vue.createElementVNode("div", _hoisted_3$7, [
           (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(similarResults.value.items, (product, index) => {
             return vue.openBlock(), vue.createBlock(_sfc_main$k, {
               style: vue.normalizeStyle(_ctx.columnSize),
@@ -9342,7 +9373,7 @@ const _hoisted_2$b = {
   class: "lupa-products",
   "data-cy": "lupa-products"
 };
-const _hoisted_3$7 = {
+const _hoisted_3$6 = {
   key: 0,
   class: "lupa-empty-results",
   "data-cy": "lupa-no-results-in-page"
@@ -9505,7 +9536,7 @@ const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
               }, null, 8, ["style", "product", "options"]);
             }), 128))
           ]),
-          vue.unref(isPageEmpty) && _ctx.options.labels.noItemsInPage ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$7, [
+          vue.unref(isPageEmpty) && _ctx.options.labels.noItemsInPage ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$6, [
             vue.createTextVNode(vue.toDisplayString(_ctx.options.labels.noItemsInPage) + " ", 1),
             _ctx.options.labels.backToFirstPage ? (vue.openBlock(), vue.createElementBlock("span", {
               key: 0,
@@ -9551,7 +9582,7 @@ const _hoisted_2$a = {
   key: 0,
   class: "lupa-category-back"
 };
-const _hoisted_3$6 = ["href"];
+const _hoisted_3$5 = ["href"];
 const _sfc_main$d = /* @__PURE__ */ vue.defineComponent({
   __name: "CategoryTopFilters",
   props: {
@@ -9590,7 +9621,7 @@ const _sfc_main$d = /* @__PURE__ */ vue.defineComponent({
               "data-cy": "lupa-category-back",
               href: backUrlLink.value,
               onClick: handleNavigationBack
-            }, vue.toDisplayString(backTitle.value), 9, _hoisted_3$6)
+            }, vue.toDisplayString(backTitle.value), 9, _hoisted_3$5)
           ])) : vue.createCommentVNode("", true),
           vue.createVNode(_sfc_main$C, {
             class: "lupa-toolbar-mobile",
@@ -9611,7 +9642,7 @@ const _hoisted_2$9 = {
   id: "lupa-search-results",
   class: "top-layout-wrapper"
 };
-const _hoisted_3$5 = { class: "search-content" };
+const _hoisted_3$4 = { class: "search-content" };
 const _hoisted_4$3 = { id: "lupa-search-results" };
 const _sfc_main$c = /* @__PURE__ */ vue.defineComponent({
   __name: "SearchResults",
@@ -9850,7 +9881,7 @@ const _sfc_main$c = /* @__PURE__ */ vue.defineComponent({
             ref_key: "searchResultsFilters",
             ref: searchResultsFilters
           }, null, 8, ["options"])) : vue.createCommentVNode("", true),
-          vue.createElementVNode("div", _hoisted_3$5, [
+          vue.createElementVNode("div", _hoisted_3$4, [
             vue.createVNode(_sfc_main$Z, { labels: didYouMeanLabels.value }, null, 8, ["labels"]),
             vue.createVNode(_sfc_main$X, {
               options: _ctx.options,
@@ -16342,12 +16373,12 @@ const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
 });
 const _hoisted_1$7 = { class: "lupa-chat-spinner" };
 const _hoisted_2$5 = /* @__PURE__ */ vue.createElementVNode("div", null, null, -1);
-const _hoisted_3$4 = /* @__PURE__ */ vue.createElementVNode("div", null, null, -1);
+const _hoisted_3$3 = /* @__PURE__ */ vue.createElementVNode("div", null, null, -1);
 const _hoisted_4$2 = /* @__PURE__ */ vue.createElementVNode("div", null, null, -1);
 const _hoisted_5$2 = /* @__PURE__ */ vue.createElementVNode("div", null, null, -1);
 const _hoisted_6$1 = [
   _hoisted_2$5,
-  _hoisted_3$4,
+  _hoisted_3$3,
   _hoisted_4$2,
   _hoisted_5$2
 ];
@@ -16371,7 +16402,7 @@ const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
 });
 const _hoisted_1$6 = { class: "lupa-chat-input-container" };
 const _hoisted_2$4 = { id: "lupa-search-box-input" };
-const _hoisted_3$3 = {
+const _hoisted_3$2 = {
   key: 0,
   class: "lupa-chat-form-submit"
 };
@@ -16407,7 +16438,7 @@ const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
               [vue.vModelText, inputValue.value]
             ])
           ]),
-          !_ctx.disabled ? (vue.openBlock(), vue.createElementBlock("button", _hoisted_3$3, "Ask LupaChat")) : (vue.openBlock(), vue.createBlock(_sfc_main$7, {
+          !_ctx.disabled ? (vue.openBlock(), vue.createElementBlock("button", _hoisted_3$2, "Ask LupaChat")) : (vue.openBlock(), vue.createBlock(_sfc_main$7, {
             key: 1,
             small: true
           }))
@@ -16574,7 +16605,7 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
 });
 const _hoisted_1$4 = { class: "lupa-chat-content-entry-phrase" };
 const _hoisted_2$3 = { class: "lupa-chat-phrase-title" };
-const _hoisted_3$2 = {
+const _hoisted_3$1 = {
   key: 0,
   class: "alert"
 };
@@ -16675,7 +16706,7 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
         vue.createElementVNode("div", _hoisted_2$3, [
           vue.createElementVNode("h3", null, vue.toDisplayString(displayPhrase.value), 1),
           vue.createElementVNode("sub", null, vue.toDisplayString(usedAlternativePhrases.value.join(", ")), 1),
-          usedPartialResults.value ? (vue.openBlock(), vue.createElementBlock("sub", _hoisted_3$2, "Including partial matches - which might not be what you are looking for")) : vue.createCommentVNode("", true)
+          usedPartialResults.value ? (vue.openBlock(), vue.createElementBlock("sub", _hoisted_3$1, "Including partial matches - which might not be what you are looking for")) : vue.createCommentVNode("", true)
         ]),
         vue.createElementVNode("div", null, [
           vue.createVNode(_sfc_main$5, {
@@ -16694,7 +16725,7 @@ const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
 });
 const _hoisted_1$3 = { class: "lupa-chat-best-matches lupa-chat-content-entry" };
 const _hoisted_2$2 = /* @__PURE__ */ vue.createElementVNode("h3", null, "Best matches", -1);
-const _hoisted_3$1 = { key: 0 };
+const MAX_SOURCES_FOR_BEST_ITEM_MATCHING = 250;
 const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
   __name: "ChatContentEntry",
   props: {
@@ -16724,20 +16755,18 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
       return (_a = props.options.displayOptions.titleKey) != null ? _a : "title";
     });
     const loadFinalRecommendations = () => __async(this, null, function* () {
-      var _a;
+      var _a, _b;
       try {
-        const productResultStrings = loadedResults.value.map(
-          (result) => {
-            var _a2, _b;
-            return (_b = (_a2 = result[titleKey.value]) == null ? void 0 : _a2.toString()) != null ? _b : "";
-          }
-        );
+        const productResultStrings = (_a = loadedResults.value.map((result) => {
+          var _a2, _b2;
+          return (_b2 = (_a2 = result[titleKey.value]) == null ? void 0 : _a2.toString()) != null ? _b2 : "";
+        })) == null ? void 0 : _a.slice(0, MAX_SOURCES_FOR_BEST_ITEM_MATCHING);
         const { products } = yield ChatService.suggestBestProductMatches(
           props.options.sdkOptions,
           {
             initialQuery: props.entry.userInput,
             productStrings: productResultStrings,
-            messageHistory: (_a = props.history) != null ? _a : [],
+            messageHistory: (_b = props.history) != null ? _b : [],
             queryKey: props.options.displayOptions.queryKey
           },
           props.options.chatSettings
@@ -16750,13 +16779,9 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
     });
     const bestMatchProducts = vue.computed(() => {
       return bestMatches.value.map((productName) => {
-        return loadedResults.value.find((r) => r[titleKey.value] === productName);
+        return findClosestStringValue(productName, loadedResults.value, titleKey.value);
       }).filter(Boolean);
     });
-    const explanation = vue.computed(() => {
-      var _a, _b;
-      return ((_a = bestMatches.value) == null ? void 0 : _a.length) > 0 && !bestMatchProducts.value.length ? (_b = bestMatches == null ? void 0 : bestMatches.value) == null ? void 0 : _b[0] : "";
-    });
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", null, [
         vue.createElementVNode("ul", null, [
@@ -16776,13 +16801,12 @@ const _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
         ]),
         vue.createElementVNode("section", _hoisted_1$3, [
           _hoisted_2$2,
-          explanation.value ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_3$1, vue.toDisplayString(explanation.value), 1)) : vue.createCommentVNode("", true),
           loading.value ? (vue.openBlock(), vue.createBlock(_sfc_main$7, {
-            key: 1,
+            key: 0,
             message: "Selecting the best matches for you. This might take a few seconds."
           })) : vue.createCommentVNode("", true),
           bestMatches.value.length ? (vue.openBlock(), vue.createBlock(_sfc_main$5, {
-            key: 2,
+            key: 1,
             "search-results": bestMatchProducts.value,
             options: _ctx.options.displayOptions
           }, null, 8, ["search-results", "options"])) : vue.createCommentVNode("", true)