@useinsider/guido 3.8.0-beta.eb4074b → 3.8.1-beta.2ee94c2
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 +133 -180
- package/dist/config/compiler/utils/recommendationCompilerUtils.js +57 -58
- package/dist/config/migrator/recommendation/extractors.js +22 -44
- package/dist/config/migrator/recommendation/htmlBuilder.js +169 -175
- package/dist/config/migrator/recommendationMigrator.js +31 -30
- package/dist/extensions/Blocks/Recommendation/constants/selectors.js +20 -26
- package/dist/extensions/Blocks/Recommendation/controls/cardComposition/index.js +41 -55
- package/dist/extensions/Blocks/Recommendation/controls/main/index.js +57 -58
- package/dist/extensions/Blocks/Recommendation/controls/main/layoutOrientation.js +31 -43
- package/dist/extensions/Blocks/Recommendation/controls/main/productCount.js +2 -3
- package/dist/extensions/Blocks/Recommendation/controls/main/productLayout.js +45 -55
- package/dist/extensions/Blocks/Recommendation/controls/main/utils.js +56 -63
- package/dist/extensions/Blocks/Recommendation/controls/syncInfoMessage.js +6 -7
- package/dist/extensions/Blocks/Recommendation/extension.js +2 -3
- package/dist/extensions/Blocks/Recommendation/settingsPanel.js +2 -3
- package/dist/extensions/Blocks/Recommendation/store/recommendation.js +2 -3
- package/dist/extensions/Blocks/Recommendation/templates/grid/template.js +12 -13
- package/dist/extensions/Blocks/Recommendation/templates/index.js +6 -7
- package/dist/extensions/Blocks/Recommendation/templates/utils.js +1 -1
- package/dist/src/composables/useHtmlValidator.d.ts +0 -27
- package/dist/src/config/migrator/recommendation/extractors.d.ts +0 -15
- package/dist/src/config/migrator/recommendation/htmlBuilder.d.ts +0 -8
- package/dist/src/extensions/Blocks/Recommendation/constants/index.d.ts +1 -1
- package/dist/src/extensions/Blocks/Recommendation/constants/selectors.d.ts +0 -21
- package/dist/src/extensions/Blocks/Recommendation/controls/cardComposition/index.d.ts +0 -7
- package/dist/src/extensions/Blocks/Recommendation/controls/main/layoutOrientation.d.ts +0 -5
- package/dist/src/extensions/Blocks/Recommendation/controls/main/productLayout.d.ts +0 -6
- package/dist/src/extensions/Blocks/Recommendation/controls/main/utils.d.ts +0 -9
- package/package.json +1 -1
- package/dist/config/compiler/utils/recommendationIgnoreUtils.js +0 -15
- package/dist/src/composables/useHtmlValidator.test.d.ts +0 -1
- package/dist/src/config/compiler/utils/recommendationIgnoreUtils.d.ts +0 -17
- package/dist/src/config/compiler/utils/recommendationIgnoreUtils.test.d.ts +0 -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 {
|
|
5
|
-
import { buildBlockHtml as
|
|
6
|
-
import { parseRecommendationId as
|
|
7
|
-
import { mapSettings as
|
|
2
|
+
import { useTemplateStore as u } from "../../stores/template.js";
|
|
3
|
+
import { mapComposition as b } from "./recommendation/compositionMapper.js";
|
|
4
|
+
import { extractTitleText as y, extractCardBgColor as C } from "./recommendation/extractors.js";
|
|
5
|
+
import { buildBlockHtml as v } from "./recommendation/htmlBuilder.js";
|
|
6
|
+
import { parseRecommendationId as w, parseLegacyConfig as R } from "./recommendation/parseLegacyConfig.js";
|
|
7
|
+
import { mapSettings as S } 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 x(i, t, c) {
|
|
10
|
+
var s;
|
|
11
|
+
const o = w(t);
|
|
12
12
|
if (o === null)
|
|
13
13
|
return console.warn(
|
|
14
14
|
"[RecommendationMigrator] Skipping block — missing/invalid `ins-recommendation-v3-campaign-id`"
|
|
@@ -18,29 +18,30 @@ function B(i, t, a) {
|
|
|
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
|
-
|
|
21
|
+
const n = c[String(o)];
|
|
22
|
+
if (!n)
|
|
23
|
+
return console.warn(
|
|
24
|
+
`[RecommendationMigrator] Aborting block id=${o} — recommendationConfigs entry missing in Guido Config`
|
|
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,
|
|
25
28
|
composition: e.composition,
|
|
26
29
|
visibility: e.visibility,
|
|
27
30
|
textTrimming: e.anyTextTrimming
|
|
28
|
-
},
|
|
31
|
+
}, p = `
|
|
29
32
|
<table>
|
|
30
33
|
<tbody>
|
|
31
34
|
<tr>
|
|
32
35
|
<td class="esd-structure" align="left">
|
|
33
36
|
<table width="100%" cellpadding="0" cellspacing="0">
|
|
34
37
|
<tbody>
|
|
35
|
-
<tr>${
|
|
36
|
-
nodeConfig:
|
|
38
|
+
<tr>${v({
|
|
39
|
+
nodeConfig: g,
|
|
37
40
|
composition: e,
|
|
38
|
-
cardBg:
|
|
39
|
-
titleText:
|
|
41
|
+
cardBg: l,
|
|
42
|
+
titleText: d,
|
|
40
43
|
legacyId: t.getAttribute("id") ?? void 0,
|
|
41
|
-
legacyBgColor: t.getAttribute("bgcolor") ?? void 0
|
|
42
|
-
preserveInnerHtml: m ? t.innerHTML : void 0,
|
|
43
|
-
skipCompile: m
|
|
44
|
+
legacyBgColor: t.getAttribute("bgcolor") ?? void 0
|
|
44
45
|
})}</tr>
|
|
45
46
|
</tbody>
|
|
46
47
|
</table>
|
|
@@ -48,15 +49,15 @@ function B(i, t, a) {
|
|
|
48
49
|
</tr>
|
|
49
50
|
</tbody>
|
|
50
51
|
</table>
|
|
51
|
-
`,
|
|
52
|
-
return !
|
|
52
|
+
`, m = i.parseFromString(p, "text/html").querySelector("td.esd-structure");
|
|
53
|
+
return !m || !t.parentNode ? (console.warn(
|
|
53
54
|
`[RecommendationMigrator] Aborting block id=${o} — failed to construct new HTML element`
|
|
54
|
-
), !1) : (t.parentNode.replaceChild(
|
|
55
|
+
), !1) : (t.parentNode.replaceChild(m, t), !0);
|
|
55
56
|
}
|
|
56
|
-
function
|
|
57
|
-
const
|
|
57
|
+
function I(i, t = {}) {
|
|
58
|
+
const c = new DOMParser(), o = c.parseFromString(i, "text/html"), r = Array.from(o.querySelectorAll(h));
|
|
58
59
|
try {
|
|
59
|
-
|
|
60
|
+
u().$patch((e) => {
|
|
60
61
|
e.migrations = {
|
|
61
62
|
...e.migrations,
|
|
62
63
|
[f.Recommendation]: r.length
|
|
@@ -67,14 +68,14 @@ function q(i, t = {}) {
|
|
|
67
68
|
if (r.length === 0)
|
|
68
69
|
return i;
|
|
69
70
|
let n = 0;
|
|
70
|
-
return r.forEach((
|
|
71
|
+
return r.forEach((a) => {
|
|
71
72
|
try {
|
|
72
|
-
|
|
73
|
+
x(c, a, t) && (n += 1);
|
|
73
74
|
} catch (e) {
|
|
74
75
|
console.error("[RecommendationMigrator] Unexpected error migrating block:", e);
|
|
75
76
|
}
|
|
76
77
|
}), n > 0 && console.info(`[RecommendationMigrator] Migrated ${n} legacy Recommendation block(s)`), o.documentElement.outerHTML;
|
|
77
78
|
}
|
|
78
79
|
export {
|
|
79
|
-
|
|
80
|
+
I as migrateRecommendation
|
|
80
81
|
};
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
const
|
|
1
|
+
const T = ".recommendation-block-v2", c = ".ins-recommendation-product-container", t = ".ins-recommendation-desktop-container", o = ".ins-recommendation-mobile-container", n = ".ins-recommendation-mobile-row", r = "reco-v3-button", _ = {
|
|
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
|
+
}, R = "productImage", e = "productName", O = "productPrice", s = "productOldPrice", E = "productOmnibusPrice", i = "productOmnibusDiscount", C = "productButton", A = "customAttr:", u = "data-custom-attributes", a = "product-attr", m = "product_attribute.", U = /* @__PURE__ */ new Set([
|
|
9
9
|
"name",
|
|
10
10
|
// productName
|
|
11
11
|
"price",
|
|
@@ -20,31 +20,25 @@ const c = ".recommendation-block-v2", t = ".ins-recommendation-product-container
|
|
|
20
20
|
// productOmnibusPrice
|
|
21
21
|
"omnibus_discount"
|
|
22
22
|
// productOmnibusDiscount
|
|
23
|
-
]), a = /* @__PURE__ */ new Set([
|
|
24
|
-
...T,
|
|
25
|
-
"currency",
|
|
26
|
-
"discount"
|
|
27
23
|
]);
|
|
28
24
|
export {
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
25
|
+
A as ATTR_CUSTOM_PREFIX,
|
|
26
|
+
u as ATTR_DATA_CUSTOM_ATTRIBUTES,
|
|
27
|
+
a as ATTR_PRODUCT_ATTR,
|
|
28
|
+
C as ATTR_PRODUCT_BUTTON,
|
|
29
|
+
R as ATTR_PRODUCT_IMAGE,
|
|
30
|
+
e as ATTR_PRODUCT_NAME,
|
|
31
|
+
s as ATTR_PRODUCT_OLD_PRICE,
|
|
32
|
+
i as ATTR_PRODUCT_OMNIBUS_DISCOUNT,
|
|
33
|
+
E as ATTR_PRODUCT_OMNIBUS_PRICE,
|
|
34
|
+
O as ATTR_PRODUCT_PRICE,
|
|
35
|
+
T as BLOCK_ROOT_SELECTOR,
|
|
36
|
+
U as BUILT_IN_DEFAULT_ATTRIBUTES,
|
|
37
|
+
c as CONTAINER_SELECTOR,
|
|
42
38
|
r as CSS_CLASS_RECO_BUTTON,
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
o as
|
|
46
|
-
n as
|
|
47
|
-
|
|
48
|
-
U as PRODUCT_ATTRIBUTE_PREFIX,
|
|
49
|
-
a as RECOMMENDATION_VARIABLE_BUILTIN_ATTRIBUTES
|
|
39
|
+
_ as CURRENCY_ATTR,
|
|
40
|
+
t as DESKTOP_CONTAINER_SELECTOR,
|
|
41
|
+
o as MOBILE_CONTAINER_SELECTOR,
|
|
42
|
+
n as MOBILE_ROW_SELECTOR,
|
|
43
|
+
m as PRODUCT_ATTRIBUTE_PREFIX
|
|
50
44
|
};
|
|
@@ -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 S = (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 D, 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 U, 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 { getCurrentLayout as gt } from "../main/utils.js";
|
|
15
|
+
const bt = "ui-elements-recommendation-card-composition", C = ".recommendation-attribute-row", L = ".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: D, 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: U, label: "Product Button" }
|
|
25
|
+
], yt = new Set(h.map((p) => p.key)), T = "customAttr_", R = "deleteAttr_";
|
|
26
26
|
class Ut extends Z {
|
|
27
27
|
constructor() {
|
|
28
28
|
super(...arguments);
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
29
|
+
S(this, "store", lt());
|
|
30
|
+
S(this, "unsubscribeStore", null);
|
|
31
|
+
S(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
|
+
S(this, "reorderInProgress", !1);
|
|
37
37
|
}
|
|
38
38
|
getId() {
|
|
39
|
-
return
|
|
39
|
+
return bt;
|
|
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="${T}${u}" style="display: none;">
|
|
53
53
|
${this._GuSelect({
|
|
54
|
-
name: `${
|
|
54
|
+
name: `${T}${u}`,
|
|
55
55
|
placeholder: this.api.translate("Select Attribute"),
|
|
56
56
|
options: []
|
|
57
57
|
})}
|
|
@@ -128,24 +128,10 @@ class Ut extends Z {
|
|
|
128
128
|
`;
|
|
129
129
|
}
|
|
130
130
|
onRender() {
|
|
131
|
-
this._initializeComposition(), this._registerValueChangeListeners(), this._setupEventListeners(), this._updateOrderableState(), this._subscribeToStoreChanges()
|
|
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" : "";
|
|
131
|
+
this._initializeComposition(), this._registerValueChangeListeners(), this._setupEventListeners(), this._updateOrderableState(), this._subscribeToStoreChanges();
|
|
146
132
|
}
|
|
147
133
|
onTemplateNodeUpdated(t) {
|
|
148
|
-
super.onTemplateNodeUpdated(t), !this.reorderInProgress && (this._initializeComposition(), this._updateOrderableState()
|
|
134
|
+
super.onTemplateNodeUpdated(t), !this.reorderInProgress && (this._initializeComposition(), this._updateOrderableState());
|
|
149
135
|
}
|
|
150
136
|
onDestroy() {
|
|
151
137
|
super.onDestroy(), this.eventController && (this.eventController.abort(), this.eventController = null), this.unsubscribeStore && (this.unsubscribeStore(), this.unsubscribeStore = null);
|
|
@@ -164,7 +150,7 @@ class Ut extends Z {
|
|
|
164
150
|
});
|
|
165
151
|
});
|
|
166
152
|
for (let t = 0; t < g; t++) {
|
|
167
|
-
const r = `${
|
|
153
|
+
const r = `${T}${t}`, e = t;
|
|
168
154
|
this.api.onValueChanged(r, (o) => {
|
|
169
155
|
this._onCustomAttributeChanged(e, o);
|
|
170
156
|
});
|
|
@@ -194,7 +180,7 @@ class Ut extends Z {
|
|
|
194
180
|
_readVisibilityFromRows() {
|
|
195
181
|
if (!this.currentNode)
|
|
196
182
|
return this._getDefaultVisibilities();
|
|
197
|
-
const t = Array.from(this.currentNode.querySelectorAll(
|
|
183
|
+
const t = Array.from(this.currentNode.querySelectorAll(C)), r = this._extractVisibilityFromRows(t);
|
|
198
184
|
return this._mergeWithDefaults(r);
|
|
199
185
|
}
|
|
200
186
|
_getDefaultVisibilities() {
|
|
@@ -238,7 +224,7 @@ class Ut extends Z {
|
|
|
238
224
|
const s = new Set(r);
|
|
239
225
|
let i = 0, n = 0;
|
|
240
226
|
const a = t.map((c) => {
|
|
241
|
-
if (
|
|
227
|
+
if (yt.has(c)) {
|
|
242
228
|
const l = h.find((u) => u.key === c);
|
|
243
229
|
return this._createBuiltInItemHtml(l, n++);
|
|
244
230
|
}
|
|
@@ -329,7 +315,7 @@ class Ut extends Z {
|
|
|
329
315
|
_initializeCustomSelects(t) {
|
|
330
316
|
t.length !== 0 && setTimeout(() => {
|
|
331
317
|
t.forEach((r, e) => {
|
|
332
|
-
const o = `${
|
|
318
|
+
const o = `${T}${e}`, s = this._getSelectOptions(r, t);
|
|
333
319
|
this.api.setUIEAttribute(o, I.SELECTPICKER.items, s), this.api.updateValues({ [o]: r });
|
|
334
320
|
});
|
|
335
321
|
}, 0);
|
|
@@ -353,7 +339,7 @@ class Ut extends Z {
|
|
|
353
339
|
*/
|
|
354
340
|
_moveSelectsIntoItems(t, r) {
|
|
355
341
|
for (let e = 0; e < r; e++) {
|
|
356
|
-
const o = `${
|
|
342
|
+
const o = `${T}${e}`, s = t.querySelector(`[data-custom-select-key="${o}"]`), i = t.querySelector(`[data-custom-select-slot="${e}"]`);
|
|
357
343
|
if (s && i) {
|
|
358
344
|
const n = s.querySelector("ue-select");
|
|
359
345
|
n && i.appendChild(n);
|
|
@@ -381,7 +367,7 @@ class Ut extends Z {
|
|
|
381
367
|
*/
|
|
382
368
|
_rescueSelectsToStore(t) {
|
|
383
369
|
for (let r = 0; r < g; r++) {
|
|
384
|
-
const e = `${
|
|
370
|
+
const e = `${T}${r}`, o = t.querySelector(`[data-custom-select-key="${e}"]`), s = t.querySelector(`[data-custom-select-slot="${r}"]`);
|
|
385
371
|
if (s) {
|
|
386
372
|
const i = s.querySelector("ue-select");
|
|
387
373
|
i && o && o.appendChild(i);
|
|
@@ -539,18 +525,18 @@ class Ut extends Z {
|
|
|
539
525
|
this._getCurrentLayout() === "grid" ? this._injectGridAttributeRow(t, r, e, o) : this._injectListAttributeRow(t, r, e, o);
|
|
540
526
|
}
|
|
541
527
|
_injectGridAttributeRow(t, r, e, o) {
|
|
542
|
-
const s = this.currentNode.querySelectorAll(
|
|
528
|
+
const s = this.currentNode.querySelectorAll(L);
|
|
543
529
|
if (!(s != null && s.length))
|
|
544
530
|
return;
|
|
545
531
|
const i = nt.getConfig(this.currentNode), a = `0 ${Math.floor(i.columnSpacing / 2)}px`, c = this.api.getDocumentModifier(), l = this.store.recommendationProducts.length;
|
|
546
532
|
let u = 0;
|
|
547
533
|
s.forEach((d) => {
|
|
548
|
-
var
|
|
549
|
-
const b = d.querySelector(
|
|
550
|
-
if (
|
|
534
|
+
var H;
|
|
535
|
+
const b = d.querySelector(C), $ = ((H = b == null ? void 0 : b.querySelectorAll(`.${at}`)) == null ? void 0 : H.length) || 1, B = (100 / $).toFixed(2), { bgStyle: j, bgAttr: W } = this._extractSegmentBgFromCard(d), O = l > 0 ? Math.min($, l - u) : $, K = o.map((k) => {
|
|
536
|
+
if (k === e) {
|
|
551
537
|
const z = Array.from(
|
|
552
538
|
{ length: O },
|
|
553
|
-
(
|
|
539
|
+
(At, Y) => {
|
|
554
540
|
const X = this._resolveAttributeContent(
|
|
555
541
|
t,
|
|
556
542
|
r,
|
|
@@ -559,19 +545,19 @@ class Ut extends Z {
|
|
|
559
545
|
return this._getGridCellHtml(
|
|
560
546
|
t,
|
|
561
547
|
X,
|
|
562
|
-
|
|
548
|
+
B,
|
|
563
549
|
j,
|
|
564
550
|
W,
|
|
565
551
|
a
|
|
566
552
|
);
|
|
567
553
|
}
|
|
568
|
-
).join(""), G = dt(
|
|
554
|
+
).join(""), G = dt(B, a).repeat($ - O);
|
|
569
555
|
return `<tr class="recommendation-attribute-row" ${y}="${e}" ${v}="1">${z}${G}</tr>`;
|
|
570
556
|
}
|
|
571
|
-
const
|
|
572
|
-
`${
|
|
557
|
+
const N = d.querySelector(
|
|
558
|
+
`${C}[${y}="${k}"]`
|
|
573
559
|
);
|
|
574
|
-
return
|
|
560
|
+
return N && "getOuterHTML" in N ? N.getOuterHTML() : "";
|
|
575
561
|
}).join("");
|
|
576
562
|
u += O, l > 0 && u >= l && (u = 0), c.modifyHtml(d).setInnerHtml(K);
|
|
577
563
|
}), c.apply(new A(`${this.api.translate("Add custom attribute")}: ${r}`));
|
|
@@ -580,7 +566,7 @@ class Ut extends Z {
|
|
|
580
566
|
const s = this.currentNode.querySelectorAll(M);
|
|
581
567
|
if (!(s != null && s.length))
|
|
582
568
|
return;
|
|
583
|
-
const i = o.filter((a) => a !==
|
|
569
|
+
const i = o.filter((a) => a !== D && a !== U), n = this.api.getDocumentModifier();
|
|
584
570
|
s.forEach((a, c) => {
|
|
585
571
|
const l = i.map((u) => {
|
|
586
572
|
if (u === e) {
|
|
@@ -588,7 +574,7 @@ class Ut extends Z {
|
|
|
588
574
|
return this._getListRowHtml(t, b, e);
|
|
589
575
|
}
|
|
590
576
|
const d = a.querySelector(
|
|
591
|
-
`${
|
|
577
|
+
`${C}[${y}="${u}"]`
|
|
592
578
|
);
|
|
593
579
|
return d && "getOuterHTML" in d ? d.getOuterHTML() : "";
|
|
594
580
|
}).join("");
|
|
@@ -604,13 +590,13 @@ class Ut extends Z {
|
|
|
604
590
|
return;
|
|
605
591
|
const r = this._getCurrentLayout(), e = this.api.getDocumentModifier();
|
|
606
592
|
if (r === "grid") {
|
|
607
|
-
const o = this.currentNode.querySelectorAll(
|
|
593
|
+
const o = this.currentNode.querySelectorAll(L);
|
|
608
594
|
o == null || o.forEach((s) => {
|
|
609
595
|
const i = this._buildCompositionHtml(s, t);
|
|
610
596
|
e.modifyHtml(s).setInnerHtml(i);
|
|
611
597
|
});
|
|
612
598
|
} else {
|
|
613
|
-
const o = t.filter((i) => i !==
|
|
599
|
+
const o = t.filter((i) => i !== D && i !== U), s = this.currentNode.querySelectorAll(M);
|
|
614
600
|
s == null || s.forEach((i) => {
|
|
615
601
|
const n = this._buildCompositionHtml(i, o);
|
|
616
602
|
e.modifyHtml(i).setInnerHtml(n);
|
|
@@ -638,7 +624,7 @@ class Ut extends Z {
|
|
|
638
624
|
_reorderProductAttributes(t) {
|
|
639
625
|
if (!this.currentNode)
|
|
640
626
|
return;
|
|
641
|
-
const r = this.currentNode.querySelectorAll(
|
|
627
|
+
const r = this.currentNode.querySelectorAll(L);
|
|
642
628
|
if (!(r != null && r.length))
|
|
643
629
|
return;
|
|
644
630
|
const e = this.api.getDocumentModifier();
|
|
@@ -653,7 +639,7 @@ class Ut extends Z {
|
|
|
653
639
|
*/
|
|
654
640
|
_buildCompositionHtml(t, r) {
|
|
655
641
|
return r.reduce((e, o) => {
|
|
656
|
-
const s = t.querySelector(`${
|
|
642
|
+
const s = t.querySelector(`${C}[${y}="${o}"]`);
|
|
657
643
|
return s && "getOuterHTML" in s ? e + s.getOuterHTML() : e;
|
|
658
644
|
}, "");
|
|
659
645
|
}
|
|
@@ -663,7 +649,7 @@ class Ut extends Z {
|
|
|
663
649
|
_applyVisibilityToBlock(t, r) {
|
|
664
650
|
if (!this.currentNode)
|
|
665
651
|
return;
|
|
666
|
-
const e = this.currentNode.querySelectorAll(`${
|
|
652
|
+
const e = this.currentNode.querySelectorAll(`${C}[${y}="${t}"]`);
|
|
667
653
|
if (!(e != null && e.length))
|
|
668
654
|
return;
|
|
669
655
|
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();
|
|
@@ -691,7 +677,7 @@ class Ut extends Z {
|
|
|
691
677
|
return -1;
|
|
692
678
|
}
|
|
693
679
|
_getCurrentLayout() {
|
|
694
|
-
return this.store.recommendationConfigs.orientation ||
|
|
680
|
+
return this.store.recommendationConfigs.orientation || gt(this.currentNode);
|
|
695
681
|
}
|
|
696
682
|
/**
|
|
697
683
|
* Extracts background color properties from existing card elements.
|
|
@@ -807,6 +793,6 @@ class Ut extends Z {
|
|
|
807
793
|
}
|
|
808
794
|
}
|
|
809
795
|
export {
|
|
810
|
-
|
|
796
|
+
bt as COMPOSITION_CONTROL_BLOCK_ID,
|
|
811
797
|
Ut as RecommendationCardCompositionControl
|
|
812
798
|
};
|
|
@@ -1,31 +1,31 @@
|
|
|
1
1
|
var C = Object.defineProperty;
|
|
2
|
-
var
|
|
3
|
-
var s = (d,
|
|
4
|
-
import { CommonControl as
|
|
5
|
-
import { DEFAULT_NODE_CONFIG as
|
|
2
|
+
var p = (d, a, t) => a in d ? C(d, a, { enumerable: !0, configurable: !0, writable: !0, value: t }) : d[a] = t;
|
|
3
|
+
var s = (d, a, t) => p(d, typeof a != "symbol" ? a + "" : a, t);
|
|
4
|
+
import { CommonControl as g } from "../../../common-control.js";
|
|
5
|
+
import { DEFAULT_NODE_CONFIG as l } 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 R } from "./algorithm.js";
|
|
9
|
-
import { ALGORITHM_CONTROL_ID as
|
|
10
|
-
import { CurrencyControl as
|
|
11
|
-
import { CURRENCY_CONTROL_ID as
|
|
12
|
-
import { FiltersControl as
|
|
13
|
-
import { FILTERS_CONTROL_ID as
|
|
9
|
+
import { ALGORITHM_CONTROL_ID as Q } from "./algorithm.js";
|
|
10
|
+
import { CurrencyControl as b } from "./currency.js";
|
|
11
|
+
import { CURRENCY_CONTROL_ID as Z } from "./currency.js";
|
|
12
|
+
import { FiltersControl as N } from "./filters.js";
|
|
13
|
+
import { FILTERS_CONTROL_ID as et } from "./filters.js";
|
|
14
14
|
import { LayoutOrientationControl as I } from "./layoutOrientation.js";
|
|
15
|
-
import { LAYOUT_ORIENTATION_CONTROL_ID as
|
|
15
|
+
import { LAYOUT_ORIENTATION_CONTROL_ID as rt } from "./layoutOrientation.js";
|
|
16
16
|
import { LocaleControl as _ } from "./locale.js";
|
|
17
|
-
import { LOCALE_CONTROL_ID as
|
|
17
|
+
import { LOCALE_CONTROL_ID as it } from "./locale.js";
|
|
18
18
|
import { ProductCountControl as O } from "./productCount.js";
|
|
19
|
-
import { PRODUCT_COUNT_CONTROL_ID as
|
|
19
|
+
import { PRODUCT_COUNT_CONTROL_ID as lt } 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 ct } 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 dt } from "./shuffle.js";
|
|
24
|
+
import { setCurrencyAttributes as L, getBlockElement as P, updateProductContentInPlace as k, regenerateProductRowsWithStyles as D } from "./utils.js";
|
|
25
|
+
import { adjustProductsToSize as mt, formatProductPrice as ft, getCardComposition as Ct, getCurrentLayout as pt, regenerateMobileProductRows as gt, updatePricesInPlace as yt, updateSingleProductContent as Rt } from "./utils.js";
|
|
26
26
|
import { useDebounceFn as m } from "../../../../../node_modules/@vueuse/shared/index.js";
|
|
27
|
-
const
|
|
28
|
-
class
|
|
27
|
+
const E = "recommendation-id", w = "ui-elements-recommendation-block";
|
|
28
|
+
class K extends g {
|
|
29
29
|
constructor() {
|
|
30
30
|
super(...arguments);
|
|
31
31
|
s(this, "store", y());
|
|
@@ -60,14 +60,14 @@ class q extends p {
|
|
|
60
60
|
*/
|
|
61
61
|
s(this, "_debouncedRegenerateWithProducts", m(() => {
|
|
62
62
|
const t = this.store.recommendationProducts;
|
|
63
|
-
if (!this.currentNode || !this.api
|
|
63
|
+
if (!this.currentNode || !this.api)
|
|
64
64
|
return;
|
|
65
65
|
const e = this.api.getDocumentModifier();
|
|
66
|
-
|
|
66
|
+
k({
|
|
67
67
|
currentNode: this.currentNode,
|
|
68
68
|
documentModifier: e,
|
|
69
69
|
products: t
|
|
70
|
-
}) ||
|
|
70
|
+
}) || D({
|
|
71
71
|
currentNode: this.currentNode,
|
|
72
72
|
documentModifier: e,
|
|
73
73
|
products: t
|
|
@@ -75,10 +75,10 @@ class q extends p {
|
|
|
75
75
|
}, 100));
|
|
76
76
|
}
|
|
77
77
|
getId() {
|
|
78
|
-
return
|
|
78
|
+
return w;
|
|
79
79
|
}
|
|
80
80
|
getTemplate() {
|
|
81
|
-
return this.algorithmControl = new R(), this.localeControl = new _(), this.currencyControl = new
|
|
81
|
+
return this.algorithmControl = new R(), this.localeControl = new _(), this.currencyControl = new b(), this.productCountControl = new O(), this.productLayoutControl = new T(), this.filtersControl = new N(), this.shuffleControl = new S(), this.layoutOrientationControl = new I(), [
|
|
82
82
|
this.algorithmControl,
|
|
83
83
|
this.localeControl,
|
|
84
84
|
this.currencyControl,
|
|
@@ -241,26 +241,26 @@ class q extends p {
|
|
|
241
241
|
return;
|
|
242
242
|
const t = h.getConfig(this.currentNode), e = {};
|
|
243
243
|
let o = null, r = null, n = null;
|
|
244
|
-
if (t.currency.code ===
|
|
244
|
+
if (t.currency.code === l.currency.code) {
|
|
245
245
|
const { currencyList: i } = this.store;
|
|
246
246
|
i.length > 0 && (i.some(
|
|
247
|
-
(u) => u.value === `price.${
|
|
247
|
+
(u) => u.value === `price.${l.currency.code}`
|
|
248
248
|
) || (o = i[0].value.replace("price.", ""), e.currency = {
|
|
249
|
-
...
|
|
249
|
+
...l.currency,
|
|
250
250
|
code: o,
|
|
251
251
|
symbol: o
|
|
252
252
|
}));
|
|
253
253
|
}
|
|
254
|
-
if (t.strategy ===
|
|
254
|
+
if (t.strategy === l.strategy) {
|
|
255
255
|
const i = this.store.getActivePredictiveAlgorithms;
|
|
256
256
|
i.length > 0 && (i.some(
|
|
257
|
-
(u) => u.value ===
|
|
257
|
+
(u) => u.value === l.strategy
|
|
258
258
|
) || (r = i[0].value, e.strategy = r));
|
|
259
259
|
}
|
|
260
|
-
if (t.language ===
|
|
260
|
+
if (t.language === l.language) {
|
|
261
261
|
const i = this.store.getLanguages;
|
|
262
262
|
i.length > 0 && (i.some(
|
|
263
|
-
(u) => u.value ===
|
|
263
|
+
(u) => u.value === l.language
|
|
264
264
|
) || (n = i[0].value, e.language = n));
|
|
265
265
|
}
|
|
266
266
|
!o && !r && !n || (h.updateConfig(
|
|
@@ -278,10 +278,10 @@ class q extends p {
|
|
|
278
278
|
name: o,
|
|
279
279
|
value: o,
|
|
280
280
|
symbol: o,
|
|
281
|
-
alignment:
|
|
282
|
-
decimalCount:
|
|
283
|
-
decimalSeparator:
|
|
284
|
-
thousandSeparator:
|
|
281
|
+
alignment: l.currency.alignment === "before" ? "0" : "1",
|
|
282
|
+
decimalCount: l.currency.decimalCount.toString(),
|
|
283
|
+
decimalSeparator: l.currency.decimalSeparator,
|
|
284
|
+
thousandSeparator: l.currency.thousandSeparator
|
|
285
285
|
}
|
|
286
286
|
} : {},
|
|
287
287
|
...r ? { strategy: r } : {},
|
|
@@ -295,7 +295,7 @@ class q extends p {
|
|
|
295
295
|
const e = P(t);
|
|
296
296
|
if (!e || !("getAttribute" in e))
|
|
297
297
|
return null;
|
|
298
|
-
const o = e.getAttribute(
|
|
298
|
+
const o = e.getAttribute(E);
|
|
299
299
|
if (!o)
|
|
300
300
|
return null;
|
|
301
301
|
const r = parseInt(o);
|
|
@@ -325,8 +325,8 @@ class q extends p {
|
|
|
325
325
|
}
|
|
326
326
|
const i = t.$state.configVersion;
|
|
327
327
|
i !== o && (o = i, this._persistFiltersToNodeConfig(), this._debouncedFetchProducts());
|
|
328
|
-
const
|
|
329
|
-
u && f && (e =
|
|
328
|
+
const c = t.recommendationProducts, u = c !== e, f = Array.isArray(c) && c.length > 0;
|
|
329
|
+
u && f && (e = c, this._debouncedRegenerateWithProducts());
|
|
330
330
|
});
|
|
331
331
|
}
|
|
332
332
|
/**
|
|
@@ -346,34 +346,33 @@ class q extends p {
|
|
|
346
346
|
}
|
|
347
347
|
}
|
|
348
348
|
export {
|
|
349
|
-
|
|
349
|
+
Q as ALGORITHM_CONTROL_ID,
|
|
350
350
|
R as AlgorithmControl,
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
351
|
+
w as CONTROL_BLOCK_ID,
|
|
352
|
+
Z as CURRENCY_CONTROL_ID,
|
|
353
|
+
b as CurrencyControl,
|
|
354
|
+
et as FILTERS_CONTROL_ID,
|
|
355
|
+
N as FiltersControl,
|
|
356
|
+
rt as LAYOUT_ORIENTATION_CONTROL_ID,
|
|
357
|
+
it as LOCALE_CONTROL_ID,
|
|
358
358
|
I as LayoutOrientationControl,
|
|
359
359
|
_ as LocaleControl,
|
|
360
|
-
|
|
361
|
-
|
|
360
|
+
lt as PRODUCT_COUNT_CONTROL_ID,
|
|
361
|
+
ct as PRODUCT_LAYOUT_CONTROL_ID,
|
|
362
362
|
O as ProductCountControl,
|
|
363
363
|
T as ProductLayoutControl,
|
|
364
|
-
|
|
365
|
-
|
|
364
|
+
K as RecommendationBlockControl,
|
|
365
|
+
dt as SHUFFLE_CONTROL_ID,
|
|
366
366
|
S as ShuffleControl,
|
|
367
|
-
|
|
368
|
-
|
|
367
|
+
mt as adjustProductsToSize,
|
|
368
|
+
ft as formatProductPrice,
|
|
369
369
|
P as getBlockElement,
|
|
370
|
-
|
|
370
|
+
Ct as getCardComposition,
|
|
371
371
|
pt as getCurrentLayout,
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
E as regenerateProductRowsWithStyles,
|
|
372
|
+
gt as regenerateMobileProductRows,
|
|
373
|
+
D as regenerateProductRowsWithStyles,
|
|
375
374
|
L as setCurrencyAttributes,
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
375
|
+
yt as updatePricesInPlace,
|
|
376
|
+
k as updateProductContentInPlace,
|
|
377
|
+
Rt as updateSingleProductContent
|
|
379
378
|
};
|