@getlupa/vue 0.11.9 → 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
|
@@ -2158,23 +2158,34 @@ const DEFAULT_OPTIONS_RESULTS = {
|
|
|
2158
2158
|
};
|
|
2159
2159
|
const useScreenStore = defineStore("screen", () => {
|
|
2160
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
|
+
});
|
|
2161
2171
|
const currentScreenWidth = vue.computed(() => {
|
|
2162
2172
|
const width = screenWidth.value;
|
|
2163
|
-
if (width <=
|
|
2173
|
+
if (width <= configuredGridSizes.value.smMin) {
|
|
2164
2174
|
return "xs";
|
|
2165
|
-
} else if (width >
|
|
2175
|
+
} else if (width > configuredGridSizes.value.smMin && width <= configuredGridSizes.value.mdMin) {
|
|
2166
2176
|
return "sm";
|
|
2167
|
-
} else if (width >
|
|
2177
|
+
} else if (width > configuredGridSizes.value.mdMin && width <= configuredGridSizes.value.lMin) {
|
|
2168
2178
|
return "md";
|
|
2169
|
-
} else if (width >
|
|
2179
|
+
} else if (width > configuredGridSizes.value.lMin && width <= configuredGridSizes.value.xlMin) {
|
|
2170
2180
|
return "l";
|
|
2171
2181
|
} else {
|
|
2172
2182
|
return "xl";
|
|
2173
2183
|
}
|
|
2174
2184
|
});
|
|
2175
|
-
const isMobileWidth = vue.computed(
|
|
2176
|
-
|
|
2177
|
-
|
|
2185
|
+
const isMobileWidth = vue.computed(() => {
|
|
2186
|
+
var _a;
|
|
2187
|
+
return (_a = ["xs", "sm"]) == null ? void 0 : _a.includes(currentScreenWidth.value);
|
|
2188
|
+
});
|
|
2178
2189
|
const setScreenWidth = ({ width }) => {
|
|
2179
2190
|
screenWidth.value = width;
|
|
2180
2191
|
};
|
|
@@ -4183,6 +4194,7 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4183
4194
|
const isMobileSidebarVisible = vue.ref(false);
|
|
4184
4195
|
const optionsStore = useOptionsStore();
|
|
4185
4196
|
const paramsStore = useParamsStore();
|
|
4197
|
+
const screenStore = useScreenStore();
|
|
4186
4198
|
const { searchResultOptions } = storeToRefs(optionsStore);
|
|
4187
4199
|
const facets = vue.computed(() => searchResult.value.facets);
|
|
4188
4200
|
const filters = vue.computed(() => searchResult.value.filters);
|
|
@@ -4228,6 +4240,10 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4228
4240
|
var _a;
|
|
4229
4241
|
return Object.keys((_a = filters.value) != null ? _a : {}).length > 0;
|
|
4230
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
|
+
});
|
|
4231
4247
|
const itemRange = vue.computed(() => {
|
|
4232
4248
|
var _a, _b;
|
|
4233
4249
|
const limit = (_a = paramsStore.limit) != null ? _a : 0;
|
|
@@ -4281,20 +4297,13 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4281
4297
|
return { searchResult: newSearchResult };
|
|
4282
4298
|
};
|
|
4283
4299
|
const setColumnCount = ({ width, grid }) => {
|
|
4300
|
+
var _a;
|
|
4284
4301
|
if (!width || !grid) {
|
|
4285
4302
|
return;
|
|
4286
4303
|
}
|
|
4287
|
-
|
|
4288
|
-
|
|
4289
|
-
|
|
4290
|
-
columnCount.value = grid.columns.sm;
|
|
4291
|
-
} else if (width > MD_MIN_WIDTH && width <= L_MIN_WIDTH) {
|
|
4292
|
-
columnCount.value = grid.columns.md;
|
|
4293
|
-
} else if (width > L_MIN_WIDTH && width <= XL_MIN_WIDTH) {
|
|
4294
|
-
columnCount.value = grid.columns.l;
|
|
4295
|
-
} else {
|
|
4296
|
-
columnCount.value = grid.columns.xl;
|
|
4297
|
-
}
|
|
4304
|
+
const { currentScreenWidth } = storeToRefs(screenStore);
|
|
4305
|
+
const screenWidth = (_a = currentScreenWidth.value) != null ? _a : "xl";
|
|
4306
|
+
columnCount.value = grid.columns[screenWidth];
|
|
4298
4307
|
};
|
|
4299
4308
|
const setAddToCartAmount = (newAddToCartAmount) => {
|
|
4300
4309
|
if (!newAddToCartAmount) {
|
|
@@ -4314,6 +4323,15 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4314
4323
|
const clearSearchResult = () => {
|
|
4315
4324
|
searchResult.value = {};
|
|
4316
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
|
+
};
|
|
4317
4335
|
return {
|
|
4318
4336
|
isMobileSidebarVisible,
|
|
4319
4337
|
searchResult,
|
|
@@ -4333,6 +4351,7 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4333
4351
|
hasAnyFilter,
|
|
4334
4352
|
itemRange,
|
|
4335
4353
|
isPageEmpty,
|
|
4354
|
+
hideFiltersOnExactMatchForKeys,
|
|
4336
4355
|
setSidebarState,
|
|
4337
4356
|
queryFacet,
|
|
4338
4357
|
add,
|
|
@@ -4340,7 +4359,8 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4340
4359
|
setAddToCartAmount,
|
|
4341
4360
|
setLayout,
|
|
4342
4361
|
setLoading,
|
|
4343
|
-
clearSearchResult
|
|
4362
|
+
clearSearchResult,
|
|
4363
|
+
filterVisibleFilterValues
|
|
4344
4364
|
};
|
|
4345
4365
|
});
|
|
4346
4366
|
const _hoisted_1$12 = { class: "lupa-search-box-add-to-cart-wrapper" };
|
|
@@ -6069,11 +6089,25 @@ const _sfc_main$Q = /* @__PURE__ */ vue.defineComponent({
|
|
|
6069
6089
|
const paramsStore = useParamsStore();
|
|
6070
6090
|
const optionStore = useOptionsStore();
|
|
6071
6091
|
const searchResultStore = useSearchResultStore();
|
|
6072
|
-
const {
|
|
6092
|
+
const {
|
|
6093
|
+
filters,
|
|
6094
|
+
displayFilters,
|
|
6095
|
+
currentFilterCount,
|
|
6096
|
+
hideFiltersOnExactMatchForKeys,
|
|
6097
|
+
currentQueryText
|
|
6098
|
+
} = storeToRefs(searchResultStore);
|
|
6073
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
|
+
);
|
|
6074
6108
|
const hasFilters = vue.computed(() => {
|
|
6075
6109
|
var _a;
|
|
6076
|
-
return ((_a =
|
|
6110
|
+
return ((_a = currentDisplayFilters.value) == null ? void 0 : _a.length) > 0;
|
|
6077
6111
|
});
|
|
6078
6112
|
const handleClearAll = () => {
|
|
6079
6113
|
paramsStore.removeAllFilters();
|
|
@@ -6130,7 +6164,7 @@ const _sfc_main$Q = /* @__PURE__ */ vue.defineComponent({
|
|
|
6130
6164
|
]),
|
|
6131
6165
|
!_ctx.expandable || isOpen.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$q, [
|
|
6132
6166
|
vue.createElementVNode("div", _hoisted_4$k, [
|
|
6133
|
-
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(
|
|
6167
|
+
(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(currentDisplayFilters.value, (filter) => {
|
|
6134
6168
|
return vue.openBlock(), vue.createBlock(_sfc_main$R, {
|
|
6135
6169
|
key: filter.key + "_" + filter.value,
|
|
6136
6170
|
filter,
|
|
@@ -6343,11 +6377,12 @@ const _sfc_main$N = /* @__PURE__ */ vue.defineComponent({
|
|
|
6343
6377
|
emits: ["select"],
|
|
6344
6378
|
setup(__props, { emit }) {
|
|
6345
6379
|
const props = __props;
|
|
6380
|
+
const searchResultStore = useSearchResultStore();
|
|
6346
6381
|
const facet = vue.computed(() => {
|
|
6347
6382
|
var _a;
|
|
6348
6383
|
return (_a = props.facet) != null ? _a : { type: "terms", items: [], key: "" };
|
|
6349
6384
|
});
|
|
6350
|
-
const
|
|
6385
|
+
const currentFiltersValue = vue.computed(() => {
|
|
6351
6386
|
var _a;
|
|
6352
6387
|
return (_a = props.currentFilters) != null ? _a : [];
|
|
6353
6388
|
});
|
|
@@ -6358,22 +6393,23 @@ const _sfc_main$N = /* @__PURE__ */ vue.defineComponent({
|
|
|
6358
6393
|
});
|
|
6359
6394
|
const allValues = vue.computed(() => {
|
|
6360
6395
|
var _a, _b;
|
|
6361
|
-
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 : []);
|
|
6362
6397
|
});
|
|
6363
6398
|
const displayValues = vue.computed(() => {
|
|
6364
6399
|
return filteredValues.value.slice(0, itemLimit.value).map((v) => __spreadProps(__spreadValues({}, v), { title: getDisplayValue(v.title) }));
|
|
6365
6400
|
});
|
|
6366
6401
|
const filteredValues = vue.computed(() => {
|
|
6367
|
-
|
|
6402
|
+
var _a, _b;
|
|
6403
|
+
return isFilterable.value ? (_a = allValues.value) == null ? void 0 : _a.filter(
|
|
6368
6404
|
(v) => {
|
|
6369
|
-
var
|
|
6370
|
-
return (
|
|
6405
|
+
var _a2;
|
|
6406
|
+
return (_a2 = getNormalizedString(v.title)) == null ? void 0 : _a2.includes(getNormalizedString(termFilter.value));
|
|
6371
6407
|
}
|
|
6372
|
-
) : allValues.value;
|
|
6408
|
+
) : (_b = allValues.value) != null ? _b : [];
|
|
6373
6409
|
});
|
|
6374
6410
|
const isFilterable = vue.computed(() => {
|
|
6375
|
-
var _a, _b;
|
|
6376
|
-
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);
|
|
6377
6413
|
});
|
|
6378
6414
|
const isRange = vue.computed(() => {
|
|
6379
6415
|
return facet.value.type === "range";
|
|
@@ -6397,7 +6433,7 @@ const _sfc_main$N = /* @__PURE__ */ vue.defineComponent({
|
|
|
6397
6433
|
};
|
|
6398
6434
|
const isChecked = (item) => {
|
|
6399
6435
|
var _a, _b;
|
|
6400
|
-
let selectedItems = (_a =
|
|
6436
|
+
let selectedItems = (_a = currentFiltersValue.value) != null ? _a : [];
|
|
6401
6437
|
selectedItems = isRange.value && selectedItems ? [rangeFilterToString(selectedItems)] : selectedItems;
|
|
6402
6438
|
return selectedItems == null ? void 0 : selectedItems.includes((_b = item.title) == null ? void 0 : _b.toString());
|
|
6403
6439
|
};
|
package/dist/lupaSearch.mjs
CHANGED
|
@@ -2156,23 +2156,34 @@ const DEFAULT_OPTIONS_RESULTS = {
|
|
|
2156
2156
|
};
|
|
2157
2157
|
const useScreenStore = defineStore("screen", () => {
|
|
2158
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
|
+
});
|
|
2159
2169
|
const currentScreenWidth = computed(() => {
|
|
2160
2170
|
const width = screenWidth.value;
|
|
2161
|
-
if (width <=
|
|
2171
|
+
if (width <= configuredGridSizes.value.smMin) {
|
|
2162
2172
|
return "xs";
|
|
2163
|
-
} else if (width >
|
|
2173
|
+
} else if (width > configuredGridSizes.value.smMin && width <= configuredGridSizes.value.mdMin) {
|
|
2164
2174
|
return "sm";
|
|
2165
|
-
} else if (width >
|
|
2175
|
+
} else if (width > configuredGridSizes.value.mdMin && width <= configuredGridSizes.value.lMin) {
|
|
2166
2176
|
return "md";
|
|
2167
|
-
} else if (width >
|
|
2177
|
+
} else if (width > configuredGridSizes.value.lMin && width <= configuredGridSizes.value.xlMin) {
|
|
2168
2178
|
return "l";
|
|
2169
2179
|
} else {
|
|
2170
2180
|
return "xl";
|
|
2171
2181
|
}
|
|
2172
2182
|
});
|
|
2173
|
-
const isMobileWidth = computed(
|
|
2174
|
-
|
|
2175
|
-
|
|
2183
|
+
const isMobileWidth = computed(() => {
|
|
2184
|
+
var _a;
|
|
2185
|
+
return (_a = ["xs", "sm"]) == null ? void 0 : _a.includes(currentScreenWidth.value);
|
|
2186
|
+
});
|
|
2176
2187
|
const setScreenWidth = ({ width }) => {
|
|
2177
2188
|
screenWidth.value = width;
|
|
2178
2189
|
};
|
|
@@ -4181,6 +4192,7 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4181
4192
|
const isMobileSidebarVisible = ref(false);
|
|
4182
4193
|
const optionsStore = useOptionsStore();
|
|
4183
4194
|
const paramsStore = useParamsStore();
|
|
4195
|
+
const screenStore = useScreenStore();
|
|
4184
4196
|
const { searchResultOptions } = storeToRefs(optionsStore);
|
|
4185
4197
|
const facets = computed(() => searchResult.value.facets);
|
|
4186
4198
|
const filters = computed(() => searchResult.value.filters);
|
|
@@ -4226,6 +4238,10 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4226
4238
|
var _a;
|
|
4227
4239
|
return Object.keys((_a = filters.value) != null ? _a : {}).length > 0;
|
|
4228
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
|
+
});
|
|
4229
4245
|
const itemRange = computed(() => {
|
|
4230
4246
|
var _a, _b;
|
|
4231
4247
|
const limit = (_a = paramsStore.limit) != null ? _a : 0;
|
|
@@ -4279,20 +4295,13 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4279
4295
|
return { searchResult: newSearchResult };
|
|
4280
4296
|
};
|
|
4281
4297
|
const setColumnCount = ({ width, grid }) => {
|
|
4298
|
+
var _a;
|
|
4282
4299
|
if (!width || !grid) {
|
|
4283
4300
|
return;
|
|
4284
4301
|
}
|
|
4285
|
-
|
|
4286
|
-
|
|
4287
|
-
|
|
4288
|
-
columnCount.value = grid.columns.sm;
|
|
4289
|
-
} else if (width > MD_MIN_WIDTH && width <= L_MIN_WIDTH) {
|
|
4290
|
-
columnCount.value = grid.columns.md;
|
|
4291
|
-
} else if (width > L_MIN_WIDTH && width <= XL_MIN_WIDTH) {
|
|
4292
|
-
columnCount.value = grid.columns.l;
|
|
4293
|
-
} else {
|
|
4294
|
-
columnCount.value = grid.columns.xl;
|
|
4295
|
-
}
|
|
4302
|
+
const { currentScreenWidth } = storeToRefs(screenStore);
|
|
4303
|
+
const screenWidth = (_a = currentScreenWidth.value) != null ? _a : "xl";
|
|
4304
|
+
columnCount.value = grid.columns[screenWidth];
|
|
4296
4305
|
};
|
|
4297
4306
|
const setAddToCartAmount = (newAddToCartAmount) => {
|
|
4298
4307
|
if (!newAddToCartAmount) {
|
|
@@ -4312,6 +4321,15 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4312
4321
|
const clearSearchResult = () => {
|
|
4313
4322
|
searchResult.value = {};
|
|
4314
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
|
+
};
|
|
4315
4333
|
return {
|
|
4316
4334
|
isMobileSidebarVisible,
|
|
4317
4335
|
searchResult,
|
|
@@ -4331,6 +4349,7 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4331
4349
|
hasAnyFilter,
|
|
4332
4350
|
itemRange,
|
|
4333
4351
|
isPageEmpty,
|
|
4352
|
+
hideFiltersOnExactMatchForKeys,
|
|
4334
4353
|
setSidebarState,
|
|
4335
4354
|
queryFacet,
|
|
4336
4355
|
add,
|
|
@@ -4338,7 +4357,8 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
4338
4357
|
setAddToCartAmount,
|
|
4339
4358
|
setLayout,
|
|
4340
4359
|
setLoading,
|
|
4341
|
-
clearSearchResult
|
|
4360
|
+
clearSearchResult,
|
|
4361
|
+
filterVisibleFilterValues
|
|
4342
4362
|
};
|
|
4343
4363
|
});
|
|
4344
4364
|
const _hoisted_1$12 = { class: "lupa-search-box-add-to-cart-wrapper" };
|
|
@@ -6067,11 +6087,25 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
|
|
|
6067
6087
|
const paramsStore = useParamsStore();
|
|
6068
6088
|
const optionStore = useOptionsStore();
|
|
6069
6089
|
const searchResultStore = useSearchResultStore();
|
|
6070
|
-
const {
|
|
6090
|
+
const {
|
|
6091
|
+
filters,
|
|
6092
|
+
displayFilters,
|
|
6093
|
+
currentFilterCount,
|
|
6094
|
+
hideFiltersOnExactMatchForKeys,
|
|
6095
|
+
currentQueryText
|
|
6096
|
+
} = storeToRefs(searchResultStore);
|
|
6071
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
|
+
);
|
|
6072
6106
|
const hasFilters = computed(() => {
|
|
6073
6107
|
var _a;
|
|
6074
|
-
return ((_a =
|
|
6108
|
+
return ((_a = currentDisplayFilters.value) == null ? void 0 : _a.length) > 0;
|
|
6075
6109
|
});
|
|
6076
6110
|
const handleClearAll = () => {
|
|
6077
6111
|
paramsStore.removeAllFilters();
|
|
@@ -6128,7 +6162,7 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
|
|
|
6128
6162
|
]),
|
|
6129
6163
|
!_ctx.expandable || isOpen.value ? (openBlock(), createElementBlock("div", _hoisted_3$q, [
|
|
6130
6164
|
createElementVNode("div", _hoisted_4$k, [
|
|
6131
|
-
(openBlock(true), createElementBlock(Fragment, null, renderList(
|
|
6165
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(currentDisplayFilters.value, (filter) => {
|
|
6132
6166
|
return openBlock(), createBlock(_sfc_main$R, {
|
|
6133
6167
|
key: filter.key + "_" + filter.value,
|
|
6134
6168
|
filter,
|
|
@@ -6341,11 +6375,12 @@ const _sfc_main$N = /* @__PURE__ */ defineComponent({
|
|
|
6341
6375
|
emits: ["select"],
|
|
6342
6376
|
setup(__props, { emit }) {
|
|
6343
6377
|
const props = __props;
|
|
6378
|
+
const searchResultStore = useSearchResultStore();
|
|
6344
6379
|
const facet = computed(() => {
|
|
6345
6380
|
var _a;
|
|
6346
6381
|
return (_a = props.facet) != null ? _a : { type: "terms", items: [], key: "" };
|
|
6347
6382
|
});
|
|
6348
|
-
const
|
|
6383
|
+
const currentFiltersValue = computed(() => {
|
|
6349
6384
|
var _a;
|
|
6350
6385
|
return (_a = props.currentFilters) != null ? _a : [];
|
|
6351
6386
|
});
|
|
@@ -6356,22 +6391,23 @@ const _sfc_main$N = /* @__PURE__ */ defineComponent({
|
|
|
6356
6391
|
});
|
|
6357
6392
|
const allValues = computed(() => {
|
|
6358
6393
|
var _a, _b;
|
|
6359
|
-
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 : []);
|
|
6360
6395
|
});
|
|
6361
6396
|
const displayValues = computed(() => {
|
|
6362
6397
|
return filteredValues.value.slice(0, itemLimit.value).map((v) => __spreadProps(__spreadValues({}, v), { title: getDisplayValue(v.title) }));
|
|
6363
6398
|
});
|
|
6364
6399
|
const filteredValues = computed(() => {
|
|
6365
|
-
|
|
6400
|
+
var _a, _b;
|
|
6401
|
+
return isFilterable.value ? (_a = allValues.value) == null ? void 0 : _a.filter(
|
|
6366
6402
|
(v) => {
|
|
6367
|
-
var
|
|
6368
|
-
return (
|
|
6403
|
+
var _a2;
|
|
6404
|
+
return (_a2 = getNormalizedString(v.title)) == null ? void 0 : _a2.includes(getNormalizedString(termFilter.value));
|
|
6369
6405
|
}
|
|
6370
|
-
) : allValues.value;
|
|
6406
|
+
) : (_b = allValues.value) != null ? _b : [];
|
|
6371
6407
|
});
|
|
6372
6408
|
const isFilterable = computed(() => {
|
|
6373
|
-
var _a, _b;
|
|
6374
|
-
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);
|
|
6375
6411
|
});
|
|
6376
6412
|
const isRange = computed(() => {
|
|
6377
6413
|
return facet.value.type === "range";
|
|
@@ -6395,7 +6431,7 @@ const _sfc_main$N = /* @__PURE__ */ defineComponent({
|
|
|
6395
6431
|
};
|
|
6396
6432
|
const isChecked = (item) => {
|
|
6397
6433
|
var _a, _b;
|
|
6398
|
-
let selectedItems = (_a =
|
|
6434
|
+
let selectedItems = (_a = currentFiltersValue.value) != null ? _a : [];
|
|
6399
6435
|
selectedItems = isRange.value && selectedItems ? [rangeFilterToString(selectedItems)] : selectedItems;
|
|
6400
6436
|
return selectedItems == null ? void 0 : selectedItems.includes((_b = item.title) == null ? void 0 : _b.toString());
|
|
6401
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?: {
|