@useinsider/guido 3.17.0-beta.e6704da → 3.17.0-beta.eae947f
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +5 -6
- package/dist/@types/config/schemas.js +6 -12
- package/dist/components/Guido.vue.js +6 -6
- package/dist/components/Guido.vue2.js +61 -63
- package/dist/composables/useCustomInterfaceAppearance.js +16 -19
- package/dist/composables/useRecommendation.js +34 -41
- package/dist/config/migrator/recommendationMigrator.js +4 -6
- package/dist/enums/academy.js +1 -2
- package/dist/enums/date.js +3 -4
- package/dist/enums/extensions/recommendationBlock.js +23 -25
- package/dist/extensions/Blocks/Items/block.js +98 -49
- package/dist/extensions/Blocks/Items/constants/currency.js +11 -0
- package/dist/extensions/Blocks/Items/controls/price/currencyLocation.js +25 -24
- package/dist/extensions/Blocks/Items/controls/price/currencySymbol.js +12 -11
- package/dist/extensions/Blocks/Items/template.js +153 -152
- package/dist/extensions/Blocks/Recommendation/constants/defaultConfig.js +11 -13
- package/dist/extensions/Blocks/Recommendation/controls/cardComposition/index.js +95 -96
- package/dist/extensions/Blocks/Recommendation/controls/main/index.js +154 -156
- package/dist/extensions/Blocks/Recommendation/store/recommendation.js +68 -216
- package/dist/extensions/Blocks/common-control.js +19 -22
- package/dist/guido.css +1 -1
- package/dist/services/recommendationApi.js +29 -78
- package/dist/src/@types/config/schemas.d.ts +0 -12
- package/dist/src/composables/useConfig.d.ts +0 -2
- package/dist/src/composables/useRecommendation.d.ts +0 -1
- package/dist/src/enums/academy.d.ts +0 -1
- package/dist/src/enums/extensions/recommendationBlock.d.ts +0 -2
- package/dist/src/extensions/Blocks/Items/block.d.ts +21 -0
- package/dist/src/extensions/Blocks/Items/constants/currency.d.ts +19 -0
- package/dist/src/extensions/Blocks/Recommendation/controls/main/index.d.ts +3 -14
- package/dist/src/extensions/Blocks/Recommendation/store/recommendation.d.ts +10 -214
- package/dist/src/extensions/Blocks/Recommendation/types/nodeConfig.d.ts +0 -6
- package/dist/src/extensions/Blocks/common-control.d.ts +1 -4
- package/dist/src/services/recommendationApi.d.ts +1 -4
- package/dist/src/stores/config.d.ts +0 -18
- package/dist/utils/dateUtil.js +10 -23
- package/dist/utils/pairProductVariables.js +60 -59
- package/dist/utils/templatePreparation.js +34 -37
- package/package.json +2 -3
- package/dist/components/organisms/extensions/recommendation/AssignStrategyDrawer.vue.js +0 -18
- package/dist/components/organisms/extensions/recommendation/AssignStrategyDrawer.vue2.js +0 -70
- package/dist/components/organisms/extensions/recommendation/StrategyInfoBox.vue.js +0 -20
- package/dist/components/organisms/extensions/recommendation/StrategyInfoBox.vue2.js +0 -55
- package/dist/extensions/Blocks/Recommendation/controls/main/strategy.js +0 -141
- package/dist/src/components/organisms/extensions/recommendation/AssignStrategyDrawer.vue.d.ts +0 -3
- package/dist/src/components/organisms/extensions/recommendation/StrategyInfoBox.vue.d.ts +0 -24
- package/dist/src/extensions/Blocks/Recommendation/controls/main/strategy.d.ts +0 -29
- package/dist/src/mock/api/recommendation-strategies.d.ts +0 -43
- package/dist/static/styles/components/recommendation-strategy.css.js +0 -171
|
@@ -1,34 +1,33 @@
|
|
|
1
1
|
var ot = Object.defineProperty;
|
|
2
2
|
var st = (h, p, t) => p in h ? ot(h, p, { enumerable: !0, configurable: !0, writable: !0, value: t }) : h[p] = t;
|
|
3
3
|
var $ = (h, p, t) => st(h, typeof p != "symbol" ? p + "" : p, t);
|
|
4
|
-
import { ACADEMY_LINKS as nt } from "../../../../../enums/academy.js";
|
|
5
4
|
import { UIElementType as g, UEAttr as N, ModificationDescription as A } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
6
|
-
import { CommonControl as
|
|
7
|
-
import { ATTR_PRODUCT_IMAGE as B, ATTR_PRODUCT_NAME as
|
|
5
|
+
import { CommonControl as nt } from "../../../common-control.js";
|
|
6
|
+
import { ATTR_PRODUCT_IMAGE as B, ATTR_PRODUCT_NAME as lt, ATTR_PRODUCT_PRICE as C, ATTR_PRODUCT_OLD_PRICE as v, ATTR_PRODUCT_OMNIBUS_PRICE as at, ATTR_PRODUCT_OMNIBUS_DISCOUNT as ct, ATTR_PRODUCT_BUTTON as q, ATTR_DATA_CARD_COMPOSITION as V, ATTR_DATA_CUSTOM_ATTRIBUTES as j, ATTR_CUSTOM_PREFIX as I, SELECTOR_ATTRIBUTE_ROW as R, ATTR_DATA_ATTRIBUTE_TYPE as E, BUILT_IN_DEFAULT_ATTRIBUTES as dt } from "../../constants/selectors.js";
|
|
8
7
|
import { DEFAULT_COMPOSITION as K, DEFAULT_VISIBILITY as W } from "../../constants/defaultConfig.js";
|
|
9
8
|
import { RecommendationConfigService as _ } from "../../services/configService.js";
|
|
10
|
-
import { useRecommendationExtensionStore as
|
|
11
|
-
import { ATTRIBUTE_CELL_CLASS as
|
|
9
|
+
import { useRecommendationExtensionStore as ut } from "../../store/recommendation.js";
|
|
10
|
+
import { ATTRIBUTE_CELL_CLASS as mt, gridElementRenderer as ht, DEFAULT_CELL_PADDING as pt, buildFillerCell as gt } from "../../templates/grid/elementRenderer.js";
|
|
12
11
|
import { listElementRenderer as bt } from "../../templates/list/elementRenderer.js";
|
|
13
|
-
import { resolveInlinePriceOrder as
|
|
14
|
-
import { normalizeCompositionKeys as
|
|
15
|
-
import { getTableDisplayValue as
|
|
16
|
-
import { isPartnerManagedBlock as
|
|
17
|
-
const
|
|
12
|
+
import { resolveInlinePriceOrder as ft, toDisplayName as _t, toDisplayableAttributeValue as yt, buildElementRenderer as z } from "../../templates/utils.js";
|
|
13
|
+
import { normalizeCompositionKeys as Ct, normalizeCustomAttrValues as St, compositionKeyToProductAttr as w, resolveRowCompositionKey as At, filterToProductAttrValue as y, findAttributeRow as Tt, rewriteLegacyRowKeyHtml as G, bareAttributeName as D, isDefaultProductAttr as $t, productAttrToCompositionKey as k } from "../../utils/compositionKeys.js";
|
|
14
|
+
import { getTableDisplayValue as It } from "../../utils/tagName.js";
|
|
15
|
+
import { isPartnerManagedBlock as vt, regenerateProductRowsWithStyles as Nt, getCurrentLayout as Rt } from "../main/utils.js";
|
|
16
|
+
const Et = "ui-elements-recommendation-card-composition", U = ".product-card-wrapper > tbody", Y = ".product-info-cell > table > tbody", O = "data-visibility", X = {
|
|
18
17
|
ADD_ATTRIBUTE: "addAttribute"
|
|
19
|
-
},
|
|
18
|
+
}, b = 5, L = "reorderIcon_", Dt = '<svg width="14" height="10" viewBox="0 0 14 10" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><circle cx="2" cy="2.5" r="1.2"/><circle cx="7" cy="2.5" r="1.2"/><circle cx="12" cy="2.5" r="1.2"/><circle cx="2" cy="7.5" r="1.2"/><circle cx="7" cy="7.5" r="1.2"/><circle cx="12" cy="7.5" r="1.2"/></svg>', m = [
|
|
20
19
|
{ key: B, label: "Product Image" },
|
|
21
|
-
{ key:
|
|
20
|
+
{ key: lt, label: "Product Name" },
|
|
22
21
|
{ key: C, label: "Product Price" },
|
|
23
22
|
{ key: v, label: "Product Original Price" },
|
|
24
|
-
{ key:
|
|
25
|
-
{ key:
|
|
23
|
+
{ key: at, label: "Omnibus Price" },
|
|
24
|
+
{ key: ct, label: "Omnibus Discount" },
|
|
26
25
|
{ key: q, label: "Product Button" }
|
|
27
|
-
],
|
|
28
|
-
class
|
|
26
|
+
], Ot = new Set(m.map((h) => h.key)), T = "customAttr_", P = "deleteAttr_";
|
|
27
|
+
class Wt extends nt {
|
|
29
28
|
constructor() {
|
|
30
29
|
super(...arguments);
|
|
31
|
-
$(this, "store",
|
|
30
|
+
$(this, "store", ut());
|
|
32
31
|
$(this, "unsubscribeStore", null);
|
|
33
32
|
$(this, "eventController", null);
|
|
34
33
|
/**
|
|
@@ -38,19 +37,19 @@ class Gt extends lt {
|
|
|
38
37
|
$(this, "reorderInProgress", !1);
|
|
39
38
|
}
|
|
40
39
|
getId() {
|
|
41
|
-
return
|
|
40
|
+
return Et;
|
|
42
41
|
}
|
|
43
42
|
// ========================================================================
|
|
44
43
|
// Lifecycle
|
|
45
44
|
// ========================================================================
|
|
46
45
|
getTemplate() {
|
|
47
|
-
const t = m.map((
|
|
48
|
-
<div data-toggle-key="${
|
|
49
|
-
${this._GuToggle(`visibility_${
|
|
46
|
+
const t = m.map((d) => `
|
|
47
|
+
<div data-toggle-key="${d.key}" style="display: none;">
|
|
48
|
+
${this._GuToggle(`visibility_${d.key}`)}
|
|
50
49
|
</div>
|
|
51
50
|
`).join(""), e = Array.from(
|
|
52
|
-
{ length:
|
|
53
|
-
(
|
|
51
|
+
{ length: b },
|
|
52
|
+
(d, c) => `
|
|
54
53
|
<div data-custom-select-key="${T}${c}" style="display: none;">
|
|
55
54
|
${this._GuSelect({
|
|
56
55
|
name: `${T}${c}`,
|
|
@@ -61,9 +60,9 @@ class Gt extends lt {
|
|
|
61
60
|
})}
|
|
62
61
|
</div>
|
|
63
62
|
`
|
|
64
|
-
).join(""), r = m.length +
|
|
63
|
+
).join(""), r = m.length + b, i = Array.from(
|
|
65
64
|
{ length: r },
|
|
66
|
-
(
|
|
65
|
+
(d, c) => `
|
|
67
66
|
<div data-reorder-icon-key="${L}${c}" style="display: none;">
|
|
68
67
|
<${g.BUTTON}
|
|
69
68
|
class="drag-handle-btn flat-inline flat-white"
|
|
@@ -77,8 +76,8 @@ class Gt extends lt {
|
|
|
77
76
|
</div>
|
|
78
77
|
`
|
|
79
78
|
).join(""), o = Array.from(
|
|
80
|
-
{ length:
|
|
81
|
-
(
|
|
79
|
+
{ length: b },
|
|
80
|
+
(d, c) => `
|
|
82
81
|
<div data-custom-delete-key="${P}${c}" style="display: none;">
|
|
83
82
|
<${g.BUTTON}
|
|
84
83
|
class="custom-attr-delete flat-inline flat-white"
|
|
@@ -91,7 +90,7 @@ class Gt extends lt {
|
|
|
91
90
|
</${g.BUTTON}>
|
|
92
91
|
</div>
|
|
93
92
|
`
|
|
94
|
-
).join(""), s =
|
|
93
|
+
).join(""), s = "https://academy.insiderone.com/docs/new-editor-email-recommendation-block", n = this.api.translate(
|
|
95
94
|
"Drag and drop the card elements to reorder them, adjust their visibility or add new attributes up to 5."
|
|
96
95
|
), l = this.api.translate("For more information, you can"), a = this.api.translate("visit Academy");
|
|
97
96
|
return `
|
|
@@ -145,7 +144,7 @@ class Gt extends lt {
|
|
|
145
144
|
const t = (r = this.getContainer()) == null ? void 0 : r.querySelector("[data-card-composition-control]");
|
|
146
145
|
if (!t)
|
|
147
146
|
return;
|
|
148
|
-
const e =
|
|
147
|
+
const e = vt(this.currentNode);
|
|
149
148
|
t.style.pointerEvents = e ? "none" : "", t.style.opacity = e ? "0.5" : "";
|
|
150
149
|
}
|
|
151
150
|
onTemplateNodeUpdated(t) {
|
|
@@ -167,7 +166,7 @@ class Gt extends lt {
|
|
|
167
166
|
this._applyVisibilityToBlock(t.key, e);
|
|
168
167
|
});
|
|
169
168
|
});
|
|
170
|
-
for (let t = 0; t <
|
|
169
|
+
for (let t = 0; t < b; t++) {
|
|
171
170
|
const e = `${T}${t}`, r = t;
|
|
172
171
|
this.api.onValueChanged(e, (i) => {
|
|
173
172
|
this._onCustomAttributeChanged(r, i);
|
|
@@ -188,7 +187,7 @@ class Gt extends lt {
|
|
|
188
187
|
}
|
|
189
188
|
/** Upgrades legacy bare-name custom keys to the canonical form. (SD-147101) */
|
|
190
189
|
_normalizeComposition(t) {
|
|
191
|
-
return
|
|
190
|
+
return Ct(t, this.currentNode, this.store.filterList);
|
|
192
191
|
}
|
|
193
192
|
_readCustomAttributesFromNode() {
|
|
194
193
|
if (!this.currentNode || !("getAttribute" in this.currentNode))
|
|
@@ -196,7 +195,7 @@ class Gt extends lt {
|
|
|
196
195
|
const t = this.currentNode.getAttribute(j);
|
|
197
196
|
if (t)
|
|
198
197
|
try {
|
|
199
|
-
return
|
|
198
|
+
return St(
|
|
200
199
|
JSON.parse(t).map((e) => String(e)),
|
|
201
200
|
this.currentNode,
|
|
202
201
|
this.store.filterList
|
|
@@ -209,7 +208,7 @@ class Gt extends lt {
|
|
|
209
208
|
_readVisibilityFromRows() {
|
|
210
209
|
if (!this.currentNode)
|
|
211
210
|
return this._getDefaultVisibilities();
|
|
212
|
-
const t = Array.from(this.currentNode.querySelectorAll(
|
|
211
|
+
const t = Array.from(this.currentNode.querySelectorAll(R)), e = this._extractVisibilityFromRows(t);
|
|
213
212
|
if (Object.keys(e).length > 0)
|
|
214
213
|
return this._mergeWithDefaults(e);
|
|
215
214
|
const r = _.getConfig(this.currentNode).visibility;
|
|
@@ -223,7 +222,7 @@ class Gt extends lt {
|
|
|
223
222
|
return t.forEach((r) => {
|
|
224
223
|
if (!("getAttribute" in r))
|
|
225
224
|
return;
|
|
226
|
-
const i =
|
|
225
|
+
const i = At(r), o = r.getAttribute(O);
|
|
227
226
|
i && o !== null && (e[i] = this._parseVisibilityValue(o));
|
|
228
227
|
}), e;
|
|
229
228
|
}
|
|
@@ -257,23 +256,23 @@ class Gt extends lt {
|
|
|
257
256
|
if (!(i.dataset.inlinePrices !== String(o)) && this._tryReorderInPlace(i, t))
|
|
258
257
|
return !1;
|
|
259
258
|
i.dataset.inlinePrices = String(o);
|
|
260
|
-
const n = new Set(e), l =
|
|
261
|
-
let a = 0,
|
|
262
|
-
const c = t.map((
|
|
263
|
-
if (o && (
|
|
264
|
-
return
|
|
265
|
-
if (
|
|
266
|
-
const
|
|
267
|
-
return this._createBuiltInItemHtml(
|
|
259
|
+
const n = new Set(e), l = ft(t);
|
|
260
|
+
let a = 0, d = 0;
|
|
261
|
+
const c = t.map((u) => {
|
|
262
|
+
if (o && (u === C || u === v))
|
|
263
|
+
return u === l.anchor ? this._createPriceGroupItemHtml(d++, l.originalFirst) : "";
|
|
264
|
+
if (Ot.has(u)) {
|
|
265
|
+
const f = m.find((S) => S.key === u);
|
|
266
|
+
return this._createBuiltInItemHtml(f, d++);
|
|
268
267
|
}
|
|
269
|
-
if (
|
|
270
|
-
const
|
|
271
|
-
if (n.has(
|
|
272
|
-
return this._createCustomItemHtml(
|
|
268
|
+
if (u.startsWith(I)) {
|
|
269
|
+
const f = w(u);
|
|
270
|
+
if (n.has(f))
|
|
271
|
+
return this._createCustomItemHtml(u, a++, d++);
|
|
273
272
|
}
|
|
274
273
|
return "";
|
|
275
274
|
}).join("");
|
|
276
|
-
return this._rescueTogglesToStore(r), this._rescueSelectsToStore(r), this._rescueDeleteButtonsToStore(r), this._rescueReorderIconsToStore(r), i.innerHTML = c, this._moveTogglesIntoItems(r), this._moveSelectsIntoItems(r, e.length), this._moveDeleteButtonsIntoItems(r, e.length), this._moveReorderIconsIntoItems(r,
|
|
275
|
+
return this._rescueTogglesToStore(r), this._rescueSelectsToStore(r), this._rescueDeleteButtonsToStore(r), this._rescueReorderIconsToStore(r), i.innerHTML = c, this._moveTogglesIntoItems(r), this._moveSelectsIntoItems(r, e.length), this._moveDeleteButtonsIntoItems(r, e.length), this._moveReorderIconsIntoItems(r, d), !0;
|
|
277
276
|
}
|
|
278
277
|
/**
|
|
279
278
|
* Attempts to reorder existing orderable-item elements to match the composition order.
|
|
@@ -293,19 +292,19 @@ class Gt extends lt {
|
|
|
293
292
|
return !1;
|
|
294
293
|
const n = /* @__PURE__ */ new Map();
|
|
295
294
|
r.forEach((a) => {
|
|
296
|
-
const { key:
|
|
297
|
-
if (
|
|
298
|
-
const c = n.get(
|
|
299
|
-
c.push(a), n.set(
|
|
295
|
+
const { key: d } = a.dataset;
|
|
296
|
+
if (d) {
|
|
297
|
+
const c = n.get(d) || [];
|
|
298
|
+
c.push(a), n.set(d, c);
|
|
300
299
|
}
|
|
301
300
|
});
|
|
302
301
|
const l = /* @__PURE__ */ new Map();
|
|
303
302
|
return e.forEach((a) => {
|
|
304
|
-
const
|
|
305
|
-
if (!
|
|
303
|
+
const d = n.get(a);
|
|
304
|
+
if (!d)
|
|
306
305
|
return;
|
|
307
306
|
const c = l.get(a) || 0;
|
|
308
|
-
l.set(a, c + 1),
|
|
307
|
+
l.set(a, c + 1), d[c] && t.appendChild(d[c]);
|
|
309
308
|
}), !0;
|
|
310
309
|
}
|
|
311
310
|
_createBuiltInItemHtml(t, e) {
|
|
@@ -327,10 +326,10 @@ class Gt extends lt {
|
|
|
327
326
|
*/
|
|
328
327
|
_createPriceGroupItemHtml(t, e) {
|
|
329
328
|
var n, l;
|
|
330
|
-
const r = ((n = m.find((a) => a.key === C)) == null ? void 0 : n.label) ?? "Product Price", i = ((l = m.find((a) => a.key === v)) == null ? void 0 : l.label) ?? "Product Original Price", o = (a,
|
|
329
|
+
const r = ((n = m.find((a) => a.key === C)) == null ? void 0 : n.label) ?? "Product Price", i = ((l = m.find((a) => a.key === v)) == null ? void 0 : l.label) ?? "Product Original Price", o = (a, d) => `
|
|
331
330
|
<div class="price-suborderable-item" draggable="true" data-subkey="${a}">
|
|
332
|
-
<span class="sub-drag-handle">${
|
|
333
|
-
<span class="item-label">${this.api.translate(
|
|
331
|
+
<span class="sub-drag-handle">${Dt}</span>
|
|
332
|
+
<span class="item-label">${this.api.translate(d)}</span>
|
|
334
333
|
</div>`, s = e ? o(v, i) + o(C, r) : o(C, r) + o(v, i);
|
|
335
334
|
return `
|
|
336
335
|
<div class="orderable-item price-group-item" draggable="true"
|
|
@@ -446,7 +445,7 @@ class Gt extends lt {
|
|
|
446
445
|
* Same rescue pattern as _rescueTogglesToStore — prevents innerHTML from destroying them.
|
|
447
446
|
*/
|
|
448
447
|
_rescueSelectsToStore(t) {
|
|
449
|
-
for (let e = 0; e <
|
|
448
|
+
for (let e = 0; e < b; e++) {
|
|
450
449
|
const r = `${T}${e}`, i = t.querySelector(`[data-custom-select-key="${r}"]`), o = t.querySelector(`[data-custom-select-slot="${e}"]`);
|
|
451
450
|
if (o) {
|
|
452
451
|
const s = o.querySelector("ue-select");
|
|
@@ -472,7 +471,7 @@ class Gt extends lt {
|
|
|
472
471
|
* Same rescue pattern as _rescueSelectsToStore — prevents innerHTML from destroying them.
|
|
473
472
|
*/
|
|
474
473
|
_rescueDeleteButtonsToStore(t) {
|
|
475
|
-
for (let e = 0; e <
|
|
474
|
+
for (let e = 0; e < b; e++) {
|
|
476
475
|
const r = `${P}${e}`, i = t.querySelector(`[data-custom-delete-key="${r}"]`), o = t.querySelector(`[data-custom-delete-slot="${e}"]`);
|
|
477
476
|
if (o) {
|
|
478
477
|
const s = o.querySelector("ue-button");
|
|
@@ -498,7 +497,7 @@ class Gt extends lt {
|
|
|
498
497
|
* Same rescue pattern as _rescueDeleteButtonsToStore — prevents innerHTML from destroying them.
|
|
499
498
|
*/
|
|
500
499
|
_rescueReorderIconsToStore(t) {
|
|
501
|
-
const e = m.length +
|
|
500
|
+
const e = m.length + b;
|
|
502
501
|
for (let r = 0; r < e; r++) {
|
|
503
502
|
const i = `${L}${r}`, o = t.querySelector(`[data-reorder-icon-key="${i}"]`), s = t.querySelector(`[data-reorder-icon-slot="${r}"]`);
|
|
504
503
|
if (s) {
|
|
@@ -559,12 +558,12 @@ class Gt extends lt {
|
|
|
559
558
|
let i = null, o = null;
|
|
560
559
|
const s = (n) => n.target.closest(r.itemSelector);
|
|
561
560
|
t.addEventListener("dragstart", (n) => {
|
|
562
|
-
var
|
|
561
|
+
var d;
|
|
563
562
|
const l = n.target;
|
|
564
563
|
if (r.ignoreSelector && l.closest(r.ignoreSelector))
|
|
565
564
|
return;
|
|
566
565
|
const a = s(n);
|
|
567
|
-
a && (i = a, a.classList.add("dragging"), (
|
|
566
|
+
a && (i = a, a.classList.add("dragging"), (d = n.dataTransfer) == null || d.setData("text/plain", a.dataset.key ?? a.dataset.subkey ?? ""));
|
|
568
567
|
}, { signal: e }), t.addEventListener("dragend", () => {
|
|
569
568
|
i == null || i.classList.remove("dragging"), o == null || o.classList.remove("drag-over"), i = null, o = null;
|
|
570
569
|
}, { signal: e }), t.addEventListener("dragover", (n) => {
|
|
@@ -582,8 +581,8 @@ class Gt extends lt {
|
|
|
582
581
|
if (!i || !l || l === i)
|
|
583
582
|
return;
|
|
584
583
|
n.preventDefault();
|
|
585
|
-
const a = l.getBoundingClientRect(),
|
|
586
|
-
(c = r.getDropParent(l)) == null || c.insertBefore(i,
|
|
584
|
+
const a = l.getBoundingClientRect(), d = n.clientY < a.top + a.height / 2;
|
|
585
|
+
(c = r.getDropParent(l)) == null || c.insertBefore(i, d ? l : l.nextSibling), o == null || o.classList.remove("drag-over"), i.classList.remove("dragging"), i = null, o = null, this._onReorder(this._extractCompositionOrder(t));
|
|
587
586
|
}, { signal: e });
|
|
588
587
|
}
|
|
589
588
|
_setupDeleteHandler(t, e) {
|
|
@@ -599,7 +598,7 @@ class Gt extends lt {
|
|
|
599
598
|
// Actions (Add, Delete, Reorder)
|
|
600
599
|
// ========================================================================
|
|
601
600
|
_onAddAttribute(t, e) {
|
|
602
|
-
const r =
|
|
601
|
+
const r = k(t), i = this._readCompositionFromNode();
|
|
603
602
|
i.push(r);
|
|
604
603
|
const o = [...this._readCustomAttributesFromNode(), t];
|
|
605
604
|
this._updateBothAttributes(i, o), this._injectCustomAttributeHtml(t, e, r, i), this._renderOrderableItems(i, o), this._initializeCustomSelects(o), this._updateAddButtonState();
|
|
@@ -623,7 +622,7 @@ class Gt extends lt {
|
|
|
623
622
|
const r = this._readCustomAttributesFromNode(), i = r[t];
|
|
624
623
|
if (i === void 0 || i === e)
|
|
625
624
|
return;
|
|
626
|
-
const o =
|
|
625
|
+
const o = k(e), s = this._readCompositionFromNode(), n = this._findNthCustomKeyIndex(s, t);
|
|
627
626
|
n !== -1 && (s[n] = o), r[t] = e;
|
|
628
627
|
const l = this._getDisplayNameForAttribute(e);
|
|
629
628
|
this._updateBothAttributes(s, r), this._injectCustomAttributeHtml(e, l, o, s), this._renderOrderableItems(s, r), this._initializeCustomSelects(r);
|
|
@@ -634,7 +633,7 @@ class Gt extends lt {
|
|
|
634
633
|
try {
|
|
635
634
|
this._updateBothAttributes(t, e);
|
|
636
635
|
const r = !_.getConfig(this.currentNode).priceMovedToNextLine;
|
|
637
|
-
this._getCurrentLayout() === "grid" && !r ? this._reorderProductAttributes(t) : this.currentNode &&
|
|
636
|
+
this._getCurrentLayout() === "grid" && !r ? this._reorderProductAttributes(t) : this.currentNode && Nt({
|
|
638
637
|
currentNode: this.currentNode,
|
|
639
638
|
documentModifier: this.api.getDocumentModifier()
|
|
640
639
|
});
|
|
@@ -652,11 +651,11 @@ class Gt extends lt {
|
|
|
652
651
|
* DOM converge on the next composition change without writing on open.
|
|
653
652
|
*/
|
|
654
653
|
_getExistingRowHtml(t, e) {
|
|
655
|
-
const r =
|
|
654
|
+
const r = Tt(t, e);
|
|
656
655
|
if (r && "getOuterHTML" in r)
|
|
657
656
|
return G(r.getOuterHTML(), e);
|
|
658
657
|
const i = t.querySelector(
|
|
659
|
-
`${
|
|
658
|
+
`${R}[${E}="${e}"]`
|
|
660
659
|
);
|
|
661
660
|
return i && "getOuterHTML" in i ? G(i.getOuterHTML(), e) : "";
|
|
662
661
|
}
|
|
@@ -666,18 +665,18 @@ class Gt extends lt {
|
|
|
666
665
|
this._getCurrentLayout() === "grid" ? this._injectGridAttributeRow(t, e, r, i) : this._injectListAttributeRow(t, e, r, i);
|
|
667
666
|
}
|
|
668
667
|
_injectGridAttributeRow(t, e, r, i) {
|
|
669
|
-
const o = this.currentNode.querySelectorAll(
|
|
668
|
+
const o = this.currentNode.querySelectorAll(U);
|
|
670
669
|
if (!(o != null && o.length))
|
|
671
670
|
return;
|
|
672
|
-
const s = _.getConfig(this.currentNode), l = `0 ${Math.floor(s.columnSpacing / 2)}px`, a = this.api.getDocumentModifier(),
|
|
671
|
+
const s = _.getConfig(this.currentNode), l = `0 ${Math.floor(s.columnSpacing / 2)}px`, a = this.api.getDocumentModifier(), d = this.store.recommendationProducts.length;
|
|
673
672
|
let c = 0;
|
|
674
|
-
o.forEach((
|
|
673
|
+
o.forEach((u) => {
|
|
675
674
|
var F;
|
|
676
|
-
const
|
|
675
|
+
const f = u.querySelector(R), S = ((F = f == null ? void 0 : f.querySelectorAll(`.${mt}`)) == null ? void 0 : F.length) || 1, x = (100 / S).toFixed(2), { bgStyle: J, bgAttr: Q } = this._extractSegmentBgFromCard(u), H = d > 0 ? Math.min(S, d - c) : S, Z = i.map((M) => {
|
|
677
676
|
if (M === r) {
|
|
678
677
|
const tt = Array.from(
|
|
679
678
|
{ length: H },
|
|
680
|
-
(
|
|
679
|
+
(Lt, rt) => {
|
|
681
680
|
const it = this._resolveAttributeContent(
|
|
682
681
|
t,
|
|
683
682
|
e,
|
|
@@ -692,12 +691,12 @@ class Gt extends lt {
|
|
|
692
691
|
l
|
|
693
692
|
);
|
|
694
693
|
}
|
|
695
|
-
).join(""), et =
|
|
696
|
-
return `<tr class="recommendation-attribute-row" ${
|
|
694
|
+
).join(""), et = gt(x, l).repeat(S - H);
|
|
695
|
+
return `<tr class="recommendation-attribute-row" ${E}="${r}" ${O}="1">${tt}${et}</tr>`;
|
|
697
696
|
}
|
|
698
|
-
return this._getExistingRowHtml(
|
|
697
|
+
return this._getExistingRowHtml(u, M);
|
|
699
698
|
}).join("");
|
|
700
|
-
c += H,
|
|
699
|
+
c += H, d > 0 && c >= d && (c = 0), a.modifyHtml(u).setInnerHtml(Z);
|
|
701
700
|
}), a.apply(new A(`${this.api.translate("Add custom attribute")}: ${e}`));
|
|
702
701
|
}
|
|
703
702
|
_injectListAttributeRow(t, e, r, i) {
|
|
@@ -706,14 +705,14 @@ class Gt extends lt {
|
|
|
706
705
|
return;
|
|
707
706
|
const s = i.filter((l) => l !== B && l !== q), n = this.api.getDocumentModifier();
|
|
708
707
|
o.forEach((l, a) => {
|
|
709
|
-
const
|
|
708
|
+
const d = s.map((c) => {
|
|
710
709
|
if (c === r) {
|
|
711
|
-
const
|
|
712
|
-
return this._getListRowHtml(t,
|
|
710
|
+
const u = this._resolveAttributeContent(t, e, a);
|
|
711
|
+
return this._getListRowHtml(t, u, r);
|
|
713
712
|
}
|
|
714
713
|
return this._getExistingRowHtml(l, c);
|
|
715
714
|
}).join("");
|
|
716
|
-
n.modifyHtml(l).setInnerHtml(
|
|
715
|
+
n.modifyHtml(l).setInnerHtml(d);
|
|
717
716
|
}), n.apply(new A(`${this.api.translate("Add custom attribute")}: ${e}`));
|
|
718
717
|
}
|
|
719
718
|
/**
|
|
@@ -725,7 +724,7 @@ class Gt extends lt {
|
|
|
725
724
|
return;
|
|
726
725
|
const e = this._getCurrentLayout(), r = this.api.getDocumentModifier();
|
|
727
726
|
if (e === "grid") {
|
|
728
|
-
const i = this.currentNode.querySelectorAll(
|
|
727
|
+
const i = this.currentNode.querySelectorAll(U);
|
|
729
728
|
i == null || i.forEach((o) => {
|
|
730
729
|
const s = this._buildCompositionHtml(o, t);
|
|
731
730
|
r.modifyHtml(o).setInnerHtml(s);
|
|
@@ -765,7 +764,7 @@ class Gt extends lt {
|
|
|
765
764
|
_reorderProductAttributes(t) {
|
|
766
765
|
if (!this.currentNode)
|
|
767
766
|
return;
|
|
768
|
-
const e = this.currentNode.querySelectorAll(
|
|
767
|
+
const e = this.currentNode.querySelectorAll(U);
|
|
769
768
|
if (!(e != null && e.length))
|
|
770
769
|
return;
|
|
771
770
|
const r = this.api.getDocumentModifier();
|
|
@@ -787,12 +786,12 @@ class Gt extends lt {
|
|
|
787
786
|
_applyVisibilityToBlock(t, e) {
|
|
788
787
|
if (!this.currentNode)
|
|
789
788
|
return;
|
|
790
|
-
const r = this.currentNode.querySelectorAll(`${
|
|
789
|
+
const r = this.currentNode.querySelectorAll(`${R}[${E}="${t}"]`);
|
|
791
790
|
if (!(r != null && r.length))
|
|
792
791
|
return;
|
|
793
792
|
const i = e ? "1" : "0", o = e ? this.api.translate("visible") : this.api.translate("hidden"), s = `${this.api.translate("Set visibility")}: ${t} → ${o}`, n = this.api.getDocumentModifier();
|
|
794
793
|
r.forEach((a) => {
|
|
795
|
-
const
|
|
794
|
+
const d = It(a), c = e ? d : "none";
|
|
796
795
|
n.modifyHtml(a).setStyle("display", c).setAttribute(O, i);
|
|
797
796
|
});
|
|
798
797
|
const l = {
|
|
@@ -872,7 +871,7 @@ class Gt extends lt {
|
|
|
872
871
|
* or when all available filters have already been added (no unused attributes left).
|
|
873
872
|
*/
|
|
874
873
|
_updateAddButtonState() {
|
|
875
|
-
const t = this._readCustomAttributesFromNode(), e = t.length >=
|
|
874
|
+
const t = this._readCustomAttributesFromNode(), e = t.length >= b, r = new Set(t), i = this._getAddableFilters(), o = i.length > 0 && i.every((s) => r.has(y(s)));
|
|
876
875
|
this.api.setUIEAttribute(
|
|
877
876
|
X.ADD_ATTRIBUTE,
|
|
878
877
|
N.BUTTON.disabled,
|
|
@@ -916,7 +915,7 @@ class Gt extends lt {
|
|
|
916
915
|
*/
|
|
917
916
|
_getDisplayNameForAttribute(t) {
|
|
918
917
|
const e = Object.values(this.store.filterList).find((r) => y(r) === t);
|
|
919
|
-
return e ? e.displayName :
|
|
918
|
+
return e ? e.displayName : _t(D(t));
|
|
920
919
|
}
|
|
921
920
|
/**
|
|
922
921
|
* Resolves the display content for a custom attribute cell.
|
|
@@ -924,17 +923,17 @@ class Gt extends lt {
|
|
|
924
923
|
*/
|
|
925
924
|
_resolveAttributeContent(t, e, r) {
|
|
926
925
|
var l;
|
|
927
|
-
const o = this.store.recommendationProducts[r], s = D(t), n =
|
|
928
|
-
return
|
|
926
|
+
const o = this.store.recommendationProducts[r], s = D(t), n = $t(t) ? o == null ? void 0 : o[s] : (l = o == null ? void 0 : o.product_attributes) == null ? void 0 : l[s];
|
|
927
|
+
return yt(n) ?? e;
|
|
929
928
|
}
|
|
930
929
|
_getGridCellHtml(t, e, r, i = "", o = "", s = "") {
|
|
931
|
-
const n =
|
|
930
|
+
const n = k(t), l = D(t), a = z(ht, [n], this.store.filterList), d = {
|
|
932
931
|
[l]: e,
|
|
933
932
|
product_attributes: { [l]: e }
|
|
934
933
|
};
|
|
935
|
-
let c = a[n](
|
|
934
|
+
let c = a[n](d);
|
|
936
935
|
return c = c.replace("<td", `<td width="${r}%"`), s && (c = c.replace(
|
|
937
|
-
`padding: ${
|
|
936
|
+
`padding: ${pt}`,
|
|
938
937
|
`padding: ${s}`
|
|
939
938
|
)), i && (c = c.replace(/style="table-layout: fixed;"/, `style="table-layout: fixed; ${i}"`)), o && (c = c.replace(/border="0"/, `border="0" bgcolor="${o}"`)), c;
|
|
940
939
|
}
|
|
@@ -943,10 +942,10 @@ class Gt extends lt {
|
|
|
943
942
|
[i]: e,
|
|
944
943
|
product_attributes: { [i]: e }
|
|
945
944
|
}, l = o[r](s).replace(/<tr>/, "").replace(/<\/tr>/, "");
|
|
946
|
-
return `<tr class="recommendation-attribute-row" ${
|
|
945
|
+
return `<tr class="recommendation-attribute-row" ${E}="${r}" ${O}="1">${l}</tr>`;
|
|
947
946
|
}
|
|
948
947
|
}
|
|
949
948
|
export {
|
|
950
|
-
|
|
951
|
-
|
|
949
|
+
Et as COMPOSITION_CONTROL_BLOCK_ID,
|
|
950
|
+
Wt as RecommendationCardCompositionControl
|
|
952
951
|
};
|