@useinsider/guido 2.1.0-beta.c305789 → 2.1.0-beta.c684df8
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/dist/@types/config/schemas.js +1 -1
- package/dist/components/organisms/base/Toaster.vue.js +4 -4
- package/dist/components/organisms/base/Toaster.vue2.js +12 -9
- package/dist/components/organisms/email-preview/desktop-preview/EmailSizeIndicator.vue.js +5 -5
- package/dist/components/organisms/email-preview/desktop-preview/EmailSizeIndicator.vue2.js +2 -2
- package/dist/components/organisms/extensions/recommendation/FilterItem.vue.js +11 -13
- package/dist/components/organisms/extensions/recommendation/FilterItem.vue2.js +54 -23
- package/dist/components/organisms/extensions/recommendation/FilterSelectionDrawer.vue.js +7 -5
- package/dist/components/organisms/extensions/recommendation/FilterSelectionDrawer.vue2.js +34 -21
- package/dist/components/organisms/extensions/recommendation/Filters.vue.js +11 -11
- package/dist/components/organisms/extensions/recommendation/Filters.vue2.js +48 -36
- package/dist/components/organisms/extensions/recommendation/LogicAdapter.vue2.js +11 -9
- package/dist/components/organisms/header/EditorActions.vue.js +8 -10
- package/dist/components/organisms/header/EditorActions.vue2.js +31 -40
- package/dist/composables/useRecommendation.js +9 -9
- package/dist/config/compiler/utils/recommendationCompilerUtils.js +1 -1
- package/dist/config/i18n/en/labels.json.js +3 -8
- package/dist/config/migrator/itemsBlockMigrator.js +134 -139
- package/dist/config/migrator/recommendationMigrator.js +41 -46
- package/dist/extensions/Blocks/Items/block.js +25 -45
- package/dist/extensions/Blocks/Items/iconsRegistry.js +5 -6
- package/dist/extensions/Blocks/Items/items.css.js +0 -48
- package/dist/extensions/Blocks/Recommendation/block.js +29 -49
- package/dist/extensions/Blocks/Recommendation/constants/defaultConfig.js +36 -33
- package/dist/extensions/Blocks/Recommendation/constants/layout.js +16 -14
- package/dist/extensions/Blocks/Recommendation/constants/selectors.js +15 -13
- package/dist/extensions/Blocks/Recommendation/controls/button/index.js +9 -9
- package/dist/extensions/Blocks/Recommendation/controls/image/index.js +1 -1
- package/dist/extensions/Blocks/Recommendation/controls/layout/index.js +41 -29
- package/dist/extensions/Blocks/Recommendation/controls/main/algorithm.js +16 -16
- package/dist/extensions/Blocks/Recommendation/controls/main/currency.js +30 -32
- package/dist/extensions/Blocks/Recommendation/controls/main/index.js +194 -104
- package/dist/extensions/Blocks/Recommendation/controls/main/locale.js +9 -9
- package/dist/extensions/Blocks/Recommendation/controls/main/productLayout.js +46 -38
- package/dist/extensions/Blocks/Recommendation/controls/main/shuffle.js +16 -16
- package/dist/extensions/Blocks/Recommendation/controls/main/utils.js +291 -217
- package/dist/extensions/Blocks/Recommendation/controls/mobileLayout/cssRules.js +14 -14
- package/dist/extensions/Blocks/Recommendation/controls/name/index.js +10 -10
- package/dist/extensions/Blocks/Recommendation/controls/name/textTrim.js +5 -5
- package/dist/extensions/Blocks/Recommendation/controls/oldPrice/index.js +14 -14
- package/dist/extensions/Blocks/Recommendation/controls/omnibusDiscount/index.js +9 -9
- package/dist/extensions/Blocks/Recommendation/controls/omnibusDiscount/textAfter.js +3 -3
- package/dist/extensions/Blocks/Recommendation/controls/omnibusDiscount/textBefore.js +1 -1
- package/dist/extensions/Blocks/Recommendation/controls/omnibusPrice/index.js +9 -9
- package/dist/extensions/Blocks/Recommendation/controls/omnibusPrice/textAfter.js +3 -3
- package/dist/extensions/Blocks/Recommendation/controls/omnibusPrice/textBefore.js +13 -13
- package/dist/extensions/Blocks/Recommendation/controls/price/index.js +3 -3
- package/dist/extensions/Blocks/Recommendation/controls/spacing/index.js +223 -99
- package/dist/extensions/Blocks/Recommendation/iconsRegistry.js +3 -4
- package/dist/extensions/Blocks/Recommendation/recommendation.css.js +0 -48
- package/dist/extensions/Blocks/Recommendation/store/recommendation.js +172 -85
- package/dist/extensions/Blocks/Recommendation/templates/grid/elementRenderer.js +2 -2
- package/dist/extensions/Blocks/Recommendation/templates/grid/migration.js +1 -1
- package/dist/extensions/Blocks/Recommendation/templates/list/elementRenderer.js +2 -2
- package/dist/extensions/Blocks/Recommendation/templates/utils.js +32 -32
- package/dist/extensions/Blocks/Recommendation/utils/filterUtil.js +8 -8
- package/dist/extensions/Blocks/Recommendation/validation/filterSchema.js +29 -0
- package/dist/extensions/Blocks/common-control.js +4 -12
- package/dist/guido.css +1 -1
- package/dist/src/components/Guido.vue.d.ts +1 -1
- package/dist/src/components/organisms/extensions/recommendation/FilterItem.vue.d.ts +1 -0
- package/dist/src/components/organisms/extensions/recommendation/Filters.vue.d.ts +17 -1
- package/dist/src/components/organisms/header/EditorActions.vue.d.ts +1 -1
- package/dist/src/components/organisms/header/HeaderWrapper.vue.d.ts +1 -1
- package/dist/src/components/organisms/header/RightSlot.vue.d.ts +1 -1
- package/dist/src/components/wrappers/WpModal.vue.d.ts +2 -2
- package/dist/src/extensions/Blocks/Items/block.d.ts +0 -1
- package/dist/src/extensions/Blocks/Recommendation/block.d.ts +0 -1
- package/dist/src/extensions/Blocks/Recommendation/constants/defaultConfig.d.ts +6 -0
- package/dist/src/extensions/Blocks/Recommendation/constants/index.d.ts +3 -3
- package/dist/src/extensions/Blocks/Recommendation/constants/layout.d.ts +6 -2
- package/dist/src/extensions/Blocks/Recommendation/constants/selectors.d.ts +8 -1
- package/dist/src/extensions/Blocks/Recommendation/controls/main/index.d.ts +38 -10
- package/dist/src/extensions/Blocks/Recommendation/controls/main/utils.d.ts +27 -14
- package/dist/src/extensions/Blocks/Recommendation/controls/spacing/index.d.ts +50 -17
- package/dist/src/extensions/Blocks/Recommendation/store/recommendation.d.ts +19 -2
- package/dist/src/extensions/Blocks/Recommendation/templates/grid/migration.d.ts +1 -1
- package/dist/src/extensions/Blocks/Recommendation/templates/index.d.ts +4 -2
- package/dist/src/extensions/Blocks/Recommendation/templates/list/migration.d.ts +1 -1
- package/dist/src/extensions/Blocks/Recommendation/templates/utils.d.ts +1 -1
- package/dist/src/extensions/Blocks/Recommendation/types/nodeConfig.d.ts +8 -0
- package/dist/src/extensions/Blocks/Recommendation/validation/filterSchema.d.ts +15 -0
- package/dist/src/extensions/Blocks/common-control.d.ts +0 -5
- package/dist/static/styles/customEditorStyle.css.js +50 -23
- package/package.json +2 -2
- package/dist/components/organisms/header/MigrationConfirmModal.vue.js +0 -17
- package/dist/components/organisms/header/MigrationConfirmModal.vue2.js +0 -41
- package/dist/extensions/Blocks/common-icons.js +0 -39
- package/dist/src/components/organisms/header/MigrationConfirmModal.vue.d.ts +0 -6
- package/dist/src/extensions/Blocks/common-icons.d.ts +0 -1
- package/dist/src/stores/template.d.ts +0 -3
- package/dist/stores/template.js +0 -9
|
@@ -1,29 +1,24 @@
|
|
|
1
1
|
var h = Object.defineProperty;
|
|
2
|
-
var T = (
|
|
3
|
-
var
|
|
4
|
-
import {
|
|
5
|
-
import
|
|
6
|
-
|
|
7
|
-
import { getDefaultProducts as B } from "../../extensions/Blocks/Recommendation/templates/utils.js";
|
|
8
|
-
class $ {
|
|
2
|
+
var T = (A, e, t) => e in A ? h(A, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : A[e] = t;
|
|
3
|
+
var m = (A, e, t) => T(A, typeof e != "symbol" ? e + "" : e, t);
|
|
4
|
+
import P, { prepareProductRows as S } from "../../extensions/Blocks/Recommendation/templates/grid/migration.js";
|
|
5
|
+
import { getDefaultProducts as q } from "../../extensions/Blocks/Recommendation/templates/utils.js";
|
|
6
|
+
class w {
|
|
9
7
|
constructor() {
|
|
10
|
-
|
|
8
|
+
m(this, "parser");
|
|
11
9
|
this.parser = new DOMParser();
|
|
12
10
|
}
|
|
13
11
|
migrate(e) {
|
|
14
12
|
try {
|
|
15
13
|
const t = this.parser.parseFromString(e, "text/html"), s = t.querySelectorAll(
|
|
16
14
|
'td.ins-recommendation-v3-block-1, td.product-block[esd-handler-name*="EmailRecommendationV3"]'
|
|
17
|
-
)
|
|
18
|
-
return
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
}, s.length === 0 ? e : (s.forEach((n) => {
|
|
22
|
-
const r = n.getAttribute("id"), i = this.extractBgColor(n), u = this.extractTitle(n), c = this.extractProductRows(n), l = P.replace("{-{-TITLE-}-}", u).replace("{-{-PRODUCT_ROWS-}-}", c), a = this.parser.parseFromString(
|
|
23
|
-
`<table id="tempDoc"><tbody><tr>${l}</tr></tbody></table>`,
|
|
15
|
+
);
|
|
16
|
+
return s.length === 0 ? e : (s.forEach((o) => {
|
|
17
|
+
const l = o.getAttribute("id"), r = this.extractBgColor(o), i = this.extractTitle(o), u = this.extractProductRows(o), c = P.replace("{-{-TITLE-}-}", i).replace("{-{-PRODUCT_ROWS-}-}", u), a = this.parser.parseFromString(
|
|
18
|
+
`<table id="tempDoc"><tbody><tr>${c}</tr></tbody></table>`,
|
|
24
19
|
"text/html"
|
|
25
|
-
).querySelector(".
|
|
26
|
-
a &&
|
|
20
|
+
).querySelector(".recommendation-block-v2");
|
|
21
|
+
a && o.parentNode && (l && a.setAttribute("id", l), r && a.setAttribute("bgcolor", r), o.parentNode.replaceChild(a, o));
|
|
27
22
|
}), t.documentElement.outerHTML);
|
|
28
23
|
} catch (t) {
|
|
29
24
|
return console.error("RecommendationMigrator failed:", t), e;
|
|
@@ -69,7 +64,7 @@ class $ {
|
|
|
69
64
|
* @returns HTML string for the title block
|
|
70
65
|
*/
|
|
71
66
|
extractTitle(e) {
|
|
72
|
-
var
|
|
67
|
+
var a, g;
|
|
73
68
|
const t = e.querySelector(".ext-recommendation-title");
|
|
74
69
|
if (!t)
|
|
75
70
|
return this.buildTitleBlock({
|
|
@@ -81,7 +76,7 @@ class $ {
|
|
|
81
76
|
});
|
|
82
77
|
const s = t.querySelector("p");
|
|
83
78
|
if (!s) {
|
|
84
|
-
const p = ((
|
|
79
|
+
const p = ((a = t.textContent) == null ? void 0 : a.trim()) || "You May Also Like!", b = t.getAttribute("align") || "center";
|
|
85
80
|
return this.buildTitleBlock({
|
|
86
81
|
text: p,
|
|
87
82
|
isBold: !0,
|
|
@@ -90,13 +85,13 @@ class $ {
|
|
|
90
85
|
styles: "font-size: 28px; color: #333333;"
|
|
91
86
|
});
|
|
92
87
|
}
|
|
93
|
-
const o = ((
|
|
88
|
+
const o = ((g = s.textContent) == null ? void 0 : g.trim()) || "You May Also Like!", l = t.getAttribute("align") || s.getAttribute("align") || "center", r = s.getAttribute("style") || "", i = /font-weight\s*:\s*bold/i.test(r) || !!s.querySelector("b, strong"), u = /font-style\s*:\s*italic/i.test(r) || !!s.querySelector("i, em"), c = this.removeStyleProperties(r, ["font-weight", "font-style"]), n = this.convertInlineToBlock(c);
|
|
94
89
|
return this.buildTitleBlock({
|
|
95
90
|
text: o,
|
|
96
91
|
isBold: i,
|
|
97
92
|
isItalic: u,
|
|
98
|
-
align:
|
|
99
|
-
styles:
|
|
93
|
+
align: l,
|
|
94
|
+
styles: n
|
|
100
95
|
});
|
|
101
96
|
}
|
|
102
97
|
/**
|
|
@@ -108,8 +103,8 @@ class $ {
|
|
|
108
103
|
const t = this.extractProductConfig(e);
|
|
109
104
|
if (!t)
|
|
110
105
|
return console.warn("[RecommendationMigrator] No product config found, using defaults"), this.generateProductRows(6, 3, {});
|
|
111
|
-
const { totalCount: s, productsPerRow: o } = t,
|
|
112
|
-
return this.generateProductRows(s, o,
|
|
106
|
+
const { totalCount: s, productsPerRow: o } = t, l = this.extractProductStyles(e);
|
|
107
|
+
return this.generateProductRows(s, o, l);
|
|
113
108
|
}
|
|
114
109
|
/**
|
|
115
110
|
* Extracts Stripo padding/margin utility classes from a class string
|
|
@@ -157,12 +152,12 @@ class $ {
|
|
|
157
152
|
* @returns HTML string for product rows with applied styles
|
|
158
153
|
*/
|
|
159
154
|
generateProductRows(e, t, s) {
|
|
160
|
-
const o =
|
|
155
|
+
const o = q(), l = [];
|
|
161
156
|
for (let i = 0; i < e; i++) {
|
|
162
157
|
const u = o[i % o.length];
|
|
163
|
-
|
|
158
|
+
l.push({ ...u });
|
|
164
159
|
}
|
|
165
|
-
let r =
|
|
160
|
+
let r = S(l, t);
|
|
166
161
|
return r = this.applyExtractedStyles(r, s), r;
|
|
167
162
|
}
|
|
168
163
|
/**
|
|
@@ -176,30 +171,30 @@ class $ {
|
|
|
176
171
|
return console.warn("[RecommendationMigrator] No product card found, using default styles"), t;
|
|
177
172
|
const o = this.extractCardBgColor(s);
|
|
178
173
|
o && (t.cardBgColor = o);
|
|
179
|
-
const
|
|
180
|
-
if (
|
|
181
|
-
const
|
|
182
|
-
t.imageWidth =
|
|
174
|
+
const l = s.querySelector(".ext-product-image");
|
|
175
|
+
if (l) {
|
|
176
|
+
const n = l.querySelector("img"), a = n == null ? void 0 : n.getAttribute("width"), g = l.getAttribute("style") || "", p = l.getAttribute("align") || "center", b = l.getAttribute("class") || "", d = this.extractStripoClasses(b);
|
|
177
|
+
t.imageWidth = a || "120", t.imageAlign = p, t.imageTdStyle = g, t.imageClasses = d;
|
|
183
178
|
}
|
|
184
179
|
const r = s.querySelector(".ext-product-name");
|
|
185
180
|
if (r) {
|
|
186
|
-
const
|
|
187
|
-
t.nameStyle =
|
|
181
|
+
const n = r.querySelector("p"), a = (n == null ? void 0 : n.getAttribute("style")) || "", g = r.getAttribute("align") || "center", p = r.getAttribute("style") || "", b = r.getAttribute("class") || "", d = this.extractStripoClasses(b);
|
|
182
|
+
t.nameStyle = a, t.nameAlign = g, t.nameTdStyle = p, t.nameClasses = d;
|
|
188
183
|
}
|
|
189
184
|
const i = s.querySelector(".ext-product-price");
|
|
190
185
|
if (i) {
|
|
191
|
-
const
|
|
192
|
-
t.priceStyle =
|
|
186
|
+
const n = i.querySelector("p"), a = (n == null ? void 0 : n.getAttribute("style")) || "", g = i.getAttribute("align") || "center", p = i.getAttribute("style") || "", b = i.getAttribute("class") || "", d = this.extractStripoClasses(b);
|
|
187
|
+
t.priceStyle = a, t.priceAlign = g, t.priceTdStyle = p, t.priceClasses = d;
|
|
193
188
|
}
|
|
194
189
|
const u = s.querySelector(".ext-product-original-price");
|
|
195
190
|
if (u) {
|
|
196
|
-
const
|
|
197
|
-
t.oldPriceStyle =
|
|
191
|
+
const n = u.querySelector("p"), a = (n == null ? void 0 : n.getAttribute("style")) || "", g = u.getAttribute("align") || "center", p = u.getAttribute("style") || "", b = u.getAttribute("class") || "", d = this.extractStripoClasses(b);
|
|
192
|
+
t.oldPriceStyle = a, t.oldPriceAlign = g, t.oldPriceTdStyle = p, t.oldPriceClasses = d;
|
|
198
193
|
}
|
|
199
194
|
const c = s.querySelector(".ext-product-button");
|
|
200
195
|
if (c) {
|
|
201
|
-
const
|
|
202
|
-
t.buttonBorderStyle =
|
|
196
|
+
const n = c.querySelector(".es-button-border"), a = c.querySelector("a.es-button"), g = (n == null ? void 0 : n.getAttribute("style")) || "", p = (a == null ? void 0 : a.getAttribute("style")) || "", b = c.getAttribute("align") || "center", d = c.getAttribute("style") || "", f = c.getAttribute("class") || "", C = this.extractStripoClasses(f), y = ((c == null ? void 0 : c.textContent) || "").trim();
|
|
197
|
+
t.buttonBorderStyle = g, t.buttonLinkStyle = p, t.buttonAlign = b, t.buttonTdStyle = d, t.buttonClasses = C, t.buttonText = y;
|
|
203
198
|
}
|
|
204
199
|
return t;
|
|
205
200
|
}
|
|
@@ -245,8 +240,8 @@ class $ {
|
|
|
245
240
|
i && t.oldPriceStyle && i.setAttribute("style", t.oldPriceStyle);
|
|
246
241
|
}), (t.buttonBorderStyle || t.buttonLinkStyle || t.buttonAlign || t.buttonTdStyle || t.buttonClasses) && s.querySelectorAll(".product-button").forEach((r) => {
|
|
247
242
|
if (t.buttonAlign && r.setAttribute("align", t.buttonAlign), t.buttonTdStyle && r.setAttribute("style", t.buttonTdStyle), t.buttonClasses) {
|
|
248
|
-
const
|
|
249
|
-
r.setAttribute("class",
|
|
243
|
+
const n = `${r.getAttribute("class") || ""} ${t.buttonClasses}`.trim();
|
|
244
|
+
r.setAttribute("class", n);
|
|
250
245
|
}
|
|
251
246
|
const i = r.querySelector(".es-button-border");
|
|
252
247
|
i && t.buttonBorderStyle && i.setAttribute("style", t.buttonBorderStyle);
|
|
@@ -275,8 +270,8 @@ class $ {
|
|
|
275
270
|
* Removes specified style properties from a style string
|
|
276
271
|
*/
|
|
277
272
|
removeStyleProperties(e, t) {
|
|
278
|
-
return e ? t.reduce((o,
|
|
279
|
-
const r = new RegExp(`${
|
|
273
|
+
return e ? t.reduce((o, l) => {
|
|
274
|
+
const r = new RegExp(`${l}\\s*:\\s*[^;]*;?`, "gi");
|
|
280
275
|
return o.replace(r, "");
|
|
281
276
|
}, e).replace(/;\s*;/g, ";").replace(/^;|;$/g, "").trim() : "";
|
|
282
277
|
}
|
|
@@ -290,9 +285,9 @@ class $ {
|
|
|
290
285
|
return /display\s*:/i.test(t) || (t = t ? `${t}; display: block` : "display: block"), t.replace(/;\s*;/g, ";").replace(/^;|;$/g, "").replace(/"/g, "'").trim();
|
|
291
286
|
}
|
|
292
287
|
}
|
|
293
|
-
function
|
|
294
|
-
return new
|
|
288
|
+
function k(A) {
|
|
289
|
+
return new w().migrate(A);
|
|
295
290
|
}
|
|
296
291
|
export {
|
|
297
|
-
|
|
292
|
+
k as migrateRecommendation
|
|
298
293
|
};
|
|
@@ -1,19 +1,18 @@
|
|
|
1
|
-
import { useOnboardingStore as
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
class M extends u {
|
|
1
|
+
import { useOnboardingStore as d } from "../../../stores/onboarding.js";
|
|
2
|
+
import { Block as g, BlockCompositionType as f, ModificationDescription as o } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
3
|
+
import { SETTINGS_ENUMS as c, DefaultConfigValues as i } from "./enums/settingsEnums.js";
|
|
4
|
+
import { getDefaultTemplate as p } from "./template.js";
|
|
5
|
+
import { getItemsBlockContainer as u, getItemsBlockConfig as C, getDefaultItemsBlockConfig as I } from "./utils/nodeConfigUtils.js";
|
|
6
|
+
const y = "items-block";
|
|
7
|
+
class B extends g {
|
|
9
8
|
getId() {
|
|
10
|
-
return
|
|
9
|
+
return y;
|
|
11
10
|
}
|
|
12
11
|
getIcon() {
|
|
13
12
|
return "items-icon";
|
|
14
13
|
}
|
|
15
14
|
getBlockCompositionType() {
|
|
16
|
-
return
|
|
15
|
+
return f.CONTAINER;
|
|
17
16
|
}
|
|
18
17
|
getName() {
|
|
19
18
|
return this.api.translate("Items");
|
|
@@ -21,54 +20,35 @@ class M extends u {
|
|
|
21
20
|
getDescription() {
|
|
22
21
|
return this.api.translate("Items lets you display personalized products based on user behavior.");
|
|
23
22
|
}
|
|
24
|
-
getSettingsPanelTitleHtml() {
|
|
25
|
-
if (f().migrations[m] === 0)
|
|
26
|
-
return "";
|
|
27
|
-
const n = this.api.translate("Items"), o = this.api.translate("This block is switched from the Old Version to the New Version. We recommend you check the Items block and test your message to ensure it works properly.");
|
|
28
|
-
return `<div>
|
|
29
|
-
<div style="display: flex; align-items: center;">
|
|
30
|
-
<span>${n}</span>
|
|
31
|
-
</div>
|
|
32
|
-
<div class="items-migration-info">
|
|
33
|
-
<${c.ICON}
|
|
34
|
-
${C.ICON.src}="migration-info-icon"
|
|
35
|
-
class="items-migration-info__icon">
|
|
36
|
-
</${c.ICON}>
|
|
37
|
-
<p class="items-migration-info__text">
|
|
38
|
-
${o}
|
|
39
|
-
</p>
|
|
40
|
-
</div>
|
|
41
|
-
</div>`;
|
|
42
|
-
}
|
|
43
23
|
getTemplate() {
|
|
44
|
-
return
|
|
45
|
-
orientation:
|
|
46
|
-
itemsType:
|
|
24
|
+
return p({
|
|
25
|
+
orientation: c.ORIENTATION.VERTICAL,
|
|
26
|
+
itemsType: c.ITEMS_TYPE.CART_ITEMS,
|
|
47
27
|
itemId: "{{Abandoned Cart Item (1) Url}}",
|
|
48
|
-
currencySymbol:
|
|
49
|
-
currencyLocation:
|
|
50
|
-
formattedPrice:
|
|
28
|
+
currencySymbol: i.productPriceCurrencySymbolControlValue,
|
|
29
|
+
currencyLocation: i.productPriceCurrencyLocationControlValue,
|
|
30
|
+
formattedPrice: i.productPriceFormattedControlValue === "1"
|
|
51
31
|
});
|
|
52
32
|
}
|
|
53
33
|
allowInnerBlocksDND() {
|
|
54
34
|
return !1;
|
|
55
35
|
}
|
|
56
|
-
onCreated(
|
|
57
|
-
const
|
|
58
|
-
|
|
59
|
-
const e =
|
|
36
|
+
onCreated(n) {
|
|
37
|
+
const s = this.api.getDocumentModifier(), r = this.api.getDocumentRootCssNode();
|
|
38
|
+
r.querySelector('[product-attr="imageSrc"] img') || s.modifyCss(r).appendRule('[product-attr="imageSrc"] img {object-fit: contain;}');
|
|
39
|
+
const e = u(n);
|
|
60
40
|
if (!e)
|
|
61
41
|
return;
|
|
62
|
-
const a = e.getNodeConfig(),
|
|
42
|
+
const a = e.getNodeConfig(), l = a && Object.keys(a).length > 0, t = C(n);
|
|
63
43
|
if (t != null && t.initialized)
|
|
64
|
-
|
|
44
|
+
l ? t.blockInstanceId || this.api.getDocumentModifier().modifyHtml(e).setNodeConfig({ ...t, blockInstanceId: String(Date.now()) }).apply(new o("Assign block instance ID to block")) : this.api.getDocumentModifier().modifyHtml(e).setNodeConfig(t).apply(new o("Migrate legacy config to nodeConfig"));
|
|
65
45
|
else {
|
|
66
|
-
const
|
|
67
|
-
this.api.getDocumentModifier().modifyHtml(e).setNodeConfig(
|
|
46
|
+
const m = I();
|
|
47
|
+
this.api.getDocumentModifier().modifyHtml(e).setNodeConfig(m).apply(new o("Initialize Items block with default configuration")), d().startOnboarding("itemsOnboarding");
|
|
68
48
|
}
|
|
69
49
|
}
|
|
70
50
|
}
|
|
71
51
|
export {
|
|
72
|
-
|
|
73
|
-
|
|
52
|
+
y as BLOCK_ID,
|
|
53
|
+
B as ItemsBlock
|
|
74
54
|
};
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { IconsRegistry as o } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
2
|
-
|
|
3
|
-
class s extends o {
|
|
2
|
+
class i extends o {
|
|
4
3
|
registerIconsSvg(t) {
|
|
5
4
|
t["items-icon"] = `
|
|
6
5
|
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
@@ -20,14 +19,14 @@ class s extends o {
|
|
|
20
19
|
</svg>
|
|
21
20
|
`, t["horizontal-orientation"] = `
|
|
22
21
|
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
|
|
23
|
-
<path d="M10 19H4C3.44772 19 3 18.5523 3 18V2C3 1.44772 3.44772 1 4 1H10V19Z" stroke="currentColor"
|
|
22
|
+
<path d="M10 19H4C3.44772 19 3 18.5523 3 18V2C3 1.44772 3.44772 1 4 1H10V19Z" stroke="currentColor"
|
|
24
23
|
stroke-width="2" fill="none"/>
|
|
25
|
-
<path d="M17 2V18C17 18.5523 16.5523 19 16 19H10V1H16C16.5523 1 17 1.44772 17 2Z" stroke="currentColor"
|
|
24
|
+
<path d="M17 2V18C17 18.5523 16.5523 19 16 19H10V1H16C16.5523 1 17 1.44772 17 2Z" stroke="currentColor"
|
|
26
25
|
stroke-width="2" fill="none"/>
|
|
27
26
|
</svg>
|
|
28
|
-
|
|
27
|
+
`;
|
|
29
28
|
}
|
|
30
29
|
}
|
|
31
30
|
export {
|
|
32
|
-
|
|
31
|
+
i as ItemsIconsRegistry
|
|
33
32
|
};
|
|
@@ -17,54 +17,6 @@ const n = `/* Utils */
|
|
|
17
17
|
.container:has(.items-controls-container) {
|
|
18
18
|
padding: 0
|
|
19
19
|
}
|
|
20
|
-
|
|
21
|
-
/* ─── Migration Info Box ─────────────────────────────────────────────── */
|
|
22
|
-
/* Shown in the settings panel title when a block was migrated from legacy */
|
|
23
|
-
|
|
24
|
-
/* Layout variables for positioning the absolutely-placed info box */
|
|
25
|
-
:host {
|
|
26
|
-
--items-migration-padding: 16px;
|
|
27
|
-
--items-migration-title-height: 61px;
|
|
28
|
-
--items-migration-box-height: 98px;
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
/* Push tabs down when info box is present inside the control panel header */
|
|
32
|
-
.control-panel-header:has(.items-migration-info) {
|
|
33
|
-
position: relative;
|
|
34
|
-
margin-bottom: calc(2 * var(--items-migration-padding) + var(--items-migration-box-height));
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
/* Info box container */
|
|
38
|
-
.items-migration-info {
|
|
39
|
-
display: flex;
|
|
40
|
-
align-items: flex-start;
|
|
41
|
-
gap: 8px;
|
|
42
|
-
padding: 12px;
|
|
43
|
-
background: var(--guido-color-background-onpage-message-info);
|
|
44
|
-
border: 1px solid var(--guido-color-border-onpage-message-info);
|
|
45
|
-
border-radius: 4px;
|
|
46
|
-
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.07);
|
|
47
|
-
position: absolute;
|
|
48
|
-
left: var(--items-migration-padding);
|
|
49
|
-
right: var(--items-migration-padding);
|
|
50
|
-
top: calc(var(--items-migration-padding) + var(--items-migration-title-height));
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
/* Icon — 18x19 icon inside a 24x24 bounding box (matches Figma) */
|
|
54
|
-
.items-migration-info__icon {
|
|
55
|
-
flex-shrink: 0;
|
|
56
|
-
width: 24px;
|
|
57
|
-
height: 24px;
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
/* Text content */
|
|
61
|
-
.items-migration-info__text {
|
|
62
|
-
margin: 4px 0;
|
|
63
|
-
white-space: normal;
|
|
64
|
-
font-size: 13px;
|
|
65
|
-
font-weight: 400;
|
|
66
|
-
line-height: 16px;
|
|
67
|
-
}
|
|
68
20
|
`;
|
|
69
21
|
export {
|
|
70
22
|
n as default
|
|
@@ -1,14 +1,13 @@
|
|
|
1
|
-
var
|
|
2
|
-
var
|
|
3
|
-
var g = (r, o, t) =>
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import { ensureMobileCssRulesExist as u } from "./controls/mobileLayout/cssRules.js";
|
|
1
|
+
var p = Object.defineProperty;
|
|
2
|
+
var f = (r, o, t) => o in r ? p(r, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[o] = t;
|
|
3
|
+
var g = (r, o, t) => f(r, typeof o != "symbol" ? o + "" : o, t);
|
|
4
|
+
import { Block as h, BlockCompositionType as I, ModificationDescription as _ } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
5
|
+
import { ensureMobileCssRulesExist as d } from "./controls/mobileLayout/cssRules.js";
|
|
7
6
|
import { RecommendationConfigService as s } from "./services/configService.js";
|
|
8
|
-
import { useRecommendationExtensionStore as
|
|
9
|
-
import { getDefaultTemplate as
|
|
10
|
-
const
|
|
11
|
-
class
|
|
7
|
+
import { useRecommendationExtensionStore as u } from "./store/recommendation.js";
|
|
8
|
+
import { getDefaultTemplate as k } from "./templates/grid/template.js";
|
|
9
|
+
const B = "recommendation-block", c = "recommendation-block-v2", a = "recommendation-id";
|
|
10
|
+
class y extends h {
|
|
12
11
|
constructor() {
|
|
13
12
|
super();
|
|
14
13
|
/**
|
|
@@ -18,13 +17,13 @@ class E extends _ {
|
|
|
18
17
|
g(this, "_pendingBlockId", null);
|
|
19
18
|
}
|
|
20
19
|
getId() {
|
|
21
|
-
return
|
|
20
|
+
return B;
|
|
22
21
|
}
|
|
23
22
|
getIcon() {
|
|
24
23
|
return "recommendation-icon";
|
|
25
24
|
}
|
|
26
25
|
getBlockCompositionType() {
|
|
27
|
-
return
|
|
26
|
+
return I.CONTAINER;
|
|
28
27
|
}
|
|
29
28
|
getName() {
|
|
30
29
|
return this.api.translate("Recommendation Block");
|
|
@@ -32,25 +31,6 @@ class E extends _ {
|
|
|
32
31
|
getDescription() {
|
|
33
32
|
return this.api.translate("Recommendation Block Title Description");
|
|
34
33
|
}
|
|
35
|
-
getSettingsPanelTitleHtml() {
|
|
36
|
-
if (k().migrations[f] === 0)
|
|
37
|
-
return "";
|
|
38
|
-
const e = this.api.translate("Recommendation Block"), i = this.api.translate("This block is switched from the Old Version to the New Version. We recommend you check the Recommendation block and test your message to ensure it works properly.");
|
|
39
|
-
return `<div>
|
|
40
|
-
<div style="display: flex; align-items: center;">
|
|
41
|
-
<span>${e}</span>
|
|
42
|
-
</div>
|
|
43
|
-
<div class="recommendation-migration-info">
|
|
44
|
-
<${d.ICON}
|
|
45
|
-
${C.ICON.src}="migration-info-icon"
|
|
46
|
-
class="recommendation-migration-info__icon">
|
|
47
|
-
</${d.ICON}>
|
|
48
|
-
<p class="recommendation-migration-info__text">
|
|
49
|
-
${i}
|
|
50
|
-
</p>
|
|
51
|
-
</div>
|
|
52
|
-
</div>`;
|
|
53
|
-
}
|
|
54
34
|
/**
|
|
55
35
|
* Returns the template HTML for a new recommendation block.
|
|
56
36
|
* Generates a unique recommendation ID and embeds the instance class
|
|
@@ -60,7 +40,7 @@ class E extends _ {
|
|
|
60
40
|
*/
|
|
61
41
|
getTemplate() {
|
|
62
42
|
const t = this._generateNextId();
|
|
63
|
-
return this._pendingBlockId = t,
|
|
43
|
+
return this._pendingBlockId = t, k(t);
|
|
64
44
|
}
|
|
65
45
|
/**
|
|
66
46
|
* Called when a new block is dropped into the template
|
|
@@ -72,8 +52,8 @@ class E extends _ {
|
|
|
72
52
|
onCreated(t) {
|
|
73
53
|
const e = this._pendingBlockId ?? this._generateNextId();
|
|
74
54
|
this._pendingBlockId = null, this._assignRecommendationId(t, e);
|
|
75
|
-
const
|
|
76
|
-
|
|
55
|
+
const n = s.initializeConfig(this.api, t, { recommendationId: e }), i = u();
|
|
56
|
+
i.setCurrentBlock(e), d(this.api), i.patchCurrentBlockConfig({ language: n.language }, { triggerRefetch: !1 });
|
|
77
57
|
}
|
|
78
58
|
/**
|
|
79
59
|
* Called when the document changes or template is loaded
|
|
@@ -93,7 +73,7 @@ class E extends _ {
|
|
|
93
73
|
"Assign recommendation ID to legacy block"
|
|
94
74
|
);
|
|
95
75
|
}
|
|
96
|
-
s.needsMigration(t) && this._migrateFromLegacy(t),
|
|
76
|
+
s.needsMigration(t) && this._migrateFromLegacy(t), d(this.api);
|
|
97
77
|
}
|
|
98
78
|
}
|
|
99
79
|
/**
|
|
@@ -104,7 +84,7 @@ class E extends _ {
|
|
|
104
84
|
*/
|
|
105
85
|
onDelete(t) {
|
|
106
86
|
const e = this._getRecommendationId(t);
|
|
107
|
-
e &&
|
|
87
|
+
e && u().removeBlockState(e);
|
|
108
88
|
}
|
|
109
89
|
/**
|
|
110
90
|
* Generates the next unique recommendation ID by scanning all existing blocks
|
|
@@ -114,9 +94,9 @@ class E extends _ {
|
|
|
114
94
|
let t = 0;
|
|
115
95
|
try {
|
|
116
96
|
const e = this.api.getDocumentRoot();
|
|
117
|
-
e && "querySelectorAll" in e && e.querySelectorAll(`.${c}`).forEach((
|
|
118
|
-
if ("getAttribute" in
|
|
119
|
-
const m =
|
|
97
|
+
e && "querySelectorAll" in e && e.querySelectorAll(`.${c}`).forEach((i) => {
|
|
98
|
+
if ("getAttribute" in i) {
|
|
99
|
+
const m = i.getAttribute(a), l = m ? parseInt(m) : 0;
|
|
120
100
|
l > t && (t = l);
|
|
121
101
|
}
|
|
122
102
|
});
|
|
@@ -131,11 +111,11 @@ class E extends _ {
|
|
|
131
111
|
* added classes via setAttribute.
|
|
132
112
|
*/
|
|
133
113
|
_assignRecommendationId(t, e) {
|
|
134
|
-
const
|
|
135
|
-
if (!
|
|
114
|
+
const n = this._getBlockElement(t);
|
|
115
|
+
if (!n)
|
|
136
116
|
return;
|
|
137
|
-
const
|
|
138
|
-
|
|
117
|
+
const i = this.api.getDocumentModifier();
|
|
118
|
+
i.modifyHtml(n).setAttribute(a, e.toString()), i.apply(new _(`Assign recommendation ID ${e}`));
|
|
139
119
|
}
|
|
140
120
|
/**
|
|
141
121
|
* Gets the recommendation-id from a block node
|
|
@@ -144,11 +124,11 @@ class E extends _ {
|
|
|
144
124
|
const e = this._getBlockElement(t);
|
|
145
125
|
if (!e || !("getAttribute" in e))
|
|
146
126
|
return null;
|
|
147
|
-
const
|
|
148
|
-
if (!
|
|
127
|
+
const n = e.getAttribute(a);
|
|
128
|
+
if (!n)
|
|
149
129
|
return null;
|
|
150
|
-
const
|
|
151
|
-
return Number.isNaN(
|
|
130
|
+
const i = parseInt(n);
|
|
131
|
+
return Number.isNaN(i) ? null : i;
|
|
152
132
|
}
|
|
153
133
|
/**
|
|
154
134
|
* Gets the block element (the element with BLOCK_CLASS)
|
|
@@ -169,6 +149,6 @@ class E extends _ {
|
|
|
169
149
|
}
|
|
170
150
|
}
|
|
171
151
|
export {
|
|
172
|
-
|
|
173
|
-
|
|
152
|
+
B as BLOCK_ID,
|
|
153
|
+
y as RecommendationBlock
|
|
174
154
|
};
|
|
@@ -1,66 +1,69 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { ATTR_PRODUCT_IMAGE as
|
|
3
|
-
const
|
|
1
|
+
import { DEFAULT_MOBILE_ROW_SPACING as U, DEFAULT_MOBILE_COLUMN_SPACING as R, DEFAULT_ROW_SPACING as n, DEFAULT_COLUMN_SPACING as O, DEFAULT_MOBILE_CARDS_IN_ROW as C, DEFAULT_CARDS_IN_ROW as D } from "./layout.js";
|
|
2
|
+
import { ATTR_PRODUCT_IMAGE as _, ATTR_PRODUCT_NAME as o, ATTR_PRODUCT_OLD_PRICE as t, ATTR_PRODUCT_PRICE as e, ATTR_PRODUCT_OMNIBUS_PRICE as T, ATTR_PRODUCT_OMNIBUS_DISCOUNT as I, ATTR_PRODUCT_BUTTON as r } from "./selectors.js";
|
|
3
|
+
const i = {
|
|
4
4
|
code: "USD",
|
|
5
5
|
symbol: "USD",
|
|
6
6
|
alignment: "after",
|
|
7
7
|
decimalCount: 2,
|
|
8
8
|
decimalSeparator: ".",
|
|
9
9
|
thousandSeparator: ","
|
|
10
|
-
},
|
|
10
|
+
}, A = {
|
|
11
11
|
textBefore: "",
|
|
12
12
|
textAfter: ""
|
|
13
|
-
},
|
|
13
|
+
}, s = {
|
|
14
14
|
textBefore: "",
|
|
15
15
|
textAfter: ""
|
|
16
|
-
},
|
|
16
|
+
}, E = [
|
|
17
|
+
_,
|
|
18
|
+
o,
|
|
17
19
|
t,
|
|
18
20
|
e,
|
|
19
|
-
o,
|
|
20
|
-
_,
|
|
21
21
|
T,
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
],
|
|
25
|
-
[t]: !0,
|
|
26
|
-
[e]: !0,
|
|
22
|
+
I,
|
|
23
|
+
r
|
|
24
|
+
], c = {
|
|
27
25
|
[_]: !0,
|
|
28
26
|
[o]: !0,
|
|
27
|
+
[e]: !0,
|
|
28
|
+
[t]: !0,
|
|
29
29
|
[T]: !1,
|
|
30
|
-
[
|
|
31
|
-
[
|
|
32
|
-
},
|
|
30
|
+
[I]: !1,
|
|
31
|
+
[r]: !0
|
|
32
|
+
}, N = {
|
|
33
33
|
// Settings
|
|
34
34
|
strategy: "mostPopular",
|
|
35
35
|
productIds: [],
|
|
36
36
|
size: "6",
|
|
37
37
|
shuffleProducts: !1,
|
|
38
38
|
language: "en_US",
|
|
39
|
-
currency:
|
|
39
|
+
currency: i,
|
|
40
40
|
filters: [],
|
|
41
41
|
// Layout
|
|
42
42
|
layout: "grid",
|
|
43
|
-
cardsInRow:
|
|
44
|
-
mobileCardsInRow:
|
|
45
|
-
columnSpacing:
|
|
46
|
-
rowSpacing:
|
|
43
|
+
cardsInRow: D,
|
|
44
|
+
mobileCardsInRow: C,
|
|
45
|
+
columnSpacing: O,
|
|
46
|
+
rowSpacing: n,
|
|
47
|
+
mobileColumnSpacing: R,
|
|
48
|
+
mobileRowSpacing: U,
|
|
47
49
|
// Composition
|
|
48
|
-
composition:
|
|
49
|
-
visibility:
|
|
50
|
+
composition: E,
|
|
51
|
+
visibility: c,
|
|
50
52
|
// Element settings
|
|
51
|
-
omnibusPrice:
|
|
52
|
-
omnibusDiscount:
|
|
53
|
+
omnibusPrice: A,
|
|
54
|
+
omnibusDiscount: s,
|
|
53
55
|
textTrimming: !1,
|
|
54
56
|
// Meta
|
|
55
57
|
configVersion: 1,
|
|
56
58
|
recommendationId: 0
|
|
57
|
-
},
|
|
59
|
+
}, m = [11, 12], L = 1;
|
|
58
60
|
export {
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
61
|
+
L as CURRENT_CONFIG_VERSION,
|
|
62
|
+
E as DEFAULT_COMPOSITION,
|
|
63
|
+
i as DEFAULT_CURRENCY,
|
|
64
|
+
N as DEFAULT_NODE_CONFIG,
|
|
65
|
+
s as DEFAULT_OMNIBUS_DISCOUNT,
|
|
66
|
+
A as DEFAULT_OMNIBUS_PRICE,
|
|
67
|
+
c as DEFAULT_VISIBILITY,
|
|
68
|
+
m as EXCLUDED_ALGORITHM_IDS
|
|
66
69
|
};
|