@useinsider/guido 3.9.1-beta.1211472 → 3.9.1-beta.22c4bcc

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 (3) hide show
  1. package/dist/composables/useStripo.js +26 -25
  2. package/dist/config/compiler/utils/recommendationCompilerUtils.js +88 -119
  3. package/package.json +1 -1
package/dist/composables/useStripo.js CHANGED
@@ -10,17 +10,17 @@ import { en as h } from "../config/i18n/en/index.js";
10
10
  import { ToasterTypeOptions as L } from "../enums/toaster.js";
11
11
  import { useStripoApi as $ } from "../services/stripoApi.js";
12
12
  import G from "../static/styles/customEditorStyle.css.js";
13
- import { useEditorStore as C } from "../stores/editor.js";
13
+ import { useEditorStore as E } from "../stores/editor.js";
14
14
  import { dynamicContentToMergeTags as J } from "../utils/genericUtil.js";
15
15
  import N from "../package.json.js";
16
- const ce = (E, l) => {
17
- const { features: c, template: w, isFeatureEnabled: u } = R(), { handleError: m, showToaster: b } = H(), { getToken: T, getCustomFonts: k, getSyncModulesStatus: B } = $(), { handleEvent: F } = q(), { getStripoBlocksConfig: v } = U(), V = async (s, r = [], i = !1) => {
16
+ const ce = (C, l) => {
17
+ const { features: c, template: w, isFeatureEnabled: u } = R(), { handleError: m, showToaster: b } = H(), { getToken: k, getCustomFonts: T, getSyncModulesStatus: B } = $(), { handleEvent: F } = q(), { getStripoBlocksConfig: v } = U(), V = async (s, r = [], i = !1) => {
18
18
  var g, S, y;
19
- const e = C(), { html: p, css: a } = s, { baseBlocks: t, extensions: d } = await v(), f = ((g = c.value) == null ? void 0 : g.displayConditions) ?? !0, A = ((S = c.value) == null ? void 0 : S.modulesDisabled) ?? !1, M = ((y = w.value) == null ? void 0 : y.forceRecreate) ?? !1;
19
+ const e = E(), { html: p, css: a } = s, { baseBlocks: o, extensions: d } = await v(), f = ((g = c.value) == null ? void 0 : g.displayConditions) ?? !0, A = ((S = c.value) == null ? void 0 : S.modulesDisabled) ?? !1, M = ((y = w.value) == null ? void 0 : y.forceRecreate) ?? !1;
20
20
  await window.UIEditor.initEditor(
21
21
  document.querySelector("#guido-editor"),
22
22
  {
23
- metadata: E,
23
+ metadata: C,
24
24
  html: p,
25
25
  css: a,
26
26
  forceRecreate: M,
@@ -42,12 +42,13 @@ const ce = (E, l) => {
42
42
  messageSettingsEnabled: !0,
43
43
  displayGmailAnnotations: !0,
44
44
  displayHiddenPreheader: !1,
45
+ keepModuleStylesEnabled: !0,
45
46
  displayTitle: !1,
46
47
  displayUTM: !1,
47
48
  selectElementAfterDrop: !0,
48
49
  sameFontSizeForOutlook: !0,
49
50
  allowedScriptSourceDomains: "https://email-static.useinsider.com https://edge.fullstory.com https://rs.fullstory.com",
50
- ...t ? { baseBlocks: t } : {},
51
+ ...o ? { baseBlocks: o } : {},
51
52
  editorFonts: {
52
53
  showDefaultStandardFonts: !0,
53
54
  showDefaultNotStandardFonts: !0,
@@ -61,32 +62,32 @@ const ce = (E, l) => {
61
62
  )
62
63
  }
63
64
  ],
64
- async onTokenRefreshRequest(o) {
65
+ async onTokenRefreshRequest(t) {
65
66
  try {
66
- const n = await T();
67
- o(n);
67
+ const n = await k();
68
+ t(n);
68
69
  } catch (n) {
69
70
  m(n, "Failed to refresh token");
70
71
  }
71
72
  },
72
73
  onTemplateLoaded() {
73
74
  try {
74
- const { importCss: o } = x(), { activateCustomViewStyles: n, updateTimerInClonedTemplate: P } = I(), { injectFullStory: D } = O();
75
- o(), n(), D(), P(), l.onReady(), e.isStripoInitialized = !0, e.loadingStatus = !1, setTimeout(() => {
75
+ const { importCss: t } = x(), { activateCustomViewStyles: n, updateTimerInClonedTemplate: P } = I(), { injectFullStory: D } = O();
76
+ t(), n(), D(), P(), l.onReady(), e.isStripoInitialized = !0, e.loadingStatus = !1, setTimeout(() => {
76
77
  e.hasChanges = !1;
77
78
  }, 1e3);
78
- } catch (o) {
79
- m(o, "Failed to load custom interface appearance");
79
+ } catch (t) {
80
+ m(t, "Failed to load custom interface appearance");
80
81
  }
81
82
  },
82
- onCodeEditorVisibilityChanged(o) {
83
- e.isCodeEditorOpen = o;
83
+ onCodeEditorVisibilityChanged(t) {
84
+ e.isCodeEditorOpen = t;
84
85
  },
85
- onEditorVisualModeChanged(o) {
86
- e.editorVisualMode = o.toLowerCase();
86
+ onEditorVisualModeChanged(t) {
87
+ e.editorVisualMode = t.toLowerCase();
87
88
  },
88
- onVersionHistoryVisibilityChanged(o) {
89
- e.isVersionHistoryOpen = o;
89
+ onVersionHistoryVisibilityChanged(t) {
90
+ e.isVersionHistoryOpen = t;
90
91
  },
91
92
  onDataChanged() {
92
93
  e.hasChanges = !0;
@@ -107,19 +108,19 @@ const ce = (E, l) => {
107
108
  Promise.resolve(s()).then(r, i);
108
109
  return;
109
110
  }
110
- const e = N.guido, a = `https://email-static.useinsider.com/guido/${(d = e == null ? void 0 : e.stripo) == null ? void 0 : d.version}/UIEditor.js`, t = document.createElement("script");
111
- t.id = "UiEditorScript", t.type = "module", t.src = a, t.onload = () => {
111
+ const e = N.guido, a = `https://email-static.useinsider.com/guido/${(d = e == null ? void 0 : e.stripo) == null ? void 0 : d.version}/UIEditor.js`, o = document.createElement("script");
112
+ o.id = "UiEditorScript", o.type = "module", o.src = a, o.onload = () => {
112
113
  Promise.resolve(s()).then(r, i);
113
- }, t.onerror = () => {
114
+ }, o.onerror = () => {
114
115
  i(new Error(`Failed to load Stripo UIEditor script from S3: ${a}`));
115
- }, document.body.appendChild(t);
116
+ }, document.body.appendChild(o);
116
117
  });
117
118
  return { initPlugin: async (s) => {
118
- const r = C();
119
+ const r = E();
119
120
  try {
120
121
  await _(async () => {
121
122
  const [i, e] = await Promise.all([
122
- k(),
123
+ T(),
123
124
  B()
124
125
  ]);
125
126
  r.syncModulesEnabled = e, await V(s, i, e);
package/dist/config/compiler/utils/recommendationCompilerUtils.js CHANGED
@@ -1,45 +1,45 @@
1
1
  import { useConfig as q } from "../../../composables/useConfig.js";
2
- import { useRecommendation as E } from "../../../composables/useRecommendation.js";
3
- import { CSS_CLASS_RECO_BUTTON as w } from "../../../extensions/Blocks/Recommendation/constants/selectors.js";
4
- import { useRecommendationExtensionStore as R } from "../../../extensions/Blocks/Recommendation/store/recommendation.js";
2
+ import { useRecommendation as C } from "../../../composables/useRecommendation.js";
3
+ import { CSS_CLASS_RECO_BUTTON as E } from "../../../extensions/Blocks/Recommendation/constants/selectors.js";
4
+ import { useRecommendationExtensionStore as w } from "../../../extensions/Blocks/Recommendation/store/recommendation.js";
5
5
  import { isIgnoredRecommendationBlock as P } from "./recommendationIgnoreUtils.js";
6
- function $(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 b(t) {
11
- let r = t;
12
- for (; r.children.length === 1; )
13
- [r] = r.children;
14
- return r;
15
- }
16
- function S(t, r, e, o, s, i) {
17
- switch (r) {
6
+ function f(t, o, e, n, s = "") {
7
+ const i = `{{${s}${t}_${o}_${e}}}`, r = `{{${s}${t}_${o}_currency}}`;
8
+ return n === "before" ? `${r} ${i}` : `${i} ${r}`;
9
+ }
10
+ function m(t) {
11
+ let o = t;
12
+ for (; o.children.length === 1; )
13
+ [o] = o.children;
14
+ return o;
15
+ }
16
+ function h(t, o, e, n, s, i) {
17
+ switch (o) {
18
18
  case "productImage": {
19
- const n = t.querySelector("img");
20
- n && (n.setAttribute("src", `{{${i}${e}_${o}_image_url}}`), n.setAttribute("alt", `{{${i}${e}_${o}_name}}`));
19
+ const r = t.querySelector("img");
20
+ r && (r.setAttribute("src", `{{${i}${e}_${n}_image_url}}`), r.setAttribute("alt", `{{${i}${e}_${n}_name}}`));
21
21
  const c = t.querySelector("a");
22
- c && (c.setAttribute("href", `{{${i}${e}_${o}_url}}`), c.classList.add(w));
22
+ c && (c.setAttribute("href", `{{${i}${e}_${n}_url}}`), c.classList.add(E));
23
23
  break;
24
24
  }
25
25
  case "productName": {
26
- const n = t.querySelector("p");
27
- n && (b(n).textContent = `{{${i}${e}_${o}_name}}`);
26
+ const r = t.querySelector("p");
27
+ r && (m(r).textContent = `{{${i}${e}_${n}_name}}`);
28
28
  break;
29
29
  }
30
30
  case "productPrice": {
31
- const n = t.querySelector(".product-price p") ?? t.querySelector("p");
32
- n && (b(n).textContent = $(
31
+ const r = t.querySelector(".product-price p") ?? t.querySelector("p");
32
+ r && (m(r).textContent = f(
33
33
  e,
34
- o,
34
+ n,
35
35
  "price",
36
36
  s,
37
37
  i
38
38
  ));
39
39
  const c = t.querySelector(".product-old-price p");
40
- c && (b(c).textContent = $(
40
+ c && (m(c).textContent = f(
41
41
  e,
42
- o,
42
+ n,
43
43
  "original_price",
44
44
  s,
45
45
  i
@@ -47,10 +47,10 @@ function S(t, r, e, o, s, i) {
47
47
  break;
48
48
  }
49
49
  case "productOldPrice": {
50
- const n = t.querySelector("p");
51
- n && (b(n).textContent = $(
50
+ const r = t.querySelector("p");
51
+ r && (m(r).textContent = f(
52
52
  e,
53
- o,
53
+ n,
54
54
  "original_price",
55
55
  s,
56
56
  i
@@ -58,129 +58,105 @@ function S(t, r, e, o, s, i) {
58
58
  break;
59
59
  }
60
60
  case "productButton": {
61
- const n = t.querySelector("a");
62
- n && n.setAttribute("href", `{{${i}${e}_${o}_url}}`);
61
+ const r = t.querySelector("a");
62
+ r && r.setAttribute("href", `{{${i}${e}_${n}_url}}`);
63
63
  break;
64
64
  }
65
65
  case "productOmnibusPrice": {
66
- const n = t.querySelector(".omnibus-price-value");
67
- if (n) {
68
- n.textContent = `{{${i}${e}_${o}_omnibus_price}}`;
69
- const c = n.closest("p");
66
+ const r = t.querySelector(".omnibus-price-value");
67
+ if (r) {
68
+ r.textContent = `{{${i}${e}_${n}_omnibus_price}}`;
69
+ const c = r.closest("p");
70
70
  c && (c.setAttribute("product-attr", "omnibus_price"), c.setAttribute("composition", "true"));
71
71
  }
72
72
  break;
73
73
  }
74
74
  case "productOmnibusDiscount": {
75
- const n = t.querySelector(".omnibus-discount-value");
76
- if (n) {
77
- n.textContent = `{{${i}${e}_${o}_omnibus_discount}}`;
78
- const c = n.closest("p");
75
+ const r = t.querySelector(".omnibus-discount-value");
76
+ if (r) {
77
+ r.textContent = `{{${i}${e}_${n}_omnibus_discount}}`;
78
+ const c = r.closest("p");
79
79
  c && (c.setAttribute("product-attr", "omnibus_discount"), c.setAttribute("composition", "true"));
80
80
  }
81
81
  break;
82
82
  }
83
83
  default: {
84
- const n = t.getAttribute("product-attr") ? t : t.querySelector("[product-attr]");
85
- if (n) {
86
- const c = n.getAttribute("product-attr"), l = n.querySelector("p");
87
- l && (b(l).textContent = `{{${i}${e}_${o}_${c}}}`);
84
+ const r = t.getAttribute("product-attr") ? t : t.querySelector("[product-attr]");
85
+ if (r) {
86
+ const c = r.getAttribute("product-attr"), l = r.querySelector("p");
87
+ l && (m(l).textContent = `{{${i}${e}_${n}_${c}}}`);
88
88
  }
89
89
  break;
90
90
  }
91
91
  }
92
92
  }
93
- const T = "name";
94
- function _(t, r, e, o) {
95
- const s = `${o}${r}_${e}_${T}`;
96
- return {
97
- open: t.createComment(`{% if ${s} and ${s} != "" %}`),
98
- close: t.createComment("{% endif %}")
99
- };
100
- }
101
- function B(t, r, e) {
102
- return _(t, r, 0, e);
103
- }
104
- function L(t, r, e, o) {
105
- if (!t.innerHTML.includes("{{"))
106
- return;
107
- const { open: s, close: i } = _(t.ownerDocument, r, e, o);
108
- t.insertBefore(s, t.firstChild), t.appendChild(i);
109
- }
110
- function N(t, r, e, o) {
111
- var n, c;
112
- if (!t.innerHTML.includes("{{"))
113
- return;
114
- const { open: s, close: i } = _(t.ownerDocument, r, e, o);
115
- (n = t.parentNode) == null || n.insertBefore(s, t), (c = t.parentNode) == null || c.insertBefore(i, t.nextSibling);
116
- }
117
- function v(t, r, e, o) {
118
- t.querySelectorAll(".recommendation-product-row").forEach((i, n) => {
93
+ function R(t, o, e, n) {
94
+ t.querySelectorAll(".recommendation-product-row").forEach((i, r) => {
119
95
  i.querySelectorAll("[data-attribute-type]").forEach((l) => {
120
96
  const u = l.getAttribute("data-attribute-type") || "", p = l.querySelectorAll(".attribute-cell");
121
97
  p.length > 0 ? p.forEach((a) => {
122
- S(a, u, r, n, e, o);
123
- }) : S(l, u, r, n, e, o);
124
- }), N(i, r, n, o);
98
+ h(a, u, o, r, e, n);
99
+ }) : h(l, u, o, r, e, n);
100
+ });
125
101
  });
126
102
  }
127
- function O(t, r, e, o) {
103
+ function W(t, o, e, n) {
128
104
  const s = t.querySelectorAll(".recommendation-product-row");
129
105
  if (!s.length)
130
106
  return;
131
- const [i] = s, n = i.querySelector("[data-attribute-type]"), c = n ? n.querySelectorAll(".attribute-cell").length : 1;
107
+ const [i] = s, r = i.querySelector("[data-attribute-type]"), c = r ? r.querySelectorAll(".attribute-cell").length : 1;
132
108
  s.forEach((l, u) => {
133
109
  l.querySelectorAll("[data-attribute-type]").forEach((a) => {
134
110
  const d = a.getAttribute("data-attribute-type") || "";
135
- a.querySelectorAll(".attribute-cell").forEach((m, f) => {
136
- const h = u * c + f;
137
- S(m, d, r, h, e, o), L(m, r, h, o);
111
+ a.querySelectorAll(".attribute-cell").forEach((S, _) => {
112
+ const g = u * c + _;
113
+ h(S, d, o, g, e, n);
138
114
  });
139
115
  });
140
116
  });
141
117
  }
142
- function W(t, r, e, o) {
118
+ function v(t, o, e, n) {
143
119
  t.querySelectorAll(".ins-recommendation-product-container").forEach((i) => {
144
- O(i, r, e, o);
120
+ W(i, o, e, n);
145
121
  });
146
122
  }
147
- function D(t, r, e) {
148
- const o = t.getAttribute("data-layout") || "grid", s = t.getAttribute("currency-alignment") || "after";
149
- o === "list" ? v(t, r, s, e) : W(t, r, s, e);
123
+ function O(t, o, e) {
124
+ const n = t.getAttribute("data-layout") || "grid", s = t.getAttribute("currency-alignment") || "after";
125
+ n === "list" ? R(t, o, s, e) : v(t, o, s, e);
150
126
  }
151
- function A(t, r, e) {
152
- const o = new RegExp(`${r}\\s*:\\s*(\\d+)\\s*px`, "i"), s = t.match(o);
127
+ function b(t, o, e) {
128
+ const n = new RegExp(`${o}\\s*:\\s*(\\d+)\\s*px`, "i"), s = t.match(n);
153
129
  return s ? parseInt(s[1]) : e;
154
130
  }
155
- function C(t) {
156
- const r = t.trim();
157
- return r.endsWith("%") ? parseFloat(r) < 100 : /^\d+(?:\.\d+)?(?:px)?$/.test(r) && parseInt(r) > 0;
131
+ function A(t) {
132
+ const o = t.trim();
133
+ return o.endsWith("%") ? parseFloat(o) < 100 : /^\d+(?:\.\d+)?(?:px)?$/.test(o) && parseInt(o) > 0;
158
134
  }
159
- function g(t) {
160
- const r = t.getAttribute("width");
161
- if (r && C(r))
162
- return r.trim();
135
+ function $(t) {
136
+ const o = t.getAttribute("width");
137
+ if (o && A(o))
138
+ return o.trim();
163
139
  const e = (t.getAttribute("style") || "").match(/(?:^|[;\s])width\s*:\s*(\d+(?:\.\d+)?(?:px|%))/i);
164
- return e && C(e[1]) ? e[1] : null;
140
+ return e && A(e[1]) ? e[1] : null;
165
141
  }
166
- function M(t, r) {
142
+ function T(t, o) {
167
143
  let e = t.parentElement;
168
- for (; e && e !== r; ) {
169
- if (e.tagName === "TD" && g(e))
144
+ for (; e && e !== o; ) {
145
+ if (e.tagName === "TD" && $(e))
170
146
  return e;
171
147
  e = e.parentElement;
172
148
  }
173
149
  return null;
174
150
  }
175
- function G(t) {
176
- const r = t.getAttribute("style") || "", e = A(r, "width", 600), o = A(r, "padding", 0) * 2, s = Math.max(0, e - o);
151
+ function M(t) {
152
+ const o = t.getAttribute("style") || "", e = b(o, "width", 600), n = b(o, "padding", 0) * 2, s = Math.max(0, e - n);
177
153
  s !== 0 && t.querySelectorAll("img.adapt-img").forEach((i) => {
178
154
  if (i.hasAttribute("width"))
179
155
  return;
180
- const n = M(i, t);
181
- if (!n)
156
+ const r = T(i, t);
157
+ if (!r)
182
158
  return;
183
- const c = g(n), l = A(n.getAttribute("style") || "", "padding", 0) * 2, u = c.endsWith("%") ? Math.floor(s * parseFloat(c) / 100) : parseInt(c), p = Math.max(1, u - l);
159
+ const c = $(r), l = b(r.getAttribute("style") || "", "padding", 0) * 2, u = c.endsWith("%") ? Math.floor(s * parseFloat(c) / 100) : parseInt(c), p = Math.max(1, u - l);
184
160
  i.setAttribute("width", String(p));
185
161
  const a = i.getAttribute("style") || "";
186
162
  if (!/\bwidth\s*:\s*\d/i.test(a)) {
@@ -189,32 +165,25 @@ function G(t) {
189
165
  }
190
166
  });
191
167
  }
192
- function H(t, r) {
168
+ function B(t, o) {
193
169
  const e = t.match(/<!DOCTYPE[^>]*>/i);
194
170
  return (e ? `${e[0]}
195
- ` : "") + r.documentElement.outerHTML;
171
+ ` : "") + o.documentElement.outerHTML;
196
172
  }
197
- function Y(t) {
198
- const r = t.replaceAll("{%", "<!--{%").replaceAll("%}", "%}-->"), e = new DOMParser().parseFromString(r, "text/html"), o = e.querySelectorAll(".recommendation-block-v2");
199
- if (!o.length)
173
+ function G(t) {
174
+ const o = t.replaceAll("{%", "<!--{%").replaceAll("%}", "%}-->"), e = new DOMParser().parseFromString(o, "text/html"), n = e.querySelectorAll(".recommendation-block-v2");
175
+ if (!n.length)
200
176
  return t;
201
- const { buildCampaignUrl: s } = E(), i = R();
177
+ const { buildCampaignUrl: s } = C(), i = w();
202
178
  i.recommendationCampaignUrls = {};
203
- const { isFeatureEnabled: n } = q(), c = n("liquidSyntax") ? "reco_" : "";
204
- return o.forEach((u) => {
205
- var a, d, y, m;
179
+ const { isFeatureEnabled: r } = q(), c = r("liquidSyntax") ? "reco_" : "";
180
+ return n.forEach((u) => {
181
+ var a, d;
206
182
  const p = u.getAttribute("recommendation-id");
207
- if (p) {
208
- if ((a = u.parentNode) == null || a.insertBefore(e.createComment("REC_START"), u), (d = u.parentNode) == null || d.insertBefore(e.createComment("REC_END"), u.nextSibling), u.querySelectorAll('[data-visibility="0"]').forEach((f) => f.remove()), s(p), !P(u)) {
209
- D(u, p, c);
210
- const { open: f, close: h } = B(e, p, c);
211
- (y = u.parentNode) == null || y.insertBefore(f, u), (m = u.parentNode) == null || m.insertBefore(h, u.nextSibling);
212
- }
213
- G(u);
214
- }
215
- }), H(r, e).replaceAll("<!--{%", "{%").replaceAll("%}-->", "%}").replaceAll("&lt;!--{%", "{%").replaceAll("%}--&gt;", "%}");
183
+ p && ((a = u.parentNode) == null || a.insertBefore(e.createComment("REC_START"), u), (d = u.parentNode) == null || d.insertBefore(e.createComment("REC_END"), u.nextSibling), u.querySelectorAll('[data-visibility="0"]').forEach((y) => y.remove()), s(p), P(u) || O(u, p, c), M(u));
184
+ }), B(o, e).replaceAll("<!--{%", "{%").replaceAll("%}-->", "%}").replaceAll("&lt;!--{%", "{%").replaceAll("%}--&gt;", "%}");
216
185
  }
217
186
  export {
218
- $ as formatPriceVariable,
219
- Y as prepareRecommendationBlocks
187
+ f as formatPriceVariable,
188
+ G as prepareRecommendationBlocks
220
189
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@useinsider/guido",
3
- "version": "3.9.1-beta.1211472",
3
+ "version": "3.9.1-beta.22c4bcc",
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",