@useinsider/guido 3.7.0-beta.b2980d8 → 3.7.0-beta.ec4dd67
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/composables/useHtmlValidator.js +165 -118
- package/dist/config/compiler/utils/recommendationCompilerUtils.js +28 -27
- package/dist/config/compiler/utils/recommendationIgnoreUtils.js +15 -0
- package/dist/config/migrator/recommendation/extractors.js +44 -22
- package/dist/config/migrator/recommendation/htmlBuilder.js +175 -169
- package/dist/config/migrator/recommendationMigrator.js +30 -31
- package/dist/extensions/Blocks/Recommendation/constants/selectors.js +21 -15
- package/dist/extensions/Blocks/Recommendation/controls/cardComposition/index.js +55 -41
- package/dist/extensions/Blocks/Recommendation/controls/main/index.js +39 -38
- package/dist/extensions/Blocks/Recommendation/controls/main/layoutOrientation.js +44 -33
- package/dist/extensions/Blocks/Recommendation/controls/main/productCount.js +3 -2
- package/dist/extensions/Blocks/Recommendation/controls/main/productLayout.js +62 -52
- package/dist/extensions/Blocks/Recommendation/controls/main/utils.js +75 -68
- package/dist/extensions/Blocks/Recommendation/controls/syncInfoMessage.js +7 -6
- package/dist/extensions/Blocks/Recommendation/extension.js +6 -5
- package/dist/extensions/Blocks/Recommendation/settingsPanel.js +3 -2
- package/dist/extensions/Blocks/Recommendation/store/recommendation.js +3 -2
- package/dist/extensions/Blocks/Recommendation/templates/grid/template.js +13 -12
- package/dist/extensions/Blocks/Recommendation/templates/index.js +5 -4
- package/dist/extensions/Blocks/Unsubscribe/block.js +72 -122
- package/dist/extensions/Blocks/Unsubscribe/template.js +4 -4
- package/dist/src/composables/useHtmlValidator.d.ts +27 -0
- package/dist/src/composables/useHtmlValidator.test.d.ts +1 -0
- package/dist/src/config/compiler/utils/recommendationIgnoreUtils.d.ts +17 -0
- package/dist/src/config/compiler/utils/recommendationIgnoreUtils.test.d.ts +1 -0
- package/dist/src/config/migrator/recommendation/extractors.d.ts +15 -0
- package/dist/src/config/migrator/recommendation/htmlBuilder.d.ts +8 -0
- package/dist/src/extensions/Blocks/Recommendation/constants/index.d.ts +1 -1
- package/dist/src/extensions/Blocks/Recommendation/constants/selectors.d.ts +21 -0
- package/dist/src/extensions/Blocks/Recommendation/controls/cardComposition/index.d.ts +7 -0
- package/dist/src/extensions/Blocks/Recommendation/controls/main/layoutOrientation.d.ts +5 -0
- package/dist/src/extensions/Blocks/Recommendation/controls/main/productLayout.d.ts +6 -0
- package/dist/src/extensions/Blocks/Recommendation/controls/main/utils.d.ts +9 -0
- package/dist/src/extensions/Blocks/Unsubscribe/block.d.ts +0 -9
- package/package.json +1 -1
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { BlockId as f } from "../../enums/block.js";
|
|
2
|
-
import { useTemplateStore as
|
|
3
|
-
import { mapComposition as
|
|
4
|
-
import { extractTitleText as
|
|
5
|
-
import { buildBlockHtml as
|
|
6
|
-
import { parseRecommendationId as
|
|
7
|
-
import { mapSettings as
|
|
2
|
+
import { useTemplateStore as b } from "../../stores/template.js";
|
|
3
|
+
import { mapComposition as y } from "./recommendation/compositionMapper.js";
|
|
4
|
+
import { extractCurrencyFromBlock as v, extractTitleText as C, extractCardBgColor as M, isPartnerManagedBlock as S } from "./recommendation/extractors.js";
|
|
5
|
+
import { buildBlockHtml as w } from "./recommendation/htmlBuilder.js";
|
|
6
|
+
import { parseRecommendationId as x, parseLegacyConfig as R } from "./recommendation/parseLegacyConfig.js";
|
|
7
|
+
import { mapSettings as T } from "./recommendation/settingsMapper.js";
|
|
8
8
|
const h = 'td[esd-dev-product-config][class*="ins-recommendation-v3-block-"]:not(.recommendation-block-v2), td.product-block[esd-handler-name*="EmailRecommendationV3"][esd-dev-product-config]:not(.recommendation-block-v2)';
|
|
9
|
-
function
|
|
10
|
-
var
|
|
11
|
-
const o =
|
|
9
|
+
function B(i, t, a) {
|
|
10
|
+
var d;
|
|
11
|
+
const o = x(t);
|
|
12
12
|
if (o === null)
|
|
13
13
|
return console.warn(
|
|
14
14
|
"[RecommendationMigrator] Skipping block — missing/invalid `ins-recommendation-v3-campaign-id`"
|
|
@@ -18,30 +18,29 @@ function x(i, t, c) {
|
|
|
18
18
|
return console.warn(
|
|
19
19
|
`[RecommendationMigrator] Aborting block id=${o} — \`esd-dev-product-config\` missing or unable to be parsed`
|
|
20
20
|
), !1;
|
|
21
|
-
const n =
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
), !1;
|
|
26
|
-
const a = S(n, r, o), e = b((s = r.composition) == null ? void 0 : s.variables), d = y(t), l = C(t), g = {
|
|
27
|
-
...a,
|
|
21
|
+
const n = a[String(o)] ?? {
|
|
22
|
+
currencySettings: v(t)
|
|
23
|
+
}, c = T(n, r, o), e = y((d = r.composition) == null ? void 0 : d.variables), l = C(t), g = M(t), p = {
|
|
24
|
+
...c,
|
|
28
25
|
composition: e.composition,
|
|
29
26
|
visibility: e.visibility,
|
|
30
27
|
textTrimming: e.anyTextTrimming
|
|
31
|
-
},
|
|
28
|
+
}, m = S(t), u = `
|
|
32
29
|
<table>
|
|
33
30
|
<tbody>
|
|
34
31
|
<tr>
|
|
35
32
|
<td class="esd-structure" align="left">
|
|
36
33
|
<table width="100%" cellpadding="0" cellspacing="0">
|
|
37
34
|
<tbody>
|
|
38
|
-
<tr>${
|
|
39
|
-
nodeConfig:
|
|
35
|
+
<tr>${w({
|
|
36
|
+
nodeConfig: p,
|
|
40
37
|
composition: e,
|
|
41
|
-
cardBg:
|
|
42
|
-
titleText:
|
|
38
|
+
cardBg: g,
|
|
39
|
+
titleText: l,
|
|
43
40
|
legacyId: t.getAttribute("id") ?? void 0,
|
|
44
|
-
legacyBgColor: t.getAttribute("bgcolor") ?? void 0
|
|
41
|
+
legacyBgColor: t.getAttribute("bgcolor") ?? void 0,
|
|
42
|
+
preserveInnerHtml: m ? t.innerHTML : void 0,
|
|
43
|
+
skipCompile: m
|
|
45
44
|
})}</tr>
|
|
46
45
|
</tbody>
|
|
47
46
|
</table>
|
|
@@ -49,15 +48,15 @@ function x(i, t, c) {
|
|
|
49
48
|
</tr>
|
|
50
49
|
</tbody>
|
|
51
50
|
</table>
|
|
52
|
-
`,
|
|
53
|
-
return !
|
|
51
|
+
`, s = i.parseFromString(u, "text/html").querySelector("td.esd-structure");
|
|
52
|
+
return !s || !t.parentNode ? (console.warn(
|
|
54
53
|
`[RecommendationMigrator] Aborting block id=${o} — failed to construct new HTML element`
|
|
55
|
-
), !1) : (t.parentNode.replaceChild(
|
|
54
|
+
), !1) : (t.parentNode.replaceChild(s, t), !0);
|
|
56
55
|
}
|
|
57
|
-
function
|
|
58
|
-
const
|
|
56
|
+
function q(i, t = {}) {
|
|
57
|
+
const a = new DOMParser(), o = a.parseFromString(i, "text/html"), r = Array.from(o.querySelectorAll(h));
|
|
59
58
|
try {
|
|
60
|
-
|
|
59
|
+
b().$patch((e) => {
|
|
61
60
|
e.migrations = {
|
|
62
61
|
...e.migrations,
|
|
63
62
|
[f.Recommendation]: r.length
|
|
@@ -68,14 +67,14 @@ function I(i, t = {}) {
|
|
|
68
67
|
if (r.length === 0)
|
|
69
68
|
return i;
|
|
70
69
|
let n = 0;
|
|
71
|
-
return r.forEach((
|
|
70
|
+
return r.forEach((c) => {
|
|
72
71
|
try {
|
|
73
|
-
|
|
72
|
+
B(a, c, t) && (n += 1);
|
|
74
73
|
} catch (e) {
|
|
75
74
|
console.error("[RecommendationMigrator] Unexpected error migrating block:", e);
|
|
76
75
|
}
|
|
77
76
|
}), n > 0 && console.info(`[RecommendationMigrator] Migrated ${n} legacy Recommendation block(s)`), o.documentElement.outerHTML;
|
|
78
77
|
}
|
|
79
78
|
export {
|
|
80
|
-
|
|
79
|
+
q as migrateRecommendation
|
|
81
80
|
};
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
const T = ".recommendation-block-v2",
|
|
1
|
+
const T = ".recommendation-block-v2", n = ".ins-recommendation-product-container", o = ".ins-recommendation-desktop-container", t = ".ins-recommendation-mobile-container", _ = ".ins-recommendation-mobile-row", r = "reco-v3-button", R = "ins-skip-compile", e = {
|
|
2
2
|
CURRENCY: "currency",
|
|
3
3
|
SYMBOL: "currency-symbol",
|
|
4
4
|
ALIGNMENT: "currency-alignment",
|
|
5
5
|
THOUSAND_SEPARATOR: "currency-thousand-separator",
|
|
6
6
|
DECIMAL_SEPARATOR: "currency-decimal-separator",
|
|
7
7
|
DECIMAL_COUNT: "currency-decimal-count"
|
|
8
|
-
},
|
|
8
|
+
}, O = "productImage", s = "productName", E = "productPrice", i = "productOldPrice", A = "productOmnibusPrice", C = "productOmnibusDiscount", u = "productButton", S = "customAttr:", I = "data-custom-attributes", m = "product-attr", c = /* @__PURE__ */ new Set([
|
|
9
9
|
"name",
|
|
10
10
|
// productName
|
|
11
11
|
"price",
|
|
@@ -20,24 +20,30 @@ const T = ".recommendation-block-v2", c = ".ins-recommendation-product-container
|
|
|
20
20
|
// productOmnibusPrice
|
|
21
21
|
"omnibus_discount"
|
|
22
22
|
// productOmnibusDiscount
|
|
23
|
+
]), a = /* @__PURE__ */ new Set([
|
|
24
|
+
...c,
|
|
25
|
+
"currency",
|
|
26
|
+
"discount"
|
|
23
27
|
]);
|
|
24
28
|
export {
|
|
25
|
-
|
|
26
|
-
|
|
29
|
+
S as ATTR_CUSTOM_PREFIX,
|
|
30
|
+
I as ATTR_DATA_CUSTOM_ATTRIBUTES,
|
|
27
31
|
m as ATTR_PRODUCT_ATTR,
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
+
u as ATTR_PRODUCT_BUTTON,
|
|
33
|
+
O as ATTR_PRODUCT_IMAGE,
|
|
34
|
+
s as ATTR_PRODUCT_NAME,
|
|
35
|
+
i as ATTR_PRODUCT_OLD_PRICE,
|
|
32
36
|
C as ATTR_PRODUCT_OMNIBUS_DISCOUNT,
|
|
33
|
-
|
|
34
|
-
|
|
37
|
+
A as ATTR_PRODUCT_OMNIBUS_PRICE,
|
|
38
|
+
E as ATTR_PRODUCT_PRICE,
|
|
35
39
|
T as BLOCK_ROOT_SELECTOR,
|
|
36
|
-
|
|
37
|
-
|
|
40
|
+
c as BUILT_IN_DEFAULT_ATTRIBUTES,
|
|
41
|
+
n as CONTAINER_SELECTOR,
|
|
38
42
|
r as CSS_CLASS_RECO_BUTTON,
|
|
39
|
-
|
|
43
|
+
R as CSS_CLASS_SKIP_COMPILE,
|
|
44
|
+
e as CURRENCY_ATTR,
|
|
40
45
|
o as DESKTOP_CONTAINER_SELECTOR,
|
|
41
|
-
|
|
42
|
-
|
|
46
|
+
t as MOBILE_CONTAINER_SELECTOR,
|
|
47
|
+
_ as MOBILE_ROW_SELECTOR,
|
|
48
|
+
a as RECOMMENDATION_VARIABLE_BUILTIN_ATTRIBUTES
|
|
43
49
|
};
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
var J = Object.defineProperty;
|
|
2
2
|
var Q = (p, _, t) => _ in p ? J(p, _, { enumerable: !0, configurable: !0, writable: !0, value: t }) : p[_] = t;
|
|
3
|
-
var
|
|
3
|
+
var T = (p, _, t) => Q(p, typeof _ != "symbol" ? _ + "" : _, t);
|
|
4
4
|
import { UIElementType as f, UEAttr as I, ModificationDescription as A } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
5
5
|
import { CommonControl as Z } from "../../../common-control.js";
|
|
6
|
-
import { ATTR_PRODUCT_IMAGE as
|
|
6
|
+
import { ATTR_PRODUCT_IMAGE as L, ATTR_PRODUCT_NAME as tt, ATTR_PRODUCT_PRICE as et, ATTR_PRODUCT_OLD_PRICE as rt, ATTR_PRODUCT_OMNIBUS_PRICE as ot, ATTR_PRODUCT_OMNIBUS_DISCOUNT as st, ATTR_PRODUCT_BUTTON as B, ATTR_DATA_CUSTOM_ATTRIBUTES as q, ATTR_CUSTOM_PREFIX as m, BUILT_IN_DEFAULT_ATTRIBUTES as it } from "../../constants/selectors.js";
|
|
7
7
|
import { DEFAULT_COMPOSITION as P, DEFAULT_VISIBILITY as F } from "../../constants/defaultConfig.js";
|
|
8
8
|
import { RecommendationConfigService as nt } from "../../services/configService.js";
|
|
9
9
|
import { useRecommendationExtensionStore as lt } from "../../store/recommendation.js";
|
|
@@ -11,32 +11,32 @@ import { ATTRIBUTE_CELL_CLASS as at, gridElementRenderer as ct, DEFAULT_CELL_PAD
|
|
|
11
11
|
import { listElementRenderer as mt } from "../../templates/list/elementRenderer.js";
|
|
12
12
|
import { toDisplayName as ht, isDefaultAttribute as pt, toDisplayableAttributeValue as _t, buildElementRenderer as w } from "../../templates/utils.js";
|
|
13
13
|
import { getTableDisplayValue as ft } from "../../utils/tagName.js";
|
|
14
|
-
import {
|
|
15
|
-
const
|
|
14
|
+
import { isPartnerManagedBlock as gt, getCurrentLayout as bt } from "../main/utils.js";
|
|
15
|
+
const yt = "ui-elements-recommendation-card-composition", S = ".recommendation-attribute-row", N = ".product-card-wrapper > tbody", M = ".product-info-cell > table > tbody", V = "data-card-composition", y = "data-attribute-type", v = "data-visibility", x = {
|
|
16
16
|
ADD_ATTRIBUTE: "addAttribute"
|
|
17
17
|
}, g = 5, E = "reorderIcon_", h = [
|
|
18
|
-
{ key:
|
|
18
|
+
{ key: L, label: "Product Image" },
|
|
19
19
|
{ key: tt, label: "Product Name" },
|
|
20
20
|
{ key: et, label: "Product Price" },
|
|
21
21
|
{ key: rt, label: "Product Original Price" },
|
|
22
22
|
{ key: ot, label: "Omnibus Price" },
|
|
23
23
|
{ key: st, label: "Omnibus Discount" },
|
|
24
|
-
{ key:
|
|
25
|
-
],
|
|
24
|
+
{ key: B, label: "Product Button" }
|
|
25
|
+
], At = new Set(h.map((p) => p.key)), C = "customAttr_", R = "deleteAttr_";
|
|
26
26
|
class Ut extends Z {
|
|
27
27
|
constructor() {
|
|
28
28
|
super(...arguments);
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
29
|
+
T(this, "store", lt());
|
|
30
|
+
T(this, "unsubscribeStore", null);
|
|
31
|
+
T(this, "eventController", null);
|
|
32
32
|
/**
|
|
33
33
|
* Guard flag: when true, onTemplateNodeUpdated skips _initializeComposition.
|
|
34
34
|
* Used during _onReorder to prevent multiple intermediate rebuilds.
|
|
35
35
|
*/
|
|
36
|
-
|
|
36
|
+
T(this, "reorderInProgress", !1);
|
|
37
37
|
}
|
|
38
38
|
getId() {
|
|
39
|
-
return
|
|
39
|
+
return yt;
|
|
40
40
|
}
|
|
41
41
|
// ========================================================================
|
|
42
42
|
// Lifecycle
|
|
@@ -49,9 +49,9 @@ class Ut extends Z {
|
|
|
49
49
|
`).join(""), r = Array.from(
|
|
50
50
|
{ length: g },
|
|
51
51
|
(l, u) => `
|
|
52
|
-
<div data-custom-select-key="${
|
|
52
|
+
<div data-custom-select-key="${C}${u}" style="display: none;">
|
|
53
53
|
${this._GuSelect({
|
|
54
|
-
name: `${
|
|
54
|
+
name: `${C}${u}`,
|
|
55
55
|
placeholder: this.api.translate("Select Attribute"),
|
|
56
56
|
options: []
|
|
57
57
|
})}
|
|
@@ -128,10 +128,24 @@ class Ut extends Z {
|
|
|
128
128
|
`;
|
|
129
129
|
}
|
|
130
130
|
onRender() {
|
|
131
|
-
this._initializeComposition(), this._registerValueChangeListeners(), this._setupEventListeners(), this._updateOrderableState(), this._subscribeToStoreChanges();
|
|
131
|
+
this._initializeComposition(), this._registerValueChangeListeners(), this._setupEventListeners(), this._updateOrderableState(), this._subscribeToStoreChanges(), this._syncDisabledState();
|
|
132
|
+
}
|
|
133
|
+
/**
|
|
134
|
+
* Card composition restructures the block (toggles/reorders/adds attribute
|
|
135
|
+
* cells), which would corrupt a partner-managed (`ins-skip-compile`) block's
|
|
136
|
+
* preserved markup. There is no native tab-disable API, so the whole control
|
|
137
|
+
* container is rendered inert (greyed + non-interactive) instead.
|
|
138
|
+
*/
|
|
139
|
+
_syncDisabledState() {
|
|
140
|
+
var e;
|
|
141
|
+
const t = (e = this.getContainer()) == null ? void 0 : e.querySelector("[data-card-composition-control]");
|
|
142
|
+
if (!t)
|
|
143
|
+
return;
|
|
144
|
+
const r = gt(this.currentNode);
|
|
145
|
+
t.style.pointerEvents = r ? "none" : "", t.style.opacity = r ? "0.5" : "";
|
|
132
146
|
}
|
|
133
147
|
onTemplateNodeUpdated(t) {
|
|
134
|
-
super.onTemplateNodeUpdated(t), !this.reorderInProgress && (this._initializeComposition(), this._updateOrderableState());
|
|
148
|
+
super.onTemplateNodeUpdated(t), !this.reorderInProgress && (this._initializeComposition(), this._updateOrderableState(), this._syncDisabledState());
|
|
135
149
|
}
|
|
136
150
|
onDestroy() {
|
|
137
151
|
super.onDestroy(), this.eventController && (this.eventController.abort(), this.eventController = null), this.unsubscribeStore && (this.unsubscribeStore(), this.unsubscribeStore = null);
|
|
@@ -150,7 +164,7 @@ class Ut extends Z {
|
|
|
150
164
|
});
|
|
151
165
|
});
|
|
152
166
|
for (let t = 0; t < g; t++) {
|
|
153
|
-
const r = `${
|
|
167
|
+
const r = `${C}${t}`, e = t;
|
|
154
168
|
this.api.onValueChanged(r, (o) => {
|
|
155
169
|
this._onCustomAttributeChanged(e, o);
|
|
156
170
|
});
|
|
@@ -180,7 +194,7 @@ class Ut extends Z {
|
|
|
180
194
|
_readVisibilityFromRows() {
|
|
181
195
|
if (!this.currentNode)
|
|
182
196
|
return this._getDefaultVisibilities();
|
|
183
|
-
const t = Array.from(this.currentNode.querySelectorAll(
|
|
197
|
+
const t = Array.from(this.currentNode.querySelectorAll(S)), r = this._extractVisibilityFromRows(t);
|
|
184
198
|
return this._mergeWithDefaults(r);
|
|
185
199
|
}
|
|
186
200
|
_getDefaultVisibilities() {
|
|
@@ -224,7 +238,7 @@ class Ut extends Z {
|
|
|
224
238
|
const s = new Set(r);
|
|
225
239
|
let i = 0, n = 0;
|
|
226
240
|
const a = t.map((c) => {
|
|
227
|
-
if (
|
|
241
|
+
if (At.has(c)) {
|
|
228
242
|
const l = h.find((u) => u.key === c);
|
|
229
243
|
return this._createBuiltInItemHtml(l, n++);
|
|
230
244
|
}
|
|
@@ -315,7 +329,7 @@ class Ut extends Z {
|
|
|
315
329
|
_initializeCustomSelects(t) {
|
|
316
330
|
t.length !== 0 && setTimeout(() => {
|
|
317
331
|
t.forEach((r, e) => {
|
|
318
|
-
const o = `${
|
|
332
|
+
const o = `${C}${e}`, s = this._getSelectOptions(r, t);
|
|
319
333
|
this.api.setUIEAttribute(o, I.SELECTPICKER.items, s), this.api.updateValues({ [o]: r });
|
|
320
334
|
});
|
|
321
335
|
}, 0);
|
|
@@ -339,7 +353,7 @@ class Ut extends Z {
|
|
|
339
353
|
*/
|
|
340
354
|
_moveSelectsIntoItems(t, r) {
|
|
341
355
|
for (let e = 0; e < r; e++) {
|
|
342
|
-
const o = `${
|
|
356
|
+
const o = `${C}${e}`, s = t.querySelector(`[data-custom-select-key="${o}"]`), i = t.querySelector(`[data-custom-select-slot="${e}"]`);
|
|
343
357
|
if (s && i) {
|
|
344
358
|
const n = s.querySelector("ue-select");
|
|
345
359
|
n && i.appendChild(n);
|
|
@@ -367,7 +381,7 @@ class Ut extends Z {
|
|
|
367
381
|
*/
|
|
368
382
|
_rescueSelectsToStore(t) {
|
|
369
383
|
for (let r = 0; r < g; r++) {
|
|
370
|
-
const e = `${
|
|
384
|
+
const e = `${C}${r}`, o = t.querySelector(`[data-custom-select-key="${e}"]`), s = t.querySelector(`[data-custom-select-slot="${r}"]`);
|
|
371
385
|
if (s) {
|
|
372
386
|
const i = s.querySelector("ue-select");
|
|
373
387
|
i && o && o.appendChild(i);
|
|
@@ -525,18 +539,18 @@ class Ut extends Z {
|
|
|
525
539
|
this._getCurrentLayout() === "grid" ? this._injectGridAttributeRow(t, r, e, o) : this._injectListAttributeRow(t, r, e, o);
|
|
526
540
|
}
|
|
527
541
|
_injectGridAttributeRow(t, r, e, o) {
|
|
528
|
-
const s = this.currentNode.querySelectorAll(
|
|
542
|
+
const s = this.currentNode.querySelectorAll(N);
|
|
529
543
|
if (!(s != null && s.length))
|
|
530
544
|
return;
|
|
531
545
|
const i = nt.getConfig(this.currentNode), a = `0 ${Math.floor(i.columnSpacing / 2)}px`, c = this.api.getDocumentModifier(), l = this.store.recommendationProducts.length;
|
|
532
546
|
let u = 0;
|
|
533
547
|
s.forEach((d) => {
|
|
534
|
-
var
|
|
535
|
-
const b = d.querySelector(
|
|
536
|
-
if (
|
|
548
|
+
var k;
|
|
549
|
+
const b = d.querySelector(S), $ = ((k = b == null ? void 0 : b.querySelectorAll(`.${at}`)) == null ? void 0 : k.length) || 1, U = (100 / $).toFixed(2), { bgStyle: j, bgAttr: W } = this._extractSegmentBgFromCard(d), O = l > 0 ? Math.min($, l - u) : $, K = o.map((H) => {
|
|
550
|
+
if (H === e) {
|
|
537
551
|
const z = Array.from(
|
|
538
552
|
{ length: O },
|
|
539
|
-
(
|
|
553
|
+
(St, Y) => {
|
|
540
554
|
const X = this._resolveAttributeContent(
|
|
541
555
|
t,
|
|
542
556
|
r,
|
|
@@ -545,19 +559,19 @@ class Ut extends Z {
|
|
|
545
559
|
return this._getGridCellHtml(
|
|
546
560
|
t,
|
|
547
561
|
X,
|
|
548
|
-
|
|
562
|
+
U,
|
|
549
563
|
j,
|
|
550
564
|
W,
|
|
551
565
|
a
|
|
552
566
|
);
|
|
553
567
|
}
|
|
554
|
-
).join(""), G = dt(
|
|
568
|
+
).join(""), G = dt(U, a).repeat($ - O);
|
|
555
569
|
return `<tr class="recommendation-attribute-row" ${y}="${e}" ${v}="1">${z}${G}</tr>`;
|
|
556
570
|
}
|
|
557
|
-
const
|
|
558
|
-
`${
|
|
571
|
+
const D = d.querySelector(
|
|
572
|
+
`${S}[${y}="${H}"]`
|
|
559
573
|
);
|
|
560
|
-
return
|
|
574
|
+
return D && "getOuterHTML" in D ? D.getOuterHTML() : "";
|
|
561
575
|
}).join("");
|
|
562
576
|
u += O, l > 0 && u >= l && (u = 0), c.modifyHtml(d).setInnerHtml(K);
|
|
563
577
|
}), c.apply(new A(`${this.api.translate("Add custom attribute")}: ${r}`));
|
|
@@ -566,7 +580,7 @@ class Ut extends Z {
|
|
|
566
580
|
const s = this.currentNode.querySelectorAll(M);
|
|
567
581
|
if (!(s != null && s.length))
|
|
568
582
|
return;
|
|
569
|
-
const i = o.filter((a) => a !==
|
|
583
|
+
const i = o.filter((a) => a !== L && a !== B), n = this.api.getDocumentModifier();
|
|
570
584
|
s.forEach((a, c) => {
|
|
571
585
|
const l = i.map((u) => {
|
|
572
586
|
if (u === e) {
|
|
@@ -574,7 +588,7 @@ class Ut extends Z {
|
|
|
574
588
|
return this._getListRowHtml(t, b, e);
|
|
575
589
|
}
|
|
576
590
|
const d = a.querySelector(
|
|
577
|
-
`${
|
|
591
|
+
`${S}[${y}="${u}"]`
|
|
578
592
|
);
|
|
579
593
|
return d && "getOuterHTML" in d ? d.getOuterHTML() : "";
|
|
580
594
|
}).join("");
|
|
@@ -590,13 +604,13 @@ class Ut extends Z {
|
|
|
590
604
|
return;
|
|
591
605
|
const r = this._getCurrentLayout(), e = this.api.getDocumentModifier();
|
|
592
606
|
if (r === "grid") {
|
|
593
|
-
const o = this.currentNode.querySelectorAll(
|
|
607
|
+
const o = this.currentNode.querySelectorAll(N);
|
|
594
608
|
o == null || o.forEach((s) => {
|
|
595
609
|
const i = this._buildCompositionHtml(s, t);
|
|
596
610
|
e.modifyHtml(s).setInnerHtml(i);
|
|
597
611
|
});
|
|
598
612
|
} else {
|
|
599
|
-
const o = t.filter((i) => i !==
|
|
613
|
+
const o = t.filter((i) => i !== L && i !== B), s = this.currentNode.querySelectorAll(M);
|
|
600
614
|
s == null || s.forEach((i) => {
|
|
601
615
|
const n = this._buildCompositionHtml(i, o);
|
|
602
616
|
e.modifyHtml(i).setInnerHtml(n);
|
|
@@ -624,7 +638,7 @@ class Ut extends Z {
|
|
|
624
638
|
_reorderProductAttributes(t) {
|
|
625
639
|
if (!this.currentNode)
|
|
626
640
|
return;
|
|
627
|
-
const r = this.currentNode.querySelectorAll(
|
|
641
|
+
const r = this.currentNode.querySelectorAll(N);
|
|
628
642
|
if (!(r != null && r.length))
|
|
629
643
|
return;
|
|
630
644
|
const e = this.api.getDocumentModifier();
|
|
@@ -639,7 +653,7 @@ class Ut extends Z {
|
|
|
639
653
|
*/
|
|
640
654
|
_buildCompositionHtml(t, r) {
|
|
641
655
|
return r.reduce((e, o) => {
|
|
642
|
-
const s = t.querySelector(`${
|
|
656
|
+
const s = t.querySelector(`${S}[${y}="${o}"]`);
|
|
643
657
|
return s && "getOuterHTML" in s ? e + s.getOuterHTML() : e;
|
|
644
658
|
}, "");
|
|
645
659
|
}
|
|
@@ -649,7 +663,7 @@ class Ut extends Z {
|
|
|
649
663
|
_applyVisibilityToBlock(t, r) {
|
|
650
664
|
if (!this.currentNode)
|
|
651
665
|
return;
|
|
652
|
-
const e = this.currentNode.querySelectorAll(`${
|
|
666
|
+
const e = this.currentNode.querySelectorAll(`${S}[${y}="${t}"]`);
|
|
653
667
|
if (!(e != null && e.length))
|
|
654
668
|
return;
|
|
655
669
|
const o = r ? "1" : "0", s = r ? this.api.translate("visible") : this.api.translate("hidden"), i = `${this.api.translate("Set visibility")}: ${t} → ${s}`, n = this.api.getDocumentModifier();
|
|
@@ -677,7 +691,7 @@ class Ut extends Z {
|
|
|
677
691
|
return -1;
|
|
678
692
|
}
|
|
679
693
|
_getCurrentLayout() {
|
|
680
|
-
return this.store.recommendationConfigs.orientation ||
|
|
694
|
+
return this.store.recommendationConfigs.orientation || bt(this.currentNode);
|
|
681
695
|
}
|
|
682
696
|
/**
|
|
683
697
|
* Extracts background color properties from existing card elements.
|
|
@@ -793,6 +807,6 @@ class Ut extends Z {
|
|
|
793
807
|
}
|
|
794
808
|
}
|
|
795
809
|
export {
|
|
796
|
-
|
|
810
|
+
yt as COMPOSITION_CONTROL_BLOCK_ID,
|
|
797
811
|
Ut as RecommendationCardCompositionControl
|
|
798
812
|
};
|
|
@@ -6,26 +6,26 @@ import { DEFAULT_NODE_CONFIG as a } from "../../constants/defaultConfig.js";
|
|
|
6
6
|
import { RecommendationConfigService as h } from "../../services/configService.js";
|
|
7
7
|
import { useRecommendationExtensionStore as y } from "../../store/recommendation.js";
|
|
8
8
|
import { AlgorithmControl as N } from "./algorithm.js";
|
|
9
|
-
import { ALGORITHM_CONTROL_ID as
|
|
9
|
+
import { ALGORITHM_CONTROL_ID as X } from "./algorithm.js";
|
|
10
10
|
import { CurrencyControl as R } from "./currency.js";
|
|
11
|
-
import { CURRENCY_CONTROL_ID as
|
|
11
|
+
import { CURRENCY_CONTROL_ID as tt } from "./currency.js";
|
|
12
12
|
import { FiltersControl as _ } from "./filters.js";
|
|
13
|
-
import { FILTERS_CONTROL_ID as
|
|
13
|
+
import { FILTERS_CONTROL_ID as ot } from "./filters.js";
|
|
14
14
|
import { LayoutOrientationControl as b } from "./layoutOrientation.js";
|
|
15
|
-
import { LAYOUT_ORIENTATION_CONTROL_ID as
|
|
15
|
+
import { LAYOUT_ORIENTATION_CONTROL_ID as nt } from "./layoutOrientation.js";
|
|
16
16
|
import { LocaleControl as O } from "./locale.js";
|
|
17
|
-
import { LOCALE_CONTROL_ID as
|
|
17
|
+
import { LOCALE_CONTROL_ID as st } from "./locale.js";
|
|
18
18
|
import { ProductCountControl as I } from "./productCount.js";
|
|
19
|
-
import { PRODUCT_COUNT_CONTROL_ID as
|
|
19
|
+
import { PRODUCT_COUNT_CONTROL_ID as ct } from "./productCount.js";
|
|
20
20
|
import { ProductLayoutControl as T } from "./productLayout.js";
|
|
21
|
-
import { PRODUCT_LAYOUT_CONTROL_ID as
|
|
21
|
+
import { PRODUCT_LAYOUT_CONTROL_ID as ut } from "./productLayout.js";
|
|
22
22
|
import { ShuffleControl as S } from "./shuffle.js";
|
|
23
|
-
import { SHUFFLE_CONTROL_ID as
|
|
24
|
-
import { setCurrencyAttributes as L, getBlockElement as P,
|
|
25
|
-
import { adjustProductsToSize as
|
|
23
|
+
import { SHUFFLE_CONTROL_ID as ht } from "./shuffle.js";
|
|
24
|
+
import { setCurrencyAttributes as L, getBlockElement as P, isPartnerManagedBlock as D, updateProductContentInPlace as k, regenerateProductRowsWithStyles as E } from "./utils.js";
|
|
25
|
+
import { adjustProductsToSize as ft, formatProductPrice as Ct, getCardComposition as pt, getCurrentLayout as gt, reapplySpacing as yt, regenerateMobileProductRows as Nt, regenerateProductRows as Rt, updatePricesInPlace as _t, updateSingleProductContent as bt } from "./utils.js";
|
|
26
26
|
import { useDebounceFn as m } from "../../../../../node_modules/@vueuse/shared/index.js";
|
|
27
|
-
const
|
|
28
|
-
class
|
|
27
|
+
const v = "recommendation-id", A = "ui-elements-recommendation-block";
|
|
28
|
+
class q extends g {
|
|
29
29
|
constructor() {
|
|
30
30
|
super(...arguments);
|
|
31
31
|
s(this, "store", y());
|
|
@@ -59,14 +59,14 @@ class K extends g {
|
|
|
59
59
|
*/
|
|
60
60
|
s(this, "_debouncedRegenerateWithProducts", m(() => {
|
|
61
61
|
const t = this.store.recommendationProducts;
|
|
62
|
-
if (!this.currentNode || !this.api)
|
|
62
|
+
if (!this.currentNode || !this.api || D(this.currentNode))
|
|
63
63
|
return;
|
|
64
64
|
const e = this.api.getDocumentModifier();
|
|
65
|
-
|
|
65
|
+
k({
|
|
66
66
|
currentNode: this.currentNode,
|
|
67
67
|
documentModifier: e,
|
|
68
68
|
products: t
|
|
69
|
-
}) ||
|
|
69
|
+
}) || E({
|
|
70
70
|
currentNode: this.currentNode,
|
|
71
71
|
documentModifier: e,
|
|
72
72
|
products: t
|
|
@@ -74,7 +74,7 @@ class K extends g {
|
|
|
74
74
|
}, 100));
|
|
75
75
|
}
|
|
76
76
|
getId() {
|
|
77
|
-
return
|
|
77
|
+
return A;
|
|
78
78
|
}
|
|
79
79
|
getTemplate() {
|
|
80
80
|
return this.algorithmControl = new N(), this.localeControl = new O(), this.currencyControl = new R(), this.productCountControl = new I(), this.productLayoutControl = new T(), this.filtersControl = new _(), this.shuffleControl = new S(), this.layoutOrientationControl = new b(), [
|
|
@@ -290,7 +290,7 @@ class K extends g {
|
|
|
290
290
|
const e = P(t);
|
|
291
291
|
if (!e || !("getAttribute" in e))
|
|
292
292
|
return null;
|
|
293
|
-
const o = e.getAttribute(
|
|
293
|
+
const o = e.getAttribute(v);
|
|
294
294
|
if (!o)
|
|
295
295
|
return null;
|
|
296
296
|
const r = parseInt(o);
|
|
@@ -341,35 +341,36 @@ class K extends g {
|
|
|
341
341
|
}
|
|
342
342
|
}
|
|
343
343
|
export {
|
|
344
|
-
|
|
344
|
+
X as ALGORITHM_CONTROL_ID,
|
|
345
345
|
N as AlgorithmControl,
|
|
346
|
-
|
|
347
|
-
|
|
346
|
+
A as CONTROL_BLOCK_ID,
|
|
347
|
+
tt as CURRENCY_CONTROL_ID,
|
|
348
348
|
R as CurrencyControl,
|
|
349
|
-
|
|
349
|
+
ot as FILTERS_CONTROL_ID,
|
|
350
350
|
_ as FiltersControl,
|
|
351
|
-
|
|
352
|
-
|
|
351
|
+
nt as LAYOUT_ORIENTATION_CONTROL_ID,
|
|
352
|
+
st as LOCALE_CONTROL_ID,
|
|
353
353
|
b as LayoutOrientationControl,
|
|
354
354
|
O as LocaleControl,
|
|
355
|
-
|
|
356
|
-
|
|
355
|
+
ct as PRODUCT_COUNT_CONTROL_ID,
|
|
356
|
+
ut as PRODUCT_LAYOUT_CONTROL_ID,
|
|
357
357
|
I as ProductCountControl,
|
|
358
358
|
T as ProductLayoutControl,
|
|
359
|
-
|
|
360
|
-
|
|
359
|
+
q as RecommendationBlockControl,
|
|
360
|
+
ht as SHUFFLE_CONTROL_ID,
|
|
361
361
|
S as ShuffleControl,
|
|
362
|
-
|
|
363
|
-
|
|
362
|
+
ft as adjustProductsToSize,
|
|
363
|
+
Ct as formatProductPrice,
|
|
364
364
|
P as getBlockElement,
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
yt as
|
|
369
|
-
Nt as
|
|
370
|
-
|
|
365
|
+
pt as getCardComposition,
|
|
366
|
+
gt as getCurrentLayout,
|
|
367
|
+
D as isPartnerManagedBlock,
|
|
368
|
+
yt as reapplySpacing,
|
|
369
|
+
Nt as regenerateMobileProductRows,
|
|
370
|
+
Rt as regenerateProductRows,
|
|
371
|
+
E as regenerateProductRowsWithStyles,
|
|
371
372
|
L as setCurrencyAttributes,
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
373
|
+
_t as updatePricesInPlace,
|
|
374
|
+
k as updateProductContentInPlace,
|
|
375
|
+
bt as updateSingleProductContent
|
|
375
376
|
};
|