@useinsider/guido 3.2.0-beta.1949a28 → 3.2.0-beta.1a14d2a
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.
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { useRecommendation as
|
|
2
|
-
import { DUMMY_IMAGE_MAPPINGS as
|
|
1
|
+
import { useRecommendation as N } from "../../composables/useRecommendation.js";
|
|
2
|
+
import { DUMMY_IMAGE_MAPPINGS as y, REGEX as T, VerticalOrientation as M, CSS as E, ATTRIBUTES as A, CONDITIONS as g, HTML as h } from "../../enums/recommendation.js";
|
|
3
3
|
import { prepareRecommendationBlocks as x } from "./utils/recommendationCompilerUtils.js";
|
|
4
4
|
const w = [
|
|
5
5
|
{
|
|
@@ -8,7 +8,7 @@ const w = [
|
|
|
8
8
|
type: "custom",
|
|
9
9
|
processor: (c) => {
|
|
10
10
|
let e = c;
|
|
11
|
-
return Object.entries(
|
|
11
|
+
return Object.entries(y).forEach(([, l]) => {
|
|
12
12
|
Object.entries(l).forEach(([n, s]) => {
|
|
13
13
|
e = e.replaceAll(s, `{{${n}}}`);
|
|
14
14
|
});
|
|
@@ -30,13 +30,13 @@ const w = [
|
|
|
30
30
|
description: "Adding recommendation unresponsive css",
|
|
31
31
|
type: "custom",
|
|
32
32
|
processor: (c) => {
|
|
33
|
-
const { calculateCardWidth: e, getRecommendationCampaignData: l } =
|
|
33
|
+
const { calculateCardWidth: e, getRecommendationCampaignData: l } = N();
|
|
34
34
|
let n = c;
|
|
35
35
|
const s = n.match(T.ID);
|
|
36
36
|
if (s) {
|
|
37
37
|
const a = [];
|
|
38
38
|
if (s.forEach((i) => {
|
|
39
|
-
const
|
|
39
|
+
const u = /recommendation-id="(.*?)"/i.exec(i), _ = u ? u[1].trim() : "", R = l(_);
|
|
40
40
|
R.textTrimming && R.orientation === M && a.push(e(R));
|
|
41
41
|
}), a.length) {
|
|
42
42
|
const i = `width:${Math.min(...a)}px!important;`;
|
|
@@ -60,25 +60,25 @@ const w = [
|
|
|
60
60
|
type: "custom",
|
|
61
61
|
processor: (c) => {
|
|
62
62
|
let e = c;
|
|
63
|
-
const l = e.match(T.ATTRIBUTE_PARAGRAPH), { getRecommendationCampaignData: n } =
|
|
63
|
+
const l = e.match(T.ATTRIBUTE_PARAGRAPH), { getRecommendationCampaignData: n } = N();
|
|
64
64
|
return l !== null && l.forEach((s) => {
|
|
65
65
|
const a = s.match(T.CUSTOM_FIELD);
|
|
66
66
|
if (!a)
|
|
67
67
|
return;
|
|
68
|
-
const [i] = a,
|
|
69
|
-
if (!
|
|
68
|
+
const [i] = a, u = i.match(T.CUSTOM_FIELD_INDEXES_PART), _ = i.match(T.CUSTOM_FIELD_NAME_PART), R = s.match(T.ATTRIBUTE_PARAGRAPH_START_TAG);
|
|
69
|
+
if (!u || !_ || !R)
|
|
70
70
|
return;
|
|
71
|
-
const [S] =
|
|
71
|
+
const [S] = u, [b] = _, [d] = R, o = b.substring(1, b.length - 2), r = d.match(T.COMPOSITION) !== null;
|
|
72
72
|
let t = i;
|
|
73
73
|
if (r) {
|
|
74
|
-
const I = S.substring(2, S.length - 3),
|
|
75
|
-
o === A.OMNIBUS_PRICE && (
|
|
74
|
+
const I = S.substring(2, S.length - 3), m = n(I);
|
|
75
|
+
o === A.OMNIBUS_PRICE && (m.priceBeforeTextValue && (t = `${m.priceBeforeTextValue}${t}`), m.priceAfterTextValue && (t = `${t}${m.priceAfterTextValue}`)), o === A.OMNIBUS_DISCOUNT && (m.discountBeforeTextValue && (t = `${m.discountBeforeTextValue}${t}`), m.discountAfterTextValue && (t = `${t}${m.discountAfterTextValue}`));
|
|
76
76
|
}
|
|
77
|
-
const
|
|
77
|
+
const p = S.substring(2);
|
|
78
78
|
let f = "";
|
|
79
|
-
o in g.IF && (f = g.IF[o].replaceAll(`{${A.DISCOUNT}}`, `${
|
|
80
|
-
const $ = `${
|
|
81
|
-
e = e.replace(s,
|
|
79
|
+
o in g.IF && (f = g.IF[o].replaceAll(`{${A.DISCOUNT}}`, `${p}${A.DISCOUNT}`).replaceAll(`{${A.OMNIBUS_DISCOUNT}}`, `${p}${A.OMNIBUS_DISCOUNT}`).replaceAll(`{${A.OMNIBUS_PRICE}}`, `${p}${A.OMNIBUS_PRICE}`));
|
|
80
|
+
const $ = `${d}${t}${h.PARAGRAPH_END_TAG}`, C = `${f}${r ? $ : s}${g.ELSE}${d}${h.PARAGRAPH_END_TAG}${g.END_IF}`;
|
|
81
|
+
e = e.replace(s, C);
|
|
82
82
|
}), e;
|
|
83
83
|
},
|
|
84
84
|
priority: 53
|
|
@@ -136,7 +136,7 @@ const w = [
|
|
|
136
136
|
/@media[^{]*max-width\s*:\s*480px[^{]*\{((?:[^{}]*\{[^{}]*\})*[^{}]*)\}/g,
|
|
137
137
|
(l, n) => {
|
|
138
138
|
const s = n.match(/[^{}]+\{[^{}]*\}/g) || [], a = /ins-recommendation|product-image-cell|button-cell|product-info-cell/;
|
|
139
|
-
return s.every((
|
|
139
|
+
return s.every((u) => a.test(u)) ? "" : l;
|
|
140
140
|
}
|
|
141
141
|
)), e;
|
|
142
142
|
},
|
|
@@ -151,7 +151,7 @@ const w = [
|
|
|
151
151
|
/<a\b[^>]*\bes-button\b[^>]*>/g,
|
|
152
152
|
(o) => o.replace(
|
|
153
153
|
/([;"]color:)([^;"]+)/g,
|
|
154
|
-
(r, t,
|
|
154
|
+
(r, t, p) => p.includes("!important") ? r : `${t}${p} !important`
|
|
155
155
|
)
|
|
156
156
|
), l = /<!--REC_START-->([\s\S]*?)<!--REC_END-->/g, n = / style="([^"]*)"/g, s = /* @__PURE__ */ new Map();
|
|
157
157
|
let a = l.exec(e);
|
|
@@ -163,12 +163,12 @@ const w = [
|
|
|
163
163
|
}
|
|
164
164
|
n.lastIndex = 0, a = l.exec(e);
|
|
165
165
|
}
|
|
166
|
-
const i = /* @__PURE__ */ new Map(),
|
|
166
|
+
const i = /* @__PURE__ */ new Map(), u = [];
|
|
167
167
|
let _ = 0;
|
|
168
168
|
if (s.forEach((o, r) => {
|
|
169
169
|
if (o >= 6) {
|
|
170
|
-
const t = `rc${_++}
|
|
171
|
-
i.set(r, t),
|
|
170
|
+
const t = `rc${_++}`, p = r.endsWith(";") ? r : `${r};`;
|
|
171
|
+
i.set(r, t), u.push(`.${t}{${p}}`);
|
|
172
172
|
}
|
|
173
173
|
}), i.size === 0) {
|
|
174
174
|
let o = e;
|
|
@@ -182,23 +182,23 @@ const w = [
|
|
|
182
182
|
caseB: new RegExp(` style="${t}"((?:[^>]*?))(class="[^"]*")`, "g")
|
|
183
183
|
});
|
|
184
184
|
});
|
|
185
|
-
let
|
|
186
|
-
return
|
|
185
|
+
let d = e.replace("</style>", `${u.join("")}</style>`);
|
|
186
|
+
return d = d.replace(
|
|
187
187
|
/<!--REC_START-->([\s\S]*?)<!--REC_END-->/g,
|
|
188
188
|
(o, r) => {
|
|
189
189
|
let t = r;
|
|
190
|
-
return i.forEach((
|
|
190
|
+
return i.forEach((p, f) => {
|
|
191
191
|
const $ = b.get(f);
|
|
192
192
|
t = t.replace(
|
|
193
193
|
$.caseA,
|
|
194
|
-
(
|
|
194
|
+
(C, I, m) => S(I, p) + m
|
|
195
195
|
), t = t.replace(
|
|
196
196
|
$.caseB,
|
|
197
|
-
(
|
|
198
|
-
), t = t.replaceAll(` style="${f}"`, ` class="${
|
|
197
|
+
(C, I, m) => I + S(m, p)
|
|
198
|
+
), t = t.replaceAll(` style="${f}"`, ` class="${p}"`);
|
|
199
199
|
}), t;
|
|
200
200
|
}
|
|
201
|
-
),
|
|
201
|
+
), d = d.replaceAll("<!--REC_START-->", ""), d = d.replaceAll("<!--REC_END-->", ""), d;
|
|
202
202
|
},
|
|
203
203
|
priority: 58
|
|
204
204
|
}
|
|
@@ -1,54 +1,34 @@
|
|
|
1
1
|
var x = Object.defineProperty;
|
|
2
|
-
var
|
|
3
|
-
var b = (
|
|
4
|
-
import
|
|
5
|
-
class
|
|
2
|
+
var f = (r, t, e) => t in r ? x(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e;
|
|
3
|
+
var b = (r, t, e) => f(r, typeof t != "symbol" ? t + "" : t, e);
|
|
4
|
+
import h from "../../extensions/Blocks/RadioButton/template.js";
|
|
5
|
+
class T {
|
|
6
6
|
constructor() {
|
|
7
7
|
b(this, "parser");
|
|
8
8
|
this.parser = new DOMParser();
|
|
9
9
|
}
|
|
10
|
-
migrate(
|
|
10
|
+
migrate(t) {
|
|
11
11
|
try {
|
|
12
|
-
const
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
let o = !1;
|
|
16
|
-
return i.forEach((r) => {
|
|
17
|
-
if (r.classList.contains("radio-button-v2"))
|
|
12
|
+
const e = this.parser.parseFromString(t, "text/html"), i = e.querySelectorAll("td.radio-button-block");
|
|
13
|
+
return i.length === 0 ? t : (i.forEach((s) => {
|
|
14
|
+
if (s.classList.contains("radio-button-v2"))
|
|
18
15
|
return;
|
|
19
|
-
const n =
|
|
20
|
-
`<table id="tempDoc"><tbody><tr>${
|
|
16
|
+
const n = s.getAttribute("id"), l = this.extractTextFromElement(s, "ins-title"), a = this.extractTextFromElement(s, "ins-description"), p = this.extractTextFromElement(s, "ins-subscribe"), u = this.extractTextFromElement(s, "ins-unsubscribe"), d = this.buildTextBlock(l), g = this.buildTextBlock(a), m = this.buildTextBlock({ ...p, classList: "" }), o = this.buildTextBlock({ ...u, classList: "" }), c = h.replace("{-{-TITLE-}-}", d).replace("{-{-DESCRIPTION-}-}", g).replace("{-{-YES-}-}", m).replace("{-{-NO-}-}", o), y = this.parser.parseFromString(
|
|
17
|
+
`<table id="tempDoc"><tbody><tr>${c}</tr></tbody></table>`,
|
|
21
18
|
"text/html"
|
|
22
19
|
).querySelector(".radio-button-v2");
|
|
23
|
-
|
|
24
|
-
}),
|
|
25
|
-
} catch (
|
|
26
|
-
return console.error("RadioButtonMigrator failed:",
|
|
20
|
+
y && s.parentNode && (y.setAttribute("id", n || ""), s.parentNode.replaceChild(y, s));
|
|
21
|
+
}), e.documentElement.outerHTML);
|
|
22
|
+
} catch (e) {
|
|
23
|
+
return console.error("RadioButtonMigrator failed:", e), t;
|
|
27
24
|
}
|
|
28
25
|
}
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
var p;
|
|
33
|
-
const s = i.querySelector("input#radioYes"), o = i.querySelector("input#radioNo");
|
|
34
|
-
if (!s || !o)
|
|
35
|
-
return;
|
|
36
|
-
const r = ((p = s.parentElement) == null ? void 0 : p.querySelector(":scope > p")) || null;
|
|
37
|
-
if (!r && !s.hasAttribute("align"))
|
|
38
|
-
return;
|
|
39
|
-
const n = s.closest("tr"), a = o.closest("tr");
|
|
40
|
-
if (!n || !a || n === a || !n.parentNode)
|
|
41
|
-
return;
|
|
42
|
-
const g = (r == null ? void 0 : r.innerHTML.trim()) || "Yes", c = a.cloneNode(!0), u = c.querySelector("input#radioNo"), d = c.querySelector("p");
|
|
43
|
-
u && (u.setAttribute("id", "radioYes"), u.removeAttribute("align")), d && (d.innerHTML = g), n.parentNode.replaceChild(c, n), t = !0;
|
|
44
|
-
}), t;
|
|
45
|
-
}
|
|
46
|
-
extractTextFromElement(e, t) {
|
|
47
|
-
var p, y;
|
|
48
|
-
const i = e.querySelector(`.${t}`);
|
|
26
|
+
extractTextFromElement(t, e) {
|
|
27
|
+
var o, c;
|
|
28
|
+
const i = t.querySelector(`.${e}`);
|
|
49
29
|
if (!i)
|
|
50
30
|
return {
|
|
51
|
-
text:
|
|
31
|
+
text: e === "ins-title" ? "Title" : "Description",
|
|
52
32
|
isBold: !1,
|
|
53
33
|
isItalic: !1,
|
|
54
34
|
align: "left",
|
|
@@ -58,51 +38,51 @@ class B {
|
|
|
58
38
|
const s = i.querySelector("p");
|
|
59
39
|
if (!s)
|
|
60
40
|
return {
|
|
61
|
-
text: ((
|
|
41
|
+
text: ((o = i.textContent) == null ? void 0 : o.trim()) || (e === "ins-title" ? "Title" : "Description"),
|
|
62
42
|
isBold: !1,
|
|
63
43
|
isItalic: !1,
|
|
64
44
|
align: i.getAttribute("align") || "left",
|
|
65
45
|
styles: "",
|
|
66
46
|
classList: ""
|
|
67
47
|
};
|
|
68
|
-
const
|
|
48
|
+
const n = ((c = s.textContent) == null ? void 0 : c.trim()) || (e === "ins-title" ? "Title" : "Description"), l = s.getAttribute("style") || "", a = i.getAttribute("align") || s.getAttribute("align") || "left", p = /font-weight\s*:\s*bold/i.test(l) || !!s.querySelector("b, strong"), u = /font-style\s*:\s*italic/i.test(l) || !!s.querySelector("i, em"), d = this.removeStyleProperties(l, ["font-weight", "font-style"]), g = this.convertInlineToBlock(d), m = i.getAttribute("class") || "";
|
|
69
49
|
return {
|
|
70
|
-
text:
|
|
71
|
-
isBold:
|
|
72
|
-
isItalic:
|
|
73
|
-
align:
|
|
74
|
-
styles:
|
|
75
|
-
classList:
|
|
50
|
+
text: n,
|
|
51
|
+
isBold: p,
|
|
52
|
+
isItalic: u,
|
|
53
|
+
align: a,
|
|
54
|
+
styles: g,
|
|
55
|
+
classList: m
|
|
76
56
|
};
|
|
77
57
|
}
|
|
78
|
-
buildTextBlock(
|
|
79
|
-
let
|
|
80
|
-
|
|
81
|
-
const i =
|
|
58
|
+
buildTextBlock(t) {
|
|
59
|
+
let e = t.text;
|
|
60
|
+
t.isBold && t.isItalic ? e = `<strong path="1,0"><em path="1,0,0">${e}</em></strong>` : t.isBold ? e = `<strong path="1,0">${e}</strong>` : t.isItalic && (e = `<em path="1,0">${e}</em>`);
|
|
61
|
+
const i = t.align ? ` align="${t.align}"` : "", s = t.styles ? ` style="${t.styles.replaceAll('"', "'")}"` : "";
|
|
82
62
|
return `
|
|
83
|
-
<td class="esd-block-text ${
|
|
63
|
+
<td class="esd-block-text ${t.classList}" ${i}>
|
|
84
64
|
<p path="1" ${s}>
|
|
85
|
-
${
|
|
65
|
+
${e}
|
|
86
66
|
</p>
|
|
87
67
|
</td>
|
|
88
68
|
`;
|
|
89
69
|
}
|
|
90
|
-
removeStyleProperties(
|
|
91
|
-
return
|
|
92
|
-
const
|
|
93
|
-
return s.replace(
|
|
94
|
-
},
|
|
70
|
+
removeStyleProperties(t, e) {
|
|
71
|
+
return t ? e.reduce((s, n) => {
|
|
72
|
+
const l = new RegExp(`${n}\\s*:\\s*[^;]*;?`, "gi");
|
|
73
|
+
return s.replace(l, "");
|
|
74
|
+
}, t).replace(/;\s*;/g, ";").replace(/^;|;$/g, "").trim() : "";
|
|
95
75
|
}
|
|
96
|
-
convertInlineToBlock(
|
|
97
|
-
if (!
|
|
76
|
+
convertInlineToBlock(t) {
|
|
77
|
+
if (!t)
|
|
98
78
|
return "";
|
|
99
|
-
let
|
|
100
|
-
return /display\s*:/i.test(
|
|
79
|
+
let e = t.replace(/display\s*:\s*inline/gi, "display: block");
|
|
80
|
+
return /display\s*:/i.test(e) || (e = e ? `${e}; display: block` : "display: block"), e.replace(/;\s*;/g, ";").replace(/^;|;$/g, "").trim();
|
|
101
81
|
}
|
|
102
82
|
}
|
|
103
|
-
function
|
|
104
|
-
return new
|
|
83
|
+
function A(r) {
|
|
84
|
+
return new T().migrate(r);
|
|
105
85
|
}
|
|
106
86
|
export {
|
|
107
|
-
|
|
87
|
+
A as migrateRadioButton
|
|
108
88
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
declare const migrationTemplate = "\n <td\n align=\"left\"\n esd-extension-block-id=\"radio-button-block\"\n esd-handler-name=\"esd-extension-RadioButtonBlock\"\n class=\"\n radio-button\n radio-button-v2\n esd-block-ra\n esd-radio-button-block\n esd-extension-block\n es-p10t\n es-p10b\n es-p30r\n es-p30l\"\n >\n <table cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" width=\"100%\">\n <tbody>\n <tr>\n <td align=\"left\" width=\"70%\" style=\"vertical-align: top;\">\n <table cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" width=\"100%\">\n <tbody>\n <tr>\n {-{-TITLE-}-}\n </tr>\n <tr>\n {-{-DESCRIPTION-}-}\n </tr>\n </tbody>\n </table>\n </td>\n <td align=\"right\" width=\"30%\" style=\"vertical-align: middle;\">\n <table cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" width=\"100%\">\n <tbody>\n <tr>\n <td width=\"50%\">\n <table width=\"100%\">\n <tr>\n <td width=\"24\">\n <input\n type=\"radio\"\n id=\"radioYes\"\n name=\"unsubscribe\"\n data-cke-editable=\"1\"\n style=\"margin: 0px; vertical-align: middle
|
|
1
|
+
declare const migrationTemplate = "\n <td\n align=\"left\"\n esd-extension-block-id=\"radio-button-block\"\n esd-handler-name=\"esd-extension-RadioButtonBlock\"\n class=\"\n radio-button\n radio-button-v2\n esd-block-ra\n esd-radio-button-block\n esd-extension-block\n es-p10t\n es-p10b\n es-p30r\n es-p30l\"\n >\n <table cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" width=\"100%\">\n <tbody>\n <tr>\n <td align=\"left\" width=\"70%\" style=\"vertical-align: top;\">\n <table cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" width=\"100%\">\n <tbody>\n <tr>\n {-{-TITLE-}-}\n </tr>\n <tr>\n {-{-DESCRIPTION-}-}\n </tr>\n </tbody>\n </table>\n </td>\n <td align=\"right\" width=\"30%\" style=\"vertical-align: middle;\">\n <table cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" width=\"100%\">\n <tbody>\n <tr>\n <td width=\"50%\">\n <table width=\"100%\">\n <tr>\n <td width=\"24\">\n <input\n type=\"radio\"\n id=\"radioYes\"\n name=\"unsubscribe\"\n data-cke-editable=\"1\"\n style=\"margin: 0px; vertical-align: middle;>\n </td>\n {-{-YES-}-}\n </tr>\n </table>\n </td>\n <td width=\"50%\">\n <table width=\"100%\">\n <tr>\n <td width=\"24\">\n <input\n type=\"radio\"\n id=\"radioNo\"\n name=\"unsubscribe\"\n data-cke-editable=\"1\"\n style=\"margin: 0px; vertical-align: middle;\">\n </td>\n {-{-NO-}-}\n </tr>\n </table>\n </td>\n </tr>\n </tbody>\n </table>\n </td>\n </tr>\n </tbody>\n </table>\n </td>\n";
|
|
2
2
|
/**
|
|
3
3
|
* @returns The template for the default checkbox block
|
|
4
4
|
*/
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@useinsider/guido",
|
|
3
|
-
"version": "3.2.0-beta.
|
|
3
|
+
"version": "3.2.0-beta.1a14d2a",
|
|
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",
|