@useinsider/guido 3.4.0-beta.895038c → 3.4.1-beta.3b1ce15
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/README.md +2 -0
- package/dist/config/migrator/itemsBlockMigrator.js +28 -18
- package/dist/extensions/Blocks/Unsubscribe/block.js +83 -53
- package/dist/extensions/Blocks/Unsubscribe/template.js +8 -8
- package/dist/src/extensions/Blocks/Unsubscribe/block.d.ts +5 -1
- package/dist/src/stores/config.test.d.ts +1 -0
- package/dist/src/vitest.setup.d.ts +0 -0
- package/dist/stores/config.js +24 -23
- package/dist/utils/templatePreparation.js +51 -43
- package/package.json +3 -2
package/README.md
CHANGED
|
@@ -8,6 +8,8 @@
|
|
|
8
8
|
|
|
9
9
|
# @useinsider/guido
|
|
10
10
|
|
|
11
|
+
[](http://coverus.internal.dataforce/app/project/github/useinsider/guido)
|
|
12
|
+
|
|
11
13
|
Guido is a Vue 2 + TypeScript wrapper for the Stripo Email Editor plugin. Easily embed the professional email editor in your Vue applications with a clean, type-safe configuration.
|
|
12
14
|
|
|
13
15
|
## Installation
|
|
@@ -155,6 +155,8 @@ class z {
|
|
|
155
155
|
}
|
|
156
156
|
migrate(t) {
|
|
157
157
|
try {
|
|
158
|
+
if (!this.containsItemsBlock(t))
|
|
159
|
+
return t;
|
|
158
160
|
let o = this.removeJinjaConditionals(t);
|
|
159
161
|
o = this.replaceTemplateVariables(o);
|
|
160
162
|
const l = this.parser.parseFromString(o, "text/html"), a = l.querySelectorAll(
|
|
@@ -178,15 +180,15 @@ class z {
|
|
|
178
180
|
originalPriceStyles: e.originalPriceStyles,
|
|
179
181
|
quantityStyles: e.quantityStyles,
|
|
180
182
|
nodeConfig: R(e.configBlockAttributes)
|
|
181
|
-
}),
|
|
183
|
+
}), u = this.parser.parseFromString(
|
|
182
184
|
`<table><tbody><tr>${c}</tr></tbody></table>`,
|
|
183
185
|
"text/html"
|
|
184
186
|
).querySelector("td");
|
|
185
|
-
if (
|
|
187
|
+
if (u && i.parentNode) {
|
|
186
188
|
const p = R(e.configBlockAttributes);
|
|
187
|
-
|
|
188
|
-
const
|
|
189
|
-
|
|
189
|
+
u.setAttribute("esd-ext-config", JSON.stringify(p));
|
|
190
|
+
const d = u.querySelector("esd-config-block");
|
|
191
|
+
d && d.remove(), i.parentNode.replaceChild(u, i);
|
|
190
192
|
}
|
|
191
193
|
}), l.documentElement.outerHTML);
|
|
192
194
|
} catch (o) {
|
|
@@ -201,22 +203,22 @@ class z {
|
|
|
201
203
|
*/
|
|
202
204
|
extractConfiguration(t) {
|
|
203
205
|
var C, D, P;
|
|
204
|
-
const o = ((C = t.querySelector("[data-type]")) == null ? void 0 : C.getAttribute("data-type")) || "CART_ITEMS", l = ((D = t.querySelector("[data-number]")) == null ? void 0 : D.getAttribute("data-number")) || "1", a = parseInt(l) - 1, n = T[o], i = ((P = n == null ? void 0 : n[a]) == null ? void 0 : P.value) || n[0].value, e = t.querySelector('[product-attr="price"]'), c = (e == null ? void 0 : e.getAttribute("data-currency_symbol")) || "USD",
|
|
206
|
+
const o = ((C = t.querySelector("[data-type]")) == null ? void 0 : C.getAttribute("data-type")) || "CART_ITEMS", l = ((D = t.querySelector("[data-number]")) == null ? void 0 : D.getAttribute("data-number")) || "1", a = parseInt(l) - 1, n = T[o], i = ((P = n == null ? void 0 : n[a]) == null ? void 0 : P.value) || n[0].value, e = t.querySelector('[product-attr="price"]'), c = (e == null ? void 0 : e.getAttribute("data-currency_symbol")) || "USD", u = ((e == null ? void 0 : e.getAttribute("data-curency")) || "before") === "after" ? "1" : "0", p = (e == null ? void 0 : e.getAttribute("data-formated")) !== "false", d = this.extractConfigBlockAttributes(t, o, l), S = d["data-card_orientation_control_value"];
|
|
205
207
|
let b;
|
|
206
208
|
S ? b = S === "horizontal" ? "horizontal" : "vertical" : b = t.querySelector('[colspan="2"]') !== null ? "vertical" : "horizontal";
|
|
207
|
-
const y = t.querySelector('a[product-attr="name"]'), I = (y == null ? void 0 : y.getAttribute("style")) || void 0, f = t.querySelector('a[product-attr="button"]'), m = (f == null ? void 0 : f.getAttribute("style")) || void 0,
|
|
209
|
+
const y = t.querySelector('a[product-attr="name"]'), I = (y == null ? void 0 : y.getAttribute("style")) || void 0, f = t.querySelector('a[product-attr="button"]'), m = (f == null ? void 0 : f.getAttribute("style")) || void 0, k = (e == null ? void 0 : e.getAttribute("style")) || void 0, A = t.querySelector("p.original-price"), h = (A == null ? void 0 : A.getAttribute("style")) || void 0, E = t.querySelector('[product-attr="quantity"]'), L = (E == null ? void 0 : E.getAttribute("style")) || void 0;
|
|
208
210
|
return {
|
|
209
211
|
orientation: b,
|
|
210
212
|
itemsType: o,
|
|
211
213
|
itemId: i,
|
|
212
214
|
currencySymbol: c,
|
|
213
|
-
currencyLocation:
|
|
215
|
+
currencyLocation: u,
|
|
214
216
|
formattedPrice: p,
|
|
215
|
-
configBlockAttributes:
|
|
217
|
+
configBlockAttributes: d,
|
|
216
218
|
nameStyles: I,
|
|
217
219
|
buttonStyles: m,
|
|
218
|
-
priceStyles:
|
|
219
|
-
originalPriceStyles:
|
|
220
|
+
priceStyles: k,
|
|
221
|
+
originalPriceStyles: h,
|
|
220
222
|
quantityStyles: L
|
|
221
223
|
};
|
|
222
224
|
}
|
|
@@ -296,6 +298,14 @@ class z {
|
|
|
296
298
|
"data-product_button_link": "{{Abandoned Cart Item (1) Url}}"
|
|
297
299
|
};
|
|
298
300
|
}
|
|
301
|
+
/**
|
|
302
|
+
* Fast check for the presence of any items block (cart / browsed / purchased)
|
|
303
|
+
* in the raw HTML. Used to gate the migration pipeline so non-items templates
|
|
304
|
+
* are returned untouched.
|
|
305
|
+
*/
|
|
306
|
+
containsItemsBlock(t) {
|
|
307
|
+
return t.includes("esd-cart-items-block") || t.includes("esd-browsed-items-block") || t.includes("esd-purchased-items-block");
|
|
308
|
+
}
|
|
299
309
|
/**
|
|
300
310
|
* Removes Jinja2 conditional statements from HTML
|
|
301
311
|
* Handles all items block types:
|
|
@@ -337,18 +347,18 @@ class z {
|
|
|
337
347
|
const [, i, e, c] = n, _ = x[i];
|
|
338
348
|
if (!_)
|
|
339
349
|
return console.warn(`Unknown variable prefix: ${i}`), l;
|
|
340
|
-
const
|
|
341
|
-
if (!
|
|
350
|
+
const u = q[e];
|
|
351
|
+
if (!u)
|
|
342
352
|
return console.warn(`Unknown variable suffix mapping for: ${e}`), l;
|
|
343
|
-
const { pairsKey: p, defaultKey:
|
|
353
|
+
const { pairsKey: p, defaultKey: d, isArray: S } = u, y = o[p][_];
|
|
344
354
|
if (!y)
|
|
345
355
|
return console.warn(`No data found for: ${p}.${_}`), l;
|
|
346
356
|
if (S) {
|
|
347
|
-
const f = parseInt(c) - 1, m = y[
|
|
348
|
-
return Array.isArray(m) && m[f] ? m[f] : (console.warn(`Array value not found: ${p}.${_}.${
|
|
357
|
+
const f = parseInt(c) - 1, m = y[d];
|
|
358
|
+
return Array.isArray(m) && m[f] ? m[f] : (console.warn(`Array value not found: ${p}.${_}.${d}[${f}]`), l);
|
|
349
359
|
}
|
|
350
|
-
const I = y[
|
|
351
|
-
return I !== void 0 ? String(I) : (console.warn(`Default value not found: ${p}.${_}.${
|
|
360
|
+
const I = y[d];
|
|
361
|
+
return I !== void 0 ? String(I) : (console.warn(`Default value not found: ${p}.${_}.${d}`), l);
|
|
352
362
|
});
|
|
353
363
|
}
|
|
354
364
|
}
|
|
@@ -1,31 +1,34 @@
|
|
|
1
1
|
var d = Object.defineProperty;
|
|
2
|
-
var
|
|
3
|
-
var
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
2
|
+
var _ = (n, i, e) => i in n ? d(n, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[i] = e;
|
|
3
|
+
var c = (n, i, e) => _(n, typeof i != "symbol" ? i + "" : i, e);
|
|
4
|
+
import { useToaster as L } from "../../../composables/useToaster.js";
|
|
5
|
+
import { ToasterTypeOptions as S } from "../../../enums/toaster.js";
|
|
6
|
+
import { PAGE_TYPES as b } from "../../../enums/unsubscribe.js";
|
|
7
|
+
import { useUnsubscribeStore as a } from "../../../stores/unsubscribe.js";
|
|
8
|
+
import { Block as g, BlockCompositionType as v, BlockType as k, ModificationDescription as h } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
9
|
+
import { getDefaultTemplate as f } from "./template.js";
|
|
10
|
+
import { UNSUBSCRIBE_EVENTS as u, DATA_ATTRIBUTES as o } from "./utils/constants.js";
|
|
11
|
+
import { parsePageList as E } from "./utils/utils.js";
|
|
12
|
+
const T = "unsubscribe-block", p = 'a[data-unsubscribe-link="true"]', B = ".unsubscribe-block-v2", U = "{{ins-unsubscribe-link}}", C = "https://academy.insiderone.com/docs/adding-unsubscribe-pages-into-emails", A = {
|
|
13
|
+
[b.GLOBAL_UNSUBSCRIBE]: "{{ins-global-unsubscribe-link}}",
|
|
14
|
+
[b.SUBSCRIPTION_PREFERENCE_CENTER]: "{{ins-preferences-unsubscribe-link}}"
|
|
13
15
|
};
|
|
14
|
-
class
|
|
16
|
+
class O extends g {
|
|
15
17
|
constructor() {
|
|
16
18
|
super();
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
19
|
+
c(this, "selectEventListener", null);
|
|
20
|
+
c(this, "cancelEventListener", null);
|
|
21
|
+
c(this, "currentNode");
|
|
22
|
+
c(this, "hadUnsubscribeLink", !1);
|
|
20
23
|
}
|
|
21
24
|
getId() {
|
|
22
|
-
return
|
|
25
|
+
return T;
|
|
23
26
|
}
|
|
24
27
|
getIcon() {
|
|
25
28
|
return "unsubscribe-icon";
|
|
26
29
|
}
|
|
27
30
|
getBlockCompositionType() {
|
|
28
|
-
return
|
|
31
|
+
return v.BLOCK;
|
|
29
32
|
}
|
|
30
33
|
getName() {
|
|
31
34
|
return this.api.translate("Unsubscribe Block");
|
|
@@ -34,39 +37,66 @@ class I extends _ {
|
|
|
34
37
|
return this.api.translate("Unsubscribe Block Description");
|
|
35
38
|
}
|
|
36
39
|
getTemplate() {
|
|
37
|
-
return
|
|
40
|
+
return f();
|
|
38
41
|
}
|
|
39
42
|
onSelect(e) {
|
|
40
|
-
this.currentNode = e, !("getAttribute" in e && e.getAttribute("data-migration")) && (this._resetStoreState(), this._loadBlockState(e), this._setupSelectEventListener(), this._setupCancelEventListener(), this._checkExistingBlocks(), this._openDrawer());
|
|
43
|
+
this.currentNode = e, this.hadUnsubscribeLink = this._hasUnsubscribeLink(e), !("getAttribute" in e && e.getAttribute("data-migration")) && (this._resetStoreState(), this._loadBlockState(e), this._setupSelectEventListener(), this._setupCancelEventListener(), this._checkExistingBlocks(), this._openDrawer());
|
|
44
|
+
}
|
|
45
|
+
onDocumentChanged(e) {
|
|
46
|
+
const t = this._hasUnsubscribeLink(e);
|
|
47
|
+
this.hadUnsubscribeLink && !t && this._warnLinkRemoved(), this.hadUnsubscribeLink = t;
|
|
41
48
|
}
|
|
42
49
|
onDelete(e) {
|
|
43
|
-
this._removeEventListeners(), this._removeBlockTemplatesFromStore(e), this._resetStoreState();
|
|
50
|
+
this._removeEventListeners(), this._removeBlockTemplatesFromStore(e), this._resetStoreState(), this.hadUnsubscribeLink = !1;
|
|
44
51
|
}
|
|
45
52
|
onDestroy() {
|
|
46
|
-
this._removeEventListeners(), this.currentNode = void 0;
|
|
53
|
+
this._removeEventListeners(), this.currentNode = void 0, this.hadUnsubscribeLink = !1;
|
|
54
|
+
}
|
|
55
|
+
_hasUnsubscribeLink(e) {
|
|
56
|
+
return "querySelector" in e ? !!e.querySelector(p) : !1;
|
|
57
|
+
}
|
|
58
|
+
_warnLinkRemoved() {
|
|
59
|
+
try {
|
|
60
|
+
const { showToaster: e } = L();
|
|
61
|
+
e({
|
|
62
|
+
type: S.Warning,
|
|
63
|
+
message: this.api.translate(
|
|
64
|
+
`Removing the unsubscribe text leaves an empty block, but an active unsubscribe link is required.
|
|
65
|
+
Undo your last action to restore the text, or delete the unsubscribe block entirely.`
|
|
66
|
+
),
|
|
67
|
+
actionButton: {
|
|
68
|
+
text: this.api.translate("Visit Academy"),
|
|
69
|
+
onClick: () => {
|
|
70
|
+
window.open(C, "_blank", "noopener,noreferrer");
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
});
|
|
74
|
+
} catch (e) {
|
|
75
|
+
console.warn("[UnsubscribeBlock] Failed to show warning toaster:", e);
|
|
76
|
+
}
|
|
47
77
|
}
|
|
48
78
|
_setupSelectEventListener() {
|
|
49
79
|
this._removeSelectEventListener(), this.selectEventListener = (e) => {
|
|
50
|
-
const
|
|
51
|
-
this._updateBlock(
|
|
52
|
-
}, document.addEventListener(
|
|
80
|
+
const t = e, { collectionType: r, selectedPages: s } = t.detail;
|
|
81
|
+
this._updateBlock(r, s.join(","));
|
|
82
|
+
}, document.addEventListener(u.SELECT, this.selectEventListener);
|
|
53
83
|
}
|
|
54
84
|
_removeSelectEventListener() {
|
|
55
|
-
this.selectEventListener && (document.removeEventListener(
|
|
85
|
+
this.selectEventListener && (document.removeEventListener(u.SELECT, this.selectEventListener), this.selectEventListener = null);
|
|
56
86
|
}
|
|
57
87
|
_setupCancelEventListener() {
|
|
58
88
|
this._removeCancelEventListener(), this.cancelEventListener = () => {
|
|
59
89
|
this._handleCancel();
|
|
60
|
-
}, document.addEventListener(
|
|
90
|
+
}, document.addEventListener(u.CANCEL, this.cancelEventListener);
|
|
61
91
|
}
|
|
62
92
|
_removeCancelEventListener() {
|
|
63
|
-
this.cancelEventListener && (document.removeEventListener(
|
|
93
|
+
this.cancelEventListener && (document.removeEventListener(u.CANCEL, this.cancelEventListener), this.cancelEventListener = null);
|
|
64
94
|
}
|
|
65
95
|
_handleCancel() {
|
|
66
96
|
try {
|
|
67
97
|
if (!this.currentNode)
|
|
68
98
|
return;
|
|
69
|
-
this.api.getDocumentModifier().modifyHtml(this.currentNode).replaceWith(`<${
|
|
99
|
+
this.api.getDocumentModifier().modifyHtml(this.currentNode).replaceWith(`<${k.EMPTY_CONTAINER}/>`).apply(new h("Removed unsubscribe block due to cancel"));
|
|
70
100
|
} catch (e) {
|
|
71
101
|
console.warn("[UnsubscribeBlock] Failed to remove unsubscribe block:", e);
|
|
72
102
|
}
|
|
@@ -74,35 +104,35 @@ class I extends _ {
|
|
|
74
104
|
_removeEventListeners() {
|
|
75
105
|
this._removeSelectEventListener(), this._removeCancelEventListener();
|
|
76
106
|
}
|
|
77
|
-
_updateBlock(e,
|
|
107
|
+
_updateBlock(e, t) {
|
|
78
108
|
if (!this.currentNode || !("querySelector" in this.currentNode))
|
|
79
109
|
return;
|
|
80
|
-
const
|
|
81
|
-
if (!
|
|
110
|
+
const r = this.currentNode.querySelector(p);
|
|
111
|
+
if (!r)
|
|
82
112
|
return;
|
|
83
|
-
const
|
|
84
|
-
this.api.getDocumentModifier().modifyHtml(
|
|
113
|
+
const s = this._getMergeTag(e);
|
|
114
|
+
this.api.getDocumentModifier().modifyHtml(r).setAttribute("href", s).apply(new h(`Updated unsubscribe link to ${s}`)), this.api.getDocumentModifier().modifyHtml(this.currentNode).setAttribute(o.PAGE_TYPE, e.toString()).setAttribute(o.PAGE_LIST, t).apply(new h("Updated unsubscribe block metadata"));
|
|
85
115
|
}
|
|
86
116
|
_getMergeTag(e) {
|
|
87
|
-
return
|
|
117
|
+
return A[e] ?? U;
|
|
88
118
|
}
|
|
89
119
|
_openDrawer() {
|
|
90
120
|
if (!(this.currentNode && this.currentNode.getAttribute("data-unsubscribe-page-type")))
|
|
91
121
|
try {
|
|
92
|
-
const e =
|
|
122
|
+
const e = a();
|
|
93
123
|
e.typeSelectionDrawerStatus = !0;
|
|
94
124
|
} catch (e) {
|
|
95
125
|
console.error("[UnsubscribeBlock] Failed to open drawer:", e);
|
|
96
126
|
}
|
|
97
127
|
}
|
|
98
128
|
_checkExistingBlocks() {
|
|
99
|
-
const e =
|
|
100
|
-
e.isGlobalUnsubscribeDisabled = !1, e.isSubscriptionPreferencesCenterDisabled = !1, this.api.getDocumentRoot().querySelectorAll(
|
|
101
|
-
if ("getAttribute" in
|
|
102
|
-
const
|
|
103
|
-
if (
|
|
104
|
-
const l = Number(
|
|
105
|
-
l ===
|
|
129
|
+
const e = a();
|
|
130
|
+
e.isGlobalUnsubscribeDisabled = !1, e.isSubscriptionPreferencesCenterDisabled = !1, this.api.getDocumentRoot().querySelectorAll(B).forEach((r) => {
|
|
131
|
+
if ("getAttribute" in r) {
|
|
132
|
+
const s = r.getAttribute(o.PAGE_TYPE);
|
|
133
|
+
if (s) {
|
|
134
|
+
const l = Number(s);
|
|
135
|
+
l === b.GLOBAL_UNSUBSCRIBE ? e.isGlobalUnsubscribeDisabled = !0 : l === b.SUBSCRIPTION_PREFERENCE_CENTER && (e.isSubscriptionPreferencesCenterDisabled = !0);
|
|
106
136
|
}
|
|
107
137
|
}
|
|
108
138
|
});
|
|
@@ -110,26 +140,26 @@ class I extends _ {
|
|
|
110
140
|
async _loadBlockState(e) {
|
|
111
141
|
if (!("getAttribute" in e))
|
|
112
142
|
return;
|
|
113
|
-
const
|
|
114
|
-
if (!
|
|
143
|
+
const t = e.getAttribute(o.PAGE_TYPE), r = e.getAttribute(o.PAGE_LIST);
|
|
144
|
+
if (!t || !r)
|
|
115
145
|
return;
|
|
116
|
-
const
|
|
117
|
-
await
|
|
146
|
+
const s = a(), l = Number(t), m = E(r);
|
|
147
|
+
await s.fetchTemplates(), s.setCollectionWithoutAutoSelection(l), s.loadSelectedTemplates(m);
|
|
118
148
|
}
|
|
119
149
|
_resetStoreState() {
|
|
120
|
-
|
|
150
|
+
a().$reset();
|
|
121
151
|
}
|
|
122
152
|
_removeBlockTemplatesFromStore(e) {
|
|
123
153
|
if (!("getAttribute" in e))
|
|
124
154
|
return;
|
|
125
|
-
const
|
|
126
|
-
if (!
|
|
155
|
+
const t = e.getAttribute(o.PAGE_LIST);
|
|
156
|
+
if (!t)
|
|
127
157
|
return;
|
|
128
|
-
const
|
|
129
|
-
|
|
158
|
+
const r = a(), s = E(t);
|
|
159
|
+
r.removeUnsubscribePages(s);
|
|
130
160
|
}
|
|
131
161
|
}
|
|
132
162
|
export {
|
|
133
|
-
|
|
134
|
-
|
|
163
|
+
T as UNSUBSCRIBE_BLOCK_ID,
|
|
164
|
+
O as UnsubscribeBlock
|
|
135
165
|
};
|
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
import { BlockType as
|
|
2
|
-
const
|
|
3
|
-
<${
|
|
1
|
+
import { BlockType as s } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
2
|
+
const e = "unsubscribe", n = "{{ins-unsubscribe-link}}", t = `
|
|
3
|
+
<${s.BLOCK_TEXT}
|
|
4
4
|
class="unsubscribe-block-v2 esd-block-unsubscribe es-p0"
|
|
5
5
|
align="center"
|
|
6
6
|
data-unsubscribe-page-type=""
|
|
7
7
|
data-unsubscribe-page-list=""
|
|
8
8
|
>
|
|
9
|
-
<p
|
|
9
|
+
<p> <strong><a
|
|
10
10
|
href="${n}"
|
|
11
11
|
class="unsubscribe-link"
|
|
12
12
|
target="_blank"
|
|
13
13
|
data-unsubscribe-link="true"
|
|
14
|
-
>${
|
|
15
|
-
</${
|
|
14
|
+
>${e}</a></strong></p>
|
|
15
|
+
</${s.BLOCK_TEXT}>
|
|
16
16
|
`;
|
|
17
|
-
function
|
|
17
|
+
function u() {
|
|
18
18
|
return t;
|
|
19
19
|
}
|
|
20
20
|
export {
|
|
21
|
-
|
|
21
|
+
u as getDefaultTemplate
|
|
22
22
|
};
|
|
@@ -1,10 +1,11 @@
|
|
|
1
|
-
import type { ImmutableHtmlElementNode } from '@stripoinc/ui-editor-extensions';
|
|
1
|
+
import type { ImmutableHtmlElementNode, ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
|
|
2
2
|
import { Block, BlockCompositionType } from '@stripoinc/ui-editor-extensions';
|
|
3
3
|
export declare const UNSUBSCRIBE_BLOCK_ID = "unsubscribe-block";
|
|
4
4
|
export declare class UnsubscribeBlock extends Block {
|
|
5
5
|
private selectEventListener;
|
|
6
6
|
private cancelEventListener;
|
|
7
7
|
private currentNode?;
|
|
8
|
+
private hadUnsubscribeLink;
|
|
8
9
|
constructor();
|
|
9
10
|
getId(): string;
|
|
10
11
|
getIcon(): string;
|
|
@@ -13,8 +14,11 @@ export declare class UnsubscribeBlock extends Block {
|
|
|
13
14
|
getDescription(): string;
|
|
14
15
|
getTemplate(): string;
|
|
15
16
|
onSelect(node: ImmutableHtmlElementNode): void;
|
|
17
|
+
onDocumentChanged(node: ImmutableHtmlNode): void;
|
|
16
18
|
onDelete(node: ImmutableHtmlElementNode): void;
|
|
17
19
|
onDestroy(): void;
|
|
20
|
+
private _hasUnsubscribeLink;
|
|
21
|
+
private _warnLinkRemoved;
|
|
18
22
|
private _setupSelectEventListener;
|
|
19
23
|
private _removeSelectEventListener;
|
|
20
24
|
private _setupCancelEventListener;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
File without changes
|
package/dist/stores/config.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import "../@types/config/schemas.js";
|
|
2
2
|
import "../@types/config/defaults.js";
|
|
3
|
-
import { parseConfig as
|
|
4
|
-
import { defineStore as
|
|
5
|
-
const
|
|
3
|
+
import { parseConfig as o } from "../@types/config/validator.js";
|
|
4
|
+
import { defineStore as r } from "pinia";
|
|
5
|
+
const f = r("guido-config", {
|
|
6
6
|
state: () => ({
|
|
7
7
|
initialized: !1,
|
|
8
8
|
config: null
|
|
@@ -75,64 +75,65 @@ const s = o("guido-config", {
|
|
|
75
75
|
* Get the template ID
|
|
76
76
|
*/
|
|
77
77
|
templateId: (i) => {
|
|
78
|
-
var e;
|
|
79
|
-
return ((e = i.config) == null ? void 0 : e.identity.templateId) ?? "";
|
|
78
|
+
var e, t;
|
|
79
|
+
return ((t = (e = i.config) == null ? void 0 : e.identity) == null ? void 0 : t.templateId) ?? "";
|
|
80
80
|
},
|
|
81
81
|
/**
|
|
82
82
|
* Get the user ID
|
|
83
83
|
*/
|
|
84
84
|
userId: (i) => {
|
|
85
|
-
var e;
|
|
86
|
-
return ((e = i.config) == null ? void 0 : e.identity.userId) ?? "";
|
|
85
|
+
var e, t;
|
|
86
|
+
return ((t = (e = i.config) == null ? void 0 : e.identity) == null ? void 0 : t.userId) ?? "";
|
|
87
87
|
},
|
|
88
88
|
/**
|
|
89
89
|
* Get the variation ID
|
|
90
90
|
*/
|
|
91
91
|
variationId: (i) => {
|
|
92
|
-
var e;
|
|
93
|
-
return ((e = i.config) == null ? void 0 : e.identity.variationId) ?? "";
|
|
92
|
+
var e, t;
|
|
93
|
+
return ((t = (e = i.config) == null ? void 0 : e.identity) == null ? void 0 : t.variationId) ?? "";
|
|
94
94
|
},
|
|
95
95
|
/**
|
|
96
96
|
* Get the partner name
|
|
97
97
|
*/
|
|
98
98
|
partnerName: (i) => {
|
|
99
|
-
var e;
|
|
100
|
-
return ((e = i.config) == null ? void 0 : e.partner.name) ?? "";
|
|
99
|
+
var e, t;
|
|
100
|
+
return ((t = (e = i.config) == null ? void 0 : e.partner) == null ? void 0 : t.name) ?? "";
|
|
101
101
|
},
|
|
102
102
|
/**
|
|
103
103
|
* Get the product type
|
|
104
104
|
*/
|
|
105
105
|
productType: (i) => {
|
|
106
|
-
var e;
|
|
107
|
-
return ((e = i.config) == null ? void 0 : e.partner.productType) ?? 60;
|
|
106
|
+
var e, t;
|
|
107
|
+
return ((t = (e = i.config) == null ? void 0 : e.partner) == null ? void 0 : t.productType) ?? 60;
|
|
108
108
|
},
|
|
109
109
|
/**
|
|
110
110
|
* Get the message type
|
|
111
111
|
*/
|
|
112
112
|
messageType: (i) => {
|
|
113
|
-
var e;
|
|
114
|
-
return ((e = i.config) == null ? void 0 : e.partner.messageType) ?? 1;
|
|
113
|
+
var e, t;
|
|
114
|
+
return ((t = (e = i.config) == null ? void 0 : e.partner) == null ? void 0 : t.messageType) ?? 1;
|
|
115
115
|
},
|
|
116
116
|
/**
|
|
117
117
|
* Get the username
|
|
118
118
|
*/
|
|
119
119
|
username: (i) => {
|
|
120
|
-
var e;
|
|
121
|
-
return ((e = i.config) == null ? void 0 : e.partner.username) ?? "Guido User";
|
|
120
|
+
var e, t;
|
|
121
|
+
return ((t = (e = i.config) == null ? void 0 : e.partner) == null ? void 0 : t.username) ?? "Guido User";
|
|
122
122
|
},
|
|
123
123
|
/**
|
|
124
124
|
* Check if header should be shown
|
|
125
125
|
*/
|
|
126
126
|
showHeader: (i) => {
|
|
127
|
-
var e;
|
|
128
|
-
return ((e = i.config) == null ? void 0 : e.ui.showHeader) ?? !0;
|
|
127
|
+
var e, t;
|
|
128
|
+
return ((t = (e = i.config) == null ? void 0 : e.ui) == null ? void 0 : t.showHeader) ?? !0;
|
|
129
129
|
},
|
|
130
130
|
/**
|
|
131
131
|
* Check if a specific feature is enabled
|
|
132
132
|
*/
|
|
133
|
+
// eslint-disable-next-line @stylistic/max-len
|
|
133
134
|
isFeatureEnabled: (i) => (e) => {
|
|
134
|
-
var t;
|
|
135
|
-
return ((t = i.config) == null ? void 0 : t.features[e]) ?? !0;
|
|
135
|
+
var t, n;
|
|
136
|
+
return ((n = (t = i.config) == null ? void 0 : t.features) == null ? void 0 : n[e]) ?? !0;
|
|
136
137
|
}
|
|
137
138
|
},
|
|
138
139
|
actions: {
|
|
@@ -140,7 +141,7 @@ const s = o("guido-config", {
|
|
|
140
141
|
* Initialize the config store with validated configuration
|
|
141
142
|
*/
|
|
142
143
|
init(i) {
|
|
143
|
-
const e =
|
|
144
|
+
const e = o(i);
|
|
144
145
|
this.config = e, this.initialized = !0;
|
|
145
146
|
},
|
|
146
147
|
/**
|
|
@@ -152,5 +153,5 @@ const s = o("guido-config", {
|
|
|
152
153
|
}
|
|
153
154
|
});
|
|
154
155
|
export {
|
|
155
|
-
|
|
156
|
+
f as useConfigStore
|
|
156
157
|
};
|
|
@@ -1,79 +1,87 @@
|
|
|
1
|
-
import { useActionsApi as
|
|
2
|
-
import { useHtmlCompiler as
|
|
3
|
-
import { DEFAULT_CURRENCY as
|
|
1
|
+
import { useActionsApi as C } from "../composables/useActionsApi.js";
|
|
2
|
+
import { useHtmlCompiler as T } from "../composables/useHtmlCompiler.js";
|
|
3
|
+
import { DEFAULT_CURRENCY as d, DEFAULT_NODE_CONFIG as s } from "../extensions/Blocks/Recommendation/constants/defaultConfig.js";
|
|
4
4
|
import { useRecommendationExtensionStore as b } from "../extensions/Blocks/Recommendation/store/recommendation.js";
|
|
5
|
-
import { DATA_ATTRIBUTES as
|
|
6
|
-
import { parsePageList as
|
|
7
|
-
import { useDynamicContentStore as
|
|
8
|
-
import { useUnsubscribeStore as
|
|
9
|
-
function
|
|
10
|
-
const
|
|
11
|
-
return
|
|
12
|
-
const
|
|
13
|
-
|
|
14
|
-
}),
|
|
5
|
+
import { DATA_ATTRIBUTES as S } from "../extensions/Blocks/Unsubscribe/utils/constants.js";
|
|
6
|
+
import { parsePageList as D } from "../extensions/Blocks/Unsubscribe/utils/utils.js";
|
|
7
|
+
import { useDynamicContentStore as P } from "../stores/dynamic-content.js";
|
|
8
|
+
import { useUnsubscribeStore as w } from "../stores/unsubscribe.js";
|
|
9
|
+
function E(i, o) {
|
|
10
|
+
const t = new DOMParser().parseFromString(i, "text/html").querySelectorAll(`[${S.PAGE_LIST}]`), c = [];
|
|
11
|
+
return t.forEach((r) => {
|
|
12
|
+
const a = r.getAttribute(S.PAGE_LIST);
|
|
13
|
+
a && c.push(...D(a));
|
|
14
|
+
}), o.filter((r) => c.includes(r));
|
|
15
15
|
}
|
|
16
|
-
function
|
|
16
|
+
async function U(i) {
|
|
17
17
|
const m = new DOMParser().parseFromString(i, "text/html").querySelectorAll(".recommendation-block-v2");
|
|
18
18
|
if (m.length === 0)
|
|
19
19
|
return;
|
|
20
|
-
const
|
|
21
|
-
m.forEach((
|
|
22
|
-
var g, f, u, n,
|
|
23
|
-
const c =
|
|
24
|
-
if (!Number.isFinite(
|
|
20
|
+
const l = b();
|
|
21
|
+
m.forEach((t) => {
|
|
22
|
+
var g, f, u, n, y;
|
|
23
|
+
const c = t.getAttribute("recommendation-id"), r = c ? Number(c) : NaN;
|
|
24
|
+
if (!Number.isFinite(r))
|
|
25
25
|
return;
|
|
26
|
-
const
|
|
27
|
-
if (!
|
|
26
|
+
const a = t.getAttribute("esd-ext-config");
|
|
27
|
+
if (!a)
|
|
28
28
|
return;
|
|
29
29
|
let e;
|
|
30
30
|
try {
|
|
31
|
-
e = JSON.parse(
|
|
31
|
+
e = JSON.parse(a);
|
|
32
32
|
} catch {
|
|
33
33
|
return;
|
|
34
34
|
}
|
|
35
35
|
if (!e || typeof e != "object" || Array.isArray(e))
|
|
36
36
|
return;
|
|
37
37
|
const p = {
|
|
38
|
-
strategy: e.strategy ??
|
|
39
|
-
language: e.language ??
|
|
40
|
-
size: e.size ??
|
|
38
|
+
strategy: e.strategy ?? s.strategy,
|
|
39
|
+
language: e.language ?? s.language,
|
|
40
|
+
size: e.size ?? s.size,
|
|
41
41
|
// Spread the default arrays so each block gets a fresh reference
|
|
42
42
|
// instead of sharing the singleton in DEFAULT_NODE_CONFIG.
|
|
43
|
-
productIds: e.productIds ?? [...
|
|
44
|
-
filters: e.filters ?? [...
|
|
45
|
-
shuffleProducts: e.shuffleProducts ??
|
|
46
|
-
currencyCode: ((g = e.currency) == null ? void 0 : g.code) ??
|
|
47
|
-
currencyAlignment: ((f = e.currency) == null ? void 0 : f.alignment) ??
|
|
48
|
-
currencyDecimalCount: ((u = e.currency) == null ? void 0 : u.decimalCount) ??
|
|
49
|
-
currencyDecimalSeparator: ((n = e.currency) == null ? void 0 : n.decimalSeparator) ??
|
|
50
|
-
currencyThousandSeparator: ((
|
|
43
|
+
productIds: e.productIds ?? [...s.productIds],
|
|
44
|
+
filters: e.filters ?? [...s.filters],
|
|
45
|
+
shuffleProducts: e.shuffleProducts ?? s.shuffleProducts,
|
|
46
|
+
currencyCode: ((g = e.currency) == null ? void 0 : g.code) ?? d.code,
|
|
47
|
+
currencyAlignment: ((f = e.currency) == null ? void 0 : f.alignment) ?? d.alignment,
|
|
48
|
+
currencyDecimalCount: ((u = e.currency) == null ? void 0 : u.decimalCount) ?? d.decimalCount,
|
|
49
|
+
currencyDecimalSeparator: ((n = e.currency) == null ? void 0 : n.decimalSeparator) ?? d.decimalSeparator,
|
|
50
|
+
currencyThousandSeparator: ((y = e.currency) == null ? void 0 : y.thousandSeparator) ?? d.thousandSeparator
|
|
51
51
|
};
|
|
52
|
-
|
|
52
|
+
l.seedBlockUrlConfig(r, p);
|
|
53
53
|
});
|
|
54
|
+
try {
|
|
55
|
+
await l.fetchRecommendationCreateData();
|
|
56
|
+
} catch (t) {
|
|
57
|
+
console.warn(
|
|
58
|
+
"Recommendation reference data pre-load failed; validator will skip the availability check.",
|
|
59
|
+
t
|
|
60
|
+
);
|
|
61
|
+
}
|
|
54
62
|
}
|
|
55
63
|
const _ = () => {
|
|
56
|
-
const i =
|
|
64
|
+
const i = P(), o = w(), { getCompiledEmail: m, getTemplateData: l } = C(), { compileHtml: t } = T();
|
|
57
65
|
return {
|
|
58
66
|
prepareTemplateDetails: async () => {
|
|
59
|
-
const { html:
|
|
67
|
+
const { html: r, ampHtml: a = "", ampErrors: e = [] } = await m({
|
|
60
68
|
minimize: !0,
|
|
61
69
|
resetDataSavedFlag: !1
|
|
62
|
-
}), { html: p, css: g, syncModulesIds: f = [] } = await
|
|
63
|
-
|
|
64
|
-
const { compiledHtml: u, stats: n, appliedRules:
|
|
70
|
+
}), { html: p, css: g, syncModulesIds: f = [] } = await l();
|
|
71
|
+
o.selectedUnsubscribePages.length && await o.fetchTemplates(), await U(p);
|
|
72
|
+
const { compiledHtml: u, stats: n, appliedRules: y } = t(r), h = i.getSelectedDynamicContentList, A = b();
|
|
65
73
|
return console.debug("HTML Compilation Stats:", {
|
|
66
74
|
originalSize: n.originalSize,
|
|
67
75
|
compiledSize: n.compiledSize,
|
|
68
76
|
reduction: `${n.reductionPercentage.toFixed(2)}%`,
|
|
69
|
-
appliedRules:
|
|
77
|
+
appliedRules: y,
|
|
70
78
|
executionTime: `${n.executionTime.toFixed(2)}ms`
|
|
71
79
|
}), {
|
|
72
80
|
dynamicContentList: h,
|
|
73
81
|
compiledHtml: u,
|
|
74
82
|
rawHtml: p,
|
|
75
83
|
css: g,
|
|
76
|
-
ampHtml:
|
|
84
|
+
ampHtml: a,
|
|
77
85
|
ampErrors: e,
|
|
78
86
|
modules: f.map(Number),
|
|
79
87
|
recommendation: {
|
|
@@ -81,8 +89,8 @@ const _ = () => {
|
|
|
81
89
|
configs: {}
|
|
82
90
|
},
|
|
83
91
|
unsubscribe: {
|
|
84
|
-
status:
|
|
85
|
-
config:
|
|
92
|
+
status: o.unsubscribePagesStatus,
|
|
93
|
+
config: E(u, o.selectedUnsubscribePages)
|
|
86
94
|
}
|
|
87
95
|
};
|
|
88
96
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@useinsider/guido",
|
|
3
|
-
"version": "3.4.
|
|
3
|
+
"version": "3.4.1-beta.3b1ce15",
|
|
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",
|
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
"lint": "NODE_OPTIONS=--max-old-space-size=2048 eslint ./ && bun run type-check",
|
|
25
25
|
"lint:fix": "NODE_OPTIONS=--max-old-space-size=2048 eslint --fix ./",
|
|
26
26
|
"type-check": "vue-tsc --noEmit --project tsconfig.config.json && vue-tsc --noEmit --project tsconfig.app.json",
|
|
27
|
-
"test": "vitest run",
|
|
27
|
+
"test": "vitest run --coverage",
|
|
28
28
|
"test:watch": "vitest",
|
|
29
29
|
"test:visual-update": "npx playwright test --update-snapshots --reporter html",
|
|
30
30
|
"prepare": "husky",
|
|
@@ -61,6 +61,7 @@
|
|
|
61
61
|
"@typescript-eslint/parser": "7.18.0",
|
|
62
62
|
"@useinsider/eslint-config": "1.5.3",
|
|
63
63
|
"@vitejs/plugin-vue2": "2.3.1",
|
|
64
|
+
"@vitest/coverage-v8": "2.1.9",
|
|
64
65
|
"eslint": "8.57.1",
|
|
65
66
|
"eslint-config-airbnb-base": "15.0.0",
|
|
66
67
|
"eslint-config-airbnb-typescript": "18.0.0",
|