@useinsider/guido 3.8.1-beta.2ee94c2 → 3.8.1-beta.34bf80d

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