@getlupa/vue 0.11.8 → 0.12.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/lupaSearch.js
CHANGED
|
@@ -1675,11 +1675,12 @@ const LupaSearchSdk = {
|
|
|
1675
1675
|
}
|
|
1676
1676
|
};
|
|
1677
1677
|
const getNormalizedString = (str) => {
|
|
1678
|
+
var _a, _b;
|
|
1678
1679
|
if (!str) {
|
|
1679
1680
|
return "";
|
|
1680
1681
|
}
|
|
1681
1682
|
const transformedStr = typeof str === "string" ? str : str.toString();
|
|
1682
|
-
return transformedStr.normalize === void 0 ? transformedStr.toLocaleLowerCase() : transformedStr.toLocaleLowerCase().normalize("NFKD").replace(/[^\w\s.-_/]/g, "");
|
|
1683
|
+
return transformedStr.normalize === void 0 ? (_a = transformedStr.toLocaleLowerCase()) == null ? void 0 : _a.trim() : (_b = transformedStr.toLocaleLowerCase().normalize("NFKD").replace(/[^\w\s.-_/]/g, "")) == null ? void 0 : _b.trim();
|
|
1683
1684
|
};
|
|
1684
1685
|
const capitalize = (str) => {
|
|
1685
1686
|
if (!str) {
|
|
@@ -2157,23 +2158,34 @@ const DEFAULT_OPTIONS_RESULTS = {
|
|
|
2157
2158
|
};
|
|
2158
2159
|
const useScreenStore = defineStore("screen", () => {
|
|
2159
2160
|
const screenWidth = vue.ref(1e3);
|
|
2161
|
+
const optionsStore = useOptionsStore();
|
|
2162
|
+
const configuredGridSizes = vue.computed(() => {
|
|
2163
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p;
|
|
2164
|
+
return {
|
|
2165
|
+
smMin: (_d = (_c = (_b = (_a = optionsStore.searchResultOptions) == null ? void 0 : _a.grid) == null ? void 0 : _b.sizes) == null ? void 0 : _c.sm) != null ? _d : S_MIN_WIDTH,
|
|
2166
|
+
mdMin: (_h = (_g = (_f = (_e = optionsStore.searchResultOptions) == null ? void 0 : _e.grid) == null ? void 0 : _f.sizes) == null ? void 0 : _g.md) != null ? _h : MD_MIN_WIDTH,
|
|
2167
|
+
lMin: (_l = (_k = (_j = (_i = optionsStore.searchResultOptions) == null ? void 0 : _i.grid) == null ? void 0 : _j.sizes) == null ? void 0 : _k.l) != null ? _l : L_MIN_WIDTH,
|
|
2168
|
+
xlMin: (_p = (_o = (_n = (_m = optionsStore.searchResultOptions) == null ? void 0 : _m.grid) == null ? void 0 : _n.sizes) == null ? void 0 : _o.xl) != null ? _p : XL_MIN_WIDTH
|
|
2169
|
+
};
|
|
2170
|
+
});
|
|
2160
2171
|
const currentScreenWidth = vue.computed(() => {
|
|
2161
2172
|
const width = screenWidth.value;
|
|
2162
|
-
if (width <=
|
|
2173
|
+
if (width <= configuredGridSizes.value.smMin) {
|
|
2163
2174
|
return "xs";
|
|
2164
|
-
} else if (width >
|
|
2175
|
+
} else if (width > configuredGridSizes.value.smMin && width <= configuredGridSizes.value.mdMin) {
|
|
2165
2176
|
return "sm";
|
|
2166
|
-
} else if (width >
|
|
2177
|
+
} else if (width > configuredGridSizes.value.mdMin && width <= configuredGridSizes.value.lMin) {
|
|
2167
2178
|
return "md";
|
|
2168
|
-
} else if (width >
|
|
2179
|
+
} else if (width > configuredGridSizes.value.lMin && width <= configuredGridSizes.value.xlMin) {
|
|
2169
2180
|
return "l";
|
|
2170
2181
|
} else {
|
|
2171
2182
|
return "xl";
|
|
2172
2183
|
}
|
|
2173
2184
|
});
|
|
2174
|
-
const isMobileWidth = vue.computed(
|
|
2175
|
-
|
|
2176
|
-
|
|
2185
|
+
const isMobileWidth = vue.computed(() => {
|
|
2186
|
+
var _a;
|
|
2187
|
+
return (_a = ["xs", "sm"]) == null ? void 0 : _a.includes(currentScreenWidth.value);
|
|
2188
|
+
});
|
|
2177
2189
|
const setScreenWidth = ({ width }) => {
|
|
2178
2190
|
screenWidth.value = width;
|
|
2179
2191
|
};
|
|
@@ -4182,6 +4194,7 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4182
4194
|
const isMobileSidebarVisible = vue.ref(false);
|
|
4183
4195
|
const optionsStore = useOptionsStore();
|
|
4184
4196
|
const paramsStore = useParamsStore();
|
|
4197
|
+
const screenStore = useScreenStore();
|
|
4185
4198
|
const { searchResultOptions } = storeToRefs(optionsStore);
|
|
4186
4199
|
const facets = vue.computed(() => searchResult.value.facets);
|
|
4187
4200
|
const filters = vue.computed(() => searchResult.value.filters);
|
|
@@ -4227,6 +4240,10 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4227
4240
|
var _a;
|
|
4228
4241
|
return Object.keys((_a = filters.value) != null ? _a : {}).length > 0;
|
|
4229
4242
|
});
|
|
4243
|
+
const hideFiltersOnExactMatchForKeys = vue.computed(() => {
|
|
4244
|
+
var _a, _b, _c, _d;
|
|
4245
|
+
return (_d = (_c = (_b = (_a = searchResultOptions.value) == null ? void 0 : _a.filters) == null ? void 0 : _b.facets) == null ? void 0 : _c.hideFiltersOnExactMatchForKeys) != null ? _d : [];
|
|
4246
|
+
});
|
|
4230
4247
|
const itemRange = vue.computed(() => {
|
|
4231
4248
|
var _a, _b;
|
|
4232
4249
|
const limit = (_a = paramsStore.limit) != null ? _a : 0;
|
|
@@ -4280,20 +4297,13 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4280
4297
|
return { searchResult: newSearchResult };
|
|
4281
4298
|
};
|
|
4282
4299
|
const setColumnCount = ({ width, grid }) => {
|
|
4300
|
+
var _a;
|
|
4283
4301
|
if (!width || !grid) {
|
|
4284
4302
|
return;
|
|
4285
4303
|
}
|
|
4286
|
-
|
|
4287
|
-
|
|
4288
|
-
|
|
4289
|
-
columnCount.value = grid.columns.sm;
|
|
4290
|
-
} else if (width > MD_MIN_WIDTH && width <= L_MIN_WIDTH) {
|
|
4291
|
-
columnCount.value = grid.columns.md;
|
|
4292
|
-
} else if (width > L_MIN_WIDTH && width <= XL_MIN_WIDTH) {
|
|
4293
|
-
columnCount.value = grid.columns.l;
|
|
4294
|
-
} else {
|
|
4295
|
-
columnCount.value = grid.columns.xl;
|
|
4296
|
-
}
|
|
4304
|
+
const { currentScreenWidth } = storeToRefs(screenStore);
|
|
4305
|
+
const screenWidth = (_a = currentScreenWidth.value) != null ? _a : "xl";
|
|
4306
|
+
columnCount.value = grid.columns[screenWidth];
|
|
4297
4307
|
};
|
|
4298
4308
|
const setAddToCartAmount = (newAddToCartAmount) => {
|
|
4299
4309
|
if (!newAddToCartAmount) {
|
|
@@ -4313,6 +4323,15 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4313
4323
|
const clearSearchResult = () => {
|
|
4314
4324
|
searchResult.value = {};
|
|
4315
4325
|
};
|
|
4326
|
+
const filterVisibleFilterValues = (key, items = []) => {
|
|
4327
|
+
var _a;
|
|
4328
|
+
if (!((_a = hideFiltersOnExactMatchForKeys.value) == null ? void 0 : _a.length) || !hideFiltersOnExactMatchForKeys.value.includes(key) || !items.length) {
|
|
4329
|
+
return items;
|
|
4330
|
+
}
|
|
4331
|
+
const searchInput = getNormalizedString(currentQueryText.value);
|
|
4332
|
+
const hasExactMatch = items.some((item) => getNormalizedString(item.title) === searchInput);
|
|
4333
|
+
return hasExactMatch ? items.filter((item) => getNormalizedString(item.title) === searchInput) : items;
|
|
4334
|
+
};
|
|
4316
4335
|
return {
|
|
4317
4336
|
isMobileSidebarVisible,
|
|
4318
4337
|
searchResult,
|
|
@@ -4332,6 +4351,7 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4332
4351
|
hasAnyFilter,
|
|
4333
4352
|
itemRange,
|
|
4334
4353
|
isPageEmpty,
|
|
4354
|
+
hideFiltersOnExactMatchForKeys,
|
|
4335
4355
|
setSidebarState,
|
|
4336
4356
|
queryFacet,
|
|
4337
4357
|
add,
|
|
@@ -4339,7 +4359,8 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4339
4359
|
setAddToCartAmount,
|
|
4340
4360
|
setLayout,
|
|
4341
4361
|
setLoading,
|
|
4342
|
-
clearSearchResult
|
|
4362
|
+
clearSearchResult,
|
|
4363
|
+
filterVisibleFilterValues
|
|
4343
4364
|
};
|
|
4344
4365
|
});
|
|
4345
4366
|
const _hoisted_1$12 = { class: "lupa-search-box-add-to-cart-wrapper" };
|
|
@@ -6068,11 +6089,25 @@ const _sfc_main$Q = /* @__PURE__ */ vue.defineComponent({
|
|
|
6068
6089
|
const paramsStore = useParamsStore();
|
|
6069
6090
|
const optionStore = useOptionsStore();
|
|
6070
6091
|
const searchResultStore = useSearchResultStore();
|
|
6071
|
-
const {
|
|
6092
|
+
const {
|
|
6093
|
+
filters,
|
|
6094
|
+
displayFilters,
|
|
6095
|
+
currentFilterCount,
|
|
6096
|
+
hideFiltersOnExactMatchForKeys,
|
|
6097
|
+
currentQueryText
|
|
6098
|
+
} = storeToRefs(searchResultStore);
|
|
6072
6099
|
const currentFilters = vue.computed(() => filters.value);
|
|
6100
|
+
const currentDisplayFilters = vue.computed(
|
|
6101
|
+
() => hideFiltersOnExactMatchForKeys.value.length ? displayFilters.value.filter(
|
|
6102
|
+
(f2) => {
|
|
6103
|
+
var _a;
|
|
6104
|
+
return !((_a = hideFiltersOnExactMatchForKeys.value) == null ? void 0 : _a.includes(f2.key)) && getNormalizedString(currentQueryText.value) !== getNormalizedString(f2.label);
|
|
6105
|
+
}
|
|
6106
|
+
) : displayFilters.value
|
|
6107
|
+
);
|
|
6073
6108
|
const hasFilters = vue.computed(() => {
|
|
6074
6109
|
var _a;
|
|
6075
|
-
return ((_a =
|
|
6110
|
+
return ((_a = currentDisplayFilters.value) == null ? void 0 : _a.length) > 0;
|
|
6076
6111
|
});
|
|
6077
6112
|
const handleClearAll = () => {
|
|
6078
6113
|
paramsStore.removeAllFilters();
|
|
@@ -6129,7 +6164,7 @@ const _sfc_main$Q = /* @__PURE__ */ vue.defineComponent({
|
|
|
6129
6164
|
]),
|
|
6130
6165
|
!_ctx.expandable || isOpen.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$q, [
|
|
6131
6166
|
vue.createElementVNode("div", _hoisted_4$k, [
|
|
6132
|
-
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(
|
|
6167
|
+
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(currentDisplayFilters.value, (filter) => {
|
|
6133
6168
|
return vue.openBlock(), vue.createBlock(_sfc_main$R, {
|
|
6134
6169
|
key: filter.key + "_" + filter.value,
|
|
6135
6170
|
filter,
|
|
@@ -6342,11 +6377,12 @@ const _sfc_main$N = /* @__PURE__ */ vue.defineComponent({
|
|
|
6342
6377
|
emits: ["select"],
|
|
6343
6378
|
setup(__props, { emit }) {
|
|
6344
6379
|
const props = __props;
|
|
6380
|
+
const searchResultStore = useSearchResultStore();
|
|
6345
6381
|
const facet = vue.computed(() => {
|
|
6346
6382
|
var _a;
|
|
6347
6383
|
return (_a = props.facet) != null ? _a : { type: "terms", items: [], key: "" };
|
|
6348
6384
|
});
|
|
6349
|
-
const
|
|
6385
|
+
const currentFiltersValue = vue.computed(() => {
|
|
6350
6386
|
var _a;
|
|
6351
6387
|
return (_a = props.currentFilters) != null ? _a : [];
|
|
6352
6388
|
});
|
|
@@ -6357,22 +6393,23 @@ const _sfc_main$N = /* @__PURE__ */ vue.defineComponent({
|
|
|
6357
6393
|
});
|
|
6358
6394
|
const allValues = vue.computed(() => {
|
|
6359
6395
|
var _a, _b;
|
|
6360
|
-
return (_b = (_a = facet.value) == null ? void 0 : _a.items) != null ? _b : [];
|
|
6396
|
+
return searchResultStore.filterVisibleFilterValues(facet.value.key, (_b = (_a = facet.value) == null ? void 0 : _a.items) != null ? _b : []);
|
|
6361
6397
|
});
|
|
6362
6398
|
const displayValues = vue.computed(() => {
|
|
6363
6399
|
return filteredValues.value.slice(0, itemLimit.value).map((v) => __spreadProps(__spreadValues({}, v), { title: getDisplayValue(v.title) }));
|
|
6364
6400
|
});
|
|
6365
6401
|
const filteredValues = vue.computed(() => {
|
|
6366
|
-
|
|
6402
|
+
var _a, _b;
|
|
6403
|
+
return isFilterable.value ? (_a = allValues.value) == null ? void 0 : _a.filter(
|
|
6367
6404
|
(v) => {
|
|
6368
|
-
var
|
|
6369
|
-
return (
|
|
6405
|
+
var _a2;
|
|
6406
|
+
return (_a2 = getNormalizedString(v.title)) == null ? void 0 : _a2.includes(getNormalizedString(termFilter.value));
|
|
6370
6407
|
}
|
|
6371
|
-
) : allValues.value;
|
|
6408
|
+
) : (_b = allValues.value) != null ? _b : [];
|
|
6372
6409
|
});
|
|
6373
6410
|
const isFilterable = vue.computed(() => {
|
|
6374
|
-
var _a, _b;
|
|
6375
|
-
return allValues.value.length >= ((
|
|
6411
|
+
var _a, _b, _c;
|
|
6412
|
+
return ((_a = allValues.value) == null ? void 0 : _a.length) >= ((_c = (_b = props.options.filterable) == null ? void 0 : _b.minValues) != null ? _c : MAX_FACET_VALUES);
|
|
6376
6413
|
});
|
|
6377
6414
|
const isRange = vue.computed(() => {
|
|
6378
6415
|
return facet.value.type === "range";
|
|
@@ -6396,7 +6433,7 @@ const _sfc_main$N = /* @__PURE__ */ vue.defineComponent({
|
|
|
6396
6433
|
};
|
|
6397
6434
|
const isChecked = (item) => {
|
|
6398
6435
|
var _a, _b;
|
|
6399
|
-
let selectedItems = (_a =
|
|
6436
|
+
let selectedItems = (_a = currentFiltersValue.value) != null ? _a : [];
|
|
6400
6437
|
selectedItems = isRange.value && selectedItems ? [rangeFilterToString(selectedItems)] : selectedItems;
|
|
6401
6438
|
return selectedItems == null ? void 0 : selectedItems.includes((_b = item.title) == null ? void 0 : _b.toString());
|
|
6402
6439
|
};
|
package/dist/lupaSearch.mjs
CHANGED
|
@@ -1673,11 +1673,12 @@ const LupaSearchSdk = {
|
|
|
1673
1673
|
}
|
|
1674
1674
|
};
|
|
1675
1675
|
const getNormalizedString = (str) => {
|
|
1676
|
+
var _a, _b;
|
|
1676
1677
|
if (!str) {
|
|
1677
1678
|
return "";
|
|
1678
1679
|
}
|
|
1679
1680
|
const transformedStr = typeof str === "string" ? str : str.toString();
|
|
1680
|
-
return transformedStr.normalize === void 0 ? transformedStr.toLocaleLowerCase() : transformedStr.toLocaleLowerCase().normalize("NFKD").replace(/[^\w\s.-_/]/g, "");
|
|
1681
|
+
return transformedStr.normalize === void 0 ? (_a = transformedStr.toLocaleLowerCase()) == null ? void 0 : _a.trim() : (_b = transformedStr.toLocaleLowerCase().normalize("NFKD").replace(/[^\w\s.-_/]/g, "")) == null ? void 0 : _b.trim();
|
|
1681
1682
|
};
|
|
1682
1683
|
const capitalize = (str) => {
|
|
1683
1684
|
if (!str) {
|
|
@@ -2155,23 +2156,34 @@ const DEFAULT_OPTIONS_RESULTS = {
|
|
|
2155
2156
|
};
|
|
2156
2157
|
const useScreenStore = defineStore("screen", () => {
|
|
2157
2158
|
const screenWidth = ref(1e3);
|
|
2159
|
+
const optionsStore = useOptionsStore();
|
|
2160
|
+
const configuredGridSizes = computed(() => {
|
|
2161
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p;
|
|
2162
|
+
return {
|
|
2163
|
+
smMin: (_d = (_c = (_b = (_a = optionsStore.searchResultOptions) == null ? void 0 : _a.grid) == null ? void 0 : _b.sizes) == null ? void 0 : _c.sm) != null ? _d : S_MIN_WIDTH,
|
|
2164
|
+
mdMin: (_h = (_g = (_f = (_e = optionsStore.searchResultOptions) == null ? void 0 : _e.grid) == null ? void 0 : _f.sizes) == null ? void 0 : _g.md) != null ? _h : MD_MIN_WIDTH,
|
|
2165
|
+
lMin: (_l = (_k = (_j = (_i = optionsStore.searchResultOptions) == null ? void 0 : _i.grid) == null ? void 0 : _j.sizes) == null ? void 0 : _k.l) != null ? _l : L_MIN_WIDTH,
|
|
2166
|
+
xlMin: (_p = (_o = (_n = (_m = optionsStore.searchResultOptions) == null ? void 0 : _m.grid) == null ? void 0 : _n.sizes) == null ? void 0 : _o.xl) != null ? _p : XL_MIN_WIDTH
|
|
2167
|
+
};
|
|
2168
|
+
});
|
|
2158
2169
|
const currentScreenWidth = computed(() => {
|
|
2159
2170
|
const width = screenWidth.value;
|
|
2160
|
-
if (width <=
|
|
2171
|
+
if (width <= configuredGridSizes.value.smMin) {
|
|
2161
2172
|
return "xs";
|
|
2162
|
-
} else if (width >
|
|
2173
|
+
} else if (width > configuredGridSizes.value.smMin && width <= configuredGridSizes.value.mdMin) {
|
|
2163
2174
|
return "sm";
|
|
2164
|
-
} else if (width >
|
|
2175
|
+
} else if (width > configuredGridSizes.value.mdMin && width <= configuredGridSizes.value.lMin) {
|
|
2165
2176
|
return "md";
|
|
2166
|
-
} else if (width >
|
|
2177
|
+
} else if (width > configuredGridSizes.value.lMin && width <= configuredGridSizes.value.xlMin) {
|
|
2167
2178
|
return "l";
|
|
2168
2179
|
} else {
|
|
2169
2180
|
return "xl";
|
|
2170
2181
|
}
|
|
2171
2182
|
});
|
|
2172
|
-
const isMobileWidth = computed(
|
|
2173
|
-
|
|
2174
|
-
|
|
2183
|
+
const isMobileWidth = computed(() => {
|
|
2184
|
+
var _a;
|
|
2185
|
+
return (_a = ["xs", "sm"]) == null ? void 0 : _a.includes(currentScreenWidth.value);
|
|
2186
|
+
});
|
|
2175
2187
|
const setScreenWidth = ({ width }) => {
|
|
2176
2188
|
screenWidth.value = width;
|
|
2177
2189
|
};
|
|
@@ -4180,6 +4192,7 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4180
4192
|
const isMobileSidebarVisible = ref(false);
|
|
4181
4193
|
const optionsStore = useOptionsStore();
|
|
4182
4194
|
const paramsStore = useParamsStore();
|
|
4195
|
+
const screenStore = useScreenStore();
|
|
4183
4196
|
const { searchResultOptions } = storeToRefs(optionsStore);
|
|
4184
4197
|
const facets = computed(() => searchResult.value.facets);
|
|
4185
4198
|
const filters = computed(() => searchResult.value.filters);
|
|
@@ -4225,6 +4238,10 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4225
4238
|
var _a;
|
|
4226
4239
|
return Object.keys((_a = filters.value) != null ? _a : {}).length > 0;
|
|
4227
4240
|
});
|
|
4241
|
+
const hideFiltersOnExactMatchForKeys = computed(() => {
|
|
4242
|
+
var _a, _b, _c, _d;
|
|
4243
|
+
return (_d = (_c = (_b = (_a = searchResultOptions.value) == null ? void 0 : _a.filters) == null ? void 0 : _b.facets) == null ? void 0 : _c.hideFiltersOnExactMatchForKeys) != null ? _d : [];
|
|
4244
|
+
});
|
|
4228
4245
|
const itemRange = computed(() => {
|
|
4229
4246
|
var _a, _b;
|
|
4230
4247
|
const limit = (_a = paramsStore.limit) != null ? _a : 0;
|
|
@@ -4278,20 +4295,13 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4278
4295
|
return { searchResult: newSearchResult };
|
|
4279
4296
|
};
|
|
4280
4297
|
const setColumnCount = ({ width, grid }) => {
|
|
4298
|
+
var _a;
|
|
4281
4299
|
if (!width || !grid) {
|
|
4282
4300
|
return;
|
|
4283
4301
|
}
|
|
4284
|
-
|
|
4285
|
-
|
|
4286
|
-
|
|
4287
|
-
columnCount.value = grid.columns.sm;
|
|
4288
|
-
} else if (width > MD_MIN_WIDTH && width <= L_MIN_WIDTH) {
|
|
4289
|
-
columnCount.value = grid.columns.md;
|
|
4290
|
-
} else if (width > L_MIN_WIDTH && width <= XL_MIN_WIDTH) {
|
|
4291
|
-
columnCount.value = grid.columns.l;
|
|
4292
|
-
} else {
|
|
4293
|
-
columnCount.value = grid.columns.xl;
|
|
4294
|
-
}
|
|
4302
|
+
const { currentScreenWidth } = storeToRefs(screenStore);
|
|
4303
|
+
const screenWidth = (_a = currentScreenWidth.value) != null ? _a : "xl";
|
|
4304
|
+
columnCount.value = grid.columns[screenWidth];
|
|
4295
4305
|
};
|
|
4296
4306
|
const setAddToCartAmount = (newAddToCartAmount) => {
|
|
4297
4307
|
if (!newAddToCartAmount) {
|
|
@@ -4311,6 +4321,15 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4311
4321
|
const clearSearchResult = () => {
|
|
4312
4322
|
searchResult.value = {};
|
|
4313
4323
|
};
|
|
4324
|
+
const filterVisibleFilterValues = (key, items = []) => {
|
|
4325
|
+
var _a;
|
|
4326
|
+
if (!((_a = hideFiltersOnExactMatchForKeys.value) == null ? void 0 : _a.length) || !hideFiltersOnExactMatchForKeys.value.includes(key) || !items.length) {
|
|
4327
|
+
return items;
|
|
4328
|
+
}
|
|
4329
|
+
const searchInput = getNormalizedString(currentQueryText.value);
|
|
4330
|
+
const hasExactMatch = items.some((item) => getNormalizedString(item.title) === searchInput);
|
|
4331
|
+
return hasExactMatch ? items.filter((item) => getNormalizedString(item.title) === searchInput) : items;
|
|
4332
|
+
};
|
|
4314
4333
|
return {
|
|
4315
4334
|
isMobileSidebarVisible,
|
|
4316
4335
|
searchResult,
|
|
@@ -4330,6 +4349,7 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4330
4349
|
hasAnyFilter,
|
|
4331
4350
|
itemRange,
|
|
4332
4351
|
isPageEmpty,
|
|
4352
|
+
hideFiltersOnExactMatchForKeys,
|
|
4333
4353
|
setSidebarState,
|
|
4334
4354
|
queryFacet,
|
|
4335
4355
|
add,
|
|
@@ -4337,7 +4357,8 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4337
4357
|
setAddToCartAmount,
|
|
4338
4358
|
setLayout,
|
|
4339
4359
|
setLoading,
|
|
4340
|
-
clearSearchResult
|
|
4360
|
+
clearSearchResult,
|
|
4361
|
+
filterVisibleFilterValues
|
|
4341
4362
|
};
|
|
4342
4363
|
});
|
|
4343
4364
|
const _hoisted_1$12 = { class: "lupa-search-box-add-to-cart-wrapper" };
|
|
@@ -6066,11 +6087,25 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
|
|
|
6066
6087
|
const paramsStore = useParamsStore();
|
|
6067
6088
|
const optionStore = useOptionsStore();
|
|
6068
6089
|
const searchResultStore = useSearchResultStore();
|
|
6069
|
-
const {
|
|
6090
|
+
const {
|
|
6091
|
+
filters,
|
|
6092
|
+
displayFilters,
|
|
6093
|
+
currentFilterCount,
|
|
6094
|
+
hideFiltersOnExactMatchForKeys,
|
|
6095
|
+
currentQueryText
|
|
6096
|
+
} = storeToRefs(searchResultStore);
|
|
6070
6097
|
const currentFilters = computed(() => filters.value);
|
|
6098
|
+
const currentDisplayFilters = computed(
|
|
6099
|
+
() => hideFiltersOnExactMatchForKeys.value.length ? displayFilters.value.filter(
|
|
6100
|
+
(f2) => {
|
|
6101
|
+
var _a;
|
|
6102
|
+
return !((_a = hideFiltersOnExactMatchForKeys.value) == null ? void 0 : _a.includes(f2.key)) && getNormalizedString(currentQueryText.value) !== getNormalizedString(f2.label);
|
|
6103
|
+
}
|
|
6104
|
+
) : displayFilters.value
|
|
6105
|
+
);
|
|
6071
6106
|
const hasFilters = computed(() => {
|
|
6072
6107
|
var _a;
|
|
6073
|
-
return ((_a =
|
|
6108
|
+
return ((_a = currentDisplayFilters.value) == null ? void 0 : _a.length) > 0;
|
|
6074
6109
|
});
|
|
6075
6110
|
const handleClearAll = () => {
|
|
6076
6111
|
paramsStore.removeAllFilters();
|
|
@@ -6127,7 +6162,7 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
|
|
|
6127
6162
|
]),
|
|
6128
6163
|
!_ctx.expandable || isOpen.value ? (openBlock(), createElementBlock("div", _hoisted_3$q, [
|
|
6129
6164
|
createElementVNode("div", _hoisted_4$k, [
|
|
6130
|
-
(openBlock(true), createElementBlock(Fragment, null, renderList(
|
|
6165
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(currentDisplayFilters.value, (filter) => {
|
|
6131
6166
|
return openBlock(), createBlock(_sfc_main$R, {
|
|
6132
6167
|
key: filter.key + "_" + filter.value,
|
|
6133
6168
|
filter,
|
|
@@ -6340,11 +6375,12 @@ const _sfc_main$N = /* @__PURE__ */ defineComponent({
|
|
|
6340
6375
|
emits: ["select"],
|
|
6341
6376
|
setup(__props, { emit }) {
|
|
6342
6377
|
const props = __props;
|
|
6378
|
+
const searchResultStore = useSearchResultStore();
|
|
6343
6379
|
const facet = computed(() => {
|
|
6344
6380
|
var _a;
|
|
6345
6381
|
return (_a = props.facet) != null ? _a : { type: "terms", items: [], key: "" };
|
|
6346
6382
|
});
|
|
6347
|
-
const
|
|
6383
|
+
const currentFiltersValue = computed(() => {
|
|
6348
6384
|
var _a;
|
|
6349
6385
|
return (_a = props.currentFilters) != null ? _a : [];
|
|
6350
6386
|
});
|
|
@@ -6355,22 +6391,23 @@ const _sfc_main$N = /* @__PURE__ */ defineComponent({
|
|
|
6355
6391
|
});
|
|
6356
6392
|
const allValues = computed(() => {
|
|
6357
6393
|
var _a, _b;
|
|
6358
|
-
return (_b = (_a = facet.value) == null ? void 0 : _a.items) != null ? _b : [];
|
|
6394
|
+
return searchResultStore.filterVisibleFilterValues(facet.value.key, (_b = (_a = facet.value) == null ? void 0 : _a.items) != null ? _b : []);
|
|
6359
6395
|
});
|
|
6360
6396
|
const displayValues = computed(() => {
|
|
6361
6397
|
return filteredValues.value.slice(0, itemLimit.value).map((v) => __spreadProps(__spreadValues({}, v), { title: getDisplayValue(v.title) }));
|
|
6362
6398
|
});
|
|
6363
6399
|
const filteredValues = computed(() => {
|
|
6364
|
-
|
|
6400
|
+
var _a, _b;
|
|
6401
|
+
return isFilterable.value ? (_a = allValues.value) == null ? void 0 : _a.filter(
|
|
6365
6402
|
(v) => {
|
|
6366
|
-
var
|
|
6367
|
-
return (
|
|
6403
|
+
var _a2;
|
|
6404
|
+
return (_a2 = getNormalizedString(v.title)) == null ? void 0 : _a2.includes(getNormalizedString(termFilter.value));
|
|
6368
6405
|
}
|
|
6369
|
-
) : allValues.value;
|
|
6406
|
+
) : (_b = allValues.value) != null ? _b : [];
|
|
6370
6407
|
});
|
|
6371
6408
|
const isFilterable = computed(() => {
|
|
6372
|
-
var _a, _b;
|
|
6373
|
-
return allValues.value.length >= ((
|
|
6409
|
+
var _a, _b, _c;
|
|
6410
|
+
return ((_a = allValues.value) == null ? void 0 : _a.length) >= ((_c = (_b = props.options.filterable) == null ? void 0 : _b.minValues) != null ? _c : MAX_FACET_VALUES);
|
|
6374
6411
|
});
|
|
6375
6412
|
const isRange = computed(() => {
|
|
6376
6413
|
return facet.value.type === "range";
|
|
@@ -6394,7 +6431,7 @@ const _sfc_main$N = /* @__PURE__ */ defineComponent({
|
|
|
6394
6431
|
};
|
|
6395
6432
|
const isChecked = (item) => {
|
|
6396
6433
|
var _a, _b;
|
|
6397
|
-
let selectedItems = (_a =
|
|
6434
|
+
let selectedItems = (_a = currentFiltersValue.value) != null ? _a : [];
|
|
6398
6435
|
selectedItems = isRange.value && selectedItems ? [rangeFilterToString(selectedItems)] : selectedItems;
|
|
6399
6436
|
return selectedItems == null ? void 0 : selectedItems.includes((_b = item.title) == null ? void 0 : _b.toString());
|
|
6400
6437
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { type Ref } from 'vue';
|
|
2
|
-
import type { SearchQueryResult } from '@getlupa/client-sdk/Types';
|
|
2
|
+
import type { FacetGroupItem, SearchQueryResult } from '@getlupa/client-sdk/Types';
|
|
3
3
|
import { ResultsLayoutEnum, type ResultsLayout } from '../types/search-results/ResultsLayout';
|
|
4
4
|
import type { ProductGrid } from '../types/search-results/SearchResultsOptions';
|
|
5
5
|
export declare const useSearchResultStore: import("pinia").StoreDefinition<"searchResult", import("pinia")._UnwrapAll<Pick<{
|
|
@@ -21,6 +21,7 @@ export declare const useSearchResultStore: import("pinia").StoreDefinition<"sear
|
|
|
21
21
|
hasAnyFilter: import("vue").ComputedRef<boolean>;
|
|
22
22
|
itemRange: import("vue").ComputedRef<number[]>;
|
|
23
23
|
isPageEmpty: import("vue").ComputedRef<boolean>;
|
|
24
|
+
hideFiltersOnExactMatchForKeys: import("vue").ComputedRef<string[]>;
|
|
24
25
|
setSidebarState: ({ visible }: {
|
|
25
26
|
visible: boolean;
|
|
26
27
|
}) => void;
|
|
@@ -43,6 +44,7 @@ export declare const useSearchResultStore: import("pinia").StoreDefinition<"sear
|
|
|
43
44
|
setLayout: (newLayout: ResultsLayout) => void;
|
|
44
45
|
setLoading: (state: boolean) => void;
|
|
45
46
|
clearSearchResult: () => void;
|
|
47
|
+
filterVisibleFilterValues: (key: string, items?: FacetGroupItem[]) => FacetGroupItem[];
|
|
46
48
|
}, "loading" | "searchResult" | "isMobileSidebarVisible" | "columnCount" | "addToCartAmount" | "layout">>, Pick<{
|
|
47
49
|
isMobileSidebarVisible: Ref<boolean>;
|
|
48
50
|
searchResult: Ref<SearchQueryResult>;
|
|
@@ -62,6 +64,7 @@ export declare const useSearchResultStore: import("pinia").StoreDefinition<"sear
|
|
|
62
64
|
hasAnyFilter: import("vue").ComputedRef<boolean>;
|
|
63
65
|
itemRange: import("vue").ComputedRef<number[]>;
|
|
64
66
|
isPageEmpty: import("vue").ComputedRef<boolean>;
|
|
67
|
+
hideFiltersOnExactMatchForKeys: import("vue").ComputedRef<string[]>;
|
|
65
68
|
setSidebarState: ({ visible }: {
|
|
66
69
|
visible: boolean;
|
|
67
70
|
}) => void;
|
|
@@ -84,7 +87,8 @@ export declare const useSearchResultStore: import("pinia").StoreDefinition<"sear
|
|
|
84
87
|
setLayout: (newLayout: ResultsLayout) => void;
|
|
85
88
|
setLoading: (state: boolean) => void;
|
|
86
89
|
clearSearchResult: () => void;
|
|
87
|
-
|
|
90
|
+
filterVisibleFilterValues: (key: string, items?: FacetGroupItem[]) => FacetGroupItem[];
|
|
91
|
+
}, "filters" | "facets" | "hideFiltersOnExactMatchForKeys" | "currentQueryText" | "totalItems" | "hasResults" | "labeledFilters" | "displayFilters" | "currentFilterCount" | "currentFilterKeys" | "hasAnyFilter" | "itemRange" | "isPageEmpty">, Pick<{
|
|
88
92
|
isMobileSidebarVisible: Ref<boolean>;
|
|
89
93
|
searchResult: Ref<SearchQueryResult>;
|
|
90
94
|
columnCount: Ref<number>;
|
|
@@ -103,6 +107,7 @@ export declare const useSearchResultStore: import("pinia").StoreDefinition<"sear
|
|
|
103
107
|
hasAnyFilter: import("vue").ComputedRef<boolean>;
|
|
104
108
|
itemRange: import("vue").ComputedRef<number[]>;
|
|
105
109
|
isPageEmpty: import("vue").ComputedRef<boolean>;
|
|
110
|
+
hideFiltersOnExactMatchForKeys: import("vue").ComputedRef<string[]>;
|
|
106
111
|
setSidebarState: ({ visible }: {
|
|
107
112
|
visible: boolean;
|
|
108
113
|
}) => void;
|
|
@@ -125,4 +130,5 @@ export declare const useSearchResultStore: import("pinia").StoreDefinition<"sear
|
|
|
125
130
|
setLayout: (newLayout: ResultsLayout) => void;
|
|
126
131
|
setLoading: (state: boolean) => void;
|
|
127
132
|
clearSearchResult: () => void;
|
|
128
|
-
|
|
133
|
+
filterVisibleFilterValues: (key: string, items?: FacetGroupItem[]) => FacetGroupItem[];
|
|
134
|
+
}, "add" | "setSidebarState" | "queryFacet" | "setColumnCount" | "setAddToCartAmount" | "setLayout" | "setLoading" | "clearSearchResult" | "filterVisibleFilterValues">>;
|
|
@@ -103,6 +103,12 @@ export type ProductGrid = {
|
|
|
103
103
|
sm: number;
|
|
104
104
|
xs: number;
|
|
105
105
|
};
|
|
106
|
+
sizes?: {
|
|
107
|
+
sm?: number;
|
|
108
|
+
md?: number;
|
|
109
|
+
l?: number;
|
|
110
|
+
xl?: number;
|
|
111
|
+
};
|
|
106
112
|
};
|
|
107
113
|
export type SearchResultsPaginationLabels = {
|
|
108
114
|
pageSize: string;
|
|
@@ -166,6 +172,7 @@ export type ResultFacetOptions = {
|
|
|
166
172
|
facetClear?: string;
|
|
167
173
|
facetFilterButton?: string;
|
|
168
174
|
};
|
|
175
|
+
hideFiltersOnExactMatchForKeys?: string[];
|
|
169
176
|
promotedFacets?: string[];
|
|
170
177
|
filterBehavior?: FilterBehavior;
|
|
171
178
|
filterable?: {
|