@useinsider/guido 3.8.0-beta.910d4af → 3.8.0-beta.eb4074b

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