@getlupa/client 1.6.3 → 1.6.4
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 +128 -111
- package/dist/lupaSearch.js +128 -111
- package/dist/lupaSearch.mjs +128 -111
- package/dist/lupaSearch.umd.js +128 -111
- package/package.json +2 -2
package/dist/lupaSearch.mjs
CHANGED
|
@@ -6570,21 +6570,21 @@ const sendUaAnalyticsEvent = (data, options) => {
|
|
|
6570
6570
|
);
|
|
6571
6571
|
};
|
|
6572
6572
|
const sendGa4AnalyticsEvent = (data, options) => {
|
|
6573
|
-
var _a, _b, _c, _d, _e;
|
|
6573
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
|
6574
6574
|
if (!window || !window.dataLayer) {
|
|
6575
6575
|
console.error("dataLayer object not found.");
|
|
6576
6576
|
return;
|
|
6577
6577
|
}
|
|
6578
6578
|
const sendItemTitle = data.searchQuery !== ((_a = data.analytics) == null ? void 0 : _a.label);
|
|
6579
6579
|
const title = sendItemTitle ? (_b = data.analytics) == null ? void 0 : _b.label : void 0;
|
|
6580
|
-
const params = {
|
|
6580
|
+
const params = __spreadValues2({
|
|
6581
6581
|
search_text: data.searchQuery,
|
|
6582
6582
|
item_title: title,
|
|
6583
6583
|
item_id: data.itemId,
|
|
6584
6584
|
ecommerce: parseEcommerceData(data, (_c = data.analytics) == null ? void 0 : _c.listLabel)
|
|
6585
|
-
};
|
|
6585
|
+
}, (_e = (_d = data.analytics) == null ? void 0 : _d.additionalParams) != null ? _e : {});
|
|
6586
6586
|
window.dataLayer.push(__spreadValues2({
|
|
6587
|
-
event: (
|
|
6587
|
+
event: (_g = (_f = data.analytics) == null ? void 0 : _f.type) != null ? _g : options.parentEventName
|
|
6588
6588
|
}, params));
|
|
6589
6589
|
};
|
|
6590
6590
|
const processDebugEvent = (data) => {
|
|
@@ -7427,6 +7427,10 @@ const useParamsStore = defineStore("params", () => {
|
|
|
7427
7427
|
const searchString = ref("");
|
|
7428
7428
|
const optionsStore = useOptionsStore();
|
|
7429
7429
|
const redirectionStore = useRedirectionStore();
|
|
7430
|
+
const sortParams = ref({
|
|
7431
|
+
selectedSortKey: "",
|
|
7432
|
+
previousSortKey: ""
|
|
7433
|
+
});
|
|
7430
7434
|
const query = computed(() => params.value[QUERY_PARAMS_PARSED.QUERY]);
|
|
7431
7435
|
const page = computed(() => {
|
|
7432
7436
|
const page2 = Number(params.value[QUERY_PARAMS_PARSED.PAGE]) || 1;
|
|
@@ -7561,6 +7565,12 @@ const useParamsStore = defineStore("params", () => {
|
|
|
7561
7565
|
}
|
|
7562
7566
|
searchResultsLink.value = newSearchResultsLink;
|
|
7563
7567
|
};
|
|
7568
|
+
const setSortSettings = ({ selectedSortKey, previousSortKey }) => {
|
|
7569
|
+
sortParams.value = {
|
|
7570
|
+
selectedSortKey,
|
|
7571
|
+
previousSortKey
|
|
7572
|
+
};
|
|
7573
|
+
};
|
|
7564
7574
|
return {
|
|
7565
7575
|
params,
|
|
7566
7576
|
defaultLimit,
|
|
@@ -7571,6 +7581,7 @@ const useParamsStore = defineStore("params", () => {
|
|
|
7571
7581
|
limit,
|
|
7572
7582
|
sort,
|
|
7573
7583
|
filters,
|
|
7584
|
+
sortParams,
|
|
7574
7585
|
add: add2,
|
|
7575
7586
|
removeAllFilters,
|
|
7576
7587
|
removeParameters,
|
|
@@ -7578,7 +7589,8 @@ const useParamsStore = defineStore("params", () => {
|
|
|
7578
7589
|
goToResults,
|
|
7579
7590
|
appendParams,
|
|
7580
7591
|
setDefaultLimit,
|
|
7581
|
-
setSearchResultsLink
|
|
7592
|
+
setSearchResultsLink,
|
|
7593
|
+
setSortSettings
|
|
7582
7594
|
};
|
|
7583
7595
|
});
|
|
7584
7596
|
const flattenFacet = (key, facets, suggestion, inputValue) => {
|
|
@@ -8887,61 +8899,6 @@ const _sfc_main$13 = /* @__PURE__ */ defineComponent(__spreadProps2(__spreadValu
|
|
|
8887
8899
|
};
|
|
8888
8900
|
}
|
|
8889
8901
|
}));
|
|
8890
|
-
const getSearchTrackingData = (searchText, type) => {
|
|
8891
|
-
return {
|
|
8892
|
-
searchQuery: searchText,
|
|
8893
|
-
analytics: {
|
|
8894
|
-
type,
|
|
8895
|
-
label: searchText
|
|
8896
|
-
}
|
|
8897
|
-
};
|
|
8898
|
-
};
|
|
8899
|
-
const useTrackingStore = defineStore("tracking", () => {
|
|
8900
|
-
const optionsStore = useOptionsStore();
|
|
8901
|
-
const trackSearch = ({
|
|
8902
|
-
queryKey,
|
|
8903
|
-
query,
|
|
8904
|
-
type = "search_query"
|
|
8905
|
-
}) => {
|
|
8906
|
-
var _a, _b;
|
|
8907
|
-
const options = (_a = optionsStore.envOptions) != null ? _a : { environment: "production" };
|
|
8908
|
-
const hasFilters = Object.keys((_b = query.filters) != null ? _b : {}).length > 0;
|
|
8909
|
-
if (hasFilters) {
|
|
8910
|
-
const data2 = getSearchTrackingData(query.searchText, "search_filters");
|
|
8911
|
-
track(queryKey, data2, options);
|
|
8912
|
-
return;
|
|
8913
|
-
}
|
|
8914
|
-
const data = getSearchTrackingData(query.searchText, type);
|
|
8915
|
-
track(queryKey, data, options);
|
|
8916
|
-
};
|
|
8917
|
-
const trackResults = ({
|
|
8918
|
-
queryKey,
|
|
8919
|
-
results
|
|
8920
|
-
}) => {
|
|
8921
|
-
var _a;
|
|
8922
|
-
const options = (_a = optionsStore.envOptions) != null ? _a : { environment: "production" };
|
|
8923
|
-
if (results.total > 0) {
|
|
8924
|
-
return;
|
|
8925
|
-
}
|
|
8926
|
-
const data = getSearchTrackingData(results.searchText, "search_zero_results");
|
|
8927
|
-
track(queryKey, data, options);
|
|
8928
|
-
};
|
|
8929
|
-
const trackEvent = ({ queryKey, data }) => {
|
|
8930
|
-
var _a, _b, _c, _d, _e;
|
|
8931
|
-
const options = (_a = optionsStore.envOptions) != null ? _a : { environment: "production" };
|
|
8932
|
-
const trackingOptions = (_b = optionsStore.trackingOptions) != null ? _b : {};
|
|
8933
|
-
const items = (_d = (_c = data.analytics) == null ? void 0 : _c.items) != null ? _d : [];
|
|
8934
|
-
const mappedItems = ((_e = trackingOptions.analytics) == null ? void 0 : _e.itemMap) ? items.map(trackingOptions.analytics.itemMap) : items;
|
|
8935
|
-
track(
|
|
8936
|
-
queryKey,
|
|
8937
|
-
__spreadProps2(__spreadValues2({}, data), {
|
|
8938
|
-
analytics: data.analytics ? __spreadProps2(__spreadValues2({}, data.analytics), { items: mappedItems }) : void 0
|
|
8939
|
-
}),
|
|
8940
|
-
options
|
|
8941
|
-
);
|
|
8942
|
-
};
|
|
8943
|
-
return { trackSearch, trackResults, trackEvent };
|
|
8944
|
-
});
|
|
8945
8902
|
const _hoisted_1$_ = ["href"];
|
|
8946
8903
|
const _hoisted_2$I = { class: "lupa-search-box-product-image-section" };
|
|
8947
8904
|
const _hoisted_3$x = { class: "lupa-search-box-product-details-section" };
|
|
@@ -8961,11 +8918,7 @@ const _sfc_main$12 = /* @__PURE__ */ defineComponent({
|
|
|
8961
8918
|
emits: ["product-click"],
|
|
8962
8919
|
setup(__props, { emit: emit2 }) {
|
|
8963
8920
|
const props = __props;
|
|
8964
|
-
const historyStore = useHistoryStore();
|
|
8965
|
-
const trackingStore = useTrackingStore();
|
|
8966
|
-
const optionsStore = useOptionsStore();
|
|
8967
8921
|
const isInStock = ref(true);
|
|
8968
|
-
const { boxRoutingBehavior } = storeToRefs(optionsStore);
|
|
8969
8922
|
const link = computed(() => {
|
|
8970
8923
|
var _a, _b;
|
|
8971
8924
|
return generateLink((_b = (_a = props.panelOptions.links) == null ? void 0 : _a.details) != null ? _b : "", props.item);
|
|
@@ -8980,54 +8933,16 @@ const _sfc_main$12 = /* @__PURE__ */ defineComponent({
|
|
|
8980
8933
|
(e) => e.type !== DocumentElementType.IMAGE && e.type !== DocumentElementType.ADDTOCART
|
|
8981
8934
|
)) != null ? _b : [];
|
|
8982
8935
|
});
|
|
8983
|
-
const id = computed(() => {
|
|
8984
|
-
if (props.panelOptions.idKey) {
|
|
8985
|
-
return props.item[props.panelOptions.idKey];
|
|
8986
|
-
}
|
|
8987
|
-
return "";
|
|
8988
|
-
});
|
|
8989
|
-
const title = computed(() => {
|
|
8990
|
-
if (!props.panelOptions.titleKey) {
|
|
8991
|
-
return "";
|
|
8992
|
-
}
|
|
8993
|
-
const title2 = props.item[props.panelOptions.titleKey] || "";
|
|
8994
|
-
historyStore.add({
|
|
8995
|
-
item: title2
|
|
8996
|
-
});
|
|
8997
|
-
return title2;
|
|
8998
|
-
});
|
|
8999
8936
|
const addToCartElement = computed(() => {
|
|
9000
8937
|
var _a;
|
|
9001
8938
|
return (_a = props.panelOptions.elements) == null ? void 0 : _a.find((e) => e.type === DocumentElementType.ADDTOCART);
|
|
9002
8939
|
});
|
|
9003
8940
|
const handleClick = (event) => {
|
|
9004
|
-
|
|
9005
|
-
|
|
9006
|
-
|
|
9007
|
-
|
|
9008
|
-
});
|
|
9009
|
-
}
|
|
9010
|
-
if (!props.panelOptions.idKey) {
|
|
9011
|
-
return;
|
|
9012
|
-
}
|
|
9013
|
-
trackingStore.trackEvent({
|
|
9014
|
-
queryKey: props.panelOptions.queryKey,
|
|
9015
|
-
data: {
|
|
9016
|
-
itemId: id.value,
|
|
9017
|
-
searchQuery: props.inputValue,
|
|
9018
|
-
type: "itemClick",
|
|
9019
|
-
analytics: {
|
|
9020
|
-
type: "autocomplete_product_click",
|
|
9021
|
-
label: (_a = title.value) != null ? _a : link.value,
|
|
9022
|
-
items: [props.item]
|
|
9023
|
-
}
|
|
9024
|
-
}
|
|
8941
|
+
emit2("product-click", {
|
|
8942
|
+
item: props.item,
|
|
8943
|
+
eventType: "itemClick",
|
|
8944
|
+
event
|
|
9025
8945
|
});
|
|
9026
|
-
if (!link.value) {
|
|
9027
|
-
return;
|
|
9028
|
-
}
|
|
9029
|
-
emit2("product-click");
|
|
9030
|
-
handleRoutingEvent(link.value, event, boxRoutingBehavior.value === "event");
|
|
9031
8946
|
};
|
|
9032
8947
|
onMounted(() => {
|
|
9033
8948
|
checkIfIsInStock();
|
|
@@ -9080,6 +8995,61 @@ const _sfc_main$12 = /* @__PURE__ */ defineComponent({
|
|
|
9080
8995
|
};
|
|
9081
8996
|
}
|
|
9082
8997
|
});
|
|
8998
|
+
const getSearchTrackingData = (searchText, type) => {
|
|
8999
|
+
return {
|
|
9000
|
+
searchQuery: searchText,
|
|
9001
|
+
analytics: {
|
|
9002
|
+
type,
|
|
9003
|
+
label: searchText
|
|
9004
|
+
}
|
|
9005
|
+
};
|
|
9006
|
+
};
|
|
9007
|
+
const useTrackingStore = defineStore("tracking", () => {
|
|
9008
|
+
const optionsStore = useOptionsStore();
|
|
9009
|
+
const trackSearch = ({
|
|
9010
|
+
queryKey,
|
|
9011
|
+
query,
|
|
9012
|
+
type = "search_query"
|
|
9013
|
+
}) => {
|
|
9014
|
+
var _a, _b;
|
|
9015
|
+
const options = (_a = optionsStore.envOptions) != null ? _a : { environment: "production" };
|
|
9016
|
+
const hasFilters = Object.keys((_b = query.filters) != null ? _b : {}).length > 0;
|
|
9017
|
+
if (hasFilters) {
|
|
9018
|
+
const data2 = getSearchTrackingData(query.searchText, "search_filters");
|
|
9019
|
+
track(queryKey, data2, options);
|
|
9020
|
+
return;
|
|
9021
|
+
}
|
|
9022
|
+
const data = getSearchTrackingData(query.searchText, type);
|
|
9023
|
+
track(queryKey, data, options);
|
|
9024
|
+
};
|
|
9025
|
+
const trackResults = ({
|
|
9026
|
+
queryKey,
|
|
9027
|
+
results
|
|
9028
|
+
}) => {
|
|
9029
|
+
var _a;
|
|
9030
|
+
const options = (_a = optionsStore.envOptions) != null ? _a : { environment: "production" };
|
|
9031
|
+
if (results.total > 0) {
|
|
9032
|
+
return;
|
|
9033
|
+
}
|
|
9034
|
+
const data = getSearchTrackingData(results.searchText, "search_zero_results");
|
|
9035
|
+
track(queryKey, data, options);
|
|
9036
|
+
};
|
|
9037
|
+
const trackEvent = ({ queryKey, data }) => {
|
|
9038
|
+
var _a, _b, _c, _d, _e;
|
|
9039
|
+
const options = (_a = optionsStore.envOptions) != null ? _a : { environment: "production" };
|
|
9040
|
+
const trackingOptions = (_b = optionsStore.trackingOptions) != null ? _b : {};
|
|
9041
|
+
const items = (_d = (_c = data.analytics) == null ? void 0 : _c.items) != null ? _d : [];
|
|
9042
|
+
const mappedItems = ((_e = trackingOptions.analytics) == null ? void 0 : _e.itemMap) ? items.map(trackingOptions.analytics.itemMap) : items;
|
|
9043
|
+
track(
|
|
9044
|
+
queryKey,
|
|
9045
|
+
__spreadProps2(__spreadValues2({}, data), {
|
|
9046
|
+
analytics: data.analytics ? __spreadProps2(__spreadValues2({}, data.analytics), { items: mappedItems }) : void 0
|
|
9047
|
+
}),
|
|
9048
|
+
options
|
|
9049
|
+
);
|
|
9050
|
+
};
|
|
9051
|
+
return { trackSearch, trackResults, trackEvent };
|
|
9052
|
+
});
|
|
9083
9053
|
const _hoisted_1$Z = { id: "lupa-search-box-products" };
|
|
9084
9054
|
const _sfc_main$11 = /* @__PURE__ */ defineComponent({
|
|
9085
9055
|
__name: "SearchBoxProducts",
|
|
@@ -9089,9 +9059,14 @@ const _sfc_main$11 = /* @__PURE__ */ defineComponent({
|
|
|
9089
9059
|
panelOptions: {},
|
|
9090
9060
|
labels: {}
|
|
9091
9061
|
},
|
|
9092
|
-
|
|
9062
|
+
emits: ["product-click"],
|
|
9063
|
+
setup(__props, { emit: emit2 }) {
|
|
9093
9064
|
const props = __props;
|
|
9094
9065
|
const searchBoxStore = useSearchBoxStore();
|
|
9066
|
+
const historyStore = useHistoryStore();
|
|
9067
|
+
const trackingStore = useTrackingStore();
|
|
9068
|
+
const optionsStore = useOptionsStore();
|
|
9069
|
+
const { boxRoutingBehavior } = storeToRefs(optionsStore);
|
|
9095
9070
|
const { highlightedItem } = storeToRefs(searchBoxStore);
|
|
9096
9071
|
const highlightedIndex = computed(() => {
|
|
9097
9072
|
var _a, _b, _c;
|
|
@@ -9100,6 +9075,42 @@ const _sfc_main$11 = /* @__PURE__ */ defineComponent({
|
|
|
9100
9075
|
}
|
|
9101
9076
|
return (_c = (_b = highlightedItem.value) == null ? void 0 : _b.index) != null ? _c : -1;
|
|
9102
9077
|
});
|
|
9078
|
+
const handleProductClick = ({
|
|
9079
|
+
item,
|
|
9080
|
+
eventType,
|
|
9081
|
+
event
|
|
9082
|
+
}) => {
|
|
9083
|
+
var _a, _b;
|
|
9084
|
+
const link = generateLink((_b = (_a = props.panelOptions.links) == null ? void 0 : _a.details) != null ? _b : "", item);
|
|
9085
|
+
const title = props.panelOptions.titleKey ? item[props.panelOptions.titleKey] || "" : "";
|
|
9086
|
+
const id = props.panelOptions.idKey ? item[props.panelOptions.idKey] : "";
|
|
9087
|
+
if (props.panelOptions.titleKey) {
|
|
9088
|
+
historyStore.add({
|
|
9089
|
+
item: item[props.panelOptions.titleKey] || ""
|
|
9090
|
+
});
|
|
9091
|
+
}
|
|
9092
|
+
if (!props.panelOptions.idKey) {
|
|
9093
|
+
return;
|
|
9094
|
+
}
|
|
9095
|
+
trackingStore.trackEvent({
|
|
9096
|
+
queryKey: props.panelOptions.queryKey,
|
|
9097
|
+
data: {
|
|
9098
|
+
itemId: id,
|
|
9099
|
+
searchQuery: props.inputValue,
|
|
9100
|
+
type: eventType || "itemClick",
|
|
9101
|
+
analytics: {
|
|
9102
|
+
type: "autocomplete_product_click",
|
|
9103
|
+
label: title != null ? title : link,
|
|
9104
|
+
items: [item]
|
|
9105
|
+
}
|
|
9106
|
+
}
|
|
9107
|
+
});
|
|
9108
|
+
if (!link) {
|
|
9109
|
+
return;
|
|
9110
|
+
}
|
|
9111
|
+
emit2("product-click");
|
|
9112
|
+
handleRoutingEvent(link, event, boxRoutingBehavior.value === "event");
|
|
9113
|
+
};
|
|
9103
9114
|
return (_ctx, _cache) => {
|
|
9104
9115
|
return openBlock(), createElementBlock("div", _hoisted_1$Z, [
|
|
9105
9116
|
_ctx.$slots.productCard ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(_ctx.items, (item, index) => {
|
|
@@ -9110,7 +9121,7 @@ const _sfc_main$11 = /* @__PURE__ */ defineComponent({
|
|
|
9110
9121
|
labels: _ctx.labels,
|
|
9111
9122
|
highlighted: index === highlightedIndex.value,
|
|
9112
9123
|
inputValue: _ctx.inputValue,
|
|
9113
|
-
|
|
9124
|
+
itemClicked: handleProductClick
|
|
9114
9125
|
});
|
|
9115
9126
|
}), 128)) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(_ctx.items, (item, index) => {
|
|
9116
9127
|
return openBlock(), createBlock(_sfc_main$12, {
|
|
@@ -9120,7 +9131,7 @@ const _sfc_main$11 = /* @__PURE__ */ defineComponent({
|
|
|
9120
9131
|
labels: _ctx.labels,
|
|
9121
9132
|
highlighted: index === highlightedIndex.value,
|
|
9122
9133
|
inputValue: _ctx.inputValue,
|
|
9123
|
-
onProductClick:
|
|
9134
|
+
onProductClick: handleProductClick
|
|
9124
9135
|
}, null, 8, ["item", "panelOptions", "labels", "highlighted", "inputValue"]);
|
|
9125
9136
|
}), 128))
|
|
9126
9137
|
]);
|
|
@@ -12456,6 +12467,7 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
|
|
|
12456
12467
|
if (!value) {
|
|
12457
12468
|
return;
|
|
12458
12469
|
}
|
|
12470
|
+
paramStore.setSortSettings({ selectedSortKey: value, previousSortKey: previousKey.value });
|
|
12459
12471
|
(_c = (_b = props.callbacks) == null ? void 0 : _b.onSortChange) == null ? void 0 : _c.call(_b, { selectedSortKey: value, previousSortKey: previousKey.value });
|
|
12460
12472
|
paramStore.appendParams({
|
|
12461
12473
|
params: [{ name: QUERY_PARAMS$1.SORT, value }],
|
|
@@ -14162,7 +14174,7 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
|
|
|
14162
14174
|
return (_a = props.initialFilters) != null ? _a : {};
|
|
14163
14175
|
});
|
|
14164
14176
|
const { currentQueryText, hasResults, currentFilterCount } = storeToRefs(searchResultStore);
|
|
14165
|
-
const { searchString } = storeToRefs(paramStore);
|
|
14177
|
+
const { searchString, sortParams } = storeToRefs(paramStore);
|
|
14166
14178
|
const { defaultSearchResultPageSize } = storeToRefs(optionStore);
|
|
14167
14179
|
const searchResultsFilters = ref(null);
|
|
14168
14180
|
const mounted = ref(false);
|
|
@@ -14199,6 +14211,7 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
|
|
|
14199
14211
|
window.removeEventListener("popstate", handlePopState);
|
|
14200
14212
|
});
|
|
14201
14213
|
const trackItemListView = (title, items = []) => {
|
|
14214
|
+
var _a, _b;
|
|
14202
14215
|
trackingStore.trackEvent({
|
|
14203
14216
|
queryKey: props.options.queryKey,
|
|
14204
14217
|
data: {
|
|
@@ -14206,7 +14219,11 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
|
|
|
14206
14219
|
type: "view_item_list",
|
|
14207
14220
|
label: title,
|
|
14208
14221
|
listLabel: title,
|
|
14209
|
-
items
|
|
14222
|
+
items,
|
|
14223
|
+
additionalParams: {
|
|
14224
|
+
previousSortKey: (_a = sortParams.value) == null ? void 0 : _a.previousSortKey,
|
|
14225
|
+
newSortKey: (_b = sortParams.value) == null ? void 0 : _b.selectedSortKey
|
|
14226
|
+
}
|
|
14210
14227
|
},
|
|
14211
14228
|
options: { allowEmptySearchQuery: true }
|
|
14212
14229
|
}
|