@useinsider/guido 3.8.1-beta.2ee94c2 → 3.8.1-beta.5cf94b0
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/@types/config/schemas.js +70 -66
- package/dist/composables/useHtmlValidator.js +180 -133
- package/dist/composables/usePreviewMode.js +15 -14
- package/dist/composables/useRecommendationPreview.js +111 -0
- package/dist/config/compiler/recommendationCompilerRules.js +1 -1
- package/dist/config/compiler/utils/recommendationCompilerUtils.js +98 -89
- package/dist/config/compiler/utils/recommendationIgnoreUtils.js +15 -0
- package/dist/config/migrator/recommendation/extractors.js +44 -22
- package/dist/config/migrator/recommendation/htmlBuilder.js +170 -163
- package/dist/config/migrator/recommendation/settingsMapper.js +38 -33
- package/dist/config/migrator/recommendationMigrator.js +30 -31
- package/dist/extensions/Blocks/Recommendation/block.js +60 -41
- package/dist/extensions/Blocks/Recommendation/canvasPreview.css.js +16 -0
- package/dist/extensions/Blocks/Recommendation/constants/defaultConfig.js +41 -32
- package/dist/extensions/Blocks/Recommendation/constants/selectors.js +26 -20
- package/dist/extensions/Blocks/Recommendation/controls/cardComposition/index.js +359 -264
- package/dist/extensions/Blocks/Recommendation/controls/main/index.js +96 -83
- package/dist/extensions/Blocks/Recommendation/controls/main/layoutOrientation.js +43 -31
- package/dist/extensions/Blocks/Recommendation/controls/main/pricePlacement.js +133 -0
- package/dist/extensions/Blocks/Recommendation/controls/main/productCount.js +3 -2
- package/dist/extensions/Blocks/Recommendation/controls/main/productLayout.js +55 -45
- package/dist/extensions/Blocks/Recommendation/controls/main/utils.js +175 -166
- package/dist/extensions/Blocks/Recommendation/controls/syncInfoMessage.js +7 -6
- package/dist/extensions/Blocks/Recommendation/extension.js +31 -29
- package/dist/extensions/Blocks/Recommendation/iconsRegistry.js +21 -7
- package/dist/extensions/Blocks/Recommendation/recommendation.css.js +64 -4
- package/dist/extensions/Blocks/Recommendation/settingsPanel.js +3 -2
- package/dist/extensions/Blocks/Recommendation/store/recommendation.js +6 -3
- package/dist/extensions/Blocks/Recommendation/templates/grid/elementRenderer.js +130 -96
- package/dist/extensions/Blocks/Recommendation/templates/grid/template.js +43 -53
- package/dist/extensions/Blocks/Recommendation/templates/index.js +20 -16
- package/dist/extensions/Blocks/Recommendation/templates/list/elementRenderer.js +86 -80
- package/dist/extensions/Blocks/Recommendation/templates/list/template.js +31 -40
- package/dist/extensions/Blocks/Recommendation/templates/utils.js +155 -102
- package/dist/src/@types/config/schemas.d.ts +16 -0
- package/dist/src/composables/useConfig.d.ts +4 -0
- package/dist/src/composables/useHtmlValidator.d.ts +27 -0
- package/dist/src/composables/useHtmlValidator.test.d.ts +1 -0
- package/dist/src/composables/useRecommendationPreview.d.ts +10 -0
- package/dist/src/config/compiler/utils/recommendationIgnoreUtils.d.ts +17 -0
- package/dist/src/config/compiler/utils/recommendationIgnoreUtils.test.d.ts +1 -0
- package/dist/src/config/migrator/recommendation/extractors.d.ts +15 -0
- package/dist/src/config/migrator/recommendation/htmlBuilder.d.ts +8 -0
- package/dist/src/config/migrator/recommendation/settingsMapper.d.ts +1 -1
- package/dist/src/extensions/Blocks/Recommendation/block.d.ts +10 -0
- package/dist/src/extensions/Blocks/Recommendation/constants/index.d.ts +1 -1
- package/dist/src/extensions/Blocks/Recommendation/constants/selectors.d.ts +21 -0
- package/dist/src/extensions/Blocks/Recommendation/controls/cardComposition/index.d.ts +36 -3
- package/dist/src/extensions/Blocks/Recommendation/controls/index.d.ts +1 -1
- package/dist/src/extensions/Blocks/Recommendation/controls/main/index.d.ts +3 -1
- package/dist/src/extensions/Blocks/Recommendation/controls/main/layoutOrientation.d.ts +5 -0
- package/dist/src/extensions/Blocks/Recommendation/controls/main/pricePlacement.d.ts +59 -0
- package/dist/src/extensions/Blocks/Recommendation/controls/main/productLayout.d.ts +6 -0
- package/dist/src/extensions/Blocks/Recommendation/controls/main/utils.d.ts +9 -0
- package/dist/src/extensions/Blocks/Recommendation/store/recommendation.d.ts +2 -0
- package/dist/src/extensions/Blocks/Recommendation/templates/grid/elementRenderer.d.ts +13 -1
- package/dist/src/extensions/Blocks/Recommendation/templates/grid/template.d.ts +4 -4
- package/dist/src/extensions/Blocks/Recommendation/templates/index.d.ts +1 -1
- package/dist/src/extensions/Blocks/Recommendation/templates/list/elementRenderer.d.ts +10 -1
- package/dist/src/extensions/Blocks/Recommendation/templates/list/template.d.ts +3 -3
- package/dist/src/extensions/Blocks/Recommendation/templates/utils.d.ts +51 -1
- package/dist/src/extensions/Blocks/Recommendation/types/nodeConfig.d.ts +15 -0
- package/dist/src/stores/config.d.ts +36 -0
- package/package.json +1 -1
|
@@ -2,171 +2,180 @@ import { useConfig as _ } from "../../../composables/useConfig.js";
|
|
|
2
2
|
import { useRecommendation as g } from "../../../composables/useRecommendation.js";
|
|
3
3
|
import { CSS_CLASS_RECO_BUTTON as q } from "../../../extensions/Blocks/Recommendation/constants/selectors.js";
|
|
4
4
|
import { useRecommendationExtensionStore as C } from "../../../extensions/Blocks/Recommendation/store/recommendation.js";
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
5
|
+
import { isIgnoredRecommendationBlock as w } from "./recommendationIgnoreUtils.js";
|
|
6
|
+
function b(e, n, t, o, c = "") {
|
|
7
|
+
const i = `{{${c}${e}_${n}_${t}}}`, r = `{{${c}${e}_${n}_currency}}`;
|
|
8
|
+
return o === "before" ? `${r} ${i}` : `${i} ${r}`;
|
|
8
9
|
}
|
|
9
|
-
function
|
|
10
|
-
let n =
|
|
10
|
+
function m(e) {
|
|
11
|
+
let n = e;
|
|
11
12
|
for (; n.children.length === 1; )
|
|
12
13
|
[n] = n.children;
|
|
13
14
|
return n;
|
|
14
15
|
}
|
|
15
|
-
function
|
|
16
|
+
function h(e, n, t, o, c, i) {
|
|
16
17
|
switch (n) {
|
|
17
18
|
case "productImage": {
|
|
18
|
-
const
|
|
19
|
-
|
|
20
|
-
const s =
|
|
21
|
-
s && (s.setAttribute("href", `{{${
|
|
19
|
+
const r = e.querySelector("img");
|
|
20
|
+
r && (r.setAttribute("src", `{{${i}${t}_${o}_image_url}}`), r.setAttribute("alt", `{{${i}${t}_${o}_name}}`));
|
|
21
|
+
const s = e.querySelector("a");
|
|
22
|
+
s && (s.setAttribute("href", `{{${i}${t}_${o}_url}}`), s.classList.add(q));
|
|
22
23
|
break;
|
|
23
24
|
}
|
|
24
25
|
case "productName": {
|
|
25
|
-
const
|
|
26
|
-
|
|
26
|
+
const r = e.querySelector("p");
|
|
27
|
+
r && (m(r).textContent = `{{${i}${t}_${o}_name}}`);
|
|
27
28
|
break;
|
|
28
29
|
}
|
|
29
30
|
case "productPrice": {
|
|
30
|
-
const
|
|
31
|
-
|
|
32
|
-
|
|
31
|
+
const r = e.querySelector(".product-price p") ?? e.querySelector("p");
|
|
32
|
+
r && (m(r).textContent = b(
|
|
33
|
+
t,
|
|
33
34
|
o,
|
|
34
35
|
"price",
|
|
35
|
-
|
|
36
|
-
|
|
36
|
+
c,
|
|
37
|
+
i
|
|
38
|
+
));
|
|
39
|
+
const s = e.querySelector(".product-old-price p");
|
|
40
|
+
s && (m(s).textContent = b(
|
|
41
|
+
t,
|
|
42
|
+
o,
|
|
43
|
+
"original_price",
|
|
44
|
+
c,
|
|
45
|
+
i
|
|
37
46
|
));
|
|
38
47
|
break;
|
|
39
48
|
}
|
|
40
49
|
case "productOldPrice": {
|
|
41
|
-
const
|
|
42
|
-
|
|
43
|
-
|
|
50
|
+
const r = e.querySelector("p");
|
|
51
|
+
r && (m(r).textContent = b(
|
|
52
|
+
t,
|
|
44
53
|
o,
|
|
45
54
|
"original_price",
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
)
|
|
55
|
+
c,
|
|
56
|
+
i
|
|
57
|
+
));
|
|
49
58
|
break;
|
|
50
59
|
}
|
|
51
60
|
case "productButton": {
|
|
52
|
-
const
|
|
53
|
-
|
|
61
|
+
const r = e.querySelector("a");
|
|
62
|
+
r && r.setAttribute("href", `{{${i}${t}_${o}_url}}`);
|
|
54
63
|
break;
|
|
55
64
|
}
|
|
56
65
|
case "productOmnibusPrice": {
|
|
57
|
-
const
|
|
58
|
-
if (
|
|
59
|
-
|
|
60
|
-
const s =
|
|
66
|
+
const r = e.querySelector(".omnibus-price-value");
|
|
67
|
+
if (r) {
|
|
68
|
+
r.textContent = `{{${i}${t}_${o}_omnibus_price}}`;
|
|
69
|
+
const s = r.closest("p");
|
|
61
70
|
s && (s.setAttribute("product-attr", "omnibus_price"), s.setAttribute("composition", "true"));
|
|
62
71
|
}
|
|
63
72
|
break;
|
|
64
73
|
}
|
|
65
74
|
case "productOmnibusDiscount": {
|
|
66
|
-
const
|
|
67
|
-
if (
|
|
68
|
-
|
|
69
|
-
const s =
|
|
75
|
+
const r = e.querySelector(".omnibus-discount-value");
|
|
76
|
+
if (r) {
|
|
77
|
+
r.textContent = `{{${i}${t}_${o}_omnibus_discount}}`;
|
|
78
|
+
const s = r.closest("p");
|
|
70
79
|
s && (s.setAttribute("product-attr", "omnibus_discount"), s.setAttribute("composition", "true"));
|
|
71
80
|
}
|
|
72
81
|
break;
|
|
73
82
|
}
|
|
74
83
|
default: {
|
|
75
|
-
const
|
|
76
|
-
if (
|
|
77
|
-
const s =
|
|
78
|
-
a && (
|
|
84
|
+
const r = e.getAttribute("product-attr") ? e : e.querySelector("[product-attr]");
|
|
85
|
+
if (r) {
|
|
86
|
+
const s = r.getAttribute("product-attr"), a = r.querySelector("p");
|
|
87
|
+
a && (m(a).textContent = `{{${i}${t}_${o}_${s}}}`);
|
|
79
88
|
}
|
|
80
89
|
break;
|
|
81
90
|
}
|
|
82
91
|
}
|
|
83
92
|
}
|
|
84
|
-
function
|
|
85
|
-
|
|
86
|
-
|
|
93
|
+
function E(e, n, t, o) {
|
|
94
|
+
e.querySelectorAll(".recommendation-product-row").forEach((i, r) => {
|
|
95
|
+
i.querySelectorAll("[data-attribute-type]").forEach((a) => {
|
|
87
96
|
const u = a.getAttribute("data-attribute-type") || "", p = a.querySelectorAll(".attribute-cell");
|
|
88
97
|
p.length > 0 ? p.forEach((l) => {
|
|
89
|
-
|
|
90
|
-
}) :
|
|
98
|
+
h(l, u, n, r, t, o);
|
|
99
|
+
}) : h(a, u, n, r, t, o);
|
|
91
100
|
});
|
|
92
101
|
});
|
|
93
102
|
}
|
|
94
|
-
function
|
|
95
|
-
const
|
|
96
|
-
if (!
|
|
103
|
+
function P(e, n, t, o) {
|
|
104
|
+
const c = e.querySelectorAll(".recommendation-product-row");
|
|
105
|
+
if (!c.length)
|
|
97
106
|
return;
|
|
98
|
-
const [
|
|
99
|
-
|
|
107
|
+
const [i] = c, r = i.querySelector("[data-attribute-type]"), s = r ? r.querySelectorAll(".attribute-cell").length : 1;
|
|
108
|
+
c.forEach((a, u) => {
|
|
100
109
|
a.querySelectorAll("[data-attribute-type]").forEach((l) => {
|
|
101
110
|
const d = l.getAttribute("data-attribute-type") || "";
|
|
102
|
-
l.querySelectorAll(".attribute-cell").forEach((
|
|
111
|
+
l.querySelectorAll(".attribute-cell").forEach((A, $) => {
|
|
103
112
|
const S = u * s + $;
|
|
104
|
-
A
|
|
113
|
+
h(A, d, n, S, t, o);
|
|
105
114
|
});
|
|
106
115
|
});
|
|
107
116
|
});
|
|
108
117
|
}
|
|
109
|
-
function R(
|
|
110
|
-
|
|
111
|
-
|
|
118
|
+
function R(e, n, t, o) {
|
|
119
|
+
e.querySelectorAll(".ins-recommendation-product-container").forEach((i) => {
|
|
120
|
+
P(i, n, t, o);
|
|
112
121
|
});
|
|
113
122
|
}
|
|
114
|
-
function
|
|
115
|
-
const o =
|
|
116
|
-
o === "list" ?
|
|
123
|
+
function O(e, n, t) {
|
|
124
|
+
const o = e.getAttribute("data-layout") || "grid", c = e.getAttribute("currency-alignment") || "after";
|
|
125
|
+
o === "list" ? E(e, n, c, t) : R(e, n, c, t);
|
|
117
126
|
}
|
|
118
|
-
function
|
|
119
|
-
const o = new RegExp(`${n}\\s*:\\s*(\\d+)\\s*px`, "i"),
|
|
120
|
-
return
|
|
127
|
+
function y(e, n, t) {
|
|
128
|
+
const o = new RegExp(`${n}\\s*:\\s*(\\d+)\\s*px`, "i"), c = e.match(o);
|
|
129
|
+
return c ? parseInt(c[1]) : t;
|
|
121
130
|
}
|
|
122
|
-
function T(
|
|
123
|
-
let
|
|
124
|
-
for (;
|
|
125
|
-
if (
|
|
126
|
-
const o =
|
|
131
|
+
function T(e, n) {
|
|
132
|
+
let t = e.parentElement;
|
|
133
|
+
for (; t && t !== n; ) {
|
|
134
|
+
if (t.tagName === "TD") {
|
|
135
|
+
const o = t.getAttribute("width");
|
|
127
136
|
if (o && o.endsWith("%") && parseFloat(o) < 100)
|
|
128
|
-
return
|
|
137
|
+
return t;
|
|
129
138
|
}
|
|
130
|
-
|
|
139
|
+
t = t.parentElement;
|
|
131
140
|
}
|
|
132
141
|
return null;
|
|
133
142
|
}
|
|
134
|
-
function v(
|
|
135
|
-
const n =
|
|
136
|
-
|
|
137
|
-
if (
|
|
143
|
+
function v(e) {
|
|
144
|
+
const n = e.getAttribute("style") || "", t = y(n, "width", 600), o = y(n, "padding", 0) * 2, c = Math.max(0, t - o);
|
|
145
|
+
c !== 0 && e.querySelectorAll("img.adapt-img").forEach((i) => {
|
|
146
|
+
if (i.hasAttribute("width"))
|
|
138
147
|
return;
|
|
139
|
-
const
|
|
140
|
-
if (!
|
|
148
|
+
const r = T(i, e);
|
|
149
|
+
if (!r)
|
|
141
150
|
return;
|
|
142
|
-
const s =
|
|
143
|
-
|
|
144
|
-
const d =
|
|
151
|
+
const s = r.getAttribute("width"), a = parseFloat(s), u = y(r.getAttribute("style") || "", "padding", 0) * 2, p = Math.floor(c * a / 100), l = Math.max(1, p - u);
|
|
152
|
+
i.setAttribute("width", String(l));
|
|
153
|
+
const d = i.getAttribute("style") || "";
|
|
145
154
|
if (!/\bwidth\s*:\s*\d/i.test(d)) {
|
|
146
|
-
const
|
|
147
|
-
|
|
155
|
+
const f = d && !d.trim().endsWith(";") ? "; " : "";
|
|
156
|
+
i.setAttribute("style", `${d}${f}width: ${l}px`);
|
|
148
157
|
}
|
|
149
158
|
});
|
|
150
159
|
}
|
|
151
|
-
function
|
|
152
|
-
const
|
|
153
|
-
return (
|
|
160
|
+
function W(e, n) {
|
|
161
|
+
const t = e.match(/<!DOCTYPE[^>]*>/i);
|
|
162
|
+
return (t ? `${t[0]}
|
|
154
163
|
` : "") + n.documentElement.outerHTML;
|
|
155
164
|
}
|
|
156
|
-
function
|
|
157
|
-
const n =
|
|
165
|
+
function F(e) {
|
|
166
|
+
const n = e.replaceAll("{%", "<!--{%").replaceAll("%}", "%}-->"), t = new DOMParser().parseFromString(n, "text/html"), o = t.querySelectorAll(".recommendation-block-v2");
|
|
158
167
|
if (!o.length)
|
|
159
|
-
return
|
|
160
|
-
const { buildCampaignUrl:
|
|
161
|
-
|
|
162
|
-
const { isFeatureEnabled:
|
|
168
|
+
return e;
|
|
169
|
+
const { buildCampaignUrl: c } = g(), i = C();
|
|
170
|
+
i.recommendationCampaignUrls = {};
|
|
171
|
+
const { isFeatureEnabled: r } = _(), s = r("liquidSyntax") ? "reco_" : "";
|
|
163
172
|
return o.forEach((u) => {
|
|
164
173
|
var l, d;
|
|
165
174
|
const p = u.getAttribute("recommendation-id");
|
|
166
|
-
p && ((l = u.parentNode) == null || l.insertBefore(
|
|
167
|
-
}),
|
|
175
|
+
p && ((l = u.parentNode) == null || l.insertBefore(t.createComment("REC_START"), u), (d = u.parentNode) == null || d.insertBefore(t.createComment("REC_END"), u.nextSibling), u.querySelectorAll('[data-visibility="0"]').forEach((f) => f.remove()), c(p), w(u) || O(u, p, s), v(u));
|
|
176
|
+
}), W(n, t).replaceAll("<!--{%", "{%").replaceAll("%}-->", "%}").replaceAll("<!--{%", "{%").replaceAll("%}-->", "%}");
|
|
168
177
|
}
|
|
169
178
|
export {
|
|
170
|
-
|
|
171
|
-
|
|
179
|
+
b as formatPriceVariable,
|
|
180
|
+
F as prepareRecommendationBlocks
|
|
172
181
|
};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { CSS_CLASS_SKIP_COMPILE as n, BLOCK_ROOT_SELECTOR as i } from "../../../extensions/Blocks/Recommendation/constants/selectors.js";
|
|
2
|
+
function m(o) {
|
|
3
|
+
return o.classList.contains(n);
|
|
4
|
+
}
|
|
5
|
+
function a(o) {
|
|
6
|
+
const r = new DOMParser().parseFromString(o, "text/html").querySelectorAll(`${i}.${n}`), t = /* @__PURE__ */ new Set();
|
|
7
|
+
return r.forEach((c) => {
|
|
8
|
+
const e = c.getAttribute("recommendation-id");
|
|
9
|
+
e && t.add(e);
|
|
10
|
+
}), t;
|
|
11
|
+
}
|
|
12
|
+
export {
|
|
13
|
+
a as getIgnoredRecommendationBlockIds,
|
|
14
|
+
m as isIgnoredRecommendationBlock
|
|
15
|
+
};
|
|
@@ -1,27 +1,49 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
import { CURRENCY_ATTR as n, CSS_CLASS_SKIP_COMPILE as c } from "../../../extensions/Blocks/Recommendation/constants/selectors.js";
|
|
2
|
+
const a = "You May Also Like!";
|
|
3
|
+
function l(t) {
|
|
4
|
+
var o;
|
|
5
|
+
const r = t.querySelector(".ext-recommendation-title");
|
|
6
|
+
if (!r)
|
|
7
|
+
return a;
|
|
8
|
+
const e = (o = r.textContent) == null ? void 0 : o.trim();
|
|
9
|
+
return e && e.length > 0 ? e : a;
|
|
9
10
|
}
|
|
10
|
-
function
|
|
11
|
-
const
|
|
12
|
-
|
|
13
|
-
...Array.from(
|
|
11
|
+
function m(t) {
|
|
12
|
+
const r = [
|
|
13
|
+
t,
|
|
14
|
+
...Array.from(t.querySelectorAll(".product-card, .ext-recommendation-card"))
|
|
14
15
|
];
|
|
15
|
-
let
|
|
16
|
-
return
|
|
17
|
-
const
|
|
18
|
-
if (
|
|
19
|
-
return
|
|
20
|
-
const
|
|
21
|
-
return
|
|
22
|
-
}),
|
|
16
|
+
let e = "";
|
|
17
|
+
return r.some((o) => {
|
|
18
|
+
const i = o.getAttribute("bgcolor");
|
|
19
|
+
if (i && i.trim())
|
|
20
|
+
return e = i.trim(), !0;
|
|
21
|
+
const u = (o.getAttribute("style") ?? "").match(/background-color\s*:\s*([^;]+)/i);
|
|
22
|
+
return u && u[1] ? (e = u[1].trim(), !0) : !1;
|
|
23
|
+
}), e;
|
|
24
|
+
}
|
|
25
|
+
function C(t) {
|
|
26
|
+
const r = t.getAttribute(n.CURRENCY);
|
|
27
|
+
if (!r)
|
|
28
|
+
return;
|
|
29
|
+
const e = t.getAttribute(n.SYMBOL);
|
|
30
|
+
return {
|
|
31
|
+
value: r,
|
|
32
|
+
// An empty `currency-symbol` is omitted so `mapCurrency` falls back to
|
|
33
|
+
// the currency code as the symbol.
|
|
34
|
+
...e ? { symbol: e } : {},
|
|
35
|
+
alignment: t.getAttribute(n.ALIGNMENT) ?? "",
|
|
36
|
+
decimalCount: t.getAttribute(n.DECIMAL_COUNT) ?? "",
|
|
37
|
+
decimalSeparator: t.getAttribute(n.DECIMAL_SEPARATOR) ?? "",
|
|
38
|
+
thousandSeparator: t.getAttribute(n.THOUSAND_SEPARATOR) ?? ""
|
|
39
|
+
};
|
|
40
|
+
}
|
|
41
|
+
function d(t) {
|
|
42
|
+
return t.classList.contains(c);
|
|
23
43
|
}
|
|
24
44
|
export {
|
|
25
|
-
|
|
26
|
-
|
|
45
|
+
m as extractCardBgColor,
|
|
46
|
+
C as extractCurrencyFromBlock,
|
|
47
|
+
l as extractTitleText,
|
|
48
|
+
d as isPartnerManagedBlock
|
|
27
49
|
};
|