@useinsider/guido 3.10.0-beta.53eb239 → 3.10.0-beta.54ff6d3
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/config/compiler/utils/recommendationCompilerUtils.js +125 -94
- package/dist/extensions/Blocks/Recommendation/utils/legacyStrategyMap.js +0 -2
- package/dist/src/extensions/Blocks/Recommendation/utils/legacyStrategyMap.d.ts +0 -1
- package/dist/utils/templatePreparation.js +16 -20
- package/package.json +1 -1
|
@@ -1,30 +1,30 @@
|
|
|
1
|
-
import { useConfig as
|
|
2
|
-
import { useRecommendation as
|
|
3
|
-
import { CSS_CLASS_RECO_BUTTON as
|
|
4
|
-
import { useRecommendationExtensionStore as
|
|
5
|
-
import { isIgnoredRecommendationBlock as
|
|
6
|
-
function
|
|
7
|
-
const
|
|
8
|
-
return
|
|
9
|
-
}
|
|
10
|
-
function
|
|
1
|
+
import { useConfig as C } from "../../../composables/useConfig.js";
|
|
2
|
+
import { useRecommendation as E } from "../../../composables/useRecommendation.js";
|
|
3
|
+
import { CSS_CLASS_RECO_BUTTON as q } from "../../../extensions/Blocks/Recommendation/constants/selectors.js";
|
|
4
|
+
import { useRecommendationExtensionStore as w } from "../../../extensions/Blocks/Recommendation/store/recommendation.js";
|
|
5
|
+
import { isIgnoredRecommendationBlock as P } from "./recommendationIgnoreUtils.js";
|
|
6
|
+
function R(t, r, e, o, s = "") {
|
|
7
|
+
const i = `{{${s}${t}_${r}_${e}}}`, n = `{{${s}${t}_${r}_currency}}`;
|
|
8
|
+
return o === "before" ? `${n} ${i}` : `${i} ${n}`;
|
|
9
|
+
}
|
|
10
|
+
function y(t) {
|
|
11
11
|
let r = t;
|
|
12
12
|
for (; r.children.length === 1; )
|
|
13
13
|
[r] = r.children;
|
|
14
14
|
return r;
|
|
15
15
|
}
|
|
16
|
-
function
|
|
16
|
+
function A(t, r, e, o, s, i) {
|
|
17
17
|
switch (r) {
|
|
18
18
|
case "productImage": {
|
|
19
|
-
const
|
|
20
|
-
|
|
21
|
-
const
|
|
22
|
-
|
|
19
|
+
const n = t.querySelector("img");
|
|
20
|
+
n && (n.setAttribute("src", `{{${i}${e}_${o}_image_url}}`), n.setAttribute("alt", `{{${i}${e}_${o}_name}}`));
|
|
21
|
+
const c = t.querySelector("a");
|
|
22
|
+
c && (c.setAttribute("href", `{{${i}${e}_${o}_url}}`), c.classList.add(q));
|
|
23
23
|
break;
|
|
24
24
|
}
|
|
25
25
|
case "productName": {
|
|
26
|
-
const
|
|
27
|
-
|
|
26
|
+
const n = t.querySelector("p");
|
|
27
|
+
n && (y(n).textContent = `{{${i}${e}_${o}_name}}`);
|
|
28
28
|
break;
|
|
29
29
|
}
|
|
30
30
|
// Inline mode ("Move to next line" OFF) merges BOTH prices into one row
|
|
@@ -32,145 +32,176 @@ function b(t, r, e, n, s, c) {
|
|
|
32
32
|
// substitute by cell content, not by the row's anchor (SD-145161).
|
|
33
33
|
case "productPrice":
|
|
34
34
|
case "productOldPrice": {
|
|
35
|
-
const
|
|
36
|
-
|
|
35
|
+
const n = (l, d) => {
|
|
36
|
+
l && (y(l).textContent = R(
|
|
37
37
|
e,
|
|
38
|
-
|
|
39
|
-
|
|
38
|
+
o,
|
|
39
|
+
d,
|
|
40
40
|
s,
|
|
41
|
-
|
|
41
|
+
i
|
|
42
42
|
));
|
|
43
|
-
},
|
|
44
|
-
|
|
43
|
+
}, c = t.querySelector(".product-price p"), a = t.querySelector(".product-old-price p"), u = !c && !a ? t.querySelector("p") : null;
|
|
44
|
+
n(c ?? (r === "productPrice" ? u : null), "price"), n(a ?? (r === "productOldPrice" ? u : null), "original_price");
|
|
45
45
|
break;
|
|
46
46
|
}
|
|
47
47
|
case "productButton": {
|
|
48
|
-
const
|
|
49
|
-
|
|
48
|
+
const n = t.querySelector("a");
|
|
49
|
+
n && n.setAttribute("href", `{{${i}${e}_${o}_url}}`);
|
|
50
50
|
break;
|
|
51
51
|
}
|
|
52
52
|
case "productOmnibusPrice": {
|
|
53
|
-
const
|
|
54
|
-
if (
|
|
55
|
-
|
|
56
|
-
const
|
|
57
|
-
|
|
53
|
+
const n = t.querySelector(".omnibus-price-value");
|
|
54
|
+
if (n) {
|
|
55
|
+
n.textContent = `{{${i}${e}_${o}_omnibus_price}}`;
|
|
56
|
+
const c = n.closest("p");
|
|
57
|
+
c && (c.setAttribute("product-attr", "omnibus_price"), c.setAttribute("composition", "true"));
|
|
58
58
|
}
|
|
59
59
|
break;
|
|
60
60
|
}
|
|
61
61
|
case "productOmnibusDiscount": {
|
|
62
|
-
const
|
|
63
|
-
if (
|
|
64
|
-
|
|
65
|
-
const
|
|
66
|
-
|
|
62
|
+
const n = t.querySelector(".omnibus-discount-value");
|
|
63
|
+
if (n) {
|
|
64
|
+
n.textContent = `{{${i}${e}_${o}_omnibus_discount}}`;
|
|
65
|
+
const c = n.closest("p");
|
|
66
|
+
c && (c.setAttribute("product-attr", "omnibus_discount"), c.setAttribute("composition", "true"));
|
|
67
67
|
}
|
|
68
68
|
break;
|
|
69
69
|
}
|
|
70
70
|
default: {
|
|
71
|
-
const
|
|
72
|
-
if (
|
|
73
|
-
const
|
|
74
|
-
a && (
|
|
71
|
+
const n = t.getAttribute("product-attr") ? t : t.querySelector("[product-attr]");
|
|
72
|
+
if (n) {
|
|
73
|
+
const c = n.getAttribute("product-attr"), a = n.querySelector("p");
|
|
74
|
+
a && (y(a).textContent = `{{${i}${e}_${o}_${c}}}`);
|
|
75
75
|
}
|
|
76
76
|
break;
|
|
77
77
|
}
|
|
78
78
|
}
|
|
79
79
|
}
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
80
|
+
const B = "name";
|
|
81
|
+
function S(t, r, e, o) {
|
|
82
|
+
const s = `${o}${r}_${e}_${B}`;
|
|
83
|
+
return {
|
|
84
|
+
open: t.createComment(`{% if ${s} and ${s} != "" %}`),
|
|
85
|
+
close: t.createComment("{% endif %}")
|
|
86
|
+
};
|
|
87
|
+
}
|
|
88
|
+
function L(t, r, e) {
|
|
89
|
+
return S(t, r, 0, e);
|
|
90
|
+
}
|
|
91
|
+
function N(t, r, e, o) {
|
|
92
|
+
if (!t.innerHTML.includes("{{"))
|
|
93
|
+
return;
|
|
94
|
+
const { open: s, close: i } = S(t.ownerDocument, r, e, o);
|
|
95
|
+
t.insertBefore(s, t.firstChild), t.appendChild(i);
|
|
96
|
+
}
|
|
97
|
+
function T(t, r, e, o) {
|
|
98
|
+
var n, c;
|
|
99
|
+
if (!t.innerHTML.includes("{{"))
|
|
100
|
+
return;
|
|
101
|
+
const { open: s, close: i } = S(t.ownerDocument, r, e, o);
|
|
102
|
+
(n = t.parentNode) == null || n.insertBefore(s, t), (c = t.parentNode) == null || c.insertBefore(i, t.nextSibling);
|
|
103
|
+
}
|
|
104
|
+
function v(t, r, e, o) {
|
|
105
|
+
t.querySelectorAll(".recommendation-product-row").forEach((i, n) => {
|
|
106
|
+
i.querySelectorAll("[data-attribute-type]").forEach((a) => {
|
|
107
|
+
const u = a.getAttribute("data-attribute-type") || "", l = a.querySelectorAll(".attribute-cell");
|
|
108
|
+
l.length > 0 ? l.forEach((d) => {
|
|
109
|
+
A(d, u, r, n, e, o);
|
|
110
|
+
}) : A(a, u, r, n, e, o);
|
|
111
|
+
}), T(i, r, n, o);
|
|
88
112
|
});
|
|
89
113
|
}
|
|
90
|
-
function
|
|
114
|
+
function O(t, r, e, o) {
|
|
91
115
|
const s = t.querySelectorAll(".recommendation-product-row");
|
|
92
116
|
if (!s.length)
|
|
93
117
|
return;
|
|
94
|
-
const [
|
|
118
|
+
const [i] = s, n = i.querySelector("[data-attribute-type]"), c = n ? n.querySelectorAll(".attribute-cell").length : 1;
|
|
95
119
|
s.forEach((a, u) => {
|
|
96
|
-
a.querySelectorAll("[data-attribute-type]").forEach((
|
|
97
|
-
const p =
|
|
98
|
-
|
|
99
|
-
const
|
|
100
|
-
|
|
120
|
+
a.querySelectorAll("[data-attribute-type]").forEach((d) => {
|
|
121
|
+
const p = d.getAttribute("data-attribute-type") || "";
|
|
122
|
+
d.querySelectorAll(".attribute-cell").forEach((m, f) => {
|
|
123
|
+
const h = u * c + f;
|
|
124
|
+
A(m, p, r, h, e, o), N(m, r, h, o);
|
|
101
125
|
});
|
|
102
126
|
});
|
|
103
127
|
});
|
|
104
128
|
}
|
|
105
|
-
function
|
|
106
|
-
t.querySelectorAll(".ins-recommendation-product-container").forEach((
|
|
107
|
-
|
|
129
|
+
function W(t, r, e, o) {
|
|
130
|
+
t.querySelectorAll(".ins-recommendation-product-container").forEach((i) => {
|
|
131
|
+
O(i, r, e, o);
|
|
108
132
|
});
|
|
109
133
|
}
|
|
110
|
-
function
|
|
111
|
-
const
|
|
112
|
-
|
|
134
|
+
function D(t, r, e) {
|
|
135
|
+
const o = t.getAttribute("data-layout") || "grid", s = t.getAttribute("currency-alignment") || "after";
|
|
136
|
+
o === "list" ? v(t, r, s, e) : W(t, r, s, e);
|
|
113
137
|
}
|
|
114
|
-
function
|
|
115
|
-
const
|
|
138
|
+
function $(t, r, e) {
|
|
139
|
+
const o = new RegExp(`${r}\\s*:\\s*(\\d+)\\s*px`, "i"), s = t.match(o);
|
|
116
140
|
return s ? parseInt(s[1]) : e;
|
|
117
141
|
}
|
|
118
|
-
function
|
|
142
|
+
function _(t) {
|
|
119
143
|
const r = t.trim();
|
|
120
144
|
return r.endsWith("%") ? parseFloat(r) < 100 : /^\d+(?:\.\d+)?(?:px)?$/.test(r) && parseInt(r) > 0;
|
|
121
145
|
}
|
|
122
|
-
function
|
|
146
|
+
function g(t) {
|
|
123
147
|
const r = t.getAttribute("width");
|
|
124
|
-
if (r &&
|
|
148
|
+
if (r && _(r))
|
|
125
149
|
return r.trim();
|
|
126
150
|
const e = (t.getAttribute("style") || "").match(/(?:^|[;\s])width\s*:\s*(\d+(?:\.\d+)?(?:px|%))/i);
|
|
127
|
-
return e &&
|
|
151
|
+
return e && _(e[1]) ? e[1] : null;
|
|
128
152
|
}
|
|
129
153
|
function M(t, r) {
|
|
130
154
|
let e = t.parentElement;
|
|
131
155
|
for (; e && e !== r; ) {
|
|
132
|
-
if (e.tagName === "TD" &&
|
|
156
|
+
if (e.tagName === "TD" && g(e))
|
|
133
157
|
return e;
|
|
134
158
|
e = e.parentElement;
|
|
135
159
|
}
|
|
136
160
|
return null;
|
|
137
161
|
}
|
|
138
|
-
function
|
|
139
|
-
const r = t.getAttribute("style") || "", e =
|
|
140
|
-
s !== 0 && t.querySelectorAll("img.adapt-img").forEach((
|
|
141
|
-
if (
|
|
162
|
+
function G(t) {
|
|
163
|
+
const r = t.getAttribute("style") || "", e = $(r, "width", 600), o = $(r, "padding", 0) * 2, s = Math.max(0, e - o);
|
|
164
|
+
s !== 0 && t.querySelectorAll("img.adapt-img").forEach((i) => {
|
|
165
|
+
if (i.hasAttribute("width"))
|
|
142
166
|
return;
|
|
143
|
-
const
|
|
144
|
-
if (!
|
|
167
|
+
const n = M(i, t);
|
|
168
|
+
if (!n)
|
|
145
169
|
return;
|
|
146
|
-
const
|
|
147
|
-
|
|
148
|
-
const
|
|
149
|
-
if (!/\bwidth\s*:\s*\d/i.test(
|
|
150
|
-
const p =
|
|
151
|
-
|
|
170
|
+
const c = g(n), a = $(n.getAttribute("style") || "", "padding", 0) * 2, u = c.endsWith("%") ? Math.floor(s * parseFloat(c) / 100) : parseInt(c), l = Math.max(1, u - a);
|
|
171
|
+
i.setAttribute("width", String(l));
|
|
172
|
+
const d = i.getAttribute("style") || "";
|
|
173
|
+
if (!/\bwidth\s*:\s*\d/i.test(d)) {
|
|
174
|
+
const p = d && !d.trim().endsWith(";") ? "; " : "";
|
|
175
|
+
i.setAttribute("style", `${d}${p}width: ${l}px`);
|
|
152
176
|
}
|
|
153
177
|
});
|
|
154
178
|
}
|
|
155
|
-
function
|
|
179
|
+
function H(t, r) {
|
|
156
180
|
const e = t.match(/<!DOCTYPE[^>]*>/i);
|
|
157
181
|
return (e ? `${e[0]}
|
|
158
182
|
` : "") + r.documentElement.outerHTML;
|
|
159
183
|
}
|
|
160
|
-
function
|
|
161
|
-
const r = t.replaceAll("{%", "<!--{%").replaceAll("%}", "%}-->"), e = new DOMParser().parseFromString(r, "text/html"),
|
|
162
|
-
if (!
|
|
184
|
+
function Y(t) {
|
|
185
|
+
const r = t.replaceAll("{%", "<!--{%").replaceAll("%}", "%}-->"), e = new DOMParser().parseFromString(r, "text/html"), o = e.querySelectorAll(".recommendation-block-v2");
|
|
186
|
+
if (!o.length)
|
|
163
187
|
return t;
|
|
164
|
-
const { buildCampaignUrl: s } =
|
|
165
|
-
|
|
166
|
-
const { isFeatureEnabled:
|
|
167
|
-
return
|
|
168
|
-
var
|
|
169
|
-
const
|
|
170
|
-
|
|
171
|
-
|
|
188
|
+
const { buildCampaignUrl: s } = E(), i = w();
|
|
189
|
+
i.recommendationCampaignUrls = {};
|
|
190
|
+
const { isFeatureEnabled: n } = C(), c = n("liquidSyntax") ? "reco_" : "";
|
|
191
|
+
return o.forEach((u) => {
|
|
192
|
+
var d, p, b, m;
|
|
193
|
+
const l = u.getAttribute("recommendation-id");
|
|
194
|
+
if (l) {
|
|
195
|
+
if ((d = u.parentNode) == null || d.insertBefore(e.createComment("REC_START"), u), (p = u.parentNode) == null || p.insertBefore(e.createComment("REC_END"), u.nextSibling), u.querySelectorAll('[data-visibility="0"]').forEach((f) => f.remove()), s(l), !P(u)) {
|
|
196
|
+
D(u, l, c);
|
|
197
|
+
const { open: f, close: h } = L(e, l, c);
|
|
198
|
+
(b = u.parentNode) == null || b.insertBefore(f, u), (m = u.parentNode) == null || m.insertBefore(h, u.nextSibling);
|
|
199
|
+
}
|
|
200
|
+
G(u);
|
|
201
|
+
}
|
|
202
|
+
}), H(r, e).replaceAll("<!--{%", "{%").replaceAll("%}-->", "%}").replaceAll("<!--{%", "{%").replaceAll("%}-->", "%}");
|
|
172
203
|
}
|
|
173
204
|
export {
|
|
174
|
-
|
|
175
|
-
|
|
205
|
+
R as formatPriceVariable,
|
|
206
|
+
Y as prepareRecommendationBlocks
|
|
176
207
|
};
|
|
@@ -8,7 +8,6 @@
|
|
|
8
8
|
* - `trending` → `trendingProducts` (id 40, path `trending`)
|
|
9
9
|
* - `mostValuable` → `mostValuableOfPartner` (id 46, path `most-valuable`)
|
|
10
10
|
* - `topSellers` → `mostPurchased` (id 62, path `top-sellers`)
|
|
11
|
-
* - `mostViewed` → `mostPopular` (id 61, path `most-popular`)
|
|
12
11
|
*
|
|
13
12
|
* Used at two boundaries:
|
|
14
13
|
* 1. The migrator (`settingsMapper`), so freshly migrated node configs carry
|
|
@@ -2,16 +2,15 @@ import { useActionsApi as P } from "../composables/useActionsApi.js";
|
|
|
2
2
|
import { useHtmlCompiler as w } from "../composables/useHtmlCompiler.js";
|
|
3
3
|
import { DEFAULT_CURRENCY as l, DEFAULT_NODE_CONFIG as i } from "../extensions/Blocks/Recommendation/constants/defaultConfig.js";
|
|
4
4
|
import { useRecommendationExtensionStore as b } from "../extensions/Blocks/Recommendation/store/recommendation.js";
|
|
5
|
-
import { mapLegacyStrategy as E } from "../extensions/Blocks/Recommendation/utils/legacyStrategyMap.js";
|
|
6
5
|
import { DATA_ATTRIBUTES as h } from "../extensions/Blocks/Unsubscribe/utils/constants.js";
|
|
7
|
-
import { parsePageList as
|
|
8
|
-
import { useDynamicContentStore as
|
|
9
|
-
import { useUnsubscribeStore as
|
|
10
|
-
function
|
|
6
|
+
import { parsePageList as E } from "../extensions/Blocks/Unsubscribe/utils/utils.js";
|
|
7
|
+
import { useDynamicContentStore as H } from "../stores/dynamic-content.js";
|
|
8
|
+
import { useUnsubscribeStore as U } from "../stores/unsubscribe.js";
|
|
9
|
+
function F(s) {
|
|
11
10
|
const o = new DOMParser().parseFromString(s, "text/html").querySelectorAll(`[${h.PAGE_LIST}]`), t = [];
|
|
12
|
-
return o.forEach((
|
|
13
|
-
const
|
|
14
|
-
|
|
11
|
+
return o.forEach((n) => {
|
|
12
|
+
const a = n.getAttribute(h.PAGE_LIST);
|
|
13
|
+
a && t.push(...E(a));
|
|
15
14
|
}), [...new Set(t)];
|
|
16
15
|
}
|
|
17
16
|
async function R(s) {
|
|
@@ -21,8 +20,8 @@ async function R(s) {
|
|
|
21
20
|
const o = b();
|
|
22
21
|
m.forEach((t) => {
|
|
23
22
|
var c, p, g, f, r;
|
|
24
|
-
const
|
|
25
|
-
if (!Number.isFinite(
|
|
23
|
+
const n = t.getAttribute("recommendation-id"), a = n ? Number(n) : NaN;
|
|
24
|
+
if (!Number.isFinite(a))
|
|
26
25
|
return;
|
|
27
26
|
const d = t.getAttribute("esd-ext-config");
|
|
28
27
|
if (!d)
|
|
@@ -36,10 +35,7 @@ async function R(s) {
|
|
|
36
35
|
if (!e || typeof e != "object" || Array.isArray(e))
|
|
37
36
|
return;
|
|
38
37
|
const y = {
|
|
39
|
-
|
|
40
|
-
// already-saved blocks that never re-run the migrator don't emit a
|
|
41
|
-
// strategy-less campaign URL. `||` also catches '' / undefined (SD-144882).
|
|
42
|
-
strategy: E(e.strategy) || i.strategy,
|
|
38
|
+
strategy: e.strategy ?? i.strategy,
|
|
43
39
|
language: e.language ?? i.language,
|
|
44
40
|
size: e.size ?? i.size,
|
|
45
41
|
// Spread the default arrays so each block gets a fresh reference
|
|
@@ -53,7 +49,7 @@ async function R(s) {
|
|
|
53
49
|
currencyDecimalSeparator: ((f = e.currency) == null ? void 0 : f.decimalSeparator) ?? l.decimalSeparator,
|
|
54
50
|
currencyThousandSeparator: ((r = e.currency) == null ? void 0 : r.thousandSeparator) ?? l.thousandSeparator
|
|
55
51
|
};
|
|
56
|
-
o.seedBlockUrlConfig(
|
|
52
|
+
o.seedBlockUrlConfig(a, y);
|
|
57
53
|
});
|
|
58
54
|
try {
|
|
59
55
|
await o.fetchRecommendationCreateData();
|
|
@@ -64,8 +60,8 @@ async function R(s) {
|
|
|
64
60
|
);
|
|
65
61
|
}
|
|
66
62
|
}
|
|
67
|
-
const
|
|
68
|
-
const s =
|
|
63
|
+
const v = () => {
|
|
64
|
+
const s = H(), u = U(), { getCompiledEmail: m, getTemplateData: o } = P(), { compileHtml: t, compileAmpHtml: n } = w();
|
|
69
65
|
return {
|
|
70
66
|
prepareTemplateDetails: async () => {
|
|
71
67
|
const { html: d, ampHtml: e = "", ampErrors: y = [] } = await m({
|
|
@@ -73,7 +69,7 @@ const G = () => {
|
|
|
73
69
|
resetDataSavedFlag: !1
|
|
74
70
|
}), { html: c, css: p, syncModulesIds: g = [] } = await o();
|
|
75
71
|
u.selectedUnsubscribePages.length && await u.fetchTemplates(), await R(c);
|
|
76
|
-
const { compiledHtml: f, stats: r, appliedRules: A } = t(d), C = e &&
|
|
72
|
+
const { compiledHtml: f, stats: r, appliedRules: A } = t(d), C = e && n(e).compiledHtml, T = s.getSelectedDynamicContentList, D = b(), S = F(c);
|
|
77
73
|
return console.debug("HTML Compilation Stats:", {
|
|
78
74
|
originalSize: r.originalSize,
|
|
79
75
|
compiledSize: r.compiledSize,
|
|
@@ -101,6 +97,6 @@ const G = () => {
|
|
|
101
97
|
};
|
|
102
98
|
};
|
|
103
99
|
export {
|
|
104
|
-
|
|
105
|
-
|
|
100
|
+
F as getHtmlReferencedUnsubscribePages,
|
|
101
|
+
v as useTemplatePreparation
|
|
106
102
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@useinsider/guido",
|
|
3
|
-
"version": "3.10.0-beta.
|
|
3
|
+
"version": "3.10.0-beta.54ff6d3",
|
|
4
4
|
"description": "Guido is a Vue + TypeScript wrapper for Email Plugin. Easily embed the email editor in your Vue applications.",
|
|
5
5
|
"main": "./dist/guido.umd.cjs",
|
|
6
6
|
"module": "./dist/library.js",
|