@getlupa/client 1.11.9 → 1.12.1
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.iife.js +69 -32
- package/dist/lupaSearch.js +69 -32
- package/dist/lupaSearch.mjs +69 -32
- package/dist/lupaSearch.umd.js +69 -32
- package/package.json +2 -2
package/dist/lupaSearch.iife.js
CHANGED
|
@@ -7382,23 +7382,34 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
7382
7382
|
};
|
|
7383
7383
|
const useScreenStore = defineStore("screen", () => {
|
|
7384
7384
|
const screenWidth = ref(1e3);
|
|
7385
|
+
const optionsStore = useOptionsStore();
|
|
7386
|
+
const configuredGridSizes = computed(() => {
|
|
7387
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p;
|
|
7388
|
+
return {
|
|
7389
|
+
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,
|
|
7390
|
+
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,
|
|
7391
|
+
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,
|
|
7392
|
+
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
|
|
7393
|
+
};
|
|
7394
|
+
});
|
|
7385
7395
|
const currentScreenWidth = computed(() => {
|
|
7386
7396
|
const width = screenWidth.value;
|
|
7387
|
-
if (width <=
|
|
7397
|
+
if (width <= configuredGridSizes.value.smMin) {
|
|
7388
7398
|
return "xs";
|
|
7389
|
-
} else if (width >
|
|
7399
|
+
} else if (width > configuredGridSizes.value.smMin && width <= configuredGridSizes.value.mdMin) {
|
|
7390
7400
|
return "sm";
|
|
7391
|
-
} else if (width >
|
|
7401
|
+
} else if (width > configuredGridSizes.value.mdMin && width <= configuredGridSizes.value.lMin) {
|
|
7392
7402
|
return "md";
|
|
7393
|
-
} else if (width >
|
|
7403
|
+
} else if (width > configuredGridSizes.value.lMin && width <= configuredGridSizes.value.xlMin) {
|
|
7394
7404
|
return "l";
|
|
7395
7405
|
} else {
|
|
7396
7406
|
return "xl";
|
|
7397
7407
|
}
|
|
7398
7408
|
});
|
|
7399
|
-
const isMobileWidth = computed(
|
|
7400
|
-
|
|
7401
|
-
|
|
7409
|
+
const isMobileWidth = computed(() => {
|
|
7410
|
+
var _a;
|
|
7411
|
+
return (_a = ["xs", "sm"]) == null ? void 0 : _a.includes(currentScreenWidth.value);
|
|
7412
|
+
});
|
|
7402
7413
|
const setScreenWidth = ({ width }) => {
|
|
7403
7414
|
screenWidth.value = width;
|
|
7404
7415
|
};
|
|
@@ -9407,6 +9418,7 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
9407
9418
|
const isMobileSidebarVisible = ref(false);
|
|
9408
9419
|
const optionsStore = useOptionsStore();
|
|
9409
9420
|
const paramsStore = useParamsStore();
|
|
9421
|
+
const screenStore = useScreenStore();
|
|
9410
9422
|
const { searchResultOptions } = storeToRefs(optionsStore);
|
|
9411
9423
|
const facets = computed(() => searchResult.value.facets);
|
|
9412
9424
|
const filters = computed(() => searchResult.value.filters);
|
|
@@ -9452,6 +9464,10 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
9452
9464
|
var _a;
|
|
9453
9465
|
return Object.keys((_a = filters.value) != null ? _a : {}).length > 0;
|
|
9454
9466
|
});
|
|
9467
|
+
const hideFiltersOnExactMatchForKeys = computed(() => {
|
|
9468
|
+
var _a, _b, _c, _d;
|
|
9469
|
+
return (_d = (_c = (_b = (_a = searchResultOptions.value) == null ? void 0 : _a.filters) == null ? void 0 : _b.facets) == null ? void 0 : _c.hideFiltersOnExactMatchForKeys) != null ? _d : [];
|
|
9470
|
+
});
|
|
9455
9471
|
const itemRange = computed(() => {
|
|
9456
9472
|
var _a, _b;
|
|
9457
9473
|
const limit = (_a = paramsStore.limit) != null ? _a : 0;
|
|
@@ -9505,20 +9521,14 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
9505
9521
|
return { searchResult: newSearchResult };
|
|
9506
9522
|
};
|
|
9507
9523
|
const setColumnCount = ({ width, grid }) => {
|
|
9524
|
+
var _a;
|
|
9508
9525
|
if (!width || !grid) {
|
|
9509
9526
|
return;
|
|
9510
9527
|
}
|
|
9511
|
-
|
|
9512
|
-
|
|
9513
|
-
|
|
9514
|
-
|
|
9515
|
-
} else if (width > MD_MIN_WIDTH && width <= L_MIN_WIDTH) {
|
|
9516
|
-
columnCount.value = grid.columns.md;
|
|
9517
|
-
} else if (width > L_MIN_WIDTH && width <= XL_MIN_WIDTH) {
|
|
9518
|
-
columnCount.value = grid.columns.l;
|
|
9519
|
-
} else {
|
|
9520
|
-
columnCount.value = grid.columns.xl;
|
|
9521
|
-
}
|
|
9528
|
+
screenStore.setScreenWidth({ width });
|
|
9529
|
+
const { currentScreenWidth } = storeToRefs(screenStore);
|
|
9530
|
+
const screenWidth = (_a = currentScreenWidth.value) != null ? _a : "xl";
|
|
9531
|
+
columnCount.value = grid.columns[screenWidth];
|
|
9522
9532
|
};
|
|
9523
9533
|
const setAddToCartAmount = (newAddToCartAmount) => {
|
|
9524
9534
|
if (!newAddToCartAmount) {
|
|
@@ -9538,6 +9548,15 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
9538
9548
|
const clearSearchResult = () => {
|
|
9539
9549
|
searchResult.value = {};
|
|
9540
9550
|
};
|
|
9551
|
+
const filterVisibleFilterValues = (key, items = []) => {
|
|
9552
|
+
var _a;
|
|
9553
|
+
if (!((_a = hideFiltersOnExactMatchForKeys.value) == null ? void 0 : _a.length) || !hideFiltersOnExactMatchForKeys.value.includes(key) || !items.length) {
|
|
9554
|
+
return items;
|
|
9555
|
+
}
|
|
9556
|
+
const searchInput = getNormalizedString(currentQueryText.value);
|
|
9557
|
+
const hasExactMatch = items.some((item) => getNormalizedString(item.title) === searchInput);
|
|
9558
|
+
return hasExactMatch ? items.filter((item) => getNormalizedString(item.title) === searchInput) : items;
|
|
9559
|
+
};
|
|
9541
9560
|
return {
|
|
9542
9561
|
isMobileSidebarVisible,
|
|
9543
9562
|
searchResult,
|
|
@@ -9557,6 +9576,7 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
9557
9576
|
hasAnyFilter,
|
|
9558
9577
|
itemRange,
|
|
9559
9578
|
isPageEmpty,
|
|
9579
|
+
hideFiltersOnExactMatchForKeys,
|
|
9560
9580
|
setSidebarState,
|
|
9561
9581
|
queryFacet,
|
|
9562
9582
|
add: add2,
|
|
@@ -9564,7 +9584,8 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
9564
9584
|
setAddToCartAmount,
|
|
9565
9585
|
setLayout,
|
|
9566
9586
|
setLoading,
|
|
9567
|
-
clearSearchResult
|
|
9587
|
+
clearSearchResult,
|
|
9588
|
+
filterVisibleFilterValues
|
|
9568
9589
|
};
|
|
9569
9590
|
});
|
|
9570
9591
|
const _hoisted_1$12 = { class: "lupa-search-box-add-to-cart-wrapper" };
|
|
@@ -11277,11 +11298,25 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
11277
11298
|
const paramsStore = useParamsStore();
|
|
11278
11299
|
const optionStore = useOptionsStore();
|
|
11279
11300
|
const searchResultStore = useSearchResultStore();
|
|
11280
|
-
const {
|
|
11301
|
+
const {
|
|
11302
|
+
filters,
|
|
11303
|
+
displayFilters,
|
|
11304
|
+
currentFilterCount,
|
|
11305
|
+
hideFiltersOnExactMatchForKeys,
|
|
11306
|
+
currentQueryText
|
|
11307
|
+
} = storeToRefs(searchResultStore);
|
|
11281
11308
|
const currentFilters = computed(() => filters.value);
|
|
11309
|
+
const currentDisplayFilters = computed(
|
|
11310
|
+
() => hideFiltersOnExactMatchForKeys.value.length ? displayFilters.value.filter(
|
|
11311
|
+
(f2) => {
|
|
11312
|
+
var _a;
|
|
11313
|
+
return !((_a = hideFiltersOnExactMatchForKeys.value) == null ? void 0 : _a.includes(f2.key)) && getNormalizedString(currentQueryText.value) !== getNormalizedString(f2.label);
|
|
11314
|
+
}
|
|
11315
|
+
) : displayFilters.value
|
|
11316
|
+
);
|
|
11282
11317
|
const hasFilters = computed(() => {
|
|
11283
11318
|
var _a;
|
|
11284
|
-
return ((_a =
|
|
11319
|
+
return ((_a = currentDisplayFilters.value) == null ? void 0 : _a.length) > 0;
|
|
11285
11320
|
});
|
|
11286
11321
|
const handleClearAll = () => {
|
|
11287
11322
|
paramsStore.removeAllFilters();
|
|
@@ -11338,7 +11373,7 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
11338
11373
|
]),
|
|
11339
11374
|
!_ctx.expandable || isOpen.value ? (openBlock(), createElementBlock("div", _hoisted_3$q, [
|
|
11340
11375
|
createBaseVNode("div", _hoisted_4$k, [
|
|
11341
|
-
(openBlock(true), createElementBlock(Fragment, null, renderList(
|
|
11376
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(currentDisplayFilters.value, (filter) => {
|
|
11342
11377
|
return openBlock(), createBlock(_sfc_main$R, {
|
|
11343
11378
|
key: filter.key + "_" + filter.value,
|
|
11344
11379
|
filter,
|
|
@@ -11551,11 +11586,12 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
11551
11586
|
emits: ["select"],
|
|
11552
11587
|
setup(__props, { emit: emit2 }) {
|
|
11553
11588
|
const props = __props;
|
|
11589
|
+
const searchResultStore = useSearchResultStore();
|
|
11554
11590
|
const facet = computed(() => {
|
|
11555
11591
|
var _a;
|
|
11556
11592
|
return (_a = props.facet) != null ? _a : { type: "terms", items: [], key: "" };
|
|
11557
11593
|
});
|
|
11558
|
-
const
|
|
11594
|
+
const currentFiltersValue = computed(() => {
|
|
11559
11595
|
var _a;
|
|
11560
11596
|
return (_a = props.currentFilters) != null ? _a : [];
|
|
11561
11597
|
});
|
|
@@ -11566,22 +11602,23 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
11566
11602
|
});
|
|
11567
11603
|
const allValues = computed(() => {
|
|
11568
11604
|
var _a, _b;
|
|
11569
|
-
return (_b = (_a = facet.value) == null ? void 0 : _a.items) != null ? _b : [];
|
|
11605
|
+
return searchResultStore.filterVisibleFilterValues(facet.value.key, (_b = (_a = facet.value) == null ? void 0 : _a.items) != null ? _b : []);
|
|
11570
11606
|
});
|
|
11571
11607
|
const displayValues = computed(() => {
|
|
11572
11608
|
return filteredValues.value.slice(0, itemLimit.value).map((v) => __spreadProps2(__spreadValues2({}, v), { title: getDisplayValue(v.title) }));
|
|
11573
11609
|
});
|
|
11574
11610
|
const filteredValues = computed(() => {
|
|
11575
|
-
|
|
11611
|
+
var _a, _b;
|
|
11612
|
+
return isFilterable.value ? (_a = allValues.value) == null ? void 0 : _a.filter(
|
|
11576
11613
|
(v) => {
|
|
11577
|
-
var
|
|
11578
|
-
return (
|
|
11614
|
+
var _a2;
|
|
11615
|
+
return (_a2 = getNormalizedString(v.title)) == null ? void 0 : _a2.includes(getNormalizedString(termFilter.value));
|
|
11579
11616
|
}
|
|
11580
|
-
) : allValues.value;
|
|
11617
|
+
) : (_b = allValues.value) != null ? _b : [];
|
|
11581
11618
|
});
|
|
11582
11619
|
const isFilterable = computed(() => {
|
|
11583
|
-
var _a, _b;
|
|
11584
|
-
return allValues.value.length >= ((
|
|
11620
|
+
var _a, _b, _c;
|
|
11621
|
+
return ((_a = allValues.value) == null ? void 0 : _a.length) >= ((_c = (_b = props.options.filterable) == null ? void 0 : _b.minValues) != null ? _c : MAX_FACET_VALUES);
|
|
11585
11622
|
});
|
|
11586
11623
|
const isRange = computed(() => {
|
|
11587
11624
|
return facet.value.type === "range";
|
|
@@ -11605,7 +11642,7 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
11605
11642
|
};
|
|
11606
11643
|
const isChecked = (item) => {
|
|
11607
11644
|
var _a, _b;
|
|
11608
|
-
let selectedItems = (_a =
|
|
11645
|
+
let selectedItems = (_a = currentFiltersValue.value) != null ? _a : [];
|
|
11609
11646
|
selectedItems = isRange.value && selectedItems ? [rangeFilterToString(selectedItems)] : selectedItems;
|
|
11610
11647
|
return selectedItems == null ? void 0 : selectedItems.includes((_b = item.title) == null ? void 0 : _b.toString());
|
|
11611
11648
|
};
|
|
@@ -15519,8 +15556,8 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
15519
15556
|
const handleResize = () => {
|
|
15520
15557
|
const doc2 = document.documentElement;
|
|
15521
15558
|
doc2.style.setProperty("--lupa-full-height", `${window.innerHeight}px`);
|
|
15522
|
-
searchResultStore.setColumnCount({ width: window.innerWidth, grid: props.options.grid });
|
|
15523
15559
|
screenStore.setScreenWidth({ width: window.innerWidth });
|
|
15560
|
+
searchResultStore.setColumnCount({ width: window.innerWidth, grid: props.options.grid });
|
|
15524
15561
|
};
|
|
15525
15562
|
const handleUrlChange = (params) => {
|
|
15526
15563
|
var _a;
|
package/dist/lupaSearch.js
CHANGED
|
@@ -7382,23 +7382,34 @@ const DEFAULT_OPTIONS_RESULTS$1 = {
|
|
|
7382
7382
|
};
|
|
7383
7383
|
const useScreenStore = defineStore("screen", () => {
|
|
7384
7384
|
const screenWidth = ref(1e3);
|
|
7385
|
+
const optionsStore = useOptionsStore();
|
|
7386
|
+
const configuredGridSizes = computed(() => {
|
|
7387
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p;
|
|
7388
|
+
return {
|
|
7389
|
+
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,
|
|
7390
|
+
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,
|
|
7391
|
+
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,
|
|
7392
|
+
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
|
|
7393
|
+
};
|
|
7394
|
+
});
|
|
7385
7395
|
const currentScreenWidth = computed(() => {
|
|
7386
7396
|
const width = screenWidth.value;
|
|
7387
|
-
if (width <=
|
|
7397
|
+
if (width <= configuredGridSizes.value.smMin) {
|
|
7388
7398
|
return "xs";
|
|
7389
|
-
} else if (width >
|
|
7399
|
+
} else if (width > configuredGridSizes.value.smMin && width <= configuredGridSizes.value.mdMin) {
|
|
7390
7400
|
return "sm";
|
|
7391
|
-
} else if (width >
|
|
7401
|
+
} else if (width > configuredGridSizes.value.mdMin && width <= configuredGridSizes.value.lMin) {
|
|
7392
7402
|
return "md";
|
|
7393
|
-
} else if (width >
|
|
7403
|
+
} else if (width > configuredGridSizes.value.lMin && width <= configuredGridSizes.value.xlMin) {
|
|
7394
7404
|
return "l";
|
|
7395
7405
|
} else {
|
|
7396
7406
|
return "xl";
|
|
7397
7407
|
}
|
|
7398
7408
|
});
|
|
7399
|
-
const isMobileWidth = computed(
|
|
7400
|
-
|
|
7401
|
-
|
|
7409
|
+
const isMobileWidth = computed(() => {
|
|
7410
|
+
var _a;
|
|
7411
|
+
return (_a = ["xs", "sm"]) == null ? void 0 : _a.includes(currentScreenWidth.value);
|
|
7412
|
+
});
|
|
7402
7413
|
const setScreenWidth = ({ width }) => {
|
|
7403
7414
|
screenWidth.value = width;
|
|
7404
7415
|
};
|
|
@@ -9407,6 +9418,7 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
9407
9418
|
const isMobileSidebarVisible = ref(false);
|
|
9408
9419
|
const optionsStore = useOptionsStore();
|
|
9409
9420
|
const paramsStore = useParamsStore();
|
|
9421
|
+
const screenStore = useScreenStore();
|
|
9410
9422
|
const { searchResultOptions } = storeToRefs(optionsStore);
|
|
9411
9423
|
const facets = computed(() => searchResult.value.facets);
|
|
9412
9424
|
const filters = computed(() => searchResult.value.filters);
|
|
@@ -9452,6 +9464,10 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
9452
9464
|
var _a;
|
|
9453
9465
|
return Object.keys((_a = filters.value) != null ? _a : {}).length > 0;
|
|
9454
9466
|
});
|
|
9467
|
+
const hideFiltersOnExactMatchForKeys = computed(() => {
|
|
9468
|
+
var _a, _b, _c, _d;
|
|
9469
|
+
return (_d = (_c = (_b = (_a = searchResultOptions.value) == null ? void 0 : _a.filters) == null ? void 0 : _b.facets) == null ? void 0 : _c.hideFiltersOnExactMatchForKeys) != null ? _d : [];
|
|
9470
|
+
});
|
|
9455
9471
|
const itemRange = computed(() => {
|
|
9456
9472
|
var _a, _b;
|
|
9457
9473
|
const limit = (_a = paramsStore.limit) != null ? _a : 0;
|
|
@@ -9505,20 +9521,14 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
9505
9521
|
return { searchResult: newSearchResult };
|
|
9506
9522
|
};
|
|
9507
9523
|
const setColumnCount = ({ width, grid }) => {
|
|
9524
|
+
var _a;
|
|
9508
9525
|
if (!width || !grid) {
|
|
9509
9526
|
return;
|
|
9510
9527
|
}
|
|
9511
|
-
|
|
9512
|
-
|
|
9513
|
-
|
|
9514
|
-
|
|
9515
|
-
} else if (width > MD_MIN_WIDTH && width <= L_MIN_WIDTH) {
|
|
9516
|
-
columnCount.value = grid.columns.md;
|
|
9517
|
-
} else if (width > L_MIN_WIDTH && width <= XL_MIN_WIDTH) {
|
|
9518
|
-
columnCount.value = grid.columns.l;
|
|
9519
|
-
} else {
|
|
9520
|
-
columnCount.value = grid.columns.xl;
|
|
9521
|
-
}
|
|
9528
|
+
screenStore.setScreenWidth({ width });
|
|
9529
|
+
const { currentScreenWidth } = storeToRefs(screenStore);
|
|
9530
|
+
const screenWidth = (_a = currentScreenWidth.value) != null ? _a : "xl";
|
|
9531
|
+
columnCount.value = grid.columns[screenWidth];
|
|
9522
9532
|
};
|
|
9523
9533
|
const setAddToCartAmount = (newAddToCartAmount) => {
|
|
9524
9534
|
if (!newAddToCartAmount) {
|
|
@@ -9538,6 +9548,15 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
9538
9548
|
const clearSearchResult = () => {
|
|
9539
9549
|
searchResult.value = {};
|
|
9540
9550
|
};
|
|
9551
|
+
const filterVisibleFilterValues = (key, items = []) => {
|
|
9552
|
+
var _a;
|
|
9553
|
+
if (!((_a = hideFiltersOnExactMatchForKeys.value) == null ? void 0 : _a.length) || !hideFiltersOnExactMatchForKeys.value.includes(key) || !items.length) {
|
|
9554
|
+
return items;
|
|
9555
|
+
}
|
|
9556
|
+
const searchInput = getNormalizedString(currentQueryText.value);
|
|
9557
|
+
const hasExactMatch = items.some((item) => getNormalizedString(item.title) === searchInput);
|
|
9558
|
+
return hasExactMatch ? items.filter((item) => getNormalizedString(item.title) === searchInput) : items;
|
|
9559
|
+
};
|
|
9541
9560
|
return {
|
|
9542
9561
|
isMobileSidebarVisible,
|
|
9543
9562
|
searchResult,
|
|
@@ -9557,6 +9576,7 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
9557
9576
|
hasAnyFilter,
|
|
9558
9577
|
itemRange,
|
|
9559
9578
|
isPageEmpty,
|
|
9579
|
+
hideFiltersOnExactMatchForKeys,
|
|
9560
9580
|
setSidebarState,
|
|
9561
9581
|
queryFacet,
|
|
9562
9582
|
add: add2,
|
|
@@ -9564,7 +9584,8 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
9564
9584
|
setAddToCartAmount,
|
|
9565
9585
|
setLayout,
|
|
9566
9586
|
setLoading,
|
|
9567
|
-
clearSearchResult
|
|
9587
|
+
clearSearchResult,
|
|
9588
|
+
filterVisibleFilterValues
|
|
9568
9589
|
};
|
|
9569
9590
|
});
|
|
9570
9591
|
const _hoisted_1$12 = { class: "lupa-search-box-add-to-cart-wrapper" };
|
|
@@ -11277,11 +11298,25 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
|
|
|
11277
11298
|
const paramsStore = useParamsStore();
|
|
11278
11299
|
const optionStore = useOptionsStore();
|
|
11279
11300
|
const searchResultStore = useSearchResultStore();
|
|
11280
|
-
const {
|
|
11301
|
+
const {
|
|
11302
|
+
filters,
|
|
11303
|
+
displayFilters,
|
|
11304
|
+
currentFilterCount,
|
|
11305
|
+
hideFiltersOnExactMatchForKeys,
|
|
11306
|
+
currentQueryText
|
|
11307
|
+
} = storeToRefs(searchResultStore);
|
|
11281
11308
|
const currentFilters = computed(() => filters.value);
|
|
11309
|
+
const currentDisplayFilters = computed(
|
|
11310
|
+
() => hideFiltersOnExactMatchForKeys.value.length ? displayFilters.value.filter(
|
|
11311
|
+
(f2) => {
|
|
11312
|
+
var _a;
|
|
11313
|
+
return !((_a = hideFiltersOnExactMatchForKeys.value) == null ? void 0 : _a.includes(f2.key)) && getNormalizedString(currentQueryText.value) !== getNormalizedString(f2.label);
|
|
11314
|
+
}
|
|
11315
|
+
) : displayFilters.value
|
|
11316
|
+
);
|
|
11282
11317
|
const hasFilters = computed(() => {
|
|
11283
11318
|
var _a;
|
|
11284
|
-
return ((_a =
|
|
11319
|
+
return ((_a = currentDisplayFilters.value) == null ? void 0 : _a.length) > 0;
|
|
11285
11320
|
});
|
|
11286
11321
|
const handleClearAll = () => {
|
|
11287
11322
|
paramsStore.removeAllFilters();
|
|
@@ -11338,7 +11373,7 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
|
|
|
11338
11373
|
]),
|
|
11339
11374
|
!_ctx.expandable || isOpen.value ? (openBlock(), createElementBlock("div", _hoisted_3$q, [
|
|
11340
11375
|
createBaseVNode("div", _hoisted_4$k, [
|
|
11341
|
-
(openBlock(true), createElementBlock(Fragment, null, renderList(
|
|
11376
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(currentDisplayFilters.value, (filter) => {
|
|
11342
11377
|
return openBlock(), createBlock(_sfc_main$R, {
|
|
11343
11378
|
key: filter.key + "_" + filter.value,
|
|
11344
11379
|
filter,
|
|
@@ -11551,11 +11586,12 @@ const _sfc_main$N = /* @__PURE__ */ defineComponent({
|
|
|
11551
11586
|
emits: ["select"],
|
|
11552
11587
|
setup(__props, { emit: emit2 }) {
|
|
11553
11588
|
const props = __props;
|
|
11589
|
+
const searchResultStore = useSearchResultStore();
|
|
11554
11590
|
const facet = computed(() => {
|
|
11555
11591
|
var _a;
|
|
11556
11592
|
return (_a = props.facet) != null ? _a : { type: "terms", items: [], key: "" };
|
|
11557
11593
|
});
|
|
11558
|
-
const
|
|
11594
|
+
const currentFiltersValue = computed(() => {
|
|
11559
11595
|
var _a;
|
|
11560
11596
|
return (_a = props.currentFilters) != null ? _a : [];
|
|
11561
11597
|
});
|
|
@@ -11566,22 +11602,23 @@ const _sfc_main$N = /* @__PURE__ */ defineComponent({
|
|
|
11566
11602
|
});
|
|
11567
11603
|
const allValues = computed(() => {
|
|
11568
11604
|
var _a, _b;
|
|
11569
|
-
return (_b = (_a = facet.value) == null ? void 0 : _a.items) != null ? _b : [];
|
|
11605
|
+
return searchResultStore.filterVisibleFilterValues(facet.value.key, (_b = (_a = facet.value) == null ? void 0 : _a.items) != null ? _b : []);
|
|
11570
11606
|
});
|
|
11571
11607
|
const displayValues = computed(() => {
|
|
11572
11608
|
return filteredValues.value.slice(0, itemLimit.value).map((v) => __spreadProps2(__spreadValues2({}, v), { title: getDisplayValue(v.title) }));
|
|
11573
11609
|
});
|
|
11574
11610
|
const filteredValues = computed(() => {
|
|
11575
|
-
|
|
11611
|
+
var _a, _b;
|
|
11612
|
+
return isFilterable.value ? (_a = allValues.value) == null ? void 0 : _a.filter(
|
|
11576
11613
|
(v) => {
|
|
11577
|
-
var
|
|
11578
|
-
return (
|
|
11614
|
+
var _a2;
|
|
11615
|
+
return (_a2 = getNormalizedString(v.title)) == null ? void 0 : _a2.includes(getNormalizedString(termFilter.value));
|
|
11579
11616
|
}
|
|
11580
|
-
) : allValues.value;
|
|
11617
|
+
) : (_b = allValues.value) != null ? _b : [];
|
|
11581
11618
|
});
|
|
11582
11619
|
const isFilterable = computed(() => {
|
|
11583
|
-
var _a, _b;
|
|
11584
|
-
return allValues.value.length >= ((
|
|
11620
|
+
var _a, _b, _c;
|
|
11621
|
+
return ((_a = allValues.value) == null ? void 0 : _a.length) >= ((_c = (_b = props.options.filterable) == null ? void 0 : _b.minValues) != null ? _c : MAX_FACET_VALUES);
|
|
11585
11622
|
});
|
|
11586
11623
|
const isRange = computed(() => {
|
|
11587
11624
|
return facet.value.type === "range";
|
|
@@ -11605,7 +11642,7 @@ const _sfc_main$N = /* @__PURE__ */ defineComponent({
|
|
|
11605
11642
|
};
|
|
11606
11643
|
const isChecked = (item) => {
|
|
11607
11644
|
var _a, _b;
|
|
11608
|
-
let selectedItems = (_a =
|
|
11645
|
+
let selectedItems = (_a = currentFiltersValue.value) != null ? _a : [];
|
|
11609
11646
|
selectedItems = isRange.value && selectedItems ? [rangeFilterToString(selectedItems)] : selectedItems;
|
|
11610
11647
|
return selectedItems == null ? void 0 : selectedItems.includes((_b = item.title) == null ? void 0 : _b.toString());
|
|
11611
11648
|
};
|
|
@@ -15519,8 +15556,8 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
|
|
|
15519
15556
|
const handleResize = () => {
|
|
15520
15557
|
const doc2 = document.documentElement;
|
|
15521
15558
|
doc2.style.setProperty("--lupa-full-height", `${window.innerHeight}px`);
|
|
15522
|
-
searchResultStore.setColumnCount({ width: window.innerWidth, grid: props.options.grid });
|
|
15523
15559
|
screenStore.setScreenWidth({ width: window.innerWidth });
|
|
15560
|
+
searchResultStore.setColumnCount({ width: window.innerWidth, grid: props.options.grid });
|
|
15524
15561
|
};
|
|
15525
15562
|
const handleUrlChange = (params) => {
|
|
15526
15563
|
var _a;
|
package/dist/lupaSearch.mjs
CHANGED
|
@@ -7380,23 +7380,34 @@ const DEFAULT_OPTIONS_RESULTS$1 = {
|
|
|
7380
7380
|
};
|
|
7381
7381
|
const useScreenStore = defineStore("screen", () => {
|
|
7382
7382
|
const screenWidth = ref(1e3);
|
|
7383
|
+
const optionsStore = useOptionsStore();
|
|
7384
|
+
const configuredGridSizes = computed(() => {
|
|
7385
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p;
|
|
7386
|
+
return {
|
|
7387
|
+
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,
|
|
7388
|
+
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,
|
|
7389
|
+
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,
|
|
7390
|
+
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
|
|
7391
|
+
};
|
|
7392
|
+
});
|
|
7383
7393
|
const currentScreenWidth = computed(() => {
|
|
7384
7394
|
const width = screenWidth.value;
|
|
7385
|
-
if (width <=
|
|
7395
|
+
if (width <= configuredGridSizes.value.smMin) {
|
|
7386
7396
|
return "xs";
|
|
7387
|
-
} else if (width >
|
|
7397
|
+
} else if (width > configuredGridSizes.value.smMin && width <= configuredGridSizes.value.mdMin) {
|
|
7388
7398
|
return "sm";
|
|
7389
|
-
} else if (width >
|
|
7399
|
+
} else if (width > configuredGridSizes.value.mdMin && width <= configuredGridSizes.value.lMin) {
|
|
7390
7400
|
return "md";
|
|
7391
|
-
} else if (width >
|
|
7401
|
+
} else if (width > configuredGridSizes.value.lMin && width <= configuredGridSizes.value.xlMin) {
|
|
7392
7402
|
return "l";
|
|
7393
7403
|
} else {
|
|
7394
7404
|
return "xl";
|
|
7395
7405
|
}
|
|
7396
7406
|
});
|
|
7397
|
-
const isMobileWidth = computed(
|
|
7398
|
-
|
|
7399
|
-
|
|
7407
|
+
const isMobileWidth = computed(() => {
|
|
7408
|
+
var _a;
|
|
7409
|
+
return (_a = ["xs", "sm"]) == null ? void 0 : _a.includes(currentScreenWidth.value);
|
|
7410
|
+
});
|
|
7400
7411
|
const setScreenWidth = ({ width }) => {
|
|
7401
7412
|
screenWidth.value = width;
|
|
7402
7413
|
};
|
|
@@ -9405,6 +9416,7 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
9405
9416
|
const isMobileSidebarVisible = ref(false);
|
|
9406
9417
|
const optionsStore = useOptionsStore();
|
|
9407
9418
|
const paramsStore = useParamsStore();
|
|
9419
|
+
const screenStore = useScreenStore();
|
|
9408
9420
|
const { searchResultOptions } = storeToRefs(optionsStore);
|
|
9409
9421
|
const facets = computed(() => searchResult.value.facets);
|
|
9410
9422
|
const filters = computed(() => searchResult.value.filters);
|
|
@@ -9450,6 +9462,10 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
9450
9462
|
var _a;
|
|
9451
9463
|
return Object.keys((_a = filters.value) != null ? _a : {}).length > 0;
|
|
9452
9464
|
});
|
|
9465
|
+
const hideFiltersOnExactMatchForKeys = computed(() => {
|
|
9466
|
+
var _a, _b, _c, _d;
|
|
9467
|
+
return (_d = (_c = (_b = (_a = searchResultOptions.value) == null ? void 0 : _a.filters) == null ? void 0 : _b.facets) == null ? void 0 : _c.hideFiltersOnExactMatchForKeys) != null ? _d : [];
|
|
9468
|
+
});
|
|
9453
9469
|
const itemRange = computed(() => {
|
|
9454
9470
|
var _a, _b;
|
|
9455
9471
|
const limit = (_a = paramsStore.limit) != null ? _a : 0;
|
|
@@ -9503,20 +9519,14 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
9503
9519
|
return { searchResult: newSearchResult };
|
|
9504
9520
|
};
|
|
9505
9521
|
const setColumnCount = ({ width, grid }) => {
|
|
9522
|
+
var _a;
|
|
9506
9523
|
if (!width || !grid) {
|
|
9507
9524
|
return;
|
|
9508
9525
|
}
|
|
9509
|
-
|
|
9510
|
-
|
|
9511
|
-
|
|
9512
|
-
|
|
9513
|
-
} else if (width > MD_MIN_WIDTH && width <= L_MIN_WIDTH) {
|
|
9514
|
-
columnCount.value = grid.columns.md;
|
|
9515
|
-
} else if (width > L_MIN_WIDTH && width <= XL_MIN_WIDTH) {
|
|
9516
|
-
columnCount.value = grid.columns.l;
|
|
9517
|
-
} else {
|
|
9518
|
-
columnCount.value = grid.columns.xl;
|
|
9519
|
-
}
|
|
9526
|
+
screenStore.setScreenWidth({ width });
|
|
9527
|
+
const { currentScreenWidth } = storeToRefs(screenStore);
|
|
9528
|
+
const screenWidth = (_a = currentScreenWidth.value) != null ? _a : "xl";
|
|
9529
|
+
columnCount.value = grid.columns[screenWidth];
|
|
9520
9530
|
};
|
|
9521
9531
|
const setAddToCartAmount = (newAddToCartAmount) => {
|
|
9522
9532
|
if (!newAddToCartAmount) {
|
|
@@ -9536,6 +9546,15 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
9536
9546
|
const clearSearchResult = () => {
|
|
9537
9547
|
searchResult.value = {};
|
|
9538
9548
|
};
|
|
9549
|
+
const filterVisibleFilterValues = (key, items = []) => {
|
|
9550
|
+
var _a;
|
|
9551
|
+
if (!((_a = hideFiltersOnExactMatchForKeys.value) == null ? void 0 : _a.length) || !hideFiltersOnExactMatchForKeys.value.includes(key) || !items.length) {
|
|
9552
|
+
return items;
|
|
9553
|
+
}
|
|
9554
|
+
const searchInput = getNormalizedString(currentQueryText.value);
|
|
9555
|
+
const hasExactMatch = items.some((item) => getNormalizedString(item.title) === searchInput);
|
|
9556
|
+
return hasExactMatch ? items.filter((item) => getNormalizedString(item.title) === searchInput) : items;
|
|
9557
|
+
};
|
|
9539
9558
|
return {
|
|
9540
9559
|
isMobileSidebarVisible,
|
|
9541
9560
|
searchResult,
|
|
@@ -9555,6 +9574,7 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
9555
9574
|
hasAnyFilter,
|
|
9556
9575
|
itemRange,
|
|
9557
9576
|
isPageEmpty,
|
|
9577
|
+
hideFiltersOnExactMatchForKeys,
|
|
9558
9578
|
setSidebarState,
|
|
9559
9579
|
queryFacet,
|
|
9560
9580
|
add: add2,
|
|
@@ -9562,7 +9582,8 @@ const useSearchResultStore = defineStore("searchResult", () => {
|
|
|
9562
9582
|
setAddToCartAmount,
|
|
9563
9583
|
setLayout,
|
|
9564
9584
|
setLoading,
|
|
9565
|
-
clearSearchResult
|
|
9585
|
+
clearSearchResult,
|
|
9586
|
+
filterVisibleFilterValues
|
|
9566
9587
|
};
|
|
9567
9588
|
});
|
|
9568
9589
|
const _hoisted_1$12 = { class: "lupa-search-box-add-to-cart-wrapper" };
|
|
@@ -11275,11 +11296,25 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
|
|
|
11275
11296
|
const paramsStore = useParamsStore();
|
|
11276
11297
|
const optionStore = useOptionsStore();
|
|
11277
11298
|
const searchResultStore = useSearchResultStore();
|
|
11278
|
-
const {
|
|
11299
|
+
const {
|
|
11300
|
+
filters,
|
|
11301
|
+
displayFilters,
|
|
11302
|
+
currentFilterCount,
|
|
11303
|
+
hideFiltersOnExactMatchForKeys,
|
|
11304
|
+
currentQueryText
|
|
11305
|
+
} = storeToRefs(searchResultStore);
|
|
11279
11306
|
const currentFilters = computed(() => filters.value);
|
|
11307
|
+
const currentDisplayFilters = computed(
|
|
11308
|
+
() => hideFiltersOnExactMatchForKeys.value.length ? displayFilters.value.filter(
|
|
11309
|
+
(f2) => {
|
|
11310
|
+
var _a;
|
|
11311
|
+
return !((_a = hideFiltersOnExactMatchForKeys.value) == null ? void 0 : _a.includes(f2.key)) && getNormalizedString(currentQueryText.value) !== getNormalizedString(f2.label);
|
|
11312
|
+
}
|
|
11313
|
+
) : displayFilters.value
|
|
11314
|
+
);
|
|
11280
11315
|
const hasFilters = computed(() => {
|
|
11281
11316
|
var _a;
|
|
11282
|
-
return ((_a =
|
|
11317
|
+
return ((_a = currentDisplayFilters.value) == null ? void 0 : _a.length) > 0;
|
|
11283
11318
|
});
|
|
11284
11319
|
const handleClearAll = () => {
|
|
11285
11320
|
paramsStore.removeAllFilters();
|
|
@@ -11336,7 +11371,7 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
|
|
|
11336
11371
|
]),
|
|
11337
11372
|
!_ctx.expandable || isOpen.value ? (openBlock(), createElementBlock("div", _hoisted_3$q, [
|
|
11338
11373
|
createBaseVNode("div", _hoisted_4$k, [
|
|
11339
|
-
(openBlock(true), createElementBlock(Fragment, null, renderList(
|
|
11374
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(currentDisplayFilters.value, (filter) => {
|
|
11340
11375
|
return openBlock(), createBlock(_sfc_main$R, {
|
|
11341
11376
|
key: filter.key + "_" + filter.value,
|
|
11342
11377
|
filter,
|
|
@@ -11549,11 +11584,12 @@ const _sfc_main$N = /* @__PURE__ */ defineComponent({
|
|
|
11549
11584
|
emits: ["select"],
|
|
11550
11585
|
setup(__props, { emit: emit2 }) {
|
|
11551
11586
|
const props = __props;
|
|
11587
|
+
const searchResultStore = useSearchResultStore();
|
|
11552
11588
|
const facet = computed(() => {
|
|
11553
11589
|
var _a;
|
|
11554
11590
|
return (_a = props.facet) != null ? _a : { type: "terms", items: [], key: "" };
|
|
11555
11591
|
});
|
|
11556
|
-
const
|
|
11592
|
+
const currentFiltersValue = computed(() => {
|
|
11557
11593
|
var _a;
|
|
11558
11594
|
return (_a = props.currentFilters) != null ? _a : [];
|
|
11559
11595
|
});
|
|
@@ -11564,22 +11600,23 @@ const _sfc_main$N = /* @__PURE__ */ defineComponent({
|
|
|
11564
11600
|
});
|
|
11565
11601
|
const allValues = computed(() => {
|
|
11566
11602
|
var _a, _b;
|
|
11567
|
-
return (_b = (_a = facet.value) == null ? void 0 : _a.items) != null ? _b : [];
|
|
11603
|
+
return searchResultStore.filterVisibleFilterValues(facet.value.key, (_b = (_a = facet.value) == null ? void 0 : _a.items) != null ? _b : []);
|
|
11568
11604
|
});
|
|
11569
11605
|
const displayValues = computed(() => {
|
|
11570
11606
|
return filteredValues.value.slice(0, itemLimit.value).map((v) => __spreadProps2(__spreadValues2({}, v), { title: getDisplayValue(v.title) }));
|
|
11571
11607
|
});
|
|
11572
11608
|
const filteredValues = computed(() => {
|
|
11573
|
-
|
|
11609
|
+
var _a, _b;
|
|
11610
|
+
return isFilterable.value ? (_a = allValues.value) == null ? void 0 : _a.filter(
|
|
11574
11611
|
(v) => {
|
|
11575
|
-
var
|
|
11576
|
-
return (
|
|
11612
|
+
var _a2;
|
|
11613
|
+
return (_a2 = getNormalizedString(v.title)) == null ? void 0 : _a2.includes(getNormalizedString(termFilter.value));
|
|
11577
11614
|
}
|
|
11578
|
-
) : allValues.value;
|
|
11615
|
+
) : (_b = allValues.value) != null ? _b : [];
|
|
11579
11616
|
});
|
|
11580
11617
|
const isFilterable = computed(() => {
|
|
11581
|
-
var _a, _b;
|
|
11582
|
-
return allValues.value.length >= ((
|
|
11618
|
+
var _a, _b, _c;
|
|
11619
|
+
return ((_a = allValues.value) == null ? void 0 : _a.length) >= ((_c = (_b = props.options.filterable) == null ? void 0 : _b.minValues) != null ? _c : MAX_FACET_VALUES);
|
|
11583
11620
|
});
|
|
11584
11621
|
const isRange = computed(() => {
|
|
11585
11622
|
return facet.value.type === "range";
|
|
@@ -11603,7 +11640,7 @@ const _sfc_main$N = /* @__PURE__ */ defineComponent({
|
|
|
11603
11640
|
};
|
|
11604
11641
|
const isChecked = (item) => {
|
|
11605
11642
|
var _a, _b;
|
|
11606
|
-
let selectedItems = (_a =
|
|
11643
|
+
let selectedItems = (_a = currentFiltersValue.value) != null ? _a : [];
|
|
11607
11644
|
selectedItems = isRange.value && selectedItems ? [rangeFilterToString(selectedItems)] : selectedItems;
|
|
11608
11645
|
return selectedItems == null ? void 0 : selectedItems.includes((_b = item.title) == null ? void 0 : _b.toString());
|
|
11609
11646
|
};
|
|
@@ -15517,8 +15554,8 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
|
|
|
15517
15554
|
const handleResize = () => {
|
|
15518
15555
|
const doc2 = document.documentElement;
|
|
15519
15556
|
doc2.style.setProperty("--lupa-full-height", `${window.innerHeight}px`);
|
|
15520
|
-
searchResultStore.setColumnCount({ width: window.innerWidth, grid: props.options.grid });
|
|
15521
15557
|
screenStore.setScreenWidth({ width: window.innerWidth });
|
|
15558
|
+
searchResultStore.setColumnCount({ width: window.innerWidth, grid: props.options.grid });
|
|
15522
15559
|
};
|
|
15523
15560
|
const handleUrlChange = (params) => {
|
|
15524
15561
|
var _a;
|
package/dist/lupaSearch.umd.js
CHANGED
|
@@ -7384,23 +7384,34 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
7384
7384
|
};
|
|
7385
7385
|
const useScreenStore = defineStore("screen", () => {
|
|
7386
7386
|
const screenWidth = ref(1e3);
|
|
7387
|
+
const optionsStore = useOptionsStore();
|
|
7388
|
+
const configuredGridSizes = computed(() => {
|
|
7389
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p;
|
|
7390
|
+
return {
|
|
7391
|
+
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,
|
|
7392
|
+
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,
|
|
7393
|
+
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,
|
|
7394
|
+
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
|
|
7395
|
+
};
|
|
7396
|
+
});
|
|
7387
7397
|
const currentScreenWidth = computed(() => {
|
|
7388
7398
|
const width = screenWidth.value;
|
|
7389
|
-
if (width <=
|
|
7399
|
+
if (width <= configuredGridSizes.value.smMin) {
|
|
7390
7400
|
return "xs";
|
|
7391
|
-
} else if (width >
|
|
7401
|
+
} else if (width > configuredGridSizes.value.smMin && width <= configuredGridSizes.value.mdMin) {
|
|
7392
7402
|
return "sm";
|
|
7393
|
-
} else if (width >
|
|
7403
|
+
} else if (width > configuredGridSizes.value.mdMin && width <= configuredGridSizes.value.lMin) {
|
|
7394
7404
|
return "md";
|
|
7395
|
-
} else if (width >
|
|
7405
|
+
} else if (width > configuredGridSizes.value.lMin && width <= configuredGridSizes.value.xlMin) {
|
|
7396
7406
|
return "l";
|
|
7397
7407
|
} else {
|
|
7398
7408
|
return "xl";
|
|
7399
7409
|
}
|
|
7400
7410
|
});
|
|
7401
|
-
const isMobileWidth = computed(
|
|
7402
|
-
|
|
7403
|
-
|
|
7411
|
+
const isMobileWidth = computed(() => {
|
|
7412
|
+
var _a;
|
|
7413
|
+
return (_a = ["xs", "sm"]) == null ? void 0 : _a.includes(currentScreenWidth.value);
|
|
7414
|
+
});
|
|
7404
7415
|
const setScreenWidth = ({ width }) => {
|
|
7405
7416
|
screenWidth.value = width;
|
|
7406
7417
|
};
|
|
@@ -9409,6 +9420,7 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
9409
9420
|
const isMobileSidebarVisible = ref(false);
|
|
9410
9421
|
const optionsStore = useOptionsStore();
|
|
9411
9422
|
const paramsStore = useParamsStore();
|
|
9423
|
+
const screenStore = useScreenStore();
|
|
9412
9424
|
const { searchResultOptions } = storeToRefs(optionsStore);
|
|
9413
9425
|
const facets = computed(() => searchResult.value.facets);
|
|
9414
9426
|
const filters = computed(() => searchResult.value.filters);
|
|
@@ -9454,6 +9466,10 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
9454
9466
|
var _a;
|
|
9455
9467
|
return Object.keys((_a = filters.value) != null ? _a : {}).length > 0;
|
|
9456
9468
|
});
|
|
9469
|
+
const hideFiltersOnExactMatchForKeys = computed(() => {
|
|
9470
|
+
var _a, _b, _c, _d;
|
|
9471
|
+
return (_d = (_c = (_b = (_a = searchResultOptions.value) == null ? void 0 : _a.filters) == null ? void 0 : _b.facets) == null ? void 0 : _c.hideFiltersOnExactMatchForKeys) != null ? _d : [];
|
|
9472
|
+
});
|
|
9457
9473
|
const itemRange = computed(() => {
|
|
9458
9474
|
var _a, _b;
|
|
9459
9475
|
const limit = (_a = paramsStore.limit) != null ? _a : 0;
|
|
@@ -9507,20 +9523,14 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
9507
9523
|
return { searchResult: newSearchResult };
|
|
9508
9524
|
};
|
|
9509
9525
|
const setColumnCount = ({ width, grid }) => {
|
|
9526
|
+
var _a;
|
|
9510
9527
|
if (!width || !grid) {
|
|
9511
9528
|
return;
|
|
9512
9529
|
}
|
|
9513
|
-
|
|
9514
|
-
|
|
9515
|
-
|
|
9516
|
-
|
|
9517
|
-
} else if (width > MD_MIN_WIDTH && width <= L_MIN_WIDTH) {
|
|
9518
|
-
columnCount.value = grid.columns.md;
|
|
9519
|
-
} else if (width > L_MIN_WIDTH && width <= XL_MIN_WIDTH) {
|
|
9520
|
-
columnCount.value = grid.columns.l;
|
|
9521
|
-
} else {
|
|
9522
|
-
columnCount.value = grid.columns.xl;
|
|
9523
|
-
}
|
|
9530
|
+
screenStore.setScreenWidth({ width });
|
|
9531
|
+
const { currentScreenWidth } = storeToRefs(screenStore);
|
|
9532
|
+
const screenWidth = (_a = currentScreenWidth.value) != null ? _a : "xl";
|
|
9533
|
+
columnCount.value = grid.columns[screenWidth];
|
|
9524
9534
|
};
|
|
9525
9535
|
const setAddToCartAmount = (newAddToCartAmount) => {
|
|
9526
9536
|
if (!newAddToCartAmount) {
|
|
@@ -9540,6 +9550,15 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
9540
9550
|
const clearSearchResult = () => {
|
|
9541
9551
|
searchResult.value = {};
|
|
9542
9552
|
};
|
|
9553
|
+
const filterVisibleFilterValues = (key, items = []) => {
|
|
9554
|
+
var _a;
|
|
9555
|
+
if (!((_a = hideFiltersOnExactMatchForKeys.value) == null ? void 0 : _a.length) || !hideFiltersOnExactMatchForKeys.value.includes(key) || !items.length) {
|
|
9556
|
+
return items;
|
|
9557
|
+
}
|
|
9558
|
+
const searchInput = getNormalizedString(currentQueryText.value);
|
|
9559
|
+
const hasExactMatch = items.some((item) => getNormalizedString(item.title) === searchInput);
|
|
9560
|
+
return hasExactMatch ? items.filter((item) => getNormalizedString(item.title) === searchInput) : items;
|
|
9561
|
+
};
|
|
9543
9562
|
return {
|
|
9544
9563
|
isMobileSidebarVisible,
|
|
9545
9564
|
searchResult,
|
|
@@ -9559,6 +9578,7 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
9559
9578
|
hasAnyFilter,
|
|
9560
9579
|
itemRange,
|
|
9561
9580
|
isPageEmpty,
|
|
9581
|
+
hideFiltersOnExactMatchForKeys,
|
|
9562
9582
|
setSidebarState,
|
|
9563
9583
|
queryFacet,
|
|
9564
9584
|
add: add2,
|
|
@@ -9566,7 +9586,8 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
9566
9586
|
setAddToCartAmount,
|
|
9567
9587
|
setLayout,
|
|
9568
9588
|
setLoading,
|
|
9569
|
-
clearSearchResult
|
|
9589
|
+
clearSearchResult,
|
|
9590
|
+
filterVisibleFilterValues
|
|
9570
9591
|
};
|
|
9571
9592
|
});
|
|
9572
9593
|
const _hoisted_1$12 = { class: "lupa-search-box-add-to-cart-wrapper" };
|
|
@@ -11279,11 +11300,25 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
11279
11300
|
const paramsStore = useParamsStore();
|
|
11280
11301
|
const optionStore = useOptionsStore();
|
|
11281
11302
|
const searchResultStore = useSearchResultStore();
|
|
11282
|
-
const {
|
|
11303
|
+
const {
|
|
11304
|
+
filters,
|
|
11305
|
+
displayFilters,
|
|
11306
|
+
currentFilterCount,
|
|
11307
|
+
hideFiltersOnExactMatchForKeys,
|
|
11308
|
+
currentQueryText
|
|
11309
|
+
} = storeToRefs(searchResultStore);
|
|
11283
11310
|
const currentFilters = computed(() => filters.value);
|
|
11311
|
+
const currentDisplayFilters = computed(
|
|
11312
|
+
() => hideFiltersOnExactMatchForKeys.value.length ? displayFilters.value.filter(
|
|
11313
|
+
(f2) => {
|
|
11314
|
+
var _a;
|
|
11315
|
+
return !((_a = hideFiltersOnExactMatchForKeys.value) == null ? void 0 : _a.includes(f2.key)) && getNormalizedString(currentQueryText.value) !== getNormalizedString(f2.label);
|
|
11316
|
+
}
|
|
11317
|
+
) : displayFilters.value
|
|
11318
|
+
);
|
|
11284
11319
|
const hasFilters = computed(() => {
|
|
11285
11320
|
var _a;
|
|
11286
|
-
return ((_a =
|
|
11321
|
+
return ((_a = currentDisplayFilters.value) == null ? void 0 : _a.length) > 0;
|
|
11287
11322
|
});
|
|
11288
11323
|
const handleClearAll = () => {
|
|
11289
11324
|
paramsStore.removeAllFilters();
|
|
@@ -11340,7 +11375,7 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
11340
11375
|
]),
|
|
11341
11376
|
!_ctx.expandable || isOpen.value ? (openBlock(), createElementBlock("div", _hoisted_3$q, [
|
|
11342
11377
|
createBaseVNode("div", _hoisted_4$k, [
|
|
11343
|
-
(openBlock(true), createElementBlock(Fragment, null, renderList(
|
|
11378
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(currentDisplayFilters.value, (filter) => {
|
|
11344
11379
|
return openBlock(), createBlock(_sfc_main$R, {
|
|
11345
11380
|
key: filter.key + "_" + filter.value,
|
|
11346
11381
|
filter,
|
|
@@ -11553,11 +11588,12 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
11553
11588
|
emits: ["select"],
|
|
11554
11589
|
setup(__props, { emit: emit2 }) {
|
|
11555
11590
|
const props = __props;
|
|
11591
|
+
const searchResultStore = useSearchResultStore();
|
|
11556
11592
|
const facet = computed(() => {
|
|
11557
11593
|
var _a;
|
|
11558
11594
|
return (_a = props.facet) != null ? _a : { type: "terms", items: [], key: "" };
|
|
11559
11595
|
});
|
|
11560
|
-
const
|
|
11596
|
+
const currentFiltersValue = computed(() => {
|
|
11561
11597
|
var _a;
|
|
11562
11598
|
return (_a = props.currentFilters) != null ? _a : [];
|
|
11563
11599
|
});
|
|
@@ -11568,22 +11604,23 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
11568
11604
|
});
|
|
11569
11605
|
const allValues = computed(() => {
|
|
11570
11606
|
var _a, _b;
|
|
11571
|
-
return (_b = (_a = facet.value) == null ? void 0 : _a.items) != null ? _b : [];
|
|
11607
|
+
return searchResultStore.filterVisibleFilterValues(facet.value.key, (_b = (_a = facet.value) == null ? void 0 : _a.items) != null ? _b : []);
|
|
11572
11608
|
});
|
|
11573
11609
|
const displayValues = computed(() => {
|
|
11574
11610
|
return filteredValues.value.slice(0, itemLimit.value).map((v) => __spreadProps2(__spreadValues2({}, v), { title: getDisplayValue(v.title) }));
|
|
11575
11611
|
});
|
|
11576
11612
|
const filteredValues = computed(() => {
|
|
11577
|
-
|
|
11613
|
+
var _a, _b;
|
|
11614
|
+
return isFilterable.value ? (_a = allValues.value) == null ? void 0 : _a.filter(
|
|
11578
11615
|
(v) => {
|
|
11579
|
-
var
|
|
11580
|
-
return (
|
|
11616
|
+
var _a2;
|
|
11617
|
+
return (_a2 = getNormalizedString(v.title)) == null ? void 0 : _a2.includes(getNormalizedString(termFilter.value));
|
|
11581
11618
|
}
|
|
11582
|
-
) : allValues.value;
|
|
11619
|
+
) : (_b = allValues.value) != null ? _b : [];
|
|
11583
11620
|
});
|
|
11584
11621
|
const isFilterable = computed(() => {
|
|
11585
|
-
var _a, _b;
|
|
11586
|
-
return allValues.value.length >= ((
|
|
11622
|
+
var _a, _b, _c;
|
|
11623
|
+
return ((_a = allValues.value) == null ? void 0 : _a.length) >= ((_c = (_b = props.options.filterable) == null ? void 0 : _b.minValues) != null ? _c : MAX_FACET_VALUES);
|
|
11587
11624
|
});
|
|
11588
11625
|
const isRange = computed(() => {
|
|
11589
11626
|
return facet.value.type === "range";
|
|
@@ -11607,7 +11644,7 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
11607
11644
|
};
|
|
11608
11645
|
const isChecked = (item) => {
|
|
11609
11646
|
var _a, _b;
|
|
11610
|
-
let selectedItems = (_a =
|
|
11647
|
+
let selectedItems = (_a = currentFiltersValue.value) != null ? _a : [];
|
|
11611
11648
|
selectedItems = isRange.value && selectedItems ? [rangeFilterToString(selectedItems)] : selectedItems;
|
|
11612
11649
|
return selectedItems == null ? void 0 : selectedItems.includes((_b = item.title) == null ? void 0 : _b.toString());
|
|
11613
11650
|
};
|
|
@@ -15521,8 +15558,8 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
|
15521
15558
|
const handleResize = () => {
|
|
15522
15559
|
const doc2 = document.documentElement;
|
|
15523
15560
|
doc2.style.setProperty("--lupa-full-height", `${window.innerHeight}px`);
|
|
15524
|
-
searchResultStore.setColumnCount({ width: window.innerWidth, grid: props.options.grid });
|
|
15525
15561
|
screenStore.setScreenWidth({ width: window.innerWidth });
|
|
15562
|
+
searchResultStore.setColumnCount({ width: window.innerWidth, grid: props.options.grid });
|
|
15526
15563
|
};
|
|
15527
15564
|
const handleUrlChange = (params) => {
|
|
15528
15565
|
var _a;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@getlupa/client",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.12.1",
|
|
4
4
|
"main": "dist/lupaSearch.js",
|
|
5
5
|
"module": "dist/index.mjs",
|
|
6
6
|
"types": "dist/src/index.d.ts",
|
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
},
|
|
21
21
|
"devDependencies": {
|
|
22
22
|
"@getlupa/client-sdk": "^1.3.4",
|
|
23
|
-
"@getlupa/vue": "0.
|
|
23
|
+
"@getlupa/vue": "0.12.1",
|
|
24
24
|
"@rushstack/eslint-patch": "^1.3.2",
|
|
25
25
|
"@tsconfig/node18": "^2.0.1",
|
|
26
26
|
"@types/jsdom": "^21.1.1",
|